<template>
|
<a-modal
|
title="批量修改设置"
|
:width="640"
|
:visible="visible"
|
:confirmLoading="loading"
|
@ok="() => { $emit('ok') }"
|
@cancel="() => { $emit('cancel') }"
|
>
|
<a-spin :spinning="loading">
|
<a-form
|
:form="form"
|
v-bind="formLayout"
|
:model="model"
|
>
|
<a-form-item label="修改类型" name="radType">
|
<a-radio-group v-model:value="model.radType" v-decorator="['radType', {rules: [{required: true, message: '请选择修改类型'}]}]">
|
<a-radio value="add_regular">增加固定金额</a-radio>
|
<a-radio value="add_scale">增加百分比</a-radio>
|
</a-radio-group>
|
</a-form-item>
|
<a-form-item v-if="model.radType=='add_regular'" label="固定金额(元)" name="priceValue">
|
<a-input style="width: 50%" prefix="￥" suffix="RMB" v-model:value="model.priceValue" v-decorator="['priceValue', {rules: [{required: true, message: '请填写固定金额'}]}]"/>
|
</a-form-item>
|
<a-form-item v-if="model.radType=='add_scale'" label="百分比(%)" name="rateValue">
|
<a-input style="width: 50%" prefix="+" suffix="%" v-model:value="model.rateValue" v-decorator="['rateValue', {rules: [{required: true, message: '请填写百分比'}]}]"/>
|
</a-form-item>
|
<a-form-item label="是否覆盖历史修改" name="radHistory">
|
<a-radio-group v-model:value="model.radHistory" v-decorator="['radHistory', {rules: [{required: true, message: '请选择是否覆盖历史修改'}]}]">
|
<a-radio value="0">否</a-radio>
|
<a-radio value="1">是</a-radio>
|
</a-radio-group>
|
</a-form-item>
|
<a-form-item label="邮费(元)" name="postfee">
|
<a-input style="width: 50%" prefix="￥" suffix="RMB" v-model:value="model.postfee"/>
|
</a-form-item>
|
<a-form-item label="价格区间" name="rangePrice">
|
<a-input style="width: 40%" prefix="￥" suffix="RMB" v-model:value="model.minPrice"/>-<a-input style="width: 40%" prefix="￥" suffix="RMB" v-model:value="model.maxPrice"/>
|
</a-form-item>
|
</a-form>
|
</a-spin>
|
</a-modal>
|
|
</template>
|
|
<script>
|
import pick from 'lodash.pick'
|
|
const fields = ['radType', 'priceValue', 'rateValue', 'radHistory', 'postfee', 'rangePrice']
|
export default {
|
props: {
|
visible: {
|
type: Boolean,
|
required: true
|
},
|
loading: {
|
type: Boolean,
|
default: () => false
|
},
|
|
model: {
|
type: Object,
|
default: () => null
|
}
|
},
|
data () {
|
this.formLayout = {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 7 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 13 }
|
}
|
}
|
return {
|
form: this.$form.createForm(this)
|
}
|
},
|
created () {
|
// 防止表单未注册
|
fields.forEach(v => this.form.getFieldDecorator(v))
|
// 当 model 发生改变时，为表单设置值
|
this.$watch('model', () => {
|
this.model && this.form.setFieldsValue(pick(this.model, fields))
|
console.log(this.model)
|
})
|
}
|
}
|
</script>
|
