增加规则配置
This commit is contained in:
wuweihua
@@ -0,0 +1,348 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<basic-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
:search-columns="searchColumns"
|
||||
:query="queryList"
|
||||
row-key="ruleId"
|
||||
selection
|
||||
>
|
||||
<template #toolbar="{ ids }">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['data:bizRule:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="!ids.length" @click="handleDelete(ids)" v-hasPermi="['data:bizRule:remove']">删除</el-button>
|
||||
</el-col>
|
||||
</template>
|
||||
<template #col-ruleType="{ row }">
|
||||
<dict-tag :options="bms_biz_rule_type" :value="row.ruleType" />
|
||||
</template>
|
||||
<template #col-weightSource="{ row }">
|
||||
<dict-tag :options="bms_biz_weight_source" :value="row.weightSource" />
|
||||
</template>
|
||||
<template #col-weightRange="{ row }">
|
||||
{{ formatWeightRange(row) }}
|
||||
</template>
|
||||
<template #col-dim="{ row }">
|
||||
{{ formatDim(row) }}
|
||||
</template>
|
||||
<template #col-status="{ row }">
|
||||
<el-tag size="small" :type="row.status === '0' ? 'success' : 'info'">{{ row.status === '0' ? '正常' : '停用' }}</el-tag>
|
||||
</template>
|
||||
<template #col-action="{ row }">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(row)" v-hasPermi="['data:bizRule:edit']">修改</el-button>
|
||||
<el-button link type="danger" icon="Delete" @click="handleDelete([row.ruleId])" v-hasPermi="['data:bizRule:remove']">删除</el-button>
|
||||
</template>
|
||||
</basic-table>
|
||||
|
||||
<el-dialog :title="title" v-model="open" width="720px" append-to-body destroy-on-close>
|
||||
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="规则名称" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入规则名称" maxlength="100" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规则类型" prop="ruleType">
|
||||
<el-select v-model="form.ruleType" placeholder="请选择" style="width: 100%">
|
||||
<el-option v-for="d in bms_biz_rule_type" :key="d.value" :label="d.label" :value="d.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品" prop="productCodeList">
|
||||
<el-select
|
||||
v-model="form.productCodeList"
|
||||
:multiple="!isEdit"
|
||||
filterable
|
||||
remote
|
||||
clearable
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
reserve-keyword
|
||||
:placeholder="isEdit ? '空=全部产品' : '多选将按产品展开为多行，空=全部'"
|
||||
:remote-method="searchProduct"
|
||||
:loading="productLoading"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="p in productOptions"
|
||||
:key="p.productCode"
|
||||
:label="(p.productName || '') + ' (' + p.productCode + ')'"
|
||||
:value="p.productCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="国家" prop="countryCodeList">
|
||||
<el-select
|
||||
v-model="form.countryCodeList"
|
||||
:multiple="!isEdit"
|
||||
filterable
|
||||
clearable
|
||||
collapse-tags
|
||||
collapse-tags-tooltip
|
||||
:placeholder="isEdit ? '空=全部国家' : '多选将按国家展开为多行，空=全部'"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-option
|
||||
v-for="c in countryOptions"
|
||||
:key="c.countryCode2"
|
||||
:label="(c.countryNameCn || c.countryNameEn || '') + ' (' + c.countryCode2 + ')'"
|
||||
:value="c.countryCode2"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户" prop="customerCodeList">
|
||||
<customer-select
|
||||
v-model="form.customerCodeList"
|
||||
type="customer"
|
||||
value-key="customerCode"
|
||||
label-key="customerName"
|
||||
code-key="customerCode"
|
||||
:placeholder="isEdit ? '空=全部客户' : '多选将按客户展开为多行，空=全部'"
|
||||
:multiple="!isEdit"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-row :gutter="12">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="重量段最小" prop="weightMin">
|
||||
<el-input-number v-model="form.weightMin" :min="0" :precision="3" :controls="false" placeholder="KG" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="重量段最大" prop="weightMax">
|
||||
<el-input-number v-model="form.weightMax" :min="0" :precision="3" :controls="false" placeholder="KG" style="width: 100%" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="取值字段" prop="weightSource">
|
||||
<el-select v-model="form.weightSource" placeholder="请选择" style="width: 100%">
|
||||
<el-option v-for="d in bms_biz_weight_source" :key="d.value" :label="d.label" :value="d.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.ruleType === 'THREE_SIDE'" label="三边和上限" prop="sideSumMax">
|
||||
<el-input-number v-model="form.sideSumMax" :min="0" :precision="2" :controls="false" placeholder="L+W+H < 该值" style="width: 100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio value="0">正常</el-radio>
|
||||
<el-radio value="1">停用</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" :rows="2" maxlength="500" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button type="primary" @click="submitForm">确定</el-button>
|
||||
<el-button @click="open = false">取消</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="BizRuleConfig">
|
||||
import { listBizRule, getBizRule, addBizRule, updateBizRule, delBizRule } from '@/api/data/bizRule'
|
||||
import { listProductOptions } from '@/api/price/product'
|
||||
import { listRegionOptions } from '@/api/data/region'
|
||||
|
||||
const { proxy } = getCurrentInstance()
|
||||
const { bms_biz_rule_type, bms_biz_weight_source } = useDict('bms_biz_rule_type', 'bms_biz_weight_source')
|
||||
|
||||
const tableRef = ref()
|
||||
const formRef = ref()
|
||||
const open = ref(false)
|
||||
const title = ref('')
|
||||
const isEdit = ref(false)
|
||||
const productLoading = ref(false)
|
||||
const productOptions = ref([])
|
||||
const countryOptions = ref([])
|
||||
|
||||
const statusOptions = [
|
||||
{ label: '正常', value: '0' },
|
||||
{ label: '停用', value: '1' }
|
||||
]
|
||||
|
||||
const searchColumns = [
|
||||
{ label: '规则名称', prop: 'ruleName', component: 'input', placeholder: '规则名称' },
|
||||
{ label: '产品', prop: 'productCode', component: 'input', placeholder: '产品代码' },
|
||||
{ label: '国家', prop: 'countryCode', component: 'input', placeholder: 'ISO2' },
|
||||
{ label: '客户', prop: 'customerCode', component: 'input', placeholder: '客户代码' },
|
||||
{ label: '规则类型', prop: 'ruleType', component: 'select', dict: 'bms_biz_rule_type', placeholder: '请选择', props: { clearable: true } },
|
||||
{ label: '取值字段', prop: 'weightSource', component: 'select', dict: 'bms_biz_weight_source', placeholder: '请选择', props: { clearable: true } },
|
||||
{ label: '状态', prop: 'status', component: 'select', options: statusOptions, placeholder: '请选择', props: { clearable: true } }
|
||||
]
|
||||
|
||||
const columns = [
|
||||
{ label: '规则名称', prop: 'ruleName', minWidth: 160, showOverflowTooltip: true },
|
||||
{ label: '规则类型', prop: 'ruleType', align: 'center', width: 110, slot: 'ruleType' },
|
||||
{ label: '产品', prop: 'productCode', minWidth: 110, showOverflowTooltip: true },
|
||||
{ label: '国家', prop: 'countryCode', width: 90, align: 'center' },
|
||||
{ label: '客户', prop: 'customerCode', minWidth: 110, showOverflowTooltip: true },
|
||||
{ label: '重量段', prop: 'weightRange', align: 'center', width: 120, slot: 'weightRange' },
|
||||
{ label: '取值字段', prop: 'weightSource', align: 'center', width: 110, slot: 'weightSource' },
|
||||
{ label: '三边和上限', prop: 'sideSumMax', align: 'center', width: 110 },
|
||||
{ label: '状态', prop: 'status', align: 'center', width: 90, slot: 'status' },
|
||||
{ label: '备注', prop: 'remark', minWidth: 140, showOverflowTooltip: true },
|
||||
{ label: '操作', prop: 'action', align: 'center', width: 150, fixed: 'right', slot: 'action', showInToolbar: false }
|
||||
]
|
||||
|
||||
const data = reactive({
|
||||
form: {},
|
||||
rules: {
|
||||
ruleName: [{ required: true, message: '请输入规则名称', trigger: 'blur' }],
|
||||
ruleType: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
||||
weightSource: [{ required: true, message: '请选择取值字段', trigger: 'change' }],
|
||||
sideSumMax: [{
|
||||
validator: (_r, v, cb) => {
|
||||
if (form.value.ruleType === 'THREE_SIDE' && (v == null || v === '')) cb(new Error('请填写三边和上限'))
|
||||
else cb()
|
||||
},
|
||||
trigger: 'blur'
|
||||
}],
|
||||
status: [{ required: true, message: '请选择状态', trigger: 'change' }]
|
||||
}
|
||||
})
|
||||
const { form, rules } = toRefs(data)
|
||||
|
||||
function queryList(params) {
|
||||
return listBizRule(params)
|
||||
}
|
||||
|
||||
function formatWeightRange(row) {
|
||||
if (row.weightMin == null && row.weightMax == null) return '-'
|
||||
const a = row.weightMin == null ? '' : String(row.weightMin)
|
||||
const b = row.weightMax == null ? '' : String(row.weightMax)
|
||||
return a + ' ~ ' + b
|
||||
}
|
||||
|
||||
function formatDim(row) {
|
||||
return [row.productCode || '*', row.countryCode || '*', row.customerCode || '*'].join(' / ')
|
||||
}
|
||||
|
||||
function toList(v) {
|
||||
if (Array.isArray(v)) return v.filter(Boolean)
|
||||
if (v == null || v === '') return []
|
||||
return [v]
|
||||
}
|
||||
|
||||
function resetForm() {
|
||||
form.value = {
|
||||
ruleId: undefined,
|
||||
ruleName: '',
|
||||
ruleType: 'THREE_SIDE',
|
||||
productCodeList: [],
|
||||
countryCodeList: [],
|
||||
customerCodeList: [],
|
||||
weightMin: undefined,
|
||||
weightMax: undefined,
|
||||
weightSource: 'RECEIVE_WEIGHT',
|
||||
sideSumMax: 90,
|
||||
status: '0',
|
||||
remark: ''
|
||||
}
|
||||
productOptions.value = []
|
||||
}
|
||||
|
||||
function handleAdd() {
|
||||
resetForm()
|
||||
isEdit.value = false
|
||||
title.value = '新增规则'
|
||||
open.value = true
|
||||
loadCountries()
|
||||
}
|
||||
|
||||
function handleUpdate(row) {
|
||||
resetForm()
|
||||
isEdit.value = true
|
||||
getBizRule(row.ruleId).then(res => {
|
||||
const d = res.data || {}
|
||||
form.value = {
|
||||
...d,
|
||||
productCodeList: d.productCode || '',
|
||||
countryCodeList: d.countryCode || '',
|
||||
customerCodeList: d.customerCode || ''
|
||||
}
|
||||
if (d.productCode) {
|
||||
productOptions.value = [{ productCode: d.productCode, productName: d.productCode }]
|
||||
searchProduct(d.productCode)
|
||||
}
|
||||
title.value = '修改规则'
|
||||
open.value = true
|
||||
loadCountries()
|
||||
})
|
||||
}
|
||||
|
||||
function buildPayload() {
|
||||
const f = form.value
|
||||
const products = toList(f.productCodeList)
|
||||
const countries = toList(f.countryCodeList)
|
||||
const customers = toList(f.customerCodeList)
|
||||
const base = {
|
||||
ruleId: f.ruleId,
|
||||
ruleName: f.ruleName,
|
||||
ruleType: f.ruleType,
|
||||
weightMin: f.weightMin,
|
||||
weightMax: f.weightMax,
|
||||
weightSource: f.weightSource,
|
||||
sideSumMax: f.ruleType === 'THREE_SIDE' ? f.sideSumMax : null,
|
||||
status: f.status,
|
||||
remark: f.remark
|
||||
}
|
||||
if (isEdit.value) {
|
||||
return {
|
||||
...base,
|
||||
productCode: products[0] || null,
|
||||
countryCode: countries[0] || null,
|
||||
customerCode: customers[0] || null
|
||||
}
|
||||
}
|
||||
return {
|
||||
...base,
|
||||
productCodes: products,
|
||||
countryCodes: countries,
|
||||
customerCodes: customers
|
||||
}
|
||||
}
|
||||
|
||||
function submitForm() {
|
||||
formRef.value.validate(valid => {
|
||||
if (!valid) return
|
||||
const payload = buildPayload()
|
||||
const req = payload.ruleId ? updateBizRule(payload) : addBizRule(payload)
|
||||
req.then(() => {
|
||||
proxy.$modal.msgSuccess('保存成功')
|
||||
open.value = false
|
||||
tableRef.value?.refresh()
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
function handleDelete(ids) {
|
||||
if (!ids || !ids.length) return
|
||||
proxy.$modal.confirm('确认删除选中的 ' + ids.length + ' 条规则？').then(() => {
|
||||
return delBizRule(ids.join(','))
|
||||
}).then(() => {
|
||||
proxy.$modal.msgSuccess('删除成功')
|
||||
tableRef.value?.refresh()
|
||||
}).catch(() => {})
|
||||
}
|
||||
|
||||
function searchProduct(keyword) {
|
||||
productLoading.value = true
|
||||
listProductOptions({ productCode: keyword || undefined, status: '1' }).then(res => {
|
||||
const rows = res.data || res.rows || []
|
||||
const map = new Map()
|
||||
;[...productOptions.value, ...rows].forEach(p => {
|
||||
if (p && p.productCode) map.set(p.productCode, p)
|
||||
})
|
||||
productOptions.value = Array.from(map.values())
|
||||
}).finally(() => {
|
||||
productLoading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
function loadCountries() {
|
||||
if (countryOptions.value.length) return
|
||||
listRegionOptions().then(res => {
|
||||
countryOptions.value = res.data || res.rows || []
|
||||
})
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user