智能制图通过vuex存参数

src/pages/workbench/intelligent_drawing.vue

@@ -8,7 +8,7 @@
     </div>
 
     <div class="main-container">
-      <iframe ref="intelligent_drawing_iframe" width="100%" height="100%" scrolling="no" :src="url" frameborder="0"></iframe>
+      <iframe ref="intelligent_drawing_iframe" width="100%" height="100%" scrolling="no" :src="znztUrl" frameborder="0"></iframe>
     </div>
   </div>
 </template>
@@ -17,20 +17,49 @@
 export default {
   data() {
     return {
-      url:'https://apaasgis.wodcloud.com/portal/apaasplat/viewer/mapViewer.html'
+      url:'https://zhangh.wodcloud.com/portal/apaasplat/viewer/mapViewer.html',
     };
   },
+  computed:{
+    getZnztParams() {
+      return this.$store.state.znztParams;
+    },
+    getAppBuilderParams() {
+      return this.$store.state.appBuilderParams;
+    },
+    znztUrl(){
+      return this.url+this.urlParams
+    },
+    urlParams(){
+      if(this.$store.state.znztParams){
+        return `?webmap=${this.$store.state.znztParams.id}`;
+      }else{
+        return ''
+      }
+    },
+  },
+  watch: {
+    getZnztParams(newVal) {
+      this.urlParams = `?webmap=${newVal.id}`
+      console.log('智能制图参数'+newVal)
+    },
+    getAppBuilderParams(newVal) {
+      console.log('智能制图应用程序参数'+newVal)
+    },
+  },
   mounted() {
     window.addEventListener('message',event =>{
       let data = event.data;
       // 智能制图发布服务
       if (data.cmd == 'mapviewmsg'){
         console.log(data);
+        this.$store.commit("setZnztParams", data.params);
         this.$router.push(`/fwzc/fwcs`);
       }
       // App Builder发布服务
       if (data.cmd == 'appbuildermsg'){
         console.log(data);
+        this.$store.commit("setAppBuilderParams", data.params);
         this.$router.push(`/fwzc/fwcs`);
       }
     })

src/store/index.js

@@ -19,6 +19,8 @@ const store = new Vuex.Store({
     ], // 应用管理列表，onlyRead
     shoppingCart: [], //购物车
     menuCartState: 0, //购物车操作都要修改这个值，menu监听这个值的变化实时获取购物车列表
+    znztParams: null, //智能制图传入过来的数据
+    appBuilderParams: null, //应用程序传入过来的数据
   },
   getters: {
     // 1：超管 2：组织管理员 3：普通用户 4：开发者
@@ -52,6 +54,12 @@ const store = new Vuex.Store({
     setMenuCartState(state) {
       state.menuCartState++;
     },
+    setZnztParams(state, newValue) {
+      state.znztParams = newValue;
+    },
+    setAppBuilderParams(state, newValue) {
+      state.appBuilderParams = newValue;
+    },
   },
 });