From e23fdf87e6c3bc6d42198b9309617195f2efd6c0 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期六, 06 七月 2024 23:40:08 +0800
Subject: [PATCH] 高级表单优化
---
src/views/tigerprojects/system/lowcode/entityts/BAS_PKG_DTL.ts | 500 ++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 324 insertions(+), 176 deletions(-)
diff --git a/src/views/tigerprojects/system/lowcode/entityts/BAS_PKG_DTL.ts b/src/views/tigerprojects/system/lowcode/entityts/BAS_PKG_DTL.ts
index 594f4d1..768dc26 100644
--- a/src/views/tigerprojects/system/lowcode/entityts/BAS_PKG_DTL.ts
+++ b/src/views/tigerprojects/system/lowcode/entityts/BAS_PKG_DTL.ts
@@ -4,44 +4,17 @@
* @version:
* @Date: 2024-06-19 20:34:27
* @LastEditors: Ben Lin
- * @LastEditTime: 2024-06-25 12:23:19
+ * @LastEditTime: 2024-07-06 23:15:08
*/
-import { Ref } from 'vue';
+import { Ref, ref } from 'vue';
import { DeleteEntity, getEntity } from '/@/api/tigerapi/system';
-import { ActionItem, BasicColumn } from '/@/components/Table';
-import { isNullOrEmpty } from '/@/utils/is';
-import { buildUUID } from '/@/utils/uuid';
-import { useUserStore } from '/@/store/modules/user';
-import { formatToDateTime } from '/@/utils/dateUtil';
+import { ActionItem, BasicColumn, FormSchema, useTable } from '/@/components/Table';
+import { isNullOrEmpty, isNullOrUnDef } from '/@/utils/is';
+import { useDrawer } from '/@/components/Drawer';
+import { EditOperation, Search, custDel } from '../data';
function _default(): any[] {
- /**
- * @description: 鑷畾涔夊垹闄ゆ柟娉�
- * @param {Fn} args
- * @param {*} params
- * @return {*}
- */
- function custDel(args: Fn[], params: {}) {
- if (!isNullOrEmpty(params['data'])) {
- var _data = params['data'].value.filter((item) => item['ID'] != params['record']['ID']);
- params['data'].value = _data;
- args[6]({
- dataSource: [],
- });
- args[6]({
- dataSource: params['data'],
- });
- args[1]();
- } else {
- DeleteEntity(params['record'], params['entityName']).then((action) => {
- if (action.IsSuccessed) {
- args[1]();
- }
- });
- }
- }
-
const ActionColumn: BasicColumn = {
width: 80,
title: '鎿嶄綔',
@@ -50,6 +23,12 @@
fixed: undefined,
};
+ let _data = ref<any>({});
+ let record = {};
+ /**
+ * @description: 涓�浜涜嚜瀹氫箟鏂规硶
+ * @return {*}
+ */
const methods = {
/**
* @description: 鑾峰彇鏂板鎸夐挳鐨勮涓�
@@ -66,7 +45,9 @@
*/
ActionItem: (params: Recordable<any>, data, ...args): ActionItem[] => {
/* 閲嶅啓鍒犻櫎鏂规硶 */
- data[1].popConfirm.confirm = custDel.bind(null, args, params);
+ if (!isNullOrUnDef(data[1])) {
+ data[1].popConfirm.confirm = Del.bind(null, args, params);
+ }
return data;
},
/**
@@ -76,38 +57,27 @@
* @param {*} u
* @return {*}
*/
- EditeOperation: (data: Ref<any[]>, d, u) => {
- if (u.isUpdate) {
- //鏇存柊
- var _data = data.value.map((item) => {
- if (item['ID'] == d.ID)
- return {
- ...item,
- PKG_CODE: d.PKG_CODE,
- PKG_LEVEL: d.PKG_LEVEL,
- PKG_QTY: d.PKG_QTY,
- LABEL_CODE: d.LABEL_CODE,
- REMARK: d.REMARK,
- };
- return item;
- });
- data.value = _data;
- } else {
- //鏂板
- d.ID = buildUUID();
- d.CREATE_USER = useUserStore().getUserInfo.userId as string;
- d.UPDATE_TIME = formatToDateTime(new Date());
- d.UPDATE_USER = useUserStore().getUserInfo.userId as string;
- var _data2: any[] = [];
- if (!isNullOrEmpty(data.value)) {
- _data2 = data.value.map((item) => {
- return item;
- });
- }
- _data2.push(d);
- data.value = _data2;
- }
+ EditOperation: (data: Ref<any[]>, d, u, item) => {
+ //鏇存柊
+ var _data = data.value[item].map((item) => {
+ if (item['ID'] == d.ID)
+ return {
+ ...item,
+ PKG_CODE: d.PKG_CODE,
+ PKG_NAME: d.PKG_NAME,
+ PKG_LEVEL: d.PKG_LEVEL,
+ PKG_QTY: d.PKG_QTY,
+ LABEL_CODE: d.LABEL_CODE,
+ REMARK: d.REMARK,
+ };
+ return item;
+ });
+ EditOperation(data, d, u, item, _data);
},
+ /**
+ * @description: 楂樼骇琛ㄥ崟鍜岃鎯呴〉闈㈣繑鍥炰富椤甸潰鐨剈rl
+ * @return {*}
+ */
GetHomeUrl: () => {
return `/BAS_PKG_RULE/LC/${encodeURI(JSON.stringify({ ID: 'BAS_PKG_RULE', colSlots: [], crudColSlots: [] }))}`;
},
@@ -115,127 +85,26 @@
* @description: 楂樼骇琛ㄥ崟鏄庣粏琛ㄦ牸瀛楁
* @return {*}
*/
- GetBaseColumns: () => {
- return [
- {
- title: '鍖呰/杞藉叿缂栫爜',
- dataIndex: 'PKG_CODE',
- // ifShow: false,
- width: 180,
- },
- {
- title: '鍖呰灞傜骇',
- dataIndex: 'PKG_LEVEL',
- },
- {
- title: '鍖呰鏁伴噺',
- dataIndex: 'PKG_QTY',
- },
- {
- title: '鍖呰瑙勫垯ID',
- dataIndex: 'PKG_RULE_ID',
- ifShow: false,
- },
- {
- title: '澶囨敞',
- dataIndex: 'REMARK',
- },
- {
- title: '鏇存柊鏃堕棿',
- dataIndex: 'UPDATE_TIME',
- },
- {
- title: '鏇存柊浜�',
- dataIndex: 'UPDATE_USER',
- },
- ];
+ GetBaseColumns: (type: string) => {
+ return baseColumns[type];
},
/**
* @description: 楂樼骇琛ㄥ崟鏌ヨ鏉′欢瀛楁
* @return {*}
*/
- GetSearchForm: () => {
- return [
- {
- field: 'PKG_CODE',
- label: '鍖呰瑙勫垯缂栫爜',
- component: 'Input',
- colProps: {
- span: 8,
- },
- },
- ];
+ GetSearchForm: (type: string) => {
+ return searchForms[type];
},
/**
* @description: 楂樼骇琛ㄥ崟澧炲垹鏀硅〃鍗曞瓧娈�
* @return {*}
*/
- GetCrudForm: () => {
- return [
- {
- field: 'PKG_CODE',
- label: '鍖呰/杞藉叿缂栫爜',
- component: 'ApiSelect',
- required: true,
- colProps: {
- span: 24,
- },
- componentProps: {
- api: getEntity,
- params: { entityName: 'BAS_PKG_TYPE', sqlcmd: ' 1=1 ' },
- resultField: 'Data.Items',
- labelField: 'PKG_NAME',
- valueField: 'PKG_CODE',
- },
- },
- {
- label: '鍖呰灞傜骇',
- field: 'PKG_LEVEL',
- component: 'Input',
- required: true,
- colProps: {
- span: 24,
- },
- },
- {
- label: '鍖呰瑙勫垯ID',
- field: 'PKG_RULE_ID',
- component: 'Input',
- colProps: {
- span: 24,
- },
- dynamicDisabled: ({ values }) => {
- return true;
- },
- },
- {
- label: '鍖呰鏁伴噺',
- field: 'PKG_QTY',
- component: 'Input',
- colProps: {
- span: 24,
- },
- },
- {
- label: '澶囨敞',
- field: 'REMARK',
- component: 'Input',
- colProps: {
- span: 24,
- },
- },
- {
- label: 'ID',
- field: 'ID',
- component: 'Input',
- colProps: {
- span: 24,
- },
- show: false,
- },
- ];
+ GetCrudForm: (type: string, ...args) => {
+ _data = args[0];
+ record = args[1];
+ return crudForms[type];
},
- OthersValues: (val: string, id: string) => {
+ KeyFieldValues: (val: string, id: string) => {
return { PKG_RULE_ID: id };
},
/**
@@ -307,7 +176,7 @@
/**
* @description: 楂樼骇琛ㄥ崟涓讳俊鎭崱鐗囩敓鎴愶紝鍙互澶氫釜
* @return {*}
- */
+ */
GetBaseCards: () => {
return [
{
@@ -319,6 +188,285 @@
},
];
},
+ /**
+ * @description: 鑾峰彇鍙充晶杈规use鏂规硶
+ * @return {*}
+ */
+ GetUseDrawers: () => {
+ return [
+ {
+ BAS_PKG_DTL: useDrawer(),
+ },
+ ];
+ },
+ /**
+ * @description: 鑾峰彇琛ㄦ牸use鍒楄〃
+ * @param {string} type
+ * @param {array} args
+ * @return {*}
+ */
+ GetUseTables: (data: Ref<{}>, ...args) => {
+ return {
+ BAS_PKG_DTL: useTable({
+ title: '鍒楄〃淇℃伅',
+ dataSource: data.value['BAS_PKG_DTL'],
+ columns: baseColumns['BAS_PKG_DTL'],
+ formConfig: {
+ labelWidth: 140,
+ schemas: searchForms['BAS_PKG_DTL'],
+ submitFunc: () => Search('BAS_PKG_DTL', data, args[0]), //鑷畾涔夋煡璇㈡彁浜ゆ寜閽殑鏂规硶锛岃Е鍙戞煡璇㈡彁浜や簨浠�
+ },
+ useSearchForm: true,
+ showTableSetting: false,
+ bordered: true,
+ canResize: true,
+ showIndexColumn: false,
+ actionColumn: {
+ width: 130,
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ slots: { customRender: 'action' },
+ fixed: 'right',
+ }, //鑷畾涔夋搷浣滃垪
+ }),
+ };
+ },
+ /**
+ * @description: 琛ㄦ牸鏌ヨ鍥炶皟锛岀埗缁勪欢涓�氳繃瀛愮粍浠惰Е鍙戠殑浜嬩欢鑾峰彇浼犲叆鐨勫�硷紝鍋氬叿浣撶殑鏌ヨ閫昏緫瀹炵幇
+ * @param {*} d
+ * @return {*}
+ */
+ FormSearch: (d) => {
+ let data = {} as any;
+ switch (d.type) {
+ case 'BAS_PKG_DTL':
+ data = d.data.value[d.type].filter((item) => item.PKG_CODE.includes(d.values.PKG_CODE));
+ if (isNullOrEmpty(d.values.PKG_CODE)) {
+ data = d.data.value[d.type];
+ }
+ break;
+ }
+ return data;
+ },
+ /**
+ * @description: 鑾峰彇鏍囬淇℃伅
+ * @param {string} type
+ * @return {*}
+ */
+ GetTitle: () => {
+ return {
+ pageTitle: '鍖呰瑙勫垯绠＄悊',
+ pageContent: '杩欓噷鍙互娣诲姞鍜屼慨鏀瑰寘瑁呰鍒欏拰鍖呰淇℃伅銆�',
+ tableTitle: {
+ BAS_PKG_DTL: '鍖呰淇℃伅绠＄悊',
+ },
+ };
+ },
+ };
+
+ /* 浠ヤ笅鏄唴閮ㄦ柟娉曪紝涓峞xport锛屼緵涓婇潰鐨勬柟娉曡皟鐢� */
+
+ /**
+ * @description: 鑷畾涔夊垹闄ゆ柟娉�
+ * @param {Fn} args
+ * @param {*} params
+ * @return {*}
+ */
+ function Del(args: Fn[], params: {}) {
+ const name = params['name'];
+ const useTables = args[1];
+ if (!isNullOrEmpty(params['data'])) {
+ var _data = params['data'].value[name]
+ .filter((x) => x['ID'] != params['record']['ID']) //杩囨护鎺夊垹闄ゆ帀鐨勮褰�
+ .map((item) => {
+ //濡傛灉搴忓彿澶т簬鍒犻櫎鎺夌殑璁板綍鐨勫簭鍙风殑锛屽垯搴忓彿鍑�1
+ item['PKG_LEVEL'] =
+ item['PKG_LEVEL'] > params['record']['PKG_LEVEL']
+ ? item['PKG_LEVEL'] - 1
+ : item['PKG_LEVEL'];
+ return item;
+ });
+ params['data'].value[name] = _data;
+ useTables[name][1].setProps({
+ dataSource: [],
+ });
+ useTables[name][1].setProps({
+ dataSource: params['data'].value[name],
+ });
+ useTables[name][1].reload();
+ } else {
+ DeleteEntity(params['record'], params['entityName']).then((action) => {
+ if (action.IsSuccessed) {
+ useTables[name][1].reload();
+ }
+ });
+ }
+ }
+
+ const searchForms = {
+ BAS_PKG_DTL: [
+ {
+ field: 'PKG_CODE',
+ label: '鍖呰瑙勫垯缂栫爜',
+ component: 'Input',
+ colProps: {
+ span: 8,
+ },
+ },
+ ] as FormSchema[],
+ };
+
+ const baseColumns = {
+ BAS_PKG_DTL: [
+ {
+ title: '鍖呰/杞藉叿缂栫爜',
+ dataIndex: 'PKG_CODE',
+ ifShow: false,
+ width: 180,
+ },
+ {
+ title: '鍖呰/杞藉叿鍚嶇О',
+ dataIndex: 'PKG_NAME',
+ ifShow: false,
+ width: 180,
+ },
+ {
+ title: '鍖呰/杞藉叿',
+ dataIndex: 'PKG_FULL',
+ width: 180,
+ customRender: ({ record }) => {
+ return `${record.PKG_CODE} - ${record.PKG_NAME}`;
+ },
+ },
+ {
+ title: '鍖呰灞傜骇',
+ dataIndex: 'PKG_LEVEL',
+ },
+ {
+ title: '鍖呰鏁伴噺',
+ dataIndex: 'PKG_QTY',
+ },
+ {
+ title: '鍖呰瑙勫垯ID',
+ dataIndex: 'PKG_RULE_ID',
+ ifShow: false,
+ },
+ {
+ title: '澶囨敞',
+ dataIndex: 'REMARK',
+ },
+ {
+ title: '鏇存柊鏃堕棿',
+ dataIndex: 'UPDATE_TIME',
+ },
+ {
+ title: '鏇存柊浜�',
+ dataIndex: 'UPDATE_USER',
+ },
+ ] as BasicColumn[],
+ };
+
+ const crudForms = {
+ BAS_PKG_DTL: [
+ {
+ label: '鍖呰瑙勫垯ID',
+ field: 'PKG_RULE_ID',
+ component: 'Input',
+ colProps: {
+ span: 24,
+ },
+ dynamicDisabled: ({ values }) => {
+ return true;
+ },
+ },
+ {
+ label: '鍖呰灞傜骇',
+ field: 'PKG_LEVEL',
+ component: 'Input',
+ required: true,
+ colProps: {
+ span: 24,
+ },
+ componentProps: ({ formModel }) => {
+ formModel.PKG_LEVEL =
+ _data['BAS_PKG_DTL'].reduce((max, item) => {
+ return max < Number(item.PKG_LEVEL) ? Number(item.PKG_LEVEL) : max;
+ }, 0) + 1;
+ return {
+ onChange: (e) => {},
+ };
+ },
+ dynamicDisabled: ({ values }) => {
+ return true;
+ },
+ },
+ {
+ field: 'PKG_CODE',
+ label: '鍖呰/杞藉叿缂栫爜',
+ component: 'ApiSelect',
+ required: true,
+ colProps: {
+ span: 24,
+ },
+ componentProps: ({ formModel }) => {
+ let sqlcmd = ' 1=1 ';
+ if (!isNullOrEmpty(record) && record['PKG_LEVEL'] == 1) {
+ sqlcmd += ` And IS_MIN_PKG = 'Y'`;
+ } else {
+ if (formModel.PKG_LEVEL == 1) {
+ sqlcmd += ` And IS_MIN_PKG = 'Y'`;
+ } else {
+ sqlcmd += ` And IS_MIN_PKG != 'Y'`;
+ }
+ }
+ return {
+ api: getEntity,
+ params: { entityName: 'BAS_PKG_TYPE', sqlcmd: sqlcmd },
+ resultField: 'Data.Items',
+ labelField: 'PKG_NAME',
+ valueField: 'PKG_CODE',
+ onChange: (e, v) => {
+ console.log('ApiSelect====>:', e, v);
+ formModel.PKG_NAME = isNullOrUnDef(v) ? formModel.PKG_NAME : v.label;
+ },
+ };
+ },
+ },
+ {
+ label: '鍖呰鏁伴噺',
+ field: 'PKG_QTY',
+ component: 'Input',
+ colProps: {
+ span: 24,
+ },
+ },
+ {
+ label: '鍖呰鍚嶇О',
+ field: 'PKG_NAME',
+ component: 'Input',
+ colProps: {
+ span: 24,
+ },
+ show: false,
+ },
+ {
+ label: '澶囨敞',
+ field: 'REMARK',
+ component: 'Input',
+ colProps: {
+ span: 24,
+ },
+ },
+ {
+ label: 'ID',
+ field: 'ID',
+ component: 'Input',
+ colProps: {
+ span: 24,
+ },
+ show: false,
+ },
+ ] as FormSchema[],
};
return [methods, ActionColumn];
--
Gitblit v1.9.3