master
parent
c6b90e1b62
commit
95c15c2f5d
@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-modal
|
||||
title="充值"
|
||||
:visible="visible"
|
||||
:confirm-loading="submitLoading"
|
||||
:mask-closable="false"
|
||||
:width="400"
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleClose"
|
||||
>
|
||||
<a-spin :spinning="submitLoading">
|
||||
<a-form :model="formModel" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form-item label="线索数量">
|
||||
<!-- <a-input v-model:value="formModel.clueNumber" placeholder="用户名" /> -->
|
||||
<a-input-number
|
||||
id="inputNumber"
|
||||
v-model:value="formModel.clueNumber"
|
||||
:min="0"
|
||||
placeholder="线索数量"
|
||||
style="width: 140px"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { updateUserPassword } from '@/api/system/user'
|
||||
import type { SysUserPassDTO } from '@/api/system/user/types'
|
||||
import type { SysUserPageVO } from '@/api/system/user/types'
|
||||
import { passEncrypt } from '@/utils/password-utils'
|
||||
import type { Rule } from 'ant-design-vue/es/form'
|
||||
import { FormAction, useAdminForm } from '@/hooks/form'
|
||||
import type { FormRequestMapping } from '@/hooks/form'
|
||||
import { useModal } from '@/hooks/modal'
|
||||
|
||||
type ChangePasswordFormModel = SysUserPassDTO & {
|
||||
clueNumber?: number | undefined
|
||||
}
|
||||
|
||||
const { visible, openModal, closeModal } = useModal()
|
||||
|
||||
const labelCol = {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
}
|
||||
|
||||
const wrapperCol = {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
}
|
||||
|
||||
/** 校验密码 */
|
||||
const validatePass = async (_rule: Rule, value: string) => {
|
||||
if (value === '') {
|
||||
return Promise.reject('请输入新密码!')
|
||||
} else {
|
||||
if (formModel.confirmPass !== '') {
|
||||
validate('confirmPass')
|
||||
}
|
||||
return Promise.resolve()
|
||||
}
|
||||
}
|
||||
|
||||
/** 校验 confirm 密码 */
|
||||
const validateConfirmPass = async (_rule: Rule, value: string) => {
|
||||
if (value === '') {
|
||||
return Promise.reject('请确认新密码!')
|
||||
} else if (value !== formModel.pass) {
|
||||
return Promise.reject('两次输入的密码不一致!')
|
||||
} else {
|
||||
return Promise.resolve()
|
||||
}
|
||||
}
|
||||
interface chargeFormModel {
|
||||
clueNumber?: number | undefined
|
||||
}
|
||||
// 表单模型
|
||||
const formModel = reactive<chargeFormModel>({
|
||||
// username: '',
|
||||
// pass: '',
|
||||
// confirmPass: '',
|
||||
clueNumber: undefined
|
||||
})
|
||||
|
||||
// 表单校验规则
|
||||
const formRule = reactive({
|
||||
pass: [{ required: true, validator: validatePass, trigger: 'change' }],
|
||||
confirmPass: [{ required: true, validator: validateConfirmPass, trigger: 'change' }]
|
||||
})
|
||||
|
||||
// 表单的提交请求
|
||||
const formRequestMapping: FormRequestMapping<ChangePasswordFormModel> = {
|
||||
[FormAction.OTHER]: () => {
|
||||
return updateUserPassword(formModel.userId!, {
|
||||
pass: passEncrypt(formModel.pass),
|
||||
confirmPass: passEncrypt(formModel.confirmPass)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const formAction = FormAction.OTHER
|
||||
|
||||
const { submitLoading, validateAndSubmit, resetFields, validate, validateInfos } = useAdminForm(
|
||||
formAction,
|
||||
formRequestMapping,
|
||||
formModel,
|
||||
formRule
|
||||
)
|
||||
|
||||
/** 表单提交方法 */
|
||||
const handleSubmit = () => {
|
||||
validateAndSubmit(
|
||||
{ ...formModel },
|
||||
{
|
||||
onSuccess: () => {
|
||||
closeModal()
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
/* 弹窗关闭方法 */
|
||||
const handleClose = () => {
|
||||
closeModal()
|
||||
submitLoading.value = false
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
open(record: SysUserPageVO) {
|
||||
resetFields()
|
||||
openModal()
|
||||
formModel.userId = record.userId
|
||||
formModel.username = record.username
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
/deep/ .ant-input-number {
|
||||
width: 160px !important;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<a-modal
|
||||
title="充值"
|
||||
:visible="visible"
|
||||
:confirm-loading="submitLoading"
|
||||
:mask-closable="false"
|
||||
:width="400"
|
||||
@ok="handleSubmit"
|
||||
@cancel="handleClose"
|
||||
>
|
||||
<a-spin :spinning="submitLoading">
|
||||
<a-form :model="formModel" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||
<a-form-item label="线索数量">
|
||||
<!-- <a-input v-model:value="formModel.clueNumber" placeholder="用户名" /> -->
|
||||
<a-input-number
|
||||
id="inputNumber"
|
||||
v-model:value="formModel.clueNumber"
|
||||
:min="0"
|
||||
placeholder="线索数量"
|
||||
style="width: 140px"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { updateUserPassword } from '@/api/system/user'
|
||||
import type { SysUserPassDTO } from '@/api/system/user/types'
|
||||
import type { SysUserPageVO } from '@/api/system/user/types'
|
||||
import { passEncrypt } from '@/utils/password-utils'
|
||||
import type { Rule } from 'ant-design-vue/es/form'
|
||||
import { FormAction, useAdminForm } from '@/hooks/form'
|
||||
import type { FormRequestMapping } from '@/hooks/form'
|
||||
import { useModal } from '@/hooks/modal'
|
||||
|
||||
type ChangePasswordFormModel = SysUserPassDTO & {
|
||||
clueNumber?: number | undefined
|
||||
}
|
||||
|
||||
const { visible, openModal, closeModal } = useModal()
|
||||
|
||||
const labelCol = {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 }
|
||||
}
|
||||
|
||||
const wrapperCol = {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 }
|
||||
}
|
||||
|
||||
/** 校验密码 */
|
||||
const validatePass = async (_rule: Rule, value: string) => {
|
||||
if (value === '') {
|
||||
return Promise.reject('请输入新密码!')
|
||||
} else {
|
||||
if (formModel.confirmPass !== '') {
|
||||
validate('confirmPass')
|
||||
}
|
||||
return Promise.resolve()
|
||||
}
|
||||
}
|
||||
|
||||
/** 校验 confirm 密码 */
|
||||
const validateConfirmPass = async (_rule: Rule, value: string) => {
|
||||
if (value === '') {
|
||||
return Promise.reject('请确认新密码!')
|
||||
} else if (value !== formModel.pass) {
|
||||
return Promise.reject('两次输入的密码不一致!')
|
||||
} else {
|
||||
return Promise.resolve()
|
||||
}
|
||||
}
|
||||
interface chargeFormModel {
|
||||
clueNumber?: number | undefined
|
||||
}
|
||||
// 表单模型
|
||||
const formModel = reactive<chargeFormModel>({
|
||||
// username: '',
|
||||
// pass: '',
|
||||
// confirmPass: '',
|
||||
clueNumber: undefined
|
||||
})
|
||||
|
||||
// 表单校验规则
|
||||
const formRule = reactive({
|
||||
pass: [{ required: true, validator: validatePass, trigger: 'change' }],
|
||||
confirmPass: [{ required: true, validator: validateConfirmPass, trigger: 'change' }]
|
||||
})
|
||||
|
||||
// 表单的提交请求
|
||||
const formRequestMapping: FormRequestMapping<ChangePasswordFormModel> = {
|
||||
[FormAction.OTHER]: () => {
|
||||
return updateUserPassword(formModel.userId!, {
|
||||
pass: passEncrypt(formModel.pass),
|
||||
confirmPass: passEncrypt(formModel.confirmPass)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const formAction = FormAction.OTHER
|
||||
|
||||
const { submitLoading, validateAndSubmit, resetFields, validate, validateInfos } = useAdminForm(
|
||||
formAction,
|
||||
formRequestMapping,
|
||||
formModel,
|
||||
formRule
|
||||
)
|
||||
|
||||
/** 表单提交方法 */
|
||||
const handleSubmit = () => {
|
||||
validateAndSubmit(
|
||||
{ ...formModel },
|
||||
{
|
||||
onSuccess: () => {
|
||||
closeModal()
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
/* 弹窗关闭方法 */
|
||||
const handleClose = () => {
|
||||
closeModal()
|
||||
submitLoading.value = false
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
open(record: SysUserPageVO) {
|
||||
resetFields()
|
||||
openModal()
|
||||
formModel.userId = record.userId
|
||||
formModel.username = record.username
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
::v-deep .ant-input-number {
|
||||
width: 120px;
|
||||
}
|
||||
</style>
|
Loading…
Reference in New Issue