From 745815f637e5385b2cbc23a6ae02401bb8b6c675 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期六, 08 三月 2025 14:22:36 +0800
Subject: [PATCH] 详情页面优化
---
src/views/tigerprojects/system/lowcode/detail/detail.vue | 258 +++++++++++++++++++++++++++++++++++++--------------
1 files changed, 187 insertions(+), 71 deletions(-)
diff --git a/src/views/tigerprojects/system/lowcode/detail/detail.vue b/src/views/tigerprojects/system/lowcode/detail/detail.vue
index 38b9a5c..4326f66 100644
--- a/src/views/tigerprojects/system/lowcode/detail/detail.vue
+++ b/src/views/tigerprojects/system/lowcode/detail/detail.vue
@@ -2,7 +2,15 @@
<div>
<BasicTable @register="registerTable">
<template #toolbar>
- <a-button type="primary" @click="handleCreate" preIcon="add_02|svg"> 鏂板 </a-button>
+ <a-button
+ type="primary"
+ v-for="item in buttons.filter((m) => m['BUTTON_TYPE'] == 0)"
+ @click="handleCreate(item['DO_METHOD'])"
+ :preIcon="item['ICON_URL']"
+ :key="item"
+ >
+ {{ item['FUNC_NAME'] }}
+ </a-button>
</template>
<template #action="{ record }">
<TableAction :actions="createActions(record)" />
@@ -22,25 +30,59 @@
/>
</template>
</BasicTable>
+ <Suspense>
+ <CustModal
+ @register="registerCust"
+ @success="custSuccess"
+ @cancel="custCancel"
+ :type="cType"
+ :entityName="entityName"
+ @modalInner="getdtlSlots"
+ >
+ <!-- 鐢ㄦ彃妲借嚜瀹氫箟澶氳〃鍗� -->
+ <template #[item.name] v-for="item in dtlSlots" :key="item.name">
+ <BasicForm @register="useFormData[item.name][0]" v-if="useFormData[item.name]">
+ <!-- 鐢ㄦ彃妲借嚜瀹氫箟寮瑰嚭閫夋嫨妗� -->
+ <template #[name]="{ field }" v-for="name in item.slots" :key="name">
+ <a-button
+ class="mt-1 ml-1"
+ size="small"
+ @click="handleCustClick(field)"
+ :preIcon="item.preIcons[name]"
+ />
+ <GeneralModal
+ @register="useModalData[name][0]"
+ @success="(d, u) => handleEntSuccess(d, u, item.name)"
+ />
+ </template>
+ </BasicForm>
+ <!-- 鑷畾涔夊唴瀹� -->
+ </template>
+ </CustModal>
+ </Suspense>
<normalDrawer @register="registerDrawer" @success="handleSuccess" />
</div>
</template>
<script lang="ts" setup>
import { Ref, inject, onMounted, ref } from 'vue';
- import { BasicTable, useTable, TableAction } from '/@/components/Table';
- import { useForm } from '/@/components/Form/index';
+ import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table';
+ import { BasicForm, useForm } from '/@/components/Form/index';
import { useDrawer } from '/@/components/Drawer';
import GeneralModal from '/@/views/components/GeneralModal.vue';
import normalDrawer from '../normalDrawer.vue';
- import { isNullOrUnDef } from '/@/utils/is';
+ import CustModal from '/@/views/components/CustModal.vue';
+ import { isFunction, isNullOrUnDef } from '/@/utils/is';
import { useModal } from '/@/components/Modal';
import { useGo } from '/@/hooks/web/usePage';
import { DeleteEntity, getListByPage } from '/@/api/tigerapi/system';
import { useI18n } from '/@/hooks/web/useI18n';
import { EntityCustFunctionType } from '/@/api/tigerapi/model/basModel';
+ import { GenerateActionButton } from '../data';
+ import { getRoleButtons } from '/@/api/sys/menu';
+ import { useRouter } from 'vue-router';
const { t } = useI18n();
-
+ const { currentRoute } = useRouter();
const props = defineProps({
useTableData: { type: Object as PropType<{}>, default: { table: [] } },
entityName: { type: String },
@@ -51,11 +93,11 @@
const go = useGo();
const [registerDrawer, { openDrawer }] = useDrawer();
const [registerItemAdd, { openModal: openItemModal }] = useModal();
+ const [registerCust, { openModal: openCustModal }] = useModal();
const cType = ref('');
+ const selectVals = ref({});
const colSlots = ref<any>(objParams['colSlots']); //鎸夐挳鎻掓Ы
const dtlSlots = ref([] as any[]);
- const useModalData = ref({}); //琛ㄥ崟涓彃妲芥覆鏌撴寜閽墦寮�妯℃�佹useModal鏂规硶
- const useFormData = ref({});
const custImport = ref<any[]>([]);
const EntityCustFunction = ref([
{
@@ -83,16 +125,29 @@
KeyFieldValues,
GetSelectSuccess,
OpenSelectItem,
+ GetUseForm,
+ GetUseModals,
},
+ ActionColumn
] = isNullOrUnDef(custImport.value['default'])
? EntityCustFunction.value
: custImport.value['default']();
- keyFieldValues.value = KeyFieldValues(objParams['CODE'], objParams['ID']);
+ const buttons = ref<[]>(await getRoleButtons(currentRoute.value.meta.menuCode as string));
+ keyFieldValues.value =
+ KeyFieldValues && isFunction(KeyFieldValues)
+ ? KeyFieldValues(objParams['CODE'], objParams['ID'])
+ : [];
+ const useformdata = GetUseForm && isFunction(GetUseForm) ? GetUseForm() : {};
+ const useFormData = ref<any>(useformdata);
+ /* 琛ㄥ崟涓彃妲芥覆鏌撴寜閽墦寮�妯℃�佹useModal鏂规硶 */
+ const modals = GetUseModals && isFunction(GetUseModals) ? GetUseModals() : { useModalData: {} };
+ const useModalData = ref(modals['useModalData']);
+ const CurrTabInfo = objParams['Tabs'].filter(q=>q.entityName == props.entityName)[0];
const [registerTable, { getForm, reload, setProps }] = useTable({
- title: `${objParams['firstTitle']}鍒楄〃`,
+ title: `${CurrTabInfo.tableTitle}鍒楄〃`,
api: getListByPage,
- searchInfo: { TABLE_NAME: objParams['Name'], ...objParams['keyFieldValues'] },
- columns: GetBaseColumns(),
+ searchInfo: { TABLE_NAME: CurrTabInfo.entityName, ...objParams['keyFieldValues'] },
+ columns: GetBaseColumns(CurrTabInfo.entityName),
formConfig: {
labelWidth: 140,
schemas: GetSearchForm(),
@@ -102,13 +157,15 @@
bordered: true,
canResize: true,
showIndexColumn: false,
- actionColumn: {
- width: 130,
- title: '鎿嶄綔',
- dataIndex: 'action',
- slots: { customRender: 'action' },
- fixed: undefined,
- }, //鑷畾涔夋搷浣滃垪
+ actionColumn: ActionColumn
+ ? ActionColumn
+ : {
+ width: 120,
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ slots: { customRender: 'action' },
+ fixed: 'right',
+ }, //鑷畾涔夋搷浣滃垪
});
onMounted(() => {});
@@ -122,7 +179,7 @@
const params = {
record,
isUpdate: true,
- ifSave: false,
+ ifSave: objParams['ifSave'],
entityName: props.entityName,
formJson: GetCrudForm(), //getFormSchema(`${entityName.value}_Crud`),
cType,
@@ -131,23 +188,12 @@
useFormData,
crudColSlots: colSlots.value,
data,
+ selectVals,
+ colSlots,
};
- const actionItem = [
- {
- icon: 'clarity:note-edit-line',
- onClick: editRecord.bind(null, openDrawer, params),
- },
- {
- icon: 'ant-design:delete-outlined',
- color: 'error',
- popConfirm: {
- title: '鏄惁纭鍒犻櫎?',
- placement: 'left',
- confirm: deleteRecord.bind(null, reload, params),
- },
- },
- ];
- if (isNullOrUnDef(custImport.value)) {
+ const _actionItem: ActionItem[] = [];
+ const actionItem = GenerateActionButton(params, buttons, openDrawer, reload,_actionItem);
+ if (isNullOrUnDef(custImport.value['default'])) {
return actionItem;
}
return nActionItem(
@@ -160,36 +206,11 @@
useModal,
go,
setProps,
+ openCustModal,
);
}
- /**
- * @description: 鍏敤缂栬緫鏂规硶
- * @param {Fn} fn
- * @param {*} params
- * @return {*}
- */
- function editRecord(fn: Fn, params: {}) {
- fn(true, params);
- }
-
- /**
- * @description: 鍏敤鍒犻櫎鏂规硶
- * @param {Fn} fn
- * @param {*} params
- * @return {*}
- */
- function deleteRecord(fn: Fn, params: {}) {
- console.log(params['record']);
- //鍒犻櫎
- DeleteEntity(params['record'], params['entityName']).then((action) => {
- if (action.IsSuccessed) {
- fn();
- }
- });
- }
-
- function handleCreate() {
+ function handleCreate(fnName: string) {
const _cruds = GetCrudForm();
let isExistSql = '';
for (const i in _cruds) {
@@ -197,15 +218,45 @@
isExistSql = _cruds[i].field;
}
}
- openDrawer(true, {
- isUpdate: false,
- ifSave: false,
- entityName: props.entityName,
- formJson: GetCrudForm(), //getFormSchema(`${entityName.value}_Crud`),
- crudColSlots: colSlots.value,
- keyFieldValues: keyFieldValues.value,
- isExistSql: isExistSql,
- });
+
+ if (isNullOrUnDef(custImport.value['default'])) {
+ openDrawer(true, {
+ isUpdate: false,
+ ifSave: objParams.value['ifSave'],
+ entityName: props.entityName,
+ formJson: _cruds, //getFormSchema(`${entityName.value}_Crud`),
+ crudColSlots: colSlots.value,
+ keyFieldValues: keyFieldValues.value,
+ isExistSql: isExistSql,
+ });
+ } else {
+ const [{ CreateAction }] = custImport.value['default']();
+ const result = CreateAction(props.entityName);
+ switch (result.action) {
+ case 'go':
+ sessionStorage.removeItem(`${result.params.Name}_update_params`);
+ // 灏嗗璞¤浆鎹负JSON瀛楃涓插苟淇濆瓨鍒皊essionStorage
+ sessionStorage.setItem(
+ `${result.params.Name}_update_params`,
+ encodeURI(JSON.stringify(result.params)),
+ );
+ go(
+ `/${result.url}/${encodeURI(JSON.stringify({ sName: `${result.params.Name}_update`, Name: result.params.Name }))}`,
+ );
+ break;
+ case 'drawer':
+ openDrawer(true, {
+ isUpdate: false,
+ ifSave: objParams.value['ifSave'],
+ entityName: props.entityName,
+ formJson: _cruds, //getFormSchema(`${entityName.value}_Crud`),
+ crudColSlots: colSlots.value,
+ keyFieldValues: keyFieldValues.value,
+ isExistSql: isExistSql,
+ });
+ break;
+ }
+ }
}
/**
@@ -237,4 +288,69 @@
function handleSelectItem(item) {
OpenSelectItem(openItemModal);
}
+
+ /**
+ * @description: 寮瑰嚭妗嗙‘瀹氳繑鍥�
+ * @param {*} d
+ * @return {*}
+ */
+ function custSuccess(d) {
+ reload();
+ }
+
+ /**
+ * @description: 寮瑰嚭妗嗗彇娑堣繑鍥�
+ * @param {*} reload
+ * @return {*}
+ */
+ function custCancel() {
+ reload();
+ }
+
+ /**
+ * @description: 鍚勮〃鍗曞唴寮瑰嚭閫夋嫨妗嗛�夋嫨鎴愬姛鍚庢柟娉�
+ * @param {*} d
+ * @param {*} u
+ * @param {*} item
+ * @return {*}
+ */
+ function handleEntSuccess(d, u, item) {
+ /* 鍔ㄦ�乮mport瀹炰綋鍚�.ts鐨勮嚜瀹氫箟鏂规硶 */
+ try {
+ var values = GetSelectSuccess(d, u);
+ selectVals.value = values; //淇濆瓨寮瑰嚭妗嗛�夋嫨鐨勭粨鏋�
+ let _val = {};
+ d.returnFieldName.map((x) => {
+ _val[x] = values[x];
+ });
+ useFormData.value[item][1].setFieldsValue(_val);
+ } catch (e) {}
+ }
+
+ /**
+ * @description: 鎵撳紑琛ㄥ崟涓殑妯℃�佹
+ * @param {*} item
+ * @return {*}
+ */
+ function handleCustClick(item) {
+ OpenSelectItem(
+ useModalData.value[item][1].openModal, //甯﹀叆openModal鏂规硶
+ item,
+ null,
+ selectVals,
+ );
+ }
+
+ /**
+ * @description: 鑾峰彇澶氳〃鍗曟彃妲藉垪琛�
+ * @param {*} d
+ * @return {*}
+ */
+ function getdtlSlots(d, callback) {
+ dtlSlots.value = d;
+ callback();
+ // setTimeout(() => {
+ // callback();
+ // }, 100);
+ }
</script>
--
Gitblit v1.9.3