迁移

2023-11-20 10:25:54 +08:00
parent 688437a068
commit a784c2c9b4
13 changed files with 1958 additions and 0 deletions
--- a/project/biaopin/AppGeneralElection/components/Statistics.vue
+++ b/project/biaopin/AppGeneralElection/components/Statistics.vue
@@ -0,0 +1,152 @@
+<template>
+  <section>
+    <ai-detail class="Statistics">
+      <template slot="title">
+        <ai-title title="投票实况" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
+      </template>
+      <template slot="content">
+        <ai-title title="本届任职" isShowBottomBorder></ai-title>
+        <div class="basicinfo-box">
+          <div><span>已投人数：</span><span>{{ data.alreadyCount || 0 }}</span></div>
+          <div><span>未投人数：</span><span>{{ data.notYetCount || 0 }}</span></div>
+          <div><span>日期：</span><span>{{ data.dateTime || '' }}</span></div>
+        </div>
+
+        <ai-title title="候选人选票统计" isShowBottomBorder></ai-title>
+
+        <div class="echarts-box">
+          <div id="echarts-bar"></div>
+          <!-- <ai-empty class="empty"></ai-empty> -->
+        </div>
+      </template>
+    </ai-detail>
+  </section>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+export default {
+  name: "Statistics",
+  props: {
+    instance: Function,
+    dict: Object,
+    params: Object,
+  },
+  data() {
+    return {
+      data: {},
+      myChart: null,
+    }
+  },
+  created() {
+    this.getStatistics()
+  },
+  mounted() {
+    this.getStaBar()
+  },
+  methods: {
+    cancel (isRefresh) {
+      this.$emit('change', {
+        type: 'electionList',
+        isRefresh: !!isRefresh
+      })
+    },
+    getStatistics() {
+      this.instance.post(`/app/appgeneralelectioninfo/statistics?id=${this.params.id}`).then(res=> {
+        if(res?.data) {
+          this.data = res.data
+          this.statistics = res.data.statistics
+          let xData = res.data.statistics.map(e=> e.candidate_user_name)
+          let yData1 = res.data.statistics.map(e=> e.c1)
+          let yData2 = res.data.statistics.map(e=> e.c2)
+          let yData3 = res.data.statistics.map(e=> e.c3)
+          this.getStaBar(xData,yData1,yData2,yData3)
+        }
+      })
+    },
+    getStaBar(xData,yData1,yData2,yData3) {
+      let chartDom = document.getElementById('echarts-bar')
+      this.myChart = echarts.init(chartDom);
+      this.myChart.setOption({
+        dataZoom: [
+          {
+            type: "slider",
+            xAxisIndex: [0],
+            filterMode: "filter",
+          },
+        ],
+        legend: {
+          data: ['支持', '反对', '弃票']
+        },
+        xAxis: {
+          type: 'category',
+          data: xData,
+        },
+        yAxis: {
+          type: 'value',
+          alignTicks: true,
+        },
+        series: [    // 支持、反对、弃票
+          {
+            name: '支持',
+            data: yData1,
+            type: 'bar',
+            
+            showBackground: true,
+            backgroundStyle: {
+              color: 'rgba(180, 180, 180, 0.2)'
+            },
+            barWidth: 22,
+            barGap: '20%',
+          },
+          {
+            name: '反对',
+            data: yData2,
+            type: 'bar',
+            
+            showBackground: true,
+            backgroundStyle: {
+              color: 'rgba(180, 180, 180, 0.2)'
+            },
+            barWidth: 22,
+            barGap: '20%',
+          },
+          {
+            name: '弃票',
+            data: yData3,
+            type: 'bar',
+            
+            showBackground: true,
+            backgroundStyle: {
+              color: 'rgba(180, 180, 180, 0.2)'
+            },
+            barWidth: 22,
+            barGap: '20%',
+          }
+        ]
+      })
+    }
+  },
+
+}
+</script>
+
+<style lang="scss" scoped>
+.Statistics {
+  .basicinfo-box {
+    display: flex;
+    margin: 20px 0;
+    div {
+      flex: 1;
+    }
+  }
+  .echarts-box {
+    // width: 100%;
+
+    #echarts-bar {
+      width: 1200px;
+      height: 400px;
+    }
+  }
+}
+</style>