|
|
|
@ -1,10 +1,13 @@ |
|
|
|
|
<script setup name="DictForm"> |
|
|
|
|
import { onMounted, h, watch, reactive } from 'vue'; |
|
|
|
|
import { onMounted, h, watch, reactive, ref } from 'vue'; |
|
|
|
|
import { useBaseDataStore } from '@/stores/baseData.js'; |
|
|
|
|
import { ReloadOutlined, SettingOutlined } from '@ant-design/icons-vue'; |
|
|
|
|
const baseDataStore = useBaseDataStore(); |
|
|
|
|
|
|
|
|
|
const props = defineProps({ |
|
|
|
|
status: { |
|
|
|
|
type: Boolean, |
|
|
|
|
}, |
|
|
|
|
form: { |
|
|
|
|
type: Object, |
|
|
|
|
default: () => ({ |
|
|
|
@ -46,6 +49,9 @@ const props = defineProps({ |
|
|
|
|
const form = reactive({ |
|
|
|
|
...props.form, |
|
|
|
|
}); |
|
|
|
|
// ! ref |
|
|
|
|
const bodyRef = ref(null); |
|
|
|
|
const offsetBottom = ref(null); |
|
|
|
|
// ! pid |
|
|
|
|
watch(form, (newVal, oldVal) => { |
|
|
|
|
if (form.pid != '') { |
|
|
|
@ -58,6 +64,8 @@ watch(form, (newVal, oldVal) => { |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
onMounted(() => { |
|
|
|
|
window.pino.info('DictForm Mounted'); |
|
|
|
|
offsetBottom.value = 0; |
|
|
|
|
// ! 检测获取字典列表 |
|
|
|
|
if (baseDataStore.state.dictList?.length == 0) { |
|
|
|
|
baseDataStore.getDictList(); |
|
|
|
@ -66,10 +74,15 @@ onMounted(() => { |
|
|
|
|
if (baseDataStore.state.serviceList?.length == 0) { |
|
|
|
|
baseDataStore.getServiceList(); |
|
|
|
|
} |
|
|
|
|
console.log(props); |
|
|
|
|
}); |
|
|
|
|
function change(affixed) { |
|
|
|
|
console.log(affixed); |
|
|
|
|
} |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<template> |
|
|
|
|
<div ref="bodyRef" v-if="props.status"> |
|
|
|
|
<AForm :model="form" name="DictForm" :label-col="{ span: 8 }" layout="vertical"> |
|
|
|
|
<AFormItem label="上级字典" name="pid"> |
|
|
|
|
<AFlex gap="small"> |
|
|
|
@ -91,19 +104,19 @@ onMounted(() => { |
|
|
|
|
</AFormItem> |
|
|
|
|
|
|
|
|
|
<AFormItem label="字典名称" name="dictName"> |
|
|
|
|
<AInput style="width: 100%" v-model:value="form.dictName" placeholder="请输入字典名称" :maxlength="32" showCount/> |
|
|
|
|
<AInput style="width: 100%" v-model:value="form.dictName" placeholder="请输入字典名称" :maxlength="32" showCount /> |
|
|
|
|
</AFormItem> |
|
|
|
|
|
|
|
|
|
<AFormItem label="字典类型" name="dictType"> |
|
|
|
|
<ASelect placeholder="请选择字典类型" ref="dictType" v-model:value="form.dictType" :options="baseDataStore.state.dictTypeList"/> |
|
|
|
|
<ASelect placeholder="请选择字典类型" ref="dictType" v-model:value="form.dictType" :options="baseDataStore.state.dictTypeList" /> |
|
|
|
|
</AFormItem> |
|
|
|
|
|
|
|
|
|
<AFormItem label="字典图标" name="dictIcon"> |
|
|
|
|
<ASelect placeholder="请选择字典图标" ref="dictIcon" v-model:value="form.dictIcon" :options="baseDataStore.state.dictTypeList"/> |
|
|
|
|
<ASelect placeholder="请选择字典图标" ref="dictIcon" v-model:value="form.dictIcon" :options="baseDataStore.state.dictTypeList" /> |
|
|
|
|
</AFormItem> |
|
|
|
|
|
|
|
|
|
<AFormItem label="字典描述" name="dictDesc"> |
|
|
|
|
<ATextarea style="width: 100%" v-model:value="form.dictDesc" :rows="3" placeholder="请输入字典描述" :maxlength="255" showCount/> |
|
|
|
|
<ATextarea style="width: 100%" v-model:value="form.dictDesc" :rows="3" placeholder="请输入字典描述" :maxlength="255" showCount /> |
|
|
|
|
</AFormItem> |
|
|
|
|
<AFormItem label="原始数据Root" name="root"> |
|
|
|
|
<ARadioGroup v-model:value="form.root" name="radioGroup"> |
|
|
|
@ -113,10 +126,14 @@ onMounted(() => { |
|
|
|
|
</AFormItem> |
|
|
|
|
<AFormItem label="排序" name="orderNum"> |
|
|
|
|
<AInputNumber v-model:value="form.orderNum"> |
|
|
|
|
<template #addonAfter><SettingOutlined/></template> |
|
|
|
|
<template #addonAfter><SettingOutlined /></template> |
|
|
|
|
</AInputNumber> |
|
|
|
|
</AFormItem> |
|
|
|
|
</AForm> |
|
|
|
|
<AAffix :target="() => bodyRef" :offset-bottom="0"> |
|
|
|
|
<AckCreateAntdButton @click="props.handleAck" /> |
|
|
|
|
</AAffix> |
|
|
|
|
</div> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<style scoped></style> |
|
|
|
|