绩效分析

src/api/salary.js

@@ -81,6 +81,11 @@ export function downloadPayroll (data) {
   return http.download('/employee/payroll/download/export', data)
 }
 
+// 工资单 - 绩效分析
+export function getPayrollStatistics (data) {
+  return http.post('/employee/payroll/organization/statistics', data)
+}
+
 // 绩效方案 分页查询
 export function getSolutionPage (data) {
   return http.post('/performance/solution/page', data)

src/components/Analysis/AnalysisChart.vue

@@ -1,6 +1,6 @@
 <template>
   <m-card shadow="never" :bodyStyle="{ position: 'relative' }">
-    <e-charts ref="chart" style="height: 400px;"></e-charts>
+    <e-charts ref="chart" :style="`height: ${height ?? 400}px;`"></e-charts>
     <el-drawer
       :visible.sync="drawer"
       direction="rtl"
@@ -23,10 +23,8 @@
 export default {
   name: 'AnalysisChart',
   props: {
-    init: {
-      type: Function,
-      default: () => ({})
-    },
+    height: [Number, String],
+    init: Function,
     option: {
       type: Object,
       default: () => ({})
@@ -65,6 +63,9 @@ export default {
   },
   methods: {
     async onInit (e) {
+      if (!this.init) {
+        return
+      }
       this.drawer = true
       this.loading = true
       try {

src/components/AutoComponents/ECharts/eCharts.js

@@ -2,7 +2,7 @@
 // 引入 ECharts 核心模块，核心模块提供了 ECharts 使用必须要的接口。
 import * as ECharts from 'echarts/core'
 // 引入柱状图图表，图表后缀都为 Chart
-import { BarChart, LineChart, TreeChart, PieChart } from 'echarts/charts'
+import { BarChart, LineChart, TreeChart, PieChart, TreemapChart } from 'echarts/charts'
 // 引入标题，提示框，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
 import {
   TitleComponent,
@@ -31,6 +31,7 @@ class EChartsComponent {
         LineChart,
         TreeChart,
         PieChart,
+        TreemapChart,
         LabelLayout,
         UniversalTransition,
         LegendComponent,

src/views/payroll/performanceAnalysis/index.vue

@@ -0,0 +1,100 @@
+<template>
+  <div class="pa-3 white">
+    <m-search class="mb-3" :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
+    <m-card v-loading="loading">
+      <m-empty v-if="!Object.keys(option).length"></m-empty>
+      <AnalysisChart v-else class="mb-3" :option="option" height="800"></AnalysisChart>
+    </m-card>
+    <!-- <AnalysisPage class="white pa-3" :search-api="getSalaryFixedStatistics" :drill-init="drillInit"></AnalysisPage> -->
+  </div>
+</template>
+
+<script>
+import AnalysisChart from '@/components/Analysis/AnalysisChart'
+import {
+  getPayrollStatistics
+} from '@/api/salary'
+import {
+  dateFormat
+} from '@/utils/date'
+export default {
+  name: 'performanceAnalysis',
+  components: {
+    AnalysisChart
+  },
+  data () {
+    return {
+      loading: false,
+      option: {},
+      searchValues: {
+        month: dateFormat('YYYY-mm', new Date())
+      },
+      searchItems: [
+        {
+          label: '月份',
+          prop: 'month',
+          type: 'datePicker',
+          options: {
+            clearable: false,
+            type: 'month',
+            format: 'yyyy-MM',
+            valueFormat: 'yyyy-MM',
+            placeholder: '选择月份'
+          }
+        }
+      ]
+    }
+  },
+  created () {
+    this.onInit()
+  },
+  methods: {
+    async onInit () {
+      this.loading = true
+      try {
+        const { data } = await getPayrollStatistics(this.searchValues)
+        if (!data.series.length) {
+          this.option = {}
+          return
+        }
+        Object.assign(data.series[0], {
+          label: {
+            show: true,
+            formatter: (v) => {
+              return `${v.name}\n\n绩效金额：${v.value} 元`
+            }
+          },
+          breadcrumb: {
+            show: true,
+            left: 'left',
+            top: 'top'
+          }
+        })
+
+        this.option = {
+          ...data
+        }
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
+    },
+    onSearch (v) {
+      this.searchValues = v
+      this.onInit()
+    }
+    // drillInit (e) {
+    //   return new Promise((resolve, reject) => {
+    //     getSalaryFixedEmployeeStatistics({
+    //       organizationNo: [e.data.organizationNo]
+    //     }).then(resolve).catch(reject)
+    //   })
+    // }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/salaryFixed/salaryFixedAnalysis/index.vue

@@ -21,7 +21,6 @@ export default {
   methods: {
     drillInit (e) {
       return new Promise((resolve, reject) => {
-        console.log(e)
         getSalaryFixedEmployeeStatistics({
           organizationNo: [e.data.organizationNo]
         }).then(resolve).catch(reject)