@ -0,0 +1,219 @@ |
||||
<template> |
||||
<view class="help"> |
||||
<view class="helpContent"> |
||||
<view class="helpTitle">帮助中心</view> |
||||
<view class="helpItem" v-for="(item,index) in itemList" :key="index"> |
||||
<view class="helpMain"> |
||||
<u-icon name="arrow-left" class="zhishi" color="#dfdbdb" size="28"></u-icon> |
||||
<image :src="item.icon" class="titleIcon" mode="widthFix"></image> |
||||
<view class="mainText"> |
||||
<text>{{item.title}}</text> |
||||
<u-icon name="arrow-right" v-if="item.title!=''" color="#8B8B8B" size="22"></u-icon> |
||||
</view> |
||||
</view> |
||||
<view class="mainItem"> |
||||
<view class="itemText" v-for="(p,i) in item.children" :key="i">{{p}}</view> |
||||
<!-- <view class="itemText">如何申请换货</view> |
||||
<view class="itemText">退换货地址如何查看1111111</view> |
||||
<view class="itemText">退换货地址如何查看45643567543567</view> --> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="footer"> |
||||
<view class="btn"> |
||||
<image src="/static/news1/n7.png" mode="widthFix"></image> |
||||
<text>在线客服(9:00-22:00)</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
itemList: [ |
||||
{ |
||||
title:'物流问题', |
||||
icon:'/static/news1/n1.png', |
||||
children:['发货失效','发货时间','催促物流','修改收货地址'] |
||||
}, |
||||
{ |
||||
title:'', |
||||
icon:'', |
||||
children:['延迟发货','物流状态不更新','商品验货与签收','配送快递'] |
||||
}, |
||||
{ |
||||
title:'售后问题', |
||||
icon:'/static/news1/n2.png', |
||||
children:['如何申请退货','如何申请换货','退换货运费政策','退换货何时退款'] |
||||
}, |
||||
{ |
||||
title:'', |
||||
icon:'', |
||||
children:['退换货政策','极速售后服务','维修政策','退换货地址如何查看'] |
||||
}, |
||||
{ |
||||
title:'订单问题', |
||||
icon:'/static/news1/n3.png', |
||||
children:['修改订单','取消订单','价格保护','发票服务'] |
||||
}, |
||||
{ |
||||
title:'', |
||||
icon:'', |
||||
children:['商城理的商品1234567','商城实物与图片3456768','违规订单处理123456','话费充值说明'] |
||||
}, |
||||
{ |
||||
title:'活动问题', |
||||
icon:'/static/news1/n4.png', |
||||
children:['余额','秒杀说明','预售说明','积分规则'] |
||||
}, |
||||
{ |
||||
title:'', |
||||
icon:'', |
||||
children:['红包说明','plus会员','分销员','团购说明'] |
||||
}, |
||||
{ |
||||
title:'风控规则', |
||||
icon:'/static/news1/n5.png', |
||||
children:['风控规则','','',''] |
||||
}, |
||||
{ |
||||
title:'服务政策', |
||||
icon:'/static/news1/n6.png', |
||||
children:['隐私政策','商务合作','会员协议','分销协议'] |
||||
}, |
||||
{ |
||||
title:'', |
||||
icon:'', |
||||
children:['常见问题','','退换货细则','争议处理判定标准'] |
||||
}, |
||||
], |
||||
|
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height:100%; |
||||
padding-bottom: 120upx; |
||||
} |
||||
.help{ |
||||
|
||||
height: 100%; |
||||
|
||||
.helpContent{ |
||||
margin: 20upx; |
||||
background: #fff; |
||||
border-radius: 20upx; |
||||
overflow: hidden; |
||||
padding:20upx; |
||||
.helpTitle{ |
||||
font-size: 32upx; |
||||
color:#000000; |
||||
padding: 20upx 0; |
||||
// border-bottom: 3upx solid #dfdbdb; |
||||
} |
||||
.helpItem{ |
||||
display: flex; |
||||
color: #333333; |
||||
font-size: 28upx; |
||||
border-top:1px solid #dfdbdb; |
||||
|
||||
.helpMain{ |
||||
width: 180upx; |
||||
height:180upx; |
||||
border-right:1px solid #dfdbdb; |
||||
flex-shrink:0; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
flex-direction: column; |
||||
position: relative; |
||||
|
||||
.titleIcon{ |
||||
width: 50upx; |
||||
height:auto; |
||||
} |
||||
.mainText{ |
||||
margin-top:8upx; |
||||
text{ |
||||
color: #333333; |
||||
font-size: 28upx; |
||||
margin-left:5upx; |
||||
} |
||||
} |
||||
.zhishi{ |
||||
position: absolute; |
||||
right: -5px; |
||||
background: #fff; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
|
||||
} |
||||
} |
||||
.mainItem{ |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
align-items: center; |
||||
width: calc(100% - 90px); |
||||
.itemText{ |
||||
width: 50%; |
||||
white-space: nowrap; |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
text-align: center; |
||||
// padding: 24upx 16upx; |
||||
height: 90upx; |
||||
line-height: 90upx; |
||||
padding:0 10upx; |
||||
} |
||||
:nth-child(2n){ |
||||
// border-bottom:1px solid #dfdbdb; |
||||
border-left:1px solid #dfdbdb; |
||||
// border-right:1px solid #dfdbdb; |
||||
} |
||||
:last-child{ |
||||
border-top:1px solid #dfdbdb; |
||||
// border-left:1px solid #dfdbdb; |
||||
} |
||||
:nth-child(3){ |
||||
border-top:1px solid #dfdbdb; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.footer{ |
||||
position: fixed; |
||||
z-index:9; |
||||
bottom:0; |
||||
width: 100%; |
||||
background-color: #fff; |
||||
.btn{ |
||||
height: 100upx; |
||||
margin:10upx 30upx; |
||||
background: #FE6048; |
||||
border-radius: 28px 28px 28px 28px; |
||||
opacity: 1; |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
justify-content: center; |
||||
image{ |
||||
width:54upx; |
||||
height:auto; |
||||
} |
||||
text{ |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 600; |
||||
color: #FFFFFF; |
||||
margin-left:100upx; |
||||
|
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,172 @@ |
||||
<template> |
||||
<view class="jinqun"> |
||||
<view class="flag"> |
||||
<view class="flagContent"> |
||||
<image src="/static/news1/j1.png" mode="widthFix"></image> |
||||
<text>京选电器</text> |
||||
</view> |
||||
</view> |
||||
<view class="topicText"> |
||||
进群立领120元 |
||||
</view> |
||||
<view class="subTopicText"> |
||||
京东电器官方福利群 |
||||
</view> |
||||
<view class="qcode"> |
||||
|
||||
</view> |
||||
<view class="submitBtn"> |
||||
立即进群> |
||||
</view> |
||||
<view class="fuli"> |
||||
<view class="fuliTitle"> |
||||
福利攻略 |
||||
</view> |
||||
<view class="fuliContent"> |
||||
<view class="fuliItem"> |
||||
<image src="/static/news1/j2.png" mode="heightFix"></image> |
||||
<text>天天抢红包</text> |
||||
</view> |
||||
<view class="fuliItem"> |
||||
<image src="/static/news1/j3.png" mode="heightFix"></image> |
||||
<text>周二特价</text> |
||||
</view> |
||||
<view class="fuliItem"> |
||||
<image src="/static/news1/j4.png" mode="heightFix"></image> |
||||
<text>品质抢团</text> |
||||
</view> |
||||
</view> |
||||
|
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
|
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
min-height:100%; |
||||
background: url(/static/news1/jbg.png); |
||||
background-repeat: no-repeat; |
||||
background-size: cover; |
||||
width: 100%; |
||||
padding-bottom: 100upx; |
||||
} |
||||
.jinqun{ |
||||
height:100%; |
||||
position: relative; |
||||
.flag{ |
||||
position: absolute; |
||||
top:0; |
||||
left:0; |
||||
.flagContent{ |
||||
position: relative; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
image{ |
||||
width: 96px; |
||||
height:auto; |
||||
} |
||||
text{ |
||||
position: absolute; |
||||
font-size: 32upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #E92214; |
||||
} |
||||
} |
||||
} |
||||
.topicText{ |
||||
font-size: 80upx; |
||||
font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
||||
font-weight: 400; |
||||
text-align: center; |
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FAE0BC 100%); |
||||
-webkit-background-clip: text; |
||||
-webkit-text-fill-color: transparent; |
||||
padding-top:150upx; |
||||
} |
||||
.subTopicText{ |
||||
|
||||
font-size: 50upx; |
||||
font-family: YouSheBiaoTiHei, YouSheBiaoTiHei; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
text-align: center; |
||||
-webkit-background-clip: text; |
||||
// -webkit-text-fill-color: transparent; |
||||
margin-top:20upx; |
||||
} |
||||
.qcode{ |
||||
width: 400upx; |
||||
height:400upx; |
||||
margin:40upx auto; |
||||
border:1px solid red; |
||||
} |
||||
.submitBtn{ |
||||
width: 340upx; |
||||
height: 90upx; |
||||
background: linear-gradient(180deg, #FEE6A8 0%, #FCC96E 100%); |
||||
border-radius: 39px 39px 39px 39px; |
||||
opacity: 1; |
||||
font-size: 40upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #E92214; |
||||
line-height: 90upx; |
||||
text-align: center; |
||||
margin:0 auto; |
||||
} |
||||
.fuli{ |
||||
margin: 60upx; |
||||
background-color: #fff; |
||||
border-radius: 14upx; |
||||
.fuliTitle{ |
||||
width: 137px; |
||||
height: 35px; |
||||
background: #3A393E; |
||||
opacity: 1; |
||||
margin: 0 auto; |
||||
border-radius: 0 0 20px 20px; |
||||
color: #FFFFFF; |
||||
text-align: center; |
||||
line-height: 35px; |
||||
font-size: 32upx; |
||||
} |
||||
.fuliContent{ |
||||
display: flex; |
||||
justify-content: space-around; |
||||
align-items: center; |
||||
padding:50upx 0; |
||||
|
||||
.fuliItem{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
justify-content: center; |
||||
image{ |
||||
height:100upx; |
||||
width: auto; |
||||
} |
||||
text{ |
||||
font-size: 28upx; |
||||
font-family: PingFang SC, PingFang SC; |
||||
font-weight: 500; |
||||
color: #E92214; |
||||
margin-top:12upx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,96 @@ |
||||
<template> |
||||
<view class="logistics"> |
||||
<u-collapse :arrow="false" :head-style="headerStyle" :body-style="bodyStyle" :item-style="itemStyle"> |
||||
<u-collapse-item :title="item.head" v-for="(item, index) in itemList" :key="index"> |
||||
{{item.body}} |
||||
</u-collapse-item> |
||||
</u-collapse> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
itemList: [{ |
||||
head: "发货时效", |
||||
body: "发货时效", |
||||
open: false |
||||
},{ |
||||
head: "催促物流", |
||||
body: "催促物流", |
||||
open: false, |
||||
},{ |
||||
head: "修改收货地址", |
||||
body: "修改收货地址", |
||||
open: false, |
||||
},{ |
||||
head: "配送范围与费用", |
||||
body: "配送范围与费用", |
||||
open: false, |
||||
},{ |
||||
head: "发货时间", |
||||
body: "发货时间", |
||||
open: false, |
||||
},{ |
||||
head: "能否延迟发货", |
||||
body: "能否延迟发货", |
||||
open: false, |
||||
},{ |
||||
head: "配送快递", |
||||
body: "配送快递", |
||||
open: false, |
||||
},{ |
||||
head: "物流停滞不更新", |
||||
body: "物流停滞不更新", |
||||
open: false, |
||||
},{ |
||||
head: "未收到货但物流显示已签收", |
||||
body: "未收到货但物流显示已签收", |
||||
open: false, |
||||
},{ |
||||
head: "为何包裹物流显示退回", |
||||
body: "为何包裹物流显示退回", |
||||
open: false, |
||||
},{ |
||||
head: "商品验货与验收", |
||||
body: "商品验货与验收", |
||||
open: false, |
||||
},{ |
||||
head: "商品发货后,拒收会收取费用吗", |
||||
body: "商品发货后,拒收会收取费用吗", |
||||
open: false, |
||||
},{ |
||||
head: "合单发货政策说明", |
||||
body: "合单发货政策说明", |
||||
open: false, |
||||
}], |
||||
headerStyle:{ |
||||
borderBottom:'1px solid #f5f5f5', |
||||
color: '#333333', |
||||
padding: '32upx 0', |
||||
fontSize:'28upx' |
||||
}, |
||||
itemStyle:{ |
||||
padding: '0 20upx', |
||||
background:' #ffffff', |
||||
}, |
||||
bodyStyle:{ |
||||
padding:'20upx', |
||||
fontSize:'24upx', |
||||
color:'#222' |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
page{ |
||||
height:100%; |
||||
} |
||||
.logistics{ |
||||
height:100%; |
||||
padding-top:20upx; |
||||
} |
||||
</style> |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 3.0 KiB |
After Width: | Height: | Size: 4.9 KiB |
After Width: | Height: | Size: 5.5 KiB |
After Width: | Height: | Size: 171 KiB |
After Width: | Height: | Size: 872 B |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 461 B |
After Width: | Height: | Size: 768 B |
After Width: | Height: | Size: 965 B |
After Width: | Height: | Size: 504 B |
After Width: | Height: | Size: 777 B |