福利待遇

src/api/salary.js

@@ -34,5 +34,15 @@ export function updateConfig (param) {
 
 // 福利待遇 - 分页查询
 export function getWelfarePage (param) {
+  return http.post('/subsidy/category/page', param)
+}
+
+// 福利待遇 - 明细查询
+export function getWelfareDetail (param) {
+  return http.post('/subsidy/category/detail', param)
+}
+
+// 福利待遇 - 福利类型 分页查询
+export function getWelfareCategoryPage (param) {
   return http.post('/subsidy/personnel/category/page', param)
 }

src/views/humanResources/welfare/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="white pa-3">
-    <el-tabs v-model="activeName" @tab-click="handleClick">
+    <el-tabs v-model="activeName">
       <el-tab-pane label="福利待遇列表" name="welfareList">
         <welfare-list></welfare-list>
       </el-tab-pane>

src/views/humanResources/welfare/welfareList.vue

@@ -1,6 +1,10 @@
 <template>
   <div>
-    <m-search :items="searchItems" v-model="searchValues" @search="search" class="mb-3"></m-search>
+    <m-search :items="searchItems" v-model="searchValues" @search="onSearch" class="mb-3">
+      <template #button>
+        <m-button type="primary" icon="el-icon-plus" @click="onAdd">新增</m-button>
+      </template>
+    </m-search>
     <m-table
       :items="items"
       :headers="headers"
@@ -9,38 +13,42 @@
       :page-size="pageInfo.size"
       :page-current="pageInfo.current"
       @page-change="onPageChange"
-    ></m-table>
+    >
+      <template #actions="{ row }">
+        <m-button text type="primary" size="small" @click="onEdit(row)">编辑</m-button>
+        <m-button text type="danger" size="small" @click="onDelete(row)">删除</m-button>
+      </template>
+    </m-table>
+    <welfareListEdit ref="welfareListEditRefs" :title="title"></welfareListEdit>
   </div>
 </template>
 
 <script>
 import {
-  getWelfarePage
+  getWelfarePage,
+  getWelfareDetail
 } from '@/api/salary'
+import welfareListEdit from './welfareListEdit.vue'
 export default {
   name: 'welfare-list',
+  components: {
+    welfareListEdit
+  },
   data () {
     return {
+      title: '',
       searchItems: [
         {
-          label: '业务类别',
+          label: '福利名称',
           name: 'name',
           type: 'input',
           option: {
-            placeholder: '请输入业务类别'
-          }
-        },
-        {
-          label: '职务/岗位',
-          name: 'jobNumber',
-          type: 'input',
-          option: {
-            placeholder: '请输入职务/岗位'
+            placeholder: '请输入补助名称'
           }
         },
         {
-          label: '补助分类',
-          name: 'jobNumber',
+          label: '福利类别',
+          name: 'subsidyPersonnelCategoryId',
           type: 'autocomplete',
           option: {
             placeholder: '请输入补助分类',
@@ -51,16 +59,24 @@ export default {
       searchValues: {},
       headers: [
         {
-          label: '姓名',
-          name: 'name'
+          label: '福利名称',
+          prop: 'name'
+        },
+        {
+          label: '福利类别',
+          prop: 'subsidyPersonnelCategoryId'
+        },
+        {
+          label: '金额（元 / 月）',
+          prop: 'subsidySalary'
         },
         {
-          label: '工号',
-          name: 'jobNumber'
+          label: '描述',
+          prop: 'subsidyTag'
         },
         {
-          label: '部门',
-          name: 'department'
+          label: '操作',
+          prop: 'actions'
         }
       ],
       items: [],
@@ -69,27 +85,52 @@ export default {
       pageInfo: {
         current: 1,
         size: 10
-      }
-
+      },
+      orders: []
     }
   },
+  created () {
+    this.init()
+  },
   methods: {
     async init () {
       try {
-        const { data } = await getWelfarePage()
-        console.log(data)
+        const { data } = await getWelfarePage({
+          entity: this.searchValues,
+          page: {
+            ...this.pageInfo,
+            orders: this.orders
+          }
+        })
+        this.items = data.records
+        this.total = data.total
       } catch (error) {
-        this.$snackbar.error(error)
+        this.$message.error(error)
       }
     },
-    search () {
-      console.log(this.searchValues)
+    onSearch () {
+      this.pageInfo.current = 1
+      this.init()
     },
     onPageChange (page) {
       this.pageInfo.current = page
       this.init()
     },
-    fetchSuggestions () {}
+    fetchSuggestions (str, cb) {},
+    onAdd () {
+      this.title = '新增福利'
+      this.$refs.welfareListEditRefs.open()
+    },
+    async onEdit (item) {
+      this.title = '编辑福利'
+      try {
+        const { data } = await getWelfareDetail({ id: item.subsidyCategoryId })
+        this.$refs.welfareListEditRefs.open(data)
+      } catch (error) {
+        this.$message.error(error)
+      }
+    },
+    onDelete () {}
   }
 }
 </script>

src/views/humanResources/welfare/welfareListEdit.vue

@@ -0,0 +1,113 @@
+<template>
+  <m-dialog ref="dialog" v-bind="$attrs" v-on="$listeners">
+    <m-form :items="items" label-width="180px" v-model="values"></m-form>
+  </m-dialog>
+</template>
+
+<script>
+import { getWelfareCategoryPage } from '@/api/salary'
+export default {
+  name: 'welfare-list-edit',
+  data () {
+    return {
+      loading: false,
+      subsidyPersonnelCategoryIdItems: [],
+      values: {}
+    }
+  },
+  computed: {
+    items () {
+      return [
+        {
+          label: '福利名称',
+          prop: 'name',
+          type: 'input',
+          options: {
+            placeholder: '请输入福利名称'
+          },
+          rules: [
+            { required: true, message: '请输入福利名称', trigger: 'blur' }
+          ]
+        },
+        {
+          label: '福利类型',
+          prop: 'subsidyPersonnelCategoryId',
+          type: 'select',
+          options: {
+            placeholder: '请选择福利类型',
+            filterable: true,
+            remote: true,
+            remoteMethod: this.remoteMethod,
+            loading: this.loading,
+            items: this.subsidyPersonnelCategoryIdItems
+          },
+          rules: [
+            { required: true, message: '请选择福利类型', trigger: 'change' }
+          ]
+        },
+        {
+          label: '金额（元 / 月）',
+          prop: 'subsidySalary',
+          type: 'number',
+          options: {
+            placeholder: '请输入金额'
+          },
+          rules: [
+            { required: true, message: '请输入金额', trigger: 'blur' }
+          ]
+        },
+        {
+          label: '福利限制',
+          prop: 'subsidyCheck',
+          type: 'radioGroup',
+          options: {
+            items: [
+              { text: '全额', label: 0 },
+              { text: '不超过', label: 1 }
+            ]
+          },
+          rules: [
+            { required: true, message: '请输入金额', trigger: 'blur' }
+          ]
+        },
+        {
+          label: '描述',
+          prop: 'subsidyTag',
+          type: 'input',
+          options: {
+            placeholder: '请输入描述'
+          }
+        }
+      ]
+    }
+  },
+  methods: {
+    open () {
+      this.$refs.dialog.open()
+    },
+    async remoteMethod (query) {
+      if (query) {
+        this.loading = true
+        try {
+          const { data } = await getWelfareCategoryPage({
+            page: {
+              size: 9999,
+              current: 1
+            }
+          })
+          this.subsidyPersonnelCategoryIdItems = data.records
+        } catch (error) {
+          this.subsidyPersonnelCategoryIdItems = []
+          this.$message.error(error)
+        }
+      } else {
+        this.subsidyPersonnelCategoryIdItems = []
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>