From 684ad6f152e84482bda0958d2907da9b509898e2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E6=AD=A3=E6=98=93?= Date: Thu, 21 Aug 2025 17:49:37 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E7=94=A8=E6=88=B7?= =?UTF-8?q?=E7=95=8C=E9=9D=A2=E5=92=8C=E5=8A=9F=E8=83=BD=E5=AE=9E=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增自定义用户信息卡片样式 - 优化登录页面输入框和按钮样式 - 重构首页布局和图标展示 - 添加多种操作图标资源 - 改进用户退出登录逻辑 - 优化页面跳转和错误处理 --- App.vue | 5 +- pages/index/index.scss | 134 ++++++-- pages/index/index.vue | 322 +++++++++--------- pages/login/login.scss | 15 + pages/login/login.vue | 16 +- pages/user/user.css | 47 +++ pages/user/user.vue | 35 +- permission.js | 39 +-- static/images/index-icons/入库/备件入库.svg | 1 + static/images/index-icons/入库/成品入库.svg | 1 + static/images/index-icons/入库/无校验入库.svg | 1 + static/images/index-icons/入库/毛坯入库.svg | 1 + static/images/index-icons/入库/油漆入库.svg | 1 + static/images/index-icons/出库/出库扫描.svg | 1 + static/images/index-icons/出库/出货.svg | 1 + static/images/index-icons/出库/成品出库.svg | 1 + .../images/index-icons/出库/无出库单出库.svg | 1 + .../index-icons/出库/调拨出库录单.svg.svg | 1 + .../index-icons/出库/调拨出库装箱.svg.svg | 1 + .../index-icons/出库/调拨申请出库.svg.svg | 1 + static/images/index-icons/出库/退货.svg | 1 + static/images/index-icons/库内管理/拆箱.svg | 1 + static/images/index-icons/库内管理/拼箱.svg | 1 + static/images/index-icons/库内管理/移库.svg | 1 + .../images/index-icons/库存管理/库存查询.svg | 1 + .../images/index-icons/库存管理/扫描管理.svg | 1 + .../images/index-icons/库存管理/操作记录.svg | 1 + static/images/index-icons/库存管理/盘点.svg | 1 + static/images/user-icons/level.svg | 4 + static/images/user-icons/server-man.svg | 4 + static/images/user-icons/setting-fill.svg | 4 + store/modules/user.js | 4 + utils/request.js | 3 +- 33 files changed, 436 insertions(+), 216 deletions(-) create mode 100644 static/images/index-icons/入库/备件入库.svg create mode 100644 static/images/index-icons/入库/成品入库.svg create mode 100644 static/images/index-icons/入库/无校验入库.svg create mode 100644 static/images/index-icons/入库/毛坯入库.svg create mode 100644 static/images/index-icons/入库/油漆入库.svg create mode 100644 static/images/index-icons/出库/出库扫描.svg create mode 100644 static/images/index-icons/出库/出货.svg create mode 100644 static/images/index-icons/出库/成品出库.svg create mode 100644 static/images/index-icons/出库/无出库单出库.svg create mode 100644 static/images/index-icons/出库/调拨出库录单.svg.svg create mode 100644 static/images/index-icons/出库/调拨出库装箱.svg.svg create mode 100644 static/images/index-icons/出库/调拨申请出库.svg.svg create mode 100644 static/images/index-icons/出库/退货.svg create mode 100644 static/images/index-icons/库内管理/拆箱.svg create mode 100644 static/images/index-icons/库内管理/拼箱.svg create mode 100644 static/images/index-icons/库内管理/移库.svg create mode 100644 static/images/index-icons/库存管理/库存查询.svg create mode 100644 static/images/index-icons/库存管理/扫描管理.svg create mode 100644 static/images/index-icons/库存管理/操作记录.svg create mode 100644 static/images/index-icons/库存管理/盘点.svg create mode 100644 static/images/user-icons/level.svg create mode 100644 static/images/user-icons/server-man.svg create mode 100644 static/images/user-icons/setting-fill.svg diff --git a/App.vue b/App.vue index 62bc7c4..3541eb8 100644 --- a/App.vue +++ b/App.vue @@ -11,7 +11,7 @@ }, data() { return { - width: '--width:300px;', + width: '--width:360px;', height: '--height:712px;' }; }, @@ -35,7 +35,8 @@ // this.'--height' = (_windowsHeight - 50) + 'px;'; }, checkLogin() { - if (!getToken()) { + const token = getToken(); + if (!token) { this.$tab.reLaunch('/pages/login'); } } diff --git a/pages/index/index.scss b/pages/index/index.scss index 62959bc..5cf27bc 100644 --- a/pages/index/index.scss +++ b/pages/index/index.scss @@ -1,34 +1,114 @@ -.gap{ - border-radius: ; -} + +/* 首页样式文件 */ + +/* 主容器 */ .home-container { - width: 360px; - height: 594px; - background-color: white; + width: 100%; + min-height: 100vh; + background: linear-gradient(135deg, #f0f2f5 0%, #e1e5ee 100%); + padding: 20rpx; + box-sizing: border-box; } -.home-banner-box { - width: 360px; - height: 180px; + +/* 板块容器 */ +.section-container { + width: 100%; } -.home-button-box{ - padding: 20px; - width: 360px; - height: 310px; + +/* 板块卡片 */ +.section-card { + background-color: #ffffff; + border-radius: 20rpx; + padding: 10rpx; + box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.08); + margin-bottom: 10rpx; } -.home-button-action:active{ - border: 1px solid #b6b6b6; - opacity: .70; + +/* 板块标题 */ +.section-title { + font-size: 36rpx; + font-weight: 600; + margin: 0 0 20rpx 10rpx; + color: #2c3e50; + letter-spacing: 1rpx; + text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.1); } -.box-1{ - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - + +/* 网格容器 */ +.grid-container { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + width: 100%; } -.box-2{ - display: flex; - flex-direction: row; - align-items: center; - justify-content: center; + +/* 网格项 */ +.grid-item { + width: 24%; /* 一行4个，每个占24%宽度，留有间隙 */ + background-color: #ffffff; + border-radius: 20rpx; + margin-bottom: 20rpx; + box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.08); + transition: all 0.3s ease; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 20rpx 0; + box-sizing: border-box; +} + +/* 网格项悬停效果 */ +.grid-item:hover { + transform: translateY(-4rpx); + box-shadow: 0 10rpx 24rpx rgba(0, 0, 0, 0.12); +} + +/* 网格项点击效果 */ +.grid-item:active { + transform: scale(0.96); + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); +} + +/* 占位网格项 */ +.grid-item.placeholder { + visibility: hidden; +} + +/* 图标 */ +.grid-icon { + width: 80rpx; + height: 80rpx; + margin-bottom: 15rpx; +} + +/* 文字 */ +.grid-text { + font-size: 28rpx; + color: #4a5568; + letter-spacing: 0.5rpx; + line-height: 1.4; + font-weight: 500; + text-align: center; +} + +/* 板块间隔 */ +.section-gap { + height: 40rpx; +} + +/* 响应式调整 */ +@media screen and (max-width: 360px) { + .grid-item { + width: 23%; + } + + .grid-icon { + width: 70rpx; + height: 70rpx; + } + + .grid-text { + font-size: 24rpx; + } } \ No newline at end of file diff --git a/pages/index/index.vue b/pages/index/index.vue index 2e54f83..53fff61 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -1,166 +1,183 @@ \ No newline at end of file diff --git a/pages/login/login.scss b/pages/login/login.scss index fdca680..395b468 100644 --- a/pages/login/login.scss +++ b/pages/login/login.scss @@ -7,3 +7,18 @@ padding-left: 40px; padding-right: 40px; } + +/* 调整按钮和文字大小 */ +.u-button { + font-size: 16px !important; +} + +.custom-input__content__field-wrapper__field { + font-size: 16px !important; +} + +.bangben { + margin-top: 110px; + margin-left: 35%; + font-size: 1rem; + } diff --git a/pages/login/login.vue b/pages/login/login.vue index 19028a1..25897fb 100644 --- a/pages/login/login.vue +++ b/pages/login/login.vue @@ -10,24 +10,24 @@ + prefixIconStyle="color: #909399" iconSize="32" fontSize="16px"> + prefixIconStyle="color: #909399" iconSize="32" fontSize="16px"> + prefixIconStyle="color: #909399" iconSize="32" fontSize="16px"> + shape="circle" size="large"> @@ -158,12 +158,12 @@ const loginInfoStr = JSON.stringify(loginInfo); setLoginInfo(loginInfoStr); } catch (e) { - // console.log(e); + // 保存登录信息异常处理 } this.$modal.closeLoading(); this.loginSuccess(); }) - .catch(() => { + .catch((error) => { this.$modal.closeLoading(); if (this.captchaEnabled) { this.getCode(); @@ -175,6 +175,8 @@ // 获取户信息 this.$store.dispatch('GetInfo').then((res) => { this.$tab.reLaunch('/pages/index/index'); + }).catch((error) => { + // 获取用户信息失败处理 }); }, // 确认修改链接地址 diff --git a/pages/user/user.css b/pages/user/user.css index 14c4e18..bdb2f7d 100644 --- a/pages/user/user.css +++ b/pages/user/user.css @@ -825,4 +825,51 @@ text { .card-box{ height: 40px !important; +} + +/* Custom cell styles */ +.custom-cell-group { + background-color: #ffffff; + border-radius: 8px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + margin: 10px; + overflow: hidden; +} + +.custom-cell { + display: flex; + align-items: center; + padding: 15px 20px; + border-bottom: 1px solid #f0f0f0; +} + +.custom-cell:last-child { + border-bottom: none; +} + +.custom-cell-icon { + width: 24px; + height: 24px; + margin-right: 10px; +} + +.custom-cell-title { + flex: 1; + font-size: 16px; + color: #333; +} + +.custom-cell-value { + font-size: 14px; + color: #999; +} + +.custom-cell-arrow { + font-size: 18px; + color: #ccc; + margin-left: 10px; +} + +.custom-cell:active { + background-color: #f5f5f5; } \ No newline at end of file diff --git a/pages/user/user.vue b/pages/user/user.vue index c233e8c..144bedc 100644 --- a/pages/user/user.vue +++ b/pages/user/user.vue @@ -20,11 +20,23 @@ --> - - - - - + + + + 问题反馈 + > + + + + 个人设置 + > + + + + 版本号 + {{version}} + + @@ -99,9 +111,20 @@ url }); }, +// 处理问题反馈点击事件 + handleFeedbackClick() { + // 处理问题反馈点击事件 + }, + handleSettingsClick() { + // 处理个人设置点击事件 + }, // 退出登录 outLogin() { - this.LogOut(); + this.LogOut().then(() => { + // 退出登录成功处理 + }).catch((error) => { + // 退出登录失败处理 + }); this.outLoginShow = false; setTimeout(() => { uni.reLaunch({ diff --git a/permission.js b/permission.js index 55d544c..9920fe7 100644 --- a/permission.js +++ b/permission.js @@ -21,25 +21,26 @@ let list = ["navigateTo", "redirectTo", "reLaunch", "switchTab"] list.forEach(item => { uni.addInterceptor(item, { invoke(to) { - if (getToken()) { - // if (to.url === loginPage) { - // uni.reLaunch({ - // url: loginPage - // }) - // } - return true - } else { - if (checkWhite(to.url)) { - return true - } - uni.reLaunch({ - url: loginPage - }) - return false - } - }, + const token = getToken(); + if (token) { + // if (to.url === loginPage) { + // uni.reLaunch({ + // url: loginPage + // }) + // } + return true + } else { + if (checkWhite(to.url)) { + return true + } + uni.reLaunch({ + url: loginPage + }) + return false + } + }, fail(err) { - console.log(err) - } + // 页面跳转拦截器执行失败处理 + } }) }) \ No newline at end of file diff --git a/static/images/index-icons/入库/备件入库.svg b/static/images/index-icons/入库/备件入库.svg new file mode 100644 index 0000000..9d4a3de --- /dev/null +++ b/static/images/index-icons/入库/备件入库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/入库/成品入库.svg b/static/images/index-icons/入库/成品入库.svg new file mode 100644 index 0000000..fbee774 --- /dev/null +++ b/static/images/index-icons/入库/成品入库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/入库/无校验入库.svg b/static/images/index-icons/入库/无校验入库.svg new file mode 100644 index 0000000..ef52cd4 --- /dev/null +++ b/static/images/index-icons/入库/无校验入库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/入库/毛坯入库.svg b/static/images/index-icons/入库/毛坯入库.svg new file mode 100644 index 0000000..aa9257f --- /dev/null +++ b/static/images/index-icons/入库/毛坯入库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/入库/油漆入库.svg b/static/images/index-icons/入库/油漆入库.svg new file mode 100644 index 0000000..91cff99 --- /dev/null +++ b/static/images/index-icons/入库/油漆入库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/出库扫描.svg b/static/images/index-icons/出库/出库扫描.svg new file mode 100644 index 0000000..326f78e --- /dev/null +++ b/static/images/index-icons/出库/出库扫描.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/出货.svg b/static/images/index-icons/出库/出货.svg new file mode 100644 index 0000000..00d2b05 --- /dev/null +++ b/static/images/index-icons/出库/出货.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/成品出库.svg b/static/images/index-icons/出库/成品出库.svg new file mode 100644 index 0000000..a975bf4 --- /dev/null +++ b/static/images/index-icons/出库/成品出库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/无出库单出库.svg b/static/images/index-icons/出库/无出库单出库.svg new file mode 100644 index 0000000..a5320bd --- /dev/null +++ b/static/images/index-icons/出库/无出库单出库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/调拨出库录单.svg.svg b/static/images/index-icons/出库/调拨出库录单.svg.svg new file mode 100644 index 0000000..e457aec --- /dev/null +++ b/static/images/index-icons/出库/调拨出库录单.svg.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/调拨出库装箱.svg.svg b/static/images/index-icons/出库/调拨出库装箱.svg.svg new file mode 100644 index 0000000..a7b0b2f --- /dev/null +++ b/static/images/index-icons/出库/调拨出库装箱.svg.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/调拨申请出库.svg.svg b/static/images/index-icons/出库/调拨申请出库.svg.svg new file mode 100644 index 0000000..a97dea2 --- /dev/null +++ b/static/images/index-icons/出库/调拨申请出库.svg.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/出库/退货.svg b/static/images/index-icons/出库/退货.svg new file mode 100644 index 0000000..6d848be --- /dev/null +++ b/static/images/index-icons/出库/退货.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库内管理/拆箱.svg b/static/images/index-icons/库内管理/拆箱.svg new file mode 100644 index 0000000..224cc75 --- /dev/null +++ b/static/images/index-icons/库内管理/拆箱.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库内管理/拼箱.svg b/static/images/index-icons/库内管理/拼箱.svg new file mode 100644 index 0000000..fc24a1f --- /dev/null +++ b/static/images/index-icons/库内管理/拼箱.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库内管理/移库.svg b/static/images/index-icons/库内管理/移库.svg new file mode 100644 index 0000000..f3f4c48 --- /dev/null +++ b/static/images/index-icons/库内管理/移库.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库存管理/库存查询.svg b/static/images/index-icons/库存管理/库存查询.svg new file mode 100644 index 0000000..d06f95b --- /dev/null +++ b/static/images/index-icons/库存管理/库存查询.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库存管理/扫描管理.svg b/static/images/index-icons/库存管理/扫描管理.svg new file mode 100644 index 0000000..3fac13e --- /dev/null +++ b/static/images/index-icons/库存管理/扫描管理.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库存管理/操作记录.svg b/static/images/index-icons/库存管理/操作记录.svg new file mode 100644 index 0000000..c6848aa --- /dev/null +++ b/static/images/index-icons/库存管理/操作记录.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/index-icons/库存管理/盘点.svg b/static/images/index-icons/库存管理/盘点.svg new file mode 100644 index 0000000..094bdd2 --- /dev/null +++ b/static/images/index-icons/库存管理/盘点.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/images/user-icons/level.svg b/static/images/user-icons/level.svg new file mode 100644 index 0000000..b465947 --- /dev/null +++ b/static/images/user-icons/level.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/static/images/user-icons/server-man.svg b/static/images/user-icons/server-man.svg new file mode 100644 index 0000000..889eec7 --- /dev/null +++ b/static/images/user-icons/server-man.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/static/images/user-icons/setting-fill.svg b/static/images/user-icons/setting-fill.svg new file mode 100644 index 0000000..831d5fe --- /dev/null +++ b/static/images/user-icons/setting-fill.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/store/modules/user.js b/store/modules/user.js index 884d920..af67584 100644 --- a/store/modules/user.js +++ b/store/modules/user.js @@ -118,6 +118,10 @@ const user = { commit('SET_TOKEN', '') commit('SET_ROLES', []) commit('SET_PERMISSIONS', []) + commit('SET_NAME', '') + commit('SET_AVATAR', '') + commit('SET_NICKNAME', '') + commit('SET_DEPTNAME', '') removeToken() storage.clean() resolve() diff --git a/utils/request.js b/utils/request.js index c4298be..dd67b2a 100644 --- a/utils/request.js +++ b/utils/request.js @@ -31,7 +31,7 @@ const request = config => { config.header['Access-Control-Allow-Headers']= 'X-Requested-With'; // 允许的HTTP头 if (getToken() && !isToken) { config.header['Authorization'] = 'Bearer ' + getToken() - config.header['userName'] = store.getters.nickName ?? "未知用户" + config.header['userName'] = encodeURIComponent(store.getters.nickName ?? "未知用户") } // get请求映射params参数 if (config.params) { @@ -83,7 +83,6 @@ const request = config => { resolve(res.data) }) .catch(error => { - let { message } = error