From 28dfa7bbd50bd8cd64c24dc13c88b63f85c80564 Mon Sep 17 00:00:00 2001
From: chenrui <1950717904@qq.com>
Date: Thu, 13 Jun 2024 09:17:25 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9=20?=
 =?UTF-8?q?=E5=8E=BB=E6=8E=89=E9=A1=B5=E9=9D=A2=E6=A0=87=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/style/index.less                   |   1 +
 src/views/common/analyse.vue                  |  24 ++-
 src/views/enforce/enterpriseBaseInfo.vue      |   1 +
 src/views/enforce/scanQrCode.vue              |   6 +-
 src/views/enforce/sign.vue                    |   1 +
 src/views/enforceHome.vue                     | 178 ++++++++++++++++--
 src/views/enterprise/complaint.vue            |   1 +
 src/views/enterprise/complaintNoScan.vue      |   4 +-
 .../enterprise/enterpriseInspectionDetail.vue |  17 +-
 .../enterprise/enterpriseInspectionList.vue   |   6 +-
 src/views/enterprise/qrCode.vue               |   1 +
 src/views/enterprise/register.vue             |   5 +-
 src/views/enterprise/registrationDetail.vue   |   7 +-
 src/views/enterprise/registrationEdit.vue     |   1 +
 src/views/enterprise/registrationList.vue     |   3 +-
 15 files changed, 218 insertions(+), 38 deletions(-)

diff --git a/src/assets/style/index.less b/src/assets/style/index.less
index 687dcbc..d230a98 100644
--- a/src/assets/style/index.less
+++ b/src/assets/style/index.less
@@ -19,6 +19,7 @@ html,body,#app{
     overflow-y: scroll;
     background-color: #f4f4f4;
     flex: 1;
