调整绩效规则新增编辑操作流程

src/views/salary/solution/components/ListTemplate.vue

@@ -16,9 +16,9 @@
       @page-change="onPageChange"
       @sort-change="onSortChange"
     >
-      <template #save_status="{ row }">
+      <!-- <template #save_status="{ row }">
         <el-tag :type="row.save_status === 1 ? 'success' : 'danger'">{{ row.save_status === 1 ? '已保存规则' : '未保存规则'}}</el-tag>
-      </template>
+      </template> -->
       <template #card-tools>
         <slot name="tool"></slot>
       </template>
@@ -67,7 +67,7 @@ export default {
       headers: [
         { label: '名称', prop: 'title' },
         { label: '描述', prop: 'tag' },
-        { label: '状态', prop: 'save_status' },
+        // { label: '状态', prop: 'save_status' },
         { label: '创建日期', prop: 'createDate' },
         { label: '操作', prop: 'actions' }
       ],

src/views/salary/solution/salarySolution/index.vue

@@ -51,7 +51,7 @@ export default {
   methods: {
     onInit () {
       this.$nextTick(() => {
-        this.$refs.listTemplateRefs.onInit()
+        this.$refs.listTemplateRefs.getList()
       })
     },
     async onSend (row) {

src/views/salary/solution/salarySolution/salarySolutionEdit.vue

@@ -1,6 +1,15 @@
 <template>
-  <m-dialog ref="dialog" :title="itemData.entity ? '编辑' : '新增'" @sure="onSure">
+  <m-dialog
+    ref="dialog"
+    :title="itemData.entity ? '编辑' : '新增'"
+    :option="{
+      textSure: itemData.entity ? '保存' : '下一步'
+    }"
+    @sure="onSure"
+  >
     <m-form ref="form" v-model="formQuery" :items="items" v-loading="loading"></m-form>
+
+    <SalarySolutionRules ref="salarySolutionRulesRefs" append-to-body @refresh="onRefresh"></SalarySolutionRules>
   </m-dialog>
 </template>
 
@@ -10,6 +19,7 @@ import {
   saveSolutionSimple,
   getSolutionDetails
 } from '@/api/salary'
+import SalarySolutionRules from './salarySolutionRules.vue'
 import {
   getPostNameByOrganizationNo
 // getOrganizationAtlasPostName
@@ -17,6 +27,9 @@ import {
 import { mapGetters } from 'vuex'
 export default {
   name: 'salary-solution-edit',
+  components: {
+    SalarySolutionRules
+  },
   data () {
     return {
       loading: false,
@@ -116,6 +129,9 @@ export default {
       if (!item) {
         return
       }
+      this.itemData = {
+        entity: {}
+      }
       this.loading = true
       try {
         const { data } = await getSolutionDetails({
@@ -130,6 +146,10 @@ export default {
         this.loading = false
       }
     },
+    onRefresh () {
+      this.$refs.dialog.close()
+      this.$emit('refresh')
+    },
     async onchange (organizationNo) {
       const nodes = this.$refs.form.$refs.organizationNo.getCheckedNodes()
       this.formQuery.organizationName = nodes[0].data.organizationName
@@ -161,15 +181,18 @@ export default {
               ...this.formQuery
             }
           }
+          if (Object.keys(this.itemData).length === 0) {
+            // 新增规则 下一步
+            this.$refs.salarySolutionRulesRefs.open(query.entity)
+            return
+          }
           this.loading = true
-          // console.log(this.itemData)
           const submitApi = this.itemData.entity ? saveSolutionSimple : saveSolution
-          // debugger
           try {
             await submitApi(query)
+            this.$message.success('保存成功')
             this.$refs.dialog.close()
             this.$emit('refresh')
-            this.$message.success('保存成功')
           } catch (error) {
             this.$message.error(error)
           } finally {

src/views/salary/solution/salarySolution/salarySolutionRules.vue

@@ -1,10 +1,11 @@
 <template>
-  <m-dialog ref="dialog" title="规则配置" width="1200px" @sure="onSure">
+  <m-dialog ref="dialog" title="规则配置" width="1200px" v-bind="$attrs" @sure="onSure">
     <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="类型">
+      <SalarySolutionRulesEdit ref="salarySolutionRulesEditRefs"></SalarySolutionRulesEdit>
+      <!-- <el-form-item label="参数配置">
         <template v-slot:default>
           <el-tabs type="card" addable v-model="editableTabsValue" @edit="onTabsEdit">
             <el-tab-pane
@@ -33,6 +34,7 @@
           </el-tabs>
         </template>
       </el-form-item>
+      <el-form-item label="计算公式"></el-form-item> -->
       <el-form-item label="提交说明">
         <el-input v-model="versionTag" placeholder="请输入本次修改的记录描述"></el-input>
       </el-form-item>
@@ -57,9 +59,9 @@ export default {
   data () {
     return {
       versionTag: null,
-      editableTabsValue: '1',
-      editableTabs: [],
-      ids: 1,
+      // editableTabsValue: '1',
+      // editableTabs: [],
+      // ids: 1,
       itemData: {},
       loading: false
     }
@@ -70,31 +72,36 @@ export default {
       this.versionTag = null
       this.$refs.dialog.open()
       this.loading = true
-      this.ids = 1
-      this.editableTabsValue = '1'
+      // this.ids = 1
+      // this.editableTabsValue = '1'
+      if (!item.performanceSolutionId) {
+        this.loading = false
+        this.$nextTick(() => {
+          this.$refs.salarySolutionRulesEditRefs.setValue({ calculateConfigurations: [], calculateFormulas: [] })
+        })
+        return
+      }
       try {
         const { data } = await getSolutionDetails({
           performanceSolutionId: item.performanceSolutionId
         })
-        if (!data.performanceSolutionDetailRespCategoryVos.length) {
-          this.editableTabs = [{
-            title: '类型1',
-            name: '1'
-          }]
-          return
-        }
-        this.editableTabs = data.performanceSolutionDetailRespCategoryVos.map((e, index) => {
-          const key = String(index + 1)
-          return {
-            title: e.category,
-            name: key
-          }
-        })
-        this.ids = this.editableTabs.length
+        // if (!data.performanceSolutionDetailRespCategoryVos.length) {
+        //   this.editableTabs = [{
+        //     title: '类型1',
+        //     name: '1'
+        //   }]
+        //   return
+        // }
+        // this.editableTabs = data.performanceSolutionDetailRespCategoryVos.map((e, index) => {
+        //   const key = String(index + 1)
+        //   return {
+        //     title: e.category,
+        //     name: key
+        //   }
+        // })
+        // this.ids = this.editableTabs.length
         this.$nextTick(() => {
-          this.$refs.salarySolutionRulesEditRefs.forEach((e, index) => {
-            e.setValue(data.performanceSolutionDetailRespCategoryVos[index])
-          })
+          this.$refs.salarySolutionRulesEditRefs.setValue(data.performanceSolutionDetailRespCategoryVos[0])
         })
       } catch (error) {
         this.$message.error(error)
@@ -102,56 +109,58 @@ export default {
         this.loading = false
       }
     },
-    onTabsEdit (targetName, action) {
-      if (action === 'add') {
-        this.ids++
-        this.editableTabs.push(
-          { title: '类型' + this.ids, name: String(this.ids) }
-        )
-      }
-      if (action === 'remove') {
-        if (this.editableTabs.length === 1) {
-          this.$message.error('至少保留一个分类')
-          return
-        }
-        const index = this.editableTabs.findIndex(tab => tab.name === targetName)
-        this.editableTabs.splice(index, 1)
-        if (index === 0) {
-          this.editableTabsValue = this.editableTabs[0].name
-          return
-        }
-        if (targetName === this.editableTabsValue) {
-          this.editableTabsValue = this.editableTabs[index - 1].name
-        }
-      }
-    },
+    // onTabsEdit (targetName, action) {
+    //   if (action === 'add') {
+    //     this.ids++
+    //     this.editableTabs.push(
+    //       { title: '类型' + this.ids, name: String(this.ids) }
+    //     )
+    //   }
+    //   if (action === 'remove') {
+    //     if (this.editableTabs.length === 1) {
+    //       this.$message.error('至少保留一个分类')
+    //       return
+    //     }
+    //     const index = this.editableTabs.findIndex(tab => tab.name === targetName)
+    //     this.editableTabs.splice(index, 1)
+    //     if (index === 0) {
+    //       this.editableTabsValue = this.editableTabs[0].name
+    //       return
+    //     }
+    //     if (targetName === this.editableTabsValue) {
+    //       this.editableTabsValue = this.editableTabs[index - 1].name
+    //     }
+    //   }
+    // },
     async onSure () {
       // 验证
-      Promise.all(this.$refs.salarySolutionRulesEditRefs.map(e => e.valid())).then(async data => {
+      this.$refs.salarySolutionRulesEditRefs.valid().then(async data => {
         if (!this.versionTag) {
           this.$message.error('请填写提交说明')
           return
         }
+        const query = {
+          entity: {
+            performanceSolutionId: this.itemData.performanceSolutionId,
+            env: this.env,
+            versionTag: this.versionTag,
+            versionType: 0 // 规则变更
+          },
+          performanceSolutionDetailRespCategoryVos: [data]
+        }
+        if (!this.itemData.performanceSolutionId) {
+          Object.assign(query.entity, this.itemData)
+        }
         try {
-          await saveSolution({
-            entity: {
-              performanceSolutionId: this.itemData.performanceSolutionId,
-              env: this.env,
-              versionTag: this.versionTag,
-              versionType: 0 // 规则变更
-            },
-            performanceSolutionDetailRespCategoryVos: data
-          })
+          await saveSolution(query)
           this.$refs.dialog.close()
           this.$emit('refresh')
           this.$message.success('保存成功')
         } catch (error) {
           this.$message.error(error)
         }
-      }).catch(error => {
-        console.log(error)
-        this.editableTabsValue = error.name
-        this.$message.error('请填充完整')
+      }).catch(_ => {
+        this.$message.error('请填充完整参数配置')
       })
     }
   }

src/views/salary/solution/salarySolution/salarySolutionRulesEdit.vue

@@ -1,80 +1,133 @@
 <template>
-  <m-card shadow="never">
-    <div>
-      <div class="d-flex mb-3">
-        <div class="boxLabel">参数配置</div>
-        <div class="boxContent">
-          <m-table
-            ref="tableRefs"
-            shadow="naver"
-            clearHeader
-            :items="items"
-            row-key="index"
-            :headers="[
-              { type: 'expand', prop: 'expandProp' },
-              { label: '参数', prop: 'name' },
-              { label: '参数类型', prop: 'valueCategory' },
-              { label: '操作', prop: 'actions' }
-            ]"
-          >
-            <template #expandProp="{ $index }">
-              <SalarySolutionRulesEditParam :ref="`salarySolutionRulesEditParamRefs${$index}`" v-model="items[$index]"></SalarySolutionRulesEditParam>
-            </template>
-            <div class="text-center mt-3">
-              <m-button icon="el-icon-plus" type="orange" size="small" @click="onAdd">添加参数</m-button>
-            </div>
-            <template #valueCategory="{ row }">
-              {{ DICT_CATEGORY.find(item => item.value === row.valueCategory)?.label }}
-            </template>
-            <template #actions="scope">
-              <m-button size="small" text type="danger" @click="onDelete(scope)">移除</m-button>
-            </template>
-          </m-table>
+  <!-- <m-card shadow="never"> -->
+  <div>
+    <el-form-item label="参数配置">
+      <m-card shadow="never">
+        <el-row>
+          <el-col :span="8">参数名称</el-col>
+          <el-col :span="4" class="text-center">初始值</el-col>
+          <el-col :span="5" class="text-center">最小值 （是否启用）</el-col>
+          <el-col :span="5" class="text-center">最大值 （是否启用）</el-col>
+          <el-col :span="2">操作</el-col>
+        </el-row>
+        <el-row
+          v-for="(row, index) in items"
+          :key="row.key"
+        >
+          <el-col :span="8">
+            <el-input v-model="row.name" placeholder="请输入参数名称" size="small"></el-input>
+          </el-col>
+          <el-col :span="4" class="text-center">
+            <el-input-number v-model="row.value" placeholder="初始值" size="small"></el-input-number>
+          </el-col>
+          <el-col :span="5" class="text-center">
+            <el-input-number :disabled="!row.miniValueActive" v-model="row.miniValue" placeholder="最小值" size="small"></el-input-number>
+            <el-switch active-color="#13ce66" class="ml-3" v-model="row.miniValueActive"></el-switch>
+          </el-col>
+          <el-col :span="5" class="text-center">
+            <el-input-number :disabled="!row.maxValueActive" v-model="row.maxValue" placeholder="最大值" size="small"></el-input-number>
+            <el-switch active-color="#13ce66" class="ml-3" v-model="row.maxValueActive"></el-switch>
+          </el-col>
+          <el-col :span="2">
+            <m-button :disabled="items.length === 1" size="small" type="danger" @click="onDelete(index)">移除</m-button>
+          </el-col>
+        </el-row>
+        <div class="text-center mt-3">
+          <m-button type="orange" size="small" @click="onAdd">添加一个参数</m-button>
         </div>
+      </m-card>
+    </el-form-item>
+    <!-- <div class="d-flex mb-3">
+      <div class="boxLabel">参数配置</div>
+      <div class="boxContent">
+        <m-table
+          ref="tableRefs"
+          shadow="naver"
+          clearHeader
+          :items="items"
+          row-key="index"
+          :headers="[
+            { type: 'expand', prop: 'expandProp' },
+            { label: '参数', prop: 'name' },
+            { label: '参数类型', prop: 'valueCategory' },
+            { label: '操作', prop: 'actions' }
+          ]"
+        >
+          <template #expandProp="{ $index }">
+            <SalarySolutionRulesEditParam :ref="`salarySolutionRulesEditParamRefs${$index}`" v-model="items[$index]"></SalarySolutionRulesEditParam>
+          </template>
+          <div class="text-center mt-3">
+            <m-button icon="el-icon-plus" type="orange" size="small" @click="onAdd">添加参数</m-button>
+          </div>
+          <template #valueCategory="{ row }">
+            {{ DICT_CATEGORY.find(item => item.value === row.valueCategory)?.label }}
+          </template>
+          <template #actions="scope">
+            <m-button size="small" text type="danger" @click="onDelete(scope)">移除</m-button>
+          </template>
+        </m-table>
       </div>
-      <div class="d-flex">
-        <div class="boxLabel">计算公式</div>
-        <div class="boxContent">
-          <m-card shadow="never">
-            <Toolbar
-              style="border-bottom: 1px solid #eee"
-              :editor="editor"
-              :defaultConfig="toolbarConfig"
+    </div>
+    <div class="d-flex">
+      <div class="boxLabel">计算公式</div>
+      <div class="boxContent">
+        <m-card shadow="never">
+          <Toolbar
+            style="border-bottom: 1px solid #eee"
+            :editor="editor"
+            :defaultConfig="toolbarConfig"
+            :mode="mode"
+          />
+          <Editor
+              style="height: 250px; overflow-y: hidden;"
+              v-model="formulaData"
+              :defaultConfig="editorConfig"
               :mode="mode"
-            />
-            <Editor
-                style="height: 250px; overflow-y: hidden;"
-                v-model="formulaData"
-                :defaultConfig="editorConfig"
-                :mode="mode"
-                @onCreated="onCreated"
-            />
-          </m-card>
-        </div>
+              @onCreated="onCreated"
+          />
+        </m-card>
       </div>
-    </div>
-  </m-card>
+    </div> -->
+
+    <el-form-item label="计算公式">
+      <m-card shadow="never">
+        <Toolbar
+          style="border-bottom: 1px solid #eee"
+          :editor="editor"
+          :defaultConfig="toolbarConfig"
+          :mode="mode"
+        />
+        <Editor
+            style="height: 250px; overflow-y: hidden;"
+            v-model="formulaData"
+            :defaultConfig="editorConfig"
+            :mode="mode"
+            @onCreated="onCreated"
+        />
+      </m-card>
+    </el-form-item>
+  </div>
+  <!-- </m-card> -->
 </template>
 
 <script>
 import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
 import '@wangeditor/editor/dist/css/style.css'
-import SalarySolutionRulesEditParam from './salarySolutionRulesEditParam.vue'
-import {
-  DICT_CATEGORY
-} from '../utils/Dict'
+// import {
+//   DICT_CATEGORY
+// } from '../utils/Dict'
 export default {
   name: 'salarySolutionRulesRulesEdit',
-  components: { Editor, Toolbar, SalarySolutionRulesEditParam },
-  props: {
-    item: {
-      type: Object,
-      default: () => ({})
-    }
-  },
+  components: { Editor, Toolbar },
+  // props: {
+  //   item: {
+  //     type: Object,
+  //     default: () => ({})
+  //   }
+  // },
   data () {
     return {
-      DICT_CATEGORY,
+      // DICT_CATEGORY,
       editor: null,
       formulaData: '',
       toolbarConfig: {
@@ -88,7 +141,19 @@ export default {
       },
       editorConfig: { placeholder: '请输入内容...' },
       mode: 'default', // or 'simple'
-      items: []
+      id: 0,
+      items: [
+        {
+          key: 0,
+          miniValue: 0,
+          miniValueActive: true,
+          maxValue: 1,
+          maxValueActive: true,
+          name: null,
+          value: 0,
+          valueCategory: 0
+        }
+      ]
     }
   },
   beforeDestroy () {
@@ -101,59 +166,68 @@ export default {
       this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错
     },
     onAdd () {
-      const item = {
-        index: this.items.length,
+      // const item = {
+      //   index: this.items.length,
+      //   name: null,
+      //   valueCategory: 0
+      // }
+      this.items.push({
+        key: this.id++,
+        miniValue: 0,
+        miniValueActive: true,
+        maxValue: 1,
+        maxValueActive: true,
         name: null,
+        value: 0,
         valueCategory: 0
-      }
-      this.items.push(item)
-      const ref = this.$refs.tableRefs.getRefs()
-      ref.toggleRowExpansion(item)
+      })
+      // const ref = this.$refs.tableRefs.getRefs()
+      // ref.toggleRowExpansion(item)
     },
-    onDelete (scope) {
-      this.$confirm('确定要移除改组参数吗？', '提示').then(e => {
-        this.items.splice(scope.$index, 1)
-      }).catch(_ => {})
+    onDelete (index) {
+      this.items.splice(index, 1)
+      // this.$confirm('确定要移除改组参数吗？', '提示').then(e => {
+      //   this.items.splice(scope.$index, 1)
+      // }).catch(_ => {})
     },
     valid () {
       return new Promise((resolve, reject) => {
         const check = this.items.every(e => {
-          if (!e.name) {
-            return false
-          }
-          if (e.valueCategory !== 0) {
-            return e.value.every(_e => {
-              return (_e.name === null && _e.value === null) || (_e.name !== null && _e.value !== null)
-            })
-          }
-          return true
+          return e.name && e.value !== null && (!e.miniValueActive || e.miniValue !== null) && (!e.maxValueActive || e.maxValue !== null)
         })
         if (!check) {
-          reject(this.item)
+          reject(check)
         } else {
           resolve(this.getValue())
         }
       })
     },
     setValue (data) {
-      this.items = data.calculateConfigurations.map((e, index) => {
-        if (e.valueCategory !== 0) {
-          const { value, ...obj } = e
-          return {
-            index,
-            value: JSON.parse(value),
-            ...obj
+      this.id = 0
+      this.formulaData = data.calculateFormulas.length ? data.calculateFormulas[0].content : ''
+      if (!data.calculateConfigurations.length) {
+        this.items = [
+          {
+            key: 0,
+            miniValue: 0,
+            miniValueActive: true,
+            maxValue: 1,
+            maxValueActive: true,
+            name: null,
+            value: 0,
+            valueCategory: 0
           }
-        }
+        ]
+        return
+      }
+      this.items = data.calculateConfigurations.map(e => {
         return {
-          index,
+          key: this.id++,
+          maxValueActive: e.maxValue !== null,
+          miniValueActive: e.miniValue !== null,
           ...e
         }
       })
-      this.formulaData = data.calculateFormulas.length ? data.calculateFormulas[0].content : ''
-      // this.$nextTick(() => {
-      //   this.formulaData = data.calculateFormulas.length ? data.calculateFormulas[0].content : ''
-      // })
     },
     getValue () {
       const calculateConfigurations = this.items.map(e => {
@@ -161,45 +235,47 @@ export default {
           name,
           valueCategory,
           miniValue,
+          miniValueActive,
           maxValue,
+          maxValueActive,
           value
         } = e
-        if (valueCategory === 0) {
-          return {
-            name,
-            valueCategory,
-            miniValue: miniValue ?? null,
-            maxValue: maxValue ?? null,
-            value
-          }
-        }
-        const _value = JSON.stringify(value.map(_e => {
-          return {
-            name: _e.name,
-            value: _e.value
-          }
-        }))
-        if (valueCategory === 1) {
-          return {
-            name,
-            valueCategory,
-            value: _value
-          }
-        }
+        // if (valueCategory === 0) {
         return {
           name,
           valueCategory,
-          miniValue: miniValue ?? null,
-          maxValue: maxValue ?? null,
-          value: _value
+          miniValue: miniValueActive ? miniValue : null,
+          maxValue: maxValueActive ? maxValue : null,
+          value: value.toString()
         }
+        // }
+        // const _value = JSON.stringify(value.map(_e => {
+        //   return {
+        //     name: _e.name,
+        //     value: _e.value
+        //   }
+        // }))
+        // if (valueCategory === 1) {
+        //   return {
+        //     name,
+        //     valueCategory,
+        //     value: _value
+        //   }
+        // }
+        // return {
+        //   name,
+        //   valueCategory,
+        //   miniValue: miniValue ?? null,
+        //   maxValue: maxValue ?? null,
+        //   value: _value
+        // }
       })
       return {
-        category: this.item.title,
+        category: '类型',
         calculateConfigurations,
         calculateFormulas: [
           {
-            category: this.item.title,
+            category: '类型',
             content: this.formulaData
           }
         ]