fix

hookehuyr
Commit f7c42956130cad76408aa965bb706c2cfe2be1eb f7c42956 1 parent a7bdcfd3
Showing 6 changed files with 109 additions and 27 deletions
src/assets/images/二维码@2x (1).png → src/assets/images/二维码icon.png
src/views/addVisitor.vue
src/views/booking.vue
src/views/index.vue
src/views/me.vue
src/views/submit.vue
--- a/src/assets/images/二维码@2x (1).png → src/assets/images/二维码icon.png
View file @f7c4295
+++ b/src/assets/images/二维码@2x (1).png → src/assets/images/二维码icon.png
View file @f7c4295
--- a/src/views/addVisitor.vue
View file @f7c4295
+++ b/src/views/addVisitor.vue
View file @f7c4295
 <!--
  * @Date: 2024-01-15 17:39:29
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 17:08:33
+ * @LastEditTime: 2024-01-16 17:25:22
  * @FilePath: /xysBooking/src/views/addVisitor.vue
  * @Description: 文件描述
 -->
--- a/src/views/booking.vue
View file @f7c4295
+++ b/src/views/booking.vue
View file @f7c4295
 <!--
  * @Date: 2024-01-15 13:35:51
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 16:29:11
+ * @LastEditTime: 2024-01-16 17:44:34
  * @FilePath: /xysBooking/src/views/booking.vue
  * @Description: 预约页面
  * @Version: 1.0.0
@@ -40,8 +40,8 @@
             :class="['time', !item.num ? 'disabled' : '']"
           >
             <div class="left">
-              <van-icon v-if="checked_time !== index" name="https://cdn.ipadbiz.cn/xys/booking/%E5%8D%95%E9%80%8901@2x.png" />&nbsp;
+              <van-icon v-if="checked_time !== index" :name="icon_select1" />&nbsp;
-              <van-icon v-else name="https://cdn.ipadbiz.cn/xys/booking/%E5%8D%95%E9%80%8902@2x.png" />&nbsp;
+              <van-icon v-else :name="icon_select2" />&nbsp;
               {{ item.left }}
             </div>
             <div class="right">
@@ -86,6 +86,8 @@ import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@
 //import { } from '@/utils/generateIcons.js'
 //import { } from '@/composables'
 import { useGo } from '@/hooks/useGo'
+import icon_select1 from '@/assets/images/单选01@2x.png'
+import icon_select2 from '@/assets/images/单选02@2x.png'
 const $route = useRoute();
 const $router = useRouter();
--- a/src/views/index.vue
View file @f7c4295
+++ b/src/views/index.vue
View file @f7c4295
 <!--
  * @Date: 2023-06-21 10:23:09
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 16:15:12
+ * @LastEditTime: 2024-01-16 18:04:39
  * @FilePath: /xysBooking/src/views/index.vue
  * @Description: 预约页首页
 -->
@@ -17,11 +17,11 @@
       </div>
       <div class="index-control">
         <div class="booking" @click="toBooking">
-          <van-icon size="1.5rem" color="#FFFFFF" name="https://cdn.ipadbiz.cn/xys/booking/%E7%AB%8B%E5%8D%B3%E9%A2%84%E7%BA%A6@2x.png" />
+          <van-icon size="1.5rem" color="#FFFFFF" :name="icon_1" />
           &nbsp;立即预约
         </div>
         <div class="record" @click="toRecord">
-          <van-icon size="1.5rem" color="#A67939" name="https://cdn.ipadbiz.cn/xys/booking/%E9%A2%84%E7%BA%A6%E8%AE%B0%E5%BD%95@2x.png" />
+          <van-icon size="1.5rem" color="#A67939" :name="icon_2" />
           &nbsp;预约记录
         </div>
       </div>
@@ -29,16 +29,16 @@
     </div>
     <div class="index-nav">
       <div class="nav-logo">
-        <van-icon size="1.5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E9%A6%96%E9%A1%B502@2x.png" color="#A67939" />
+        <van-icon size="1.5rem" :name="icon_3" color="#A67939" />
         首页
       </div>
       <div class="nav-logo" @click="toCode">
-        <van-icon size="5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E4%BA%8C%E7%BB%B4%E7%A0%81@2x%20(1).png" color="#A67939" style="position: absolute; top: -4rem;" />
+        <van-icon size="5rem" :name="icon_4" color="#A67939" style="position: absolute; top: -4rem;" />
         <van-icon size="1.5rem" name="wap-home" color="#FFF" style="opacity: 0;" />
         预约码
       </div>
       <div class="nav-logo" @click="toMy">
