From 1595cb282aab5399862fac6406b5de550863e3b6 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 03 四月 2023 00:05:09 +0800 Subject: [PATCH] update 调整代码格式 --- src/views/register.vue | 228 ++++++++++++++++++++++++++++---------------------------- 1 files changed, 114 insertions(+), 114 deletions(-) diff --git a/src/views/register.vue b/src/views/register.vue index c1f0a0c..b80ce5d 100644 --- a/src/views/register.vue +++ b/src/views/register.vue @@ -1,3 +1,60 @@ +<template> + <div class="register"> + <el-form ref="registerRef" :model="registerForm" :rules="registerRules" class="register-form"> + <h3 class="title">RuoYi-Vue-Plus澶氱鎴风鐞嗙郴缁�</h3> + <el-form-item prop="tenantId" v-if="tenantEnabled"> + <el-select v-model="registerForm.tenantId" filterable placeholder="璇烽�夋嫨/杈撳叆鍏徃鍚嶇О" style="width: 100%"> + <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId"> </el-option> + <template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template> + </el-select> + </el-form-item> + <el-form-item prop="username"> + <el-input v-model="registerForm.username" type="text" size="large" auto-complete="off" placeholder="璐﹀彿"> + <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template> + </el-input> + </el-form-item> + <el-form-item prop="password"> + <el-input v-model="registerForm.password" type="password" size="large" auto-complete="off" placeholder="瀵嗙爜" @keyup.enter="handleRegister"> + <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template> + </el-input> + </el-form-item> + <el-form-item prop="confirmPassword"> + <el-input + v-model="registerForm.confirmPassword" + type="password" + size="large" + auto-complete="off" + placeholder="纭瀵嗙爜" + @keyup.enter="handleRegister" + > + <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template> + </el-input> + </el-form-item> + <el-form-item prop="code" v-if="captchaEnabled"> + <el-input size="large" v-model="registerForm.code" auto-complete="off" placeholder="楠岃瘉鐮�" style="width: 63%" @keyup.enter="handleRegister"> + <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template> + </el-input> + <div class="register-code"> + <img :src="codeUrl" @click="getCode" class="register-code-img" /> + </div> + </el-form-item> + <el-form-item style="width:100%;"> + <el-button :loading="loading" size="large" type="primary" style="width:100%;" @click.prevent="handleRegister"> + <span v-if="!loading">娉� 鍐�</span> + <span v-else>娉� 鍐� 涓�...</span> + </el-button> + <div style="float: right;"> + <router-link class="link-type" :to="'/login'">浣跨敤宸叉湁璐︽埛鐧诲綍</router-link> + </div> + </el-form-item> + </el-form> + <!-- 搴曢儴 --> + <div class="el-register-footer"> + <span>Copyright 漏 2018-2023 鐤媯鐨勭嫯瀛怢i All Rights Reserved.</span> + </div> + </div> +</template> + <script setup lang="ts"> import { getCodeImg, register, getTenantList } from '@/api/login'; import { RegisterForm, TenantVO } from '@/api/types'; @@ -7,13 +64,13 @@ const router = useRouter(); const registerForm = ref<RegisterForm>({ - tenantId: "", - username: "", - password: "", - confirmPassword: "", - code: "", - uuid: "", - userType: "sys_user" + tenantId: "", + username: "", + password: "", + confirmPassword: "", + code: "", + uuid: "", + userType: "sys_user" }); // 绉熸埛寮�鍏� @@ -21,30 +78,30 @@ const equalToPassword = (rule: any, value: string, callback: any) => { - if (registerForm.value.password !== value) { - callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�")); - } else { - callback(); - } + if (registerForm.value.password !== value) { + callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�")); + } else { + callback(); + } }; const registerRules: FormRules = { - tenantId: [ - { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勭鎴风紪鍙�" } - ], - username: [ - { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勮处鍙�" }, - { min: 2, max: 20, message: "鐢ㄦ埛璐﹀彿闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" } - ], - password: [ - { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勫瘑鐮�" }, - { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" } - ], - confirmPassword: [ - { required: true, trigger: "blur", message: "璇峰啀娆¤緭鍏ユ偍鐨勫瘑鐮�" }, - { required: true, validator: equalToPassword, trigger: "blur" } - ], - code: [{ required: true, trigger: "change", message: "璇疯緭鍏ラ獙璇佺爜" }] + tenantId: [ + { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勭鎴风紪鍙�" } + ], + username: [ + { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勮处鍙�" }, + { min: 2, max: 20, message: "鐢ㄦ埛璐﹀彿闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" } + ], + password: [ + { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勫瘑鐮�" }, + { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" } + ], + confirmPassword: [ + { required: true, trigger: "blur", message: "璇峰啀娆¤緭鍏ユ偍鐨勫瘑鐮�" }, + { required: true, validator: equalToPassword, trigger: "blur" } + ], + code: [{ required: true, trigger: "change", message: "璇疯緭鍏ラ獙璇佺爜" }] }; const codeUrl = ref(""); const loading = ref(false); @@ -54,109 +111,52 @@ const tenantList = ref<TenantVO[]>([]); const handleRegister = () => { - registerRef.value.validate(async (valid: boolean) => { - if (valid) { - loading.value = true; - const [err] = await to(register(registerForm.value)); - if (!err) { - const username = registerForm.value.username; - await ElMessageBox.alert("<font color='red'>鎭枩浣狅紝鎮ㄧ殑璐﹀彿 " + username + " 娉ㄥ唽鎴愬姛锛�</font>", "绯荤粺鎻愮ず", { - dangerouslyUseHTMLString: true, - type: "success", - }); - await router.push("/login"); - } else { - loading.value = false; - if (captchaEnabled) { - getCode(); + registerRef.value.validate(async (valid: boolean) => { + if (valid) { + loading.value = true; + const [err] = await to(register(registerForm.value)); + if (!err) { + const username = registerForm.value.username; + await ElMessageBox.alert("<font color='red'>鎭枩浣狅紝鎮ㄧ殑璐﹀彿 " + username + " 娉ㄥ唽鎴愬姛锛�</font>", "绯荤粺鎻愮ず", { + dangerouslyUseHTMLString: true, + type: "success", + }); + await router.push("/login"); + } else { + loading.value = false; + if (captchaEnabled) { + getCode(); + } + } } - } - } - }); + }); } const getCode = async () => { - const { data } = await getCodeImg(); - captchaEnabled.value = data.captchaEnabled === undefined ? true : data.captchaEnabled; + const { data } = await getCodeImg(); + captchaEnabled.value = data.captchaEnabled === undefined ? true : data.captchaEnabled; if (captchaEnabled.value) { - codeUrl.value = "data:image/gif;base64," + data.img; - registerForm.value.uuid = data.uuid; + codeUrl.value = "data:image/gif;base64," + data.img; + registerForm.value.uuid = data.uuid; } } const initTenantList = async () => { - const { data } = await getTenantList(); + const { data } = await getTenantList(); tenantEnabled.value = data.tenantEnabled === undefined ? true : data.tenantEnabled; if (tenantEnabled.value) { - tenantList.value = data.voList; - if (tenantList.value != null && tenantList.value.length !== 0) { - registerForm.value.tenantId = tenantList.value[0].tenantId; - } + tenantList.value = data.voList; + if (tenantList.value != null && tenantList.value.length !== 0) { + registerForm.value.tenantId = tenantList.value[0].tenantId; + } } } onMounted(() => { - getCode(); - initTenantList(); + getCode(); + initTenantList(); }) </script> - -<template> - <div class="register"> - <el-form ref="registerRef" :model="registerForm" :rules="registerRules" class="register-form"> - <h3 class="title">RuoYi-Vue-Plus澶氱鎴风鐞嗙郴缁�</h3> - <el-form-item prop="tenantId" v-if="tenantEnabled"> - <el-select v-model="registerForm.tenantId" filterable placeholder="璇烽�夋嫨/杈撳叆鍏徃鍚嶇О" style="width: 100%"> - <el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId"> </el-option> - <template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template> - </el-select> - </el-form-item> - <el-form-item prop="username"> - <el-input v-model="registerForm.username" type="text" size="large" auto-complete="off" placeholder="璐﹀彿"> - <template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template> - </el-input> - </el-form-item> - <el-form-item prop="password"> - <el-input v-model="registerForm.password" type="password" size="large" auto-complete="off" placeholder="瀵嗙爜" @keyup.enter="handleRegister"> - <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template> - </el-input> - </el-form-item> - <el-form-item prop="confirmPassword"> - <el-input - v-model="registerForm.confirmPassword" - type="password" - size="large" - auto-complete="off" - placeholder="纭瀵嗙爜" - @keyup.enter="handleRegister" - > - <template #prefix><svg-icon icon-class="password" class="el-input__icon input-icon" /></template> - </el-input> - </el-form-item> - <el-form-item prop="code" v-if="captchaEnabled"> - <el-input size="large" v-model="registerForm.code" auto-complete="off" placeholder="楠岃瘉鐮�" style="width: 63%" @keyup.enter="handleRegister"> - <template #prefix><svg-icon icon-class="validCode" class="el-input__icon input-icon" /></template> - </el-input> - <div class="register-code"> - <img :src="codeUrl" @click="getCode" class="register-code-img" /> - </div> - </el-form-item> - <el-form-item style="width:100%;"> - <el-button :loading="loading" size="large" type="primary" style="width:100%;" @click.prevent="handleRegister"> - <span v-if="!loading">娉� 鍐�</span> - <span v-else>娉� 鍐� 涓�...</span> - </el-button> - <div style="float: right;"> - <router-link class="link-type" :to="'/login'">浣跨敤宸叉湁璐︽埛鐧诲綍</router-link> - </div> - </el-form-item> - </el-form> - <!-- 搴曢儴 --> - <div class="el-register-footer"> - <span>Copyright 漏 2018-2023 鐤媯鐨勭嫯瀛怢i All Rights Reserved.</span> - </div> - </div> -</template> <style lang="scss" scoped> .register { -- Gitblit v1.9.3