<template>
<dm-pop-view ref='popView' :isShowClose="false" :isShowTitle="false" :maskTapHide='maskTapHide' :isShowConfirm='false'>
<view class="titleDiv">
<view class="title">补全录入号码</view>
<image class="pop-close" src="../../static/icons/icon_close@2x.png" mode="" @click="handleCancel"></image>
</view>
<view class="content_options" v-if="isShowComplet">
<text class="options_title">补充客户完整号码后，系统将判定是否补录成功，并实时反馈补充结果。</text>
<input class="input-info" placeholder="请输入完整号码" type="number" maxlength="11" @input="setInputPhone" />
<view class="confirm" @click="upload" :style="{background: themeColor}">提交</view>
<view class="think_again" @click="thinkAgain">我再想想</view>
</view>
<view v-else>
<view class="content_options" v-if="isSuccess==1">
<image src="../../static/icons/complete_success.png" mode="" class="icon_complete"></image>
<text style="font-size: 36rpx;font-family: Verdana, Verdana-Bold;font-weight: 700;text-align: center;color: #333333;">补充成功</text>
<text style="margin-top: 10rpx;font-size: 24rpx;font-family: Verdana, Verdana-Regular;font-weight: 400;text-align: center;color: #333333;">该客户全号码补充成功，点击确认刷新报备列表。</text>
<view class="success_confirm" @click="successConfirm" :style="{background: themeColor}">确认</view>
</view>
<view class="content_options" v-if="isSuccess==2">
<image src="../../static/icons/complete_failure.png" mode="" class="icon_complete"></image>
<text style="font-size: 36rpx;font-family: Verdana, Verdana-Bold;font-weight: 700;text-align: center;color: #333333;">补充失败</text>
<text style="margin-top: 10rpx;font-size: 24rpx;font-family: Verdana, Verdana-Regular;font-weight: 400;text-align: center;color: #333333; width: 504rpx;">{{message}}</text>
<view class="success_confirm" @click="failureConfirm" :style="{background: themeColor}">确认</view>
</view>
</view>
</dm-pop-view>
</template>
<script>
import dmPopView from './dmPopView.vue'
export default {
props: {
maskTapHide: {
type: Boolean,
default: true
},
options:{
type:Object
}
},
data() {
return {
themeColor: "",
fuzhuClolor: "",
themeColor25: "",
themeColor50: "",
isSuccess: -1,
isShowComplet: true,
completionPhone: "",
completePhoneParam: null,
message: "",
brandId:"",
userMobile:""
}
},
mounted() {
let app = getApp();
this.themeColor = app.globalData.themeColor;
this.fuzhuClolor = app.globalData.fuzhuColor;
this.themeColor25 = app.globalData.themeColor25;
this.themeColor50 = app.globalData.themeColor50;
uni.getStorage({
//获得保存在本地的用户信息
key: 'userInfo',
success: res => {
if (res.data) {
this.brandId = res.data.brandId;
this.userMobile = res.data.mobile;
}
}
});
},
methods: {
setInputPhone(event) {
this.completionPhone = event.detail.value
},
handleCancel() {
this.$refs.popView.hide()
},
show() {
this.isSuccess = -1
this.isShowComplet = true
this.$refs.popView.show()
},
thinkAgain() {
this.$refs.popView.handleCancel();
},
failureConfirm() {
this.$emit('updataDataPage','')
this.$refs.popView.handleConfirm();
},
successConfirm() {
this.$emit('updataDataPage','')
this.$refs.popView.handleConfirm();
},
upload() {
let item = this.options;
let hiddenMobile = item.userMobile;
let userId = item.userId;
let name = item.userName;
let reportTime = item.reportTime;
let houseId = item.houseId;
let reportId = item.id;
let terminal = item.terminal;
let reporterMobile = item.reporterMobile;
this.completePhoneParam = {
hiddenMobile,
userId,
houseId,
reportId,
name,
reportTime,
terminal,
reporterMobile
}
if (this.completionPhone != '') { //输入了手机号
if (this.completionPhone.length == 11) {
let startPhone3 = this.completionPhone.slice(0, 3)
let endPhone4 = this.completionPhone.slice(7)
let start3 = this.completePhoneParam.hiddenMobile.slice(0, 3)
let end4 = this.completePhoneParam.hiddenMobile.slice(7)
if (startPhone3 == start3 && endPhone4 == end4) {
if (this.faSongFangLJ) {
return
}
this.faSongFangLJ = true;
this.commitReport();
} else {
uni.showToast({
title: '请输入与前三后四号码相匹配的手机号码',
icon: "none",
duration: 2000
})
}
} else {
uni.showToast({
title: '请输入完整的手机号码',
icon: "none",
duration: 2000
})
}
} else {
uni.showToast({
title: '请输入手机号码',
icon: "none",
duration: 2000
})
}
},
dateFormat(fmt, date) {
date = new Date(date);
let ret;
const opt = {
"Y+": date.getFullYear().toString(), // 年
"m+": (date.getMonth() + 1).toString(), // 月
"d+": date.getDate().toString(), // 日
"H+": date.getHours().toString(), // 时
"M+": date.getMinutes().toString(), // 分
"S+": date.getSeconds().toString() // 秒
// 有其他格式化字符需求可以继续添加，必须转化成字符串
};
for (let k in opt) {
ret = new RegExp("(" + k + ")").exec(fmt);
if (ret) {
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
};
};
return fmt;
},
/**
* 补全号码
*/
async commitReport() {
let data = {
brandId: this.brandId,
hiddenMobile: this.completePhoneParam.hiddenMobile,
houseId: this.completePhoneParam.houseId,
mobile: this.completionPhone,
name: this.completePhoneParam.name,
reportId: this.completePhoneParam.reportId,
reportTime: this.dateFormat("YYYY-mm-dd HH:MM:SS",this.completePhoneParam.reportTime),
reporterMobile: this.completePhoneParam.reporterMobile,
terminal: this.completePhoneParam.terminal,
userId: this.completePhoneParam.userId,
};
let res = await this.$myRequest({
url: "/elab-marketing-user/pre3post4/completePhone",
data: data
});
if (res.data.success) {
this.isSuccess = 1
this.isShowComplet = false
this.faSongFangLJ = false;
} else {
this.isSuccess = 2
this.isShowComplet = false
this.faSongFangLJ = false;
this.message = res.data.message
}
},
},
components: {
dmPopView
}
}
</script>
<style scoped lang="scss">
.titleDiv {
width: 100%;
padding: 56rpx 30rpx 10rpx 40rpx;
box-sizing: border-box;
display: flex;
justify-content: space-between;
.title {
font-size: 36rpx;
font-weight: bold;
}
.pop-close {
position: absolute;
top: 64rpx;
right: 30rpx;
width: 40rpx;
height: 40rpx;
}
}
.content_options {
width: 100%;
display: flex;
height: 700rpx;
align-items: center;
flex-direction: column;
overflow-y: scroll;
overflow-x: hidden;
.options_title {
font-size: 24rpx;
font-family: Verdana, 'Verdana-Regular';
font-weight: 400;
text-align: left;
color: #333333;
margin-left: 40rpx;
margin-right: 40rpx;
margin-top: 20rpx;
}
.input-info {
width: calc(100% - 60rpx);
height: 96rpx;
background: #f1f5f9;
border-radius: 16rpx;
padding-left: 30rpx;
box-sizing: border-box;
line-height: 96rpx;
margin-top: 50rpx;
margin-bottom: 140rpx;
}
.confirm {
width: 260rpx;
height: 84rpx;
border-radius: 42rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
font-family: Verdana, Verdana-Regular;
font-weight: 400;
text-align: center;
color: #ffffff;
}
.think_again {
font-size: 32rpx;
font-family: Verdana, Verdana-Regular;
font-weight: 400;
text-align: center;
color: #666666;
margin-top: 50rpx;
}
.icon_complete {
width: 118rpx;
height: 118rpx;
margin-top: 100rpx;
margin-bottom: 30rpx;
}
.success_confirm {
width: 280rpx;
height: 84rpx;
border-radius: 42rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
font-family: Verdana, Verdana-Regular;
font-weight: 400;
text-align: center;
color: #ffffff;
margin-top: 160rpx;
}
}
</style>