projects/mes-dy #93
							
								
								
									
										8
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										8
									
								
								.env.dev
									
									
									
									
									
								
							@@ -12,8 +12,8 @@ ENV = 'development'
 | 
			
		||||
VUE_APP_TITLE = MES系统
 | 
			
		||||
 | 
			
		||||
# 芋道管理系统/开发环境
 | 
			
		||||
# VUE_APP_BASE_API = 'http://100.64.0.26:48082'
 | 
			
		||||
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
VUE_APP_BASE_API = 'http://100.64.0.26:48082'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.4.173:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48080'
 | 
			
		||||
@@ -21,6 +21,10 @@ VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.1.56:48080'
 | 
			
		||||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080'
 | 
			
		||||
 | 
			
		||||
# 积木报表指向地址
 | 
			
		||||
VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
 | 
			
		||||
 | 
			
		||||
# 路由懒加载
 | 
			
		||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -12,7 +12,10 @@ ENV = 'production'
 | 
			
		||||
VUE_APP_TITLE = MES系统
 | 
			
		||||
 | 
			
		||||
# 芋道管理系统/生产环境
 | 
			
		||||
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 | 
			
		||||
VUE_APP_BASE_API = '/prod-api'
 | 
			
		||||
 | 
			
		||||
# 积木报表指向地址
 | 
			
		||||
VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
# 根据服务器或域名修改
 | 
			
		||||
 
 | 
			
		||||
@@ -22,7 +22,9 @@
 | 
			
		||||
				:line="item.lineName"
 | 
			
		||||
				:desc="item.remark"
 | 
			
		||||
				:isActive="item.enabled"
 | 
			
		||||
				@edit="handleUpdate" />
 | 
			
		||||
				@edit="handleUpdate"
 | 
			
		||||
				@copy="handleCopy"
 | 
			
		||||
				@delete="handleDelete" />
 | 
			
		||||
		</section>
 | 
			
		||||
 | 
			
		||||
		<base-dialog
 | 
			
		||||
