wuweihua
366 lines
13 KiB
Vue
366 lines
13 KiB
Vue
<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
|
|
const kw = (keyword || '').trim()
|
|
const base = { status: '1' }
|
|
// product_code / product_name are separate likes; query both and merge
|
|
const reqs = kw
|
|
? [
|
|
listProductOptions({ ...base, productCode: kw }),
|
|
listProductOptions({ ...base, productName: kw })
|
|
]
|
|
: [listProductOptions(base)]
|
|
Promise.all(reqs).then(results => {
|
|
const map = new Map()
|
|
results.forEach(res => {
|
|
;(res.data || res.rows || []).forEach(p => {
|
|
if (p && p.productCode) map.set(p.productCode, p)
|
|
})
|
|
})
|
|
// keep already-selected options visible
|
|
toList(form.value.productCodeList).forEach(code => {
|
|
if (code && !map.has(code)) {
|
|
const hit = productOptions.value.find(p => p.productCode === code)
|
|
map.set(code, hit || { productCode: code, productName: code })
|
|
}
|
|
})
|
|
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>
|