- fix create task

- project sort with created time
- new project created time reassign - copy project created time reassign - save project (create task, copy task, delete task)
2023-03-25 13:18:41 +08:00 · 2023-03-25 13:07:46 +08:00 · 2023-03-24 19:22:38 +08:00 · 2023-03-24 19:07:42 +08:00 · 2023-03-21 16:21:51 +08:00 · 2023-03-16 17:56:32 +08:00
50 changed files with 1683 additions and 229 deletions
@@ -17021,13 +17021,29 @@
      "integrity": "sha512-VPNCOTZK6WZy73lcWc+R7IW1uaBFEO3/Csrs5CzWVOdvE30V8Y1+BE/BtTlcEmeDGx0eqdE7bSCg55Jj37PMJg=="
    },
    "v-tooltip": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-2.0.3.tgz",
-      "integrity": "sha512-KZZY3s+dcijzZmV2qoDH4rYmjMZ9YKGBVoUznZKQX0e3c2GjpJm3Sldzz8HHH2Ud87JqhZPB4+4gyKZ6m98cKQ==",
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/v-tooltip/-/v-tooltip-2.1.3.tgz",
+      "integrity": "sha512-xXngyxLQTOx/yUEy50thb8te7Qo4XU6h4LZB6cvEfVd9mnysUxLEoYwGWDdqR+l69liKsy3IPkdYff3J1gAJ5w==",
      "requires": {
-        "lodash": "^4.17.15",
-        "popper.js": "^1.16.0",
-        "vue-resize": "^0.4.5"
+        "@babel/runtime": "^7.13.10",
+        "lodash": "^4.17.21",
+        "popper.js": "^1.16.1",
+        "vue-resize": "^1.0.1"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.20.1",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.20.1.tgz",
+          "integrity": "sha512-mrzLkl6U9YLF8qpqI7TB82PESyEGjm/0Ly91jG575eVxMMlb8fYfOXFZIJ8XfLrJZQbm7dlKry2bJmXBUEkdFg==",
+          "requires": {
+            "regenerator-runtime": "^0.13.10"
+          }
+        },
+        "regenerator-runtime": {
+          "version": "0.13.11",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
+          "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="
+        }
      }
    },
    "v8-compile-cache": {
@@ -17327,9 +17343,27 @@
      }
    },
    "vue-resize": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-0.4.5.tgz",
-      "integrity": "sha512-bhP7MlgJQ8TIkZJXAfDf78uJO+mEI3CaLABLjv0WNzr4CcGRGPIAItyWYnP6LsPA4Oq0WE+suidNs6dgpO4RHg=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-1.0.1.tgz",
+      "integrity": "sha512-z5M7lJs0QluJnaoMFTIeGx6dIkYxOwHThlZDeQnWZBizKblb99GSejPnK37ZbNE/rVwDcYcHY+Io+AxdpY952w==",
+      "requires": {
+        "@babel/runtime": "^7.13.10"
+      },
+      "dependencies": {
+        "@babel/runtime": {
+          "version": "7.20.1",
+          "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.20.1.tgz",
+          "integrity": "sha512-mrzLkl6U9YLF8qpqI7TB82PESyEGjm/0Ly91jG575eVxMMlb8fYfOXFZIJ8XfLrJZQbm7dlKry2bJmXBUEkdFg==",
+          "requires": {
+            "regenerator-runtime": "^0.13.10"
+          }
+        },
+        "regenerator-runtime": {
+          "version": "0.13.11",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
+          "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="
+        }
+      }
    },
    "vue-router": {
      "version": "3.3.4",
@@ -46,7 +46,7 @@
    "regenerator-runtime": "^0.13.3",
    "register-service-worker": "^1.6.2",
    "streamsaver": "^2.0.5",
-    "v-tooltip": "^2.0.2",
+    "v-tooltip": "^2.1.3",
    "vee-validate": "^2.2.13",
    "vue": "^2.6.10",
    "vue-axios": "^3.2.0",
@@ -33,6 +33,8 @@ import localforage from 'localforage'
 import SlideOut from '@hyjiacan/vue-slideout'
 import '@hyjiacan/vue-slideout/lib/slideout.css'

+import VTooltip from 'v-tooltip'
+
 import '../metrics'
 import '../registerServiceWorker'

@@ -108,6 +110,8 @@ Vue.use(SlideOut, {
  // set default props here
 })

+Vue.use(VTooltip)
+
 Vue.prototype.API = api
 Vue.prototype.GLOBAL = global_

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path fill="#FFFFFF" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"/></svg>
@@ -0,0 +1,4 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.3334 1.83337H9.16671C8.15562 1.83337 7.33337 2.65562 7.33337 3.66671V7.33337H3.66671C2.65562 7.33337 1.83337 8.15562 1.83337 9.16671V18.3334C1.83337 19.3445 2.65562 20.1667 3.66671 20.1667H12.8334C13.8445 20.1667 14.6667 19.3445 14.6667 18.3334V14.6667H18.3334C19.3445 14.6667 20.1667 13.8445 20.1667 12.8334V3.66671C20.1667 2.65562 19.3445 1.83337 18.3334 1.83337ZM3.66671 18.3334V9.16671H12.8334L12.8352 18.3334H3.66671ZM18.3334 12.8334H14.6667V9.16671C14.6667 8.15562 13.8445 7.33337 12.8334 7.33337H9.16671V3.66671H18.3334V12.8334Z" fill="#B8C3CC"/>
+<path d="M5.5 11H11V12.8333H5.5V11ZM5.5 14.6667H11V16.5H5.5V14.6667Z" fill="#B8C3CC"/>
+</svg>
@@ -0,0 +1,4 @@
+<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.3333 2.33325H11.6666C10.3798 2.33325 9.33331 3.37975 9.33331 4.66659V9.33325H4.66665C3.37981 9.33325 2.33331 10.3798 2.33331 11.6666V23.3333C2.33331 24.6201 3.37981 25.6666 4.66665 25.6666H16.3333C17.6201 25.6666 18.6666 24.6201 18.6666 23.3333V18.6666H23.3333C24.6201 18.6666 25.6666 17.6201 25.6666 16.3333V4.66659C25.6666 3.37975 24.6201 2.33325 23.3333 2.33325ZM4.66665 23.3333V11.6666H16.3333L16.3356 23.3333H4.66665ZM23.3333 16.3333H18.6666V11.6666C18.6666 10.3798 17.6201 9.33325 16.3333 9.33325H11.6666V4.66659H23.3333V16.3333Z" fill="white"/>
+<path d="M7 14H14V16.3333H7V14ZM7 18.6667H14V21H7V18.6667Z" fill="white"/>
+</svg>
@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.2132 12.6274L6.97054 8.38479L2.7279 12.6274L1.31369 11.2132L5.55633 6.97058L1.31369 2.72794L2.7279 1.31373L6.97054 5.55637L11.2132 1.31373L12.6274 2.72794L8.38475 6.97058L12.6274 11.2132L11.2132 12.6274Z" fill="#B8C3CC" stroke="#B8C3CC" stroke-linejoin="round"/>
+</svg>
@@ -0,0 +1,3 @@
+<svg width="14" height="14" viewBox="0 0 16 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3 18C2.45 18 1.97933 17.8043 1.588 17.413C1.196 17.021 1 16.55 1 16V3H0V1H5V0H11V1H16V3H15V16C15 16.55 14.8043 17.021 14.413 17.413C14.021 17.8043 13.55 18 13 18H3ZM13 3H3V16H13V3ZM5 14H7V5H5V14ZM9 14H11V5H9V14Z" fill="#FF6C63"/>
+</svg>
@@ -0,0 +1,8 @@
+<svg width="36" height="38" viewBox="0 0 36 38" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_3_20" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="36" height="38">
+<rect width="36" height="38" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_3_20)">
+<path d="M25.737 18.6561C25.5543 18.849 25.5543 19.151 25.737 19.3439L30.8113 24.7L29.4 26.1897L22.5888 19L29.4 11.8103L30.8113 13.3L25.737 18.6561ZM5 28V25.8333H23.5V28H5ZM5 20.0833V17.9167H19V20.0833H5ZM5 12.1667V10H23.5V12.1667H5Z" fill="#768B9B" stroke="#768B9B" stroke-linejoin="round"/>
+</g>
+</svg>
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.75012 18.7498V11.2498H1.25012V8.74976H8.75012V1.24976H11.2501V8.74976H18.7501V11.2498H11.2501V18.7498H8.75012Z" fill="white" stroke="white" stroke-linejoin="round"/>
+</svg>
@@ -0,0 +1,3 @@
+<svg width="25" height="22" viewBox="0 0 25 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.7246 13.3226L23.2481 20.2889L22.872 20.6372L15.2354 13.5662L14.627 13.0029L13.9608 13.4964C13.3939 13.9164 12.7313 14.257 11.9636 14.5122C11.2143 14.7612 10.4084 14.8889 9.54002 14.8889C7.37746 14.8889 5.59555 14.2043 4.13159 12.8488C2.66996 11.4954 1.96002 9.88006 1.96002 7.94444C1.96002 6.00883 2.66996 4.39346 4.13159 3.04009C5.59555 1.68457 7.37746 1 9.54002 1C11.7026 1 13.485 1.68458 14.95 3.04027C16.4105 4.39351 17.12 6.00882 17.12 7.94444C17.12 8.7236 16.9867 9.44582 16.7256 10.1191C16.4567 10.8127 16.0964 11.4153 15.6473 11.9351L15.0157 12.6662L15.7246 13.3226ZM14.4273 12.5749L14.4279 12.5744C15.7797 11.3218 16.48 9.76006 16.48 7.94444C16.48 6.12883 15.7797 4.56711 14.4279 3.3145L14.4273 3.31398C13.0775 2.06509 11.4285 1.44444 9.54002 1.44444C7.65159 1.44444 6.00256 2.06509 4.65273 3.31398L4.65217 3.3145C3.30039 4.56711 2.60002 6.12883 2.60002 7.94444C2.60002 9.76006 3.30039 11.3218 4.65217 12.5744L4.65273 12.5749C6.00256 13.8238 7.65158 14.4444 9.54002 14.4444C11.4285 14.4444 13.0775 13.8238 14.4273 12.5749Z" fill="#2C4053" stroke="#B8C3CC" stroke-width="2"/>
+</svg>
@@ -25,12 +25,12 @@
        >
          <!-- *** icon -->
          <!-- <va-icon-vuestic /> -->
-          <img src='@/assets/img/bps_logo.png'>
+          <!-- <img src='@/assets/img/bps_logo.png'> -->
        </router-link>
      </div>
      <!-- <img style="height: 40px;" v-bind:src="'https://www.bioproweb.com/wp-content/uploads/2020/01/BPS-LOGO_60.png'"> -->
      <div class="app-navbar__center lg5 md4">
-        <span
+        <!-- <span
          class="app-navbar__text"
          :style="{color: this.$themes.gray}"
        >
@@ -43,7 +43,7 @@
          >
            contact@bioproweb.com
          </a>
-        </span>
+        </span> -->
      </div>
      <app-navbar-actions
        class="app-navbar__actions md5 lg4"
@@ -180,7 +180,7 @@
          {{ props.rowData.name }}
        </template>
        <template slot="parameter_set" slot-scope="props">
-          {{ getWorkingMode(props.rowData) }}
+          {{ getWorkingMode(props.rowData.device, props.rowData.parameter_set) }}
        </template>
        <template slot="created_at" slot-scope="props">
          {{transDate(props.rowData.created_at)}}
