From 6ee3774fb79c83d7e18ea6ab1d99601e41925679 Mon Sep 17 00:00:00 2001
From: juwei001 <974220104@qq.com>
Date: Tue, 19 Mar 2024 16:11:18 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A9=E6=B0=94=E6=8E=A5=E5=8F=A3=E9=9B=86?=
 =?UTF-8?q?=E6=88=90=EF=BC=8C3=E6=9C=8819=E6=97=A5=E9=97=AE=E9=A2=98?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/home.js                               |  36 ++
 src/components/screen-map-header/index.vue    | 113 +++--
 .../hsyf-left/partyCommittee/dangyuan.vue     |   8 +-
 .../hsyf-left/partyCommittee/zirancun.vue     |   4 +-
 src/views/next/layout/screen-header.vue       |  22 +-
 .../screen-content-left/hsyf-left/index.vue   |   3 +-
 .../screen-content-left/zdyf-left/index.vue   | 477 ++++++++++--------
 .../next/screen-content-map/cpt/home-map.vue  |  12 +-
 .../next/screen-content-map/cpt/zdyf-map.vue  | 133 +++--
 .../screen-content-right/home-right/index.vue |  82 +--
 .../screen-content-right/zdyf-right/index.vue |   7 +-
 11 files changed, 516 insertions(+), 381 deletions(-)
 create mode 100644 src/api/home.js

diff --git a/src/api/home.js b/src/api/home.js
new file mode 100644
index 0000000..0e02be0
--- /dev/null
+++ b/src/api/home.js
@@ -0,0 +1,36 @@
+import request from 'utils/request'
+
+// 党组织数量
+export function selectConfigList (params) {
+  return request({
+    url: '/api/resi/partymember/yifengScreen/selectConfigList',
+    method: 'GET',
+    params
+  })
+}
+
+// 天气
+export function lookup (params) {
+  return request({
+    url: 'https://geoapi.qweather.com/v2/city/lookup?location=即墨&key=274d6db86c074fdfa52b8e294bbc42e0',
+    method: 'GET',
+    params
+  })
+}
+
+// 天气
+export function nowTianqi (id) {
+  return request({
+    url: `https://devapi.qweather.com/v7/weather/3d?location=${id}&key=274d6db86c074fdfa52b8e294bbc42e0`,
+    method: 'GET'
+    // params
+  })
+}
+// 空气质量
+export function nowKongqi (id) {
+  return request({
+    url: `https://devapi.qweather.com/v7/air/now?location=${id}&key=274d6db86c074fdfa52b8e294bbc42e0`,
+    method: 'GET'
+    // params
+  })
+}
diff --git a/src/components/screen-map-header/index.vue b/src/components/screen-map-header/index.vue
index bd5d0fd..b297917 100644
--- a/src/components/screen-map-header/index.vue
+++ b/src/components/screen-map-header/index.vue
@@ -1,73 +1,76 @@
 <template>
