确认收货改造
This commit is contained in:
geng.tang@qq.com
@@ -36,17 +36,29 @@
|
||||
<image src="../../static/not-dealer.png" v-else mode="aspectFill" style="width: 300rpx;height: 200rpx" @click="chooseImage(5)"></image>
|
||||
</u-form-item>
|
||||
</view>
|
||||
|
||||
<view class="form-wrapper">
|
||||
<u-input type="number" v-model="receiptPhone" placeholder="请输入收货人手机号" />
|
||||
<view class="captcha-item">
|
||||
<u-input type="text" placeholder="请输入验证码" v-model="captcha" placeholder-class="captcha_input" />
|
||||
<u-button class="yanzhengma" @click="getCaptcha">{{time}} {{text}}</u-button>
|
||||
</view>
|
||||
|
||||
<u-input type="text" v-model="emergentUser" placeholder="请输入紧急联系人" />
|
||||
<u-input type="text" v-model="officeAddress" placeholder="请输入单位地址" />
|
||||
<u-input type="text" v-model="homeAddress" placeholder="请输入家庭地址" />
|
||||
</view>
|
||||
</u-form>
|
||||
<view class="btn">
|
||||
<u-button type="primary" shape="circle" @click="handleSubmit()">
|
||||
{{ submitText }}
|
||||
</u-button>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<!-- <view class="btn">
|
||||
<u-button shape="circle" @click="resetting">
|
||||
重置
|
||||
</u-button>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="btn"></view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -58,10 +70,51 @@
|
||||
import {
|
||||
pageOrder,
|
||||
removeOrder,
|
||||
receiptOrder,
|
||||
receipt,
|
||||
getOrder
|
||||
} from '@/websoft/api/order.js'
|
||||
import { fileUrl } from '@/config.js';
|
||||
import { sendSmsCode } from '@/api/captcha.js'
|
||||
import { fileUrl } from '@/config.js'
|
||||
import { isMobile } from '@/utils/verify'
|
||||
|
||||
|
||||
// 表单验证规则
|
||||
const rules = {
|
||||
receiptPhone: [{
|
||||
required: true,
|
||||
message: '请输入手机号',
|
||||
trigger: ['blur', 'change']
|
||||
}, {
|
||||
// 自定义验证函数
|
||||
validator: (rule, value, callback) => {
|
||||
// 返回true表示校验通过，返回false表示不通过
|
||||
return isMobile(value)
|
||||
},
|
||||
message: '手机号码不正确',
|
||||
// 触发器可以同时用blur和change
|
||||
trigger: ['blur'],
|
||||
}],
|
||||
captcha: [{
|
||||
required: true,
|
||||
message: '请输入验证码',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
emergentUser: [{
|
||||
required: true,
|
||||
message: '请输入紧急联系人',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
officeAddress: [{
|
||||
required: true,
|
||||
message: '请输入单位地址',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
homeAddress: [{
|
||||
required: true,
|
||||
message: '请输入家庭地址',
|
||||
trigger: ['blur', 'change']
|
||||
}],
|
||||
}
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@@ -69,12 +122,24 @@
|
||||
form: {},
|
||||
order: {},
|
||||
orderSourceData: [],
|
||||
// 验证码（主要代码，直接复制使用即可）
|
||||
time: '',
|
||||
text: '获取验证码',
|
||||
receiptPhone: '',
|
||||
captcha: '',
|
||||
emergentUser: '',
|
||||
officeAddress: '',
|
||||
homeAddress: '',
|
||||
// 按钮禁用
|
||||
disabled: false,
|
||||
// disabled: false,
|
||||
submitText: '证件已上传并确认收货',
|
||||
}
|
||||
},
|
||||
|
||||
// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
|
||||
onReady() {
|
||||
this.$refs.uForm.setRules(this.rules)
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
@@ -88,48 +153,116 @@
|
||||
|
||||
methods: {
|
||||
// 加载订单
|
||||
getData(){
|
||||
getData() {
|
||||
const app = this
|
||||
const { orderId } = this
|
||||
getOrder(orderId).then(res => {
|
||||
console.log("res: ",res);
|
||||
app.order = res.data
|
||||
if(res.data.orderSourceData.length > 0){
|
||||
app.orderSourceData = JSON.parse(res.data.orderSourceData)
|
||||
}
|
||||
})
|
||||
},
|
||||
//获取验证码（主要代码，直接复制使用即可）
|
||||
getCaptcha() {
|
||||
if(this.disabled){
|
||||
uni.showToast({
|
||||
title: '请耐心等待',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
var that = this;
|
||||
|
||||
if (!that.receiptPhone) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
console.log('that====: ');
|
||||
sendSmsCaptcha({
|
||||
phone: that.receiptPhone,
|
||||
type: 'RECEIPT'
|
||||
}).then(result => {
|
||||
console.log(result)
|
||||
if(result){
|
||||
if(result.code == 0) {
|
||||
that.$success("发送短信验证码成功")
|
||||
that.orderSourceData = []
|
||||
// 刷新订单列表
|
||||
that.getData()
|
||||
|
||||
that.disabled = true
|
||||
that.setInterValFunc()
|
||||
} else {
|
||||
that.$toast(result.message)
|
||||
}
|
||||
}
|
||||
|
||||
}).catch(err => {
|
||||
console.log('e2: ',err);
|
||||
that.$toast(err.message)
|
||||
}).finally(e => {
|
||||
console.log('e3: ',e);
|
||||
})
|
||||
},
|
||||
|
||||
setInterValFunc() {
|
||||
this.time = 60;
|
||||
this.text = '秒';
|
||||
this.setTime = setInterval(() => {
|
||||
if (this.time - 1 == 0) {
|
||||
this.time = '';
|
||||
this.text = '重新获取';
|
||||
this.code = '';
|
||||
this.disabled = false;
|
||||
clearInterval(this.setTime);
|
||||
} else {
|
||||
this.disabled = true;
|
||||
this.time--;
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
|
||||
// 重置
|
||||
resetting(){
|
||||
/* resetting(){
|
||||
const app = this
|
||||
const { orderId } = app
|
||||
receiptOrder({
|
||||
orderId,
|
||||
orderSourceData: ''
|
||||
receipt({
|
||||
orderId: orderId,
|
||||
orderSourceData: '',
|
||||
}).then(result => {
|
||||
app.$success("重置成功")
|
||||
app.orderSourceData = []
|
||||
// 刷新订单列表
|
||||
receiptPhone = ''
|
||||
captcha = ''
|
||||
emergentUser = ''
|
||||
officeAddress = ''
|
||||
homeAddress = ''
|
||||
time = ''
|
||||
text = '获取验证码'
|
||||
app.getData()
|
||||
})
|
||||
},
|
||||
}, */
|
||||
// 表单提交
|
||||
handleSubmit() {
|
||||
const app = this
|
||||
const { orderId,orderSourceData } = app
|
||||
const { orderId,orderSourceData,captcha,receiptPhone,emergentUser,officeAddress, homeAddress } = app
|
||||
if(orderSourceData.length < 5) {
|
||||
return
|
||||
}
|
||||
receiptOrder({
|
||||
orderId,
|
||||
orderSourceData: JSON.stringify(orderSourceData)
|
||||
}).then(result => {
|
||||
app.$success("上传成功")
|
||||
uni.navigateBack()
|
||||
receipt(app).then(result => {
|
||||
if(result.code == 0) {
|
||||
app.$success("上传成功")
|
||||
uni.navigateBack()
|
||||
} else {
|
||||
app.$toast(result.message)
|
||||
}
|
||||
}).catch(err => {
|
||||
app.$toast(err.message)
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
// 上传图片
|
||||
@@ -219,9 +352,9 @@
|
||||
background: linear-gradient(to right, $main-bg, $main-bg2);
|
||||
|
||||
// 禁用按钮
|
||||
&.disabled {
|
||||
/* &.disabled {
|
||||
opacity: 0.6;
|
||||
}
|
||||
} */
|
||||
}
|
||||
|
||||
}
|
||||
@@ -328,4 +461,39 @@
|
||||
width: 700rpx;
|
||||
margin: 20rpx auto;
|
||||
}
|
||||
|
||||
.captcha_input {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #CACACA;
|
||||
}
|
||||
|
||||
.yanzhengma {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -8rpx;
|
||||
bottom: 0;
|
||||
width: 140rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
background: #00BD87;
|
||||
border-radius: 30rpx;
|
||||
font-size: 22rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.captcha-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10rpx;
|
||||
border-bottom: 3rpx solid #DDDDDD;
|
||||
margin-bottom: 25rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user