Skip to content

G
gs1
Commit f7dd0be5 by Lyan
Options

首页更改

parent 97665b92
Showing with 248 additions and 75 deletions
src/views/Djwh/index.vue
...@@ -450,6 +450,17 @@ html{ ...@@ -450,6 +450,17 @@ html{
padding:0px; padding:0px;
height: auto!important; height: auto!important;
margin: 0; margin: 0;
// width: 100%!important;
.middle-list{
ul,li{
display: inline-block;
width: 100%!important;
a{
width: 93%!important;
}
}
}
} }
......
src/views/Home/index.vue
...@@ -42,95 +42,78 @@ ...@@ -42,95 +42,78 @@
</template> </template>
</VueSlickCarousel> </VueSlickCarousel>
</div> </div>
<!-- 要闻、中心、地方、国际 --> <!-- 首页图标 -->
<div class="bgWhite ywzxdfgj"> <div class="home-top ">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-lg-6"> <div class="col">
<div class="newsBanner"> <div class="home-top-cont">
<VueSlickCarousel <div class="main-top">
v-bind="newsBannerSettingsA" <div class="djwh-tp">
v-if="newsBanner.length > 0" <a href="http://wsdt.gs1cn.org/anccoh/login.jsp" target="blank"
ref="newsBannerA" ><img
:asNavFor="$refs.newsBannerA" src="../../assets/image/home/top1.png"
> alt=""
<div />
class="newsBanner-item" <div class="top-p"><span>网上业务大厅</span><i></i></div>
v-for="el in newsBanner"
:key="el.id" </a>
>
<a :href="el.jumppath" target="_blank"
><img :src="el.picFile" alt="..." class="newsBanner-tp"
/></a>
</div> </div>
</VueSlickCarousel> </div>
<VueSlickCarousel <div class="main-top">
v-bind="newsBannerSettingsB" <div class="djwh-tp">
ref="newsBannerB" <a href="https://www.gds.org.cn/" target="blank"
class="newsBannerB" ><img
:asNavFor="$refs.newsBannerA" src="../../assets/image/home/top2.png"
v-if="newsBanner.length > 0" alt=""
> />
<div <div class="top-p"><span>中国商品信息服务平台</span><i></i></div>
class="newsBanner-item" </a>
v-for="el in newsBanner" </div>
:key="el.id" </div>
> <div class="main-top">
<div class="newsBanner-title" :title="el.title"> <div class="djwh-tp">
<a :href="el.jumppath" target="_blank">{{ el.title }}</a> <a href="/search/tool" target="blank"
</div> ><img
src="../../assets/image/home/top3.png"
alt=""
/>
<div class="top-p"><span>条码查询</span><i></i></div></a>
</div>
</div>
<div class="main-top">
<div class="djwh-tp">
<a href="/Business/Faq?type=qbwt" target="blank"
><img
src="../../assets/image/home/top4.png"
alt=""
/>
<div class="top-p"><span>常见问题</span><i></i></div></a>
</div> </div>
<template #prevArrow>
<div class="custom-arrow"></div>
</template>
<template #nextArrow>
<div class="custom-arrow"></div>
</template>
</VueSlickCarousel>
</div>
</div>
<div class="col-lg-6">
<ul class="nav nav-tabs tabs1" id="myTab" role="tablist">
<li
class="nav-item"
role="presentation"
v-for="(tmp, i) in news"
:key="i"
@click="handelNewsTab(i)"
>
<button
:class="['nav-link', { active: i === 0 }]"
data-toggle="pill"
:href="`#${tmp.type}-tab`"
>
<span>{{ tmp.name }}</span>
</button>
</li>
</ul>
<div class="tab-content marginTop15">
<div class="tab-pane fade show active">
<list :list="news[0].data" />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- 业务大厅、定制服务 --> <!-- 业务大厅、定制服务 -->
<div class="container"> <div style="margin-bottom:30px">
<div class="container">
<div class="row"> <div class="row">
<div class="col-lg-6"> <div class="col-lg-6">
<div class="ywdt"> <div class="ywdt">
<div class="cate">业务大厅</div> <div class="cate">业务大厅</div>
<div class="row"> <div class="row">
<div class="col-lg-6 wbsxtcy bgWhite"> <div class="col-lg-6 wbsxtcy bgWhite">
<div class="ywdt-cate ywdt-cate-bj1"> <div class="ywdt-cate ywdt-cate-bj1" style="cursor:pointer;" @click="gonoMember">
<span>我还不是系统成员</span> <span>我还不是系统成员</span>
<span>（企业初次申请）</span> <span>（企业初次申请）</span>
</div> </div>
<button class="wbsxtcy-btn" @click="wysqsptmHandelClick"> <!-- <button class="wbsxtcy-btn" @click="wysqsptmHandelClick">
我要申请商品条码 我要申请商品条码
</button> </button> -->
<div class="row ywdt-kj whbsxtcy-row"> <div class="row ywdt-kj whbsxtcy-row">
<div <div
class="col-6" class="col-6"
...@@ -146,7 +129,7 @@ ...@@ -146,7 +129,7 @@
</div> </div>
</div> </div>
<div class="col-lg-6 wsxtcy bgWhite"> <div class="col-lg-6 wsxtcy bgWhite">
<div class="ywdt-cate ywdt-cate-bj2"> <div class="ywdt-cate ywdt-cate-bj2" style="cursor:pointer;" @click="goMember">
<span>我是系统成员</span> <span>我是系统成员</span>
<span style="width: 148px">（成员专区）</span> <span style="width: 148px">（成员专区）</span>
</div> </div>
...@@ -323,6 +306,81 @@ ...@@ -323,6 +306,81 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- 要闻、中心、地方、国际 -->
<div class="bgWhite ywzxdfgj">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="newsBanner">
<VueSlickCarousel
v-bind="newsBannerSettingsA"
v-if="newsBanner.length > 0"
ref="newsBannerA"
:asNavFor="$refs.newsBannerA"
>
<div
class="newsBanner-item"
v-for="el in newsBanner"
:key="el.id"
>
<a :href="el.jumppath" target="_blank"
><img :src="el.picFile" alt="..." class="newsBanner-tp"
/></a>
</div>
</VueSlickCarousel>
<VueSlickCarousel
v-bind="newsBannerSettingsB"
ref="newsBannerB"
class="newsBannerB"
:asNavFor="$refs.newsBannerA"
v-if="newsBanner.length > 0"
>
<div
class="newsBanner-item"
v-for="el in newsBanner"
:key="el.id"
>
<div class="newsBanner-title" :title="el.title">
<a :href="el.jumppath" target="_blank">{{ el.title }}</a>
</div>
</div>
<template #prevArrow>
<div class="custom-arrow"></div>
</template>
<template #nextArrow>
<div class="custom-arrow"></div>
</template>
</VueSlickCarousel>
</div>
</div>
<div class="col-lg-6">
<ul class="nav nav-tabs tabs1" id="myTab" role="tablist">
<li
class="nav-item"
role="presentation"
v-for="(tmp, i) in news"
:key="i"
@click="handelNewsTab(i)"
>
<button
:class="['nav-link', { active: i === 0 }]"
data-toggle="pill"
:href="`#${tmp.type}-tab`"
>
<span>{{ tmp.name }}</span>
</button>
</li>
</ul>
<div class="tab-content marginTop15">
<div class="tab-pane fade show active">
<list :list="news[0].data" />
</div>
</div>
</div>
</div>
</div>
</div> -->
<!-- 商品全球身份证 --> <!-- 商品全球身份证 -->
<div class="spqqsfz"> <div class="spqqsfz">
<div class="container"> <div class="container">
...@@ -647,6 +705,16 @@ export default { ...@@ -647,6 +705,16 @@ export default {
url: "/Business/Guide1", url: "/Business/Guide1",
}, },
{ {
ico: require("../../assets/image/home/jg.png"),
name: "分支机构",
url: "/Org/Branch",
},
{
ico: require("../../assets/image/home/xz.png"),
name: "表格下载",
url: "/statute/FormDownload",
},
{
ico: require("../../assets/image/home/wbsxtcy-ico3.png"), ico: require("../../assets/image/home/wbsxtcy-ico3.png"),
name: "注册公告", name: "注册公告",
url: "/Business/Notice", url: "/Business/Notice",
...@@ -1273,6 +1341,7 @@ export default { ...@@ -1273,6 +1341,7 @@ export default {
ztjjReceive(msg) { ztjjReceive(msg) {
window.open(msg.directpath, "_blank"); window.open(msg.directpath, "_blank");
}, },
// 首页小轮播图 // 首页小轮播图
async homeSmallImages() { async homeSmallImages() {
const homeSmallImagesRes = await this.$api.home.homeSmallImages(); const homeSmallImagesRes = await this.$api.home.homeSmallImages();
...@@ -1304,6 +1373,9 @@ export default { ...@@ -1304,6 +1373,9 @@ export default {
// path: "/Business/Register", // path: "/Business/Register",
// }); // });
}, },
gonoMember(){
window.open("http://wsdt.gs1cn.org/anccoh/login.jsp", "_blank");
},
// 我还不是系统成员点击事件 // 我还不是系统成员点击事件
whbsxtcyHandelClick(i) { whbsxtcyHandelClick(i) {
console.log(i, "我还不是系统成员点击事件"); console.log(i, "我还不是系统成员点击事件");
...@@ -1317,6 +1389,12 @@ export default { ...@@ -1317,6 +1389,12 @@ export default {
// query: this.whbsxtcy[i].query, // query: this.whbsxtcy[i].query,
// }); // });
}, },
goMember(){
let routeData = this.$router.resolve({
path: '/Member',
});
window.open(routeData.href, "_blank");
},
// 我是系统成员点击事件 // 我是系统成员点击事件
wsxtcyHandelClick(i) { wsxtcyHandelClick(i) {
console.log(i, "我是系统成员点击事件"); console.log(i, "我是系统成员点击事件");
...@@ -1701,13 +1779,13 @@ export default { ...@@ -1701,13 +1779,13 @@ export default {
} }
} }
} }
.home-bottom-cont { .home-bottom-cont, .home-top-cont{
> div { > div {
width: 24.4%; width: 24.4%;
} }
} }
.spqqsfz { .spqqsfz {
margin-top: 30px; // margin-top: 30px;
.spqqsfz-cont-left { .spqqsfz-cont-left {
.spqqsfz-cont-left-tp { .spqqsfz-cont-left-tp {
...@@ -1741,6 +1819,9 @@ export default { ...@@ -1741,6 +1819,9 @@ export default {
} }
} }
} }
.tabs1{
margin-top: 20px;
}
.cate { .cate {
margin: 20px 0; margin: 20px 0;
} }
...@@ -1753,13 +1834,13 @@ export default { ...@@ -1753,13 +1834,13 @@ export default {
width: 120px; width: 120px;
} }
.spqqsfz { .spqqsfz {
margin-top: 20px; // margin-top: 20px;
.spqqsfz-cont-right { .spqqsfz-cont-right {
background: #e25020 !important; background: #e25020 !important;
} }
} }
.home-bottom-cont { .home-bottom-cont,.home-top-cont {
> div { > div {
width: 100%; width: 100%;
} }
...@@ -2184,11 +2265,11 @@ export default { ...@@ -2184,11 +2265,11 @@ export default {
.whbsxtcy-row { .whbsxtcy-row {
> div { > div {
height: 128px; height: 106px;
} }
.ywdt-tp { .ywdt-tp {
height: 84px; height: 60px;
display: flex; display: flex;
align-items: center; align-items: center;
} }
...@@ -2434,7 +2515,88 @@ export default { ...@@ -2434,7 +2515,88 @@ export default {
} }
} }
} }
.home-top {
background: #fff;
padding-bottom: 30px;
.home-top-cate {
color: #0e2c6b;
font-size: 18px;
padding: 15px 0 15px 20px;
// font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
// img{
// height: 166px;
// }
.home-top-cont {
margin: 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
height: auto;
.main-top {
// background:url("../../assets/image/home/topbg.png") no-repeat;
// background-size: 100%;
border: 1px solid rgba(197, 216, 238, 0.5000);
margin-top: 30px;
border-radius: 8px;
.top-p{
display: flex;
justify-content: space-between;
color: #0E2C6B;
font-size: 18px;
height: 52px;
line-height: 52px;
text-stroke: 1px #0E2C6B;
padding-left: 32px;
padding-right: 21px;
margin: 0;
align-items: center;
span{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
};
i{
display: inline-block;
width: 20px;
height: 18px;
background: url("../../assets/image/home/topright.png") no-repeat;
background-size: 100% 100%;
margin-top: 3px;
}
}
a:hover{
text-decoration: none;
}
}
}
.djwh-tp {
border-radius: 8px;
img {
width: 100%;
@media screen and (max-width: 765px) {
width: calc(100% - 40px);
display: block;
margin: 0 20px 0 20px;
}
}
&:hover{
box-shadow: 0px 4px 15px 2px rgba(4, 64, 141, 0.14);
cursor: pointer;
}
}
}
.home-bottom { .home-bottom {
// padding: 40px 0; // padding: 40px 0;
.home-bottom-cate { .home-bottom-cate {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment