fix: 修复正则校验问题
This commit is contained in:
parent
ed875f7786
commit
e381db8ba7
@ -19,6 +19,8 @@ interface Props {
|
||||
tooltipContent?: string;
|
||||
/** Tooltip placement */
|
||||
tooltipPlacement?: PopoverPlacement;
|
||||
/** Popconfirm content */
|
||||
popconfirmContent?: string;
|
||||
zIndex?: number;
|
||||
quaternary?: boolean;
|
||||
[key: string]: any;
|
||||
@ -30,10 +32,17 @@ const props = withDefaults(defineProps<Props>(), {
|
||||
localIcon: '',
|
||||
tooltipContent: '',
|
||||
tooltipPlacement: 'bottom',
|
||||
popconfirmContent: '',
|
||||
zIndex: 98,
|
||||
quaternary: true
|
||||
});
|
||||
|
||||
interface Emits {
|
||||
(e: 'positiveClick'): void;
|
||||
}
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
const DEFAULT_CLASS = 'h-[36px] text-icon';
|
||||
|
||||
const attrs: ButtonProps = useAttrs();
|
||||
@ -41,19 +50,33 @@ const attrs: ButtonProps = useAttrs();
|
||||
const quaternary = computed(() => {
|
||||
return !(attrs.text || attrs.dashed || attrs.ghost) && props.quaternary;
|
||||
});
|
||||
|
||||
const handlePositiveClick = () => {
|
||||
emit('positiveClick');
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NTooltip :placement="tooltipPlacement" :z-index="zIndex" :disabled="!tooltipContent">
|
||||
<template #trigger>
|
||||
<NButton :quaternary="quaternary" :class="twMerge(DEFAULT_CLASS, props.class)" :focusable="false" v-bind="attrs">
|
||||
<div class="flex-center gap-8px">
|
||||
<slot>
|
||||
<SvgIcon v-if="icon" :icon="icon" />
|
||||
<SvgIcon v-else :local-icon="localIcon" />
|
||||
</slot>
|
||||
</div>
|
||||
</NButton>
|
||||
<NPopconfirm :disabled="!popconfirmContent" @positive-click="handlePositiveClick">
|
||||
{{ popconfirmContent }}
|
||||
<template #trigger>
|
||||
<NButton
|
||||
:quaternary="quaternary"
|
||||
:class="twMerge(DEFAULT_CLASS, props.class)"
|
||||
:focusable="false"
|
||||
v-bind="attrs"
|
||||
>
|
||||
<div class="flex-center gap-8px">
|
||||
<slot>
|
||||
<SvgIcon v-if="icon" :icon="icon" />
|
||||
<SvgIcon v-else :local-icon="localIcon" />
|
||||
</slot>
|
||||
</div>
|
||||
</NButton>
|
||||
</template>
|
||||
</NPopconfirm>
|
||||
</template>
|
||||
{{ tooltipContent }}
|
||||
</NTooltip>
|
||||
|
@ -1,85 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, useAttrs } from 'vue';
|
||||
import type { ButtonProps, PopoverPlacement } from 'naive-ui';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
|
||||
defineOptions({
|
||||
name: 'ButtonPopconfirm',
|
||||
inheritAttrs: false
|
||||
});
|
||||
|
||||
interface Props {
|
||||
/** Button class */
|
||||
class?: string;
|
||||
/** Iconify icon name */
|
||||
icon?: string;
|
||||
/** Local icon name */
|
||||
localIcon?: string;
|
||||
/** Tooltip content */
|
||||
tooltipContent?: string;
|
||||
/** Tooltip placement */
|
||||
tooltipPlacement?: PopoverPlacement;
|
||||
/** Popconfirm content */
|
||||
popconfirmContent?: string;
|
||||
zIndex?: number;
|
||||
quaternary?: boolean;
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
class: '',
|
||||
icon: '',
|
||||
localIcon: '',
|
||||
tooltipContent: '',
|
||||
tooltipPlacement: 'bottom',
|
||||
popconfirmContent: '',
|
||||
zIndex: 98,
|
||||
quaternary: true
|
||||
});
|
||||
|
||||
interface Emits {
|
||||
(e: 'positiveClick'): void;
|
||||
}
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
const DEFAULT_CLASS = 'h-[36px] text-icon';
|
||||
|
||||
const attrs: ButtonProps = useAttrs();
|
||||
|
||||
const quaternary = computed(() => {
|
||||
return !(attrs.text || attrs.dashed || attrs.ghost) && props.quaternary;
|
||||
});
|
||||
|
||||
const handlePositiveClick = () => {
|
||||
emit('positiveClick');
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NTooltip :placement="tooltipPlacement" :z-index="zIndex" :disabled="!tooltipContent">
|
||||
<template #trigger>
|
||||
<NPopconfirm :disabled="!popconfirmContent" @positive-click="handlePositiveClick">
|
||||
{{ popconfirmContent }}
|
||||
<template #trigger>
|
||||
<NButton
|
||||
:quaternary="quaternary"
|
||||
:class="twMerge(DEFAULT_CLASS, props.class)"
|
||||
:focusable="false"
|
||||
v-bind="attrs"
|
||||
>
|
||||
<div class="flex-center gap-8px">
|
||||
<slot>
|
||||
<SvgIcon v-if="icon" :icon="icon" />
|
||||
<SvgIcon v-else :local-icon="localIcon" />
|
||||
</slot>
|
||||
</div>
|
||||
</NButton>
|
||||
</template>
|
||||
</NPopconfirm>
|
||||
</template>
|
||||
{{ tooltipContent }}
|
||||
</NTooltip>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
@ -50,7 +50,7 @@ export function useFormRules() {
|
||||
function createRequiredRule(message: string): App.Global.FormRule {
|
||||
return {
|
||||
required: true,
|
||||
trigger: ['change', 'blur'],
|
||||
trigger: ['input', 'blur'],
|
||||
validator: (_rule: any, value: any) => {
|
||||
if (value === null || value === undefined || value === '') {
|
||||
return new Error(message);
|
||||
|
@ -40,8 +40,8 @@ const rules = computed<Record<RuleKey, App.Global.FormRule[]>>(() => {
|
||||
const { formRules, createRequiredRule } = useFormRules();
|
||||
|
||||
const loginRules: Record<RuleKey, App.Global.FormRule[]> = {
|
||||
username: formRules.userName,
|
||||
password: formRules.pwd,
|
||||
username: [...formRules.userName, { required: true }],
|
||||
password: [...formRules.pwd, { required: true }],
|
||||
code: captchaEnabled.value ? [createRequiredRule($t('form.code.required'))] : [],
|
||||
tenantId: tenantEnabled.value ? formRules.tenantId : []
|
||||
};
|
||||
|
@ -35,8 +35,8 @@ const rules = computed<Record<RuleKey, App.Global.FormRule[]>>(() => {
|
||||
|
||||
return {
|
||||
tenantId: tenantEnabled.value ? formRules.tenantId : [],
|
||||
username: formRules.userName,
|
||||
password: formRules.pwd,
|
||||
username: [...formRules.userName, { required: true }],
|
||||
password: [...formRules.pwd, { required: true }],
|
||||
confirmPassword: createConfirmPwdRule(model.password!),
|
||||
code: captchaEnabled.value ? [createRequiredRule($t('form.code.required'))] : []
|
||||
};
|
||||
|
@ -10,7 +10,6 @@ import { useAuth } from '@/hooks/business/auth';
|
||||
import ButtonIcon from '@/components/custom/button-icon.vue';
|
||||
import DictTag from '@/components/custom/dict-tag.vue';
|
||||
import { $t } from '@/locales';
|
||||
import ButtonPopconfirm from '@/components/custom/button-popconfirm.vue';
|
||||
import UserOperateDrawer from './modules/user-operate-drawer.vue';
|
||||
import UserSearch from './modules/user-search.vue';
|
||||
|
||||
@ -129,10 +128,11 @@ const {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<ButtonPopconfirm
|
||||
<ButtonIcon
|
||||
text
|
||||
type="error"
|
||||
icon="material-symbols:delete-outline"
|
||||
tooltipContent={$t('common.delete')}
|
||||
popconfirmContent={$t('common.confirmDelete')}
|
||||
onPositiveClick={() => handleDelete(row.userId!)}
|
||||
/>
|
||||
|
@ -70,7 +70,7 @@ type RuleKey = Extract<keyof Model, 'userName' | 'nickName' | 'password' | 'stat
|
||||
const rules: Record<RuleKey, App.Global.FormRule[]> = {
|
||||
userName: [createRequiredRule('用户名称不能为空')],
|
||||
nickName: [createRequiredRule('用户昵称不能为空')],
|
||||
password: [createRequiredRule('密码不能为空'), patternRules.pwd],
|
||||
password: [{ ...patternRules.pwd, required: true }],
|
||||
phonenumber: [patternRules.phone],
|
||||
status: [createRequiredRule('帐号状态不能为空')]
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user