You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
172 lines
3.3 KiB
172 lines
3.3 KiB
<template>
|
|
<view class="changecontainer">
|
|
<view>
|
|
<view class="logobox">
|
|
<image src="../../static/logo-xietaitai.png" mode="widthFix"></image>
|
|
</view>
|
|
<view class="customerService">
|
|
<view class="customerTit">
|
|
<text class="bigtitle">蟹太太 官方客服解答</text>
|
|
<view class="smalltitle">
|
|
<view>
|
|
<u-icon name="question-circle-fill" size="28" color="#b98b44"></u-icon>
|
|
<text>提货答疑</text>
|
|
</view>
|
|
<view>
|
|
<u-icon name="hourglass-half-fill" size="28" color="#b98b44"></u-icon>
|
|
<text>售后赔付</text>
|
|
</view>
|
|
<view>
|
|
<u-icon name="star-fill" size="28" color="#b98b44"></u-icon>
|
|
<text>新人特惠</text>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="qrCodebox">
|
|
<view class="codeimg">
|
|
<image show-menu-by-longpress :src="img" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="textbottom">长按扫码添加专属管家</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
components: {
|
|
|
|
},
|
|
data() {
|
|
return {
|
|
img: '',
|
|
kfType:'kf2'
|
|
}
|
|
},
|
|
onShow() {
|
|
const banner4 = uni.getStorageSync('banner4') ? uni.getStorageSync('banner4') : []
|
|
if (banner4.length > 0) {
|
|
banner4.map(item=>{
|
|
if(item.type===this.kfType){
|
|
this.img = item.image
|
|
}
|
|
})
|
|
}
|
|
|
|
},
|
|
}
|
|
</script>
|
|
<style type="text/css" scoped>
|
|
.changecontainer {
|
|
width: 100%;
|
|
padding-bottom: 200rpx;
|
|
padding-top: 60rpx;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
background-image: url(../../static/bg-change.jpg);
|
|
background-position: center top;
|
|
background-size: cover;
|
|
}
|
|
|
|
.changecontainer>view {
|
|
width: 100%
|
|
}
|
|
|
|
.logobox {
|
|
width: 162rpx;
|
|
height: 162rpx;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
margin: 0 auto;
|
|
background: #fff;
|
|
margin-bottom: 60rpx;
|
|
box-shadow: 0 22rpx 32rpx rgba(53, 53, 53, .6);
|
|
}
|
|
|
|
.logobox image {
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.customerService {
|
|
width: 87.33%;
|
|
margin: 0 auto;
|
|
background: #fff;
|
|
border-radius: 10rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.customerTit {
|
|
text-align: center;
|
|
padding-top: 62rpx;
|
|
padding-bottom: 62rpx;
|
|
}
|
|
|
|
.customerTit text {
|
|
display: block;
|
|
font-size: 20rpx;
|
|
color: #000;
|
|
}
|
|
|
|
.customerTit text.bigtitle {
|
|
color: #b98b44;
|
|
font-size: 36rpx;
|
|
margin-bottom: 26rpx;
|
|
}
|
|
|
|
.customerTit .smalltitle {}
|
|
|
|
.customerTit .smalltitle>view {
|
|
display: inline-block;
|
|
margin: 0 20rpx;
|
|
|
|
}
|
|
|
|
.customerTit .smalltitle text {
|
|
font-size: 28rpx;
|
|
display: inline-block;
|
|
|
|
margin-left: 5rpx;
|
|
}
|
|
|
|
.qrCodebox {
|
|
width: 510rpx;
|
|
margin: 0 auto;
|
|
border-radius: 30rpx;
|
|
overflow: hidden;
|
|
padding: 22rpx;
|
|
box-sizing: border-box;
|
|
background: #ededed;
|
|
text-align: center;
|
|
margin-bottom: 98rpx;
|
|
}
|
|
|
|
.codeimg {
|
|
width: 466rpx;
|
|
height: 466rpx;
|
|
margin: 0 auto;
|
|
background: url(../../static/ewmbg.png) center center no-repeat;
|
|
background-size: cover;
|
|
padding: 19rpx;
|
|
}
|
|
|
|
.codeimg image {
|
|
width: 428rpx;
|
|
height: auto;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.textbottom {
|
|
width: 100%;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
text-align: center;
|
|
background: #f4f4f4;
|
|
font-size: 26rpx;
|
|
color: #000;
|
|
}
|
|
</style> |