wangmingchuan
/
yanzong_vue_store
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

西

Browse Source
main
fanfan 6 months ago
parent 4e6cf6a3ee
commit f5b87fb608
1 changed files with 320 additions and 327 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 85
      src/views/goods/distributionPrice/Index.vue

85
src/views/goods/distributionPrice/Index.vue
Unescape View File

@ -8,59 +8,30 @@
<span>价格区间(元)</span>
<span>分销加价率%</span>
<span>利润空间(元)</span>
</div></a-form-item
>
</div>
</a-form-item>
<a-form-item v-bind="formItemLayoutWithOutLabel">
<a-button type="dashed" style="width: calc(43.5% + 8px); margin-right: 50px" @click="handleAddCondition">
<a-icon type="plus-circle" /> 新增分类模版 </a-button
><a-button type="dashed" style="width: calc(44.5% + 8px)" @click="handleAddCondition">
<a-icon type="plus-circle" /> 新增分类模版 </a-button><a-button type="dashed" style="width: calc(44.5% + 8px)" @click="handleRemoveCondition">
<a-icon type="minus-circle-o" /> 删除分类模版
</a-button>
</a-form-item>
<a-form-item
v-for="(k, index) in form.getFieldValue('fliter_condition')"
:key="k.id"
:label="index === 0 ? '分销模版' : ''"
:labelCol="labelCol"
v-bind="index === 0 ? { wrapperCol } : formItemLayoutWithOutLabel"
required
>
<a-tree-select
style="width: 100%; margin-right: 8px; margin-top: 3px"
placeholder="请选择商品分类"
:dropdownStyle="{ maxHeight: '500px', overflow: 'auto' }"
:treeData="formData.categoryList"
treeCheckable
allowClear
treeCheckStrictly
@select="onSelect(index, $event)"
@focus="handleSelectChange(index)"
v-decorator="[`category${index}`, { rules: [{ required: true, message: '请至少选择1个商品分类' }] }]"
></a-tree-select>
<a-form-item v-for="(k, index) in form.getFieldValue('fliter_condition')" :key="k.id" :label="index === 0 ? '分销模版' : ''" :labelCol="labelCol" v-bind="index === 0 ? { wrapperCol } : formItemLayoutWithOutLabel" required>
<a-tree-select style="width: 100%; margin-right: 8px; margin-top: 3px" placeholder="请选择商品分类" :dropdownStyle="{ maxHeight: '500px', overflow: 'auto' }" :treeData="formData.categoryList" treeCheckable allowClear treeCheckStrictly
@select="onSelect(index, $event)" @focus="handleSelectChange(index)" v-decorator="[`category${index}`, { rules: [{ required: true, message: '请至少选择1个商品分类' }] }]"></a-tree-select>
<div style="width: 100%">
<div class="fan">
<div class="fan" v-for="(k, index) in form.getFieldValue('fliter_condition')" :key="k.id">
<a-form-item style="margin-right: 15px; width: 33%">
<a-input
placeholder="利润值"
suffix="元"
v-decorator="[`profit${index}`, { rules: [{ required: true, message: '请输入利润值' }] }]"
style="width: 100%; margin-right: 8px; text-align: center"
/>
<a-input placeholder="利润值" suffix="元" v-decorator="[`profit${index}`, { rules: [{ required: true, message: '请输入利润值' }] }]" style="width: 100%; margin-right: 8px; text-align: center" />
</a-form-item>
<a-form-item style="margin-right: 15px; width: 33%">
<a-input
placeholder="利润率"
suffix="%"
v-decorator="[`profit_rate${index}`, { rules: [{ required: true, message: '请输入利润率' }] }]"
style="width: 100%; margin-right: 8px; text-align: center"
/>
<a-input placeholder="利润率" suffix="%" v-decorator="[`profit_rate${index}`, { rules: [{ required: true, message: '请输入利润率' }] }]" style="width: 100%; margin-right: 8px; text-align: center" />
</a-form-item>
<div style="width: 33%; text-align: center"><span>0</span>~<span>90</span></div>
</div>
<div style="width: 100%">
<a-button type="dashed" style="width: calc(40% + 8px); margin-right: 50px" @click="handleAddCondition">
<a-icon type="plus-circle" /> 新增价格区间 </a-button
><a-button type="dashed" style="width: calc(40% + 8px)" @click="handleAddCondition">
<a-button type="dashed" style="width: calc(40% + 8px); margin-right: 50px" @click="handleAddPriceRate(index)">
<a-icon type="plus-circle" /> 新增价格区间 </a-button><a-button type="dashed" style="width: calc(40% + 8px)" @click="handleRemovePriceRate(index)">
<a-icon type="minus-circle-o" /> 删除价格区间
</a-button>
</div>
@ -160,26 +131,48 @@ export default {
this.$forceUpdate()
})
},
// 删除列表
// 删除模版列表
handleRemoveCondition(index) {
const { form, $nextTick } = this
const { form } = this
const keys = form.getFieldValue('fliter_condition')
if (keys.length === 0) {
return
}
keys.splice(index, 1) // 第二个参数1表示删除一个元素
$nextTick(() => {
keys.pop()
form.setFieldsValue({
fliter_condition: keys,
})
this.$forceUpdate()
})
},
// 新增模版列表
handleAddCondition() {
const { form } = this
const key = form.getFieldValue('fliter_condition')
const keys = key ? key : []
const nextKeys = keys.concat([{ category: [], profit: '', profit_rate: '', id: this.generateRandomString(8) }])
const nextKeys = keys.concat([{ category: [], profit: [], profit_rate: [], id: this.generateRandomString(8) }])
form.setFieldsValue({
fliter_condition: nextKeys,
})
},
// 删除值列表
handleRemovePriceRate() {
const { form } = this
const keys = form.getFieldValue('fliter_condition')
if (keys.length === 0) {
return
}
keys.pop()
form.setFieldsValue({
fliter_condition: keys,
})
this.$forceUpdate()
},
// 新增值列表
handleAddPriceRate() {
const { form } = this
const key = form.getFieldValue('fliter_condition')
const keys = key ? key : []
const nextKeys = keys.concat([{ category: [], profit: [], profit_rate: [], id: this.generateRandomString(8) }])
form.setFieldsValue({
fliter_condition: nextKeys,
})

Write Preview
Loading…
Cancel
Save