|
@@ -1,12 +1,93 @@
|
|
|
<template>
|
|
|
<div class="pa-3 white">
|
|
|
- <el-empty></el-empty>
|
|
|
+ <m-search :items="searchItems" v-model="searchValues" @search="onSearch"></m-search>
|
|
|
+ <m-card class="mt-3" v-loading="loading">
|
|
|
+ <m-card shadow="never" v-for="item in items" :key="item.key" class="mb-3">
|
|
|
+ <e-charts :ref="item.key" style="height: 400px;"></e-charts>
|
|
|
+ </m-card>
|
|
|
+ </m-card>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+import {
|
|
|
+ getAccumulatePointStatisticsSummary
|
|
|
+} from '@/api/accumulatePoint'
|
|
|
export default {
|
|
|
- name: 'accumulatePointsStatistics'
|
|
|
+ name: 'accumulatePointsStatistics',
|
|
|
+ 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 getAccumulatePointStatisticsSummary({
|
|
|
+ ...this.searchValues
|
|
|
+ })
|
|
|
+ this.items = Object.keys(data).map(key => {
|
|
|
+ return {
|
|
|
+ key,
|
|
|
+ value: data[key]
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.items.forEach(item => {
|
|
|
+ if (!this.chart[item.key]) {
|
|
|
+ this.chart[item.key] = this.$refs[item.key][0].onInit()
|
|
|
+ }
|
|
|
+
|
|
|
+ this.chart[item.key].setOption(item.value)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ } catch (error) {
|
|
|
+ this.$message.error(error)
|
|
|
+ } finally {
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSearch () {
|
|
|
+ this.onInit()
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|