6 changed files with 735 additions and 28 deletions
			
			
		@ -0,0 +1,179 @@ | 
				
			|||||
 | 
					
 | 
				
			||||
 | 
					export function pieOption (_charts) { | 
				
			||||
 | 
					const center= ['50%', '250px'] | 
				
			||||
 | 
					  return { | 
				
			||||
 | 
					    title: { | 
				
			||||
 | 
					      text: '0', | 
				
			||||
 | 
					      top: 220, | 
				
			||||
 | 
					      left: 'center', | 
				
			||||
 | 
					      textStyle: { | 
				
			||||
 | 
					        width: '100%', | 
				
			||||
 | 
					        fontSize: 32, | 
				
			||||
 | 
					        color: '#FFFFFF', | 
				
			||||
 | 
					        fontWeight: 400 | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					      itemGap: 5, | 
				
			||||
 | 
					      subtext: '总数', | 
				
			||||
 | 
					      subtextStyle: { | 
				
			||||
 | 
					        fontSize: 20, | 
				
			||||
 | 
					        color: '#fff', | 
				
			||||
 | 
					        fontWeight: 400 | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    tooltip: { | 
				
			||||
 | 
					      show: false | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    legend: { | 
				
			||||
 | 
					      top: 500, | 
				
			||||
 | 
					      bottom: 0, | 
				
			||||
 | 
					      itemWidth: 20, | 
				
			||||
 | 
					      itemHeight: 10, | 
				
			||||
 | 
					      textStyle: { | 
				
			||||
 | 
					        color: '#D2E7FF', | 
				
			||||
 | 
					        fontSize: 16, | 
				
			||||
 | 
					        lineHeight: 20, | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					     | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    series: [ | 
				
			||||
 | 
					      // 外侧圆环
 | 
				
			||||
 | 
					      { | 
				
			||||
 | 
					        type: 'pie', | 
				
			||||
 | 
					        // 起始刻度的角度,默认为 90 度,即圆心的正上方。0 度为圆心的正右方。
 | 
				
			||||
 | 
					        startAngle: 0, | 
				
			||||
 | 
					        hoverAnimation: false, | 
				
			||||
 | 
					        // tooltip: {
 | 
				
			||||
 | 
					        // },
 | 
				
			||||
 | 
					        center: center, | 
				
			||||
 | 
					        radius: ['55%', '55.3%'], | 
				
			||||
 | 
					        label: { | 
				
			||||
 | 
					          show: false | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        labelLine: { | 
				
			||||
 | 
					          show: false | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        data: [{ | 
				
			||||
 | 
					          value: 360, | 
				
			||||
 | 
					          itemStyle: { | 
				
			||||
 | 
					            color: 'rgba(40, 101, 250, 0)', | 
				
			||||
 | 
					            width:0, | 
				
			||||
 | 
					            borderColor: 'rgba(40, 101, 250, 0.5)', | 
				
			||||
 | 
					            borderWidth: 1, | 
				
			||||
 | 
					            borderType: 'dotted' | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					        ] | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      // 突出的
 | 
				
			||||
 | 
					      { | 
				
			||||
 | 
					        hoverAnimation: false, | 
				
			||||
 | 
					        // name: 'Access From',
 | 
				
			||||
 | 
					        type: 'pie', | 
				
			||||
 | 
					        center: center, | 
				
			||||
 | 
					        radius: ['40%', '60%'], | 
				
			||||
 | 
					        avoidLabelOverlap: false, | 
				
			||||
 | 
					        // top: top + '%',
 | 
				
			||||
 | 
					        // height: '80%',
 | 
				
			||||
 | 
					        selectedMode: 'single', | 
				
			||||
 | 
					        left: 'center', | 
				
			||||
 | 
					        width: 400, | 
				
			||||
 | 
					        label: { | 
				
			||||
 | 
					          // show: false,
 | 
				
			||||
 | 
					          position: 'outside', | 
				
			||||
 | 
					          alignTo: 'edge', | 
				
			||||
 | 
					          // formatter: '{a|{c}}\n\n{name|{b}}',
 | 
				
			||||
 | 
					          formatter: '{a|{c}}\n{r|}\n{name|{b}}', | 
				
			||||
 | 
					          minMargin: 5, | 
				
			||||
 | 
					          edgeDistance: -20, | 
				
			||||
 | 
					          lineHeight: 15, | 
				
			||||
 | 
					          color: '#fff', | 
				
			||||
 | 
					          fontSize: 12, | 
				
			||||
 | 
					          // distanceToLabelLine: -60,
 | 
				
			||||
 | 
					          rich: { | 
				
			||||
 | 
					            name: { | 
				
			||||
 | 
					              padding: [0, 6, 0, 6] | 
				
			||||
 | 
					            }, | 
				
			||||
 | 
					            a: { | 
				
			||||
 | 
					              fontSize: 30, | 
				
			||||
 | 
					              color: '#fff', | 
				
			||||
 | 
					              padding: [0, 6, 6, 6] | 
				
			||||
 | 
					            }, | 
				
			||||
 | 
					            r: { | 
				
			||||
 | 
					              backgroundColor: 'auto', | 
				
			||||
 | 
					              borderRadius: 6, | 
				
			||||
 | 
					              width: 6, | 
				
			||||
 | 
					              height: 6, | 
				
			||||
 | 
					              // padding: [3, 3, 0, -12]
 | 
				
			||||
 | 
					            } | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        labelLine: { | 
				
			||||
 | 
					          show: false, | 
				
			||||
 | 
					          smooth: 0.2, | 
				
			||||
 | 
					          length: 30, | 
				
			||||
 | 
					          length2: 0, | 
				
			||||
 | 
					          maxSurfaceAngle: 80 | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        labelLayout: function (params) { | 
				
			||||
 | 
					           | 
				
			||||
 | 
					          const isLeft = params.labelRect.x < _charts.getWidth() / 2; | 
				
			||||
 | 
					          const points = params.labelLinePoints; | 
				
			||||
 | 
					          // Update the end point.
 | 
				
			||||
 | 
					          if (points) { | 
				
			||||
 | 
					            points[2][0] = isLeft | 
				
			||||
 | 
					            ? params.labelRect.x | 
				
			||||
 | 
					            : params.labelRect.x + params.labelRect.width; | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					           | 
				
			||||
 | 
					          return { | 
				
			||||
 | 
					            labelLinePoints: points | 
				
			||||
 | 
					          }; | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        itemStyle: { | 
				
			||||
 | 
					          // color:function(params) {
 | 
				
			||||
 | 
					          // //自定义颜色
 | 
				
			||||
 | 
					          // var colorList = [          
 | 
				
			||||
 | 
					          //       '#00FFFF', '#00FF00', '#FFFF00', '#FF8C00', '#FF0000', '#FE8463',
 | 
				
			||||
 | 
					          //   ];
 | 
				
			||||
 | 
					          //   return colorList[params.dataIndex]
 | 
				
			||||
 | 
					          // }
 | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        data: [], | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					         // 中间圆环
 | 
				
			||||
 | 
					         { | 
				
			||||
 | 
					          type: 'pie', | 
				
			||||
 | 
					          // 起始刻度的角度,默认为 90 度,即圆心的正上方。0 度为圆心的正右方。
 | 
				
			||||
 | 
					          startAngle: 0, | 
				
			||||
 | 
					          hoverAnimation: false, | 
				
			||||
 | 
					          center: center, | 
				
			||||
 | 
					          // tooltip: {
 | 
				
			||||
 | 
					          // },
 | 
				
			||||
 | 
					          radius: ['0%', '25%'], | 
				
			||||
 | 
					          label: { | 
				
			||||
 | 
					           | 
				
			||||
 | 
					              show: false | 
				
			||||
 | 
					            | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          labelLine: { | 
				
			||||
 | 
					            | 
				
			||||
 | 
					              show: false | 
				
			||||
 | 
					           | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          data: [{ | 
				
			||||
 | 
					            value: 360, | 
				
			||||
 | 
					            itemStyle: { | 
				
			||||
 | 
					              normal: { | 
				
			||||
 | 
					                color: 'rgba(8, 37, 134, 1)', | 
				
			||||
 | 
					             | 
				
			||||
 | 
					              } | 
				
			||||
 | 
					            } | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					          ] | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					    ] | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  } | 
				
			||||
 | 
					} | 
				
			||||
@ -0,0 +1,523 @@ | 
				
			|||||
 | 
					<template> | 
				
			||||
 | 
					  <cpt-card> | 
				
			||||
 | 
					    <div class="title"> | 
				
			||||
 | 
					      <img src="@/assets/img/shuju/title-tip.png" /> | 
				
			||||
 | 
					      <span>居民热议</span> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      <div class="second-select cascader"> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        <el-cascader class="customer_cascader" | 
				
			||||
 | 
					                     ref="myCascader" | 
				
			||||
 | 
					                     v-model="agencyIdArray" | 
				
			||||
 | 
					                     :key="iscascaderShow" | 
				
			||||
 | 
					                     :options="casOptions" | 
				
			||||
 | 
					                     :props="optionProps" | 
				
			||||
 | 
					                     :show-all-levels="false" | 
				
			||||
 | 
					                     @change="handleChangeAgency"></el-cascader> | 
				
			||||
 | 
					      </div> | 
				
			||||
 | 
					      <div class="second-select status-select"> | 
				
			||||
 | 
					        <el-select v-model="status" | 
				
			||||
 | 
					                   :popper-append-to-body="false" | 
				
			||||
 | 
					                   placeholder="请选择"> | 
				
			||||
 | 
					          <el-option v-for="(item,index) in stateArray" | 
				
			||||
 | 
					                     :key="item.value" | 
				
			||||
 | 
					                     :label="item.label" | 
				
			||||
 | 
					                     :value="item.value" | 
				
			||||
 | 
					                     @click.native="handleChangeState(index)"> | 
				
			||||
 | 
					          </el-option> | 
				
			||||
 | 
					        </el-select> | 
				
			||||
 | 
					      </div> | 
				
			||||
 | 
					    </div> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    <div class="g-cpt-resi"> | 
				
			||||
 | 
					      <div class="g-l"> | 
				
			||||
 | 
					        <screen-echarts-frame v-if=" !dataLoading" | 
				
			||||
 | 
					                              class="echart-wr" | 
				
			||||
 | 
					                              @myChartMethod="pieInitOk" | 
				
			||||
 | 
					                              ref="pieChart"></screen-echarts-frame> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        <div class="table-status" | 
				
			||||
 | 
					             v-if="dataLoading"> | 
				
			||||
 | 
					          <screen-loading>加载中</screen-loading> | 
				
			||||
 | 
					        </div> | 
				
			||||
 | 
					      </div> | 
				
			||||
 | 
					      <div class="g-r"> | 
				
			||||
 | 
					        <div class="m-tb"> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          <div class="tb"> | 
				
			||||
 | 
					            <cpt-tb :col-list="demand.colList" | 
				
			||||
 | 
					                    :loading="demand.loading" | 
				
			||||
 | 
					                    :header="demand.header" | 
				
			||||
 | 
					                    :list="demand.list" | 
				
			||||
 | 
					                    @operate="toIssueInfo"></cpt-tb> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          </div> | 
				
			||||
 | 
					          <div class="m-pagination"> | 
				
			||||
 | 
					            <el-pagination :current-page="demand.pageNo" | 
				
			||||
 | 
					                           :page-size="demand.pageSize" | 
				
			||||
 | 
					                           :total="demand.total" | 
				
			||||
 | 
					                           background | 
				
			||||
 | 
					                           layout="prev, pager, next" | 
				
			||||
 | 
					                           @current-change="handlePageNoChange_demand"> | 
				
			||||
 | 
					            </el-pagination> | 
				
			||||
 | 
					          </div> | 
				
			||||
 | 
					        </div> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      </div> | 
				
			||||
 | 
					    </div> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    <issue-info v-if="showIssue" | 
				
			||||
 | 
					                :issueId="issueId" | 
				
			||||
 | 
					                @close="showIssue = false" /> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  </cpt-card> | 
				
			||||
 | 
					</template> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					<script> | 
				
			||||
 | 
					import { Loading } from "element-ui"; //引入Loading服务 | 
				
			||||
 | 
					import { requestPost } from "@/js/dai/request"; | 
				
			||||
 | 
					import cptCard from "@/views/modules/visual/cpts/card"; | 
				
			||||
 | 
					import cptTb from "@/views/modules/visual/cpts/tb"; | 
				
			||||
 | 
					import screenEchartsFrame from "@/views/modules/visual/components/screen-echarts-frame"; | 
				
			||||
 | 
					import ScreenLoading from "@/views/modules/visual/components/screen-loading"; | 
				
			||||
 | 
					import ScreenNodata from "@/views/modules/visual/components/screen-nodata"; | 
				
			||||
 | 
					import { pieOption } from './resiPieOption.js' | 
				
			||||
 | 
					import nextTick from 'dai-js/tools/nextTick' | 
				
			||||
 | 
					import issueInfo from "./cpt/issue-info"; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					export default { | 
				
			||||
 | 
					  name: "HomeMap", | 
				
			||||
 | 
					  data () { | 
				
			||||
 | 
					    return { | 
				
			||||
 | 
					      dataLoading: true, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      pieChartS: null, | 
				
			||||
 | 
					      pieChart: '', | 
				
			||||
 | 
					      pieOption: {}, | 
				
			||||
 | 
					      pieInitState: false, | 
				
			||||
 | 
					      pieTotal: 0, | 
				
			||||
 | 
					      colorArray: [], | 
				
			||||
 | 
					      pieData: [ | 
				
			||||
 | 
					        // { count: 1048, categoryName: '城市管理', color: '#1B51FF', selected: true }, | 
				
			||||
 | 
					        // { count: 735, categoryName: '为民服务', color: '#00E5ED' }, | 
				
			||||
 | 
					        // { count: 580, categoryName: '安全监管', color: '#7800FF' }, | 
				
			||||
 | 
					        // { count: 484, categoryName: '民政', color: '#16D783' }, | 
				
			||||
 | 
					        // { count: 300, categoryName: '环境保护', color: '#FF7800' }, | 
				
			||||
 | 
					        // { count: 1048, categoryName: '建设管理', color: '#FFBA00' }, | 
				
			||||
 | 
					        // { count: 735, categoryName: '街道吹哨部门报到', color: '#FFD685' }, | 
				
			||||
 | 
					        // { count: 1580, categoryName: '社会治安综合', color: '#2A00FF' }, | 
				
			||||
 | 
					        // { count: 484, categoryName: '公安交通管理', color: '#C600FF' }, | 
				
			||||
 | 
					        // { count: 300, categoryName: '卫生计生监管执法', color: '#FF2A00' }, | 
				
			||||
 | 
					        // { count: 484, categoryName: '民生', color: '#3DDA83' }, | 
				
			||||
 | 
					        // { count: 300, categoryName: '街道安全', color: '#FAC126' } | 
				
			||||
 | 
					      ], | 
				
			||||
 | 
					      //voting 已转项目:shift_project 已关闭:closed,全部:all | 
				
			||||
 | 
					      stateArray: [ | 
				
			||||
 | 
					        { | 
				
			||||
 | 
					          label: '全部', | 
				
			||||
 | 
					          value: 'all' | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        { | 
				
			||||
 | 
					          label: '表决中', | 
				
			||||
 | 
					          value: 'voting' | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        { | 
				
			||||
 | 
					          label: '已转项目', | 
				
			||||
 | 
					          value: 'shift_project' | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					        { | 
				
			||||
 | 
					          label: '已关闭', | 
				
			||||
 | 
					          value: 'closed' | 
				
			||||
 | 
					        }, | 
				
			||||
 | 
					      ], | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      status: 'all', | 
				
			||||
 | 
					      orgId: '', | 
				
			||||
 | 
					      orgTypeSel: '', | 
				
			||||
 | 
					      tableList: [], | 
				
			||||
 | 
					      demand: { | 
				
			||||
 | 
					        loading: true, | 
				
			||||
 | 
					        colList: [ | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "5%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "10%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "20%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "10%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "5%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "10%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "10%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "15%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "5%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "5%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					          { | 
				
			||||
 | 
					            align: "center", | 
				
			||||
 | 
					            width: "10%", | 
				
			||||
 | 
					          }, | 
				
			||||
 | 
					        ], | 
				
			||||
 | 
					        header: ["序号", "议题标题", "处理意见", "分类", "状态", "创建时间", "发起人", "已表态/应表态", "支持", "反对", "操作"], | 
				
			||||
 | 
					        list: [], | 
				
			||||
 | 
					        pageSize: 10, | 
				
			||||
 | 
					        pageNo: 1, | 
				
			||||
 | 
					        total: 0, | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					      showIssue: false, | 
				
			||||
 | 
					      issueId: '', | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      casOptions: [], | 
				
			||||
 | 
					      agencyIdArray: [], | 
				
			||||
 | 
					      customerList: [], | 
				
			||||
 | 
					      iscascaderShow: 0, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      optionProps: { | 
				
			||||
 | 
					        multiple: false, | 
				
			||||
 | 
					        value: 'orgLevel', | 
				
			||||
 | 
					        label: 'agencyName', | 
				
			||||
 | 
					        children: 'subAgencyList', | 
				
			||||
 | 
					        checkStrictly: true | 
				
			||||
 | 
					      }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }; | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					  // mixins: [animate] | 
				
			||||
 | 
					  beforeDestroy () { | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  async mounted () { | 
				
			||||
 | 
					    this.dataLoading = true | 
				
			||||
 | 
					    await this.getAgencylist()//获取组织级别 | 
				
			||||
 | 
					    await this.getApiData() | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    this.dataLoading = false | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    this.getPie() | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  methods: { | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    async getApiData () { | 
				
			||||
 | 
					      await this.getPieChart() | 
				
			||||
 | 
					      // await this.getTable(); | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    // 获取当前登录人员信息及组织信息 | 
				
			||||
 | 
					    async getAgencylist () { | 
				
			||||
 | 
					      const url = "/gov/org/customeragency/agencygridtree"; | 
				
			||||
 | 
					      let params = {}; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      const { data, code, msg } = await requestPost(url, params); | 
				
			||||
 | 
					      if (code === 0) { | 
				
			||||
 | 
					        this.agencyInfo = data | 
				
			||||
 | 
					        this.orgId = this.agencyInfo.agencyId | 
				
			||||
 | 
					        this.orgType = this.agencyInfo.level === 'grid' ? 'grid' : 'agency' | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        if (!this.agencyInfo.latitude) { | 
				
			||||
 | 
					          this.agencyInfo.latitude = 36.072227 | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					        if (!this.agencyInfo.longitude) { | 
				
			||||
 | 
					          this.agencyInfo.longitude = 120.389455 | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					        if (!this.agencyInfo.level) { | 
				
			||||
 | 
					          this.agencyInfo.level = 'street' | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        //组织级联数据 | 
				
			||||
 | 
					        ++this.iscascaderShow | 
				
			||||
 | 
					        this.casOptions = [] | 
				
			||||
 | 
					        this.agencyIdArray.length = [] | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        if (data) { | 
				
			||||
 | 
					          this.casOptions.push(data) | 
				
			||||
 | 
					          this.agencyIdArray.push(this.agencyInfo.orgLevel) | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        this.$message.error(msg); | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    // 获取饼状图 | 
				
			||||
 | 
					    async getPieChart () { | 
				
			||||
 | 
					      if (this.$refs.pieChart) { | 
				
			||||
 | 
					        this.$refs.pieChart.clear() | 
				
			||||
 | 
					        this.$refs.pieChart.showLoading() | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      const url = "/gov/issue/issue/resibuzz-leftpiechart"; | 
				
			||||
 | 
					      // const url = "http://yapi.elinkservice.cn/mock/245/gov/issue/issue/resibuzz-leftpiechart"; | 
				
			||||
 | 
					      let params = { | 
				
			||||
 | 
					        orgId: this.orgId, | 
				
			||||
 | 
					        orgType: this.orgType, | 
				
			||||
 | 
					        status: this.status, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      }; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      const { data, code, msg } = await requestPost(url, params); | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      if (code === 0) { | 
				
			||||
 | 
					        if (data && data.length > 0) { | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          this.pieData = data | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        } else { | 
				
			||||
 | 
					          this.pieData = [] | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        if (this.$refs.pieChart) { | 
				
			||||
 | 
					          this.$refs.pieChart.hideLoading() | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        this.$message.error(msg); | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    pieInitOk (dom) { | 
				
			||||
 | 
					      console.log('pie准备好了', dom) | 
				
			||||
 | 
					      this.pieChartS = dom | 
				
			||||
 | 
					      this.pieInitState = true | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    getPie () { | 
				
			||||
 | 
					      if (this.pieInitState) { | 
				
			||||
 | 
					        this.assignPieChart() | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        setTimeout(() => { | 
				
			||||
 | 
					          this.getPie() | 
				
			||||
 | 
					        }, 500) | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    clickPie (seriesIndex) { | 
				
			||||
 | 
					      this.pieData.forEach((element, index) => { | 
				
			||||
 | 
					        if (index === seriesIndex) { | 
				
			||||
 | 
					          element.label = { | 
				
			||||
 | 
					            show: true, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          }; | 
				
			||||
 | 
					          element.labelLine = { | 
				
			||||
 | 
					            show: true, | 
				
			||||
 | 
					            lineStyle: { | 
				
			||||
 | 
					              opacity: 1, | 
				
			||||
 | 
					            } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          }; | 
				
			||||
 | 
					          console.log('zhilma') | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        } else { | 
				
			||||
 | 
					          element.label = { | 
				
			||||
 | 
					            show: true, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          }; | 
				
			||||
 | 
					          element.labelLine = { | 
				
			||||
 | 
					            show: true, | 
				
			||||
 | 
					            lineStyle: { | 
				
			||||
 | 
					              opacity: 0, | 
				
			||||
 | 
					              color: 'rgba(255,255,255,0)' | 
				
			||||
 | 
					            } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          }; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					      }); | 
				
			||||
 | 
					      this.pieOption.series[1].data = this.pieData | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      this.$refs.pieChart.setOption(this.pieOption) | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    assignPieChart () { | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      this.pieTotal = 0 | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      if (this.pieData.length > 0) { | 
				
			||||
 | 
					        this.$refs.pieChart.setNoData(false) | 
				
			||||
 | 
					        const _that = this | 
				
			||||
 | 
					        let maxIndex = 0 | 
				
			||||
 | 
					        let maxValue = this.pieData[0].count | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        this.pieData[0].selected = true | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        this.pieData.forEach((item, index) => { | 
				
			||||
 | 
					          item.name = item.categoryName | 
				
			||||
 | 
					          item.value = item.count | 
				
			||||
 | 
					          this.colorArray.push(item.color) | 
				
			||||
 | 
					          this.pieTotal = this.pieTotal + item.value | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					          if (item.value > maxValue) { | 
				
			||||
 | 
					            maxValue = item.value | 
				
			||||
 | 
					            maxIndex = index | 
				
			||||
 | 
					            item.selected = true | 
				
			||||
 | 
					          } else if (index !== 0) { | 
				
			||||
 | 
					            item.selected = false | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        }); | 
				
			||||
 | 
					        // 获取pieChart配置 | 
				
			||||
 | 
					        this.pieOption = pieOption(this.pieChartS) | 
				
			||||
 | 
					        this.pieOption.title.text = this.pieTotal | 
				
			||||
 | 
					        this.pieOption.series[1].itemStyle = { | 
				
			||||
 | 
					          color: function (params) { | 
				
			||||
 | 
					            return _that.colorArray[params.dataIndex] | 
				
			||||
 | 
					          } | 
				
			||||
 | 
					        } | 
				
			||||
 | 
					        this.pieOption.series[1].data = this.pieData | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        this.$refs.pieChart.setOption(this.pieOption) | 
				
			||||
 | 
					        // this.clickPie(maxIndex) | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					        // let fun = function (params) { | 
				
			||||
 | 
					        //   _that.clickPie(params.dataIndex) | 
				
			||||
 | 
					        // } | 
				
			||||
 | 
					        // this.$refs.pieChart.handleClick(fun) | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        this.$refs.pieChart.setNoData(true) | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    async handleChangeState (index) { | 
				
			||||
 | 
					      await this.getApiData() | 
				
			||||
 | 
					      this.assignPieChart() | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    async handleChangeAgency (value) { | 
				
			||||
 | 
					      let orgArray = [] | 
				
			||||
 | 
					      let key = this.agencyIdArray.length > 0 ? this.agencyIdArray[this.agencyIdArray.length - 1] : '' | 
				
			||||
 | 
					      if (key) { | 
				
			||||
 | 
					        orgArray = key.split('-') | 
				
			||||
 | 
					        this.orgId = orgArray[0] | 
				
			||||
 | 
					        this.orgType = orgArray[1] === 'grid' ? 'grid' : 'agency' | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        this.orgId = '' | 
				
			||||
 | 
					        this.orgType = '' | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      await this.getApiData() | 
				
			||||
 | 
					      this.assignPieChart() | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    //加载组织数据 | 
				
			||||
 | 
					    async getTable () { | 
				
			||||
 | 
					      const url = "/gov/issue/issue/resibuzz"; | 
				
			||||
 | 
					      // const url = "http://yapi.elinkservice.cn/mock/245/gov/issue/issue/resibuzz"; | 
				
			||||
 | 
					      let params = { | 
				
			||||
 | 
					        status: this.status, | 
				
			||||
 | 
					        orgId: this.orgId, | 
				
			||||
 | 
					        orgType: this.orgType, | 
				
			||||
 | 
					        pageNo: this.demand.pageNo, | 
				
			||||
 | 
					        pageSize: this.demand.pageSize, | 
				
			||||
 | 
					      }; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      const { data, code, msg } = await requestPost(url, params); | 
				
			||||
 | 
					      this.demand.loading = false; | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					      if (code === 0) { | 
				
			||||
 | 
					        this.demand.total = data.total; | 
				
			||||
 | 
					        this.tableList = data.list | 
				
			||||
 | 
					        this.demand.list = data.list.map((item) => { | 
				
			||||
 | 
					          return [ | 
				
			||||
 | 
					            item.sort ? item.sort : '--', | 
				
			||||
 | 
					            item.issueTitle ? item.issueTitle : '', | 
				
			||||
 | 
					            item.suggestion ? item.suggestion : '', | 
				
			||||
 | 
					            item.categoryName.join(','), | 
				
			||||
 | 
					            item.status ? item.status : '', | 
				
			||||
 | 
					            item.createdTime ? item.createdTime : '', | 
				
			||||
 | 
					            item.issueOriginator ? item.issueOriginator : '', | 
				
			||||
 | 
					            item.voteAccount ? item.voteAccount : '', | 
				
			||||
 | 
					            item.supportCount ? item.supportCount : 0, | 
				
			||||
 | 
					            item.oppositionCount ? item.oppositionCount : 0, | 
				
			||||
 | 
					            { type: "operate", list: ["查看"] }, | 
				
			||||
 | 
					          ]; | 
				
			||||
 | 
					        }); | 
				
			||||
 | 
					      } else { | 
				
			||||
 | 
					        this.$message.error(msg); | 
				
			||||
 | 
					      } | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    handlePageNoChange_demand (val) { | 
				
			||||
 | 
					      this.demand.pageNo = val; | 
				
			||||
 | 
					      this.getTable(); | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    async toIssueInfo (index) { | 
				
			||||
 | 
					      const { tableList } = this; | 
				
			||||
 | 
					      this.issueId = tableList[index].issueId | 
				
			||||
 | 
					      this.showIssue = true | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					  props: { | 
				
			||||
 | 
					    uid: { | 
				
			||||
 | 
					      type: String, | 
				
			||||
 | 
					      default: "", | 
				
			||||
 | 
					      // default: "8ada68cb6f1e4b9a8333348a39ef3aee", | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  computed: {}, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  components: { | 
				
			||||
 | 
					    cptCard, | 
				
			||||
 | 
					    cptTb, | 
				
			||||
 | 
					    screenEchartsFrame, | 
				
			||||
 | 
					    ScreenLoading, | 
				
			||||
 | 
					    ScreenNodata, | 
				
			||||
 | 
					    issueInfo | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					  watch: { | 
				
			||||
 | 
					    uid (id) { | 
				
			||||
 | 
					      this.userId = id; | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					    userId () { | 
				
			||||
 | 
					      this.getApiData(); | 
				
			||||
 | 
					      window.scrollTo(0, 0); | 
				
			||||
 | 
					    }, | 
				
			||||
 | 
					  }, | 
				
			||||
 | 
					}; | 
				
			||||
 | 
					</script> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					<style | 
				
			||||
 | 
					  lang="scss" | 
				
			||||
 | 
					  src="@/assets/scss/modules/visual/resibuzz.scss" | 
				
			||||
 | 
					  scoped | 
				
			||||
 | 
					></style> | 
				
			||||
 | 
					
 | 
				
			||||
 | 
					<style lang=scss scoped> | 
				
			||||
 | 
					</style> | 
				
			||||
					Loading…
					
					
				
		Reference in new issue