m

shuzhixiangzheng/src/assets/api/Map.js

@@ -118,7 +118,7 @@ class Map{
         this.name=null;
     }
 
-    left_clickFun(clickjinghuguojiShowFun,jinghuguojiShowFun,laoxianweisusheShowFun,yejiaxiaosheShowFun){
+    left_clickFun(clickjinghuguojiShowFun,jinghuguojiShowFun,laoxianweisusheShowFun,yejiaxiaosheShowFun,clicklaoxianweisusheFun){
         let viewer=this._viewer;
         this._handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK)
         this._handler.setInputAction(function (movement) {
@@ -148,6 +148,7 @@ class Map{
                     },
                     duration:1
                 });
+                clicklaoxianweisusheFun();
             }
             if(obj&&obj.id&&obj.id.type=="jinghuguoji"&&obj.id.label._text=="1#"){
                 jinghuguojiShowFun()

shuzhixiangzheng/src/components/DaZhongPage.vue

@@ -6,7 +6,7 @@
     <img class="img" id="img1" src="../assets/png/footer.png" />
     <img class="img" id="img2" src="../assets/png/title.png" />
     <!-- <img class="img" id="img3" :src="leftPng_url" /> -->
-    <LeftPage :dataAll='dataAll' :isShow='isShow'></LeftPage>
+    <LeftPage :dataAll='dataAll' :isShow='isShow' :isXiaoQu='isXiaoQu'></LeftPage>
     <RightPage :dataAll='dataAll'></RightPage>
     <!-- <img class="img" id="img5" :src="rightPng_url" /> -->
     <img class="img" id="img4" src="../assets/png/pop.png" />
@@ -128,14 +128,15 @@
     },
     data() {
       return {
+        isXiaoQu:false,
           isShow:true,
         // 传给左侧的总数据
         dataAll:{},
         msg: '',
         form_show: false,
         housePng_url: housePng,
-        leftPng_url: leftPng,
-        rightPng_url: rightPng,
+        // leftPng_url: leftPng,
+        // rightPng_url: rightPng,
         houses_firePoint_show: false,
         houses1_firePoint_show: false,
         jhgj_tableData: [{
@@ -159,7 +160,7 @@
           this.$store.getters.getDaZhongdata.data
         ) {
           this.dataAll=this.$store.getters.getDaZhongdata.data
-         // console.log('--------',this.dataAll);
+         console.log('--------',this.dataAll);
           clearInterval(clear);
         }
       }, 500);
@@ -175,7 +176,7 @@
     methods: {
       addEvent() {
         window.cesiumMap.left_clickFun(this.clickjinghuguojiShowFun, this.jinghuguojiShowFun, this
-          .laoxianweisusheShowFun, this.yejiaxiaosheShowFun)
+          .laoxianweisusheShowFun, this.yejiaxiaosheShowFun,this.clicklaoxianweisusheFun)
       },
       initTable() {
         jinghuguoji_httpGet({
@@ -229,9 +230,9 @@
         });
       },
       clickjinghuguojiShowFun() {
-        this.leftPng_url = left1Png;
-        this.rightPng_url = right1Png;
-
+        // this.leftPng_url = left1Png;
+        // this.rightPng_url = right1Png;
+        
         SZZXQ_httpGet("金湖国际",result=>{
             console.log("金湖国际",result)
             this.dataAll=result.data.data;
@@ -240,7 +241,8 @@
         },result=>{})
      //  this.$store.commit("setShowDZ", false);
         //  localStorage.setItem('showDZ',false)
-        this.isShow=false
+        this.isXiaoQu=true ;
+        this.isShow=false;
       },
       jinghuguojiShowFun() {
         setTimeout(() => {
@@ -287,7 +289,16 @@
       yejiaxiaosheShowFun() {
 
       },
-
+      //点击老县委宿舍图标 回调方法
+      clicklaoxianweisusheFun(){
+        SZZXQ_httpGet("老县委宿舍",result=>{
+            console.log("老县委宿舍",result)
+            this.dataAll=result.data.data;
+            // this.$store.commit("setDaZhongdata", result.data);
+        },result=>{})
+        this.isXiaoQu=true ;
+        this.isShow=false
+      },
       form_showFun() {
         this.form_show = false;
         this.number_show1 = false;

shuzhixiangzheng/src/components/MainPageChild/EmploymentSituation.vue

@@ -36,8 +36,8 @@ export default {
   position: absolute;
   width: 100%;
   height: 100%;
-  top: -70%;
-  left: -26%;
+  /* top: -70%;
+  left: -26%; */
 }
 
 @media screen and (max-height: 1000px) {
@@ -45,8 +45,8 @@ export default {
     position: absolute;
     width: 100%;
     height: 100%;
-    top: -80%;
-    left: -26%;
+    /* top: -80%;
+    left: -26%; */
   }
 }
 

shuzhixiangzheng/src/components/MainPageChild/VaccinationPage.vue

@@ -14,17 +14,17 @@
     <img class="yq_border_img" id="img4" src="../../assets/png/yq_border.png" />
     <img class="yq_border_img" id="img5" src="../../assets/png/yq_border.png" />
 
-    <span id="ym_name1">疫苗接种</span>
-    <span id="ym_num">{{vaccin? vaccin.total:0 }}</span>
-    <span id="ym_name2">疫苗总接种率</span>
-    <span id="ym_num1">{{vaccin? vaccin.allRate:0 }}%</span>
+    <div id="ym_name1">疫苗接种</div>
+    <div id="ym_num">{{vaccin? vaccin.total:0 }}</div>
+    <div id="ym_name2">疫苗总接种率</div>
+    <div id="ym_num1">{{vaccin? vaccin.allRate:0 }}%</div>
 
-    <span id="ym_name3">3-12岁疫苗接种率</span>
-    <span id="ym_num2">{{vaccin? vaccin.threeToTwelveRate:0 }}%</span>
-    <span id="ym_name4">12-18岁疫苗接种率</span>
-    <span id="ym_num3">{{ vaccin?vaccin.TwelveToEighteenRate:0 }}%</span>
-    <span id="ym_name5">18岁以上疫苗接种率</span>
-    <span id="ym_num4">{{vaccin? vaccin.eighteenRate:0 }}%</span>
+    <div id="ym_name3">3-12岁疫苗接种率</div>
+    <div id="ym_num2">{{vaccin? vaccin.threeToTwelveRate:0 }}%</div>
+    <div id="ym_name4">12-18岁疫苗接种率</div>
+    <div id="ym_num3">{{ vaccin?vaccin.TwelveToEighteenRate:0 }}%</div>
+    <div id="ym_name5">18岁以上疫苗接种率</div>
+    <div id="ym_num4">{{vaccin? vaccin.eighteenRate:0 }}%</div>
   </div>
 </template>
     
@@ -55,7 +55,7 @@ export default {
     <style scoped>
 #ym_num {
   position: absolute;
-  left: 21%;
+   left: 23%; 
   top: 28%;
   font-size: 28px;
   color: rgb(251, 212, 21);

shuzhixiangzheng/src/components/OtherChilds/EdcationPage_shequ.vue

@@ -72,7 +72,8 @@ export default {
   mounted() {
     const myTime = setInterval(() => {
       try {
-          if(this.dataAll){
+        
+          if(this.dataAll&&this.dataAll.school){
             this.school =this.dataAll.school
             if(this.school&&this.school.length>0){
               this.school.map((obj) => {
@@ -109,9 +110,9 @@ export default {
           }
         });
             }
-        
+            clearInterval(myTime);
           }
-        clearInterval(myTime);
+      
       } catch (error) {
         console.log(error);
       }

shuzhixiangzheng/src/components/OtherChilds/LeftPage.vue

@@ -1,7 +1,8 @@
 <template>
   <div id="leftPage">
     <!-- <img id="dazhong_img" src="../../assets/png/dazhong.png" /> -->
-    <img id="dazhong_img" v-if='imgSrc' :src="require('@/assets/png/location/'+imgSrc+'.png')" />
+    <img class="dazhong_img" v-if='imgSrc' :src="require('@/assets/png/location/'+imgSrc+'.png')" v-show='!isXiaoQu'/>
+    <img class="xiaoqu_img"  :src="require('@/assets/png/xiaoqu.png')" v-show='isXiaoQu'/>
     <div id="viewPage_f">
       <ViewPage :szdata="dataAll.index"></ViewPage>
     </div>
@@ -26,7 +27,7 @@
   
   
   export default {
-    props: ["dataAll", 'isShow'],
+    props: ["dataAll", 'isShow','isXiaoQu'],
     name: "",
     components: {
       ViewPage,
@@ -36,12 +37,14 @@
     },
     data() {
       return {
+        isXiaoQu:false,
         imgSrc:''
       };
     },
     mounted() {
       let temp =this.$route.query.imgName
       if(temp) this.imgSrc=temp
+
     //   console.log('拿到数据', this.dataAll);
     //   this.showDZ = localStorage.getItem('showDZ')
     //   console.log("this.showDZ", this.showDZ)
@@ -56,6 +59,11 @@
 
 
 <style scoped>
+  .xiaoqu_img{
+    position: absolute;
+    width: 180px;
+    top: -1%;
+  }
   #viewPage_f {
     position: absolute;
     width: 100%;
@@ -79,7 +87,7 @@
     background-color: rgba(4, 11, 30, 0.6);
   }
 
-  #dazhong_img {
+  .dazhong_img {
     position: absolute;
     width: 200px;
     top: -1%;

shuzhixiangzheng/src/components/OtherChilds/PepoleStatus.vue

@@ -176,5 +176,5 @@
     left: 52%;
     background-color: rgb(245, 199, 49);
   }
-
+ 
 </style>

shuzhixiangzheng/src/components/OtherChilds/PopulationStructure.vue

@@ -2,6 +2,12 @@
   <div id="populationStructure">
     <img src="../../assets/png/renkoutuli.png" id="renkou">
     <div id="pop"></div>
+    <div id="num50">50</div>
+    <div id="num100">100</div>
+    <div id="num150">150</div>
+    <div id="num200">200</div>
+    <div id="num250">250</div>
+    <div id="form"></div>
   </div>
 </template>
 
@@ -18,7 +24,7 @@
     },
     mounted() {
       let clear = setInterval(() => {
-       // console.log("this.data", this.psdata)
+        // console.log("this.data", this.psdata)
         if (this.psdata) {
           this.init()
           clearInterval(clear)
@@ -45,9 +51,27 @@
         shadowYData.push(this.psdata.filter(d => d.name == "60-80岁")[0].total);
         shadowYData.push(this.psdata.filter(d => d.name == "80岁以上")[0].total);
 
-        // console.log("this.yData", this.yData)
+       // console.log("this.psdata", this.psdata)
         // console.log(this.shadowYData)
 
+        myChart.on("mouseover", function (params) {
+          // console.log("params",params)
+          if(params.name=="18以下"){
+            document.getElementById("form").innerText="男:"+yData[0]+"  \n女:"+(shadowYData[0]-yData[0]);
+            document.getElementById("form").setAttribute('style',"position: absolute;width: 60px;height: 40px;left: 15%;top:50%;font-size: 10px;color: aliceblue;");
+          }else if(params.name=="18-60"){
+            document.getElementById("form").innerText="男:"+yData[1]+"  \n女:"+(shadowYData[1]-yData[1]);
+            document.getElementById("form").setAttribute('style',"position: absolute;width: 60px;height: 40px;left: 38%;top:50%;font-size: 10px;color: aliceblue;");
+          }else if(params.name=="60-80"){
+            document.getElementById("form").innerText="男:"+yData[2]+"  \n女:"+(shadowYData[2]-yData[2]);
+            document.getElementById("form").setAttribute('style',"position: absolute;width: 60px;height: 40px;left: 63%;top:50%;font-size: 10px;color: aliceblue;");
+          }else if(params.name="80以上"){
+            document.getElementById("form").innerText="男:"+yData[3]+"  \n女:"+(shadowYData[3]-yData[3]);
+            document.getElementById("form").setAttribute('style',"position: absolute;width: 60px;height: 40px;left: 85%;top:50%;font-size: 10px;color: aliceblue;");
+          }
+        });
+
+
         //#0D53CC
         var color = "#19dfdd";
         var shadowColor = "#0b5767";
@@ -87,19 +111,19 @@
           "yAxis": [{
             show: false,
             "type": "value",
-            "axisLabel": {
-              "textStyle": {
-                "color": "#fff"
-              },
-            },
-            "splitLine": {
-              "lineStyle": {
-                "color": "#0c2c5a"
-              }
-            },
-            "axisLine": {
-              "show": false
-            }
+            // "axisLabel": {
+            //   "textStyle": {
+            //     "color": "#fff"
+            //   },
+            // },
+            // "splitLine": {
+            //   "lineStyle": {
+            //     "color": "#0c2c5a"
+            //   }
+            // },
+            // "axisLine": {
+            //   "show": false
+            // }
           }],
           "series": [{
               "name": "数据上椭圆",
@@ -108,17 +132,17 @@
               symbolOffset: [0, -6],
               symbolPosition: 'end',
               z: 12,
-            //   "label": {
-            //   	"normal": {
-            //   		"show": true,
-            //   		"position": "top",
-            //   		fontSize: 12,
-            //   		color: color,
-            //   		formatter:function(params,index){
-            //   			return params.value;
-            //   		}
-            //   	}
-            //   },
+              //   "label": {
+              //   	"normal": {
+              //   		"show": true,
+              //   		"position": "top",
+              //   		fontSize: 12,
+              //   		color: color,
+              //   		formatter:function(params,index){
+              //   			return params.value;
+              //   		}
+              //   	}
+              //   },
               color: "#2DB1EF",
               data: yData
             },
@@ -206,18 +230,18 @@
               itemStyle: {
                 color: shadowColor
               },
-			//   "label": {
-            //   	"normal": {
-            //   		"show": true,
-            //   		"position": "bottom",
-            //   		fontSize: 12,
-            //   		color: color,
-            //   		formatter:function(params,index){
-						
-            //   			return params.value;
-            //   		}
-            //   	}
-            //   },
+              //   "label": {
+              //   	"normal": {
+              //   		"show": true,
+              //   		"position": "bottom",
+              //   		fontSize: 12,
+              //   		color: color,
+              //   		formatter:function(params,index){
+
+              //   			return params.value;
+              //   		}
+              //   	}
+              //   },
               data: shadowYData
             },
           ]
@@ -233,6 +257,16 @@
 
 
 <style scoped>
+  /* #form{
+    position: absolute;
+    width: 80px;
+    height: 40px;
+    left: 15%;
+    top:50%;
+    font-size: 10px;
+    color: aliceblue;
+    ;
+  } */
   #renkou {
     position: absolute;
     width: 25%;
@@ -255,4 +289,40 @@
     /* background-color: rgb(0, 0, 255,0.4); */
   }
 
+  #num50 {
+    position: absolute;
+    font-size: 12px;
+    color: aliceblue;
+    top:63%;
+    left: 3%;
+  }
+  #num100 {
+    position: absolute;
+    font-size: 12px;
+    color: aliceblue;
+    top:53%;
+    left: 3%;
+  }
+  #num150 {
+    position: absolute;
+    font-size: 12px;
+    color: aliceblue;
+    top:43%;
+    left: 3%;
+  }
+  #num200 {
+    position: absolute;
+    font-size: 12px;
+    color: aliceblue;
+    top:33%;
+    left: 3%;
+  }
+  #num250 {
+    position: absolute;
+    font-size: 12px;
+    color: aliceblue;
+    top:23%;
+    left: 3%;
+  }
+
 </style>

shuzhixiangzheng/src/components/OtherChilds/RightPage.vue

@@ -22,7 +22,7 @@ import ThreeDCharts4 from "../Utils/ThreeDCharts4";
 import EdcationPageShequ from "./EdcationPage_shequ";
 import EmploymentSituation from "../MainPageChild/EmploymentSituation";
 import EducationPage from "../MainPageChild/EducationPage";
-import VaccinationPage from "../MainPageChild/VaccinationPage";
+import VaccinationPage from "./VaccinationPage";
 export default {
   props:['dataAll'],
   name: "",

shuzhixiangzheng/src/components/OtherChilds/VaccinationPage.vue

@@ -0,0 +1,169 @@
+<template>
+  <div id="vaccinationPage">
+    <img
+      class="yq_back_img"
+      id="img1"
+      src="../../assets/png/yq_background.png"
+    />
+    <img
+      class="yq_back_img"
+      id="img2"
+      src="../../assets/png/yq_background.png"
+    />
+    <img class="yq_border_img" id="img3" src="../../assets/png/yq_border.png" />
+    <img class="yq_border_img" id="img4" src="../../assets/png/yq_border.png" />
+    <img class="yq_border_img" id="img5" src="../../assets/png/yq_border.png" />
+
+    <div id="ym_name1">疫苗接种</div>
+    <div id="ym_num">{{vaccin? vaccin.total:0 }}</div>
+    <div id="ym_name2">疫苗总接种率</div>
+    <div id="ym_num1">{{vaccin? vaccin.allRate:0 }}%</div>
+
+    <div id="ym_name3">3-12岁疫苗接种率</div>
+    <div id="ym_num2">{{vaccin? vaccin.threeToTwelveRate:0 }}%</div>
+    <div id="ym_name4">12-18岁疫苗接种率</div>
+    <div id="ym_num3">{{ vaccin?vaccin.TwelveToEighteenRate:0 }}%</div>
+    <div id="ym_name5">18岁以上疫苗接种率</div>
+    <div id="ym_num4">{{vaccin? vaccin.eighteenRate:0 }}%</div>
+  </div>
+</template>
+    
+<script>
+export default {
+  props:['vaccin'],
+  name: "VaccinationPage",
+  components: {},
+  data() {
+    return {
+      // vaccin: {
+      //   // -- 疫苗接种情况
+      //   allRate: 0, //总接种率
+      //   total: 0, //疫苗接种总数
+      //   eighteenRate: 0, //18岁以上接种率
+      //   threeToTwelveRate: 0, //3-12岁以上接种率
+      //   TwelveToEighteenRate: 0, //12-18岁以上接种率
+      // },
+    };
+  },
+  mounted() {
+   
+  },
+  methods: {},
+};
+</script>
+  
+    <style scoped>
+#ym_num {
+  position: absolute;
+   left: 24%; 
+  top: 28%;
+  font-size: 28px;
+  color: rgb(251, 212, 21);
+  font-weight: bold;
+}
+#ym_name1 {
+  position: absolute;
+  left: 26%;
+  top: 16%;
+  font-size: 12px;
+  color: rgb(4, 185, 202);
+  font-weight: bold;
+}
+
+#ym_name2 {
+  position: absolute;
+  left: 62%;
+  top: 16%;
+  font-size: 12px;
+  color: rgb(4, 185, 202);
+  font-weight: bold;
+}
+#ym_name3 {
+  position: absolute;
+  font-weight: bold;
+  top: 70%;
+  left: 12%;
+  font-size: 12px;
+}
+#ym_name4 {
+  position: absolute;
+  font-weight: bold;
+  top: 70%;
+  left: 39%;
+  font-size: 12px;
+}
+#ym_name5 {
+  position: absolute;
+  font-weight: bold;
+  top: 70%;
+  left: 67%;
+  font-size: 12px;
+}
+#ym_num1 {
+  position: absolute;
+  left: 65%;
+  top: 28%;
+  font-size: 28px;
+  color: rgb(251, 212, 21);
+  font-weight: bold;
+}
+#ym_num2 {
+  position: absolute;
+  left: 16%;
+  top: 78%;
+  font-size: 20px;
+  font-weight: bold;
+}
+#ym_num3 {
+  position: absolute;
+  left: 43%;
+  top: 78%;
+  font-size: 20px;
+  font-weight: bold;
+}
+#ym_num4 {
+  position: absolute;
+  left: 72%;
+  top: 78%;
+  font-size: 20px;
+  font-weight: bold;
+}
+#img1 {
+  left: 15%;
+  top: 6%;
+}
+#img2 {
+  left: 55%;
+  top: 6%;
+}
+#img3 {
+  left: 5%;
+  bottom: -10%;
+}
+#img4 {
+  left: 33%;
+  bottom: -10%;
+}
+#img5 {
+  right: 4%;
+  bottom: -10%;
+}
+.yq_back_img {
+  position: absolute;
+  width: 30%;
+  height: 50%;
+}
+.yq_border_img {
+  position: absolute;
+  width: 35%;
+  height: 60%;
+}
+#vaccinationPage {
+  position: absolute;
+  bottom: 1%;
+  width: 100%;
+  height: 18%;
+  /* background-color: rgb(0, 0, 255,0.1); */
+}
+</style>
+    

