Browse Source

chore: 调整样式

master
wangxiang 1 year ago
parent
commit
5ab2f43b3a
  1. 114
      src/views/system/devtools/genCustomObj/GenCustomObjModal.vue
  2. 7
      src/views/system/devtools/genCustomObj/genCustomObj.data.ts

114
src/views/system/devtools/genCustomObj/GenCustomObjModal.vue

@ -1,48 +1,51 @@
<template> <template>
<BasicModal <div ref="modal" :class="prefixCls">
v-bind="$attrs" <BasicModal
width="820px" v-bind="$attrs"
@register="registerModal" width="820px"
@ok="handleSubmit" :getContainer="modal"
> @register="registerModal"
<BasicForm @register="registerForm"/> @ok="handleSubmit"
<BasicTable @register="gencodeCustomFieldRegisterTable"> >
<template #toolbar> <BasicForm @register="registerForm"/>
<a-button <BasicTable v-show="state.tableVisible" @register="gencodeCustomFieldRegisterTable">
v-show="state.tag != 'view'" <template #toolbar>
type="primary" <a-button
@click="handleAdd()" v-show="state.tag != 'view'"
>新增</a-button> type="primary"
</template> @click="handleAdd()"
<template #bodyCell="{ index, column, record }"> >新增</a-button>
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '查看',
icon: 'fa-regular:eye',
onClick: handleViewEdit.bind(null, record)
},
{
label: '编辑',
icon: 'fa6-regular:pen-to-square',
onClick: handleEdit.bind(null, record, index)
},
{
label: '删除',
icon: 'ant-design:delete-outlined',
color: 'error',
onClick: handleDel.bind(null, record, index)
}]"
/>
</template> </template>
</template> <template #bodyCell="{ index, column, record }">
</BasicTable> <template v-if="column.key === 'action'">
<GencodeCustomFieldModal @register="gencodeCustomFieldRegisterModal" @success="handleGencodeCustomField"/> <TableAction
</BasicModal> :actions="[
{
label: '查看',
icon: 'fa-regular:eye',
onClick: handleViewEdit.bind(null, record)
},
{
label: '编辑',
icon: 'fa6-regular:pen-to-square',
onClick: handleEdit.bind(null, record, index)
},
{
label: '删除',
icon: 'ant-design:delete-outlined',
color: 'error',
onClick: handleDel.bind(null, record, index)
}]"
/>
</template>
</template>
</BasicTable>
<GencodeCustomFieldModal @register="gencodeCustomFieldRegisterModal" @success="handleGencodeCustomField"/>
</BasicModal>
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { reactive, computed } from 'vue'; import {reactive, computed, ref} from 'vue';
import { BasicForm, useForm } from '/@/components/Form/index'; import { BasicForm, useForm } from '/@/components/Form/index';
import { formSchema, gencodeCustomFieldColumns } from './genCustomObj.data'; import { formSchema, gencodeCustomFieldColumns } from './genCustomObj.data';
import { saveAndGencodeCustomField, getGencodeCustomObj, selectListByValue } from '/@/api/platform/system/controller/gencodeCustomObj'; import { saveAndGencodeCustomField, getGencodeCustomObj, selectListByValue } from '/@/api/platform/system/controller/gencodeCustomObj';
@ -52,16 +55,21 @@
import { useMessage } from '/@/hooks/web/useMessage'; import { useMessage } from '/@/hooks/web/useMessage';
import { isNil } from 'lodash-es'; import { isNil } from 'lodash-es';
import { isEmpty } from '/@/utils/is'; import { isEmpty } from '/@/utils/is';
import {useDesign} from '/@/hooks/web/useDesign';
/** 通用变量统一声明区域 */ /** 通用变量统一声明区域 */
interface WindowState { interface WindowState {
tag: string; tag: string;
dataSource: Recordable[]; dataSource: Recordable[];
tableVisible: boolean;
} }
const state = reactive<WindowState>({ const state = reactive<WindowState>({
tag: '', tag: '',
dataSource: [] dataSource: [],
tableVisible: false
}); });
const modal = ref();
const { prefixCls } = useDesign('gen-custom-obj');
const { createConfirm, createMessage } = useMessage(); const { createConfirm, createMessage } = useMessage();
/** https://v3.cn.vuejs.org/api/options-data.html#emits */ /** https://v3.cn.vuejs.org/api/options-data.html#emits */
const emit = defineEmits(['success', 'register']); const emit = defineEmits(['success', 'register']);
@ -99,10 +107,11 @@
// //
state.tag = data._tag; state.tag = data._tag;
state.dataSource = []; state.dataSource = [];
state.tableVisible = false;
const id = data.record?.id; const id = data.record?.id;
const classValue = data.record?.value; const classValue = data.record?.value;
const props: Partial<ModalProps> = { confirmLoading: false, showOkBtn: true }; const props: Partial<ModalProps> = { confirmLoading: false, showOkBtn: true };
await updateSchema({ await updateSchema([{
field: 'value', field: 'value',
componentProps: { componentProps: {
disabled: state.tag != 'add' disabled: state.tag != 'add'
@ -123,7 +132,13 @@
}, },
validateTrigger: 'blur' validateTrigger: 'blur'
}] }]
}); },
{
field: 'type',
componentProps: {
onChange: (e: ChangeEvent) => state.tableVisible = e.target.value == '0'
}
}]);
// tag // tag
switch (state.tag) { switch (state.tag) {
case 'add': case 'add':
@ -134,12 +149,14 @@
props.showOkBtn = false; props.showOkBtn = false;
const getGencodeCustomObjView = await getGencodeCustomObj(id); const getGencodeCustomObjView = await getGencodeCustomObj(id);
state.dataSource = getGencodeCustomObjView?.gencodeCustomFieldList || []; state.dataSource = getGencodeCustomObjView?.gencodeCustomFieldList || [];
state.tableVisible = getGencodeCustomObjView.type == '0';
await setFieldsValue(getGencodeCustomObjView); await setFieldsValue(getGencodeCustomObjView);
break; break;
case 'edit': case 'edit':
props.title = '编辑java类型'; props.title = '编辑java类型';
const getGencodeCustomObjEdit = await getGencodeCustomObj(id); const getGencodeCustomObjEdit = await getGencodeCustomObj(id);
state.dataSource = getGencodeCustomObjEdit?.gencodeCustomFieldList || []; state.dataSource = getGencodeCustomObjEdit?.gencodeCustomFieldList || [];
state.tableVisible = getGencodeCustomObjEdit.type == '0';
await setFieldsValue(getGencodeCustomObjEdit); await setFieldsValue(getGencodeCustomObjEdit);
break; break;
} }
@ -194,3 +211,12 @@
} }
} }
</script> </script>
<style scoped lang="less">
@prefix-cls: ~'@{namespace}-gen-custom-obj';
.@{prefix-cls} {
:deep(.ant-modal) {
top: 40px;
}
}
</style>

7
src/views/system/devtools/genCustomObj/genCustomObj.data.ts

@ -83,7 +83,6 @@ export const formSchema: FormSchema[] = [
label: '排序', label: '排序',
component: 'InputNumber', component: 'InputNumber',
colProps: { span: 16 }, colProps: { span: 16 },
defaultValue: 1,
required: true, required: true,
componentProps: { componentProps: {
style: { width:'100%' }, style: { width:'100%' },
@ -96,11 +95,11 @@ export const formSchema: FormSchema[] = [
component: 'RadioGroup', component: 'RadioGroup',
colProps: { span: 16 }, colProps: { span: 16 },
required: true, required: true,
defaultValue: '0', defaultValue: '1',
componentProps: { componentProps: {
options: [ options: [
{ label: '是', value: '0' }, { label: '是', value: '1' },
{ label: '否', value: '1' } { label: '否', value: '0' }
] ]
} }
} }

Loading…
Cancel
Save