@@ -629,10 +629,13 @@ export default {
    deleteFileDone: async function () {
      const tmpCurrentPage = this.$refs.datatable_ref.currentPage
      // rebuild table
-      this.fileLists = this.fileLists.filter(file => file.name !== this.deleteInfo.name)
-      await this.refreshPage()
-      this.$refs.datatable_ref.currentPage = tmpCurrentPage
-      this.$refs.datatable_ref.inputPage(tmpCurrentPage)
+      this.fileLists = this.fileLists.filter(file => {
+        return file.id !== this.deleteInfo.metaID
+      })
+      // await this.refreshPage()
+      await this.$refs.datatable_ref.inputPage(1)
+      await this.$refs.datatable_ref.inputPage(tmpCurrentPage)
+      // this.$refs.datatable_ref.inputPage(tmpCurrentPage)
      // this.loadingFiles = false
      this.showToast(`deleted ${this.deleteInfo.name}`, {
        position: 'bottom-right',
@@ -676,7 +679,7 @@ export default {

        // call getfolder api and update
        const folders = await api.collection.getByParent('folder', this.currentInfo.id)
-        const files = await api.meta.getAttrByParent('folder', this.currentInfo.id, 'id-path-name-parent-description-size-time_duration-uuid-device-channels-created_at')
+        const files = await api.meta.getAttrByParent('folder', this.currentInfo.id, 'id-path-name-parent-description-size-time_duration-uuid-device-channels-parameter_set-created_at')
        file.updateFileList(folders)
        file.updateFileList(files)

@@ -703,8 +706,7 @@ export default {
      }
      const tmpCurrentPage = this.$refs.datatable_ref.currentPage
      await this.refreshPage()
-      this.$refs.datatable_ref.currentPage = tmpCurrentPage
-      this.$refs.datatable_ref.inputPage(tmpCurrentPage)
+      await this.$refs.datatable_ref.inputPage(tmpCurrentPage)
    },
    downloadCsv: async function (meta) {
      const href = location.href.split('/')[2]
@@ -774,11 +776,14 @@ export default {
        })
      }
    },
-    getWorkingMode: function (rowData) {
+    getWorkingMode: function (device, parameterSet) {
      try {
-        if (rowData.type === 'folder') return ''
-        return configTable.getModeConfig(rowData.device.library_name, rowData.parameter_set.MODE).name
-      } catch {
+        if (parameterSet) {
+          return configTable.getModeConfig(device.library_name, parameterSet.MODE).name
+        }
+        return ''
+      } catch (e) {
+        console.log('e', e)
        return ''
      }
    },
@@ -15,6 +15,7 @@
      :mask-color="'rgba(0, 0, 0, 0)'"
      :visible.sync="taskViewPanel.show"
      :title="(taskViewPanel.type === 1) ? 'Device' : (taskViewPanel.type === 3) ? 'Condition' : (taskViewPanel.type === 4) ? 'Parameter' : ''"
+      @closed="onClosing"
      resizable
    >
      <project-task/>
@@ -100,6 +101,9 @@ export default {
    },
  },
  methods: {
+    onClosing: async function () {
+      await this.saveProject(this.getSelectProject)
+    },
    pageToast: function (mes) {
      this.showToast(
        mes,
@@ -163,14 +167,6 @@ export default {
    },
    saveProject: async function (project) {
      this.updateProject({ project: project, api: this.API })
-      this.showToast(
-        'project update finish',
-        {
-          icon: 'fa-bell',
-          position: 'bottom-right',
-          duration: 5000,
-        },
-      )
    },
    detect: async function (device) {
      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
@@ -4,34 +4,25 @@
      <template slot="header">
        <div class="row">
          <div class="flex d-flex xs5 sm5 lg5 xl5">
-            <va-icon name="fa fa-bluetooth-b" color="primary"/>
-            <h5 class="mb-0">PROJECTS</h5>
+            <p class="project-view-header">PROJECTS</p>
          </div>
          <div class="flex xs7 sm7 lg7 xl7" style="text-align: right;">
-            <!-- <va-button v-if="projectConfigList.length !== 0" class="ma-0 circle-button" @click="closePanel"> -->
-            <va-icon v-if="projectConfigList.length !== 0" @click.native="closePanel"
-              name="fa fa-times"
-              color="black"
-            />
-            <!-- </va-button> -->
+            <img class="img-vertical-center" src="@/assets/img/project/menu_close.svg" @click="closePanel">
          </div>
        </div>
-        <!-- <div class="flex d-flex xl5 lg5 sm5 xs5 ma-0">
-          <va-icon name="fa fa-bluetooth-b mr-3" color="primary"/>
-          <h5 class="mb-0">PROJECTS</h5>
-        </div>
-        <div class="flex d-flex xl7 lg7 sm7 xs7 ma-0" style="text-align: right;">
-          <va-button v-if="projectConfigList.length !== 0" class="pa-0 ma-0 circle-button" small color="dark" @click="closePanel">
-            <va-icon
-              name="fa fa-times"
-              color="white"
-            />
-          </va-button>
-        </div> -->
      </template>
      <div class="flex d-flex m12 xs12 md12 xl12">
-        <div>
-          <va-button @click="createProject({ api: API })" icon="fa fa-plus"></va-button>
+        <div class="input-icons input-style flex sm12 xs12 md7 xl7 pa-0">
+          <img class="icon" src="@/assets/img/project/search.svg">
+          <input class="input-field" type="text" v-model="filterText">
+        </div>
+        <div class="ml-1 pa-0" style="text-align: right;">
+          <button class="project-copy-btn" @click="copyProject({ project: getSelectProject, index: index, api: API })">
+            <img class="img-vertical-center" src="@/assets/img/project/copy-alt.svg">
+          </button>
+          <button class="project-copy-btn ml-1" @click="createProject({ api: API })">
+            <img class="img-vertical-center" src="@/assets/img/project/plus.svg">
+          </button>
        </div>
      </div>
      <div>
@@ -42,15 +33,15 @@
        </va-tabs>
      </div>
      <div class="mt-1">
-        <project-manager-list v-if='tabValue == 0'/>
-        <running-project-manager-list v-if='tabValue == 1'/>
+        <project-manager-list v-if='tabValue == 0' :filterText="filterText"/>
+        <running-project-manager-list v-if='tabValue == 1' :filterText="filterText"/>
      </div>
    </va-card>
  </div>
 </template>

 <script>
-import { mapActions } from 'vuex'
+import { mapActions, mapGetters } from 'vuex'
 import { mapFields } from 'vuex-map-fields'
 import types from '@/store/modules/project/types'
 import ProjectManagerList from '@/components/project/manager/ProjectManagerList'
@@ -63,6 +54,10 @@ export default {
    RunningProjectManagerList,
  },
  computed: {
+    ...mapGetters('project', [
+      'getSelectProject',
+    ]),
+
    ...mapFields('project', [
      'lockMode',
      'projectList',
@@ -75,6 +70,7 @@ export default {
    return {
      tabValue: 0,
      tabTitles: ['CONFIG', 'RUNNING'],
+      filterText: '',
    }
  },
  methods: {
@@ -86,6 +82,9 @@ export default {
    ...mapActions('project',
      [
        types.project.create,
+        types.project.copy,
+        types.project.select,
+        types.project.delete,
      ],
    ),
    closePanel: function () {
@@ -100,4 +99,39 @@ export default {

 <style>

+    .input-icons img {
+      position: absolute;
+    }
+
+    .input-icons {
+      width: 67%;
+
+      /* margin-bottom: 10px; */
+    }
+
+    .icon {
+      color: grey;
+      min-width: 40px;
+      padding: 10px;
+    }
+
+    .input-field {
+      width: 100%;
+      padding: 9px;
+      text-align: right;
+      background: #f1f1f1;
+      border: none;
+      border-radius: 6px 6px 0 0;
+      border-bottom: 1.5px solid #758b9a;
+    }
+
+    .project-copy-btn {
+      width: 50px;
+      height: 38px;
+      background: #858dd6;
+      border: none;
+      border-radius: 5px;
+      cursor: pointer;
+    }
+
 </style>
@@ -1,12 +1,13 @@
 <template>
  <div class="row">
    <div class="flex xs12 lg12 md12">
-      <va-item class="mb-1" v-for="(project, index) in projectConfigList" :key="index" @click="selectProject({index: index})" clickable>
+      <va-item :class="(selectProjectIndex === index) ? 'project-list-text project-list-focus': 'project-list-text project-list'" v-for="(project, index) in configList" :key="index" @click="select(index)">
        <va-item-section @dblclick.native="switchEdit('name', index)">
          <div v-if="projectTable.name == index">
            <va-input
+              :ref="'input_ref'"
              v-model="project.name"
-              style="width: 100px;"
+              style="min-width: 100px;"
              @blur="switchEdit('name', -1, project)"
              @keyup.enter="switchEdit('name', -1, project)"
            />
@@ -14,13 +15,11 @@
          <div v-else>
            {{ project.name }}
          </div>
-          <!-- <va-item-label>
-            {{ project.name }}
-          </va-item-label> -->
        </va-item-section>
        <va-item-section side>
-          <va-icon class="fa fa-copy mr-2" color="bloack" @click.native.stop="copyProject({ project: project, index: index, api: API })"></va-icon>
-          <va-icon class="fa fa-close" color="danger" @click.native.stop="deleteProject({ project: project, index: index, api: API })"></va-icon>
+          <img class="mr-2" src="@/assets/img/project/copy-alt-grey.svg" @click="copyProject({ project: project, index: index, api: API })">
+          <img v-if="selectDeleteIndex !== index" class="mr-2" src="@/assets/img/project/cross.svg" @click.stop="confirmDelete($event, index)">
+          <img v-else class="mr-2" src="@/assets/img/project/delete14_14.svg" @click.stop="_deleteProject(project, index)">
        </va-item-section>
      </va-item>
    </div>
@@ -33,9 +32,28 @@ import types from '@/store/modules/project/types'

 export default {
  name: 'project-manager-list',
+  props: {
+    filterText: {
+      type: String,
+      default: '',
+    },
+  },
  computed: {
+    configList () {
+      const projectList = this.projectConfigList
+      projectList.sort((a, b) => {
+        const date1 = new Date(a.created_at).getTime()
+        const date2 = new Date(b.created_at).getTime()
+        return date2 - date1
+      })
+      if (this.filterText === '') return projectList
+      return projectList.filter(ele => ele.name.includes(this.filterText))
+    },
+
    ...mapFields('project', [
      'projectConfigList',
+      'projectSelectIndex',
+      'projectTableSelectIndex',
    ]),
  },
  data () {
@@ -43,15 +61,48 @@ export default {
      projectTable: {
        name: -1,
      },
+      selectProjectIndex: -1,
+      selectDeleteIndex: -1,
    }
  },
  methods: {
+    reset: function () {
+      this.selectProjectIndex = -1
+      this.selectDeleteIndex = -1
+    },
+    resetDelete: function (e) {
+      if (e.target.classList.contains('clicked')) {
+        e.target.classList.remove('clicked')
+        return
+      }
+      this.selectDeleteIndex = -1
+    },
+    confirmDelete: function (e, index) {
+      e.target.classList.add('clicked')
+      this.selectProjectIndex = index
+      this.selectDeleteIndex = index
+      window.addEventListener('mousedown', this.resetDelete, { once: true })
+    },
+    _deleteProject: async function (project, index) {
+      this.reset()
+      await this.deleteProject({ project: project, index: index, api: this.API })
+    },
+    select: function (index) {
+      this.selectProjectIndex = index
+      this.selectDeleteIndex = -1
+      this.projectTableSelectIndex = -1
+      this.selectProject({ index: index })
+    },
+
    switchEdit: function (tag, index, project) {
      if (this.projectTable[tag] >= 0) {
        this.projectTable[tag] = -1
        project && this.API.project.update(project.id, { name: project.name })
      } else {
        this.projectTable[tag] = index
+        this.$nextTick(() => {
+          this.$refs.input_ref[0].$refs.input.focus()
+        })
      }
    },
    ...mapActions('project',
@@ -66,3 +117,32 @@ export default {
  },
 }
 </script>
+<style lang="scss">
+  .project-list-text {
+    // font
+    font-family: 'Inter-Regular';
+    font-style: italic;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 24px;
+    color: #768b9b;
+  }
+
+  .project-list-focus {
+    /* Rectangle 5 */
+
+    background: #ebedff;
+    border: 1px solid #dbdcf0;
+    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
+    border-radius: 5px;
+  }
+
+  .project-list-focus:hover {
+    opacity: 0.8;
+    background: #ebedff;
+  }
+
+  .project-list:hover {
+    opacity: 0.8;
+  }
+</style>
@@ -3,7 +3,7 @@
    <project-task-config-device v-if="taskViewPanel.type===1"></project-task-config-device>
    <project-task-config-condition v-if="taskViewPanel.type===2" :actionType="'start'"></project-task-config-condition>
    <project-task-config-condition v-if="taskViewPanel.type===3" :actionType="'stop'"></project-task-config-condition>
-    <project-task-config-parameter v-if="taskViewPanel.type===4"></project-task-config-parameter>
+    <project-task-config-parameter v-show="taskViewPanel.type===4"></project-task-config-parameter>
  </div>
 </template>
 <script>
@@ -61,7 +61,10 @@ export default {
    },

    taskDevice () {
-      return this.getSelectTask.device
+      if (this.getSelectTask.device) {
+        return this.getSelectTask.device
+      }
+      return null
    },
    ...mapGetters('project', [
      types.project.getSelect,
@@ -4,8 +4,9 @@
      <device-parameter-recording
        :ref="'device_parameter_ref'"
        :parameter="parameter"
-        :library="device.library"
+        :library="library"
        :place="'scheduler'"
+        :resetParameterModeChange="true"
        @setParameter="setParameter"
        @setParameterWithDebounce="setParameterWithDebounce"
      />
@@ -27,6 +28,11 @@ export default {
    DeviceParameterRecording,
  },
  computed: {
+    library () {
+      if (this.device === null || this.device === undefined) return null
+      return this.device.library
+    },
+
    ...mapGetters('project', [
      types.task.getSelect,
      types.task.getParameterSet,
@@ -37,6 +43,7 @@ export default {
      'taskViewPanel',
      'taskSelectKey',
      'deviceSelectKey',
+      'projectSelectIndex',
    ]),
  },
  data () {
@@ -60,7 +67,8 @@ export default {
      condition.select = !condition.select
    },
    setParameter: function (name, value) {
-      this.parameter = Object.assign({}, this.parameter)
+      // this.parameter = Object.assign({}, this.parameter)
+      this.parameter[name] = value

      if (this.parameterUUID === '') {
        this.parameterUUID = this.GLOBAL.getUUID()
@@ -79,6 +87,7 @@ export default {
    resetParameter: function (mode) {
      // get Device
      this.device = this.getDeviceProject(this.deviceSelectKey)
+      if (this.device === undefined) return
      // get Config
      if (typeof this.device.library === 'string') { // string
        this.config = configTable.getConfig(this.device.library)
@@ -98,7 +107,7 @@ export default {
        this.parameterUUID = Object.keys(parameterSet)[0]
        const param = Object.values(parameterSet)[0]
        const modeOption = this.$refs.device_parameter_ref.workingModeOptions.find(ele => ele.id === param.MODE)
-        this.$refs.device_parameter_ref.workingModeSelectChange(modeOption)
+        this.$refs.device_parameter_ref.workingModeSelectChange(modeOption, false)
        this.parameter = Object.assign(this.parameter, Object.values(parameterSet)[0])
      } else {
        const defaultMode = this.config.MODE_OPTIONS.find(ele => ele.description === 'Idle')
@@ -112,13 +121,12 @@ export default {
    ),
  },
  mounted () {
-    // init parameter
-    this.resetParameter()
  },
  watch: {
    // refresh parameter when click different task's parameter
    taskSelectKey: {
      handler: function () {
+        this.device = null
        this.parameter = {}
        this.parameterUUID = ''
        this.resetParameter()
@@ -126,6 +134,15 @@ export default {
    },
    deviceSelectKey: {
      handler: function () {
+        this.device = null
+        this.parameter = {}
+        this.parameterUUID = ''
+        this.resetParameter()
+      },
+    },
+    projectSelectIndex: {
+      handler: function () {
+        this.device = null
        this.parameter = {}
        this.parameterUUID = ''
        this.resetParameter()
@@ -1,7 +1,10 @@
 <template>
  <div>
    <!-- <pre>{{ getSelectProject }} </pre> -->
-    <va-card style="height: 88vh; overflow: auto; display: block;">
+    <va-card style="height: 88vh; overflow: auto; display: block;" @mousemove.native="mousemove">
+      <div id="project-view-show-btn" v-if="!projectManagerPanel.show" @click="showProjectManagerPanel">
+        <img id="project-view-show-btn-img" src="@/assets/img/project/arrow-right.svg">
+      </div>
      <template slot="header">
        <p class="project-view-header">{{ getSelectProject ? getSelectProject.name : '' }}</p>
      </template>
@@ -10,17 +13,17 @@
      </div>
      <div v-else>
        <project-menu @detect="detect" @save_project="save"/>
-        <project-table/>
+        <project-table @save="save"/>
        <div align="right" v-if="lockMode === false">
          <button class="project-start-btn" @click="start">
            <div>
-              <img src='@/assets/img/play.svg'>
+              <img src='@/assets/img/project/play.svg' alt="start">
            </div>
          </button>
        </div>
        <div align="right" v-if="lockMode === true">
          <button class="project-stop-btn" @click="stop">
-            <img src='@/assets/img/stop.svg'>
+            <img src='@/assets/img/project/stop.svg' alt="stop">
          </button>
        </div>
      </div>
@@ -50,6 +53,7 @@ export default {
      'deviceConnectList',
      'projectSelectIndex',
      'projectLibrary',
+      'projectManagerPanel',
    ]),
  },
  data () {
@@ -57,6 +61,37 @@ export default {
    }
  },
  methods: {
+    showProjectManagerPanel: function () {
+      this.projectManagerPanel.show = true
+    },
+    mousemove: function (e) {
+      // define constant
+      const DETECT_X_MAX = 50
+      const DETECT_X_MIN = 0
+      // get element
+      const element = document.getElementById('project-view-show-btn')
+      if (!element) return
+
+      let x = e.offsetX
+      // console.log('e', e, e.srcElement.className, e.srcElement.id)
+      // if mouse on project
+      if (e.srcElement.id === 'project-view-show-btn' || e.srcElement.id === 'project-view-show-btn-img') {
+        element.style.opacity = 0.7
+        element.style.transform = 'rotate(90deg) translate(40vh, 25px)'
+        return
+      }
+      if (e.srcElement.className !== 'va-card__body' && e.srcElement.className !== 'va-card') {
+        element.style.transform = 'rotate(90deg) translate(40vh, 75px)'
+        return
+      }
+      if (x >= DETECT_X_MAX) x = DETECT_X_MAX
+      if (x < DETECT_X_MIN) x = DETECT_X_MIN
+
+      const offsetPercentage = Math.round(((DETECT_X_MAX - x) / DETECT_X_MAX) * 4) / 4
+      const newOffset = 75 - offsetPercentage * 50
+      element.style.opacity = offsetPercentage * 0.7
+      element.style.transform = 'rotate(90deg) translate(40vh, ' + String(newOffset) + 'px)'
+    },
    start: function () {
      this.$emit('start_project', this.getSelectProject)
    },
@@ -83,8 +118,28 @@ export default {
 }
 </script>
 <style lang="scss">
+  #project-view-show-btn {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100px;
+    height: 50px;
+    border-radius: 100px 100px 0 0;
+    background-color: #495057;
+    transform: rotate(90deg)  translate(40vh, 75px);
+    transition: transform 0.1s linear;
+  }
+
+  #project-view-show-btn-img {
+    position: relative;
+    top: 5px;
+    left: 30px;
+    width: 40px;
+    height: 40px;
+  }
+
  .project-view-header {
-    margin: 1rem 0 2rem 0;
+    margin: 0.3rem 0 2rem 0;
    font-family: 'Inter-ExtraBold';
    // font-style: normal;
    // font-weight: 800;
@@ -1,30 +1,38 @@
 <template>
  <div>
-    <div class="row">
-      <div class="flex d-flex">
-        <!-- <switch-project/> -->
-        <add-task/>
-        <!-- <add-device @showDeviceModal="showDeviceModal"/> -->
+    <project-device @showDeviceModal="showDeviceModal" @save="saveProject"></project-device>
+    <div class="flex d-flex sm12 xs12 md6 xl4 px-0">
+      <add-task @save="saveProject"/>
+      <div>
        <button class="add-cycle-btn" @click="showCycleModal">
          <div class="add-cycle-text">
            <p>Add Cycle</p>
          </div>
        </button>
-        <button class="copy-project-btn" @click="copyTask({ project: getSelectProject, index: projectTableSelectIndex})">
-          <img class="img-vertical-center" src="@/assets/img/copy.svg">
+      </div>
+      <div>
+        <button class="copy-project-btn" @click="() => {
+          copyTask({ project: getSelectProject, index: projectTableSelectIndex})
+          saveProject()
+        }">
+          <img class="img-vertical-center" src="@/assets/img/project/copy.svg">
        </button>
-        <button class="copy-project-btn" @click="saveProject">
-          <img class="img-vertical-center" src="@/assets/img/save.svg">
+      </div>
+      <div>
+        <button class="copy-project-btn" @click="saveProject(true)">
+          <img class="img-vertical-center" src="@/assets/img/project/save.svg">
        </button>
-        <button class="copy-project-btn" @click="deleteTask({ project: getSelectProject, index: projectTableSelectIndex})">
-          <img class="img-vertical-center" src="@/assets/img/delete.svg">
+      </div>
+      <div>
+        <button class="copy-project-btn" @click="() => {
+          deleteTask({ project: getSelectProject, index: projectTableSelectIndex})
+          saveProject()
+        }">
+          <img class="img-vertical-center" src="@/assets/img/project/delete.svg">
        </button>
      </div>
    </div>
-
-    <project-device @showDeviceModal="showDeviceModal"></project-device>
-
-    <new-device-modal ref="device_modal_ref" @detect="detect"></new-device-modal>
+    <new-device-modal ref="device_modal_ref" @detect="detect" @save="saveProject"></new-device-modal>
    <cycle-modal ref="cycle_modal_ref" @createCycle="createCycle"></cycle-modal>
  </div>
 </template>
@@ -80,7 +88,17 @@ export default {
      this.$refs.cycle_modal_ref.show()
      this.$refs.cycle_modal_ref.reset()
    },
-    saveProject: function () {
+    saveProject: function (showMessage = false) {
+      if (showMessage === true) {
+        this.showToast(
+          'project update finish',
+          {
+            icon: 'fa-bell',
+            position: 'bottom-right',
+            duration: 5000,
+          },
+        )
+      }
      this.$emit('save_project', this.getSelectProject)
    },

@@ -114,7 +132,7 @@ export default {
    font-family: 'Inter-Bold';
    font-style: normal;
    font-weight: 700;
-    font-size: 20px;
+    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #ffffff;
@@ -1,6 +1,9 @@
 <template>
  <div>
-    <button class="add-task-btn" @click="createTask">
+    <button class="add-task-btn" @click="() => {
+      createTask()
+      save()
+    }">
      <div class="add-task-text">
        <p>Add Task</p>
      </div>
@@ -22,13 +25,12 @@ export default {
    }
  },
  methods: {
+    save: function () {
+      this.$emit('save')
+    },
    ...mapActions('project',
      [
-        types.task.init,
        types.task.create,
-        types.task.save,
-        types.task.delete,
-        types.task.select,
      ],
    ),
  },
@@ -52,7 +54,7 @@ export default {
    font-family: 'Inter-Bold';
    font-style: normal;
    font-weight: 700;
-    font-size: 20px;
+    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #ffffff;
@@ -135,7 +135,6 @@ export default {
      this.showModal = false
    },
    createCycle: async function () {
-      this.showModal = false
      const project = this.getSelectProject
      if (Object.keys(this.cycleInfo).length === 0) {
        this.$emit('createCycle', this.task)
@@ -182,7 +181,8 @@ export default {
          await this.swapTask({ project: project, originIndex: originEndIndex, newIndex: newEndIndex + 1 })
        }
      }
-
+      this.$emit('save')
+      this.showModal = false
      return true
    },
    removeCycle: async function () {
@@ -199,6 +199,7 @@ export default {
      const originEndIndex = await this.getIndexTask({ project: project, uuid: this.cycleInfo.range[1] })
      await this.deleteTask({ project: project, index: originEndIndex })

+      this.$emit('save')
      this.showModal = false
      return true
    },
@@ -101,10 +101,12 @@ export default {
      if (this.deviceList[this.deviceSelect]) {
        this.device.pair = this.deviceList[this.deviceSelect].macAddress
      }
+      this.$emit('save')
      this.hide()
    },
    removeDevice: function () {
      this.deleteDeviceProject({ deviceKey: this.key })
+      this.$emit('save')
      this.hide()
    },
    getDeviceList: async function (device) {
@@ -1,24 +1,43 @@
 <template>
-  <div class="row">
-    <div class="flex d-flex project-device-header-text">
-      <p>Devices</p>
+  <div class="flex d-flex sm12 xs12 md12 xl12 pa-0" style="align-items: center; margin-left: 0.6rem; margin-top: -12px;">
+    <!-- header -->
+    <div class="flex sm3 xs3 md3 xl1 px-0 project-device-header-text">
+      <p>Device</p>
    </div>
+    <!-- create persudo devcie -->
    <div class="flex d-flex" v-if="showLibrary === true">
-      <va-button small @click="clickShowDevice('EDC')">EDC</va-button>
-      <va-button small @click="clickShowDevice('EIS')">EIS</va-button>
-      <va-button small @click="cancelSelectDevice()">X</va-button>
+      <div class="flex d-flex pa-0 sm12 xs12 md6 xl3">
+        <div>
+          <button class="pair-button" @click="clickShowDevice('EDC')">
+            <span class="pair-button-text">EDC</span>
+          </button>
+        </div>
+        <div class="ml-2">
+          <button class="pair-button" @click="clickShowDevice('EIS')">
+            <span class="pair-button-text">EIS</span>
+          </button>
+        </div>
+        <div class="ml-2">
+          <button class="pair-button" @click="cancelSelectDevice()">
+            <span class="pair-button-text">X</span>
+          </button>
+        </div>
+      </div>
    </div>
-    <div class="flex d-flex" style="align-items: center;" v-if="showDevice === false && showLibrary === false">
+    <!-- device list -->
+    <div class="flex d-flex" v-if="showDevice === false && showLibrary === false">
      <draggable class="d-flex" :list="deviceListInOrder" :move="handleMove" @end="handleDragEnd">
+        <!-- devices -->
        <div class="mr-2" v-for="(device, index) in deviceListInOrder" :key="index">
          <button :class="device[1].pairStatus === 1 ? 'pair-button mr-2' : 'not-pair-button mr-2'" @click="showDeviceModal(device[0], device[1])">
            <span class="pair-button-text">{{ getDeviceShowNameProject(device[0]) }}</span>
          </button>
        </div>
+        <!-- append device -->
+        <div v-if="deviceListInOrder.length < 4">
+          <button class="add-button" icon="fa fa-plus" @click="clickShowLibrary"><span class="add-button-text">+</span></button>
+        </div>
      </draggable>
-      <div>
-        <button class="add-button" icon="fa fa-plus" @click="clickShowLibrary"><span class="add-button-text">+</span></button>
-      </div>
    </div>
  </div>
 </template>
@@ -73,6 +92,7 @@ export default {
        pairStatus: 1,
        order: this.getDeviceMaxOrderProject,
      })
+      this.$emit('save')
      return true
    },
    clickShowDevice: async function (library) {
@@ -84,6 +104,7 @@ export default {
        pairStatus: 0,
        order: this.getDeviceMaxOrderProject,
      })
+      this.$emit('save')
      return false
    },
    cancelSelectDevice: function () {
@@ -94,6 +115,7 @@ export default {
    },
    deleteDevice: function (deviceIndex) {
      this.deleteDeviceProject({ index: deviceIndex })
+      this.$emit('save')
    },
    handleMove (e) {
      const { index, futureIndex } = e.draggedContext
@@ -112,6 +134,7 @@ export default {
        deviceList[keyOld][key] = deviceListTemp[this.futureIndex][1][key]
        deviceList[keyNew][key] = deviceListTemp[this.index][1][key]
      }
+      this.$emit('save')
    },
    ...mapActions('project',
      [
@@ -162,8 +185,8 @@ export default {
  .not-pair-button {
    width: 100%;
    height: 36px;
-    background: #858dd6;
-    border: 1px #ffffff dashed;
+    background: #e0e0e0;
+    border: 0;
    border-radius: 20px;
  }

@@ -171,7 +194,7 @@ export default {
    font-family: 'Inter-Regular';
    font-style: normal;
    font-weight: 400;
-    font-size: 18px;
+    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #ffffff;
@@ -179,14 +202,15 @@ export default {

  .project-device-header-text {
    align-items: center;
-    font-family: 'Inter-Regular';
-    font-style: normal;
-    font-weight: 400;
-    font-size: 24px;
+    // font-family: 'Inter-Regular';
+    // font-style: normal;
+    font-weight: 700;
+    font-size: 20px;
    line-height: 29px;

    /* identical to box height */
-    color: #768b9b;
+    color: rgb(52, 73, 94);
+    // color: #768b9b;
  }

 </style>
@@ -1,21 +1,24 @@
 <template>
-  <div class="markup-tables project-table flex d-flex sm12 xl12 md12 xs12 px-0 mx-0" id="scro" style="width: 100%; height: 55vh; overflow: auto;">
+  <div class="markup-tables project-table flex d-flex sm12 xl12 md12 xs12 px-0 mx-0" id="scro" style="width: 100%; height: 55vh; overflow: auto; padding-top: 0;">
    <div class="table-wrapper" style="width: 100%;">
-      <table class="va-table">
+      <table class="va-table project-table-text">
        <thead>
-          <tr>
-            <th align="center" style="min-width: 50px;">order</th>
+          <tr class="project-table-header">
+            <th align="center" style="min-width: 50px; padding: 0;">order</th>
            <th align="center" style="min-width: 100px;">name</th>
            <th align="center" @click="openConfig(1)">device</th>
            <th align="center" style="min-width: 100px;">start</th>
            <th align="center" style="min-width: 100px;">stop</th>
            <th align="center" style="min-width: 100px;">parameter</th>
-            <th v-if="lockMode" align="center">cycle</th>
-            <th align="center"></th>
+            <!-- <th v-if="lockMode" align="center">cycle</th> -->
+            <th align="center" style="min-width: 50px;"></th>
          </tr>
        </thead>
        <!-- <tbody> -->
-        <vuedraggable :disabled="lockMode === true" class="draggable" :list="getSelectProject.task" @end="rearrangeTask({ project: getSelectProject })" tag="tbody" animation="500">
+        <vuedraggable :disabled="lockMode === true || inputMode === true" class="draggable" :list="getSelectProject.task" @end="()=> {
+          rearrangeTask({ project: getSelectProject })
+          saveProject()
+        }" tag="tbody" animation="500">
          <template class="item" v-for="(task, taskIndex) in getSelectProject.task">
            <tr
              v-if="task.type === 'cycle'"
@@ -72,8 +75,20 @@
              <td align="center">
                {{ taskIndex + 1 }}
              </td>
-              <td align="center">
-                {{ task.name }}
+              <!-- name -->
+              <td align="center" @dblclick="switchInput('name', taskIndex)">
+                <div v-if="tableColumn.name == taskIndex && lockMode === false">
+                  <va-input
+                    :ref="'input_ref'"
+                    v-model="task.name"
+                    style="width: 100px;"
+                    @blur="switchInput('name', -1)"
+                    @keyup.enter="switchInput('name', -1)"
+                  />
+                </div>
+                <div v-else align="center">
+                  {{ task.name }}
+                </div>
              </td>
              <td align="center">
                <va-button :flat="true" @click="openConfig(1, taskIndex)" small>+</va-button>
@@ -92,16 +107,18 @@
              v-else
              height="50px"
              :class="taskIndex === projectTableSelectIndex ? 'table-row-focus' : ''"
-              v-for="(deviceUUID, index) in task.device"
-              :key="String(taskIndex) + ' ' + String(deviceUUID)"
+              :key="String(taskIndex)"
              @click="() => { projectTableSelectIndex = taskIndex }"
            >
-              <td v-if="index === 0" :rowspan="task.device.length" align="center">
+              <!-- order -->
+              <td align="center">
                {{  taskIndex + 1 }}
              </td>
-              <td v-if="index === 0" :rowspan="task.device.length" align="center" @dblclick="switchInput('name', taskIndex)">
+              <!-- name -->
+              <td align="center" @dblclick="switchInput('name', taskIndex)">
                <div v-if="tableColumn.name == taskIndex && lockMode === false">
                  <va-input
+                    :ref="'input_ref'"
                    v-model="task.name"
                    style="width: 100px;"
                    @blur="switchInput('name', -1)"
@@ -120,16 +137,16 @@
                  </va-button>
                </div>
                <div v-else>
-                  <va-button :flat="true" @click="openConfig(1, taskIndex, deviceUUID)" small>
-                    <span>{{ getDeviceShowNameProject(deviceUUID)}}</span>
-                  </va-button>
+                  <div class="flex project-table-cell" v-for="(deviceUUID) in task.device" :key="deviceUUID" @click="openConfig(1, taskIndex, deviceUUID)">
+                    <p>{{ getDeviceShowNameProject(deviceUUID)}}</p>
+                  </div>
                </div>
              </td>
              <!-- device end -->
              <!-- start -->
              <td align="center">
-                <div class="flex">
-                  <div v-if="Object.values(task.action).filter(ele => ele.type === 'start').length === 0">
+                <div class="flex project-table-cell" v-for="(deviceUUID) in task.device" :key="deviceUUID">
+                  <div v-if="Object.values(task.action).filter(ele => ele.type === 'start' && ele.target === deviceUUID).length === 0">
                    +
                  </div>
                  <div v-for="(action, actionKey) in task.action" :key="actionKey">
@@ -140,9 +157,7 @@
                      <div v-else v-for="conditionKey in action.condition" :key="conditionKey">
                        <div v-if="action.type == 'start' && task.condition[conditionKey].type === 'previous_task_done'">
                          <div v-if=" taskIndex === 0"> - </div>
-                          <!-- {{ task.condition[conditionKey].type }} {{ task.condition[conditionKey].value }} -->
                          <div v-else> Follow {{ getSelectProject.task[taskIndex - 1].name }} </div>
-                          <!-- <va-icon class="fa fa-close" @click.native="delAction(task, actionKey, conditionKey)"/> -->
                        </div>
                      </div>
                    </div>
@@ -151,9 +166,9 @@
              </td>
              <!-- start end -->
              <!-- stop -->
-              <td align="center" @click="openConfig(3, taskIndex, deviceUUID)">
-                <div class="flex">
-                  <div v-if="Object.values(task.action).filter(ele => ele.type === 'stop').length === 0">
+              <td align="center">
+                <div class="flex project-table-cell" v-for="(deviceUUID) in task.device" :key="deviceUUID" @click="openConfig(3, taskIndex, deviceUUID)">
+                  <div v-if="Object.values(task.action).filter(ele => ele.type === 'stop' && ele.target === deviceUUID).length === 0">
                    +
                  </div>
                  <div v-for="(action, actionKey) in task.action" :key="actionKey">
@@ -172,42 +187,56 @@
                </div>
              </td>
              <!-- stop end -->
-
-              <td align="center" @click="openConfig(4, taskIndex, deviceUUID)">
-                <div v-if="Object.keys(task.parameter_set).length === 0">
-                  <p>
-                    +
-                  </p>
-                </div>
-                <div v-else class="flex d-flex">
-                  <div v-for="(parameterSet, parameterSetKey) in getParameterSetTask(taskIndex, deviceUUID)" :key="parameterSetKey">
-                    <div v-for="(parameter, parameterKey) in parameterSet" :key="parameterKey">
-                      <span v-if="parameterKey === 'MODE'">
+              <td align="center">
+                <div class="flex project-table-cell" v-for="(deviceUUID) in task.device" :key="deviceUUID" @click="openConfig(4, taskIndex, deviceUUID)">
+                  <div v-if="Object.values(task.parameter_set).filter(ele => ele.target === deviceUUID).length === 0" >
+                    <p>
+                      +
+                    </p>
+                  </div>
+                  <div style="height: auto;" v-for="(parameterSet, parameterSetKey) in getParameterSetTask(taskIndex, deviceUUID)" :key="parameterSetKey">
+                    <v-popover
+                      placement="right"
+                      trigger="hover"
+                      popoverBaseClass="tooltip popover test"
+                      :disabled="!Object.keys(parameterSet).filter(ele=>ele !== 'MODE' && ele !== 'target').length > 0"
+                    >
+                      <div class="tooltip-target">
+                        {{ parameterName('MODE', deviceUUID) }} : {{ parameterValue('MODE', parameterSet.MODE, deviceUUID) }}
+                      </div>
+                      <template slot="popover">
                        <div>
-                          {{ parameterName(parameterKey, deviceUUID) }} : {{ parameterValue(parameterKey, parameter, deviceUUID) }}
+                          <div v-for="(parameter) in parameterShow(parameterSet.MODE, deviceUUID)" :key="parameter + parameterSet.MODE">
+                            <p v-if="getConfig(deviceUUID).includes('TRIG') === true">
+                              {{ parameterPair(parameter, parameterSet, deviceUUID) }}
+                            </p>
+                            <p v-else>
+                              {{ parameterName(parameter, deviceUUID) }} : {{ parameterValue(parameter, parameterSet[parameter], deviceUUID) }}
+                            </p>
+                          </div>
                        </div>
-                      </span>
-                    </div>
+                      </template>
+                    </v-popover>
                  </div>
                </div>
              </td>
-              <!-- <td align="center" v-if="lockMode === false">
-                <va-icon v-if="String(taskIndex) !== '0'" class="fa fa-toggle-up" @click.native="swapTask(taskIndex, 0)"/>
+              <td align="center" v-if="lockMode === false">
+                <!-- <va-icon v-if="String(taskIndex) !== '0'" class="fa fa-toggle-up" @click.native="swapTask(taskIndex, 0)"/>
                <va-icon v-if="parseInt(taskIndex) !== getSelectProject.task.length - 1" class="fa fa-toggle-down" @click.native="swapTask(taskIndex, 1)"/>
-                <va-icon class="fa fa-copy ml-1" @click.native="() => copyTask({ project: getSelectProject, index: taskIndex})"></va-icon>
-                <va-icon class="fa fa-close ml-1" @click.native="() => deleteTask({ project: getSelectProject, index: taskIndex})"></va-icon>
-              </td> -->
-              <td align="center" v-if="lockMode === true">
+                <va-icon class="fa fa-copy ml-1" @click.native="() => copyTask({ project: getSelectProject, index: taskIndex})"></va-icon> -->
+                <va-icon class="fa fa-close" color="#B8C3CC" @click.native="() => deleteTask({ project: getSelectProject, index: taskIndex})"></va-icon>
+              </td>
+              <!-- <td align="center" v-if="lockMode === true">
                <div v-if="task.cycle > 0 && task.status === 2 && task.cycle_count === 0">
                  {{ task.cycle }}/{{ task.cycle }}
                </div>
                <div v-else-if="task.cycle > 0">
                  {{ task.cycle_count }}/{{ task.cycle }}
                </div>
-              </td>
-              <td  v-if="lockMode === true && Object.values(task.condition).findIndex(ele => ele.type == 'until_button_trigger') != -1 && task.status === 1">
+              </td> -->
+              <!-- <td  v-if="lockMode === true && Object.values(task.condition).findIndex(ele => ele.type == 'until_button_trigger') != -1 && task.status === 1">
                <va-button  icon="fa fa-play" @click="trigger_button(getSelectProject)" flat></va-button>
-              <td/>
+              <td/> -->
              <td align="center" v-if="lockMode === true">
                <!-- {{ task.status }} -->
                <fulfilling-bouncing-circle-spinner
@@ -221,11 +250,14 @@
            </tr>
          </template>
        </vuedraggable>
-      <!-- </tbody> -->
+        <!-- </tbody> -->
+        <tr class="table-row-add-task" v-if="lockMode === false">
+          <td align="center" colspan="7" class="table-row-add-task-text" @click="createTask">+ task</td>
+        </tr>
      </table>
    </div>
    <div>
-      <cycle-modal ref="cycle_modal_ref"></cycle-modal>
+      <cycle-modal ref="cycle_modal_ref" @save="saveProject"></cycle-modal>
    </div>
  </div>
 </template>
@@ -280,6 +312,7 @@ export default {
      inputSaved: '',
      index: -1,
      futureIndex: -1,
+      inputMode: false,
    }
  },
  methods: {
@@ -330,6 +363,7 @@ export default {
      if (a === undefined) return
      newTaskList.filter(ele => ele != null)
      this.rearrangeTask({ project: this.getSelectProject })
+      this.saveProject()
    },
    swapTask: function (taskIndex, upDown) {
      taskIndex = parseInt(taskIndex)
@@ -343,11 +377,13 @@ export default {
        this.getSelectProject.task.splice(taskIndex + 1, 1, a)
      }
      this.rearrangeTask({ project: this.getSelectProject })
+      this.saveProject()
    },
    delSelected: function () {
      for (const indexSelected of this.tableColumn.checked) {
        this.deleteTask({ project: this.getSelectProject, index: indexSelected })
      }
+      this.saveProject()
    },
    delAction: function (task, actionKey, conditionKey) {
      const _action = JSON.parse(JSON.stringify(task.action))
@@ -358,6 +394,12 @@ export default {

      task.action = _action
      task.condition = _condition
+
+      this.saveProject()
+    },
+    saveProject: function () {
+      console.log('saveProject')
+      this.$emit('save', this.getSelectProject)
    },
    trigger_button: function (projectID) {
      console.log('project', projectID)
@@ -368,9 +410,20 @@ export default {
      }))
    },
    switchInput: function (tag, index) {
-      this.tableColumn[tag] >= 0
-        ? this.tableColumn[tag] = -1
-        : this.tableColumn[tag] = index
+      if (this.tableColumn[tag] === -1) {
+        if (index !== -1) {
+          this.inputMode = true
+          this.tableColumn[tag] = index
+          this.$nextTick(() => {
+            this.$refs.input_ref[0].$refs.input.focus()
+          })
+        }
+      } else {
+        this.inputMode = false
+        this.tableColumn[tag] = -1
+      }
+
+      this.saveProject()
    },
    switchCycle: function (tag, index, projectID, task) {
      this.switchInput(tag, index)
@@ -383,6 +436,7 @@ export default {
        index: cycleInfo[0],
        content: { id: this.inputSaved },
      }))
+      this.$emit('save', this.getSelectProject)
    },
    selectAll: function (selectedArray) {
      const totalRange = [...Array(this.getSelectProject.task.length).keys()].map(idx => String(idx))
@@ -409,6 +463,47 @@ export default {
        }
      }
    },
+    parameterShow (mode, deviceKey) {
+      const config = configTable.getConfig(this.getDeviceLibraryProject(deviceKey))
+      if (config !== undefined && Object.keys(config) !== 0) {
+        if (this.getDeviceLibraryProject(deviceKey).includes('TRIG')) return config.MODE[mode].showParameter
+        return config.MODE[mode].parameter
+      }
+    },
+    parameterPair (name, valueSet, deviceKey) {
+      let _name, _value
+      const config = configTable.getConfig(this.getDeviceLibraryProject(deviceKey))
+      if (config !== undefined && Object.keys(config) !== 0) {
+        if (this.getDeviceLibraryProject(deviceKey).includes('TRIG')) {
+          if (name.includes('ACC_a_out')) {
+            const accName = name + '_current'
+            if (Boolean(valueSet[name]) === true) {
+              _name = 'Channel' + String((parseInt(name.replace('ACC_a_out', '')) + 1))
+              const scale = config[accName].unit[config[accName].defaultUnit]
+              _value = `${config[accName].outputReadabilityData(valueSet[accName], scale)} ${config[accName].defaultUnit}`
+            } else return ''
+          } else if (name.includes('TRIG')) {
+            if (Boolean(valueSet[name]) === true) {
+              const optionTrigger = [
+                'RISING',
+                'FALLING',
+                'BOTH',
+              ]
+              const trigName = name.replace('en', '') + 'edge_type'
+              _name = 'TRIG' + String((parseInt(name.replace('TRIG', '').replace('_en', '')) + 1))
+              _value = optionTrigger[valueSet[trigName]]
+            } else return ''
+          } else if (name.includes('TIME_DURATION')) {
+            if (valueSet.TIME_DURATION && parseInt(valueSet.TIME_DURATION) > 0) {
+              const scale = config[name].unit[config[name].defaultUnit]
+              _name = 'Timer'
+              _value = `${config[name].outputReadabilityData(valueSet[name], scale)} ${config[name].defaultUnit}`
+            } else return ''
+          }
+        }
+      }
+      return _name + ': ' + _value
+    },
    parameterName (name, deviceKey) {
      const config = configTable.getConfig(this.getDeviceLibraryProject(deviceKey))
      if (config !== undefined && Object.keys(config) !== 0) {
@@ -423,15 +518,16 @@ export default {
    },
    parameterValue (name, value, deviceKey) {
      const config = configTable.getConfig(this.getDeviceLibraryProject(deviceKey))
+      const _value = (value === undefined) ? config[name].defaultValue : value
      if (config !== undefined && Object.keys(config) !== 0) {
        if (name === 'MODE') {
-          return config.MODE[value].name
+          return config.MODE[_value].name
        }
        if (config[name].type === 'number') {
          const scale = config[name].unit[config[name].defaultUnit]
-          return `${config[name].outputReadabilityData(value, scale)} ${config[name].defaultUnit}`
+          return `${config[name].outputReadabilityData(_value, scale)} ${config[name].defaultUnit}`
        } else if (config[name].type === 'array') {
-          return `${config[name].outputReadabilityData(value)}`
+          return `${config[name].outputReadabilityData(_value)}`
        } else if (config[name].type === 'none') {
          return ''
        }
@@ -455,6 +551,10 @@ export default {
      return cycleInfo[1]
    },

+    getConfig: function (deviceKey) {
+      return this.getDeviceLibraryProject(deviceKey)
+    },
+
    handleMove (e) {
      const { index, futureIndex } = e.draggedContext
      this.index = index
@@ -462,6 +562,7 @@ export default {
      return false // disable sort
    },
    ...mapActions('project', [
+      types.task.create,
      types.task.copy,
      types.task.delete,
      types.task.rearrange,
@@ -501,22 +602,15 @@ export default {
      max-height: 100px;
      overflow: auto;
      white-space: nowrap;
-      font-size: 1.1rem;
-      // border: 1px solid #ffffff;
    }

    td:hover {
-      // background: #ebedff;
-      opacity: 0.8;
-      // border: 1px solid #dbdcf0;
-      // box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
-      // border-radius: 5px;
      cursor: pointer;
    }

    th {
-      padding: 0 0 0 0;
-      margin: 0;
+      // padding: 0 0 0;
+      // margin: 0;
      font-size: 1rem;
      border: none;
    }
@@ -527,4 +621,164 @@ export default {
    }
  }

+  .table-row-add-task {
+    height: 50px;
+    background: #f4f4f4;
+    border: 1px dashed #c7c7c7;
+    border-radius: 5px;
+  }
+
+  .table-row-add-task-text {
+    font-family: 'Inter-Regular';
+    font-style: italic;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px;
+    text-align: center;
+    color: #c7c7c7;
+  }
+
+  .project-table-header {
+    position: sticky;
+    top: 0;
+    background: white;
+    font-family: 'Inter-Bold';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px;
+    text-align: center;
+    color: #2c4053;
+  }
+
+  .project-table-text {
+    font-family: 'Inter-Regular';
+    font-style: normal;
+    // font-weight: 400;
+    font-size: 16px;
+    line-height: 24px;
+    text-align: center;
+    color: #2c4053;
+  }
+
+  .project-table-cell:hover {
+    opacity: 0.6;
+  }
+
+  .tooltip {
+    display: block !important;
+    z-index: 10000;
+
+    .tooltip-inner {
+      // background: red !important;
+      color: white;
+      border-radius: 16px;
+      padding: 5px 10px 4px;
+      box-shadow: rgba(108, 127, 238, 0.6) 0 2px 3px 0;
+      background-color: #ebedff !important;
+    }
+
+    .tooltip-arrow {
+      width: 0;
+      height: 0;
+      border-style: solid;
+      position: absolute;
+      margin: 5px;
+      border-color: black;
+      z-index: 1;
+    }
+
+    &[x-placement^="top"] {
+      margin-bottom: 5px;
+
+      .tooltip-arrow {
+        border-width: 5px 5px 0 5px;
+        border-left-color: transparent !important;
+        border-right-color: transparent !important;
+        border-bottom-color: transparent !important;
+        bottom: -5px;
+        left: calc(50% - 5px);
+        margin-top: 0;
+        margin-bottom: 0;
+      }
+    }
+
+    &[x-placement^="bottom"] {
+      margin-top: 5px;
+
+      .tooltip-arrow {
+        border-width: 0 5px 5px 5px;
+        border-left-color: transparent !important;
+        border-right-color: transparent !important;
+        border-top-color: transparent !important;
+        top: -5px;
+        left: calc(50% - 5px);
+        margin-top: 0;
+        margin-bottom: 0;
+      }
+    }
+
+    &[x-placement^="right"] {
+      margin-left: 5px;
+
+      .tooltip-arrow {
+        border-width: 5px 5px 5px 0;
+        border-left-color: transparent !important;
+        border-top-color: transparent !important;
+        border-bottom-color: transparent !important;
+        left: -5px;
+        top: calc(50% - 5px);
+        margin-left: 0;
+        margin-right: 0;
+      }
+    }
+
+    &[x-placement^="left"] {
+      margin-right: 5px;
+
+      .tooltip-arrow {
+        border-width: 5px 0 5px 5px;
+        border-top-color: transparent !important;
+        border-right-color: transparent !important;
+        border-bottom-color: transparent !important;
+        right: -5px;
+        top: calc(50% - 5px);
+        margin-left: 0;
+        margin-right: 0;
+      }
+    }
+
+    &.popover {
+      $color: #ebedff;
+
+      .popover-inner {
+        background: $color;
+        color: black;
+        padding: 24px;
+        border-radius: 5px;
+        box-shadow: 0 5px 30px rgba(black, 0.1);
+      }
+
+      .popover-arrow {
+        border-color: $color;
+      }
+    }
+
+    &[aria-hidden='true'] {
+      visibility: hidden;
+      opacity: 0;
+      transition: opacity 0.15s, visibility 0.15s;
+    }
+
+    &[aria-hidden='false'] {
+      visibility: visible;
+      opacity: 1;
+      transition: opacity 0.15s;
+    }
+  }
+
+  .test {
+    left: -175px !important;
+  }
+
 </style>
@@ -137,9 +137,22 @@ export default {
      if (this.data !== undefined && this.data.gridSource !== undefined) {
        let _xPhysicsQuantity = this.data.gridSource[plotIndex][curveIndex].name.split('_')[0].split('-').at(-1)
        let _yPhysicsQuantity = this.data.gridSource[plotIndex][curveIndex].name.split('_')[1].split('-').at(-1)
+        // console.log('1', _xPhysicsQuantity, _yPhysicsQuantity)
+        if (!_xPhysicsQuantity.includes('ZReal') && !_xPhysicsQuantity.includes('ZImag')) {
+          _xPhysicsQuantity = _xPhysicsQuantity.substring(0, 1)
+        } else {
+          _xPhysicsQuantity = _xPhysicsQuantity.substring(0, 5)
+        }
+        if (!_yPhysicsQuantity.includes('ZReal') && !_yPhysicsQuantity.includes('ZImag')) {
+          _yPhysicsQuantity = _yPhysicsQuantity.substring(0, 1)
+        } else {
+          _yPhysicsQuantity = _yPhysicsQuantity.substring(0, 5)
+        }
+        // console.log('2', _xPhysicsQuantity, _yPhysicsQuantity)
        // Potential
        if (_xPhysicsQuantity === 'P') _xPhysicsQuantity = 'V'
        if (_yPhysicsQuantity === 'P') _yPhysicsQuantity = 'V'
+        // console.log('2', _xPhysicsQuantity, _yPhysicsQuantity)
        const [_xAxis, _yAxis] = this.chartRouter.getChartTable(_xPhysicsQuantity, _yPhysicsQuantity)
        const _realTime = JSON.parse(JSON.stringify(this.realTime))
        const _newCurve = {}
@@ -126,10 +126,10 @@ const chartTable = {
      default: {
        name: 'Resistance',
        unit: {
-          mΩ: 1,
-          Ω: 1e3,
-          kΩ: 1e6,
-          MΩ: 1e9,
+          mΩ: 1e-3,
+          Ω: 1,
+          kΩ: 1e3,
+          MΩ: 1e6,
        },
        defaultUnit: 'Ω',
        downloadUnit: 'Ω',
@@ -157,7 +157,7 @@ const chartTable = {
      default: {
        name: 'degree',
        unit: {
-          '°': 1,
+          '°': 1e3,
        },
        defaultUnit: '°',
        downloadUnit: '°',
@@ -22,7 +22,7 @@
            <va-item-section class="ml-3" caption>
              <!-- <va-button @click="getBattery(device)"> get battery </va-button> -->
              <!-- <pre> {{ device.battery }} </pre> -->
-              <va-item-label v-if="device.library_name.includes('EIS')">
+              <va-item-label v-if="device.library_name.includes('EIS') || device.library_name.includes('TRIG')">
                {{ `[${device.memory_board}]` }} {{ device.name }}
              </va-item-label>
              <va-item-label v-else-if="parseInt((device.battery - 2900) / 10) >= 75">
@@ -26,8 +26,12 @@
        </div>
      </div>
      <!-- split because of styling problem(treenode), combine together furture -->
+      <!-- Trigger -->
+      <div v-if="library && library.includes('TRIG')">
+        <Trigger :parameter="parameter" :parameterTable="parameterTable" @parameterChange="parameterChange"></Trigger>
+      </div>
      <!-- EIS -->
-      <div v-if="library.includes('EIS')">
+      <div v-if="library && library.includes('EIS')">
        <component
          v-for="name in parameterArrayInMode"
          :key="name"
@@ -44,7 +48,7 @@
        />
      </div>
      <!-- ZM15-PulseSensingMode -->
-      <div v-else-if="parameter.MODE === 14">
+      <div v-else-if="library && (library.includes('EDC') || library.includes('BAT')) && parameter.MODE === 14">
        <EliteParameterRecordingElitePulseSensing
          :parameter="parameter"
          :device="device"
@@ -55,7 +59,7 @@
        />
      </div>
      <!-- ZM15-DPVMode -->
-      <div v-else-if="parameter.MODE === 15">
+      <div v-else-if="library && (library.includes('EDC') || library.includes('BAT')) && parameter.MODE === 15">
        <EliteParameterRecordingEliteDPV
          :parameter="parameter"
          :device="device"
@@ -66,7 +70,7 @@
        />
      </div>
      <!-- ZM15-OtherModes -->
-      <div v-else>
+      <div v-else-if="library && (library.includes('EDC') || library.includes('BAT'))">
        <va-tree-category
          v-for="name in parameterArrayInMode"
          :key="name"
@@ -94,7 +98,7 @@
    <!-- guide picture button -->
    <div>
      <vue-final-modal
-        v-if="library.includes('Elite_EDC')"
+        v-if="library && library.includes('EDC')"
        v-model="showModal"
        classes="modal-container"
        content-class="modal-content"
@@ -124,6 +128,7 @@ import InputField from '../parameter/itemNew/InputField'
 import MultiInputField from '../parameter/itemNew/MultiInputField'
 import EliteParameterRecordingEliteDPV from '../parameter/itemNew/DPVNew/EliteParameterRecordingEliteDPV'
 import DevMode from '../parameter/itemNew/DevMode'
+import Trigger from '../parameter/itemNew/TriggerNew/Trigger'
 import EliteParameterRecordingElitePulseSensing from '../parameter/itemNew/PulseSensingNew/EliteParameterRecordingElitePulseSensing'
 import { VueFinalModal } from 'vue-final-modal'
 import { mapFields } from 'vuex-map-fields'
@@ -141,6 +146,7 @@ export default {
    InputField,
    MultiInputField,
    DevMode,
+    Trigger,
  },
  props: {
    parameter: {
@@ -162,6 +168,10 @@ export default {
      type: String,
      default: '',
    },
+    resetParameterModeChange: {
+      type: Boolean,
+      default: false,
+    },
  },
  computed: {
    parameterTable () {
@@ -247,12 +257,20 @@ export default {
    },
    refresh () {
    },
-    workingModeSelectChange (val) {
+    workingModeSelectChange (val, reset = true) {
+      if (val === undefined || this.parameter.MODE === undefined) return
      this.workingModeSelect = val
-      console.log('workingModeSelectChange', this.workingModeSelect.id, this.parameter.MODE)
+      // console.log('workingModeSelectChange', this.workingModeSelect, this.parameter.MODE)

      if (this.workingModeSelect.id !== this.parameter.MODE) {
        this.parameterChange('MODE', this.workingModeSelect.id)
+        if (this.resetParameterModeChange === true) {
+          if (reset === true) {
+            for (const parameter of this.parameterTable.MODE[this.workingModeSelect.id].parameter) {
+              this.$emit('setParameter', parameter, this.parameterTable[parameter].defaultValue)
+            }
+          }
+        }

        // if device is idle, then setting highz when mode switch
        if (this.deviceStatus === true) {
@@ -279,9 +297,11 @@ export default {
    // this.developerMode === true
    //   ? this.workingModeOptions = this.workingModeDevOptions
    //   : this.workingModeOptions = this.workingModeNoDevOptions
-    this.workingModeOptions = this.parameterTable.MODE_OPTIONS
-    // init mode
-    this.workingModeSelect = (this.parameter.MODE !== undefined) ? this.workingModeOptions.find(ele => ele.id === this.parameter.MODE) : this.workingModeOptions[0]
+    if (this.parameterTable !== null) {
+      this.workingModeOptions = this.parameterTable.MODE_OPTIONS
+      // init mode
+      this.workingModeSelect = (this.parameter.MODE !== undefined) ? this.workingModeOptions.find(ele => ele.id === this.parameter.MODE) : this.workingModeOptions[0]
+    }
  },
  watch: {
    parameter: {
@@ -291,6 +311,13 @@ export default {
        this.workingModeSelect = (this.parameter.MODE !== undefined) ? this.workingModeOptions.find(ele => ele.id === this.parameter.MODE) : this.workingModeOptions[0]
      },
    },
+    library: {
+      handler: function () {
+        if (!this.parameterTable) return
+        this.workingModeOptions = this.parameterTable.MODE_OPTIONS
+        this.workingModeSelect = (this.parameter.MODE !== undefined) ? this.workingModeOptions.find(ele => ele.id === this.parameter.MODE) : this.workingModeOptions[0]
+      },
+    },
  },
  destroyed () {
  },
@@ -0,0 +1,152 @@
+<template>
+  <div class="flex sm12 xl12 md12 xs12 mb-2 pb-1 align--center">
+    <div class="row">
+      <div class="flex sm12 xl5 md5 xs12 my-1 py-0">
+        <p class="display-6"> CHANNEL {{ Number(channel) + 1 }} <p/>
+      </div>
+      <div class="flex sm12 xl3 md3 xs12 px-0 mx-0 my-0 py-0">
+        <va-input
+          class="mb-0 small-va-input"
+          v-model="inputStringText"
+          :disabled="!channelToggle"
+          @keyup.enter="inputChange(inputString)"
+          @blur="inputChange(inputString)"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            mA
+          </p>
+        </va-input>
+      </div>
+      <div class="flex sm12 xl4 md4 xs12 px-0 mx-0 my-0 py-0">
+        <va-toggle class="mb-0" v-model="toggle" color="success" style="float: right;" flat small @click.native="switchToggle()"/>
+      </div>
+    </div>
+    <div class="sm11 xl12 md12 xs12 my-1 py-1">
+      <va-slider
+        pins
+        :min="outputReadabilityData(range.min)"
+        :max="outputReadabilityData(range.max)"
+        value-visible
+        :step="10"
+        :color="toggle === true ? 'primary' : 'gray'"
+        :disabled="!toggle"
+        v-model="inputSlider"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ChannelBlock',
+  components: {
+  },
+  computed: {
+    toggle: {
+      get () {
+        return Boolean(this.inputValue[this.toggleName])
+      },
+      set (val) {
+        this.channelToggle = val
+      },
+    },
+    inputStringText: {
+      get () {
+        return String(this.outputReadabilityData(this.inputValue[this.parameterName]))
+      },
+      set (val) {
+        this.inputString = val
+      },
+    },
+    inputSlider: {
+      get () {
+        return this.outputReadabilityData(this.inputValue[this.parameterName])
+      },
+      set (val) {
+        this.inputChange(val)
+      },
+    },
+  },
+  props: {
+    inputValue: {
+      type: Object,
+    },
+    channel: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    toggleName: {
+      type: String,
+      required: true,
+    },
+    range: {
+      type: Object,
+    },
+    defaultUnit: {
+      type: String,
+    },
+    unit: {
+      type: Object,
+    },
+    outputReadabilityData: {
+      type: Function,
+      default: (val) => val,
+    },
+    outputRawData: {
+      type: Function,
+      default: (val) => val,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputString: '',
+      channelToggle: false,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    inputChange (val) {
+      // if change from input field
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || val === '') {
+          return false
+        }
+        val = this.outputRawData(val)
+        if (parseFloat(val) < this.range.min) {
+          val = this.range.min
+        } else if (parseFloat(val) > this.range.max) {
+          val = this.range.max
+        }
+      } else if (typeof (val) === 'number') {
+        val = this.outputRawData(val)
+      }
+      this.$emit('parameterChange', this.parameterName, val, true)
+    },
+    switchToggle () {
+      this.$emit('parameterChange', this.toggleName, this.channelToggle)
+    },
+  },
+}
+</script>
+
+<style lang="scss">
+  .small-va-input {
+    .va-input {
+      &__container {
+        min-height: 1rem;
+      }
+
+      &__container__input {
+        margin-bottom: 0.001rem;
+        padding: 0.8rem 0.5rem;
+      }
+    }
+  }
+</style>
@@ -0,0 +1,149 @@
+<template>
+  <div class="flex sm12 xl12 md12 xs12 mb-2 pb-1 align--center">
+    <div class="row">
+      <div class="flex sm12 xl5 md5 xs12 my-1 py-0">
+        <p class="display-6 my-2"> Timer <p/>
+      </div>
+      <div class="flex sm12 xl3 md3 xs12 px-0 mx-0 my-2 py-0">
+        <va-input
+          class="mb-0 small-va-input"
+          v-model="inputStringText"
+          :disabled="!toggle"
+          @keyup.enter="inputChange(inputString)"
+          @blur="inputChange(inputString)"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            s
+          </p>
+        </va-input>
+      </div>
+      <div class="flex sm12 xl4 md4 xs12 px-0 mx-0 my-2 py-0">
+        <va-toggle class="mb-0" v-model="toggle" color="success" style="float: right;" flat small @click.native="switchToggle()"/>
+      </div>
+    </div>
+    <!-- <div class="sm11 xl12 md12 xs12 my-1 py-1">
+      <va-slider
+        pins
+        :min="outputReadabilityData(range.min)"
+        :max="outputReadabilityData(range.max)"
+        value-visible
+        :step="10"
+        :color="timerToggle === true ? 'primary' : 'gray'"
+        :disabled="!timerToggle"
+        v-model="inputSlider"
+      />
+    </div> -->
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TimerBlock',
+  components: {
+  },
+  computed: {
+    inputStringText: {
+      get () {
+        return String(this.outputReadabilityData(this.inputValue[this.parameterName]))
+      },
+      set (val) {
+        this.inputString = val
+      },
+    },
+    inputSlider: {
+      get () {
+        return this.outputReadabilityData(this.inputValue[this.parameterName])
+      },
+      set (val) {
+        this.inputChange(val)
+      },
+    },
+    toggle: {
+      get () {
+        return !(this.inputValue[this.parameterName] === 0)
+      },
+      set (val) {
+        this.timerToggle = val
+      },
+    },
+  },
+  props: {
+    inputValue: {
+      type: Object,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    range: {
+      type: Object,
+    },
+    defaultUnit: {
+      type: String,
+    },
+    unit: {
+      type: Object,
+    },
+    outputReadabilityData: {
+      type: Function,
+      default: (val) => val,
+    },
+    outputRawData: {
+      type: Function,
+      default: (val) => val,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputString: '',
+      timerToggle: false,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    inputChange (val) {
+      // if change from input field
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || val === '') {
+          return false
+        }
+        val = this.outputRawData(val)
+        if (parseFloat(val) < this.range.min) {
+          val = this.range.min
+        } else if (parseFloat(val) > this.range.max) {
+          val = this.range.max
+        }
+      } else if (typeof (val) === 'number') {
+        val = this.outputRawData(val)
+      }
+      this.$emit('parameterChange', this.parameterName, val, true)
+    },
+    switchToggle () {
+      if (this.timerToggle === true) {
+        this.$emit('parameterChange', this.parameterName, 1)
+      }
+      if (this.timerToggle === false) {
+        this.$emit('parameterChange', this.parameterName, 0)
+      }
+    },
+  },
+}
+</script>
+
+  <style lang="scss">
+    .small-va-input {
+      .va-input {
+        &__container {
+          min-height: 1rem;
+        }
+
+        &__container__input {
+          margin-bottom: 0.001rem;
+          padding: 0.8rem 0.5rem;
+        }
+      }
+    }
+  </style>
@@ -0,0 +1,108 @@
+<template>
+  <div>
+    <div v-if="parameter.MODE === 0">
+      <div v-for="channel in channelList" :key="channel">
+        <ChannelBlock
+          :channel="channel"
+          :inputValue="parameter"
+          :parameterName="channelBlockCurrent(channel)"
+          :toggleName="channelBlockToggle(channel)"
+          v-bind="parameterTable[channelBlockCurrent(channel)]"
+          @parameterChange="parameterChange"
+        ></ChannelBlock>
+      </div>
+      <div class="row px-0 mx-0">
+        <p class="my-2 mr-2 display-5"> ADVANCED SETTING </p>
+      <!-- <va-toggle class="mb-0" flat small color="success" v-model="openAdvanced"/> -->
+      </div>
+      <div>
+        <TimerBlock
+          :inputValue="parameter"
+          :parameterName="'TIME_DURATION'"
+          v-bind="parameterTable.TIME_DURATION"
+          @parameterChange="parameterChange"
+        ></TimerBlock>
+      </div>
+      <div>
+        <div v-for="triggerIndex in triggerList" :key="'trigger_' + triggerIndex">
+          <TriggerBlock
+            :triggerIndex="triggerIndex"
+            :inputValue="parameter"
+            :parameterName="triggerBlockType(triggerIndex)"
+            :toggleName="triggerBlockEnable(triggerIndex)"
+            v-bind="parameterTable[triggerBlockType()]"
+            @parameterChange="parameterChange"
+          ></TriggerBlock>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import ChannelBlock from './ChannelBlock.vue'
+import TriggerBlock from './TriggerBlock.vue'
+import TimerBlock from './TimerBlock.vue'
+export default {
+  name: 'Trigger',
+  components: {
+    ChannelBlock,
+    TriggerBlock,
+    TimerBlock,
+  },
+  computed: {
+  },
+  props: {
+    parameter: {
+      type: Object,
+      default: () => {},
+    },
+    parameterTable: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data () {
+    return {
+      channelList: [0, 1, 2, 3],
+      triggerList: [0, 1],
+      openAdvanced: Boolean(this.parameter.TRIG0_en || this.parameter.TRIG1_en),
+    }
+  },
+  methods: {
+    channelBlockToggle (channelIndex) {
+      let name = 'ACC_a_out'
+      if (channelIndex !== undefined) {
+        name += channelIndex
+      }
+      return name
+    },
+    channelBlockCurrent (channelIndex) {
+      let name = 'ACC_a_out'
+      if (channelIndex !== undefined) {
+        name += channelIndex
+      }
+      name += '_current'
+      return name
+    },
+    triggerBlockEnable (triggerIndex) {
+      let name = 'TRIG'
+      if (triggerIndex !== undefined) {
+        name += triggerIndex
+      }
+      name += '_en'
+      return name
+    },
+    triggerBlockType (triggerIndex) {
+      let name = 'TRIG'
+      if (triggerIndex !== undefined) {
+        name += triggerIndex
+      }
+      name += '_edge_type'
+      return name
+    },
+    parameterChange: function (name, value, debounce) {
+      this.$emit('parameterChange', name, value, debounce)
+    },
+  },
+}
+</script>
@@ -0,0 +1,101 @@
+<template>
+  <div class="row flex sm12 xl12 md12 xs12 ma-0 pa-0">
+    <div class="d-flex sm12 xl12 md12 xs12 my-0 py-0">
+      <div class="flex sm8 xl8 md8 xs8 my-1 py-0">
+        <p class="display-6 my-2"> TRIGGER IN {{ triggerIndex + 1 }} <p/>
+      </div>
+      <div class="flex sm4 xl4 md4 xs4 ma-0 pa-0 my-2">
+        <va-toggle class="mb-0" v-model="toggle" color="success" style="float: right;" flat small @click.native="switchToggle()"/>
+      </div>
+    </div>
+    <div class="flex sm12 xl12 md12 xs12 pa-0 ma-0">
+      <va-radio-button
+        v-for="(option, index) in optionTrigger"
+        :key="index"
+        style="float: left;"
+        v-model="selectTrigger"
+        :option="optionTrigger[index]"
+        :label="optionTrigger[index]"
+        :disabled="!toggle"
+        @click.native.stop="inputChange(index)"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TriggerBlock',
+  components: {
+  },
+  props: {
+    triggerIndex: {
+      type: Number,
+      required: true,
+    },
+    inputValue: {
+      type: Object,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    toggleName: {
+      type: String,
+      required: true,
+    },
+    range: {
+      type: Object,
+    },
+    defaultUnit: {
+      type: String,
+    },
+    unit: {
+      type: Object,
+    },
+    outputReadabilityData: {
+      type: Function,
+      default: (val) => val,
+    },
+    outputRawData: {
+      type: Function,
+      default: (val) => val,
+    },
+  },
+  computed: {
+    toggle: {
+      get () {
+        return Boolean(this.inputValue[this.toggleName])
+      },
+      set (val) {
+        this.triggerToggle = val
+      },
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      selectTrigger: 'RISING',
+      optionTrigger: [
+        'RISING',
+        'FALLING',
+        'BOTH',
+      ],
+      triggerToggle: false,
+    }
+  },
+  methods: {
+    inputChange (val) {
+      this.$emit('parameterChange', this.parameterName, val)
+    },
+    switchToggle () {
+      this.$emit('parameterChange', this.toggleName, this.triggerToggle)
+    },
+  },
+  mounted () {
+    this.selectTrigger = this.optionTrigger[this.inputValue[this.parameterName]]
+    this.triggerToggle = Boolean(this.inputValue[this.toggleName])
+  },
+}
+</script>
@@ -99,20 +99,20 @@ const EliteZM15 = {
    showName: 'Current range',
    componentType: 'input-button-toggle',
    options: [
-      { value: 0, label: '<4 μA' },
-      { value: 1, label: '2.5-100 μA' },
-      { value: 2, label: '85-2050 μA' },
+      { value: 0, label: '<4 uA' },
+      { value: 1, label: '2.5-100 uA' },
+      { value: 2, label: '85-2050 uA' },
      { value: 3, label: '1800 uA' },
      { value: 4, label: 'Auto' },
    ],
-    range: ['<4 μA', '2.5-100 μA', '85-2050 μA', '1800 uA', 'Auto'],
+    range: ['<4 uA', '2.5-100 uA', '85-2050 uA', '1800 uA', 'Auto'],
    defaultValue: 4,
    outputRawData: (val) => {
-      const currentRangeArr = ['<4 μA', '2.5-100 μA', '85-2050 μA', '1800 uA', 'Auto']
+      const currentRangeArr = ['<4 uA', '2.5-100 uA', '85-2050 uA', '1800 uA', 'Auto']
      return currentRangeArr.indexOf(val.toString())
    },
    outputReadabilityData: (idx) => {
-      const currentRangeArr = ['<4 μA', '2.5-100 μA', '85-2050 μA', '1800 uA', 'Auto']
+      const currentRangeArr = ['<4 uA', '2.5-100 uA', '85-2050 uA', '1800 uA', 'Auto']
      return currentRangeArr[parseInt(idx)]
    },
  },
@@ -393,10 +393,10 @@ const EliteZM15 = {
    componentType: 'input-range',
    range: Object.freeze({ min: 0, max: 1500000 }),
    defaultValue: 0,
-    defaultUnit: 'μA',
-    downloadUnit: 'mA',
+    defaultUnit: 'uA',
+    downloadUnit: 'uA',
    unit: {
-      μA: 1,
+      uA: 1,
      mA: 1e3,
    },
    outputRawData: (val) => {
@@ -520,7 +520,7 @@ const EliteZM15 = {
      return parseInt((parseFloat(val) - 25000) / 5) / scale
    },
  },
-  VOLT_VSCAN: {
+  CA_VOLT: {
    type: 'number',
    showName: 'Volt (v.s. ref)',
    componentType: 'input-range',
@@ -1,5 +1,5 @@
 export default {
-  name: 'Potentiostatic Electrochemical Impedance Spectroscopy',
+  name: 'Constant Frequency',
  parameter: ['CF_DC_BIAS', 'CF_AC_AMP', 'CF_FREQ', 'CF_PPD', 'CF_SCALE', 'CF_DELAY', 'CF_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 這個mode用到的參數
  showParameter: ['CF_DC_BIAS', 'CF_AC_AMP', 'CF_FREQ', 'CF_PPD', 'CF_SCALE', 'CF_DELAY', 'CF_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 有要秀給user看的參數
  headerParameter: () => ['CF_DC_BIAS', 'CF_AC_AMP', 'CF_FREQ', 'CF_PPD', 'CF_SCALE', 'CF_DELAY', 'CF_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 有要秀給user看的參數
@@ -111,9 +111,10 @@ export default {
    7: {
      name: 'Phase',
      unit: {
-        '°': 1,
+        millidegree: 1,
+        '°': 1e3,
      },
-      downloadUnit: null,
+      downloadUnit: 'millidegree',
      defaultUnit: '°',
    },
    8: {
@@ -134,6 +135,38 @@ export default {
      downloadUnit: null,
      defaultUnit: 'default',
    },
+    10: {
+      name: 'notify_one',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    11: {
+      name: 'notify_two',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    12: {
+      name: 'notify_three',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    13: {
+      name: 'debug_amp[mV]',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
  },
  charts: {
    default: [
@@ -1,5 +1,5 @@
 export default {
-  name: 'Potentiostatic Electrochemical Impedance Spectroscopy',
+  name: 'EIS',
  parameter: ['EIS_DC_BIAS', 'EIS_AC_AMP', 'EIS_FREQ', 'EIS_PPD', 'EIS_SCALE', 'EIS_DELAY', 'EIS_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 這個mode用到的參數
  showParameter: ['EIS_DC_BIAS', 'EIS_AC_AMP', 'EIS_FREQ', 'EIS_PPD', 'EIS_SCALE', 'EIS_DELAY', 'EIS_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 有要秀給user看的參數
  headerParameter: () => ['EIS_DC_BIAS', 'EIS_AC_AMP', 'EIS_FREQ', 'EIS_PPD', 'EIS_SCALE', 'EIS_DELAY', 'EIS_AVERAGE_NUM', 'GENERAL_HS_RTIA'], // 有要秀給user看的參數
@@ -111,9 +111,10 @@ export default {
    7: {
      name: 'Phase',
      unit: {
-        '°': 1,
+        millidegree: 1,
+        '°': 1e3,
      },
-      downloadUnit: null,
+      downloadUnit: 'millidegree',
      defaultUnit: '°',
    },
    8: {
@@ -134,6 +135,40 @@ export default {
      downloadUnit: null,
      defaultUnit: 'default',
    },
+    10: {
+      name: 'notify_one',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    11: {
+      name: 'notify_two',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    12: {
+      name: 'notify_three',
+      unit: {
+        default: 1,
+      },
+      downloadUnit: null,
+      defaultUnit: 'default',
+    },
+    13: {
+      name: 'debug_amp[mV]',
+      unit: {
+        uV: 1,
+        mV: 1e3,
+        V: 1e6,
+      },
+      defaultUnit: 'mV',
+      downloadUnit: 'mV',
+    },
  },
  charts: {
    default: [
@@ -158,7 +158,7 @@ const EliteEIS = {
    outputReadabilityData: (val, scale = 1) => {
      return Math.round(parseInt(val) / 2047 * 800) / scale
    },
-    defaultValue: 25,
+    defaultValue: 26,
    defaultUnit: 'mV',
    downloadUnit: 'mV',
    unit: {
@@ -249,7 +249,7 @@ const EliteEIS = {
      { value: 3, label: '8' },
    ],
    range: ['2', '4', '6', '8'],
-    defaultValue: 3,
+    defaultValue: 0,
    outputRawData: (val) => {
      const numArr = ['2', '4', '6', '8']
      return numArr.indexOf(val.toString())
@@ -289,7 +289,7 @@ const EliteEIS = {
    outputReadabilityData: (val, scale = 1) => {
      return Math.round(parseInt(val) / 2047 * 800) / scale
    },
-    defaultValue: 25,
+    defaultValue: 26,
    defaultUnit: 'mV',
    downloadUnit: 'mV',
    unit: {
@@ -555,10 +555,10 @@ const EliteEIS = {
      id: 4,
      description: 'RT',
    },
-    // {
-    //   id: 5,
-    //   description: 'Constant Frequency',
-    // },
+    {
+      id: 5,
+      description: 'Constant Frequency',
+    },
    {
      id: 6,
      description: 'Dev Tools',
@@ -0,0 +1,24 @@
+export default {
+  name: 'ACC',
+  parameter: ['TIME_DURATION', 'ACC_a_out0', 'ACC_a_out1', 'ACC_a_out2', 'ACC_a_out3', 'ACC_a_out0_current', 'ACC_a_out1_current', 'ACC_a_out2_current', 'ACC_a_out3_current', 'TRIG0_en', 'TRIG1_en', 'TRIG0_edge_type', 'TRIG1_edge_type'], // 這個mode用到的參數
+  showParameter: ['ACC_a_out0', 'ACC_a_out1', 'ACC_a_out2', 'ACC_a_out3', 'TRIG0_en', 'TRIG1_en', 'TIME_DURATION'], // 有要秀給user看的參數
+  headerParameter: () => [], // export header的參數
+  valScales: {
+    linear: {
+      func: (val) => {
+        return val
+      },
+    },
+    log: {
+      func: (val) => {
+        return Math.log10(Math.abs(val))
+      },
+    },
+  },
+  channels: {
+  },
+  charts: {
+    default: [
+    ],
+  },
+}
@@ -0,0 +1,242 @@
+import Idle from '../Common/Idle'
+import ACC from './ACC'
+
+const EliteTrigger = {
+  TIME_DURATION: {
+    type: 'number',
+    showName: 'Time duration',
+    componentType: 'input-range',
+    range: Object.freeze({ min: 0, max: 86400 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: 's',
+    downloadUnit: 's',
+    unit: {
+      ms: 1e-3,
+      s: 1,
+      m: 60,
+      h: 3600,
+    },
+    outputRawData: (val) => {
+      return parseInt(parseFloat(val))
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(parseFloat(val))
+    },
+  },
+  ACC_a_out0: {
+    type: 'number',
+    showName: 'Channel 1 Enable',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  ACC_a_out1: {
+    type: 'number',
+    showName: 'Channel 2 Enable',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  ACC_a_out2: {
+    type: 'number',
+    showName: 'Channel 3 Enable',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  ACC_a_out3: {
+    type: 'number',
+    showName: 'Channel 4 Enable',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  ACC_a_out0_current: {
+    type: 'number',
+    showName: 'Channel 1 Current',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 50000 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: 'mA',
+    downloadUnit: null,
+    unit: {
+      mA: 1,
+    },
+    outputRawData: (val) => {
+      return val * 250
+    },
+    outputReadabilityData: (val) => {
+      return val / 250
+    },
+  },
+  ACC_a_out1_current: {
+    type: 'number',
+    showName: 'Channel 2 Current',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 50000 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: 'mA',
+    downloadUnit: null,
+    unit: {
+      mA: 1,
+    },
+    outputRawData: (val) => {
+      return val * 250
+    },
+    outputReadabilityData: (val) => {
+      return val / 250
+    },
+  },
+  ACC_a_out2_current: {
+    type: 'number',
+    showName: 'Channel 3 Current',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 50000 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: 'mA',
+    downloadUnit: null,
+    unit: {
+      mA: 1,
+    },
+    outputRawData: (val) => {
+      return val * 250
+    },
+    outputReadabilityData: (val) => {
+      return val / 250
+    },
+  },
+  ACC_a_out3_current: {
+    type: 'number',
+    showName: 'Channel 4 Current',
+    componentType: 'channelBlock',
+    range: Object.freeze({ min: 0, max: 50000 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: 'mA',
+    downloadUnit: null,
+    unit: {
+      mA: 1,
+    },
+    outputRawData: (val) => {
+      return val * 250
+    },
+    outputReadabilityData: (val) => {
+      return val / 250
+    },
+  },
+  TRIG0_en: {
+    type: 'number',
+    showName: 'Trigger 0 Enable',
+    componentType: 'triggerBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  TRIG1_en: {
+    type: 'number',
+    showName: 'Trigger 1 Enable',
+    componentType: 'triggerBlock',
+    range: Object.freeze({ min: 0, max: 1 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  TRIG0_edge_type: {
+    type: 'number',
+    showName: 'Trigger 0 Type',
+    componentType: 'triggerBlock',
+    range: Object.freeze({ min: 0, max: 2 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  TRIG1_edge_type: {
+    type: 'number',
+    showName: 'Trigger 1 Type',
+    componentType: 'triggerBlock',
+    range: Object.freeze({ min: 0, max: 2 }), // UI上能輸入的最大最小值
+    defaultValue: 0,
+    defaultUnit: null,
+    downloadUnit: null,
+    unit: {},
+    outputRawData: (val) => {
+      return parseInt(val)
+    },
+    outputReadabilityData: (val) => {
+      return parseInt(val)
+    },
+  },
+  MODE_OPTIONS: [
+    {
+      id: 1,
+      description: 'Idle',
+    },
+    {
+      id: 0,
+      description: 'Analog Current Control (ACC)',
+    },
+  ],
+  MODE: {
+    0: ACC,
+    1: Idle,
+  },
+}
+
+export default EliteTrigger
@@ -1,5 +1,6 @@
 import EliteEDC from './EliteEDC/index'
 import EliteEIS from './EliteEIS/index'
+import EliteTrigger from './EliteTrigger/index'
 import store from '@/store/index'

 // object saving library name mapping table
@@ -15,7 +16,7 @@ const libraryNameMappingTable = {
  'Elite_EIS_1.0': EliteEIS,
  'Elite_EIS_1.1': EliteEIS,
  'Elite_EIS_MINI_1.0': EliteEIS,
-  'Elite_TRIG_0.1': null,
+  'Elite_TRIG_0.1': EliteTrigger,
  'Elite_MEGAFLY_0.1': null,
 }

@@ -32,19 +33,20 @@ const serialNumberMappingTable = {
    },
    3: {
      1: {
-        0: EliteEDC, // BAT1.0
+        0: EliteEDC, // BAT0.1
+        1: EliteEDC, // BAT1.0
      },
    },
    4: {
      1: {
        0: EliteEIS, // EIS1.0
        1: EliteEIS, // EIS1.1
-        2: EliteEIS, // EIS1.1mini
+        2: EliteEIS, // EIS mini1.0
      },
    },
    5: {
      1: {
-        0: null, // TRIG0.1
+        0: EliteTrigger, // TRIG0.1
      },
    },
    6: {
@@ -61,6 +63,7 @@ const serialNumberMappingTable = {
   * @returns {Object} : config
   */
 function getConfig (type) {
+  if (type === undefined || type === null) return
  if (typeof type === 'number') {
    const deviceList = store.getters.getField('taskContent').deviceListNew
    if (deviceList === undefined) return
@@ -50,6 +50,7 @@ const projectActs = {
    const response = await payload.api.project.create(project)
    // align project id with column id
    project.id = response.data.id
+    project.created_at = response.data.created_at

    state.projectConfigList.push(project)
  },
@@ -91,6 +92,7 @@ const projectActs = {
 */
  [typePath.delete]: async ({ state, getters, commit }, payload) => {
    const { project, index, api } = payload
+    if (project === undefined) return
    await api.project.update(project.id, { deleted: true })
    await api.project.del()
    state.projectList.splice(index, 1)
@@ -105,15 +107,20 @@ const projectActs = {
 */
  [typePath.copy]: async ({ state, getters, commit }, payload) => {
    const { project, api } = payload
+    if (project === undefined) return
    const copyProject = JSON.parse(JSON.stringify(project))

    copyProject.name += ' copy'
    copyProject.uuid = uuidv4()
    // create project need to remove
    delete copyProject.id
+    delete copyProject.created_at
+    delete copyProject.updated_at

    const response = await api.project.create(copyProject)
    copyProject.id = response.data.id
+    copyProject.created_at = response.data.created_at
+    copyProject.updated_at = response.data.updated_at
    state.projectList.push(copyProject)
  },

@@ -52,7 +52,7 @@ const taskActs = {
    const max = cycleInfo.cycle
    const useID = cycleInfo.useID
    const id = cycleInfo.id
-    const count = 1
+    const count = 0
    const cycleLength = selectProject.cycle.length + 1
    const name = 'Loop' + cycleLength

@@ -17,6 +17,8 @@ const projectGets = {
  },

  [typePath.getDevice]: (state, getters) => (deviceKey) => {
+    /** if project is undefined */
+    if (getters[typePath.getSelect] === undefined) return
    return getters[typePath.getSelect].device[deviceKey]
  },

@@ -1237,7 +1237,7 @@ function getLegendName (sourceList, formulaID, deviceList) {
          // eslint-disable-next-line no-case-declarations
          channelName = getConfigChannel(device.library_name, device.configuration.MODE, source.channel - 1)
          if (!channelName) break
-          legendName += 'E' + source.id + '-' + channelName.name[0]
+          legendName += 'E' + source.id + '-' + channelName.name.replace('_', '')
          break
        case 'EliteEIS':
          // eslint-disable-next-line no-case-declarations
@@ -1250,7 +1250,7 @@ function getLegendName (sourceList, formulaID, deviceList) {
            legendName += 'E' + source.id + '-' + channelName.name.split('_').join('')
            break
          }
-          legendName += 'E' + source.id + '-' + channelName.name[0]
+          legendName += 'E' + source.id + '-' + channelName.name.replace('_', '')
          break
        default:
          legendName += 'D' + source.id + 'CH' + source.channel
Author	SHA1	Message	Date
peterlu14	a3ccb942e5	- fix create task	2023-03-25 13:18:41 +08:00
peterlu14	eacc0d9547	- project sort with created time - new project created time reassign - copy project created time reassign - save project (create task, copy task, delete task)	2023-03-25 13:07:46 +08:00
peterlu14	9cc653b761	-auto save ( cycle, device)	2023-03-24 19:22:38 +08:00
peterlu14	0cfc02c939	- reset projecttableselectIndex - prevent select task null - fixed parameter is undefined - fix scheduler change mode reset problem - auto save	2023-03-24 19:07:42 +08:00
ROY	60252b5cfe	[update] update AC_AMP defaultValue of schedule	2023-03-21 16:21:51 +08:00
peterlu14	cc5207ae07	- fix legend name duplicate problem	2023-03-16 17:56:32 +08:00
peterlu14	4ad2b51161	- Elite EDC VOLT_VSCAN to CA_VOLT	2023-03-08 09:37:12 +08:00
ROY	0f32263d12	[update] update bat0.1 and new bat1.0	2023-03-07 18:03:59 +08:00
peterlu14	52db5b818c	[update] remove navbar info	2023-02-04 10:56:28 +08:00
peterlu14	507718e3a3	[update] remove trigger battery	2023-01-12 10:04:15 +08:00
peterlu14	1c02ffb934	[update] fix scheduler trigger parameter show & layout	2023-01-10 11:30:00 +08:00
peterlu14	5d594eff06	[update] fix trigger scheduler & todo fix mode select and parameter info	2023-01-09 18:21:50 +08:00
peterlu14	29f7d23d38	[debug] fix delete file working mode error	2023-01-04 15:21:40 +08:00
peterlu14	4d032858a3	[update] trigger add timer	2023-01-03 15:30:03 +08:00
peterlu14	417c4010a9	[update] fix advanced setting	2023-01-03 14:58:48 +08:00
peterlu14	6bf7edad0b	[update] recover trigger ui	2023-01-03 14:42:54 +08:00
peterlu14	fafc6620d2	[debug] fix CC Mode csv header wrong information	2022-12-27 11:04:40 +08:00
peterlu14	78d236d9c0	[update] fix scheduler parameter default problem	2022-12-27 11:03:52 +08:00
ROY	6e42dc9333	[update] add debug channel in file	2022-12-07 14:23:19 +08:00
peterlu14	d4d6172645	Merge branch 'dev/scheduler_UI' into dev/test_ac_amp	2022-12-06 16:07:17 +08:00
peterlu14	8685768f42	[update] fix impendance scale & millidegree	2022-12-06 15:58:06 +08:00
peterlu14	8ca0e3fa28	Merge branch 'dev/scheduler_UI' into dev/test_ac_amp	2022-12-06 14:22:32 +08:00
peterlu14	7e61eb6e52	[update] fix phase degree scale error	2022-12-06 14:22:12 +08:00
peterlu14	d16d7b0cb5	Merge branch 'dev/scheduler_UI' into dev/test_ac_amp	2022-12-05 11:57:19 +08:00
peterlu14	c960a8228c	[update] fix phase degree scale error	2022-12-05 11:56:39 +08:00
ROY	d4423503d6	Merge remote-tracking branch 'origin/dev/scheduler_UI' into dev/test_ac_amp	2022-12-02 17:45:35 +08:00
peterlu14	6c8583e139	[update] fix CF mode name & name PEIS into EIS	2022-12-02 17:40:54 +08:00
peterlu14	f3817694cf	[update] scheduler count start from 0	2022-12-02 17:30:13 +08:00
peterlu14	73eced5f52	[update] EIS_AVERAGE_NUM default 3 -> 0	2022-12-02 17:29:54 +08:00
peterlu14	5453928bc1	[update] remove project table cell for cycle	2022-12-02 17:29:29 +08:00
peterlu14	814cfa8b86	[update] fix delete project step	2022-12-02 17:28:56 +08:00
ROY	c3f6349c6e	[test] print notify_one & notify_two & notify_three	2022-12-01 14:15:12 +08:00
peterlu14	0dc8cc4344	[update] support cancel delete project click anywhere	2022-11-28 10:09:41 +08:00
peterlu14	9358ad7ffa	[update] input auto focus & double check delete	2022-11-25 13:27:58 +08:00
peterlu14	95203486e2	[update] add showProjectManagerPanel button	2022-11-25 13:26:07 +08:00
peterlu14	164a658870	[update] fix project copy parameter show error	2022-11-24 18:01:01 +08:00
peterlu14	d4c71fd4f9	[update] update package v-tooltips	2022-11-24 11:21:42 +08:00
peterlu14	4b60975782	[update] show available parameters	2022-11-24 11:19:55 +08:00
peterlu14	d1b8683387	[update] add v-popover to parameter	2022-11-24 11:18:56 +08:00
peterlu14	fd4a677173	[update] fix draggable problem by combine device table row together	2022-11-24 10:13:09 +08:00
peterlu14	6f4d96fb17	[update] project manager filter & table header	2022-11-21 17:44:33 +08:00
peterlu14	3ad822bde1	[update] open cf mode	2022-11-21 16:48:29 +08:00
peterlu14	2b2dd50f41	[update] modify project menu device and table font & fix draggable bug	2022-11-21 16:45:44 +08:00
peterlu14	ca57978763	[update] device not pair coor change & draggable cannot drag while input & table header & cell font-size change	2022-11-21 15:40:35 +08:00
peterlu14	6c41341392	[update] fix getConfigTable & getDevice null error	2022-11-21 11:50:30 +08:00
peterlu14	4a5f07da18	[update] fix project parameter refs init problem	2022-11-21 11:49:12 +08:00
peterlu14	17492ccc98	[update] Vue use v-tooltip	2022-11-18 16:57:11 +08:00
peterlu14	e5603cd80e	[update] minor modify to project typography	2022-11-18 15:49:07 +08:00
peterlu14	99898dc862	[update] thead sticky top	2022-11-18 15:44:45 +08:00
peterlu14	66bdf13955	[update] display menu in flexbox layout	2022-11-18 14:22:05 +08:00
peterlu14	89ffad6fbe	[update] fix img src, project manager ui change	2022-11-18 13:25:59 +08:00
peterlu14	079ba2023d	[update] img resource	2022-11-18 13:21:57 +08:00
peterlu14	9158697bdc	[update] device text change place	2022-11-17 16:05:35 +08:00
peterlu14	0b20104133	[update] hover show parameter & add task bottom & table font alter	2022-11-17 16:05:16 +08:00
				`@@ -0,0 +1 @@`
				`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path fill="#FFFFFF" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"/></svg>`