diff --git a/frontend/config/routes.ts b/frontend/config/routes.ts index bea4387..9d4dd15 100644 --- a/frontend/config/routes.ts +++ b/frontend/config/routes.ts @@ -24,11 +24,11 @@ { path: '/base', icon: 'SettingOutlined', name: '工厂数据管理', routes: [ - // { path: '/base/stock', name: '料仓管理', component: './stock/index' }, + // { path: '/base/dict', name: '码表管理', component: './dict/index' }, + { path: '/base/process', name: '工艺流程', component: './plantModel/process' }, { path: '/base/materials', name: '原料管理', component: './materials/index' }, { path: '/base/final', name: '成品管理', component: './final/index' }, - { path: '/base/manufacturing', name: '产线管理', component: './manufacturing/index' }, - // { path: '/base/dict', name: '数据字典', component: './dict/index' }, + { path: '/base/line', name: '产线管理', component: './productLine/line' }, ] }, diff --git a/frontend/package.json b/frontend/package.json index e9834e6..46de0b3 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -51,6 +51,7 @@ "@ant-design/charts": "^1.4.2", "@ant-design/icons": "^4.8.0", "@ant-design/pro-components": "^2.3.44", + "@ant-design/pro-flow": "^1.3.11", "@ant-design/pro-layout": "^7.8.3", "@ant-design/use-emotion-css": "1.0.4", "@jiaminghi/data-view-react": "^1.2.5", @@ -68,8 +69,10 @@ "react": "^18.2.0", "react-dev-inspector": "^1.8.3", "react-dom": "^18.2.0", + "react-flow-editor": "^0.6.1", + "react-flow-renderer": "^10.3.17", "react-helmet-async": "^1.3.0", - "uuid": "^9.0.0" + "uuid": "^10.0.0" }, "devDependencies": { "@ant-design/pro-cli": "^2.1.5", diff --git a/frontend/src/api/process/dto.d.ts b/frontend/src/api/process/dto.d.ts new file mode 100644 index 0000000..c682e52 --- /dev/null +++ b/frontend/src/api/process/dto.d.ts @@ -0,0 +1,71 @@ +declare namespace processType { + /** + * 基类 + */ + type base_dto = { + /** + * 编码 + */ + name?: null | string; + /** + * 描述 + */ + processType?: null | string; + /** + * 名称 + */ + des?: null | string; + /** + * 创建时间 + */ + createTime:Date + } + /** + * 增加输入参数 + */ + type addInput = base_dto + /** + * 更新输入参数 + */ + interface updateInput extends base_dto { + /** + * 主键 + */ + id: string + } + /** + * 删除输入参数 + */ + interface delInput { + /** + * 主键 + */ + id: string + } + /** + * 查询输入参数 + */ + interface queryParms { + /** + * 名称 + */ + name?: null | string; + } + /** + * 查询分页输入参数 + */ + interface queryPage { + pageIndex: number, + pageSize: number, + name:string + } + /** + * 查询输出参数 + */ + interface output extends base_dto { + /** + * 主键 + */ + id: string + } +} \ No newline at end of file diff --git a/frontend/src/api/process/service.ts b/frontend/src/api/process/service.ts new file mode 100644 index 0000000..df24b8c --- /dev/null +++ b/frontend/src/api/process/service.ts @@ -0,0 +1,90 @@ + +import { request } from '@umijs/max'; + + +export default { + /** + * 新增 + * @param parms + * @returns + */ + Add(parms: processType.addInput) { + return request('/api/process/add', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 删除 + * @param parms + * @returns + */ + Del(parms: processType.delInput) { + return request(`/api/process/del`, { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 修改 + * @param parms + * @returns + */ + Update(parms: processType.updateInput) { + return request('/api/process/update', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 详情 + * @param parms + * @returns + */ + Detail(id: string) { + return request(`/api/process/detail?id=${id}`, { + method: 'GET' + }); + }, + /** + * 获取列表 + * @param parms + * @returns + */ + List(parms: processType.queryParms) { + return request('/api/process/list', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 分页查询 + * @param parms + * @returns + */ + PagedList(parms: processType.queryPage) { + return request('/api/process/pagedlist', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + // 下拉 + Selectlist() { + return request('/api/process/selectlist', { + method: 'GET' + } + ) + } + +} + diff --git a/frontend/src/api/productlineInfo/dto.d.ts b/frontend/src/api/productlineInfo/dto.d.ts new file mode 100644 index 0000000..57139f0 --- /dev/null +++ b/frontend/src/api/productlineInfo/dto.d.ts @@ -0,0 +1,71 @@ +declare namespace productlineInfoTypes { + /** + * 基类 + */ + type base_dto = { + /** + * 描述 + */ + describe: string | undefined + /** + * 产线名称 + */ + name: string, + /** + * 增加输入参数 + */ + id: string, + /** + * 时间 + */ + createTime:Date + } + /** + * 增加输入参数 + */ + type addInput = base_dto + /** + * 更新输入参数 + */ + interface updateInput extends base_dto { + /** + * 主键 + */ + id: string + } + /** + * 删除输入参数 + */ + interface delInput { + /** + * 主键 + */ + id: string + } + /** + * 查询输入参数 + */ + interface queryParms { + /** + * 名称 + */ + name?: null | string; + } + /** + * 查询分页输入参数 + */ + interface queryPage { + pageIndex: number, + pageSize: number, + name:string + } + /** + * 查询输出参数 + */ + interface output extends base_dto { + /** + * 主键 + */ + id: string + } +} \ No newline at end of file diff --git a/frontend/src/api/productlineInfo/service.ts b/frontend/src/api/productlineInfo/service.ts new file mode 100644 index 0000000..6cf6094 --- /dev/null +++ b/frontend/src/api/productlineInfo/service.ts @@ -0,0 +1,82 @@ + +import { request } from '@umijs/max'; + + +export default { + /** + * 新增 + * @param parms + * @returns + */ + Add(parms: productlineInfoTypes.addInput) { + return request('/api/productline/add', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 删除 + * @param parms + * @returns + */ + Del(parms: productlineInfoTypes.delInput) { + return request(`/api/productline/del`, { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 修改 + * @param parms + * @returns + */ + Update(parms: productlineInfoTypes.updateInput) { + return request('/api/productline/update', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 详情 + * @param parms + * @returns + */ + Detail(id: string) { + return request(`/api/productline/detail?id=${id}`, { + method: 'GET' + }); + }, + /** + * 获取列表 + * @param parms + * @returns + */ + List(parms: productlineInfoTypes.queryParms) { + return request('/api/productline/list', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 分页查询 + * @param parms + * @returns + */ + PagedList(parms: productlineInfoTypes.queryPage) { + return request('/api/productline/pagedlist', { + method: 'POST', + data: { + ...parms, + }, + }); + } +} + diff --git a/frontend/src/api/productlineService.ts b/frontend/src/api/productlineService.ts index e197d5a..0df94fe 100644 --- a/frontend/src/api/productlineService.ts +++ b/frontend/src/api/productlineService.ts @@ -3,7 +3,7 @@ import { request } from '@umijs/max'; export default { //创建产线 - Add(parms: ProductlineTypes.Info) { + Add(parms: productlineInfoTypes.addInput) { return request('/api/productline/add', { method: 'POST', data: { @@ -12,7 +12,7 @@ export default { }); }, //删除 - Del(parms: ProductlineTypes.Info) { + Del(parms: productlineInfoTypes.delInput) { return request(`/api/productline/del`, { method: 'POST', data: { @@ -21,7 +21,7 @@ export default { }); }, //修改 - Update(parms: ProductlineTypes.Info) { + Update(parms: productlineInfoTypes.updateInput) { return request('/api/productline/update', { method: 'POST', data: { @@ -40,7 +40,7 @@ export default { * @param parms * @returns */ - PagedList(parms: ProductlineTypes.Page) { + PagedList(parms: productlineInfoTypes.output) { return request('/api/productline/pagedlist', { method: 'POST', data: { @@ -55,70 +55,70 @@ export default { }); }, - // 产线添加设备 - adddevice(parms: ProductlineTypes.Productlinedevice) { - return request('/api/productline/adddevice', { - method: 'POST', - data: { - ...parms, - } - }) - }, - // 产线添加料仓 - addstock(parms: ProductlineTypes.Productlinestock) { - return request('/api/productline/addstock', { - method: 'POST', - data: { - ...parms, - } - }) - }, - // 产线设备分页 - devicepagelist(parms: ProductlineTypes.Productionlinepaging) { - return request('/api/productline/devicepagelist', { - method: 'POST', - data: { - ...parms - } - }) - }, - // 产线设备列表 - devicelist(parms: ProductlineTypes.ProductionlineQuery) { - return request('/api/productline/devicelist', { - method: 'POST', - data: { - ...parms - } - }) - }, - // 产线料仓分页 - stockpagelist(parms: ProductlineTypes.Productionlinestockpaging) { - return request('/api/productline/stockpagelist', { - method: 'POST', - data: { - ...parms - } - }) - }, - // 产线删除设备 + // // 产线添加设备 + // adddevice(parms: productlineInfoTypes.Productlinedevice) { + // return request('/api/productline/adddevice', { + // method: 'POST', + // data: { + // ...parms, + // } + // }) + // }, + // // 产线添加料仓 + // addstock(parms: productlineInfoTypes.Productlinestock) { + // return request('/api/productline/addstock', { + // method: 'POST', + // data: { + // ...parms, + // } + // }) + // }, + // // 产线设备分页 + // devicepagelist(parms: productlineInfoTypes.Productionlinepaging) { + // return request('/api/productline/devicepagelist', { + // method: 'POST', + // data: { + // ...parms + // } + // }) + // }, + // // 产线设备列表 + // devicelist(parms: productlineInfoTypes.ProductionlineQuery) { + // return request('/api/productline/devicelist', { + // method: 'POST', + // data: { + // ...parms + // } + // }) + // }, + // // 产线料仓分页 + // stockpagelist(parms: productlineInfoTypes.Productionlinestockpaging) { + // return request('/api/productline/stockpagelist', { + // method: 'POST', + // data: { + // ...parms + // } + // }) + // }, + // // 产线删除设备 - deletedevice(parms: ProductlineTypes.Productionlinedeletiondevice) { - return request('/api/productline/deletedevice', { - method: 'POST', - data: { - ...parms - } - }) - }, - // 产线删除料仓 - deletestock(parms: ProductlineTypes.Productionlinedeletstock) { - return request('/api/productline/deletestock', { - method: 'POST', - data: { - ...parms - } - }) - } + // deletedevice(parms: productlineInfoTypes.Productionlinedeletiondevice) { + // return request('/api/productline/deletedevice', { + // method: 'POST', + // data: { + // ...parms + // } + // }) + // }, + // // 产线删除料仓 + // deletestock(parms: productlineInfoTypes.Productionlinedeletstock) { + // return request('/api/productline/deletestock', { + // method: 'POST', + // data: { + // ...parms + // } + // }) + // } } diff --git a/frontend/src/api/productlinesteps/dto.d.ts b/frontend/src/api/productlinesteps/dto.d.ts new file mode 100644 index 0000000..2284586 --- /dev/null +++ b/frontend/src/api/productlinesteps/dto.d.ts @@ -0,0 +1,75 @@ +declare namespace productlinestepsTypes { + /** + * 基类 + */ + type base_dto = { + /** + * 步骤 + */ + step:number + /** + * 工艺流程主键 + */ + processId: string, + /** + * Id + */ + id: string, + /** + * 产线Id + */ + lineId:string, + /** + * 工艺流程名称 + */ + processName:string + } + /** + * 增加输入参数 + */ + type addInput = base_dto + /** + * 更新输入参数 + */ + interface updateInput extends base_dto { + /** + * 主键 + */ + id: string + } + /** + * 删除输入参数 + */ + interface delInput { + /** + * 主键 + */ + id: string + } + /** + * 查询输入参数 + */ + interface queryParms { + /** + * 名称 + */ + lineId:string + } + /** + * 查询分页输入参数 + */ + interface queryPage { + pageIndex: number, + pageSize: number, + lineId:string + } + /** + * 查询输出参数 + */ + interface output extends base_dto { + /** + * 主键 + */ + id: string + } +} \ No newline at end of file diff --git a/frontend/src/api/productlinesteps/service.ts b/frontend/src/api/productlinesteps/service.ts new file mode 100644 index 0000000..d44a50d --- /dev/null +++ b/frontend/src/api/productlinesteps/service.ts @@ -0,0 +1,90 @@ + +import { request } from '@umijs/max'; + + +export default { + /** + * 新增 + * @param parms + * @returns + */ + Add(parms: productlinestepsTypes.addInput) { + return request('/api/productlinesteps/add', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 删除 + * @param parms + * @returns + */ + Del(parms: productlinestepsTypes.delInput) { + return request(`/api/productlinesteps/del`, { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 修改 + * @param parms + * @returns + */ + Update(parms: productlinestepsTypes.updateInput) { + return request('/api/productlinesteps/update', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 详情 + * @param parms + * @returns + */ + Detail(id: string) { + return request(`/api/productlinesteps/detail?id=${id}`, { + method: 'GET' + }); + }, + /** + * 获取列表 + * @param parms + * @returns + */ + List(parms: productlinestepsTypes.queryParms) { + return request('/api/productlinesteps/list', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + /** + * 分页查询 + * @param parms + * @returns + */ + PagedList(parms: productlinestepsTypes.queryPage) { + return request('/api/productlinesteps/pagedlist', { + method: 'POST', + data: { + ...parms, + }, + }); + }, + //根据批量更新步骤 + BatchUpdateStep(parms :productlinestepsTypes.updateInput[]){ + return request('/api/productlinesteps/batchupdate',{ + method: 'POST', + data: parms + }) + }, + +} + diff --git a/frontend/src/pages/craftInfo/pot.tsx b/frontend/src/pages/craftInfo/pot.tsx index 2be82c8..78c5259 100644 --- a/frontend/src/pages/craftInfo/pot.tsx +++ b/frontend/src/pages/craftInfo/pot.tsx @@ -425,8 +425,10 @@ const Index = () => { } }} dragSortKey="step" - onDragSortEnd={(newDataSource: any[]) => { + onDragSortEnd={(beforeIndex: number, afterIndex: number,newDataSource: any[]) => { + console.log('newDataSource',newDataSource); + // 模拟将排序后数据发送到服务器的场景 // remoteData = newDataSource; // 请求成功之后刷新列表 diff --git a/frontend/src/pages/deviceInfo/index.tsx b/frontend/src/pages/deviceInfo/index.tsx index d471047..b2e7e1e 100644 --- a/frontend/src/pages/deviceInfo/index.tsx +++ b/frontend/src/pages/deviceInfo/index.tsx @@ -5,8 +5,8 @@ */ import type { ActionType, ProColumns } from '@ant-design/pro-components'; import { ProTable } from '@ant-design/pro-components'; -import { Button, Modal, Form, Input, message, Popconfirm, Tag, DatePicker as TDatePicker } from 'antd'; -import { useRef, useState } from 'react'; +import { Button, Modal, Form, Input, message, Popconfirm, Tag, DatePicker as TDatePicker, Select } from 'antd'; +import { useEffect, useRef, useState } from 'react'; import DeviceInfoAPI from '@/api/DeviceInfo'; import deviceProductAPI from '@/api/deviceInfo/services/deviceProduct'; import dayjs from 'dayjs' @@ -21,6 +21,7 @@ export default () => { const [modelTitle, setModelTitle] = useState(); //编辑/新增弹窗 const [isModalOpen, setIsModalOpen] = useState(false); + const [deviceModelList,setDeviceModelList] = useState([]) const actionRef = useRef(); const columns: ProColumns[] = [ { @@ -52,13 +53,9 @@ export default () => { dataIndex: 'deviceType', ellipsis: true, hideInSearch: true, - valueType: 'select', - request: async () => { - const b: MyResponse.Content = await deviceProductAPI.SelectList(); - console.log(b); - - return b.data; - } + render(dom, entity, index, action, schema) { + return <>{deviceModelList.find((x:any)=>x.key==entity.deviceType)?.value} + }, }, { title: '设备维保日期', @@ -114,6 +111,15 @@ export default () => { ], }, ]; + + useEffect(()=>{ + deviceProductAPI.SelectList().then((v:MyResponse.Content)=>{ + if (v.statusCode===200) { + setDeviceModelList(v.data) + } + }) + },[]) + /* *表单提交 */ @@ -239,7 +245,15 @@ export default () => { - + {/* name="repairDate" */} diff --git a/frontend/src/pages/final/index.tsx b/frontend/src/pages/final/index.tsx index 839ddce..12deadb 100644 --- a/frontend/src/pages/final/index.tsx +++ b/frontend/src/pages/final/index.tsx @@ -30,6 +30,8 @@ const final = () => { // 定义title // eslint-disable-next-line react-hooks/rules-of-hooks const [modelTitle, setModelTitle] = useState(); + + const [peifangOpen,setPeifangOpen] = useState(); // 定义列表数据 const columns: ProColumns[] = [ { @@ -85,7 +87,18 @@ const final = () => { > 编辑 , - + +, { + + { + setPeifangOpen(false); + }} + footer={[ + , + , + ]} + > + diff --git a/frontend/src/pages/plantModel/process.less b/frontend/src/pages/plantModel/process.less new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/pages/plantModel/process.tsx b/frontend/src/pages/plantModel/process.tsx new file mode 100644 index 0000000..4037f68 --- /dev/null +++ b/frontend/src/pages/plantModel/process.tsx @@ -0,0 +1,207 @@ +import { PlusOutlined } from '@ant-design/icons'; +import type { + ActionType, + ProColumns, + ProFormInstance, +} from '@ant-design/pro-components'; +import { + ProCard, + ProTable, +} from '@ant-design/pro-components'; +import { Button, message, Popconfirm, Space } from 'antd'; +import { useState, useRef } from 'react'; +//引入接口 +import dayjs from 'dayjs' +import processApi from '@/api/process/service' + +export default () => { + const [fromType, setFromType] = useState('table') + const ref = useRef(); + const actionRef = useRef(); + + const Reolod = () =>{ + ref.current?.resetFields() + actionRef.current?.reload() + } + const columns: ProColumns[] = [ + { + title: '主键', + dataIndex: 'id', + width: 160, + hideInForm: true, + hideInSearch:true + }, + { + title: '名称', + dataIndex: 'name', + ellipsis: true, + width: 120, + formItemProps:{ + rules:[{ required: true, message: '此项为必填项!' }] + } + }, + { + title: '类型', + hideInDescriptions: true, + dataIndex: 'processType', + width: 120, + search: false, + valueEnum:{ + 0: { + text: '人工', + + }, + 1: { + text: '设备', + + }, + }, + formItemProps:{ + rules:[{ required: true, message: '此项为必填项!' }] + } + }, + { + title: '描述', + dataIndex: 'des', + + search: false, + }, + { + title: '创建时间', + dataIndex: 'createTime', + render: (_, record) => { + return <>{dayjs(record.createTime).format("YYYY-MM-DD HH:mm:ss")} + }, + search: false, + hideInForm:true + }, + { + title: '操作', + valueType: 'option', + dataIndex: 'id', + render: (text, row) => [ + + { + setFromType('form') + ref.current?.setFieldsValue(row) + }} key={+new Date() + Math.random()} target="_blank" rel="noopener noreferrer"> + 编辑 + + { + + processApi.Del(row).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("删除成功!"); + Reolod() + } else { + message.error(res.errors); + } + }) + }} + onCancel={() => { + message.info('已取消删除'); + }} + okText="确认" + cancelText="关闭" + > + + 删除 + + + + ], + }, + ]; + + return ( + <> + + {/* {fromType === 'form' ? : ""} */} + + + columns={columns} + + type={fromType as 'table'} + formRef={ref} + actionRef={actionRef} + onSubmit={(params: any) => { + console.log(params); + if (fromType === 'form') { + if (params.id) { + processApi.Update(params).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("更新成功!"); + setFromType('table') + Reolod() + } else { + message.error(res.errors); + } + }) + } else { + processApi.Add(params).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("新增成功!"); + setFromType('table') + Reolod() + } else { + message.error(res.errors); + } + }) + } + } + }} + + form={{ignoreRules:true,// 自定义提交按钮的属性 + submitter: { + onReset:()=>{ + ref.current?.resetFields() + setFromType("table") + }, + searchConfig: { resetText: fromType === 'form' ? '返回': '重置'}, } + }} + request={async (params = {}) => { + const jsonData: processType.queryPage = { + pageIndex: params.current || 1, + pageSize: params.pageSize || 10, + name: params.name || '', + }; + const response = await processApi.PagedList(jsonData); + if (response.statusCode === 200) { + return { + data: response.data.items, + success: true, + total: response.data.total, + }; + } else { + return { + data: [], + success: false, + total: 0, + }; + } + }} + pagination={{ + pageSize: 10, + showSizeChanger:false + }} + rowKey="id" + dateFormatter="string" + headerTitle="列表" + toolBarRender={() => [ + , + ]} + /> + + + ); +}; \ No newline at end of file diff --git a/frontend/src/pages/productLine/data.ts b/frontend/src/pages/productLine/data.ts new file mode 100644 index 0000000..679cb1c --- /dev/null +++ b/frontend/src/pages/productLine/data.ts @@ -0,0 +1,39 @@ +export const nodes = [ + { + id: 'a1', + data: { + title: 'XXX_API_a1', + logo: 'https://mdn.alipayobjects.com/huamei_ntgeqc/afts/img/A*kgyiRKi04eUAAAAAAAAAAAAADvuvAQ/original', + description: 'XXX_XXX_XXX_API', + }, + }, + { + id: 'a2', + data: { + title: 'XXX_API_a2', + logo: 'https://mdn.alipayobjects.com/huamei_ntgeqc/afts/img/A*kgyiRKi04eUAAAAAAAAAAAAADvuvAQ/original', + description: 'XXX_XXX_XXX_API', + }, + }, + { + id: 'a3', + data: { + title: 'XXX_API_a3', + logo: 'https://mdn.alipayobjects.com/huamei_ntgeqc/afts/img/A*kgyiRKi04eUAAAAAAAAAAAAADvuvAQ/original', + description: 'XXX_XXX_XXX_API', + }, + }, + ]; + export const edges = [ + { + id: 'a1-a2', + source: 'a1', + target: 'a2', + }, + { + id: 'a1-a3', + source: 'a1', + target: 'a3', + type: 'radius', + }, + ]; \ No newline at end of file diff --git a/frontend/src/pages/productLine/line.tsx b/frontend/src/pages/productLine/line.tsx new file mode 100644 index 0000000..c0478c0 --- /dev/null +++ b/frontend/src/pages/productLine/line.tsx @@ -0,0 +1,464 @@ +import { PlusOutlined } from '@ant-design/icons'; +import type { + ActionType, + ProColumns, + ProFormInstance, +} from '@ant-design/pro-components'; +import ReactFlow from 'react-flow-renderer'; +import { + DragSortTable, + ProCard, + ProTable, +} from '@ant-design/pro-components'; +import { Button, Flex, Form, Input, message, Modal, Popconfirm, Select, Space, Steps } from 'antd'; +import { useState, useRef, useEffect } from 'react'; +import { FlowView, SelectType, useFlowViewer, useNodesState } from '@ant-design/pro-flow'; +import { createStyles } from 'antd-style'; +//引入接口 +import dayjs from 'dayjs' +import { v4 as uuid } from 'uuid' +import productlineInfoAPI from '@/api/productlineInfo/service' +import processAPI from '@/api/process/service'; +import productlineInfoStepsAPI from '@/api/productlinesteps/service' +import { edges, nodes as newnodes } from './data'; + +export default () => { + const [fromType, setFromType] = useState('table') + const ref = useRef(); + const actionRef = useRef(); + + const Reolod = () =>{ + ref.current?.resetFields() + actionRef.current?.reload() + } + + const [flowOpen,setFlowOpen] = useState(false) + const [flowItemOpen,setFlowItemOpen] = useState(false) + + const columns: ProColumns[] = [ + { + title: '主键', + dataIndex: 'id', + width: 160, + + formItemProps: { + hidden:true + }, + hideInSearch:true + }, + { + title: '名称', + dataIndex: 'name', + ellipsis: true, + width: 120, + formItemProps:{ + rules:[{ required: true, message: '此项为必填项!' }] + } + }, + // { + // title: '类型', + // hideInDescriptions: true, + // dataIndex: 'productlinestepsTypes', + // width: 120, + // search: false, + // valueEnum:{ + // 0: { + // text: '人工', + + // }, + // 1: { + // text: '设备', + + // }, + // }, + // formItemProps:{ + // rules:[{ required: true, message: '此项为必填项!' }] + // } + // }, + { + title: '描述', + dataIndex: 'describe', + + search: false, + }, + { + title: '创建时间', + dataIndex: 'createTime', + render: (_, record) => { + return <>{dayjs(record.createTime).format("YYYY-MM-DD HH:mm:ss")} + }, + search: false, + hideInForm:true + }, + { + title: '操作', + valueType: 'option', + render: (text, row) => [ + + { + setFromType('form') + ref.current?.setFieldsValue(row) + }} key={+new Date() + Math.random()} target="_blank" rel="noopener noreferrer"> + 编辑 + + { + setFlowOpen(true) + setStepparams({ lineId: row.id }) + }} key={+new Date() + Math.random()} target="_blank" rel="noopener noreferrer"> + 配置工艺流程 + + { + + productlineInfoAPI.Del(row).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("删除成功!"); + Reolod() + } else { + message.error(res.errors); + } + }) + }} + onCancel={() => { + message.info('已取消删除'); + }} + okText="确认" + cancelText="关闭" + > + + 删除 + + + + ], + }, + ]; + const useStyles = createStyles(() => { + return { + container: { + width: '100%', + height: '400px', + }, + }; + }); + const [selectLineItem,setSelectLineItem] = useState(); + const [processList,setProcessList] = useState(); + const [stepparams, setStepparams] = useState(); + const [dongtaiformRef] = Form.useForm(); + const { styles } = useStyles(); + const { selectNode, selectEdges, selectNodes } = useFlowViewer(); + const [nodes, , onNodesChange] = useNodesState(newnodes); + const [node, setNode] = useState(null); + const sortActionRef = useRef(); + const [proList,setProList] = useState([]); + const [form] = Form.useForm(); + useEffect(() => { + processAPI.Selectlist().then((v:MyResponse.Content)=>{ + if (v.statusCode===200) { + console.log('v.data',v.data); + setProList(v.data) + } + }) + + + }, []) + + return ( + <> + + columns={columns} + type={fromType as 'table'} + formRef={ref} + actionRef={actionRef} + onSubmit={(params: any) => { + console.log(params); + if (fromType === 'form') { + if (params.id) { + productlineInfoAPI.Update(params).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("更新成功!"); + setFromType('table') + Reolod() + } else { + message.error(res.errors); + } + }) + } else { + productlineInfoAPI.Add(params).then((res: MyResponse.Content) => { + if (res.statusCode === 200) { + message.info("新增成功!"); + setFromType('table') + Reolod() + } else { + message.error(res.errors); + } + }) + } + } + }} + + form={{ignoreRules:true,// 自定义提交按钮的属性 + submitter: { + onReset:()=>{ + ref.current?.resetFields() + setFromType("table") + }, + searchConfig: { resetText: fromType === 'form' ? '返回': '重置',submitText: fromType === 'form' ? '提交': '查询'}, } + }} + request={async (params = {}) => { + const jsonData: productlineInfoTypes.queryPage = { + pageIndex: params.current || 1, + pageSize: params.pageSize || 10, + name: params.name || '', + }; + const response = await productlineInfoAPI.PagedList(jsonData); + if (response.statusCode === 200) { + return { + data: response.data.items, + success: true, + total: response.data.total, + }; + } else { + return { + data: [], + success: false, + total: 0, + }; + } + }} + pagination={{ + pageSize: 10, + showSizeChanger:false + }} + rowKey="id" + dateFormatter="string" + headerTitle="列表" + toolBarRender={() => [ + , + ]} + /> + { setFlowOpen(false) }} onCancel={_ => setFlowOpen(false)}> + +
+ { + return {...element,title : proList.find((x)=>x.key==element.processId)?.value,status: 'finish', } + + }) + } + /> +
+
+ + style={{width:'600px'}} + toolBarRender={() => [ + , + ]} + actionRef={sortActionRef} + + columns={[ + { + title: '工序', + dataIndex: 'step', + align: 'center', + hideInSearch: true, + render: (dom, rowData, index) => { + return ( + {`${index + 1}`} + ); + }, + }, + { + title: '工艺名称', + dataIndex: 'processId', + align: 'center', + hideInSearch: true, + render(dom, entity, index, action, schema) { + return <>{proList.find((x)=>x.key==entity.processId)?.value} + }, + }, + { + title: '操作', + align: 'center', + + valueType: 'option', + + key: 'option', + render: (_, record, index, action) => [ + + + + { + const delData: productlinestepsTypes.delInput = { + id: record.id, + }; + productlineInfoStepsAPI.Del(delData).then((r) => { + if (r.statusCode === 200) { + message.success(r.statusCode === 200 ? '删除成功' : r.message); + action?.reload(); + } + }); + }} + onCancel={() => { + message.info('已取消删除'); + }} + okText="确认" + cancelText="关闭" + > + + + + ], + }, + ]} + rowKey="step" + search={false} + pagination={{ pageSize: 100,showSizeChanger:false }} + + params={stepparams} + request={async (params = {}) => { + // if (!params.lineId) { + // return { + // data: [], + // success: false, + // total: 0, + // }; + // } + const jsonData: productlinestepsTypes.queryParms = { + lineId: params.lineId + }; + const response = await productlineInfoStepsAPI.List(jsonData); + if (response.statusCode === 200) { + setProcessList(response.data) + + return { + data: response.data, + success: true, + }; + } else { + return { + data: [], + success: false, + total: 0, + }; + } + }} + dragSortKey="step" + onDragSortEnd={(beforeIndex: number, afterIndex: number,newDataSource: any[]) => { + + console.log('newDataSource',newDataSource); + + // 模拟将排序后数据发送到服务器的场景 + // remoteData = newDataSource; + // 请求成功之后刷新列表 + newDataSource.map((item, index) => { + item.step = index + 1; + }) + console.log('排序后的数据', newDataSource); + productlineInfoStepsAPI.BatchUpdateStep(newDataSource).then((res: MyResponse.Content) => { + if (res.data) { + sortActionRef.current?.reload(); + message.success('修改列表排序成功'); + } + }); + + }} + /> +
+ + + + + { + setFlowItemOpen(false) + }} + > + 返回 + , + , + ]} + + onOk={() => { setFlowItemOpen(false) }} onCancel={_ => setFlowItemOpen(false)}> +
{ + console.log(v); + const jsonData:productlinestepsTypes.addInput = { + step: 0, + processId: v.processId, + id: '', + lineId: stepparams.lineId, + processName: '' + } + productlineInfoStepsAPI.Add(jsonData).then((v:MyResponse.Content)=>{ + if (v.statusCode===200) { + setFlowItemOpen(false) + sortActionRef.current?.reload(); + } + }) + }}> + + + + + +
+ + + ); +}; \ No newline at end of file