From f31f2726228f60ae2604d4ea529f54cc3962d433 Mon Sep 17 00:00:00 2001
From: yangyin <18723093654@163.com>
Date: 星期二, 03 十二月 2024 14:17:02 +0800
Subject: [PATCH] 提交代码
---
src/layout/component/sidebar/components/MenuList.vue | 162 ++++++-----------------------------------------------
1 files changed, 20 insertions(+), 142 deletions(-)
diff --git a/src/layout/component/sidebar/components/MenuList.vue b/src/layout/component/sidebar/components/MenuList.vue
index 8814060..d1cb958 100644
--- a/src/layout/component/sidebar/components/MenuList.vue
+++ b/src/layout/component/sidebar/components/MenuList.vue
@@ -9,7 +9,7 @@
:class="{ 'set-li-active': item.routerName === currentRoute.name }"
>
<img :src="item.icon" alt="" class="pl-2.5 pr-2.5 w-4 h-4" style="box-sizing: content-box" />
- <span class="font-medium text-sm text-white tracking-wide">{{ item.title }}</span>
+ <span class="font-medium text-white tracking-wide">{{ item.title }}</span>
</div>
</div>
<div class="user_text" v-if="isLoginStatus">
@@ -28,86 +28,31 @@
></span>
</div>
<div class="pop_up actived" v-show="state.isShowExitLogin">
+ <div class="exit" @click="informationClick"><i class="ywifont ywicon-wode"></i> 鎴戠殑淇℃伅</div>
<div class="exit" @click="logoutClick"><i class="ywifont ywicon-tuichu"></i> 閫�鍑虹櫥褰�</div>
</div>
</div>
<div v-else class="user_login">
<div class="set-login" @click="openLoginDlg">
- <span class="text-stone-100 font-medium text-sm text-center">鐧诲綍 / 娉ㄥ唽</span>
+ <span class="text-stone-100 font-medium text-center">鐧诲綍 / 娉ㄥ唽</span>
</div>
</div>
- </div>
- <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="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
- ref="loginFormRef"
- :model="state.loginForm"
- :rules="loginRules"
- class="demo-ruleForm mt-[24px] min-h-[140px]"
- size="large"
- >
- <el-form-item label="璐﹀彿" prop="account">
- <el-input v-model="state.loginForm.account" clearable />
- </el-form-item>
- <el-form-item label="瀵嗙爜" prop="pwd">
- <el-input v-model="state.loginForm.pwd" type="password" autocomplete="off" clearable />
- </el-form-item>
- </el-form>
- </el-tab-pane>
- <el-tab-pane label="鎵嬫満鍙风櫥褰�" name="phoneUser">
- <el-form
- ref="formPhoneRef"
- :rules="loginPhoneRules"
- :model="state.loginPhoneForm"
- size="large"
- class="mt-[24px] min-h-[140px]"
- >
- <el-form-item label="鎵嬫満鍙�" prop="phoneUser">
- <el-input v-model="state.loginPhoneForm.phoneUser" placeholder="璇疯緭鍏ユ墜鏈哄彿鐮�" clearable>
- <template #prepend>+86</template>
- </el-input>
- </el-form-item>
- <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>
- </template>
- </el-input>
- </el-form-item>
- </el-form>
- </el-tab-pane>
- </el-tabs>
-
- <div class="mt-[24px]">
- <el-button type="primary" @click="onSubmit" class="set-login_btn">鐧诲綍</el-button>
- </div>
- </div>
- </div>
+ <UserInformation v-model="userInformationVisible" />
</div>
</template>
<script setup lang="ts">
-import { ElMessage, type FormInstance } from 'element-plus';
import { computed, onMounted, reactive, ref, watchEffect } from 'vue';
-import { PostLogin, loginMessageUser, loginVerifyMessage } from '/@/api/ai/user';
+import UserInformation from './UserInformation.vue';
import router from '/@/router';
+import { isLoginStatus, isSharePage, isShowLogin } from '/@/stores/chatRoom';
import emitter from '/@/utils/mitt';
import { accessSessionKey, userNameKey } from '/@/utils/request';
import { gotoRoute } from '/@/utils/route';
import { Local, LoginInfo } from '/@/utils/storage';
-const loginFormRef = ref<FormInstance>(null); //璐︽埛瀵嗙爜鐧诲綍
-const formPhoneRef = ref(); //鎵嬫満鍙风櫥褰�
-const isLoginStatus = ref(!!Local.get(accessSessionKey));
const userName = ref('');
-const countdown = ref(0);
const firstUserCharacter = computed(() => userName.value?.[0]?.toUpperCase());
+isLoginStatus.value = !!Local.get(accessSessionKey);
watchEffect(() => {
if (!isLoginStatus.value) return;
userName.value = Local.get(userNameKey);
@@ -138,7 +83,6 @@
routerName: 'AboutUs',
},
],
- isShowLogin: false,
isShowExitLogin: false,
loginForm: {
account: '',
@@ -150,60 +94,16 @@
},
activeLoginName: 'accountUser',
});
-const loginRules = reactive({
- account: [{ required: true, message: '璇疯緭鍏ヨ处鍙�', trigger: 'blur' }],
- pwd: [{ required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' }],
-});
-const loginPhoneRules = {
- phoneUser: [
- { required: true, message: '璇疯緭鍏ユ墜鏈哄彿鐮�', trigger: 'blur' },
- { pattern: /^1\d{10}$/, message: '璇疯緭鍏ユ纭殑鎵嬫満鍙风爜', trigger: 'blur' },
- ],
- verifyCode: [{ required: true, message: '璇疯緭鍏ラ獙璇佺爜', trigger: 'blur' }],
-};
const handleClick = (item) => {
- if(!item.routerName) return;
+ if (!item.routerName) return;
gotoRoute({ name: item.routerName });
};
+
//鐧诲綍
const openLoginDlg = async () => {
- state.isShowLogin = true;
-};
-const handleClose = () => {
- state.isShowLogin = false;
-};
-//鐧诲綍
-const onSubmit = async () => {
- if (state.activeLoginName === 'accountUser') {
- //璐︽埛瀵嗙爜鐧诲綍
- const isValid = await loginFormRef.value.validate().catch(() => {});
- if (!isValid) return;
- const res = await PostLogin({
- user: state.loginForm.account,
- pass: state.loginForm.pwd,
- });
- if (!res.json_ok) {
- return ElMessage.error(res.json_msg);
- }
-
- LoginInfo.set(res.hswatersession, state.loginForm.account);
- } else if (state.activeLoginName === 'phoneUser') {
- //鎵嬫満鐧诲綍
- const isValid = await formPhoneRef.value.validate().catch(() => {});
- if (!isValid) return;
- const res = await loginMessageUser({
- phone: state.loginPhoneForm.phoneUser,
- code: state.loginPhoneForm.verifyCode,
- });
- if (!res.json_ok) {
- return ElMessage.error(res.json_msg);
- }
- LoginInfo.set(res.hswatersession, state.loginPhoneForm.phoneUser);
- }
-
- state.isShowLogin = false;
- isLoginStatus.value = true;
- window.location.reload();
+ // 鍒嗕韩椤典笉闇�瑕�
+ if (isSharePage.value) return;
+ isShowLogin.value = true;
};
const currentRoute = router.currentRoute;
@@ -225,43 +125,21 @@
state.isShowExitLogin = false;
}
};
-//鍒囨崲鐢ㄦ埛鐧诲綍椤甸潰
-const handleUserClick = (item) => {
- state.activeLoginName = item;
- // formPhoneRef?.value?.resetFields();
- // loginFormRef.value.resetFields();
+//#region ====================== 鎴戠殑淇℃伅 ======================
+const userInformationVisible = ref(false);
+const informationClick = () => {
+ userInformationVisible.value = true;
};
-//鑾峰彇楠岃瘉鐮�
-const handleSendVerifyCode = async () => {
- formPhoneRef.value.validateField('phoneUser', async (valid: boolean) => {
- if (valid) {
- const res = await loginVerifyMessage({
- phone: state.loginPhoneForm.phoneUser,
- });
- if (res.json_ok) {
- countdown.value = 60; //寮�鍚�掕鏃�
- // 鍊掕鏃堕�昏緫
- const intervalId = setInterval(() => {
- if (countdown.value > 0) {
- countdown.value--;
- } else {
- clearInterval(intervalId);
- }
- }, 1000);
- }
- }
- });
-};
+//#endregion
onMounted(() => {
emitter.on('openLoginDlg', () => {
- if (state.isShowLogin || isLoginStatus.value) return;
+ if (isShowLogin.value || isLoginStatus.value) return;
openLoginDlg();
});
emitter.on('logout', () => {
logoutClick();
});
-
document.addEventListener('click', listenClickOtherExit);
});
</script>
@@ -361,7 +239,7 @@
}
.pop_up {
position: absolute;
- top: -60px;
+ // top: -60px;
left: 5px;
width: 240px;
min-height: 47px;
@@ -381,7 +259,7 @@
}
}
.actived {
- top: -60px !important;
+ bottom: 60px !important;
}
}
.user_login {
--
Gitblit v1.9.3