yuang-framework-ui-common 1.0.29 → 1.0.31

package/lib/config/httpConfig.ts

@@ -1,4 +1,5 @@
 import axios from "axios"
+import type { AxiosResponse } from 'axios';
 
 import { showErrorMessage } from '../utils/messageUtils';
 import { alertMessageBox } from '../utils/messageBoxUtils';
@@ -14,8 +15,10 @@ const messageMap = {
     responseSturctError: '响应结构错误',
 }
 
+const apiBaseUrl = '/gateway-server';
+
 const http = axios.create({
-    baseURL: '/gateway-server',
+    baseURL: apiBaseUrl,
     timeout: 10000,
     headers: {}
 })
@@ -36,7 +39,7 @@ http.interceptors.request.use(async config => {
 
 
 /* 响应拦截器 */
-http.interceptors.response.use((res) => {
+http.interceptors.response.use(async (res: any) => {
     if (!res?.data?.statusCode) {
         showErrorMessage(messageMap.responseSturctError);
         return Promise.reject(new Error(messageMap.responseSturctError));
@@ -66,11 +69,9 @@ http.interceptors.response.use((res) => {
             window.location.href = getSsoLoginUrl() || '';
             return Promise.reject(new Error(res?.data?.message));
         } else if (res?.data?.statusCode === 815002) {
-            axios.get('/sso-api/client/auth/getSsoRefreshToken').then(res => {
-                setSsoAccessToken(res.data.data);
-                // 重发请求
-                return axios.request(res.config);
-            })
+            await refreshSsoAccessToken(res);
+            // 重发请求
+            return axios.request(res.config);
         } else if (res?.data?.statusCode === 815003) {
             showErrorMessage(res?.data?.message || messageMap.requestError);
             return Promise.reject(new Error(res?.data?.message));
@@ -123,4 +124,24 @@ const beforeRequestConfig = (config: any) => {
 }
 
 
+/**
+ * 刷新ssoAccessToken
+ * @param res
+ */
+const refreshSsoAccessToken = (res: any) => {
+    return new Promise((resolve, reject) => {
+        const config = res.config
+        config.params = {
+            ssoRefreshToken: encodeURIComponent(getLocalStorageItem("ssoRefreshToken") ?? ''),
+        }
+        axios.get(`/sso-api/client/auth/getSsoRefreshToken`, config).then(res => {
+            if (res?.data?.statusCode !== 200) {
+                return reject();
+            }
+            setSsoAccessToken(res.data.data);
+            return resolve(void 0);
+        });
+    });
+}
+
 export { http }

package/lib/utils/ssoUtils.ts

@@ -7,8 +7,7 @@ import {getLocalStorageItem, setLocalStorageItem, removeLocalStorageItem} from '
 const getSsoLoginUrl = (redirectUrl = '') => {
     let apiFullBaseUrl = (window as any).$config?.apiFullBaseUrl;
     if(!apiFullBaseUrl) {
-        console.error('参数[apiFullBaseUrl]为空');
-        return;
+        throw new Error('参数[apiFullBaseUrl]为空');
     }
     let ssoLoginUrl = `${apiFullBaseUrl}/sso-api/server/sso/login`;
     if (!redirectUrl) {
@@ -22,8 +21,7 @@ const getSsoLoginUrl = (redirectUrl = '') => {
 const getSsoLogoutUrl = (redirectUrl = '') => {
     let apiFullBaseUrl = (window as any).$config?.apiFullBaseUrl;
     if(!apiFullBaseUrl) {
-        console.error('参数[apiFullBaseUrl]为空');
-        return;
+        throw new Error('参数[apiFullBaseUrl]为空');
     }
     let ssoLogoutUrl = `${apiFullBaseUrl}/sso-api/server/sso/logout`;
     if (!redirectUrl) {

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "yuang-framework-ui-common",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "private": false,
   "type": "module",
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --mode dev",
     "build": "vite build",
     "preview": "vite preview",
     "test:unit": "vitest",
@@ -29,7 +29,7 @@
     "@wangeditor/editor-for-vue": "^5.1.12",
     "axios": "^1.7.3",
     "crypto-js": "^4.2.0",
-    "element-plus": "^2.7.8",
+    "element-plus": "^2.8.4",
     "js-cookie": "^3.0.5",
     "jsencrypt": "^3.3.2",
     "lodash": "^4.17.21",

package/src/main.ts

@@ -11,8 +11,11 @@ const app = createApp(App)
 app.use(createPinia())
 app.use(router)
 
-
-initConfig(app);
+const config = {
+    apiBaseUrl: import.meta.env.VITE_API_BASE_URL,
+    apiFullBaseUrl: import.meta.env.VITE_API_FULL_BASE_URL
+};
+initConfig(app, config);
 
 app.mount('#app')
 

package/src/router/index.ts

@@ -1,9 +1,20 @@
 import {createRouter, createWebHistory} from 'vue-router'
 import {getExceptionRoutes} from '../../lib/utils/vueRouterUtils'
 
+import { getSsoAccessToken, getSsoLoginRoutePath } from '../../lib/utils/ssoUtils';
+
+
 const router = createRouter({
     history: createWebHistory(import.meta.env.BASE_URL),
     routes: [
+        {
+            path: '/sso/login/index',
+            component: () => import('@/views/sso/login/index.vue'),
+            meta: {
+                title: '登录',
+                isAnonymous: true
+            }
+        },
         {
             path: '/config/gateway-config',
             component: () => import('@/views/config/gateway-config.vue')
@@ -26,14 +37,27 @@ const router = createRouter({
             component: () => import('@/views/utils/message-utils.vue')
         },
 
+
+
+        {
+            path: '/example/table/index',
+            component: () => import('@/views/example/table/index.vue')
+        },
+
         ...getExceptionRoutes()
     ]
 })
 
 
 /* 路由守卫 */
-router.beforeEach(async (to, from, next) => {
-    next();
+router.beforeEach(async (to) => {
+    if (!getSsoAccessToken()) {
+        if (!to.meta?.isAnonymous) {
+            return getSsoLoginRoutePath(to.fullPath);
+        }
+        return;
+    }
+    return;
 });
 
 

package/src/views/example/table/index.vue

@@ -0,0 +1,150 @@
+<template>
+<div>
+
+  <el-button @click="test">测试</el-button>
+  <el-button @click="test2">测试2</el-button>
+  <el-button @click="test3">测试3</el-button>
+
+  <el-table
+      :data="tableData1"
+      style="width: 100%"
+      row-key="id"
+      border ref="tableRef2"
+      lazy
+      :load="load"
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+  >
+    <el-table-column prop="date" label="Date"/>
+    <el-table-column prop="name" label="Name"/>
+    <el-table-column prop="address" label="Address"/>
+  </el-table>
+</div>
+</template>
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue'
+
+const tableRef2 = ref(null);
+
+
+interface User {
+  id: number
+  date: string
+  name: string
+  address: string
+  hasChildren?: boolean
+  children?: User[]
+}
+
+const load = (
+    row: User,
+    treeNode: unknown,
+    resolve: (data: User[]) => void
+) => {
+  setTimeout(() => {
+    resolve([
+      {
+        id: 31,
+        date: '2016-05-01',
+        name: 'wangxiaohu',
+        address: 'No. 189, Grove St, Los Angeles',
+      },
+      {
+        id: 32,
+        date: '2016-05-01',
+        name: 'wangxiaohu',
+        address: 'No. 189, Grove St, Los Angeles',
+      },
+    ])
+    // resolve([]);
+  }, 1000)
+}
+
+
+const tableData1: User[] = [
+  {
+    id: 1,
+    date: '2016-05-02',
+    name: 'wangxiaohu',
+    address: 'No. 189, Grove St, Los Angeles',
+    hasChildren: true
+  },
+  {
+    id: 2,
+    date: '2016-05-04',
+    name: 'wangxiaohu',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    id: 3,
+    date: '2016-05-01',
+    name: 'wangxiaohu',
+    hasChildren: true,
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+  {
+    id: 4,
+    date: '2016-05-03',
+    name: 'wangxiaohu',
+    address: 'No. 189, Grove St, Los Angeles',
+  },
+]
+
+onMounted(() => {
+  setTimeout(() => {
+    const elements = document.getElementsByClassName('el-table__expand-icon') as any;
+    if (!elements[0].classList.contains('el-table__expand-icon--expanded')) {
+      elements[0] && elements[0].click();
+    }
+  }, 500);
+})
+
+const test = () => {
+  tableRef2.value.updateKeyChildren(1, [
+    {
+      id: 11,
+      date: '2016-05-03',
+      name: '测试123123312',
+      address: 'No. 189, Grove St, Los Angeles',
+    }, {
+      id: 22,
+      date: '2016-05-03',
+      name: 'updateKeyChildren',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+  ])
+
+}
+
+const test2 = () => {
+  tableRef2.value.updateKeyChildren(1, [ ])
+
+}
+
+const test3 = () => {
+  tableRef2.value.updateKeyChildren(1, [
+    {
+      id: 11,
+      date: '2016-05-03',
+      name: '测试123123312',
+      address: 'No. 189, Grove St, Los Angeles',
+    }, {
+      id: 22,
+      date: '2016-05-03',
+      name: 'updateKeyChildren',
+      address: 'No. 189, Grove St, Los Angeles',
+    },{
+      id: 33,
+      date: '2016-05-03',
+      name: 'updateKeyChildren',
+      address: 'No. 189, Grove St, Los Angeles',
+    },{
+      id: 44,
+      date: '2016-05-03',
+      name: 'updateKeyChildren',
+      address: 'No. 189, Grove St, Los Angeles',
+    },
+  ])
+
+}
+
+</script>

package/src/views/sso/login/index.vue

@@ -0,0 +1,44 @@
+<template>
+  <!--  <div>登录中...</div>-->
+</template>
+
+<script setup lang="ts">
+  import { getCurrentInstance, onMounted } from 'vue';
+  import { useRouter } from 'vue-router';
+
+  import { getSsoLoginUrl, setSsoAccessToken } from '../../../../lib/utils/ssoUtils';
+
+  const router = useRouter();
+
+  const { proxy } = getCurrentInstance() as any;
+
+  onMounted(() => {
+    const code = router.currentRoute.value.query.code;
+    if (!code) {
+      window.location.href = getSsoLoginUrl(window.location.href) || '';
+      // 这里一定要return，不return还是会继续执行下面的代码
+      return;
+    }
+
+    proxy.$http.get('/sso-api/client/auth/getSsoAccessToken', { params: { code: code } }).then((res: any) => {
+      setSsoAccessToken(res.data.data);
+      let redirectRoutePath = router.currentRoute.value.query.redirectRoutePath ?? ('/sso/login/login-success' as any);
+      redirectRoutePath = removeParameter(redirectRoutePath, 'code');
+
+      router.push(redirectRoutePath);
+    });
+  });
+
+  const removeParameter = (url: string, parameter: string) => {
+    // 使用正则表达式匹配参数
+    const regex = new RegExp('[?&]' + parameter + '=[^&]*&?');
+    const newUrl = url.replace(regex, (match, offset, string) => {
+      offset;
+      string;
+      return match.includes('&') ? '&' : '';
+    });
+    return newUrl;
+  }
+</script>
+
+<style scoped></style>

package/src/views/utils/sso-utils.vue

@@ -3,9 +3,11 @@
 </template>
 
 <script setup lang="ts">
-import {onMounted, ref} from 'vue';
+import {onMounted, ref, getCurrentInstance} from 'vue';
 import {getSsoEncrypt} from '../../../lib/utils/ssoUtils';
 
+const {proxy} = getCurrentInstance() as any;
+
 let ssoEncrypt = ref('');
 
 onMounted(async () => {