Skip to content

G
gs1
Commit 1f8ce75f by Lyan
Options

首页样式调试修改

parent f7dd0be5
Showing with 117 additions and 40 deletions
src/views/Home/index.vue
......@@ -23,9 +23,9 @@
</div>
</div>
</div>
<!-- <div class="d-none d-lg-block banner-tp">-->
<!-- <img :src="el.picIndexPath" alt="" class="container"/>-->
<!-- </div>-->
<!-- <div class="d-none d-lg-block banner-tp">
<img :src="el.picIndexPath" alt="" class="container"/>
</div> -->
<div class="banner-bg">
<img :src="el.picIndexPath" alt="" />
</div>
......@@ -235,6 +235,11 @@
<span>产品信息</span>
</button>
</li>
<li class="nav-item col-lg-2" role="presentation">
<button class="nav-link" href="#external-tab" data-toggle="pill">
<span>境外条码查询</span>
</button>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="home-tab">
......@@ -302,6 +307,31 @@
</div>
</div>
</div>
<div class="tab-pane fade" id="external-tab">
<div class="chaxun">
<div class="chaxun-kj">
<div class="row">
<div class="col-lg-9 chaxun-middle">
<el-input
placeholder="请输入正确的境外商品条码"
v-model="chaxun2.keywords"
clearable
>
</el-input>
</div>
<div class="col-lg-3 chaxun-right">
<button
@click="
tojwSearch(chaxun2.keywords)
"
>
境外条码查询
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -380,7 +410,7 @@
</div>
</div>
</div>
</div> -->
</div>
<!-- 商品全球身份证 -->
<div class="spqqsfz">
<div class="container">
......@@ -425,6 +455,7 @@
</button>
</div>
</div>
<div class="row"></div>
</div>
</div>
</div>
......@@ -693,6 +724,9 @@ export default {
options2: [],
keywords: "",
},
chaxun2:{
keywords: "",
},
whbsxtcy: [
{
ico: require("../../assets/image/home/wbsxtcy-ico1.png"),
......@@ -1099,6 +1133,14 @@ export default {
},
});
},
tojwSearch(keyword) {
this.$router.push({
path: "/search/external",
query: {
keyword,
},
});
},
getCustomService() {
let service = localStorage.getItem("gs-custom-service") || "";
// console.log("getCustomService-----------", service);
......@@ -1552,31 +1594,49 @@ export default {
.banner {
.slick-arrow {
margin: 0 10px;
// margin: 0 10px;
width: 48px;
height: 48px;
border-radius: 50%;
background: #fff;
&:hover{
border: 1.5px solid #0E2C6B;
box-shadow: 0px 3px 6px 0px rgba(14,44,107,0.21);
}
&.slick-prev {
justify-content: center;
top: auto;
bottom: 25px;
bottom: 31px;
transform: translate(0, 0);
// left: 76%!important;
left: auto!important;
right: 22%!important;
&::before {
width: 10px;
height: 18px;
background: url("../../assets/image/home/prevArrow-hover.png")
width: 24px;
height: 24px;
background: url("../../assets/image/home/prevArrow-hover1.png")
no-repeat;
background-size: 100% 100%;
}
}
&.slick-next {
justify-content: center;
top: auto;
bottom: 25px;
transform: translate(0, 0);
right: 17.1%!important;
@media screen and (max-width: 1200px) {
right: 15%!important;
}
@media screen and (max-width: 920px) {
right: 10%!important;
}
&::before {
width: 10px;
height: 18px;
background: url("../../assets/image/home/nextArrow-hover.png")
width: 24px;
height: 24px;
background: url("../../assets/image/home/nextArrow-hover1.png")
no-repeat;
background-size: 100% 100%;
}
......@@ -1584,6 +1644,7 @@ export default {
}
.slick-dots {
display: none !important;
bottom: 25px !important;
display: flex;
align-items: center;
......@@ -1655,22 +1716,31 @@ export default {
}
.newsBannerB {
background: linear-gradient(180deg, rgba(0, 0, 0, 0.01) 0%, #000000 100%);
// background: linear-gradient(180deg, rgba(0, 0, 0, 0.01) 0%, #000000 100%);
background: linear-gradient(180deg, rgba(0,0,0,0.01) 0%, #000000 100%);
}
}
.smallPCImages {
.slick-arrow {
width: 24px;
height: 50px;
width: 28px;
height: 28px;
margin: 0 10px;
background: #fff;
border-radius: 50%;
justify-content: center;
&:hover{
border: 1.5px solid #0E2C6B;
box-shadow: 0px 3px 6px 0px rgba(14,44,107,0.21);
}
&.slick-prev {
// position: relative;
&::before {
width: 24px;
height: 50px;
background: url("../../assets/image/home/prevArrow-hover2.png")
width: 16px;
height: 16px;
background: url("../../assets/image/home/prevArrow-hover1.png")
no-repeat;
background-size: 100% 100%;
}
......@@ -1679,9 +1749,9 @@ export default {
&.slick-next {
// position: relative;
&::before {
width: 24px;
height: 50px;
background: url("../../assets/image/home/nextArrow-hover2.png")
width: 16px;
height: 16px;
background: url("../../assets/image/home/nextArrow-hover1.png")
no-repeat;
background-size: 100% 100%;
}
......@@ -1747,11 +1817,11 @@ export default {
.slick-arrow {
&.slick-prev {
left: 38%;
left: 22%;
}
&.slick-next {
right: 38%;
right: 17.1%;
}
}
}
......@@ -1860,7 +1930,7 @@ export default {
<style lang="scss" scoped>
.home {
.banner {
height: 420px;
height: 360px;
position: relative;
// background: #f26335;
.banner-item {
......@@ -2411,7 +2481,7 @@ export default {
flex-wrap: wrap;
color: #ffffff;
font-size: 18px;
margin-bottom: 30px;
margin-bottom: 20px;
@media screen and (max-width: 765px) {
margin-bottom: 15px;
}
......@@ -2434,7 +2504,7 @@ export default {
}
> * {
height: 300px;
height: 240px;
@media screen and (max-width: 992px) {
height: 240px;
}
......@@ -2457,7 +2527,7 @@ export default {
position: relative;
background: url("../../assets/image/home/spqqsfz-bj2.png") no-repeat;
background-size: 100% 100%;
padding: 30px 0 38px;
.right-cont {
position: absolute;
left: 0;
......@@ -2466,7 +2536,7 @@ export default {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-around;
justify-content: space-evenly;
.row {
color: #ffffff;
......@@ -2546,6 +2616,11 @@ export default {
border: 1px solid rgba(197, 216, 238, 0.5000);
margin-top: 30px;
border-radius: 8px;
&:hover{
transform: translateY(-4px);
box-shadow: 0 10px 30px 0 rgba(165, 165, 167, 0.6);
cursor: pointer;
}
.top-p{
display: flex;
justify-content: space-between;
......@@ -2589,10 +2664,7 @@ export default {
margin: 0 20px 0 20px;
}
}
&:hover{
box-shadow: 0px 4px 15px 2px rgba(4, 64, 141, 0.14);
cursor: pointer;
}
}
......@@ -2612,7 +2684,7 @@ export default {
}
img{
height: 166px;
height: 130px;
}
.home-bottom-cont {
......@@ -2639,7 +2711,7 @@ export default {
}
.smallPCImages {
margin: 40px 0;
margin: 20px 0 30px;
.smallPCImages-item {
img {
......
src/views/News/msg.vue
......@@ -39,7 +39,7 @@
<div class="xglj">
<div class="container">
<div class="cate">
<span>相关连接</span>
<span>相关链接</span>
<!-- <span>更多>></span> -->
</div>
<list :list="xgljListArr" @getInfo="getInfo" />
......
src/views/News/msgVideo.vue
......@@ -48,7 +48,7 @@
<div class="xglj">
<div class="container">
<div class="cate">
<span>相关连接</span>
<span>相关链接</span>
<!-- <span>更多>></span> -->
</div>
<list :list="xgljListArr" @getInfo="getInfo" />
......
src/views/Search/external.vue
......@@ -96,6 +96,11 @@ export default {
file: '',
};
},
created() {
if (this.$route.query.keyword) {
this.search.code=this.$route.query.keyword
}
},
computed: {
...mapState(["urls"]),
},
......
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