-        <van-icon size="1.5rem" name="https://cdn.ipadbiz.cn/xys/booking/%E6%88%91%E7%9A%8401@2x.png" color="#A67939" />
+        <van-icon size="1.5rem" :name="icon_5" color="#A67939" />
         我的
       </div>
     </div>
@@ -55,6 +55,11 @@ import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@
 //import { } from '@/composables'
 import { showSuccessToast, showFailToast } from 'vant';
 import { useGo } from '@/hooks/useGo'
+import icon_1 from '@/assets/images/立即预约@2x.png'
+import icon_2 from '@/assets/images/预约记录@2x.png'
+import icon_3 from '@/assets/images/首页02@2x.png'
+import icon_4 from '@/assets/images/二维码icon.png'
+import icon_5 from '@/assets/images/我的01@2x.png'
 const $route = useRoute();
 const $router = useRouter();
 useTitle($route.meta.title);
--- a/src/views/me.vue
View file @f7c4295
+++ b/src/views/me.vue
View file @f7c4295
 <!--
  * @Date: 2024-01-16 13:33:36
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 17:13:07
+ * @LastEditTime: 2024-01-17 07:03:58
  * @FilePath: /xysBooking/src/views/me.vue
  * @Description: 文件描述
 -->
@@ -13,17 +13,21 @@
     <div @click="() => { go('/addVisitor') }" class="add-visitors">
       <div><van-icon name="plus" /> 添加参观者</div>
     </div>
-    <div class="visitors-list">
+    <div v-if="visitorList.length" class="visitors-list">
       <div v-for="(item, index) in visitorList" :key="index" class="visitor-item">
         <div>
-          <p style="color: #A67939;">张雨燕</p>
+          <p style="color: #A67939;">{{ item.name }}</p>
-          <p>证件号：3101******234</p>
+          <p>证件号：{{ formatId(item.idCard) }}</p>
         </div>
         <div @click="removeItem(item)" style="margin-left: 1rem;">
           <van-icon name="https://cdn.ipadbiz.cn/xys/booking/%E5%88%A0%E9%99%A4@2x.png" />
         </div>
       </div>
     </div>
+    <div v-else class="no-visitors-list">
+      <img src="https://cdn.ipadbiz.cn/xys/booking/%E6%9A%82%E6%97%A0@2x.png" style="width: 10rem;">
+      <div class="no-visitors-list-title">您还没有添加过参观者</div>
+    </div>
   </div>
 </template>
@@ -31,7 +35,7 @@
 import { ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useGo } from '@/hooks/useGo'
-
+import xctcCheck from "xctc-check"
 import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
 //import { } from '@/utils/generateModules.js'
 //import { } from '@/utils/generateIcons.js'
@@ -43,7 +47,33 @@ const $route = useRoute();
 const $router = useRouter();
 useTitle($route.meta.title);
-const visitorList = ref([{ id: '1', name: '张雨燕1', idCard: '3101******234' }, {  id: '2', name: '张雨燕2', idCard: '3101******234' }, {  id: '3',name: '张雨燕3', idCard: '3101******234' }, {  id: '4',name: '张雨燕4', idCard: '3101******234' }]);
+const visitorList = ref([]);
+
+/**
+ * 生成15位身份证号中间8位替换为*号
+ * @param {*} inputString
+ */
+function replaceMiddleCharacters(inputString) {
+  if (inputString.length < 15) {
+    return inputString; // 字符串长度不足，不进行替换
+  }
+
+  const start = Math.floor((inputString.length - 8) / 2); // 开始替换的索引位置
+  const end = start + 8; // 结束替换的索引位置
+
+  const replacement = '*'.repeat(8); // 生成包含8个*号的字符串
+
+  const replacedString = inputString.substring(0, start) + replacement + inputString.substring(end);
+  return replacedString;
+}
+
+const formatId = (id) => {
+  if (id.length === 15) {
+    return replaceMiddleCharacters(id);
+  } else {
+    return xctcCheck.formatInfoHide(id)
+  }
+};
 const removeItem = (item) => {
   showConfirmDialog({
@@ -61,6 +91,15 @@ const removeItem = (item) => {
       // on cancel
     });
 }
+
+onMounted(() => {
+  visitorList.value = [
+    { id: '1', name: '张雨燕1', idCard: '311522190103214', today: false },
+    { id: '2', name: '张雨燕2', idCard: '311522190103214279', today: true },
+    { id: '3',name: '张雨燕3', idCard: '311522190103214279', today: false },
+    { id: '4',name: '张雨燕4', idCard: '311522190103214279', today: false }
+  ];
+})
 </script>
 <style lang="less" scoped>
@@ -108,5 +147,20 @@ const removeItem = (item) => {
       justify-content: space-between;
     }
   }
