Explorar el Código

fix:"优化页面滚动"

soobin hace 3 meses
padre
commit
e2e2404aef

+ 0 - 1
src/views/device/deviceOper.vue

@@ -749,7 +749,6 @@ export default {
     // 当前弹窗父组件触发
     const showOper = (e, value) => {
       controlList.value = value;
-      console.log("controlList", controlList.value);
       device.value = e;
       show.value = true;
       // isSleep=true,机器处于睡眠状态,按钮是关闭睡眠

La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 635 - 384
src/views/device/index.vue


+ 3 - 0
src/views/device/showGoods/index.vue

@@ -197,6 +197,9 @@ export default {
 
   .content-container {
     background: #f7f8fa;
+    height: calc(100% - 50px);
+    overflow: auto;
+    overflow-x: hidden;
   }
 }
 

+ 5 - 2
src/views/device/toDaySugarList.vue

@@ -390,11 +390,14 @@ export default {
 @import "../../common/style/common";
 
 .sugar-page {
-  background: #f5f6fa;
-  overflow-y: auto;
+  min-height: 100vh;
 
   .content-container {
+    background: #f5f6fa;
     padding: 16px;
+    height: calc(100% - 55px);
+    overflow: auto;
+    overflow-x: hidden;
   }
 
   .device-header {

+ 187 - 95
src/views/home/index.vue

@@ -1,13 +1,30 @@
 <template>
   <div class="home-container">
     <!-- 头部 -->
-    <s-header :name="sys ? sys.title : (sysTitle == 'AETI GLOBAL' ? sysTitle : $t('public.sysName'))" :noback="true"
-      class="app-header" />
+    <s-header
+      :name="
+        sys
+          ? sys.title
+          : sysTitle == 'AETI GLOBAL'
+          ? sysTitle
+          : $t('public.sysName')
+      "
+      :noback="true"
+      class="app-header"
+    />
     <!-- 主体内容 -->
     <main class="main-content">
       <!-- 通知栏 -->
-      <van-notice-bar v-if="noticeContent.title" class="smart-notice" left-icon="volume-o" :text="noticeContent.title"
-        @click="noticeClk" :scrollable="true" color="#404B74" background="#ffffff" />
+      <van-notice-bar
+        v-if="noticeContent.title"
+        class="smart-notice"
+        left-icon="volume-o"
+        :text="noticeContent.title"
+        @click="noticeClk"
+        :scrollable="true"
+        color="#404B74"
+        background="#ffffff"
+      />
 
       <!-- 用户信息卡 -->
       <div class="user-card">
@@ -20,7 +37,8 @@
             <div class="device-status">
               <span class="status-item total">
                 <van-icon name="desktop-o" size="14px" />
-                {{ $t("home.totalEquipment") }}: {{ equipStatus.machineTotalNum }}
+                {{ $t("home.totalEquipment") }}:
+                {{ equipStatus.machineTotalNum }}
               </span>
               <span class="status-item running">
                 <van-icon name="desktop-o" size="14px" />
@@ -31,14 +49,22 @@
         </div>
       </div>
 
-      <dateSelectList v-if="showDataDiv" @update="update($event)"></dateSelectList>
-      <typeDownMenu v-if="showDataDiv" :isHome="true" @upselectdata="upselectdata($event)"></typeDownMenu>
+      <dateSelectList
+        v-if="showDataDiv"
+        @update="update($event)"
+      ></dateSelectList>
+      <typeDownMenu
+        v-if="showDataDiv"
+        :isHome="true"
+        @upselectdata="upselectdata($event)"
+      ></typeDownMenu>
       <!-- 数据概览 -->
       <section v-if="showDataDiv" class="data-section">
         <div class="section-header">
           <div class="header-main">
             <h3 class="section-title">
-              {{ $t("home.dataOverview") }} </h3>
+              {{ $t("home.dataOverview") }}
+            </h3>
             <div class="data-entry" @click="pushOrderCenter">
               <span>{{ $t("home.orderData") }}</span>
               <van-icon name="arrow" class="entry-arrow" />
@@ -51,7 +77,9 @@
           <div class="data-card income">
             <div class="card-content">
               <div class="card-text">
-                <div class="value">{{ currencySymbol }}{{ salesVolume.toFixed(2) }}</div>
+                <div class="value">
+                  {{ currencySymbol }}{{ salesVolume.toFixed(2) }}
+                </div>
                 <div class="label">{{ $t("home.totalIncome") }}</div>
               </div>
             </div>
@@ -67,13 +95,23 @@
           </div>
         </div>
 
-        <div v-if="showDataDiv" class="c-text-c" style="font-size: 18px; margin-top: 5px;">
-          {{ Format_time(dateSelect.startDate, 'YYYY/MM/DD') }}-{{ Format_time(dateSelect.endDate, 'YYYY/MM/DD') }}
+        <div
+          v-if="showDataDiv"
+          class="c-text-c"
+          style="font-size: 18px; margin-top: 5px"
+        >
+          {{ Format_time(dateSelect.startDate, "YYYY/MM/DD") }}-{{
+            Format_time(dateSelect.endDate, "YYYY/MM/DD")
+          }}
         </div>
 
         <!-- 图表 -->
         <div class="chart-container">
-          <div v-if="!noData(salesVolume, salesNumber)" ref="chartBox" class="sales-chart"></div>
+          <div
+            v-if="!noData(salesVolume, salesNumber)"
+            ref="chartBox"
+            class="sales-chart"
+          ></div>
           <k-no-data v-else />
         </div>
       </section>
@@ -92,18 +130,37 @@
       </section>
 
       <!-- 机器销售额 -->
-      <section v-if="showDataDiv && user.ifForeign === '1'" class="machine-sales">
+      <section
+        v-if="showDataDiv && user.ifForeign === '1'"
+        class="machine-sales"
+      >
         <h3 class="section-title">{{ $t("home.machineSales") }}</h3>
         <div class="sales-list">
-          <div v-for="(item, index) in combinedList" :key="index" class="sales-item">
+          <div
+            v-for="(item, index) in combinedList"
+            :key="index"
+            class="sales-item"
+          >
             <van-cell-group inset>
               <div class="machine-header">
                 <van-icon name="setting" class="machine-icon" />
                 {{ item.machineName }}
               </div>
-              <van-cell :title="$t('home.coinsBills')" :value="currencySymbol + (item.coinsBills || '0')" class="sale-cell" />
-              <van-cell :title="$t('home.creditCard')" :value="currencySymbol + item.creditCard || '0'" class="sale-cell" />
-              <van-cell :title="$t('home.allPayTypeTotal')" :value="currencySymbol + calculateTotal(item)" class="total-cell" />
+              <van-cell
+                :title="$t('home.coinsBills')"
+                :value="currencySymbol + (item.coinsBills || '0')"
+                class="sale-cell"
+              />
+              <van-cell
+                :title="$t('home.creditCard')"
+                :value="currencySymbol + item.creditCard || '0'"
+                class="sale-cell"
+              />
+              <van-cell
+                :title="$t('home.allPayTypeTotal')"
+                :value="currencySymbol + calculateTotal(item)"
+                class="total-cell"
+              />
             </van-cell-group>
           </div>
         </div>
@@ -111,17 +168,40 @@
     </main>
 
     <!-- 通知弹窗 -->
-    <kDialog :dialogTitle="$t('home.notificationPop.notification')" :cancelBtnTxt="$t('home.notificationPop.nextTime')"
-      :confirmBtnTxt="$t('home.notificationPop.roger')" ref="kDialogRef" @confirmclk="confirmClk">
+    <kDialog
+      :dialogTitle="$t('home.notificationPop.notification')"
+      :cancelBtnTxt="$t('home.notificationPop.nextTime')"
+      :confirmBtnTxt="$t('home.notificationPop.roger')"
+      ref="kDialogRef"
+      @confirmclk="confirmClk"
+    >
       <template #content>
-        <div class="o-w" style="max-height: 50vh; overflow-y: auto" v-html="noticeContent.note"></div>
+        <div
+          class="o-w"
+          style="max-height: 50vh; overflow-y: auto"
+          v-html="noticeContent.note"
+        ></div>
       </template>
     </kDialog>
-    <van-dialog v-model:show="showAlarm" :title="$t('home.alarmTitle')" @confirm="confirmAlarm">
-      <div style="max-height: 30vh; overflow-y: auto;">
-        <div v-for="(item, index) in alarmList" :key="index" style="padding: 2px 5px;">
+    <van-dialog
+      v-model:show="showAlarm"
+      :title="$t('home.alarmTitle')"
+      @confirm="confirmAlarm"
+    >
+      <div style="max-height: 30vh; overflow-y: auto">
+        <div
+          v-for="(item, index) in alarmList"
+          :key="index"
+          style="padding: 2px 5px"
+        >
           <van-cell
-            :title="$t('home.alarmDevice') + (item.name ? item.name : item.clientId.slice(-6)) + $t('home.alarmContent') + item.alarmContent" />
+            :title="
+              $t('home.alarmDevice') +
+              (item.name ? item.name : item.clientId.slice(-6)) +
+              $t('home.alarmContent') +
+              item.alarmContent
+            "
+          />
         </div>
       </div>
     </van-dialog>
@@ -150,7 +230,7 @@ import { getAdminRole } from "@/service/user";
 import dateUtil from "../../utils/dateUtil";
 import { useI18n } from "vue-i18n";
 import { showFailToast, showToast } from "vant";
-import RobotIcon from '@/assets/home/robot.png';
+import RobotIcon from "@/assets/home/robot.png";
 import { getLocal, setLocal, navigatorLanguage } from "@/common/js/utils";
 
 export default {
@@ -203,9 +283,12 @@ export default {
     const router = useRouter();
     const userName = ref(user.name);
     const sys = ref(null);
-    const sysTitle = ref(''); // 页头标题
+    const sysTitle = ref(""); // 页头标题
     const pic1 = ref([
-      { url: 'https://fastly.jsdelivr.net/npm/@vant/assets/apple-3.jpeg', isImage: true },
+      {
+        url: "https://fastly.jsdelivr.net/npm/@vant/assets/apple-3.jpeg",
+        isImage: true,
+      },
       // Uploader 根据文件后缀来判断是否为图片文件
       // 如果图片 URL 中不包含类型信息,可以添加 isImage 标记来声明
     ]);
@@ -228,13 +311,13 @@ export default {
     const update = (uDate) => {
       dateSelect.value = uDate;
       getStatisticsFun();
-      getMachineNameListFunc()
+      getMachineNameListFunc();
     };
     let typeSelectData = {};
     const upselectdata = (uSData) => {
       typeSelectData = uSData;
       getStatisticsFun();
-      getMachineNameListFunc()
+      getMachineNameListFunc();
     };
     const salesVolume = ref(0);
     const salesNumber = ref(0);
@@ -243,8 +326,12 @@ export default {
     const getStatisticsFun = async () => {
       const params = {
         ...dateSelect.value,
-        adminId: typeSelectData.adminId === null ? user.id : typeSelectData.adminId,
-        ifForeign: typeSelectData.ifForeign === '' ? user.ifForeign : typeSelectData.ifForeign,
+        adminId:
+          typeSelectData.adminId === null ? user.id : typeSelectData.adminId,
+        ifForeign:
+          typeSelectData.ifForeign === ""
+            ? user.ifForeign
+            : typeSelectData.ifForeign,
         payType: typeSelectData.payType,
         clientId: typeSelectData.clientId,
         username: typeSelectData.userName, // 商家
@@ -289,7 +376,7 @@ export default {
           if (item == "周日") {
             data.data.categories[index] = t("home.week.sun");
           }
-        })
+        });
         // 解决eacharts与v-if的渲染问题
         await nextTick();
         if (chartBox.value) {
@@ -305,12 +392,12 @@ export default {
               },
             },
             grid: {
-              top: '10%',
+              top: "10%",
               left: "3%",
               right: "4%",
               bottom: "10%",
               containLabel: true,
-              height: 'auto',
+              height: "auto",
             },
             legend: {
               bottom: 0,
@@ -405,7 +492,7 @@ export default {
         const loginSysString = localStorage.getItem("loginSys");
         sys.value = JSON.parse(loginSysString);
       }
-      firstLogin.value = localStorage.getItem('firstLogin');
+      firstLogin.value = localStorage.getItem("firstLogin");
       // 设置菜单权限
       // menuSet();
       // 设置菜单权限, 只执行一次
@@ -441,14 +528,15 @@ export default {
         };
         const { data } = await getIsAlarm(queryParams);
         if (data.data != null) {
-          if (firstLogin.value == 'true') {
+          if (firstLogin.value == "true") {
             showAlarm.value = true;
           }
           alarmList.value = data.data;
         }
       }
 
-      if (localStorage.getItem('curLang') == 'zh') { // 机器人仅在中文环境下使用
+      if (localStorage.getItem("curLang") == "zh") {
+        // 机器人仅在中文环境下使用
         isShowRobot.value = true;
       }
 
@@ -457,46 +545,43 @@ export default {
       if (user) {
         getMachineNameListFunc();
       }
-
     });
 
     const finished = ref(false);
     const loading = ref(true);
 
-
-    // 设备销售数据 
+    // 设备销售数据
     const combinedList = ref([]); // 设备销额集合
     const calculateTotal = (item) => {
       let total = 0;
-      if (typeof item.coinsBills === 'number' && !isNaN(item.coinsBills)) {
+      if (typeof item.coinsBills === "number" && !isNaN(item.coinsBills)) {
         total += item.coinsBills;
       }
 
-      if (typeof item.creditCard === 'number' && !isNaN(item.creditCard)) {
+      if (typeof item.creditCard === "number" && !isNaN(item.creditCard)) {
         total += item.creditCard;
       }
       return total;
-    }
+    };
 
     const getMachineNameListFunc = async () => {
-
       combinedList.value = [];
       const searchParams = {
         adminId: user.id,
         ...dateSelect.value,
-      }
+      };
       try {
-        const { data } = await Api_getEquipmentPageStatistics(Object.assign({}, searchParams));
+        const { data } = await Api_getEquipmentPageStatistics(
+          Object.assign({}, searchParams)
+        );
         if (data.code === "00000" && data.data) {
-
           for (let i = 0; i < data.data.categories.length; i++) {
-            const machineNameVal = data.data.categories[i];  // 设备名称
-            const coinsVal = data.data.series[0].data[i];  // 硬币销额
-            const billsVal = data.data.series[1].data[i];  // 纸币销额
-            const coinsBillsVal = data.data.series[2].data[i];  // 硬币+纸币销额
-            const creditCardVal = data.data.series[3].data[i];  // 信用卡销额
-            const electronicPaymentVal = data.data.series[4].data[i];  // 电子支付销额
-
+            const machineNameVal = data.data.categories[i]; // 设备名称
+            const coinsVal = data.data.series[0].data[i]; // 硬币销额
+            const billsVal = data.data.series[1].data[i]; // 纸币销额
+            const coinsBillsVal = data.data.series[2].data[i]; // 硬币+纸币销额
+            const creditCardVal = data.data.series[3].data[i]; // 信用卡销额
+            const electronicPaymentVal = data.data.series[4].data[i]; // 电子支付销额
 
             const machineSalesData = {
               machineName: machineNameVal,
@@ -504,34 +589,33 @@ export default {
               bills: billsVal,
               coinsBills: coinsBillsVal,
               creditCard: creditCardVal,
-              electronicPayment: electronicPaymentVal
-            }
+              electronicPayment: electronicPaymentVal,
+            };
 
             combinedList.value.push(machineSalesData);
           }
-
         } else {
           showFailToast(data.message);
         }
       } catch (error) {
-        console.error("Error", error)
+        console.error("Error", error);
       }
-    }
+    };
 
     const getTitleFunc = async () => {
       const currentDomain = window.location.href;
       switch (true) {
-        case currentDomain.includes('/aeti/'):
-          sysTitle.value = 'AETI GLOBAL';
+        case currentDomain.includes("/aeti/"):
+          sysTitle.value = "AETI GLOBAL";
           break;
         default:
-          sysTitle.value = t('public.sysName');
+          sysTitle.value = t("public.sysName");
       }
-    }
+    };
 
     const confirmAlarm = () => {
-      localStorage.setItem('firstLogin', false);
-    }
+      localStorage.setItem("firstLogin", false);
+    };
 
     const menuList = [];
 
@@ -542,7 +626,7 @@ export default {
     // 获取账号权限
     const getAccountPer = async () => {
       const { data } = await getAdminRole({ adminId: user.id });
-      if (data.code === '00000') {
+      if (data.code === "00000") {
         if (data.data.menuCodesJson !== null) {
           menuList.value = sortedArray(data.data.menuCodesJson);
         }
@@ -578,26 +662,25 @@ export default {
           }
         });
       }
-    }
+    };
 
     // 解析 + 排序计算属性
     const sortedArray = (value) => {
       try {
         // 1. 安全解析JSON
-        const parsed = JSON.parse(value)
-        if (!Array.isArray(parsed)) return []
+        const parsed = JSON.parse(value);
+        if (!Array.isArray(parsed)) return [];
 
         // 2. 自定义排序函数
-        const getNumber = str => parseInt(str.match(/\d+/)?.[0] || 0)
+        const getNumber = (str) => parseInt(str.match(/\d+/)?.[0] || 0);
 
         // 3. 执行排序(数字从小到大)
         return [...parsed].sort((a, b) => {
-          return getNumber(a) - getNumber(b)
-        })
-
+          return getNumber(a) - getNumber(b);
+        });
       } catch (error) {
-        console.error('解析失败:', error)
-        return []
+        console.error("解析失败:", error);
+        return [];
       }
     };
 
@@ -661,7 +744,6 @@ export default {
       }
     };
 
-
     // 如果是空数据
     const noData = (volumes, nums) => {
       if (!volumes && !nums) {
@@ -675,23 +757,27 @@ export default {
     };
 
     // const aiDialog = showDialog();
-    const offset = ref({ x: Math.floor(window.innerWidth * 0.8), y: Math.floor(window.innerHeight * 0.75) });
+    const offset = ref({
+      x: Math.floor(window.innerWidth * 0.8),
+      y: Math.floor(window.innerHeight * 0.75),
+    });
 
     const popupVisible = ref(false);
-    const aiUrl = "https://chatbot.weixin.qq.com/webapp/c3thmydLGYWDugrgtfAj5I0Ng3sniv?robotName=Cotton%20Candy%20Robot"; // 阿里云智能对话机器人-ccbot
+    const aiUrl =
+      "https://chatbot.weixin.qq.com/webapp/c3thmydLGYWDugrgtfAj5I0Ng3sniv?robotName=Cotton%20Candy%20Robot"; // 阿里云智能对话机器人-ccbot
 
     // AI小助手
     const onClickBot = () => {
       popupVisible.value = true;
-    }
+    };
 
     const onOffsetChange = (offset) => {
       offset.value = offset;
-    }
+    };
 
     const onClose = () => {
       popupVisible.value = false;
-    }
+    };
 
     return {
       user,
@@ -735,10 +821,9 @@ export default {
       loading,
       combinedList,
       isOrderData,
-      calculateTotal
+      calculateTotal,
     };
   },
-
 };
 </script>
 
