ui问题修改

src/views/dataBoard/cpts/map/index.vue

@@ -527,12 +527,12 @@ export default {
         })
         .active(true);
       scene.addLayer(textLayer);
-
+      let popup;
       polygonLayer.on("mousemove", (e) => {
         if (this.level === "grid") {
           return;
         }
-        const popup = new Popup({
+        popup = new Popup({
           offsets: [60, 60],
           closeButton: false,
           maxWidth: 400,
@@ -551,6 +551,9 @@ export default {
 `);
         scene.addPopup(popup);
       });
+      polygonLayer.on("mouseout", (e) => {
+        popup.remove();
+      });
       polygonLayer.on("click", (e) => {
         console.log(this.level);
         if (this.level === "grid") {
@@ -990,12 +993,12 @@ export default {
     //box-shadow: 0 0 20px 3px inset rgba(#22f, 0.1);
     width: 416px;
     padding: 0 20px !important;
-    background: url('@/assets/images/overview/dia_con.png');
+    background: url("@/assets/images/overview/dia_con.png");
 
     &:before {
-      content: '';
+      content: "";
       display: block;
-      background: url('@/assets/images/overview/dia_head.png');
+      background: url("@/assets/images/overview/dia_head.png");
       height: 29px;
       width: 100%;
       position: absolute;
@@ -1004,9 +1007,9 @@ export default {
     }
 
     &:after {
-      content: '';
+      content: "";
       display: block;
-      background: url('@/assets/images/overview/dia_foot.png');
+      background: url("@/assets/images/overview/dia_foot.png");
       height: 26px;
       width: 100%;
       left: 0;

src/views/dataBoard/satisfactionEval/modules/PersonnelPortrait/index.vue

@@ -1,70 +1,39 @@
 <template>
-  <div
+  <div class="personnel-portrait" v-loading="loading" element-loading-text="加载中..." element-loading-spinner="el-icon-loading" element-loading-background="rgba(0,0,0,0.5)">
-    class="personnel-portrait"
+    <Tabs v-model="resultType" :list="resultTypeList" @changeVal="resultTypeChange" />
-    v-loading="loading"
-    element-loading-text="加载中..."
-    element-loading-spinner="el-icon-loading"
-    element-loading-background="rgba(0,0,0,0.5)"
-  >
-    <Tabs
-      v-model="resultType"
-      :list="resultTypeList"
-      @changeVal="resultTypeChange"
-    />
     <div class="screen">
       <div class="txt">不满意人员画像</div>
-      <el-select
+      <el-select v-if="resultType == 'provinceAndSelf'" v-model="typeCondition" @change="getData" placeholder="请选择" class="select" popper-class="selectPopClass">
-        v-if="resultType == 'provinceAndSelf'"
+        <el-option v-for="item in typeConditionList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
-        v-model="typeCondition"
-        @change="getData"
-        placeholder="请选择"
-        class="select"
-        popper-class="selectPopClass"
-      >
-        <el-option
-          v-for="item in typeConditionList"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-        >
-        </el-option>
       </el-select>
     </div>
 
     <div class="portrait">
       <div class="tag yellow" v-if="gridName">
-        <div class="text">{{ gridName }}</div>
+        <div :class="[gridName.length > 5 ? 'smallSize' : '', 'text']">{{ gridName }}</div>
       </div>
       <div class="tag blue" v-if="ageClassification">
-        <div class="text">{{ ageClassification }}</div>
+        <div :class="[ageClassification.length > 5 ? 'smallSize' : '', 'text']">{{ ageClassification }}</div>
       </div>
       <div class="tag red" v-if="residentTagName">
-        <div class="text">{{ residentTagName }}</div>
+        <div :class="[residentTagName.length > 5 ? 'smallSize' : '', 'text']">{{ residentTagName }}</div>
       </div>
       <div class="tag light" v-if="monthIncomeLevel">
-        <div class="text">{{ monthIncomeLevel }}</div>
+        <div :class="[monthIncomeLevel.length > 5 ? 'smallSize' : '', 'text']">{{ monthIncomeLevel }}</div>
       </div>
       <div class="tag green" v-if="cultureName">
-        <div class="text">{{ cultureName }}</div>
+        <div :class="[cultureName.length > 5 ? 'smallSize' : '', 'text']">{{ cultureName }}</div>
       </div>
       <div class="tag orange" v-if="marriageName">
-        <div class="text">{{ marriageName }}</div>
+        <div :class="[marriageName.length > 5 ? 'smallSize' : '', 'text']">{{ marriageName }}</div>
       </div>
       <div class="tag purple" v-if="gender">
         <div class="text">
-          {{
+          {{ gender === "1" ? "男" : gender === "2" ? "女" : gender === "0" ? "未知" : "" }}
-            gender === "1"
-              ? "男"
-              : gender === "2"
-              ? "女"
-              : gender === "0"
-              ? "未知"
-              : ""
-          }}
         </div>
       </div>
     </div>
-
+    <div style="display: flex">
       <div class="btn" @click="gotopage">
         <div>
           按画像匹配到同类：<span>
@@ -75,6 +44,7 @@
         <i class="el-icon-arrow-right"></i>
       </div>
     </div>
+  </div>
 </template>
 
 <script>
@@ -130,15 +100,10 @@ export default {
       this.getData();
     },
     gotopage() {
-      this.$router.push(
+      this.$router.push("/dataBoard/satisfactionEval/dissatisfiedPersonnel?searchParams=" + this.searchParams);
-        "/dataBoard/satisfactionEval/dissatisfiedPersonnel?searchParams=" +
-          this.searchParams
-      );
     },
     getDisKey() {
-      this.$http
+      this.$http.post("/sys/dict/data/dictlist", { dictType: "satisfaction_category" }).then(({ data: { data } }) => {
-        .post("/sys/dict/data/dictlist", { dictType: "satisfaction_category" })
-        .then(({ data: { data } }) => {
         this.typeCondition = data[0].value;
         this.typeConditionList = data;
       });
@@ -151,12 +116,7 @@ export default {
         queryType: this.resultType,
         category: this.resultType == "provinceAndSelf" ? this.typeCondition : null,
       };
-      this.$http
+      this.$http.get("/governance/satisfactionOverview/satisfactionCrowdPortrait?" + this.$paramsFormat(params)).then(({ data: { data } }) => {
-        .get(
-          "/governance/satisfactionOverview/satisfactionCrowdPortrait?" +
-            this.$paramsFormat(params)
-        )
-        .then(({ data: { data } }) => {
         this.gender = data.gender;
         this.marriageName = data.marriageName;
         this.ageClassification = data.ageClassification;
@@ -239,6 +199,10 @@ $purple: #6642fd;
       align-items: center;
       justify-content: center;
       border-radius: 50%;
+      text-align: center;
+    }
+    .smallSize {
+      font-size: 10px;
     }
 
     &:after {
@@ -359,7 +323,7 @@ $purple: #6642fd;
 }
 
 .btn {
-  width: 240px;
+  min-width: 240px;
   height: 46px;
   border: 1px solid #125aaa;
   border-radius: 23px;
@@ -367,7 +331,7 @@ $purple: #6642fd;
   font-weight: 400;
   color: #ffffff;
   line-height: 46px;
-  display: flex;
+  display: inline-flex;
   align-items: center;
   justify-content: space-between;
   padding: 0 20px;

src/views/dataBoard/satisfactionEval/modules/PotentialPeople/index.vue

@@ -13,7 +13,7 @@
         事件未解决 <br>
         上报人数
       </div>
-      <div class="num"><span class="orange">{{ unSolvedNum ? unSolvedNum : 0 }}</span>人</div>
+      <div class="num"><span style="margin-right: 4px;" class="orange">{{ unSolvedNum ? unSolvedNum : 0 }}</span>人</div>
     </div>
     <div class="potential-people-item" @click="$router.push('/dataBoard/satisfactionEval/potentialPeople?countType=demand')">
       <div class="icon">
@@ -23,7 +23,7 @@
         需求未满足 <br>
         人数
       </div>
-      <div class="num"><span class="green">{{ unFinishNum ? unFinishNum : 0 }}</span>人</div>
+      <div class="num"><span style="margin-right: 4px" class="green">{{ unFinishNum ? unFinishNum : 0 }}</span>人</div>
     </div>
     <div class="potential-people-item" @click="$router.push('/dataBoard/satisfactionEval/potentialPeople?countType=service')">
       <div class="icon">
@@ -33,7 +33,7 @@
         应享未享 <br>
         服务人数
       </div>
-      <div class="num"><span class="light">{{ noServiceNum ? noServiceNum : 0 }}</span>人</div>
+      <div class="num"><span style="margin-right: 4px" class="light">{{ noServiceNum ? noServiceNum : 0 }}</span>人</div>
     </div>
   </div>
 </template>

src/views/dataBoard/satisfactionEval/modules/SelfTrend/index.vue

@@ -122,7 +122,7 @@ export default {
         },
         tooltip: {
           trigger: 'axis',
-          backgroundColor: 'rgba(13,33,71,0.5)',
+          backgroundColor: 'rgba(13,33,71,0.8)',
           borderColor: 'rgba(143,174,252,0.6)',
           padding: 8,
           textStyle: {

src/views/dataBoard/satisfactionEval/modules/TypesOfDissatisfaction/index.vue

@@ -1,31 +1,9 @@
 <template>
-  <div
+  <div class="types-dissatisfaction" v-loading="loading" element-loading-text="加载中..." element-loading-spinner="el-icon-loading" element-loading-background="rgba(0,0,0,0.5)">
-    class="types-dissatisfaction"
-    v-loading="loading"
-    element-loading-text="加载中..."
-    element-loading-spinner="el-icon-loading"
-    element-loading-background="rgba(0,0,0,0.5)"
-  >
     <div class="screen">
-      <Tabs
+      <Tabs v-model="resultType" :list="resultTypeList" @changeVal="resultTypeChange" />
-        v-model="resultType"
+      <el-select v-model="typeCondition" popper-class="selectPopClass" placeholder="请选择" class="select" @change="timeChange">
-        :list="resultTypeList"
+        <el-option v-for="item in typeConditionList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
-        @changeVal="resultTypeChange"
-      />
-      <el-select
-        v-model="typeCondition"
-        popper-class="selectPopClass"
-        placeholder="请选择"
-        class="select"
-        @change="timeChange"
-      >
-        <el-option
-          v-for="item in typeConditionList"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-        >
-        </el-option>
       </el-select>
     </div>
     <div id="typeConditionChart" style="height: 542px"></div>
@@ -104,35 +82,20 @@ export default {
         startTime = this.$moment().startOf("month").format("YYYY-MM-DD");
       }
       if (this.typeCondition === 2) {
-        startTime = this.$moment()
+        startTime = this.$moment().subtract(1, "months").startOf("month").format("YYYY-MM-DD");
-          .subtract(1, "months")
-          .startOf("month")
-          .format("YYYY-MM-DD");
       }
       if (this.typeCondition === 3) {
-        startTime = this.$moment()
+        startTime = this.$moment().subtract(2, "months").startOf("month").format("YYYY-MM-DD");
-          .subtract(2, "months")
-          .startOf("month")
-          .format("YYYY-MM-DD");
       }
       if (this.typeCondition === 4) {
-        startTime = this.$moment()
+        startTime = this.$moment().subtract(5, "months").startOf("month").format("YYYY-MM-DD");
-          .subtract(5, "months")
-          .startOf("month")
-          .format("YYYY-MM-DD");
       }
       if (this.typeCondition === 5) {
-        startTime = this.$moment()
+        startTime = this.$moment().subtract(11, "months").startOf("month").format("YYYY-MM-DD");
-          .subtract(11, "months")
-          .startOf("month")
-          .format("YYYY-MM-DD");
       }
 
       if (this.typeCondition === 2) {
-        endTime = this.$moment()
+        endTime = this.$moment().subtract(1, "months").endOf("month").format("YYYY-MM-DD");
-          .subtract(1, "months")
-          .endOf("month")
-          .format("YYYY-MM-DD");
       } else {
         endTime = this.$moment().endOf("month").format("YYYY-MM-DD");
       }
@@ -164,9 +127,7 @@ export default {
       this.myChart = echarts.init(div);
       var dataname = data.map((item) => item.name);
       var datavaule = data.map((item) => (item.blueNum ? item.blueNum : 0));
-      var datavaule2 = data.map((item) =>
+      var datavaule2 = data.map((item) => (item.yellowNum ? item.yellowNum : 0));
-        item.yellowNum ? item.yellowNum : 0
-      );
       var indicator = [];
       let max = Math.max(...datavaule, ...datavaule2);
       console.log(max);
@@ -177,16 +138,10 @@ export default {
           max: datamax[i],
         });
       }
-      let legendName = [
+      let legendName = ["省满意度调查\n各项不满意人数", "社区满意度自查\n各项不满意人数"];
-        "省满意度调查\n各项不满意人数",
-        "社区满意度自查\n各项不满意人数",
-      ];
       let series = [
         {
-          name:
+          name: this.resultType === 2 ? "12345热线\n事件上报人数" : "省满意度调查\n各项不满意人数",
-            this.resultType === 2
-              ? "12345热线\n事件上报人数"
-              : "省满意度调查\n各项不满意人数",
           type: "radar",
           symbol: "circle",
           symbolSize: 7,
@@ -239,11 +194,11 @@ export default {
       var option = {
         tooltip: {
           trigger: "item",
-          backgroundColor: 'rgba(13,33,71,0.5)',
+          backgroundColor: "rgba(13,33,71,0.5)",
-          borderColor: 'rgba(143,174,252,0.6)',
+          borderColor: "rgba(143,174,252,0.6)",
           padding: 8,
           textStyle: {
-            color: '#fff',
+            color: "#fff",
           },
         },
         legend: {
@@ -268,7 +223,7 @@ export default {
           data: legendName,
         },
         radar: {
-          center: ["50%", "60%"],
+          center: ["50%", "50%"],
           radius: "50%",
           startAngle: 90,
           splitNumber: 5,