167 lines
5.5 KiB
Vue
167 lines
5.5 KiB
Vue
<template>
|
|
<view>
|
|
<form @submit="sendSubmit">
|
|
<view class="nickname">
|
|
<view class="examineTitle">
|
|
选择发货方式
|
|
</view>
|
|
<view class="toExamine" v-if="send.sendWay[send.sendIndex]">
|
|
<picker mode="selector" :value="send.sendIndex" range-key="name" :range="send.sendWay" @change="wayChange">
|
|
<view>{{send.sendWay[send.sendIndex].name}}</view>
|
|
</picker>
|
|
<image class="toExamine-row" src="../../static/icons/goods_row.png" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
<view class="nickname" v-if="send.sendIndex == 0">
|
|
<view class="examineTitle">
|
|
选择物流公司
|
|
</view>
|
|
<view class="toExamine" v-if="state.array[state.index]">
|
|
<picker mode="selector" :value="state.index" range-key="name" :range="state.array" @change="sexChange">
|
|
<view>{{state.array[state.index].name}}</view>
|
|
</picker>
|
|
<image class="toExamine-row" src="../../static/icons/goods_row.png" mode="aspectFill"></image>
|
|
</view>
|
|
</view>
|
|
<view class="nickname" v-if="send.sendIndex == 0">
|
|
<view class="examineTitle">
|
|
填写物流单号
|
|
</view>
|
|
<input class="remarks" @blur="bindExpressNo" auto-height placeholder="" />
|
|
</view>
|
|
|
|
<!-- 选择其他方式显示 -->
|
|
<view class="nickname" v-if="send.sendIndex == 1">
|
|
<view class="examineTitle">
|
|
送货人姓名
|
|
</view>
|
|
<input class="remarks" name="courier_name" auto-height placeholder="" />
|
|
</view>
|
|
<view class="nickname" v-if="send.sendIndex == 1">
|
|
<view class="examineTitle">
|
|
送货人联系方式
|
|
</view>
|
|
<input class="remarks" name="courier_mobile" auto-height placeholder="" />
|
|
</view>
|
|
<button class="submit" form-type="submit" type="default">提交</button>
|
|
</form>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { deliverFront, deliverForm } from '@/apis/interfaces/store'
|
|
export default {
|
|
data() {
|
|
return {
|
|
send : {
|
|
sendWay : [{
|
|
id : 'post',
|
|
name : '邮寄'
|
|
},{
|
|
id : 'other',
|
|
name : '其他'
|
|
}],
|
|
sendIndex : 0,
|
|
},
|
|
state : {
|
|
// 快递筛选
|
|
array : [],
|
|
// 快递筛选默认下标
|
|
index : 0,
|
|
},
|
|
expressNo : '',
|
|
courierName : '',
|
|
courierMobile : ''
|
|
}
|
|
},
|
|
created() {
|
|
deliverFront(this.$Route.query.id).then(res=>{
|
|
this.state.array = res
|
|
})
|
|
},
|
|
methods: {
|
|
// 选择发货方式
|
|
wayChange(e) {
|
|
this.send.sendIndex = e.detail.value
|
|
this.expressNo = ''
|
|
this.courierName = ''
|
|
this.courierMobile = ''
|
|
},
|
|
|
|
// 筛选
|
|
sexChange(e) {
|
|
this.state.index = e.detail.value
|
|
},
|
|
|
|
// 物流单号
|
|
bindExpressNo(val) {
|
|
this.expressNo = val.detail.value
|
|
},
|
|
|
|
// 送货人姓名
|
|
bindCourierName(val) {
|
|
this.courierName = val.detail.value
|
|
},
|
|
|
|
// 送货人联系方式
|
|
bindCourierMobile(val) {
|
|
this.courierMobile = val.detail.value
|
|
},
|
|
|
|
// 提交表单
|
|
sendSubmit() {
|
|
deliverForm(this.$Route.query.id,{
|
|
type : this.send.sendWay[this.send.sendIndex].id || '',
|
|
express_id : this.state.array[this.state.index].id || '',
|
|
express_no : this.expressNo || '',
|
|
courier_name : this.courierName || '',
|
|
courier_mobile : this.courierMobile || ''
|
|
}).then(res=>{
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '发送成功'
|
|
})
|
|
this.$Router.back()
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.nickname {
|
|
background-color: #FFFFFF;
|
|
padding: $padding;
|
|
margin-bottom: $margin;
|
|
display: flex;
|
|
position: relative;
|
|
font-size: $title-size-lg;
|
|
.examineTitle {
|
|
width: 210rpx;
|
|
}
|
|
.remarks {
|
|
width: calc(100% - 210rpx);
|
|
font-size: $title-size-lg;
|
|
color: $text-color;
|
|
}
|
|
.toExamine {
|
|
position: absolute;
|
|
top: $padding;
|
|
right: $padding;
|
|
display: flex;
|
|
.toExamine-row {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
margin-top: 6rpx;
|
|
filter: grayscale(100%);
|
|
}
|
|
}
|
|
}
|
|
.submit {
|
|
background: #e93340;
|
|
color: white;
|
|
border-color: #e93340;
|
|
margin: $margin*4 $margin 0;
|
|
}
|
|
</style>
|