From 83aa382fd3b88ec7a564f14d41a9c8e5d43beeb3 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期一, 09 十二月 2024 10:26:31 +0800
Subject: [PATCH] 修改表单定义样式&&修改ui上下文btmName&&添加登录密码即将过期进入首页并提醒
---
Source/plt-web/plt-web-ui/src/page/login/userlogin.vue | 498 +++++++++++++++++++++++++++++++++----------------------
1 files changed, 300 insertions(+), 198 deletions(-)
diff --git a/Source/plt-web/plt-web-ui/src/page/login/userlogin.vue b/Source/plt-web/plt-web-ui/src/page/login/userlogin.vue
index 7d11644..00bf9eb 100644
--- a/Source/plt-web/plt-web-ui/src/page/login/userlogin.vue
+++ b/Source/plt-web/plt-web-ui/src/page/login/userlogin.vue
@@ -1,217 +1,319 @@
<template>
- <el-form class="login-form"
- status-icon
- :rules="loginRules"
- ref="loginForm"
+ <el-form ref="loginForm"
:model="loginForm"
+ :rules="loginRules"
+ class="login-form"
label-width="0"
- >
+ status-icon
+ >
-<!-- <el-form-item prop="selectInput">-->
-<!-- <el-select v-model="loginForm.value" placeholder="璇烽�夋嫨缁勭粐" style="width: 326px" @change="selectchange">-->
-<!-- <i slot="prefix" class="el-icon-s-operation"/>-->
-<!-- <el-option-->
-<!-- v-for="(item,index) in loginForm.region"-->
-<!-- :key="index"-->
-<!-- :label="item.TENANT_NAME"-->
-<!-- :value="item.TENANT_ID">-->
-<!-- </el-option>-->
-<!-- </el-select>-->
-<!-- </el-form-item>-->
- <el-form-item prop="username">
- <el-input size="small"
- @keyup.enter.native="handleLogin"
- v-model="loginForm.username"
- auto-complete="off"
- :placeholder="$t('login.username')">
- <i slot="prefix" class="icon-yonghu" style="color: white"/>
- </el-input>
- </el-form-item>
- <el-form-item prop="password">
- <el-input size="small"
- @keyup.enter.native="handleLogin"
- :type="passwordType"
- v-model="loginForm.password"
- auto-complete="off"
- :placeholder="$t('login.password')">
- <i class="el-icon-view el-input__icon" slot="suffix" @click="showPassword" style="color: white"/>
- <i slot="prefix" class="icon-mima" style="color: white"/>
- </el-input>
- </el-form-item>
+ <el-form-item prop="username">
+ <el-input v-model="loginForm.username"
+ :placeholder="$t('login.username')"
+ auto-complete="off"
+ size="small"
+ @keyup.enter.native="handleLogin">
+ <i slot="prefix" class="icon-yonghu" style="color: white"/>
+ </el-input>
+ </el-form-item>
+ <el-form-item prop="password">
+ <el-input v-model="loginForm.password"
+ :placeholder="$t('login.password')"
+ :type="passwordType"
+ auto-complete="off"
+ size="small"
+ @keyup.enter.native="handleLogin">
+ <i slot="suffix" class="el-icon-view el-input__icon" style="color: white" @click="showPassword"/>
+ <i slot="prefix" class="icon-mima" style="color: white"/>
+ </el-input>
+ </el-form-item>
- <el-form-item>
- <el-button type="primary"
- size="small"
- @click.native.prevent="handleLogin"
- class="login-submit">{{$t('login.submit')}}
- </el-button>
- </el-form-item>
-
-
-
+ <el-form-item>
+ <el-button class="login-submit"
+ size="small"
+ type="primary"
+ @click.native.prevent="handleLogin">{{ $t('login.submit') }}
+ </el-button>
+ </el-form-item>
+ <el-dialog
+ v-dialogDrag
+ :visible.sync="passwordVisible"
+ append-to-body="true"
+ class="avue-dialog"
+ style="margin-top: -15vh"
+ title="淇敼瀵嗙爜"
+ width="50%">
+ <avue-form ref="changeForm" v-model="passwordForm" :option="passwordOption" @submit="submitSwitch"/>
+ </el-dialog>
</el-form>
</template>
<script>
- import {mapGetters} from "vuex";
- import {info} from "@/api/system/tenant";
- import {getTopUrl} from "@/util/util";
+import {mapGetters} from "vuex";
+import {info} from "@/api/system/tenant";
+import {getTopUrl} from "@/util/util";
+import func from "@/util/func";
+import {changePassword} from "@/api/user";
- export default {
- name: "userlogin",
- data() {
- return {
- tenantMode: this.website.tenantMode,
- ButtonList:[],
- loginForm: {
- //绉熸埛ID
- tenantId: "000000",
- //閮ㄩ棬ID
- deptId: "",
- //瑙掕壊ID
- roleId: "",
- //鐢ㄦ埛鍚�
- username: "admin",
- //瀵嗙爜
- password: "",
- selectInput:'',
- //涓嬫媺input鏁版嵁
- value:'绠＄悊缁�',
- //涓嬫媺鑿滃崟
- region:[],
- //璐﹀彿绫诲瀷
- type: "account",
- //楠岃瘉鐮佺殑绱㈠紩
- key: "",
- //棰勫姞杞界櫧鑹茶儗鏅�
- image: "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",
-
- },
- value: {
- selectInput: [
- {required: true, message: "璇烽�夋嫨缁勭粐", trigger: "blur"}
- ],
- username: [
- {required: true, message: "璇疯緭鍏ョ敤鎴峰悕", trigger: "blur"}
- ],
- password: [
- {required: true, message: "璇疯緭鍏ュ瘑鐮�", trigger: "blur"},
- {min: 1, message: "瀵嗙爜闀垮害鏈�灏戜负6浣�", trigger: "blur"}
- ]
- },
- passwordType: "password",
- userBox: false,
- userForm: {
- deptId: '',
- roleId: ''
- },
- };
- },
- created() {
- // this.getTenant();
- },
- mounted() {
- //鍦╩ounted鑾峰彇棣栭〉涓嬫媺鑿滃崟鏁版嵁
- /*this.$axios.get('/api/blade-system/tenant/tenant-map').then(res=>{
- if(res.data.code == 200){
- this.loginForm.region=res.data.data
- }
- })*/
- },
- watch: {
- 'loginForm.deptId'() {
- const column = this.findObject(this.userOption.column, "deptId");
- if (this.loginForm.deptId.includes(",")) {
- column.dicUrl = `/api/blade-system/dept/select?deptId=${this.loginForm.deptId}`;
- column.display = true;
- } else {
- column.dicUrl = '';
- }
+export default {
+ name: "userlogin",
+ data() {
+ return {
+ userName: '',
+ passwordVisible: false,
+ passwordForm: {},
+ passwordOption: {
+ submitText: '淇濆瓨',
+ column: [
+ {
+ label: '鐧婚檰瀵嗙爜',
+ prop: 'oldPassword',
+ span: 24,
+ labelWidth: "15%",
+ type: 'password',
+ rules: [
+ {
+ required: true,
+ message: '璇疯緭鍏ョ櫥闄嗗瘑鐮�',
+ trigger: 'blur'
+ }
+ ]
+ },
+ {
+ label: '鏂扮櫥闄嗗瘑鐮�',
+ prop: 'password',
+ span: 24,
+ labelWidth: "15%",
+ type: 'password',
+ rules: [
+ {
+ required: true,
+ message: '璇疯緭鍏ユ柊鐧婚檰瀵嗙爜',
+ trigger: 'blur'
+ }
+ ]
+ },
+ {
+ label: '鏂板瘑鐮佺櫥闄嗙‘璁�',
+ prop: 'confirmPassword',
+ span: 24,
+ labelWidth: "15%",
+ type: 'password',
+ rules: [
+ {
+ required: true,
+ message: '璇风‘璁ょ櫥闄嗗瘑鐮�',
+ trigger: 'blur'
+ }
+ ]
+ }
+ ]
},
- 'loginForm.roleId'() {
- const column = this.findObject(this.userOption.column, "roleId");
- if (this.loginForm.roleId.includes(",")) {
- column.dicUrl = `/api/blade-system/role/select?roleId=${this.loginForm.roleId}`;
- column.display = true;
- } else {
- column.dicUrl = '';
- }
+ tenantMode: this.website.tenantMode,
+ ButtonList: [],
+ loginForm: {
+ //绉熸埛ID
+ tenantId: "000000",
+ //閮ㄩ棬ID
+ deptId: "",
+ //瑙掕壊ID
+ roleId: "",
+ //鐢ㄦ埛鍚�
+ username: "admin",
+ //瀵嗙爜
+ password: "",
+ selectInput: '',
+ //涓嬫媺input鏁版嵁
+ value: '绠＄悊缁�',
+ //涓嬫媺鑿滃崟
+ region: [],
+ //璐﹀彿绫诲瀷
+ type: "account",
+ //楠岃瘉鐮佺殑绱㈠紩
+ key: "",
+ //棰勫姞杞界櫧鑹茶儗鏅�
+ image: "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7",
+
+ },
+ value: {
+ selectInput: [
+ {required: true, message: "璇烽�夋嫨缁勭粐", trigger: "blur"}
+ ],
+ username: [
+ {required: true, message: "璇疯緭鍏ョ敤鎴峰悕", trigger: "blur"}
+ ],
+ password: [
+ {required: true, message: "璇疯緭鍏ュ瘑鐮�", trigger: "blur"},
+ {min: 1, message: "瀵嗙爜闀垮害鏈�灏戜负6浣�", trigger: "blur"}
+ ]
+ },
+ passwordType: "password",
+ userBox: false,
+ userForm: {
+ deptId: '',
+ roleId: ''
+ },
+ };
+ },
+ created() {
+ // this.getTenant();
+ },
+ mounted() {
+ //鍦╩ounted鑾峰彇棣栭〉涓嬫媺鑿滃崟鏁版嵁
+ /*this.$axios.get('/api/blade-system/tenant/tenant-map').then(res=>{
+ if(res.data.code == 200){
+ this.loginForm.region=res.data.data
+ }
+ })*/
+ },
+ watch: {
+ 'loginForm.deptId'() {
+ const column = this.findObject(this.userOption.column, "deptId");
+ if (this.loginForm.deptId.includes(",")) {
+ column.dicUrl = `/api/blade-system/dept/select?deptId=${this.loginForm.deptId}`;
+ column.display = true;
+ } else {
+ column.dicUrl = '';
}
},
- computed: {
- ...mapGetters(["tagWel", "userInfo"])
- },
- props: [],
- methods: {
- // 缁戝畾涓嬫媺鑿滃崟鍔ㄦ�両D
- selectchange(value) {
- this.loginForm.tenantId=value
- console.log(this.loginForm.tenantId)
- },
- showPassword() {
- this.passwordType === ""
- ? (this.passwordType = "password")
- : (this.passwordType = "");
- },
- submitLogin (form, done) {
- if (form.deptId !== '') {
- this.loginForm.deptId = form.deptId;
- }
- if (form.roleId !== '') {
- this.loginForm.roleId = form.roleId;
- }
- this.handleLogin();
- done();
- },
- handleLogin() {
- this.$router.push({path: this.tagWel.value});
- this.$refs.loginForm.validate(valid => {
- if (valid) {
- const loading = this.$loading({
- lock: true,
- text: '鐧诲綍涓�,璇风◢鍚庛�傘�傘��',
- spinner: "el-icon-loading"
- });
- this.$store.dispatch("LoginByUsername", this.loginForm).then(() => {
- if (this.website.switchMode) {
- const deptId = this.userInfo.deptOid;
- const roleId = this.userInfo.userOid;
- if (deptId.includes(",") || roleId.includes(",")) {
- this.loginForm.deptId = deptId;
- this.loginForm.roleId = roleId;
- this.userBox = true;
- this.$store.dispatch("LogOut").then(() => {
- loading.close();
- });
- return false;
- }
- };
- this.$router.push({path: this.tagWel.value});
- loading.close();
- }).catch((err) => {
- console.log('err',err)
- loading.close();
-
- });
- }
- });
- },
- getTenant() {
- let domain = getTopUrl();
- // 涓存椂鎸囧畾鍩熷悕锛屾柟渚挎祴璇�
- //domain = "https://bladex.vip";
- info(domain).then(res => {
- const data = res.data;
- if (data.success && data.data.tenantId) {
- this.tenantMode = false;
- this.loginForm.tenantId = data.data.tenantId;
- this.$parent.$refs.login.style.backgroundImage = `url(${data.data.backgroundUrl})`;
- }
- })
+ 'loginForm.roleId'() {
+ const column = this.findObject(this.userOption.column, "roleId");
+ if (this.loginForm.roleId.includes(",")) {
+ column.dicUrl = `/api/blade-system/role/select?roleId=${this.loginForm.roleId}`;
+ column.display = true;
+ } else {
+ column.dicUrl = '';
}
}
- };
+ },
+ computed: {
+ ...mapGetters(["tagWel", "userInfo"])
+ },
+ props: [],
+ methods: {
+ // 缁戝畾涓嬫媺鑿滃崟鍔ㄦ�両D
+ selectchange(value) {
+ this.loginForm.tenantId = value
+ },
+ showPassword() {
+ this.passwordType === ""
+ ? (this.passwordType = "password")
+ : (this.passwordType = "");
+ },
+ submitLogin(form, done) {
+ if (form.deptId !== '') {
+ this.loginForm.deptId = form.deptId;
+ }
+ if (form.roleId !== '') {
+ this.loginForm.roleId = form.roleId;
+ }
+ this.handleLogin();
+ done();
+ },
+ handleLogin() {
+ if (!this.loginForm.username) {
+ this.$message.error('璇疯緭鍏ョ敤鎴峰悕');
+ return;
+ }
+ if (!this.loginForm.password) {
+ this.$message.error('璇疯緭鍏ュ瘑鐮�');
+ return;
+ }
+ this.$router.push({path: this.tagWel.value});
+ this.$refs.loginForm.validate(valid => {
+ if (valid) {
+ const loading = this.$loading({
+ lock: true,
+ text: '鐧诲綍涓�,璇风◢鍚庛�傘�傘��',
+ spinner: "el-icon-loading"
+ });
+ this.$store.dispatch("LoginByUsername", this.loginForm).then((data) => {
+ if (data.obj.failCode !== 'loginSuccess') {
+ if (data.obj.failCode === 'passwordRemainDay') {
+ this.$message.warning(data.obj.passwordInfo);
+ this.$router.push({path: this.tagWel.value});
+ loading.close();
+ return;
+ }
+
+ if (data.obj.failCode === 'userIsLocked') {
+ this.$message.error(`鐧诲綍閿欒娆℃暟杩囧锛岃处鍙疯閿佸畾銆�${data.obj.failMsgArray[0]}銆戝垎閽焋);
+ loading.close();
+ return;
+ }
+ this.$message.error(data.msg);
+
+ if (data.obj.mustChangePassword) {
+ this.passwordVisible = true;
+ }
+ }
+
+ if (this.website.switchMode) {
+ const deptId = this.userInfo.deptOid;
+ const roleId = this.userInfo.userOid;
+ if (deptId.includes(",") || roleId.includes(",")) {
+ this.loginForm.deptId = deptId;
+ this.loginForm.roleId = roleId;
+ this.userBox = true;
+ this.$store.dispatch("LogOut").then(() => {
+ loading.close();
+ });
+ return false;
+ }
+ }
+ ;
+
+ this.$router.push({path: this.tagWel.value});
+ loading.close();
+ }).catch((err) => {
+ loading.close();
+ });
+ }
+ });
+ },
+ getTenant() {
+ let domain = getTopUrl();
+ // 涓存椂鎸囧畾鍩熷悕锛屾柟渚挎祴璇�
+ //domain = "https://bladex.vip";
+ info(domain).then(res => {
+ const data = res.data;
+ if (data.success && data.data.tenantId) {
+ this.tenantMode = false;
+ this.loginForm.tenantId = data.data.tenantId;
+ this.$parent.$refs.login.style.backgroundImage = `url(${data.data.backgroundUrl})`;
+ }
+ })
+ },
+
+ submitSwitch(form, done) {
+ let userInfo = JSON.parse(localStorage.getItem('saber-userInfo'));
+
+ let params = {
+ userName: this.loginForm.username,
+ oldPassword: func.encryptData(form.oldPassword, 'daliantan0v0vcip'),
+ password: func.encryptData(form.password, 'daliantan0v0vcip'),
+ confirmPassword: func.encryptData(form.confirmPassword, 'daliantan0v0vcip'),
+ }
+ changePassword(params).then(res => {
+ if (res.data.code === 200) {
+ this.$message.success('淇敼鎴愬姛锛屽嵆灏嗚烦杞埌棣栭〉');
+ this.passwordVisible = false;
+ this.$refs.changeForm.resetFields();
+ this.$store.dispatch("LoginByUsername", {...this.loginForm, password: form.confirmPassword}).then(data => {
+ if (data.obj.failCode !== 'loginSuccess' && data.obj.failCode !== 'passwordRemainDay') {
+ this.$message.error(data.msg);
+ }
+ this.$router.push({path: this.tagWel.value});
+ })
+ }
+ }).catch(err => {
+ console.log(err);
+ })
+ done();
+ },
+ }
+};
</script>
<style>
--
Gitblit v1.9.3