-    <div class="map-header">
-        <div class="flex">
-            <div class="item" v-for="(item, index) in data" :key="index">
-                <div class="name">{{ item.name }}</div>
-                <section>
-                    <span :class="{ 'num': true, 'yellow': index === 4 }">{{ item.num }}</span>
-                    <span  :class="{'units':true, 'yellow': index === 4 }">{{item.units }}</span>
-                </section>
-            </div>
-        </div>
+  <div class="map-header">
+    <div class="flex">
+      <div class="item" v-for="(item, index) in data" :key="index">
+        <div class="name">{{ item.name }}</div>
+        <section>
+          <span :class="{ num: true, yellow: index === 4 }">{{
+            item.num
+          }}</span>
+          <span :class="{ units: true, yellow: index === 4 }">{{
+            item.units
+          }}</span>
+        </section>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
 export default {
-    data() {
-        return {
-        };
-    },
-    props:{
-        data:{
-            type:Array,
-            default:()=>[]
-        }
-    },
-    created() { },
-    methods: {},
-    components: {},
-    computed: {},
-    watch: {},
+  data () {
+    return {}
+  },
+  props: {
+    data: {
+      type: Array,
+      default: () => []
+    }
+  },
+  created () {
+  },
+  methods: {},
+  components: {},
+  computed: {},
+  watch: {}
 }
 </script>
 
 <style lang="scss" scoped>
 .flex {
-    @include flex();
-    width: 100%;
-    justify-content: space-around;
-
-    .item {
-        @include flex(column);
+  @include flex();
+  width: 100%;
+  justify-content: space-around;
 
-        section {
-            margin-top: 13px;
-        }
+  .item {
+    @include flex(column);
 
-        .name {
-            font-size: 20px;
-            color: #ACBBD4;
-        }
+    section {
+      margin-top: 13px;
+    }
 
-        .num {
-            font-family: lihei;
-            font-size: 26px;
-            color: #FFFFFF;
-            font-style: italic;
-            text-shadow: 0 0 10px #fff;
-        }
+    .name {
+      font-size: 20px;
+      color: #acbbd4;
+    }
 
-        .units {
-            font-size: 16px;
-            color: #869DB8;
-            margin-left: 5px;
-        }
-        .yellow {
-            color: #FFC486;
-            text-shadow: 0 0 10px #FFC486;
+    .num {
+      font-family: lihei;
+      font-size: 26px;
+      color: #ffffff;
+      font-style: italic;
+      text-shadow: 0 0 10px #fff;
+    }
 
-        }
+    .units {
+      font-size: 16px;
+      color: #869db8;
+      margin-left: 5px;
+    }
+    .yellow {
+      color: #ffc486;
+      text-shadow: 0 0 10px #ffc486;
     }
+  }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/next/dialog-module/hsyf-left/partyCommittee/dangyuan.vue b/src/views/next/dialog-module/hsyf-left/partyCommittee/dangyuan.vue
index 696275f..4c303f9 100644
--- a/src/views/next/dialog-module/hsyf-left/partyCommittee/dangyuan.vue
+++ b/src/views/next/dialog-module/hsyf-left/partyCommittee/dangyuan.vue
@@ -183,10 +183,10 @@ export default {
           data: [
             // "20岁以下",
             '18-30岁',
-            '30-40岁',
-            '40-50岁',
-            '50-60岁',
-            '60-70岁',
+            '31-40岁',
+            '41-50岁',
+            '51-60岁',
+            '61-70岁',
             '70岁以上'
           ],
           axisorgName: {
diff --git a/src/views/next/dialog-module/hsyf-left/partyCommittee/zirancun.vue b/src/views/next/dialog-module/hsyf-left/partyCommittee/zirancun.vue
index 757c122..aa05803 100644
--- a/src/views/next/dialog-module/hsyf-left/partyCommittee/zirancun.vue
+++ b/src/views/next/dialog-module/hsyf-left/partyCommittee/zirancun.vue
@@ -61,7 +61,7 @@ export default {
   name: '',
   data () {
     return {
-      dialogTitle: '移风店镇自然村党委班子成员',
+      dialogTitle: '移风店镇自然村党组织成员',
       loading: false,
       dataList: [
         {
@@ -2083,7 +2083,7 @@ export default {
       color: #fbe9c5;
       width: 640px;
       &_item {
-        width: 25%;
+        width: 200px;
         line-height: 48px;
         padding-left: 24px;
         border-bottom: 1px solid #bb7053;
diff --git a/src/views/next/layout/screen-header.vue b/src/views/next/layout/screen-header.vue
index 60953a9..6f2bfee 100644
--- a/src/views/next/layout/screen-header.vue
+++ b/src/views/next/layout/screen-header.vue
@@ -22,16 +22,17 @@
       </div>
     </div>
     <div class="right">
-      <span>多云</span>
-      <span>-1~7°C</span>
-      <span>北风3~4级</span>
-      <span>PM2.5</span>
+      <span>{{ tqInfo.textDay }}</span>
+      <span>{{ tqInfo.tempMin }}-{{ tqInfo.tempMax }}℃</span>
+      <span>{{ tqInfo.windDirDay }} {{ tqInfo.windScaleDay }}级</span>
+      <span>PM2.5: {{ tqInfo.pm2p5 }}</span>
     </div>
   </div>
 </template>
 
 <script>
 import { mapGetters, mapActions } from "vuex";
+import { lookup, nowTianqi, nowKongqi } from "@/api/home.js";
 export default {
   name: "screen-header",
   props: {
@@ -46,9 +47,20 @@ export default {
       showTime: "",
       showYear: "",
       showYearZh: "",
+      tqInfo: {},
     };
   },
   created() {
+    lookup().then((res) => {
+      nowTianqi(res.location[0].id).then((res1) => {
+        this.tqInfo = res1.daily[0];
+        nowKongqi(res.location[0].id).then((res1) => {
+          // console.log('kongqi::', res1)
+          this.tqInfo.pm2p5 = res1.now.pm2p5;
+          console.log("this.tqInfo::", this.tqInfo);
+        });
+      });
+    });
     const pollTime = async () => {
       this.computeCurrentTime();
       setTimeout(() => {
@@ -65,7 +77,7 @@ export default {
       set_nav: "SET_NAV",
     }),
     computeCurrentTime() {
-      let year = new Intl.DateTimeFormat("zh-CN-u-ca-chinese", {
+      const year = new Intl.DateTimeFormat("zh-CN-u-ca-chinese", {
         dateStyle: "full",
       }).format(new Date());
       this.showYearZh = "农历" + year.match(/年(.+)星期/)[1];
diff --git a/src/views/next/screen-content-left/hsyf-left/index.vue b/src/views/next/screen-content-left/hsyf-left/index.vue
index bbe4ef4..28d6ce2 100644
--- a/src/views/next/screen-content-left/hsyf-left/index.vue
+++ b/src/views/next/screen-content-left/hsyf-left/index.vue
@@ -1230,7 +1230,7 @@ export default {
           font-weight: 500;
           font-size: 14px;
           color: #fbe9c5;
-          line-height: 30px;
+          line-height: 29px;
           border-bottom: 1px dashed #bb7053;
         }
         &-item:hover {
@@ -1276,6 +1276,7 @@ export default {
     }
     &-bottom {
       width: 428px;
+      margin-top: 8px;
     }
   }
 }
diff --git a/src/views/next/screen-content-left/zdyf-left/index.vue b/src/views/next/screen-content-left/zdyf-left/index.vue
index 587dc4a..c16228c 100644
--- a/src/views/next/screen-content-left/zdyf-left/index.vue
+++ b/src/views/next/screen-content-left/zdyf-left/index.vue
@@ -1,260 +1,305 @@
 <template>
-        <div>
-                <div class='card h292'>
-                        <screen-title>
-                                <div slot="left" class="screen-title-left">领导关怀</div>
-                                <div slot="right" class="screen-title-right" @click="set_ldhg(true)"><span>更多</span></div>
-                        </screen-title>
-                        <div class="card-item-ldgh">
-                                <div class="title">用中国种子保障中国粮食安全</div>
-                                <img src="@/assets/images/index/banner.png" alt="">
-                                <span>2022年4月10日，习近平总书记在海南省三亚市崖州湾种子实验室考察调研时强调，种子是我国粮食安全的关键。只有用自己的手攥紧中国种子，才能端稳中国饭碗，才能实现粮食安全。种源要做到自主可控，种业科技要自立自强。</span>
-                        </div>
-                </div>
-                <div class='card h292' style="margin-top: 8px;">
-                        <screen-title>
-                                <div slot="left" class="screen-title-left" @click="handelClickEmap" style="cursor: pointer;">移风优势</div>
-                        </screen-title>
-                        <div class="card-item-yfys">
-                                <div class="item">
-                                        <img src="@/assets/images/index/yfys1.png" alt="">
-                                        <div class="right">
-                                                <div class="top">战略优势</div>
-                                                <div class="center yellow"><span class="num">3</span> 年</div>
-                                                <div class="bot">中央1号文件</div>
-                                        </div>
-                                </div>
-                                <div class="item">
-                                        <img src="@/assets/images/index/yfys2.png" alt="">
-                                        <div class="right">
-                                                <div class="top">自然优势</div>
-                                                <div class="center green">北纬 <span class="num">36°</span></div>
-                                                <div class="bot">黄金育种地带</div>
-                                        </div>
-                                </div>
-                                <div class="item">
-                                        <img src="@/assets/images/index/yfys3.png" alt="">
-                                        <div class="right">
-                                                <div class="top">区位优势</div>
-                                                <div class="center violet"><span class="num">1</span> 小时</div>
-                                                <div class="bot">交通辐射圈</div>
-                                        </div>
-                                </div>
-                                <div class="item">
-                                        <img src="@/assets/images/index/yfys4.png" alt="">
-                                        <div class="right">
-                                                <div class="top">产业优势</div>
-                                                <div class="center blue"><span class="num">5.2</span> 亿元</div>
-                                                <div class="bot">种子年销售额</div>
-                                        </div>
-                                </div>
-                        </div>
-                </div>
-                <div class='card h292 m-top12'>
-                        <screen-title>
-                                <div slot="left" class="screen-title-left">移风成就</div>
-                                <div slot="right" @click='set_yfcj(true)' class="screen-title-right"><span>发展历程</span></div>
-                        </screen-title>
-                        <div class="card-item-yfcj">
-                                <div class="card-item-yfcj-1" style="color: #7AFAFF; top: 10px; left: 15%">省级农业产业强镇</div>
-                                <div class="card-item-yfcj-2" style="color:  #FFE17A; top: 66px; left: 49px;">省级乡村振兴集中推进区</div>
-                                <div class="card-item-yfcj-3" style="color:   #FF5027; top: 20px; left: 59%;">省级现代农业产业园</div>
-                                <div class="card-item-yfcj-4" style="color:   #1FCD54; top:120px; left: 14%;">省级农业产业强镇</div>
-                                <div class="card-item-yfcj-5" style="color:   #FFFC27; top: 80px; left: 64%;">省数字乡村试点乡镇</div>
-                                <div class="card-item-yfcj-6" style="color:   #FF8F4C; top: 130px; left: 64%;">中国淘宝小镇
-                                </div>
-                                <div class="card-item-yfcj-7" style="color:   #cd8eee; top: 160px; left: 15%;">
-                                        年产蔬菜约60万吨、占全区总量的40%
-                                </div>
-                                <div class="card-item-yfcj-8" style="color:   #50aeff; top: 170px; left: 60%;">
-                                        年产粮食10万吨、占全区总量的25%
-                                </div>
-                        </div>
-                </div>
+  <div>
+    <div class="card h292">
+      <screen-title>
+        <div slot="left" class="screen-title-left">国家战略</div>
+        <div slot="right" class="screen-title-right" @click="set_ldhg(true)">
+          <span>更多</span>
         </div>
+      </screen-title>
+      <div class="card-item-ldgh">
+        <div class="title">用中国种子保障中国粮食安全</div>
+        <img src="@/assets/images/index/banner.png" alt="" />
+        <span
+          >2022年4月10日，习近平总书记在海南省三亚市崖州湾种子实验室考察调研时强调，种子是我国粮食安全的关键。只有用自己的手攥紧中国种子，才能端稳中国饭碗，才能实现粮食安全。种源要做到自主可控，种业科技要自立自强。</span
+        >
+      </div>
+    </div>
+    <div class="card h292" style="margin-top: 8px">
+      <screen-title>
+        <div
+          slot="left"
+          class="screen-title-left"
+          @click="handelClickEmap"
+          style="cursor: pointer"
+        >
+          移风优势
+        </div>
+      </screen-title>
+      <div class="card-item-yfys">
+        <div class="item">
+          <img src="@/assets/images/index/yfys1.png" alt="" />
+          <div class="right">
+            <div class="top">战略优势</div>
+            <div class="center yellow"><span class="num">3</span> 年</div>
+            <div class="bot">中央1号文件</div>
+          </div>
+        </div>
+        <div class="item">
+          <img src="@/assets/images/index/yfys2.png" alt="" />
+          <div class="right">
+            <div class="top">自然优势</div>
+            <div class="center green">北纬 <span class="num">36°</span></div>
+            <div class="bot">黄金育种地带</div>
+          </div>
+        </div>
+        <div class="item">
+          <img src="@/assets/images/index/yfys3.png" alt="" />
+          <div class="right">
+            <div class="top">区位优势</div>
+            <div class="center violet"><span class="num">1</span> 小时</div>
+            <div class="bot">交通辐射圈</div>
+          </div>
+        </div>
+        <div class="item">
+          <img src="@/assets/images/index/yfys4.png" alt="" />
+          <div class="right">
+            <div class="top">产业优势</div>
+            <div class="center blue"><span class="num">5.2</span> 亿元</div>
+            <div class="bot">种子年销售额</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="card h292 m-top12">
+      <screen-title>
+        <div slot="left" class="screen-title-left">移风成就</div>
+        <div slot="right" @click="set_yfcj(true)" class="screen-title-right">
+          <span>发展历程</span>
+        </div>
+      </screen-title>
+      <div class="card-item-yfcj">
+        <div
+          class="card-item-yfcj-1"
+          style="color: #7afaff; top: 10px; left: 15%"
+        >
+          省级农业产业强镇
+        </div>
+        <div
+          class="card-item-yfcj-2"
+          style="color: #ffe17a; top: 66px; left: 49px"
+        >
+          省级乡村振兴集中推进区
+        </div>
+        <div
+          class="card-item-yfcj-3"
+          style="color: #ff5027; top: 20px; left: 59%"
+        >
+          省级现代农业产业园
+        </div>
+        <div
+          class="card-item-yfcj-4"
+          style="color: #1fcd54; top: 120px; left: 14%"
+        >
+          省级农业产业强镇
+        </div>
+        <div
+          class="card-item-yfcj-5"
+          style="color: #fffc27; top: 80px; left: 64%"
+        >
+          省数字乡村试点乡镇
+        </div>
+        <div
+          class="card-item-yfcj-6"
+          style="color: #ff8f4c; top: 130px; left: 64%"
+        >
+          中国淘宝小镇
+        </div>
+        <div
+          class="card-item-yfcj-7"
+          style="color: #cd8eee; top: 160px; left: 15%"
+        >
+          年产蔬菜约60万吨、占全区总量的40%
+        </div>
+        <div
+          class="card-item-yfcj-8"
+          style="color: #50aeff; top: 170px; left: 60%"
+        >
+          年产粮食10万吨、占全区总量的25%
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
-import { mapActions } from 'vuex'
+import { mapActions } from "vuex";
 export default {
-        data() {
-                return {};
-        },
-        created() { },
-        methods: {
-                ...mapActions({
-                        showGlobalDialog: 'showGlobalDialog',
-                        set_yfcj: 'SET_YFCJ',
-                        set_ldhg: 'SET_LDGH'
-                }),
-             handelClickEmap(){
-                this.$EventBus.$emit('switcMapType', 'Emap')
-             }
-        },
-        components: {},
-        computed: {},
-        watch: {},
-}
+  data() {
+    return {};
+  },
+  created() {},
+  methods: {
+    ...mapActions({
+      showGlobalDialog: "showGlobalDialog",
+      set_yfcj: "SET_YFCJ",
+      set_ldhg: "SET_LDGH",
+    }),
+    handelClickEmap() {
+      this.$EventBus.$emit("switcMapType", "Emap");
+    },
+  },
+  components: {},
+  computed: {},
+  watch: {},
+};
 </script>
 
 <style lang="scss" scoped>
 .card {
-        width: 100%;
-        height: 292px;
+  width: 100%;
+  height: 292px;
 
-        &-item-ldgh {
-                padding: 16px;
-                width: 100%;
-                flex: 1;
-                box-sizing: border-box;
-                @include flex(column);
-                justify-content: space-around;
-                position: relative;
-                .title{
-                        position: absolute;
-                        top: 54px;
-                        font-family: FZZhengHeiS-B-GB;
-                        left: 113px;
-                        font-size: 24px;
-                        font-weight: 600;
-                }
-                img {
-                        height: 110px;
-                        width: 100%;
-                }
+  &-item-ldgh {
+    padding: 16px;
+    width: 100%;
+    flex: 1;
+    box-sizing: border-box;
+    @include flex(column);
+    justify-content: space-around;
+    position: relative;
+    .title {
+      position: absolute;
+      top: 54px;
+      font-family: FZZhengHeiS-B-GB;
+      left: 113px;
+      font-size: 24px;
+      font-weight: 600;
+    }
+    img {
+      height: 110px;
+      width: 100%;
+    }
 
-                span {
-                        color: #fff;
-                        font-size: 16px;
-                        text-indent: 2em;
-                }
-        }
-
-        &-item-yfys {
-                padding: 16px;
-                width: 100%;
-                flex: 1;
-                box-sizing: border-box;
-                display: flex;
-                flex-wrap: wrap;
-
-                .item {
-                        width: 50%;
-                        color: #fff;
-                        display: flex;
-                        align-items: center;
-
-                        .right {
-                                flex: 1;
+    span {
+      color: #fff;
+      font-size: 16px;
+      text-indent: 2em;
+    }
+  }
 
-                                .top {
-                                        background-size: 100% 100%;
-                                        background: url("~@/assets/images/index/yfyskuang.png") no-repeat;
-                                }
+  &-item-yfys {
+    padding: 16px;
+    width: 100%;
+    flex: 1;
+    box-sizing: border-box;
+    display: flex;
+    flex-wrap: wrap;
 
-                                .center {
-                                        .num {
-                                                font-family: pangmenzhengdao;
-                                                font-size: 28px;
+    .item {
+      width: 50%;
+      color: #fff;
+      display: flex;
+      align-items: center;
 
-                                        }
-                                }
+      .right {
+        flex: 1;
 
-                                .bot {
-                                        color: #BCD0F0;
-                                        font-size: 14px;
-                                }
-                        }
+        .top {
+          background-size: 100% 100%;
+          background: url("~@/assets/images/index/yfyskuang.png") no-repeat;
+        }
 
-                        img {
-                                width: 80px;
-                                height: 80px;
-                                margin-right: 10px;
-                        }
-                }
+        .center {
+          .num {
+            font-family: pangmenzhengdao;
+            font-size: 28px;
+          }
+        }
 
+        .bot {
+          color: #bcd0f0;
+          font-size: 14px;
         }
+      }
 
-        &-item-yfcj {
-                padding: 16px;
-                width: 100%;
-                flex: 1;
-                box-sizing: border-box;
-                position: relative;
+      img {
+        width: 80px;
+        height: 80px;
+        margin-right: 10px;
+      }
+    }
+  }
 
-                &::before {
-                        content: '';
-                        position: absolute;
-                        top: 0;
-                        left: 0;
-                        width: 100%;
-                        height: 100%;
-                        background: url('~@/assets/images/index/yfcjBg.png') no-repeat 50% 50%;
-                        animation: rotate 5s linear infinite;
-                        z-index: -1;
-                }
+  &-item-yfcj {
+    padding: 16px;
+    width: 100%;
+    flex: 1;
+    box-sizing: border-box;
+    position: relative;
 
-                &-1,
-                &-2,
-                &-3,
-                &-4,
-                &-5,
-                &-6,
-                &-7,
-                &-8 {
-                        position: absolute;
-                        background: url('~@/assets/images/index/yfcjkuang.png') no-repeat 50% 50%;
-                        background-size: 100% 100%;
-                        animation: zoomIn 2s infinite; /* 持续时间为 1 秒，缓动效果为 ease-in-out */
-                        transform-origin: center center; /* 缩放的原点为元素的中心 */
-                        &::after {
-                                content: '·';
-                                width: 8px;
-                                height: 8px;
-                                position: absolute;
-                                top: -34px;
-                                left: -18px;
-                                font-size: 63px;
-                        }
-                }
+    &::before {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: url("~@/assets/images/index/yfcjBg.png") no-repeat 50% 50%;
+      animation: rotate 5s linear infinite;
+      z-index: -1;
+    }
 
-                &-8 {
-                        width: 140px;
-                        text-indent: 2;
-                }
+    &-1,
+    &-2,
+    &-3,
+    &-4,
+    &-5,
+    &-6,
+    &-7,
+    &-8 {
+      position: absolute;
+      background: url("~@/assets/images/index/yfcjkuang.png") no-repeat 50% 50%;
+      background-size: 100% 100%;
+      animation: zoomIn 2s infinite; /* 持续时间为 1 秒，缓动效果为 ease-in-out */
+      transform-origin: center center; /* 缩放的原点为元素的中心 */
+      &::after {
+        content: "·";
+        width: 8px;
+        height: 8px;
+        position: absolute;
+        top: -34px;
+        left: -18px;
+        font-size: 63px;
+      }
+    }
 
-                &-7 {
-                        width: 150px;
-                        text-indent: 2;
-                }
+    &-8 {
+      width: 140px;
+      text-indent: 2;
+    }
 
-        }
+    &-7 {
+      width: 150px;
+      text-indent: 2;
+    }
+  }
 }
 
 .yellow {
-        color: #FFDFA7;
+  color: #ffdfa7;
 }
 
 .green {
-        color: #25E3B6;
+  color: #25e3b6;
 }
 
 .violet {
-        color: #CA8AED;
+  color: #ca8aed;
 }
 
 .blue {
-        color: #D4E7FF;
+  color: #d4e7ff;
 }
 
 @keyframes rotate {
-        from {
-                transform: rotate(0deg);
-        }
+  from {
+    transform: rotate(0deg);
+  }
 
-        to {
-                transform: rotate(360deg);
-        }
+  to {
+    transform: rotate(360deg);
+  }
 }
 @keyframes zoomIn {
   0% {
diff --git a/src/views/next/screen-content-map/cpt/home-map.vue b/src/views/next/screen-content-map/cpt/home-map.vue
index 4ed5734..c0cb122 100644
--- a/src/views/next/screen-content-map/cpt/home-map.vue
+++ b/src/views/next/screen-content-map/cpt/home-map.vue
@@ -1,6 +1,6 @@
 <template>
   <div style="width: 100%; height: 100%">
-    <div id="myMap" style="background-color: #f0f0f0;">
+    <div id="myMap" style="background-color: #f0f0f0">
       <screen-map-header :data="headerList"></screen-map-header>
     </div>
   </div>
@@ -10,6 +10,7 @@ import { Scene, PolygonLayer, LineLayer } from '@antv/l7'
 import { GaodeMap } from '@antv/l7-maps'
 import yifengJson from './yifeng.json'
 import chinaMap from './chinaMap.vue'
+import { selectConfigList } from '@/api/home'
 import { mapActions } from 'vuex'
 let myMap
 let scene
@@ -88,6 +89,15 @@ export default {
   },
   methods: {
     init () {
+      selectConfigList({ type: 1 }).then((res) => {
+        this.headerList = this.headerList.map((item) => {
+          const data = res.data.filter(i => i.name == item.name)
+          return {
+            ...item,
+            num: data[0].value
+          }
+        })
+      })
       if (!yifengJson) return false
       myMap = new GaodeMap({
         pitch: 40.24716321414439,
diff --git a/src/views/next/screen-content-map/cpt/zdyf-map.vue b/src/views/next/screen-content-map/cpt/zdyf-map.vue
index 1c89d34..1161b8c 100644
--- a/src/views/next/screen-content-map/cpt/zdyf-map.vue
+++ b/src/views/next/screen-content-map/cpt/zdyf-map.vue
@@ -170,7 +170,7 @@ export default {
         showLabel: false,
         center: [120.220563, 36.496127],
         token: 'fc14b42e0ca18387866d68ebd4f150c1',
-        zoom: 7,
+        zoom: 15,
         isHotspot: false,
         showIndoorMap: false,
         showBuildingBlock: false,
@@ -186,7 +186,8 @@ export default {
       })
       scene.on('loaded', () => {
         if (!type) {
-          this.initCircle()
+          // this.initCircle()
+          this.initPolygonLayer(type)
         } else if (type == 'unit') {
           this.initDot(point)
           this.initPolygonLayer()
@@ -202,16 +203,15 @@ export default {
     },
     initCircle () {
       circleLayerSmall = new ImageLayer({})
-      circleLayerSmall.source(
-        'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/yifeng/2024-02-03/circle.png',
-        {
-          // circleLayerSmall.source(`${process.env.VUE_APP_MAP_IMG}/circle1.png`, {
-          parser: {
-            type: 'image',
-            extent: [121.0819, 35.8908, 119.2372, 37.2278]
-          }
+      // circleLayerSmall.source(
+      // 'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/yifeng/2024-02-03/circle.png',
+      // {
+      circleLayerSmall.source(`${process.env.VUE_APP_MAP_IMG}/circle1.png`, {
+        parser: {
+          type: 'image',
+          extent: [121.0819, 35.8908, 119.2372, 37.2278]
         }
-      )
+      })
       scene.addLayer(circleLayerSmall)
       const data = jdbandaoJson
       // 画区域面积
@@ -221,14 +221,14 @@ export default {
         .size(300)
         .source(data)
         .color('name', ['rgba(0, 127, 241, .5)'])
-        .shape('extrude')
-        // .shape("fill")
+        // .shape('extrude')
+        .shape('fill')
         .style({
           opacityLinear: {
             enable: true, // true - false
             dir: 'out' // in - out
           },
-          opacity: 0.8,
+          opacity: 1,
           heightfixed: true,
           sourceColor: '#4ee8fc',
           targetColor: '#00284e'
@@ -247,15 +247,15 @@ export default {
       }
       scene.setZoom(10)
       roadLayer = new ImageLayer({})
-      roadLayer.source(
-        'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/yifeng/2024-02-03/road.png',
-        {
-          // roadLayer.source(`${process.env.VUE_APP_MAP_IMG}/road1.png`, {
-          parser: {
-            type: 'image',
-            extent: [119.7829, 36.7398, 120.5205, 36.2552]
-          }
-        })
+      // roadLayer.source(
+      //   'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/yifeng/2024-02-03/road.png',
+      //   {
+      roadLayer.source(`${process.env.VUE_APP_MAP_IMG}/road1.png`, {
+        parser: {
+          type: 'image',
+          extent: [119.7829, 36.7398, 120.5205, 36.2552]
+        }
+      })
       scene.addLayer(roadLayer)
       const that = this
       roadLayer.on('click', (ev) => {
@@ -273,7 +273,7 @@ export default {
       if (polygonLayer) {
         scene.removeLayer(polygonLayer)
       }
-      scene.setZoom(10)
+      scene.setZoom(15)
       roadLayer = new ImageLayer({})
       roadLayer.source('/images/map/flow.png', {
         parser: {
@@ -301,32 +301,55 @@ export default {
       const { darkStyle } = this
       const styleConfig = darkStyle
       const data = yifengJson
+      const data1 = jdbandaoJson
       // 画区域面积
+      polygonLayer = new PolygonLayer({
+        autoFit: true
+      })
+        .source(data1)
+        .color('name', ['rgba(0, 127, 241, .5)'])
+        .shape('fill')
+        .style({
+          // opacityLinear: {
+          //   enable: true, // true - false
+          //   dir: 'out' // in - out
+          // },
+          opacity: 0.6,
+          // heightfixed: true,
+          sourceColor: '#4ee8fc',
+          targetColor: '#00284e'
+        })
+      scene.addLayer(polygonLayer)
       polygonLayer = new PolygonLayer({
         autoFit: true
       })
         .size(300)
         .source(data)
-        .color(
-          'name',
-          type == 'resource'
-            ? styleConfig.polygonColor
-            : ['rgba(0, 127, 241, .5)']
-        )
+        .color('name', ['#3372d0'])
         .shape('extrude')
-        // .shape("fill")
+        // .shape('fill')
         .style({
           opacityLinear: {
             enable: true, // true - false
             dir: 'out' // in - out
           },
-          opacity: 0.8,
+          opacity: 1,
           heightfixed: true,
-          sourceColor: '#4ee8fc',
+          sourceColor: '#3372d0',
           targetColor: '#00284e'
         })
       scene.addLayer(polygonLayer)
 
+      polygonLayer.on('mousemove', (e) => {
+        // console.log(e);
+        // if (e.feature.properties.content) {
+        // const popup = new Popup({
+        //   offsets: [0, -0],
+        //   closeButton: false
+        // })
+        // scene.addPopup(popup)
+        // }?
+      })
       // 画区域边
       lineLayer = new LineLayer({
         zIndex: 2,
@@ -347,28 +370,30 @@ export default {
         })
       scene.addLayer(lineLayer)
 
-      textLayer = new PolygonLayer({
-        zIndex: 20
-      })
-        .source(data)
-        .color('name', styleConfig.textColor)
-        .shape('name', 'text')
-        .size(14)
-        .style({
-          textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
-          textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直]
-          spacing: 2, // 字符间距
-          padding: [2, 2], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
-          stroke: styleConfig.textStrokeColor, // 描边颜色
-          strokeWidth: 0.1, // 描边宽度
-          strokeOpacity: 0.8,
-          raisingHeight: 300,
-          textAllowOverlap: true
-        })
-        .active(true)
-      scene.addLayer(textLayer)
+      // textLayer = new PolygonLayer({
+      //   zIndex: 20
+      // })
+      //   .source(data)
+      //   .color('name', styleConfig.textColor)
+      //   .shape('name', 'text')
+      //   .size(14)
+      //   .style({
+      //     textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left
+      //     textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直]
+      //     spacing: 2, // 字符间距
+      //     padding: [2, 2], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近
+      //     stroke: styleConfig.textStrokeColor, // 描边颜色
+      //     strokeWidth: 0.1, // 描边宽度
+      //     strokeOpacity: 0.8,
+      //     raisingHeight: 300,
+      //     textAllowOverlap: true
+      //   })
+      //   .active(true)
+      // scene.addLayer(textLayer)
       const _this = this
-      polygonLayer.on('click', (e) => {})
+      polygonLayer.on('click', (e) => {
+        e
+      })
     },
     initDot (data) {
       scene.addImage('dotBto', require('@/assets/images/map/dot.png'))
diff --git a/src/views/next/screen-content-right/home-right/index.vue b/src/views/next/screen-content-right/home-right/index.vue
index a738278..8fb816a 100644
--- a/src/views/next/screen-content-right/home-right/index.vue
+++ b/src/views/next/screen-content-right/home-right/index.vue
@@ -61,75 +61,75 @@
 
 <script>
 export default {
-  data() {
+  data () {
     return {
       weatherList: [
         {
-          units: "雨量",
-          img: require("@/assets/images/weather/yu.png"),
-          value: "20~30mm",
+          units: '雨量',
+          img: require('@/assets/images/weather/yu.png'),
+          value: '20~30mm'
         },
         {
-          units: "光照",
-          img: require("@/assets/images/weather/gz.png"),
-          value: "18.8lux",
+          units: '光照',
+          img: require('@/assets/images/weather/gz.png'),
+          value: '18.8lux'
         },
         {
-          units: "土壤温度",
-          img: require("@/assets/images/weather/trwd.png"),
-          value: "15~21°C",
+          units: '土壤温度',
+          img: require('@/assets/images/weather/trwd.png'),
+          value: '15~21°C'
         },
         {
-          units: "土壤湿度",
-          img: require("@/assets/images/weather/trsd.png"),
-          value: "52°C",
-        },
+          units: '土壤湿度',
+          img: require('@/assets/images/weather/trsd.png'),
+          value: '52°C'
+        }
       ],
-      videoStatus: "",
-      videoUrl: process.env.VUE_APP_VIDEO_URL + "1.mp4",
+      videoStatus: '',
+      videoUrl: process.env.VUE_APP_VIDEO_URL + '1.mp4',
       cultureList: [
         {
-          imgSrc: require("@/assets/images/resource/whyf/1.jpg"),
-          title: "大欧鸟笼制作技艺",
+          imgSrc: require('@/assets/images/resource/whyf/1.jpg'),
+          title: '大欧鸟笼制作技艺'
         },
         {
-          imgSrc: require("@/assets/images/resource/whyf/2.jpg"),
-          title: "虎头鞋虎头帽",
+          imgSrc: require('@/assets/images/resource/whyf/2.jpg'),
+          title: '虎头鞋虎头帽'
         },
         {
-          imgSrc: require("@/assets/images/resource/whyf/3.jpg"),
-          title: "金吉友拳法",
+          imgSrc: require('@/assets/images/resource/whyf/3.jpg'),
+          title: '金吉友拳法'
         },
         {
-          imgSrc: require("@/assets/images/resource/whyf/4.jpg"),
-          title: "张院簸箕制作技艺",
+          imgSrc: require('@/assets/images/resource/whyf/4.jpg'),
+          title: '张院簸箕制作技艺'
         },
         {
-          imgSrc: require("@/assets/images/resource/whyf/5.jpg"),
-          title: "毛子埠升制作技艺",
+          imgSrc: require('@/assets/images/resource/whyf/5.jpg'),
+          title: '毛子埠升制作技艺'
         },
         {
-          imgSrc: require("@/assets/images/resource/whyf/6.jpg"),
-          title: "上铂金银器打造工艺",
-        },
-      ],
-    };
+          imgSrc: require('@/assets/images/resource/whyf/6.jpg'),
+          title: '上铂金银器打造工艺'
+        }
+      ]
+    }
   },
-  created() {},
-  mounted() {},
-  beforeDestroy() {},
+  created () {},
+  mounted () {},
+  beforeDestroy () {},
   methods: {
-    handelVideoPlay() {
-      this.videoStatus = "play";
-    },
-    handelVideoPause() {
-      this.videoStatus = "pause";
+    handelVideoPlay () {
+      this.videoStatus = 'play'
     },
+    handelVideoPause () {
+      this.videoStatus = 'pause'
+    }
   },
   components: {},
   computed: {},
-  watch: {},
-};
+  watch: {}
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/next/screen-content-right/zdyf-right/index.vue b/src/views/next/screen-content-right/zdyf-right/index.vue
index 5ac516c..659d797 100644
--- a/src/views/next/screen-content-right/zdyf-right/index.vue
+++ b/src/views/next/screen-content-right/zdyf-right/index.vue
@@ -258,15 +258,18 @@ export default {
           width: 430px;
 
           .left {
+            padding-top: 4px;
             text-indent: 2em;
             flex: 1;
             padding-left: 3px;
             box-sizing: border-box;
             width: 217px;
-            overflow: hidden;
-            -webkit-line-clamp: 4;
+            height: 98px;
             /* 显示的行数 */
+            display: -webkit-box;
+            -webkit-line-clamp: 4; /* 最多显示4行 */
             -webkit-box-orient: vertical;
+            overflow: hidden;
             text-overflow: ellipsis;
           }