|
|
@@ -1,72 +1,53 @@
|
|
|
<template>
|
|
|
<m-dialog ref="dialog" title="规则配置" width="1000px" @sure="onSure">
|
|
|
- <el-form ref="form" v-loading="loading" label-width="100px">
|
|
|
+ <el-form v-loading="loading" label-width="100px">
|
|
|
<el-form-item label="名称">
|
|
|
<el-tag color="primary">{{ itemData.title }}</el-tag>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="参数">
|
|
|
- <m-card shadow="never">
|
|
|
- <el-form-item label="参数分类">
|
|
|
- <el-select v-model="paramsActive" placeholder="请选择参数分类">
|
|
|
- <el-option
|
|
|
- v-for="category in categories"
|
|
|
- :key="category"
|
|
|
- :label="category"
|
|
|
- :value="category"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="参数配置" class="mt-3">
|
|
|
- <template #label>
|
|
|
- <span>参数配置</span>
|
|
|
- <el-tooltip class="item" effect="dark" content="复选框勾选代表启用项" placement="right">
|
|
|
- <span class="el-icon-info"></span>
|
|
|
- </el-tooltip>
|
|
|
- </template>
|
|
|
- <m-table
|
|
|
- shadow="never"
|
|
|
- ref="table"
|
|
|
- :items="paramsList"
|
|
|
- :headers="headers"
|
|
|
+ <el-form-item label="参数配置">
|
|
|
+ <m-table
|
|
|
+ shadow="naver"
|
|
|
+ clearHeader
|
|
|
+ :items="formQuery.items"
|
|
|
+ :headers="[
|
|
|
+ { label: '参数', prop: 'label' },
|
|
|
+ { label: '数值', prop: 'value' },
|
|
|
+ { label: '操作', prop: 'actions' }
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <div class="text-center mt-3">
|
|
|
+ <m-button icon="el-icon-plus" type="orange" size="small" @click="onAdd">添加一行</m-button>
|
|
|
+ </div>
|
|
|
+ <template #label="scope">
|
|
|
+ <el-form-item
|
|
|
+ :prop="`items.${scope.$index}.label`"
|
|
|
+ :rules="{ required: true, message: '请输入参数名称', trigger: 'blur' }"
|
|
|
>
|
|
|
- <template #status-header>
|
|
|
- <el-checkbox @change="onSelectAllChange"></el-checkbox>
|
|
|
- 启用
|
|
|
- </template>
|
|
|
- <template #status="{ row }">
|
|
|
- <el-checkbox v-model="row.status" @change="onSelectChange($event, row)"></el-checkbox>
|
|
|
- </template>
|
|
|
- <template #header>
|
|
|
- <div class="tools">
|
|
|
- <el-popover
|
|
|
- placement="top"
|
|
|
- width="500"
|
|
|
- trigger="click"
|
|
|
- >
|
|
|
- <m-table
|
|
|
- v-if="gridData.length > 0"
|
|
|
- style="border: unset"
|
|
|
- shadow="never"
|
|
|
- height="250"
|
|
|
- :items="gridData"
|
|
|
- :headers="[
|
|
|
- { label: '分类', prop: 'category' },
|
|
|
- { label: '参数名称', prop: 'name' },
|
|
|
- { label: '数值', prop: 'value', width: 100, align: 'center' }
|
|
|
- ]"
|
|
|
- ></m-table>
|
|
|
- <el-empty v-else></el-empty>
|
|
|
- <m-button slot="reference" type="orange" size="small">查看已选 {{ gridData.length }}</m-button>
|
|
|
- </el-popover>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <template #value="{ row }">
|
|
|
- <el-input-number size="mini" v-model="row.value" placeholder="请输入数值"></el-input-number>
|
|
|
- </template>
|
|
|
- </m-table>
|
|
|
- </el-form-item>
|
|
|
- </m-card>
|
|
|
+ <el-input
|
|
|
+ size="small"
|
|
|
+ v-model="formQuery.items[scope.$index].label"
|
|
|
+ placeholder="请输入值"
|
|
|
+ type="textarea"
|
|
|
+ :autosize="{ minRows: 1, maxRows: 4}"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template #value="scope">
|
|
|
+ <el-form-item
|
|
|
+ :prop="`items.${scope.$index}.value`"
|
|
|
+ :rules="{ required: true, message: '请输入值', trigger: 'blur' }"
|
|
|
+ >
|
|
|
+ <el-input-number
|
|
|
+ size="small"
|
|
|
+ v-model="formQuery.items[scope.$index].value"
|
|
|
+ placeholder="参数名称"
|
|
|
+ ></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template #actions="scope">
|
|
|
+ <m-button size="small" text type="danger" @click="onDelete(scope)">删除</m-button>
|
|
|
+ </template>
|
|
|
+ </m-table>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="计算公式">
|
|
|
<m-card shadow="never">
|
|
|
@@ -77,17 +58,32 @@
|
|
|
default-expand-all
|
|
|
:expand-on-click-node="false"
|
|
|
>
|
|
|
- <div class="custom-tree-node" slot-scope="{ data }">
|
|
|
- <el-input size="small" v-model="data.content" placeholder="描述文字"></el-input>
|
|
|
- <el-button class="ml-3" size="small" @click="onInsertAfter(data)">
|
|
|
- 同级追加
|
|
|
- </el-button>
|
|
|
- <el-button class="ml-3" size="small" @click="onAppend(data)">
|
|
|
- 插入下一级
|
|
|
- </el-button>
|
|
|
- <el-button size="small" @click="onRemove(data)">
|
|
|
- 删除
|
|
|
- </el-button>
|
|
|
+ <div class="custom-tree-node" slot-scope="{ data, node }">
|
|
|
+ <el-input size="small" v-model="data.content" style="width: 400px" placeholder="描述文字"></el-input>
|
|
|
+ <template v-if="node.level > 7">
|
|
|
+ <el-dropdown @command="e => onCommon(e, data)">
|
|
|
+ <m-button size="small" class="ml-3">
|
|
|
+ 查看更多
|
|
|
+ </m-button>
|
|
|
+ <el-dropdown-menu slot="dropdown">
|
|
|
+ <el-dropdown-item
|
|
|
+ v-for="(item, index) in btnList"
|
|
|
+ :key="item.label"
|
|
|
+ :command="index"
|
|
|
+ >{{ item.label }}</el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-button
|
|
|
+ v-for="item in btnList"
|
|
|
+ :key="item.label"
|
|
|
+ class="ml-3"
|
|
|
+ size="small"
|
|
|
+ @click="item.click(data)">
|
|
|
+ {{ item.label }}
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
</el-tree>
|
|
|
</m-card>
|
|
|
@@ -108,6 +104,14 @@ export default {
|
|
|
name: 'salary-solution-rules',
|
|
|
data () {
|
|
|
return {
|
|
|
+ btnList: [
|
|
|
+ { label: '同级追加', click: this.onInsertAfter },
|
|
|
+ { label: '插入下一级', click: this.onAppend },
|
|
|
+ { label: '删除', click: this.onRemove }
|
|
|
+ ],
|
|
|
+ formQuery: {
|
|
|
+ items: []
|
|
|
+ },
|
|
|
formula: [
|
|
|
{
|
|
|
uuid: '1',
|
|
|
@@ -130,12 +134,6 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
- paramsList () {
|
|
|
- if (!this.paramsCategoryItems[this.paramsActive]) {
|
|
|
- return []
|
|
|
- }
|
|
|
- return this.paramsCategoryItems[this.paramsActive]
|
|
|
- },
|
|
|
gridData () {
|
|
|
const _allParams = Object.values(this.paramsCategoryItems).flat()
|
|
|
if (_allParams.length === 0) {
|
|
|
@@ -200,25 +198,18 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- onSelectChange (val, row) {
|
|
|
- if (val) {
|
|
|
- this.paramsSelection.push(row.name)
|
|
|
- } else {
|
|
|
- this.paramsSelection = this.paramsSelection.filter(e => e !== row.name)
|
|
|
- }
|
|
|
+ onAdd () {
|
|
|
+ this.formQuery.items.push({ label: null, value: 0 })
|
|
|
},
|
|
|
- onSelectAllChange (val) {
|
|
|
- if (val) {
|
|
|
- this.paramsSelection = [...new Set(this.paramsSelection.concat(this.paramsList.map(e => e.name)))]
|
|
|
- } else {
|
|
|
- this.paramsSelection = this.paramsSelection.filter(e => !this.paramsList.map(e => e.name).includes(e))
|
|
|
- }
|
|
|
- this.paramsList.forEach(e => {
|
|
|
- e.status = val
|
|
|
- })
|
|
|
+ onDelete (scope) {
|
|
|
+ this.$confirm('确定要删除吗？', '提示').then(e => {
|
|
|
+ this.formQuery.items.splice(scope.$index, 1)
|
|
|
+ }).catch(_ => {})
|
|
|
},
|
|
|
onRemove (data) {
|
|
|
- this.$refs.formulaTreeRefs.remove(data)
|
|
|
+ this.$confirm('确定要删除吗？', '提示').then(e => {
|
|
|
+ this.$refs.formulaTreeRefs.remove(data)
|
|
|
+ }).catch(_ => {})
|
|
|
},
|
|
|
onInsertAfter (data) {
|
|
|
this.$refs.formulaTreeRefs.insertAfter({
|
|
|
@@ -232,6 +223,9 @@ export default {
|
|
|
content: null
|
|
|
}, data)
|
|
|
},
|
|
|
+ onCommon (index, data) {
|
|
|
+ this.btnList[index].click(data)
|
|
|
+ },
|
|
|
async onSure () {
|
|
|
if (this.paramsSelection.length === 0) {
|
|
|
this.$message.error('请选择参数')
|
zhengnaiwen_citu