【bug】国际研讨会时间组件的禁用

This commit is contained in:
fengachen
2021-10-28 18:01:06 +08:00
parent de13efaaa1
commit 25c7eedd7d
2 changed files with 70 additions and 23 deletions
@@ -13,7 +13,7 @@
<a-col :xxl="8" :xl="12" :sm="24"> <a-col :xxl="8" :xl="12" :sm="24">
<a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime']" :trigger-change="true" <j-date placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime']" :trigger-change="true" :disabled-date="disabledStartDate"
date-format="YYYY-MM-DD"/> date-format="YYYY-MM-DD"/>
</a-form-item> </a-form-item>
</a-col> </a-col>
@@ -33,7 +33,8 @@
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2"> <a-col :xxl="8" :xl="12" :sm="24" v-if="identifyType === 2">
<a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="缴费方式" :labelCol="labelCol" :wrapperCol="wrapperCol">
<a-radio-group v-decorator="['payMode',validatorRules.payMode]" :disabled="isEditBool" @change="changePayMode"> <a-radio-group v-decorator="['payMode',validatorRules.payMode]" :disabled="isEditBool"
@change="changePayMode">
<a-radio :value="1">汇款</a-radio> <a-radio :value="1">汇款</a-radio>
<a-radio :value="2">线上缴费</a-radio> <a-radio :value="2">线上缴费</a-radio>
<a-radio :value="3">打包</a-radio> <a-radio :value="3">打包</a-radio>
@@ -181,7 +182,7 @@ export default {
// 缴费方式为打包 // 缴费方式为打包
payModeBool: true, payModeBool: true,
// 缴费方式为线上缴费 // 缴费方式为线上缴费
onlinePayModeBool:false, onlinePayModeBool: false,
// 回显的邮寄联系人 // 回显的邮寄联系人
selectPostPerson: null, selectPostPerson: null,
validatorRules: { validatorRules: {
@@ -197,15 +198,15 @@ export default {
rules: [{required: true, message: '请选择发票类型'}], rules: [{required: true, message: '请选择发票类型'}],
validateTrigger: 'change' validateTrigger: 'change'
}, },
orderCode:{ orderCode: {
rules: [{required: true, message: '请输入订单号后四位'}], rules: [{required: true, message: '请输入订单号后四位'}],
validateTrigger: 'blur' validateTrigger: 'blur'
} }
}, },
// 是否可编辑 // 是否可编辑
isEditBool:false, isEditBool: false,
// 是否需要发票 // 是否需要发票
needInvoiceBool:true, needInvoiceBool: true,
} }
}, },
watch: { watch: {
@@ -232,34 +233,34 @@ export default {
/* /*
* 清空邮寄联系人 地址 邮编 * 清空邮寄联系人 地址 邮编
* */ * */
clearFormItem(){ clearFormItem() {
this.form.resetFields(['postContactId','postContactAddress','postCode']) this.form.resetFields(['postContactId', 'postContactAddress', 'postCode'])
}, },
/* /*
* 选择了联系人后给邮寄联系人和地址赋值 * 选择了联系人后给邮寄联系人和地址赋值
* */ * */
setAddressVal(val) { setAddressVal(val) {
val = Object.assign({}, {postContactId: val.id, postContactAddress: val.contactAddress,postCode:val.postalCode}) val = Object.assign({}, {postContactId: val.id, postContactAddress: val.contactAddress, postCode: val.postalCode})
this.$nextTick(() => { this.$nextTick(() => {
this.form.setFieldsValue(pick(val, 'postContactId', 'postContactAddress','postCode')) this.form.setFieldsValue(pick(val, 'postContactId', 'postContactAddress', 'postCode'))
}) })
}, },
/* /*
* 选择联系人之后地址邮编复制 * 选择联系人之后地址邮编复制
* */ * */
changePost(val){ changePost(val) {
if(val === undefined){ if (val === undefined) {
this.clearFormItem() this.clearFormItem()
} }
getContactsById({id:val}).then(res => { getContactsById({id: val}).then(res => {
if(res.success){ if (res.success) {
this.setAddressVal(res.result) this.setAddressVal(res.result)
} }
}) })
}, },
/* /*
* 抵达时间禁用 * 离开时间禁用
* */ * */
disabledEndDate(endValue) { disabledEndDate(endValue) {
const startValueTemp = this.form.getFieldValue('arrivalTime') const startValueTemp = this.form.getFieldValue('arrivalTime')
@@ -269,21 +270,32 @@ export default {
} }
return startValue.valueOf() > endValue.valueOf() return startValue.valueOf() > endValue.valueOf()
}, },
/*
* 抵达时间禁用
* */
disabledStartDate(endValue) {
const startValueTemp = this.form.getFieldValue('departureTime')
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
if (!endValue || !startValue) {
return false
}
return startValue.valueOf() < endValue.valueOf() - 86400000
},
/* /*
* 缴费方式选择 * 缴费方式选择
* */ * */
changePayMode(e) { changePayMode(e) {
if (e.target.value === 3) { if (e.target.value === 3) {
this.payModeBool = true this.payModeBool = true
this.$emit('isPack',true) this.$emit('isPack', true)
} else { } else {
this.payModeBool = false this.payModeBool = false
this.$emit('isPack',false) this.$emit('isPack', false)
} }
// 缴费方式为线上 要输入订单后四位 // 缴费方式为线上 要输入订单后四位
if(e.target.value === 2){ if (e.target.value === 2) {
this.onlinePayModeBool = true this.onlinePayModeBool = true
}else { } else {
this.onlinePayModeBool = false this.onlinePayModeBool = false
} }
}, },
@@ -321,11 +333,11 @@ export default {
/* /*
* 选择发票 * 选择发票
* */ * */
changeInvoice(val){ changeInvoice(val) {
if(val === '0'){ if (val === '0') {
// 不需要发票 // 不需要发票
this.needInvoiceBool = true this.needInvoiceBool = true
}else { } else {
this.needInvoiceBool = false this.needInvoiceBool = false
} }
}, },
@@ -87,7 +87,7 @@
<!--入住酒店选择是才显示--> <!--入住酒店选择是才显示-->
<a-col :xxl="8" :xl="12" :sm="24" v-if="inHotelBool"> <a-col :xxl="8" :xl="12" :sm="24" v-if="inHotelBool">
<a-form-item label="入住酒店时间" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="入住酒店时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date :disabled="isEditBool" v-decorator="['inHotelTime',validatorRules.inHotelTime]" :trigger-change="true" show-type="day" <j-date :disabled="isEditBool" v-decorator="['inHotelTime',validatorRules.inHotelTime]" :trigger-change="true" show-type="day" :disabled-date="disabledStartDate"
placeholder="请选择入住酒店时间"></j-date> placeholder="请选择入住酒店时间"></j-date>
</a-form-item> </a-form-item>
</a-col> </a-col>
@@ -126,6 +126,7 @@
<a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="抵达时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date :disabled="isEditBool" placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime',validatorRules.arrivalTime]" <j-date :disabled="isEditBool" placeholder="请选择抵达时间" style="width: 100%;" v-decorator="['arrivalTime',validatorRules.arrivalTime]"
:trigger-change="true" :trigger-change="true"
:disabled-date="disabledArrivalTimeEndDate"
show-type="day" show-type="day"
date-format="YYYY-MM-DD"/> date-format="YYYY-MM-DD"/>
</a-form-item> </a-form-item>
@@ -164,6 +165,7 @@
<a-form-item label="离开时间" :labelCol="labelCol" :wrapperCol="wrapperCol"> <a-form-item label="离开时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
<j-date :disabled="isEditBool" placeholder="请选择离开时间" style="width: 100%;" v-decorator="['departureTime',validatorRules.departureTime]" <j-date :disabled="isEditBool" placeholder="请选择离开时间" style="width: 100%;" v-decorator="['departureTime',validatorRules.departureTime]"
:trigger-change="true" :trigger-change="true"
:disabled-date="disabledDepartureTimeEndDate"
show-type="day" show-type="day"
date-format="YYYY-MM-DD"/> date-format="YYYY-MM-DD"/>
</a-form-item> </a-form-item>
@@ -410,6 +412,39 @@ export default {
return startValue.valueOf() > endValue.valueOf() return startValue.valueOf() > endValue.valueOf()
}, },
/* /*
* 入住酒店时间禁用
* */
disabledStartDate(endValue){
const startValueTemp = this.form.getFieldValue('outHotelTime')
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
if (!endValue || !startValue) {
return false
}
return startValue.valueOf() < endValue.valueOf() - 86400000
},
/*
* 离开时间禁用
* */
disabledDepartureTimeEndDate(endValue) {
const startValueTemp = this.form.getFieldValue('arrivalTime')
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
if (!endValue || !startValue) {
return false
}
return startValue.valueOf() > endValue.valueOf()
},
/*
* 抵达时间禁用
* */
disabledArrivalTimeEndDate(endValue) {
const startValueTemp = this.form.getFieldValue('departureTime')
const startValue = startValueTemp && moment(startValueTemp, 'YYYY-MM-DD')
if (!endValue || !startValue) {
return false
}
return startValue.valueOf() < endValue.valueOf() - 86400000
},
/*
* 编辑回显值 * 编辑回显值
* */ * */
setFormVal(record) { setFormVal(record) {