From 509366a157059aeaf6daa2492cf32e108a8ca104 Mon Sep 17 00:00:00 2001 From: Ben Lin <maobin001@msn.com> Date: 星期五, 14 六月 2024 20:01:14 +0800 Subject: [PATCH] 工艺路线更新 --- src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue | 432 ++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 403 insertions(+), 29 deletions(-) diff --git a/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue b/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue index 8c73601..acd731b 100644 --- a/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue +++ b/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue @@ -1,3 +1,11 @@ +<!-- + * @Description: 宸ュ崟绠$悊椤甸潰 + * @Author: Ben Lin + * @version: + * @Date: 2024-05-25 00:27:00 + * @LastEditors: Ben Lin + * @LastEditTime: 2024-06-10 23:54:01 +--> <template> <div> <BasicTable @register="registerTable"> @@ -15,7 +23,7 @@ @click="handleSelectItem" preIcon="search|svg" /> - <ItemModal @register="registerItemAdd" @success="handleItemSuccess" /> + <NormalModal @register="registerItemAdd" @success="handleItemSuccess" /> </template> <template #action="{ record }"> <TableAction @@ -60,38 +68,92 @@ </template> </BasicTable> <Loading :loading="compState.loading" :tip="compState.tip" /> - <!-- <WmsItemDrawer @register="registerDrawer" @success="handleSuccess" /> --> <WoDrawer @register="registerDrawer" @success="handleSuccess" /> - <WoModal @register="registerWo" @success="handleSuccess" /> + <WoModal @register="registerWo" @success="handleSuccess" :title="title" :mtitle="mtitle" /> + <!-- 鑷畾涔夋ā鎬佹锛屽彲浠ヨ嚜瀹氫箟澶氳〃鍗� --> + <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]" + /> + <NormalModal + @register="useModalData[name][0]" + @success="(d, u) => handleEntSuccess(d, u, item.name)" + /> + </template> + </BasicForm> + <!-- 鑷畾涔夊唴瀹� --> + <div style="height: 200px" id="lfContainer" v-if="isCustEl[item.name]"></div> + </template> + </CustModal> + <RouteViewModal @register="registerRv" @success="RvItemSuccess" /> </div> </template> <script lang="ts" setup> - import { reactive, unref, h } from 'vue'; + import { reactive, unref, h, onMounted, ref, nextTick, Ref } from 'vue'; + import { Steps, Step, Layout, LayoutContent } from 'ant-design-vue'; import { BasicTable, useTable, TableAction } from '/@/components/Table'; + import { BasicForm, FormSchema, FormActionType, useForm } from '/@/components/Form/index'; import WoDrawer from './WoDrawer.vue'; import WoModal from './WoModal.vue'; - import ItemModal from '/@/views/components/ItemModal.vue'; + import NormalModal from '/@/views/components/NormalModal.vue'; + import RouteViewModal from '/@/views/components/RouteViewModal.vue'; + import CustModal from '/@/views/components/CustModal.vue'; import { useDrawer } from '/@/components/Drawer'; import { columns, searchFormSchema } from './biz_mes_wo.data'; - import { DeleteMesWo, getWoListByPage } from '/@/api/tigerapi/mes/wo'; + import { DeleteMesWo } from '/@/api/tigerapi/mes/wo'; import { Loading } from '/@/components/Loading'; import { useMessage } from '/@/hooks/web/useMessage'; import { useI18n } from '/@/hooks/web/useI18n'; import { useModal } from '/@/components/Modal'; + import { SaveEntity, getListByPage } from '/@/api/tigerapi/system'; + import { GetSelectSuccess, OpenSelectItem, getFormSchema } from '/@/views/components/data'; + import LogicFlow from '@logicflow/core'; + import { getRouteData } from '/@/api/tigerapi/mes/router'; + import actionRect from '/@/components/FlowChart/src/actionRect'; + import TestNode from '/@/components/FlowChart/src/TestNode'; + import CollectNode from '/@/components/FlowChart/src/CollectNode'; + import AssemblyNode from '/@/components/FlowChart/src/AssemblyNode'; + import PackingNode from '/@/components/FlowChart/src/PackingNode'; + import RepairNode from '/@/components/FlowChart/src/RepairNode'; + import customEdge from '/@/components/FlowChart/src/customEdge'; + import { BpmnElement } from '@logicflow/extension'; const { t } = useI18n(); - const { createMessage } = useMessage(); + const ASteps = Steps; + const AStep = Step; + const cType = ref(''); + const title = ref('宸ュ崟瀵煎叆'); + const mtitle = ref('宸ュ崟鍒楄〃'); + const dtlSlots = ref([] as any[]); + const selectVals = ref({}); + const { createMessage, createErrorModal } = useMessage(); const [registerDrawer, { openDrawer }] = useDrawer(); const compState = reactive({ absolute: false, loading: false, tip: '鍔犺浇涓�...', }); + const lfInstance = ref(null) as Ref<LogicFlow | null>; + const [registerRv, { openModal: openRvModal }] = useModal(); const [registerWo, { openModal: openWoModal }] = useModal(); const [registerItemAdd, { openModal: openItemModal }] = useModal(); + const [registerCust, { openModal: openCustModal, closeModal }] = useModal(); const [registerTable, { getForm, reload }] = useTable({ title: '宸ュ崟淇℃伅', - api: getWoListByPage, + api: getListByPage, columns, formConfig: { labelWidth: 120, @@ -110,6 +172,63 @@ bordered: true, showIndexColumn: false, }); + const routeData = ref({ + nodes: [], + edges: [], + }); + const formSchema = ref([] as FormSchema[]); + const woSchema = ref([] as FormSchema[]); + const prodSchema = ref([] as FormSchema[]); + const isCustEl = ref({ + forminfo: false, + woinfo: false, + prodinfo: false, + rotinfo: true, + }); + //琛ㄥ崟涓彃妲芥覆鏌撴寜閽墦寮�妯℃�佹useModal鏂规硶 + const useModalData = ref({ + add: useModal(), + set: useModal(), + addRot: useModal(), + setRot: useModal(), + }); + //鑷畾涔夊琛ㄥ崟瀹炰緥 + const useFormData = ref({ + forminfo: useForm({ + labelWidth: 120, + schemas: formSchema, + actionColOptions: { + span: 24, + }, + showActionButtonGroup: false, + }), + woinfo: useForm({ + labelWidth: 120, + schemas: woSchema, + actionColOptions: { + span: 24, + }, + showActionButtonGroup: false, + }), + prodinfo: useForm({ + labelWidth: 120, + schemas: prodSchema, + actionColOptions: { + span: 24, + }, + showActionButtonGroup: false, + }), + // rotinfo: useForm({ + // labelWidth: 120, + // schemas: rotSchema, + // actionColOptions: { + // span: 24, + // }, + // showActionButtonGroup: false, + // }), + }); + + onMounted(async () => {}); //鏂板 function addWo() { @@ -136,26 +255,145 @@ } //閰嶇疆宸ヨ壓 function handleConfig(record: Recordable) { - // const apiAction = SaveTool(record, unref(true), true); - // apiAction.then((action) => { - // if (action.IsSuccessed) { - // createMessage.success(t('宸叉姤搴�')); - // reload(); - // } else { - // createMessage.success(t('鎶ュ簾鎿嶄綔澶辫触')); - // } - // }); + cType.value = 'BIZ_MES_WO_Config'; + dtlSlots.value = [ + { name: 'woinfo', slots: [], preIcons: {}, title: '宸ュ崟淇℃伅' }, + { + name: 'prodinfo', + slots: ['addRot', 'setRot'], + preIcons: { addRot: 'search|svg', setRot: 'config|svg' }, + title: '浜у搧淇℃伅', + }, + { name: 'rotinfo', slots: ['add'], preIcons: { add: 'search|svg' }, title: '宸ヨ壓淇℃伅' }, + ]; + woSchema.value = getFormSchema('woinfo'); + prodSchema.value = getFormSchema('prodinfo'); + // rotSchema.value = getFormSchema('rotinfo'); + //宸ヨ壓璺嚎娓叉煋鍥惧垵濮嬪寲 + if (lfInstance.value != null) { + routeData.value = { + nodes: [], + edges: [], + }; + const lf = unref(lfInstance)!; + lf.render({}); + } + selectVals.value['ROUTE_CODE'] = record.ROUTE_CODE; + openCustModal(true, { + isUpdate: true, + ctype: cType, + title: '宸ヨ壓閰嶇疆', + width: '1000px', + formEl: useFormData.value, //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы + formElName: ['woinfo', 'prodinfo', 'rotinfo'], //琛ㄥ崟鎻掓Ы鍚嶇О锛屾敮鎸佸涓〃鍗� + RowKey: '', + fnName: { BIZ_MES_WO_Config: 'SaveCofig' }, //淇濆瓨鏂规硶鍚� + initFnName: { BIZ_MES_WO_Config: 'initRoute' }, //鍒濆鍖栨柟娉曞悕 + isCustEl: isCustEl.value, + others: routeData.value, + values: record, //琛ㄥ崟璁板綍 + }); } - //涓嬪彂 - function handleRelease(record: Recordable) {} - //鍙栨秷涓嬪彂 - function handleUnRelease(record: Recordable) {} + + /** + * @description: 涓嬪彂 + * @param {*} record + * @return {*} + */ + function handleRelease(record: Recordable) { + if (record.STATUS == 2) { + createErrorModal({ + title: t('璀﹀憡'), + content: t('宸ュ崟宸茬粡涓嬪彂锛屼笉鑳藉啀涓嬪彂锛�'), + getContainer: () => document.body, + }); + return; + } + cType.value = 'BIZ_MES_WO'; + dtlSlots.value = [ + { + name: 'forminfo', + slots: ['add', 'set'], + preIcons: { add: 'search|svg', set: 'config|svg' }, //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы銆俿lots鏄脊鍑烘鎸夐挳鐨勬彃妲斤紝preIcons鏄彃妲藉搴旂殑鎸夐挳鍥炬爣 + title: '涓嬪彂閰嶇疆', + }, + ]; + formSchema.value = getFormSchema(cType.value); + openCustModal(true, { + isUpdate: true, //鏄惁鏇存柊鎿嶄綔 + ctype: cType, //鏄摢涓〉闈� + title: '宸ュ崟涓嬪彂', //鏍囬 + width: '900px', //寮瑰嚭妗嗗搴� + formEl: useFormData.value, + formElName: ['forminfo'], //琛ㄥ崟鎻掓Ы鍚嶇О + RowKeys: { add: 'ROUTE_CODE', set: 'ROUTE_CODE' }, //鎻掓Ы鐨勫脊鍑烘閫夋嫨鐨刢ode + fnName: { BIZ_MES_WO: 'SaveWoBatch' }, //淇濆瓨鏂规硶鍚� + initFnName: {}, //鍒濆鍖栨柟娉曞悕 + isCustEl: isCustEl.value, + values: record, //琛ㄥ崟璁板綍 + }); + } + + /** + * @description: 鍙栨秷涓嬪彂 + * @param {*} record + * @return {*} + */ + function handleUnRelease(record: Recordable) { + if (record.STATUS == 0) { + createErrorModal({ + title: t('璀﹀憡'), + content: t('宸ュ崟鏄垵濮嬪寲鐘舵�侊紝涓嶈兘鍙栨秷涓嬪彂锛�'), + getContainer: () => document.body, + }); + return; + } + record.STATUS = 0; + SaveEntity(record, true, 'BIZ_MES_WO').then((action) => { + if (action.IsSuccessed) { + createMessage.success(t('宸插彇娑堜笅鍙�')); + reload(); + } else { + createMessage.success(t('鍙栨秷涓嬪彂鎿嶄綔澶辫触')); + } + }); + } //鏆傚仠 - function handlePause(record: Recordable) {} - //鍒犻櫎 + function handlePause(record: Recordable) { + if (record.STATUS == 0) { + createErrorModal({ + title: t('璀﹀憡'), + content: t('宸ュ崟鏄垵濮嬪寲鐘舵�侊紝涓嶈兘鏆傚仠锛�'), + getContainer: () => document.body, + }); + return; + } + if (record.STATUS == 5) { + createErrorModal({ + title: t('璀﹀憡'), + content: t('宸ュ崟鏄畬鎴愮姸鎬侊紝涓嶈兘鏆傚仠锛�'), + getContainer: () => document.body, + }); + return; + } + record.STATUS = 4; + SaveEntity(record, true, 'BIZ_MES_WO').then((action) => { + if (action.IsSuccessed) { + createMessage.success(t('宸叉殏鍋�')); + reload(); + } else { + createMessage.success(t('鏆傚仠鎿嶄綔澶辫触')); + } + }); + } + + /** + * @description: 鍒犻櫎 + * @param {*} record + * @return {*} + */ function handleDelete(record: Recordable) { - const apiAction = DeleteMesWo(record.ID); - apiAction.then((action) => { + DeleteMesWo(record.ID).then((action) => { if (action.IsSuccessed) { createMessage.success(t('宸插垹闄�')); reload(); @@ -164,17 +402,153 @@ } }); } - //鐐瑰嚮鎵撳紑鐗╂枡鍒楄〃妗� + + /** + * @description: 寮瑰嚭妗嗙‘瀹氳繑鍥� + * @param {*} d + * @return {*} + */ + function custSuccess(d) { + reload(); + } + + /** + * @description: 鐐瑰嚮鎵撳紑鐗╂枡鍒楄〃妗� + * @return {*} + */ function handleSelectItem() { openItemModal(true, { - data: 'content', - info: 'Info', + title: '鐗╂枡鍒楄〃', + schemas: [ + { + field: 'ITEM_CODE', + component: 'Input', + label: '鐗╂枡缂栫爜', + colProps: { + span: 12, + }, + }, + ], + ItemColumns: [ + { + title: t('鐗╂枡缂栫爜'), + dataIndex: 'ITEM_CODE', + resizable: true, + sorter: true, + width: 200, + }, + { + title: t('鐗╂枡鍚嶇О'), + dataIndex: 'ITEM_NAME', + resizable: true, + sorter: true, + width: 180, + }, + ], + tableName: 'BAS_ITEM', + rowKey: 'ITEM_CODE', }); } + /** + * @description: 寮瑰嚭閫夋嫨鐗╂枡妗嗚繑鍥炴垚鍔熸柟娉� + * @param {*} d + * @param {*} u + * @return {*} + */ function handleItemSuccess(d, u) { getForm().setFieldsValue({ - ITEM_CODE: d.values.values, + ITEM_CODE: d.values['val'], }); } + + /** + * @description: 鍚勮〃鍗曞唴寮瑰嚭閫夋嫨妗嗛�夋嫨鎴愬姛鍚庢柟娉� + * @param {*} d + * @param {*} u + * @param {*} item + * @return {*} + */ + function handleEntSuccess(d, u, item) { + var values = GetSelectSuccess(d, u, cType.value); + selectVals.value = values; //淇濆瓨寮瑰嚭妗嗛�夋嫨鐨勭粨鏋� + let _val = {}; + _val[d.returnFieldName] = values[d.returnFieldName]; + useFormData.value[item][1].setFieldsValue(_val); + if (d.returnFieldName == 'ROUTE_CODE' && cType.value == 'BIZ_MES_WO_Config') { + routeData.value = { + nodes: [], + edges: [], + }; + init(selectVals.value['ROUTE_CODE']); + } + } + + /** + * @description: 寮瑰嚭閫夋嫨妗� + * @param {*} item + * @return {*} + */ + function handleCustClick(item) { + //鎵撳紑鑷畾涔夋ā鎬佹 + OpenSelectItem( + useModalData.value[item][1].openModal, //甯﹀叆openModal鏂规硶 + cType.value, + item, + [openRvModal], + selectVals.value['ROUTE_CODE'], + ); //[openRvModal], selectVals.value['ID']杩欐槸鑷畾涔夊弬鏁帮紝鎸夊疄闄呴渶姹� + } + function RvItemSuccess(d, u) {} + + async function init(rotId) { + LogicFlow.use(BpmnElement); + lfInstance.value = new LogicFlow({ + container: document.querySelector('#lfContainer'), + edgeGenerator: (sourceNode) => { + // console.log('a'); + // 璧峰鑺傜偣绫诲瀷 rect 鏃朵娇鐢� 鑷畾涔夌殑杈� custom-edge + if (sourceNode.properties.isReturn) return 'custom-edge'; + // if (sourceNode.type === 'rect') return 'custom-edge'; + // return 'custom-edge'; + }, + }); + const lf = unref(lfInstance)!; + // lf?.setDefaultEdgeType('line'); + lf.register(customEdge); + lf.register(actionRect); + lf.register(TestNode); + lf.register(CollectNode); + lf.register(AssemblyNode); + lf.register(PackingNode); + lf.register(RepairNode); + lf.render({}); + //閫氳繃宸ヨ壓璺嚎ID鑾峰彇鍥惧舰鏁版嵁锛屽苟娓叉煋 + var _data = await getRouteData(rotId); + console.log('缁勪欢宸叉寕杞�', _data); + //宸ヨ壓璺嚎鍏ㄤ俊鎭紝鍖呮嫭Node銆丒dge鍜孉ct + // routeConfig.routeData = _data.Data; + if (_data.Data != null) { + //宸ヨ壓璺嚎涓讳俊鎭� + var currRoute = _data.Data.route; + _data.Data.nodes.forEach((n) => { + n.node.properties = JSON.parse(n.node.properties); + routeData.value.nodes.push(n.node); + }); + console.log('111', routeData.value); + _data.Data.edges.forEach((e) => { + e.edge.properties = JSON.parse(e.edge.properties); + routeData.value.edges.push(e.edge); + }); + _data.Data.acts.forEach((act) => { + act.node.properties = JSON.parse(act.node.properties); + routeData.value.nodes.push(act.node); + }); + console.log('init', unref(lf).getGraphData(), JSON.parse(JSON.stringify(routeData.value))); + lf.render(routeData.value); + // lf.graphModel.resize(500, 400); + lf.graphModel.fitView(); + lf.graphModel.translateCenter(); + } + } </script> -- Gitblit v1.9.3