绩效分配进度

src/api/process.js

@@ -0,0 +1,6 @@
+import http from '@/utils/request'
+
+// 绩效分配进度列表
+export function getPerformanceAllocationProgress (data) {
+  return http.post('/employee/performance/grant/branch/process', data)
+}

src/components/AutoComponents/MSearch/index.vue

@@ -77,7 +77,7 @@
         <el-form-item class="flex">
           <template v-if="items.length">
             <m-button class="ml-3" icon="el-icon-search" @click="onSubmit">查询</m-button>
-            <m-button class="ml-3" icon="el-icon-refresh" @click="onReset">重置</m-button>
+            <m-button v-if="showResetBtn" class="ml-3" icon="el-icon-refresh" @click="onReset">重置</m-button>
           </template>
           <slot name="button"></slot>
         </el-form-item>
@@ -97,6 +97,10 @@ export default {
     value: {
       type: Object,
       default: () => ({})
+    },
+    showResetBtn: {
+      type: Boolean,
+      default: true
     }
   },
   data () {

src/utils/request.js

@@ -11,7 +11,8 @@ import Vue from 'vue'
 import store from '@/store'
 // create an axios instance
 const service = axios.create({
-  baseURL: process.env.VUE_APP_BASE_API,
+  baseURL: 'http://192.168.3.162:7654',
+  // baseURL: process.env.VUE_APP_BASE_API,
   // baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
   // withCredentials: true, // send cookies when cross-domain requests
   timeout: 120000 // request timeout

src/views/bonus/process/index.vue

@@ -1,100 +1,61 @@
 <template>
   <div class="pa-3 white">
-    <m-search class="mb-3" :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
-    <m-table
-      v-loading="loading"
-      :items="items"
-      :headers="headers"
-      :page-size="pageInfo.size"
-      :page-current="pageInfo.current"
-      :total="total"
-      @page-change="onPageChange"
-    >
-      <template #card-tools>
-        <m-button type="orange" icon="el-icon-plus" @click="onAdd">新增</m-button>
-      </template>
-      <template #actions="{ row }">
-        <m-button type="primary" text @click="onEdit(row)">编辑</m-button>
-        <m-button type="danger" text @click="onDelete(row)">删除</m-button>
-      </template>
-    </m-table>
+    <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" :label="item.label" @hook:mounted="onComponentMounted"></component>
+      </el-tab-pane>
+    </el-tabs>
   </div>
 </template>
 
 <script>
 export default {
-  name: 'template',
+  name: 'ProcessIndex',
   data () {
     return {
-      searchItems: [
-        {
-          label: '名称',
-          prop: 'name',
-          type: 'input',
-          options: {
-            placeholder: '请输入名称'
-          }
-        }
-      ],
-      searchValues: {
-        name: null
-      },
-      headers: [
-        { label: '名称', prop: 'name' },
-        { label: '状态', prop: 'status' },
-        { label: '操作', prop: 'actions', fixed: 'right', width: 300 }
-      ],
-      items: [],
-      total: 0,
-      pageInfo: {
-        current: 1,
-        size: 10
-      },
-      loading: false
+      activeName: '',
+      items: []
     }
   },
   created () {
-    this.onInit()
+    console.log(this.$route.meta.roles)
+    this.items = this.$route.meta.roles.filter(e => e.hidden === 1).sort((a, b) => a.sort - b.sort).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
+    }
+  },
+  computed: {
+    name () {
+      return this.items.find(e => e.name === this.activeName)?.label ?? ''
+    }
   },
   methods: {
-    async onInit () {
-      this.loading = true
-      try {
-        // const { data } = await ApiName()
-        // this.items = data.records
-        // this.total = data.total
-      } catch (error) {
-        this.$message.error(error)
-      } finally {
-        this.loading = false
-      }
-    },
-    onAdd () {
-      this.$refs.templateRefs.open()
-    },
-    onEdit (item) {
-      this.$refs.templateRefs.open(item)
-    },
-    onDelete (row) {
-      this.$confirm('确定删除吗？', '提示')
-        .then(async () => {
-          try {
-            // await ApiName({ id: row.id })
-            this.$message.success('删除成功')
-            this.onInit()
-          } catch (error) {
-            this.$message.error(error)
-          }
-        })
-        .catch(_ => {})
-    },
-    onSearch () {
-      this.pageInfo.current = 1
-      this.onInit()
+    onComponentMounted () {
+      this.$nextTick(() => {
+        if (!this.$refs[this.activeName]) {
+          return
+        }
+        this.$refs[this.activeName][0].onInit && this.$refs[this.activeName][0].onInit(this.name)
+      })
     },
-    onPageChange (index) {
-      this.pageInfo.current = index
-      this.onInit()
+    handleClick () {
+      this.$router.push(`${this.$route.path}?name=${this.activeName}`)
+      this.$nextTick(() => {
+        this.$refs[this.activeName][0].onInit && this.$refs[this.activeName][0].onInit(this.name)
+      })
     }
   }
 }

src/views/bonus/process/network/index.vue

@@ -0,0 +1,115 @@
+<template>
+  <div>
+    <m-search class="mb-3" :items="searchItems" :showResetBtn="false" v-model="searchValues" @search="onSearch"></m-search>
+    <m-table
+      v-loading="loading"
+      :items="items"
+      :headers="headers"
+    >
+      <template #parentOrganizationName="{ row }">
+        {{ row.organization?.parentOrganizationName }}
+      </template>
+      <template #organizationName="{ row }">
+        {{ row.organization?.organizationName }}
+      </template>
+      <template #organizationCategory="{ row }">
+        {{ row.organization?.organizationCategory }}
+      </template>
+      <template #status="{ row }">
+        {{ row.status !== 'null' && row.status !=='undefined' ? (row.status ? '已发放' : '未发放') : '' }}
+      </template>
+      <template #performanceSalaryManageEmployees="{ row }">
+        {{ row.performanceSalaryManageEmployees && row.performanceSalaryManageEmployees?.length ? row.performanceSalaryManageEmployees.map(e => e.employeeName).join(',') : '' }}
+      </template>
+    </m-table>
+  </div>
+</template>
+
+<script>
+import { dateFormat } from '@/utils/date'
+import { mapGetters } from 'vuex'
+import { getPerformanceAllocationProgress } from '@/api/process'
+export default {
+  name: 'ProcessNetwork',
+  data () {
+    return {
+      searchValues: {
+        month: dateFormat('YYYY-mm', new Date()),
+        parentOrganizationNo: null
+      },
+      headers: [
+        { label: '月份', prop: 'month' },
+        { label: '上级机构', prop: 'parentOrganizationName' },
+        { label: '机构名称', prop: 'organizationName' },
+        { label: '机构类型', prop: 'organizationCategory' },
+        { label: '负责人', prop: 'performanceSalaryManageEmployees' },
+        { label: '绩效奖金处理状态', prop: 'status' }
+      ],
+      items: [],
+      loading: false
+    }
+  },
+  computed: {
+    ...mapGetters(['organizationTree']),
+    organizationItems () {
+      if (this.organizationTree.length > 0) {
+        return this.organizationTree[0].child
+      }
+      return []
+    },
+    searchItems () {
+      return [
+        {
+          label: '月份',
+          prop: 'month',
+          type: 'datePicker',
+          options: {
+            clearable: false,
+            type: 'month',
+            format: 'yyyy-MM',
+            valueFormat: 'yyyy-MM',
+            placeholder: '选择查询月份'
+          }
+        },
+        {
+          label: '上级机构',
+          prop: 'parentOrganizationNo',
+          type: 'select',
+          options: {
+            placeholder: '请选择上级机构',
+            items: this.organizationItems,
+            labelValue: 'organizationNo',
+            clearable: false,
+            labelText: 'organizationName'
+          }
+        }
+      ]
+    }
+  },
+  mounted () {
+    if (this.organizationTree.length > 0) {
+      this.searchValues.parentOrganizationNo = this.organizationItems[0].organizationNo
+    }
+  },
+  methods: {
+    async onInit () {
+      this.loading = true
+      try {
+        const { data } = await getPerformanceAllocationProgress(this.searchValues)
+        this.items = data || []
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onSearch () {
+      this.onInit()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  /* 自定义样式 */
+</style>

src/views/bonus/process/subBranch/components/detail.vue

@@ -0,0 +1,73 @@
+<template>
+  <m-dialog ref="dialog" title="支行绩效分配进度详情">
+    <m-table
+      shadow="never"
+      clear-header
+      :headers="headers"
+      :items="items"
+    >
+      <template #parentOrganizationName="{ row }">
+        {{ row.organization?.parentOrganizationName }}
+      </template>
+      <template #organizationName="{ row }">
+        {{ row.organization?.organizationName }}
+      </template>
+      <template #organizationCategory="{ row }">
+        {{ row.organization?.organizationCategory }}
+      </template>
+      <template #status="{ row }">
+        {{ row.status !== 'null' && row.status !=='undefined' ? (row.status ? '已发放' : '未发放') : '' }}
+      </template>
+      <template #performanceSalaryManageEmployees="{ row }">
+        {{ row.performanceSalaryManageEmployees && row.performanceSalaryManageEmployees?.length ? row.performanceSalaryManageEmployees.map(e => e.employeeName).join(',') : '' }}
+      </template>
+    </m-table>
+  </m-dialog>
+</template>
+
+<script>
+import { getPerformanceAllocationProgress } from '@/api/process'
+export default {
+  name: 'SubBranchDetail',
+
+  data () {
+    return {
+      loading: false,
+      items: [],
+      headers: [
+        { label: '月份', prop: 'month' },
+        { label: '上级机构', prop: 'parentOrganizationName' },
+        { label: '机构名称', prop: 'organizationName' },
+        { label: '机构类型', prop: 'organizationCategory' },
+        { label: '负责人', prop: 'performanceSalaryManageEmployees' },
+        { label: '绩效奖金处理状态', prop: 'status' }
+      ]
+    }
+  },
+  methods: {
+    async open (query = {}) {
+      this.items = []
+      this.loading = true
+      this.$refs.dialog.open()
+      try {
+        const { data } = await getPerformanceAllocationProgress(query)
+        this.items = data || []
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.fullWidth {
+  width: 100%;
+}
+.el-radio {
+  display: block;
+  margin-bottom: 5px;
+}
+</style>

src/views/bonus/process/subBranch/index.vue

@@ -0,0 +1,102 @@
+<template>
+  <div>
+    <m-search class="mb-3" :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
+    <m-table
+      v-loading="loading"
+      :items="items"
+      :headers="headers"
+    >
+      <template #parentOrganizationName="{ row }">
+        {{ row.organization?.parentOrganizationName }}
+      </template>
+      <template #organizationName="{ row }">
+        {{ row.organization?.organizationName }}
+      </template>
+      <template #organizationCategory="{ row }">
+        {{ row.organization?.organizationCategory }}
+      </template>
+      <template #status="{ row }">
+        {{ row.status !== 'null' && row.status !=='undefined' ? (row.status ? '已发放' : '未发放') : '' }}
+      </template>
+      <template #performanceSalaryManageEmployees="{ row }">
+        {{ row.performanceSalaryManageEmployees && row.performanceSalaryManageEmployees?.length ? row.performanceSalaryManageEmployees.map(e => e.employeeName).join(',') : '' }}
+      </template>
+      <template #actions="{ row }">
+        <m-button type="primary" text @click="onDetail(row)">详情</m-button>
+      </template>
+    </m-table>
+
+    <SubBranchDetail ref="SubBranchDetail" />
+  </div>
+</template>
+
+<script>
+import { dateFormat } from '@/utils/date'
+import { getPerformanceAllocationProgress } from '@/api/process'
+import SubBranchDetail from './components/detail.vue'
+export default {
+  name: 'ProcessSubBranch',
+  components: {
+    SubBranchDetail
+  },
+  data () {
+    return {
+      searchItems: [
+        {
+          label: '月份',
+          prop: 'month',
+          type: 'datePicker',
+          options: {
+            clearable: false,
+            type: 'month',
+            format: 'yyyy-MM',
+            valueFormat: 'yyyy-MM',
+            placeholder: '选择查询月份'
+          }
+        }
+      ],
+      searchValues: {
+        month: dateFormat('YYYY-mm', new Date())
+      },
+      headers: [
+        { label: '月份', prop: 'month' },
+        { label: '上级机构', prop: 'parentOrganizationName' },
+        { label: '机构名称', prop: 'organizationName' },
+        { label: '机构类型', prop: 'organizationCategory' },
+        { label: '负责人', prop: 'performanceSalaryManageEmployees' },
+        { label: '绩效奖金处理状态', prop: 'status' },
+        { label: '操作', prop: 'actions', fixed: 'right' }
+      ],
+      items: [],
+      loading: false
+    }
+  },
+  methods: {
+    async onInit () {
+      this.loading = true
+      try {
+        const { data } = await getPerformanceAllocationProgress(this.searchValues)
+        this.items = data || []
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onDetail (item) {
+      if (!item.organization?.organizationNo) return this.$message.warning('获取数据失败，请稍后重试！')
+      this.$refs.SubBranchDetail.open({
+        month: item.month,
+        parentOrganizationNo: item.organization?.organizationNo
+      })
+    },
+    onSearch () {
+      this.onInit()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  /* 自定义样式 */
+</style>