From a4fe9999a439d596f888cda75214da81e3c6c2d6 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Sat, 11 Oct 2025 11:37:10 +0800 Subject: [PATCH 01/10] uptada --- .../src/layout/components/Sidebar/index.vue | 18 ++++++++++++--- f/web-kboss/src/router/index.js | 5 ++-- f/web-kboss/src/store/getters.js | 3 +-- f/web-kboss/src/store/modules/permission.js | 19 ++++++++++----- f/web-kboss/src/store/modules/user.js | 23 ++++++++++++++----- 5 files changed, 48 insertions(+), 20 deletions(-) diff --git a/f/web-kboss/src/layout/components/Sidebar/index.vue b/f/web-kboss/src/layout/components/Sidebar/index.vue index 08bf1c2..7effadb 100644 --- a/f/web-kboss/src/layout/components/Sidebar/index.vue +++ b/f/web-kboss/src/layout/components/Sidebar/index.vue @@ -40,7 +40,7 @@ export default { name: "Sidebar", components: { SidebarItem, Logo }, computed: { - ...mapGetters(["permission_routes", "sidebar", "userType"]), // 新增：映射userType + ...mapGetters(["permission_routes", "sidebar", "userType", "orgType"]), // 新增：映射orgType showLogo() { return true; @@ -57,14 +57,17 @@ export default { // 修复：确保权限路由正确获取 permissionRoutes() { const routes = this.permission_routes || []; - console.log("Sidebar - 当前权限路由:", routes); - console.log("Sidebar - 用户类型:", this.userType); // 新增：打印用户类型 + console.log("=== Sidebar 权限路由调试 ==="); + console.log("当前权限路由:", routes); + console.log("用户类型:", this.userType); + console.log("组织类型:", this.orgType); // 调试：检查是否包含订单管理和资源管理路由 const hasOrderManagement = routes.some(route => route.path === '/orderManagement'); const hasResourceManagement = routes.some(route => route.path === '/resourceManagement'); console.log("是否包含订单管理:", hasOrderManagement); console.log("是否包含资源管理:", hasResourceManagement); + console.log("=== Sidebar 调试结束 ==="); return routes; }, @@ -86,6 +89,7 @@ export default { mounted() { console.log("Sidebar mounted - 权限路由:", this.permissionRoutes); console.log("Sidebar mounted - 用户类型:", this.userType); + console.log("Sidebar mounted - 组织类型:", this.orgType); }, watch: { @@ -103,6 +107,14 @@ export default { console.log("Sidebar - 用户类型变化:", newType); }, immediate: true + }, + + // 新增：监听组织类型变化 + orgType: { + handler(newType) { + console.log("Sidebar - 组织类型变化:", newType); + }, + immediate: true } } }; diff --git a/f/web-kboss/src/router/index.js b/f/web-kboss/src/router/index.js index 0fa9c7a..f412102 100644 --- a/f/web-kboss/src/router/index.js +++ b/f/web-kboss/src/router/index.js @@ -47,7 +47,7 @@ Vue.use(Router); /** * constantRoutes 没有权限要求的基本页面 - 所有角色都可以访问 + 所有角色都可以访问下· */ export const constantRoutes = [ { @@ -325,7 +325,7 @@ export const asyncRoutes = [ ] }, - // 订单管理菜单 - 保持为一级菜单，调整顺序到全部产品后面 + { path: "/orderManagement", component: Layout, @@ -352,7 +352,6 @@ export const asyncRoutes = [ ] }, - // 资源管理菜单 - 保持为一级菜单，调整顺序到订单管理后面 { path: "/resourceManagement", diff --git a/f/web-kboss/src/store/getters.js b/f/web-kboss/src/store/getters.js index e66a442..f0a9cc1 100644 --- a/f/web-kboss/src/store/getters.js +++ b/f/web-kboss/src/store/getters.js @@ -12,8 +12,7 @@ const getters = { auths: state => state.user.auths, requestCode: state => state.user.requestCode, permission_routes: state => state.permission.routes, - // 新增：用户类型getter userType: state => state.user.userType, - // errorLogs: state => state.errorLog.logs, + orgType: state => state.user.orgType, // 新增：组织类型getter } export default getters diff --git a/f/web-kboss/src/store/modules/permission.js b/f/web-kboss/src/store/modules/permission.js index e81fa6d..a575af1 100644 --- a/f/web-kboss/src/store/modules/permission.js +++ b/f/web-kboss/src/store/modules/permission.js @@ -37,7 +37,7 @@ function filterAsyncRoutes(routes, permissions) { function addUserRoutes(routes, userType) { console.log("addUserRoutes - userType:", userType); - // 如果是普通用户（非管理员），添加订单管理和资源管理路由 + // 如果是普通用户（org_type为2），添加订单管理和资源管理路由 if (userType === 'user') { const orderManagementRoute = routes.find(route => route.path === "/orderManagement"); const resourceManagementRoute = routes.find(route => route.path === "/resourceManagement"); @@ -113,11 +113,11 @@ const actions = { return new Promise((resolve) => { let accessedRoutes; - // 判断用户类型：admin为1是管理员，否则是普通用户 - const userType = params.admin == 1 ? 'admin' : 'user'; - console.log("用户类型:", userType); + // 判断用户类型：org_type为2是客户，否则是管理员 + const userType = params.orgType == 2 ? 'user' : 'admin'; + console.log("用户类型:", userType, "orgType:", params.orgType); - if (params.user.includes("admin") && params.admin == 1) { + if (params.user.includes("admin") && params.orgType != 2) { // 管理员：只显示超级管理员菜单 accessedRoutes = asyncRoutes.filter(item => item.path === '/superAdministrator'); } else { @@ -147,7 +147,14 @@ const actions = { if (userType === 'user') { console.log("为普通用户添加订单管理和资源管理路由"); const userSpecificRoutes = addUserRoutes(asyncRoutes, userType); - accessedRoutes = [...accessedRoutes, ...userSpecificRoutes]; + + // 确保不重复添加路由 + userSpecificRoutes.forEach(route => { + if (!accessedRoutes.some(r => r.path === route.path)) { + accessedRoutes.push(route); + } + }); + console.log("添加用户特定路由后的accessedRoutes:", accessedRoutes); } } diff --git a/f/web-kboss/src/store/modules/user.js b/f/web-kboss/src/store/modules/user.js index c2e673f..7b58f2b 100644 --- a/f/web-kboss/src/store/modules/user.js +++ b/f/web-kboss/src/store/modules/user.js @@ -21,7 +21,9 @@ const state = { //客户余额 mybalance: '', // 新增：用户类型（admin/user） - userType: '' + userType: '', + // 新增：组织类型 + orgType: '' }; const mutations = { @@ -55,6 +57,11 @@ const mutations = { SET_USER_TYPE: (state, userType) => { state.userType = userType; sessionStorage.setItem("userType", userType); + }, + // 新增：设置组织类型 + SET_ORG_TYPE: (state, orgType) => { + state.orgType = orgType; + sessionStorage.setItem("orgType", orgType); } }; @@ -82,13 +89,15 @@ const actions = { type: 'error', }) } else { - const {data, admin} = response; + const {data, org_type} = response; commit("SET_USER", username); - // 新增：设置用户类型 - const userType = admin == 1 ? 'admin' : 'user'; + // 新增：根据 org_type 设置用户类型 + // org_type 为 2 表示客户，其他为管理员 + const userType = org_type == 2 ? 'user' : 'admin'; commit("SET_USER_TYPE", userType); - console.log("登录用户类型:", userType); + commit("SET_ORG_TYPE", org_type); + console.log("登录用户类型:", userType, "org_type:", org_type); data ? commit("SET_AUTHS", data) : commit("SET_AUTHS", []); const accessRoutes = await store.dispatch( @@ -96,7 +105,7 @@ const actions = { { user: username, auths: data, - admin: admin + orgType: org_type // 传递 orgType 而不是 admin } ) resetRouter(); @@ -145,6 +154,7 @@ const actions = { commit("SET_TOKEN", ""); commit("SET_ROLES", []); commit("SET_USER_TYPE", ""); // 新增：清除用户类型 + commit("SET_ORG_TYPE", ""); // 新增：清除组织类型 removeToken(); resetRouter(); @@ -167,6 +177,7 @@ const actions = { commit("SET_TOKEN", ""); commit("SET_ROLES", []); commit("SET_USER_TYPE", ""); // 新增：清除用户类型 + commit("SET_ORG_TYPE", ""); // 新增：清除组织类型 removeToken(); resolve(); }); From 558eec60135be6ce4e6033bd917861cea7650f56 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Sat, 11 Oct 2025 14:01:51 +0800 Subject: [PATCH 02/10] uptada --- .../src/layout/components/Sidebar/index.vue | 6 + f/web-kboss/src/main.js | 59 +++++++++- f/web-kboss/src/store/getters.js | 8 +- f/web-kboss/src/store/modules/permission.js | 18 +-- f/web-kboss/src/store/modules/user.js | 108 ++++++++++++------ 5 files changed, 149 insertions(+), 50 deletions(-) diff --git a/f/web-kboss/src/layout/components/Sidebar/index.vue b/f/web-kboss/src/layout/components/Sidebar/index.vue index 7effadb..3e413eb 100644 --- a/f/web-kboss/src/layout/components/Sidebar/index.vue +++ b/f/web-kboss/src/layout/components/Sidebar/index.vue @@ -67,6 +67,10 @@ export default { const hasResourceManagement = routes.some(route => route.path === '/resourceManagement'); console.log("是否包含订单管理:", hasOrderManagement); console.log("是否包含资源管理:", hasResourceManagement); + + // 检查用户类型和组织类型是否正确 + console.log("当前用户类型:", this.userType); + console.log("当前组织类型:", this.orgType); console.log("=== Sidebar 调试结束 ==="); return routes; @@ -90,6 +94,8 @@ export default { console.log("Sidebar mounted - 权限路由:", this.permissionRoutes); console.log("Sidebar mounted - 用户类型:", this.userType); console.log("Sidebar mounted - 组织类型:", this.orgType); + console.log("sessionStorage userType:", sessionStorage.getItem('userType')); + console.log("sessionStorage orgType:", sessionStorage.getItem('orgType')); }, watch: { diff --git a/f/web-kboss/src/main.js b/f/web-kboss/src/main.js index 8e955d1..92bf068 100644 --- a/f/web-kboss/src/main.js +++ b/f/web-kboss/src/main.js @@ -22,7 +22,7 @@ let ploady={ start_date:'', end_date:'' } -reqSaleMoneyList(ploady) +// reqSaleMoneyList(ploady) // import {saveApprovalInfo} from "@/api/finance/approvalList"; // saveApprovalInfo(JSON.stringify({ // "flag":"update", @@ -98,20 +98,73 @@ Vue.use(Element, { //设置跳转页面时给页面的body属性设置滚动条 var onOverflow = ["/shoppingManagement", "/supplierManagement"]; -router.afterEach((to, from, next) => { +// 修复：在路由守卫中恢复用户状态和重新生成路由 +router.beforeEach(async (to, from, next) => { + // 清空面包屑状态的代码 + // store.commit('tagsView/resetBreadcrumbState'); + + // 新增：如果已登录且有token，但Vuex状态丢失，从sessionStorage恢复 + if (store.getters.token && (!store.getters.user || !store.getters.userType)) { + console.log("检测到状态丢失，从sessionStorage恢复用户状态"); + + const user = sessionStorage.getItem('user'); + const auths = sessionStorage.getItem('auths'); + const userType = sessionStorage.getItem('userType'); + const orgType = sessionStorage.getItem('orgType'); + + if (user) { + store.commit('user/SET_USER', user); + } + if (auths) { + store.commit('user/SET_AUTHS', JSON.parse(auths)); + } + if (userType) { + store.commit('user/SET_USER_TYPE', userType); + } + if (orgType) { + store.commit('user/SET_ORG_TYPE', parseInt(orgType)); + } + + // 重新生成路由 + try { + const accessRoutes = await store.dispatch('permission/generateRoutes', { + user: store.getters.user, + auths: store.getters.auths, + userType: store.getters.userType, + orgType: store.getters.orgType + }); + + // 重新添加路由 + router.addRoutes(accessRoutes); + + // 重定向到当前路由以确保路由更新 + next({ ...to, replace: true }); + return; + } catch (error) { + console.error('重新生成路由失败:', error); + } + } + onOverflow.forEach(element => { if (to.path == element) { document.querySelector("body").setAttribute("style", "overflow: auto !important;") } }); + + next(); }); + +window.addEventListener('beforeunload', function () { + // 清空面包屑状态的代码 + store.commit('tagsView/resetBreadcrumbState'); +}); + Object.keys(filters).forEach(key => { Vue.filter(key, filters[key]) }) Vue.config.productionTip = false - new Vue({ el: '#app', router, diff --git a/f/web-kboss/src/store/getters.js b/f/web-kboss/src/store/getters.js index f0a9cc1..0d6cfd8 100644 --- a/f/web-kboss/src/store/getters.js +++ b/f/web-kboss/src/store/getters.js @@ -8,11 +8,11 @@ const getters = { avatar: state => state.user.avatar, name: state => state.user.name, introduction: state => state.user.introduction, - user: state => state.user.user, - auths: state => state.user.auths, + user: state => state.user.user || sessionStorage.getItem('user') || '', + auths: state => state.user.auths || JSON.parse(sessionStorage.getItem('auths') || '[]'), requestCode: state => state.user.requestCode, permission_routes: state => state.permission.routes, - userType: state => state.user.userType, - orgType: state => state.user.orgType, // 新增：组织类型getter + userType: state => state.user.userType || sessionStorage.getItem('userType') || '', + orgType: state => state.user.orgType || parseInt(sessionStorage.getItem('orgType')) || 0, } export default getters diff --git a/f/web-kboss/src/store/modules/permission.js b/f/web-kboss/src/store/modules/permission.js index a575af1..969a0a2 100644 --- a/f/web-kboss/src/store/modules/permission.js +++ b/f/web-kboss/src/store/modules/permission.js @@ -46,12 +46,12 @@ function addUserRoutes(routes, userType) { if (orderManagementRoute) { console.log("添加订单管理路由"); - userRoutes.push(orderManagementRoute); + userRoutes.push(JSON.parse(JSON.stringify(orderManagementRoute))); // 深拷贝 } if (resourceManagementRoute) { console.log("添加资源管理路由"); - userRoutes.push(resourceManagementRoute); + userRoutes.push(JSON.parse(JSON.stringify(resourceManagementRoute))); // 深拷贝 } return userRoutes; @@ -113,15 +113,17 @@ const actions = { return new Promise((resolve) => { let accessedRoutes; - // 判断用户类型：org_type为2是客户，否则是管理员 - const userType = params.orgType == 2 ? 'user' : 'admin'; - console.log("用户类型:", userType, "orgType:", params.orgType); + // 从参数或sessionStorage中获取用户类型和组织类型 + const userType = params.userType || sessionStorage.getItem('userType') || ''; + const orgType = params.orgType || parseInt(sessionStorage.getItem('orgType')) || 0; - if (params.user.includes("admin") && params.orgType != 2) { + console.log("用户类型:", userType, "orgType:", orgType); + + if (params.user && params.user.includes("admin") && orgType != 2) { // 管理员：只显示超级管理员菜单 accessedRoutes = asyncRoutes.filter(item => item.path === '/superAdministrator'); } else { - const auths = JSON.parse(JSON.stringify(params.auths)); + const auths = params.auths ? JSON.parse(JSON.stringify(params.auths)) : []; console.log("ACTION generateRoutes - auths:", auths); if (auths.length) { @@ -144,7 +146,7 @@ const actions = { } // 新增：为普通用户添加订单管理和资源管理路由 - if (userType === 'user') { + if (userType === 'user' || orgType == 2) { console.log("为普通用户添加订单管理和资源管理路由"); const userSpecificRoutes = addUserRoutes(asyncRoutes, userType); diff --git a/f/web-kboss/src/store/modules/user.js b/f/web-kboss/src/store/modules/user.js index 7b58f2b..4f364e9 100644 --- a/f/web-kboss/src/store/modules/user.js +++ b/f/web-kboss/src/store/modules/user.js @@ -7,23 +7,36 @@ import store from "@/store"; import {myBalanceAPI} from "@/api/finance/customerRechargeManagement"; import {testData} from "@/views/homePage/components/topBox/testData"; +// 从sessionStorage恢复状态 +const getStoredState = () => { + return { + user: sessionStorage.getItem('user') || "", + auths: JSON.parse(sessionStorage.getItem('auths')) || [], + userType: sessionStorage.getItem('userType') || '', + orgType: parseInt(sessionStorage.getItem('orgType')) || '', + mybalance: sessionStorage.getItem('mybalance') || '' + }; +}; + +const storedState = getStoredState(); + const state = { token: getToken(), name: "", avatar: "", introduction: "", //用户名称 - user: "", + user: storedState.user, //权限列表 - auths: [], + auths: storedState.auths, // 当前状态码 requestCode: 200, //客户余额 - mybalance: '', + mybalance: storedState.mybalance, // 新增：用户类型（admin/user） - userType: '', + userType: storedState.userType, // 新增：组织类型 - orgType: '' + orgType: storedState.orgType }; const mutations = { @@ -41,17 +54,18 @@ const mutations = { }, SET_AUTHS: (state, auths) => { state.auths = auths; - sessionStorage.setItem("auths", JSON.stringify(state.auths)); + sessionStorage.setItem("auths", JSON.stringify(auths)); }, SET_USER: (state, user) => { state.user = user; - sessionStorage.setItem("user", state.user); + sessionStorage.setItem("user", user); }, SET_REQUESTSTATE: (state, code) => { state.requestCode = code; }, SETMYBANLANCE(state, mybalance) { - state.mybalance = mybalance + state.mybalance = mybalance; + sessionStorage.setItem('mybalance', mybalance); }, // 新增：设置用户类型 SET_USER_TYPE: (state, userType) => { @@ -61,7 +75,7 @@ const mutations = { // 新增：设置组织类型 SET_ORG_TYPE: (state, orgType) => { state.orgType = orgType; - sessionStorage.setItem("orgType", orgType); + sessionStorage.setItem("orgType", orgType.toString()); } }; @@ -71,12 +85,10 @@ const actions = { let result = await myBalanceAPI() if (result.status) { commit('SETMYBANLANCE', result.data) - sessionStorage.setItem('mybalance', result.data) } }, // user login async login({commit}, userInfo) { - const {username, password, codeid, vcode} = userInfo; return new Promise(async (resolve, reject) => { loginUserAPI(userInfo) @@ -105,7 +117,8 @@ const actions = { { user: username, auths: data, - orgType: org_type // 传递 orgType 而不是 admin + userType: userType, + orgType: org_type } ) resetRouter(); @@ -126,47 +139,64 @@ const actions = { // get user info getInfo({commit, state}) { return new Promise((resolve, reject) => { - // getInfo(state.token).then(response => { - // const { data } = response - // if (!data) { - // reject('Verification failed, please Login again.') - // } - // const { roles, name, avatar, introduction } = data - // // roles must be a non-empty array - // if (!roles || roles.length <= 0) { - // reject('getInfo: roles must be a non-null array!') - // } - // commit('SET_ROLES', roles) - // commit('SET_NAME', name) - // commit('SET_AVATAR', avatar) - // commit('SET_INTRODUCTION', introduction) - // }).catch(error => { - // reject(error) - // }) + // 从sessionStorage恢复用户信息 + const user = sessionStorage.getItem('user'); + const auths = sessionStorage.getItem('auths'); + const userType = sessionStorage.getItem('userType'); + const orgType = sessionStorage.getItem('orgType'); + + if (user) { + commit("SET_USER", user); + } + if (auths) { + commit("SET_AUTHS", JSON.parse(auths)); + } + if (userType) { + commit("SET_USER_TYPE", userType); + } + if (orgType) { + commit("SET_ORG_TYPE", parseInt(orgType)); + } + + resolve({ + user: state.user, + auths: state.auths, + userType: state.userType, + orgType: state.orgType + }); }); }, // user logout logout({commit, state, dispatch}) { return new Promise((resolve, reject) => { - logout(state.token) - .then(() => { + // logout(state.token) + // .then(() => { commit("SET_TOKEN", ""); commit("SET_ROLES", []); commit("SET_USER_TYPE", ""); // 新增：清除用户类型 commit("SET_ORG_TYPE", ""); // 新增：清除组织类型 + commit("SET_USER", ""); + commit("SET_AUTHS", []); removeToken(); resetRouter(); + // 清除sessionStorage + sessionStorage.removeItem('user'); + sessionStorage.removeItem('auths'); + sessionStorage.removeItem('userType'); + sessionStorage.removeItem('orgType'); + sessionStorage.removeItem('mybalance'); + // reset visited views and cached views // to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485 dispatch("tagsView/delAllViews", null, {root: true}); resolve(); - }) - .catch((error) => { - reject(error); - }); + // }) + // .catch((error) => { + // reject(error); + // }); }); }, @@ -178,7 +208,15 @@ const actions = { commit("SET_ROLES", []); commit("SET_USER_TYPE", ""); // 新增：清除用户类型 commit("SET_ORG_TYPE", ""); // 新增：清除组织类型 + commit("SET_USER", ""); + commit("SET_AUTHS", []); removeToken(); + + // 清除sessionStorage + sessionStorage.removeItem('user'); + sessionStorage.removeItem('auths'); + sessionStorage.removeItem('userType'); + sessionStorage.removeItem('orgType'); resolve(); }); }, From 5b50e00e170d85b2a5aeeca83db28ed7c1d56ebc Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Wed, 15 Oct 2025 17:22:03 +0800 Subject: [PATCH 03/10] uptada --- .../src/layout/components/Sidebar/index.vue | 90 +++++++++---------- f/web-kboss/src/main.js | 2 +- f/web-kboss/src/styles/variables.scss | 31 +++---- 3 files changed, 52 insertions(+), 71 deletions(-) diff --git a/f/web-kboss/src/layout/components/Sidebar/index.vue b/f/web-kboss/src/layout/components/Sidebar/index.vue index 3e413eb..8e01a88 100644 --- a/f/web-kboss/src/layout/components/Sidebar/index.vue +++ b/f/web-kboss/src/layout/components/Sidebar/index.vue @@ -40,7 +40,7 @@ export default { name: "Sidebar", components: { SidebarItem, Logo }, computed: { - ...mapGetters(["permission_routes", "sidebar", "userType", "orgType"]), // 新增：映射orgType + ...mapGetters(["permission_routes", "sidebar", "userType", "orgType"]), showLogo() { return true; @@ -54,34 +54,15 @@ export default { return !this.sidebar.opened; }, - // 修复：确保权限路由正确获取 permissionRoutes() { const routes = this.permission_routes || []; - console.log("=== Sidebar 权限路由调试 ==="); - console.log("当前权限路由:", routes); - console.log("用户类型:", this.userType); - console.log("组织类型:", this.orgType); - - // 调试：检查是否包含订单管理和资源管理路由 - const hasOrderManagement = routes.some(route => route.path === '/orderManagement'); - const hasResourceManagement = routes.some(route => route.path === '/resourceManagement'); - console.log("是否包含订单管理:", hasOrderManagement); - console.log("是否包含资源管理:", hasResourceManagement); - - // 检查用户类型和组织类型是否正确 - console.log("当前用户类型:", this.userType); - console.log("当前组织类型:", this.orgType); - console.log("=== Sidebar 调试结束 ==="); - return routes; }, - // 修复：激活菜单的高亮 activeMenu() { const route = this.$route; const { meta, path } = route; - // 如果设置了activeMenu，就使用它 if (meta.activeMenu) { return meta.activeMenu; } @@ -92,36 +73,6 @@ export default { mounted() { console.log("Sidebar mounted - 权限路由:", this.permissionRoutes); - console.log("Sidebar mounted - 用户类型:", this.userType); - console.log("Sidebar mounted - 组织类型:", this.orgType); - console.log("sessionStorage userType:", sessionStorage.getItem('userType')); - console.log("sessionStorage orgType:", sessionStorage.getItem('orgType')); - }, - - watch: { - permission_routes: { - handler(newRoutes) { - console.log("Sidebar - 权限路由变化:", newRoutes); - }, - deep: true, - immediate: true - }, - - // 新增：监听用户类型变化 - userType: { - handler(newType) { - console.log("Sidebar - 用户类型变化:", newType); - }, - immediate: true - }, - - // 新增：监听组织类型变化 - orgType: { - handler(newType) { - console.log("Sidebar - 组织类型变化:", newType); - }, - immediate: true - } } }; @@ -157,6 +108,7 @@ export default { } } + // 重点修改部分 - 更具体的选择器 ::v-deep .el-menu-vertical { border: none; height: 100%; @@ -170,8 +122,36 @@ export default { overflow: hidden; text-overflow: ellipsis; } + + // 子菜单容器 + .el-menu--inline { + // 子菜单项 + .el-menu-item { + // 激活的子菜单项 + &.is-active { + background-color: #d7dafd !important; + color: #296ad9 !important; + + &:before { + content: ''; + position: absolute; + left: 0; + top: 0; + bottom: 0; + width: 3px; + background-color: #296ad9; + } + } + + // 非激活状态的悬停效果 + &:not(.is-active):hover { + background-color: #f5f7fa !important; + } + } + } } + // 折叠状态 ::v-deep .el-menu--collapse { width: 64px !important; min-width: 64px !important; @@ -181,6 +161,16 @@ export default { text-overflow: clip; justify-content: center; } + + // 折叠状态下的子菜单激活样式 + .el-menu--popup { + .el-menu-item { + &.is-active { + background-color: #d7dafd !important; + color: #296ad9 !important; + } + } + } } } diff --git a/f/web-kboss/src/main.js b/f/web-kboss/src/main.js index 92bf068..85dfb53 100644 --- a/f/web-kboss/src/main.js +++ b/f/web-kboss/src/main.js @@ -1,7 +1,7 @@ import Vue from 'vue' import Cookies from 'js-cookie' - + import 'normalize.css/normalize.css' // a modern alternative to CSS resets import Element from 'element-ui' diff --git a/f/web-kboss/src/styles/variables.scss b/f/web-kboss/src/styles/variables.scss index 8759553..aef5d78 100644 --- a/f/web-kboss/src/styles/variables.scss +++ b/f/web-kboss/src/styles/variables.scss @@ -1,4 +1,5 @@ -// / base color +// variables.scss +// base color $blue: #324157; $light-blue: #3A71A8; $red: #C03639; @@ -9,22 +10,17 @@ $yellow: #FEC171; $panGreen: #30B08F; // sidebar -$menuText: #000; -$menuActiveText: #296ad9; // 当前激活菜单项的文字颜色 -$subMenuActiveText: #100101; // 当前激活子菜单项的文字颜色 +$menuText: #333; +$menuActiveText: #296ad9; +$subMenuActiveText: #000; -$menuBg: #fff; // 整体背景颜色 -$menuHover: #f0f0f0; // 鼠标悬浮一级菜单背景色 (轻微变化更友好) -$subMenuBg: #f7f7f7; // 子菜单背景色 -$subMenuHover: #eaeaea; // 鼠标悬浮子菜单背景色 (轻微变化更友好) +$menuBg: #fff; +$menuHover: #f5f7fa; +$subMenuBg: #fff; +$subMenuHover: #f0f0f0; -$sideBarWidth: 230px; // 侧边栏宽度 +$sideBarWidth: 230px; -// Element UI 默认折叠宽度为 64px -// $sideBarCollapseWidth: 64px; - -// the :export directive is the magic sauce for webpack -// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass :export { menuText: $menuText; menuActiveText: $menuActiveText; @@ -34,9 +30,4 @@ $sideBarWidth: 230px; // 侧边栏宽度 subMenuBg: $subMenuBg; subMenuHover: $subMenuHover; sideBarWidth: $sideBarWidth; - // sideBarCollapseWidth: $sideBarCollapseWidth; -} - - - - +} From c31a87369c20dc0d85474a3576f2aba900e2566f Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Fri, 17 Oct 2025 10:54:57 +0800 Subject: [PATCH 04/10] uptada --- f/web-kboss/src/layout/components/Sidebar/index.vue | 2 +- f/web-kboss/src/router/index.js | 2 +- f/web-kboss/src/views/homePage/components/topBox/index.vue | 6 ++++++ .../views/homePage/ncmatch/supplyAndDemandSquare/index.vue | 6 +----- 4 files changed, 9 insertions(+), 7 deletions(-) diff --git a/f/web-kboss/src/layout/components/Sidebar/index.vue b/f/web-kboss/src/layout/components/Sidebar/index.vue index 8e01a88..42cc42c 100644 --- a/f/web-kboss/src/layout/components/Sidebar/index.vue +++ b/f/web-kboss/src/layout/components/Sidebar/index.vue @@ -32,7 +32,7 @@ + + + + + + + +
+

+ + +

+
+ + + 查看项目 + +
+
+
+
    + +
  • + +
    客服
    +
    &#xe625;
    +
    • + +
  • + +
    地图_地球_o
    +
    &#xebbb;
    +
    • + +
  • + +
    消息
    +
    &#xe60a;
    +
    • + +
  • + +
    AI助手
    +
    &#xe65f;
    +
    • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式，特点是：

+
    +
  • 支持按字体的方式去动态调整图标大小，颜色等等。
    • +
  • 默认情况下不支持多色，直接添加多色图标会自动去色。
    • +
+
+

注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）

+
+

Unicode 使用步骤如下：

+

第一步：拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.woff2?t=1760680783657') format('woff2'),
+       url('iconfont.woff?t=1760680783657') format('woff'),
+       url('iconfont.ttf?t=1760680783657') format('truetype');
+}
+
+

第二步：定义使用 iconfont 的样式

+
.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步：挑选相应图标并获取字体编码，应用于页面

+
+<span class="iconfont">&#x33;</span>
+
+
+

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + 客服 +
    +
    .icon-kefu +
    +
    • + +
  • + +
    + 地图_地球_o +
    +
    .icon-ditu_diqiu_o +
    +
    • + +
  • + +
    + 消息 +
    +
    .icon-xiaoxi +
    +
    • + +
  • + +
    + AI助手 +
    +
    .icon-AIzhushou +
    +
    • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。

+

与 Unicode 使用方式相比，具有如下特点：

+
    +
  • 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
    • +
  • 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 fontclass 代码：

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步：挑选相应图标并获取类名，应用于页面：

+
<span class="iconfont icon-xxx"></span>
+
+
+

" + iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    客服
    +
    #icon-kefu
    +
    • + +
  • + +
    地图_地球_o
    +
    #icon-ditu_diqiu_o
    +
    • + +
  • + +
    消息
    +
    #icon-xiaoxi
    +
    • + +
  • + +
    AI助手
    +
    #icon-AIzhushou
    +
    • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：

+
    +
  • 支持多色图标了，不再受单色限制。
    • +
  • 通过一些技巧，支持像字体那样，通过 font-size, color 来调整样式。
    • +
  • 兼容性较差，支持 IE9+，及现代浏览器。
    • +
  • 浏览器渲染 SVG 的性能一般，还不如 png。
    • +
+

使用步骤如下：

+

第一步：引入项目下面生成的 symbol 代码：

+
<script src="./iconfont.js"></script>
+
+

第二步：加入通用 CSS 代码（引入一次就行）：

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步：挑选相应图标并获取类名，应用于页面：

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.css b/f/web-kboss/src/assets/css/iconfont/iconfont.css new file mode 100644 index 0000000..68ec51a --- /dev/null +++ b/f/web-kboss/src/assets/css/iconfont/iconfont.css @@ -0,0 +1,31 @@ +@font-face { + font-family: "iconfont"; /* Project id 5043107 */ + src: url('iconfont.woff2?t=1760680783657') format('woff2'), + url('iconfont.woff?t=1760680783657') format('woff'), + url('iconfont.ttf?t=1760680783657') format('truetype'); +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-kefu:before { + content: "\e625"; +} + +.icon-ditu_diqiu_o:before { + content: "\ebbb"; +} + +.icon-xiaoxi:before { + content: "\e60a"; +} + +.icon-AIzhushou:before { + content: "\e65f"; +} + diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.js b/f/web-kboss/src/assets/css/iconfont/iconfont.js new file mode 100644 index 0000000..585e86a --- /dev/null +++ b/f/web-kboss/src/assets/css/iconfont/iconfont.js @@ -0,0 +1 @@ +window._iconfont_svg_string_5043107='',(c=>{var t=(e=(e=document.getElementsByTagName("script"))[e.length-1]).getAttribute("data-injectcss"),e=e.getAttribute("data-disable-injectsvg");if(!e){var n,i,o,a,l,d=function(t,e){e.parentNode.insertBefore(t,e)};if(t&&!c.__iconfont__svg__cssinject__){c.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(t){console&&console.log(t)}}n=function(){var t,e=document.createElement("div");e.innerHTML=c._iconfont_svg_string_5043107,(e=e.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",e=e,(t=document.body).firstChild?d(e,t.firstChild):t.appendChild(e))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(n,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),n()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(o=n,a=c.document,l=!1,m(),a.onreadystatechange=function(){"complete"==a.readyState&&(a.onreadystatechange=null,s())})}function s(){l||(l=!0,o())}function m(){try{a.documentElement.doScroll("left")}catch(t){return void setTimeout(m,50)}s()}})(window); \ No newline at end of file diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.json b/f/web-kboss/src/assets/css/iconfont/iconfont.json new file mode 100644 index 0000000..036b5ac --- /dev/null +++ b/f/web-kboss/src/assets/css/iconfont/iconfont.json @@ -0,0 +1,37 @@ +{ + "id": "5043107", + "name": "kboos", + "font_family": "iconfont", + "css_prefix_text": "icon-", + "description": "", + "glyphs": [ + { + "icon_id": "2674476", + "name": "客服", + "font_class": "kefu", + "unicode": "e625", + "unicode_decimal": 58917 + }, + { + "icon_id": "5388029", + "name": "地图_地球_o", + "font_class": "ditu_diqiu_o", + "unicode": "ebbb", + "unicode_decimal": 60347 + }, + { + "icon_id": "31157387", + "name": "消息", + "font_class": "xiaoxi", + "unicode": "e60a", + "unicode_decimal": 58890 + }, + { + "icon_id": "44896696", + "name": "AI助手", + "font_class": "AIzhushou", + "unicode": "e65f", + "unicode_decimal": 58975 + } + ] +} diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.ttf b/f/web-kboss/src/assets/css/iconfont/iconfont.ttf new file mode 100644 index 0000000000000000000000000000000000000000..fd422d28505e240acfc0adf169bb7a1f4354ca45 GIT binary patch literal 2720 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 a*wBzaX*!NaUUkfR%kjg@_ri7sTL1vCK+_)p literal 0 HcmV?d00001 diff --git a/f/web-kboss/src/assets/image/user.png b/f/web-kboss/src/assets/image/user.png new file mode 100644 index 0000000000000000000000000000000000000000..921867609d3938d8710818bb0e44aa0323f4aa3d GIT binary patch literal 6734 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 literal 0 HcmV?d00001 diff --git a/f/web-kboss/src/components/MessageCenter/MessageCenter.vue b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue new file mode 100644 index 0000000..6a98a2f --- /dev/null +++ b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue @@ -0,0 +1,768 @@ + + + + + diff --git a/f/web-kboss/src/layout/components/Navbar.vue b/f/web-kboss/src/layout/components/Navbar.vue index 3b5681a..39297a0 100644 --- a/f/web-kboss/src/layout/components/Navbar.vue +++ b/f/web-kboss/src/layout/components/Navbar.vue @@ -4,12 +4,12 @@ 平台充值中心 - - + +
- +
-
{{ nick_name.charAt(0) }}
{{ nick_name }} - - -
{{ nick_name }} ID: - {{ - userId - }} - + {{ userId }} @@ -93,11 +75,10 @@
- - 余额{{ - mybalance ? mybalance : initMybalance() - }} ￥ + + 余额 + {{ mybalance ? mybalance : initMybalance() }} ￥ + 充值 @@ -106,210 +87,22 @@ 个人中心 - - - - - - - - - 修改密码 - - 退出登录 - - - - -
- - - - -
消息中心
-
-
全部消息
-
未读消息
-
已读消息
-
- - - | {{ this.tabTitle }} - - -
-
- 已读 - 删除 -
- - - - - - - - - - - -
- - -
-
- 已读 - 删除 -
- - - - - - - - - - - -
- - -
-
- 删除 -
- - - - - - - - - -
- - - - - - - - - -
消息中心
-
-
全部消息
-
未读消息
-
已读消息
-
- - - | {{ this.tabTitle }} - - -
-
- 已读 - 删除 -
- - - - - - - - - - - -
- - -
-
- 已读 - 删除 -
- - - - - - - - - - - -
- - -
-
- 删除 -
- - - - - - - - - - -
- - - - - + + - + @@ -373,7 +166,6 @@ -
图表的颜色: @@ -397,12 +189,13 @@ 确 定
- + + - + 开元云公司作为一级分销商面对直接客户，售出设备产品。产品由供应商上传平台，设置产品价格配置，及设备账号密码等配置信息，开元云进行审核，审核通过产品上线，客户可直接购买。开元云可以将产品分配给各供应商销售，分配时配置给供应商的折扣，供应商得到产品及开元云的折扣后，设置折扣面向客户，客户通过kboss进行购买，分销商的客户如自己上传产品，也可以成为开元云的供应商。 @@ -412,8 +205,7 @@ - - + @@ -428,7 +220,6 @@ {{ item.description }} -
@@ -437,6 +228,7 @@ +
@@ -464,11 +256,6 @@ import { logoutAPI, editPasswordAPI, getTimeAPI, - getUnreadmsgAPI, - getMsgAPI, - getReadmsgAPI, - upMsgAPI, - delMsgAPI, addPictureAPI, getPictureAPI, getOpictureAPI, @@ -482,6 +269,9 @@ import { reqSearchProductList } from "@/api/product/product"; import { bdProducts, jdProducts } from "@/views/product/productionData"; import { getHomePath } from "@/views/setting/tools"; +// 导入消息中心组件 +import MessageCenter from '@/components/MessageCenter/MessageCenter.vue' + export default { data() { return { @@ -490,31 +280,22 @@ export default { searchResultList: [], searchValue: '', searchDialogVisible: false, - channelManagementShow: false,//渠道管理 + channelManagementShow: false, isMobileScreen: false, cuxiaoIsShow: false, - isShowKbossCharge: false,//判断是否在充值页面 - isUpdate: false,//检测用户是否“已读” + isShowKbossCharge: false, isLocalhost: false, - // 获取用户代理字P串 userAgent: window.navigator.userAgent, - // 判断是否为移动设备 - isMobile: false, imageUrl: '', - alliInformationList: [],//全部消息 - unreadMessageList: [],//未读信息 - readInformationList: [],//已读信息 - readIdList: [], - count: null, + messageCount: 0, // 未读消息数量 userInfoList: [], - editUserInfoForm: { //修改个人信息表单 + editUserInfoForm: { nick_name: "", email: "", address: "", mobile: "", }, passwordForm: { - //修改密码表单 password: "", newpassword: "", configPassword: "", @@ -544,15 +325,10 @@ export default { "https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png", passwordDialog: false, editUserInfoDialog: false, - //通知 - drawer: false, - direction: "rtl", nick_name: JSON.parse(localStorage.getItem('user_info')).username, userId: sessionStorage.getItem("userId"), org_type: sessionStorage.getItem("org_type"), role: sessionStorage.getItem("jueseNew") == "admin" ? [] : sessionStorage.getItem("jueseNew"), - tabTitle: "消息中心", - tab_index: 1, dialogTableVisible: false, dialogFormVisible: false, form: { @@ -580,12 +356,11 @@ export default { color: '#F51515' }, }, - oneId: '', - isOne: false, currentFile: null }; }, components: { + MessageCenter, // 注册消息中心组件 PromotionalInvitationCode, Breadcrumb, Hamburger, @@ -601,19 +376,24 @@ export default { gridObj: state => state.operationAnalysis.gridObj, mybalance: state => state.user.mybalance, logoutUrl: state => state.login.logoutUrl, - }) }, created() { - this.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(this.userAgent); - this.getUserInfo(); - // this.autoShuaXin(); this.themeState = sessionStorage.getItem('themeState') - this.getUnreadmsg() this.handleResize() }, methods: { + // 打开消息中心 + openMessageCenter() { + this.$refs.messageCenter.open(); + }, + + // 处理未读消息数量更新 + handleUnreadCountUpdate(count) { + this.messageCount = count; + }, + goHomePage() { this.$router.push('/homePage/index') this.$store.commit('setShowHomeNav', true) @@ -692,7 +472,6 @@ export default { params: { product_name: '数据库' } }) } else { - // console.log("走了京哦else") this.$router.push('/product/jdProduct') } } else if (item.type === "sdzx") { @@ -706,9 +485,6 @@ export default { return } this.searchLoading = true - // setTimeout(() => { - // this.searchLoading = false - // }, 300) reqSearchProductList({ name: this.searchValue }).then(res => { this.searchLoading = false if (res.status) { @@ -723,24 +499,6 @@ export default { }, goScreen() { window.open('https://www.kaiyuancloud.cn/dev/#/screen/k8sRescource', '_blank'); - // const newWindow = window.open('https://www.kaiyuancloud.cn/dev/#/screen/index', '_blank'); - // const newWindow = window.open('http://localhost:9527/#/screen/index', '_blank'); - // // 确保窗口已经打开 - // newWindow.onload = function () { - // // 这需要用户的交互才能全屏 - // if (newWindow.document.documentElement.requestFullscreen) { - // console.log("走了if") - // newWindow.document.documentElement.requestFullscreen(); - // } else if (newWindow.document.documentElement.mozRequestFullScreen) { // Firefox - // newWindow.document.documentElement.mozRequestFullScreen(); - // } else if (newWindow.document.documentElement.webkitRequestFullscreen) { // Chrome, Safari and Opera - // console.log("走了if谷歌") - // newWindow.document.documentElement.webkitRequestFullscreen(); - // } else if (newWindow.document.documentElement.msRequestFullscreen) { // IE/Edge - // newWindow.document.documentElement.msRequestFullscreen(); - // } - // }; - }, channelFirstBtn() { reqApplyChannel({ user_id: this.userId }).then(res => { @@ -753,7 +511,7 @@ export default { } }) }, - ChannelConfirmBtn() {//渠道确定按钮 + ChannelConfirmBtn() { reqApplyChannel({ user_id: this.userId, code: '200' }).then(res => { if (res.status) { this.$message.success("申请渠道成功，后续会有相关人员和您沟通~") @@ -762,9 +520,7 @@ export default { this.$message.error("申请渠道失败~") } }) - }, - // 屏幕宽度变化时触发的方法 handleResize() { if (window.matchMedia('(max-width: 760px)').matches) { this.isMobileScreen = true; @@ -773,10 +529,8 @@ export default { } }, beforeDestroy() { - // 在组件销毁前移除监听器 window.removeEventListener('resize', this.handleResize); }, - //接受子组件信息 acceptSonMessage(value) { this.cuxiaoIsShow = value }, @@ -785,12 +539,10 @@ export default { }, handleShow(isShow) { let resverNode = document.getElementById('resverIcon') - if (isShow) { if (this.role.includes('客户')) { this.$store.dispatch('user/getCustmoersMoney') } - resverNode.style.transform = 'rotate(180deg)' } else { resverNode.style.transform = 'rotate(0)' @@ -799,218 +551,24 @@ export default { initMybalance() { return sessionStorage.getItem('mybalance') }, - copyBtn() {//个人信息复制id + copyBtn() { const textToCopy = this.$refs.contentToCopy.innerText; navigator.clipboard.writeText(textToCopy).then(() => { this.$message.success('复制成功！') - }).catch((error) => { console.error('复制失败', error); }); - - }, - closeMesssageWindow() {//抽屉关闭的回调 - - this.getUnreadmsg() - if (this.isUpdate) { - - - } else { - - } - - }, - rowClass() { - return "font-size:14px;" }, handleAvatarSuccess(file, fileList) { this.imageUrl = URL.createObjectURL(file.raw); this.currentFile = file; }, - personalMessage() {//进入个人信息页面 + personalMessage() { this.$router.push('/customer/customerInformation') }, - getUnreadmsg() {//获取未读信息 - getUnreadmsgAPI().then(res => { - if (res.status) { - this.count = res.count - this.unreadMessageList = res.messages - } else { - this.$message({ - message: res.msg, - type: "error", - }); - } - }) - }, - getReadmsg() {//获取已读信息 - getReadmsgAPI().then(res => { - if (res.status) { - this.readInformationList = res.msg - } else { - this.$message({ - message: res.msg, - type: "error", - }); - } - }) - }, - rowStyle({ row, rowIndex }) {//改变表格某一行样式 - if (this.isOne == true && row.id == this.oneId) { - return 'unReadColor'; - } else if (row.msgstatus == 1) { - return 'unReadColor'; - } - return ''; - }, - - handleSelectionChange(selection) {//获取选择的数据的id - if (selection) { - this.readIdList = [] - selection.forEach(item => { - this.readIdList.push(item.id) - }) - } - }, - infrom() { // 通知 - this.isUpdate = false - this.drawer = true; - this.getMsg() - }, - getMsg() {//获取所有信息 - getMsgAPI({ userid: this.userId }).then(res => { - if (res.status && res.msg) { - this.alliInformationList = res.msg - } - }) - }, - readMassage() {//一键已读 - this.isUpdate = true - if (this.readIdList.length) { - this.upMsg(this.readIdList) - } else { - this.$message({ - message: "请选择数据", - type: "warning", - }); - } - }, - upMsg(data) {//更改消息状态 - let params = { - msgids: data - } - upMsgAPI(params).then(res => { - if (res.status) { - this.$message({ - message: "一键已读成功", - type: "success", - }); - if (this.tab_index == 1) { - this.getMsg() - } else if (this.tab_index == 2) { - this.getUnreadmsg() - } - } else { - this.$message({ - message: res.msg, - type: "error", - }); - } - }) - }, - delMsg(data) {//删除消息 - let params = { - id: data - } - delMsgAPI(params).then(res => { - if (res.status) { - this.$message({ - message: "删除成功", - type: "success", - }); - if (this.tab_index == 1) { - this.getMsg() - } else if (this.tab_index == 2) { - this.getUnreadmsg() - } else if (this.tab_index == 3) { - this.getReadmsg() - } - } else { - this.$message({ - message: res.msg, - type: "error", - }); - } - }) - }, - delMessage() {//一键删除 - if (this.readIdList.length) { - this.delMsg(this.readIdList) - } else { - this.$message({ - message: "请选择数据", - type: "warning", - }); - } - }, - expandChangeHandler(row) {//表格每一行展开时 - this.isOne = true - this.oneId = row.id - let params = { - msgids: [row.id] - } - upMsgAPI(params).then(res => { - if (res.status) { - this.rowStyle(row) - - } else { - this.$message({ - message: res.msg, - type: "error", - }); - } - }) - - }, - expandChangeHandler1(row) { - this.isUpdate = true - this.$refs.table.toggleRowExpansion(row); - this.expandChangeHandler(row) - }, - expandChangeHandler2(row) { - this.$refs.table.toggleRowExpansion(row); - }, - change(row, expanded) { - // console.log(row); - // console.log(expanded); - - }, - tab(i) {//通知切换 - this.tab_index = i; - if (i == 1) { - this.tabTitle = "全部消息"; - this.getMsg() - } else if (i == 2) { - this.tabTitle = "未读消息"; - this.getUnreadmsg() - - } else { - this.tabTitle = "已读消息"; - this.getReadmsg() - } - }, - autoShuaXin() { // 自动刷新 - setInterval(() => { - getTimeAPI().then((res) => { - // console.log(res); - }); - // 时间间隔 - }, 100000); - }, - async getUserInfo() { //获取个人信息 + async getUserInfo() { getUserInfoAPI({ id: this.userId }).then((res) => { if (res.status == true) { - // this.nick_name = res.data[0].username; this.userInfoList = res.data; sessionStorage.setItem("orgid", res.data[0].orgid); } else { @@ -1021,17 +579,16 @@ export default { } }); }, - goShopping() { //跳转购物车 - // this.$router.push("/shoppingManagement"); + goShopping() { this.$router.push("/product/shoppingCart"); }, toggleSideBar() { this.$store.dispatch("app/toggleSideBar"); }, - edituserPassword() {//修改密码 + edituserPassword() { this.passwordDialog = true; }, - onsubmit() { //修改密码 + onsubmit() { this.$refs.passwordForm.validate((valid) => { if (valid) { if ( @@ -1066,7 +623,7 @@ export default { } }); }, - async edituser() { //修改个人信息 + async edituser() { this.editUserInfoDialog = true; if (this.role == '运营') { this.getOpicture() @@ -1077,7 +634,6 @@ export default { this.editUserInfoForm.email = this.userInfoList[0].email; this.editUserInfoForm.address = this.userInfoList[0].address; this.editUserInfoForm.mobile = this.userInfoList[0].mobile; - // this.editUserInfoForm.nick_name = this.userInfoList[0].username; }, getPicture() { let params = { @@ -1087,7 +643,7 @@ export default { this.imageUrl = res.picture_url ? res.picture_url : null; }) }, - getOpicture() {//仅运营角色用 + getOpicture() { let params = { userid: this.userId } @@ -1095,8 +651,7 @@ export default { this.imageUrl = res.data ? res.data : null; }) }, - - editOnsubmit() { //修改个人信息 + editOnsubmit() { this.editUserInfoForm.contactor_phone = this.editUserInfoForm.mobile; editUserInfoAPI({ ...this.editUserInfoForm, id: this.userId, }).then( (res) => { @@ -1123,7 +678,6 @@ export default { if (this.role == '运营') { addOpictureAPI(formData).then(res => { if (res.status) { - } else { this.$message({ message: res.msg, @@ -1134,7 +688,6 @@ export default { } else { addPictureAPI(formData).then(res => { if (res.status) { - } else { this.$message({ message: res.msg, @@ -1143,7 +696,6 @@ export default { } }) } - }, handleClose1() { this.$refs.passwordForm.resetFields(); @@ -1160,32 +712,7 @@ export default { this.$refs.editUserInfoForm.resetFields(); this.editUserInfoDialog = false; }, - async logout() {//退出登录 - - // logout() { - // await this.$store.dispatch('auth/removeToken') - // logoutAPI().then((res) => { - // // console.log(res); - // }); - - //获取当前url - let url = window.location.href; - //判断url中是否包含domain_name字段 - // if (!url.includes('domain_name')) { - // //跳转到https://www.opencomputing.cn/ - // window.location.href = 'https://www.opencomputing.cn/'; - // - // } else { - // await this.$router.push(`/homePage?redirect=${this.$route.fullPath}`); - // } - - - // if (this.logoutUrl) { - // window.location.href = this.logoutUrl - // } else {mo - // window.location.href = 'https://www.opencomputing.cn/'; - // } - + async logout() { store.commit('tagsView/resetBreadcrumbState'); sessionStorage.removeItem("auths"); sessionStorage.removeItem("routes"); @@ -1193,8 +720,6 @@ export default { sessionStorage.removeItem("userId"); sessionStorage.removeItem("org_type") localStorage.removeItem('userId') - - localStorage.removeItem("auths"); localStorage.removeItem("routes"); localStorage.removeItem("user"); @@ -1202,22 +727,12 @@ export default { localStorage.removeItem("org_type") sessionStorage.removeItem('userId') this.$store.commit('setLoginState', false) - await this.$router.push(getHomePath()); - // window.location.reload() }, - - async logout1() {//退出登录 - - // logout() { - // await this.$store.dispatch('auth/removeToken') + async logout1() { logoutAPI().then((res) => { - // console.log(res); }); - - //获取当前url let url = window.location.href; - //判断url中是否包含domain_name字段 await this.$router.push(`/login`); store.commit('tagsView/resetBreadcrumbState'); sessionStorage.removeItem("auths"); @@ -1225,13 +740,12 @@ export default { sessionStorage.removeItem("user"); sessionStorage.removeItem("userId"); }, - //改变图表颜色 changeColor() { this.dialogFormVisible = false this.$store.commit('operationAnalysis/setGridObj', this.newGridObj) localStorage.setItem('gridObj', JSON.stringify(this.newGridObj)) }, - getFormData(object) {//转换参数为formdata格式 + getFormData(object) { const formData = new FormData(); Object.keys(object).forEach((key) => { const value = object[key]; @@ -1247,40 +761,25 @@ export default { }, }, watch: { - // gridObj(newValue, oldValue) { - // this.themeState = newValue - // console.log("gridObj原先是", oldValue) - // console.log("gridObj现在是", newValue) - // console.log("tgridObj", this.gridObj) - // }, gridObj: { handler(newValue, oldValue) { - // console.log("gridObj原先是", oldValue) - // console.log("gridObj现在是", newValue) - // console.log("tgridObj", this.gridObj) } } }, mounted() { this.role = sessionStorage.getItem("jueseNew") if (this.role.includes('客户')) { - // this.$store.commit('app/closeSiderBtn') } - - //判断是否在充值也展示 if (window.location.href.includes('kbossCharge')) { this.isShowKbossCharge = true } if (JSON.parse(localStorage.getItem('gridObj')) != {}) { - // this.newGridObj.bar.color = JSON.parse(localStorage.getItem('gridObj')).bar.color - // this.newGridObj.lineHuan.color = JSON.parse(localStorage.getItem('gridObj')).lineHuan.color - // this.newGridObj.lineTong.color = JSON.parse(localStorage.getItem('gridObj')).lineTong.color - // console.log("grid",this.gridObj) } this.isLocalhost = window.location.href.includes('localhost') || window.location.href.includes('xterm') }, }; + + + + diff --git a/f/web-kboss/src/views/homePage/mainPage/index.vue b/f/web-kboss/src/views/homePage/mainPage/index.vue index f040e91..e0009f4 100644 --- a/f/web-kboss/src/views/homePage/mainPage/index.vue +++ b/f/web-kboss/src/views/homePage/mainPage/index.vue @@ -811,6 +811,7 @@ export default Vue.extend({ height: 100%; overflow: auto !important; min-width: 1500px; + } .banner { From dad34ae571cef1d864c1769a1ed25a67b3c97889 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Fri, 17 Oct 2025 17:43:55 +0800 Subject: [PATCH 06/10] uptada --- .../configureOrganizationUserRole/index.vue | 2 +- .../departmentManagement/index.vue | 6 +- .../productMangement/commonBox/index.vue | 23 ++- .../homePage/components/topBox/index.vue | 34 +++- .../src/views/product/mainPage/index.vue | 161 ++++++++++++++---- 5 files changed, 174 insertions(+), 52 deletions(-) diff --git a/f/web-kboss/src/views/administrator/configureOrganizationUserRole/index.vue b/f/web-kboss/src/views/administrator/configureOrganizationUserRole/index.vue index 25e566e..3b64abe 100644 --- a/f/web-kboss/src/views/administrator/configureOrganizationUserRole/index.vue +++ b/f/web-kboss/src/views/administrator/configureOrganizationUserRole/index.vue @@ -554,7 +554,7 @@ export default { diff --git a/f/web-kboss/src/views/homePage/components/topBox/index.vue b/f/web-kboss/src/views/homePage/components/topBox/index.vue index 8d5dcc5..f1efb5c 100644 --- a/f/web-kboss/src/views/homePage/components/topBox/index.vue +++ b/f/web-kboss/src/views/homePage/components/topBox/index.vue @@ -45,9 +45,9 @@ {{ language === 'zh' ? 'English' : '中文' }}
- + - + @@ -217,6 +217,7 @@ export default Vue.extend({ }, data() { return { + messageCenterVisible: false, // 控制消息中心显示 homePath: getHomePath(), // 首页路径 isShowKbossCharge: false, // 是否显示Kboss充值按钮 role: sessionStorage.getItem("jueseNew") == "admin" ? [] : sessionStorage.getItem("jueseNew"), // 用户角色 @@ -250,6 +251,9 @@ export default Vue.extend({ login: '登录', register: '立即注册', noData: '暂无数据', + aiAssistant: 'AI助手', + customerService: '在线客服', + featureComingSoon: '功能即将上线，敬请期待！', // 一级菜单翻译 '云': '云', '算': '算', @@ -362,6 +366,9 @@ export default Vue.extend({ login: 'Login', register: 'Register Now', noData: 'No Data', + aiAssistant: 'AI Assistant', + customerService: 'Customer Service', + featureComingSoon: 'Feature coming soon, stay tuned!', // 一级菜单翻译 '云': 'Cloud', '算': 'Computing', @@ -535,10 +542,28 @@ export default Vue.extend({ }, }, methods: { + // 处理AI助手点击 + handleAIClick() { + this.$message.info({ + message: this.translations[this.language].featureComingSoon, + duration: 3000, + showClose: true + }); + + }, + + // 处理客服点击 + handleServiceClick() { + this.$message.info({ + message: this.translations[this.language].featureComingSoon, + duration: 3000, + showClose: true + }); + }, + // 处理消息图标点击 handleMessageClick() { if (this.loginState) { - // 已登录状态：打开消息中心 // 已登录状态：打开消息中心 this.messageCenterVisible = true; // 同时调用组件方法确保初始化 @@ -930,7 +955,7 @@ export default Vue.extend({ this.showPanelRightData = this.threeData }, - // 返回测试数据（未使用） + // 返回测试数据 networkData() { return networkData }, @@ -1154,6 +1179,7 @@ export default Vue.extend({ padding-right: 20px; font-size: 20px; color: #000; + cursor: pointer; &:hover { color: #1E6FFF; diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue index fdca5aa..1d4b4df 100644 --- a/f/web-kboss/src/views/product/mainPage/index.vue +++ b/f/web-kboss/src/views/product/mainPage/index.vue @@ -57,7 +57,7 @@
-
{{ userInfo.username.charAt(0) }}
+
{{ userInfo.username ? userInfo.username.charAt(0) : '' }}

{{ userInfo.username }}

@@ -72,7 +72,7 @@
账户余额
- ￥{{ initMybalance() }} + ￥{{ displayBalance }} 立即充值 @@ -94,7 +94,7 @@ @@ -442,7 +537,3 @@ export default Vue.extend({ } } - - - - From d653ca31074ecf239fcb0a7436e1a55d30112cc1 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Fri, 17 Oct 2025 17:50:32 +0800 Subject: [PATCH 07/10] uptada --- .../src/views/product/mainPage/index.vue | 134 +++++++++++++----- 1 file changed, 99 insertions(+), 35 deletions(-) diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue index 1d4b4df..751b894 100644 --- a/f/web-kboss/src/views/product/mainPage/index.vue +++ b/f/web-kboss/src/views/product/mainPage/index.vue @@ -79,12 +79,20 @@
-
-
系统公告
-
    -
  • - - 这是第{{ i }}条系统公告内容... + +
    +
    待办事项
    +
      +
    • +
      +
      + +
      +
      +
      {{ item.title }}
      +
      {{ item.count }}
      +
      +
    @@ -110,7 +118,13 @@ export default Vue.extend({ }, viewList: [], navList: [], - localBalance: '0.00' // 本地余额存储 + localBalance: '0.00', // 本地余额存储 + todoList: [ + { type: 'pending_payment', title: '待支付', count: 1, icon: 'el-icon-money' }, + { type: 'pending_renewal', title: '待续费', count: 2, icon: 'el-icon-refresh' }, + { type: 'processing', title: '处理中', count: 2, icon: 'el-icon-loading' }, + { type: 'message', title: '站内信', count: 2, icon: 'el-icon-message' } + ] } }, @@ -205,20 +219,9 @@ export default Vue.extend({ }, async fetchUserBalance() { - // 这里需要根据您的实际 API 来获取用户余额 - // 假设有一个获取用户余额的 API - // const balanceRes = await reqUserBalance(this.userInfo.id); - // if (balanceRes.status) { - // this.localBalance = balanceRes.data.balance; - // sessionStorage.setItem('mybalance', this.localBalance); - // // 如果需要，也可以更新到 Vuex - // this.$store.commit('user/SET_MYBALANCE', this.localBalance); - // } - // 临时方案：模拟获取余额 - // 在实际项目中，您需要调用真实的 API setTimeout(() => { - const mockBalance = '100.00'; // 模拟余额数据 + const mockBalance = '100.00'; this.localBalance = mockBalance; sessionStorage.setItem('mybalance', mockBalance); this.$store.commit('user/SET_MYBALANCE', mockBalance); @@ -236,6 +239,24 @@ export default Vue.extend({ url: item.url } }) + }, + + handleTodoClick(item) { + // 处理待办事项点击事件 + switch (item.type) { + case 'pending_payment': + // this.$router.push('/pending-payment'); + break; + case 'pending_renewal': + // this.$router.push('/pending-renewal'); + break; + case 'processing': + // this.$router.push('/processing'); + break; + case 'message': + // this.$router.push('/messages'); + break; + } } }, @@ -465,33 +486,72 @@ export default Vue.extend({ } } -.announcements { - .announcement-list { +/* 待办事项样式 */ +.todo { + .todo-list { list-style: none; padding: 0; margin: 0; + display: grid; + grid-template-columns: 1fr 1fr; + gap: 15px; li { - padding: 10px 0; - border-bottom: 1px solid #eee; + cursor: pointer; + transition: all 0.3s ease; + + &:hover { + transform: translateY(-2px); + .todo-item { + box-shadow: 0 4px 12px rgba(64, 158, 255, 0.2); + } + } + } + + .todo-item { + background: #f8f9fa; + border-radius: 8px; + padding: 15px; display: flex; align-items: center; + gap: 12px; + transition: all 0.3s ease; + border: 1px solid #ebeef5; - &:last-child { - border-bottom: none; - } - - i { - color: #e6a23c; - margin-right: 10px; + .todo-icon { + width: 40px; + height: 40px; + border-radius: 50%; + background: linear-gradient(135deg, #409eff, #64b5f6); + display: flex; + align-items: center; + justify-content: center; flex-shrink: 0; + + i { + font-size: 18px; + color: white; + } } - span { - color: #606266; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + .todo-content { + flex: 1; + min-width: 0; + + .todo-title { + font-size: 14px; + color: #606266; + margin-bottom: 4px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + .todo-count { + font-size: 20px; + font-weight: bold; + color: #303133; + } } } } @@ -535,5 +595,9 @@ export default Vue.extend({ .overView { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } + + .todo-list { + grid-template-columns: 1fr !important; + } } From d365c1ad6247cd965e67a992ceed629fb8d2bcef Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Mon, 20 Oct 2025 09:50:15 +0800 Subject: [PATCH 08/10] uptada --- .../MessageCenter/MessageCenter.vue | 37 ++- f/web-kboss/src/layout/components/Navbar.vue | 39 ++- f/web-kboss/src/store/modules/user.js | 2 + .../homePage/components/topBox/index.vue | 16 +- .../src/views/product/mainPage/index.vue | 263 ++++-------------- 5 files changed, 122 insertions(+), 235 deletions(-) diff --git a/f/web-kboss/src/components/MessageCenter/MessageCenter.vue b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue index 6a98a2f..939b31d 100644 --- a/f/web-kboss/src/components/MessageCenter/MessageCenter.vue +++ b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue @@ -271,7 +271,8 @@ export default { props: { userId: { type: [String, Number], - required: true + required: false, + default: null }, visible: { type: Boolean, @@ -375,6 +376,13 @@ export default { }, getUnreadmsg() { + // 检查用户是否登录 + const userId = sessionStorage.getItem('userId'); + if (!userId) { + console.log('用户未登录，跳过获取未读消息'); + return; + } + getUnreadmsgAPI().then(res => { if (res.status) { this.count = res.count; @@ -389,14 +397,24 @@ export default { } }).catch(error => { console.error('获取未读消息失败:', error); - this.$message({ - message: "获取未读消息失败", - type: "error", - }); + // 401错误不显示错误消息，因为用户未登录是正常情况 + if (error.response && error.response.status !== 401) { + this.$message({ + message: "获取未读消息失败", + type: "error", + }); + } }); }, getReadmsg() { + // 检查用户是否登录 + const userId = sessionStorage.getItem('userId'); + if (!userId) { + console.log('用户未登录，跳过获取已读消息'); + return; + } + getReadmsgAPI().then(res => { if (res.status) { this.readInformationList = res.msg; @@ -435,7 +453,14 @@ export default { }, getMsg() { - getMsgAPI({ userid: this.userId }).then(res => { + // 检查用户是否登录 + const userId = sessionStorage.getItem('userId'); + if (!userId) { + console.log('用户未登录，跳过获取消息'); + return; + } + + getMsgAPI({ userid: userId }).then(res => { if (res.status && res.msg) { this.alliInformationList = res.msg; } else { diff --git a/f/web-kboss/src/layout/components/Navbar.vue b/f/web-kboss/src/layout/components/Navbar.vue index 39297a0..1f27cb9 100644 --- a/f/web-kboss/src/layout/components/Navbar.vue +++ b/f/web-kboss/src/layout/components/Navbar.vue @@ -11,7 +11,7 @@ id="breadcrumb-container" class="breadcrumb-container" />
    + style="display:flex;justify-content: flex-end!important;align-items: center!important;margin-right: 10px;"> @@ -742,6 +740,8 @@ export default Vue.extend({ // 获取用户信息 async getUserInfo() { + if (!this.userId) return; + getUserInfoAPI({ id: this.userId }).then((res) => { if (res.status) { // this.nick_name = res.data[0].nick_name; diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue index 751b894..e860eec 100644 --- a/f/web-kboss/src/views/product/mainPage/index.vue +++ b/f/web-kboss/src/views/product/mainPage/index.vue @@ -57,7 +57,7 @@
    -
    {{ userInfo.username ? userInfo.username.charAt(0) : '' }}
    +
    {{ userInfo.username.charAt(0) }}

    {{ userInfo.username }}

    @@ -72,27 +72,19 @@
    账户余额
    - ￥{{ displayBalance }} + ￥{{ initMybalance() }} 立即充值
    - -
    -
    待办事项
    -
      -
    • -
      -
      - -
      -
      -
      {{ item.title }}
      -
      {{ item.count }}
      -
      -
      +
      +
      系统公告
      +
        +
      • + + 这是第{{ i }}条系统公告内容...
      @@ -102,7 +94,7 @@ @@ -486,72 +370,33 @@ export default Vue.extend({ } } -/* 待办事项样式 */ -.todo { - .todo-list { +.announcements { + .announcement-list { list-style: none; padding: 0; margin: 0; - display: grid; - grid-template-columns: 1fr 1fr; - gap: 15px; li { - cursor: pointer; - transition: all 0.3s ease; - - &:hover { - transform: translateY(-2px); - .todo-item { - box-shadow: 0 4px 12px rgba(64, 158, 255, 0.2); - } - } - } - - .todo-item { - background: #f8f9fa; - border-radius: 8px; - padding: 15px; + padding: 10px 0; + border-bottom: 1px solid #eee; display: flex; align-items: center; - gap: 12px; - transition: all 0.3s ease; - border: 1px solid #ebeef5; - .todo-icon { - width: 40px; - height: 40px; - border-radius: 50%; - background: linear-gradient(135deg, #409eff, #64b5f6); - display: flex; - align-items: center; - justify-content: center; - flex-shrink: 0; - - i { - font-size: 18px; - color: white; - } + &:last-child { + border-bottom: none; } - .todo-content { - flex: 1; - min-width: 0; + i { + color: #e6a23c; + margin-right: 10px; + flex-shrink: 0; + } - .todo-title { - font-size: 14px; - color: #606266; - margin-bottom: 4px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - .todo-count { - font-size: 20px; - font-weight: bold; - color: #303133; - } + span { + color: #606266; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } } } @@ -595,9 +440,5 @@ export default Vue.extend({ .overView { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } - - .todo-list { - grid-template-columns: 1fr !important; - } } From 3e3aeb6b732b512781da2a40327fb2833bf176c1 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Mon, 20 Oct 2025 11:04:41 +0800 Subject: [PATCH 09/10] uptada --- .../api/finance/customerRechargeManagement.js | 2 +- .../src/views/product/mainPage/index.vue | 145 ++++++++++++++---- 2 files changed, 118 insertions(+), 29 deletions(-) diff --git a/f/web-kboss/src/api/finance/customerRechargeManagement.js b/f/web-kboss/src/api/finance/customerRechargeManagement.js index a555990..11e9946 100644 --- a/f/web-kboss/src/api/finance/customerRechargeManagement.js +++ b/f/web-kboss/src/api/finance/customerRechargeManagement.js @@ -28,7 +28,7 @@ export function getReachargelogAPI(params) { //客户充值冲账 export function editReachargelogAPI(params) { return request({ - url: `examine/upledger_examine${suffix}`, + url: `customer/mybalance.dspy`, method: 'get', params: params }) diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue index e860eec..c17b6c5 100644 --- a/f/web-kboss/src/views/product/mainPage/index.vue +++ b/f/web-kboss/src/views/product/mainPage/index.vue @@ -72,23 +72,36 @@
      账户余额
      - ￥{{ initMybalance() }} + ￥{{ this.mybalance }} 立即充值
      -
      -
      系统公告
      -
        -
      • - - 这是第{{ i }}条系统公告内容... + +
        +
        待办事项
        +
          +
        • + {{ item.name }} + {{ item.count }}
      + + +
    @@ -96,9 +109,15 @@ import Vue from 'vue' import { mapState } from "vuex"; import { reqNewHomeResource, reqNewHomeResourceWarning, reqQuickNav } from "@/api/newHome"; +import { editReachargelogAPI } from "@/api/finance/customerRechargeManagement"; +import { getUnreadmsgAPI } from "@/api/login"; // 导入站内信API +import MessageCenter from '@/components/MessageCenter/MessageCenter.vue'; // 导入消息中心组件 export default Vue.extend({ name: "mainPage", + components: { + MessageCenter + }, data() { return { tableData: [], @@ -109,10 +128,21 @@ export default Vue.extend({ email: "" }, viewList: [], - navList: [] + navList: [], + mybalance: 0, // 余额 + todoList: [ + { name: '待支付', count: 1 }, + { name: '待续费', count: 2 }, + { name: '处理中', count: 2 }, + { name: '站内信', count: 0 } // 初始值为0，将从API获取 + ], + messageCenterVisible: false // 控制消息中心弹窗显示 } }, - + created() { + this.initMybalance(); + this.getUnreadMsgCount(); // 获取未读消息数量 + }, mounted() { reqQuickNav().then(res => { this.navList = res.data @@ -146,9 +176,53 @@ export default Vue.extend({ } }) }, - initMybalance() { - return sessionStorage.getItem('mybalance') || '0.00' + async initMybalance() { + const res = await editReachargelogAPI() + if (res.status) { + this.mybalance = res.data + } }, + // 获取未读消息数量 + async getUnreadMsgCount() { + try { + const res = await getUnreadmsgAPI(); + if (res.status) { + // 更新站内信的未读数量 + const messageItem = this.todoList.find(item => item.name === '站内信'); + if (messageItem) { + messageItem.count = res.data || 0; + } + } else { + this.$message.error(res.msg || '获取未读消息失败'); + } + } catch (error) { + console.error('获取未读消息失败:', error); + this.$message.error('获取未读消息失败'); + } + }, + // 处理待办事项点击 + handleTodoClick(todoName) { + // 根据不同的待办事项类型进行跳转 + if (todoName === '站内信') { + // 打开消息中心弹窗 + this.openMessageCenter(); + } else { + // 待支付、待续费、处理中都跳转到产品概览页面 + this.$router.push('/product/overview'); + } + }, + // 打开消息中心 + openMessageCenter() { + this.messageCenterVisible = true; + }, + // 处理未读消息数量更新 + handleUnreadCountUpdate(count) { + // 更新站内信的未读数量 + const messageItem = this.todoList.find(item => item.name === '站内信'); + if (messageItem) { + messageItem.count = count || 0; + } + } }, computed: { ...mapState({ @@ -370,33 +444,44 @@ export default Vue.extend({ } } -.announcements { - .announcement-list { +/* 待办事项样式 */ +.todos { + .todo-list { list-style: none; padding: 0; margin: 0; + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 15px; - li { - padding: 10px 0; - border-bottom: 1px solid #eee; + .todo-item { display: flex; + flex-direction: column; align-items: center; + justify-content: center; + padding: 15px; + border: 1px solid #ebeef5; + border-radius: 8px; + text-align: center; + transition: all 0.3s ease; + cursor: pointer; - &:last-child { - border-bottom: none; + &:hover { + transform: translateY(-3px); + box-shadow: 0 4px 12px rgba(64, 158, 255, 0.2); + border-color: #409eff; } - i { - color: #e6a23c; - margin-right: 10px; - flex-shrink: 0; - } - - span { + .todo-name { + font-size: 14px; color: #606266; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + margin-bottom: 8px; + } + + .todo-count { + font-size: 24px; + font-weight: bold; + color: #409eff; } } } @@ -440,5 +525,9 @@ export default Vue.extend({ .overView { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } + + .todo-list { + grid-template-columns: repeat(2, 1fr); + } } From 834c11882c77d4a309f639c4f36d5e0714945a79 Mon Sep 17 00:00:00 2001 From: hrx <18603305412@163.com> Date: Mon, 20 Oct 2025 15:31:41 +0800 Subject: [PATCH 10/10] uptada --- .../src/assets/css/iconfont/demo_index.html | 144 ++++++- .../src/assets/css/iconfont/iconfont.css | 30 +- .../src/assets/css/iconfont/iconfont.js | 2 +- .../src/assets/css/iconfont/iconfont.json | 42 ++ .../src/assets/css/iconfont/iconfont.ttf | Bin 2720 -> 4648 bytes .../src/assets/css/iconfont/iconfont.woff | Bin 1968 -> 3252 bytes .../src/assets/css/iconfont/iconfont.woff2 | Bin 1524 -> 2648 bytes f/web-kboss/src/router/index.js | 2 +- .../departmentManagement/index.vue | 2 +- .../views/customer/orderManagement/index.vue | 364 +++++++++++------- .../BdUserMangement/orderMangement/index.vue | 16 +- .../jiNanChaoSuanUserList/index.vue | 8 +- .../sales/distributorManagement/index.vue | 7 +- 13 files changed, 470 insertions(+), 147 deletions(-) diff --git a/f/web-kboss/src/assets/css/iconfont/demo_index.html b/f/web-kboss/src/assets/css/iconfont/demo_index.html index 43ced29..3c4d26b 100644 --- a/f/web-kboss/src/assets/css/iconfont/demo_index.html +++ b/f/web-kboss/src/assets/css/iconfont/demo_index.html @@ -54,6 +54,42 @@
      +
    • + +
      复制
      +
      &#xe61b;
      +
      • + +
    • + +
      大类-全部产品
      +
      &#xe64c;
      +
      • + +
    • + +
      资源管理器
      +
      &#xe641;
      +
      • + +
    • + +
      社区服务
      +
      &#xe616;
      +
      • + +
    • + +
      复制
      +
      &#xe648;
      +
      • + +
    • + +
      订单管理
      +
      &#xe602;
      +
      • +
    • 客服
      @@ -96,9 +132,9 @@ 
      @font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1760680783657') format('woff2'),
-       url('iconfont.woff?t=1760680783657') format('woff'),
-       url('iconfont.ttf?t=1760680783657') format('truetype');
+  src: url('iconfont.woff2?t=1760930186762') format('woff2'),
+       url('iconfont.woff?t=1760930186762') format('woff'),
+       url('iconfont.ttf?t=1760930186762') format('truetype');
 }

      第二步：定义使用 iconfont 的样式

      @@ -124,6 +160,60 @@
        +
      • + +
        + 复制 +
        +
        .icon-fuzhi +
        +
        • + +
      • + +
        + 大类-全部产品 +
        +
        .icon-dalei-quanbuchanpin +
        +
        • + +
      • + +
        + 资源管理器 +
        +
        .icon-ziyuanguanliqi +
        +
        • + +
      • + +
        + 社区服务 +
        +
        .icon-shequfuwu +
        +
        • + +
      • + +
        + 复制 +
        +
        .icon-fuzhi- +
        +
        • + +
      • + +
        + 订单管理 +
        +
        .icon-dingdanguanli +
        +
        • +
      • @@ -187,6 +277,54 @@
          +
        • + +
          复制
          +
          #icon-fuzhi
          +
          • + +
        • + +
          大类-全部产品
          +
          #icon-dalei-quanbuchanpin
          +
          • + +
        • + +
          资源管理器
          +
          #icon-ziyuanguanliqi
          +
          • + +
        • + +
          社区服务
          +
          #icon-shequfuwu
          +
          • + +
        • + +
          复制
          +
          #icon-fuzhi-
          +
          • + +
        • + +
          订单管理
          +
          #icon-dingdanguanli
          +
          • +
        @@ -49,12 +49,8 @@
        类型: - + {{ config.text }}
        @@ -66,10 +62,7 @@
        状态: - {{ status.text }} @@ -88,66 +81,65 @@ -
        -
        - - - - - + +
        +
        +
        + + + + - - + + -
        - - -
        -
        - - -
        - 当前筛选: - - {{ getOrderTypeConfig(businessOpFilter).text }} - - - {{ getOrderStatusText(orderStatusFilter) }} - -
        - -
        -
        - 累计支付总金额: -
        - - ¥ {{ all_price || '0.00' }} +
        + +
        -
        - 累计优惠总金额: -
        - - ¥ {{ all_discount || '0.00' }} + + +
        + 当前筛选: + + {{ getOrderTypeConfig(businessOpFilter).text }} + + + {{ getOrderStatusText(orderStatusFilter) }} + +
        + +
        +
        + 累计支付总金额: +
        + + ¥ {{ all_price || '0.00' }} +
        +
        +
        + 累计优惠总金额: +
        + + ¥ {{ all_discount || '0.00' }} +
        - +
        + +
        订单类型筛选： - + {{ config.text }}
        @@ -155,9 +147,7 @@
        订单状态筛选： - {{ status.text }} @@ -176,51 +166,70 @@ - - - - - - - - - - - - - - - - - - - - - - - - +
        + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
        @@ -330,6 +339,40 @@ export default { this.isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(this.userAgent); }, methods: { + // 格式化订单日期为 XXXX-XX-XX 格式 + formatOrderDate(dateString) { + if (!dateString) return '-'; + + try { + // 处理各种可能的日期格式 + const date = new Date(dateString); + if (isNaN(date.getTime())) { + // 如果 Date 解析失败，尝试直接处理字符串 + if (typeof dateString === 'string') { + // 移除可能的时间部分 + const datePart = dateString.split(' ')[0]; + const parts = datePart.split('-'); + if (parts.length === 3) { + const year = parts[0]; + const month = parts[1].padStart(2, '0'); + const day = parts[2].padStart(2, '0'); + return `${year}-${month}-${day}`; + } + } + return dateString; // 如果无法处理，返回原字符串 + } + + // 标准日期格式化 + const year = date.getFullYear().toString(); + const month = (date.getMonth() + 1).toString().padStart(2, '0'); + const day = date.getDate().toString().padStart(2, '0'); + return `${year}-${month}-${day}`; + } catch (error) { + console.error('日期格式化错误:', error, dateString); + return dateString; // 出错时返回原字符串 + } + }, + // 获取订单类型配置 getOrderTypeConfig(type) { return this.orderTypes[type] || { text: "-", type: "primary", buttonType: "" }; @@ -620,7 +663,47 @@ export default { // PC端优化样式 .pcCard { margin-bottom: 10px; + .btm{ + display: flex; + margin-top: 10px; + .type-filter{ + display: flex; + align-items: center; + span { + margin-right: 8px; + font-size: 14px; + color: #606266; + white-space: nowrap; + } + .el-button { + margin-right: 5px; + padding: 7px 12px; + } + } + .status-filter { + display: flex; + align-items: center; + margin-left: 20px; + + span { + margin-right: 8px; + font-size: 14px; + color: #606266; + white-space: nowrap; + } + + .el-button { + margin-right: 5px; + padding: 7px 12px; + } + } + + .reset { + display: flex; + align-items: center; + } + } .header-container { display: flex; align-items: center; @@ -672,6 +755,7 @@ export default { align-items: center; font-size: 14px; margin-left: 10px; + .stat-label { color: #606266; margin-right: 8px; @@ -689,35 +773,12 @@ export default { } } } - - .type-filter, .status-filter { - display: flex; - align-items: center; - margin-left: 20px; - - span { - margin-right: 8px; - font-size: 14px; - color: #606266; - white-space: nowrap; - } - - .el-button { - margin-right: 5px; - padding: 7px 12px; - } - } - - .reset { - display: flex; - align-items: center; - } } } .orderList { margin-top: 10px; - height: calc(100vh - 180px); + height: calc(100vh - 214px); .table { width: 100%; @@ -739,6 +800,43 @@ export default { padding: 0 8px !important; } +// 表格行高调整 +::v-deep .el-table { + .el-table__row { + width: 100%; + height: 56px; // 增加行高 + } + + .el-table__cell { + padding: 12px 0; // 增加单元格内边距 + } + + .cell-content { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + min-height: 28px; + } + + .el-button { + height: 32px; + // line-height: 32px; + } +} + +// 表头样式调整 +::v-deep .el-table .el-table__header-wrapper { + .el-table__cell { + padding: 16px 0; + background-color: #d0cff8; + .cell { + font-weight: 600; + font-size: 14px; + } + } +} + // 响应式调整 @media screen and (max-width: 1200px) { .pcCard .header-container { diff --git a/f/web-kboss/src/views/sales/BdUserMangement/orderMangement/index.vue b/f/web-kboss/src/views/sales/BdUserMangement/orderMangement/index.vue index 8967948..0a3bc3a 100644 --- a/f/web-kboss/src/views/sales/BdUserMangement/orderMangement/index.vue +++ b/f/web-kboss/src/views/sales/BdUserMangement/orderMangement/index.vue @@ -113,7 +113,9 @@
        -
        + + +
        @@ -462,7 +465,7 @@ export default { diff --git a/f/web-kboss/src/views/sales/customerManagement/jiNanChaoSuanUserList/index.vue b/f/web-kboss/src/views/sales/customerManagement/jiNanChaoSuanUserList/index.vue index 5df7900..9c0ca3d 100644 --- a/f/web-kboss/src/views/sales/customerManagement/jiNanChaoSuanUserList/index.vue +++ b/f/web-kboss/src/views/sales/customerManagement/jiNanChaoSuanUserList/index.vue @@ -5,7 +5,8 @@ align="center" header-align="center"
        新增超算账号
        - +
        + +
        @@ -306,4 +308,8 @@ export default { .table_height { width: 100%; } +.table-box{ + padding:10px 20px; + +} diff --git a/f/web-kboss/src/views/sales/distributorManagement/index.vue b/f/web-kboss/src/views/sales/distributorManagement/index.vue index 88f5d46..cc63ea4 100644 --- a/f/web-kboss/src/views/sales/distributorManagement/index.vue +++ b/f/web-kboss/src/views/sales/distributorManagement/index.vue @@ -9,7 +9,7 @@ :data="distributorList" style="width: 100%" :unique-opened="true" - height="calc(100vh - 130px)" + height="100%" v-loading="loading" highlight-current-row :row-key="getRowKeys" @@ -2576,7 +2576,10 @@ export default { } .distributor_box { - height: calc(100vh - 130px); + height: calc(100vh - 160px); + padding: 20px; + background-color: #fff; + margin-top: 16px; } /* 展开详情样式优化 */