新提交

马宇豪

2024-01-26 c694cffc8541d921e5256d33e14e3237454de950

 src/views/system/user/index.vue

@@ -60,6 +60,7 @@
                    <template #default="scope">
                        <el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onOpenUserDialog('查看', scope.row)">查看</el-button>
                        <el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onOpenUserDialog('修改', scope.row)">修改</el-button>
                        <el-button size="small" text type="primary" @click="onPwdDialog(scope.row.uid)">修改密码</el-button>
                        <el-button size="small" text type="primary" @click="onCertificate(scope.row)">证书管理</el-button>
                        <el-button style="color: red" :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button>
                    </template>
@@ -72,6 +73,26 @@
        </el-card>
        <userDialog ref="userRef" @getUserList="initUserTableData" />
        <dialog-certificate ref="ctfRef" @getUserList="initUserTableData"></dialog-certificate>
      <el-dialog title="修改密码" v-model="showPwdDialog" width="500px">
        <el-form :model="pwdForm" size="default" ref="pwdRef" :rules="pwdFormRules" label-width="110px">
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
            <el-form-item label="新密码" prop="newPassword">
              <el-input v-model.trim="pwdForm.newPassword" placeholder="请输入" type="password" show-password>
              </el-input>
            </el-form-item>
            <el-form-item label="确认新密码" prop="rePassword">
              <el-input v-model.trim="pwdForm.rePassword" placeholder="请输入" type="password" show-password>
              </el-input>
            </el-form-item>
          </el-col>
        </el-form>
        <template #footer>
                <span class="dialog-footer">
                    <el-button @click="showPwdDialog = !showPwdDialog" size="default">取 消</el-button>
                    <el-button type="primary" v-throttle @click="onPwdSubmit" size="default">确 定</el-button>
                </span>
        </template>
      </el-dialog>
    </div>
</template>

@@ -84,6 +105,10 @@
import { dutyApi } from '/@/api/systemManage/duty';
import { departmentApi } from '/@/api/systemManage/department';
import { useRoleApi } from '/@/api/systemManage/role';
import {verifyPwd} from "/@/utils/toolsValidate";
import {useLoginApi} from "/@/api/login";
import {Session} from "/@/utils/storage";
import Cookies from "js-cookie";

// 定义接口来定义对象的类型
interface TableDataRow {
@@ -121,6 +146,13 @@
    dutyList: [];
    userTypeList: Array<{id:number,name:string}>;
    props:{}
    showPwdDialog: boolean
    pwdForm: {
      uid: number|string| null
      newPassword: string
      rePassword: string
    }
    pwdFormRules: {}
}

export default defineComponent({
@@ -128,7 +160,28 @@
    components: { userDialog,dialogCertificate },
    setup() {
        const userRef = ref();
        const pwdRef = ref();
        const ctfRef = ref()
        let validatePwd = (rule: any, value: any, callback: any)=>{
          if(value === ''){
            callback(new Error('请输入密码'))
          }else{
            if(!verifyPwd(value)){
              callback(new Error('密码须包含字母、数字、特殊字符，长度在6-16之间'))
            }else{
              callback()
            }
          }
        }
      const equalToPassword = (rule: any, value: any, callback: any) => {
        if(value == ''){
          callback(new Error("请再次确认密码"))
        }else if (state.pwdForm.newPassword !== value) {
          callback(new Error("两次输入的密码不一致"))
        } else {
          callback();
        }
      };
        const state = reactive<TableDataState>({
            userTableData: {
                data: [],
@@ -157,7 +210,17 @@
                { id: 1, name: '超级管理员' },
                { id: 2, name: '管理员' },
                { id: 3, name: '普通员工' }
            ]
            ],
          showPwdDialog: false,
          pwdForm: {
            uid: null,
            newPassword: '',
            rePassword: ''
          },
          pwdFormRules: {
            newPassword: [{ required: true, validator: validatePwd, trigger: 'blur' }],
            rePassword: [{ required: true, validator: equalToPassword, trigger: "blur" }]
          }
        });
        // 初始化表格数据
        const initUserTableData = async () => {
@@ -218,6 +281,57 @@
            userRef.value.openDialog(type, value, state.departmentList, state.roleList, state.dutyList);
        };

        const onPwdDialog = (uid: string)=>{
          state.pwdForm = {
            uid: uid,
            newPassword: '',
            rePassword: ''
          }
          state.showPwdDialog = true
        }

        const onPwdSubmit = async () => {
          pwdRef.value.validate(async (valid:Boolean) => {
            if(valid){
              const {rePassword,...data} = state.pwdForm
              let res = await userApi().pwdMod(data);
              if (res.data.code === '200') {
                state.showPwdDialog = false;
                if(state.pwdForm.uid == Cookies.get('uid')){
                  ElMessage({
                    type: 'success',
                    message: '密码修改成功，请重新登录',
                    duration: 2000
                  })
                  setTimeout(()=>{
                    useLoginApi()
                        .signOut()
                        .then(() => {
                          Session.clear()
                          window.location.href = '/'
                        })
                  },2000)
                }else{
                  ElMessage({
                    type: 'success',
                    message: '修改密码成功',
                    duration: 2000
                  })
                }
              } else {
                ElMessage({
                  type: 'warning',
                  message: res.data.msg
                });
              }
            }else{
              ElMessage({
                type:'warning',
                message:'请完善信息'
              })
            }
          })
        }
        const onCertificate = (value: any)=>{
          ctfRef.value.openDialog(value);
        }
@@ -267,6 +381,9 @@
        return {
            userRef,
            ctfRef,
          pwdRef,
          onPwdDialog,
          onPwdSubmit,
            onOpenUserDialog,
            onCertificate,
            onRowDel,