福利待遇

src/components/AutoComponents/MDialog/index.vue

@@ -97,6 +97,9 @@ export default {
     },
     sure () {
       this.$emit('sure')
+      if (!this.$listeners.sure) {
+        this.show = false
+      }
     }
   }
 }

src/components/AutoComponents/MSearch/index.vue

@@ -8,7 +8,9 @@
       size="small"
       :show-message="false"
       inline-message
+      @submit.native.prevent
     >
+
     <template v-for="(item, index) in items">
         <el-form-item
           v-if="!item.hidden"
@@ -90,6 +92,7 @@ export default {
   },
   data () {
     return {
+      searchQuery: null,
       query: { ...this.value }
     }
   },

src/components/DrawerHistory/index.vue

@@ -73,7 +73,6 @@ export default {
       this.loading = true
       try {
         const { data, total } = await this.getPage(this.pageInfo)
-        console.log(data, total)
         this.items.push(...data)
         this.total = total
       } catch (error) {

src/views/humanResources/welfare/components/ListTemplate.vue

@@ -0,0 +1,119 @@
+<template>
+  <div v-loading="loading">
+    <m-search v-if="showSearch" class="mb-3" :items="searchItems" v-model="searchQuery" @search="onSearch" @reset="onSearch">
+      <template #button>
+        <slot name="button"></slot>
+      </template>
+    </m-search>
+    <m-table
+      :items="items"
+      :headers="headers"
+      :total="total"
+      :page-size="pageInfo.size"
+      :page-current="pageInfo.current"
+      v-bind="$attrs"
+      @page-change="onPageChange"
+    >
+      <template #title="{ row }">
+        {{ row.subsidyPersonnelCategory?.title ?? '找不到该项福利' }}
+      </template>
+      <template #actions="{ row }">
+        <slot name="actions" :row="row"></slot>
+      </template>
+    </m-table>
+  </div>
+</template>
+
+<script>
+import {
+  getWelfarePage
+} from '@/api/welfare'
+export default {
+  name: 'human-resources-welfare-list',
+  props: {
+    showSearch: {
+      type: Boolean,
+      default: true
+    },
+    history: {
+      type: Boolean,
+      default: false
+    },
+    uuid: String
+  },
+  data () {
+    return {
+      searchQuery: {
+        subsidyName: null
+      },
+      searchItems: [
+        {
+          label: '福利名称',
+          prop: 'subsidyName',
+          type: 'input',
+          option: {
+            placeholder: '请输入福利名称'
+          }
+        }
+      ],
+      items: [],
+      headers: [
+        { label: '福利名称', prop: 'subsidyName' },
+        { label: '福利描述', prop: 'subsidyTag' },
+        { label: '创建日期', prop: 'createDate' },
+        { label: '操作', prop: 'actions' }
+      ],
+      loading: false,
+      total: 0,
+      pageInfo: {
+        current: 1,
+        size: 10
+      }
+    }
+  },
+  // created () {
+  //   this.onInit()
+  // },
+  methods: {
+    async onInit () {
+      this.loading = true
+      try {
+        const { data } = await getWelfarePage({
+          page: {
+            ...this.pageInfo,
+            orders: [
+              {
+                asc: false,
+                column: 'subsidy_id'
+              }
+            ]
+          },
+          entity: {
+            ...this.searchQuery,
+            history: this.history ? 1 : 0,
+            uuid: this.uuid
+          }
+        })
+        this.items = data.records
+        this.total = data.total
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onSearch () {
+      this.pageInfo.current = 1
+      this.onInit()
+    },
+    onPageChange (page) {
+      this.pageInfo.current = page
+      this.onInit()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/humanResources/welfare/index.vue

@@ -1,136 +1,96 @@
 <template>
   <div class="white pa-3">
-    <m-search class="mb-3" :items="searchItems" v-model="searchQuery" @search="onSearch" @reset="onSearch">
-      <template #button>
-        <m-button type="primary" icon="el-icon-plus" @click="onAdd">新增</m-button>
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane
+        v-for="item in items"
+        :key="item.name"
+        :label="item.label"
+        :name="item.name"
+      >
+        <component :is="item.component" :ref="item.name" @mounted="onComponentMounted" @history="onHistory"></component>
+      </el-tab-pane>
+    </el-tabs>
+    <DrawerHistory ref="drawerHistoryRefs" :get-page="getPage">
+      <template #panel="{ item }">
+        <el-form label-position="left" class="m-form" label-width="120">
+          <el-form-item label="福利名称">
+            <el-tag>{{ itemData.subsidyName }}</el-tag>
+          </el-form-item>
+          <el-form-item label="配置机构">
+            <div>
+              <el-tag v-for="(_name, i) in item.subsidyOrganizationNames" :key="i" type="info" class="mr-3">
+                {{ _name }}
+              </el-tag>
+            </div>
+          </el-form-item>
+          <el-form-item label="福利薪资">
+            <span>{{ item.subsidySalary }}</span>
+          </el-form-item>
+          <el-form-item label="描述">
+            <span>{{ item.subsidyCheck }}</span>
+          </el-form-item>
+        </el-form>
       </template>
-    </m-search>
-    <m-table
-      :items="items"
-      :headers="headers"
-      :loading="loading"
-      :total="total"
-      :page-size="pageInfo.size"
-      :page-current="pageInfo.current"
-      @page-change="onPageChange"
-    >
-      <template #title="{ row }">
-        {{ row.subsidyPersonnelCategory?.title ?? '找不到该项福利' }}
-      </template>
-      <template #actions="{ row }">
-        <m-button text type="primary" size="small" @click="onEdit(row)">编辑</m-button>
-        <m-button text type="primary" size="small" @click="onEditRules(row)">规则配置</m-button>
-        <m-button text type="danger" size="small" @click="onDelete(row)">删除</m-button>
-        <m-button text type="primary" size="small" @click="onHistory(row)">历史配置</m-button>
-      </template>
-    </m-table>
-    <WelfareEdit ref="welfareEditRefs" @refresh="onInit"></WelfareEdit>
-    <WelfareRules ref="WelfareRulesRefs" @refresh="onInit"></WelfareRules>
-    <welfareHistory ref="welfareHistoryRefs"></welfareHistory>
+    </DrawerHistory>
   </div>
 </template>
 
 <script>
+import DrawerHistory from '@/components/DrawerHistory'
 import {
-  getWelfarePage,
-  deleteWelfare
+  getWelfareDetail
 } from '@/api/welfare'
-import WelfareEdit from './welfareEdit.vue'
-import WelfareRules from './welfareRules'
-import welfareHistory from './welfareHistory'
 export default {
   name: 'human-resources-welfare',
   components: {
-    WelfareEdit,
-    welfareHistory,
-    WelfareRules
+    DrawerHistory
   },
   data () {
     return {
-      searchQuery: {
-        subsidyName: null
-      },
-      searchItems: [
-        {
-          label: '福利名称',
-          prop: 'subsidyName',
-          type: 'input'
-        }
-      ],
+      activeName: '',
       items: [],
-      headers: [
-        { label: '福利名称', prop: 'subsidyName' },
-        { label: '福利描述', prop: 'subsidyTag' },
-        { label: '创建日期', prop: 'createDate' },
-        { label: '操作', prop: 'actions' }
-      ],
-      loading: false,
-      total: 0,
-      pageInfo: {
-        current: 1,
-        size: 10
-      },
-      title: ''
+      itemData: {}
     }
   },
   created () {
-    this.onInit()
+    this.items = this.$route.meta.roles.filter(e => e.hidden === 1).sort((a, b) => b - a).map(e => {
+      return {
+        name: e.name,
+        label: e.label,
+        component: () => import(`./${e.component}/index.vue`)
+      }
+    })
+    if (this.$route.query.name) {
+      this.activeName = this.$route.query.name
+    } else {
+      this.activeName = this.items[0].name
+    }
   },
   methods: {
-    async onInit () {
-      try {
-        const { data } = await getWelfarePage({
-          page: {
-            ...this.pageInfo,
-            orders: [
-              {
-                asc: false,
-                column: 'subsidy_id'
-              }
-            ]
-          },
-          ...this.searchQuery
-        })
-        this.items = data.records
-        this.total = data.total
-      } catch (error) {
-        this.$message.error(error)
-      }
-    },
-    onEdit (item) {
-      this.$refs.welfareEditRefs.open(item)
+    onComponentMounted () {
+      this.$nextTick(() => {
+        this.$refs[this.activeName][0].onInit()
+      })
     },
-    onSearch () {
-      this.pageInfo.current = 1
-      this.onInit()
-    },
-    onAdd () {
-      this.$refs.welfareEditRefs.open()
-    },
-    onEditRules (item) {
-      this.$refs.WelfareRulesRefs.open(item)
-    },
-    onDelete (item) {
-      this.$confirm(`确定删除${item.subsidyName}吗？`, '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(async () => {
-        try {
-          await deleteWelfare({ subsidyId: item.subsidyId })
-          this.$message.success('删除成功')
-          this.onInit()
-        } catch (error) {
-          this.$message.error(error)
-        }
-      }).catch(_ => {})
-    },
-    onPageChange (page) {
-      this.pageInfo.current = page
-      this.onInit()
+    handleClick () {
+      this.$router.push(`${this.$route.path}?name=${this.activeName}`)
+      this.$nextTick(() => {
+        this.$refs[this.activeName][0].onInit()
+      })
     },
     onHistory (row) {
-      this.$refs.welfareHistoryRefs.open(row)
+      this.itemData = row
+      this.$refs.drawerHistoryRefs.open(`${row.subsidyName} 历史记录`)
+    },
+    async getPage () {
+      return new Promise((resolve, reject) => {
+        getWelfareDetail({ subsidyId: this.itemData.subsidyId }).then(({ data }) => {
+          resolve({
+            data: data.subsidyItems,
+            total: data.subsidyItems.length
+          })
+        }).catch(reject)
+      })
     }
   }
 }

src/views/humanResources/welfare/welfareHistory.vue

@@ -1,87 +0,0 @@
-<template>
-  <DrawerHistory ref="drawerHistoryRefs" :get-page="getPage">
-    <template #panel="{ item }">
-      <h3 class="mb-3 title">{{ item.subsidyName }}</h3>
-      <el-form label-position="left" class="m-form">
-        <el-form-item label="机构名称">
-          <span>{{ item.subsidyOrganizationNames }}</span>
-        </el-form-item>
-        <el-form-item label="福利薪资">
-          <span>{{ item.subsidySalary }}</span>
-        </el-form-item>
-        <el-form-item label="福利条件描述">
-          <span>{{ item.subsidyCheck }}</span>
-        </el-form-item>
-      </el-form>
-    </template>
-  </DrawerHistory>
-</template>
-
-<script>
-import {
-  getWelfarePage
-} from '@/api/welfare'
-import DrawerHistory from '@/components/DrawerHistory'
-import { dateFormat } from '@/utils/date'
-export default {
-  name: 'welfare-history',
-  components: {
-    DrawerHistory
-  },
-  data () {
-    return {
-      uuid: null
-    }
-  },
-  methods: {
-    async open (item) {
-      this.uuid = item.uuid
-      this.$refs.drawerHistoryRefs.open(`历史记录 - ${item.subsidyName}`)
-    },
-    getPage (pageInfo) {
-      return new Promise((resolve, reject) => {
-        getWelfarePage({
-          page: {
-            ...pageInfo,
-            orders: [
-              {
-                asc: false,
-                column: 'create_date'
-              }
-            ]
-          },
-          history: 1,
-          uuid: this.uuid
-        }).then(({ data }) => {
-          resolve({
-            data: data.records.map(({ createDate, ...e }) => {
-              return {
-                ...e,
-                createDate: dateFormat('YYYY-mm-dd HH:MM:SS', new Date(createDate))
-              }
-            }),
-            total: data.total
-          })
-        }).catch(reject)
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-.title {
-  color: #666;
-}
-::v-deep .m-form label{
-  width: 90px;
-  color: #99a9bf;
-  text-align: right;
-}
-::v-deep .m-form .el-form-item {
-  margin-right: 0;
-  margin-bottom: 0;
-  width: 50%;
-}
-</style>

src/views/humanResources/welfare/welfareHistory/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <ListTemplate ref="listTemplateRefs" history>
+      <template #actions="{ row }">
+        <m-button type="primary" text @click="$emit('history', row)" size="small">查看配置规则</m-button>
+      </template>
+    </ListTemplate>
+  </div>
+</template>
+
+<script>
+import ListTemplate from '../components/ListTemplate.vue'
+export default {
+  name: 'welfare-history',
+  components: {
+    ListTemplate
+  },
+  mounted () {
+    this.$emit('mounted')
+  },
+  methods: {
+    onInit () {
+      this.$refs.listTemplateRefs.onInit()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/humanResources/welfare/welfareList/historyDialog.vue

@@ -0,0 +1,40 @@
+<template>
+  <m-dialog ref="dialog" :title="title + ' 历史记录'">
+    <ListTemplate ref="listTemplateRefs" history :show-search="false" shadow="never" :uuid="uuid">
+      <template #actions="{ row }">
+        <slot name="actions" :row="row"></slot>
+      </template>
+    </ListTemplate>
+  </m-dialog>
+</template>
+
+<script>
+import ListTemplate from '../components/ListTemplate.vue'
+export default {
+  name: 'history-dialog',
+  components: {
+    ListTemplate
+  },
+  data () {
+    return {
+      uuid: null,
+      title: null
+    }
+  },
+  methods: {
+    open (uuid, title) {
+      this.uuid = uuid
+      this.title = title
+      this.$refs.dialog.open()
+      this.$nextTick(() => {
+        console.log(111, this.$refs)
+        this.$refs.listTemplateRefs.onInit()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/humanResources/welfare/welfareList/index.vue

@@ -0,0 +1,80 @@
+<template>
+  <div>
+    <ListTemplate ref="listTemplateRefs">
+      <template #button>
+        <m-button type="primary" icon="el-icon-plus" @click="onAdd">新增</m-button>
+      </template>
+      <template #actions="{ row }">
+        <m-button text type="primary" size="small" @click="onEdit(row)">编辑</m-button>
+        <m-button text type="primary" size="small" @click="onEditRules(row)">规则配置</m-button>
+        <m-button text type="danger" size="small" @click="onDelete(row)">删除</m-button>
+        <m-button text type="primary" size="small" @click="onHistory(row)">历史记录</m-button>
+      </template>
+    </ListTemplate>
+    <WelfareEdit ref="welfareEditRefs" @refresh="onInit"></WelfareEdit>
+    <WelfareRules ref="welfareRulesRefs" @refresh="onInit"></WelfareRules>
+    <HistoryDialog ref="historyDialogRefs">
+      <template #actions="{ row }">
+        <m-button type="primary" text @click="$emit('history', row)" size="small">查看配置规则</m-button>
+      </template>
+    </HistoryDialog>
+  </div>
+</template>
+
+<script>
+import ListTemplate from '../components/ListTemplate.vue'
+import {
+  deleteWelfare
+} from '@/api/welfare'
+import WelfareEdit from './welfareEdit.vue'
+import WelfareRules from './welfareRules'
+import HistoryDialog from './historyDialog'
+export default {
+  name: 'human-resources-welfare-list',
+  components: {
+    ListTemplate,
+    WelfareEdit,
+    WelfareRules,
+    HistoryDialog
+  },
+  mounted () {
+    this.$emit('mounted')
+  },
+  methods: {
+    onInit () {
+      this.$refs.listTemplateRefs.onInit()
+    },
+    onEdit (item) {
+      this.$refs.welfareEditRefs.open(item)
+    },
+    onAdd () {
+      this.$refs.welfareEditRefs.open()
+    },
+    onEditRules (item) {
+      this.$refs.welfareRulesRefs.open(item)
+    },
+    onDelete (item) {
+      this.$confirm(`确定删除${item.subsidyName}吗？`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        try {
+          await deleteWelfare({ subsidyId: item.subsidyId })
+          this.$message.success('删除成功')
+          this.onInit()
+        } catch (error) {
+          this.$message.error(error)
+        }
+      }).catch(_ => {})
+    },
+    onHistory (row) {
+      this.$refs.historyDialogRefs.open(row.uuid, row.subsidyName)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/system/menu/menuEdit.vue

@@ -3,6 +3,7 @@
     <MForm ref="editForm" :items="editForm" v-model="editValues">
       <template #parentId>
         <el-popover
+          v-model="popover"
           placement="bottom"
           width="600"
           trigger="click">
@@ -41,6 +42,7 @@ export default {
   name: 'menu-edit',
   data () {
     return {
+      popover: false,
       itemsParents: [],
       editValues: {},
       currentNodeName: null,
@@ -217,6 +219,7 @@ export default {
     nodeClick (v) {
       this.currentNodeName = v.label
       this.editValues.parentId = v.id
+      this.popover = false
     }
   }
 }