Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt

Your Name

2022-09-20 e6ce09ca661049fd9a4034e4db5a7584cae5c1ec

 src/views/loginPage/component/accountLogin.vue

@@ -19,7 +19,7 @@
        </el-form-item>
        <el-form-item class="login-animation4 codeDeal">
            <el-checkbox v-model="saveCode" label="记住密码" size="large" />
            <span class="forgetCode">忘记密码？</span>
            <span class="forgetCode" @click="identify">忘记密码？</span>
        </el-form-item>
        <el-form-item class="login-animation4">
            <el-button type="primary" class="login-content-submit" round @click="onSignIn" :loading="loading.signIn">
@@ -27,10 +27,49 @@
            </el-button>
        </el-form-item>
    </el-form>
    <el-dialog v-model="identifyDialog" title="重置密码须进行身份校验(仅供测试)" width="30%" center @close="clearIdentity">
        <el-form :model="identity" label-width="80px" ref="identifyRef" :rules="identityRules">
            <el-form-item label="姓名" prop="userName">
                <el-input v-model="identity.userName"/>
            </el-form-item>
            <el-form-item label="身份证号" prop="ID">
                <el-input v-model="identity.ID"/>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
                <el-input v-model="identity.phone"/>
            </el-form-item>
        </el-form>
        <template #footer>
              <span class="dialog-footer">
                <el-button type="warning" @click="identifyDialog = false" size="default">取消</el-button>
                <el-button type="primary" @click="confirmIdentity(identifyRef)" size="default">确认</el-button>
              </span>
        </template>
    </el-dialog>
    <el-dialog v-model="changeDialog" title="修改密码" width="30%" center @close="clearCode">
        <el-form :model="codeForm" label-width="80px" ref="codeRef" :rules="codeRules">
            <el-form-item label="密码" prop="pass">
                <el-input v-model="codeForm.pass" type="password" autocomplete="off" />
            </el-form-item>
            <el-form-item label="确认密码" prop="checkPass">
                <el-input
                        v-model="codeForm.checkPass"
                        type="password"
                        autocomplete="off"
                />
            </el-form-item>
        </el-form>
        <template #footer>
              <span class="dialog-footer">
                <el-button type="warning" @click="changeDialog = false" size="default">取消</el-button>
                <el-button type="primary" @click="confirmChange(codeRef)" size="default">确认修改</el-button>
              </span>
        </template>
    </el-dialog>
</template>

<script lang="ts">
import { toRefs, reactive, defineComponent, computed } from 'vue';
import {toRefs, reactive, defineComponent, computed, ref} from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { ElMessage } from 'element-plus';
import { useI18n } from 'vue-i18n';
@@ -44,7 +83,10 @@
import { NextLoading } from '/@/utils/loading';
import { useLoginApi } from '/@/api/login';
import { useUserInfo } from '/@/stores/userInfo';

import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import {workApplyApi} from "/@/api/specialWorkSystem/workApply";
import {verifyPhone,verifyIdCard} from "/@/utils/toolsValidate"
export default defineComponent({
    name: 'accountLogin',
    setup() {
@@ -60,8 +102,47 @@
            },
            loading: {
                signIn: false
            }
            },
            identity:{
                name: '',
                ID: '',
                phone: ''
            },
            codeForm:{
                pass: '',
                checkPass: ''
            },
            identifyDialog: false,
            changeDialog: false
        });
        const identifyRef = ref<FormInstance>()
        const codeRef = ref<FormInstance>()
        const checkCode = (rule: any, value: any, callback: any) => {
            if (value == '') {
                return callback(new Error('该内容不能为空'))
            }
            setTimeout(() => {
                if (!verifyIdCard(value)) {
                    callback(new Error('身份证格式不正确'))
                }else callback();
            }, 400)
        }
        const checkPhone = (rule: any, value: any, callback: any) => {
            if (value == '') {
                return callback(new Error('该内容不能为空'))
            }
            setTimeout(() => {
                if (!verifyPhone(value)) {
                    callback(new Error('手机号格式不正确'))
                }else callback();
            }, 400)
        }
        const identityRules = reactive({
            userName: [{ required: true, message: '该内容不能为空', trigger: 'blur' }],
            ID: [{ required: true, validator: checkCode, trigger: 'blur'}],
            phone: [{ required: true, validator: checkPhone, trigger: 'blur' }]
        });

        // 时间获取
        const currentTime = computed(() => {
            return formatAxis(new Date());
@@ -126,8 +207,94 @@
            // 添加 loading，防止第一次进入界面时出现短暂空白
            // NextLoading.start();
        };

        // 修改密码
        const identify =()=>{
            state.identifyDialog = true
        }

        // 提交验证
        const confirmIdentity = (formEl: FormInstance | undefined) => {
            if (!formEl) return
            formEl.validate((valid) => {
                if (valid) {
                    state.identifyDialog = false
                    state.changeDialog = true
                } else {
                    console.log('error submit!')
                    return false
                }
            })
        }
        const clearIdentity = ()=>{
            state.identity = {
                name: '',
                ID: '',
                phone: ''
            }
        }
        // 修改密码
        const validatePass = (rule: any, value: any, callback: any) => {
            if (value === '') {
                callback(new Error('请输入密码'))
            } else {
                if (state.codeForm.checkPass !== '') {
                    if (!codeRef.value) return
                    codeRef.value.validateField('checkPass', () => null)
                }
                callback()
            }
        }
        const validatePass2 = (rule: any, value: any, callback: any) => {
            if (value === '') {
                callback(new Error('请输入密码'))
            } else if (value !== state.codeForm.pass) {
                callback(new Error("两次输入的密码不一致!"))
            } else {
                callback()
            }
        }

        const codeRules = reactive({
            pass: [{ required: true, validator: validatePass, trigger: 'blur' }],
            checkPass: [{ required: true, validator: validatePass2, trigger: 'blur' }]
        })

        const confirmChange = (formEl: FormInstance | undefined) => {
            if (!formEl) return
            formEl.validate((valid) => {
                if (valid) {
                    ElMessage({
                        type: 'success',
                        message: '修改成功，请使用新密码登录'
                    });
                    state.changeDialog = false
                    router.push('/login');
                } else {
                    console.log('error submit!')
                    return false
                }
            })
        }
        const clearCode=()=>{
            state.codeForm = {
                pass: '',
                checkPass: ''
            }
        }
        return {
            identifyRef,
            codeRef,
            identityRules,
            codeRules,
            clearIdentity,
            onSignIn,
            identify,
            confirmIdentity,
            confirmChange,
            clearCode,
            validatePass,
            validatePass2,
            ...toRefs(state)
        };
    }