修改指标越限明细样式
This commit is contained in:
@@ -1,99 +1,99 @@
|
||||
<template>
|
||||
<el-dialog width=“500px” v-model.trim="dialogVisible" title="修改密码">
|
||||
<el-scrollbar>
|
||||
<el-form :inline="false" :model="form" label-width="120px" class="form-one" :rules="rules" ref="formRef">
|
||||
<el-form-item label="新密码" prop="newPwd">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.newPwd" type="password"
|
||||
placeholder="请输入新密码" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="confirmPwd">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.confirmPwd" type="password"
|
||||
placeholder="请输入确认密码" show-password />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { validatePwd } from '@/utils/common'
|
||||
import { passwordConfirm, updatePassword } from '@/api/user-boot/user'
|
||||
import { debug } from 'console'
|
||||
|
||||
const formRef = ref()
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
const form = reactive({
|
||||
id: '',
|
||||
newPwd: '',
|
||||
confirmPwd: '',
|
||||
loginName: ''
|
||||
})
|
||||
const rules = {
|
||||
newPwd: [
|
||||
{ required: true, message: '请输入密码', trigger: 'blur' },
|
||||
{
|
||||
min: 6,
|
||||
max: 16,
|
||||
message: '长度在 6 到 16 个字符',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{ validator: validatePwd, trigger: 'blur' }
|
||||
],
|
||||
confirmPwd: [
|
||||
{ required: true, message: '请确认密码', trigger: 'blur' },
|
||||
{
|
||||
min: 6,
|
||||
max: 16,
|
||||
message: '长度在 6 到 16 个字符',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{
|
||||
validator: (rule: any, value: string, callback: any) => {
|
||||
if (value === '') {
|
||||
callback(new Error('请再次输入密码'))
|
||||
} else if (value !== form.newPwd) {
|
||||
callback(new Error('两次输入密码不一致!'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur',
|
||||
required: true
|
||||
}
|
||||
]
|
||||
}
|
||||
const dialogVisible = ref(false)
|
||||
const title = ref('新增菜单')
|
||||
const open = (id: string, loginName: string) => {
|
||||
form.id = id
|
||||
form.loginName = loginName
|
||||
form.newPwd = ''
|
||||
form.confirmPwd = ''
|
||||
dialogVisible.value = true
|
||||
}
|
||||
const submit = async () => {
|
||||
formRef.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
updatePassword({
|
||||
id: form.id,
|
||||
newPassword: form.newPwd
|
||||
}).then((res: any) => {
|
||||
ElMessage.success('密码修改成功')
|
||||
dialogVisible.value = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<template>
|
||||
<el-dialog width='500px' draggable v-model.trim="dialogVisible" title="修改密码">
|
||||
<el-scrollbar>
|
||||
<el-form :inline="false" :model="form" label-width="120px" class="form-one" :rules="rules" ref="formRef">
|
||||
<el-form-item label="新密码" prop="newPwd">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.newPwd" type="password"
|
||||
placeholder="请输入新密码" show-password />
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码" prop="confirmPwd">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.confirmPwd" type="password"
|
||||
placeholder="请输入确认密码" show-password />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { validatePwd } from '@/utils/common'
|
||||
import { passwordConfirm, updatePassword } from '@/api/user-boot/user'
|
||||
import { debug } from 'console'
|
||||
|
||||
const formRef = ref()
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
const form = reactive({
|
||||
id: '',
|
||||
newPwd: '',
|
||||
confirmPwd: '',
|
||||
loginName: ''
|
||||
})
|
||||
const rules = {
|
||||
newPwd: [
|
||||
{ required: true, message: '请输入密码', trigger: 'blur' },
|
||||
{
|
||||
min: 6,
|
||||
max: 16,
|
||||
message: '长度在 6 到 16 个字符',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{ validator: validatePwd, trigger: 'blur' }
|
||||
],
|
||||
confirmPwd: [
|
||||
{ required: true, message: '请确认密码', trigger: 'blur' },
|
||||
{
|
||||
min: 6,
|
||||
max: 16,
|
||||
message: '长度在 6 到 16 个字符',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{
|
||||
validator: (rule: any, value: string, callback: any) => {
|
||||
if (value === '') {
|
||||
callback(new Error('请再次输入密码'))
|
||||
} else if (value !== form.newPwd) {
|
||||
callback(new Error('两次输入密码不一致!'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur',
|
||||
required: true
|
||||
}
|
||||
]
|
||||
}
|
||||
const dialogVisible = ref(false)
|
||||
const title = ref('新增菜单')
|
||||
const open = (id: string, loginName: string) => {
|
||||
form.id = id
|
||||
form.loginName = loginName
|
||||
form.newPwd = ''
|
||||
form.confirmPwd = ''
|
||||
dialogVisible.value = true
|
||||
}
|
||||
const submit = async () => {
|
||||
formRef.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
updatePassword({
|
||||
id: form.id,
|
||||
newPassword: form.newPwd
|
||||
}).then((res: any) => {
|
||||
ElMessage.success('密码修改成功')
|
||||
dialogVisible.value = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user