shuzhixiangzheng/src/components/Utils/ThreeDCharts.vue

@@ -548,8 +548,8 @@ export default {
   position: absolute;
   width: 100%;
   height: 100%;
-  /* top: -70%;
-    left: -26% */
+  top: -70%;
+    left: -26%
 }
 
 .cityGreenLand-charts {
@@ -574,8 +574,8 @@ export default {
     position: absolute;
     width: 100%;
     height: 100%;
-    /* top: -80%;
-      left: -26% */
+    top: -80%;
+      left: -26%
   }
 
   .cityGreenLand-charts {

shuzhixiangzheng/src/components/Utils/ThreeDCharts3.vue

@@ -552,6 +552,7 @@
       width: 20%;
       height: 20%;
       left: 35%;
+      top:40%
       /* background-color: rgb(255, 0, 0,0.3); */
     }
     #number_3{
@@ -559,7 +560,7 @@
       width: 60%;
       height: 65%;
       left: 1%;
-      top: 5%;
+      top: 15%;
       font-weight: bold;
       /* background-color: rgb(255, 0, 0,0.3); */
       font-size: 30px;

shuzhixiangzheng/src/components/Utils/ThreeDCharts4.vue

@@ -1,8 +1,13 @@
 <template>
   <div class="water-eval-container">
+    <img
+    class="ring_background_png"
+    src="../../assets/png/ring_background.png"
+  />
     <div class="cityGreenLand-charts" id="cityGreenLand-charts3">
 
     </div>
+   
     <div id="number" class="num3"></div>
   </div>
 </template>
@@ -479,6 +484,12 @@
 
 </script>
 <style scoped>
+  .ring_background_png {
+  position: absolute;
+  width: 56%;
+  left: 63%;
+  top: 20%;
+}
   .water-eval-container {
     position: absolute;
     width: 100%;

shuzhixiangzheng/src/components/Utils/ThreeDCharts5.vue

@@ -537,7 +537,7 @@
       position: absolute;
       width: 30%;
       height: 15%;
-      right: -84%;
+      right: -85%;
       top: 85%;
       font-weight: bold;
       /* background-color: rgb(255, 0, 0,0.3); */