钩子缓存用户机制

client/.env.dev

@@ -5,7 +5,8 @@ VITE_DEV=false
 
 # 请求路径
 # VITE_BASE_URL='http://10.10.9.113:48080'
-VITE_BASE_URL='http://10.10.10.7:18080'
+# VITE_BASE_URL='http://10.10.10.7:18080'
+VITE_BASE_URL='http://oa.zjugis.com:28080'
 
 # VITE_BASE_URL='http://10.10.9.168:48080'
 

client_h5/index.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1">
     <script src='https://cdn.bootcss.com/vConsole/3.3.2/vconsole.min.js'></script>
     <script type="text/javascript">
-      // window.vConsole = new window.VConsole()
+      window.vConsole = new window.VConsole()
       window.locationBaseUrl = "/html_h5"
     </script>
     <title>万维空间OA</title>

client_h5/src/pages/home/index.scss

@@ -61,11 +61,24 @@
           display: grid;
           grid-template-columns: repeat(2, 1fr);
           >li {
-            background: #FFFFFF;
             box-shadow: 0px 4px 20px 0px #EAEDF2;
             border-radius: $card_radius;
             padding: 25px 20px;
             position: relative;
+            background-repeat: no-repeat;
+            background-size: 100% 100%;
+            &:nth-child(1) {
+              background-image: url("../../assets/images/qjsq_icon.png");
+            }
+            &:nth-child(2) {
+              background-image: url("../../assets/images/ccsq_icon.png");
+            }
+            &:nth-child(3) {
+              background-image: url("../../assets/images/kqsmt_icon.png");
+            }
+            &:nth-child(4) {
+              background-image: url("../../assets/images/jksq_icon.png");
+            }
             >img {
               display: block;
               position: absolute;
@@ -78,29 +91,14 @@
             >.title {
               color: $font_color;
               white-space: nowrap;
+              font-weight: bold;
+              font-size: 17px;
             }
-            &::before {
+            >.sub_title {
               display: block;
-              content: "";
-              position: absolute;
-              left: 0px;
-              right: 0px;
-              top: 0px;
-              margin: auto;
-              height: 50%;
-              background: linear-gradient( 180deg, #ECF2FF 0%, rgba(244,249,255,0) 100%);
-              border-radius: $card_radius;
-            }
-            &::after {
-              display: block;
-              content: "";
-              position: absolute;
-              width: 70px;
-              height: 12px;
-              bottom: 0px;
-              right: 0px;
-              border-bottom-right-radius: $card_radius;
-              background: linear-gradient( 270deg, #C5D8FF 0%, rgba(197,216,255,0) 100%);
+              font-size: 13px;
+              color: #777;
+              margin-top: 2px;
             }
             &:nth-child(2),&:nth-child(4) {
               margin-left: 10px;
@@ -171,7 +169,6 @@
     font-size: 17px;
     font-weight: bold;
     color: $font_color;
-    padding-left: 15px;
     margin: 10px 0px;
   }
 }

client_h5/src/pages/home/index.vue

@@ -10,7 +10,7 @@ interface MenuItem {
   title: string;
   corner?: number;
   path?: string;
-  icon: string;
+  icon?: string;
 }
 const navMenus = reactive<MenuItem[]>([
   {
@@ -26,7 +26,7 @@ const navMenus = reactive<MenuItem[]>([
   },
   {
     title: "周报填写",
-    icon: "../assets/images/wdxx_icon.png",
+    icon: "../assets/images/zbtx_icon.png",
     path: "weekly",
   },
   {
@@ -36,37 +36,38 @@ const navMenus = reactive<MenuItem[]>([
   },
   {
     title: "我的周报",
-    icon: "../assets/images/wdrz_icon.png",
+    icon: "../assets/images/wdzb_icon.png",
     path: "myWeeklyLogs",
   },
 ]);
 interface ProcessMenuItem extends MenuItem {
   instanceId: string;
+  subTitle?: string;
 }
 const processMenus: ProcessMenuItem[] = [
   {
     title: "请假申请",
     corner: 0,
-    icon: "../assets/images/qjsq_icon.png",
     instanceId: "018c1f593f2c09477b1b8c1080b6000b",
+    subTitle: '各类型请假申请'
   },
   {
     title: "出差申请",
     corner: 0,
-    icon: "../assets/images/ccsq_icon.png",
     instanceId: "018c389986fb0947969a8c33d89b000a",
+    subTitle: '出差时间、事由等'
   },
   {
-    title: "考情说明条",
+    title: "考勤说明条",
     corner: 0,
-    icon: "../assets/images/kqsmt_icon.png",
     instanceId: "018c24045d65094794178c23e986001e",
+    subTitle: '考勤遗漏说明情况'
   },
   {
     title: "借款申请",
     corner: 0,
-    icon: "../assets/images/jksq_icon.png",
     instanceId: "018e36519fd70a0796ba8dd062c80830",
+    subTitle: '借款项目、金额等'
   },
 ];
 
@@ -89,7 +90,8 @@ const router = useRouter();
  */
 const initAttendCount = async () => {
   const result = await getAttendCount({
-    userId: getStoreObject("_userInfo", "id")
+    userId: getStoreObject("_userInfo", "id"),
+    isMobile: true
   })
   if (result) {
     navMenus[0]['corner'] = result?.data
@@ -160,7 +162,7 @@ const getAssetURL = (image: string) => {
             @click="toProcessHandle(item)"
           >
             <span class="title">{{ item["title"] }}</span>
-            <img :src="getAssetsURI(item['icon'])" />
+            <span class="sub_title">{{ item['subTitle'] }}</span>
           </li>
         </ul>
       </div>

client_h5/src/router/getUserInfo.ts

@@ -1,25 +1,34 @@
 
 import { useUserStoreWithOut, UserInterface } from "@/stores/modules/user";
 import { getAuthCode } from "dingtalk-jsapi";
-import { getStoreObject, getStoreString, setStoreObject } from '@/utils/common'
 import reqest from "@/utils/request";
 import { useDictStoreWithOut } from "@/utils/dict";
 
 const USERINFO_KEY: string = '_userInfo';
-const TOKEN_KEY: string = 'ACCESS_TOKEN'
+const TOKEN_KEY: string = 'ACCESS_TOKEN';
+const EXPIRES_TIME_KEY: string = 'EXPIRES_TIME_KEY';
 
 const initUserInfoHandler = async () => {
   const userStore = useUserStoreWithOut();
-  const userInfoObject = getStoreObject(USERINFO_KEY);
-  if (getStoreString(TOKEN_KEY) && userInfoObject) {
-    userStore.setUser(userInfoObject);
-    return true;
+  const userInfoString = localStorage.getItem(USERINFO_KEY);
+  if (localStorage.getItem(TOKEN_KEY) && userInfoString) {
+    const expiresTimeString = localStorage.getItem(EXPIRES_TIME_KEY);
+    const date = new Date();
+    const time = date.getTime();
+    if (expiresTimeString && Number(expiresTimeString) > time) {
+      localStorage.clear();
+    } else {
+      const userInfoObject = JSON.parse(userInfoString);
+      userStore.setUser(userInfoObject);
+      return true;   
+    }
   };
   try {
     const code: string = (await getDDAuthCode()) as string;
     const userIdResult = await getUserIdByDD({ code });
     if (userIdResult && userIdResult?.data) {
-      setStoreObject(TOKEN_KEY, userIdResult?.data.accessToken);
+      localStorage.setItem(TOKEN_KEY, userIdResult?.data.accessToken);
+      localStorage.setItem(EXPIRES_TIME_KEY, userIdResult?.data.expiresTime)
       useDictStoreWithOut();
       const userResult = await getUserInfoById();
       if (userResult && userResult?.data) {
@@ -32,7 +41,7 @@ const initUserInfoHandler = async () => {
           signatureUrl: userResult?.data.user.signatureUrl,
         };
         userStore.setUser(userInfo);
-        setStoreObject(USERINFO_KEY, userInfo);
+        localStorage.setItem(USERINFO_KEY, JSON.stringify(userInfo));
         return true;
       } else {
         return false;

client_h5/src/router/index.ts

@@ -15,20 +15,21 @@ const router = createRouter({
 
 // 路由加载前
 router.beforeEach(async (to, from, next) => {
-  const isLogin = await getUserInfoPromise()
-  next(); 
-  if (!isLogin) {
-    showDialog({
-      message: '很抱歉，用户未登录，请先重新加载！',
-      confirmButtonText: '重新加载',
-      beforeClose: function(action) {
-        if (action === 'confirm') {
-          closeDialog()
-          window.location.reload()
-        }
-      },
-    })
-  }
+  getUserInfoPromise().then((isLogin) => {
+    next(); 
+    if (!isLogin) {
+      showDialog({
+        message: '很抱歉，用户未登录，请先重新加载！',
+        confirmButtonText: '重新加载',
+        beforeClose: function(action) {
+          if (action === 'confirm') {
+            closeDialog()
+            window.location.reload()
+          }
+        },
+      })
+    }
+  })
 })
 const setupRouter = (app: App<Element>): void => {
   app.use(router)

client_h5/src/utils/request.ts

@@ -10,9 +10,8 @@ const instance = axios.create(Object.assign({}, defaultConfig));
 instance.interceptors.request.use(
   (config) => {
     ('isAuth' in config.headers) ? null : config.headers.isAuth = true;
-        if (config.headers.isAuth) {
-          
-            config.headers.Authorization = `Bearer ${import.meta.env.VITE_AUTHORIZATION ?? localStorage.getItem('ACCESS_TOKEN')}`;
+    if (config.headers.isAuth) {
+        config.headers.Authorization = `Bearer ${import.meta.env.VITE_AUTHORIZATION ?? localStorage.getItem('ACCESS_TOKEN')}`;
     }
         const data = config.data || false
         if (