From 5a4d79d9765dfca8812638b57d5f5fe21f7a06ee Mon Sep 17 00:00:00 2001 From: Ben Lin <maobin001@msn.com> Date: 星期二, 16 七月 2024 17:05:25 +0800 Subject: [PATCH] 工单下发更新 --- src/views/tigerprojects/system/lowcode/composition/index.vue | 285 ++++++++++++++++++++------------------------------------ 1 files changed, 104 insertions(+), 181 deletions(-) diff --git a/src/views/tigerprojects/system/lowcode/composition/index.vue b/src/views/tigerprojects/system/lowcode/composition/index.vue index ca58307..2068333 100644 --- a/src/views/tigerprojects/system/lowcode/composition/index.vue +++ b/src/views/tigerprojects/system/lowcode/composition/index.vue @@ -1,3 +1,11 @@ +<!-- + * @Description: 閫氱敤缁勫悎椤甸潰锛屽乏杈规槸鏍戯紝鍙宠竟鏄厤缃� + * @Author: Ben Lin + * @version: + * @Date: 2024-06-18 23:30:30 + * @LastEditors: Ben Lin + * @LastEditTime: 2024-07-15 22:22:58 +--> <template> <PageWrapper :dense="dense" @@ -8,21 +16,22 @@ :content="pageContent" @back="goBack" > - <GeneralTree - class="w-1/4 xl:w-1/5" - v-if="isMounted" - @select="handleSelect" - @UnSelect="UnSelect" - :title="title" - :treeData="treeData" - :create-icon="createIcon" - :fieldNames="fieldNames" - /><!-- - add - @handle-add="handleAdd" --> - <div class="w-3/4 xl:w-4/5 p-5"> - <RouteAction v-if="entityName == 'ProdRouteBinding' && rotType == 'Product'" /> - </div> + <Suspense class="w-1/4 xl:w-1/5"> + <LeftTree @select="NodeSelect" /> + </Suspense> + <Suspense> + <div class="w-3/4 xl:w-4/5 p-5"> + <CarGridNav v-if="showNav" :configType="configType" :nodes="nodes"> + <template #[item] v-for="item in otherSlots" :key="item"> + <!-- 鑷畾涔夊唴瀹� --> + <div class="h-full" style="height: 400px"> + <FlowChartView :data="routeData" @init="init" /> + </div> + </template> + </CarGridNav> + <Config v-if="showConfig" :configType="configType" @success="configSuccess" /> + </div> + </Suspense> <!-- <BasicTable class="w-3/4 xl:w-4/5" @register="registerTable"> <template #toolbar> <a-button type="primary" @click="handleCreate" preIcon="add_02|svg"> 鏂板 </a-button> @@ -34,124 +43,88 @@ </template> </BasicTable> --> <!-- <normalDrawer @register="registerDrawer" @success="handleSuccess" /> --> - <CustModal - @register="registerCust" - @success="custSuccess" - :type="cType" - :detailSlots="dtlSlots" - > - <!-- 鐢ㄦ彃妲借嚜瀹氫箟澶氳〃鍗� --> - <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> + <CustModal + @register="registerCust" + @success="custSuccess" + :type="cType" + :detailSlots="dtlSlots" + :entityName="entityName" + > + <!-- 鐢ㄦ彃妲借嚜瀹氫箟澶氳〃鍗� --> + <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> </PageWrapper> </template> <script lang="ts" setup> import { PageWrapper } from '@/components/Page'; - import GeneralTree from '/@/views/components/GeneralTree.vue'; import { useModal } from '@/components/Modal'; import GeneralModal from '/@/views/components/GeneralModal.vue'; - import RouteAction from './RouteAction.vue'; + import CarGridNav from './CarGridNav.vue'; + import Config from './Config.vue'; + import LeftTree from './LeftTree.vue'; import CustModal from '/@/views/components/CustModal.vue'; - import { OpenCustModal, getOthersValues } from '../data'; - import { Ref, onMounted, provide, reactive, ref } from 'vue'; + import { OpenCustModal, initRoute } from '../data'; + import { Ref, VNode, onMounted, provide, ref, unref } from 'vue'; + import { FlowChartView } from '/@/components/FlowChart'; import { useRoute } from 'vue-router'; - import { useDrawer } from '/@/components/Drawer'; import { BasicForm, useForm } from '/@/components/Form/index'; - import { TreeItem } from '/@/components/TigerTree'; import { useTabs } from '/@/hooks/web/useTabs'; import { isNullOrUnDef } from '/@/utils/is'; import { useGo } from '/@/hooks/web/usePage'; + import { useMessage } from '/@/hooks/web/useMessage'; + import LogicFlow from '@logicflow/core'; defineOptions({ name: 'DeptManagement' }); + const { notification, createErrorModal } = useMessage(); const go = useGo(); const route = useRoute(); const { setTitle } = useTabs(); const objParams = ref(JSON.parse(decodeURI(route.params?.id as string))); //ref(JSON.parse(history.state.obj)) const entityName = ref(objParams.value.Name); - const formSchemas = ref({}); //寮瑰嚭妗嗘垨楂樼骇椤甸潰澶氳〃鍗曠粨鏋� const useModalData = ref({}); //琛ㄥ崟涓彃妲芥覆鏌撴寜閽墦寮�妯℃�佹useModal鏂规硶 const useFormData = ref({}); - const colSlots = ref<any>(objParams.value.colSlots); //鎸夐挳鎻掓Ы - const crudColSlots = ref<any>(objParams.value.crudColSlots); const cType = ref(''); const dtlSlots = ref([] as any[]); + const otherSlots = ref<any[]>([]); const selectVals = ref({}); - const baseCards = ref([] as any[]); - const otherCards = ref([] as any[]); - const searchInfo = reactive<Recordable>({}); - const treeData = ref<TreeItem[]>([]); - const title = ref(''); - const fieldNames = ref({}); const dense = isNullOrUnDef(objParams.value.dense) ? ref(false) : ref(objParams.value.dense); const pageTitle = ref(objParams.value.pageTitle); const pageContent = ref(objParams.value.pageContent); - const others = ref(getOthersValues(entityName.value, objParams.value.CODE, objParams.value.ID)); - const prodCode = ref(''); - const rotType = ref(''); + const selectedNodes = ref([]); const isMounted = ref(false); - const custImport = ref(null); + const showNav = ref(false); + const showConfig = ref(false); + const configType = ref(''); + const nodes = ref([]); + const routeData = ref({ + nodes: [], + edges: [], + }); + const custImport = ref<any>(null); const [registerCust, { openModal: openCustomModal, closeModal }] = useModal(); - const [registerItemAdd, { openModal: openItemModal }] = useModal(); - const [registerDrawer, { openDrawer }] = useDrawer(); - provide<Ref<string>>('prodCode', prodCode); + provide<Ref<any>>('objParams', objParams); + provide<Ref<any>>('selectedNodes', nodes); setTitle(objParams.value.Title); //璁剧疆鏍囩椤垫爣棰� - // const [registerTable, { reload }] = useTable({ - // title: '鍒楄〃淇℃伅', - // api: getRoleListByPage, - // columns, - // formConfig: { - // labelWidth: 120, - // schemas: searchFormSchema, - // }, - // pagination: false, - // striped: false, - // useSearchForm: true, - // showTableSetting: true, - // bordered: true, - // showIndexColumn: false, - // canResize: false, - // actionColumn: { - // width: 80, - // title: '鎿嶄綔', - // dataIndex: 'action', - // // slots: { customRender: 'action' }, - // fixed: undefined, - // }, - // }); - - /** - * @description: 鑾峰彇鏍戝舰鏁版嵁 - * @param {*} type - * @return {*} - */ - async function fetch(type: string) { - if (!isNullOrUnDef(custImport.value)) { - const [{ fetchTreeData }] = custImport.value.default(); - //鏍规嵁type鑾峰彇鏍戝舰鏁版嵁 - const data = await fetchTreeData(type, objParams.value.CODE); - title.value = data.title; - treeData.value = data.treeData; - fieldNames.value = data.fieldNames; - } - } /** * @description: 椤甸潰宸︿晶鐐瑰嚮杩斿洖閾炬帴鏃剁殑鎿嶄綔 @@ -159,7 +132,7 @@ */ function goBack() { if (!isNullOrUnDef(custImport.value)) { - const [{ GetHomeUrl }] = custImport.value.default(); + const [{ GetHomeUrl }] = custImport.value['default'](); // 鏈緥鐨勬晥鏋滄椂鐐瑰嚮杩斿洖濮嬬粓璺宠浆鍒拌处鍙峰垪琛ㄩ〉锛屽疄闄呭簲鐢ㄦ椂鍙繑鍥炰笂涓�椤� go(GetHomeUrl(entityName.value)); } @@ -169,104 +142,54 @@ // console.log('handleAdd'); // } - /** - * @description: 鏍戝舰鑺傜偣鍥炬爣 - * @param {*} params - * @param {*} type - * @return {*} - */ - function createIcon(params: Recordable<any>) { - if (isNullOrUnDef(custImport.value)) { - return ''; - } else { - const [{CreateIcon}] = custImport.value.default(); - return CreateIcon(params); - } - } - onMounted(async () => { isMounted.value = false; /* 鍔ㄦ�乮mport瀹炰綋鍚�.ts鐨勮嚜瀹氫箟鏂规硶 */ try { - custImport.value = await import(/* @vite-ignore */ `../entityts/${entityName.value}`); - await fetch(entityName.value); + custImport.value = await import(`../entityts/${entityName.value}.ts`); + if (custImport.value['default']) { + otherSlots.value = custImport.value['default']()[0]['GetSlots'](); + } isMounted.value = true; - } catch (e) {} + } catch (e) { + console.log(e); + } }); + const currlf = ref(null) as Ref<LogicFlow | null>; /** - * @description: 鐢熸垚鍒楄〃涓搷浣滈」鐨勬寜閽� - * @param {*} record + * @description: 宸ヨ壓璺嚎鍒濆鍖� + * @param {*} lf * @return {*} */ - function createActions(record) { - // return GetActionsData( - // { - // record, - // isUpdate: true, - // ifSave: true, - // entityName: entityName.value, - // formJson: getFormSchema(`${entityName.value}_Crud`), - // cType, - // dtlSlots, - // useModalData, - // useFormData, - // crudColSlots, - // }, - // openDrawer, - // reload, - // openCustomModal, - // useForm, - // useModal, - // ); + async function init(lf, rotId) { + initRoute(lf, rotId, routeData, currlf); } /** - * @description: 楠岃瘉琛ㄥ崟 + * @description: 閫夋嫨鑺傜偣鏃舵牴鎹繑鍥炵殑浜嬩欢鍙傛暟鏄剧ず闅愯棌鐩稿簲缁勪欢 + * @param {*} e * @return {*} */ - async function validate() { - let validates = {}; - const Keys = Object.getOwnPropertyNames(useFormData.value); - let i; - for (i = 0; i < Keys.length; i++) { - validates[Keys[i]] = await useFormData.value[Keys[i]][1].validate(); - } - return validates; - } - - // function handleEdit(record: Recordable) { - // openModal(true, { - // record, - // isUpdate: true, - // }); - // } - - // function handleDelete(record: Recordable) { - // console.log(record); - // } - - function handleSelect(deptId = '', info) { - searchInfo.deptId = deptId; - prodCode.value = info.selectedNodes[0].code; - rotType.value = info.selectedNodes[0].type; - // reload(); + function NodeSelect(e) { + showConfig.value = e.showConfig; + showNav.value = e.showNav; + configType.value = e.type; + nodes.value = e.nodes; + routeData.value = { + nodes: [], + edges: [], + }; + initRoute(currlf, e.nodes[0].id, routeData, currlf); } /** - * @description: 鍙栨秷閫夋嫨鏃朵簨浠惰繑鍥炴柟娉� - * @param {*} node + * @description: 淇濆瓨閰嶇疆鎴愬姛杩斿洖鏂规硶 * @return {*} */ - function UnSelect(node) { - prodCode.value = ''; - rotType.value = ''; - // reload(); + function configSuccess() { + notification.success({ message: '鎴愬姛淇濆瓨琛屼负閰嶇疆鏁版嵁' }); } - - // function handleSuccess() { - // reload(); - // } /** * @description: 寮瑰嚭妗嗙‘瀹氳繑鍥� @@ -287,7 +210,7 @@ function handleEntSuccess(d, u, item) { /* 鍔ㄦ�乮mport瀹炰綋鍚�.ts鐨勮嚜瀹氫箟鏂规硶 */ try { - import(/* @vite-ignore */ `../entityts/${cType.value}`).then((m) => { + import(`../entityts/${cType.value}.ts`).then((m) => { const [{ GetSelectSuccess }] = m.default(); var values = GetSelectSuccess(d, u); selectVals.value = values; //淇濆瓨寮瑰嚭妗嗛�夋嫨鐨勭粨鏋� -- Gitblit v1.9.3