|
|
@@ -1,10 +1,5 @@
|
|
|
<template>
|
|
|
<div class="main-div" style="width:100%;height:100%;" ref="mainDiv">
|
|
|
- {{ this.exportData }}
|
|
|
- <!-- {{this.importValue}}-->
|
|
|
- <!-- {{this.process.currentEdgeId}}-->
|
|
|
- <!-- {{this.process.currentNodeId}}-->
|
|
|
- <!-- 测试导入初始数据 -->
|
|
|
<Layout>
|
|
|
<!-- 左侧工具栏 -->
|
|
|
<Sider :width="180">
|
|
|
@@ -14,10 +9,10 @@
|
|
|
<!-- 顶部工具栏 -->
|
|
|
<Header class="header">
|
|
|
<Button @click="()=>{this.graph.exportPNG('',{padding:50})}">导出PNG</Button>
|
|
|
- <Button @click="()=>{this.exportData=this.graph.toJSON()}" style="margin-left:10px;">导出json</Button>
|
|
|
- <Button @click="()=>{this.graph.fromJSON(JSON.parse(this.importValue))}" style="margin-left:10px;">导入json
|
|
|
- </Button>
|
|
|
- <Input v-model="importValue"/>
|
|
|
+ <Button @click="exportJson" style="margin-left:10px;">导出JSON</Button>
|
|
|
+ <Upload action="" accept=".json" :before-upload="uploadJson">
|
|
|
+ <Button style="margin:7px 0 0 10px;">导入JSON</Button>
|
|
|
+ </Upload>
|
|
|
</Header>
|
|
|
<!-- 中间流程图 -->
|
|
|
<Content>
|
|
|
@@ -54,6 +49,7 @@ const insertCss = require('insert-css')
|
|
|
const zt1 = require('./data/zt1.json')
|
|
|
import Process from '@/view/process/process-flow/config/ProcessConfig'
|
|
|
import { formMixin } from '@/mixins/form'
|
|
|
+import FileSaver from 'file-saver'
|
|
|
|
|
|
export default {
|
|
|
name: 'process-setting',
|
|
|
@@ -98,6 +94,54 @@ export default {
|
|
|
methods: {
|
|
|
...mapMutations(['setProcessNodeModalDisplay', 'setProcessEdgeModalDisplay', 'setCurrentNodeId', 'setCurrentEdgeId']),
|
|
|
/**
|
|
|
+ * @desc : 导出json方法
|
|
|
+ * @author : 张潇木
|
|
|
+ * @date : 2023/5/10 9:52
|
|
|
+ */
|
|
|
+ exportJson(){
|
|
|
+ // JSON.stringify(data, null, 2): 格式化json数据 方便阅读
|
|
|
+ FileSaver.saveAs(new Blob([JSON.stringify(this.graph.toJSON(),null,2)], {type: 'application/json'}), 'flow.json')
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * @desc : 导入json
|
|
|
+ * @author : 张潇木
|
|
|
+ * @date : 2023/5/10 10:17
|
|
|
+ */
|
|
|
+ uploadJson(file){
|
|
|
+ //检验文件类型
|
|
|
+ if(file.type!='application/json'){
|
|
|
+ console.log('file.type',file.type)
|
|
|
+ this.$Message.error('导入失败，请上传JSON类型的文件')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+ //读取json
|
|
|
+ let reader = new FileReader()
|
|
|
+ reader.readAsText(file)
|
|
|
+ reader.onload = ((e) => {
|
|
|
+ console.log('e',e)
|
|
|
+ let uploadData = JSON.parse(e.target.result)
|
|
|
+ console.log('uploadData',uploadData)
|
|
|
+ if(!uploadData.cells){
|
|
|
+ //校验数据结构
|
|
|
+ this.$Message.error('导入失败，请检查JSON文件数据结构')
|
|
|
+ }else{
|
|
|
+ //根据数据绘制图形
|
|
|
+ this.graph.fromJSON(uploadData)
|
|
|
+ // region 暂时不考虑复杂场景，导入数据不需处理
|
|
|
+ // let allCells=this.graph.getCells()
|
|
|
+ // this.graph.cut(allCells)
|
|
|
+ // this.graph.paste({ offset: 0 })
|
|
|
+ // this.graph.cleanSelection()
|
|
|
+ // endregion
|
|
|
+ this.$Message.success('导入成功')
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+ return false
|
|
|
+ },
|
|
|
+ /**
|
|
|
* @desc : 获取基础数据
|
|
|
* @author : 张潇木
|
|
|
* @date : 2023/1/31 13:42
|
|
|
@@ -244,7 +288,6 @@ export default {
|
|
|
if (cells.length) {
|
|
|
//取成型节点id
|
|
|
let shapingNodes=cells.filter(it=>it.getData()?.nodeKind === this.$config.nodeKind.shaping).map(it=> {return it.getData()?.nodeId})
|
|
|
- console.log('shapingNodes',shapingNodes)
|
|
|
if(shapingNodes.length){
|
|
|
//查询是否存在绑定的成型线
|
|
|
this.excute(this.$service.processService, this.$service.processService.getBindMolding, shapingNodes).then(res => {
|