+    margin-top: 2%;
 }
 .header_body {
     height: 50px;
diff --git a/src/views/common/analyse.vue b/src/views/common/analyse.vue
index a5fb912..ee3f502 100644
--- a/src/views/common/analyse.vue
+++ b/src/views/common/analyse.vue
@@ -1,14 +1,14 @@
 <template>
     <div class="address_edit">
         <!-- 导航栏 -->
-        <div class="header_body">
+        <!-- <div class="header_body">
             <header-nav
                     :slefBack="true"
                     @goBack="goBack"
                     :titelText="`统计分析`"
             >
             </header-nav>
-        </div>
+        </div> -->
         <!-- 中间 -->
         <div class="warp_body">
             <div class="countbox">
@@ -72,6 +72,9 @@
 
     onUnmounted(() => {
         console.log("=============销毁完毕=============")
+        const chartEle =  document.getElementById("echartRing");
+        console.log(chartEle)
+        // chartEle.removeAttribute('_echarts_instance_')
     });
 
     // 保存地址操作
@@ -89,7 +92,12 @@
     };
 
     const echartInit = (data, targetId) => {
-        var myChart = echarts.init(document.getElementById(targetId));
+      var container = document.getElementById(targetId);
+      var myChart = echarts.getInstanceByDom(container);
+      if (myChart) {
+          myChart.dispose();
+      }
+        myChart = echarts.init(document.getElementById(targetId));
         // 指定图表的配置项和数据
         let option = {
             tooltip: {
@@ -142,8 +150,12 @@
     };
 
     const initSchedule = (dataAll, targetId) => {
-        let _this = this;
-        var myChartLine = echarts.init(document.getElementById(targetId));
+      var container = document.getElementById(targetId);
+      var myChartLine = echarts.getInstanceByDom(container);
+      if (myChartLine) {
+        myChartLine.dispose();
+      }
+        myChartLine = echarts.init(document.getElementById(targetId));
         let myColor = ['#3C83FF']
         var option = {
             tooltip: {
@@ -336,7 +348,6 @@
 
     const initData = (dataX, dataY, dataPercent, targetId) => {
 
-
         // var dataX = ['生态环境检查', '卫生健康检查', '商务领域检查', '财务领域检查', '水务领域检查']
         // var dataY = ['30', '20', '15', '25', '10'];
         // var dataPercent = ['30', '20', '15', '25', '10'];
@@ -445,6 +456,7 @@
 
     .warp_body {
         background-image: linear-gradient(to bottom, #ebf3fb, transparent);
+        margin-top: 1%;
     }
 
     .countbox, .analybox {
diff --git a/src/views/enforce/enterpriseBaseInfo.vue b/src/views/enforce/enterpriseBaseInfo.vue
index 10bc1e8..e9ab14c 100644
--- a/src/views/enforce/enterpriseBaseInfo.vue
+++ b/src/views/enforce/enterpriseBaseInfo.vue
@@ -370,6 +370,7 @@
         //border-radius: 0.25rem;
         background-image: linear-gradient(to bottom, #ebf3fb, #fff);
         overflow-y: auto;
+        margin-top: 1%;
     }
 
     .qy-name {
diff --git a/src/views/enforce/scanQrCode.vue b/src/views/enforce/scanQrCode.vue
index 49de785..ca33e42 100644
--- a/src/views/enforce/scanQrCode.vue
+++ b/src/views/enforce/scanQrCode.vue
@@ -1,15 +1,15 @@
 <template>
     <div class="home app_content">
         <!-- 导航栏 -->
-        <div class="header_body">
+        <!-- <div class="header_body"> -->
             <!-- <header-nav :leftArrow="false" titelText="扫码入企"></header-nav> -->
-            <header-nav
+            <!-- <header-nav
                     :slefBack="true"
                     @goBack="goBack"
                     :titelText="`扫码入企`"
             >
             </header-nav>
-        </div>
+        </div> -->
 
         <!-- 中间 -->
         <div class="warp_body">
diff --git a/src/views/enforce/sign.vue b/src/views/enforce/sign.vue
index 122ea15..fcd8b7f 100644
--- a/src/views/enforce/sign.vue
+++ b/src/views/enforce/sign.vue
@@ -561,6 +561,7 @@ const beforeRead = (file) =>{
     //border-radius: 0.25rem;
     background-image: linear-gradient(to bottom, #ebf3fb, #fff);
     overflow-y: auto;
+    margin-top: 1%;
 }
 
 .qy-name{
diff --git a/src/views/enforceHome.vue b/src/views/enforceHome.vue
index 9b6dc4b..50c2ebf 100644
--- a/src/views/enforceHome.vue
+++ b/src/views/enforceHome.vue
@@ -1,20 +1,36 @@
 <template>
-    <div class="home app_content">
+    <Loading class="loading-div" type="spinner" v-show="isLoading" color="#1989fa" />
+    <div class="home app_content" v-if="!isLoading">
         <!-- 导航栏 -->
         <!-- <div class="header_body">
                     <header-nav :leftArrow="false" titelText="执法监督码"></header-nav>
                 </div> -->
 
         <!-- 中间 -->
-        <div class="warp_body">
+        
+        <div class="warp_body" >
             <div class="logobox"></div>
-            <div class="streamer" @click="">
+            <!-- <div class="streamer" @click="">
                 <i></i>
                 <span class="marquee" :key="freshMap.key">
-          <span class="scroll-text" v-for="(item, index) in carouselList">{{ item.planName }}</span>
-        </span>
+                  <span class="scroll-text" v-for="(item, index) in carouselList">{{ item.planName }}</span>
+                </span>
 
-            </div>
+            </div> -->
+            <van-notice-bar
+              :text="noticeStr"
+              :key="freshMap.key"
+              left-icon="volume-o"
+              scrollable
+              :speed="100"
+              class="streamer"
+            />
+           
+            <!-- <div class="container streamer" id="notification-container":key="freshMap.key">
+                <div class="notification" id="notification">
+                    {{ notificationtext }}
+                </div>
+            </div> -->
             <div class="noticbox" @click="toNoticeView"><i></i><span class="new"></span>通知</div>
             <!-- <refresh-list v-model:freshMap="freshMap" @refresh="onRefresh" @onLoad="onLoad"> -->
             <div class="carousel_box" @onLoad="onLoad">
@@ -56,9 +72,10 @@
 
 <script setup name="Home">
     import Vconsolefrom from 'vconsole';
+    import { Loading } from 'vant';
     import {getEnterpriseMerchantAuthorization, getSzyptLoginAuth} from '../api/Home';
     import {queryEnforcementInspectionProgramListNoPermission} from "@/api/enforce";
-
+    const isLoading = ref(true);
     const {useCommon} = $globalStore;
     const router = useRouter();
     const route = useRoute();
@@ -71,6 +88,29 @@
         listFinished: false, // 是否加载完成标识
         key: 0,
     });
+    // 模拟异步数据加载
+    // setTimeout(() => {
+     
+    //   // 如果不是执法用户 则跳转
+    //   router.push(
+    //       {
+    //           path: "/noAccess"
+    //       });
+          // isLoading.value = false;
+            
+    // }, 3000); 
+
+    //定时器
+    let noticeObj = reactive({
+      noticeList: [],
+      notificationtext: "",
+      noticeTimer: null,
+      itemWidth: 0,
+      offset: 0,
+      step: 3,
+      speed: 20,
+    });
+
     const data = reactive({});
     const adviceList = reactive([]);
     const boutiqueAttr = reactive({
@@ -94,6 +134,7 @@
         // 	boutique = res?.data;
         // }
     };
+    var noticeStr = reactive("");
 
     /**扫码入企 */
     const toScanCodeView = async () => {
@@ -124,18 +165,39 @@
       queryEnforcementInspectionProgramListNoPermission({},success =>{
         console.log(success)
         if(success.data.length > 4 ){
-          for (let i = 0; i <= 3; i++) {
+          for (let i = 0; i < 1; i++) {
             carouselList.push(success.data[i]); 
-          }  
+            noticeObj.noticeList.push(success.data[i].planName)
+            // noticeStr += success.data[i].planName + "                         ";
+            // noticeStr += success.data[i].planName != null ?success.data[i].planName + "":"";
+          } 
+          noticeStr += success.data[0].planName != null ?success.data[0].planName + "":""; 
         }else{
           carouselList = success.data; 
+         
+          for (let i = 0; i <= success.data.length; i++) {
+            // carouselList.push(success.data[i]); 
+            noticeObj.noticeList.push(success.data[i].planName);
+          } 
+          noticeStr += success.data[0].planName != null ?success.data[0].planName + "":""; 
         }
         freshMap.key = 1
-        console.log(carouselList)
+        console.log(carouselList);
+        // timerObj.timer = setInterval(flushMessage, 4000);
+        setNotificationMove();
       },error =>{
 
       })
     }
+    const flushMessage =() =>{
+      timerObj.value++;
+      freshMap.key = timerObj.value;
+      if(carouselList.length == timerObj.value){
+        timerObj.value = 0; 
+      }
+      freshMap.key = timerObj.value;
+      noticeStr = carouselList[timerObj.value].planName
+    } 
 
     //下拉刷新
     const onRefresh = () => {
@@ -167,6 +229,7 @@
             //         {
             //             path: "/noAccess"
             //         });
+            //       isLoading.value = false;
             // }
         }, error => {
 
@@ -178,7 +241,54 @@
         }, error => {
         })
         queryList();
+ 
     });
+    const setNotificationMove =()=>{
+      // 清除定时器
+      clearInterval(noticeObj.noticeTimer);
+      const notificationContainer = document.getElementById(
+        "notification-container"
+      );
+      const notificationWidth = notificationContainer.offsetWidth;
+      let index = 0;
+      // 播报内容赋值
+      noticeObj.notificationtext = noticeObj.noticeList[index];
+      const notification = document.getElementById("notification");
+      noticeObj.offset = notificationWidth;
+      // 初始化x轴平移距离
+      notification.style.transform = `translateX(${noticeObj.offset}px)`;
+      // 当前通知的宽度
+      noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
+      noticeObj.noticeTimer = setInterval(() => {
+        noticeObj.offset -= noticeObj.step;
+        if (noticeObj.offset < -noticeObj.itemWidth) {
+          noticeObj.offset = notificationWidth;
+          if (index >= noticeObj.noticeList.length - 1) {
+            index = 0;
+          } else {
+            index++;
+          }
+          noticeObj.notificationtext = noticeObj.noticeList[index];
+          noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
+        }
+        notification.style.transform = `translateX(${noticeObj.offset}px)`;
+      }, noticeObj.speed);
+    }
+    const delayNoticeMove = () =>{
+      const notification = document.getElementById("notification");
+      let currentOffset = notification.style.transform;
+      if (currentOffset) {
+        currentOffset = currentOffset.split("(")[1];
+        currentOffset = currentOffset.substring(0, currentOffset.indexOf("px"));
+        let duration = ((Number(currentOffset) + noticeObj.itemWidth) / noticeObj.step) * noticeObj.speed;
+        // 判断当前还有多久滚动完毕 添加一个setTimeout等待滚动结束后重新计时
+        setTimeout(() => {
+          this.setNotificationMove();
+        }, duration);
+      } else {
+        this.setNotificationMove();
+      }
+    }
 </script>
 
 <style lang="less" scoped>
@@ -192,9 +302,9 @@
         .warp_body {
             position: relative;
             background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top;
-            background-size: auto 100%;
+            background-size: 100% auto;
             overflow-x: hidden;
-
+            margin-top: 0%;
             .carousel_box {
                 height: 150px;
                 width: 100%;
@@ -226,7 +336,7 @@
                 .box-qr-code-text {
                   position: absolute;
                   z-index: 10;
-                  top: 0.35rem;
+                  top: 10%;
                   right: 0.35rem;
                   display: block;
                   font-size: 0.5rem;
@@ -270,7 +380,7 @@
                 .box-info-text {
                   position: absolute;
                   z-index: 10;
-                  top: 0.35rem;
+                  top: 10%;
                   right: 0.35rem;
                   display: block;
                   font-size: 0.5rem;
@@ -314,7 +424,7 @@
                 .box-complaint-text {
                   position: absolute;
                   z-index: 10;
-                  top: 0.35rem;
+                  top: 10%;
                   right: 0.35rem;
                   display: block;
                   font-size: 0.5rem;
@@ -356,7 +466,25 @@
     }
 
 
-    .streamer, .noticbox {
+    .streamer {
+        display: flex;
+        position: absolute;
+        top: calc(1% + 10vh);
+        right: 3%;
+        z-index: 999;
+        padding: 0 0.25rem;
+        width: 90%;
+        min-height: 1rem;
+        background-color: rgba(249, 238, 219, .9);
+        border-radius: 0.5rem;
+        color: #c35b01;
+        // font-size: 0.45rem;
+        line-height: 1.0rem;
+        white-space: nowrap;
+        box-sizing: content-box;
+    }
+
+    .noticbox {
         display: flex;
         position: absolute;
         top: calc(1% + 10vh);
@@ -450,4 +578,22 @@
         background: url("../assets/images/logo.png") no-repeat;
         background-size: 100% auto;
     }
+    .loading-div{
+      position: absolute;
+      top: 45%;
+      left: 48%;
+    }
+    .notice-bar-container {
+      margin-bottom: 10px;
+    }
+    .notice-bar-container:last-child {
+      margin-bottom: 0;
+    }
+    // .notification{
+    //   height: 100%;
+    //   font-size: 10px;
+    //   z-index: 9999;
+    //   width: 100%;
+    //   color: black;
+    // }
 </style>
diff --git a/src/views/enterprise/complaint.vue b/src/views/enterprise/complaint.vue
index 987cc1f..f668b15 100644
--- a/src/views/enterprise/complaint.vue
+++ b/src/views/enterprise/complaint.vue
@@ -352,6 +352,7 @@
         //border-radius: 0.25rem;
         background-image: linear-gradient(to bottom, #ebf3fb, #fff);
         overflow-y: auto;
+        margin-top: 1%;
     }
 
     /* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */
diff --git a/src/views/enterprise/complaintNoScan.vue b/src/views/enterprise/complaintNoScan.vue
index 40fadc8..181f90c 100644
--- a/src/views/enterprise/complaintNoScan.vue
+++ b/src/views/enterprise/complaintNoScan.vue
@@ -1,14 +1,14 @@
 <template>
 	<div class="address_edit">
 		<!-- 导航栏 -->
-		<div class="header_body">
+		<!-- <div class="header_body">
 			<header-nav
 				:slefBack="true"
 				@goBack="goBack"
 				:titelText="`入企不扫码投诉`"
 			>
 			</header-nav>
-		</div>
+		</div> -->
 		<!-- 中间 -->
 		<div class="warp_body">
             <van-form @failed="onFailed" @submit="submit">
diff --git a/src/views/enterprise/enterpriseInspectionDetail.vue b/src/views/enterprise/enterpriseInspectionDetail.vue
index d89fc7c..96fb646 100644
--- a/src/views/enterprise/enterpriseInspectionDetail.vue
+++ b/src/views/enterprise/enterpriseInspectionDetail.vue
@@ -1,11 +1,11 @@
 <template>
 	<div class="address_edit">
 		<!-- 导航栏 -->
-		<div class="header_body">
+		<!-- <div class="header_body"> -->
 			<!--<header-nav :slefBack="true" @goBack="goBack" :titelText="`详情`"></header-nav>-->
-		</div>
+		<!-- </div> -->
 		<!-- 中间 -->
-		<div>
+		<div class="warp_body">
 <!--            <van-cell-group>-->
         <van-form @failed="onFailed" @submit="submit">
            <!-- <van-field
@@ -226,5 +226,16 @@ onMounted(() =>{
 .van-popup.van-toast .van-toast__icon{
     font-size: var(--van-toast-icon-size) !important;
 }
+.warp_body {
+    margin: 0 3%;
+    padding-bottom: 3rem;
+    width: 94%;
+    height: 100%;
+    //border-radius: 0.25rem;
+    background-image: linear-gradient(to bottom, #ebf3fb, #fff);
+    overflow-y: auto;
+    margin-top: 1%;
+}
+
 
 </style>
diff --git a/src/views/enterprise/enterpriseInspectionList.vue b/src/views/enterprise/enterpriseInspectionList.vue
index 97af47d..44e856f 100644
--- a/src/views/enterprise/enterpriseInspectionList.vue
+++ b/src/views/enterprise/enterpriseInspectionList.vue
@@ -170,10 +170,10 @@
         isLodding.value = false;
     });
     const queryList = () => {
-      if(searchParam.enterpriseNumber == '' && searchParam.enterpriseNumber== null){
+      if(searchParam.enterpriseNumber == '' || searchParam.enterpriseNumber == null){
         console.log("该用户没有关联企业！");
-        return;
-      }
+          return;
+        }
         queryEnforcementList(searchParam, success => {
             console.log(success)
             for (var i = 0; i < success.data.length; i++) {
diff --git a/src/views/enterprise/qrCode.vue b/src/views/enterprise/qrCode.vue
index c3912f1..8174ec5 100644
--- a/src/views/enterprise/qrCode.vue
+++ b/src/views/enterprise/qrCode.vue
@@ -232,6 +232,7 @@ const toHisrotyView = () =>{
     height: 60%;
     background-color:white;
     position: relative;
+    margin-top: 1%;
     .qr_code_img{
       width: 80%;
       height: 70%;
diff --git a/src/views/enterprise/register.vue b/src/views/enterprise/register.vue
index 028e6fb..75f3b1f 100644
--- a/src/views/enterprise/register.vue
+++ b/src/views/enterprise/register.vue
@@ -325,5 +325,8 @@ export default {
 .van-popup.van-toast .van-toast__icon{
     font-size: var(--van-toast-icon-size) !important;
 }
-
+.warp_body {
+        // background-image: linear-gradient(to bottom, #ebf3fb, transparent);
+        margin-top: 1%;
+  }
 </style>
diff --git a/src/views/enterprise/registrationDetail.vue b/src/views/enterprise/registrationDetail.vue
index eb9bdad..e861a41 100644
--- a/src/views/enterprise/registrationDetail.vue
+++ b/src/views/enterprise/registrationDetail.vue
@@ -1,9 +1,10 @@
 <template>
 	<div class="address_edit">
 		<!-- 导航栏 -->
-    <!--<div class="header_body">
-      <header-nav :slefBack="true" @goBack="goBack" :titelText="`执法信息详情`"></header-nav>
-		</div>-->
+		<!--<div class="header_body">
+			<header-nav :slefBack="true" @goBack="goBack" :titelText="`执法信息详情`"></header-nav>
+		</div>
+    -->
 		<!-- 中间 -->
 		<div class="warp_body">
             <van-form @failed="onFailed" @submit="submit">
diff --git a/src/views/enterprise/registrationEdit.vue b/src/views/enterprise/registrationEdit.vue
index 99d34e4..7b41fd0 100644
--- a/src/views/enterprise/registrationEdit.vue
+++ b/src/views/enterprise/registrationEdit.vue
@@ -475,6 +475,7 @@
         //border-radius: 0.25rem;
         background-image: linear-gradient(to bottom, #ebf3fb, #fff);
         overflow-y: auto;
+        margin-top: 1%
     }
 
     .qy-name{
diff --git a/src/views/enterprise/registrationList.vue b/src/views/enterprise/registrationList.vue
index dde8047..88e907b 100644
--- a/src/views/enterprise/registrationList.vue
+++ b/src/views/enterprise/registrationList.vue
@@ -180,7 +180,8 @@
         });
     }
     const queryList = () => {
-      if(searchParam.enterpriseNumber == '' && searchParam.enterpriseNumber== null){
+      console.log(searchParam.enterpriseNumber)
+      if(searchParam.enterpriseNumber == '' || searchParam.enterpriseNumber == null){
         console.log("该用户没有关联企业！");
         return;
       }