分析公共组件

src/api/salary.js

@@ -145,3 +145,13 @@ export function getSalaryFixedList (data) {
 export function getSalaryLevelDict () {
   return http.post('/salary/level/manage/dict')
 }
+
+// 固定工资统计分析 机构固定薪资趋势图
+export function getSalaryFixedStatistics (data) {
+  return http.post('/organization/basic/salary/month/trend', data)
+}
+
+// 固定工资统计分析 员工固定薪资趋势图
+export function getSalaryFixedEmployeeStatistics (data) {
+  return http.post('/employee/basic/salary/month/trend', data)
+}

src/views/accumulatePoints/accumulatePointsStatistics/accumulatePointsStatisticsTop.vue → src/components/Analysis/AnalysisChart.vue

@@ -20,12 +20,13 @@
 </template>
 
 <script>
-import {
-  getAccumulatePointStatisticsTop
-} from '@/api/accumulatePoint'
 export default {
-  name: 'accumulatePointsStatisticsTop',
+  name: 'AnalysisChart',
   props: {
+    init: {
+      type: Function,
+      default: () => ({})
+    },
     option: {
       type: Object,
       default: () => ({})
@@ -67,9 +68,7 @@ export default {
       this.drawer = true
       this.loading = true
       try {
-        const { data } = await getAccumulatePointStatisticsTop({
-          organizationNo: e.data.organizationNo
-        })
+        const { data } = await this.init(e)
         if (!this.drawerChart) {
           this.drawerChart = this.$refs.drawerChart.onInit()
         }

src/components/Analysis/index.vue

@@ -0,0 +1,100 @@
+<template>
+  <div>
+    <m-search :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
+    <m-card class="mt-3" v-loading="loading">
+      <AnalysisChart class="mb-3" v-for="item in items" :key="item.key" :option="item.value" :init="drillInit"></AnalysisChart>
+      <el-empty v-if="items.length === 0"></el-empty>
+    </m-card>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import AnalysisChart from './AnalysisChart.vue'
+export default {
+  name: 'AnalysisPage',
+  props: {
+    searchApi: {
+      type: Function,
+      default: () => ({})
+    },
+    drillInit: {
+      type: Function,
+      default: () => ({})
+    }
+  },
+  components: {
+    AnalysisChart
+  },
+  data () {
+    return {
+      chart: {},
+      loading: false,
+      searchValues: {
+        parentOrganizationNo: null
+      },
+      items: []
+    }
+  },
+  computed: {
+    ...mapGetters(['organizationTree']),
+    searchItems () {
+      return [
+        {
+          label: '机构',
+          type: 'cascader',
+          prop: 'parentOrganizationNo',
+          options: {
+            filterable: true,
+            clearable: true,
+            placeholder: '请选择机构',
+            options: this.organizationTree,
+            showAllLevels: false,
+            props: {
+              emitPath: false,
+              checkStrictly: true,
+              value: 'organizationNo',
+              label: 'organizationName',
+              children: 'child'
+            }
+          }
+        }
+      ]
+    }
+  },
+  mounted () {
+    this.searchValues.parentOrganizationNo = this.organizationTree[0].organizationNo
+    this.onInit()
+  },
+  methods: {
+    async onInit () {
+      this.loading = true
+      try {
+        const { data } = await this.searchApi({
+          ...this.searchValues
+        })
+        this.items = Object.keys(data).map(key => {
+          return {
+            key,
+            value: data[key]
+          }
+        })
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onSearch () {
+      if (this.searchValues.parentOrganizationNo === null) {
+        this.searchValues.parentOrganizationNo = this.organizationTree[0].organizationNo
+      }
+      this.onInit()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/accumulatePoints/accumulatePointsStatistics/index.vue

@@ -1,87 +1,31 @@
 <template>
-  <div class="pa-3 white">
-    <m-search :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
-    <m-card class="mt-3" v-loading="loading">
-      <AccumulatePointsStatisticsTop class="mb-3" v-for="item in items" :key="item.key" :option="item.value"></AccumulatePointsStatisticsTop>
-    </m-card>
-  </div>
+  <AnalysisPage class="white pa-3" :search-api="getAccumulatePointStatisticsSummary" :drill-init="drillInit"></AnalysisPage>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
 import {
-  getAccumulatePointStatisticsSummary
+  getAccumulatePointStatisticsSummary,
+  getAccumulatePointStatisticsTop
 } from '@/api/accumulatePoint'
-import AccumulatePointsStatisticsTop from './accumulatePointsStatisticsTop.vue'
+import AnalysisPage from '@/components/Analysis'
 export default {
   name: 'accumulatePointsStatistics',
   components: {
-    AccumulatePointsStatisticsTop
+    AnalysisPage
   },
   data () {
     return {
-      chart: {},
-      loading: false,
-      searchValues: {
-        parentOrganizationNo: null
-      },
-      items: []
+      getAccumulatePointStatisticsSummary
     }
   },
-  computed: {
-    ...mapGetters(['organizationTree']),
-    searchItems () {
-      return [
-        {
-          label: '机构',
-          type: 'cascader',
-          prop: 'parentOrganizationNo',
-          options: {
-            filterable: true,
-            clearable: true,
-            placeholder: '请选择机构',
-            options: this.organizationTree,
-            showAllLevels: false,
-            props: {
-              emitPath: false,
-              checkStrictly: true,
-              value: 'organizationNo',
-              label: 'organizationName',
-              children: 'child'
-            }
-          }
-        }
-      ]
-    }
-  },
-  mounted () {
-    this.searchValues.parentOrganizationNo = this.organizationTree[0].organizationNo
-    this.onInit()
-  },
   methods: {
-    async onInit () {
-      this.loading = true
-      try {
-        const { data } = await getAccumulatePointStatisticsSummary({
-          ...this.searchValues
-        })
-        this.items = Object.keys(data).map(key => {
-          return {
-            key,
-            value: data[key]
-          }
-        })
-      } catch (error) {
-        this.$message.error(error)
-      } finally {
-        this.loading = false
-      }
-    },
-    onSearch () {
-      if (this.searchValues.parentOrganizationNo === null) {
-        this.searchValues.parentOrganizationNo = this.organizationTree[0].organizationNo
-      }
-      this.onInit()
+    drillInit (e) {
+      return new Promise((resolve, reject) => {
+        console.log(e)
+        getAccumulatePointStatisticsTop({
+          organizationNo: e.data.organizationNo
+        }).then(resolve).catch(reject)
+      })
     }
   }
 }

src/views/salaryFixed/salaryFixedAnalysis/index.vue

@@ -1,12 +1,33 @@
 <template>
-  <div class="pa-3 white">
-    <el-empty></el-empty>
-  </div>
+  <AnalysisPage class="white pa-3" :search-api="getSalaryFixedStatistics" :drill-init="drillInit"></AnalysisPage>
 </template>
 
 <script>
+import AnalysisPage from '@/components/Analysis'
+import {
+  getSalaryFixedStatistics,
+  getSalaryFixedEmployeeStatistics
+} from '@/api/salary'
 export default {
-  name: 'salaryFixedAnalysis'
+  name: 'SalaryFixedAnalysis',
+  components: {
+    AnalysisPage
+  },
+  data () {
+    return {
+      getSalaryFixedStatistics
+    }
+  },
+  methods: {
+    drillInit (e) {
+      return new Promise((resolve, reject) => {
+        console.log(e)
+        getSalaryFixedEmployeeStatistics({
+          organizationNo: [e.data.organizationNo]
+        }).then(resolve).catch(reject)
+      })
+    }
+  }
 }
 </script>