@@ -746,11 +831,11 @@ export default {
 @import "../../common/style/common";
 
 .home-container {
-  --primary-color: #4D6ADD;
-  --secondary-color: #07C160;
-  --text-primary: #2D354D;
-  --text-secondary: #666F8C;
-  --background: #F5F7FA;
+  --primary-color: #4d6add;
+  --secondary-color: #07c160;
+  --text-primary: #2d354d;
+  --text-secondary: #666f8c;
+  --background: #f5f7fa;
   --card-radius: 12px;
   --shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
   --tabbar-height: 40px;
@@ -764,9 +849,12 @@ export default {
   }
 
   .main-content {
-    background-color: #F5F7FA;
-    min-height: calc(100vh - var(--tabbar-height));
-    padding-bottom: var(--tabbar-padding);
+    background-color: #f5f7fa;
+    // min-height: calc(100vh - var(--tabbar-height));
+    // padding-bottom: var(--tabbar-padding);
+    height: calc(100% - 95px);
+    overflow: auto;
+    overflow-x: hidden;
   }
 
   .smart-notice {
@@ -807,7 +895,7 @@ export default {
             gap: 6px;
             padding: 4px 8px;
             border-radius: 16px;
-            background: #F5F7FA;
+            background: #f5f7fa;
 
             &.total {
               color: var(--primary-color);
@@ -888,12 +976,16 @@ export default {
         border-radius: 8px;
 
         &.income {
-          background: linear-gradient(135deg, var(--primary-color) 0%, #6B8CFF 100%);
+          background: linear-gradient(
+            135deg,
+            var(--primary-color) 0%,
+            #6b8cff 100%
+          );
           color: white;
         }
 
         &.sales {
-          background: linear-gradient(135deg, #FFA26B 0%, #FF7B42 100%);
+          background: linear-gradient(135deg, #ffa26b 0%, #ff7b42 100%);
           color: white;
         }
 
@@ -1035,4 +1127,4 @@ export default {
     }
   }
 }
-</style>
+</style>

+ 7 - 3
src/views/orderCenter/index.vue

@@ -158,6 +158,7 @@
               </template>
             </van-card>
           </div>
+          <van-back-top right="20" bottom="40" />
         </van-list>
       </div>
     </main>
@@ -1381,8 +1382,11 @@ export default {
     box-shadow: var(--shadow);
   }
 
-  // .main-content {
-  // }
+  .main-content {
+    height: calc(100% - 50px);
+    overflow: auto;
+    overflow-x: hidden;
+  }
 
   /* 过滤工具栏 */
   .filter-toolbar {
@@ -1497,7 +1501,7 @@ export default {
     border-radius: var(--card-radius);
     padding: 10px 15px;
     margin: 10px;
-    margin-bottom: 30px;
+    // margin-bottom: 30px;
     box-shadow: var(--shadow);
 
     .list-header {

+ 6 - 6
src/views/robotRanking.vue

@@ -1,12 +1,12 @@
 <template>
   <div class="robotRanking">
+    <s-header
+      :name="$t('robotRanking.machineSalesRanking')"
+      :noback="true"
+      class="modern-header"
+    />
     <div class="sales-rank-view">
       <!-- 头部 -->
-      <s-header
-        :name="$t('robotRanking.machineSalesRanking')"
-        :noback="true"
-        class="modern-header"
-      />
 
       <!-- 主体内容 -->
       <main class="rank-container">
@@ -983,7 +983,7 @@ export default {
 
 .sales-rank-view {
   background: #f8f9fb;
-  height: calc(100% - 50px);
+  height: calc(100% - 95px);
   overflow: auto;
   overflow-x: hidden;
 }

+ 6 - 6
src/views/user.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="userPage flex-col">
+    <s-header
+      :name="sys ? sys.title : $t('user.personalCenter')"
+      :noback="true"
+      :isFixed="false"
+    ></s-header>
     <div class="userPageBox">
-      <s-header
-        :name="sys ? sys.title : $t('user.personalCenter')"
-        :noback="true"
-        :isFixed="false"
-      ></s-header>
       <div class="userBaseBox">
         <div class="baseRow l-flex-RC">
           <div class="group2"></div>
@@ -1289,7 +1289,7 @@ export default {
   }
 
   .userPageBox {
-    height: calc(100% - 50px);
+    height: calc(100% - 95px);
     overflow: auto;
     overflow-x: hidden;
     .userBaseBox,