+  .no-visitors-list {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    img {
+      margin-top: 1rem;
+      margin-bottom: 1rem;
+      width: 10rem;
+    }
+    .no-visitors-list-title {
+      color: #A67939;
+      font-size: 1.05rem;
+    }
+  }
 }
 </style>
--- a/src/views/submit.vue
View file @f7c4295
+++ b/src/views/submit.vue
View file @f7c4295
 <!--
  * @Date: 2024-01-15 16:25:51
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 16:53:24
+ * @LastEditTime: 2024-01-16 18:19:12
  * @FilePath: /xysBooking/src/views/submit.vue
  * @Description: 文件描述
 -->
@@ -14,11 +14,11 @@
     <div @click="goToVisitor" class="add-visitors">
       <div><van-icon name="plus" /> 添加参观者</div>
     </div>
-    <div class="visitors-list">
+    <div v-if="visitorList.length" class="visitors-list">
       <div v-for="(item, index) in visitorList" :key="index" @click="addVisitor(item)" class="visitor-item">
         <div style="margin-right: 1rem;">
-          <van-icon v-if="!checked_visitors.includes(item.id)" name="https://cdn.ipadbiz.cn/xys/booking/%E5%A4%9A%E9%80%8901@2x.png" />&nbsp;
+          <van-icon v-if="!checked_visitors.includes(item.id)" :name="icon_check1" />&nbsp;
-          <van-icon v-else name="https://cdn.ipadbiz.cn/xys/booking/%E5%A4%9A%E9%80%8902@2x.png" />&nbsp;
+          <van-icon v-else :name="icon_check2" />&nbsp;
         </div>
         <div>
           <p style="color: #A67939;">{{ item.name }}</p>
@@ -27,6 +27,10 @@
         </div>
       </div>
     </div>
+    <div v-else class="no-visitors-list">
+      <img src="https://cdn.ipadbiz.cn/xys/booking/%E6%9A%82%E6%97%A0@2x.png" style="width: 10rem;">
+      <div class="no-visitors-list-title">您还没有添加过参观者</div>
+    </div>
     <div style="height: 5rem;"></div>
     <div class="submit-wrapper">
       <div class="left">
@@ -49,18 +53,15 @@ import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@
 //import { } from '@/composables'
 import { useGo } from '@/hooks/useGo'
 import { showSuccessToast, showFailToast, showToast } from 'vant';
+import icon_check1 from '@/assets/images/多选01@2x.png'
+import icon_check2 from '@/assets/images/多选02@2x.png'
 const $route = useRoute();
 const $router = useRouter();
 useTitle($route.meta.title);
 const go = useGo();
-const visitorList = ref([
+const visitorList = ref([]);
-  { id: '1', name: '张雨燕1', idCard: '311522190103214', today: false },
-  { id: '2', name: '张雨燕2', idCard: '311522190103214279', today: true },
-  { id: '3',name: '张雨燕3', idCard: '311522190103214279', today: false },
-  { id: '4',name: '张雨燕4', idCard: '311522190103214279', today: false }
-]);
 /**
  * 生成15位身份证号中间8位替换为*号
@@ -126,7 +127,12 @@ const submitBtn = () => {
 }
 onMounted(() => {
-
+  visitorList.value = [
+    { id: '1', name: '张雨燕1', idCard: '311522190103214', today: false },
+    { id: '2', name: '张雨燕2', idCard: '311522190103214279', today: true },
+    { id: '3',name: '张雨燕3', idCard: '311522190103214279', today: false },
+    { id: '4',name: '张雨燕4', idCard: '311522190103214279', today: false }
+  ];
 });
 </script>
@@ -161,6 +167,21 @@ onMounted(() => {
       align-items: center;
     }
   }
+  .no-visitors-list {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    img {
+      margin-top: 1rem;
+      margin-bottom: 1rem;
+      width: 10rem;
+    }
+    .no-visitors-list-title {
+      color: #A67939;
+      font-size: 1.05rem;
+    }
+  }
   .submit-wrapper {
     position: fixed;
     bottom: 0;