初始化
This commit is contained in:
251
pages/agentBusiness/agentBusiness.vue
Normal file
251
pages/agentBusiness/agentBusiness.vue
Normal file
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<view class="uni-page">
|
||||
<u-navbar placeholder :autoBack="true" bgColor="#fff0e7" title="代收信件" />
|
||||
<view class="content-main">
|
||||
<view class="info-box">
|
||||
<view class="explain">
|
||||
我们对不方便收信的家属提供信件免费代收服务：
|
||||
</view>
|
||||
<view class="address-info content">
|
||||
<view class="address-info-left">
|
||||
<view class="address-title">
|
||||
<text>{{addressInfo.name}} 收</text> <text>{{addressInfo.phone}}</text>
|
||||
</view>
|
||||
<view class="address-content">
|
||||
{{addressInfo.address}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="copy-button">
|
||||
<u-button type="primary" @click="copy" shape="circle" text="复制" color="#e39b46"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="upload-explain">
|
||||
<view class="upload-explain-item" v-for="(item,index) in explainList" :key="index">
|
||||
<view class="dot"> </view>
|
||||
<text class="explain-text">{{item}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-box">
|
||||
<view class="explain">
|
||||
请填写您的联系方式：
|
||||
</view>
|
||||
<view class="content">
|
||||
<view style="margin-bottom: 20rpx;" v-for="(item,index) in phoneNumbers" :key="index">
|
||||
<u--input placeholder="请输入您的手机号码" type="number" border="surround" v-model="item.number">
|
||||
<template slot="suffix">
|
||||
<view class="" style="display: flex;">
|
||||
<u-button v-if="index" @tap="deleteNumber(index)" color="red"
|
||||
size="mini">删除</u-button>
|
||||
</view>
|
||||
</template>
|
||||
</u--input>
|
||||
</view>
|
||||
<view class="" style="display: flex;">
|
||||
<u-button type="primary" text="添加手机号" @click="addPhoneNumber"></u-button>
|
||||
<u-button :customStyle="{
|
||||
'margin-left':'20rpx',
|
||||
width:'200rpx'
|
||||
}" type="success" @click="submitNumber()">保存</u-button>
|
||||
</view>
|
||||
<!-- <u-button type="primary" text="添加手机号" @click="addPhoneNumber"></u-button> -->
|
||||
</view>
|
||||
<view class="upload-explain">
|
||||
<view class="upload-explain-item">
|
||||
<view class="dot"> </view>
|
||||
<text class="explain-text">填写的电话务必能联系到您本人，以免信件丢失</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="floor-bottom">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getAgentBusinessInfoApi,
|
||||
setAgentBusinessInfoApi
|
||||
} from '@/request/wm.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
explainList: ['请复制上方地址，并把我们的地址附在信件里面',
|
||||
'信件由我们收到后，第一时间会电话通知您',
|
||||
'信件可以拍照或邮寄，邮费需自己承担',
|
||||
'代收服务完全免费，不收取任何费用]',
|
||||
],
|
||||
phoneNumbers: [{
|
||||
number: ''
|
||||
}],
|
||||
addressInfo: '',
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.getAgentBusinessInfo()
|
||||
},
|
||||
methods: {
|
||||
addPhoneNumber() {
|
||||
this.phoneNumbers.push({
|
||||
number: null
|
||||
})
|
||||
},
|
||||
deleteNumber(index) {
|
||||
this.phoneNumbers.splice(index, 1)
|
||||
},
|
||||
async getAgentBusinessInfo() {
|
||||
let {
|
||||
data
|
||||
} = await getAgentBusinessInfoApi()
|
||||
this.addressInfo = data.data
|
||||
|
||||
if (data.data.links.length) {
|
||||
this.phoneNumbers = data.data.links.map((item) => {
|
||||
return {
|
||||
number: item
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
console.log(this.phoneNumbers);
|
||||
},
|
||||
async submitNumber(phoneNumber, index) {
|
||||
let canSub = null
|
||||
this.phoneNumbers.forEach(item => {
|
||||
if (!/^1[3456789]\d{9}$/.test(item.number)) {
|
||||
canSub = item.number
|
||||
}
|
||||
})
|
||||
if (canSub) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: `手机号 ${canSub} 不合法，请重新输入！`,
|
||||
showCancel: false,
|
||||
})
|
||||
} else {
|
||||
let phone = this.phoneNumbers.map(item => item.number)
|
||||
phone = {
|
||||
phone: phone.join(',')
|
||||
}
|
||||
console.log(phone);
|
||||
let {
|
||||
data
|
||||
} = await setAgentBusinessInfoApi(phone)
|
||||
console.log(data);
|
||||
}
|
||||
},
|
||||
copy() {
|
||||
uni.setClipboardData({
|
||||
data: `${this.addressInfo.name} ${this.addressInfo.phone} ${this.addressInfo.address}`,
|
||||
success: function() {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content-main {
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
// height: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.info-box {
|
||||
margin-top: 30rpx;
|
||||
background-color: white;
|
||||
min-height: 100rpx;
|
||||
border-radius: 40rpx;
|
||||
height: fit-content;
|
||||
padding: 30rpx 30rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.info-title {
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.explain {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 34rpx 0;
|
||||
}
|
||||
|
||||
.address-info {
|
||||
border-radius: 40rpx;
|
||||
height: 174rpx;
|
||||
background: #FFF7F2;
|
||||
|
||||
display: flex;
|
||||
padding: 0 30rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.address-info-left {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding-right: 30rpx;
|
||||
}
|
||||
|
||||
.address-title {
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
font-size: 34rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
text {
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
// font-size: 34rpx;
|
||||
}
|
||||
|
||||
.address-content {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.upload-explain {
|
||||
padding-left: 30rpx;
|
||||
|
||||
.upload-explain-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.dot {
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
background-color: #999796;
|
||||
margin-right: 14rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.explain-text {
|
||||
flex: 1;
|
||||
font-size: 26rpx;
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user