保存画布

src/views/dialogs-components/global/database-choose/main.vue

@@ -4,9 +4,13 @@
       <el-row :gutter="10">
         <el-col :span="14">
 
-          <el-select style="width: 100%" v-model="selectName" placeholder="请选择选择数据库连接" @focus="clickFunc" @change="selectNameFunc">
+          <!-- <el-select style="width: 100%" v-model="selectName" placeholder="请选择选择数据库连接" @focus="clickFunc" @change="selectNameFunc">
+              <el-option v-for="(item,index) in namesList" :key="index" :label="item.name" :value="item.name"></el-option>
+          </el-select> -->
+          <el-select style="width: 100%" v-model="selectName" placeholder="请选择选择数据库连接" @focus="getGraphDataBases" >
               <el-option v-for="(item,index) in namesList" :key="index" :label="item.name" :value="item.name"></el-option>
           </el-select>
+
         </el-col>
         <el-col class="line" :span="3">
           <el-button size="mini" @click.native="editDataBaseModal()">编辑</el-button></el-col
@@ -165,6 +169,7 @@ export default {
     },
     //浏览
     scanTree(type){
+     console.log('当前选中链接***************',this.selectName);
        this.chooseType=type;
       if(this.selectName){   
           // this.$refs.establishDia.database(this.selectName);
@@ -180,8 +185,19 @@ export default {
           this.$message.error('请选择数据库')
         }
       
+    },
+    // 获取保存到画布的databases
+    getGraphDataBases(){
+      // var graph = this.getGraph();
+      var root = this.newGraph.getDefaultParent(), data = [];
+      if(root.getAttribute('databases') != null)
+        data=JSON.parse(root.getAttribute('databases'));
+        console.log('获取到画布上的databases====',data);
+        this.namesList=data;
+
     }
 
+  
   },
   // 监听编号好后获取选择的数据库的树形里列表
   watch: {

src/views/dialogs-components/global/establish/main.vue

@@ -498,7 +498,14 @@ export default {
     // 转换数据库详情
     getTransDatabase(name) {
       let data = new FormData();
-      data.append("graphXml", this.getXmlVal);
+      // data.append("graphXml", this.getXmlVal);
+      
+      const codec = new mxCodec();
+      const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
+      console.log("转码钱画布详情：", encodedModel);
+      var myXmlVal = mxUtils.getXml(encodedModel);//xml字符串
+
+      data.append("graphXml", myXmlVal);
       data.append("name", name);
       getTransDatabase(data).then((res) => {
         if (res) {
@@ -513,7 +520,12 @@ export default {
     //作业数据库详情
     getJobDatabase(name) {
       let data = new FormData();
-      data.append("graphXml", this.getXmlVal);
+      // data.append("graphXml", this.getXmlVal);
+      const codec = new mxCodec();
+      const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
+      var myXmlVal = mxUtils.getXml(encodedModel);//xml字符串
+
+      data.append("graphXml", myXmlVal);
       data.append("name", name);
       getJobDatabase(data).then((res) => {
         if (res) {
@@ -672,6 +684,19 @@ export default {
 
 
           
+          
+
+
+        
+              var formData = new FormData();
+              formData.append("databaseInfo", JSON.stringify(params));
+              console.log("表单提交参数==", params);
+              // 判断新增还是编辑start===============
+              console.log("编辑表单提交参数==", formData);
+              check(formData).then((res) => {
+                console.log("提交数据：", res);
+                if (res.success) {
+
           // 保存参数到画布不触发后台方法start=============
           if(this.noneRespository==1){
               console.log(this.newGraph,'最内层接收画布99999999999999')
@@ -693,11 +718,8 @@ export default {
                   })
 
             }
-
-              // return
             this.newGraph.getModel().beginUpdate();
             try{
-            // var edit = new mxCellAttributeChange(root, 'databases', Ext.encode(jsonArray));
             var edit = new mxCellAttributeChange(root, 'databases', JSON.stringify(jsonArray));
                 this.newGraph.getModel().execute(edit);
             }
@@ -712,32 +734,18 @@ export default {
             const encodedModel = codec.encode(this.newGraph.getModel());//xml对象
             var myXmlVal = mxUtils.getXml(encodedModel);//xml字符串
             console.log(encodedModel, 8888888888888); 
+             this.$emit("getSonValue", false); //组件要传回父组件的值,关闭弹窗
 
         // return
         }
          // 保存参数到画布不触发后台方法end=============
 
-
+          // 保存到后台 start==============================
           if(this.noneRespository==0){
-              var formData = new FormData();
-              formData.append("databaseInfo", JSON.stringify(params));
-              console.log("表单提交参数==", params);
-              // 判断新增还是编辑start===============
-              console.log("编辑表单提交参数==", formData);
-              check(formData).then((res) => {
-                console.log("提交数据：", res);
-                if (res.success) {
-                  // this.$message.success('成功!');
-                  // this.dialogVisibleFourth=false;//关闭弹窗
-                  // this.linkCheckedIdx=this.initlinkTypeIdx;//关闭弹窗后初始化选择的数据
-
-                  // this.listNames();//刷新已经创建的数据库列表
-                  // this.addFlag=true;//更改新增或者编辑变量
                   create(formData).then((res) => {
                     console.log("提交数据：", res);
                     if (res.success) {
                       this.$message.success("成功!");
-                      // this.dialogVisibleFourth=false;//关闭弹窗
                       this.$emit("getSonValue", false); //组件要传回父组件的值,关闭弹窗
                       this.linkCheckedIdx = this.initlinkTypeIdx; //关闭弹窗后初始化选择的数据
                       this.listNames(); //刷新已经创建的数据库列表
@@ -745,12 +753,21 @@ export default {
                       this.$message.error(res.message);
                     }
                   });
+
+
+
+                 }
+          //保存到后台end======================================
+
+
+
+
                 } else {
                   this.$message.error(res.message);
                 }
               });
               
-            }
+           
             // 判断新增还是编辑end===============
         }
       });