refactor: 修改为computed 支持语言切换
This commit is contained in:
parent
98e3a4a34c
commit
38d39d5e3d
@ -1,5 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
|
import { $t } from '@vben/locales';
|
||||||
|
|
||||||
import { Modal, Switch } from 'ant-design-vue';
|
import { Modal, Switch } from 'ant-design-vue';
|
||||||
import { isFunction } from 'lodash-es';
|
import { isFunction } from 'lodash-es';
|
||||||
@ -7,7 +9,15 @@ import { isFunction } from 'lodash-es';
|
|||||||
type CheckedType = boolean | number | string;
|
type CheckedType = boolean | number | string;
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
|
/**
|
||||||
|
* 选中的文本
|
||||||
|
* @default i18n 启用
|
||||||
|
*/
|
||||||
checkedText?: string;
|
checkedText?: string;
|
||||||
|
/**
|
||||||
|
* 未选中的文本
|
||||||
|
* @default i18n 禁用
|
||||||
|
*/
|
||||||
unCheckedText?: string;
|
unCheckedText?: string;
|
||||||
checkedValue?: CheckedType;
|
checkedValue?: CheckedType;
|
||||||
unCheckedValue?: CheckedType;
|
unCheckedValue?: CheckedType;
|
||||||
@ -30,8 +40,8 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
checkedText: '启用',
|
checkedText: undefined,
|
||||||
unCheckedText: '禁用',
|
unCheckedText: undefined,
|
||||||
checkedValue: '0',
|
checkedValue: '0',
|
||||||
unCheckedValue: '1',
|
unCheckedValue: '1',
|
||||||
confirm: false,
|
confirm: false,
|
||||||
@ -40,6 +50,15 @@ const props = withDefaults(defineProps<Props>(), {
|
|||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
|
// 修改为computed 支持语言切换
|
||||||
|
const checkedTextComputed = computed(() => {
|
||||||
|
return props.checkedText ?? $t('pages.common.enable');
|
||||||
|
});
|
||||||
|
|
||||||
|
const unCheckedTextComputed = computed(() => {
|
||||||
|
return props.unCheckedText ?? $t('pages.common.disable');
|
||||||
|
});
|
||||||
|
|
||||||
const currentChecked = defineModel<CheckedType>('value', {
|
const currentChecked = defineModel<CheckedType>('value', {
|
||||||
default: false,
|
default: false,
|
||||||
});
|
});
|
||||||
@ -106,9 +125,9 @@ async function handleChange(checked: CheckedType, e: Event) {
|
|||||||
:loading="loading"
|
:loading="loading"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
:checked="currentChecked"
|
:checked="currentChecked"
|
||||||
:checked-children="checkedText"
|
:checked-children="checkedTextComputed"
|
||||||
:checked-value="checkedValue"
|
:checked-value="checkedValue"
|
||||||
:un-checked-children="unCheckedText"
|
:un-checked-children="unCheckedTextComputed"
|
||||||
:un-checked-value="unCheckedValue"
|
:un-checked-value="unCheckedValue"
|
||||||
@change="handleChange"
|
@change="handleChange"
|
||||||
/>
|
/>
|
||||||
|
@ -19,6 +19,8 @@
|
|||||||
"generate": "Generate",
|
"generate": "Generate",
|
||||||
"downloadLoading": "Downloading... Please wait.",
|
"downloadLoading": "Downloading... Please wait.",
|
||||||
"preview": "Preview",
|
"preview": "Preview",
|
||||||
"tip": "Tip"
|
"tip": "Tip",
|
||||||
|
"enable": "Enable",
|
||||||
|
"disable": "Disabled"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -19,6 +19,8 @@
|
|||||||
"generate": "生成",
|
"generate": "生成",
|
||||||
"downloadLoading": "下载中, 请稍后...",
|
"downloadLoading": "下载中, 请稍后...",
|
||||||
"preview": "预览",
|
"preview": "预览",
|
||||||
"tip": "提示"
|
"tip": "提示",
|
||||||
|
"enable": "启用",
|
||||||
|
"disable": "禁用"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user