dy-admin-manager/src/views/main/baseinfo/index.vue

<template>
  <div class="container">
    <save-form inline :model="search" @submit="FetchDetail" @reset="FetchDetail">
      <el-form-item prop="year">
        <el-date-picker
          v-model="search.year"
          type="year"
          :picker-options="{
            disabledDate(time) {
              return time.getTime() > Date.now()
            }
          }"
          placeholder="请选择年份">
        </el-date-picker>
      </el-form-item>
      <el-form-item prop="organIds">
        <el-select
          multiple
          clearable
          filterable
          collapse-tags
          v-model="search.organIds"
        >
          <el-option v-for="(item,index) in selects.branchs"
            :key="index"
            :label="item.name"
            :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-button native-type="submit" type="primary">搜索</el-button>
      <el-button native-type="reset" type="danger">重置</el-button>
    </save-form>
    <empty desc="暂无统计数据" v-if="isEmpty"/>
    <el-row v-else class="rows" :gutter="20">
      <el-col :xs="24" :sm="24" :md="12" :span="7">
        <operate :data="dataInfo"/>
      </el-col>
      <el-col :xs="24" :sm="24" :md="12" :span="7">
        <business :data="dataInfo"/>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :span="10">
        <management :data="dataInfo"/>
      </el-col>
      <el-col :xs="24" :sm="24" :md="12" :span="7">
        <hrdata :data="dataInfo"/>
      </el-col>
      <el-col :xs="24" :sm="24" :md="12" :span="7">
        <student :data="dataInfo"/>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :span="10">
        <curriculum :data="dataInfo"/>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import { getIndex } from '../api'
import operate from './operate'
import business from './business'
import management from './management'
import hrdata from './hr'
import student from './student'
import curriculum from './curriculum'

export default {
  components: {
    operate,
    business,
    management,
    hrdata,
    student,
    curriculum,
  },
  data () {
    return {
      search: {
        year: '',
        organIds: []
      },
      dataInfo: {},
      business: {},
    }
  },
  computed: {
    isEmpty() {
      return !Object.keys(this.dataInfo).length
    }
  },
  mounted () {
    this.FetchDetail();
    this.$store.dispatch('setBranchs')
  },
  methods: {
    async FetchDetail() {
      const data = {}
      try {
        const res = await getIndex({
          ...this.search,
          year: this.$helpers.dayjs(this.search.year).year() || '',
          organIds: this.search.organIds.join(',')
        })
        for (const item of res.data) {
          data[item.dataType] = item
        }
      } catch (error) {
        console.log(error)
      }
      this.dataInfo = data
    },
  }
}
</script>
<style lang="less" scoped>
  .container{
    overflow: hidden;
    .rows{
      >div{
        margin-bottom: 20px;
      }
    }
  }
</style>