修复了customview显示值的问题

src/App.vue

@@ -106,10 +106,12 @@ export default class App extends Vue {
 
   mounted() {
   // var fragment = window.location.hash;
-  var fragment = "#/dataserver/DataByTimeFuzzy";
+   var fragment = "#/card0";
+  console.log(fragment);
   if (fragment != "#") {
     fragment = fragment.substring(1,fragment.length);
     var customViewURL = "customView/template" + fragment;
+    console.log(customViewURL);
     axios.get(customViewURL).then(response => {
       if(response.data.CFET2CORE_SAMPLE_ISVALID == false || response.data.CFET2CORE_SAMPLE_VAL == null)
       {
@@ -161,20 +163,22 @@ export default class App extends Vue {
         //返回有值的customview template，进行load处理
           var customviewTemplate:string;
           customviewTemplate = response.data.CFET2CORE_SAMPLE_VAL;
+          console.log(customviewTemplate);
           var widgets = Object.assign(
           new AllWidgetConfig(),
           JSON.parse(customviewTemplate));
+          console.log(widgets);
           this.widgetList = widgets.widgetList;
           this.lastWidgetIndex = Number(widgets.currentRef);
           this.$forceUpdate(); 
-          this.importActiveWidgetList();
           //替换startpath
           Vue.nextTick(() => { 
-          fragment = fragment.substring(1,fragment.length);
-          for (var wid of this.widgetList) {
-               ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).replaceStartPath( fragment as string);
-           } 
+          // fragment = fragment.substring(1,fragment.length);
+          // for (var wid of this.widgetList) {
+          //      ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).replaceStartPath( fragment as string);
+          //  } 
           //刷新值
+          this.importActiveWidgetList();
            for (var wid of this.widgetList) {
                ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).refresh();
            } 
@@ -198,6 +202,7 @@ export default class App extends Vue {
 
   importActiveWidgetList() {
     for (var wid of this.widgetList) {
+      console.log(wid.widgetConfig);
        ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).setConfig( wid.widgetConfig as WidgetConfig);
     }
   }

src/assets/css/fontSize.css

+.smallFont{
+    font-size: 18px;
+}
+.largeFont{
+    font-size: 22px;
+}
+.largeFont span{
+    float: left;
+}
\ No newline at end of file

src/components/Common/WidgetParams.vue

@@ -7,7 +7,7 @@
       </div>
     </div>
     <div class="col-md-1">
-      <button type="button" class="btn btn-primary btn-mid" style="float:right" @click="update">
+      <button type="button" class="btn btn-primary btn-mid" @click="update">
         <b>{{ action }}</b>
         <span class="glyphicon glyphicon-save"></span>
       </button>
@@ -16,6 +16,8 @@
 </template>
 
 
+
+
 <script lang="ts">
 import { Component, Prop, Vue, Watch, Emit } from 'vue-property-decorator';
 import { UpdatePayload } from '../../models/UpdatePayload';

src/components/Config/Config.vue

@@ -3,16 +3,21 @@
     <b-row style="margin-top:10px">
       <b-col>
         <span style="float:left;font-size:20px">getPath: {{ config.data.get.url }}</span>
-        <span style="float:left;font-size:20px">setPath: {{ config.data.set.url }}</span>
       </b-col>
       <b-col>
         <b-button @click="showPathConfig" variant="primary" style="float:right"><span class="glyphicon glyphicon-cog"></span></b-button>
       </b-col>
       <hr />
     </b-row>
+    <b-row style="margin-top:10px">
+      <b-col>
+        <span style="float:left;font-size:20px">setPath: {{ config.data.set.url }}</span>
+      </b-col>
+    </b-row>
     <div style="width:100%">
       <span style="float:left;font-size:20px">getConfigValue:{{ getConfigValue }}</span>
-      <hr />
+      <div><hr v-show="isShowPath"/></div>
+      
       <!-- <span style="float:left;font-size:20px">setConfigValue:{{ setConfigValue }}</span>
       <hr /> -->
     </div>
@@ -23,17 +28,17 @@
         <b-button @click="updateGetUI" size="sm" text="Button" variant="primary">OK</b-button>
       </b-input-group-append>
     </b-input-group>
-    <hr/>
-    <WidgetParams ref="WidgetGetParams" v-show="isShowGetParams&&isShowPath" action="get"  @updataVariables="getViewLoad" ></WidgetParams>
-    <hr/>
+    <div><hr v-show="isShowGetParams&&isShowPath"/></div>
+    <WidgetParams ref="WidgetGetParams" v-show="isShowGetParams&&isShowPath" action="get"  @updataVariables="viewGetLoad" ></WidgetParams>
+    <div><hr v-show="isShowPath"/></div>
     <b-input-group prepend="setPath" v-show="isShowPath">
       <b-form-input v-model="config.data.set.url"></b-form-input>
       <b-input-group-append>
         <b-button @click="updateSetUI" size="sm" text="Button" variant="primary">OK</b-button>
       </b-input-group-append>
     </b-input-group>
-    <hr/>
-    <WidgetParams ref="WidgetSetParams" v-show="isShowSetParams&&isShowPath" action="set"  @updataVariables="setViewLoad" ></WidgetParams>
+    <div><hr v-show="isShowSetParams&&isShowPath"/></div>
+    <WidgetParams ref="WidgetSetParams" v-show="isShowSetParams&&isShowPath" action="set"  @updataVariables="viewSetLoad" ></WidgetParams>
   </b-container>
 </template>
 
@@ -90,15 +95,15 @@ export default class Config extends Widget {
     this.config.data.set.userInputData = this.strMapObjChange.strMapToObj(this.userSetInputData);
   }
 
-  mounted()
-  {
-    this.timer = setInterval(this.refresh,1000);
-  }
+  // mounted()
+  // {
+  //   this.timer = setInterval(this.refresh,1000);
+  // }
 
-  destroyed() 
-  {
-    clearInterval(this.timer);
-  }
+  // destroyed() 
+  // {
+  //   clearInterval(this.timer);
+  // }
 
   updateUI()
   {

src/components/Method/Method.vue

@@ -65,14 +65,14 @@ export default class Method extends Widget {
     }
   };
 
-  created() {
-    // this.config.data.userInputData = this.userInputData;
-    this.config.data.userInputData = this.strMapObjChange.strMapToObj(this.userInputData);
-  }
-  mounted()
-  {
-    this.timer = setInterval(this.refresh,1000);
-  }
+  // created() {
+  //   // this.config.data.userInputData = this.userInputData;
+  //   this.config.data.userInputData = this.strMapObjChange.strMapToObj(this.userInputData);
+  // }
+  // mounted()
+  // {
+  //   this.timer = setInterval(this.refresh,1000);
+  // }
 
   destroyed() 
   {

src/components/Status/Status.vue

@@ -65,15 +65,15 @@ export default class Status extends Widget {
     }
   };
 
-  created() {
-    // this.config.data.userInputData = this.userInputData;
-    this.config.data.userInputData = this.strMapObjChange.strMapToObj(this.userInputData);
-  }
-
-  mounted()
-  {
-    this.timer = setInterval(this.refresh,1000);
-  }
+  // created() {
+  //   // this.config.data.userInputData = this.userInputData;
+  //   this.config.data.userInputData = this.strMapObjChange.strMapToObj(this.userInputData);
+  // }
+
+  // mounted()
+  // {
+  //   this.timer = setInterval(this.refresh,1000);
+  // }
 
   destroyed() 
   {

src/components/WaveView/WaveView.vue

 <template>
 <div class="waveView">
-    <div class="panel panel-default">
-        <button type="button" class="btn btn-primary btn-mid" @click="minus" style="float:right">
-            <span class="glyphicon glyphicon-minus"></span>
-        </button>
-        <button type="button" class="btn btn-primary btn-mid" @click="add" style="float:right">
-            <span class="glyphicon glyphicon-plus"></span>
-        </button>
     <showViewInfo :pathId="pathId"></showViewInfo>
-        <div class="panel-body">
     <div ref="wave">
     
     </div>
-        </div>
     <setBasicParams ref="setBasicParams" @getPathId="getPathId" @updateConfig="updateConfig" :wave="wave" :setConfig='config'></setBasicParams>
-    </div>
 </div>
 </template>
 
@@ -28,6 +18,7 @@ import global_ from '@/components/Common/global.vue';
 import { WidgetConfig } from '@/models/WidgetConfig';
 import { UpdatePayload } from '@/models/UpdatePayload';
 import { Widget } from '@/models/wiget';
+import StrMapObjChange from "@/models/StrMapObjChange";
 
 
 @Component({
@@ -40,6 +31,8 @@ export default class waveView extends Widget {
     WidgetComponentName: string = 'waveView';
     wave: any = '';
     pathId: string = '';
+    strMapObjChange = new StrMapObjChange();
+    userInputData = new Map<string, string>();
     config: WidgetConfig = {
         WidgetComponentName: 'WaveView',
         data: {
@@ -53,49 +46,34 @@ export default class waveView extends Widget {
             }
         }
     };
-    testConfig: WidgetConfig = {
-        WidgetComponentName:'waveView',
-        data:{
-            url:'12306.data.0/$startTime$/$endTime$/$dotNum$',
-            userInputData:'',
-            position:{
-                x1:'',
-                x2:'',
-                y1:'',
-                y2:''
-            }
-        }
+
+    getConfig(): WidgetConfig {
+        (this.$refs.setBasicParams as setBasicParams).updateUserInputData();
+        return this.config;
     }
 
-    replaceStartPath(startPath:string):void
+    replaceStartPath(startPath:string)
     {
         this.config.data.url.replace('$startPath$', startPath);
     }
-
-    getConfig(): WidgetConfig {
-        return this.config;
-    }
-    setConfig(wid:WidgetConfig): void {
-        // this.config = wid;
-        // this.updateUI();
-        // (this.$refs.setBasicParams as setBasicParams).
-        // this.refresh();
+    setConfig(widgetConfig:WidgetConfig): void {
+        this.config = widgetConfig;
+        var temp = this.config.data.userInputData;
+        this.updateUI();
+        var temp = JSON.parse(JSON.stringify(temp));
+        temp = this.strMapObjChange.objToStrMap(temp);
+        widgetConfig.data.userInputData = temp;
+        (this.$refs.setBasicParams as setBasicParams).setConfig(widgetConfig);
     }
     parentUpdate(payload: UpdatePayload): void {
 
     }
     refresh() {
-        // (this.$refs.setBasicParams as setBasicParams).viewLoad();
+        (this.$refs.setBasicParams as setBasicParams).refresh();
     }
     updateUI() {
         (this.$refs.setBasicParams as setBasicParams).getPathIdParams();
     }
-    add() {
-        this.setConfig(this.testConfig);
-    }
-    minus() {
-        console.log(this.getConfig());
-    }
     getPathId(pathId: string) {
         this.pathId = pathId;
     }

src/components/WaveView/setBasicParams.vue

 <template id="setBasicParams">
   <div class="panel-body row">
-    <div v-show="isShowCog">
-      <div class="col-md-8">
-        <div class="input-group">
-          <span class="input-group-addon">Channel Path</span>
-          <input v-model="config.data.url" type="text" class="form-control" />
-        </div>
-      </div>
-      <div class="col-md-2">
-        <button type="button" class="btn btn-primary btn-mid" @click="getPathIdParams">
-          <b>&nbsp;ok&nbsp;</b>
-          <span class="glyphicon glyphicon-save"></span>
-        </button>
-      </div>
+    <div v-show="isShowCog" style="width:100%">
+      <b-input-group prepend="Channel Path">
+        <b-input v-model="config.data.url" ></b-input>
+        <b-input-group-addon>
+          <b-button variant="primary" @click="getPathIdParams">OK<span class="glyphicon glyphicon-save"></span></b-button>
+        </b-input-group-addon>
+      </b-input-group>
     </div>
     <WidgetParams ref="WidgetParams" v-show="isShowLoad" action="get" @updataVariables="viewLoad"></WidgetParams>
-    <button class="btn btn-primary btn-mid" style="float:right" @click="showPathIdConfig">
+    <b-button variant="primary" @click="showPathIdConfig" style="width:100%">
       <span class="glyphicon glyphicon-cog"></span>
-    </button>
+    </b-button>
   </div>
 </template>
 
@@ -32,6 +26,7 @@ import PathProcessor from "@/models/PathProcessor";
 import { forEach } from "typescript-collections/dist/lib/arrays";
 import { map } from "d3";
 import WidgetParams from "@/components/Common/WidgetParams.vue";
+import StrMapObjChange from "@/models/StrMapObjChange";
 
 @Component({
     components:{
@@ -45,6 +40,7 @@ export default class setBasicParams extends Vue {
   isShowCog: boolean = false;
   pathId!: string;
   userInputData = new Map<string, string>();
+  strMapObjChange = new StrMapObjChange();
   config: WidgetConfig = {
     WidgetComponentName: "WaveView",
     data: {
@@ -67,7 +63,24 @@ export default class setBasicParams extends Vue {
     this.getConfig = this.config;
     this.updateConfig();
   }
-
+  refresh(){
+    var Args: UpdatePayload = {
+      action: "get",
+      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
+      target: ["self"]
+    };
+    this.viewLoad(Args);
+  }
+  setConfig(config: WidgetConfig) {
+    (this.$refs.WidgetParams as WidgetParams).setVariableInput(config.data.userInputData);
+    this.config = config;
+    console.log(this.config);
+    this.refresh();
+  }
+  updateUserInputData(){
+    this.config.data.userInputData =this.strMapObjChange.strMapToObj((this.$refs.WidgetParams as WidgetParams).getVariableValues());
+    this.updateConfig();
+  }
   updateConfig() {
     this.getConfig = this.config;
     this.$emit("updateConfig", this.getConfig);
@@ -87,20 +100,24 @@ export default class setBasicParams extends Vue {
     this.isShowCog = false;
   }
   showPathIdConfig() {
-    this.isShowLoad = false;
-    this.isShowCog = true;
+    if(this.isShowCog || this.isShowLoad){
+      this.isShowCog = !this.isShowCog;
+      this.isShowLoad = !this.isShowLoad;
+    }else{
+      this.isShowCog = !this.isShowCog;
+    }
   }
-  async viewLoad(Args: any) {
+  async viewLoad(Args: UpdatePayload) {
     this.getConfig.data.position.x1 = "";
     this.getConfig.data.position.x2 = "";
     this.getConfig.data.position.y1 = "";
     this.getConfig.data.position.y2 = "";
-    console.log(Args);
-    this.config.data.userInputData = Args.Variables;
+    this.config.data.userInputData = Args.variables;
     var url = this.pathProcessor.FillPathWithVar(
       this.config.data.userInputData,
       this.config.data.url
     );
+    console.log(this.config);
     var path = this.pathId;
     this.$emit("getPathId", path);
     await this.getData(url);

src/components/WaveView/showViewInfo.vue

 <template>
-    <div class="panel-heading">
-        <h2 class="panel-title">
-            <font>
-                Basic Path :&nbsp;
-            </font>
-            <font color="RoyalBlue" id="basePathId">{{ basePathId }}</font>
-            &nbsp;&nbsp;
-            <font id="sampleId">sample Rate: {{ sampleId }}</font>
-            &nbsp;&nbsp;
-            <font id="lengthId">length: {{ lengthId }}</font>
-        </h2>
+    <div class="largeFont" style="float:left width:100%">
+        <span>Basic Path :&nbsp;{{ basePathId }}</span><br>
+        <span> Rate: {{ sampleId }}</span><br>
+        <span>length: {{ lengthId }}</span><br>
+        <hr />
     </div>
 </template>
 

src/main.ts

 import Vue from 'vue';
 import App from './App.vue';
-
+import '@/assets/css/fontSize.css';
 import 'bootstrap/dist/css/bootstrap.css'
 import 'bootstrap-vue/dist/bootstrap-vue.css'
 import BootstrapVue from 'bootstrap-vue'

vue.config.js

 module.exports = {
+    outputDir: 'E:/wfy/CFET2DaqDemo/Code/CFET2App/bin/Debug/views',
     devServer: {
       proxy: {
         "/": {