From 35cf8d289a09a6a4a34cf3d73fb41d84969ae4ee Mon Sep 17 00:00:00 2001
From: zhangwei <1504152376@qq.com>
Date: 星期一, 18 八月 2025 17:30:26 +0800
Subject: [PATCH] '注册修改'
---
src/views/login/index.vue | 317 ++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 265 insertions(+), 52 deletions(-)
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 15a2618..53092d3 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script setup lang="tsx">
import Motion from "./utils/motion";
import { useRouter } from "vue-router";
import { message } from "@/utils/message";
@@ -7,6 +7,7 @@
reactive,
computed,
ref,
+ h,
onMounted,
defineAsyncComponent,
onUnmounted,
@@ -16,6 +17,14 @@
import { useNav } from "@/layout/hooks/useNav";
import { useEventListener } from "@vueuse/core";
import type { FormInstance } from "element-plus";
+import {
+ ElForm,
+ ElFormItem,
+ ElRadioGroup,
+ ElRadio,
+ ElRow,
+ ElTag
+} from "element-plus";
import { useLayout } from "@/layout/hooks/useLayout";
import { useUserStoreHook } from "@/store/modules/user";
import { initRouter, getTopMenu } from "@/router/utils";
@@ -25,12 +34,7 @@
import { useRoute } from "vue-router";
const route = useRoute();
-
-// import dayIcon from "@/assets/svg/day.svg?component";
-// import darkIcon from "@/assets/svg/dark.svg?component";
-import Lock from "~icons/ri/lock-fill";
-import User from "~icons/ri/user-3-fill";
-import { captcha, phoneNumberCode, exRole } from "@/api/register/index.ts";
+import { captcha, phoneNumberCode, exRole } from "@/api/register/index";
defineOptions({
name: "Login"
@@ -50,15 +54,18 @@
// 鑾峰彇楠岃瘉鐮�
const getCaptcha = async () => {
// if (!state.captchaEnabled) return;
-
state.ruleForm.code = "";
const res = await captcha();
- console.log(res);
-
state.captchaImage = "data:text/html;base64," + res.result?.img;
state.expirySeconds = res.result?.expirySeconds;
state.ruleForm.codeId = res.result?.id;
};
+import {
+ addDialog,
+ closeDialog,
+ updateDialog,
+ closeAllDialog
+} from "@/components/ReDialog";
const state = reactive({
isShowPassword: false,
ruleForm: {
@@ -66,9 +73,8 @@
nickName: "",
phone: "",
phoneVCode: "",
- // tenantId: props.tenantInfo.id,
code: "",
- codeId: 0,
+ codeId: "",
email: "",
exRoleCode: ""
},
@@ -110,7 +116,9 @@
hideTenantForLogin: false,
expirySeconds: 60, // 楠岃瘉鐮佽繃鏈熸椂闂�
phoneSeconds: 0, // 鎵嬫満楠岃瘉鐮佸�掕鏃�
- roleList: []
+ roleList: [],
+ myEnterpriseList: [],
+ nowRole: {}
});
// 楠岃瘉鐮佽繃鏈熻鏃跺櫒
let timer: any = null;
@@ -118,34 +126,23 @@
// 椤甸潰鍒濆鍖�
onMounted(async () => {
- // 鑻RL甯︽湁Token鍙傛暟锛堢涓夋柟鐧诲綍锛�
- const accessToken = route.query.token;
- // if (accessToken) await saveTokenAndInitRoutes(accessToken);
- // watch(
- // () => themeConfig.value.isLoaded,
- // isLoaded => {
- // if (isLoaded) {
- // 鑾峰彇鐧诲綍閰嶇疆
- // state.hideTenantForLogin = themeConfig.value.hideTenantForLogin ?? true;
- // state.secondVerEnabled = themeConfig.value.secondVer ?? true;
- // state.captchaEnabled = themeConfig.value.captcha ?? true;
-
- // 鑾峰彇楠岃瘉鐮�
getCaptcha();
exRole().then(res => {
state.roleList = res.result;
+ const role = route.query;
+ if (role.code) {
+ state.nowRole = state.roleList.find(item => {
+ return item.code == role.code;
+ });
+ } else {
+ state.nowRole = state.roleList[0];
+ }
+ state.ruleForm.exRoleCode = state.nowRole.code;
});
// 娉ㄥ唽楠岃瘉鐮佽繃鏈熻鏃跺櫒
- // if (state.captchaEnabled) {
timer = setInterval(() => {
if (state.expirySeconds > 0) state.expirySeconds -= 1;
}, 1000);
-
- // }
- // }
- // },
- // { immediate: true }
- // );
});
// 椤甸潰鍗歌浇
onUnmounted(() => {
@@ -155,28 +152,204 @@
clearInterval(phonetimer);
phonetimer = null;
});
+const openDialog = () => {
+ addDialog({
+ width: "30%",
+ title: "閫夋嫨鐧诲綍鍏徃",
+ contentRenderer: () =>
+ h(ElForm, {
+ ref: ruleFormRef,
+ model: state.ruleForm,
+ rules: loginRules,
+ size: 'large'
+ }, [
+ h(Motion, { delay: 150 }, [
+ h(ElFormItem, {
+ prop: 'exRoleCode',
+ label: '涓讳綋瑙掕壊' // 鍙坊鍔犺〃鍗曢」鏍囩
+ }, [
+ // 鍗曢�夋缁� - 鐖跺鍣ㄦ坊鍔犳牱寮忔帶鍒�
+ h(ElRadioGroup, {
+ modelValue: state.ruleForm.exRoleCode,
+ 'onUpdate:modelValue': (val) => {
+ state.ruleForm.exRoleCode = val
+ },
+ style: {
+ display: 'flex',
+ flexDirection: 'column',
+ gap: '8px' // 鍗曢�夋涔嬮棿鐨勯棿璺�
+ }
+ }, [
+ // 寰幆娓叉煋鍗曢�夋 - 姣忎釜鍗曢�夋鍗曠嫭鍗犱竴琛�
+ state.myEnterpriseList.map(item => h(ElRadio, {
+ key: item.id,
+ value: item.code,
+ style: {
+ display: 'block', // 璁╂瘡涓崟閫夋鍒嗚鏄剧ず
+ padding: '4px 0'
+ }
+ }, item.name),)
+ ]),
+
+ // 绠＄悊鍛樻爣绛� - 鏄剧ず鍦ㄥ崟閫夋鍚庨潰
+
+ ])
+ ])
+ ])
+ // <>
+ // <el-form
+ // ref="ruleFormRef"
+ // model={state.ruleForm}
+ // rules={loginRules}
+ // size="large"
+ // >
+ // <Motion delay={150}>
+ // <el-form-item prop="exRoleCode">
+ // <el-radio-group v-model={state.ruleForm.exRoleCode}>
+ // <el-radio
+ // v-for={item in state.myEnterpriseList}
+ // key={item.id}
+ // value={item.code}
+ // >
+ // {item.name}
+ // </el-radio>
+ // </el-radio-group>
+ // </el-form-item>
+ // </Motion>
+ // </el-form>
+ // </>
+ // h(
+ // ElForm,
+ // {
+ // ref: ruleFormRef,
+ // model: state.ruleForm,
+ // rules: loginRules,
+ // size: "large"
+ // },
+ // [
+ // h(Motion, { delay: 150 }, [
+ // h(ElFormItem, { prop: "exRoleCode" }, [
+ // h(
+ // ElRadioGroup,
+ // {
+ // modelValue: state.ruleForm.exRoleCode,
+ // "onUpdate:modelValue": val => {
+ // state.ruleForm.exRoleCode = val;
+ // }
+ // },
+ // [
+ // // 鐢╩ap瀹炵幇v-for寰幆
+ // state.myEnterpriseList.map(item =>
+ // h(ElRow, {}, [
+ // h(
+ // ElRadio,
+ // {
+ // key: item.customerUserID,
+ // value: item.customerUserID
+ // },
+ // item.enterpriseName
+ // ),
+ // item.isManager ? 444 : "" // 鏍囩鍐呭
+ // ])
+ // )
+ // ]
+ // )
+ // ])
+ // ])
+ // ]
+ // ),
+ // jsx 璇硶 锛堟敞鎰忓湪.vue鏂囦欢鍚敤jsx璇硶锛岄渶瑕佸湪script寮�鍚痩ang="tsx"锛�
+ closeCallBack: ({ options, args }) => {
+ // options.props 鏄搷搴斿紡鐨�
+ // const { formInline } = options.props as FormProps;
+ // const text = `濮撳悕锛�${formInline.user} 鍩庡競锛�${formInline.region}`;
+ if (args?.command === "cancel") {
+ // 鎮ㄧ偣鍑讳簡鍙栨秷鎸夐挳
+ // active.value -= 1;
+ } else if (args?.command === "sure") {
+ let obj = {
+ phone: state.ruleForm.phone,
+ code: state.ruleForm.phoneVCode,
+ exRuleCode: state.ruleForm.exRoleCode
+ };
+ useUserStoreHook()
+ .loginByUsername(obj)
+ .then(res => {
+ if (res?.code == 200) {
+ message("娉ㄥ唽鎴愬姛锛�", { type: "success" });
+ router.replace({
+ path: "/RegisterSucess",
+ query: {
+ code: obj.exRoleCode
+ }
+ });
+ } else {
+ message(res?.message, { type: "warning" });
+ }
+ });
+ } else {
+ }
+ }
+ });
+};
const onLogin = async (formEl: FormInstance | undefined) => {
if (!formEl) return;
await formEl.validate(valid => {
if (valid) {
+ let obj = {
+ phone: state.ruleForm.phone,
+ code: state.ruleForm.phoneVCode,
+ exRuleCode: state.ruleForm.exRoleCode
+ };
loading.value = true;
useUserStoreHook()
- .loginByUsername({
- phone: state.ruleForm.phone,
- code: state.ruleForm.phoneVCode,
- exRuleCode: state.ruleForm.exRoleCode
- })
+ .loginByUsername(obj)
.then(res => {
if (res.code == 200) {
// 鑾峰彇鍚庣璺敱
return initRouter().then(() => {
- disabled.value = true;
- router
- .push(getTopMenu(true)?.path)
- .then(() => {
- message("鐧诲綍鎴愬姛", { type: "success" });
- })
- .finally(() => (disabled.value = false));
+ let obj = res.result;
+ if (obj.theLastLogo) {
+ router
+ .replace({
+ name: "Index"
+ })
+ .then(() => {
+ message("鐧诲綍鎴愬姛", { type: "success" });
+ })
+ .finally(() => (disabled.value = false));
+ } else {
+ state.myEnterpriseList = obj.customerExs;
+ openDialog();
+ }
+ if (res.result.exRoles.length == 0) {
+ disabled.value = true;
+ router
+ .replace({
+ name: "RegisterNav",
+ query: { code: state.ruleForm.exRoleCode }
+ })
+ .then(() => {
+ message("鐧诲綍鎴愬姛", { type: "success" });
+ })
+ .finally(() => (disabled.value = false));
+ } else if (res.result.exRoles.length > 0) {
+ let data = res.result.exRoles.find(item => {
+ return item.code == state.ruleForm.exRoleCode;
+ });
+
+ if (!data) {
+ router.replace({
+ name: "RegisterNav",
+ query: { code: state.ruleForm.exRoleCode }
+ });
+ } else if (data?.hasFlsh) {
+ router.replace("index");
+ } else {
+ router.replace("mine");
+ }
+ }
+ useUserStoreHook().getCusExtendInfo();
});
} else {
message(res?.message || "鐧诲綍澶辫触", { type: "error" });
@@ -224,16 +397,16 @@
<img width="400px" :src="logo1" class="logo1" />
</div>
<!-- <img :src="bg" class="wave" /> -->
- <div class="flex-c absolute right-5 top-3">
- <!-- 涓婚 -->
- <el-switch
+ <!-- <div class="flex-c absolute right-5 top-3"> -->
+ <!-- 涓婚 -->
+ <!-- <el-switch
v-model="dataTheme"
inline-prompt
:active-icon="dayIcon"
:inactive-icon="darkIcon"
@change="dataThemeChange"
/>
- </div>
+ </div> -->
<div class="login-container">
<div class="img">
<!-- <component :is="toRaw(illustration)" /> -->
@@ -242,7 +415,7 @@
<div class="login-form">
<!-- <avatar class="avatar" /> -->
<Motion>
- <h2 class="outline-hidden">{{ title }}</h2>
+ <h2 class="logintitle">{{ state.nowRole.name }}鐧诲綍</h2>
</Motion>
<el-form
@@ -251,7 +424,7 @@
:rules="loginRules"
size="large"
>
- <Motion :delay="150">
+ <!-- <Motion :delay="150">
<el-form-item prop="exRoleCode">
<el-radio-group v-model="state.ruleForm.exRoleCode">
<el-radio
@@ -262,7 +435,7 @@
>
</el-radio-group>
</el-form-item>
- </Motion>
+ </Motion> -->
<Motion :delay="100">
<el-form-item
:rules="[
@@ -382,4 +555,44 @@
#suffix-span {
cursor: pointer;
}
+.login-content-code {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ position: relative;
+
+ .login-content-code-img {
+ width: 100%;
+ height: 40px;
+ line-height: 40px;
+ background-color: #ffffff;
+ // /* border: 1px solid rgb(220, 223, 230); */
+ cursor: pointer;
+ transition: all ease 0.2s;
+ border-radius: 4px;
+ user-select: none;
+
+ &:hover {
+ border-color: #c0c4cc;
+ transition: all ease 0.2s;
+ }
+ }
+}
+
+.login-content-code-expired {
+ @extend .login-content-code;
+ &::before {
+ content: "楠岃瘉鐮佸凡杩囨湡";
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ border-radius: 4px;
+ background-color: rgba(0, 0, 0, 0.5);
+ color: #ffffff;
+ text-align: center;
+ line-height: 40px;
+ }
+}
</style>
--
Gitblit v1.9.1