@@ -58,6 +60,12 @@ const ProcessItem = {
 | 
			
		||||
		handleEdit() {
 | 
			
		||||
			this.$emit('edit', this.id);
 | 
			
		||||
		},
 | 
			
		||||
		handleCopy() {
 | 
			
		||||
			this.$emit('copy', this.id);
 | 
			
		||||
		},
 | 
			
		||||
		handleDelete() {
 | 
			
		||||
			this.$emit('delete', this.id);
 | 
			
		||||
		},
 | 
			
		||||
		handleViewDetail(e) {
 | 
			
		||||
			this.$router.push({
 | 
			
		||||
				name: 'ProcessFlowView',
 | 
			
		||||
@@ -117,12 +125,18 @@ const ProcessItem = {
 | 
			
		||||
						<el-col
 | 
			
		||||
							span={8}
 | 
			
		||||
							style="text-align: center; border-right: 1px solid #0001">
 | 
			
		||||
							<el-button type="text" style="color: #0007; line-height: 1.75">
 | 
			
		||||
							<el-button
 | 
			
		||||
								type="text"
 | 
			
		||||
								style="color: #0007; line-height: 1.75"
 | 
			
		||||
								onClick={this.handleCopy}>
 | 
			
		||||
								复制
 | 
			
		||||
							</el-button>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col span={8} style="text-align: center;">
 | 
			
		||||
							<el-button type="text" style="color: #0007; line-height: 1.75">
 | 
			
		||||
							<el-button
 | 
			
		||||
								type="text"
 | 
			
		||||
								style="color: #0007; line-height: 1.75"
 | 
			
		||||
								onClick={this.handleDelete}>
 | 
			
		||||
								删除
 | 
			
		||||
							</el-button>
 | 
			
		||||
						</el-col>
 | 
			
		||||
@@ -255,6 +269,43 @@ export default {
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			this.title = '修改工艺';
 | 
			
		||||
		},
 | 
			
		||||
		async handleCopy(id) {
 | 
			
		||||
			this.$confirm('确认拷贝操作?', '提示', {
 | 
			
		||||
				confirmButtonText: '确 认',
 | 
			
		||||
				cancelButtonText: '取 消',
 | 
			
		||||
			})
 | 
			
		||||
				.then(async () => {
 | 
			
		||||
					const { code } = await this.http(
 | 
			
		||||
						'/extend/process-flow/copy',
 | 
			
		||||
						'post',
 | 
			
		||||
						{
 | 
			
		||||
							id,
 | 
			
		||||
						}
 | 
			
		||||
					);
 | 
			
		||||
					if (code == 0) {
 | 
			
		||||
						this.$modal.msgSuccess('复制成功');
 | 
			
		||||
						this.getList();
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
				.catch(() => console.info('操作取消'));
 | 
			
		||||
		},
 | 
			
		||||
		async handleDelete(id) {
 | 
			
		||||
			this.$confirm('确认删除这个工艺吗?', '提示', {
 | 
			
		||||
				confirmButtonText: '确 认',
 | 
			
		||||
				cancelButtonText: '取 消',
 | 
			
		||||
			})
 | 
			
		||||
				.then(async () => {
 | 
			
		||||
					const { code } = await this.http(
 | 
			
		||||
						'/extend/process-flow/delete?id=' + id,
 | 
			
		||||
						'delete'
 | 
			
		||||
					);
 | 
			
		||||
					if (code == 0) {
 | 
			
		||||
						this.$modal.msgSuccess('删除成功');
 | 
			
		||||
						this.getList();
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
				.catch(() => console.info('操作取消'));
 | 
			
		||||
		},
 | 
			
		||||
		submitForm() {
 | 
			
		||||
			this.$refs['form'].validate((valid) => {
 | 
			
		||||
				if (!valid) {
 | 
			
		||||
 
 | 
			
		||||
@@ -9,31 +9,69 @@
 | 
			
		||||
	<section class="process-bom">
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<div class="btns" style="
 | 
			
		||||
		<div
 | 
			
		||||
			class="btns"
 | 
			
		||||
			style="
 | 
			
		||||
				text-align: right;
 | 
			
		||||
				position: absolute;
 | 
			
		||||
				top: 20px;
 | 
			
		||||
				right: 20px;
 | 
			
		||||
				display: flex;
 | 
			
		||||
			">
 | 
			
		||||
			<el-button type="primary" plain :disabled="currentDet == null" class="btn-create" icon="el-icon-plus">
 | 
			
		||||
			<el-button
 | 
			
		||||
				type="primary"
 | 
			
		||||
				plain
 | 
			
		||||
				:disabled="currentDet == null"
 | 
			
		||||
				class="btn-create"
 | 
			
		||||
				@click="handleAddEquipment"
 | 
			
		||||
				icon="el-icon-plus">
 | 
			
		||||
				分配设备
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-input icon="el-icon-search" placeholder="搜索" v-model="searchText"  style="margin-left: 20px">
 | 
			
		||||
			<el-input
 | 
			
		||||
				icon="el-icon-search"
 | 
			
		||||
				placeholder="搜索"
 | 
			
		||||
				v-model="searchText"
 | 
			
		||||
				style="margin-left: 20px">
 | 
			
		||||
				<i slot="prefix" class="el-input__icon el-icon-search"></i>
 | 
			
		||||
			</el-input>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<!-- 列表 -->
 | 
			
		||||
		<base-table :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-data="list"
 | 
			
		||||
		<base-table
 | 
			
		||||
			:table-props="tableProps"
 | 
			
		||||
			:page="queryParams.pageNo"
 | 
			
		||||
			:limit="queryParams.pageSize"
 | 
			
		||||
			:table-data="list"
 | 
			
		||||
			@emitFun="handleEmitFun">
 | 
			
		||||
			<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" :method-list="tableBtn"
 | 
			
		||||
			<method-btn
 | 
			
		||||
				v-if="tableBtn.length"
 | 
			
		||||
				slot="handleBtn"
 | 
			
		||||
				label="操作"
 | 
			
		||||
				:width="120"
 | 
			
		||||
				:method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleTableBtnClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
 | 
			
		||||
		<!-- 分页组件 -->
 | 
			
		||||
		<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
 | 
			
		||||
		<pagination
 | 
			
		||||
			v-show="total > 0"
 | 
			
		||||
			:total="total"
 | 
			
		||||
			:page.sync="queryParams.pageNo"
 | 
			
		||||
			:limit.sync="queryParams.pageSize"
 | 
			
		||||
			@pagination="getList" />
 | 
			
		||||
 | 
			
		||||
		<base-dialog
 | 
			
		||||
			dialogTitle="选择设备"
 | 
			
		||||
			:dialogVisible="open"
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<el-transfer v-model="choosedEquipments" :data="eqList">
 | 
			
		||||
				<!-- <span slot-scope="{ option }">
 | 
			
		||||
					{{ option.key }} - {{ option.label }}
 | 
			
		||||
				</span> -->
 | 
			
		||||
			</el-transfer>
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</section>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
@@ -44,23 +82,20 @@ export default {
 | 
			
		||||
	props: {
 | 
			
		||||
		currentDet: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: null
 | 
			
		||||
		}
 | 
			
		||||
			default: null,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			open: false,
 | 
			
		||||
			eqList: [],
 | 
			
		||||
			finalList: [],
 | 
			
		||||
			choosedEquipments: [],
 | 
			
		||||
			searchBarFormConfig: [{ label: '工序下设备' }],
 | 
			
		||||
			tableProps: [
 | 
			
		||||
				// {
 | 
			
		||||
				// 	prop: 'createTime',
 | 
			
		||||
				// 	label: '添加时间',
 | 
			
		||||
				// 	fixed: true,
 | 
			
		||||
				// 	width: 180,
 | 
			
		||||
				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 | 
			
		||||
				// },
 | 
			
		||||
				{ prop: 'name', label: '设备名称' },
 | 
			
		||||
				{ prop: 'code', label: '物料BOM' },
 | 
			
		||||
				{ prop: 'remark', label: '参数BOM' },
 | 
			
		||||
				{ prop: 'equipmentId', label: '设备名称' },
 | 
			
		||||
				{ prop: 'materialName', label: '物料BOM' },
 | 
			
		||||
				{ prop: 'valueName', label: '参数BOM' },
 | 
			
		||||
			],
 | 
			
		||||
			list: [],
 | 
			
		||||
			total: 0,
 | 
			
		||||
@@ -82,12 +117,55 @@ export default {
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
			deep: true
 | 
			
		||||
		}
 | 
			
		||||
			deep: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleEmitFun() { },
 | 
			
		||||
		handleTableBtnClick() { },
 | 
			
		||||
		renderFn(h, option) {
 | 
			
		||||
			console.log(option);
 | 
			
		||||
			return <span>1</span>;
 | 
			
		||||
		},
 | 
			
		||||
		async getEqList() {
 | 
			
		||||
			console.log('currentDet', this.currentDet);
 | 
			
		||||
			const { sectionId } = this.currentDet;
 | 
			
		||||
			const { code, data } = await this.http(
 | 
			
		||||
				'base/core-equipment-bind-section/page',
 | 
			
		||||
				'get',
 | 
			
		||||
				{ workshopSectionId: sectionId, pageNo: 1, pageSize: 100 }
 | 
			
		||||
			);
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				console.log('workshopSectionId', data);
 | 
			
		||||
 | 
			
		||||
				// 模拟数据
 | 
			
		||||
				this.eqList = [
 | 
			
		||||
					{ equipmentId: 1, equipmentName: '设备1' },
 | 
			
		||||
					{ equipmentId: 2, equipmentName: '设备2' },
 | 
			
		||||
					{ equipmentId: 3, equipmentName: '设备3' },
 | 
			
		||||
					{ equipmentId: 4, equipmentName: '设备4' },
 | 
			
		||||
					{ equipmentId: 5, equipmentName: '设备5' },
 | 
			
		||||
					{ equipmentId: 6, equipmentName: '设备6' },
 | 
			
		||||
				]; // ].map((item) => ({ label: item.equipmentName, key: item.equipmentId }));
 | 
			
		||||
 | 
			
		||||
				// 获取参数bom和物料bom
 | 
			
		||||
				// 需调用参数bom接口和 物料bom接口
 | 
			
		||||
				this.finalList = this.eqList.map((item) => {
 | 
			
		||||
					item.sub = [];
 | 
			
		||||
					// key: equipmentId-参数bomId
 | 
			
		||||
					item.sub.push({
 | 
			
		||||
						key: item.equipmentId + '-' + '101',
 | 
			
		||||
						label: '参数bom1',
 | 
			
		||||
					});
 | 
			
		||||
					item.sub.push({
 | 
			
		||||
						key: item.equipmentId + '-' + '201',
 | 
			
		||||
						label: '物料bom1',
 | 
			
		||||
					});
 | 
			
		||||
 | 
			
		||||
					return item;
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		handleEmitFun() {},
 | 
			
		||||
		handleTableBtnClick() {},
 | 
			
		||||
		put(payload) {
 | 
			
		||||
			return this.http(this.updateUrl, 'put', payload);
 | 
			
		||||
		},
 | 
			
		||||
@@ -106,23 +184,34 @@ export default {
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		getList({ detId, detName, detDesc, flowId, sectionName } = {}) {
 | 
			
		||||
			console.log('get list')
 | 
			
		||||
 | 
			
		||||
		submitForm() {},
 | 
			
		||||
		async getList({ detId, detName, detDesc, flowId, sectionName } = {}) {
 | 
			
		||||
			console.log('get list', detId, detName, flowId);
 | 
			
		||||
			const { data, code } = await this.http(
 | 
			
		||||
				'/extend/process-flow-det-equipment/page',
 | 
			
		||||
				'get',
 | 
			
		||||
				{ flowDetId: detId, ...this.queryParams }
 | 
			
		||||
			);
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.list = data.list;
 | 
			
		||||
				this.total = data.total;
 | 
			
		||||
			} else {
 | 
			
		||||
				this.list.splice(0);
 | 
			
		||||
				this.total = 0;
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		getList() {
 | 
			
		||||
			this.list = [
 | 
			
		||||
				{ name: '1', code: 'bomg-1', remark: 'Tochter' },
 | 
			
		||||
				{ name: '2', code: 'bomg-2', remark: 'Bruder' },
 | 
			
		||||
				{ name: '3', code: 'bomg-3', remark: 'Kalt' },
 | 
			
		||||
			]
 | 
			
		||||
		async handleAddEquipment() {
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			await this.getEqList();
 | 
			
		||||
		},
 | 
			
		||||
		cancel() {
 | 
			
		||||
			this.open = false;
 | 
			
		||||
		},
 | 
			
		||||
		clearList() {
 | 
			
		||||
			this.list = [];
 | 
			
		||||
		}
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 
 | 
			
		||||
@@ -9,25 +9,57 @@
 | 
			
		||||
	<section class="process-graph">
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<div class="btns" style="text-align: right; position: absolute; top: 20px; right: 20px">
 | 
			
		||||
			<el-button type="warning" @click="undo" plain v-if="allowUndo" :disabled="!allowUndo" icon="el-icon-back">
 | 
			
		||||
		<div
 | 
			
		||||
			class="btns"
 | 
			
		||||
			style="text-align: right; position: absolute; top: 20px; right: 20px">
 | 
			
		||||
			<el-button
 | 
			
		||||
				type="warning"
 | 
			
		||||
				@click="undo"
 | 
			
		||||
				plain
 | 
			
		||||
				v-if="allowUndo"
 | 
			
		||||
				:disabled="!allowUndo"
 | 
			
		||||
				icon="el-icon-back">
 | 
			
		||||
				撤销
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button type="warning" @click="redo" plain v-if="allowRedo" :disabled="!allowRedo">
 | 
			
		||||
			<el-button
 | 
			
		||||
				type="warning"
 | 
			
		||||
				@click="redo"
 | 
			
		||||
				plain
 | 
			
		||||
				v-if="allowRedo"
 | 
			
		||||
				:disabled="!allowRedo">
 | 
			
		||||
				下一步
 | 
			
		||||
				<i class="el-icon-right el-icon--right"></i>
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button class="btn-refresh" @click="handleUpdateLayout" icon="el-icon-refresh">
 | 
			
		||||
				刷新布局</el-button>
 | 
			
		||||
			<el-button type="primary" plain class="btn-create" icon="el-icon-plus" @click="handleAdd">
 | 
			
		||||
			<el-button
 | 
			
		||||
				class="btn-refresh"
 | 
			
		||||
				@click="handleUpdateLayout"
 | 
			
		||||
				icon="el-icon-refresh">
 | 
			
		||||
				刷新布局
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button
 | 
			
		||||
				type="primary"
 | 
			
		||||
				plain
 | 
			
		||||
				class="btn-create"
 | 
			
		||||
				icon="el-icon-plus"
 | 
			
		||||
				@click="handleAdd">
 | 
			
		||||
				新建工序
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button class="btn-edit" :disabled="currentDet == null" @click="handleEdit">编辑</el-button>
 | 
			
		||||
			<el-button
 | 
			
		||||
				class="btn-edit"
 | 
			
		||||
				:disabled="currentDet == null"
 | 
			
		||||
				@click="handleEdit">
 | 
			
		||||
				编辑
 | 
			
		||||
			</el-button>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<div class="process-graph__panel" ref="panel"></div>
 | 
			
		||||
 | 
			
		||||
		<base-dialog :dialogTitle="title" :dialogVisible="open" width="35%" @close="cancel" @cancel="cancel"
 | 
			
		||||
		<base-dialog
 | 
			
		||||
			:dialogTitle="title"
 | 
			
		||||
			:dialogVisible="open"
 | 
			
		||||
			width="35%"
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
@@ -36,11 +68,15 @@
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { Graph } from '@antv/x6';
 | 
			
		||||
import ProcessNode, { createProcessNode, CACHE_NAME, getSectionFrom } from './ProcessNode';
 | 
			
		||||
import ProcessNode, {
 | 
			
		||||
	createProcessNode,
 | 
			
		||||
	CACHE_NAME,
 | 
			
		||||
	getSectionFrom,
 | 
			
		||||
} from './ProcessNode';
 | 
			
		||||
import DialogForm from '@/components/DialogForm';
 | 
			
		||||
// import { IdToName } from '@/utils'
 | 
			
		||||
 | 
			
		||||
Graph.registerNode('process-node', ProcessNode,true);
 | 
			
		||||
Graph.registerNode('process-node', ProcessNode, true);
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessGraph',
 | 
			
		||||
@@ -79,7 +115,7 @@ export default {
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
						cache: CACHE_NAME
 | 
			
		||||
						cache: CACHE_NAME,
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
@@ -99,42 +135,39 @@ export default {
 | 
			
		||||
				id: null,
 | 
			
		||||
				flowId: null,
 | 
			
		||||
				content: '',
 | 
			
		||||
				createTime: null
 | 
			
		||||
				createTime: null,
 | 
			
		||||
			},
 | 
			
		||||
			currentDet: null,
 | 
			
		||||
			currentNode: null
 | 
			
		||||
 | 
			
		||||
			currentNode: null,
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		'form.sectionId': {
 | 
			
		||||
			handler(id) {
 | 
			
		||||
			},
 | 
			
		||||
			handler(id) {},
 | 
			
		||||
			immediate: false,
 | 
			
		||||
		},
 | 
			
		||||
		currentDet: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				this.$emit('det-selected', val)
 | 
			
		||||
				this.$emit('det-selected', val);
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: true
 | 
			
		||||
		}
 | 
			
		||||
			immediate: true,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
		this.loadLayout().then(json => {
 | 
			
		||||
			this.initGraph(json)
 | 
			
		||||
		})
 | 
			
		||||
		this.loadLayout().then((json) => {
 | 
			
		||||
			this.initGraph(json);
 | 
			
		||||
		});
 | 
			
		||||
	},
 | 
			
		||||
	deactivated() {
 | 
			
		||||
		this.graph.dispose();
 | 
			
		||||
		this.$nextTick(() => {
 | 
			
		||||
			this.resetLayout();
 | 
			
		||||
			this.graph = null;
 | 
			
		||||
		})
 | 
			
		||||
		});
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {
 | 
			
		||||
 | 
			
		||||
		initGraph(json) {
 | 
			
		||||
			const graph = new Graph({
 | 
			
		||||
				container: this.$refs.panel,
 | 
			
		||||
@@ -144,7 +177,7 @@ export default {
 | 
			
		||||
				},
 | 
			
		||||
				history: true,
 | 
			
		||||
				selecting: {
 | 
			
		||||
					className: 'my-select'
 | 
			
		||||
					className: 'my-select',
 | 
			
		||||
				},
 | 
			
		||||
				connecting: {
 | 
			
		||||
					snap: true,
 | 
			
		||||
@@ -155,24 +188,17 @@ export default {
 | 
			
		||||
					allowEdge: false,
 | 
			
		||||
				},
 | 
			
		||||
				panning: true,
 | 
			
		||||
				// scroller: {
 | 
			
		||||
				// 	enabled: true,
 | 
			
		||||
				// 	pannable: true,
 | 
			
		||||
				// 	cursor: '',
 | 
			
		||||
				// 	width: 800,
 | 
			
		||||
				// 	height: 200
 | 
			
		||||
				// },
 | 
			
		||||
				mousewheel: {
 | 
			
		||||
					enabled: true,
 | 
			
		||||
					modifiers: ['ctrl', 'meta']
 | 
			
		||||
				}
 | 
			
		||||
					modifiers: ['ctrl', 'meta'],
 | 
			
		||||
				},
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			graph.fromJSON(json)
 | 
			
		||||
			graph.fromJSON(json);
 | 
			
		||||
			this.graph = graph;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.registerGraphEvents();
 | 
			
		||||
			})
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		registerGraphEvents() {
 | 
			
		||||
@@ -182,31 +208,33 @@ export default {
 | 
			
		||||
				this.currentDet = null;
 | 
			
		||||
				this.currentNode = null;
 | 
			
		||||
 | 
			
		||||
				nodes.forEach(node => {
 | 
			
		||||
				nodes.forEach((node) => {
 | 
			
		||||
					node.attr('container/stroke', '#ccc');
 | 
			
		||||
				});
 | 
			
		||||
				edges.forEach(edge => {
 | 
			
		||||
					edge.attr('line/stroke', '#ccc')
 | 
			
		||||
				})
 | 
			
		||||
			}
 | 
			
		||||
				edges.forEach((edge) => {
 | 
			
		||||
					edge.attr('line/stroke', '#ccc');
 | 
			
		||||
				});
 | 
			
		||||
			};
 | 
			
		||||
 | 
			
		||||
			this.graph.on('node:click', ({ e, x, y, node, view }) => {
 | 
			
		||||
				reset();
 | 
			
		||||
				node.attr('container/stroke', '#0b58ff');
 | 
			
		||||
				const { detId, detName, detDesc, processId, sectionId, sectionName } = node.attrs;
 | 
			
		||||
				this.currentDet = {}
 | 
			
		||||
				this.$set(this.currentDet, 'detId', detId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'sectionId', sectionId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'detName', detName.text)
 | 
			
		||||
				this.$set(this.currentDet, 'detDesc', detDesc.text)
 | 
			
		||||
				this.$set(this.currentDet, 'flowId', processId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'sectionName', sectionName.text)
 | 
			
		||||
				this.currentNode = node
 | 
			
		||||
				const { detId, detName, detDesc, processId, sectionId, sectionName } =
 | 
			
		||||
					node.attrs;
 | 
			
		||||
				console.log('node clicked!', node)
 | 
			
		||||
				this.currentDet = {};
 | 
			
		||||
				this.$set(this.currentDet, 'detId', detId?.text);
 | 
			
		||||
				this.$set(this.currentDet, 'sectionId', sectionId?.text);
 | 
			
		||||
				this.$set(this.currentDet, 'detName', detName?.text);
 | 
			
		||||
				this.$set(this.currentDet, 'detDesc', detDesc?.text);
 | 
			
		||||
				this.$set(this.currentDet, 'flowId', processId?.text);
 | 
			
		||||
				this.$set(this.currentDet, 'sectionName', sectionName?.text);
 | 
			
		||||
				this.currentNode = node;
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('edge:click', ({ e, x, y, edge, view }) => {
 | 
			
		||||
				// console.log('edge clicked!', edge)
 | 
			
		||||
				reset();
 | 
			
		||||
				edge.attr('line/stroke', '#0b58ff')
 | 
			
		||||
				edge.attr('line/stroke', '#0b58ff');
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('blank:click', ({ e, x, y }) => {
 | 
			
		||||
				reset();
 | 
			
		||||
@@ -219,30 +247,30 @@ export default {
 | 
			
		||||
						y: 0,
 | 
			
		||||
						offset: { x: 0, y: 0 },
 | 
			
		||||
						onClick: ({ e, cell, view }) => {
 | 
			
		||||
							this.$confirm(
 | 
			
		||||
								'确定删除这个工序吗?',
 | 
			
		||||
								'提示',
 | 
			
		||||
								{
 | 
			
		||||
									confirmButtonText: '确定',
 | 
			
		||||
									cancelButtonText: '取消',
 | 
			
		||||
									type: 'warning'
 | 
			
		||||
								}
 | 
			
		||||
							).then(async () => {
 | 
			
		||||
								const id = node.attrs.detId.text;
 | 
			
		||||
								const status = await this.handleDelete(id);
 | 
			
		||||
								if (status) {
 | 
			
		||||
									view.cell.remove();
 | 
			
		||||
								}
 | 
			
		||||
							}).catch(err => {
 | 
			
		||||
								return;
 | 
			
		||||
							this.$confirm('确定删除这个工序吗?', '提示', {
 | 
			
		||||
								confirmButtonText: '确定',
 | 
			
		||||
								cancelButtonText: '取消',
 | 
			
		||||
								type: 'warning',
 | 
			
		||||
							})
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
								.then(async () => {
 | 
			
		||||
									const id = node.attrs.detId.text;
 | 
			
		||||
									const status = await this.handleDelete(id);
 | 
			
		||||
									if (status) {
 | 
			
		||||
										view.cell.remove();
 | 
			
		||||
										// 更新布局,不然下次打开删除的节点还在
 | 
			
		||||
										this.handleUpdateLayout();
 | 
			
		||||
									}
 | 
			
		||||
								})
 | 
			
		||||
								.catch((err) => {
 | 
			
		||||
									return;
 | 
			
		||||
								});
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('node:mouseleave', ({ node }) => {
 | 
			
		||||
				node.removeTools();
 | 
			
		||||
			})
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		resetLayout() {
 | 
			
		||||
@@ -250,13 +278,13 @@ export default {
 | 
			
		||||
				id: null,
 | 
			
		||||
				flowId: null,
 | 
			
		||||
				content: '',
 | 
			
		||||
				createTime: null
 | 
			
		||||
			}
 | 
			
		||||
				createTime: null,
 | 
			
		||||
			};
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async loadLayout() {
 | 
			
		||||
			const flowId = this.$route.params.id;
 | 
			
		||||
			if (!flowId) return { cells: [] }
 | 
			
		||||
			if (!flowId) return { cells: [] };
 | 
			
		||||
			const { code, data } = await this.info({ id: flowId });
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				if (data) {
 | 
			
		||||
@@ -269,9 +297,9 @@ export default {
 | 
			
		||||
			return Promise.reject(this.infoUrl + ' 接口出错!');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleToJson() { },
 | 
			
		||||
		handleToJson() {},
 | 
			
		||||
 | 
			
		||||
		handleLoadJson() { },
 | 
			
		||||
		handleLoadJson() {},
 | 
			
		||||
 | 
			
		||||
		handleDumpJson() {
 | 
			
		||||
			if (this.graph) {
 | 
			
		||||
@@ -282,17 +310,25 @@ export default {
 | 
			
		||||
		async handleUpdateLayout() {
 | 
			
		||||
			this.layout.content = JSON.stringify(this.graph.toJSON());
 | 
			
		||||
			let code, data;
 | 
			
		||||
			console.table([this.layout, this.$route.params.id])
 | 
			
		||||
			console.table([this.layout, this.$route.params.id]);
 | 
			
		||||
			// 手动刷新布局
 | 
			
		||||
			if (this.layout.id) {
 | 
			
		||||
				({ code, data } = await this.http('/extend/process-flow-view/update', 'put', this.layout));
 | 
			
		||||
				({ code, data } = await this.http(
 | 
			
		||||
					'/extend/process-flow-view/update',
 | 
			
		||||
					'put',
 | 
			
		||||
					this.layout
 | 
			
		||||
				));
 | 
			
		||||
			} else {
 | 
			
		||||
				this.layout.flowId = this.$route.params.id;
 | 
			
		||||
				({ code, data } = await this.http('/extend/process-flow-view/create', 'post', this.layout));
 | 
			
		||||
				({ code, data } = await this.http(
 | 
			
		||||
					'/extend/process-flow-view/create',
 | 
			
		||||
					'post',
 | 
			
		||||
					this.layout
 | 
			
		||||
				));
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.$modal.msgSuccess('布局已刷新!')
 | 
			
		||||
				this.$modal.msgSuccess('布局已刷新!');
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
@@ -325,12 +361,11 @@ export default {
 | 
			
		||||
			this.title = '编辑工序';
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.open = true;
 | 
			
		||||
			})
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async handleDelete(id) {
 | 
			
		||||
			const { code, data } = await this.delete({ id });
 | 
			
		||||
			debugger;
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.$modal.msgSuccess('成功删除一个工序!');
 | 
			
		||||
				return true;
 | 
			
		||||
@@ -349,17 +384,17 @@ export default {
 | 
			
		||||
					this.updateProcess()
 | 
			
		||||
						.then((form) => {
 | 
			
		||||
							const { name, sectionId, remark } = form;
 | 
			
		||||
							getSectionFrom(sectionId).then(sectionName => {
 | 
			
		||||
							getSectionFrom(sectionId).then((sectionName) => {
 | 
			
		||||
								// 修改当前node的信息
 | 
			
		||||
								this.currentNode.setAttrs({
 | 
			
		||||
									detName: { text: name },
 | 
			
		||||
									sectionId: { text: sectionId },
 | 
			
		||||
									sectionName: { text: sectionName },
 | 
			
		||||
									detDesc: { text: remark }
 | 
			
		||||
								})
 | 
			
		||||
							})
 | 
			
		||||
									detDesc: { text: remark },
 | 
			
		||||
								});
 | 
			
		||||
							});
 | 
			
		||||
						})
 | 
			
		||||
						.catch(err => { });
 | 
			
		||||
						.catch((err) => {});
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
@@ -368,19 +403,22 @@ export default {
 | 
			
		||||
						if (!id) return null;
 | 
			
		||||
						return createProcessNode({
 | 
			
		||||
							flowId: flowId,
 | 
			
		||||
							name, sectionId, remark,
 | 
			
		||||
							name,
 | 
			
		||||
							sectionId,
 | 
			
		||||
							remark,
 | 
			
		||||
							id,
 | 
			
		||||
						})
 | 
			
		||||
					}).then(node => {
 | 
			
		||||
						});
 | 
			
		||||
					})
 | 
			
		||||
					.then((node) => {
 | 
			
		||||
						if (!node) {
 | 
			
		||||
							this.$modal.msgError('创建节点失败');
 | 
			
		||||
							return;
 | 
			
		||||
						};
 | 
			
		||||
						}
 | 
			
		||||
						this.graph.addNode(node);
 | 
			
		||||
					}).catch(err => {
 | 
			
		||||
					})
 | 
			
		||||
					.catch((err) => {
 | 
			
		||||
						return;
 | 
			
		||||
					});
 | 
			
		||||
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
@@ -390,17 +428,16 @@ export default {
 | 
			
		||||
				this.$modal.msgError('工艺ID不能为空');
 | 
			
		||||
				return Promise.reject('工艺ID不能为空');
 | 
			
		||||
			}
 | 
			
		||||
			return this.put({ flowId, ...this.form })
 | 
			
		||||
				.then(({ code, data }) => {
 | 
			
		||||
					if (code == 0) {
 | 
			
		||||
						this.$modal.msgSuccess('修改成功');
 | 
			
		||||
					} else {
 | 
			
		||||
						this.$modal.msgError('修改失败');
 | 
			
		||||
					}
 | 
			
		||||
					const formCopy = { ...this.form }
 | 
			
		||||
					this.open = false;
 | 
			
		||||
					return formCopy;
 | 
			
		||||
				});
 | 
			
		||||
			return this.put({ flowId, ...this.form }).then(({ code, data }) => {
 | 
			
		||||
				if (code == 0) {
 | 
			
		||||
					this.$modal.msgSuccess('修改成功');
 | 
			
		||||
				} else {
 | 
			
		||||
					this.$modal.msgError('修改失败');
 | 
			
		||||
				}
 | 
			
		||||
				const formCopy = { ...this.form };
 | 
			
		||||
				this.open = false;
 | 
			
		||||
				return formCopy;
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		createProcess() {
 | 
			
		||||
@@ -410,22 +447,22 @@ export default {
 | 
			
		||||
				this.$modal.msgError('工艺ID不能为空');
 | 
			
		||||
				return Promise.reject('工艺ID不能为空');
 | 
			
		||||
			}
 | 
			
		||||
			console.log('create process', this.form)
 | 
			
		||||
			console.log('create process', this.form);
 | 
			
		||||
			// 添加的提交
 | 
			
		||||
			return this.post({ flowId, ...this.form }).then(
 | 
			
		||||
				({ code, data }) => {
 | 
			
		||||
			return this.post({ flowId, ...this.form })
 | 
			
		||||
				.then(({ code, data }) => {
 | 
			
		||||
					this.$modal.msgSuccess('新增成功');
 | 
			
		||||
					this.open = false;
 | 
			
		||||
					// this.getList();
 | 
			
		||||
					return {
 | 
			
		||||
						id: data, // 服务器返回的新建的工段id
 | 
			
		||||
						...this.form,  // 保存一份 this.form 副本,当 open->false 时 this.form 里的信息就清空了
 | 
			
		||||
						flowId
 | 
			
		||||
						...this.form, // 保存一份 this.form 副本,当 open->false 时 this.form 里的信息就清空了
 | 
			
		||||
						flowId,
 | 
			
		||||
					};
 | 
			
		||||
				}
 | 
			
		||||
			).catch(err => {
 | 
			
		||||
				this.$modal.msgError(err)
 | 
			
		||||
			});
 | 
			
		||||
				})
 | 
			
		||||
				.catch((err) => {
 | 
			
		||||
					this.$modal.msgError(err);
 | 
			
		||||
				});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		put(payload) {
 | 
			
		||||
@@ -452,7 +489,7 @@ export default {
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
 
 | 
			
		||||
@@ -20,7 +20,7 @@ export default {
 | 
			
		||||
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      url: process.env.VUE_APP_BASE_API + "/jmreport/list?token=" + getAccessToken(),
 | 
			
		||||
      url: process.env.VUE_APP_JIMU_API + "/jmreport/list?token=" + getAccessToken(),
 | 
			
		||||
    };
 | 
			
		||||
  },
 | 
			
		||||
};
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-11-03 14:56:25
 | 
			
		||||
 * @LastEditTime: 2023-11-17 09:52:17
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -130,6 +130,7 @@ export default {
 | 
			
		||||
				allowTime: 0,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: '',
 | 
			
		||||
        storageType:2
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				code: [
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-11-03 14:56:25
 | 
			
		||||
 * @LastEditTime: 2023-11-17 09:51:59
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -130,6 +130,7 @@ export default {
 | 
			
		||||
				allowTime: 0,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: '',
 | 
			
		||||
        storageType:5
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				code: [
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-11-03 14:56:25
 | 
			
		||||
 * @LastEditTime: 2023-11-17 09:51:44
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -130,6 +130,7 @@ export default {
 | 
			
		||||
				allowTime: 0,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: '',
 | 
			
		||||
        storageType:3
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				code: [
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-11-03 14:56:25
 | 
			
		||||
 * @LastEditTime: 2023-11-17 09:51:29
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -130,6 +130,7 @@ export default {
 | 
			
		||||
				allowTime: 0,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: '',
 | 
			
		||||
        storageType:4
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				code: [
 | 
			
		||||
 
 | 
			
		||||
@@ -2,7 +2,7 @@
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 13:52:10
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-11-03 14:56:25
 | 
			
		||||
 * @LastEditTime: 2023-11-17 09:50:55
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
@@ -130,6 +130,7 @@ export default {
 | 
			
		||||
				allowTime: 0,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: '',
 | 
			
		||||
        storageType:1
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				code: [
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user