Skip to content

GitLab

C
CFET_WidgetUI
Commit 950584ee authored by XieXiaohan's avatar XieXiaohan
Browse files
Options

first commit

parents
Pipeline #70 failed with stages
      Hide whitespace changes
      Inline Side-by-side
      Showing with 7346 additions and 0 deletions
      .browserslistrc 0 → 100755
      View file @ 950584ee
      > 1%
      last 2 versions
      .gitignore 0 → 100755
      View file @ 950584ee
      .DS_Store
      node_modules
      /dist
      # local env files
      .env.local
      .env.*.local
      # Log files
      npm-debug.log*
      yarn-debug.log*
      yarn-error.log*
      # Editor directories and files
      .idea
      .vscode
      *.suo
      *.ntvs*
      *.njsproj
      *.sln
      *.sw?
      README.md 0 → 100755
      View file @ 950584ee
      <p align="center">
      <img width="320" src="https://s1.ax1x.com/2020/09/17/wRLUFH.png">
      </p>
      <p align="center">
      <a href="https://github.com/vuejs/vue">
      <img src="https://img.shields.io/badge/vue-2.6.11-green" alt="vue">
      </a>
      <img src="https://img.shields.io/badge/typescript-3.7.5-yellowgreen" alt="vue">
      <img src="https://img.shields.io/badge/buefy-0.8.12-blueviolet" alt="vue">
      <img src="https://img.shields.io/badge/vue--grid--layout-2.3.7-informational" alt="vue">
      </p>
      ##
      ---
      ## What's CFET WidgetUI?
      >CFET WidgetUI is a Vue-based project that is developed and maintained full-time by FeiYang Wu and XiaoHan Xie;
      is also the front-end component framework software of CFET.
      ## What's new?
      * Compared with the previous version, we have updated our component library, replacing Bootstrap with Bulma
      (a open source CSS framework)
      * Separate the function **EDIT** from the original widget SPA. And the entire project consists of two SPA(single page application),
      one implements the basic functions of the Widget and other one is the EDIT Windows
      ``If you want to use the old version , switch repository to WidgetUI, which does not rely on Bulma``
      * Also some changes in details
      NOTE: The function is still incomplete and under development
      ## Project setup
      ```
      npm install
      ```
      ### Compiles and hot-reloads for development
      ```
      npm run serve
      ```
      ### Compiles and minifies for production
      ```
      npm run build
      ```
      ### Run your tests
      ```
      npm run test
      ```
      ### Lints and fixes files
      ```
      npm run lint
      ```
      ### Customize configuration
      See [Configuration Reference](https://cli.vuejs.org/config/).
      ### dist生成路径
      ```
      在vue.config.js中将outputDir更改为本地路径
      ```
      WidgetUI设计文档/WidgetUI设计文档.md 0 → 100755
      View file @ 950584ee
      # WidgetUI设计文档
      WidgetUI是为CFET控制框架设计的网页界面显示。
      ![结构框架](2019-09-30-14-46-14.png)
      ## Widget
      widget是WidgetUI的显示控件，是CFET中的resource在网页界面的一种显示形式。每个WidgetUI界面是数个Widget加导航栏的组成。
      ### Widget Base
      每个Widge都有共同的性质，这些性质被描述在Widget基类中，被每个Widget继承。
      这些性质具体如下：
      ![Widget基类属性](2019-09-27-16-32-02.png)
      1. 每个Widget的类型名称(WidgetComponentName)
      > 目前的类型按功能逻辑分类主要有Status，Method，Config，Thing，WaveView。按照显示样式的不同有State。之后根据需求还会陆续添加。
      2. 保存和加载自身配置(getConfig，setConfig)
      > getConfig：每个widget需要将自身的内容以给定的格式保存起来提供给Parent。
      setConfig：根据Parent提供的数据填充自己的路径和输入框中的值，同时更新界面。
      给定格式：
      ![WidgetConfig格式](2019-09-27-17-41-30.png)
      3. 刷新自身界面(updateUI)
      > 根据当前的URL生成对应输入框等显示。
      4. 刷新自身值(refresh)
      > refresh:根据当前URL和输入框变量值向后台通过axios发出请求，根据返回值刷新显示值。
      5. 根据给定路径自动填充返回完整路径(samplePoke，pathPoke)
      ![poke流程图](2019-09-30-15-01-53.png)
      > samplePoke是根据sample中的参数信息将变量补充在URL后生成一个完整的URL。
      路径的来源有两种。
      一个是Parent向widget提供sample，调用每个widget的samplePoke 。
      二对应pathPoke，是根据用户在输入框中输入的URL去向后台请求sample，然后自身调用自己的samplepoke从而对URL进行填充。
      除了基类里的一些共有性质，每个widget也有共有的2个组件。
      ![公共组件](2019-09-29-15-22-37.png)
      1. 变量输入框组(WidgetParams)
      > 每个widget都需要一个输入框组提供给用户用来接收变量值，从而填补完全路径来和后台交互数据。
      WidgetParams主要有4个方法：
      setVariableList: 父组件将URL中后缀的参数信息传进来，WidgetParams根据参数信息生成对应的输入框。
      setVariableInput: 这个方法用于加载保存配置时，setconfig时获取WidgetConfig中的参数信息来填写对应参数的输入框的值。
      getVariableValues: 获取参数输入框中的值，返回一个以变量名为key，值为value的map
      update: 刷新当前输入框显示
      2. 父子路径导航(Navigation)
      > 显示当前widget的父子属性的路径，便于进行跳转。
      具体实现是通过获取父组件的URL信息，直接axios请求sample，取出其中的parentPath和childrenPath信息来显示。
      ## Parent
      Parent是对所有widget进行管理的部分，是所有widget的父组件。
      主要功能分为两部分，一是对Widget的管理，二是支持根据当前URL生成对应widget或者customview。
      ### 对Widget的管理
      1. 添加并显示各widget(addWidget)
      > 将选中widget添加进一个WidgetRef List，名字叫widgetList，同时为它分配一个唯一的ref。后期对Widget Component的调用都将通过ref。
      在template中用v-for遍历widgetList，将其中所有存下的widget显示出来。
      WidgetRef的结构如下：
      ![WidgetRef结构](2019-09-27-17-46-59.png)
      2. 对widget进行拖拽放缩
      > 这个功能引用了vue-grid-layout，将每个widget包含在一个GridItem里，便可对每个widget进行拖拽放缩
      3. 保存以及加载configfile(saveWidgetList,loadTextFromFile)
      > saveWidgetList: 调用widgetList中各widget的getconfig。并将它们对应的ref也保存下来以及拖拽功能所需要的坐标信息存下来。将所有widget的信息存在widgetConfigList中，具体结构如下：
      ![widgetConfigList结构](2019-09-30-14-05-00.png)
      然后把widgetConfigList保存为json文件。
      loadTextFromFile: 从文件中导出widgetConfigList，调用widgetConfigList中widgetList的各widget的setconfig方法，将信息传给每个widget让它们自行处理。
      ### 根据fragment生成对应界面
      具体流程图：
      ![customview流程图](2019-09-30-15-05-53.png)
      这个处理过程发生在vue的生命周期函数mounted中。
      # WidgetUI使用说明
      1. 初始界面
      ![初始界面](2019-09-27-17-00-52.png)
      2. 添加Widget
      > 点击Add Widget添加Widget
      ![Add Widget](2019-09-27-17-01-28.png)
      3. Widget使用，以Config为例
      > 按住蓝边可以进行拖动，按住右下角直角符号可以进行放缩
      > 点击右上角设置按钮出现Path输入框
      ![设置按钮](2019-09-27-17-13-08.png)
      > 输入路径，想要显示的参数名用$$括起来
      ![路径输入框](2019-09-27-17-15-18.png)
      > 点击OK生成对应输入框，同时路径输入框会被隐藏，想要显示再次点击右上设置按钮即可。
      ![变量输入框](2019-09-27-17-16-42.png)
      > 当不确定参数信息时，输入路径后点击Poke
      ![Poke](2019-09-27-17-19-12.png)
      > 会将该属性所需要的所有参数显示出来
      ![poke后的参数输入框显示](2019-09-27-17-19-59.png)
      > 想要获取或设置值时，在输入框中输入参数值，点击下箭头按钮
      ![获取设置按钮](2019-09-27-17-24-34.png)
      > Navigation会显示其父子属性链接，点击后即可跳转
      ![Navigation](2019-09-27-17-25-41.png)
      4. 设好各信息后，点击save按钮将当前界面保存下来。
      5. 加载保存界面时，点击Browse按钮选择文件加载。
      6. 在浏览器栏直接输入属性路径也可以访问对应界面。
      ![浏览器输入路径直接访问](2019-09-27-17-28-03.png)
      \ No newline at end of file
      babel.config.js 0 → 100755
      View file @ 950584ee
      module.exports = {
      presets: [
      '@vue/app'
      ]
      }
      package-lock.json 0 → 100755
      View file @ 950584ee
      This source diff could not be displayed because it is too large. You can view the blob instead.
      postcss.config.js 0 → 100755
      View file @ 950584ee
      module.exports = {
      plugins: {
      autoprefixer: {}
      }
      }
      public/index.html 0 → 100755
      View file @ 950584ee
      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width,initial-scale=1.0">
      <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
      <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
      <link rel="icon" href="<%= BASE_URL %>favicon.ico">
      <title></title>
      </head>
      <body>
      <noscript>
      <strong>We're sorry but vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
      </noscript>
      <div id="app">
      </div>
      <!-- built files will be auto injected -->
      </body>
      </html>
      \ No newline at end of file
      src/App.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div id="app">
      <nav class="navbar is-info" role="navigation" aria-label="main navigation">
      <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navbarhome">
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      </a>
      <div id="navbarhome" class="navbar-menu">
      <div class="navbar-start ">
      <div class="navbar-item has-dropdown is-hoverable navpadding">
      <a class="navbar-link ">
      Add Widget
      </a>
      <div class="navbar-dropdown">
      <a class="navbar-item"
      v-for="(availableWidget,index) in availableWidgets"
      :key="index"
      v-on:click="addWidget(availableWidget)"
      >
      {{availableWidget}}
      </a>
      </div>
      </div>
      <a class="navbar-item navpadding" @click="saveWidgetList"
      >
      Save
      </a>
      <a class="navbar-item navpadding" @click="refactor"
      >
      Refactor
      </a>
      </div>
      <div class="navbar-end uploadlocal">
      <div class="navbar-item">
      <div class="file has-name is-right is-fullwidth " id="file"
      @change="loadTextFromFile">
      <label class="file-label" style="position: relative;left: 112px;">
      <input class="file-input" type="file" name="resume">
      <span class="file-cta" style="margin-bottom: 3.2px;margin-right: 3.2px; ">
      <span class="file-icon">
      <i class="fa fa-cloud-upload"></i>
      </span>
      <span class="file-label">
      Browse
      </span>
      </span>
      <span class="file-name filew">
      Choose a widgetTemplate file to load
      </span>
      </label>
      <div class="buttonbg"></div>
      </div>
      </div>
      </div>
      </div>
      </nav>
      <div id="appLeftClick">
      <grid-layout
      :layout.sync="widgetList"
      :col-num="18"
      :row-height="35"
      :is-draggable= isShowDrag
      :is-resizable= isShowRes
      :is-mirrored="false"
      :vertical-compact="true"
      :margin="[10, 10]"
      :use-css-transforms="true"
      :autoSize="true"
      >
      <grid-item
      class="refactor"
      v-for="(widget,index) in widgetList"
      :x="widget.x"
      :y="widget.y"
      :w="widget.w"
      :h="widget.h"
      :i="widget.i"
      :key="widget.i"
      drag-allow-from=".vue-draggable-handle"
      drag-ignore-from=".no-drag"
      >
      <div style="border-color: rgb(206, 212, 218);" >
      <div class=" columns" style="margin-bottom: 0px;margin-left: 5px;" ></div>
      </div>
      <component id="widget" class="vue-draggable-handle" :is="widget.widgetComponentName" :ref="widget.ref" :index="index" :widgetList="widgetList" @del="deleteWidget" @schemas="getSchemas" ></component>
      </grid-item>
      </grid-layout>
      </div>
      </div>
      </template>
      <script lang="ts">
      import { Component, Vue } from "vue-property-decorator";
      import axios from "axios";
      import { GridItemData, GridLayout, GridItem } from "vue-grid-layout";
      import { WidgetRef } from "./models/WidgetRef";
      import { WidgetConfig, AllWidgetConfig } from "./models/WidgetConfig";
      import { Action, UpdatePayload } from "./models/UpdatePayload";
      import { Widget } from "./models/widget";
      import { ResourceInfo } from "./models/Customview";
      import { indexOf } from "typescript-collections/dist/lib/arrays";
      //when add more available widgets add ref to the widgets
      import Status from "./components/Status/Status.vue";
      import WaveView from "./components/WaveView/WaveView.vue";
      import Method from "./components/Method/Method.vue";
      import Config from "./components/Config/Config.vue";
      import Thing from "./components/Thing/Thing.vue";
      import State from "./components/State/State.vue";
      import VarBroadcast from "./components/VarBroadcast/VarBroadcast.vue";
      import AutoBroadcast from "./components/AutoBroadcast/AutoBroadcast.vue";
      import SlideShow from "./components/SlideShow/SlideShow.vue";
      import CardReader from "./components/CardReader/CardReader.vue";
      import Windows from "./components/Common/Windows.vue";
      // import Gauge from "./components/Gauge/Gauge.vue";
      //this is the view selecotr class
      @Component({
      components: {
      //when add more available widgets add ref to the widgets
      Status,
      WaveView,
      Method,
      Config,
      Thing,
      GridLayout,
      GridItem,
      State,
      VarBroadcast,
      AutoBroadcast,
      SlideShow,
      CardReader,
      Windows,
      }
      })
      export default class App extends Vue {
      widgetList: WidgetRef[] = [];
      fileName: string = "widgetTemplate.json";
      private lastWidgetIndex: number = 0;
      isShowAddWidget: Boolean = false;
      isShowConfig: Boolean = false;
      text: string = "";
      OpenWindow:boolean = false;
      schemas?:any[];
      isShowDrag:boolean = false;
      isShowRes : boolean = false;
      //when add more available widgets add its name here
      availableWidgets = [
      "Status",
      "Config",
      "WaveView",
      "Method",
      "Thing",
      "State",
      "VarBroadcast",
      "AutoBroadcast",
      "SlideShow",
      "CardReader"
      ];
      deleteWidget(index:number):void{
      this.widgetList.splice(index, 1);
      console.log(index);
      }
      OpenWindows(isOpen:boolean):void{
      this.OpenWindow = isOpen;
      }
      refactor(){
      this.isShowDrag = true;
      this.isShowRes = true;
      let refactorList = document.getElementsByClassName('refactor');
      console.log(refactorList);
      for(var i=0;i<refactorList.length;i++){
      //refactorList[i].classList.add("vue-draggable-handle");
      //refactorList[i].classList.add("vue-resizable-handle");
      refactorList[i].style.backgroundColor = "rgba(238,238,238,0.89)";
      }
      }
      getSchemas(schemas:any[]){
      this.schemas = schemas;
      }
      toggleShowAddWidget(): void {
      this.isShowAddWidget = !this.isShowAddWidget;
      }
      pokeAndUpdateUI(ref: string, sample: any) {
      Vue.nextTick(() => {
      ((this.$refs[ref] as Array<Widget>)[0] as Widget).samplePoke(sample);
      ((this.$refs[ref] as Array<Widget>)[0] as Widget).updateUI();
      });
      }
      dataAccess(URL: string) {
      axios
      .get(URL, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(dataresponse => {
      var samplePath = dataresponse.data.CFET2CORE_SAMPLE_PATH as string;
      console.log(samplePath);
      samplePath = samplePath.slice(samplePath.lastIndexOf('/')+1);
      console.log(samplePath);
      if(samplePath.startsWith("data")|| samplePath.startsWith("Data"))
      {
      console.log("success");
      this.addWidget("WaveView");
      }
      else{
      var resourcetype = dataresponse.data.ResourceType;
      this.addWidget(resourcetype);
      }
      var tempRef = (this.lastWidgetIndex - 1).toString();
      this.pokeAndUpdateUI(tempRef, dataresponse.data);
      });
      }
      mounted() {
      let AppLeftClick = document.getElementById('appLeftClick');
      let refactorList = document.getElementsByClassName('refactor');
      AppLeftClick.onclick = e => {
      for(var i=0;i<refactorList.length;i++){
      refactorList[i].onclick= e =>{
      e.cancelBubble = true;
      };
      this.isShowDrag = false;
      this.isShowRes = false;
      //refactorList[i].classList.remove("vue-resizable-handle");
      refactorList[i].style.backgroundColor = 'white';
      }
      };
      var fragment = window.location.hash;
      if (fragment != "#blank" && fragment != "#Blank" && fragment != "#") {
      fragment = fragment.substring(1, fragment.length);
      var customViewURL = "/customView/template" + fragment;
      var isCustomview: boolean = false;
      //axios之前出现过cache过多刷不出来的问题，所以本项目的axios都加上了禁止cache的头文件
      axios
      .get(customViewURL, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      if (
      response.data.CFET2CORE_SAMPLE_ISVALID == true &&
      response.data.CFET2CORE_SAMPLE_VAL != null
      ) {
      isCustomview = true;
      //返回有值的customview template，进行load处理
      var customviewTemplate: string;
      customviewTemplate = response.data.CFET2CORE_SAMPLE_VAL;
      var widgets = Object.assign(
      new AllWidgetConfig(),
      JSON.parse(customviewTemplate)
      );
      this.widgetList = widgets.widgetList;
      this.lastWidgetIndex = Number(widgets.currentRef);
      this.$forceUpdate();
      //替换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);
      // }
      //刷新值
      this.importActiveWidgetList();
      // for (var wid of this.widgetList) {
      // ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).refresh();
      // }
      });
      }
      else{
      var dataURL = fragment;
      this.dataAccess(dataURL);
      }
      }).catch(err=>{
      var dataURL = fragment;
      this.dataAccess(dataURL);
      });
      }
      PubSub.subscribe("VarBroadcast",(messageName:string, Args:any)=>{
      console.log("PubSub.subscribe(\"VarBroadcast");
      //接收到消息调用全部widget的parentUpdate函数
      for (var widget of this.widgetList) {
      ((this.$refs[widget.ref] as Array<Widget>)[0] as Widget).parentUpdate(Args);}
      });
      }
      exportActiveWidgetList(): AllWidgetConfig {
      for (var widget of this.widgetList) {
      widget.widgetConfig = ((this.$refs[widget.ref] as Array<
      Widget
      >)[0] as Widget).getConfig();
      }
      var widgetConfigList = new AllWidgetConfig();
      widgetConfigList.widgetList = this.widgetList;
      widgetConfigList.currentRef = this.lastWidgetIndex.toString();
      return widgetConfigList;
      }
      importActiveWidgetList() {
      for (var wid of this.widgetList) {
      ((this.$refs[wid.ref] as Array<Widget>)[0] as Widget).setConfig(
      wid.widgetConfig as WidgetConfig
      );
      }
      }
      loadTextFromFile(ev: any) {
      const file = ev.target.files[0];
      const reader = new FileReader();
      reader.readAsText(file);
      var widgets;
      reader.onload = e => {
      widgets = Object.assign(
      new AllWidgetConfig(),
      JSON.parse((e.target as any).result)
      );
      this.widgetList = widgets.widgetList;
      this.lastWidgetIndex = Number(widgets.currentRef);
      this.$forceUpdate();
      Vue.nextTick(() => {
      // changed here
      this.importActiveWidgetList();
      });
      };
      }
      saveWidgetList(): void {
      var data = JSON.stringify(this.exportActiveWidgetList());
      const blob = new Blob([data]);
      /*
      if (window.navigator.msSaveOrOpenBlob) {
      // 兼容IE10
      navigator.msSaveBlob(blob, this.fileName);
      } else {
      // chrome/firefox
      let aTag = document.createElement("a");
      aTag.download = this.fileName;
      aTag.href = URL.createObjectURL(blob);
      aTag.click();
      URL.revokeObjectURL(aTag.href);
      }*/
      }
      addWidget(widgetName: string): void {
      var newWidget = new WidgetRef();
      newWidget.widgetComponentName = widgetName;
      newWidget.ref = this.lastWidgetIndex.toString();
      newWidget.y = this.lastWidgetIndex * 6;
      newWidget.i = Number(newWidget.ref);
      this.lastWidgetIndex++;
      this.widgetList = [...this.widgetList, newWidget];
      }
      update(payload: UpdatePayload) {
      for (var wid of this.widgetList) {
      (this.$refs[wid.ref] as Widget).parentUpdate(payload);
      }
      if (payload.action == "") {
      for (var wid of this.widgetList) {
      (this.$refs[wid.ref] as Widget).refresh();
      }
      }
      }
      }
      </script>
      <style lang="scss">
      // Import Bulma's core
      @import "~bulma/sass/utilities/_all";
      $info: red;
      $colors: (
      "info": ($info, $info-invert),
      );
      #app {
      font-family: "Avenir", Helvetica, Arial, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-align: center;
      color: #2c3e50;
      height: 100%;
      }
      .Widget {
      width: 100%;
      border-color: rgb(206, 212, 218);
      }
      .filew{
      background: white;
      color: gray;
      }
      .navpadding{
      margin-left: 2%;
      margin-right: 4%;
      }
      .uploadlocal{
      margin-right: 8%;
      }
      /*.vue-grid-item>.vue-resizable-handle {
      position: absolute;
      width: 20px;
      height: 20px;
      background: url("./assets/bg.png");
      background-position: bottom right;
      padding: 0 4px 4px 0;
      background-repeat: no-repeat;
      background-origin: content-box;
      box-sizing: border-box;
      cursor: pointer;
      font-size: 30px;
      background-color: rgb(30,53,164);
      }*/
      .buttonbg{
      background-color: #343434;
      border-bottom-right-radius: 6px;
      border-top-right-radius: 4px;
      border-bottom-left-radius: 4px;
      width: 140.5px;
      height: 38px;
      margin-top: 3px;
      }
      // Import Bulma and Buefy styles
      @import "~bulma";
      @import "~buefy/src/scss/buefy";
      </style>
      src/assets/css/fontSize.css 0 → 100755
      View file @ 950584ee
      .smallFont{
      font-size: 15px;
      }
      .largeFont{
      font-size: 25px;
      }
      .largeFont span{
      float: left;
      }
      .valueFont{
      font-size: 100px;
      }
      .valueFont span{
      float: left;
      }
      \ No newline at end of file
      src/components/AutoBroadcast/AutoBroadcast.vue 0 → 100755
      View file @ 950584ee
      <template>
      <!--<b-container class="bv-example-row">
      <b-row style="margin-top:10px">
      <b-col>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <b-form-input v-show="isShowPath" v-model="config.data.displayname"></b-form-input>
      </b-col>
      <b-col>
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </b-col>
      </b-row>
      <b-row style="margin-top:10px">
      <b-col>
      <b-button @click="showPathConfig" variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog"></span>
      </b-button>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <div
      style="width:100%;overflow:auto;border-style: solid; border-width: 1px;"
      >
      <p style="float:left;margin:0px" class="largeFont">{{ StatusValue }}</p>
      </div>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="path" v-show="isShowPath">
      <b-form-input v-model="config.data.url"></b-form-input>
      <b-input-group-append>
      <b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
      <b-button variant="info" @click="pathPoke">poke</b-button>
      </b-input-group-append>
      </b-input-group>
      </b-col>
      </b-row>
      <b-row>
      <b-col>
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="BroadcastName" v-show="isShowPath">
      <b-form-input v-model="config.data.autoUpdateName" ></b-form-input>
      </b-input-group>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="BroadcastValue" v-show="isShowPath">
      <b-form-input v-model="config.data.autoUpdateValue"></b-form-input>
      <b-input-group-append>
      <b-button @click="broadcast" text="Button" variant="primary">Broadcast</b-button>
      </b-input-group-append>
      </b-input-group>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="DelayTime" v-show="isShowPath" append="ms">
      <b-form-input v-model="config.data.delayTime" ></b-form-input>
      </b-input-group>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>
      </b-col>
      </b-row>
      </b-container>-->
      <div class="hflex" >
      <div class="container">
      <div class="columns" style="margin-top:0px">
      <div class="column is-4">
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <!--<input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">-->
      </div>
      <div class="column is-1 is-offset-7" >
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns" style="margin-top:5px">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 2px">
      <p style="float:left;margin:0px;">{{ StatusValue }}</p>
      </div>
      </div>
      <hsc-window-style-metal >
      <hsc-window title="AutoBroadcast params" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">You can broadcast params value to all the Widget</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <div class="field is-horizontal" style="margin:5px">
      <div class="field-label is-normal">
      <label class="label">BroadcastName</label>
      </div>
      <div class="field-body">
      <div class="field">
      <div class="control">
      <input class="input" type="text" v-model="config.data.autoUpdateName">
      </div>
      </div>
      </div>
      </div>
      <div class="field is-horizontal columns" style="margin:5px">
      <div class="field-label is-normal column" >
      <label class="label " style="padding-top: 12px;">BroadcastValue</label>
      </div>
      <div class="field-body column is-5">
      <div class="field">
      <div class="control">
      <input class="input" type="text" v-model="config.data.autoUpdateValue">
      </div>
      </div>
      </div>
      <div class="column" style="position: relative;">
      <button class="button is-info" @click="broadcast">Broadcast</button>
      </div>
      </div>
      <div class="field is-horizontal" style="margin:5px">
      <div class="field-label is-normal">
      <label class="label">DelayTime</label>
      </div>
      <div class="field-body">
      <div class="field">
      <div class="control">
      <input class="input" type="text" v-model="config.data.delayTime">
      </div>
      </div>
      </div>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 5px;">
      <button class="button column is-offset-8 is-4" style="background-color: #8fb9f7;padding-top: 6px;">
      Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="isOpen = ! isOpen" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </hsc-window-style-metal>
      </div>
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import PubSub from 'pubsub-js';
      import { VueSvgGauge } from "vue-svg-gauge";
      import { WidgetRef } from "@/models/WidgetRef";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class AutoBroadcast extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "AutoBroadcast";
      StatusValue: string = "";
      preStatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "AutoBroadcast",
      data: {
      url: "",
      displayname:"",
      userInputData: "",
      autoUpdateName:"",
      autoUpdateValue:"",
      delayTime:""
      }
      };
      created() {
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      mounted() {
      this.timer = setInterval(this.refresh, 1000);
      }
      destroyed() {
      clearInterval(this.timer);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      this.destroyed();
      }
      updateUI() {
      this.isShowPath = false;
      this.isShowParams = true;
      var url = this.config.data.url;
      this.pathId = url.slice(0, url.indexOf("/"));
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      this.updateUI();
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      }
      pathPoke() {
      var pokepath = this.config.data.url;
      axios.get(pokepath, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.samplePoke(response.data);
      this.updateUI();
      });
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {}
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios
      .get(apiLoad, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      this.StatusValue = "undefined";
      }
      });
      }
      broadcast()
      {
      if(this.config.data.autoUpdateName != "" && this.config.data.autoUpdateValue != "")
      {
      var autoUpdateData= new Map<string, string>();
      autoUpdateData.set(this.config.data.autoUpdateName,this.config.data.autoUpdateValue);
      var autoUpdate:UpdatePayload = {
      action: "AutoBroadcast",
      variables: autoUpdateData,
      target:['self']
      }
      PubSub.publish('VarBroadcast',autoUpdate);
      this.preStatusValue = this.config.data.autoUpdateValue;
      console.log("preStatusValue"+this.preStatusValue);
      console.log("autoUpdateValue"+this.config.data.autoUpdateValue);
      }
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      if(this.config.data.autoUpdateName != "" && this.preStatusValue != this.StatusValue)
      {
      console.log("before autobroadcast");
      console.log("preStatusValue"+this.preStatusValue);
      console.log("StatusValue"+this.StatusValue);
      var autoUpdateData= new Map<string, string>();
      autoUpdateData.set(this.config.data.autoUpdateName,this.StatusValue);
      var autoUpdate:UpdatePayload = {
      action: "AutoBroadcast",
      variables: autoUpdateData,
      target:['self']
      }
      this.preStatusValue = this.StatusValue;
      setTimeout(() => {
      PubSub.publish('VarBroadcast',autoUpdate);
      }, this.config.data.delayTime);
      }
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      </style>
      \ No newline at end of file
      src/components/CardReader/CardReader.vue 0 → 100755
      View file @ 950584ee
      <template>
      <!-- <b-container class="bv-example-row">
      <b-row style="margin-top:10px">
      <b-col>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <b-form-input v-show="isShowPath" v-model="config.data.displayname"></b-form-input>
      </b-col>
      <b-col>
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </b-col>
      </b-row>
      <b-row style="margin-top:10px">
      <b-col>
      <b-button @click="showPathConfig" variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog"></span>
      </b-button>
      </b-col>
      </b-row>
      <br />
      <b-row v-for="(info,index) in StatusValue" :key="index">
      <b-col>
      <div style="width:100%;overflow:auto;border-style: solid; border-width: 1px;">
      <p style="float:left;margin:0px" class="largeFont">{{ info }}</p>
      </div>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="path" v-show="isShowPath">
      <b-form-input v-model="config.data.url"></b-form-input>
      <b-input-group-append>
      <b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
      <b-button variant="info" @click="pathPoke">poke</b-button>
      </b-input-group-append>
      </b-input-group>
      </b-col>
      </b-row>
      <b-row>
      <b-col>
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>
      </b-col>
      </b-row>
      </b-container>-->
      <div class="hflex" >
      <div class="container">
      <div class="columns" style="margin-top:0px">
      <div class="column is-4">
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <!--<input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">-->
      </div>
      <div class="column is-1 is-offset-7" >
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns" style="margin-top:5px" v-for="(info,index) in StatusValue" :key="index">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 2px">
      <p style="float:left;margin:0px;">{{ info }}</p>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<hsc-window-style-metal >
      <hsc-window title="Edit CardReader" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the card in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="isOpen = ! isOpen" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </hsc-window-style-metal>-->
      </div>
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { WidgetRef } from "@/models/WidgetRef";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class CardReader extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "CardReader";
      StatusValue: string[] =[];
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "CardReader",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      schemas : any[]= [{
      label:'cardreader',
      key:'cardreader-config',
      type:'cardreader',
      index:this.index,
      },
      ];
      created() {
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      mounted() {
      this.timer = setInterval(this.refresh, 1000);
      }
      destroyed() {
      clearInterval(this.timer);
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      console.log("111");
      console.log(this.config.data.url);
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {
      var shouldUpdate:boolean = false
      this.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues());
      var temp = this.userInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      this.userInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      if(shouldUpdate)
      {
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(this.userInputData);
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      }
      }
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios
      .get(apiLoad, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      this.StatusValue = ["undefined"];
      }
      });
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      </style>
      \ No newline at end of file
      src/components/Common/EditTabs.vue 0 → 100644
      View file @ 950584ee
      <template>
      <div>111111111</div>
      </template>
      <script lang="ts">
      import Router from 'vue-router'
      import { Prop, Vue, Watch, Emit } from 'vue-property-decorator';
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import { WidgetRef } from "@/models/WidgetRef";
      import Status from "@/components/Status/Status.vue";
      import Component from "vue-class-component";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import PathProcessor from "@/models/PathProcessor";
      import axios from "axios";
      @Component({
      components: {
      WidgetParams,
      }
      })
      export default class Windows extends Vue{
      }
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      src/components/Common/Navigation.vue 0 → 100755
      View file @ 950584ee
      <template id="Navigation">
      <div>
      <div style="width:100%;margin:5px">
      <!--<b-button size="lg" @click="showNavigation" style="float:right">Navigation</b-button>-->
      <button class="button is-dark" @click="showNavigation" style="float:right">Navigation</button>
      </div>
      <div v-show="isShowNavigation&&isShowParentPath" style="width:100%;height:25px">
      <b-link :href="parentPath" class="smallFont" style="float:left">parentPath:{{ parentPath }}</b-link>
      <!-- <a class="smallFont" :href="parentPath" style="float:left">parentPath:{{ parentPath }}</a> -->
      </div>
      <div
      v-show="isShowNavigation"
      v-for="(path, index) in childrenPath"
      :key="index"
      style="width:100%;height:25px"
      >
      <b-link :href="path" class="smallFont" style="float:left">childrenPath:{{path}}</b-link>
      <!-- <a class="smallFont" :href= "path" style="float:left">childrenPath:{{path}}</a> -->
      </div>
      </div>
      </template>
      <script lang="ts">
      import { Component, Prop, Vue, Watch } from "vue-property-decorator";
      import axios from "axios";
      import Plotly from "plotly.js";
      import global_ from "@/components/Common/global.vue";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import PathProcessor from "@/models/PathProcessor";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      @Component({
      components: {
      WidgetParams
      }
      })
      export default class Navigation extends Vue {
      @Prop() url!: string;
      parentPath!: string;
      childrenPath!: string[];
      isShowParentPath: boolean = false;
      isShowNavigation: boolean = false;
      @Watch("url")
      onUrlChanged() {
      this.getPath();
      }
      async getPath() {
      this.isShowParentPath = false;
      var apiLoad = this.url;
      await axios.get(apiLoad).then(response => {
      this.parentPath = response.data.ParentPath as string;
      this.childrenPath = response.data.ChildrenPath as string[];
      });
      if (this.parentPath != "") {
      this.isShowParentPath = true;
      }
      this.$forceUpdate();
      }
      showNavigation() {
      this.isShowNavigation = !this.isShowNavigation;
      }
      }
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      src/components/Common/WidgetParams.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div style="width:100%">
      <!--<div v-for="(label, index) in userInputData.keys()" :key="index">
      <b-input-group size="lg" style="margin:5px">
      <b-input-group-text class="smallFont">{{label}}</b-input-group-text>
      <b-form-input v-model="tempUserInputData[label]" ></b-form-input>
      </b-input-group>
      </div>-->
      <div v-for="(label, index) in userInputData.keys()" :key="index">
      <div class="field is-horizontal" style="margin:5px">
      <div class="field-label is-normal">
      <label class="label">{{label}}</label>
      </div>
      <div class="field-body">
      <div class="field">
      <div class="control">
      <input class="input" type="text" v-model="tempUserInputData[label]">
      </div>
      </div>
      </div>
      </div>
      </div>
      <!--<div style="width:100%;margin:5px">
      <b-button variant="primary" size="lg" @click="update" style="float:right">
      <b>{{ action }}</b>
      <span class="glyphicon glyphicon-save"></span>
      </b-button>
      </div>-->
      <div class="columns" style="width:100%;margin:5px" v-if="isShowGet">
      <!--<button class="button is-info column is-offset-11-desktop" @click="update" style="padding-top: 6px;">{{action}}</button>-->
      <button class="button column is-offset-9 is-2" @click="update" style="background-color: #216dec;padding-top: 6px; ">{{action}}
      <i class="fa fa-download" aria-hidden="true"></i>
      </button>
      </div>
      </div>
      </template>
      <script lang="ts">
      import { Component, Prop, Vue, Watch, Emit } from 'vue-property-decorator';
      import { UpdatePayload } from '../../models/UpdatePayload';
      import { values, keys } from 'd3';
      import { forEach } from "typescript-collections/dist/lib/arrays";
      @Component
      export default class WidgetParams extends Vue{
      @Prop() action!: string;
      userInputData= new Map<string, string>();
      tempUserInputData:{[key: string]: string} = {};
      isShowGet:boolean = false;
      /*testv = 1;
      test(){
      console.log(test);
      }*/
      showGet(isShowGet:boolean){
      this.isShowGet = isShowGet;
      }
      setVariableList(path: string[]) {
      console.log(path);
      this.userInputData.clear();
      path.forEach(element => {
      this.userInputData.set(element, '');
      console.log("afterpathextract");
      console.log(this.userInputData);
      });
      console.log(this.userInputData);
      this.$forceUpdate();
      }
      setVariableInput(parentUserInputData:Map<string, string>)
      {
      for (var key of parentUserInputData.keys()) {
      this.tempUserInputData[key] = parentUserInputData.get(key) as string;
      }
      }
      getVariableValues(): Map<string, string> {
      for(var key of this.userInputData.keys()) {
      this.userInputData.set(key, this.tempUserInputData[key]);
      }
      console.log(this.tempUserInputData[key]);
      return this.userInputData;
      }
      update(){
      var Args:UpdatePayload = {
      action: this.action,
      variables: this.getVariableValues(),
      target:['self']
      }
      console.log(Args);
      this.$emit('updataVariables', Args)
      }
      }
      </script>
      src/components/Common/Windows.vue 0 → 100644
      View file @ 950584ee
      <template>
      <div class="container">
      <hsc-window-style-metal >
      <hsc-window title="Edit" :closeButton="false" :isOpen.sync="isOpen" positionHint="5 / 5" v-for="schema in schemas">
      <fieldset style="padding: 20px;" v-if="schema.type == 'status'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'config'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Config</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.get.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateGetUI">GET</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="getPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <WidgetParams
      class="column"
      style="padding-top: 0px;padding-bottom: 5px;"
      ref="WidgetGetParams"
      v-show="isShowGetParams"
      action="get"
      @updataVariables="viewGetLoad"
      ></WidgetParams>
      </div>
      <hr style="size: 6px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Set Value</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'Set' to Set value, or click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.set.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateSetUI">SET</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="setPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <WidgetParams
      class="column"
      ref="WidgetSetParams"
      v-show="isShowSetParams"
      action="set"
      @updataVariables="viewSetLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'state'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">State</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">State will shows the state of CODAC</div>
      <div class="columns">
      the value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'method'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Method</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'OK' to invoke method from cfet，click 'POKE' to get the parameters</div>
      <div class="columns">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" type="text" v-model="config.data.url">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="invoke"
      @updataVariables="viewinvokeLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'thing'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      主要用于一个链接的跳转。</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'slideshow'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'cardreader'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the card in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset style="padding: 20px;" v-if="schema.type == 'varbroadcast'">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">You can broadcast params value to all the Widget</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="broadcast"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      </hsc-window-style-metal>
      </div>
      </template>
      <script lang="ts">
      import { Prop, Vue, Watch, Emit } from 'vue-property-decorator';
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import { WidgetRef } from "@/models/WidgetRef";
      import Status from "@/components/Status/Status.vue";
      import Component from "vue-class-component";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import PathProcessor from "@/models/PathProcessor";
      import axios from "axios";
      @Component({
      components: {
      WidgetParams,
      }
      })
      export default class Windows extends Vue{
      @Prop() schemas!: any[];
      isOpen :boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "Status",
      data: {
      url: "",
      get: { url: "", userInputData: "" },
      set: { url: "", userInputData: "" },
      displayname:"",
      userInputData: ""
      }
      };
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      pathProcessor = new PathProcessor();
      isShowGet:boolean = true;
      isShowGetPath: boolean = false;
      isShowSetPath: boolean = false;
      isShowGetParams: boolean = false;
      isShowSetParams: boolean = false;
      timer?: number;
      mounted() {
      }
      destroyed() {
      clearInterval(this.timer);
      }
      updateUI() {
      this.isShowPath = false;
      this.isShowParams = true;
      var url = this.config.data.url;
      this.timer = setInterval(this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].updateUI(this.isShowPath,this.isShowParams,this.config.data.url), 30000);
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].updateUI(this.isShowPath,this.isShowParams,this.config.data.url);
      this.$refs.WidgetParams[0].showGet(this.isShowGet);
      // this.pathId = url.slice(0, url.indexOf("/"));
      this.$refs.WidgetParams[0].setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      }
      pathPoke() {
      var pokepath = this.config.data.url;
      axios.get(pokepath, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].samplePoke(response.data);
      //this.updateUI();
      (this.$refs.WidgetParams[0] as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      });
      }
      async viewLoad() {
      var GetArgs: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams[0] as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].viewLoad(GetArgs);
      }
      async viewinvokeLoad(){
      console.log('called when widgetParams action clicked');
      var Args: UpdatePayload = {
      action: "invoke",
      variables: (this.$refs.WidgetParams[0] as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].viewLoad(Args);
      }
      async viewGetLoad() {
      console.log("innnnn");
      var GetArgs: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetGetParams[0] as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].viewGetLoad(GetArgs);
      }
      async viewSetLoad() {
      var SetArgs: UpdatePayload = {
      action: "set",
      variables: (this.$refs.WidgetSetParams[0] as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].viewSetLoad(SetArgs);
      }
      updateGetUI(){
      this.isShowGetParams = true;
      this.isShowGetPath = false;
      var url = this.config.data.get.url;
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].updateGetUI(this.isShowGetPath,this.isShowGetParams,this.config.data.get.url);
      console.log(this.isShowGet);
      this.$refs.WidgetGetParams[0].showGet(this.isShowGet);
      this.$refs.WidgetGetParams[0].setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      }
      getPathPoke(){
      var pokepath = this.config.data.get.url;
      axios.get(pokepath).then(response => {
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].isGetPoke = true;
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].samplePoke(response.data);
      this.$refs.WidgetGetParams[0].setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.get.url)
      );
      });
      }
      updateSetUI(){
      this.isShowSetParams = true;
      this.isShowSetPath = false;
      var url = this.config.data.set.url;
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].updateSetUI(this.isShowSetPath,this.isShowSetParams,this.config.data.set.url);
      this.$refs.WidgetSetParams[0].showGet(this.isShowGet);
      this.$refs.WidgetSetParams[0].setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      }
      setPathPoke(){
      var pokepath = this.config.data.set.url;
      axios.get(pokepath).then(response => {
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].isSetPoke = true;
      this.$parent.$root.$children[0].$refs[this.schemas[0].index][0].samplePoke(response.data);
      this.$refs.WidgetSetParams[0].setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.set.url)
      );
      });
      }
      @Watch('schemas', { immediate: true, deep: true })
      onschemasChanged(val: any[], oldVal: any[]) {
      console.log("qskjhskdjshkdjbsmb")
      console.log(val);
      this.schemas = val;
      }
      }
      </script>
      <style scoped>
      </style>
      \ No newline at end of file
      src/components/Config/Config.vue 0 → 100755
      View file @ 950584ee
      <template>
      <!--<div class="container">
      <div class="columns" style="margin-top:10px">
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">
      </div>
      <div class="columns" style="margin-top:5px">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 2px">
      <p style="float:left;margin:0px;">{{ getConfigValue }}</p>
      </div>
      <p class="column buttons " style="padding-top: 0px;padding-bottom: 0px;margin-bottom: 0px;">
      <button @click="showPathConfig" class="button" style="margin-bottom: 0px;">
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      <div class="column" style="padding-top: 0px;padding-bottom: 0px;">
      <a class="delete is-medium" @click="del" style="margin-top: 3px;"></a>
      </div>
      </div>-->
      <!--<div class="columns" v-show="isShowGetPath" style="margin-bottom: 0px;">
      <div class="field column is-10" style="padding-right: 0px; padding-bottom: 0px;padding-top: 9px;" >
      <div class="control">
      <input class="input is-info" type="text">
      </div>
      </div>
      <div class="column" style="padding-left: 0px; padding-right: 0px;padding-bottom: 0px;padding-top: 9px;">
      <button class="button is-light " @click="updateGetUI">OK</button>
      </div>
      <div class="column" style="padding-left: 0px;padding-bottom: 0px;padding-top: 9px;">
      <button class="button is-info" @click="getPathPoke">POKE</button>
      </div>
      </div>
      <div class="columns" style="margin-top: 0px;margin-bottom: 0px;">
      <WidgetParams
      class="column"
      style="padding-top: 0px;padding-bottom: 5px;"
      ref="WidgetGetParams"
      v-show="isShowGetParams"
      action="get"
      @updataVariables="viewGetLoad"
      ></WidgetParams>
      </div>-->
      <!--<div class="columns" v-show="isShowSetPath" style="margin-bottom: 0px;margin-top: 0px;">
      <div class="field column is-10" style="padding-right: 0px;padding-bottom: 0px;padding-top: 3px;" >
      <div class="control">
      <input class="input is-info" type="text">
      </div>
      </div>
      <div class="column" style="padding-left: 0px; padding-right: 0px;padding-bottom: 0px;padding-top: 3px;">
      <button class="button is-light " @click="updateSetUI">OK</button>
      </div>
      <div class="column" style="padding-left: 0px;padding-bottom: 0px;padding-top: 3px;">
      <button class="button is-info" @click="setPathPoke">POKE</button>
      </div>
      </div>
      <div class="columns" style="margin-bottom: 0px;">
      <WidgetParams
      class="column"
      ref="WidgetSetParams"
      v-show="isShowSetParams"
      action="set"
      @updataVariables="viewSetLoad"
      ></WidgetParams>
      </div>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>
      </div>-->
      <div class="container">
      <div class="columns" style="margin-top:0px">
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.get.url }}</span>
      <!--<input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">-->
      <div class="column is-1" style="margin-left: 90%;padding: 0px;margin-right: 10%" >
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns" style="margin-top:5px">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 5px">
      <p style="float:left;margin:0px;">{{ getConfigValue }}</p>
      </div>
      </div>
      <!--<hsc-window-style-metal >
      <hsc-window title="Edit Config" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Config</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      then the return value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.get.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateGetUI">GET</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="getPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <input class="input column is-10" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <WidgetParams
      class="column"
      style="padding-top: 0px;padding-bottom: 5px;"
      ref="WidgetGetParams"
      v-show="isShowGetParams"
      action="get"
      @updataVariables="viewGetLoad"
      ></WidgetParams>
      </div>
      <hr style="size: 6px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Set Value</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'Set' to Set value, or click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.set.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateSetUI">SET</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="setPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <input class="input column is-10" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <WidgetParams
      class="column"
      ref="WidgetSetParams"
      v-show="isShowSetParams"
      action="set"
      @updataVariables="viewSetLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="isOpen = ! isOpen" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </hsc-window-style-metal>-->
      <div class="colmumns">
      <WidgetParams
      class="column"
      style="padding-top: 0px;padding-bottom: 5px;"
      ref="WidgetGetParams"
      v-show="isShowGetParams"
      action="get"
      @updataVariables="viewGetLoad"
      ></WidgetParams>
      </div>
      <div class="colmumns">
      <WidgetParams
      class="column"
      ref="WidgetSetParams"
      v-show="isShowSetParams"
      action="set"
      @updataVariables="viewSetLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<div class="columns" >
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="showPathConfig" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </div>
      <div v-show="isShowPath">
      <div class="columns">
      <div class="column is-1" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Get Value</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'Get' to get value, or click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.get.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 40px;">
      <button class="button is-light " @click="updateGetUI">GET</button>
      </div>
      <div class="column" style="position: relative;right: 45px;">
      <button class="button is-info" @click="getPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <input class="input column is-10" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <WidgetParams
      class="column"
      style="padding-top: 0px;padding-bottom: 5px;"
      ref="WidgetGetParams"
      v-show="isShowGetParams"
      action="get"
      @updataVariables="viewGetLoad"
      ></WidgetParams>
      </div>
      <hr style="size: 6px;">
      <div class="columns">
      <div class="column is-1" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Set Value</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'Set' to Set value, or click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.set.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 40px;">
      <button class="button is-light " @click="updateSetUI">SET</button>
      </div>
      <div class="column" style="position: relative;right: 45px;">
      <button class="button is-info" @click="setPathPoke">POKE</button>
      </div>
      </div>
      <div class="colmumns">
      <input class="input column is-10" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <WidgetParams
      class="column"
      ref="WidgetSetParams"
      v-show="isShowSetParams"
      action="set"
      @updataVariables="viewSetLoad"
      ></WidgetParams>
      </div>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 2px;"></i>Navigation</button>
      </div>
      </div>-->
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import Component from "vue-class-component";
      import { WidgetRef } from "@/models/WidgetRef";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import Plotly from "plotly.js";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      import Windows from "@/components/Common/Windows.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation,
      Windows,
      }
      })
      export default class Config extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "Config";
      getConfigValue: string = "";
      setConfigValue: string = "";
      pathId: string = "";
      userGetInputData = new Map<string, string>();
      userSetInputData = new Map<string, string>();
      getPathwithVar: string = "";
      setPathwithVar: string = "";
      isShowGetPath: boolean = false;
      isShowSetPath: boolean = false;
      isShowGetParams: boolean = false;
      isShowSetParams: boolean = false;
      isOpen: boolean = true;
      isSetPoke: boolean = false;
      isGetPoke: boolean = false;
      config: WidgetConfig = {
      WidgetComponentName: "Status",
      data: {
      displayname:"",
      get: { url: "", userInputData: "" },
      set: { url: "", userInputData: "" }
      }
      };
      schemas : any[]= [{
      label:'confug',
      key:'config-config',
      type:'config',
      index:this.index,
      },
      ];
      created() {
      // this.config.data.userInputData = this.userInputData;
      this.config.data.get.userInputData = this.strMapObjChange.strMapToObj(
      this.userGetInputData
      );
      this.config.data.set.userInputData = this.strMapObjChange.strMapToObj(
      this.userSetInputData
      );
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      updateUI() {
      //this.updateGetUI();
      ( this.$refs.WidgetGetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.get.url)
      );
      //this.updateSetUI();
      ( this.$refs.WidgetSetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.set.url)
      );
      }
      updateGetUI(isShowGetPath:boolean,isShowGetParams:boolean,url:string) {
      this.isShowGetPath = isShowGetPath;
      this.isShowGetParams = isShowGetParams;
      this.config.data.get.url = url;
      }
      updateSetUI(isShowSetPath:boolean,isShowSetParams:boolean,url:string) {
      this.isShowSetPath = isShowSetPath;
      this.isShowSetParams = isShowSetParams;
      this.config.data.set.url = url;
      }
      showPathConfig() {
      if (this.isShowGetPath == this.isShowSetPath) {
      this.isShowGetPath = !this.isShowGetPath;
      this.isShowSetPath = !this.isShowSetPath;
      } else {
      this.isShowGetPath = true;
      this.isShowSetPath = true;
      }
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.get.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetGetParams as WidgetParams).getVariableValues()
      );
      this.config.data.set.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetSetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      this.updateUI();
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      //布置get输入参数
      var temp = this.config.data.get.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userGetInputData = temp;
      (this.$refs.WidgetGetParams as WidgetParams).setVariableInput(
      this.userGetInputData
      );
      //布置set输入参数
      temp = this.config.data.set.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userSetInputData = temp;
      (this.$refs.WidgetSetParams as WidgetParams).setVariableInput(
      this.userSetInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      if (this.isSetPoke == false || this.isGetPoke == true) {
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.get.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.get.url = pokedPath;
      }
      if (this.isGetPoke == false || this.isSetPoke == true) {
      pokedPath = samplePath;
      count = 0;
      var settemp = sample.Actions.set.Parameters;
      settemp = JSON.parse(JSON.stringify(settemp));
      settemp = this.strMapObjChange.objToStrMap(settemp);
      var SetParameters: Map<string, string>;
      SetParameters = settemp;
      SetParameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.set.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.set.url = pokedPath;
      }
      this.isSetPoke = false;
      this.isGetPoke = false;
      }
      /*getPathPoke() {
      var pokepath = this.config.data.get.url;
      axios.get(pokepath).then(response => {
      this.isGetPoke = true;
      this.samplePoke(response.data);
      this.updateUI();
      });
      }*/
      /*setPathPoke() {
      var pokepath = this.config.data.set.url;
      axios.get(pokepath).then(response => {
      this.isSetPoke = true;
      this.samplePoke(response.data);
      this.updateUI();
      });
      }*/
      pathPoke() {
      //this.getPathPoke();
      this.$parent.$root.$children[0].$children[0].$children[0].getPathPoke();
      //this.setPathPoke();
      this.$parent.$root.$children[0].$children[0].$children[0].setPathPoke();
      }
      replaceStartPath(startPath: string): void {
      this.config.data.get.url.replace("$startPath$", startPath);
      this.config.data.set.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {
      var shouldUpdate:boolean = false;
      this.userGetInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetGetParams as WidgetParams).getVariableValues());
      var temp = this.userGetInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userGetInputData = temp;
      this.userGetInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userGetInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userGetInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      this.userSetInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetSetParams as WidgetParams).getVariableValues());
      temp = this.userSetInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userSetInputData = temp;
      this.userSetInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userSetInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userSetInputData.set(key,payload.variables.get(keyofpayload) as string);
      }
      });
      });
      if(shouldUpdate)
      {
      (this.$refs.WidgetGetParams as WidgetParams).setVariableInput(this.userGetInputData);
      (this.$refs.WidgetSetParams as WidgetParams).setVariableInput(this.userSetInputData);
      this.updateUI();
      }
      }
      /*refresh() {
      var GetArgs: UpdatePayload = {
      action: "get",
      variables: (this.$refs
      .WidgetGetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewGetLoad(GetArgs);
      var SetArgs: UpdatePayload = {
      action: "set",
      variables: (this.$refs
      .WidgetSetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewSetLoad(SetArgs);
      }*/
      async getData(url: string) {
      var apiLoad = url;
      await axios.get(apiLoad, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.getConfigValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.getConfigValue == undefined)
      {
      this.getConfigValue = "undefined";
      }
      console.log(this.getConfigValue);
      });
      }
      async setData(url: string) {
      var apiLoad = url;
      await axios.post(apiLoad, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.setConfigValue = response.data.CFET2CORE_SAMPLE_VAL;
      });
      console.log(url);
      console.log(this.setConfigValue);
      }
      //called when widgetParams action clicked
      async viewGetLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      console.log("inn");
      this.userGetInputData = Args.variables;
      this.getPathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userGetInputData,
      this.config.data.get.url
      );
      await this.getData(this.getPathwithVar);
      }
      async viewSetLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userSetInputData = Args.variables;
      this.setPathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userSetInputData,
      this.config.data.set.url
      );
      await this.setData(this.setPathwithVar);
      this.getrefresh();
      }
      getrefresh() {
      var GetArgs: UpdatePayload = {
      action: "get",
      variables: (this.$refs
      .WidgetGetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewGetLoad(GetArgs);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .bluetag{
      background: url("../../assets/bluetag.png");
      width: 26px;
      height: 26px;
      }
      </style>
      \ No newline at end of file
      src/components/Method/Method.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="container">
      <!--<b-row style="margin-top:10px">
      <b-col>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <b-form-input v-show="isShowPath" v-model="config.data.displayname"></b-form-input>
      </b-col>
      <b-col>
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </b-col>
      </b-row>
      <b-row style="margin-top:10px">
      <b-col>
      <b-button @click="showPathConfig" variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog"></span>
      </b-button>
      </b-col>
      </b-row>
      <br />-->
      <div class="columns" style="margin-top:10px" >
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <div class="column is-offset-11-desktop">
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="invoke"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<hsc-window-style-metal >
      <hsc-window title="invoke Method" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">Method</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      click 'OK' to invoke method from cfet，click 'POKE' to get the parameters</div>
      <div class="columns">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" type="text" v-model="config.data.url">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="invoke"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="isOpen = ! isOpen" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      </hsc-window-style-metal>-->
      <!--<div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="showPathConfig" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      <div class="columns" v-show="isShowPath">
      <div class="field column is-10" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" type="text" v-model="config.data.url">
      </div>
      </div>
      <div class="column" style="padding-left: 0px; padding-right: 0px">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="padding-left: 0px">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="invoke"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>-->
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { WidgetRef } from "@/models/WidgetRef";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class Method extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "Method";
      StatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "Method",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      schemas : any[]= [{
      label:'method',
      key:'method-config',
      type:'method',
      index:this.index,
      },
      ];
      created() {
      // this.config.data.userInputData = this.userInputData;
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      console.log("111");
      console.log(this.config.data.url);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.invoke.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {
      var shouldUpdate:boolean = false
      this.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues());
      var temp = this.userInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      this.userInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      if(shouldUpdate)
      {
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(this.userInputData);
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      }
      }
      refresh() {
      var Args: UpdatePayload = {
      action: "invoke",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios.put(apiLoad, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      this.StatusValue = "undefined";
      }
      });
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      console.log('called when widgetParams action clicked');
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .bluetag{
      background: url("../../assets/bluetag.png");
      width: 26px;
      height: 26px;
      }
      </style>
      \ No newline at end of file
      src/components/SlideShow/SlideShow.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="hflex" >
      <div class="container">
      <div class="columns" style="margin-top:0px">
      <div class="column is-4">
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      </div>
      <div class="column is-1 is-offset-7" >
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <video-player ref="videoPlayer"
      v-if="!isShowGIF"
      :playsinline="true"
      :options="playerOptions">
      </video-player>
      <!-- <img src="../../assets/4365f8f4581d175dfb8e8a39b185af23.gif">-->
      <img v-if="isShowGIF" v-bind:src="slideURL" />
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </div>
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import PubSub from 'pubsub-js';
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { WidgetRef } from "@/models/WidgetRef";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      // slideshow整个都有修改，还没改样式的话先替换一下
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class SlideShow extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "SlideShow";
      StatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      currentImgIndex: number = -1;
      //img:string ="";
      isPause: boolean = false;
      pauseFlag: boolean = false;
      isOpen: boolean = false;
      isShowGIF:boolean = false;
      slideType: string = "mp4";
      slideURL:string = "";
      playerOptions:any =
      {
      //播放速度
      playbackRates: [0.5, 1.0, 1.5, 2.0],
      //如果true,浏览器准备好时开始回放。
      autoplay: true,
      // 默认情况下将会消除任何音频。
      muted: false,
      // 导致视频一结束就重新开始。
      loop: true,
      // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
      preload: 'auto',
      language: 'zh-CN',
      // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
      aspectRatio: '16:9',
      // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
      fluid: true,
      sources: [{
      //类型
      //type: "video/mp4",
      type: 'video/' + this.slideType,
      //url地址
      // src: "https://stream7.iqilu.com/10339/upload_transcode/202002/18/20200218114723HDu3hhxqIT.mp4"
      src: "",
      }],
      //你的封面地址
      poster: '',
      //允许覆盖Video.js无法播放媒体源时显示的默认信息。
      notSupportedMessage: '此视频暂无法播放，请稍后再试',
      controlBar: {
      timeDivider: true,
      durationDisplay: true,
      remainingTimeDisplay: false,
      //全屏按钮
      fullscreenToggle: true
      }
      }
      schemas : any[]= [{
      label:'slideshow',
      key:'slideshow-config',
      type:'slideshow',
      index:this.index,
      },
      ];
      config: WidgetConfig = {
      WidgetComponentName: "SlideShow",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      created(){
      };
      del()
      {
      this.$emit('del', this.index);
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      console.log("111");
      console.log(this.config.data.url);
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      this.playerOptions['sources'][0]['src'] = url;
      if( this.config.data.url.match('\.(gif)$')[0] == '.gif'){
      this.slideURL = url;
      this.isShowGIF = true;
      }else{
      this.isShowGIF = false;
      }
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {
      var shouldUpdate:boolean = false
      this.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues());
      var temp = this.userInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      this.userInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      if(shouldUpdate)
      {
      console.log("I have updated"+this.userInputData);
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(this.userInputData);
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      this.refresh();
      }
      }
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      /*async getData(url: string) {
      var apiLoad = url;
      await axios
      .get(apiLoad, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      this.img = response.data.CFET2CORE_SAMPLE_VAL;
      this.playerOptions['sources'][0]['src'] = this.img;
      });
      }*/
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      </style>
      \ No newline at end of file
      src/components/State/State.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="container">
      <!--<b-row style="margin-top:10px">
      <b-col>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <b-form-input v-show="isShowPath" v-model="config.data.displayname"></b-form-input>
      </b-col>
      <b-col>
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </b-col>
      </b-row>
      <b-row style="margin-top:10px">
      <b-col>
      <b-button @click="showPathConfig" variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog"></span>
      </b-button>
      </b-col>
      </b-row>
      <br />-->
      <div class="columns" style="margin-top:10px">
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <div class="column is-offset-11-desktop">
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns" style="margin-top:5px">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 2px">
      <p style="float:left;margin:0px;">{{ StatusValue }}</p>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="showPathConfig" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      <div class="columns" v-show="isShowPath">
      <div class="field column is-10" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" type="text">
      </div>
      </div>
      <div class="column" style="padding-left: 0px; padding-right: 0px">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="padding-left: 0px">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>-->
      <!--<hsc-window-style-metal >
      <hsc-window title="Edit State" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">State</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">State will shows the state of CODAC</div>
      <div class="columns">
      the value will Automatic updates ,click 'POKE' to get the parameters</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="isOpen = ! isOpen" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      </hsc-window-style-metal>-->
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import { WidgetRef } from "@/models/WidgetRef";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class State extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "State";
      StatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "State",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      schemas : any[]= [{
      label:'state',
      key:'state-config',
      type:'state',
      index:this.index,
      },
      ];
      created() {
      // this.config.data.userInputData = this.userInputData;
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      mounted() {
      this.timer = setInterval(this.refresh, 1000);
      }
      destroyed() {
      clearInterval(this.timer);
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      console.log("111");
      console.log(this.config.data.url);
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {
      var shouldUpdate:boolean = false;
      this.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues());
      var temp = this.userInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      this.userInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      if(shouldUpdate)
      {
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(this.userInputData);
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      }
      }
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios.get(apiLoad, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      this.StatusValue = "undefined";
      }
      switch (this.StatusValue.toString()) {
      case "0": {
      this.StatusValue = "Idle";
      break;
      }
      case "1": {
      this.StatusValue = "Ready";
      break;
      }
      case "2": {
      this.StatusValue = "Running";
      break;
      }
      case "255": {
      this.StatusValue = "Error";
      break;
      }
      }
      });
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .bluetag{
      background: url("../../assets/bluetag.png");
      width: 26px;
      height: 26px;
      }
      </style>
      \ No newline at end of file
      src/components/Status/Status.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="container" id="RightClick">
      <div class="columns" style="margin-top:0px">
      <div class="column is-4">
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      </div>
      <!--<div class="column is-1 is-offset-7" >
      <a class="delete is-medium" @click="del"></a>
      </div>-->
      </div>
      <div class="columns" style="margin-top:5px">
      <div class="column is-10" style="margin-left:3%;overflow:auto;border-style: solid; border-width: 1px; padding: 4px">
      <p style="float:left;margin:0px;">{{ StatusValue }}</p>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <!-- <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>-->
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import { WidgetRef } from "@/models/WidgetRef";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      import Windows from "@/components/Common/Windows.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation,
      Windows,
      }
      })
      export default class Status extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "Status";
      StatusValue: string = "undefined";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isShowConfig: boolean = false;
      isOpen: boolean = false;
      EditPathPoke : string = "";
      UserUrl:string = "";
      schemas : any[]= [{
      label:'status',
      key:'status-config',
      type:'status',
      index:this.index,
      },
      ];
      config: WidgetConfig = {
      WidgetComponentName: "Status",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      EditData = {
      edit:{
      type:'status',
      url:this.config.data.url,
      index:this.index,
      },
      params:{
      PokedPath:this.EditPathPoke,
      action:'get',
      //userInputData:this.userInputData,
      },
      };
      created() {
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      mounted() {
      let parentDomain = window.location.hostname;
      //console.log("domain",parentDomain); //localhost
      document.domain = parentDomain;
      this.timer = setInterval(this.refresh, 1000);
      let containerlist = document.getElementsByClassName('container');
      //CreateContainerId
      var self = this;
      let RightClickField = containerlist[this.index];
      RightClickField.oncontextmenu = function (e) {
      e.preventDefault();//demo区域停止原鼠标右击菜单
      //this.popMenu('itemMenu',100,"100");
      let menu = document.querySelector('.menu');//获取盒子menu。
      if(menu) menu.remove();//判断清除初始盒子
      menu = document.createElement('div');//创建盒子。
      menu.classList.add('menu');//添加类
      let menu1 = document.createElement('BUTTON');//创建盒子menu1。
      menu1.innerHTML = 'del';//盒子menu1添加文本XXXX
      menu1.onclick = self.del;
      menu.appendChild(menu1);//menu末尾添加新的节点menu1
      let menu2 = document.createElement('BUTTON');//创建盒子menu1。
      menu2.innerHTML = 'edit';//盒子menu1添加文本XXXX
      menu2.onclick = self.openWindows;
      //menu2.setAttribute("onclick", this.openWindows);
      menu.appendChild(menu2);//menu末尾添加新的节点menu1
      RightClickField.appendChild(menu);//body末尾添加新的节点menu
      //盒子跟随鼠标光标。
      //menu.style.top = $('#RightClick').offset().top;
      menu.style.left = e.offsetX +"px";
      menu.style.top = e.offsetY +"px";
      menu.style.position = 'absolute';
      //menu.style.top = '${e.clientY}px';
      //menu.style.left = '${e.clientX}px';
      console.log(menu.style.top);
      console.log(menu);
      };
      //全局点击时消失。
      window.onclick = e => {
      let menu = document.querySelector('.menu')
      if (menu && !menu.contains(e.target))
      menu.remove()
      }
      }
      destroyed() {
      clearInterval(this.timer);
      }
      /*popMenu(menuDiv:any,width:number,rowControlString:string):boolean
      {
      //创建弹出菜单
      console.log("jinjin");
      var pop=window.createPopup();
      //设置弹出菜单的内容
      menuDiv = document.querySelector('itemMenu');
      pop.document.body.innerHTML=menuDiv.innerHTML;
      var rowObjs=pop.document.body.all[0].rows;
      //获得弹出菜单的行数
      var rowCount=rowObjs.length;
      //循环设置每行的属性
      for(var i=0;i<rowObjs.length;i++)
      {
      //如果设置该行不显示，则行数减一
      var hide=rowControlString.charAt(i)!='1';
      if(hide){
      rowCount--;
      }
      //设置是否显示该行
      rowObjs[i].style.display=(hide)?"none":"";
      //设置鼠标滑入该行时的效果
      rowObjs[i].cells[0].onmouseover=function()
      {
      this.style.background="#818181";
      this.style.color="white";
      }
      //设置鼠标滑出该行时的效果
      rowObjs[i].cells[0].onmouseout=function(){
      this.style.background="#cccccc";
      this.style.color="black";
      }
      }
      //屏蔽菜单的菜单
      pop.document.oncontextmenu=function()
      {
      return false;
      }
      pop.show(event.clientX-1,event.clientY,width,rowCount*25,document.body);
      return true;
      }*/
      del(){
      this.$emit('del', this.index);
      }
      openWindows(){
      //windows.open -> another single page application
      var JsonData = JSON.stringify(this.EditData);
      var url ="http://localhost:8080/?";
      window.open(url+JsonData, "WidgetWindow",'height=100, width=100, top=10, left=10, toolbar=no');
      }
      //app
      updateUI() {
      console.log("dd22");
      this.isShowPath = false;
      //this.isShowParams = true;
      var url = this.config.data.url;
      this.EditData.params.PokedPath = this.config.data.url;
      this.openWindows();
      this.pathId = url.slice(0, url.indexOf("/"));
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      }
      //app
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      //app
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      pathPoke(url:string) {
      if(url != this.config.data.url ){
      this.config.data.url = url;
      console.log("dddd");
      var pokepath = url;
      axios.get(pokepath, {
      headers: {
      'Pragma': 'no-cache',
      'Cache-Control': 'no-cache'
      }
      }).then(response => {
      this.samplePoke(response.data);
      this.updateUI();
      });
      var url = this.config.data.url;
      this.EditData.params.PokedPath = this.config.data.url;
      this.openWindows();
      }
      }
      //app
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.EditPathPoke = pokedPath;
      this.config.data.url = pokedPath;
      //console.log(this.$parent.$root.$children[0].$children[0].$children[0]);
      }
      //app
      parentUpdate(payload: UpdatePayload): void {
      console.log("parentUpdate");
      var shouldUpdate:boolean = false
      this.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues());
      var temp = this.userInputData;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      this.userInputData.forEach((value , key) =>{
      payload.variables.forEach((valueofpayload,keyofpayload)=>{
      if(key == keyofpayload && ((this.userInputData.get(key) as string) != (payload.variables.get(keyofpayload) as string)))
      {
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      shouldUpdate = true;
      }
      });
      });
      if(shouldUpdate)
      {
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(this.userInputData);
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      }
      }
      //app
      refresh() {
      if(this.index === top.childData.index){
      //console.log(top);
      if(this.config.data.url == '' || this.EditPathPoke != top.childData.url){
      console.log(top.childData);
      this.UserUrl = top.childData.url;
      this.pathPoke(top.childData.url);
      this.viewLoad(top.childData.url);
      }
      if(top.Args != null){
      this.viewLoad(top.Args.Args);
      }
      }
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      async getData(url: string) {
      var apiLoad = url;
      console.log(url);
      await axios
      .get(apiLoad, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      console.log(this.StatusValue);
      this.StatusValue = "undefined";
      }
      });
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      console.log(Args);
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .hflex{
      display: flex;
      flex-direction: row-reverse;
      align-items: center;
      }
      </style>
      src/components/Thing/Thing.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="container">
      <!--<b-row>
      <b-col>
      <b-input-group size="lg" prepend="path" v-show="isShowPath">
      <b-form-input v-model="config.data.url"></b-form-input>
      <b-input-group-append>
      <b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
      <b-button variant="info" @click="pathPoke">poke</b-button>
      </b-input-group-append>
      </b-input-group>
      </b-col>
      </b-row>
      <b-row>
      <b-col>
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>
      </b-col>
      </b-row>-->
      <div class="columns" style="margin-top:10px" >
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">
      <div class="column is-offset-11-desktop">
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<hsc-window-style-metal >
      <hsc-window title="Get Things" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">Enter the Thing in the input box below,</div>
      <div class="columns">
      主要用于一个链接的跳转。</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="position: relative;right: 50px;">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 20px;">
      <button class="button column is-offset-9 is-3" style="background-color: #8fb9f7;padding-top: 6px;">
      <i class="fa fa-flag" aria-hidden="true" style="margin-right: 4px;"></i>Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="isOpen = ! isOpen" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      </hsc-window-style-metal>-->
      <!--<div class="columns" style="margin-top:10px">
      <p class="column buttons is-offset-11-desktop" >
      <button @click="showPathConfig" class="button" >
      <span class="icon is-small has-text-info">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      </button>
      </p>
      </div>
      <div class="columns" v-show="isShowPath">
      <div class="field column is-10" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" type="text" v-model="config.data.url">
      </div>
      </div>
      <div class="column" style="padding-left: 0px; padding-right: 0px">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      <div class="column" style="padding-left: 0px">
      <button class="button is-info" @click="pathPoke">POKE</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      class="column"
      ref="WidgetParams"
      v-show="isShowParams"
      action="get"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <Navigation ref="FamilyLink" :url="config.data.url"></Navigation>-->
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { ResourceInfo } from "@/models/Customview";
      import { WidgetRef } from "@/models/WidgetRef";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class Thing extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "Thing";
      StatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "Thing",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      schemas : any[]= [{
      label:'thing',
      key:'thing-config',
      type:'thing',
      index:this.index,
      },
      ];
      created() {
      // this.config.data.userInputData = this.userInputData;
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      console.log("111");
      console.log(this.config.data.url);
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {}
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios.get(apiLoad).then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      });
      }
      //called when widgetParams action clicked
      async viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      this.userInputData = Args.variables;
      this.pathwithVar = this.pathProcessor.FillPathWithVar(
      // this.config.data.userInputData,
      this.userInputData,
      this.config.data.url
      );
      await this.getData(this.pathwithVar);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .bluetag{
      background: url("../../assets/bluetag.png");
      width: 26px;
      height: 26px;
      }
      </style>
      \ No newline at end of file
      src/components/VarBroadcast/VarBroadcast.vue 0 → 100755
      View file @ 950584ee
      <template>
      <!-- <b-container class="bv-example-row">
      <b-row style="margin-top:10px">
      <b-col>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span style="float:left;" v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <b-form-input v-show="isShowPath" v-model="config.data.displayname"></b-form-input>
      </b-col>
      <b-col>
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </b-col>
      </b-row>
      <b-row style="margin-top:10px">
      <b-col>
      <b-button @click="showPathConfig" variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog"></span>
      </b-button>
      </b-col>
      </b-row>
      <br />
      <b-row>
      <b-col>
      <b-input-group size="lg" prepend="path" v-show="isShowPath">
      <b-form-input v-model="config.data.url"></b-form-input>
      <b-input-group-append>
      <b-button @click="updateUI" text="Button" variant="primary">OK</b-button>
      </b-input-group-append>
      </b-input-group>
      </b-col>
      </b-row>
      <b-row>
      <b-col>
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="broadcast"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </b-col>
      </b-row>
      <br />
      </b-container>-->
      <div class="hflex" >
      <div class="container">
      <div class="columns" style="margin-top:0px">
      <div class="column is-4">
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname != ''">{{ config.data.displayname }}</span>
      <span v-show = "!isShowPath" class="largeFont" v-if = "config.data.displayname == ''">{{ config.data.url }}</span>
      <!--<input class="input colmumn is-8" type="text" v-show="isShowPath" v-model="config.data.displayname">-->
      </div>
      <div class="column is-1 is-offset-7" >
      <a class="delete is-medium" @click="del"></a>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="broadcast"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="openWindows" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      <!--<hsc-window-style-metal >
      <hsc-window title="Broadcast params" :closeButton="true" :isOpen.sync="isOpen" positionHint="5 / 5">
      <fieldset style="padding: 20px;">
      <div class="columns">
      <div class="column is-2" style="color: #206dec;font-size: 18px;font-style: oblique;font-weight: 900;padding: 0px;">To Do</div>
      <i class="fa fa-question-circle-o" aria-hidden="true" style="margin-top: 5px;margin-left: 3px;"></i>
      </div>
      <div class="columns">You can broadcast params value to all the Widget</div>
      <div class="columns" style="margin-bottom: 0px;">
      <div class="field column is-7" style="padding-right: 0px;" >
      <div class="control">
      <input class="input is-info" v-model="config.data.url" type="text">
      </div>
      </div>
      <div class="column" style="position: relative;right: 25px;">
      <button class="button is-light " @click="updateUI">OK</button>
      </div>
      </div>
      <div class="columns">
      <WidgetParams
      ref="WidgetParams"
      v-show="isShowParams"
      action="broadcast"
      @updataVariables="viewLoad"
      ></WidgetParams>
      </div>
      </fieldset>
      <fieldset>
      <hr>
      <div class="columns" style="margin-top: 5px;margin-bottom: 5px;margin-right: 5px;">
      <button class="button column is-offset-8 is-4" style="background-color: #8fb9f7;padding-top: 6px;">
      Navigation</button>
      </div>
      </fieldset>
      </hsc-window>
      <p class="column buttons is-1" style="margin-left: 3%;padding: 0px;margin-right: 10%;margin-top: 5%">
      <button @click="isOpen = ! isOpen" class="button" style="background-color: #64a6e1">
      <span class="icon is-small has-text" style="margin-right: 1px;">
      <i class="fa fa-cog" aria-hidden="true"></i>
      </span>
      EDIT</button>
      </p>
      </hsc-window-style-metal>-->
      </div>
      </div>
      </template>
      <script lang="ts">
      import Vue from "vue";
      import PubSub from 'pubsub-js';
      import { VueSvgGauge } from "vue-svg-gauge";
      import Component from "vue-class-component";
      import { Prop, Watch } from "vue-property-decorator";
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import { Widget } from "@/models/widget";
      import { WidgetRef } from "@/models/WidgetRef";
      import { ResourceInfo } from "@/models/Customview";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import axios from "axios";
      import PathProcessor from "@/models/PathProcessor";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { forEach } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import Navigation from "@/components/Common/Navigation.vue";
      @Component({
      components: {
      WidgetParams,
      Navigation
      }
      })
      export default class VarBroadcast extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      pathProcessor = new PathProcessor();
      strMapObjChange = new StrMapObjChange();
      WidgetComponentName: string = "VarBroadcast";
      StatusValue: string = "";
      pathId: string = "";
      userInputData = new Map<string, string>();
      pathwithVar: string = "";
      timer?: number;
      isShowPath: boolean = false;
      isShowParams: boolean = false;
      isOpen: boolean = true;
      config: WidgetConfig = {
      WidgetComponentName: "VarBroadcast",
      data: {
      url: "",
      displayname:"",
      userInputData: ""
      }
      };
      schemas : any[]= [{
      label:'varbroadcast',
      key:'varbroadcast-config',
      type:'varbroadcast',
      index:this.index,
      },
      ];
      created() {
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      this.userInputData
      );
      }
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      openWindows(){
      this.isOpen = ! this.isOpen;
      this.$parent.$parent.$root.$children[0].OpenWindows(this.isOpen);
      this.$emit('schemas', this.schemas);
      }
      updateUI(isShowPath:boolean,isShowParams:boolean,url:string) {
      this.isShowPath = isShowPath;
      this.isShowParams = isShowParams;
      this.config.data.url = url;
      console.log("111");
      console.log(this.config.data.url);
      }
      showPathConfig() {
      this.isShowPath = !this.isShowPath;
      }
      getConfig(): WidgetConfig {
      // this.config.data.userInputData =(this.$refs.WidgetParams as WidgetParams).getVariableValues();
      this.config.data.userInputData = this.strMapObjChange.strMapToObj(
      (this.$refs.WidgetParams as WidgetParams).getVariableValues()
      );
      return this.config;
      }
      setConfig(widgetConfig: WidgetConfig): void {
      this.config = widgetConfig;
      //this.updateUI();
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(this.config.data.url)
      );
      //map不能序列化，必须要单独处理，这里的处理方法仅限map<string,string>类型
      var temp = this.config.data.userInputData;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(
      this.userInputData
      );
      }
      samplePoke(sample: any) {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath: string;
      pokedPath = samplePath;
      var count: number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      temp = this.strMapObjChange.objToStrMap(temp);
      var Parameters: Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value, key) => {
      count++;
      if (count == 1) {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if (count != 0) {
      pokedPath = pokedPath.substring(0, pokedPath.length - 1);
      }
      this.config.data.url = pokedPath;
      this.$parent.$root.$children[0].$children[0].$children[0].config.data.url = pokedPath;
      }
      replaceStartPath(startPath: string): void {
      this.config.data.url.replace("$startPath$", startPath);
      }
      parentUpdate(payload: UpdatePayload): void {}
      refresh() {
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      async getData(url: string) {
      var apiLoad = url;
      await axios
      .get(apiLoad, {
      headers: {
      Pragma: "no-cache",
      "Cache-Control": "no-cache"
      }
      })
      .then(response => {
      this.StatusValue = response.data.CFET2CORE_SAMPLE_VAL;
      if(this.StatusValue == undefined)
      {
      this.StatusValue = "undefined";
      }
      });
      }
      //called when widgetParams action clicked
      viewLoad(Args: UpdatePayload) {
      // this.config.data.userInputData = Args.variables;
      console.log("viewLoad");
      console.log(Args.variables);
      PubSub.publish('VarBroadcast',Args);
      }
      }
      </script>
      <style scoped>
      .waveView {
      width: 100%;
      height: auto;
      }
      .bluetag{
      background: url("../../assets/bluetag.png");
      width: 26px;
      height: 26px;
      }
      </style>
      \ No newline at end of file
      src/components/WaveView/WaveView.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="waveView">
      <div style="margin-top:10px">
      <b-button style="float:right" @click="del" text="Button" variant="outline-primary"><span class="glyphicon glyphicon-remove"></span></b-button>
      </div>
      <br/>
      <showViewInfo ref="showViewInfo" :pathId="pathId" @showPathIdConfig="showPathIdConfig"></showViewInfo>
      <div ref="wave">
      </div>
      <setBasicParams ref="setBasicParams" @getPathId="getPathId" @updateConfig="updateConfig" :wave="wave" :setConfig='config' @pathPoke="pathPoke" @pathPokeTime="pathPokeTime"></setBasicParams>
      <Navigation ref="FamilyLink" :url="config.data.url.path" style="margin-top:30px"></Navigation>
      </div>
      </template>
      <script lang="ts">
      import Vue from 'vue'
      import setBasicParams from './setBasicParams.vue';
      import showViewInfo from './showViewInfo.vue';
      import Navigation from '@/components/Common/Navigation.vue';
      import Component from 'vue-class-component';
      import { Prop, Watch } from 'vue-property-decorator';
      import { WidgetConfig } from '@/models/WidgetConfig';
      import { UpdatePayload } from '@/models/UpdatePayload';
      import { Widget } from '@/models/widget';
      import { WidgetRef } from "@/models/WidgetRef";
      import StrMapObjChange from "@/models/StrMapObjChange";
      import { ResourceInfo } from "@/models/Customview";
      import axios from "axios";
      @Component({
      components:{
      setBasicParams,
      showViewInfo,
      Navigation
      }
      })
      export default class waveView extends Widget {
      @Prop() index!:number;
      @Prop() widgetList:WidgetRef[] = [];
      WidgetComponentName: string = 'waveView';
      wave: any = '';
      pathId: string = '';
      strMapObjChange = new StrMapObjChange();
      userInputData = new Map<string, string>();
      sampleVal!:any;
      config: WidgetConfig = {
      WidgetComponentName: 'WaveView',
      data: {
      url:{
      path:'',
      timePath:''
      },
      userInputData:'',
      position:{
      x1:'',
      x2:'',
      y1:'',
      y2:''
      }
      }
      };
      del()
      {
      this.$emit('del', this.index);
      console.log("del"+this.index);
      }
      getConfig(): WidgetConfig {
      (this.$refs.setBasicParams as setBasicParams).updateUserInputData();
      return this.config;
      }
      replaceStartPath(startPath:string)
      {
      this.config.data.url.replace('$startPath$', startPath);
      }
      setConfig(widgetConfig:WidgetConfig): void {
      this.config = widgetConfig;
      console.log(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;
      console.log(widgetConfig);
      (this.$refs.setBasicParams as setBasicParams).setConfig(widgetConfig);
      }
      parentUpdate(payload: UpdatePayload): void {
      this.userInputData = this.strMapObjChange.strMapToObj(
      ((this.$refs.setBasicParams as setBasicParams).getVariableValues())
      );
      var temp = this.userInputData;
      var flag = 0;
      temp = this.strMapObjChange.objToStrMap(temp);
      this.userInputData = temp;
      console.log(this.userInputData);
      console.log(payload.variables);
      this.userInputData.forEach((value, key) => {
      console.log("进来了");
      console.log(key);
      payload.variables.forEach((valueofpayload, keyofpayload) => {
      console.log(key);
      console.log(keyofpayload);
      if(key == keyofpayload){
      if(value != keyofpayload){
      flag = 1;
      this.userInputData.set(key,payload.variables.get(keyofpayload) as string);
      }
      }
      })
      });
      if(flag == 1){
      (this.$refs.setBasicParams as setBasicParams).setVariableInput(this.userInputData);
      this.updateUI();
      this.refresh();
      }
      }
      showPathIdConfig(){
      (this.$refs.setBasicParams as setBasicParams).showPathIdConfig();
      }
      refresh() {
      (this.$refs.setBasicParams as setBasicParams).refresh();
      }
      updateUI() {
      (this.$refs.setBasicParams as setBasicParams).getSampleParams(this.config.data.url.path);
      if(Array.isArray(this.sampleVal)) {
      (this.$refs.setBasicParams as setBasicParams).sampleLoad(this.sampleVal);
      }
      }
      getPathId(pathId: string) {
      this.pathId = pathId;
      }
      mounted() {
      this.wave = this.$refs.wave;
      }
      updateConfig(data:WidgetConfig){
      this.config = data;
      }
      samplePoke(sample:any)
      {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      this.sampleVal = sample.CFET2CORE_SAMPLE_VAL;
      var pokedPath:string;
      pokedPath = samplePath;
      var count:number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      console.log(temp);
      temp = this.strMapObjChange.objToStrMap(temp);
      console.log(temp);
      var Parameters:Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value , key) =>{
      count++;
      if(count == 1)
      {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if(count != 0 )
      {
      pokedPath = pokedPath.substring(0,pokedPath.length-1);
      }
      this.config.data.url.path = pokedPath;
      }
      samplePokeWith(sample:any)
      {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath:string;
      pokedPath = samplePath;
      var count:number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      console.log(temp);
      temp = this.strMapObjChange.objToStrMap(temp);
      console.log(temp);
      var Parameters:Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value , key) =>{
      count++;
      if(count == 1)
      {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if(count != 0 )
      {
      pokedPath = pokedPath.substring(0,pokedPath.length-1);
      }
      this.config.data.url.path = pokedPath;
      }
      samplePokeWithTime(sample:any)
      {
      var samplePath = sample.CFET2CORE_SAMPLE_PATH;
      var pokedPath:string;
      pokedPath = samplePath;
      var count:number = 0;
      var temp = sample.Actions.get.Parameters;
      temp = JSON.parse(JSON.stringify(temp));
      console.log(temp);
      temp = this.strMapObjChange.objToStrMap(temp);
      console.log(temp);
      var Parameters:Map<string, string>;
      Parameters = temp;
      Parameters.forEach((value , key) =>{
      count++;
      if(count == 1)
      {
      pokedPath = pokedPath + "?";
      }
      pokedPath = pokedPath + key + "=$" + key + "$&";
      });
      if(count != 0 )
      {
      pokedPath = pokedPath.substring(0,pokedPath.length-1);
      }
      this.config.data.url.timePath = pokedPath;
      }
      async pathPoke()
      {
      (this.$refs.setBasicParams as setBasicParams).updateConfig();
      var f = this.config.data.url.path;
      var pokepath = "a";
      pokepath = f;
      console.log(this.config.data.url.path);
      await axios.get(this.config.data.url.path).then(response => {
      this.samplePokeWith(response.data);
      });
      if(this.config.data.url.path != '' && this.config.data.url.timePath != ''){
      (this.$refs.setBasicParams as setBasicParams).getPathIdParams();
      }
      }
      async pathPokeTime()
      {
      (this.$refs.setBasicParams as setBasicParams).updateConfig();
      var f = this.config.data.url.timePath;
      var pokepath = "a";
      pokepath = f;
      console.log(this.config.data.url.timePath);
      await axios.get(this.config.data.url.timePath).then(response => {
      this.samplePokeWithTime(response.data);
      });
      if(this.config.data.url.path != '' && this.config.data.url.timePath != ''){
      (this.$refs.setBasicParams as setBasicParams).getPathIdParams();
      }
      }
      }
      </script>
      <style scoped>
      .waveView{
      width:100%;
      height: auto;
      }
      </style>
      \ No newline at end of file
      src/components/WaveView/setBasicParams.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div>
      <div v-show="isShowCog" style="width:100%">
      <b-button-group>
      <b-button variant="success" @click="synchronizeRange(1)">SynchronizeX</b-button>
      <b-button variant="info" @click="synchronizeRange(2)">SynchronizeY</b-button>
      <b-button variant="warning" @click="synchronizeRange(3)">SynchronizeXY</b-button>
      </b-button-group>
      <br>
      <br>
      <b-input-group size="lg" prepend="Channel Path">
      <b-input v-model="config.data.url.path" ></b-input>
      <b-button variant="info" @click="pathPoke">poke</b-button>
      </b-input-group>
      <br>
      <b-input-group size="lg" prepend="Channel TimePath">
      <b-input v-model="config.data.url.timePath" ></b-input>
      <b-input-group-addon>
      <b-button variant="primary" @click="getPathIdParams">OK<span class="glyphicon glyphicon-save"></span></b-button>
      <b-button variant="info" @click="pathPokeTime">poke</b-button>
      </b-input-group-addon>
      </b-input-group>
      </div>
      <WidgetParams ref="WidgetParams" v-show="isShowLoad" action="get" @updataVariables="viewLoad"></WidgetParams>
      </div>
      </template>
      <script lang="ts">
      import { Component, Prop, Vue, Watch } from "vue-property-decorator";
      import axios from "axios";
      import Plotly from "plotly.js";
      import PubSub from 'pubsub-js';
      import global_ from '@/components/Common/global.vue';
      import { WidgetConfig } from "@/models/WidgetConfig";
      import { UpdatePayload } from "@/models/UpdatePayload";
      import PathProcessor from "@/models/PathProcessor";
      import { forEach, indexOf } from "typescript-collections/dist/lib/arrays";
      import { map } from "d3";
      import WidgetParams from "@/components/Common/WidgetParams.vue";
      import StrMapObjChange from "@/models/StrMapObjChange";
      @Component({
      components:{
      WidgetParams
      }
      })
      export default class setBasicParams extends Vue {
      @Prop() wave!: any;
      pathProcessor = new PathProcessor();
      isShowLoad: boolean = false;
      isShowCog: boolean = false;
      pathId!: string;
      userInputData = new Map<string, string>();
      tempUserInputData = new Map<string, string>();
      strMapObjChange = new StrMapObjChange();
      config: WidgetConfig = {
      WidgetComponentName: "WaveView",
      data: {
      url: {
      path:'',
      timePath:''
      },
      userInputData: "",
      position: {
      x1: "",
      x2: "",
      y1: "",
      y2: ""
      }
      }
      };
      getConfig!: WidgetConfig;
      tempUrl: string = "";
      temp: any = {};
      ExpectedDotNum:number = 1000;
      ExpansionMultiple:number = 1;
      annotations:any;
      myPlot:any;
      data_initial:any;
      xmin:any;
      xmax:any;
      nowDotNum:any;
      GetAllDot:boolean = false;
      created() {
      this.config.data.userInputData = this.userInputData;
      this.getConfig = this.config;
      }
      refresh(){
      var Args: UpdatePayload = {
      action: "get",
      variables: (this.$refs.WidgetParams as WidgetParams).getVariableValues(),
      target: ["self"]
      };
      this.viewLoad(Args);
      }
      getVariableValues(): Map<string, string>{
      return (this.$refs.WidgetParams as WidgetParams).getVariableValues();
      }
      setVariableInput(parentUserInputData: Map<string, string>) {
      (this.$refs.WidgetParams as WidgetParams).setVariableInput(parentUserInputData);
      }
      pathPoke(){
      this.$emit("pathPoke");
      }
      pathPokeTime(){
      this.$emit("pathPokeTime");
      }
      setConfig(config: WidgetConfig) {
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(config.data.url.path)
      );
      (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);
      }
      getSampleParams(url:any){
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      this.config.data.url.path = url;
      this.isShowLoad = true;
      this.isShowCog = false;
      }
      getPathIdParams() {
      if (this.tempUrl != this.config.data.url.path) {
      this.config.data.userInputData.clear();
      this.tempUrl = this.config.data.url.path;
      }
      this.updateConfig();
      var url = this.config.data.url.path;
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      this.isShowLoad = true;
      this.isShowCog = false;
      }
      getPathIdParamsTime() {
      if (this.tempUrl != this.config.data.url.timePath) {
      this.config.data.userInputData.clear();
      this.tempUrl = this.config.data.url.timePath;
      }
      this.updateConfig();
      var url = this.config.data.url.timePath;
      (this.$refs.WidgetParams as WidgetParams).setVariableList(
      this.pathProcessor.extractVarFromPath(url)
      );
      this.isShowLoad = true;
      this.isShowCog = false;
      }
      showPathIdConfig() {
      if(this.isShowCog || this.isShowLoad){
      this.isShowCog = !this.isShowCog;
      this.isShowLoad = !this.isShowLoad;
      }else{
      this.isShowCog = !this.isShowCog;
      }
      }
      sampleLoad(sampleVal: any){
      var myPlot = this.wave;
      var data_initial = [
      {
      x: this.temp.dataTimeAxis,
      y: sampleVal
      }
      ];
      this.createChannelChart(myPlot, data_initial);
      }
      synchronizeRange(kind:number)
      {
      console.log(kind);
      var myplot = this.wave;
      var xRange = myplot.layout.xaxis.range;
      var yRange = myplot.layout.yaxis.range;
      if(kind == 1)
      {
      PubSub.publish('SynchronizeX',{xrange:xRange,yrange:yRange});
      }
      else if(kind == 2)
      {
      PubSub.publish('SynchronizeY',{xrange:xRange,yrange:yRange});
      }
      else if(kind == 3)
      {
      PubSub.publish('SynchronizeXY',{xrange:xRange,yrange:yRange});
      }
      }
      findNearest(array:number[],start:number,end:number,num:number):number
      {
      var midIndex:number = (start + end)/2;
      midIndex = Number(midIndex.toFixed(0)) -1;
      if(start>=end){return start}
      var mid=array[midIndex];
      var left=array[(midIndex-1)<start? start:(midIndex-1)];
      var right=array[(midIndex+1)>end? end:(midIndex+1)];
      var sm=Math.abs(num-mid);
      var sl=Math.abs(num-left);
      var sr=Math.abs(num-right);
      if(sm < sl && sm < sr){
      return midIndex;
      }
      else{
      var li= this.findNearest(array,start,midIndex-1, num);
      var ri= this.findNearest(array,midIndex+1, end, num);
      if(Math.abs(num-array[li]) < Math.abs(num-array[ri])){
      return li;
      }
      return ri;
      }
      }
      async viewLoad(Args: UpdatePayload) {
      this.getConfig.data.position.x1 = "";
      this.getConfig.data.position.x2 = "";
      this.getConfig.data.position.y1 = "";
      this.getConfig.data.position.y2 = "";
      this.config.data.userInputData = Args.variables;
      this.tempUserInputData = this.config.data.userInputData;
      console.log("viewLoad");
      var expectedDotNum = this.ExpectedDotNum;
      var expansionMultiple = this.ExpansionMultiple;
      var initialStartTime:any = this.tempUserInputData.get("startTime");
      var initialEndTime:any = this.tempUserInputData.get("endTime");
      var initialRange:any = initialEndTime - initialStartTime;
      //获取边界值
      var getLimitsInputData = this.tempUserInputData;
      getLimitsInputData.set("startTime","0");
      getLimitsInputData.set("endTime","0");
      getLimitsInputData.set("count","2");
      var timeUrl = this.pathProcessor.FillPathWithVar(
      getLimitsInputData,
      this.config.data.url.timePath
      );
      console.log(timeUrl);
      await this.getDataTimeAxis(timeUrl);
      this.xmin = this.temp.dataTimeAxis[0];
      this.xmax = this.temp.dataTimeAxis[1];
      console.log("边界");
      console.log(this.xmin);
      console.log(this.xmax);
      var expansionStartTime:any ;
      var expansionEndTime:any;
      var expansionDotNum:any;
      //向左右扩展范围获取数据
      if(initialStartTime == 0 && initialEndTime == 0)
      {
      initialStartTime = this.xmin;
      initialEndTime = this.xmax;
      expansionStartTime = this.xmin;
      expansionEndTime = this.xmax;
      expansionDotNum = expectedDotNum;
      }
      else{
      expansionStartTime= Number(initialStartTime)-expansionMultiple*initialRange>= this.xmin?Number(initialStartTime)-expansionMultiple*initialRange:this.xmin;
      expansionEndTime= Number(initialEndTime)+expansionMultiple*initialRange <= this.xmax?Number(initialEndTime)+expansionMultiple*initialRange:this.xmax;
      expansionDotNum =Math.floor(((Number(expansionEndTime)- Number(expansionStartTime)) / (Number(initialEndTime)- Number(initialStartTime)) )*expectedDotNum)+1;
      }
      var getInputData = this.tempUserInputData;
      getInputData.set("startTime", expansionStartTime);
      getInputData.set("endTime",expansionEndTime);
      getInputData.set("count",expansionDotNum);
      var url = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.path
      );
      console.log(url);
      await this.getData(url);
      //当点不够时取全部点并重新获取y轴
      if(this.temp.data == null)
      {
      getInputData.set("count","0");
      url = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.path
      );
      await this.getData(url);
      }
      var timeUrl = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.timePath
      );
      console.log(url);
      console.log(timeUrl);
      await this.getDataTimeAxis(timeUrl);
      var first = url.indexOf("/");
      var second = url.indexOf("/", first+1);
      var third = url.indexOf("/", second+1)
      var fouth = url.indexOf("/", third+1)
      this.pathId = url.slice(third+1, fouth);
      var thingPath = url.slice(0, url.indexOf('/', 2));
      var path = this.pathId;
      var dealPath = {
      thingPath:thingPath,
      path:path
      }
      this.$emit("getPathId", dealPath);
      this.myPlot = this.wave;
      this.data_initial = [
      {
      x: this.temp.dataTimeAxis,
      y: this.temp.data
      }
      ];
      console.log("data_initial:");
      console.log(this.data_initial);
      var layout_initial = {
      xaxis: {
      range: [initialStartTime, initialEndTime]
      },
      yaxis: {
      range: [this.config.data.position.y1, this.config.data.position.y2]
      },
      hovermode:'closest',
      clickmode:'event',
      autosize:true
      };
      console.log(layout_initial);
      this.createChannelChart(this.myPlot, this.data_initial, layout_initial);
      this.updateConfig();
      PubSub.subscribe('PlotlyClick',(messageName:string, Args:any)=>{
      console.log("subscribe");
      console.log(Args);
      var nearestIndex:number = this.findNearest(this.data_initial[0].x, 0 , this.data_initial[0].x.length-1, Args.x)
      console.log(nearestIndex);
      console.log(this.data_initial[0].x[nearestIndex]);
      var annotate_text = 'x = '+this.data_initial[0].x[nearestIndex] +
      'y = '+this.data_initial[0].y[nearestIndex];
      var annotation = {
      text: annotate_text,
      x: this.data_initial[0].x[nearestIndex],
      y: this.data_initial[0].y[nearestIndex]
      }
      this.annotations = [];
      this.annotations.push(annotation);
      var layout_update = {
      annotations: this.annotations
      };
      Plotly.relayout(this.myPlot,layout_update);
      });
      PubSub.subscribe('SynchronizeXY',(messageName:string, Args:any)=>{
      console.log("subscribe");
      console.log(Args);
      var layout_update = {
      xaxis: {
      range: Args.xrange
      },
      yaxis: {
      range: Args.yrange
      }
      };
      Plotly.relayout(this.myPlot,layout_update);
      });
      PubSub.subscribe('SynchronizeX',(messageName:string, Args:any)=>{
      console.log("subscribe");
      console.log(Args);
      var layout_update = {
      xaxis: {
      range: Args.xrange
      }
      };
      Plotly.relayout(this.myPlot,layout_update);
      });
      PubSub.subscribe('SynchronizeY',(messageName:string, Args:any)=>{
      console.log("subscribe");
      console.log(Args);
      var layout_update = {
      yaxis: {
      range: Args.yrange
      }
      };
      Plotly.relayout(this.myPlot,layout_update);
      });
      this.myPlot.on("plotly_click", (data:any) =>{
      //当前区域的范围
      console.log(data.points[0].xaxis.range);
      console.log(data.points[0].yaxis.range);
      console.log(data);
      var pts = '';
      for(var i=0; i < data.points.length; i++){
      var annotate_text = 'x = '+data.points[i].x +
      'y = '+data.points[i].y.toPrecision(4);
      var annotation = {
      text: annotate_text,
      x: data.points[i].x,
      y: parseFloat(data.points[i].y.toPrecision(4))
      }
      var annotations = [];
      annotations.push(annotation);
      Plotly.relayout(this.myPlot,{annotations: annotations});
      PubSub.publish('PlotlyClick',{x:data.points[i].x,y:data.points[i].y.toPrecision(4)});
      }
      });
      //获取当前波形数据
      this.zoom();
      }
      zoom() {
      console.log("c");
      var createChannelChart = this.createChannelChart;
      var addAnnotations = this.addAnnotations;
      var getData = this.getData;
      var getDataTimeAxis = this.getDataTimeAxis;
      var getConfig = this.getConfig;
      var updateConfig = this.updateConfig;
      var pathProcessor = this.pathProcessor
      var zoom_xmax = this.temp.dataTimeAxis[this.nowDotNum - 1];
      var zoom_xmin = this.temp.dataTimeAxis[0];
      var zoom_ymax = this.temp.data[this.nowDotNum - 1];
      var zoom_ymin = this.temp.data[0];
      var nowRange = zoom_xmax - zoom_xmin;
      var temp = this.temp;
      this.myPlot.on("plotly_relayout", (data: any)=> {
      var zoom_xmax = this.temp.dataTimeAxis[this.nowDotNum - 1];
      var zoom_xmin = this.temp.dataTimeAxis[0];
      var zoom_ymax = this.temp.data[this.nowDotNum - 1];
      var zoom_ymin = this.temp.data[0];
      var nowRange = zoom_xmax - zoom_xmin;
      var temp = this.temp;
      var config = this.config;
      var tempUserInputData = this.tempUserInputData;
      var expansionMultiple = this.ExpansionMultiple;
      var expectedDotNum = this.ExpectedDotNum;
      var expansionStartTime:any ;
      var expansionEndTime:any;
      var expansionDotNum:any;
      console.log("d");
      console.log(data);
      if (!data["xaxis.autorange"] &&(data["xaxis.range[0]"] || data["xaxis"]) ) {
      var nowZoom_xmin;
      var nowZoom_xmax;
      if(data["xaxis"])
      {
      console.log("x");
      nowZoom_xmin = data["xaxis"]["range"][0];
      nowZoom_xmax = data["xaxis"]["range"][1];
      if(data["yaxis"])
      {
      console.log("y");
      zoom_ymin = data["yaxis"]["range"][0];
      zoom_ymax = data["yaxis"]["range"][1];
      }
      }
      else if(data["xaxis.range[0]"])
      {
      nowZoom_xmin = data["xaxis.range[0]"];
      nowZoom_xmax = data["xaxis.range[1]"];
      zoom_ymin = data["yaxis.range[0]"];
      zoom_ymax = data["yaxis.range[1]"];
      }
      console.log(nowZoom_xmin);
      console.log(nowZoom_xmax);
      console.log(zoom_xmax);
      console.log(zoom_xmin);
      var x_range = nowZoom_xmax - nowZoom_xmin;
      if (
      nowZoom_xmin < zoom_xmin ||
      nowZoom_xmax > zoom_xmax ||
      (((x_range/nowRange)*this.nowDotNum < expectedDotNum)&&(this.GetAllDot==false))
      ) {
      this.GetAllDot = false;
      expansionStartTime = Number(nowZoom_xmin)-expansionMultiple*x_range >= this.xmin?Number(nowZoom_xmin)-expansionMultiple*x_range:this.xmin;
      expansionEndTime = Number(nowZoom_xmax)+expansionMultiple*x_range <= this.xmax? Number(nowZoom_xmax)+expansionMultiple*x_range:this.xmax;
      console.log(expansionStartTime);
      console.log(expansionEndTime);
      console.log(this.nowDotNum);
      console.log((x_range/nowRange)*this.nowDotNum);
      console.log("重加载");
      console.log(expansionStartTime < zoom_xmin);
      console.log(expansionEndTime > zoom_xmax);
      console.log(expansionEndTime);
      console.log(zoom_xmax);
      console.log( ((x_range/nowRange)*this.nowDotNum < expectedDotNum));
      //重新给一遍值
      zoom_xmax = expansionEndTime;
      zoom_xmin = expansionStartTime;
      nowRange = zoom_xmax - zoom_xmin;
      expansionDotNum = Math.floor(((Number(expansionEndTime)- Number(expansionStartTime)) / (Number(nowZoom_xmax)- Number(nowZoom_xmin)) )*expectedDotNum)+1;
      var getInputData = this.tempUserInputData;
      getInputData.set("startTime", expansionStartTime);
      getInputData.set("endTime",expansionEndTime);
      getInputData.set("count",expansionDotNum);
      var myplot = this.wave;
      var yRange = myplot.layout.yaxis.range;
      console.log(yRange);
      if(!data["yaxis"]&&!data["yaxis.range[0]"])
      {
      var layout_update = {
      xaxis: {
      range: [nowZoom_xmin, nowZoom_xmax]
      },
      yaxis: {
      range: [yRange[0], yRange[1]]
      },
      annotations: this.annotations
      };
      }
      else{
      var layout_update = {
      xaxis: {
      range: [nowZoom_xmin, nowZoom_xmax]
      },
      yaxis: {
      range: [zoom_ymin, zoom_ymax]
      },
      annotations: this.annotations
      };
      }
      getConfig.data.position.x1 = zoom_xmin;
      getConfig.data.position.x2 = zoom_xmax;
      getConfig.data.position.y1 = zoom_ymin;
      getConfig.data.position.y2 = zoom_ymax;
      updateConfig();
      this.showPlot(getInputData,layout_update,this.myPlot);
      }
      }
      });
      // this.myPlot.on("plotly_doubleclick", ()=> {
      // console.log("plotly_doubleclick");
      // createChannelChart(this.myPlot, this.data_initial);
      // this.zoom();
      // });
      this.myPlot.on("plotly_click", (data:any)=>{
      //当前区域的范围
      console.log("plotly_click");
      console.log(data.points[0].xaxis.range);
      console.log(data.points[0].yaxis.range);
      console.log(data);
      var pts = '';
      for(var i=0; i < data.points.length; i++){
      var annotate_text = 'x = '+data.points[i].x +
      'y = '+data.points[i].y.toPrecision(4);
      var annotation = {
      text: annotate_text,
      x: data.points[i].x,
      y: parseFloat(data.points[i].y.toPrecision(4))
      }
      var annotations = [];
      annotations.push(annotation);
      addAnnotations(annotations);
      Plotly.relayout(this.myPlot,{annotations: annotations});
      PubSub.publish('PlotlyClick',{x:data.points[i].x,y:data.points[i].y.toPrecision(4)});
      }
      });
      }
      async showPlot(getInputData:any,layout_update:any,myPlot:any)
      {
      var url = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.path
      );
      await this.getData(url);
      console.log("重加载getData");
      console.log(this.temp.data);
      //当点不够时取全部点并重新获取y轴
      if(this.temp.data == null)
      {
      getInputData.set("count","0");
      this.GetAllDot = true;
      url = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.path
      );
      await this.getData(url);
      }
      var timeUrl = this.pathProcessor.FillPathWithVar(
      getInputData,
      this.config.data.url.timePath
      );
      console.log(url);
      console.log(timeUrl);
      await this.getDataTimeAxis(timeUrl);
      console.log("重加载getDataTimeAxis");
      console.log(this.temp.dataTimeAxis);
      var data_update = [
      {
      x: this.temp.dataTimeAxis,
      y: this.temp.data
      }
      ];
      console.log("data_update");
      console.log(data_update);
      this.createChannelChart(myPlot, data_update, layout_update);
      this.zoom();
      }
      addAnnotations(annotations:any)
      {
      this.annotations = annotations;
      }
      createChannelChart(myPlot: any, data_update: any, data_layout: any = {}) {
      data_layout.margin = { t: 20 };
      var config = {
      modeBarButtonsToRemove: ["resetScale2d"],
      displaylogo: false
      };
      Plotly.newPlot(myPlot, data_update, data_layout, config);
      }
      async getData(url: any) {
      var apiLoad = url;//改
      await axios.get(apiLoad).then(response => {
      this.temp.data = response.data.CFET2CORE_SAMPLE_VAL;
      console.log("getData");
      console.log(apiLoad);
      console.log(response);
      });
      }
      async getDataTimeAxis(url: any) {
      var apiLoad = url;
      await axios.get(apiLoad).then(response => {
      this.temp.dataTimeAxis = response.data.CFET2CORE_SAMPLE_VAL;
      console.log("getDataTimeAxis");
      console.log(apiLoad);
      console.log(response);
      this.nowDotNum = response.data.CFET2CORE_SAMPLE_VAL.length;
      console.log(this.nowDotNum);
      });
      }
      }
      </script>
      <style scoped>
      </style>
      src/components/WaveView/showViewInfo.vue 0 → 100755
      View file @ 950584ee
      <template>
      <div class="largeFont" style="float:left width:100%">
      <span>Basic Path :&nbsp;{{ basePathId }}</span><br>
      <span> Rate: {{ sampleId }}</span><br>
      <span>length: {{ lengthId }}</span>
      <b-button variant="primary" style="float:right">
      <span class="glyphicon glyphicon-cog" @click="showPathIdConfig"></span>
      </b-button>
      <br>
      <hr />
      </div>
      </template>
      <script lang="ts">
      import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
      import axios from 'axios';
      @Component
      export default class showViewInfo extends Vue {
      @Prop() pathId!:string;
      basePathId: string = '';
      sampleId: string = '';
      lengthId: string = '';
      @Watch('pathId')
      onPathIdChanged(val:any, oldVal:any) {
      this.show(val);
      }
      showPathIdConfig(){
      this.$emit("showPathIdConfig");
      }
      async show(pathId:string) {
      this.getBasePath(pathId);
      this.getSamplerate(pathId);
      this.getLength(pathId);
      }
      async getBasePath(pathId:any) {
      var apiLoad = pathId.thingPath + '/basepath';
      await axios.get(apiLoad)
      .then((response) => {
      this.basePathId = response.data.CFET2CORE_SAMPLE_VAL;
      })
      }
      async getSamplerate(pathId:any) {
      var apiLoad = pathId.thingPath + '/samplerate/' + pathId.path;
      await axios.get(apiLoad)
      .then((response) => {
      this.sampleId = response.data.CFET2CORE_SAMPLE_VAL;
      })
      }
      async getLength(pathId:any) {
      var apiLoad = pathId.thingPath + '/length/' + pathId.path;
      await axios.get(apiLoad)
      .then((response) => {
      this.lengthId = response.data.CFET2CORE_SAMPLE_VAL;
      })
      }
      }
      </script>
      \ No newline at end of file
      src/main.js 0 → 100644
      View file @ 950584ee
      import Vue from 'vue';
      import App from './App.vue';
      import Buefy from 'buefy';
      import 'buefy/dist/buefy.css';
      import 'font-awesome/css/font-awesome.min.css';
      //import hscmap from '@hscmap/vue-window'
      import * as VueWindow from '@hscmap/vue-window';
      import 'babel-polyfill';
      import VideoPlayer from 'vue-video-player';
      import 'vue-video-player/src/custom-theme.css';
      import 'video.js/dist/video-js.css';
      Vue.config.productionTip = false;
      //Vue.use(BootstrapVue)
      Vue.use(Buefy);
      Vue.use(VueWindow);
      Vue.use(VideoPlayer);
      // Vue.use(VueRouter);
      // const routes = [
      // { path: '/', meta: {
      // title: 'MdsplusWave'
      // }
      // }
      // ];
      // const router = new VueRouter({
      // routes
      // });
      // router.beforeEach((to, from, next) => {
      // document.title = 'MdsplusWave'
      // next()
      // })
      new Vue({
      render: (h) => h(App),
      }).$mount('#app');
      //# sourceMappingURL=main.js.map
      \ No newline at end of file
      src/main.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"main.js","sourceRoot":"","sources":["main.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,KAAK,CAAC;AACtB,OAAO,GAAG,MAAM,WAAW,CAAC;AAC5B,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,sBAAsB,CAAA;AAC7B,OAAO,uCAAuC,CAAA;AAC9C,yCAAyC;AACzC,OAAO,KAAK,SAAS,MAAM,oBAAoB,CAAA;AAQ/C,OAAO,gBAAgB,CAAA;AAEvB,OAAO,WAAW,MAAM,kBAAkB,CAAA;AAC1C,OAAO,uCAAuC,CAAA;AAC9C,OAAO,4BAA4B,CAAA;AAGnC,GAAG,CAAC,MAAM,CAAC,aAAa,GAAG,KAAK,CAAC;AAEjC,uBAAuB;AACvB,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;AACd,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;AAElB,GAAG,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;AAIpB,sBAAsB;AAEtB,mBAAmB;AACnB,0BAA0B;AAC1B,2BAA2B;AAC3B,MAAM;AACN,IAAI;AACJ,KAAK;AAEL,iCAAiC;AACjC,WAAW;AACX,MAAM;AAEN,0CAA0C;AAC1C,mCAAmC;AACnC,WAAW;AACX,KAAK;AAGL,IAAI,GAAG,CAAC;IACN,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;CAEtB,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC"}
      \ No newline at end of file
      src/main.ts 0 → 100755
      View file @ 950584ee
      import Vue from 'vue';
      import App from './App.vue';
      import Buefy from 'buefy'
      import 'buefy/dist/buefy.css'
      import 'font-awesome/css/font-awesome.min.css'
      //import hscmap from '@hscmap/vue-window'
      import * as VueWindow from '@hscmap/vue-window'
      import router from 'vue-router'
      //import '@/assets/css/fontSize.css';
      //import 'bootstrap/dist/css/bootstrap.css'
      //import 'bootstrap-vue/dist/bootstrap-vue.css'
      import BootstrapVue from 'bootstrap-vue'
      import 'babel-polyfill'
      import VideoPlayer from 'vue-video-player'
      import 'vue-video-player/src/custom-theme.css'
      import 'video.js/dist/video-js.css'
      Vue.config.productionTip = false;
      //Vue.use(BootstrapVue)
      Vue.use(Buefy)
      Vue.use(VueWindow)
      Vue.use(VideoPlayer)
      // Vue.use(VueRouter);
      // const routes = [
      // { path: '/', meta: {
      // title: 'MdsplusWave'
      // }
      // }
      // ];
      // const router = new VueRouter({
      // routes
      // });
      // router.beforeEach((to, from, next) => {
      // document.title = 'MdsplusWave'
      // next()
      // })
      new Vue({
      render: (h) => h(App),
      //router,
      }).$mount('#app');
      src/models/PathProcessor.js 0 → 100644
      View file @ 950584ee
      export default class PathProcessor {
      FillPathWithVar(variables, path) {
      //$ $ variables是userinoutdata是参数+参数值
      const urlRegExp = /(?<=\$)\w*(?=\$)/g;
      let str = '';
      //取出path中的$ $，数组
      const result = path.match(urlRegExp);
      if (result != null) {
      //遍历map和数组
      variables.forEach((value, key) => {
      result.forEach((label) => {
      // tslint:disable-next-line:triple-equals
      if (label == key) {
      str = '\$' + label + '\$';
      //将$xxx$替换成参数值 path为/card0/length/0
      path = path.replace(str, value);
      }
      });
      });
      }
      return path;
      }
      extractVarFromPath(path) {
      let inputLabel;
      inputLabel = [];
      const urlRegExp = /(?<=\$)\w*(?=\$)/g;
      const result = path.match(urlRegExp);
      if (result != null) {
      result.forEach((element) => {
      if (element != "") {
      inputLabel.push(element);
      }
      });
      }
      console.log('extract' + inputLabel);
      return inputLabel;
      }
      }
      //# sourceMappingURL=PathProcessor.js.map
      \ No newline at end of file
      src/models/PathProcessor.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"PathProcessor.js","sourceRoot":"","sources":["PathProcessor.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,aAAa;IACvB,eAAe,CAAC,SAA8B,EAAE,IAAY;QAC/D,qCAAqC;QACrC,MAAM,SAAS,GAAG,mBAAmB,CAAC;QACtC,IAAI,GAAG,GAAG,EAAE,CAAC;QACb,gBAAgB;QAChB,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACrC,IAAI,MAAM,IAAI,IAAI,EAAE;YAChB,UAAU;YACV,SAAS,CAAC,OAAO,CAAC,CAAC,KAAa,EAAE,GAAW,EAAE,EAAE;gBAC7C,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;oBACrB,yCAAyC;oBACzC,IAAI,KAAK,IAAI,GAAG,EAAE;wBACd,GAAG,GAAG,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;wBAC1B,oCAAoC;wBACpC,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;qBACnC;gBACL,CAAC,CAAC,CAAC;YACP,CAAC,CAAC,CAAC;SACN;QACD,OAAO,IAAI,CAAC;IAChB,CAAC;IACM,kBAAkB,CAAC,IAAY;QAClC,IAAI,UAAoB,CAAC;QACzB,UAAU,GAAG,EAAE,CAAC;QAChB,MAAM,SAAS,GAAG,mBAAmB,CAAC;QACtC,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QACrC,IAAI,MAAM,IAAI,IAAI,EAAE;YAChB,MAAM,CAAC,OAAO,CAAC,CAAC,OAAe,EAAE,EAAE;gBACnC,IAAG,OAAO,IAAI,EAAE,EAChB;oBACI,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;iBAC5B;YACD,CAAC,CAAC,CAAC;SACN;QACD,OAAO,CAAC,GAAG,CAAC,SAAS,GAAC,UAAU,CAAC,CAAC;QAClC,OAAO,UAAU,CAAC;IACtB,CAAC;CACJ"}
      \ No newline at end of file
      src/models/PathProcessor.ts 0 → 100755
      View file @ 950584ee
      export default class PathProcessor {
      public FillPathWithVar(variables: Map<string, string>, path: string): string {
      //$ $ variables是userinoutdata是参数+参数值
      const urlRegExp = /(?<=\$)\w*(?=\$)/g;
      let str = '';
      //取出path中的$ $，数组
      const result = path.match(urlRegExp);
      if (result != null) {
      //遍历map和数组
      variables.forEach((value: string, key: string) => {
      result.forEach((label) => {
      // tslint:disable-next-line:triple-equals
      if (label == key) {
      str = '\$' + label + '\$';
      //将$xxx$替换成参数值 path为/card0/length/0
      path = path.replace(str, value);
      }
      });
      });
      }
      return path;
      }
      public extractVarFromPath(path: string): string[] {
      let inputLabel: string[];
      inputLabel = [];
      const urlRegExp = /(?<=\$)\w*(?=\$)/g;
      const result = path.match(urlRegExp);
      if (result != null) {
      result.forEach((element: string) => {
      if(element != "")
      {
      inputLabel.push(element);
      }
      });
      }
      console.log('extract'+inputLabel);
      return inputLabel;
      }
      }
      src/models/StrMapObjChange.js 0 → 100644
      View file @ 950584ee
      export default class StrMapObjChange {
      strMapToObj(strMap) {
      let obj = Object.create(null);
      for (let [k, v] of strMap) {
      // We don’t escape the key '__proto__'
      // which can cause problems on older engines
      obj[k] = v;
      }
      return obj;
      }
      objToStrMap(obj) {
      let strMap = new Map();
      for (let k of Object.keys(obj)) {
      strMap.set(k, obj[k]);
      }
      return strMap;
      }
      }
      //# sourceMappingURL=StrMapObjChange.js.map
      \ No newline at end of file
      src/models/StrMapObjChange.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"StrMapObjChange.js","sourceRoot":"","sources":["StrMapObjChange.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,OAAO,OAAO,eAAe;IAC3B,WAAW,CAAC,MAA2B;QAC5C,IAAI,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;QAC9B,KAAK,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,MAAM,EAAE;YACzB,sCAAsC;YACtC,4CAA4C;YAC5C,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;SACZ;QACD,OAAO,GAAG,CAAC;IACb,CAAC;IAEM,WAAW,CAAC,GAAQ;QACzB,IAAI,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACvB,KAAK,IAAI,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;YAC9B,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;SACvB;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;CACF"}
      \ No newline at end of file
      src/models/StrMapObjChange.ts 0 → 100755
      View file @ 950584ee
      export default class StrMapObjChange {
      public strMapToObj(strMap: Map<string, string>): any {
      let obj = Object.create(null);
      for (let [k, v] of strMap) {
      // We don’t escape the key '__proto__'
      // which can cause problems on older engines
      obj[k] = v;
      }
      return obj;
      }
      public objToStrMap(obj: any) :Map<string, string>{
      let strMap = new Map();
      for (let k of Object.keys(obj)) {
      strMap.set(k, obj[k]);
      }
      return strMap;
      }
      }
      src/models/UpdatePayload.js 0 → 100644
      View file @ 950584ee
      export var Action;
      (function (Action) {
      Action[Action["Get"] = 0] = "Get";
      Action[Action["Set"] = 1] = "Set";
      Action[Action["Invoke"] = 2] = "Invoke";
      Action[Action["Broadcast"] = 3] = "Broadcast";
      Action[Action["BroadcastAndRefresh"] = 4] = "BroadcastAndRefresh";
      })(Action || (Action = {}));
      //# sourceMappingURL=UpdatePayload.js.map
      \ No newline at end of file
      src/models/UpdatePayload.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"UpdatePayload.js","sourceRoot":"","sources":["UpdatePayload.ts"],"names":[],"mappings":"AAEA,MAAM,CAAN,IAAY,MAMX;AAND,WAAY,MAAM;IAChB,iCAAG,CAAA;IACH,iCAAG,CAAA;IACH,uCAAM,CAAA;IACN,6CAAS,CAAA;IACT,iEAAmB,CAAA;AACrB,CAAC,EANW,MAAM,KAAN,MAAM,QAMjB"}
      \ No newline at end of file
      src/models/UpdatePayload.ts 0 → 100755
      View file @ 950584ee
      import * as Collections from "typescript-collections";
      export enum Action {
      Get,
      Set,
      Invoke,
      Broadcast,
      BroadcastAndRefresh
      }
      export interface UpdatePayload {
      target: string[];
      action: string;
      variables: Map<string, string>;
      }
      export interface ParamRef {
      paramName:string;
      value: string;
      ref: string;
      }
      src/models/WidgetConfig.js 0 → 100644
      View file @ 950584ee
      export class AllWidgetConfig {
      constructor() {
      this.widgetList = [];
      }
      }
      //# sourceMappingURL=WidgetConfig.js.map
      \ No newline at end of file
      src/models/WidgetConfig.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"WidgetConfig.js","sourceRoot":"","sources":["WidgetConfig.ts"],"names":[],"mappings":"AAMA,MAAM,OAAO,eAAe;IAA5B;QAES,eAAU,GAAgB,EAAE,CAAC;IACtC,CAAC;CAAA"}
      \ No newline at end of file
      src/models/WidgetConfig.ts 0 → 100755
      View file @ 950584ee
      import { WidgetRef } from './WidgetRef';
      export interface WidgetConfig {
      WidgetComponentName: string;
      data: any;
      }
      export class AllWidgetConfig {
      public currentRef?: string;
      public widgetList: WidgetRef[] = [];
      }
      src/models/WidgetRef.js 0 → 100644
      View file @ 950584ee
      export class WidgetRef {
      constructor() {
      // this is not quite right, the config for a resource should only be visual-wise,
      // the parameters of a resource should be probed by the widget itself
      this.widgetComponentName = '';
      this.ref = '';
      //below is for grid layout
      this.x = 0;
      this.y = 0;
      this.w = 8;
      this.h = 6;
      this.i = 0;
      }
      }
      //# sourceMappingURL=WidgetRef.js.map
      \ No newline at end of file
      src/models/WidgetRef.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"WidgetRef.js","sourceRoot":"","sources":["WidgetRef.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,SAAS;IAAtB;QACE,iFAAiF;QACjF,qEAAqE;QAC9D,wBAAmB,GAAW,EAAE,CAAC;QACjC,QAAG,GAAW,EAAE,CAAC;QAExB,0BAA0B;QACnB,MAAC,GAAQ,CAAC,CAAC;QACX,MAAC,GAAQ,CAAC,CAAC;QACX,MAAC,GAAQ,CAAC,CAAC;QACX,MAAC,GAAQ,CAAC,CAAC;QACX,MAAC,GAAQ,CAAC,CAAC;IACpB,CAAC;CAAA"}
      \ No newline at end of file
      src/models/WidgetRef.ts 0 → 100755
      View file @ 950584ee
      import { WidgetConfig } from './WidgetConfig';
      export class WidgetRef {
      // this is not quite right, the config for a resource should only be visual-wise,
      // the parameters of a resource should be probed by the widget itself
      public widgetComponentName: string = '';
      public ref: string = '';
      public widgetConfig?: WidgetConfig;
      //below is for grid layout
      public x:number=0;
      public y:number=0;
      public w:number=8;
      public h:number=6;
      public i:number=0;
      }
      src/models/configParameter.js 0 → 100644
      View file @ 950584ee
      //# sourceMappingURL=configParameter.js.map
      \ No newline at end of file
      src/models/configParameter.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"configParameter.js","sourceRoot":"","sources":["configParameter.ts"],"names":[],"mappings":""}
      \ No newline at end of file
      src/models/configParameter.ts 0 → 100755
      View file @ 950584ee
      export interface TimeParameter {
      pathId: string;
      startTime: string;
      endTime: string;
      dotNum: string;
      }
      src/models/customview.js 0 → 100644
      View file @ 950584ee
      //# sourceMappingURL=customview.js.map
      \ No newline at end of file
      src/models/customview.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"customview.js","sourceRoot":"","sources":["customview.ts"],"names":[],"mappings":""}
      \ No newline at end of file
      src/models/customview.ts 0 → 100755
      View file @ 950584ee
      export interface ResourceInfo {
      Parameters: Map<string, string>;
      OutputType: string;
      }
      src/models/widget.js 0 → 100644
      View file @ 950584ee
      import { Vue } from 'vue-property-decorator';
      export class Widget extends Vue {
      }
      //# sourceMappingURL=widget.js.map
      \ No newline at end of file
      src/models/widget.js.map 0 → 100644
      View file @ 950584ee
      {"version":3,"file":"widget.js","sourceRoot":"","sources":["widget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAC;AAW7C,MAAM,OAAgB,MAAO,SAAQ,GAAG;CAUvC"}
      \ No newline at end of file
      src/models/widget.ts 0 → 100755
      View file @ 950584ee
      import { Vue } from 'vue-property-decorator';
      import { WidgetConfig } from './WidgetConfig';
      import { UpdatePayload } from './UpdatePayload';
      import { ResourceInfo } from './Customview';
      export interface PokePath {
      getPath: string;
      setPath: string;
      invokePath: string;
      }
      export abstract class Widget extends Vue {
      public WidgetComponentName?: string;
      public abstract setConfig(wid: WidgetConfig): void;
      public abstract getConfig(): WidgetConfig;
      public abstract parentUpdate(payload: UpdatePayload): void;
      public abstract refresh(): void;
      public abstract updateUI(): void;
      public abstract replaceStartPath(startPath:string):void;
      public abstract pathPoke():void;
      public abstract samplePoke(sample:any):void;
      }
      src/shims-tsx.d.ts 0 → 100755
      View file @ 950584ee
      import Vue, { VNode } from 'vue';
      declare global {
      namespace JSX {
      // tslint:disable no-empty-interface
      interface Element extends VNode {}
      // tslint:disable no-empty-interface
      interface ElementClass extends Vue {}
      interface IntrinsicElements {
      [elem: string]: any;
      }
      }
      }
      src/shims-vue.d.ts 0 → 100755
      View file @ 950584ee
      /*import VueRouter, {Route} from'vue-router'
      import Vue from 'vue'
      declare module 'vue/types/vue' {
      interface Vue {
      $router: VueRouter;
      $route: Route;
      }
      }*/
      declare module '*.vue' {
      import Vue from 'vue';
      export default Vue;
      }
      //declare module 'vue-router';
      declare module 'pubsub-js';
      declare module "vue-video-player";
      src/types/vue-grid-layout/index.d.ts 0 → 100755
      View file @ 950584ee
      declare module 'vue-grid-layout' {
      import Vue from 'vue';
      export class GridLayout extends Vue {}
      export class GridItem extends Vue {}
      export interface GridItemData {
      x: number;
      y: number;
      w: number;
      h: number;
      i: string;
      }
      }
      \ No newline at end of file
      src/types/vue-router/index.d.ts 0 → 100644
      View file @ 950584ee
      declare module 'vue-router' {
      export interface router {
      $router: any;
      $route: any;
      }
      }
      \ No newline at end of file
      src/types/vue-svg-gauge/index.d.ts 0 → 100755
      View file @ 950584ee
      declare module 'vue-svg-gauge' {
      import Vue from 'vue';
      export class VueSvgGauge extends Vue {}
      }
      \ No newline at end of file
      tsconfig.json 0 → 100755
      View file @ 950584ee
      {
      "compilerOptions": {
      "target": "esnext",
      //"target": "es5",
      "module": "esnext",
      //"module": "commonjs",
      //"outDir": "./js",
      "strict": true,
      "jsx": "preserve",
      "importHelpers": true,
      "moduleResolution": "node",
      "experimentalDecorators": true,
      "esModuleInterop": true,
      "allowSyntheticDefaultImports": true,
      "sourceMap": true,
      "baseUrl": ".",
      "typeRoots": ["./src/types"],
      "types": [
      "webpack-env"
      ],
      "paths": {
      "@/*": [
      "src/*"
      ]
      },
      "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
      ]
      },
      "include": [
      "src/**/*.ts",
      "src/**/*.tsx",
      "src/**/*.vue",
      "tests/**/*.ts",
      "tests/**/*.tsx", "node_modules/vue-grid-layout/dist/vue-grid-item.d.ts"
      ],
      "exclude": [
      "node_modules"
      ]
      }
      tsconfig2.json 0 → 100644
      View file @ 950584ee
      {
      "compilerOptions": {
      /* Basic Options */
      // "incremental": true, /* Enable incremental compilation */
      //"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
      // "module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
      // "lib": [], /* Specify library files to be included in the compilation. */
      // "allowJs": true, /* Allow javascript files to be compiled. */
      // "checkJs": true, /* Report errors in .js files. */
      // "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
      // "declaration": true, /* Generates corresponding '.d.ts' file. */
      // "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
      // "sourceMap": true, /* Generates corresponding '.map' file. */
      // "outFile": "./", /* Concatenate and emit output to single file. */
      // "outDir": "./js", /* Redirect output structure to the directory. */
      // "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
      // "composite": true, /* Enable project compilation */
      // "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */
      // "removeComments": true, /* Do not emit comments to output. */
      // "noEmit": true, /* Do not emit outputs. */
      // "importHelpers": true, /* Import emit helpers from 'tslib'. */
      // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
      // "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
      /* Strict Type-Checking Options */
      // "strict": true, /* Enable all strict type-checking options. */
      // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
      // "strictNullChecks": true, /* Enable strict null checks. */
      // "strictFunctionTypes": true, /* Enable strict checking of function types. */
      // "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
      // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
      // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
      // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
      /* Additional Checks */
      // "noUnusedLocals": true, /* Report errors on unused locals. */
      // "noUnusedParameters": true, /* Report errors on unused parameters. */
      // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
      // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
      /* Module Resolution Options */
      // "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
      // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
      // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
      // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
      // "typeRoots": [], /* List of folders to include type definitions from. */
      // "types": [], /* Type declaration files to be included in compilation. */
      // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
      //"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
      // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
      // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
      /* Source Map Options */
      // "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
      // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
      // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
      // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
      /* Experimental Options */
      // "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
      // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
      /* Advanced Options */
      //"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
      }
      }
      tslint.json 0 → 100755
      View file @ 950584ee
      {
      "defaultSeverity": "warning",
      "extends": [
      "tslint:recommended"
      ],
      "linterOptions": {
      "exclude": [
      "node_modules/**"
      ]
      },
      "rules": {
      "indent": [true, "spaces", 2],
      "interface-name": false,
      "no-consecutive-blank-lines": false,
      "object-literal-sort-keys": false,
      "ordered-imports": false,
      "quotemark": [true, "single"]
      }
      }
      vue.config.js 0 → 100755
      View file @ 950584ee
      module.exports = {
      outputDir: '/Users/igem/Desktop/slide',
      devServer: {
      proxy: {
      "/": {
      target: "http://192.168.0.195:8001",
      secure: false,
      changeOrigin: true
      }
      }
      }
      };
      使用Web API读取通道数据/使用Web API读取通道数据.md 0 → 100755
      View file @ 950584ee
      CFET DataServer数据接口说明文件
      使用HTTP协议的GET方法（Web
      API），可以从运行了CFET2Server程序的主机上读取CFET支持的数据采集文件中（包括HDF5）的数据。包括两大类的数据：
      1、**double[]类型**，也就是原始数据（可切片）及其对应时间轴；
      2、**单个数值类型**，也就是原始数据的metadata（如采样率，总点数等）
      使用HTTP的Request Header即可获取对应数据（不分大小写）
      下面的说明基于以下设定条件（条件可变）：
      运行了CFET2Server程序的主机IP地址与端口为127.0.0.1:8002
      数据文件完整路径为
      C:\\Users\\BrightstarKing\\Desktop\\Server\\1056333\\data.hdf5
      其中有”0”，”1”，“2“，”3”四个通道
      **（1）获取数据文件根路径**
      http://127.0.0.1:8000/dataServer/**basepath**
      ![](media/cfa9f57635e8bf6798c579e0815aa704.png)
      返回的是一个如下的JSON：
      {
      "ResourceType": 1,
      "Context": {
      "CFET2CORE_SAMPLE_VAL":
      "C:\\\\Users\\\\BrightstarKing\\\\Desktop\\\\Server\\\\",
      "CFET2CORE_SAMPLE_PATH": "/dataServer/BasePath",
      "CFET2CORE_SAMPLE_ISREMOTE": false,
      "CFET2CORE_SAMPLE_ISVALID": true
      },
      "Val": "C:\\\\Users\\\\BrightstarKing\\\\Desktop\\\\Server\\\\",
      "IsValid": true,
      "ErrorMessages": [],
      "Path": "/dataServer/BasePath",
      "IsRemote": false,
      "ObjectVal": "C:\\\\Users\\\\BrightstarKing\\\\Desktop\\\\Server\\\\"
      }
      **其中最后的字段”ObjectVal”中包含了需要的值**。\\\\中的第一个\\为转义，实际为字符串：**C:\\Users\\BrightstarKing\\Desktop\\Server\\**
      注意，之后所有方法中的有效数据都在这个”**ObjectVal**”字段中
      **（2）获取数据文件创建时间**
      http://127.0.0.1:8002/dataServer/**CreateTime/1056333.data.0**
      ![](media/7223c96d78034bf5e55928b78f8ee6b9.png)
      注意上面的**1056333.data.0**实际应该是**1056333\\data\\0**（**最后的0表示通道号，必须加上；注意这里没有.hdf5后缀**），但由于在传输过程中\\会乱码，**所以参数中的**”**\\**”**一律用**”**.**”**替换**
      ObjectVal为：
      **20190117095111.0**
      **（3）获取采集开始参考时间**
      http://127.0.0.1:8002/dataServer/**StartTime/1056333.data.0**
      ![](media/75467cceccdcb267576a2dd948824572.png)
      ObjectVal为：
      **0.5**
      **（4）获取采样率**
      http://127.0.0.1:8002/dataServer/**SampleRate/1056333.data.0**
      ![](media/cd6a498c4d54e5dcf0f7cbc19980497a.png)
      ObjectVal为：
      **1000.0**
      **（5）获取数据长度**
      http://127.0.0.1:8002/dataServer/**Length/1056333.data.0**
      ![](media/805aaa473d068ae6d7f5e30610a30105.png)
      ObjectVal为：
      **10000**
      **（6）获取序列化为JSON的以上数据**
      http://127.0.0.1:8002/dataServer/**MetadataJson/1056333.data.0**
      ![](media/cb790ae41a5489fbc37b315706b98b63.png)
      ObjectVal为一个JSON格式字符串
      **（7）获取连续数据**
      http://127.0.0.1:8002/dataServer/**Data/1056333.data.0/0/1000**
      参数列表：
      Data(string dataFilePath, ulong start = 0, ulong length = 0)
      默认参数（加了=的，后同）可以不给出；length = 0表示获取全部长度
      ![](media/979936ef5cf665948536ea6e6ce97167.png)
      参数0为起点；1000为终点
      ObjectVal为一个double[]类型数组，其中包含1000个点
      **（8）获取（7）的时间轴**
      http://127.0.0.1:8002/dataServer/**DataTimeAxis/1056333.data.0/0/1000**
      ![](media/87156888cd12cb591c8c8c335768521a.png)
      同（7）
      **（9）获取最精确全面的切片数据**
      http://127.0.0.1:8002/dataServer/**DataComplex/1056333.data.0/0/4/1000/2**
      参数列表：
      DataComplex(string dataFilePath, ulong start, ulong stride, ulong count, ulong
      block = 1)
      ![](media/e3d24c8a0e440d7b5435bc9fe14e8835.png)
      参数0为起点；4为下次读取时每次向后跳的点数；1000为读取次数；2为每次连续读取几个点
      ![](media/2c46b22fed697a85b2682188d28c4162.png)
      ObjectVal为一个double[]类型数组，其中包含2000个点
      **（10）获取（9）的时间轴**
      http://127.0.0.1:8002/dataServer/**DataComplexTimeAxis/1056333.data.0/0/4/1000/2**
      ![](media/8a4afb7bffb2cd637376e9622a5c1dce.png)
      同（9）
      **（11）通过时间获取数据**
      http://127.0.0.1:8002/dataServer/**DataByTime/1056333.data.0/0.5/2.5/10**
      参数列表：
      DataByTime(string dataFilePath, double startTime = 0, double endTime = 0, ulong
      stride = 1)
      ![](media/2203345b6d0fe6d0f15037a0bebc81eb.png)
      参数0.5为开始时间；2.5为结束时间；10为每次跳多少个点；默认参数全读
      ObjectVal为一个double[]类型数组
      **（12）获取（11）的时间轴**
      http://127.0.0.1:8002/dataServer/**DataByTimeTimeAxis/1056333.data.0/0.5/2.5/10**
      ![](media/5c3769da20f9fc7c89f0aa7688ba16d5.png)
      同（11）
      **（13）获取一段时间内大致一定数量的点**
      http://127.0.0.1:8002/dataServer/**DataByTimeFuzzy/1056333.data.0/0.5/2.5/900**
      参数列表：
      DataByTimeFuzzy(string dataFilePath, double startTime, double endTime, ulong
      count)
      ![](media/0e8b2fa835e5e8493b780a3fad2f661f.png)
      参数0.5为开始时间；2.5为结束时间；900为希望获取在0.5到2.5S之间的点数
      ObjectVal为一个double[]类型数组，其中实际包含1000个点
      这是因为为了确保时间轴的均匀，所以给的点数不一定能够满足条件，于是所获得的实际长度\>=count
      **（14）获取（13）的时间轴**
      http://127.0.0.1:8002/dataServer**/DataByTimeFuzzyTimeAxis/1056333.data.0/0.5/2.5/900**
      ![](media/0e8b2fa835e5e8493b780a3fad2f661f.png)
      同（13）
      **读取MdsPlus数据的说明**
      1. **获取某炮某通道的y轴**
      http://127.0.0.1:8002/mdsServer**/Data/ip/1056333**
      Data (string tagName, int shotNo)
      1. **获取某炮某通道的x轴**
      http://127.0.0.1:8002/mdsServer**/DataTimeAxis/ip/1056333**
      DataTimeAxis (string tagName, int shotNo)
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment