SmartCommunity/commandCenter/src/views/industrialInvestment/assembly/enterpriseDistribution.vue

<!--
 * @Author: your name
 * @Date: 2022-10-10 12:24:37
 * @LastEditTime: 2022-10-10 14:30:18
 * @LastEditors: D4THYL3
 * @Description: In User Settings Edit
 * @FilePath: \commandCenter\src\views\industrialInvestment\assembly\enterpriseDistribution.vue
-->
<template>
  <div :class="valueClass == 1 ? 'modelBlock' : 'modelBlock enlarge'">
    <div class="model-title">
      <div class="model-title-text">企业类型分布</div>
    </div>
    <div class="model-content">
      <zz-echart
        :option="clientOptions"
        class="chart"
      ></zz-echart>
      <div class="totals">
        <span class="fonst-color">{{ total }}</span>
        <span class="numbers fonst-color">企业总数</span>
      </div>
    </div>
  </div>
</template>
<script>
import { ringType, ringTypeEnlarge } from './indexOptionChart';
import index from './allcommunit';
export default {
  mixins: [index],
  data () {
    return {
      mixins_query: {
        communityId: ''
      },
      valueClass: "",
      total: 0,
      clientOptions: ringType(
        [],
        [
          { value: 0, name: '餐饮业' },
          { value: 0, name: '互联网' },
          { value: 0, name: '金融业' },
          { value: 0, name: '服务业' },
        ],
        {},
        { type: '', total: 0 }
      )
    };
  },
  methods: {
    getData () {
      this.$http.get('/sc-community/statisticEnterpriseType', this.mixins_query).then(({ data, msg, status }) => {
        if (status == 0) {
          // this.clientOptions = ringType([], this.eachartObj(data), {}, { type: '', total: data.total });
          if (window.screen.width == 1920 || window.screen.width < 1920) {
            this.clientOptions = ringType([], this.eachartObj(data), {}, { type: '', total: data.total });
          } else if (window.screen.width == 2560 || window.screen.width > 1920) {
            this.clientOptions = ringTypeEnlarge([], this.eachartObj(data), {}, { type: '', total: data.total });
          }
        }
      });
    },
    eachartObj (data) {
      this.total = data.total;
      let typeName = {
        1: '互联网',
        2: '其他',
        3: '政府/事业单位',
        4: '服务业',
        5: '餐饮业'
      };
      let newData = [];
      for (let a in data.datas) {
        newData.push({
          value: data.datas[a],
          name: a
        });
      }
      return newData;
    }
  },
  created () {
    if (window.screen.width == 1920 || window.screen.width < 1920) {
      this.valueClass = 1;
      this.clientOptions = ringType(
        [],
        [
          { value: 0, name: '餐饮业' },
          { value: 0, name: '互联网' },
          { value: 0, name: '金融业' },
          { value: 0, name: '服务业' },
        ],
        {},
        { type: '', total: 0 }
      );
    } else if (window.screen.width == 2560 || window.screen.width > 1920) {
      this.valueClass = 2;
      this.clientOptions = ringTypeEnlarge(
        [],
        [
          { value: 0, name: '餐饮业' },
          { value: 0, name: '互联网' },
          { value: 0, name: '金融业' },
          { value: 0, name: '服务业' },
        ],
        {},
        { type: '', total: 0 }
      );
    }
    this.getData();
  }
};
</script>
<style lang="scss" scoped>
@import '../style.scss';
@import '../stylePc.scss';
.fonst-color {
    color: #fff;
}
</style>