From 5f5609326cb7d69c6cf89e42fd0e654fa416d8b6 Mon Sep 17 00:00:00 2001 From: yangyin <1850366751@qq.com> Date: 星期四, 31 十月 2024 14:02:43 +0800 Subject: [PATCH] 修改手机号码登录页面 --- src/layout/component/sidebar/components/MenuList.vue | 67 ++++++++++++++++++++------------- 1 files changed, 40 insertions(+), 27 deletions(-) diff --git a/src/layout/component/sidebar/components/MenuList.vue b/src/layout/component/sidebar/components/MenuList.vue index 6f10a5a..aa1689e 100644 --- a/src/layout/component/sidebar/components/MenuList.vue +++ b/src/layout/component/sidebar/components/MenuList.vue @@ -21,14 +21,14 @@ ><span class="user_name"> {{ userName }} </span></span ><span ref="toggleExitLoginBtnRef" ><span - class="ywicon text-white" - :class="{ 'icon-fold': !state.isShowExitLogin, 'icon-unfold': state.isShowExitLogin }" + class="ywifont text-white" + :class="{ 'ywicon-fold': !state.isShowExitLogin, 'ywicon-unfold': state.isShowExitLogin }" @click="toggleShowExitLogin" ></span ></span> </div> <div class="pop_up actived" v-show="state.isShowExitLogin"> - <div class="exit" @click="logoutClick"><i class="ywicon icon-tuichu"></i> 閫�鍑虹櫥褰�</div> + <div class="exit" @click="logoutClick"><i class="ywifont ywicon-tuichu"></i> 閫�鍑虹櫥褰�</div> </div> </div> <div v-else class="user_login"> @@ -40,8 +40,8 @@ <div class="pc-login items-center justify-center" style="display: flex" v-show="state.isShowLogin"> <div class="login_box"> <div class="sign_in"> - <i class="ywicon icon-guanbi closes" @click="handleClose"></i> - <h1><span>鐧诲綍 WI 姘村姟</span></h1> + <i class="ywifont ywicon-guanbi closes" @click="handleClose"></i> + <h1><span>鐧诲綍 WI 姘村姟鏅鸿兘</span></h1> <el-tabs v-model="state.activeLoginName" class="mt-[24px]" @tab-change="handleUserClick"> <el-tab-pane label="璐︽埛瀵嗙爜鐧诲綍" name="accountUser"> <el-form @@ -75,9 +75,7 @@ <el-form-item prop="verifyCode" label="楠岃瘉鐮�"> <el-input v-model="state.loginPhoneForm.verifyCode" placeholder="璇疯緭鍏ュ洓浣嶉獙璇佺爜" maxlength="6" clearable> <template #append> - <el-button type="primary" @click="handleSendVerifyCode" :disabled="countdown > 0">{{ - countdown > 0 ? `${countdown}绉掑悗閲嶈瘯` : '鑾峰彇楠岃瘉鐮�' - }}</el-button> + <el-button type="primary" @click="handleSendVerifyCode" :disabled="hasSended">{{ sendCodeMsg }}</el-button> </template> </el-input> </el-form-item> @@ -106,7 +104,7 @@ const formPhoneRef = ref(); //鎵嬫満鍙风櫥褰� const isLoginStatus = ref(!!Local.get(accessSessionKey)); const userName = ref(''); -const countdown = ref(0); +const countdown = ref(null); const firstUserCharacter = computed(() => userName.value?.[0]?.toUpperCase()); watchEffect(() => { if (!isLoginStatus.value) return; @@ -114,23 +112,23 @@ }); let state = reactive({ asideTitleList: [ - { - id: 1, - icon: '/static/images/wave/AsideIcon.png', - title: '搴旂敤鍦烘櫙', - routerName: 'AllScenario', - }, - { - id: 2, - icon: '/static/images/wave/AsideIcon.png', - title: '甯姪涓績', - // routerName:'Scenario', - }, - { - id: 3, - icon: '/static/images/wave/AsideIcon.png', - title: '涓汉璁剧疆', - }, + // { + // id: 1, + // icon: '/static/images/wave/AsideIcon.png', + // title: '搴旂敤鍦烘櫙', + // routerName: 'AllScenario', + // }, + // { + // id: 2, + // icon: '/static/images/wave/AsideIcon.png', + // title: '甯姪涓績', + // // routerName:'Scenario', + // }, + // { + // id: 3, + // icon: '/static/images/wave/AsideIcon.png', + // title: '涓汉璁剧疆', + // }, { id: 4, icon: '/static/images/wave/AsideIcon.png', @@ -162,8 +160,11 @@ verifyCode: [{ required: true, message: '璇疯緭鍏ラ獙璇佺爜', trigger: 'blur' }], }; const handleClick = (item) => { + if (!item.routerName) return; gotoRoute({ name: item.routerName }); }; +const LOGIN_CLIENT = 'Web绔�'; + //鐧诲綍 const openLoginDlg = async () => { state.isShowLogin = true; @@ -171,6 +172,12 @@ const handleClose = () => { state.isShowLogin = false; }; +const hasSended = computed(() => { + return countdown.value !== null; +}); +const sendCodeMsg = computed(() => { + return !hasSended.value ? '鑾峰彇楠岃瘉鐮�' : `${countdown.value} 绉掑悗閲嶈瘯`; +}); //鐧诲綍 const onSubmit = async () => { if (state.activeLoginName === 'accountUser') { @@ -180,7 +187,11 @@ const res = await PostLogin({ user: state.loginForm.account, pass: state.loginForm.pwd, + client: LOGIN_CLIENT, }); + if (!res.json_ok) { + return ElMessage.error(res.json_msg); + } LoginInfo.set(res.hswatersession, state.loginForm.account); } else if (state.activeLoginName === 'phoneUser') { @@ -190,12 +201,14 @@ const res = await loginMessageUser({ phone: state.loginPhoneForm.phoneUser, code: state.loginPhoneForm.verifyCode, + client: LOGIN_CLIENT, }); if (!res.json_ok) { - return ElMessage.warning(res.json_msg); + return ElMessage.error(res.json_msg); } LoginInfo.set(res.hswatersession, state.loginPhoneForm.phoneUser); } + state.isShowLogin = false; isLoginStatus.value = true; window.location.reload(); -- Gitblit v1.9.3