|
@@ -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>
|