123 lines
3.3 KiB
Vue
123 lines
3.3 KiB
Vue
<template>
|
|
<!-- 报价/客户支付模态框 -->
|
|
<view class="cu-modal" :class="show?'show':''">
|
|
<view class="cu-dialog">
|
|
<view class="cu-bar bg-white justify-end solid-bottom">
|
|
<view class="content">催单/发起约单</view>
|
|
<view class="action" data-modal="sendUrgentMsgModal" @click="hideModal">
|
|
<text class="cuIcon-close text-red"></text>
|
|
</view>
|
|
</view>
|
|
<view class="padding padding-lr-xl bg-white text-left">
|
|
<view class="custom-radio" style="margin-bottom: 20rpx;">
|
|
<uni-data-checkbox v-model="radio1" selectedColor="#0081ff" :localdata="sex"></uni-data-checkbox>
|
|
</view>
|
|
<template v-if="radio1 === 2">
|
|
<view style="font-size: 32rpx;padding: 20upx 0;border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);">
|
|
<text>我想约的时间是：</text>
|
|
</view>
|
|
<view style="display: flex;flex-direction: row;padding-top: 20upx;">
|
|
<uni-datetime-picker type="date" :clear-icon="false" v-model="dateStr"/>
|
|
<picker class="margin-left-xs" mode="selector" :value="timeRangeIndex" :range="timeRangeList"
|
|
@change="timeRangeChange">
|
|
<input class="radius-input time-picker" v-model="timeRange" disabled></input>
|
|
</picker>
|
|
</view>
|
|
</template>
|
|
|
|
<view class="margin-top-sm">
|
|
<textarea style="width: 100%;" class="solid radius text-left padding-sm" v-model="detailDesc" maxlength="-1"
|
|
placeholder="具体情况(选填)"></textarea>
|
|
</view>
|
|
</view>
|
|
<view class="cu-bar solid-top">
|
|
<view class="action margin-0 flex-sub text-black" data-modal="sendUrgeOrderModal" @tap="hideModal">取消</view>
|
|
<view class="action margin-0 flex-sub text-main-color solid-left" data-modal="sendUrgeOrderModal" @click="apply">确认</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
nama: 'urge-order',
|
|
emits: ['hideModal', 'confirm'],
|
|
props: {
|
|
show: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
data: {
|
|
type: Object,
|
|
default: () => {}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
radio1: 0,
|
|
dateStr: '',
|
|
detailDesc: '',
|
|
sex: [{
|
|
text: '【催单】师傅已约单，催促快上门！',
|
|
value: 0
|
|
}, {
|
|
text: '【催单】师傅未约单，催促快预约！',
|
|
value: 1
|
|
}, {
|
|
text: '【约单】分次上门单，本次请约我！',
|
|
value: 2
|
|
}],
|
|
timeRangeIndex: 0,
|
|
timeRange: '',
|
|
timeRangeList: []
|
|
}
|
|
},
|
|
watch: {
|
|
show() {
|
|
this.resetData()
|
|
if(this.show) {
|
|
this.timeRangeList = this.$globalData.timeRangeList;
|
|
this.timeRange = this.timeRangeList[0];
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
hideModal(e) {
|
|
this.$emit('hideModal', e);
|
|
this.resetData()
|
|
},
|
|
resetData() {
|
|
this.radio1 = 0
|
|
this.dateStr = ''
|
|
this.detailDesc = ''
|
|
this.timeRangeIndex = 0
|
|
this.timeRange = this.timeRangeList[0]
|
|
},
|
|
timeRangeChange(e) {
|
|
this.timeRangeIndex = e.detail.value;
|
|
this.timeRange = this.timeRangeList[this.timeRangeIndex];
|
|
},
|
|
async apply(e) {
|
|
if(this.radio1 == 2) {
|
|
if(!this.dateStr) {
|
|
uni.showToast({
|
|
title: '请选择预约日期',
|
|
icon: 'none'
|
|
})
|
|
return false;
|
|
}
|
|
}
|
|
this.$emit('confirm', {
|
|
type: this.radio1,
|
|
content: this.radio1 == 2 ? `约单: 时间${this.dateStr} ${this.timeRange}` : '催单',
|
|
remark: this.detailDesc
|
|
});
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|