[update] start button replace record button

[update] scale in time splice data fixed
[update] ms -> us & M-Axis & download fix & series data splice changed
2021-02-19 14:41:16 +08:00 · 2021-02-19 14:31:18 +08:00 · 2021-02-19 14:21:00 +08:00 · 2021-02-05 13:31:28 +08:00 · 2021-01-18 15:05:04 +08:00 · 2021-01-18 15:04:03 +08:00
82 changed files with 5747 additions and 3457 deletions
@@ -6178,11 +6178,11 @@
      }
    },
    "echarts": {
-      "version": "4.8.0",
-      "resolved": "https://registry.npmjs.org/echarts/-/echarts-4.8.0.tgz",
-      "integrity": "sha512-YwShpug8fWngj/RlgxDaYrLBoD+LsZUArrusjNPHpAF+is+gGe38xx4W848AwWMGoi745t3OXM52JedNrv+F6g==",
+      "version": "4.9.0",
+      "resolved": "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz",
+      "integrity": "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA==",
      "requires": {
-        "zrender": "4.3.1"
+        "zrender": "4.3.2"
      }
    },
    "editorconfig": {
@@ -17049,6 +17049,11 @@
      "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.11.tgz",
      "integrity": "sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ=="
    },
+    "vue-axios": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/vue-axios/-/vue-axios-3.2.0.tgz",
+      "integrity": "sha512-nBS3uVLT50Qfv7Gmhu0VDkYzTJeDWVc8TOTd4UzG/XS865+As4Updyuo4zWVqQ5ygC7JUBRkgc5merS7PpHMlw=="
+    },
    "vue-bulma-expanding": {
      "version": "0.0.1",
      "resolved": "https://registry.npmjs.org/vue-bulma-expanding/-/vue-bulma-expanding-0.0.1.tgz",
@@ -18440,9 +18445,9 @@
      }
    },
    "zrender": {
-      "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.1.tgz",
-      "integrity": "sha512-CeH2TpJeCdG0TAGYoPSAcFX2ogdug1K7LIn9UO/q9HWqQ54gWhrMAlDP9AwWYMUDhrPe4VeazQ4DW3msD96nUQ=="
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.2.tgz",
+      "integrity": "sha512-bIusJLS8c4DkIcdiK+s13HiQ/zjQQVgpNohtd8d94Y2DnJqgM1yjh/jpDb8DoL6hd7r8Awagw8e3qK/oLaWr3g=="
    }
  }
 }
@@ -23,7 +23,7 @@
    "chart.js": "^2.9.3",
    "core-js": "3",
    "detect-browser": "^4.8.0",
-    "echarts": "^4.8.0",
+    "echarts": "^4.9.0",
    "element-resize-detector": "^1.1.15",
    "epic-spinners": "^1.1.0",
    "extend": "3.0.2",
@@ -41,6 +41,7 @@
    "v-tooltip": "^2.0.2",
    "vee-validate": "^2.2.13",
    "vue": "^2.6.10",
+    "vue-axios": "^3.2.0",
    "vue-bulma-expanding": "0.0.1",
    "vue-chartjs": "^3.4.0",
    "vue-clipboard2": "^0.3.1",
@@ -8,7 +8,7 @@
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">

-    <title>Vuestic Admin</title>
+    <title>BioPro Scientific</title>
  </head>
  <body>
    <div id="app"></div>
@@ -20,6 +20,7 @@ import 'echarts/lib/component/tooltip'
 import 'echarts/lib/component/legend'
 import 'echarts/lib/component/axisPointer'
 import 'echarts/lib/component/grid'
+import 'echarts/lib/component/markArea'

 import VueMqtt from 'vue-mqtt'
 import global_ from '../data/global/global'
@@ -60,7 +60,7 @@ export default {
  data () {
    return {
      isTopBar: false,
-      minimized: false,
+      minimized: true,
      mobileWidth: 767,
    }
  },
@@ -87,7 +87,7 @@ export default {
    },
  },
  mounted () {
-
+    this.minimized = true
  },
 }
 </script>
@@ -25,7 +25,7 @@
        >
          <!-- *** icon -->
          <!-- <va-icon-vuestic /> -->
-          <img v-bind:src="'https://www.bioproweb.com/wp-content/uploads/2020/01/BPS-LOGO_60.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'"> -->
@@ -96,7 +96,7 @@ export default {
      theme: 'info',
      items: navigationRoutes.routes,
      hoverState: false,
-      minimized: false,
+      minimized: true,
    }
  },
 }
@@ -19,8 +19,8 @@ export const navigationRoutes = {
      },
    },
    {
-      name: 'project-content',
-      displayName: 'Project',
+      name: 'task-content',
+      displayName: 'Task',
      meta: {
        iconClass: 'vuestic-iconset vuestic-iconset-statistics',
      },
@@ -1,57 +0,0 @@
-<template>
-  <div class="devices-overview">
-
-    <div >
-      <replay-chart-detail :cardheight="'82vh'"/>
-      <!-- <va-card class="area-style">
-        <template slot="header">
-          <va-icon name="fa fa-hdd-o mr-3" color="primary"/>
-        </template>
-        <replay-chart-detail />
-      </va-card> -->
-    </div>
-  </div>
-
-</template>
-
-<script>
-import ReplayChartDetail from './ReplayChartDetail.vue'
-
-export default {
-  name: 'data-replay',
-  components: {
-    ReplayChartDetail,
-  },
-  created () {
-  },
-  data () {
-    return {
-    }
-  },
-  mqtt: {
-  },
-  methods: {
-  },
-  watch: {
-  },
-  async mounted () {
-  },
-  destroyed () {
-  },
-
-}
-</script>
-
-<style lang="scss">
-  .area-style {
-    height: auto;
-    overflow-y: hidden;
-    overflow-x: hidden;
-
-    @include media-breakpoint-only(xl) {
-      height: 88vh;
-      overflow-y: scroll;
-      overflow-x: hidden;
-    }
-  }
-</style>
@@ -0,0 +1,439 @@
+<template>
+  <div class="devices-overview">
+
+    <div >
+      <neulive-replay-chart :ref="'chart_overview'" class="mb-2" :key="overviewChartKey" :cardheight="'5vh'" :data="chartOverviewData"/>
+      <neulive-replay-chart :ref="'chart_detail'" @dblclick.native="distribute()"  :cardheight="'71vh'" :data="chartDetailData" @dataZoomEvent="dataZoomEvent($event)"/>
+    </div>
+  </div>
+
+</template>
+
+<script>
+import { mapActions, mapGetters, mapMutations } from 'vuex'
+import NeuliveReplayChart from './NeuliveReplayChart.vue'
+import api from '@/data/api/index'
+import { download } from '@/data/download/Download'
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+export default {
+  name: 'neulive-data-replay',
+  components: {
+    NeuliveReplayChart,
+  },
+  props: {
+  },
+  async created () {
+    this.chartOverviewData = await this.initChart({
+      chartAllData: this.chartData,
+      chartID: 0,
+      gridLength: 1,
+    })
+    this.chartDetailData = await this.initChart({
+      chartAllData: this.chartData,
+      chartID: 1,
+      gridLength: 1,
+    })
+  },
+  data () {
+    return {
+      metaList: null,
+      dataInfo: {},
+      overviewChartKey: 0,
+      chartData: {},
+      chartOverviewData: {},
+      chartDetailData: {},
+      maxTime: 0,
+      startTimeCurrent: 0,
+      endTimeCurrent: 0,
+      startTime: 0,
+      endTime: 0,
+      zoomTime: 0,
+      maxScaleDefault: '1000',
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    showChartLoading: function (chart) {
+      const loadStyle = {
+        text: '',
+        color: '#cccccc',
+        maskColor: 'rgba(255, 255, 255, 0.8)',
+        zlevel: 0,
+      }
+      switch (chart) {
+        case 'overview':
+          this.$refs.chart_overview.$children[0].$children[0].showLoading(loadStyle)
+          break
+        case 'detail':
+          this.$refs.chart_detail.$children[0].$children[0].showLoading(loadStyle)
+          break
+        default:
+          this.$refs.chart_overview.$children[0].$children[0].showLoading(loadStyle)
+          this.$refs.chart_detail.$children[0].$children[0].showLoading(loadStyle)
+          break
+      }
+    },
+    hideChartLoading: function () {
+      this.$refs.chart_overview.$children[0].$children[0].hideLoading()
+      this.$refs.chart_detail.$children[0].$children[0].hideLoading()
+    },
+    getData: async function (scale, id, channel, meta) {
+      if (scale === 1) {
+        return await download.rawByIDChannels(id, channel, meta)
+      } else {
+        return await download.miniMeanByIDChannel(id, channel, meta)
+      }
+    },
+    register: async function () {
+      let chNumber = 0
+      this.metaList.forEach(meta => {
+        chNumber += JSON.parse(meta.channels).length
+      })
+      this.updateGridListChart({
+        chartAllData: this.chartData,
+        chartID: this.chartDetailData.chartID,
+        gridLength: chNumber,
+      })
+      let _chNumber = 0
+      const register = this.metaList.map(meta => {
+        // if (meta.device.library_name.indexOf('Neulive') >= 0) {
+        this.metaList.map(meta => {
+          JSON.parse(meta.channels).map(ch => {
+            this.registerChart({
+              chartAllData: this.chartData,
+              chartID: this.chartDetailData.chartID,
+              gridIndex: _chNumber,
+              deviceNameX: 'Time',
+              deviceNameY: 'Neulive',
+              deviceIDY: meta.name,
+              channelY: ch,
+            })
+            this.registerChart({
+              chartAllData: this.chartData,
+              chartID: this.chartOverviewData.chartID,
+              gridIndex: 0,
+              deviceNameX: 'Time',
+              deviceNameY: 'Neulive',
+              deviceIDY: meta.name,
+              channelY: ch,
+            })
+            _chNumber++
+          })
+        })
+        if (this.maxTime < meta.time_duration) {
+          this.maxTime = meta.time_duration
+          this.endTime = this.endTimeCurrent = this.maxTime
+        }
+        // }
+      })
+      await Promise.all(register)
+      this.chartDetailData.series.forEach((series, index) => {
+        this.chartDetailData.xAxis[series.xAxisIndex].min = 0
+        this.chartDetailData.xAxis[series.xAxisIndex].max = this.maxTime
+      })
+      this.chartOverviewData.series.forEach((series, index) => {
+        this.chartOverviewData.xAxis[series.xAxisIndex].min = 0
+        this.chartOverviewData.xAxis[series.xAxisIndex].max = this.maxTime
+      })
+      this.chartDetailData.xAxis[this.chartDetailData.xAxis.length - 1].axisLabel.show = true
+      this.chartOverviewData.dataZoom = null
+    },
+    dataZoomEvent: function (e) {
+      // console.log(e)
+      if (e.batch != null) {
+        // console.log(e.batch)
+        e.batch.forEach(dataZoom => {
+          const id = parseInt(dataZoom.dataZoomId.substr(dataZoom.dataZoomId.length - 3, dataZoom.dataZoomId.length - 1))
+          if (id === 1) {
+            this.startTime = this.maxTime * dataZoom.start / 100
+            this.endTime = this.maxTime * dataZoom.end / 100
+            // console.log(this.startTime, this.endTime)
+          }
+        })
+      } else {
+        const id = parseInt(e.dataZoomId.substr(e.dataZoomId.length - 3, e.dataZoomId.length - 1))
+        if (id === 0) {
+          this.startTime = this.maxTime * e.start / 100
+          this.endTime = this.maxTime * e.end / 100
+          // console.log(this.startTime, this.endTime)
+        }
+      }
+      this.chartOverviewData.series.forEach((series, index) => {
+        if (series.markArea != null) {
+          series.markArea.data[0][0].xAxis = this.startTime
+          series.markArea.data[0][1].xAxis = this.endTime
+        } else {
+          const _markArea = {
+            // silent: true,
+            itemStyle: {
+              color: '#ccc',
+              opacity: 0.1,
+            },
+            data: [
+              [{
+                xAxis: parseInt(this.startTime),
+              }, {
+                xAxis: parseInt(this.endTime),
+              }],
+            ],
+          }
+          series.markArea = _markArea
+        }
+      })
+      this.overviewChartKey++
+      this.zoomTime = 0
+    },
+    drawData: async function () {
+      this.showChartLoading('detail')
+      // get current scale
+      const timeZone = this.endTimeCurrent - this.startTimeCurrent
+      let maxScale = '-1'
+      for (const meta in this.dataInfo) {
+        for (const ch in this.dataInfo[meta]) {
+          const scaleList = this.dataInfo[meta][ch]
+          let getMetaScale = false
+          for (const scale in scaleList) {
+            const dataList = this.dataInfo[meta][ch][scale]
+            for (let i = 0; i < dataList.length; i++) {
+              const _timeZone = dataList[i].end_time - dataList[i].start_time
+              if (timeZone <= _timeZone) {
+                this.metaList.forEach((_meta, _index) => {
+                  if (parseInt(_meta.id) === parseInt(meta)) {
+                    this.updateByIndexMeta({ index: _index, scaleCurrent: scale })
+                    if (parseInt(scale) > parseInt(maxScale)) {
+                      maxScale = scale
+                    }
+                  }
+                })
+                getMetaScale = true
+              }
+            }
+            if (getMetaScale) {
+              break
+            }
+          }
+        }
+      }
+      if (parseInt(maxScale) < 0) {
+        maxScale = this.maxScaleDefault
+      }
+      this.metaList.forEach(_meta => {
+        if (_meta.scaleCurrent == null) {
+          _meta.scaleCurrent = maxScale
+        }
+      })
+
+      for (const meta in this.dataInfo) {
+        let scale
+        let metaName
+        let metaInfo
+        this.metaList.forEach(_meta => {
+          if (parseInt(_meta.id) === parseInt(meta)) {
+            metaInfo = _meta
+            metaName = _meta.name
+            scale = _meta.scaleCurrent
+          }
+        })
+
+        const getAllData = async function (_this) {
+          for (const ch in _this.dataInfo[meta]) {
+            const dataList = _this.dataInfo[meta][ch][scale]
+            for (let i = 0; i < dataList.length; i++) {
+              if ((_this.startTimeCurrent >= dataList[i].start_time && _this.startTimeCurrent <= dataList[i].end_time) || (_this.endTimeCurrent >= dataList[i].start_time && _this.endTimeCurrent <= dataList[i].end_time)) {
+                if (dataList[i].data.length === 0) {
+                  _this.intoDataRec({
+                    index: i,
+                    metaID: meta,
+                    channel: ch,
+                    scale: scale,
+                    data: await _this.getData(parseInt(scale), dataList[i].id, ch, metaInfo),
+                  })
+                }
+              }
+            }
+          }
+        }
+
+        await getAllData(this)
+
+        for (const ch in this.dataInfo[meta]) {
+          const dataList = this.dataInfo[meta][ch][scale]
+          for (let i = 0; i < dataList.length; i++) {
+            if ((this.startTimeCurrent >= dataList[i].start_time && this.startTimeCurrent <= dataList[i].end_time) ||
+                (this.endTimeCurrent >= dataList[i].start_time && this.endTimeCurrent <= dataList[i].end_time)) {
+              const data = dataList[i].data
+
+              this.chartOverviewData.series.forEach((series, index) => {
+                if (series.data.length === 0) {
+                  if (series.yAxisSource[0] === metaName && series.yAxisSource[1] === parseInt(ch)) {
+                    let deStartIndex = 0
+                    let deEndIndex = 0
+                    series.data.forEach((_data, index) => {
+                      if (_data[0] >= data[0][0] && deStartIndex === 0) {
+                        deStartIndex = index
+                      } else if (_data[0] > data[data.length - 1][0] && deEndIndex === 0) {
+                        deEndIndex = index
+                      }
+                    })
+                    if (deEndIndex === 0) {
+                      deEndIndex = series.data.length
+                    }
+                    const getNewDataList = function (deStartIndex, deEndIndex, dataList, data) {
+                      dataList.splice(deStartIndex, deEndIndex - deStartIndex, ...data)
+                      dataList.sort(function (a, b) {
+                        return a[0] - b[0]
+                      })
+                      return data
+                    }
+                    // getNewDataList(series.data)
+                    this.$refs.chart_overview.$children[0].$children[0].appendData({
+                      seriesIndex: index,
+                      data: getNewDataList(deStartIndex, deEndIndex, series.data, data),
+                    })
+                  }
+                  const _markArea = {
+                    // silent: true,
+                    itemStyle: {
+                      color: '#ccc',
+                      opacity: 0.1,
+                    },
+                    data: [
+                      [{
+                        xAxis: parseInt(this.startTime),
+                      }, {
+                        xAxis: parseInt(this.endTime),
+                      }],
+                    ],
+                  }
+                  series.markArea = _markArea
+                  // console.log(series.data)
+                }
+              })
+              // console.log(this.chartOverviewData)
+              this.chartDetailData.series.forEach((series, index) => {
+                if (series.yAxisSource[0] === metaName && series.yAxisSource[1] === parseInt(ch)) {
+                  let deStartIndex = 0
+                  let deEndIndex = 0
+                  series.data.forEach((_data, index) => {
+                    if (_data[0] >= data[0][0] && deStartIndex === 0) {
+                      deStartIndex = index
+                    } else if (_data[0] > data[data.length - 1][0] && deEndIndex === 0) {
+                      deEndIndex = index
+                    }
+                  })
+                  if (deEndIndex === 0) {
+                    deEndIndex = series.data.length
+                  }
+                  const getNewDataList = function (deStartIndex, deEndIndex, dataList, data) {
+                    dataList.splice(deStartIndex, deEndIndex - deStartIndex, ...data)
+                    dataList.sort(function (a, b) {
+                      return a[0] - b[0]
+                    })
+                    return data
+                  }
+                  this.$refs.chart_detail.$children[0].$children[0].appendData({
+                    seriesIndex: index,
+                    data: getNewDataList(deStartIndex, deEndIndex, series.data, data),
+                  })
+                  // console.log(series.data)
+                }
+              })
+            }
+          }
+        }
+      }
+      this.hideChartLoading()
+    },
+    checkDataZoom: function () {
+      this.zoomTime++
+      if (this.zoomTime >= 2) {
+        if (this.startTimeCurrent !== this.startTime || this.endTimeCurrent !== this.endTime) {
+          this.startTimeCurrent = this.startTime
+          this.endTimeCurrent = this.endTime
+          this.drawData()
+        }
+      }
+    },
+    distribute: function () {
+      if (this.chartDetailData.grid.length === 1) {
+        this.chartDetailData.xAxis[0].axisLabel.show = false
+        this.updateGridListChart({
+          chartAllData: this.chartData,
+          chartID: this.chartDetailData.chartID,
+          gridLength: this.chartDetailData.series.length,
+        })
+        this.chartDetailData.series.forEach((series, index) => {
+          series.xAxisIndex = index
+          series.yAxisIndex = index
+        })
+        this.chartDetailData.xAxis[this.chartDetailData.xAxis.length - 1].axisLabel.show = true
+      } else {
+        this.updateGridListChart({
+          chartAllData: this.chartData,
+          chartID: this.chartDetailData.chartID,
+          gridLength: 1,
+        })
+        this.chartDetailData.series.forEach(series => {
+          series.xAxisIndex = 0
+          series.yAxisIndex = 0
+        })
+        this.chartDetailData.xAxis[0].axisLabel.show = true
+      }
+    },
+
+    ...mapActions('neuliveReplay', [types.chart.init, types.chart.register, types.chart.clear, types.chart.updateGridList]),
+
+    ...mapActions('neuliveReplay', [types.meta.init]),
+    ...mapMutations('neuliveReplay', [types.meta.updateByIndex]),
+    ...mapGetters('neuliveReplay', [types.meta.getAll]),
+    ...mapActions('neuliveReplay', [types.rec.init, types.rec.intoData]),
+    ...mapGetters('neuliveReplay', [types.rec.getAll]),
+  },
+  watch: {
+  },
+  async mounted () {
+    // console.log(types)
+    this.showChartLoading()
+    const metaIDList = this.$route.params.metaList.split('-')
+    await this.initMeta({ metaIDList: metaIDList, api: api })
+    this.metaList = this.getAllMeta()
+    console.log(this.metaList)
+    await this.initRec({ api: api })
+    this.dataInfo = this.getAllRec()
+    await this.register()
+    this.drawData()
+    this.dataZoomTimer = setInterval(this.checkDataZoom, 1000)
+  },
+  beforeDestroy () {
+    this.$refs.chart_overview.$children[0].$children[0].clear()
+    this.$refs.chart_detail.$children[0].$children[0].clear()
+    for (const id in this.chartData) {
+      for (const _series of this.chartData[id].series) {
+        _series.length = 0
+      }
+      delete this.chartData[id]
+    }
+    this.clearChart({ chartAllData: this.chartData })
+  },
+  destroyed () {
+    clearInterval(this.dataZoomTimer)
+  },
+
+}
+</script>
+
+<style lang="scss">
+  .area-style {
+    height: auto;
+    overflow-y: hidden;
+    overflow-x: hidden;
+
+    @include media-breakpoint-only(xl) {
+      height: 88vh;
+      overflow-y: scroll;
+      overflow-x: hidden;
+    }
+  }
+</style>
@@ -5,16 +5,16 @@
        <!-- <va-icon name="fa fa-area-chart mr-3" color="primary"/> -->
      </template>

-      <chart :ref="'chart_ref'" :style="'width: '+ cardwidth + '; height: ' + cardheight + ';'" :options="data" :auto-resize="true"></chart>
+      <chart :ref="'chart_ref'" :style="'width: '+ cardwidth + '; height: ' + cardheight + ';'" :options="data" @dataZoom="updateZoom" :auto-resize="true"></chart>
    </va-card>
  </div>
 </template>

 <script>
-// import { chartData } from '../../../../data/project/ChartsManagement'
+// import { chartData } from '../../../../data/task/ChartsManagement'

 export default {
-  name: 'replay-chart-detail',
+  name: 'neulive-replay-chart',
  components: {
  },
  props: {
@@ -50,10 +50,20 @@ export default {
  watch: {
  },
  methods: {
+    resize: function () {
+      if (this.$refs.chart_ref != null) {
+        this.$refs.chart_ref.resize()
+      }
+    },
+    updateZoom: function (e) {
+      this.$emit('dataZoomEvent', e)
+    },
  },
  async mounted () {
+    this.resizeTimer = setInterval(this.resize, 1000)
  },
  destroyed () {
+    clearInterval(this.resizeTimer)
  },
 }

@@ -133,8 +133,9 @@
 </template>

 <script>
-import { projectInfo } from '../../data/project/ProjectInfo'
+import { taskInfo } from '../../data/task/TaskInfo'
 import { FulfillingBouncingCircleSpinner } from 'epic-spinners'
+import api from '../../data/api/index'

 export default {
  name: 'devices-overview',
@@ -185,7 +186,7 @@ export default {
            library_name: device.library_name,
            library_version: device.library_version,
            status: device.status,
-            pic: projectInfo.getDevicePic(device.device_name),
+            pic: taskInfo.getDevicePic(device.device_name),
            loading: false,
          }
          this.controllerList.forEach(controller => {
@@ -208,7 +209,9 @@ export default {
      const rawDevices = JSON.parse(String.fromCharCode.apply(null, data)).data
      this.controllerList.forEach(controller => {
        if (controller.id === topicSplit[0]) {
-          controller.mac = rawDevices.device_mac.toUpperCase()
+          if (rawDevices.device_mac !== null) {
+            controller.mac = rawDevices.device_mac.toUpperCase()
+          }
        }
      })
      // console.log(this.controllerList)
@@ -262,17 +265,21 @@ export default {
            header: 'hardware_device/0',
          }))
          this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
-            header: 'device_parent/0',
+            header: 'device_update_calibration/0',
            device: parseInt(mes[1]),
-            content: {
-              folder: [0, 1, 3],
-            },
-          }))
-          this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
-            header: 'device_recording_file_name/0',
-            device: parseInt(mes[1]),
-            content: 'qwertyuio',
          }))
+          // this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
+          //   header: 'device_parent/0',
+          //   device: parseInt(mes[1]),
+          //   content: {
+          //     folder: [0, 1, 3],
+          //   },
+          // }))
+          // this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
+          //   header: 'device_recording_file_name/0',
+          //   device: parseInt(mes[1]),
+          //   content: 'qwertyuio',
+          // }))
          break
        case 'shutdown':
          this.controllerList.forEach(controller => {
@@ -322,7 +329,7 @@ export default {
    getControllerList: async function () {
      const update = async () => {
        this.controllerList.push({
-          id: 'tommy_test',
+          id: 'BPS_FF',
          mac: '',
          status: 'loading',
          isScan: true,
@@ -366,6 +373,7 @@ export default {
        this.mqttPub(controller.id + '_user', JSON.stringify({
          header: 'hardware_info/0',
        }))
+        this.createInitialCollection('admin')
      })
    },
    pageToast: function (mes) {
@@ -433,6 +441,29 @@ export default {
        }
      }
    },
+    createInitialCollection: async function (user) {
+      const root = await api.getCollectionsByParentName('folder', 0, 'root')
+      if (root.data.length === 0) {
+        await api.createCollection({
+          name: 'root',
+          type: 'folder',
+          parent: { folder: [0] },
+          size: 0,
+        })
+      }
+
+      // init check and create collection
+      const _root = await api.getCollectionsByName('root')
+      const USER = await api.getCollectionsByName(user)
+      if (USER.data.length === 0) {
+        api.createCollection({
+          name: user,
+          parent: { folder: [_root.data[0].id] },
+          type: 'folder',
+          size: 0,
+        })
+      }
+    },
  },
  watch: {
  },
@@ -135,10 +135,9 @@

 <script>
 import { file } from '../../data/file/File'
-import { downloadTaskManager } from '../../data/download/Download'
+import { download } from '../../data/download/Download'
 import { exportData } from '../../data/export/export'
 import { FulfillingBouncingCircleSpinner } from 'epic-spinners'
-import api from '../../data/api/index'

 export default {
  name: 'Download',
@@ -197,33 +196,33 @@ export default {
      return this.loadingPercent + '%'
    },
  },
-  mqtt: {
-    async '+/file_segment/+' (data, topic) {
-      console.log('file_segment')
-      console.log(String.fromCharCode.apply(null, data))
-      // console.log(navigator.connection.downlink)
-      // console.log(this.fileNum)
-      // console.log(this.downloadOptionsList.length)
-      // console.log(JSON.parse(String.fromCharCode.apply(null, data)).data.file_size)
+  // mqtt: {
+  //   async '+/file_segment/+' (data, topic) {
+  //     console.log('file_segment')
+  //     console.log(String.fromCharCode.apply(null, data))
+  //     // console.log(navigator.connection.downlink)
+  //     // console.log(this.fileNum)
+  //     // console.log(this.downloadOptionsList.length)
+  //     // console.log(JSON.parse(String.fromCharCode.apply(null, data)).data.file_size)

-      if (this.downloadOptionsList.length > 0) {
-        await downloadTaskManager.updateFileSegmentInfo(String.fromCharCode.apply(null, data))
-        this.fileSegmentMax = downloadTaskManager.getFileSegmentMaxIndex()
-        this.checkFileSegmentGetOrNot()
-      }
-    },
-    async '+/file_segment_get/+' (data, topic) {
-      console.log('file_segment_get')
-      console.log(JSON.parse(new TextDecoder('utf-8').decode(data)))
-      if (this.downloadOptionsList.length > 0) {
-        const segmentData = atob(JSON.parse(new TextDecoder('utf-8').decode(data)).data.segment)
-        this.data += segmentData
+  //     if (this.downloadOptionsList.length > 0) {
+  //       await download.updateFileSegmentInfo(String.fromCharCode.apply(null, data))
+  //       this.fileSegmentMax = download.getFileSegmentMaxIndex()
+  //       this.checkFileSegmentGetOrNot()
+  //     }
+  //   },
+  //   async '+/file_segment_get/+' (data, topic) {
+  //     console.log('file_segment_get')
+  //     console.log(JSON.parse(new TextDecoder('utf-8').decode(data)))
+  //     if (this.downloadOptionsList.length > 0) {
+  //       const segmentData = atob(JSON.parse(new TextDecoder('utf-8').decode(data)).data.segment)
+  //       this.data += segmentData

-        this.fileSegmentIndex += 1
-        this.checkFileSegmentGetOrNot()
-      }
-    },
-  },
+  //       this.fileSegmentIndex += 1
+  //       this.checkFileSegmentGetOrNot()
+  //     }
+  //   },
+  // },
  methods: {
    transTime (timeRange) {
      return this.getTimeInFormat(timeRange[0]) + ' - ' + this.getTimeInFormat(timeRange[1])
@@ -237,11 +236,11 @@ export default {
      this.showDownload = true
    },
    channelChecked: function (channelIndex, path) {
-      downloadTaskManager.getDownloadOptions(path).channel[channelIndex].checked = true
+      download.getDownloadOptions(path).channel[channelIndex].checked = true
      this.refresh()
    },
    channelUnchecked: function (channelIndex, path) {
-      downloadTaskManager.getDownloadOptions(path).channel[channelIndex].checked = false
+      download.getDownloadOptions(path).channel[channelIndex].checked = false
      this.refresh()
    },
    getTimeInFormat: function (time) {
@@ -263,27 +262,17 @@ export default {
    getCurrentFullPathName: function () {
      return this.currentlyDownloadInfo.previousPath + '/' + this.currentlyDownloadInfo.filenameWithType
    },
+    downloading: async function (info) {
+      this.$emit('download')
+    },
    addDownloadTask: async function (info) {
-      console.log(info)
-      const promises = JSON.parse(info.channels).map(async ch => {
-        const rawData = await api.getRawFilesByParent(ch, info.id)
-        return rawData
-      })
-      const rawData = await Promise.all(promises)
-      console.log(rawData)
-      exportData.exportCSVByAPI(info, rawData)
-      // if (Array.isArray(downloadPath)) {
-      //   downloadPath.forEach(path => {
-      //     // this.downloadList.push(path.path)
-      //     downloadTaskManager.updateDownloadOptions(path.path)
-      //   })
-      // } else {
-      //   // this.downloadList.push(downloadPath)
-      //   downloadTaskManager.updateDownloadOptions(downloadPath)
-      // }
-      // this.refresh()
-      // this.showDownloadModal()
-      // this.confirmDownload()
+      this.downloading()
+      console.log('download')
+      console.time()
+      const rawData = await download.getAllRawDatas(info)
+      console.timeEnd()
+      exportData.exportCSV(info, rawData)
+      this.downloading()
    },
    _addDownloadTask: function (downloadPath) {
      if (Array.isArray(downloadPath)) {
@@ -298,23 +287,23 @@ export default {
      this.confirmDownload()
    },
    refresh: function () {
-      this.downloadOptionsList = downloadTaskManager.getDownloadOptionsList()
+      this.downloadOptionsList = download.getDownloadOptionsList()
      console.log(this.downloadOptionsList)
    },
    confirmDownload: function (path) {
      console.log('confirmDownload')
-      console.log(downloadTaskManager.getDownloadOptionsList())
-      console.log(downloadTaskManager.isFileDownloading())
-      console.log(downloadTaskManager.downloadTaskRemain())
-      if (!downloadTaskManager.isFileDownloading() && downloadTaskManager.downloadTaskRemain()) {
-        const downloadOptionsIndex = downloadTaskManager.getDownloadOptionsList().findIndex(downloadInfo => downloadInfo.metaPath === path)
+      console.log(download.getDownloadOptionsList())
+      console.log(download.isFileDownloading())
+      console.log(download.downloadTaskRemain())
+      if (!download.isFileDownloading() && download.downloadTaskRemain()) {
+        const downloadOptionsIndex = download.getDownloadOptionsList().findIndex(downloadInfo => downloadInfo.metaPath === path)
        // this.downloadBlockList[downloadInfoIndex].status = 'downloading'
-        this.currentlyDownloadInfo = downloadTaskManager.getDownloadOptionsList()[downloadOptionsIndex]
+        this.currentlyDownloadInfo = download.getDownloadOptionsList()[downloadOptionsIndex]
        this.currentlyDownloadInfo.download.status = 'downloading'
        console.log(this.currentlyDownloadInfo)
-        console.log(downloadTaskManager.getDownloadOptionsList())
+        console.log(download.getDownloadOptionsList())

-        downloadTaskManager.updateDownloadSubFileList(
+        download.updateDownloadSubFileList(
          this.currentlyDownloadInfo.metaPath,
          this.currentlyDownloadInfo.channel,
          this.currentlyDownloadInfo.timeRange,
@@ -333,7 +322,7 @@ export default {
    },
    _confirmDownload: function () {
      console.log('confirmDownload')
-      console.log(downloadTaskManager.getDownloadOptionsList())
+      console.log(download.getDownloadOptionsList())
      // if (this.downloadList.length > 0 && this.currentlyDownloadInfo.status === 'idle') {
      //   this.showDownload()
      //   this.updateDownloadSubFileList(this.downloadList[0])
@@ -344,7 +333,7 @@ export default {
    },
    downloadAllSubFileList: async function (path) {
      this.currentlyDownloadInfo = this.downloadInfo
-      downloadTaskManager.downloadAllSubFileList(path)
+      download.downloadAllSubFileList(path)
      this.subfileListRemain()
    },
    // updateDownloadInfo: function (path) {
@@ -391,7 +380,7 @@ export default {
      }
    },
    updateMetaDownloadInfo: function () {
-      downloadTaskManager.updateDownloadSubFileList(
+      download.updateDownloadSubFileList(
        this.currentlyDownloadInfo.metaPath,
        this.currentlyDownloadInfo.channel,
        this.currentlyDownloadInfo.timeRange,
@@ -404,7 +393,7 @@ export default {
      this.currentlyDownloadInfo = this.downloadBlockList[downloadOptionsIndex]
      this.updatecurrentlyDownloadInfo()

-      downloadTaskManager.updateDownloadSubFileList(
+      download.updateDownloadSubFileList(
        this.currentlyDownloadInfo.metaPath,
        this.currentlyDownloadInfo.channel,
        this.currentlyDownloadInfo.timeRange,
@@ -419,7 +408,7 @@ export default {
      this.currentlyDownloadInfo = this.downloadBlockList[downloadOptionsIndex]
      // this.updatecurrentlyDownloadInfo()

-      downloadTaskManager.updateDownloadSubFileList(
+      download.updateDownloadSubFileList(
        this.currentlyDownloadInfo.metaPath,
        this.currentlyDownloadInfo.channel,
        this.currentlyDownloadInfo.timeRange,
@@ -428,13 +417,8 @@ export default {
    },
    subfileListRemain: function () {
      console.log('subfileListRemain')
-      if (downloadTaskManager.checkDownloadSubFileList(this.currentlyDownloadInfo.metaPath)) {
-        this.currentlyDownloadInfo.filenameWithType = downloadTaskManager.getFirstSubfile(this.currentlyDownloadInfo.metaPath)
-        this.mqttPub('BPS_FF_user', JSON.stringify({
-          header: 'file_segment/0',
-          method: 'new',
-          path: this.getCurrentFullPathName(),
-        }))
+      if (download.checkDownloadSubFileList(this.currentlyDownloadInfo.metaPath)) {
+        this.currentlyDownloadInfo.filenameWithType = download.getFirstSubfile(this.currentlyDownloadInfo.metaPath)
      } else {
        this.loadingPercent = 100
        console.log(this.currentlyDownloadInfo.filenameWithType + ' download complete')
@@ -456,11 +440,6 @@ export default {
        this.fileSegmentIndex = 0
        this.subfileListRemain()
      } else {
-        this.mqttPub('BPS_FF_user', JSON.stringify({
-          header: 'file_segment_get/0',
-          segment: this.fileSegmentIndex,
-          path: this.getCurrentFullPathName(),
-        }))
      }
    },
    exportCSV: function () {
@@ -469,12 +448,12 @@ export default {
    exportTXT: function () {
    },
    timeRangeChange: function (timeRange, path) {
-      downloadTaskManager.getDownloadOptions(path).timeRange = timeRange
+      download.getDownloadOptions(path).timeRange = timeRange
      this.refresh()
    },
    calculateFileSize: function () {
      this.totoalFileSize = file.getFileSize(this.currentlyDownloadInfo.metaPath)
-      // const allSubfile = downloadTaskManager.getAllSubfile(this.currentlyDownloadInfo.metaPath)
+      // const allSubfile = download.getAllSubfile(this.currentlyDownloadInfo.metaPath)
      // this.fileNum = allSubfile.length
      const downlinkSpeed = this.getNetSpeed('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOEAAADhCAMAAAAJbSJIAAABTVBMVEX////qQzU0qFNChfT7vAU/g/RZlPU5gPT7uQCxyPqXufn/vQDpNCLqQTMwp1D7uADpOCfqPS4fo0bpMiD8wADpLxwopUv0paD1q6b86ObpOiv4/Pn+9/b4xcH2ubX1r6rsXVIre/NwvoOf0qvO6NQzqUm/4cf5zMn739zrSz398O/sVEjvdWz2t7PvenP4ycb7wir96Lf+8tb8zFH93pj+9eH//PD92Yvw9v7+7cP80Xb95q6pxPnq9u1PsmigvvlunvaJyZiGrvjD1vvyl5HtamHoJgzwhH3zmpTtXlLvenHuYSzygCL2mxjsUzDwcSf0jx34phH8z2DxfVHX5P38x0KHvnDOtiGjsjJ0rkLhuRW4tCnS4PyMsDtZq0it2bhmmvbO5OE1noBft3U1pWA/jNc8lLk5nJNBieSSy58+j8t5wIo6mKY2o25FrmBHQXgmAAAIJUlEQVR4nO2b2V/bRhCAhbADxJLQYQvwgcE2PsAhEHK0SUxigoGkTdMj6ZXDTdw2JbT+/x9r+QDZllYra8da85vvKU/yfszszO5IEQQEQRAEQRAEQRAEQRAEQRAEQRAEQRAEQRAEQRDWpLfXSplbqysWq9n1Unk7HfaSmJFey6ycNipGwpDUAZKRSMxt7B6vl7fDXl5QyqvVHdVQk5o8N4osa0nJqDSOSzNrmc7sVlRVk8fl7J4dTbmRXQt7sf5JZ6onkkPknC3VxE52tiJZPtUMjcru0lI1dkthL5uaTMNI0kVvOJLGRnYmCmx2R/IXPpukVFnh3nG9IvkPn81R1bJhKxC5vWME8evHMRO2hitr1URQv65jospp81jRkgz8LJLaStgyDpSfqywC2ENWN7gL48rJpAXUGe3kVthKQ2w3DKZ+c9ZuPOWocZQqrHagHY4yNRuoBbqjaZyc444D90A35AQPmzFdlYD8uorht410Q4UTnJON0A3TOxA15pLE6nUXvOYRlI3wI9gAFZRCFxReQBaZufAjKBwDtgkeioyQZX4UtcFDIyz5PqrJsqYlk2oymdQ8hqhc7MHtih9Ba+4rVTaqp6fHZ2fHp7sNaxDuPk3lQVCo+iijmmQ0zjJr9ncx6e3Syq6WcBk6crAHhVXqTSirJ7sZ53l2unQsGQ6R5GAPCuUT2vCpz28RL7K3q+pIIDlo9B026EYWmlT1vuGVT1X707jYg8IKVauXjQbdDbZctd0wuYjgGtU7peTcOvUTM/KgcPFQZDqnNYo6Khu7fh6ZftENo8yHYCnhLajN+R3NZzsFh489KAg73jk6yZisXNE4EVz3boXG7iSjzrUKH4KC93EtcTzZkzmZAD9a/obsJ0tnYa8xEKm9SPxboqHEwZkrCPuLkUj8JSFRpdOwlxiQg0iH+PJ3boJqNewVBuTOYqSrGH/lLKjtcFIuJuZhz7Dj+L1jldHKYa8wIKnIJfEfHDJVoj+Kcsr+sk1xvG0kZ30T9uvMleNI25DV2fo2zYH7y5FhxZdDhgbfH/vQsL8YGVG0tw15J+z1BefHUcNIPPLqsvsbt8NeX2BSo35DbUPbCHt9wbkzFsJe2+iHkN/P0ai562gYiS9abUPeCHt5DDhwFOy3DZWT62sQ7u+5GVq3DY2bz3sm555zkvYUl38Ke3kM2F92N4wsPqJ8ytKNwLyGMnxAiGFk+T6t4WY0IJtLUIYPSYZ7tE9ZWpgPyMJNKMM3pCR9MD3D6FMgwftxUpLuT89wfh7KkMk2ZGG4CWR4j1RK49SPYWH4FYzh1yTDN1M1BGoXjwhZuvhwqobvYAxdzt09Q+pSysJw4VkIhnevvSHtmY2NIdChhnRom7Lh42tv+AQNJ4OjfRiG4XRraRiG0+2HQJWGnzMNVLcgnksPpmoI1PH5uVtAGXJ0PwQ6efNzx4e6PXEzpwG7AXMzawObYrCalwaftUWhDIkz72XqmffmAg0kwxtQhqT3FrH4z5RPeXeThiOC4cIRlCHh3VPsF0Wpsfyt14QgQh3aBPf3h7HYr6Jo5ln+FGm3QjV8wfXsHYv8Joqicsjyp46i7oZgzcLtPX7sd0W00IsMf4qwDcGG+oLLtxixt2IPpcXul95tuvuBvZixGP+eJhZ5Lw5gGMQj0jYEuv92GfsmKrb34VJQVNrMfmiBtA2Bzt1dRr9r6zQJ0YbeZPQ7pEoanYcrNMJIv+g2iSF0Rj2RVGZAt+Hwwa3XJIZQckx+hXh0Bd2GQ9V00CSGg8gkT28QduH8AtiXGD0ub1Cxtw6CIpOz2xPi7QPs2N2n3/RjsfcOft16mgr6E69JhRTwQ4wBB70M/eAs2DmeBu77xBwFT9JeSxxpEiNbsR7sB0jN3oKNBom98SYxohjokrFEOK/Ng1fSLo/GmwRDxWceEQS8V1whElI0aKI+I1aZTrsHu97bKepehqKem6yiegnCnkmvOPQMYqeiTtIXH296CEb/YO3iTME7iJ1M9n+V8qqinRDCzS+GyZkUivqFv0z9OO8pCDdGHKXmnaZWpio+wpi60D/d8FIEHEGNkqfIUyuMrQLd81J50RS3/vyLrDitXdiFotjQO9bybd16nmL+TVQEe+XkuCiqIHYdD5vk/Vi4UMzB32vrc9S9mi48nY5bH7o87TnquaKLZKpwruj2dNj67x/XMEancZyx0aKopzbJ1nmxVrN5pmq14nnL1EefoihfXBShPk9wpdam24qDlZu6Lh7mLur183r9Itc6FHXddLxDb/3rmKnA4xknaPr+WIDMHopC+PNsfXLqjNPOUYumf0U6ttrjbWNqp5kh6lCKytZo24B7ZUiG5vQ2GVuf5+2bcXrHtRFSfgqqT0V72wAecxMVD8EUTeXL5TwDfvpEUvTVM3wxaBvRKR64HRXBothpG91MhfvPeJSKcHuxd9sIW7CjmINqGt22Eb6gANgXLcWPYdt1aepA9UZRKK/Q4BREkM1otpl+hRSIWgsgUyedugKRZ52pSrD3HwDU2HZGU+RlC9rIk259/lDMOlcZOqCWY5Sq+iGHAexROGTgaJqsvssBoSgGdDTNcy4T1EYzQBwVU6nz0wPdKbbGpoR0fno7Pwt+FoW64jeQiuk+OeaSVDHnMhF10Zud8F3RkRSt2aiHXMdObDVnT69PoZlrm7qzpzUg1s12Ll+YpeR0IFUr5i9abd2iP/M2u/9ut+r5Ym3G7a5IpWqFYrOZt2g2i4VCLXVt3BAEQRAEQRAEQRAEQRAEQRAEQRAEQRAEQRAE4Yf/AZmODCZml4YgAAAAAElFTkSuQmCC', 3)
      // this.totoalFileSize = (allSubfile.length) * 1000000
@@ -492,11 +471,6 @@ export default {
      // allSubfile.forEach(subfile => {
      //   console.log(subfile)
      //   this.currentlyDownloadInfo.filenameWithType = subfile
-      //   this.mqttPub('BPS_FF_user', JSON.stringify({
-      //     header: 'file_segment/0',
-      //     method: 'new',
-      //     path: this.getCurrentFullPathName(),
-      //   }))
      // })
    },
    doProgress () {
@@ -523,7 +497,7 @@ export default {
      }, 1000)
    },
    downloadDone: function () {
-      downloadTaskManager.getDownloadOptionsList().shift()
+      download.getDownloadOptionsList().shift()
      this.loadingPercent = 0
      this.refresh()
      this.confirmDownload()
@@ -5,7 +5,7 @@
        <file-table :ref="'file_ref'" @download="addDownloadTask"/>
      </div>
      <div class="flex md12 xl12 xs12 sm12" :style="AreaStyle">
-        <download :ref="'download_ref'"></download>
+        <download :ref="'download_ref'" @download="downloadingFile"></download>
      </div>
    </div>
  </div>
@@ -63,19 +63,30 @@ export default {
    addDownloadTask: function (info) {
      this.$refs.download_ref.addDownloadTask(info)
    },
-    pageInitPub: function () {
+    downloadingFile: function () {
+      this.$refs.file_ref.loadingFiles = !this.$refs.file_ref.loadingFiles
+    },
+    pageInitPub: async function () {
      this.controllerList.forEach(async (controller) => {
        this.$refs.file_ref.currentPathIndex = file.getPathMaxIndex()
        file.clearFileList()

-        const folders = await api.getCollectionsFoldersByParent(0)
-        const files = await api.getFolderMetaFileByParent(0)
-        file.updateFileList(folders)
-        file.updateFileList(files)
+        const initCollection = await api.getCollectionsByName('admin')

-        this.$refs.file_ref.fileLists = file.getFileList()
-        this.$refs.file_ref.pathLists = file.getPathList()
-        this.$refs.file_ref.loadingFiles = false
+        if (initCollection.data !== 0) {
+          file.addPath(initCollection.data[0])
+          this.$refs.file_ref.currentPathIndex = file.getPathMaxIndex()
+          this.$refs.file_ref.currentInfo = initCollection.data[0]
+
+          const folders = await api.getCollectionsByParent('folder', initCollection.data[0].id)
+          const files = await api.getFolderMetaFileByParent('folder', initCollection.data[0].id)
+          file.updateFileList(folders)
+          file.updateFileList(files)
+
+          this.$refs.file_ref.fileLists = file.getFileList()
+          this.$refs.file_ref.pathLists = file.getPathList()
+          this.$refs.file_ref.loadingFiles = false
+        }
      })
    },
  },
@@ -87,6 +98,8 @@ export default {
  },
  destroyed () {
    this.pageMqttUnSub()
+    file.clearFileList()
+    file.clearPathList()
  },
 }
 </script>
@@ -89,7 +89,7 @@
      <!-- CreateFolder & FilePath -->
      <div class="flex mb-4">
        <va-icon
-          name="fa fa-plus-circle"
+          name="fa fa-plus"
          size="1rem"
          class="mr-2"
          style="cursor: pointer;"
@@ -166,8 +166,11 @@
          <va-popover :message="`download ${props.rowData.name}`" placement="top">
            <va-button flat small color="gray" icon="fa fa-download" v-if="props.rowData.type !== 'folder'" @click.stop="download(props.rowData)"/>
          </va-popover>
+          <va-popover :message="`replay ${props.rowData.name}`" placement="top">
+            <va-button flat small color="gray" icon="fa fa-eye" v-if="props.rowData.type !== 'folder'" @click.stop="replay(props.rowData)"/>
+          </va-popover>
          <va-popover :message="`edit ${props.rowData.name}`" placement="top">
-            <va-button flat small color="gray" icon="fa fa-pencil" @click.stop="editFileConfirm(props.rowData.path, props.rowData.name, props.rowData.type)"/>
+            <va-button flat small color="gray" icon="fa fa-pencil" @click.stop="editFileConfirm(props.rowData)"/>
          </va-popover>
          <va-popover :message="`delete ${props.rowData.name}`" placement="top">
            <va-button flat small color="gray" icon="fa fa-trash" @click.stop="deleteFileConfirm(props.rowData.path, props.rowData.name)"/>
@@ -192,13 +195,14 @@ export default {
  data () {
    return {
      term: null,
-      perPage: '6',
-      perPageOptions: ['4', '6', '10', '20'],
+      perPage: '20',
+      perPageOptions: ['20', '40', '80', '160'],

      fileLists: [],
      pathLists: [],
      currentPathIndex: -1,
      currentPage: 0,
+      currentInfo: {},

      loadingFiles: true,
      showModal: {
@@ -216,9 +220,7 @@ export default {
        errorMessages: [],
      },
      editInfo: {
-        path: '',
-        name: '',
-        type: '',
+        info: {},
        changedName: '',
        success: false,
        error: false,
@@ -299,7 +301,9 @@ export default {
        return this.fileLists
      }
      return this.fileLists.filter(item => {
-        return item.name.toLowerCase().includes(this.term.toLowerCase())
+        if (item.name !== null) {
+          return item.name.toLowerCase().includes(this.term.toLowerCase())
+        }
      })
    },
    selected () {
@@ -348,8 +352,7 @@ export default {
    },

    openFile: async function (info) {
-      console.log('openfile', info)
-      console.log(this.pathLists)
+      this.currentInfo = info
      if (info.type === 'folder') {
        this.loadingFiles = true
        // clear file and add path
@@ -358,16 +361,15 @@ export default {
        this.currentPathIndex = file.getPathMaxIndex()

        // call getfolder api and update
-        const folders = await api.getCollectionsFoldersByParent(info.id)
-        const files = await api.getFolderMetaFileByParent(info.id)
+        const folders = await api.getCollectionsByParent('folder', info.id)
+        const files = await api.getFolderMetaFileByParent('folder', info.id)
        file.updateFileList(folders)
        file.updateFileList(files)

        this.fileLists = file.getFileList()
        this.loadingFiles = false
      } else {
-        // this.fileInfoName = info.name
-        // this.$emit('showFileInfoTable', info.path)
+        // TODO file info
      }
    },
    openPath: async function (item, index) {
@@ -377,9 +379,10 @@ export default {
        file.clearFileList()
        file.slicePathList(index)
        this.currentPathIndex = file.getPathMaxIndex()
+        this.currentInfo = item
        // call getfolder api and update
-        const folders = await api.getCollectionsFoldersByParent(item.id)
-        const files = await api.getFolderMetaFileByParent(item.id)
+        const folders = await api.getCollectionsByParent('folder', item.id)
+        const files = await api.getFolderMetaFileByParent('folder', item.id)
        file.updateFileList(folders)
        file.updateFileList(files)

@@ -395,43 +398,55 @@ export default {
      this.currentPathIndex = -1

      // call getfolder api and update
-      const folders = await api.getCollectionsFoldersByParent(0)
-      const files = await api.getFolderMetaFileByParent(0)
-      file.updateFileList(folders)
-      file.updateFileList(files)
-      this.fileLists = file.getFileList()
-      this.loadingFiles = false
+      const initCollection = await api.getCollectionsByParentName('folder', 0, 'root')
+
+      if (initCollection.data.length === 1) {
+        this.currentInfo = initCollection.data[0]
+        const folders = await api.getCollectionsByParent('folder', initCollection.data[0].id)
+        const files = await api.getFolderMetaFileByParent('folder', initCollection.data[0].id)
+        file.updateFileList(folders)
+        file.updateFileList(files)
+        this.fileLists = file.getFileList()
+        this.loadingFiles = false
+      }
    },
    createFolderConfirm: function () {
      this.inputFieldReset(this.createInfo)
-      this.createFolder = true
+      this.showModal.createFolder = true
    },
    checkFolderNameValidate: debounce(async function (term) {
-      if (term.length === 0) {
-        // folder name empty
-        this.setInputFieldError(this.createInfo.errorMessagesAll[1], this.createInfo)
-        return false
-      }
      const illegalChar = term.match(/[^(\w\-)]+/gm)
      if (illegalChar !== null) {
        // folder name contains illegal characters
        this.setInputFieldError(this.createInfo.errorMessagesAll[0] + ' ' + illegalChar[0], this.createInfo)
      } else {
        // folder name existed
-        const existedFolder = await api.getCollectionsByName(term)
+        const existedFolder = await api.getCollectionsByParentName(this.currentInfo.type, this.currentInfo.id, term)
        if (existedFolder.data.length === 0) {
          this.setInputFieldSuccess(this.createInfo)
        } else {
          this.setInputFieldError(this.createInfo.errorMessagesAll[2], this.createInfo)
        }
      }
+      if (term.length === 0) {
+        // folder name empty
+        this.setInputFieldError(this.createInfo.errorMessagesAll[1], this.createInfo)
+      }
      this.createInfo.changedName = term
-    }, 200),
+    }, 250),
    createFolder: async function () {
-      const parent = [].concat((this.pathLists.length === 0) ? 0 : this.pathLists[this.pathLists.length - 1].id)
+      const parent = [].concat((this.pathLists.length === 0) ? this.currentInfo.id : this.pathLists[this.pathLists.length - 1].id)
      const type = 'folder'
-      await api.createCollection(this.createInfo.changedName, parent, type)
-      this.refreshCurrentPage()
+      await api.createCollection({
+        name: this.createInfo.changedName,
+        parent: { [type]: parent },
+        type: type,
+        size: 0,
+      })
+      this.refreshPage()
+      this.showToast(`Folder ${this.createInfo.changedName} create.`, {
+        position: 'bottom-right',
+      })
    },
    undoCreate: function () {
      this.createInfo.success = false
@@ -439,18 +454,18 @@ export default {
      this.createInfo.changedName = ''
      this.createInfo.name = ''
    },
-    editFileConfirm: function (path, name, type) {
-      this.editInfo.path = path
-      this.editInfo.name = name
-      this.editInfo.type = type
-      this.editFile = true
+    editFileConfirm: function (info) {
+      this.editInfo.info = info
+      this.editInfo.changedName = info.name
+      this.showModal.editFile = true
    },
-    editFile: function () {
-      // this.mqttPub('BPS_FF_user', JSON.stringify({
-      //   header: 'file_rename/0',
-      //   path: this.editInfo.path,
-      //   content: this.editInfo.changedName,
-      // }))
+    editFile: async function () {
+      // TODO editFile
+      if (this.editInfo.type !== 'folder') {
+        await api.updateMetaFile(this.editInfo.info.id, { name: this.editInfo.changedName })
+      } else {
+      }
+      this.editFileDone()
    },
    checkFileNameValidate: debounce(function (term) {
      const illegalChar = term.match(/[^(\w\-)]+/gm)
@@ -482,11 +497,8 @@ export default {
      this.editInfo.changedName = term
    }, 200),
    editFileDone: function () {
-      this.mqttPub('BPS_FF_user', JSON.stringify({
-        header: 'file_list/0',
-        path: file.getPath(),
-      }))
-      this.showToast(`file rename ${this.editInfo.name}`, {
+      this.refreshPage()
+      this.showToast(`${this.editInfo.info.name} -> ${this.editInfo.changedName}`, {
        position: 'bottom-right',
      })
    },
@@ -502,14 +514,10 @@ export default {
    deleteFileConfirm: function (path, name) {
      this.deleteInfo.path = path
      this.deleteInfo.name = name
-      this.deleteFile = true
+      this.showModal.deleteFile = true
    },
    deleteFile: function () {
-      // this.loadingFiles = true
-      // this.mqttPub('BPS_FF_user', JSON.stringify({
-      //   header: 'file_delete/0',
-      //   path: this.deleteInfo.path,
-      // }))
+      // delete editFile
    },
    deleteFileDone: function () {
      // rebuild table
@@ -536,9 +544,25 @@ export default {
      info.errorMessages.pop()
      info.errorMessages.push(message)
    },
-    refreshCurrentPage: function () {
-      this.$refs.datatable_ref.refresh()
-      this.$refs.datatable_ref.currentPage = 1
+    refreshPage: async function () {
+      if (this.currentPathIndex === -1) {
+        this.openHome()
+      } else {
+        this.loadingFiles = true
+        // clear file and add path
+        file.clearFileList()
+
+        // call getfolder api and update
+        const folders = await api.getCollectionsByParent('folder', this.currentInfo.id)
+        const files = await api.getFolderMetaFileByParent('folder', this.currentInfo.id)
+        file.updateFileList(folders)
+        file.updateFileList(files)
+
+        this.fileLists = file.getFileList()
+        this.loadingFiles = false
+      }
+      // this.$refs.datatable_ref.refresh()
+      // this.$refs.datatable_ref.currentPage = 1
    },
    showrefs: function () {
      this.$emit('download', this.selected)
@@ -546,6 +570,12 @@ export default {
    download: async function (info) {
      this.$emit('download', info)
    },
+    replay: function (meta) {
+      console.log(this.$router)
+      this.$router.push({
+        path: '/admin/data-replay/neulive/' + meta.id,
+      })
+    },
  },
  mounted () {
  },
@@ -18,11 +18,11 @@ export default [
    ],
  },
  {
-    categoryName: 'Project',
+    categoryName: 'Task',
    items: [
      {
-        itemName: 'ProjectContent',
-        itemLink: '/project/content',
+        itemName: 'TaskContent',
+        itemLink: '/task/content',
      },
    ],
  },
@@ -38,8 +38,8 @@ export default [
        itemLink: '/admin/statistics/progress-bars',
      },
      // {
-      //   itemName: 'ProjectContent',
-      //   itemLink: '/admin/statistics/project-content',
+      //   itemName: 'TaskContent',
+      //   itemLink: '/admin/statistics/task-content',
      // },
    ],
  },
@@ -1,227 +0,0 @@
-<template>
-  <div class="flex" :class="cardclass">
-    <va-card>
-      <template slot="header">
-        <va-icon name="fa fa-bluetooth-b mr-3" color="primary"/>
-        <h5 class="mt-0 mb-0">DEVICES</h5>
-      </template>
-      <div v-if="state.LOADING" class="flex-center spinner-box mt-4 mb-5">
-        <fulfilling-bouncing-circle-spinner
-          :animation-duration="3000"
-          :color="this.$themes.primary"
-          :size="60"
-        >
-        </fulfilling-bouncing-circle-spinner>
-      </div>
-
-      <div v-else class="flex row align--center">
-        <project-device-list :ref="'pdlist_ref'" :deviceList="deviceList" @remove="removeDevice($event)" @start="startDevice($event)" @stop="stopDevice($event)" @generate="generateChart($event)" />
-
-        <div class="row flex xs12 md12 xl12 sm12 mt-2" style="text-align: center;">
-          <div class="xs10 md10 xl10 sm10">
-            <va-select
-              small
-              v-model="deviceSelect"
-              textBy="name"
-              :options="deviceOptions"
-            />
-          </div>
-          <div>
-            <va-button class="ma-0" color="primary" target="_blank" @click="addDevice(deviceSelect.id)" :disabled="deviceSelect.id == null">
-              REGISTER
-            </va-button>
-          </div>
-        </div>
-      </div>
-
-    </va-card>
-  </div>
-</template>
-
-<script>
-import { FulfillingBouncingCircleSpinner } from 'epic-spinners'
-import ProjectDeviceList from './ProjectDeviceList'
-import { projectInfo } from '../../../../data/project/ProjectInfo'
-import { chartData } from '../../../../data/project/ChartsManagement'
-import { dataStreamBuffer } from '../../../../data/project/DataStreamBuffer'
-
-export default {
-  name: 'ProjectDevices',
-  components: {
-    FulfillingBouncingCircleSpinner,
-    ProjectDeviceList,
-  },
-  props: {
-    cardclass: {
-      type: Array,
-      default: function () {
-        return ['xs12', 'md12', 'xl12', 'sm12']
-      },
-    },
-  },
-  created () {
-  },
-  data () {
-    return {
-      deviceSelect: '',
-      deviceOptions: projectInfo.getDeviceListNotRegister(),
-      deviceList: projectInfo.getDeviceListRegister(),
-      state: {
-        LOADING: false,
-      },
-    }
-  },
-  mqtt: {
-  },
-  methods: {
-    sleep: async function (time) {
-      return new Promise((resolve) => setTimeout(resolve, time))
-    },
-    mqttPub: function (topic, mes) {
-      this.$mqtt.publish(topic, mes)
-    },
-    loadingStart: async function () {
-      this.state.LOADING = true
-    },
-    loadingDone: async function () {
-      this.state.LOADING = false
-      console.log(this.deviceOptions)
-      for (let i = this.deviceOptions.length - 1; i >= 0; i--) {
-        this.deviceSelect = this.deviceOptions[i]
-        await this.addDevice(this.deviceOptions[i].id)
-        // this.sleep(500).then(() => {
-        //   this.addDevice(this.deviceOptions[i].id)
-        // })
-      }
-    },
-    startDevice: async function (device) {
-      await chartData.defaultChartGenerator(device.id, null, 'device')
-      if (!projectInfo.getDeviceInfo(device.id).info.isSync) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_instruction/0',
-          device: projectInfo.getRawDeviceID(device.id),
-          instruction: 'start',
-        }))
-        device.isSync = true
-        this.$emit('refreshSetting')
-
-        // ### show device info
-        console.log(projectInfo.getDeviceInfo(device.id))
-      }
-    },
-    stopDevice: function (device) {
-      dataStreamBuffer.removeByDevice(projectInfo.getRawDeviceID(device.id))
-      if (projectInfo.getDeviceInfo(device.id).info.isSync) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_instruction/0',
-          device: projectInfo.getRawDeviceID(device.id),
-          instruction: 'interrupt',
-        }))
-      }
-      // device.isSync = false
-    },
-    // addDevice: async function () {
-    //   if (this.deviceSelect.id == null) {
-    //     return false
-    //   }
-    //   await projectInfo.getProjectInfo().deviceAddrList.push(projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address)
-    //   await projectInfo.getProjectInfo().projectDeviceID.push(this.deviceSelect.id)
-    //   const _address = this.GLOBAL.transMac(projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address)
-
-    //   const pic = projectInfo.getDevicePic(projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name)
-    //   let type = ''
-    //   if (projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name.indexOf('Elite') >= 0) {
-    //     type = 'Elite'
-    //   } else if (projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name.indexOf('Neulive') >= 0) {
-    //     type = 'Neulive'
-    //   }
-
-    //   const _device = {
-    //     id: projectInfo.getProjectInfo().projectDeviceID.indexOf(this.deviceSelect.id),
-    //     name: '[' + projectInfo.getProjectInfo().projectDeviceID.indexOf(this.deviceSelect.id) + '] ' + projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_name,
-    //     addr: projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address,
-    //     address: _address,
-    //     picture: pic,
-    //     type: type,
-    //     isSync: projectInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.isSync,
-    //     stopping: false,
-    //   }
-    //   this.deviceList.push(_device)
-    //   this.deviceSelect = ''
-    //   projectInfo.updateAllList()
-    //   this.$emit('add', _device.id)
-    // },
-    addDevice: async function (selectID) {
-      if (selectID == null) {
-        return false
-      }
-
-      await projectInfo.getProjectInfo().deviceAddrList.push(projectInfo.getDeviceInfoByRawID(selectID).info.device_address)
-      await projectInfo.getProjectInfo().projectDeviceID.push(selectID)
-      const _address = this.GLOBAL.transMac(projectInfo.getDeviceInfoByRawID(selectID).info.device_address)
-
-      const pic = projectInfo.getDevicePic(projectInfo.getDeviceInfoByRawID(selectID).info.library_name)
-      let type = ''
-      if (projectInfo.getDeviceInfoByRawID(selectID).info.library_name.indexOf('Elite') >= 0) {
-        type = 'Elite'
-      } else if (projectInfo.getDeviceInfoByRawID(selectID).info.library_name.indexOf('Neulive') >= 0) {
-        type = 'Neulive'
-      }
-
-      const _device = {
-        id: projectInfo.getProjectInfo().projectDeviceID.indexOf(selectID),
-        name: '[' + projectInfo.getProjectInfo().projectDeviceID.indexOf(selectID) + '] ' + projectInfo.getDeviceInfoByRawID(selectID).info.device_name,
-        addr: projectInfo.getDeviceInfoByRawID(selectID).info.device_address,
-        address: _address,
-        picture: pic,
-        type: type,
-        isSync: projectInfo.getDeviceInfoByRawID(selectID).info.isSync,
-        stopping: false,
-      }
-      this.deviceList.push(_device)
-      this.deviceSelect = ''
-      projectInfo.updateAllList()
-      this.$emit('add', _device.id)
-    },
-    removeDevice: async function (device) {
-      projectInfo.getProjectInfo().deviceAddrList.forEach(addr => {
-        if (addr === device.addr) {
-          projectInfo.getProjectInfo().deviceAddrList.splice(projectInfo.getProjectInfo().deviceAddrList.indexOf(addr), 1)
-        }
-      })
-      projectInfo.getProjectInfo().projectDeviceID.forEach(realID => {
-        if (realID === device.id) {
-          projectInfo.getProjectInfo().projectDeviceID.splice(projectInfo.getProjectInfo().projectDeviceID.indexOf(realID), 1)
-        }
-      })
-      this.deviceList.splice(this.deviceList.indexOf(device), 1)
-      this.deviceSelect = ''
-      projectInfo.updateAllList()
-      this.$emit('remove', device.id)
-    },
-    generateChart: function (device) {
-      this.$emit('add', device.id)
-    },
-    refresh: function () {
-      this.$nextTick(() => {
-        if (this.$refs.pdlist_ref != null) {
-          this.$refs.pdlist_ref.refresh()
-        }
-      })
-    },
-  },
-  async mounted () {
-    // this.pageMqttSub()
-    // for (const device in this.deviceOptions) {
-    //   this.deviceSelect = this.deviceOptions[device]
-    //   await this.addDevice()
-    // }
-  },
-  destroyed () {
-    this.loadingDone()
-    // this.pageMqttUnSub()
-  },
-  watch: {
-  },
-}
-</script>
@@ -1,71 +0,0 @@
-<template>
-  <div class="flex mt-0 pt-0">
-    <div>
-      <div class="row flex sm12 xl12 md12 xs12">
-
-        <div>
-          <elite-parameter-recording :ref="'rec_ref'" :deviceID="deviceID"/>
-        </div>
-      </div>
-    </div>
-
-  </div>
-</template>
-
-<script>
-
-import EliteParameterRecording from './EliteParameterRecording'
-import { projectInfo } from '../../../../data/project/ProjectInfo'
-
-export default {
-  name: 'EliteParameterWindow',
-  components: {
-    EliteParameterRecording,
-  },
-  props: {
-    deviceID: {
-      type: Number,
-      required: true,
-    },
-    deviceName: {
-      type: String,
-      default: 'Elite',
-    },
-  },
-  data () {
-    return {
-    }
-  },
-  mqtt: {
-  },
-  methods: {
-    mqttPub: function (topic, mes) {
-      this.$mqtt.publish(topic, mes)
-    },
-    pageInit: function () {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-        header: 'get_device_info/0',
-        device: projectInfo.getRawDeviceID(this.deviceID),
-      }))
-    },
-    refresh: function () {
-      this.$nextTick(() => {
-        if (this.$refs.rec_ref != null) {
-          this.$refs.rec_ref.refresh()
-        }
-      })
-    },
-  },
-  mounted () {
-    this.pageInit()
-  },
-  watch: {
-    deviceID: function (val) {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-        header: 'get_device_info/0',
-        device: projectInfo.getRawDeviceID(val),
-      }))
-    },
-  },
-}
-</script>
@@ -1,247 +0,0 @@
-<template>
-  <div class="flex" >
-
-    <va-tree-root >
-      <va-tree-category
-        style="font-size: 20px;"
-        :label="'Channels'">
-        <va-tree-node>
-          <div class="row">
-            <div class="flex sm12 xl12 md12 xs12">
-              <div
-                style='display: inline-block;'
-                v-for="channel in [1, 2, 3, 4, 5, 6, 7, 8]"
-                :key="channel"
-              >
-                <va-button
-                  class="mx-1 px-1"
-                  v-if="channelList != null && channelList.indexOf(channel) >= 0"
-                  @click="channelClickRemove(channel)"
-                  small
-                >
-                  {{channel}}
-                </va-button>
-                <va-button
-                  class="mx-1 px-1"
-                  v-if="channelList == null || channelList.indexOf(channel) < 0"
-                  @click="channelClickAdd(channel)"
-                  small outline
-                >
-                  {{channel}}
-                </va-button>
-              </div>
-            </div>
-          </div>
-        </va-tree-node>
-      </va-tree-category>
-
-      <va-tree-category
-        style="font-size: 20px;"
-        :label="'Amp gain'">
-        <va-tree-node>
-          <div class="row">
-            <div class="flex sm12 xl12 md12 xs12">
-              <va-select
-                :on-change="ampGainSelectChange()"
-                :label="''"
-                v-model="ampGainSelect"
-                textBy="description"
-                :options="ampGainOptions"
-              />
-            </div>
-          </div>
-        </va-tree-node>
-      </va-tree-category>
-
-      <va-tree-category
-        style="font-size: 20px;"
-        :label="'Sample rate'">
-        <va-tree-node>
-          <div class="row">
-            <div class="flex sm12 xl12 md12 xs12">
-              <div class="flex row align--center">
-                <va-button slot="append" class="mr-2 pa-1 shrink" small @click="sampleRateChange(4)">
-                  4
-                </va-button>
-                <va-input
-                  @keyup.enter="sampleRateChange(sampleRateInput)"
-                  v-model="sampleRateInput"
-                  class="mb-0"
-                  style="width: 100px;"
-                >
-                  <p slot="append" style="margin-right: 0;" small>
-                    Hz
-                  </p>
-                </va-input>
-                <va-button slot="append" class="ml-2 pa-1 shrink" small @click="sampleRateChange(1000)">
-                  1000
-                </va-button>
-              </div>
-              <va-slider
-                @mouseup.native="sampleRateChange(sampleRate)"
-                @mouseleave.native="sampleRateChange(sampleRate)"
-                @touchend.native="sampleRateChange(sampleRate)"
-                class="flex sm12 xl12 md12 xs12"
-                value-visible
-                v-model="sampleRate"
-                :min="4"
-                :max="1000"
-              />
-            </div>
-          </div>
-        </va-tree-node>
-      </va-tree-category>
-    </va-tree-root>
-
-  </div>
-</template>
-
-<script>
-import { projectInfo } from '../../../../data/project/ProjectInfo'
-
-export default {
-  name: 'NeuliveParameterRecording',
-  components: {
-  },
-  props: {
-    deviceID: {
-      type: Number,
-      required: true,
-    },
-    deviceName: {
-      type: String,
-      default: 'Neulive',
-    },
-  },
-  data () {
-    return {
-      channelList: [],
-      ampGainSelect: null,
-      ampGainOptions: [
-        {
-          id: 0,
-          description: '25',
-        },
-        {
-          id: 1,
-          description: '100',
-        },
-        {
-          id: 2,
-          description: '400',
-        },
-        {
-          id: 3,
-          description: '800',
-        },
-      ],
-      sampleRateInput: '1000',
-      sampleRate: null,
-    }
-  },
-  mqtt: {
-  },
-  methods: {
-    mqttPub: function (topic, mes) {
-      this.$mqtt.publish(topic, mes)
-    },
-    refresh () {
-      this.channelList.length = 0
-      const channelSet = projectInfo.getDeviceInfo(this.deviceID).parameterSet.RECORDING_CH.toString(2).split('').reverse()
-      channelSet.forEach((element, index) => {
-        if (parseInt(element) > 0) {
-          this.channelList.push(index + 1)
-        }
-      })
-      this.ampGainSelect = this.ampGainOptions[(projectInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN + 1) % 4]
-      this.sampleRate = parseInt(200 / parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK / 1000))
-      this.sampleRateInput = String(this.sampleRate)
-    },
-    channelClickAdd (val) {
-      if (this.channelList.indexOf(val) < 0) {
-        this.channelList.push(val)
-
-        let channelSet = ''
-        for (let i = 8; i >= 1; i--) {
-          if (this.channelList.indexOf(i) >= 0) {
-            channelSet += '1'
-          } else {
-            channelSet += '0'
-          }
-        }
-        const channelValue = parseInt(channelSet, 2)
-
-        if (channelValue !== projectInfo.getDeviceInfo(this.deviceID).RECORDING_CH) {
-          this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-            header: 'device_parameter/0',
-            device: projectInfo.getRawDeviceID(this.deviceID),
-            parameter: 'RECORDING_CH',
-            content: channelValue,
-          }))
-        }
-      }
-    },
-    channelClickRemove (val) {
-      if (this.channelList.indexOf(val) >= 0) {
-        this.channelList.splice(this.channelList.indexOf(val), 1)
-        let channelSet = ''
-        for (let i = 8; i >= 1; i--) {
-          if (this.channelList.indexOf(i) >= 0) {
-            channelSet += '1'
-          } else {
-            channelSet += '0'
-          }
-        }
-        const channelValue = parseInt(channelSet, 2)
-        if (channelValue !== projectInfo.getDeviceInfo(this.deviceID).RECORDING_CH) {
-          this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-            header: 'device_parameter/0',
-            device: projectInfo.getRawDeviceID(this.deviceID),
-            parameter: 'RECORDING_CH',
-            content: channelValue,
-          }))
-        }
-      }
-    },
-    ampGainSelectChange () {
-      if (this.ampGainSelect != null && this.ampGainSelect.id !== ((projectInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN + 1) % 4)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
-          parameter: 'AMP_GAIN',
-          content: ((this.ampGainSelect.id + 3) % 4),
-        }))
-      }
-    },
-    sampleRateChange (val) {
-      if (this.sampleRate == null) {
-        return false
-      }
-      if (isNaN(val) || parseInt(val) > 1000 || parseInt(val) < 4) {
-        this.sampleRateInput = '1000'
-        this.sampleRate = 1000
-        return false
-      }
-      if (parseInt(this.sampleRateInput) !== this.sampleRate || this.sampleRate !== parseInt(val)) {
-        this.sampleRateInput = String(val)
-        this.sampleRate = parseInt(val)
-      }
-      if (this.sampleRate !== parseInt(200 / parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK / 1000))) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
-          parameter: 'ADC_CLOCK',
-          content: parseInt(parseFloat(1 / parseFloat(this.sampleRate / 200)) * 1000),
-        }))
-      }
-    },
-  },
-  mounted () {
-    this.refresh()
-  },
-  destroyed () {
-  },
-  watch: {
-  },
-}
-</script>
@@ -1,5 +1,5 @@
 <template>
-  <div class="project-content">
+  <div class="task-content">

    <va-modal
      v-model="showShutdownModal"
@@ -24,10 +24,10 @@
      <div v-if="showDeviceSetting" class="flex md12 xl4 xs12 sm12 area-style">
        <div class="row">
          <div class="flex sm12 xl12 md12 xs12">
-            <project-devices :ref="'devices_ref'" @add="addDevice($event)" @remove="removeDevice($event)" @refreshSetting="refreshChartSetting($event)" class="pa-0" />
+            <task-devices :ref="'devices_ref'" @add="addDevice($event)" @remove="removeDevice($event)" @refreshSetting="refreshChartSetting($event)" class="pa-0" />
          </div>
          <div class="flex sm12 xl12 md12 xs12">
-            <project-formula :ref="'formula_ref'" @add="addFormula($event)" @remove="removeFormula($event)" class="pa-0" />
+            <task-formula :ref="'formula_ref'" @add="addFormula($event)" @remove="removeFormula($event)" class="pa-0" />
          </div>
        </div>

@@ -94,24 +94,24 @@
 </template>

 <script>
-import { dataStreamBuffer } from '../../../data/project/DataStreamBuffer'
-import { chartData } from '../../../data/project/ChartsManagement'
-import { projectInfo } from '../../../data/project/ProjectInfo'
+import { dataStreamBuffer } from '../../../data/task/DataStreamBuffer'
+import { chartData } from '../../../data/task/ChartsManagement'
+import { taskInfo } from '../../../data/task/TaskInfo'
 import CanvasChart from './chart/CanvasChart'
-import ProjectDevices from './controller/ProjectDevices'
-import ProjectFormula from './formula/ProjectFormula'
+import TaskDevices from './controller/TaskDevices'
+import TaskFormula from './formula/TaskFormula'

 // TODO change chart data tag format

 export default {
-  name: 'ProjectContent',
+  name: 'TaskContent',
  components: {
    CanvasChart,
-    ProjectDevices,
-    ProjectFormula,
+    TaskDevices,
+    TaskFormula,
  },
  async created () {
-    await projectInfo.updateProjectInfo(this.$route.params.projectID)
+    await taskInfo.updateTaskInfo(this.$route.params.taskID)
  },
  data () {
    return {
@@ -124,7 +124,7 @@ export default {
      chartDataAll: chartData.getAllChartsData(),
      // chart refresh key
      chartKey: 0,
-      chartNumber: projectInfo.getProjectInfo().chartList.length,
+      chartNumber: taskInfo.getTaskInfo().chartList.length,
      selectChartID: null,
      showDeviceSetting: true,
      chartAreaClass: ['flex', 'xs12', 'sm12', 'md12', 'xl8', 'pa-0'],
@@ -132,19 +132,19 @@ export default {
  },
  mqtt: {
    async '+/get_device_info_all/+' (data, topic) {
-      await projectInfo.deviceInfo(String.fromCharCode.apply(null, data))
+      await taskInfo.deviceInfo(String.fromCharCode.apply(null, data))
      this.refreshDevicesWindow()
    },
    async '+/get_device_info/+' (data, topic) {
-      await projectInfo.deviceInfo(String.fromCharCode.apply(null, data))
+      await taskInfo.deviceInfo(String.fromCharCode.apply(null, data))
      this.refreshDevicesWindow()
    },
    async '+/device_parameter/+' (data, topic) {
-      await projectInfo.deviceParameter(String.fromCharCode.apply(null, data))
+      await taskInfo.deviceParameter(String.fromCharCode.apply(null, data))
      this.refreshDevicesWindow()
    },
    async '+/hardware_device/+' (data, topic) {
-      await projectInfo.deviceInfo(String.fromCharCode.apply(null, data))
+      await taskInfo.deviceInfo(String.fromCharCode.apply(null, data))
      if (this.$refs.devices_ref != null) {
        await this.$refs.devices_ref.loadingDone()
      }
@@ -152,19 +152,19 @@ export default {
    // listen datastream [ topic: controllerID/data_server/device_data_stream/deviceID/channel ]
    async '+/data_server/device_data_stream/+/+' (data, topic) {
      const topicSplit = topic.split('/')
-      if (!projectInfo.getDeviceInfoByRawID(parseInt(topicSplit[3])).info.isSync) {
-        projectInfo.deviceStart(parseInt(topicSplit[3]))
-        chartData.defaultChartGenerator(projectInfo.getDeviceIDByRaw(parseInt(topicSplit[3])), null, 'device')
+      if (!taskInfo.getDeviceInfoByRawID(parseInt(topicSplit[3])).info.isSync) {
+        taskInfo.deviceStart(parseInt(topicSplit[3]))
+        chartData.defaultChartGenerator(taskInfo.getDeviceIDByRaw(parseInt(topicSplit[3])), null, 'device')
      }
      dataStreamBuffer.into(String.fromCharCode.apply(null, data), parseInt(topicSplit[3]), (parseInt(topicSplit[4]) + 1))
    },
    '+/device_save_path/+' (data, topic) {
-      projectInfo.deviceSavePath(String.fromCharCode.apply(null, data))
-      console.log(projectInfo.getProjectInfo())
+      taskInfo.deviceSavePath(String.fromCharCode.apply(null, data))
+      console.log(taskInfo.getTaskInfo())
    },
    '+/device_save_path_set/+' (data, topic) {
-      projectInfo.deviceSavePath(String.fromCharCode.apply(null, data))
-      console.log(projectInfo.getProjectInfo())
+      taskInfo.deviceSavePath(String.fromCharCode.apply(null, data))
+      console.log(taskInfo.getTaskInfo())
    },
    async '+/broadcast' (data, topic) {
      const mes = String.fromCharCode.apply(null, data).split(':')
@@ -173,40 +173,45 @@ export default {
        case 'state':
          switch (mes[1]) {
            case 'device_available':
-              this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+              this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
                header: 'hardware_device/0',
              }))
              break
          }
          break
        case 'disconnected':
-          projectInfo.deviceDisconnected(mes[1])
+          taskInfo.deviceDisconnected(mes[1])
          break
        case 'connected':
-          this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
            header: 'get_device_info/0',
            device: parseInt(mes[1]),
          }))
-          projectInfo.deviceConnected(mes[1])
+          taskInfo.deviceConnected(mes[1])
          break
        case 'shutdown':
-          projectInfo.controllerShutdown()
+          taskInfo.controllerShutdown()
          this.showShutdownModal = true
          break
        case 'start':
-          projectInfo.deviceStart(parseInt(mes[1]))
+          taskInfo.deviceStart(parseInt(mes[1]))
          break
        case 'stop':
          if (mes[1] === 'all') {
            return false
          }
-          projectInfo.deviceStop(parseInt(mes[1]))
+          taskInfo.deviceStop(parseInt(mes[1]))
          break
        case 'device_timeout':
-          this.pageToast('The device [' + projectInfo.getDeviceIDByRaw(parseInt(mes[1])) + '] is timeout, please check its status or parameters.')
+          this.pageToast('The device [' + taskInfo.getDeviceIDByRaw(parseInt(mes[1])) + '] is timeout, please check its status or parameters.')
          break
        case 'device_mission_done':
-          this.pageToast('The device [' + projectInfo.getDeviceIDByRaw(parseInt(mes[1])) + '] mission is done.')
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: parseInt(mes[1]),
+            instruction: 'interrupt',
+          }))
+          this.pageToast('The device [' + taskInfo.getDeviceIDByRaw(parseInt(mes[1])) + '] mission is done.')
          break
        default:
          break
@@ -232,7 +237,7 @@ export default {
      this.mqttSub(id + '/device_parameter/+')
    },
    pageMqttUnSub: function (id) {
-      for (const device in projectInfo.getProjectInfo().deviceList) {
+      for (const device in taskInfo.getTaskInfo().deviceList) {
        this.mqttUnSub(id + '/data_server/device_data_stream/' + device + '/+')
      }
      this.mqttUnSub(id + '/hardware_device/+')
@@ -245,11 +250,11 @@ export default {
      if (await this.$refs.devices_ref != null) {
        await this.$refs.devices_ref.loadingStart()
      }
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'hardware_device/0',
      }))
-      await projectInfo.updateChartInfo()
-      this.chartNumber = projectInfo.getProjectInfo().chartNumber
+      await taskInfo.updateChartInfo()
+      this.chartNumber = taskInfo.getTaskInfo().chartNumber
    },
    pageToast: function (mes) {
      this.showToast(
@@ -367,7 +372,7 @@ export default {
      this.chartAreaClass[4] = 'xl12'
    },
    addDevice: async function (deviceID) {
-      this.mqttSub(projectInfo.getProjectInfo().controllerID + '/data_server/device_data_stream/' + projectInfo.getRawDeviceID(deviceID) + '/+')
+      this.mqttSub(taskInfo.getTaskInfo().controllerID + '/data_server/device_data_stream/' + taskInfo.getRawDeviceID(deviceID) + '/+')
      const chart = await this.addChart()
      await this.$nextTick(async () => {
        chartData.getAllChartsData()[chart].mappingID = deviceID
@@ -377,13 +382,13 @@ export default {
          })
        }
      })
-      if (projectInfo.getDeviceInfo(deviceID).info.isSync) {
+      if (taskInfo.getDeviceInfo(deviceID).info.isSync) {
        chartData.defaultChartGenerator(deviceID, chart, 'device')
      }
      this.pageToast('The device [' + deviceID + '] has been registered.')
    },
    removeDevice: function (deviceID) {
-      this.mqttUnSub(projectInfo.getProjectInfo().controllerID + '/data_server/device_data_stream/' + projectInfo.getRawDeviceID(deviceID) + '/+')
+      this.mqttUnSub(taskInfo.getTaskInfo().controllerID + '/data_server/device_data_stream/' + taskInfo.getRawDeviceID(deviceID) + '/+')
      for (const chart in chartData.getAllChartsData()) {
        if (chartData.getAllChartsData()[chart].mappingID === deviceID) {
          dataStreamBuffer.removeByChart(chart)
@@ -414,12 +419,12 @@ export default {
      this.pageToast('The formula [' + formulaID + '] has been removed.')
    },
    startAllClick: function () {
-      projectInfo.getDeviceListRegister().forEach(device => {
+      taskInfo.getDeviceListRegister().forEach(device => {
        chartData.defaultChartGenerator(device.id, null, 'device')
-        if (!projectInfo.getDeviceInfo(device.id).info.isSync) {
-          this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
            header: 'device_instruction/0',
-            device: projectInfo.getRawDeviceID(device.id),
+            device: taskInfo.getRawDeviceID(device.id),
            instruction: 'start',
          }))
          device.isSync = true
@@ -429,11 +434,11 @@ export default {
    },
    stopAllClick: function () {
      dataStreamBuffer.removeAll()
-      projectInfo.getDeviceListRegister().forEach(device => {
-        if (projectInfo.getDeviceInfo(device.id).info.isSync) {
-          this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      taskInfo.getDeviceListRegister().forEach(device => {
+        if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
            header: 'device_instruction/0',
-            device: projectInfo.getRawDeviceID(device.id),
+            device: taskInfo.getRawDeviceID(device.id),
            instruction: 'interrupt',
          }))
        }
@@ -450,14 +455,14 @@ export default {
  watch: {
  },
  async mounted () {
-    // await projectInfo.updateProjectInfo(this.$route.params.projectID)
-    console.log(projectInfo.getProjectInfo())
+    // await taskInfo.updateTaskInfo(this.$route.params.taskID)
+    console.log(taskInfo.getTaskInfo())
    // this.screenHeight = document.documentElement.clientHeight

-    this.pageMqttSub(projectInfo.getProjectInfo().controllerID)
+    this.pageMqttSub(taskInfo.getTaskInfo().controllerID)
    await this.pageInit()

-    // this.chartNumber = projectInfo.getProjectInfo().chartNumber
+    // this.chartNumber = taskInfo.getTaskInfo().chartNumber

    this.dataRefreshTimer = setInterval(this.refreshData, 700)

@@ -468,12 +473,12 @@ export default {
    // }
  },
  destroyed () {
-    projectInfo.destroyed()
+    taskInfo.destroyed()
    for (const chart in chartData.getAllChartsData()) {
      this.removeChart(chart)
    }
    clearInterval(this.dataRefreshTimer)
-    this.pageMqttUnSub(projectInfo.getProjectInfo().controllerID)
+    this.pageMqttUnSub(taskInfo.getTaskInfo().controllerID)
  },

 }
@@ -53,11 +53,11 @@
 </template>

 <script>
-// import { InitChartsData, getChartsData } from '../../../../../data/project/ChartsManagement'
+// import { InitChartsData, getChartsData } from '../../../../../data/task/ChartsManagement'
 import CanvasChartSetting from './CanvasChartSetting'
 import CanvasChartSource from './CanvasChartSource'
-import { projectInfo } from '../../../../data/project/ProjectInfo'
-import { chartData } from '../../../../data/project/ChartsManagement'
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import { chartData } from '../../../../data/task/ChartsManagement'

 export default {
  name: 'CanvasChart',
@@ -95,7 +95,7 @@ export default {
      data: chartData.getChartsData(this.chartID),
      resizeTimer: null,
      mappingSelect: '',
-      mappingOptions: projectInfo.getMappingList(),
+      mappingOptions: taskInfo.getMappingList(),
      nameCard: chartData.getAllChartsData()[this.chartID].cardName,
      initDone: false,
    }
@@ -131,7 +131,7 @@ export default {
    refreshMappingSelect: async function () {
      this.setMappingSelect(chartData.getAllChartsData()[this.chartID].mappingID)
      if (chartData.getAllChartsData()[this.chartID].mappingID !== -1 && chartData.getAllChartsData()[this.chartID].mappingID != null) {
-        projectInfo.getMappingList().forEach(item => {
+        taskInfo.getMappingList().forEach(item => {
          if (item.id === chartData.getAllChartsData()[this.chartID].mappingID) {
            this.setChartName(item.name)
          }
@@ -74,10 +74,10 @@
 </template>

 <script>
-// import { getChartsData } from '../../../../../data/project/ChartsManagement'
+// import { getChartsData } from '../../../../../data/task/ChartsManagement'

-import { projectInfo } from '../../../../data/project/ProjectInfo'
-import { chartData } from '../../../../data/project/ChartsManagement'
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import { chartData } from '../../../../data/task/ChartsManagement'

 export default {
  name: 'canvas-chart-source',
@@ -112,7 +112,7 @@ export default {
      channelSelectDisableY: true,
      deviceSelectX: '',
      deviceSelectY: '',
-      deviceOptions: projectInfo.getDeviceList(),
+      deviceOptions: taskInfo.getDeviceList(),
      sourceAddStatus: true,
    }
  },
@@ -123,10 +123,10 @@ export default {
    deviceSelectX: function () {
      const channelOptions = []
      // console.log(val)
-      if (projectInfo.getDeviceInfo(this.deviceSelectX.id) == null) {
+      if (taskInfo.getDeviceInfo(this.deviceSelectX.id) == null) {
        this.channelSelectDisableX = true
-      } else if (projectInfo.getDeviceInfo(this.deviceSelectX.id).info.library_name.indexOf('Neulive') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
+      } else if (taskInfo.getDeviceInfo(this.deviceSelectX.id).info.library_name.indexOf('Neulive') >= 0) {
+        const channelSet = taskInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
        channelSet.forEach((element, index) => {
          if (parseInt(element) > 0) {
            channelOptions.push({
@@ -136,9 +136,35 @@ export default {
            // console.log(index, element)
          }
        })
+        const axisChannelSet = taskInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.AXIS_CH.toString(2).split('').reverse()
+        axisChannelSet.forEach((element, index) => {
+          if (parseInt(element) === 1) {
+            if (index === 0) {
+              channelOptions.push({
+                id: 257,
+                channel: 'X-AXIS',
+              })
+            } else if (index === 1) {
+              channelOptions.push({
+                id: 258,
+                channel: 'Y-AXIS',
+              })
+            } else if (index === 2) {
+              channelOptions.push({
+                id: 259,
+                channel: 'Z-AXIS',
+              })
+            } else if (index === 3) {
+              channelOptions.push({
+                id: 260,
+                channel: 'M-AXIS',
+              })
+            }
+          }
+        })
        this.channelSelectDisableX = false
-      } else if (projectInfo.getDeviceInfo(this.deviceSelectX.id).info.library_name.indexOf('Elite') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.CHANNEL_LABEL
+      } else if (taskInfo.getDeviceInfo(this.deviceSelectX.id).info.library_name.indexOf('Elite') >= 0) {
+        const channelSet = taskInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.CHANNEL_LABEL
        // console.log(channelSet)
        channelSet.forEach((element, index) => {
          channelOptions.push({
@@ -158,10 +184,10 @@ export default {
    deviceSelectY: function () {
      const channelOptions = []
      // console.log(val)
-      if (projectInfo.getDeviceInfo(this.deviceSelectY.id) == null) {
+      if (taskInfo.getDeviceInfo(this.deviceSelectY.id) == null) {
        this.channelSelectDisableY = true
-      } else if (projectInfo.getDeviceInfo(this.deviceSelectY.id).info.library_name.indexOf('Neulive') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
+      } else if (taskInfo.getDeviceInfo(this.deviceSelectY.id).info.library_name.indexOf('Neulive') >= 0) {
+        const channelSet = taskInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
        console.log(channelSet)
        channelSet.forEach((element, index) => {
          if (parseInt(element) > 0) {
@@ -172,9 +198,35 @@ export default {
            // console.log(index, element)
          }
        })
+        const axisChannelSet = taskInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.AXIS_CH.toString(2).split('').reverse()
+        axisChannelSet.forEach((element, index) => {
+          if (parseInt(element) === 1) {
+            if (index === 0) {
+              channelOptions.push({
+                id: 257,
+                channel: 'X-AXIS',
+              })
+            } else if (index === 1) {
+              channelOptions.push({
+                id: 258,
+                channel: 'Y-AXIS',
+              })
+            } else if (index === 2) {
+              channelOptions.push({
+                id: 259,
+                channel: 'Z-AXIS',
+              })
+            } else if (index === 3) {
+              channelOptions.push({
+                id: 260,
+                channel: 'M-AXIS',
+              })
+            }
+          }
+        })
        this.channelSelectDisableY = false
-      } else if (projectInfo.getDeviceInfo(this.deviceSelectY.id).info.library_name.indexOf('Elite') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.CHANNEL_LABEL
+      } else if (taskInfo.getDeviceInfo(this.deviceSelectY.id).info.library_name.indexOf('Elite') >= 0) {
+        const channelSet = taskInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.CHANNEL_LABEL
        console.log(channelSet)
        channelSet.forEach((element, index) => {
          channelOptions.push({
@@ -48,11 +48,14 @@
            <div style="text-align: center;">
              <va-button @click.stop="generateChart(device)" class="pl-2 pr-2 mr-0" small>GENERATE MAPPING CHART</va-button>
            </div>
+            <div>
+              <file-control-window :ref="'fcwindow_ref'" :deviceID="device.id" class="pl-0 pr-0" />
+            </div>
            <div v-if="device.type == 'Elite'">
              <elite-parameter-window :ref="'epwindow_ref'" :deviceID="device.id" class="pl-0 pr-0" />
            </div>
            <div v-if="device.type == 'Neulive'">
-              <neulive-parameter-window :ref="'npwindow_ref'" :deviceID="device.id" class="pl-0 pr-0" />
+              <neulive-parameter-window :ref="'npwindow_ref'" :deviceID="device.id" class="pl-0 pr-0" @record="record_start(device)" @record_stop="record_stop(device)"/>
            </div>
          </div>
        </div>
@@ -65,12 +68,14 @@
 // import NeuliveParameterWindow from '../parameter/NeuliveParameterWindow'
 import EliteParameterWindow from '../parameter/EliteParameterWindow'
 import NeuliveParameterWindow from '../parameter/NeuliveParameterWindow'
+import FileControlWindow from '../meta/FileControlWindow'

 export default {
-  name: 'ProjectDeviceList',
+  name: 'TaskDeviceList',
  components: {
    EliteParameterWindow,
    NeuliveParameterWindow,
+    FileControlWindow,
  },
  props: {
    deviceList: {
@@ -96,6 +101,7 @@ export default {
      this.$emit('remove', this.selectDevice)
    },
    start: function (device) {
+      this.setArchiveSettings()
      this.$emit('start', device)
      device.stopping = false
      this.pageToast('The device ' + device.name + ' has been started.')
@@ -105,11 +111,32 @@ export default {
      this.$emit('stop', device)
      this.pageToast('The device ' + device.name + ' has been stopped.')
    },
+    record_start: function (device) {
+      this.setArchiveSettings()
+      this.$emit('record_start', device)
+      device.stopping = false
+      this.pageToast('The device ' + device.name + ' has been started.')
+    },
+    record_stop: function (device) {
+      device.stopping = true
+      this.$emit('record_stop', device)
+      this.pageToast('The device ' + device.name + ' has been stopped.')
+    },
    generateChart: function (device) {
      this.$emit('generate', device)
    },
+    setArchiveSettings: function () {
+      this.$refs.fcwindow_ref.forEach(ref => {
+        ref.setArchiveSettings()
+      })
+    },
    refresh: function () {
      this.$nextTick(() => {
+        if (this.$refs.fcwindow_ref != null) {
+          this.$refs.fcwindow_ref.forEach(ref => {
+            ref.refresh()
+          })
+        }
        if (this.$refs.epwindow_ref != null) {
          this.$refs.epwindow_ref.forEach(ref => {
            ref.refresh()
@@ -0,0 +1,255 @@
+<template>
+  <div class="flex" :class="cardclass">
+    <va-card>
+      <template slot="header">
+        <va-icon name="fa fa-bluetooth-b mr-3" color="primary"/>
+        <h5 class="mt-0 mb-0">DEVICES</h5>
+      </template>
+      <div v-if="state.LOADING" class="flex-center spinner-box mt-4 mb-5">
+        <fulfilling-bouncing-circle-spinner
+          :animation-duration="3000"
+          :color="this.$themes.primary"
+          :size="60"
+        >
+        </fulfilling-bouncing-circle-spinner>
+      </div>
+
+      <div v-else class="flex row align--center">
+        <task-device-list :ref="'pdlist_ref'" :deviceList="deviceList" @remove="removeDevice($event)" @start="startDevice($event)" @stop="stopDevice($event)" @record_start="startRecord($event)" @record_stop="stopRecord($event)" @generate="generateChart($event)" />
+
+        <div class="row flex xs12 md12 xl12 sm12 mt-2" style="text-align: center;">
+          <div class="xs10 md10 xl10 sm10">
+            <va-select
+              small
+              v-model="deviceSelect"
+              textBy="name"
+              :options="deviceOptions"
+            />
+          </div>
+          <div>
+            <va-button class="ma-0" color="primary" target="_blank" @click="addDevice(deviceSelect.id)" :disabled="deviceSelect.id == null">
+              REGISTER
+            </va-button>
+          </div>
+        </div>
+      </div>
+
+    </va-card>
+  </div>
+</template>
+
+<script>
+import { FulfillingBouncingCircleSpinner } from 'epic-spinners'
+import TaskDeviceList from './TaskDeviceList'
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import { chartData } from '../../../../data/task/ChartsManagement'
+import { dataStreamBuffer } from '../../../../data/task/DataStreamBuffer'
+
+export default {
+  name: 'TaskDevices',
+  components: {
+    FulfillingBouncingCircleSpinner,
+    TaskDeviceList,
+  },
+  props: {
+    cardclass: {
+      type: Array,
+      default: function () {
+        return ['xs12', 'md12', 'xl12', 'sm12']
+      },
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      deviceSelect: '',
+      deviceOptions: taskInfo.getDeviceListNotRegister(),
+      deviceList: taskInfo.getDeviceListRegister(),
+      state: {
+        LOADING: false,
+      },
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    sleep: async function (time) {
+      return new Promise((resolve) => setTimeout(resolve, time))
+    },
+    mqttPub: function (topic, mes) {
+      this.$mqtt.publish(topic, mes)
+    },
+    loadingStart: async function () {
+      this.state.LOADING = true
+    },
+    loadingDone: async function () {
+      this.state.LOADING = false
+      console.log(this.deviceOptions)
+      for (let i = this.deviceOptions.length - 1; i >= 0; i--) {
+        this.deviceSelect = this.deviceOptions[i]
+        await this.addDevice(this.deviceOptions[i].id)
+        // this.sleep(500).then(() => {
+        //   this.addDevice(this.deviceOptions[i].id)
+        // })
+      }
+    },
+    startDevice: async function (device) {
+      await chartData.defaultChartGenerator(device.id, null, 'device')
+      if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: taskInfo.getRawDeviceID(device.id),
+          instruction: 'record',
+          // instruction: 'start',
+        }))
+        device.isSync = true
+        this.$emit('refreshSetting')
+
+        // ### show device info
+        console.log(taskInfo.getDeviceInfo(device.id))
+      }
+    },
+    stopDevice: function (device) {
+      dataStreamBuffer.removeByDevice(taskInfo.getRawDeviceID(device.id))
+      if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: taskInfo.getRawDeviceID(device.id),
+          // instruction: 'interrupt',
+          instruction: 'stop_record',
+        }))
+      }
+      // device.isSync = false
+    },
+    startRecord: async function (device) {
+      await chartData.defaultChartGenerator(device.id, null, 'device')
+      if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+        device.isSync = true
+        this.$emit('refreshSetting')
+
+        // ### show device info
+        console.log(taskInfo.getDeviceInfo(device.id))
+      }
+    },
+    stopRecord: function (device) {
+      dataStreamBuffer.removeByDevice(taskInfo.getRawDeviceID(device.id))
+      if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+        // this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        //   header: 'device_instruction/0',
+        //   device: taskInfo.getRawDeviceID(device.id),
+        //   instruction: 'interrupt',
+        // }))
+      }
+      // device.isSync = false
+    },
+    // addDevice: async function () {
+    //   if (this.deviceSelect.id == null) {
+    //     return false
+    //   }
+    //   await taskInfo.getTaskInfo().deviceAddrList.push(taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address)
+    //   await taskInfo.getTaskInfo().taskDeviceID.push(this.deviceSelect.id)
+    //   const _address = this.GLOBAL.transMac(taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address)
+
+    //   const pic = taskInfo.getDevicePic(taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name)
+    //   let type = ''
+    //   if (taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name.indexOf('Elite') >= 0) {
+    //     type = 'Elite'
+    //   } else if (taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.library_name.indexOf('Neulive') >= 0) {
+    //     type = 'Neulive'
+    //   }
+
+    //   const _device = {
+    //     id: taskInfo.getTaskInfo().taskDeviceID.indexOf(this.deviceSelect.id),
+    //     name: '[' + taskInfo.getTaskInfo().taskDeviceID.indexOf(this.deviceSelect.id) + '] ' + taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_name,
+    //     addr: taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.device_address,
+    //     address: _address,
+    //     picture: pic,
+    //     type: type,
+    //     isSync: taskInfo.getDeviceInfoByRawID(this.deviceSelect.id).info.isSync,
+    //     stopping: false,
+    //   }
+    //   this.deviceList.push(_device)
+    //   this.deviceSelect = ''
+    //   taskInfo.updateAllList()
+    //   this.$emit('add', _device.id)
+    // },
+    addDevice: async function (selectID) {
+      if (selectID == null) {
+        return false
+      }
+
+      await taskInfo.getTaskInfo().deviceAddrList.push(taskInfo.getDeviceInfoByRawID(selectID).info.device_address)
+      await taskInfo.getTaskInfo().taskDeviceID.push(selectID)
+      const _address = this.GLOBAL.transMac(taskInfo.getDeviceInfoByRawID(selectID).info.device_address)
+
+      const pic = taskInfo.getDevicePic(taskInfo.getDeviceInfoByRawID(selectID).info.library_name)
+      let type = ''
+      if (taskInfo.getDeviceInfoByRawID(selectID).info.library_name.indexOf('Elite') >= 0) {
+        type = 'Elite'
+      } else if (taskInfo.getDeviceInfoByRawID(selectID).info.library_name.indexOf('Neulive') >= 0) {
+        type = 'Neulive'
+      }
+
+      const _device = {
+        id: taskInfo.getTaskInfo().taskDeviceID.indexOf(selectID),
+        name: '[' + taskInfo.getTaskInfo().taskDeviceID.indexOf(selectID) + '] ' + taskInfo.getDeviceInfoByRawID(selectID).info.device_name,
+        addr: taskInfo.getDeviceInfoByRawID(selectID).info.device_address,
+        address: _address,
+        picture: pic,
+        type: type,
+        isSync: taskInfo.getDeviceInfoByRawID(selectID).info.isSync,
+        stopping: false,
+      }
+      this.deviceList.push(_device)
+      this.deviceSelect = ''
+      taskInfo.updateAllList()
+      this.$emit('add', _device.id)
+    },
+    removeDevice: async function (device) {
+      taskInfo.getTaskInfo().deviceAddrList.forEach(addr => {
+        if (addr === device.addr) {
+          taskInfo.getTaskInfo().deviceAddrList.splice(taskInfo.getTaskInfo().deviceAddrList.indexOf(addr), 1)
+        }
+      })
+      taskInfo.getTaskInfo().taskDeviceID.forEach(realID => {
+        if (realID === device.id) {
+          taskInfo.getTaskInfo().taskDeviceID.splice(taskInfo.getTaskInfo().taskDeviceID.indexOf(realID), 1)
+        }
+      })
+      this.deviceList.splice(this.deviceList.indexOf(device), 1)
+      this.deviceSelect = ''
+      taskInfo.updateAllList()
+      this.$emit('remove', device.id)
+    },
+    generateChart: function (device) {
+      this.$emit('add', device.id)
+    },
+    setArchiveSettings: function () {
+      if (this.$refs.pdlist_ref != null) {
+        this.$refs.pdlist_ref.setArchiveSettings()
+      }
+    },
+    refresh: function () {
+      this.$nextTick(() => {
+        if (this.$refs.pdlist_ref != null) {
+          this.$refs.pdlist_ref.refresh()
+        }
+      })
+    },
+  },
+  async mounted () {
+    // this.pageMqttSub()
+    // for (const device in this.deviceOptions) {
+    //   this.deviceSelect = this.deviceOptions[device]
+    //   await this.addDevice()
+    // }
+  },
+  destroyed () {
+    this.loadingDone()
+    // this.pageMqttUnSub()
+  },
+  watch: {
+  },
+}
+</script>
@@ -103,11 +103,11 @@
 </template>

 <script>
-import { projectInfo } from '../../../../data/project/ProjectInfo'
-import { chartData } from '../../../../data/project/ChartsManagement'
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import { chartData } from '../../../../data/task/ChartsManagement'

 export default {
-  name: 'ProjectFormula',
+  name: 'TaskFormula',
  components: {
  },
  props: {
@@ -136,10 +136,10 @@ export default {
          isSync: false,
        },
      ],
-      formulaList: projectInfo.getFormulaList(),
+      formulaList: taskInfo.getFormulaList(),
      formulaNumber: 0,
      formulaRemoveSelect: null,
-      deviceOptions: projectInfo.getDeviceListNoTime(),
+      deviceOptions: taskInfo.getDeviceListNoTime(),
    }
  },
  mqtt: {
@@ -150,14 +150,14 @@ export default {
    },
    addFormula: function () {
      const _formula = this.formulaSelect
-      if (projectInfo.getFormulaList().length === 0) {
-        _formula.id = projectInfo.getFormulaIDStart()
+      if (taskInfo.getFormulaList().length === 0) {
+        _formula.id = taskInfo.getFormulaIDStart()
      } else {
-        _formula.id = projectInfo.getFormulaList()[projectInfo.getFormulaList().length - 1].id + 1
+        _formula.id = taskInfo.getFormulaList()[taskInfo.getFormulaList().length - 1].id + 1
      }
      _formula.name = '[' + _formula.id + '] ' + _formula.name
-      projectInfo.addFormula(_formula)
-      projectInfo.updateAllList()
+      taskInfo.addFormula(_formula)
+      taskInfo.updateAllList()
      this.formulaNumber++
      this.formulaSelect = ''
      this.$emit('add', _formula.id)
@@ -167,8 +167,8 @@ export default {
      this.showFormulaModal = true
    },
    remove: function () {
-      projectInfo.removeFormula(projectInfo.getFormulaList().indexOf(this.formulaRemoveSelect))
-      projectInfo.updateAllList()
+      taskInfo.removeFormula(taskInfo.getFormulaList().indexOf(this.formulaRemoveSelect))
+      taskInfo.updateAllList()
      this.formulaNumber--
      this.$emit('remove', this.formulaRemoveSelect.id)
    },
@@ -0,0 +1,182 @@
+<template>
+  <div class="flex mt-0 pt-0">
+    <div>
+      <div class="row flex sm12 xl12 md12 xs12">
+        <div>
+          <div class="flex">
+            <va-tree-root>
+              <div class="row pt-0 pb-0">
+                <div class="flex sm12 xl12 md12 xs12">
+                  <va-input
+                    @mouseup.native="fileNameChange(fileNameInput)"
+                    @mouseleave.native="fileNameChange(fileNameInput)"
+                    @touchend.native="fileNameChange(fileNameInput)"
+                    @keyup.enter="fileNameChange(fileNameInput)"
+                    v-model="fileNameInput"
+                    :label="'FILE NAME'"
+                    style="width: 200px;"
+                  >
+                  </va-input>
+                  <va-select
+                    :on-change="directorySelect(directory)"
+                    :label="'DIRECTORY'"
+                    v-model="directory"
+                    textBy="name"
+                    :options="directoryOptions"
+                    noClear
+                    style="width: 200px;"
+                  />
+                </div>
+              </div>
+            </va-tree-root>
+          </div>
+        </div>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import api from '../../../../data/api/index'
+
+export default {
+  name: 'FileControlWindow',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    deviceName: {
+      type: String,
+      default: 'Elite',
+    },
+    user: {
+      type: String,
+      default: 'Admin',
+    },
+  },
+  data () {
+    return {
+      fileNameInput: '',
+      directory: '',
+      directoryOptions: [],
+      deviceInfo: null,
+      enableSetting: false,
+      enableTimer: null,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    fileNameChange: function (name) {
+      if (this.enableSetting) {
+        if (name !== this.deviceInfo.info.recording_file_name) {
+          if (this.deviceInfo.info.isSync === false) {
+            this.deviceInfo.info.recording_file_name = name
+            this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+              header: 'device_recording_file_name/0',
+              device: taskInfo.getRawDeviceID(this.deviceID),
+              content: name,
+            }))
+          }
+        }
+      }
+    },
+    directorySelect: function (directoryInfo) {
+      if (this.enableSetting) {
+        if (typeof directoryInfo === 'object') {
+          if (this.deviceInfo.info.parent.folder === undefined || this.deviceInfo.info.parent.folder.indexOf(directoryInfo.id) === -1) {
+            if (this.deviceInfo.info.isSync === false) {
+              this.deviceInfo.info.parent.folder = []
+              this.deviceInfo.info.parent.folder.push(directoryInfo.id)
+              this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+                header: 'device_parent/0',
+                device: taskInfo.getRawDeviceID(this.deviceID),
+                content: {
+                  folder: [directoryInfo.id],
+                },
+              }))
+            }
+          }
+        }
+      }
+    },
+    enableChangeFile: function () {
+      this.enableSetting = true
+      this.setArchiveSettings()
+    },
+    setArchiveSettings: async function () {
+      if (this.enableSetting) {
+        if (this.deviceInfo === null) {
+          this.deviceInfo = taskInfo.getDeviceInfo(this.deviceID)
+        }
+        const now = this.getCurrentTime()
+        // filename init
+        if (this.deviceInfo.info.isSync) {
+          this.fileNameInput = this.deviceInfo.info.recording_file_name
+        } else {
+          if (this.deviceInfo.info.recording_file_name === 'recording_data' || this.deviceInfo.info.recording_file_name.split('-').length === 7) {
+            this.fileNameInput = now
+          } else {
+            this.fileNameInput = this.deviceInfo.info.recording_file_name
+          }
+        }
+
+        this.fileNameChange(this.fileNameInput)
+
+        // directory init
+        const collection = await api.getCollectionsAll()
+        this.directoryOptions = collection.data.filter(el => el.name !== 'root')
+
+        if (Object.keys(this.deviceInfo.info.parent).length === 0) {
+          this.directory = this.directoryOptions[0]
+        } else {
+          for (const directory of this.directoryOptions) {
+            if (this.deviceInfo.info.parent.folder.includes(directory.id)) {
+              this.directory = directory
+            }
+          }
+        }
+      }
+    },
+    getCurrentTime: function () {
+      const now = new Date()
+      return [now.getFullYear(), now.getMonth() + 1, now.getDate(), now.getHours(), now.getMinutes(), now.getSeconds(), this.deviceID].join('-')
+    },
+    mqttPub: function (topic, mes) {
+      this.$mqtt.publish(topic, mes)
+    },
+    pageInit: async function () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'get_device_info/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+      }))
+    },
+    refresh: function () {
+      this.$nextTick(() => {
+        this.setArchiveSettings()
+      })
+    },
+  },
+  mounted () {
+    this.pageInit()
+    this.enableTimer = setTimeout(this.enableChangeFile, 1500)
+  },
+  destroyed () {
+    clearTimeout(this.enableTimer)
+  },
+  watch: {
+    deviceID: function (val) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'get_device_info/0',
+        device: taskInfo.getRawDeviceID(val),
+      }))
+    },
+  },
+}
+</script>
@@ -790,7 +790,7 @@

 <script>

-import { projectInfo } from '../../../../data/project/ProjectInfo'
+import { taskInfo } from '../../../../data/task/TaskInfo'

 export default {
  name: 'EliteParameterRecording',
@@ -1002,52 +1002,52 @@ export default {
      this.$mqtt.publish(topic, mes)
    },
    refresh () {
-      // console.log(projectInfo.getDeviceInfo(this.deviceID).parameterSet)
-      this.workingModeSelect = this.workingModeOptions[projectInfo.getDeviceInfo(this.deviceID).parameterSet.MODE]
-      this.currentRangeSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL
-      this.startVoltNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000) * 100)
+      // console.log(taskInfo.getDeviceInfo(this.deviceID).parameterSet)
+      this.workingModeSelect = this.workingModeOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.MODE]
+      this.currentRangeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL
+      this.startVoltNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000) * 100)
      this.startVoltNumberInput = String(parseFloat(this.startVoltNumber / 100).toFixed(2))
-      this.stopVoltNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL) / 5000) * 100)
+      this.stopVoltNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL) / 5000) * 100)
      this.stopVoltNumberInput = String(parseFloat(this.stopVoltNumber / 100).toFixed(2))
-      this.stepVoltNumber = parseInt((2 + (projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP * 2)))
+      this.stepVoltNumber = parseInt((2 + (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP * 2)))
      this.stepVoltNumberInput = String(parseFloat(this.stepVoltNumber / 10).toFixed(1))
-      this.stepTimeSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STEP_TIME
-      this.cycleNoNumber = projectInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER
+      this.stepTimeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STEP_TIME
+      this.cycleNoNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER
      this.cycleNoNumberInput = String(this.cycleNoNumber)
-      this.outputVoltNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000) * 100)
+      this.outputVoltNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000) * 100)
      this.outputVoltNumberInput = String(parseFloat(this.outputVoltNumber / 100).toFixed(2))
-      this.resisterRangeSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.Resister_LEVEL
-      this.sampleRateSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE
-      this.stopVoltMaxNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000) * 100)
+      this.resisterRangeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Resister_LEVEL
+      this.sampleRateSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE
+      this.stopVoltMaxNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000) * 100)
      this.stopVoltMaxNumberInput = String(parseFloat(this.stopVoltMaxNumber / 100).toFixed(2))
-      this.stopVoltMinNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN) / 5000) * 100)
+      this.stopVoltMinNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN) / 5000) * 100)
      this.stopVoltMinNumberInput = String(parseFloat(this.stopVoltMinNumber / 100).toFixed(2))
-      this.chargeSelect = (projectInfo.getDeviceInfo(this.deviceID).parameterSet.Charge + 1) % 2
-      this.currentNumber = projectInfo.getDeviceInfo(this.deviceID).parameterSet.Const_Current_value
+      this.chargeSelect = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.Charge + 1) % 2
+      this.currentNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Const_Current_value
      this.currentNumberInput = String(parseFloat(this.currentNumber / 100).toFixed(2))

-      this.voltInitialNumber = parseInt((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL) / 5000) * 100)
+      this.voltInitialNumber = parseInt((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL) / 5000) * 100)
      this.voltInitialNumberInput = String(parseFloat(this.voltInitialNumber / 100).toFixed(2))
-      this.voltMaxNumber = Math.round((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000) * 100)
+      this.voltMaxNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000) * 100)
      this.voltMaxNumberInput = String(parseFloat(this.voltMaxNumber / 100).toFixed(2))
-      this.voltMinNumber = Math.round((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN) / 5000) * 100)
+      this.voltMinNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN) / 5000) * 100)
      this.voltMinNumberInput = String(parseFloat(this.voltMinNumber / 100).toFixed(2))
-      this.voltScanRateNumber = Math.round((0.01 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate) * 0.01) * 100)
+      this.voltScanRateNumber = Math.round((0.01 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate) * 0.01) * 100)
      this.voltScanRateNumberInput = String(parseFloat(this.voltScanRateNumber / 100).toFixed(2))
-      this.resolutionNumber = Math.round((0.1 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.Data_Resolution_Scan) * 0.1) * 100)
+      this.resolutionNumber = Math.round((0.1 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.Data_Resolution_Scan) * 0.1) * 100)
      this.resolutionNumberInput = String(parseFloat(this.resolutionNumber / 100).toFixed(2))
-      this.highCycleNoNumber = projectInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER
+      this.highCycleNoNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER
      this.highCycleNoNumberInput = String(this.highCycleNoNumber * 100)

-      this.voltEFinalNumber = Math.round((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL) / 5000) * 100)
+      this.voltEFinalNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL) / 5000) * 100)
      this.voltEFinalNumberInput = String(parseFloat(this.voltEFinalNumber / 100).toFixed(2))

-      this.voltVScanNumber = Math.round((-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN) / 5000) * 100)
+      this.voltVScanNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN) / 5000) * 100)
      this.voltVScanNumberInput = String(parseFloat(this.voltVScanNumber / 100).toFixed(2))

-      // console.log('1', projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX)
-      // console.log('2', parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000)
-      // console.log('5',(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000) * 100)
+      // console.log('1', taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX)
+      // console.log('2', parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000)
+      // console.log('5',(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000) * 100)
      // console.log('3', this.voltMaxNumberInput)
      // console.log('4', this.voltMaxNumber)
    },
@@ -1056,10 +1056,10 @@ export default {
      if (this.workingModeSelect.id === -1) {
        return false
      }
-      if (this.workingModeSelect.id !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.MODE) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.workingModeSelect.id !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.MODE) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'MODE',
          content: this.workingModeSelect.id,
        }))
@@ -1069,10 +1069,10 @@ export default {
      if (this.currentRangeSelect == null) {
        return false
      }
-      if (this.currentRangeSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.currentRangeSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'ADC_LEVEL',
          content: this.currentRangeSelect,
        }))
@@ -1100,10 +1100,10 @@ export default {
          this.startVoltNumber = val
        }
      }
-      if (parseFloat(this.startVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.startVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_ORIGIN',
          content: parseInt((parseFloat(this.startVoltNumber / 100) + 5.00) * 5000),
        }))
@@ -1131,10 +1131,10 @@ export default {
          this.stopVoltNumber = val
        }
      }
-      if (parseFloat(this.stopVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.stopVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_FINAL',
          content: parseInt((parseFloat(this.stopVoltNumber / 100) + 5.00) * 5000),
        }))
@@ -1162,10 +1162,10 @@ export default {
          this.stepVoltNumber = val
        }
      }
-      if (parseFloat(this.stepVoltNumber / 10).toFixed(1) !== parseFloat(0.2 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP) * 0.2).toFixed(1)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.stepVoltNumber / 10).toFixed(1) !== parseFloat(0.2 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP) * 0.2).toFixed(1)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_STEP',
          content: (this.stepVoltNumber - 2) / 2,
        }))
@@ -1175,10 +1175,10 @@ export default {
      if (this.stepTimeSelect == null) {
        return false
      }
-      if (this.stepTimeSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.STEP_TIME) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.stepTimeSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.STEP_TIME) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STEP_TIME',
          content: this.stepTimeSelect,
        }))
@@ -1197,10 +1197,10 @@ export default {
        this.cycleNoNumberInput = String(val)
        this.cycleNoNumber = parseInt(val)
      }
-      if (this.cycleNoNumber !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.cycleNoNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'CYCLE_NUMBER',
          content: this.cycleNoNumber,
        }))
@@ -1228,10 +1228,10 @@ export default {
          this.outputVoltNumber = val
        }
      }
-      if (parseFloat(this.outputVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.outputVoltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'DAC_VOLT',
          content: parseInt((parseFloat(this.outputVoltNumber / 100) + 5.00) * 5000),
        }))
@@ -1241,10 +1241,10 @@ export default {
      if (this.resisterRangeSelect == null) {
        return false
      }
-      if (this.resisterRangeSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.Resister_LEVEL) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.resisterRangeSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.Resister_LEVEL) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'Resister_LEVEL',
          content: this.resisterRangeSelect,
        }))
@@ -1254,10 +1254,10 @@ export default {
      if (this.sampleRateSelect == null) {
        return false
      }
-      if (this.sampleRateSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.sampleRateSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'SAMPLE_RATE',
          content: this.sampleRateSelect,
        }))
@@ -1285,10 +1285,10 @@ export default {
          this.currentNumber = val
        }
      }
-      if (this.currentNumber !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.Const_Current_value) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.currentNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.Const_Current_value) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'Const_Current_value',
          content: this.currentNumber,
        }))
@@ -1316,10 +1316,10 @@ export default {
          this.stopVoltMaxNumber = val
        }
      }
-      if (parseFloat(this.stopVoltMaxNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.stopVoltMaxNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLTSTOP_MAX',
          content: parseInt((parseFloat(this.stopVoltMaxNumber / 100) + 5.00) * 5000),
        }))
@@ -1347,10 +1347,10 @@ export default {
          this.stopVoltMinNumber = val
        }
      }
-      if (parseFloat(this.stopVoltMinNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.stopVoltMinNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLTSTOP_MIN',
          content: parseInt((parseFloat(this.stopVoltMinNumber / 100) + 5.00) * 5000),
        }))
@@ -1366,10 +1366,10 @@ export default {
      } else {
        _charge = 0
      }
-      if (_charge !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.Charge) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (_charge !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.Charge) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'Charge',
          content: _charge,
        }))
@@ -1397,10 +1397,10 @@ export default {
          this.voltInitialNumber = val
        }
      }
-      if (parseFloat(this.voltInitialNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltInitialNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_INITIAL',
          content: parseInt((parseFloat(this.voltInitialNumber / 100) + 5.00) * 5000),
        }))
@@ -1428,10 +1428,10 @@ export default {
          this.voltMaxNumber = val
        }
      }
-      if (parseFloat(this.voltMaxNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltMaxNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_MAX',
          content: parseInt((parseFloat(this.voltMaxNumber / 100) + 5.00) * 5000),
        }))
@@ -1459,10 +1459,10 @@ export default {
          this.voltMinNumber = val
        }
      }
-      if (parseFloat(this.voltMinNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltMinNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_MIN',
          content: parseInt((parseFloat(this.voltMinNumber / 100) + 5.00) * 5000),
        }))
@@ -1490,10 +1490,10 @@ export default {
          this.voltScanRateNumber = val
        }
      }
-      if (parseFloat(this.voltScanRateNumber / 100).toFixed(2) !== parseFloat(0.01 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate)).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltScanRateNumber / 100).toFixed(2) !== parseFloat(0.01 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate)).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'Scan_Rate',
          content: parseInt((parseFloat(this.voltScanRateNumber) - 0.01)),
        }))
@@ -1521,10 +1521,10 @@ export default {
          this.resolutionNumber = val
        }
      }
-      if (parseFloat(this.resolutionNumber / 100).toFixed(2) !== parseFloat(0.1 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.Data_Resolution_Scan) * 0.1).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.resolutionNumber / 100).toFixed(2) !== parseFloat(0.1 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.Data_Resolution_Scan) * 0.1).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'Data_Resolution_Scan',
          content: parseInt((parseFloat(this.resolutionNumber / 100) - 0.1) * 10),
        }))
@@ -1552,10 +1552,10 @@ export default {
          this.highCycleNoNumber = val
        }
      }
-      if (this.highCycleNoNumber !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.highCycleNoNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'CYCLE_NUMBER',
          content: this.highCycleNoNumber,
        }))
@@ -1583,10 +1583,10 @@ export default {
          this.voltEFinalNumber = val
        }
      }
-      if (parseFloat(this.voltEFinalNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltEFinalNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_EFINAL',
          content: parseInt((parseFloat(this.voltEFinalNumber / 100) + 5.00) * 5000),
        }))
@@ -1614,27 +1614,27 @@ export default {
          this.voltVScanNumber = val
        }
      }
-      if (parseFloat(this.voltVScanNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(projectInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN) / 5000).toFixed(2)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseFloat(this.voltVScanNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN) / 5000).toFixed(2)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'VOLT_VSCAN',
          content: parseInt((parseFloat(this.voltVScanNumber / 100) + 5.00) * 5000),
        }))
      }
    },
    measureEoc () {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'device_instruction/0',
-        device: projectInfo.getRawDeviceID(this.deviceID),
+        device: taskInfo.getRawDeviceID(this.deviceID),
        instruction: 'VIS_CC_ZERO',
      }))
      this.measureEocButton.status = true
    },
    measureEocStop () {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'device_instruction/0',
-        device: projectInfo.getRawDeviceID(this.deviceID),
+        device: taskInfo.getRawDeviceID(this.deviceID),
        instruction: 'interrupt',
      }))
      this.measureEocButton.status = false
@@ -0,0 +1,672 @@
+<template>
+  <div class="flex">
+    <p>UIUIUIUI15151515</p>
+    <va-tree-root>
+      <div class="row pt-0 pb-0">
+        <div class="flex sm12 xl12 md12 xs12">
+          <va-select
+            :on-change="workingModeSelectChange()"
+            :label="'WORKING MODE'"
+            v-model="workingModeSelect"
+            textBy="description"
+            :options="workingModeOptions"
+            noClear
+            style="width: 200px;"
+          />
+          <va-button
+            v-if="!measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11)"
+            color="primary"
+            target="_blank"
+            @click="measureEoc()"
+            small>
+            {{measureEocButton.start}}
+          </va-button>
+          <va-button
+            v-if="measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11)"
+            color="danger"
+            target="_blank"
+            @click="measureEocStop()"
+            small>
+            {{measureEocButton.stop}}
+          </va-button>
+        </div>
+      </div>
+
+      <!--
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
+        style="font-size: 20px;"
+        :label="'Volt test ( ' + startVoltNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'volt_test'" :deviceID="deviceID" :parameterName="'VOLT_ORIGIN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+      -->
+
+      <!-- 1.5ui -->
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1 || workingModeSelect.id == 5 || workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11 || workingModeSelect.id == 13"
+        style="font-size: 20px;"
+        :label="'Range ( ' + currentRangeOptions[currentRangeSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'currentRangeSelect'" :deviceID="deviceID" :options="currentRangeOptions" :parameterName="'ADC_LEVEL_I_15'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1 || workingModeSelect.id == 4 ||workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11 || workingModeSelect.id == 13"
+        style="font-size: 20px;"
+        :label="'Range ( ' + voltageInRangeOptions[voltageInRangeSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'voltageInRangeSelect'" :deviceID="deviceID" :options="voltageInRangeOptions" :parameterName="'ADC_LEVEL_V_IN_15'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1 || workingModeSelect.id == 2 || workingModeSelect.id == 3 || workingModeSelect.id == 4 || workingModeSelect.id == 5 || workingModeSelect.id == 6 || workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11 || workingModeSelect.id == 12"
+        style="font-size: 20px;"
+        :label="'HighZ ( ' + highzOptions[highzSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'highzSelect'" :deviceID="deviceID" :options="highzOptions" :parameterName="'CTRL_HIGH_Z_15'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 13"
+        style="font-size: 20px;"
+        :label="'Cali Channel ( ' + caliChannelOptions[caliChannelSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'caliChannelSelect'" :deviceID="deviceID" :options="caliChannelOptions" :parameterName="'ADC_DAC_CHANNEL_15'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 12"
+        style="font-size: 20px;"
+        :label="'cali Volt ( ' + caliVoltNumber + ' )'">
+        <va-tree-node>
+          <cycle-range :ref="'caliVoltNumber'" :deviceID="deviceID" :parameterName="'DAC_VOLT'" :minValue="0" :maxValue="65535" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
+        style="font-size: 20px;"
+        :label="'Volt start ( ' + startVoltNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'startVoltNumber'" :deviceID="deviceID" :parameterName="'VOLT_ORIGIN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
+        style="font-size: 20px;"
+        :label="'Volt stop ( ' + stopVoltNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'stopVoltNumber'" :deviceID="deviceID" :parameterName="'VOLT_FINAL'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
+        style="font-size: 20px;"
+        :label="'Volt step ( ' + stepVoltNumber/10 + 'mV )'">
+        <va-tree-node>
+          <milli-volt-range :ref="'stepVoltNumber'" :deviceID="deviceID" :parameterName="'VOLT_STEP'" :minValue="0.2" :maxValue="100" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
+        style="font-size: 20px;"
+        :label="'Step time ( ' + stepTimeOptions[stepTimeSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'stepTimeSelect'" :deviceID="deviceID" :options="stepTimeOptions" :parameterName="'STEP_TIME'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 2"
+        style="font-size: 20px;"
+        :label="'Volt out ( ' + outputVoltNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'outputVoltNumber'" :deviceID="deviceID" :parameterName="'DAC_VOLT'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 3 || workingModeSelect.id == 4 || workingModeSelect.id == 5"
+        style="font-size: 20px;"
+        :label="'Sample rate ( ' + sampleRateOptions[sampleRateSelect].label + ' )'">
+        <va-tree-node>
+          <level-button :ref="'sampleRateSelect'" :deviceID="deviceID" :options="sampleRateOptions" :parameterName="'SAMPLE_RATE'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        style="font-size: 20px;"
+        :label="'Charge ( ' + chargeOptions[chargeSelect].label + ' )'">
+        <va-tree-node>
+          <opp-level-button :ref="'chargeSelect'" :deviceID="deviceID" :options="chargeOptions" :parameterName="'Charge'" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        style="font-size: 20px;"
+        :label="'Current ( ' + parseFloat(currentNumber / 100) + 'μA )'">
+        <va-tree-node>
+          <micro-ampere-range :ref="'currentNumber'" :deviceID="deviceID" :parameterName="'Const_Current_value'" :minValue="0" :maxValue="15000" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        style="font-size: 20px;"
+        :label="'Volt max stop ( ' + stopVoltMaxNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'stopVoltMaxNumber'" :deviceID="deviceID" :parameterName="'VOLTSTOP_MAX'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        style="font-size: 20px;"
+        :label="'Volt min stop ( ' + stopVoltMinNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'stopVoltMinNumber'" :deviceID="deviceID" :parameterName="'VOLTSTOP_MIN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10"
+        style="font-size: 20px;"
+        :label="'E-Initial ( ' + voltInitialNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'voltInitialNumber'" :deviceID="deviceID" :parameterName="'VOLT_INITIAL'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9"
+        style="font-size: 20px;"
+        :label="'E1 ( ' + voltMaxNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'voltMaxNumber'" :deviceID="deviceID" :parameterName="'VOLT_MAX'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9"
+        style="font-size: 20px;"
+        :label="'E2 ( ' + voltMinNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'voltMinNumber'" :deviceID="deviceID" :parameterName="'VOLT_MIN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 10"
+        style="font-size: 20px;"
+        :label="'E-Final ( ' + voltEFinalNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'voltEFinalNumber'" :deviceID="deviceID" :parameterName="'VOLT_EFINAL'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 11"
+        style="font-size: 20px;"
+        :label="'VScan ( ' + voltVScanNumber/100 + 'V )'">
+        <va-tree-node>
+          <volt-range :ref="'voltVScanNumber'" :deviceID="deviceID" :parameterName="'VOLT_VSCAN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10"
+        style="font-size: 20px;"
+        :label="'ScanRate ( ' + voltScanRateNumber/100 + 'mV/s )'">
+        <va-tree-node>
+          <scan-rate-range :ref="'voltScanRateNumber'" :deviceID="deviceID" :parameterName="'Scan_Rate'" :minValue="0.01" :maxValue="1000" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11"
+        style="font-size: 20px;"
+        :label="'Resolution ( ' + resolutionNumber/10 + 'sps )'">
+        <va-tree-node>
+          <resolution-range :ref="'resolutionNumber'" :deviceID="deviceID" :parameterName="'Data_Resolution_Scan'" :minValue="0.1" :maxValue="100" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 1 || workingModeSelect.id == 8 || workingModeSelect.id == 9"
+        style="font-size: 20px;"
+        :label="'Cycle ( ' + cycleNoNumber + ' )'">
+        <va-tree-node>
+          <cycle-range :ref="'cycleNoNumber'" :deviceID="deviceID" :parameterName="'CYCLE_NUMBER'" :minValue="1" :maxValue="50000" @parameterChange="deviceParameterChange($event)" />
+        </va-tree-node>
+      </va-tree-category>
+    </va-tree-root>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../data/task/TaskInfo'
+import VoltRange from '../parameter/item/VoltRange'
+import MilliVoltRange from '../parameter/item/MilliVoltRange'
+import CycleRange from '../parameter/item/CycleRange'
+import LevelButton from '../parameter/item/LevelButton'
+import OppLevelButton from '../parameter/item/OppLevelButton'
+import MicroAmpereRange from '../parameter/item/MicroAmpereRange'
+import ScanRateRange from '../parameter/item/ScanRateRange'
+import ResolutionRange from '../parameter/item/ResolutionRange'
+
+export default {
+  name: 'EliteParameterRecordingElitezm15',
+  components: {
+    VoltRange,
+    MilliVoltRange,
+    CycleRange,
+    LevelButton,
+    OppLevelButton,
+    MicroAmpereRange,
+    ScanRateRange,
+    ResolutionRange,
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    deviceName: {
+      type: String,
+      default: 'Elite',
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      workingModeSelect: {
+        id: -1,
+        description: 'Init',
+      },
+      workingModeOptions: [
+        {
+          id: 0,
+          description: 'I-V Curve',
+        },
+        {
+          id: 1,
+          description: 'Cycle I-V',
+        },
+        {
+          id: 2,
+          description: 'Function Generator',
+        },
+        {
+          id: 3,
+          description: 'R-T Graph',
+        },
+        {
+          id: 4,
+          description: 'V-T Graph',
+        },
+        {
+          id: 5,
+          description: 'I-T Graph',
+        },
+        {
+          id: 6,
+          description: 'ADC_Test',
+        },
+        {
+          id: 7,
+          description: 'Constant Current',
+        },
+        {
+          id: 8,
+          description: 'Cyclic Voltammetry',
+        },
+        {
+          id: 9,
+          description: 'Cyclic Voltammetry-hi-cycles',
+        },
+        {
+          id: 10,
+          description: 'Linear Sweep Voltammetry',
+        },
+        {
+          id: 11,
+          description: 'Chronoamperometric Graph',
+        },
+        {
+          id: 12,
+          description: 'Cali DAC - test',
+        },
+        {
+          id: 13,
+          description: 'Cali ADC - test',
+        },
+      ],
+      currentRangeSelect: null,
+      currentRangeOptions: [
+        {
+          value: 0,
+          label: '<4 μA',
+        },
+        {
+          value: 1,
+          label: '2.5-100 μA',
+        },
+        {
+          value: 2,
+          label: '85-2050 μA',
+        },
+        {
+          value: 3,
+          label: '1800 uA',
+        },
+        {
+          value: 4,
+          label: 'Auto',
+        },
+      ],
+      voltageInRangeSelect: null,
+      voltageInRangeOptions: [
+        {
+          value: 0,
+          label: '<7 mV',
+        },
+        {
+          value: 1,
+          label: '5-300 mV',
+        },
+        {
+          value: 2,
+          label: '>250 mV',
+        },
+        {
+          value: 3,
+          label: 'Auto',
+        },
+      ],
+      caliChannelSelect: null,
+      caliChannelOptions: [
+        {
+          value: 0,
+          label: 'Iin',
+        },
+        {
+          value: 1,
+          label: 'Vin',
+        },
+      ],
+      startVoltNumber: null,
+      stopVoltNumber: null,
+      stepVoltNumber: null,
+      stepTimeSelect: null,
+      stepTimeOptions: [
+        {
+          value: 0,
+          label: '0.5s',
+        },
+        {
+          value: 1,
+          label: '1.0s',
+        },
+        {
+          value: 2,
+          label: '2.0s',
+        },
+      ],
+      cycleNoNumber: null,
+      outputVoltNumber: null,
+      sampleRateSelect: null,
+      sampleRateOptions: [
+        {
+          value: 0,
+          label: '100',
+        },
+        {
+          value: 1,
+          label: '10',
+        },
+        {
+          value: 2,
+          label: '5',
+        },
+        {
+          value: 3,
+          label: '1',
+        },
+        {
+          value: 4,
+          label: '0.1',
+        },
+        {
+          value: 5,
+          label: '0.01',
+        },
+      ],
+      chargeSelect: null,
+      chargeOptions: [
+        {
+          value: 0,
+          label: 'Charge',
+        },
+        {
+          value: 1,
+          label: 'Discharge',
+        },
+      ],
+      highzSelect: null,
+      highzOptions: [
+        {
+          value: 0,
+          label: 'On',
+        },
+        {
+          value: 1,
+          label: 'Off',
+        },
+      ],
+      currentNumber: null,
+      stopVoltMaxNumber: null,
+      stopVoltMinNumber: null,
+      voltInitialNumber: null,
+      voltMaxNumber: null,
+      voltMinNumber: null,
+      voltScanRateNumber: null,
+      resolutionNumber: null,
+      measureEocButton: {
+        start: 'Measure Eoc',
+        stop: 'Stop',
+        status: false,
+      },
+      voltEFinalNumber: null,
+      voltVScanNumber: null,
+      caliVoltNumber: null,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    mqttPub: function (topic, mes) {
+      this.$mqtt.publish(topic, mes)
+    },
+    // Array[String of Parameter Nmae, Value]
+    deviceParameterChange: function (e) {
+      console.log('e[0],e[1]', e[0], ',', e[1])
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        parameter: e[0],
+        content: e[1],
+      }))
+    },
+    refresh () {
+      this.workingModeSelect = this.workingModeOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.MODE]
+      this.currentRangeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL_I_15
+      if (this.$refs.currentRangeSelect != null) {
+        this.$refs.currentRangeSelect.updateLevelButton(this.currentRangeSelect)
+      }
+
+      this.voltageInRangeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL_V_IN_15
+      if (this.$refs.voltageInRangeSelect != null) {
+        this.$refs.voltageInRangeSelect.updateLevelButton(this.voltageInRangeSelect)
+      }
+
+      this.highzSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.CTRL_HIGH_Z_15
+      if (this.$refs.highzSelect != null) {
+        this.$refs.highzSelect.updateLevelButton(this.highzSelect)
+      }
+
+      this.caliChannelSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_DAC_CHANNEL_15
+      if (this.$refs.caliChannelSelect != null) {
+        this.$refs.caliChannelSelect.updateLevelButton(this.caliChannelSelect)
+      }
+
+      this.caliVoltNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT
+      if (this.$refs.caliVoltNumber != null) {
+        this.$refs.caliVoltNumber.updateCycleNumber(this.caliVoltNumber)
+      }
+
+      this.startVoltNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000) * 100)
+      if (this.$refs.startVoltNumber != null) {
+        this.$refs.startVoltNumber.updateVoltNumber(this.startVoltNumber)
+      }
+
+      if (this.$refs.volt_test != null) {
+        this.$refs.volt_test.updateVoltNumber(this.startVoltNumber)
+      }
+
+      this.stopVoltNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL) / 5000) * 100)
+      if (this.$refs.stopVoltNumber != null) {
+        this.$refs.stopVoltNumber.updateVoltNumber(this.stopVoltNumber)
+      }
+
+      this.stepVoltNumber = parseInt((2 + (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP * 2)))
+      if (this.$refs.stepVoltNumber != null) {
+        this.$refs.stepVoltNumber.updateStepVoltNumber(this.stepVoltNumber)
+      }
+
+      this.stepTimeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STEP_TIME
+      if (this.$refs.stepTimeSelect != null) {
+        this.$refs.stepTimeSelect.updateLevelButton(this.stepTimeSelect)
+      }
+
+      this.cycleNoNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.CYCLE_NUMBER
+      if (this.$refs.cycleNoNumber != null) {
+        this.$refs.cycleNoNumber.updateCycleNumber(this.cycleNoNumber)
+      }
+
+      this.outputVoltNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000) * 100)
+      if (this.$refs.outputVoltNumber != null) {
+        this.$refs.outputVoltNumber.updateVoltNumber(this.outputVoltNumber)
+      }
+
+      this.sampleRateSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE
+      if (this.$refs.sampleRateSelect != null) {
+        this.$refs.sampleRateSelect.updateLevelButton(this.sampleRateSelect)
+      }
+
+      this.chargeSelect = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.Charge + 1) % 2
+      if (this.$refs.chargeSelect != null) {
+        this.$refs.chargeSelect.updateLevelButton(this.chargeSelect)
+      }
+
+      this.currentNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Const_Current_value
+      if (this.$refs.currentNumber != null) {
+        this.$refs.currentNumber.updateMicroAmpereNumber(this.currentNumber)
+      }
+
+      this.stopVoltMaxNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000) * 100)
+      if (this.$refs.stopVoltMaxNumber != null) {
+        this.$refs.stopVoltMaxNumber.updateVoltNumber(this.stopVoltMaxNumber)
+      }
+
+      this.stopVoltMinNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN) / 5000) * 100)
+      if (this.$refs.stopVoltMinNumber != null) {
+        this.$refs.stopVoltMinNumber.updateVoltNumber(this.stopVoltMinNumber)
+      }
+
+      this.voltInitialNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL) / 5000) * 100)
+      if (this.$refs.voltInitialNumber != null) {
+        this.$refs.voltInitialNumber.updateVoltNumber(this.voltInitialNumber)
+      }
+
+      this.voltMaxNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX) / 5000) * 100)
+      if (this.$refs.voltMaxNumber != null) {
+        this.$refs.voltMaxNumber.updateVoltNumber(this.voltMaxNumber)
+      }
+
+      this.voltMinNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN) / 5000) * 100)
+      if (this.$refs.voltMinNumber != null) {
+        this.$refs.voltMinNumber.updateVoltNumber(this.voltMinNumber)
+      }
+
+      this.voltEFinalNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL) / 5000) * 100)
+      if (this.$refs.voltEFinalNumber != null) {
+        this.$refs.voltEFinalNumber.updateVoltNumber(this.voltEFinalNumber)
+      }
+
+      this.voltVScanNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN) / 5000) * 100)
+      if (this.$refs.voltVScanNumber != null) {
+        this.$refs.voltVScanNumber.updateVoltNumber(this.voltVScanNumber)
+      }
+
+      this.voltScanRateNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate + 1
+      if (this.$refs.voltScanRateNumber != null) {
+        this.$refs.voltScanRateNumber.updateVoltScanRateNumber(this.voltScanRateNumber)
+      }
+
+      this.resolutionNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Data_Resolution_Scan + 1
+      if (this.$refs.resolutionNumber != null) {
+        this.$refs.resolutionNumber.updateResolutionNumber(this.resolutionNumber)
+      }
+    },
+    workingModeSelectChange () {
+      if (this.workingModeSelect.id === -1) {
+        return false
+      }
+      if (this.workingModeSelect.id !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.MODE) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'MODE',
+          content: this.workingModeSelect.id,
+        }))
+      }
+    },
+    measureEoc () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'VIS_CC_ZERO',
+      }))
+      this.measureEocButton.status = true
+    },
+    measureEocStop () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'interrupt',
+      }))
+      this.measureEocButton.status = false
+    },
+  },
+  mounted () {
+    this.refresh()
+  },
+  watch: {
+  },
+  destroyed () {
+  },
+}
+</script>
@@ -0,0 +1,102 @@
+<template>
+  <div class="flex mt-0 pt-0">
+    <div>
+      <div class="row flex sm12 xl12 md12 xs12">
+
+        <div v-if="eliteVer=='1'">
+          <elite-parameter-recording :ref="'rec_ref'" :deviceID="deviceID"/>
+        </div>
+        <div v-else-if="eliteVer=='2'">
+          <elite-parameter-recording-elitezm15 :ref="'rec_ref'" :deviceID="deviceID"/>
+          <!--<elite-parameter-recording :ref="'rec_ref'" :deviceID="deviceID"/>-->
+        </div>
+        <div v-else-if="eliteVer=='3'">
+          <!--<elite-parameter-recording :ref="'rec_ref'" :deviceID="deviceID"/>-->
+        </div>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script>
+
+import EliteParameterRecording from './EliteParameterRecording'
+import EliteParameterRecordingElitezm15 from './EliteParameterRecordingElitezm15'
+import { taskInfo } from '../../../../data/task/TaskInfo'
+
+export default {
+  name: 'EliteParameterWindow',
+  components: {
+    EliteParameterRecording,
+    EliteParameterRecordingElitezm15,
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    deviceName: {
+      type: String,
+      default: 'Elite',
+    },
+  },
+  data () {
+    return {
+      eliteVer: 0,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    compareEliteVer: function (ver) {
+      if (JSON.stringify(ver.slice(0, 4)) === JSON.stringify([0, 2, 1, 5])) {
+        this.eliteVer = '1' // 1.4
+        // console.log('1:', JSON.stringify(ver.slice(0, 4)), ',', JSON.stringify([0, 2, 1, 5]))
+      } else if (JSON.stringify(ver.slice(0, 4)) === JSON.stringify([0, 2, 1, 6])) {
+        this.eliteVer = '2' // 1.5
+        // console.log('2:', JSON.stringify(ver.slice(0, 4)), ',', JSON.stringify([0, 2, 1, 6]))
+      } else if (JSON.stringify(ver.slice(0, 4)) === JSON.stringify([0, 2, 1, 7])) {
+        this.eliteVer = '3' // megafly
+        // console.log('3:', JSON.stringify(ver.slice(0, 4)), ',', JSON.stringify([0, 2, 1, 7]))
+      }
+    },
+    mqttPub: function (topic, mes) {
+      this.$mqtt.publish(topic, mes)
+      // console.log('window:1,mqttPub(topic:', topic, ',mes:', mes, ')')
+    },
+    pageInit: function () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'get_device_info/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+      }))
+
+      // console.log('window:2,pageInit(taskInfo.getDeviceInfo:', taskInfo.getDeviceInfo(this.deviceID).info.serial_number, ')')
+
+      this.compareEliteVer(taskInfo.getDeviceInfo(this.deviceID).info.serial_number)
+    },
+    refresh: function () {
+      this.$nextTick(() => {
+        if (this.$refs.rec_ref != null) {
+          this.$refs.rec_ref.refresh()
+        }
+      })
+      // console.log('window:3,refresh(this.$nextTick:', this.$nextTick, ',this.$refs:', this.$refs, ')')
+    },
+
+  },
+  mounted () {
+    this.pageInit()
+    // console.log('window:4,mounted(pageInit)')
+  },
+  watch: {
+    deviceID: function (val) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'get_device_info/0',
+        device: taskInfo.getRawDeviceID(val),
+      }))
+      // console.log('window:5,deviceID(taskInfo:', taskInfo, ')')
+    },
+  },
+}
+</script>
@@ -0,0 +1,390 @@
+<template>
+  <div class="flex" >
+    <!-- <div>
+      <div class="row sm12 xl12 md12 xs12">
+        <va-button
+          class="mx-1 px-2 mb-3"
+          color="success"
+          v-if="!recordOn"
+          @click="recordClick"
+          small
+        >
+          Record
+        </va-button>
+        <va-button
+          class="mx-1 px-2 mb-3"
+          color="danger"
+          v-else
+          @click="recordClick"
+          small
+        >
+          Stop
+        </va-button>
+      </div>
+    </div> -->
+
+    <va-tree-root >
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Channels'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div
+                style='display: inline-block;'
+                v-for="channel in [1, 2, 3, 4, 5, 6, 7, 8]"
+                :key="channel"
+              >
+                <va-button
+                  class="mx-1 px-1"
+                  v-if="channelList != null && channelList.indexOf(channel) >= 0"
+                  @click="channelClickRemove(channel)"
+                  small
+                >
+                  {{channel}}
+                </va-button>
+                <va-button
+                  class="mx-1 px-1"
+                  v-if="channelList == null || channelList.indexOf(channel) < 0"
+                  @click="channelClickAdd(channel)"
+                  small outline
+                >
+                  {{channel}}
+                </va-button>
+              </div>
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'3-AXIS'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div
+                style='display: inline-block;'
+                v-for="axisChannel in ['x','y','z','m']"
+                :key="axisChannel"
+              >
+                <va-button
+                  class="mx-1 px-1"
+                  v-if="axisChannelList != null && axisChannelList.indexOf(axisChannel) >= 0"
+                  @click="axisChannelClickRemove(axisChannel)"
+                  small
+                >
+                  {{axisChannel}}
+                </va-button>
+                <va-button
+                  class="mx-1 px-1"
+                  v-if="axisChannelList == null || axisChannelList.indexOf(axisChannel) < 0"
+                  @click="axisChannelClickAdd(axisChannel)"
+                  small outline
+                >
+                  {{axisChannel}}
+                </va-button>
+              </div>
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Amp gain'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <va-select
+                :on-change="ampGainSelectChange()"
+                :label="''"
+                v-model="ampGainSelect"
+                textBy="description"
+                :options="ampGainOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Sample rate'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div class="flex row align--center">
+                <va-button slot="append" class="mr-2 pa-1 shrink" small @click="sampleRateChange(4)">
+                  4
+                </va-button>
+                <va-input
+                  @keyup.enter="sampleRateChange(sampleRateInput)"
+                  v-model="sampleRateInput"
+                  class="mb-0"
+                  style="width: 100px;"
+                >
+                  <p slot="append" style="margin-right: 0;" small>
+                    Hz
+                  </p>
+                </va-input>
+                <va-button slot="append" class="ml-2 pa-1 shrink" small @click="sampleRateChange(1000)">
+                  1000
+                </va-button>
+              </div>
+              <va-slider
+                @mouseup.native="sampleRateChange(sampleRate)"
+                @mouseleave.native="sampleRateChange(sampleRate)"
+                @touchend.native="sampleRateChange(sampleRate)"
+                class="flex sm12 xl12 md12 xs12"
+                value-visible
+                v-model="sampleRate"
+                :min="4"
+                :max="1000"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+    </va-tree-root>
+
+  </div>
+</template>
+
+<script>
+import { taskInfo } from '../../../../data/task/TaskInfo'
+
+export default {
+  name: 'NeuliveParameterRecording',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    deviceName: {
+      type: String,
+      default: 'Neulive',
+    },
+  },
+  data () {
+    return {
+      channelList: [],
+      ampGainSelect: null,
+      ampGainOptions: [
+        {
+          id: 0,
+          description: '25',
+        },
+        {
+          id: 1,
+          description: '100',
+        },
+        {
+          id: 2,
+          description: '400',
+        },
+        {
+          id: 3,
+          description: '800',
+        },
+      ],
+      sampleRateInput: '1000',
+      sampleRate: null,
+      recordOn: false,
+      axisChannelList: [],
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    mqttPub: function (topic, mes) {
+      this.$mqtt.publish(topic, mes)
+    },
+    refresh () {
+      this.channelList.length = 0
+      const channelSet = taskInfo.getDeviceInfo(this.deviceID).parameterSet.RECORDING_CH.toString(2).split('').reverse()
+      channelSet.forEach((element, index) => {
+        if (parseInt(element) > 0) {
+          this.channelList.push(index + 1)
+        }
+      })
+      this.ampGainSelect = this.ampGainOptions[(taskInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN + 1) % 4]
+      this.sampleRate = parseInt(200 / parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK / 1000))
+      this.sampleRateInput = String(this.sampleRate)
+      this.recordOn = taskInfo.getDeviceInfo(this.deviceID).parameterSet.RECORDING
+      this.axisChannelList.length = 0
+      const axisChannelSet = taskInfo.getDeviceInfo(this.deviceID).parameterSet.AXIS_CH.toString(2).split('').reverse()
+      axisChannelSet.forEach((element, index) => {
+        if (parseInt(element) === 1) {
+          if (index === 0) {
+            this.axisChannelList.push('x')
+          } else if (index === 1) {
+            this.axisChannelList.push('y')
+          } else if (index === 2) {
+            this.axisChannelList.push('z')
+          } else if (index === 3) {
+            this.axisChannelList.push('m')
+          }
+        }
+      })
+    },
+    channelClickAdd (val) {
+      if (this.channelList.indexOf(val) < 0) {
+        this.channelList.push(val)
+
+        let channelSet = ''
+        for (let i = 11; i >= 1; i--) {
+          if (this.channelList.indexOf(i) >= 0) {
+            channelSet += '1'
+          } else {
+            channelSet += '0'
+          }
+        }
+        const channelValue = parseInt(channelSet, 2)
+
+        if (channelValue !== taskInfo.getDeviceInfo(this.deviceID).RECORDING_CH) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_parameter/0',
+            device: taskInfo.getRawDeviceID(this.deviceID),
+            parameter: 'RECORDING_CH',
+            content: channelValue,
+          }))
+        }
+      }
+    },
+    channelClickRemove (val) {
+      if (this.channelList.indexOf(val) >= 0) {
+        this.channelList.splice(this.channelList.indexOf(val), 1)
+        let channelSet = ''
+        for (let i = 11; i >= 1; i--) {
+          if (this.channelList.indexOf(i) >= 0) {
+            channelSet += '1'
+          } else {
+            channelSet += '0'
+          }
+        }
+        const channelValue = parseInt(channelSet, 2)
+        if (channelValue !== taskInfo.getDeviceInfo(this.deviceID).RECORDING_CH) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_parameter/0',
+            device: taskInfo.getRawDeviceID(this.deviceID),
+            parameter: 'RECORDING_CH',
+            content: channelValue,
+          }))
+        }
+      }
+    },
+    ampGainSelectChange () {
+      if (this.ampGainSelect != null && this.ampGainSelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN + 1) % 4)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'AMP_GAIN',
+          content: ((this.ampGainSelect.id + 3) % 4),
+        }))
+      }
+    },
+    sampleRateChange (val) {
+      if (this.sampleRate == null) {
+        return false
+      }
+      if (isNaN(val) || parseInt(val) > 1000 || parseInt(val) < 4) {
+        this.sampleRateInput = '1000'
+        this.sampleRate = 1000
+        return false
+      }
+      if (parseInt(this.sampleRateInput) !== this.sampleRate || this.sampleRate !== parseInt(val)) {
+        this.sampleRateInput = String(val)
+        this.sampleRate = parseInt(val)
+      }
+      if (this.sampleRate !== parseInt(200 / parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK / 1000))) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'ADC_CLOCK',
+          content: parseInt(parseFloat(1 / parseFloat(this.sampleRate / 200)) * 1000),
+        }))
+      }
+    },
+    recordClick () {
+      this.recordOn = !this.recordOn
+      if (this.recordOn) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          instruction: 'record',
+        }))
+        this.$emit('record')
+      } else {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          instruction: 'stop_record',
+        }))
+        this.$emit('record_stop')
+      }
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        parameter: 'RECORDING',
+        content: this.recordOn,
+      }))
+    },
+    axisChannelClickAdd (val) {
+      if (this.axisChannelList.indexOf(val) < 0) {
+        const axisChannel = ['m', 'z', 'y', 'x']
+        this.axisChannelList.push(val)
+        let axisChannelSet = ''
+        for (const axis of axisChannel) {
+          if (this.axisChannelList.indexOf(axis) >= 0) {
+            axisChannelSet += '1'
+          } else {
+            axisChannelSet += '0'
+          }
+        }
+        const axisChannelValue = parseInt(axisChannelSet, 2)
+        if (axisChannelValue !== taskInfo.getDeviceInfo(this.deviceID).AXIS_CH) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_parameter/0',
+            device: taskInfo.getRawDeviceID(this.deviceID),
+            parameter: 'AXIS_CH',
+            content: axisChannelValue,
+          }))
+        }
+      }
+    },
+    axisChannelClickRemove (val) {
+      if (this.axisChannelList.indexOf(val) >= 0) {
+        const axisChannel = ['m', 'z', 'y', 'x']
+        this.axisChannelList.splice(this.axisChannelList.indexOf(val), 1)
+        let axisChannelSet = ''
+        for (const axis of axisChannel) {
+          if (this.axisChannelList.indexOf(axis) >= 0) {
+            axisChannelSet += '1'
+          } else {
+            axisChannelSet += '0'
+          }
+        }
+        const axisChannelValue = parseInt(axisChannelSet, 2)
+        if (axisChannelValue !== taskInfo.getDeviceInfo(this.deviceID).AXIS_CH) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_parameter/0',
+            device: taskInfo.getRawDeviceID(this.deviceID),
+            parameter: 'AXIS_CH',
+            content: axisChannelValue,
+          }))
+        }
+      }
+    },
+  },
+  mounted () {
+    this.refresh()
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -332,7 +332,7 @@
 </template>

 <script>
-import { projectInfo } from '../../../../data/project/ProjectInfo'
+import { taskInfo } from '../../../../data/task/TaskInfo'

 export default {
  name: 'NeuliveParameterStimulation',
@@ -444,11 +444,11 @@ export default {
      this.$mqtt.publish(topic, mes)
    },
    refresh () {
-      this.stimulationOn = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STIMULATING
+      this.stimulationOn = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STIMULATING

      // stichannel (+,-), stiPolarity (+)
-      const stiChannelSet = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CHANNEL.toString(2).split('').reverse()
-      const stiPolaritySet = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_POLARITY.toString(2).split('').reverse()
+      const stiChannelSet = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CHANNEL.toString(2).split('').reverse()
+      const stiPolaritySet = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_POLARITY.toString(2).split('').reverse()

      // if (stiPolaritySet.length >= stiChannelSet.length) {
      this.posChannelList.length = 0
@@ -467,22 +467,22 @@ export default {
      // console.log('pol',stiPolaritySet)
      // console.log('pos',this.posChannelList)
      // console.log('neg',this.negChannelList)
-      this.stimulateElectrodeSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_H_BRIDGE ? 1 : 0
-      this.cycleNumberSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.CONTINUOUS_STI ? 1 : 0
-      this.cycleNumber = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CYCLE_LIST[0]
+      this.stimulateElectrodeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_H_BRIDGE ? 1 : 0
+      this.cycleNumberSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.CONTINUOUS_STI ? 1 : 0
+      this.cycleNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CYCLE_LIST[0]
      this.cycleNumberInput = String(this.cycleNumber)
-      this.cycleNumberArray = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CYCLE_LIST
-      this.amplitudeNumber = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_AMPLITUDE * 5
+      this.cycleNumberArray = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_CYCLE_LIST
+      this.amplitudeNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_AMPLITUDE * 5
      this.amplitudeNumberInput = String(this.amplitudeNumber)

-      this.patternModeSelect = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_PATTERN ? 1 : 0
-      this.t1Range = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T1[0]
+      this.patternModeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_PATTERN ? 1 : 0
+      this.t1Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T1[0]
      this.t1RangeInput = String((this.t1Range * 10) / this.unitMultiply)
-      this.t2Range = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T2[0]
+      this.t2Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T2[0]
      this.t2RangeInput = String((this.t2Range * 10) / this.unitMultiply)
-      this.t3Range = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T3[0]
+      this.t3Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T3[0]
      this.t3RangeInput = String((this.t3Range * 10) / this.unitMultiply)
-      this.t4Range = projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T4[0]
+      this.t4Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T4[0]
      this.t4RangeInput = String((this.t4Range * 10) / this.unitMultiply)

      if (this.pattternModeSelect === 0) {
@@ -499,10 +499,10 @@ export default {
      // console.log('STI_CONTINUOUS', this.cycleNumberSelect)
      // console.log('STI_H_BRIDGE', this.stimulateElectrodeSelect)
      // console.log('STI_PATTERN', this.patternModeSelect)
-      // console.log('STI_T1', projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T1[0])
-      // console.log('STI_T2', projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T2[0])
-      // console.log('STI_T3', projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T3[0])
-      // console.log('STI_T4', projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T4[0])
+      // console.log('STI_T1', taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T1[0])
+      // console.log('STI_T2', taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T2[0])
+      // console.log('STI_T3', taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T3[0])
+      // console.log('STI_T4', taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T4[0])
      // console.log(this.periodNumber)
      // console.log(this.periodNumberInput)
      // console.log(this.frequencyNumber)
@@ -521,21 +521,21 @@ export default {
    stimulateClick () {
      this.stimulationOn = !this.stimulationOn
      if (this.stimulationOn) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_instruction/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          instruction: 'stimulate',
        }))
      } else {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_instruction/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          instruction: 'stop_stimulate',
        }))
      }
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'device_parameter/0',
-        device: projectInfo.getRawDeviceID(this.deviceID),
+        device: taskInfo.getRawDeviceID(this.deviceID),
        parameter: 'STIMULATING',
        content: this.stimulationOn,
      }))
@@ -544,10 +544,10 @@ export default {
      if (this.stimulateElectrodeSelect == null) {
        return false
      }
-      if (this.stimulateElectrodeSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_H_BRIDGE) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.stimulateElectrodeSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_H_BRIDGE) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_H_BRIDGE',
          content: this.stimulateElectrodeSelect,
        }))
@@ -568,10 +568,10 @@ export default {
      if (this.cycleNumberSelect == null) {
        return false
      }
-      if (this.cycleNumberSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.CONTINUOUS_STI) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.cycleNumberSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.CONTINUOUS_STI) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'CONTINUOUS_STI',
          content: this.cycleNumberSelect,
        }))
@@ -587,9 +587,9 @@ export default {

      if (this.cycleNumberArray[0] !== this.cycleNumber) {
        this.cycleNumberArray.fill(this.cycleNumber, 0)
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_CYCLE_LIST',
          content: '0:9=' + this.cycleNumberArray.toString(),
        }))
@@ -617,10 +617,10 @@ export default {
          this.amplitudeNumber = val
        }
      }
-      if (parseInt(this.amplitudeNumber / 5) !== parseInt(projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_AMPLITUDE)) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (parseInt(this.amplitudeNumber / 5) !== parseInt(taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_AMPLITUDE)) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_AMPLITUDE',
          content: parseInt(this.amplitudeNumber / 5),
        }))
@@ -643,10 +643,10 @@ export default {
        this.t4Range = (this.periodNumber / 10) - this.t1Range - this.t2Range - this.t3Range
        this.t4RangeInput = String((this.t4Range * 10) / this.unitMultiply)
      }
-      if (this.patternModeSelect !== projectInfo.getDeviceInfo(this.deviceID).parameterSet.STI_PATTERN) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (this.patternModeSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_PATTERN) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_PATTERN',
          content: this.patternModeSelect,
        }))
@@ -768,18 +768,18 @@ export default {
      const stiChannelValue = parseInt(stiChannelSet, 2)
      const stiPolarityValue = parseInt(stiPolaritySet, 2)

-      if (stiChannelValue !== projectInfo.getDeviceInfo(this.deviceID).STI_CHANNEL) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (stiChannelValue !== taskInfo.getDeviceInfo(this.deviceID).STI_CHANNEL) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_CHANNEL',
          content: stiChannelValue,
        }))
      }
-      if (stiPolarityValue !== projectInfo.getDeviceInfo(this.deviceID).STI_POLARITY) {
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      if (stiPolarityValue !== taskInfo.getDeviceInfo(this.deviceID).STI_POLARITY) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_POLARITY',
          content: stiPolarityValue,
        }))
@@ -788,36 +788,36 @@ export default {
    updateTimeRange () {
      if (this.t1RangeArray[0] !== this.t1Range) {
        this.t1RangeArray.fill(this.t1Range, 0)
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_T1',
          content: '0:9=' + String(this.t1RangeArray),
        }))
      }
      if (this.t2RangeArray[0] !== this.t2Range) {
        this.t2RangeArray.fill(this.t2Range, 0)
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_T2',
          content: '0:9=' + String(this.t2RangeArray),
        }))
      }
      if (this.t3RangeArray[0] !== this.t3Range) {
        this.t3RangeArray.fill(this.t3Range, 0)
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_T3',
          content: '0:9=' + String(this.t3RangeArray),
        }))
      }
      if (this.t4RangeArray[0] !== this.t4Range) {
        this.t4RangeArray.fill(this.t4Range, 0)
-        this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
          header: 'device_parameter/0',
-          device: projectInfo.getRawDeviceID(this.deviceID),
+          device: taskInfo.getRawDeviceID(this.deviceID),
          parameter: 'STI_T4',
          content: '0:9=' + String(this.t4RangeArray),
        }))
@@ -7,7 +7,7 @@
        :label="'RECORDING'"
      >
        <va-tree-node>
-          <neulive-parameter-recording :ref="'rec_ref'" :deviceID="deviceID"/>
+          <neulive-parameter-recording :ref="'rec_ref'" :deviceID="deviceID" @record="start()" @record_stop="stop()"/>
        </va-tree-node>
      </va-tree-category>
      <va-tree-category
@@ -23,7 +23,7 @@
 </template>

 <script>
-import { projectInfo } from '../../../../data/project/ProjectInfo'
+import { taskInfo } from '../../../../data/task/TaskInfo'
 import NeuliveParameterRecording from './NeuliveParameterRecording'
 import NeuliveParameterStimulation from './NeuliveParameterStimulation'

@@ -54,9 +54,9 @@ export default {
      this.$mqtt.publish(topic, mes)
    },
    pageInit: function () {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'get_device_info/0',
-        device: projectInfo.getRawDeviceID(this.deviceID),
+        device: taskInfo.getRawDeviceID(this.deviceID),
      }))
    },
    loadingState: function (state) {
@@ -72,15 +72,21 @@ export default {
        }
      })
    },
+    start: function () {
+      this.$emit('record')
+    },
+    stop: function () {
+      this.$emit('record_stop')
+    },
  },
  mounted () {
    this.pageInit()
  },
  watch: {
    deviceID: function (val) {
-      this.mqttPub(projectInfo.getProjectInfo().controllerID + '_user', JSON.stringify({
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
        header: 'get_device_info/0',
-        device: projectInfo.getRawDeviceID(val),
+        device: taskInfo.getRawDeviceID(val),
      }))
    },
  },
@@ -0,0 +1,104 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="cycleNumberChange(minValue)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="cycleNumberChange(cycleNoNumberInput)"
+          @blur="cycleNumberChange(cycleNoNumberInput)"
+          v-model="cycleNoNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="cycleNumberChange(maxValue)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="cycleNumberChange(cycleNoNumber)"
+        @mouseleave.native="cycleNumberChange(cycleNoNumber)"
+        @touchend.native="cycleNumberChange(cycleNoNumber)"
+        @click.native="cycleNumberChange(cycleNoNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        value-visible
+        v-model="cycleNoNumber"
+        :min="minValue"
+        :max="maxValue"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'CycleRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: 1,
+    },
+    maxValue: {
+      type: Number,
+      default: 250,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      cycleNoNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+      cycleNoNumberInput: String(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    cycleNumberChange (val) {
+      this.inputeKey++
+      if (this.cycleNoNumber == null) {
+        return false
+      }
+      if (isNaN(val) || parseInt(val) > this.maxValue || parseInt(val) < this.minValue) {
+        this.cycleNoNumber = String(this.minValue)
+        this.cycleNoNumberInput = this.minValue
+        return false
+      }
+      if (parseInt(this.cycleNoNumberInput) !== this.cycleNoNumber || this.cycleNoNumber !== parseInt(val)) {
+        this.cycleNoNumberInput = String(val)
+        this.cycleNoNumber = parseInt(val)
+      }
+      if (this.cycleNoNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, this.cycleNoNumber])
+      }
+    },
+    updateCycleNumber (val) {
+      this.cycleNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+
+  },
+}
+
+</script>
@@ -0,0 +1,71 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <va-button-toggle
+        @click.native="levelButtonSelectChange(levelButtonSelect)"
+        small
+        outline
+        v-model="levelButtonSelect"
+        :options="options"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'LevelButton',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    options: {
+      type: Array,
+      required: true,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      levelButtonSelect: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    levelButtonSelectChange (val) {
+      if (this.levelButtonSelect == null) {
+        return false
+      }
+
+      this.levelButtonSelect = val
+
+      if (this.levelButtonSelect !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, this.levelButtonSelect])
+      }
+    },
+    updateLevelButton (val) {
+      this.levelButtonSelectChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+
+  },
+}
+
+</script>
@@ -0,0 +1,113 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="currentNumberChange(minValue*100)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="currentNumberChange(currentNumberInput)"
+          @blur="currentNumberChange(currentNumberInput)"
+          v-model="currentNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            μA
+          </p>
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="currentNumberChange(maxValue*100)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="currentNumberChange(currentNumber)"
+        @mouseleave.native="currentNumberChange(currentNumber)"
+        @touchend.native="currentNumberChange(currentNumber)"
+        @click.native="currentNumberChange(currentNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        v-model="currentNumber"
+        :min="minValue*100"
+        :max="maxValue*100"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'MicroAmpereRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: 0.2,
+    },
+    maxValue: {
+      type: Number,
+      default: 100,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      currentNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+      currentNumberInput: String(parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] / 100).toFixed(2)),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    currentNumberChange (val) {
+      this.inputeKey++
+      if (this.currentNumber == null) {
+        return false
+      }
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || parseFloat(val) > this.maxValue * 100 || parseFloat(val) < this.minValue * 100) {
+          this.currentNumberInput = '0.00'
+          this.currentNumber = 0
+        }
+        if (parseFloat(this.currentNumberInput) !== parseFloat(this.currentNumber / 100)) {
+          this.currentNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+        }
+      } else {
+        if (isNaN(val) || parseFloat(val) > this.maxValue * 100 || parseFloat(val) < this.minValue * 100) {
+          this.currentNumberInput = '0.00'
+          this.currentNumber = 0
+        }
+        if (parseFloat(this.currentNumberInput) !== parseFloat(this.currentNumber / 100) || this.currentNumber !== val) {
+          this.currentNumberInput = String(parseFloat(val / 100).toFixed(2))
+          this.currentNumber = val
+        }
+      }
+      if (this.currentNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, this.currentNumber])
+      }
+    },
+    updateMicroAmpereNumber (val) {
+      this.currentNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -0,0 +1,113 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="stepVoltNumberChange(minValue*10)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="stepVoltNumberChange(voltNumberInput)"
+          @blur="stepVoltNumberChange(voltNumberInput)"
+          v-model="voltNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            mV
+          </p>
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="stepVoltNumberChange(maxValue*10)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="stepVoltNumberChange(voltNumber)"
+        @mouseleave.native="stepVoltNumberChange(voltNumber)"
+        @touchend.native="stepVoltNumberChange(voltNumber)"
+        @click.native="stepVoltNumberChange(voltNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        v-model="voltNumber"
+        :min="minValue*10"
+        :max="maxValue*10"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'MilliVoltRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: 0.2,
+    },
+    maxValue: {
+      type: Number,
+      default: 100,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      voltNumber: parseInt(2 + (taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] * 2)),
+      voltNumberInput: String(parseFloat(parseInt(2 + (taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] * 2)) / 10).toFixed(1)),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    stepVoltNumberChange (val) {
+      this.inputeKey++
+      if (this.voltNumber == null) {
+        return false
+      }
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || parseFloat(val) > 100 || parseFloat(val) < 0.2) {
+          this.voltNumberInput = '0.2'
+          this.voltNumber = 2
+        }
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 10)) {
+          this.voltNumber = parseInt(parseFloat(val).toFixed(1) * 10)
+        }
+      } else {
+        if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 2) {
+          this.voltNumberInput = '0.2'
+          this.voltNumber = 2
+        }
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 10) || this.voltNumber !== val) {
+          this.voltNumberInput = String(parseFloat(val / 10).toFixed(1))
+          this.voltNumber = val
+        }
+      }
+      if (parseFloat(this.voltNumber / 10).toFixed(1) !== parseFloat(0.2 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) * 0.2).toFixed(1)) {
+        this.$emit('parameterChange', [this.parameterName, (this.voltNumber - 2) / 2])
+      }
+    },
+    updateStepVoltNumber (val) {
+      this.stepVoltNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -0,0 +1,78 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <va-button-toggle
+        @click.native="levelButtonSelectChange(levelButtonSelect)"
+        small
+        outline
+        v-model="levelButtonSelect"
+        :options="options"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'LevelButton',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    options: {
+      type: Array,
+      required: true,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      levelButtonSelect: (taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1) % 2,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    levelButtonSelectChange (val) {
+      if (this.levelButtonSelect == null) {
+        return false
+      }
+
+      this.levelButtonSelect = val
+      let _charge
+
+      if (this.levelButtonSelect === 0) {
+        _charge = 1
+      } else {
+        _charge = 0
+      }
+
+      if (_charge !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, _charge])
+      }
+    },
+    updateLevelButton (val) {
+      this.levelButtonSelectChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+
+  },
+}
+
+</script>
@@ -0,0 +1,113 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="resolutionNumberChange(minValue*10)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="resolutionNumberChange(resolutionNumberInput)"
+          @blur="resolutionNumberChange(resolutionNumberInput)"
+          v-model="resolutionNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            sps
+          </p>
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="resolutionNumberChange(maxValue*10)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="resolutionNumberChange(resolutionNumber)"
+        @mouseleave.native="resolutionNumberChange(resolutionNumber)"
+        @touchend.native="resolutionNumberChange(resolutionNumber)"
+        @click.native="resolutionNumberChange(resolutionNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        v-model="resolutionNumber"
+        :min="minValue*10"
+        :max="maxValue*10"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'ResolutionRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: 0.2,
+    },
+    maxValue: {
+      type: Number,
+      default: 100,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      resolutionNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1,
+      resolutionNumberInput: String(((taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1) / 100).toFixed(2)),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    resolutionNumberChange (val) {
+      this.inputeKey++
+      if (this.resolutionNumber == null) {
+        return false
+      }
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || parseFloat(val) > 100 || parseFloat(val) < 0.1) {
+          this.resolutionNumberInput = '0.1'
+          this.resolutionNumber = 1
+        }
+        if (parseFloat(this.resolutionNumberInput) !== parseFloat(this.resolutionNumber / 100)) {
+          this.resolutionNumber = parseInt(parseFloat(val).toFixed(2) * 10)
+        }
+      } else {
+        if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 1) {
+          this.resolutionNumberInput = '0.1'
+          this.resolutionNumber = 1
+        }
+        if (parseFloat(this.resolutionNumberInput) !== parseFloat(this.resolutionNumber / 10) || this.resolutionNumber !== val) {
+          this.resolutionNumberInput = String(parseFloat(val / 10))
+          this.resolutionNumber = val
+        }
+      }
+      if ((this.resolutionNumber) !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1) {
+        this.$emit('parameterChange', [this.parameterName, this.resolutionNumber - 1])
+      }
+    },
+    updateResolutionNumber (val) {
+      this.resolutionNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -0,0 +1,113 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="voltScanRateNumberChange(minValue*100)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="voltScanRateNumberChange(voltScanRateNumberInput)"
+          @blur="voltScanRateNumberChange(voltScanRateNumberInput)"
+          v-model="voltScanRateNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            mV
+          </p>
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="voltScanRateNumberChange(maxValue*100)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="voltScanRateNumberChange(voltScanRateNumber)"
+        @mouseleave.native="voltScanRateNumberChange(voltScanRateNumber)"
+        @touchend.native="voltScanRateNumberChange(voltScanRateNumber)"
+        @click.native="voltScanRateNumberChange(voltScanRateNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        v-model="voltScanRateNumber"
+        :min="minValue*100"
+        :max="maxValue*100"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'MicroAmpereRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: 0.2,
+    },
+    maxValue: {
+      type: Number,
+      default: 100,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      voltScanRateNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1,
+      voltScanRateNumberInput: String(((taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate + 1) / 100).toFixed(2)),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    voltScanRateNumberChange (val) {
+      this.inputeKey++
+      if (this.voltScanRateNumber == null) {
+        return false
+      }
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 0.01) {
+          this.voltScanRateNumberInput = '0.01'
+          this.voltScanRateNumber = 1
+        }
+        if (parseFloat(this.voltScanRateNumberInput) !== parseFloat(this.voltScanRateNumber / 100)) {
+          this.voltScanRateNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+        }
+      } else {
+        if (isNaN(val) || parseFloat(val) > 100000 || parseFloat(val) < 1) {
+          this.voltScanRateNumberInput = '0.01'
+          this.voltScanRateNumber = 1
+        }
+        if (parseFloat(this.voltScanRateNumberInput) !== parseFloat(this.voltScanRateNumber / 100) || this.voltScanRateNumber !== val) {
+          this.voltScanRateNumberInput = String(parseFloat(val / 100))
+          this.voltScanRateNumber = val
+        }
+      }
+      if (this.voltScanRateNumber !== parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) + 1) {
+        this.$emit('parameterChange', [this.parameterName, this.voltScanRateNumber - 1])
+      }
+    },
+    updateVoltScanRateNumber (val) {
+      this.voltScanRateNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -0,0 +1,113 @@
+<template>
+  <div class="row">
+    <div class="flex sm12 xl12 md12 xs12">
+      <div class="flex row align--center" :key="inputeKey">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="voltNumberChange(minValue*100)">
+          {{ minValue }}
+        </va-button>
+        <va-input
+          @keyup.enter="voltNumberChange(voltNumberInput)"
+          @blur="voltNumberChange(voltNumberInput)"
+          v-model="voltNumberInput"
+          class="mb-0"
+          style="width: 100px;"
+        >
+          <p slot="append" style="margin-right: 0;" small>
+            V
+          </p>
+        </va-input>
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="voltNumberChange(maxValue*100)">
+          {{ maxValue }}
+        </va-button>
+      </div>
+      <va-slider
+        @mouseup.native="voltNumberChange(voltNumber)"
+        @mouseleave.native="voltNumberChange(voltNumber)"
+        @touchend.native="voltNumberChange(voltNumber)"
+        @click.native="voltNumberChange(voltNumber)"
+        class="flex sm12 xl12 md12 xs12"
+        v-model="voltNumber"
+        :min="minValue*100"
+        :max="maxValue*100"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { taskInfo } from '../../../../../data/task/TaskInfo'
+
+export default {
+  name: 'VoltRange',
+  components: {
+  },
+  props: {
+    deviceID: {
+      type: Number,
+      required: true,
+    },
+    parameterName: {
+      type: String,
+      required: true,
+    },
+    minValue: {
+      type: Number,
+      default: -5,
+    },
+    maxValue: {
+      type: Number,
+      default: 5,
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+      inputeKey: 0,
+      voltNumber: Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) / 5000) * 100),
+      voltNumberInput: String(parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) / 5000).toFixed(2)),
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    voltNumberChange (val) {
+      this.inputeKey++
+      if (this.voltNumber == null) {
+        return false
+      }
+      if (typeof (val) === 'string') {
+        if (isNaN(val) || parseFloat(val) > 5 || parseFloat(val) < -5) {
+          this.voltNumberInput = '0.00'
+          this.voltNumber = 0
+        }
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 100)) {
+          this.voltNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+        }
+      } else {
+        if (isNaN(val) || parseFloat(val) > 500 || parseFloat(val) < -500) {
+          this.voltNumberInput = '0.00'
+          this.voltNumber = 0
+        }
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 100) || this.voltNumber !== val) {
+          this.voltNumberInput = String(parseFloat(val / 100).toFixed(2))
+          this.voltNumber = val
+        }
+      }
+      if (parseFloat(this.voltNumber / 100).toFixed(2) !== parseFloat(-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) / 5000).toFixed(2)) {
+        this.$emit('parameterChange', [this.parameterName, parseInt((parseFloat(this.voltNumber / 100) + 5.00) * 5000)])
+      }
+    },
+    updateVoltNumber (val) {
+      this.voltNumberChange(val)
+    },
+  },
+  async mounted () {
+  },
+  destroyed () {
+  },
+  watch: {
+  },
+}
+</script>
@@ -1,669 +0,0 @@
-
-import { projectInfo } from './ProjectInfo'
-
-// generate x axis format
-function makeXAxis (gridIndex, type) {
-  return {
-    type: type,
-    gridIndex: gridIndex,
-    axisLine: { onZero: false, lineStyle: { color: '#aaa' } },
-    axisTick: { show: false },
-    axisLabel: { show: true, showMinLabel: false, showMaxLabel: false, color: '#aaa' },
-    splitLine: { show: false, lineStyle: { color: '#ddd' } },
-    scale: true,
-    min: null,
-    max: null,
-  }
-}
-
-// generate y axis format
-function makeYAxis (gridIndex, type) {
-  return {
-    type: type,
-    gridIndex: gridIndex,
-    axisTick: { show: false },
-    axisLine: { show: false }, // color: '#ccc' } },
-    axisLabel: { show: true, color: '#aaa', showMinLabel: false, showMaxLabel: false },
-    splitLine: { show: true, lineStyle: { color: '#eee' } },
-    animation: false,
-    scale: true,
-    min: null,
-    max: null,
-  }
-}
-
-// generate grid
-function makeGrid (index, length) {
-  const _height = (80 / length) + '%'
-  const _top = index * (80 / length) + 1 + '%'
-  return {
-    index: index,
-    top: _top,
-    height: _height,
-    series: [],
-  }
-}
-
-// get legend name
-function getLegendName (sourceList, formulaID) {
-  let legendName = ''
-  if (formulaID == null) {
-    // source only 2 device
-    sourceList.forEach(source => {
-      switch (source.name) {
-        case 'Time':
-          legendName += 'T'
-          break
-        case 'Neulive':
-          legendName += 'N' + source.id + 'CH' + source.channel
-          break
-        case 'Elite':
-          switch (source.channel) {
-            case 1:
-              legendName += 'E' + source.id + '-I'
-              break
-            case 2:
-              legendName += 'E' + source.id + '-V'
-              break
-            case 3:
-              legendName += 'E' + source.id + '-R'
-              break
-            default:
-              legendName += 'E' + source.id + 'CH' + source.channel
-              break
-          }
-          break
-        default:
-          legendName += 'D' + source.id + 'CH' + source.channel
-          break
-      }
-      legendName += '_'
-    })
-    legendName = legendName.substr(0, legendName.length - 1)
-  } else {
-    legendName = 'T_F' + formulaID
-  }
-  return legendName
-}
-
-const _chartData = {}
-
-function updateGridList (chartID, length) {
-  _chartData[chartID].grid = []
-  for (let i = 0; i < length; i++) {
-    _chartData[chartID].grid.push(makeGrid(i, length))
-  }
-}
-
-export const chartData = {
-
-  // init chartID to chartData
-  init: (chartID, maxDots, samplingRate, gridLength) => {
-    if (_chartData[parseInt(chartID)] == null) {
-      _chartData[parseInt(chartID)] = {
-        chartID: parseInt(chartID),
-        cardName: 'chart' + String(chartID),
-        cardHeight: '500px',
-        cardWidth: 'auto',
-        mappingID: -1,
-        run: false,
-        rate: samplingRate,
-        maxDots: maxDots,
-        timer: 0,
-        legend: {
-          data: [],
-          x: 'center',
-          y: '88%',
-        },
-        tooltip: {},
-        axisPointer: {
-          link: [{ xAxisIndex: 'all' }],
-          snap: true,
-        },
-        grid: [],
-        xAxis: [],
-        yAxis: [],
-        dataZoom: [{
-          type: 'slider',
-          height: '15px',
-          bottom: '0%',
-          handleStyle: {
-            shadowColor: 'rgba(0, 0, 0, 0)',
-          },
-          showDataShadow: false,
-          showDetail: false,
-          xAxisIndex: [],
-        }, {
-          type: 'inside',
-          xAxisIndex: [],
-        },
-        {
-          type: 'slider',
-          height: '80%',
-          showDataShadow: false,
-          showDetail: false,
-          width: '15px',
-          // right: '5%',
-          yAxisIndex: [],
-        }],
-        series: [],
-      }
-      _chartData[chartID].tooltip = {
-        trigger: 'axis',
-        backgroundColor: '#fff',
-        borderColor: 'rgba(0, 0, 200, 0.2)',
-        borderWidth: 1,
-        borderRadius: 0,
-        padding: 10,
-        formatter: function (params) {
-          if (params.length) {
-            if (params[0].seriesName.split('_')[0] === 'T' && params[0].seriesName.split('_')[1] !== 'T') {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[0] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            } else if (params[0].seriesName.split('_')[0] !== 'T' && params[0].seriesName.split('_')[1] === 'T') {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[1] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            } else {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[2] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            }
-            let tip = ''
-            for (var i = 0; i < params.length; i++) {
-              const param = params[i]
-              const style = 'color: ' + param.color
-              let value
-              // console.log(param.value)
-              if (param.seriesName === 'Time') {
-                value = param.value[1]
-              } else if (param.seriesName.split('_')[1] === 'T' && param.seriesName.split('_')[0] !== 'T') {
-                if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
-                } else {
-                  value = parseFloat(param.value[0]).toFixed(3)
-                }
-              } else if (param.seriesName.split('_')[1] !== 'T' && param.seriesName.split('_')[0] === 'T') {
-                if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
-                } else {
-                  value = parseFloat(param.value[1]).toFixed(3)
-                }
-              } else {
-                let value1
-                let value2
-                if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
-                } else {
-                  value1 = parseFloat(param.value[0]).toFixed(3)
-                }
-
-                if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
-                } else {
-                  value2 = parseFloat(param.value[1]).toFixed(3)
-                }
-
-                value = value1 + ', ' + value2
-              }
-              tip += '<span style="' + style + '">' +
-                          param.seriesName +
-                          '：</span><span style="' +
-                          style + '">' + value + '</span><br>'
-            }
-            return tip
-          }
-        },
-      }
-      updateGridList(chartID, gridLength)
-      return _chartData[chartID]
-    } else {
-      return _chartData[chartID]
-    }
-  },
-
-  reset: (chartID, mappingID, cardName) => {
-    _chartData[chartID].legend.data.length = 0
-    _chartData[chartID].xAxis.length = 0
-    _chartData[chartID].yAxis.length = 0
-    if (_chartData[chartID].series.data != null) {
-      _chartData[chartID].series.data.length = 0
-    }
-    _chartData[chartID].series.length = 0
-    if (mappingID == null) {
-      _chartData[chartID].mappingID = -1
-    }
-    if (cardName == null) {
-      _chartData[chartID].cardName = 'chart' + String(chartID)
-    }
-    _chartData[chartID].dataZoom = [{
-      type: 'slider',
-      height: '15px',
-      bottom: '0%',
-      handleStyle: {
-        shadowColor: 'rgba(0, 0, 0, 0)',
-      },
-      showDataShadow: false,
-      showDetail: false,
-      xAxisIndex: [],
-    }, {
-      type: 'inside',
-      xAxisIndex: [],
-    },
-    {
-      type: 'slider',
-      height: '80%',
-      showDataShadow: false,
-      showDetail: false,
-      width: '15px',
-      // right: '5%',
-      yAxisIndex: [],
-    }]
-    updateGridList(chartID, 1)
-  },
-
-  updateGridList: (chartID, gridLength) => {
-    updateGridList(chartID, gridLength)
-  },
-
-  // register device-channel to chartData
-  register: (chartID, gridIndex, deviceNameX, deviceIDX, channelX, deviceNameY, deviceIDY, channelY, formula) => {
-    return chartRegister(chartID, gridIndex, deviceNameX, deviceIDX, channelX, deviceNameY, deviceIDY, channelY, formula)
-  },
-
-  // remove device-channel from chart TODO
-  remove: (chartID, legendName) => {
-    if (_chartData[chartID] == null || _chartData[chartID].legend.data.length === 0) {
-      return false
-    }
-
-    let _xAxisIndex = -1
-    let _yAxisIndex = -1
-
-    // remove legend
-    const _legendIndex = _chartData[chartID].legend.data.indexOf(legendName)
-    console.log(_legendIndex)
-    if (_legendIndex >= 0) {
-      _chartData[chartID].legend.data.splice(_chartData[chartID].legend.data.indexOf(legendName), 1)
-    } else {
-      return false
-    }
-    // remove series
-    for (let i = 0; i < _chartData[chartID].series.length; i++) {
-      if (_chartData[chartID].series[i].name === legendName) {
-        _xAxisIndex = _chartData[chartID].series[i].xAxisIndex
-        _yAxisIndex = _chartData[chartID].series[i].yAxisIndex
-        _chartData[chartID].series.splice(i, 1)
-        break
-      }
-    }
-    // remove grid series name
-    const _gridIndex = _chartData[chartID].xAxis[_xAxisIndex].gridIndex
-    for (let i = 0; i < _chartData[chartID].grid[_gridIndex].series.length; i++) {
-      if (_chartData[chartID].grid[_gridIndex].series[i] === legendName) {
-        _chartData[chartID].grid[_gridIndex].series.splice(i, 1)
-        break
-      }
-    }
-    for (let i = 0; i < _chartData[chartID].grid.length; i++) {
-      if (_chartData[chartID].grid[i].name === legendName) {
-        _xAxisIndex = _chartData[chartID].series[i].xAxisIndex
-        _yAxisIndex = _chartData[chartID].series[i].yAxisIndex
-        _chartData[chartID].series.splice(i, 1)
-        break
-      }
-    }
-    _chartData[chartID].series.forEach(series => {
-      if (series.xAxisIndex === _xAxisIndex) {
-        _xAxisIndex = -1
-      }
-      if (series.yAxisIndex === _yAxisIndex) {
-        _yAxisIndex = -1
-      }
-    })
-    // remove xAxis
-    if (_xAxisIndex !== -1) {
-      _chartData[chartID].xAxis.splice(_xAxisIndex, 1)
-      _chartData[chartID].series.forEach(series => {
-        if (series.xAxisIndex > _xAxisIndex) {
-          series.xAxisIndex--
-        }
-      })
-      _chartData[chartID].dataZoom[0].xAxisIndex.pop()
-    }
-    // remove yAxis
-    if (_yAxisIndex !== -1) {
-      _chartData[chartID].yAxis.splice(_yAxisIndex, 1)
-      _chartData[chartID].series.forEach(series => {
-        if (series.yAxisIndex > _yAxisIndex) {
-          series.yAxisIndex--
-        }
-      })
-      _chartData[chartID].dataZoom[2].yAxisIndex.pop()
-    }
-
-    console.log(_chartData[chartID])
-    return true
-  },
-
-  defaultChartGenerator: (_itemID, _chartID, _type) => {
-    let item
-    projectInfo.getDeviceListRegister().forEach(_device => {
-      if (_itemID === _device.id) {
-        item = _device
-      }
-    })
-    projectInfo.getFormulaList().forEach(_formula => {
-      if (_itemID === _formula.id) {
-        item = _formula
-      }
-    })
-    if (item == null) {
-      return false
-    }
-
-    const _chartRegisterDevice = (chartID, device) => {
-      if (projectInfo.getDeviceInfo(device.id).info.library_name.indexOf('Elite') >= 0) {
-        switch (projectInfo.getDeviceInfo(device.id).parameterSet.MODE) {
-          case 0:
-            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
-            break
-          case 1:
-            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
-            break
-          case 2:
-            chartRegister(chartID, 0, 'Time', device.id, 2, 'Elite', device.id, 2, null)
-            break
-          case 3:
-            chartRegister(chartID, 0, 'Time', device.id, 2, 'Elite', device.id, 3, null)
-            break
-          case 4:
-            chartRegister(chartID, 0, 'Time', device.id, 2, 'Elite', device.id, 2, null)
-            break
-          case 5:
-            chartRegister(chartID, 0, 'Time', device.id, 2, 'Elite', device.id, 1, null)
-            break
-          case 7:
-            chartRegister(chartID, 0, 'Time', device.id, 2, 'Elite', device.id, 2, null)
-            break
-          case 8:
-            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
-            break
-          case 9:
-            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
-            break
-        }
-      } else if (projectInfo.getDeviceInfo(device.id).info.library_name.indexOf('Neulive') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(device.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
-        let gridNumber = 0
-        channelSet.forEach((element, index) => {
-          if (parseInt(element) > 0) {
-            gridNumber++
-          }
-        })
-        updateGridList(chartID, gridNumber)
-        gridNumber = 0
-        channelSet.forEach((element, index) => {
-          if (parseInt(element) > 0) {
-            chartRegister(chartID, gridNumber, 'Time', device.id, 1, 'Neulive', device.id, index + 1, null)
-            gridNumber++
-          }
-        })
-      }
-    }
-
-    const _chartRegisterFormula = (chartID, formula) => {
-      switch (formula.type) {
-        case 'Sheet Resistance':
-          chartRegister(chartID, 0, 'Elite', formula.I_device.id, 1, 'Elite', formula.V_device.id, 2, formula)
-          break
-      }
-    }
-
-    // TODO remove old buffer register
-    if (_chartID != null) {
-      // update only one
-      chartData.reset(_chartID, _chartData[_chartID].mappingID, _chartData[_chartID].cardName)
-      _chartData[_chartID].mappingID = parseInt(item.id)
-      switch (_type) {
-        case 'device':
-          _chartRegisterDevice(_chartID, item)
-          break
-        case 'formula':
-          _chartRegisterFormula(_chartID, item)
-          break
-      }
-    } else {
-      // update all
-      for (const chartID in _chartData) {
-        if (parseInt(_chartData[chartID].mappingID) === parseInt(item.id)) {
-          console.log(_chartData[chartID])
-          chartData.reset(chartID, _chartData[chartID].mappingID, _chartData[chartID].cardName)
-          console.log(_chartData[chartID])
-          _chartData[chartID].mappingID = parseInt(item.id)
-          switch (_type) {
-            case 'device':
-              _chartRegisterDevice(chartID, item)
-              break
-            case 'formula':
-              _chartRegisterFormula(chartID, item)
-              break
-          }
-        }
-      }
-    }
-  },
-
-  // get chart data by chart ID
-  getChartsData: (chartID) => {
-    if (chartID == null || _chartData[chartID] == null) {
-      return null
-    }
-    return _chartData[chartID]
-  },
-
-  // get all chart data
-  getAllChartsData: () => {
-    return _chartData
-  },
-
-}
-
-// register device-channel to chartData
-const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, deviceNameY, deviceIDY, channelY, formula) => {
-  const sourceList = [
-    {
-      name: deviceNameX,
-      id: deviceIDX,
-      channel: channelX,
-    },
-    {
-      name: deviceNameY,
-      id: deviceIDY,
-      channel: channelY,
-    },
-  ]
-  if (_chartData[chartID] == null) {
-    return false
-  }
-
-  let xAxisType
-  let yAxisType
-  let xAxisSource
-  let yAxisSource
-  // formulaSource
-  const formulaSource = []
-  let legendName
-
-  if (formula == null) {
-    legendName = getLegendName(sourceList, formula)
-  } else {
-    legendName = getLegendName(sourceList, formula.id)
-  }
-
-  if (formula == null) {
-    switch (sourceList[0].name) {
-      case 'Time':
-        xAxisType = 'time'
-        xAxisSource = [-1, -1]
-        break
-      default:
-        xAxisType = 'value'
-        xAxisSource = [sourceList[0].id, sourceList[0].channel]
-        break
-    }
-    switch (sourceList[1].name) {
-      case 'Time':
-        yAxisType = 'time'
-        yAxisSource = [-1, -1]
-        break
-      default:
-        yAxisType = 'value'
-        yAxisSource = [sourceList[1].id, sourceList[1].channel]
-        break
-    }
-  } else {
-    sourceList.forEach(source => {
-      formulaSource.push([source.id, source.channel])
-    })
-    xAxisType = 'time'
-    yAxisType = 'value'
-  }
-
-  // register legendName
-  if (_chartData[chartID].legend.data.indexOf(legendName) >= 0) {
-    // have been registered
-    return false
-  }
-  _chartData[chartID].legend.data.push(legendName)
-
-  // if AxisIndex != -1 then add new axis into list
-  let _xAxisIndex = -1
-  let _yAxisIndex = -1
-  // the grid have exist, so just use the axis in grid
-  for (let i = 0; i < _chartData[chartID].xAxis.length; i++) {
-    if (_chartData[chartID].xAxis[i].gridIndex === gridIndex) {
-      _xAxisIndex = i
-    }
-  }
-  for (let i = 0; i < _chartData[chartID].yAxis.length; i++) {
-    if (_chartData[chartID].yAxis[i].gridIndex === gridIndex) {
-      _yAxisIndex = i
-    }
-  }
-  // create new axis
-  if (_xAxisIndex === -1) {
-    _chartData[chartID].xAxis.push(makeXAxis(gridIndex, xAxisType))
-    _xAxisIndex = _chartData[chartID].xAxis.length - 1
-  }
-  if (_yAxisIndex === -1) {
-    _chartData[chartID].yAxis.push(makeYAxis(gridIndex, yAxisType))
-    _yAxisIndex = _chartData[chartID].yAxis.length - 1
-  }
-
-  // update dataZoom AxisIndex list
-  const dataZoomXAxisIndex = Array.apply(null, { length: _chartData[chartID].xAxis.length }).map(Number.call, Number)
-  const dataZoomYAxisIndex = Array.apply(null, { length: _chartData[chartID].yAxis.length }).map(Number.call, Number)
-  _chartData[chartID].dataZoom[0].xAxisIndex = dataZoomXAxisIndex
-  _chartData[chartID].dataZoom[1].xAxisIndex = dataZoomXAxisIndex
-  _chartData[chartID].dataZoom[2].yAxisIndex = dataZoomYAxisIndex
-
-  // register series
-  _chartData[chartID].series.push({
-    name: legendName,
-    type: 'line',
-    symbol: 'circle',
-    showSymbol: false,
-    symbolSize: 2,
-    sampling: 'average',
-    // clip the overflow on the coordinate system
-    // clip: true,
-    // ignore mouse events
-    // formula
-    formula: formula,
-    formulaSource: formulaSource,
-    silent: true,
-    xAxisIndex: _xAxisIndex,
-    yAxisIndex: _yAxisIndex,
-    // AxisSource: [deviceID, channel], use it to get data stream from buffer
-    xAxisSource: xAxisSource,
-    yAxisSource: yAxisSource,
-    animation: false,
-    dataXMax: null,
-    dataXMin: null,
-    dataYMax: null,
-    dataYMin: null,
-    itemStyle: {
-      normal: {
-      },
-    },
-    lineStyle: {
-      width: 2,
-    },
-    data: [],
-  })
-
-  // register series into grid
-  const _axisList = []
-
-  if (formula == null) {
-    sourceList.forEach((source, index) => {
-      let _axis = 'X'
-      if (index !== 0) {
-        _axis = 'Y'
-      }
-      switch (source.name) {
-        case 'Time':
-          _axisList.push(_axis + ' AXIS = TIME')
-          break
-        case 'Neulive':
-          _axisList.push(_axis + ' AXIS = NEULIVE ' + source.id + ' CHANNEL ' + source.channel)
-          break
-        case 'Elite':
-          switch (source.channel) {
-            case 1:
-              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CURRENT')
-              break
-            case 2:
-              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' VOLTAGE')
-              break
-            case 3:
-              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' RESISTANCE')
-              break
-            default:
-              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CHANNEL ' + source.channel)
-              break
-          }
-          break
-        default:
-          _axisList.push(_axis + ' AXIS = DEVICE ' + source.id + ' CHANNEL ' + source.channel)
-          break
-      }
-    })
-  } else {
-    _axisList.push('X AXIS = TIME')
-    _axisList.push('Y AXIS = FORMULA' + formula.id)
-  }
-
-  const _gridSeries = {
-    name: legendName,
-    xAxis: _axisList[0],
-    yAxis: _axisList[1],
-  }
-
-  _chartData[chartID].grid[gridIndex].series.push(_gridSeries)
-
-  // console.log(_chartData[chartID])
-  return _chartData[chartID]
-}
@@ -1,6 +1,7 @@
 import axios from 'axios'

-axios.defaults.baseURL = 'http://192.168.0.110:3000'
+// axios.defaults.baseURL = 'http://192.168.3.53:3000'
+axios.defaults.baseURL = 'http://' + location.href.split('/')[2].split(':')[0] + ':3000'

 const _header = {}

@@ -18,13 +19,15 @@ async function getJwtData () {
  setHeader(_jwt.data)
 }

-async function createCollection (name, parent, type) {
+async function createCollection (attrs) {
  const _header = getHeader()
  const _data = {
-    name: name,
-    parent: { [type]: parent },
-    size: 0,
+    name: attrs.name,
+    parent: attrs.parent,
+    type: attrs.type,
+    size: attrs.size,
  }
+
  try {
    return await axios.post('/api/collection/create', _data, { headers: _header })
  } catch (e) {
@@ -53,20 +56,31 @@ async function getCollectionsByName (name) {
  }
 }

-async function getCollectionsFoldersByParent (parent) {
+async function getCollectionsByParent (type, parent) {
  const _header = getHeader()
  try {
-    return await axios.get('/api/collection/folder/get_by_parent/' + parent, { headers: _header })
+    return await axios.get('/api/collection/get_by_parent/' + type + '/' + parent, { headers: _header })
  } catch (e) {
    console.error(e)
    return false
  }
 }

-async function getCollectionsAll (id) {
+async function getCollectionsAll () {
  const _header = getHeader()
  try {
-    return await axios.get('/api/collection/get/all' + id, { headers: _header })
+    return await axios.get('/api/collection/get/all', { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getCollectionsByParentName (collectionType, parent, name) {
+  console.log(collectionType, parent, name)
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/collection/get_by_parent_name/' + collectionType + '/' + parent + '/' + name, { headers: _header })
  } catch (e) {
    console.error(e)
    return false
@@ -83,10 +97,41 @@ async function createMetaFile () {
  }
 }

-async function getFolderMetaFileByParent (parent) {
+async function updateMetaFile (id, attrs) {
+  console.log('updateMetaFile')
  const _header = getHeader()
  try {
-    return await axios.get('/api/file/folder/meta/get_by_parent/' + parent, { headers: _header })
+    return await axios.post('/api/file/meta/update/' + id, attrs, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getFolderMetaFileByParent (type, parent) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/meta/get_by_parent/' + type + '/' + parent, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getRawFilesByID (channel, id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/raw/get_by_id/' + channel + '/' + id, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMetaFilesByID (id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/meta/get_by_id/' + id, { responseType: 'json', headers: _header })
  } catch (e) {
    console.error(e)
    return false
@@ -103,16 +148,86 @@ async function getRawFilesByParent (channel, parent) {
  }
 }

+async function getRawFilesAttrByParent (channel, parent, attr) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/raw/get_attr_by_parent/' + channel + '/' + parent + '/' + attr, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMiniFilesByID (channel, id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/get_by_id/' + channel + '/' + id, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMiniFilesByParent (channel, parent) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/get_by_parent/' + channel + '/' + parent, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMiniFilesAttrByParent (channel, parent, attr) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/get_attr_by_parent/' + channel + '/' + parent + '/' + attr, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMiniFilesMeanDataByID (channel, id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/mean/get_by_id/' + channel + '/' + id, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getMiniFilesRandomDataByID (channel, id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/random/get_by_id/' + channel + '/' + id, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
 const api = {
  getJwtData,
  createCollection,
  getCollectionsByID,
  getCollectionsByName,
-  getCollectionsFoldersByParent,
+  getCollectionsByParent,
+  getCollectionsByParentName,
  getCollectionsAll,
  createMetaFile,
+  updateMetaFile,
  getFolderMetaFileByParent,
  getRawFilesByParent,
+  getRawFilesByID,
+  getMiniFilesByID,
+  getMiniFilesByParent,
+  getMiniFilesMeanDataByID,
+  getMiniFilesRandomDataByID,
+  getMetaFilesByID,
+  getRawFilesAttrByParent,
+  getMiniFilesAttrByParent,
 }

 export default api
@@ -1,188 +1,159 @@
-import { getNewFileSegmentInfoFormat, getNewDownloadOptions } from './DownloadFormat'
-import { _fileInfoList, file } from './../file/File'
+import { inflateSync } from 'zlib'
+import api from '../api/index'

-const _fileSegmentInfo = getNewFileSegmentInfoFormat()
-
-const _downloadOptions = getNewDownloadOptions()
-const _downloadOptionsList = []
-
-export const downloadTaskManager = {
-  updateDownloadSubFileList: function (path, channel, timeRange) {
-    const fileInfo = _fileInfoList.find(fileInfo => fileInfo.data.path === path)
-    // channel
-    const metaChannel = fileInfo.data.meta.channel
-    // max part per channel
-    const subfilePerChannel = fileInfo.data.meta['sub-file'].length / metaChannel.length
-    // timeRange
-    const timeRangeInMillisecond = timeRange.map(time => time * 1000)
-    // available channel
-    const availableChannel = channel
-      .filter(ch => ch.checked === true)
-      .map(ch => ch.channel)
-
-    // filter sub-file list to get downloadSubfileList
-    fileInfo.data.meta['sub-file'].forEach(subFile => {
-      const subfileArray = subFile.split(/['_.']+/).slice(0, -1)
-      const subfileChannel = parseInt(subfileArray[subfileArray.length - 2])
-      const subfilePart = parseInt(subfileArray[subfileArray.length - 1])
-      const subfileStartTimeIndex = metaChannel.length * subfilePart + metaChannel.indexOf(subfileChannel)
-      const subfileStartTime = parseInt(fileInfo.data.meta['start-time'][subfileStartTimeIndex])
-      const subfileEndTime = () => {
-        if (subfilePerChannel === (subfilePart + 1)) {
-          return parseInt(fileInfo.data.meta.time_duration)
-        } else {
-          return parseInt(fileInfo.data.meta['start-time'][subfileStartTimeIndex + metaChannel.length])
+export const download = {
+  getAllRawDatas: async function (meta) {
+    const result = {}
+    for (const channelID in meta.raw_data) {
+      let prevLastTime = 0
+      result[channelID] = []
+      for (const rawID of meta.raw_data[channelID]) {
+        const _data = await api.getRawFilesByID(channelID, rawID)
+        if (_data.data.length > 0) {
+          const ret = await this.parseRawData(_data.data, prevLastTime, meta)
+          result[channelID].push(...ret[0])
+          prevLastTime = ret[1]
        }
      }
+    }
+    return result
+  },
+  rawByIDChannels: async function (id, channel, meta) {
+    const rawData = await api.getRawFilesByID(channel, id)
+    const ret = await this.parseRawData(rawData.data, null, meta)
+    return ret[0]
+  },
+  miniMeanByIDChannel: async function (id, channel, meta) {
+    const miniData = await api.getMiniFilesByID(channel, id)
+    return await this.parseMiniData(miniData, 'data_mean', meta)
+  },
+  miniRandomByIDChannel: async function (id, channel, meta) {
+    const rawData = await api.getMiniFilesByID(channel, id)
+    return await this.parseMiniData(rawData, 'data_random', meta)
+  },
+  parseRawData: async function (rawData, prevLastTime, meta) {
+    const channelData = []
+    for (const raw of rawData) {
+      if (raw.data !== null && raw.data.length > 0) {
+        const encodedData = raw.data.split('"***"')
+        // console.log('encodedData', encodedData)

-      const downloadIndex = fileInfo.data.meta.downloadBlockList.findIndex(data => data.name === subFile)
-      if (downloadIndex === -1) {
-        const downloadInfo = {
-          name: subFile,
-          download: false,
-          channel: subfileChannel,
-          part: subfilePart,
-          start_time: subfileStartTime,
-          end_time: subfileEndTime(),
-          data: [],
-        }
-        file.pushDownloadInfo(path, downloadInfo)
+        const unzipDatas = encodedData.map(ctx => {
+          if (ctx.length === 0) {
+            return ''
+          }
+          const decodedData = atob(ctx)
+          const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
+          return inflateSync(decodedDataBuffer).toString().split(' ')
+        })
+        // console.log('unzipData', unzipDatas)

-        if (availableChannel.includes(parseInt(subfileChannel))) {
-          if (timeRangeInMillisecond[0] <= subfileEndTime() && timeRangeInMillisecond[1] >= subfileStartTime) {
-            file.pushDownloadSubFileList(path, subFile)
+        for (let i = 0; i <= unzipDatas.length - 1; i++) {
+          if (unzipDatas[i].length > 0) {
+            const ret = this.parseDataWithTimeStamp(unzipDatas[i], prevLastTime, meta)
+            channelData.push(...ret[0])
+            prevLastTime = ret[1]
          }
        }
-      } else {
-        // If not yet downloaded, check download status
-        if (!fileInfo.data.meta.downloadBlockList[downloadIndex].download) {
-          if (availableChannel.includes(parseInt(subfileChannel))) {
-            if (timeRangeInMillisecond[0] <= subfileEndTime() && timeRangeInMillisecond[1] >= subfileStartTime) {
-              file.pushDownloadSubFileList(path, subFile)
+      }
+    }
+    // console.log('all Data', channelData)
+    return [channelData, prevLastTime]
+  },
+  parseMiniData: async function (miniData, miniType, meta) {
+    const channelData = []
+
+    for (const mini of miniData.data) {
+      if (mini[miniType] !== null && mini[miniType].length > 0) {
+        const encodedData = mini[miniType].split('"***"')
+        // console.log('encodedData', encodedData)
+
+        const unzipDatas = encodedData.map(ctx => {
+          if (ctx.length === 0) {
+            return ''
+          }
+          const decodedData = atob(ctx)
+          const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
+          return inflateSync(decodedDataBuffer).toString().split(' ')
+        })
+        // console.log('unzipData', unzipDatas)
+
+        for (let i = 0; i <= unzipDatas.length - 1; i++) {
+          if (unzipDatas[i].length > 0) {
+            if (unzipDatas[i + 1].length === 0) {
+              const endTime = (meta && mini.end_time === -1) ? meta.time_duration : mini.end_time
+              channelData.push(...this.parseDataWithHeadTimeStamp(unzipDatas[i], unzipDatas[i][0], endTime, true))
+            } else {
+              channelData.push(...this.parseDataWithHeadTimeStamp(unzipDatas[i], unzipDatas[i][0], unzipDatas[i + 1][0]))
            }
          }
        }
      }
-    })
-    // console.log(file.getFileInfoList())
-  },
-  // Download all datas
-  downloadAllSubFileList: function (path) {
-    const fileInfo = _fileInfoList.find(fileInfo => fileInfo.data.path === path)
-    const metaChannel = fileInfo.data.meta.channel
-    const subfilePerChannel = fileInfo.data.meta['sub-file'].length / metaChannel.length
-
-    fileInfo.data.meta['sub-file'].forEach(subFile => {
-      const subfileArray = subFile.split(/['_.']+/).slice(0, -1)
-      const subfileChannel = parseInt(subfileArray[subfileArray.length - 2])
-      const subfilePart = parseInt(subfileArray[subfileArray.length - 1])
-      const subfileStartTimeIndex = metaChannel.length * subfilePart + metaChannel.indexOf(subfileChannel)
-      const subfileStartTime = parseInt(fileInfo.data.meta['start-time'][subfileStartTimeIndex])
-      const subfileEndTime = () => {
-        if (subfilePerChannel === (subfilePart + 1)) {
-          return parseInt(fileInfo.data.meta.time_duration)
-        } else {
-          return parseInt(fileInfo.data.meta['start-time'][subfileStartTimeIndex + metaChannel.length])
-        }
-      }
-
-      const downloadIndex = fileInfo.data.meta.downloadBlockList.findIndex(data => data.name === subFile)
-
-      if (downloadIndex === -1) {
-        const downloadInfo = {
-          name: subFile,
-          download: false,
-          channel: subfileChannel,
-          part: subfilePart,
-          start_time: subfileStartTime,
-          end_time: subfileEndTime(),
-          data: [],
-        }
-        file.pushDownloadInfo(path, downloadInfo)
-      }
-      file.pushDownloadSubFileList(path, subFile)
-    })
-    // console.log(file.getFileInfoList())
-  },
-  checkDownloadSubFileList: function (path) {
-    const fileInfo = _fileInfoList.find(fileInfo => fileInfo.data.path === path)
-    return fileInfo.data.meta.downloadSubFileList.length !== 0
-  },
-  getFirstSubfile: function (path) {
-    const fileInfo = _fileInfoList.find(fileInfo => fileInfo.data.path === path)
-    return fileInfo.data.meta.downloadSubFileList[0]
-  },
-  getAllSubfile: function (path) {
-    const fileInfo = _fileInfoList.find(fileInfo => fileInfo.data.path === path)
-    return fileInfo.data.meta.downloadSubFileList
-  },
-  /* ------- File Segment Info ------- */
-  updateFileSegmentInfo: async function (mes) {
-    const mesObj = JSON.parse(mes)
-    const update = async () => {
-      for (const item in mesObj.data) {
-        _fileSegmentInfo[item] = mesObj.data[item]
-      };
    }
-    await update()
+    return channelData
  },
-  getFileSegmentMaxIndex: function () {
-    return _fileSegmentInfo.segment_total
+  parseDataWithTimeStamp: function (currentData, prevLastTime, meta) {
+    const transData = []
+    // let timeSpare = 0
+    // let channel = 0
+    // if (meta !== undefined) {
+    //   channel = JSON.parse(meta.channels).length
+    //   if (meta.device.library_name.startsWith('Neulive')) {
+    //     timeSpare = parseInt((1 / (parseInt(meta.parameter_set.ADC_CLOCK) / 200)) * 1000 / 1000)
+    //   } else if (meta.device.library_name.startsWith('Elite')) {
+    //     // TODO Elite
+    //   }
+    // }
+    // const realTimeSpare = channel * timeSpare
+
+    for (let i = 0; i <= currentData.length - 1; i += 2) {
+      if (currentData[i].length !== 0) {
+        const time = parseInt(currentData[i])
+        // if (prevLastTime && (time - prevLastTime >= 2 * realTimeSpare) && realTimeSpare !== 0) {
+        //   console.log('data loss time', time, prevLastTime)
+        //   let timeDiff = time - prevLastTime
+        //   let timeCorrection = 0
+        //   while (timeDiff > 0) {
+        //     timeCorrection += realTimeSpare
+        //     timeDiff -= realTimeSpare
+        //     if (timeDiff > 0) {
+        //       const _time = parseInt(prevLastTime) + parseInt(timeCorrection)
+        //       const data = 'NaN'
+        //       const tmpData = [_time, data]
+        //       transData.push(tmpData)
+        //     }
+        //   }
+        // }
+
+        if (meta !== undefined) {
+          if (time <= parseInt(meta.time_duration)) {
+            const data = currentData[i + 1]
+            const tmpData = [time, data]
+            transData.push(tmpData)
+          }
+        }
+        prevLastTime = time
+      }
+    }
+    return [transData, prevLastTime]
  },
-  /* ------- Download Options List ----- */
-  updateDownloadOptions: function (path) {
-    const metaInfo = file.getMetaInfo(path)
-    const downloadOptionsIndex = _downloadOptionsList.findIndex(downloadOptions => downloadOptions.metaPath === path)
-
-    if (downloadOptionsIndex === -1) {
-      _downloadOptions.library = metaInfo.configuration._LIBRARY_
-      _downloadOptions.channel = metaInfo.channel.map(ch => {
-        let channel = ''
-        if (_downloadOptions.library.includes('Elite')) {
-          channel = (ch === 0) ? 'current' : (ch === 1) ? 'voltage' : (ch === 2) ? 'resistance' : ''
-        } else {
-          channel = 'channel' + ch
-        }
-        return {
-          alias: channel,
-          channel: ch,
-          checked: true,
-        }
-      })
-
-      _downloadOptions.metaPath = path
-      _downloadOptions.previousPath = path.split('/').slice(0, -1).join('/')
-      _downloadOptions.filename = path.split(/[/.]+/).slice(0, -1).pop()
-      _downloadOptions.minTime = parseInt([...new Set(metaInfo['start-time'])][0] / 1000)
-      _downloadOptions.maxTime = parseInt(metaInfo.time_duration / 1000)
-      _downloadOptions.timeRange = [_downloadOptions.minTime, _downloadOptions.maxTime]
-      _downloadOptions.download.status = 'idle'
-      _downloadOptions.download.rate = 0
-      _downloadOptionsList.push(JSON.parse(JSON.stringify(_downloadOptions)))
+  parseDataWithHeadTimeStamp: function (currentData, startTime, endTime, last) {
+    const transData = []
+    const timeStart = parseInt(startTime)
+    const timeEnd = endTime
+    let timeSpare
+    if (last) {
+      timeSpare = (timeEnd - timeStart) / (currentData.length - 2)
    } else {
-      for (var item in _downloadOptions) {
-        _downloadOptions[item] = _downloadOptionsList[downloadOptionsIndex][item]
-      }
+      timeSpare = (timeEnd - timeStart) / (currentData.length - 1)
    }
-    return _downloadOptions
+
+    for (let i = 1; i <= currentData.length - 1; i++) {
+      const time = parseInt(timeStart + ((i - 1) * timeSpare))
+      const data = currentData[i]
+      const tmpData = [time, data]
+      transData.push(tmpData)
+    }
+    return transData
  },
-  getFisrtDownloadOptions: function () {
-    return _downloadOptionsList[0]
-  },
-  getDownloadOptions: function (path) {
-    return _downloadOptionsList.find(downloadOption => downloadOption.metaPath === path)
-  },
-  getDownloadOptionsList: function () {
-    return _downloadOptionsList
-  },
-  downloadTaskRemain: function () {
-    return _downloadOptionsList.length !== 0
-  },
-  isFileDownloading: function () {
-    return _downloadOptionsList.filter(downloadOptions => downloadOptions.download.status === 'Downloading').length !== 0
-  },
-  shiftDownloadOptions: function () {
-    _downloadOptionsList.shift()
-  },
-  /* TODO couting download percentage */
 }
@@ -1,99 +1,185 @@
-import { file } from '../file/File'
-import { inflateSync } from 'zlib'
+import golbalMethods from '../global/global'

-let header = []
-let title = []
-// const oneChannelData = []
-const allChannelData = []
-
-// let filterLength = 0
-// let fileIndex = 0
-let dataIndex = 0
-// let blob = new Blob()
-
-// const openEphysData = []
-// const openEphysTimestamp = []
+const NeuliveParameterOrder = ['RECORDING_CH', 'AMP_GAIN', 'ADC_CLOCK']
+const NeuliveAmpGain = [100, 400, 800, 25]

 export const exportData = {
-  exportCSVByAPI: async function (downloadInfo, rawdata) {
-    // console.log('start export')
-    // console.log(performance.now())
-
-    rawdata.forEach(data => {
-      data.data.forEach(d => {
-        const dataDecoded = []
-        let originDataArray = d.data.split('"***"')
-        const dataArray = []
-        let datasArray = []
-
-        if (originDataArray.length > 1) {
-          originDataArray = originDataArray.slice(0, -1)
+  createHeadersString: function (headers) {
+    const device = ['Device', headers.device.device_name, golbalMethods.transMac(headers.device.device_address)]
+    const library = ['Libaray', headers.device.library_name, headers.device.library_version]
+    const parameter = []
+    if (headers.device.library_name.indexOf('Neulive') >= 0) {
+      // const sortedParameterSet = {}
+      // Object.keys(headers.parameter_set).sort().forEach(key => {
+      //   sortedParameterSet[key] = headers.parameter_set[key]
+      // })
+      // for (const p in sortedParameterSet) {
+      //   parameter.push([p, headers.parameter_set[p]])
+      // }
+      NeuliveParameterOrder.forEach(p => {
+        const value = headers.parameter_set[p]
+        if (p === 'RECORDING_CH') {
+          let result = ''
+          const channel = value.toString(2).split('').reverse()
+          channel.forEach((_value, _index) => {
+            if (_value === '1') {
+              result = result + `${_index + 1},`
+            }
+          })
+          parameter.push(['Record channels', result])
+        } else if (p === 'AMP_GAIN') {
+          parameter.push(['Amp gain', NeuliveAmpGain[value]])
+        } else if (p === 'ADC_CLOCK') {
+          parameter.push(['Sample Rate', parseInt(200 / parseFloat(value / 1000))])
        }
-
-        // originDataArray.forEach(ctx => {
-        //   ctx = ctx
-        // })
-
-        console.log('origin', originDataArray)
-        originDataArray.forEach(ctx => {
-          // console.log(ctx)
-          dataArray.push(atob(ctx))
-          // console.log(dataArray)
-        })
-
-        // if(dataArray.length > 1){
-        //   datasArray = dataArray.slice(0,-1)
-        // } else {
-        datasArray = dataArray
-        // }
-        console.log('******1', dataArray.length)
-        // console.log(datasArray)
-
-        // decoded compress data
-        for (let i = 0; i < datasArray.length; i++) {
-          const buffer = Buffer.from(datasArray[i], 'ascii')
-          // console.log(i)
-          // console.log(datasArray[i])
-          // console.log(buffer)
-          const decompressData = inflateSync(buffer).toString().split(' ')
-          dataDecoded.push(decompressData)
+      })
+    } else if (headers.device.library_name.indexOf('Elite') >= 0) {
+      const sortedParameterSet = {}
+      Object.keys(headers.parameter_set).sort().forEach(key => {
+        sortedParameterSet[key] = headers.parameter_set[key]
+      })
+      for (const p in sortedParameterSet) {
+        parameter.push([p, headers.parameter_set[p]])
+      }
+    }
+    const headersArray = [device, library, ...parameter]
+    let headersString = ''
+    headersArray.forEach(header => {
+      headersString += header.join(',') + '\r\n'
+    })
+    return headersString
+  },
+  createTitlesString: function (headers, cycle) {
+    let channelString = ''
+    let titleString = ''
+    while (cycle !== -1) {
+      for (const _ch of JSON.parse(headers.channels)) {
+        if (headers.device.library_name.indexOf('Neulive') >= 0) {
+          switch (_ch) {
+            case 256:
+              channelString += 'channel,X,'
+              break
+            case 257:
+              channelString += 'channel,Y,'
+              break
+            case 258:
+              channelString += 'channel,Z,'
+              break
+            case 259:
+              channelString += 'channel,M,'
+              break
+            default:
+              channelString += `channel,${_ch + 1},`
+              break
+          }
+          titleString += 'Time[us],value[uV],'
+        } else if (headers.device.library_name.indexOf('Elite') >= 0) {
+          const _time = 'Time[us]'
+          let _title = ''
+          switch (_ch) {
+            case 0:
+              _title = 'Current[nA]'
+              break
+            case 1:
+              _title = 'Voltage[uV]'
+              break
+            case 2:
+              _title = 'Resister[kohm]'
+              break
+            default:
+              _title = ''
+              break
+          }
+          // channelString += `channel ${_ch + 1},,`
+          titleString += _time + ',' + _title + ','
        }
-        console.log(dataDecoded)
-        console.log('******2', dataDecoded.length)
+      }
+      cycle -= 1
+    }
+    if (headers.device.library_name.indexOf('Neulive') >= 0) {
+      channelString = channelString.slice(0, -1) + '\r\n'
+      titleString = titleString.slice(0, -1) + '\r\n'
+      return channelString + titleString
+    } else if (headers.device.library_name.indexOf('Elite') >= 0) {
+      titleString = titleString.slice(0, -1) + '\r\n'
+      return titleString
+    }
+    return ''
+  },
+  createDatasString: function (headers, data) {
+    let dataString = ''
+    let cycle = 0
+    let idx = 0
+    let maxLength = 0

-        for (let i = 0; i < dataDecoded.length - 1; i++) {
-          if (i === 0) {
-            this.transFirstDataIntoTimeDataFormat(dataDecoded[i], d.start_time, dataDecoded[i + 1][0])
-          } else {
-            this.transDataIntoTimeDataFormat(dataDecoded[i], dataDecoded[i + 1][0])
+    if (JSON.parse(headers.channels).length > 0) {
+      for (const channel of JSON.parse(headers.channels)) {
+        if (data[channel].length > maxLength) {
+          maxLength = data[channel].length
+        }
+      }
+      for (const channel of JSON.parse(headers.channels)) {
+        if (maxLength > data[channel].length) {
+          let lengthDiff = maxLength - data[channel].length
+          while (lengthDiff !== 0) {
+            data[channel].push(['', ''])
+            lengthDiff -= 1
          }
        }
-        this.transLastDataIntoTimeDataFormat(dataDecoded[dataDecoded.length - 1], d.end_time)
-        dataIndex = 0
-      })
-      // console.log('one channel done')
-      // console.log(performance.now())
-      // console.log(allChannelData)
-    })
-    // console.log('all channel done')
-    // console.log(performance.now())
+      }
+      const stopIndex = maxLength
+      cycle = parseInt(stopIndex / 1e6)
+
+      if (cycle === 0) {
+        while (stopIndex !== idx) {
+          const indexData = []
+          for (const _ch of JSON.parse(headers.channels)) {
+            indexData.push(...data[_ch][idx])
+          }
+          idx = idx + 1
+          dataString = dataString + indexData.join(',') + '\r\n'
+        }
+      } else {
+        for (let i = 0; i < 1e6; i++) {
+          const indexData = []
+          for (let j = 0; j <= cycle; j++) {
+            for (const _ch of JSON.parse(headers.channels)) {
+              if (data[_ch][idx + (j * 1e6)] === undefined) {
+                indexData.push(...[])
+              } else {
+                indexData.push(...data[_ch][idx + (j * 1e6)])
+              }
+            }
+          }
+          idx = idx + 1
+          dataString = dataString + indexData.join(',') + '\r\n'
+        }
+      }
+      return [dataString, cycle]
+    }
+    return ''
+  },
+  exportCSV: async function (headers, data) {
+    const fileName = headers.name + '.csv'
+    // console.log('headers', headers)
+    // console.log('data', data)
+    console.time()
+    const headersString = this.createHeadersString(headers)
+    const [datasString, cycle] = this.createDatasString(headers, data)
+    const titlesString = this.createTitlesString(headers, cycle)
+    console.timeEnd()
+    // console.log('data', datasString)
+    // console.log('header', headersString)
+    // console.log('title', titlesString)

-    // console.log('start exporting file')
-    // console.log(performance.now())
    const getCSVFile = async () => {
-      const headerStr = header.join(',') + '\r\n'
-      const titleStr = title.join(',') + '\r\n'
-      const dataStr = this.convertToCSV(allChannelData)
-
-      const fileName = `${downloadInfo.name}.csv`
      /* TODO decrease create BLOB time spend */
-      // console.log('create Blob')
-      // console.log(performance.now())
-      const blob = new Blob([headerStr + titleStr + dataStr], {
+      console.log('build blob')
+      console.time()
+      const blob = new Blob([headersString, titlesString, datasString], {
        type: 'text/csv',
      })
-      // console.log('create Blob Finish')
-      // console.log(performance.now())
+      console.timeEnd()

      const href = URL.createObjectURL(blob)
      let link = document.createElement('a')
@@ -101,299 +187,10 @@ export const exportData = {
      link.href = href
      link.download = fileName
      link.click()
-      // console.log('Download Finish')
-      // console.log(performance.now())

      // destroy
-      header.length = 0
-      title.length = 0
-      // allChannelData.length = 0
      link = null
    }
-
    getCSVFile()
-    // const downloadData = file.getFileInfo(downloadInfo.metaPath).data.meta.downloadBlockList
-    // const timeRangeInMilliSecond = downloadInfo.timeRange.map(time => time * 1000)
-    // const availableChannel = downloadInfo.channel.filter(ch =>
-    //   ch.checked === true,
-    // ).map(ch => {
-    //   return ch.channel
-    // })
-
-    // // filter data with avaliable channel
-    // const filterData = downloadData.filter(
-    //   data => availableChannel.includes(data.channel) &&
-    //   timeRangeInMilliSecond[0] <= data.end_time &&
-    //   timeRangeInMilliSecond[1] >= data.start_time,
-    // )
-    // filterData.forEach(download => {
-    //   header = header.concat(['channel' + download.channel, ''])
-    //   title = title.concat(['Time(ms)', 'Value'])
-    //   const dataDecoded = []
-    //   const originDataArray = download.data.split('line').slice(0, -1)
-
-    //   // decoded compress data
-    //   for (let i = 0; i < originDataArray.length; i++) {
-    //     const buffer = Buffer.from(originDataArray[i], 'ascii')
-    //     const decompressData = inflateSync(buffer).toString().split(' ')
-    //     dataDecoded.push(decompressData)
-    //   }
-    //   // trans decoded data to data with time
-    //   for (let i = 0; i < dataDecoded.length - 1; i++) {
-    //     if (i === 0) {
-    //       this.transFirstDataIntoTimeDataFormat(dataDecoded[i], download.start_time, dataDecoded[i + 1][0])
-    //     } else {
-    //       this.transDataIntoTimeDataFormat(dataDecoded[i], dataDecoded[i + 1][0])
-    //     }
-    //   }
-    //   this.transLastDataIntoTimeDataFormat(dataDecoded[dataDecoded.length - 1], download.end_time)
-    //   dataIndex = 0
-    // })
-  },
-  exportCSV: async function (downloadInfo) {
-    const downloadData = file.getFileInfo(downloadInfo.metaPath).data.meta.downloadBlockList
-    const timeRangeInMilliSecond = downloadInfo.timeRange.map(time => time * 1000)
-    const availableChannel = downloadInfo.channel.filter(ch =>
-      ch.checked === true,
-    ).map(ch => {
-      return ch.channel
-    })
-
-    // filter data with avaliable channel
-    const filterData = downloadData.filter(
-      data => availableChannel.includes(data.channel) &&
-      timeRangeInMilliSecond[0] <= data.end_time &&
-      timeRangeInMilliSecond[1] >= data.start_time,
-    )
-    filterData.forEach(download => {
-      header = header.concat(['channel' + download.channel, ''])
-      title = title.concat(['Time(ms)', 'Value'])
-      const dataDecoded = []
-      const originDataArray = download.data.split('line').slice(0, -1)
-
-      // decoded compress data
-      for (let i = 0; i < originDataArray.length; i++) {
-        const buffer = Buffer.from(originDataArray[i], 'ascii')
-        const decompressData = inflateSync(buffer).toString().split(' ')
-        dataDecoded.push(decompressData)
-      }
-      // trans decoded data to data with time
-      for (let i = 0; i < dataDecoded.length - 1; i++) {
-        if (i === 0) {
-          this.transFirstDataIntoTimeDataFormat(dataDecoded[i], download.start_time, dataDecoded[i + 1][0])
-        } else {
-          this.transDataIntoTimeDataFormat(dataDecoded[i], dataDecoded[i + 1][0])
-        }
-      }
-      this.transLastDataIntoTimeDataFormat(dataDecoded[dataDecoded.length - 1], download.end_time)
-      dataIndex = 0
-    })
-
-    console.log(allChannelData)
-
-    // const getCSVFile = async () => {
-    //   const headerStr = header.join(',') + '\r\n'
-    //   const titleStr = title.join(',') + '\r\n'
-    //   const dataStr = this.convertToCSV(allChannelData)
-    //   console.log(downloadInfo)
-    //   const fileName = `${downloadInfo.filenameWithType.split('.')[0]}.csv`
-    //   /* TODO decrease create BLOB time spend */
-    //   console.log('create Blob')
-    //   console.log(performance.now())
-    //   const blob = new Blob([headerStr + titleStr + dataStr], {
-    //     type: 'text/csv',
-    //   })
-    //   console.log('create Blob Finish')
-    //   console.log(performance.now())
-
-    //   const href = URL.createObjectURL(blob)
-    //   let link = document.createElement('a')
-    //   document.body.appendChild(link)
-    //   link.href = href
-    //   link.download = fileName
-    //   link.click()
-    //   console.log('Download Finish')
-    //   console.log(performance.now())
-
-    //   // destroy
-    //   header.length = 0
-    //   title.length = 0
-    //   allChannelData.length = 0
-    //   link = null
-    // }
-
-    // getCSVFile()
-  },
-  // exportOpenEphys: async function (downloadInfo) {
-  //   const downloadData = file.getFileInfo(downloadInfo.metaPath).data.meta.downloadBlockList
-  //   const timeRangeInMilliSecond = downloadInfo.timeRange.map(time => time * 1000)
-  //   const availableChannel = downloadInfo.channel.filter(ch =>
-  //     ch.checked === true,
-  //   ).map(ch => {
-  //     return ch.channel
-  //   })
-
-  //   // filter data with avaliable channel
-  //   const filterData = downloadData.filter(
-  //     data => availableChannel.includes(data.channel) &&
-  //     timeRangeInMilliSecond[0] <= data.end_time &&
-  //     timeRangeInMilliSecond[1] >= data.start_time,
-  //   )
-  //   filterData.forEach(download => {
-  //     header = header.concat(['channel' + download.channel, ''])
-  //     title = title.concat(['Time(ms)', 'Value'])
-  //     const dataDecoded = []
-  //     const originDataArray = download.data.split('line').slice(0, -1)
-
-  //     // decoded compress data
-  //     for (let i = 0; i < originDataArray.length; i++) {
-  //       const buffer = Buffer.from(originDataArray[i], 'ascii')
-  //       const decompressData = inflateSync(buffer).toString().split(' ')
-  //       dataDecoded.push(decompressData)
-  //     }
-  //     // trans decoded data to data with time
-  //     for (let i = 0; i < dataDecoded.length - 1; i++) {
-  //       if (i === 0) {
-  //         this.transFirstDataIntoTimeDataFormatWithoutSwitchLine(dataDecoded[i], download.start_time, dataDecoded[i + 1][0])
-  //       } else {
-  //         this.transDataIntoTimeDataFormatWithoutSwitchLine(dataDecoded[i], dataDecoded[i + 1][0])
-  //       }
-  //     }
-  //     this.transLastDataIntoTimeDataFormatWithoutSwitchLine(dataDecoded[dataDecoded.length - 1], download.end_time)
-  //     dataIndex = 0
-  //   })
-  //   console.log('openephy data', openEphysData)
-  //   const a = [Int16Array.from(openㄡEphysData)]
-  //   console.log(a)
-  //   const dataStr = this.convertOneLineDataToCSV(openEphysData)
-  //   const timeStr = this.convertOneLineDataToCSV(openEphysTimestamp)
-
-  //   const fileName = 'continous.dat'
-  //   const fileName1 = 'timestamps.npy'
-
-  //   const blob = new Blob([dataStr], {
-  //     type: 'application/octet-stream',
-  //   })
-  //   console.log('create Blob Finish')
-  //   console.log(performance.now())
-
-  //   const blob1 = new Blob([timeStr], {
-  //     type: 'application/octet-stream',
-  //   })
-
-  //   const href = URL.createObjectURL(blob)
-  //   let link = document.createElement('a')
-  //   document.body.appendChild(link)
-  //   link.href = href
-  //   link.download = fileName
-  //   link.click()
-  //   console.log('Download Finish')
-  //   console.log(performance.now())
-
-  //   // destroy
-  //   header.length = 0
-  //   title.length = 0
-  //   allChannelData.length = 0
-  //   link = null
-
-  //   const href1 = URL.createObjectURL(blob1)
-  //   link = document.createElement('a')
-  //   document.body.appendChild(link)
-  //   link.href = href1
-  //   link.download = fileName1
-  //   link.click()
-  //   console.log('Download Finish')
-  //   console.log(performance.now())
-
-  //   // console.log('openephy timestamp', openEphysTimestamp)
-  // },
-  convertToCSV: function (objArray) {
-    const array = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray
-    return array.map(e => e.join(',')).join('\r\n')
-  },
-  _convertToCSV: function (objArray) {
-    const array = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray
-    let str = ''
-    for (let i = 0; i < array.length; i++) { // eslint-disable-line
-      let line = ''
-      for (const index in array[i]) { // eslint-disable-line
-        if (line !== '') line += ','
-        line += array[i][index]
-      }
-      str += line + '\r\n'; // eslint-disable-line
-    }
-    return str
-  },
-  convertHeaderToCSV: function (objArray) {
-    const array = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray
-    let str = ''
-    for (let i = 0; i < array.length; i++) { // eslint-disable-line
-      if (str !== '') str += ','
-      str += array[i]; // eslint-disable-line
-    }
-    return str + '\r\n'
-  },
-  convertOneLineDataToCSV: function (objArray) {
-    const array = typeof objArray !== 'object' ? JSON.parse(objArray) : objArray
-    let str = ''
-    for (let i = 0; i < array.length; i++) { // eslint-disable-line
-      if (str !== '') str += '\r\n'
-      str += array[i]; // eslint-disable-line
-    }
-    return str
-  },
-  transDataIntoTimeDataFormat: function (currentData, endTime) {
-    const timeStart = parseInt(currentData[0])
-    const timeEnd = endTime
-    const timeSpare = (timeEnd - timeStart) / (currentData.length - 1)
-
-    for (let i = 1; i <= currentData.length - 1; i++) {
-      const time = parseInt(timeStart + ((i - 1) * timeSpare))
-      const data = currentData[i]
-      const tmpData = [time, data]
-
-      if (dataIndex >= allChannelData.length) {
-        allChannelData.push(tmpData)
-      } else {
-        allChannelData[dataIndex % 1000000] = allChannelData[dataIndex % 1000000].concat(tmpData)
-      }
-      dataIndex += 1
-    }
-  },
-  transFirstDataIntoTimeDataFormat: function (currentData, startTime, endTime) {
-    const timeStart = parseInt(startTime)
-    const timeEnd = parseInt(endTime)
-    const timeSpare = (timeEnd - timeStart) / (currentData.length - 1)
-
-    for (let i = 1; i <= currentData.length - 1; i++) {
-      const time = parseInt(timeStart + ((i - 1) * timeSpare))
-      const data = currentData[i]
-      const tmpData = [time, data]
-
-      if (dataIndex >= allChannelData.length) {
-        allChannelData.push(tmpData)
-      } else {
-        allChannelData[dataIndex % 1000000] = allChannelData[dataIndex % 1000000].concat(tmpData)
-      }
-      dataIndex += 1
-    }
-  },
-  transLastDataIntoTimeDataFormat: function (currentData, endTime) {
-    const timeStart = parseInt(currentData[0])
-    const timeEnd = endTime
-    const timeSpare = (timeEnd - timeStart) / (currentData.length - 2)
-
-    for (let i = 1; i <= currentData.length - 1; i++) {
-      const time = parseInt(timeStart + ((i - 1) * timeSpare))
-      const data = currentData[i]
-      const tmpData = [time, data]
-
-      if (dataIndex >= allChannelData.length) {
-        allChannelData.push(tmpData)
-      } else {
-        allChannelData[dataIndex % 1000000] = allChannelData[dataIndex % 1000000].concat(tmpData)
-      }
-      dataIndex += 1
-    }
  },
 }
@@ -1,5 +1,5 @@

-const ProjectTotalSettingView = false
+const TaskTotalSettingView = false

 const controllerMaxNumber = 8

@@ -44,17 +44,17 @@ const transFileSize = (fileSize) => {
  return `${(Math.round(fs * 10) / 10).toString()} ${unit}`
 }

-const transTime = (millisecond) => {
-  if (millisecond === undefined) {
+const transTime = (microsecond) => {
+  if (microsecond === undefined) {
    return ''
  }

  let result = ''

-  if (millisecond < 1000) {
+  if (microsecond < 1000000) {
    result = '~ 1 sec'
  } else {
-    let seconds = Math.round(millisecond / 1000)
+    let seconds = Math.round(microsecond / 1000000)

    if (seconds < 60) {
      result = `${seconds} s`
@@ -74,7 +74,9 @@ const transTime = (millisecond) => {
 }

 const dateToStr = (time) => {
-  return time.split('.')[0].replace('T', ' ')
+  const _time = new Date(time).toLocaleString('tw', { hour12: false })
+  return _time
+  // return time.split('.')[0].replace('T', ' ')
  // const [, year, month, day, hours, minutes, seconds] = getTimeInDateTime.exec(time)
  // const ft = new Date(`${year}/${month}/${day} ${hours}:${minutes}:${seconds}`)
  // return ft.toISOString().split('.')[0].replace('T', ' ')
@@ -86,7 +88,7 @@ export default
  transFileSize,
  transTime,
  dateToStr,
-  ProjectTotalSettingView,
+  TaskTotalSettingView,
  controllerMaxNumber,
  DeviceMaxNumber,
  ChannelMaxNumber,
@@ -1,343 +0,0 @@
-import { getNewProjectFormat } from './ProjectInfoFormat'
-
-const eliteImgUrl = require('../../assets/img/elite_img.png')
-const neuliveImgUrl = require('../../assets/img/neulive_img.png')
-// import { chartData } from './ChartsManagement'
-
-const _projectInfo = getNewProjectFormat()
-// show the devices which mac is included in project
-const _deviceList = []
-// show the devices which mac is included in project and do not show Time
-const _deviceListNoTime = []
-// show the all devices which is not register
-const _deviceListNotRegister = []
-// show the all devices which connected
-const _deviceListAll = []
-// show the all item can be mapping
-const _mappingList = []
-
-export const deviceListRegister = []
-
-const formulaIDStart = 4
-
-const updateAllList = async () => {
-  _deviceList.length = 0
-  _deviceListNoTime.length = 0
-  _deviceListNotRegister.length = 0
-  _deviceListAll.length = 0
-  _mappingList.length = 0
-  _deviceList.push({
-    id: -1,
-    name: 'Time',
-  })
-  for (const device in _projectInfo.deviceList) {
-    if (_projectInfo.deviceList[parseInt(device)].info.status === 'connected') {
-      let _deviceListNotRegisterAdd = true
-      _projectInfo.deviceAddrList.forEach(addr => {
-        if (addr.toString() === _projectInfo.deviceList[parseInt(device)].info.device_address.toString()) {
-          _deviceList.push({
-            id: _projectInfo.projectDeviceID.indexOf(parseInt(device)),
-            name: '[' + _projectInfo.projectDeviceID.indexOf(parseInt(device)) + '] ' + _projectInfo.deviceList[parseInt(device)].info.device_name,
-            type: _projectInfo.deviceList[parseInt(device)].info.library_name,
-          })
-          _deviceListNoTime.push({
-            id: _projectInfo.projectDeviceID.indexOf(parseInt(device)),
-            name: '[' + _projectInfo.projectDeviceID.indexOf(parseInt(device)) + '] ' + _projectInfo.deviceList[parseInt(device)].info.device_name,
-            type: _projectInfo.deviceList[parseInt(device)].info.library_name,
-          })
-          _mappingList.push({
-            id: _projectInfo.projectDeviceID.indexOf(parseInt(device)),
-            name: '[' + _projectInfo.projectDeviceID.indexOf(parseInt(device)) + '] ' + _projectInfo.deviceList[parseInt(device)].info.device_name,
-            type: _projectInfo.deviceList[parseInt(device)].info.library_name,
-          })
-          _deviceListNotRegisterAdd = false
-        }
-      })
-      if (_deviceListNotRegisterAdd) {
-        _deviceListNotRegister.push({
-          id: parseInt(device),
-          name: '[' + device + '] ' + _projectInfo.deviceList[parseInt(device)].info.device_name,
-          type: _projectInfo.deviceList[parseInt(device)].info.library_name,
-        })
-      }
-      _deviceListAll.push({
-        id: _projectInfo.projectDeviceID.indexOf(parseInt(device)),
-        name: '[' + _projectInfo.projectDeviceID.indexOf(parseInt(device)) + '] ' + _projectInfo.deviceList[parseInt(device)].info.device_name,
-        type: _projectInfo.deviceList[parseInt(device)].info.library_name,
-      })
-    }
-  }
-  _projectInfo.formulaList.forEach(formula => {
-    _mappingList.push({
-      id: formula.id,
-      name: formula.name,
-      type: formula.type,
-    })
-  })
-  return _deviceList
-}
-
-export const projectInfo = {
-
-  updateProjectInfo: async (projectID) => {
-    const update = async () => {
-      _projectInfo.controllerID = 'tommy_test'
-    }
-    // _projectInfo.deviceAddrList = [[128, 111, 176, 237, 124, 140], [164, 218, 50, 212, 231, 58], [24, 4, 237, 55, 198, 53]]
-    // _projectInfo.chartNumber = _projectInfo.deviceAddrList.length
-    await update()
-    return _projectInfo
-  },
-
-  destroyed: () => {
-    _projectInfo.controllerID = ''
-    _projectInfo.deviceAddrList.length = 0
-    _projectInfo.projectDeviceID.length = 0
-    _projectInfo.chartNumber = 0
-    deviceListRegister.length = 0
-    for (const device in _projectInfo.deviceList) {
-      _projectInfo.deviceList[device].info.status = ''
-      _projectInfo.deviceList[device].info.isSync = false
-    }
-    _projectInfo.formulaList.length = 0
-  },
-
-  deviceInfo: async (mes) => {
-    const mesObj = JSON.parse(mes)
-    const update = async () => {
-      try {
-        if (Array.isArray(mesObj.data)) {
-          mesObj.data.forEach(device => {
-            for (const item in device) {
-              if (parseInt(device.device_id) >= 0) {
-                if (item !== 'configuration') {
-                  _projectInfo.deviceList[device.device_id].info[item] = device[item]
-                } else {
-                  for (const parameter in device[item]) {
-                    _projectInfo.deviceList[device.device_id].parameterSet[parameter] = device[item][parameter]
-                  }
-                }
-              }
-            }
-          })
-        } else {
-          for (const item in mesObj.data) {
-            if (parseInt(mesObj.data.device_id) >= 0) {
-              if (item !== 'configuration') {
-                _projectInfo.deviceList[mesObj.data.device_id].info[item] = mesObj.data[item]
-              } else {
-                for (const parameter in mesObj.data[item]) {
-                  _projectInfo.deviceList[mesObj.data.device_id].parameterSet[parameter] = mesObj.data[item][parameter]
-                }
-              }
-            }
-          }
-        }
-      } catch (e) {
-        console.log(e)
-        return false
-      }
-    }
-    await update()
-    await updateAllList()
-    return true
-  },
-
-  deviceSavePath: async (mes) => {
-    const mesObj = JSON.parse(mes)
-    const update = async () => {
-      try {
-        _projectInfo.deviceList[mesObj.device].info.savePath = mesObj.data
-      } catch (e) {
-        console.log(e)
-        return false
-      }
-    }
-    await update()
-    return true
-  },
-
-  deviceParameter: async (mes) => {
-    const mesObj = JSON.parse(mes)
-    const update = async () => {
-      try {
-        for (const parameter in mesObj.data) {
-          _projectInfo.deviceList[mesObj.device].parameterSet[parameter] = mesObj.data[parameter]
-        }
-      } catch (e) {
-        console.log(e)
-        return false
-      }
-    }
-    await update()
-    await updateAllList()
-    return true
-  },
-
-  deviceConnected: async (id) => {
-    const update = async () => {
-      _projectInfo.deviceList[parseInt(id)].info.status = 'connected'
-    }
-    await update()
-    await updateAllList()
-  },
-
-  deviceDisconnected: async (deviceID) => {
-    const update = async () => {
-      projectInfo.getProjectInfo().deviceAddrList.splice(_projectInfo.projectDeviceID.indexOf(parseInt(deviceID)), 1)
-      deviceListRegister.forEach(device => {
-        if (device.id === _projectInfo.projectDeviceID.indexOf(parseInt(deviceID))) {
-          deviceListRegister.splice(deviceListRegister.indexOf(device), 1)
-        }
-      })
-      deviceListRegister.forEach(device => {
-        if (device.id > _projectInfo.projectDeviceID.indexOf(parseInt(deviceID))) {
-          device.id--
-        }
-      })
-      _projectInfo.projectDeviceID.splice(_projectInfo.projectDeviceID.indexOf(parseInt(deviceID)), 1)
-      _projectInfo.deviceList[parseInt(deviceID)].info.status = 'disconnected'
-    }
-    await update()
-    await updateAllList()
-  },
-
-  controllerShutdown: async () => {
-    const update = async () => {
-      for (const device in _projectInfo.deviceList) {
-        _projectInfo.deviceList[device].info.status = 'disconnected'
-      }
-      for (const chart in _projectInfo.chartList) {
-        _projectInfo.chartList[chart].run = false
-      }
-      deviceListRegister.length = 0
-    }
-    await update()
-    await updateAllList()
-  },
-
-  deviceStart: async (deviceID) => {
-    const update = async () => {
-      _projectInfo.deviceList[deviceID].info.isSync = true
-      deviceListRegister.forEach(device => {
-        if (device.id === _projectInfo.projectDeviceID.indexOf(parseInt(deviceID))) {
-          device.isSync = true
-        }
-      })
-    }
-    await update()
-  },
-
-  deviceStop: async (deviceID) => {
-    const update = async () => {
-      _projectInfo.deviceList[deviceID].info.isSync = false
-      deviceListRegister.forEach(device => {
-        if (device.id === _projectInfo.projectDeviceID.indexOf(parseInt(deviceID))) {
-          device.isSync = false
-        }
-      })
-    }
-    await update()
-  },
-
-  updateChartInfo: async () => {
-    // for (const chartID in _projectInfo.chartList) {
-    //   if (chartData.getChartsData(chartID) == null) {
-    //     chartData.init(chartID, 2000, 1, 1)
-    //   }
-    //   chartData.getChartsData(chartID).cardName = _projectInfo.chartList[chartID].cardName
-    //   chartData.getChartsData(chartID).run = _projectInfo.chartList[chartID].run
-    //   chartData.getChartsData(chartID).cardHeight = _projectInfo.chartList[chartID].cardHeight
-    //   chartData.getChartsData(chartID).cardWidth = _projectInfo.chartList[chartID].cardWidth
-    //   chartData.getChartsData(chartID).maxDots = _projectInfo.chartList[chartID].maxDots
-    //   chartData.getChartsData(chartID).samplingRate = _projectInfo.chartList[chartID].samplingRate
-    //   chartData.updateGridList(chartID, _projectInfo.chartList[chartID].grids.length)
-    //   for (let i = 0; i < _projectInfo.chartList[chartID].grids.length; i++) {
-    //     _projectInfo.chartList[chartID].grids[i].forEach(line => {
-    //       if (line.x[0] === -1) {
-    //         chartData.register('NeuLive', i, chartID, line.y[0], line.y[1])
-    //       } else {
-    //         chartData.register('Elite', i, chartID, line.x[0], line.x[1], line.y[0], line.y[1])
-    //       }
-    //     })
-    //   }
-    // }
-    // return _projectInfo
-  },
-
-  getDevicePic: (libraryName) => {
-    if (libraryName == null) {
-      return false
-    }
-    if (libraryName.indexOf('Elite') >= 0) {
-      return eliteImgUrl
-    } else if (libraryName.indexOf('Neulive') >= 0) {
-      return neuliveImgUrl
-    }
-  },
-
-  addFormula: (formula) => {
-    _projectInfo.formulaList.push(formula)
-  },
-
-  removeFormula: (formula) => {
-    _projectInfo.formulaList.splice(formula, 1)
-  },
-
-  updateAllList: async () => {
-    return await updateAllList()
-  },
-
-  getProjectInfo: () => {
-    return _projectInfo
-  },
-
-  getDeviceIDByRaw: (_deviceID) => {
-    return _projectInfo.projectDeviceID.indexOf(_deviceID)
-  },
-
-  getRawDeviceID: (_projectDeviceID) => {
-    return _projectInfo.projectDeviceID[_projectDeviceID]
-  },
-
-  getDeviceInfo: (_projectDeviceID) => {
-    return _projectInfo.deviceList[_projectInfo.projectDeviceID[_projectDeviceID]]
-  },
-
-  getDeviceInfoByRawID: (_deviceID) => {
-    return _projectInfo.deviceList[_deviceID]
-  },
-
-  getDeviceList: () => {
-    return _deviceList
-  },
-
-  getDeviceListNoTime: () => {
-    return _deviceListNoTime
-  },
-
-  getDeviceListNotRegister: () => {
-    return _deviceListNotRegister
-  },
-
-  getDeviceListAll: () => {
-    return _deviceListAll
-  },
-
-  getDeviceListRegister: () => {
-    return deviceListRegister
-  },
-
-  getMappingList: () => {
-    return _mappingList
-  },
-
-  getFormulaList: () => {
-    return _projectInfo.formulaList
-  },
-
-  getFormulaIDStart: () => {
-    return formulaIDStart
-  },
-
-}
@@ -1,495 +0,0 @@
-export const getNewProjectFormat = () => {
-  const projectFormat = {
-    controllerID: '',
-    deviceAddrList: [],
-    projectDeviceID: [],
-    chartNumber: 0,
-    deviceList: {
-      4: {
-        info: {
-          battery: 0,
-          device_address: [],
-          device_id: 4,
-          device_name: '',
-          device_version: '',
-          library_name: '',
-          library_version: '',
-          serial_number: [],
-          status: '',
-          isSync: false,
-        },
-        parameterSet: {
-          // Neulive
-          ADC_CLOCK: 0,
-          ADDRESS: 0,
-          AMP_GAIN: 0,
-          CHANNEL: {},
-          CHOPPER_RATIO: 0,
-          CONTINUOUS_STI: true,
-          FREQUENCY: 0,
-          PERIOD: 0,
-          RECORDING: false,
-          RECORDING_CH: 0,
-          REGISTER: 0,
-          RIS_PARA: 0,
-          SAMPLE_RATE: 0,
-          STI1_CYCLE: 0,
-          STI2_CYCLE: 0,
-          STI3_CYCLE: 0,
-          STI4_CYCLE: 0,
-          STI5_CYCLE: 0,
-          STI6_CYCLE: 0,
-          STI7_CYCLE: 0,
-          STI8_CYCLE: 0,
-          STIMULATING: false,
-          STI_AMPLITUDE: 0,
-          STI_AMPLITUDE_H: 0,
-          STI_AMPLITUDE_L: 0,
-          STI_CHANNEL: 0,
-          STI_CHANNEL_SET: {},
-          STI_CLOCK_RATIO: 0,
-          STI_CYCLE: 0,
-          STI_CYCLE_LIST: [],
-          STI_H_BRIDGE: true,
-          STI_PATTERN: true,
-          STI_POLARITY: 0,
-          STI_POLARITY_LIST: [],
-          STI_REF: false,
-          STI_SWITCH: false,
-          STI_T1: [],
-          STI_T2: [],
-          STI_T3: [],
-          STI_T4: [],
-          STI_T5: [],
-          SYSTEM_CLK: 0,
-          StiChNumber: '',
-          VGRN: 0,
-          VGRP: 0,
-          VGR_INT_N: 0,
-          VGR_INT_OLD: 0,
-          VGR_INT_P: 0,
-          ch1: 0,
-          ch2: 0,
-          ch3: 0,
-          ch4: 0,
-          ch5: 0,
-          ch6: 0,
-          ch7: 0,
-          ch8: 0,
-          ADC_CHANNEL: 0,
-          // Eilte
-          ADC_LEVEL: 0,
-          ADC_VALUE_I: 0,
-          ADC_VALUE_V: 0,
-          CHANNEL_LABEL: [],
-          CURRNET_LIMIT_VALUE: 1500000,
-          CYCLE_NUMBER: 0,
-          Charge: 1,
-          Const_Current_VStop: 0,
-          Const_Current_unit: 1,
-          Const_Current_value: 0,
-          DAC_VOLT: 25000,
-          Data_Resolution_Scan: 1000,
-          MODE: 0,
-          Resister_LEVEL: 3,
-          STEP_TIME: 1,
-          Scan_Rate: 10000,
-          VOLTSTOP_MAX: 50000,
-          VOLTSTOP_MIN: 0,
-          VOLT_EFINAL: 25000,
-          VOLT_FINAL: 25000,
-          VOLT_INITIAL: 25000,
-          VOLT_MAX: 27500,
-          VOLT_MIN: 22500,
-          VOLT_ORIGIN: 25000,
-          VOLT_STEP: 0,
-          _DEVICE_ADDR_: '',
-          _DEVICE_NAME_: '',
-          _LIBRARY_: '',
-          _VERSION_: '',
-        },
-      },
-      5: {
-        info: {
-          battery: 0,
-          device_address: [],
-          device_id: 4,
-          device_name: '',
-          device_version: '',
-          library_name: '',
-          library_version: '',
-          serial_number: [],
-          status: '',
-          isSync: false,
-        },
-        parameterSet: {
-          // Neulive
-          ADC_CLOCK: 0,
-          ADDRESS: 0,
-          AMP_GAIN: 0,
-          CHANNEL: {},
-          CHOPPER_RATIO: 0,
-          CONTINUOUS_STI: true,
-          FREQUENCY: 0,
-          PERIOD: 0,
-          RECORDING: false,
-          RECORDING_CH: 0,
-          REGISTER: 0,
-          RIS_PARA: 0,
-          SAMPLE_RATE: 0,
-          STI1_CYCLE: 0,
-          STI2_CYCLE: 0,
-          STI3_CYCLE: 0,
-          STI4_CYCLE: 0,
-          STI5_CYCLE: 0,
-          STI6_CYCLE: 0,
-          STI7_CYCLE: 0,
-          STI8_CYCLE: 0,
-          STIMULATING: false,
-          STI_AMPLITUDE: 0,
-          STI_AMPLITUDE_H: 0,
-          STI_AMPLITUDE_L: 0,
-          STI_CHANNEL: 0,
-          STI_CHANNEL_SET: {},
-          STI_CLOCK_RATIO: 0,
-          STI_CYCLE: 0,
-          STI_CYCLE_LIST: [],
-          STI_H_BRIDGE: true,
-          STI_PATTERN: true,
-          STI_POLARITY: 0,
-          STI_POLARITY_LIST: [],
-          STI_REF: false,
-          STI_SWITCH: false,
-          STI_T1: [],
-          STI_T2: [],
-          STI_T3: [],
-          STI_T4: [],
-          STI_T5: [],
-          SYSTEM_CLK: 0,
-          StiChNumber: '',
-          VGRN: 0,
-          VGRP: 0,
-          VGR_INT_N: 0,
-          VGR_INT_OLD: 0,
-          VGR_INT_P: 0,
-          ch1: 0,
-          ch2: 0,
-          ch3: 0,
-          ch4: 0,
-          ch5: 0,
-          ch6: 0,
-          ch7: 0,
-          ch8: 0,
-          ADC_CHANNEL: 0,
-          // Eilte
-          ADC_LEVEL: 0,
-          ADC_VALUE_I: 0,
-          ADC_VALUE_V: 0,
-          CHANNEL_LABEL: [],
-          CURRNET_LIMIT_VALUE: 1500000,
-          CYCLE_NUMBER: 0,
-          Charge: 1,
-          Const_Current_VStop: 0,
-          Const_Current_unit: 1,
-          Const_Current_value: 0,
-          DAC_VOLT: 25000,
-          Data_Resolution_Scan: 1000,
-          MODE: 0,
-          Resister_LEVEL: 3,
-          STEP_TIME: 1,
-          Scan_Rate: 10000,
-          VOLTSTOP_MAX: 50000,
-          VOLTSTOP_MIN: 0,
-          VOLT_EFINAL: 25000,
-          VOLT_FINAL: 25000,
-          VOLT_INITIAL: 25000,
-          VOLT_MAX: 27500,
-          VOLT_MIN: 22500,
-          VOLT_ORIGIN: 25000,
-          VOLT_STEP: 0,
-          _DEVICE_ADDR_: '',
-          _DEVICE_NAME_: '',
-          _LIBRARY_: '',
-          _VERSION_: '',
-        },
-      },
-      6: {
-        info: {
-          battery: 0,
-          device_address: [],
-          device_id: 4,
-          device_name: '',
-          device_version: '',
-          library_name: '',
-          library_version: '',
-          serial_number: [],
-          status: '',
-          isSync: false,
-        },
-        parameterSet: {
-          // Neulive
-          ADC_CLOCK: 0,
-          ADDRESS: 0,
-          AMP_GAIN: 0,
-          CHANNEL: {},
-          CHOPPER_RATIO: 0,
-          CONTINUOUS_STI: true,
-          FREQUENCY: 0,
-          PERIOD: 0,
-          RECORDING: false,
-          RECORDING_CH: 0,
-          REGISTER: 0,
-          RIS_PARA: 0,
-          SAMPLE_RATE: 0,
-          STI1_CYCLE: 0,
-          STI2_CYCLE: 0,
-          STI3_CYCLE: 0,
-          STI4_CYCLE: 0,
-          STI5_CYCLE: 0,
-          STI6_CYCLE: 0,
-          STI7_CYCLE: 0,
-          STI8_CYCLE: 0,
-          STIMULATING: false,
-          STI_AMPLITUDE: 0,
-          STI_AMPLITUDE_H: 0,
-          STI_AMPLITUDE_L: 0,
-          STI_CHANNEL: 0,
-          STI_CHANNEL_SET: {},
-          STI_CLOCK_RATIO: 0,
-          STI_CYCLE: 0,
-          STI_CYCLE_LIST: [],
-          STI_H_BRIDGE: true,
-          STI_PATTERN: true,
-          STI_POLARITY: 0,
-          STI_POLARITY_LIST: [],
-          STI_REF: false,
-          STI_SWITCH: false,
-          STI_T1: [],
-          STI_T2: [],
-          STI_T3: [],
-          STI_T4: [],
-          STI_T5: [],
-          SYSTEM_CLK: 0,
-          StiChNumber: '',
-          VGRN: 0,
-          VGRP: 0,
-          VGR_INT_N: 0,
-          VGR_INT_OLD: 0,
-          VGR_INT_P: 0,
-          ch1: 0,
-          ch2: 0,
-          ch3: 0,
-          ch4: 0,
-          ch5: 0,
-          ch6: 0,
-          ch7: 0,
-          ch8: 0,
-          ADC_CHANNEL: 0,
-          // Eilte
-          ADC_LEVEL: 0,
-          ADC_VALUE_I: 0,
-          ADC_VALUE_V: 0,
-          CHANNEL_LABEL: [],
-          CURRNET_LIMIT_VALUE: 1500000,
-          CYCLE_NUMBER: 0,
-          Charge: 1,
-          Const_Current_VStop: 0,
-          Const_Current_unit: 1,
-          Const_Current_value: 0,
-          DAC_VOLT: 25000,
-          Data_Resolution_Scan: 1000,
-          MODE: 0,
-          Resister_LEVEL: 3,
-          STEP_TIME: 1,
-          Scan_Rate: 10000,
-          VOLTSTOP_MAX: 50000,
-          VOLTSTOP_MIN: 0,
-          VOLT_EFINAL: 25000,
-          VOLT_FINAL: 25000,
-          VOLT_INITIAL: 25000,
-          VOLT_MAX: 27500,
-          VOLT_MIN: 22500,
-          VOLT_ORIGIN: 25000,
-          VOLT_STEP: 0,
-          _DEVICE_ADDR_: '',
-          _DEVICE_NAME_: '',
-          _LIBRARY_: '',
-          _VERSION_: '',
-        },
-      },
-      7: {
-        info: {
-          battery: 0,
-          device_address: [],
-          device_id: 4,
-          device_name: '',
-          device_version: '',
-          library_name: '',
-          library_version: '',
-          serial_number: [],
-          status: '',
-          isSync: false,
-        },
-        parameterSet: {
-          // Neulive
-          ADC_CLOCK: 0,
-          ADDRESS: 0,
-          AMP_GAIN: 0,
-          CHANNEL: {},
-          CHOPPER_RATIO: 0,
-          CONTINUOUS_STI: true,
-          FREQUENCY: 0,
-          PERIOD: 0,
-          RECORDING: false,
-          RECORDING_CH: 0,
-          REGISTER: 0,
-          RIS_PARA: 0,
-          SAMPLE_RATE: 0,
-          STI1_CYCLE: 0,
-          STI2_CYCLE: 0,
-          STI3_CYCLE: 0,
-          STI4_CYCLE: 0,
-          STI5_CYCLE: 0,
-          STI6_CYCLE: 0,
-          STI7_CYCLE: 0,
-          STI8_CYCLE: 0,
-          STIMULATING: false,
-          STI_AMPLITUDE: 0,
-          STI_AMPLITUDE_H: 0,
-          STI_AMPLITUDE_L: 0,
-          STI_CHANNEL: 0,
-          STI_CHANNEL_SET: {},
-          STI_CLOCK_RATIO: 0,
-          STI_CYCLE: 0,
-          STI_CYCLE_LIST: [],
-          STI_H_BRIDGE: true,
-          STI_PATTERN: true,
-          STI_POLARITY: 0,
-          STI_POLARITY_LIST: [],
-          STI_REF: false,
-          STI_SWITCH: false,
-          STI_T1: [],
-          STI_T2: [],
-          STI_T3: [],
-          STI_T4: [],
-          STI_T5: [],
-          SYSTEM_CLK: 0,
-          StiChNumber: '',
-          VGRN: 0,
-          VGRP: 0,
-          VGR_INT_N: 0,
-          VGR_INT_OLD: 0,
-          VGR_INT_P: 0,
-          ch1: 0,
-          ch2: 0,
-          ch3: 0,
-          ch4: 0,
-          ch5: 0,
-          ch6: 0,
-          ch7: 0,
-          ch8: 0,
-          ADC_CHANNEL: 0,
-          // Eilte
-          ADC_LEVEL: 0,
-          ADC_VALUE_I: 0,
-          ADC_VALUE_V: 0,
-          CHANNEL_LABEL: [],
-          CURRNET_LIMIT_VALUE: 1500000,
-          CYCLE_NUMBER: 0,
-          Charge: 1,
-          Const_Current_VStop: 0,
-          Const_Current_unit: 1,
-          Const_Current_value: 0,
-          DAC_VOLT: 25000,
-          Data_Resolution_Scan: 1000,
-          MODE: 0,
-          Resister_LEVEL: 3,
-          STEP_TIME: 1,
-          Scan_Rate: 10000,
-          VOLTSTOP_MAX: 50000,
-          VOLTSTOP_MIN: 0,
-          VOLT_EFINAL: 25000,
-          VOLT_FINAL: 25000,
-          VOLT_INITIAL: 25000,
-          VOLT_MAX: 27500,
-          VOLT_MIN: 22500,
-          VOLT_ORIGIN: 25000,
-          VOLT_STEP: 0,
-          _DEVICE_ADDR_: '',
-          _DEVICE_NAME_: '',
-          _LIBRARY_: '',
-          _VERSION_: '',
-        },
-      },
-    },
-    chartList: [],
-    formulaList: [],
-    // 0: {
-    //   cardName: 'chart0',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-    // 1: {
-    //   cardName: 'chart1',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-    // 2: {
-    //   cardName: 'chart2',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-    // 3: {
-    //   cardName: 'chart3',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-    // 4: {
-    //   cardName: 'chart4',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-    // 5: {
-    //   cardName: 'chart5',
-    //   run: false,
-    //   cardHeight: '500px',
-    //   cardWidth: 'auto',
-    //   maxDots: 4000,
-    //   samplingRate: 1,
-    //   grids: [
-    //     [],
-    //   ],
-    // },
-  }
-  return projectFormat
-}
@@ -1,5 +1,9 @@
+import newDataZoom from '@/factories/chart/dataZoomFactory'
+import newChart from '@/factories/chart/chartFactory'
+import newTooltip from '@/factories/chart/tooltipFactory'
+import newSeries from '@/factories/chart/seriesFactory'
 import { dataStreamBuffer } from './DataStreamBuffer'
-import { projectInfo } from './ProjectInfo'
+import { taskInfo } from './TaskInfo'

 function getIndexArrayForBalenceSampleRate (indexArray, dis, l) {
  if (indexArray.length >= 3 || dis <= 0) {
@@ -25,7 +29,7 @@ function makeXAxis (gridIndex, type) {
    axisLine: { onZero: false, lineStyle: { color: '#aaa' } },
    axisTick: { show: false },
    axisLabel: { show: true, showMinLabel: false, showMaxLabel: false, color: '#aaa' },
-    splitLine: { show: false, lineStyle: { color: '#ddd' } },
+    splitLine: { show: true, lineStyle: { color: '#eee' } },
    scale: true,
    min: null,
    max: null,
@@ -50,12 +54,14 @@ function makeYAxis (gridIndex, type) {

 // generate grid
 function makeGrid (index, length) {
-  const _height = (80 / length) + '%'
-  const _top = index * (80 / length) + 1 + '%'
+  const _height = (85 / length) + '%'
+  const _top = index * (85 / length) + 1 + '%'
  return {
    index: index,
    top: _top,
    height: _height,
+    left: '15%',
+    right: '4%',
    series: [],
  }
 }
@@ -71,7 +77,24 @@ function getLegendName (sourceList, formulaID) {
          legendName += 'T'
          break
        case 'Neulive':
-          legendName += 'N' + source.id + 'CH' + source.channel
+          // legendName += 'N' + source.id + 'CH' + source.channel
+          switch (source.channel) {
+            case 257:
+              legendName += 'X'
+              break
+            case 258:
+              legendName += 'Y'
+              break
+            case 259:
+              legendName += 'Z'
+              break
+            case 260:
+              legendName += 'M'
+              break
+            default:
+              legendName += 'CH' + source.channel
+              break
+          }
          break
        case 'Elite':
          switch (source.channel) {
@@ -116,132 +139,9 @@ export const chartData = {
  // init chartID to chartData
  init: (chartID, maxDots, samplingRate, gridLength) => {
    if (_chartData[parseInt(chartID)] == null) {
-      _chartData[parseInt(chartID)] = {
-        chartID: parseInt(chartID),
-        cardName: 'chart' + String(chartID),
-        cardHeight: '500px',
-        cardWidth: 'auto',
-        mappingID: -1,
-        run: false,
-        rate: samplingRate,
-        maxDots: maxDots,
-        timer: 0,
-        legend: {
-          data: [],
-          x: 'center',
-          y: '88%',
-        },
-        tooltip: {},
-        axisPointer: {
-          link: [{ xAxisIndex: 'all' }],
-          snap: true,
-        },
-        grid: [],
-        xAxis: [],
-        yAxis: [],
-        dataZoom: [{
-          type: 'slider',
-          height: '15px',
-          bottom: '0%',
-          handleStyle: {
-            shadowColor: 'rgba(0, 0, 0, 0)',
-          },
-          showDataShadow: false,
-          showDetail: false,
-          xAxisIndex: [],
-        }, {
-          type: 'inside',
-          xAxisIndex: [],
-        },
-        {
-          type: 'slider',
-          height: '80%',
-          showDataShadow: false,
-          showDetail: false,
-          width: '15px',
-          // right: '5%',
-          yAxisIndex: [],
-        }],
-        series: [],
-      }
-      _chartData[chartID].tooltip = {
-        trigger: 'axis',
-        backgroundColor: '#fff',
-        borderColor: 'rgba(0, 0, 200, 0.2)',
-        borderWidth: 1,
-        borderRadius: 0,
-        padding: 10,
-        formatter: function (params) {
-          if (params.length) {
-            if (params[0].seriesName.split('_')[0] === 'T' && params[0].seriesName.split('_')[1] !== 'T') {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[0] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            } else if (params[0].seriesName.split('_')[0] !== 'T' && params[0].seriesName.split('_')[1] === 'T') {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[1] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            } else {
-              params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[2] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
-            }
-            let tip = ''
-            for (var i = 0; i < params.length; i++) {
-              const param = params[i]
-              const style = 'color: ' + param.color
-              let value
-              // console.log(param.value)
-              if (param.seriesName === 'Time') {
-                value = param.value[1]
-              } else if (param.seriesName.split('_')[1] === 'T' && param.seriesName.split('_')[0] !== 'T') {
-                if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
-                  value = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
-                } else {
-                  value = parseFloat(param.value[0]).toFixed(3)
-                }
-              } else if (param.seriesName.split('_')[1] !== 'T' && param.seriesName.split('_')[0] === 'T') {
-                if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
-                  value = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
-                } else {
-                  value = parseFloat(param.value[1]).toFixed(3)
-                }
-              } else {
-                let value1
-                let value2
-                if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
-                  value1 = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
-                } else {
-                  value1 = parseFloat(param.value[0]).toFixed(3)
-                }
-
-                if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' μV'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' nA'
-                } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
-                  value2 = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
-                } else {
-                  value2 = parseFloat(param.value[1]).toFixed(3)
-                }
-
-                value = value1 + ', ' + value2
-              }
-              tip += '<span style="' + style + '">' +
-                          param.seriesName +
-                          '：</span><span style="' +
-                          style + '">' + value + '</span><br>'
-            }
-            return tip
-          }
-        },
-      }
+      _chartData[parseInt(chartID)] = newChart(chartID)
+      _chartData[chartID].maxDots = maxDots
+      _chartData[chartID].tooltip = newTooltip()
      updateGridList(chartID, gridLength)
      return _chartData[chartID]
    } else {
@@ -263,29 +163,7 @@ export const chartData = {
    if (cardName == null) {
      _chartData[chartID].cardName = 'chart' + String(chartID)
    }
-    _chartData[chartID].dataZoom = [{
-      type: 'slider',
-      height: '15px',
-      bottom: '0%',
-      handleStyle: {
-        shadowColor: 'rgba(0, 0, 0, 0)',
-      },
-      showDataShadow: false,
-      showDetail: false,
-      xAxisIndex: [],
-    }, {
-      type: 'inside',
-      xAxisIndex: [],
-    },
-    {
-      type: 'slider',
-      height: '80%',
-      showDataShadow: false,
-      showDetail: false,
-      width: '15px',
-      // right: '5%',
-      yAxisIndex: [],
-    }]
+    _chartData[chartID].dataZoom = null
    updateGridList(chartID, 1)
  },

@@ -386,14 +264,14 @@ export const chartData = {
      if (series.formula != null) {
        let zeroBatch = false
        series.formulaSource.forEach(source => {
-          if (dataStreamBuffer.getByChartID(chartID)[projectInfo.getRawDeviceID(source[0])][source[1]].length === 0) {
+          if (dataStreamBuffer.getByChartID(chartID)[taskInfo.getRawDeviceID(source[0])][source[1]].length === 0) {
            zeroBatch = true
          }
        })
        if (zeroBatch) {
          series.formulaSource.forEach(source => {
-            if (dataStreamBuffer.getByChartID(chartID)[projectInfo.getRawDeviceID(source[0])][source[1]].length > 0) {
-              dataStreamBuffer.merge(chartID, projectInfo.getRawDeviceID(source[0]), source[1])
+            if (dataStreamBuffer.getByChartID(chartID)[taskInfo.getRawDeviceID(source[0])][source[1]].length > 0) {
+              dataStreamBuffer.merge(chartID, taskInfo.getRawDeviceID(source[0]), source[1])
            }
          })
          return false
@@ -402,7 +280,7 @@ export const chartData = {
          const indexNow = []
          const indexArray = []
          series.formulaSource.forEach((source, index) => {
-            const _popData = dataStreamBuffer.pop(chartID, projectInfo.getRawDeviceID(source[0]), source[1])
+            const _popData = dataStreamBuffer.pop(chartID, taskInfo.getRawDeviceID(source[0]), source[1])
            popData.push({
              data: _popData,
              indexRaw: index,
@@ -425,15 +303,15 @@ export const chartData = {
          let value
          switch (series.formula.type) {
            case 'Sheet Resistance':
-              for (let i = 0; i < Object.keys(popData[0].data).length; i++) {
+              for (let i = 0; i < popData[0].data.length; i++) {
                let dataI
                let dataV
-                dataV = popData[0].indexRaw === 0 ? popData[0].data[Object.keys(popData[0].data)[i]] : popData[1].data[Object.keys(popData[1].data)[indexNow[1]]]
-                dataI = popData[0].indexRaw === 1 ? popData[0].data[Object.keys(popData[0].data)[i]] : popData[1].data[Object.keys(popData[1].data)[indexNow[1]]]
+                dataV = popData[0].indexRaw === 0 ? popData[0].data[i].data : popData[1].data[indexNow[1]].data
+                dataI = popData[0].indexRaw === 1 ? popData[0].data[i].data : popData[1].data[indexNow[1]].data
                // console.log(dataV, dataI, popData[0], popData[1])
                // 4.5324 * 1000
                value = parseFloat(dataV / dataI) * 4532.4
-                series.data.push([parseInt(Object.keys(popData[1].data)[indexNow[1]]), value])
+                series.data.push([popData[1].data[indexNow[1]].time, value])
                indexNow[1]++

                if (series.dataYMax < value || series.dataYMax == null) {
@@ -447,11 +325,11 @@ export const chartData = {
                  if ((i + 1) % pattern[0] === 0) {
                    for (let j = 0; j < pattern[1]; j++) {
                      if (popData[1].data[Object.keys(popData[1].data)[indexNow[1]]] != null) {
-                        dataV = popData[0].indexRaw === 0 ? popData[0].data[Object.keys(popData[0].data)[i]] : popData[1].data[Object.keys(popData[1].data)[indexNow[1]]]
-                        dataI = popData[0].indexRaw === 1 ? popData[0].data[Object.keys(popData[0].data)[i]] : popData[1].data[Object.keys(popData[1].data)[indexNow[1]]]
+                        dataV = popData[0].indexRaw === 0 ? popData[0].data[i].data : popData[1].data[indexNow[1]].data
+                        dataI = popData[0].indexRaw === 1 ? popData[0].data[i].data : popData[1].data[indexNow[1]].data
                        // console.log(dataV, dataI, popData[0], popData[1])
                        value = parseFloat(dataV / dataI) * 4532.4
-                        series.data.push([parseInt(Object.keys(popData[1].data)[indexNow[1]]), value])
+                        series.data.push([popData[1].data[indexNow[1]].time, value])
                        indexNow[1]++

                        if (series.dataYMax < value || series.dataYMax == null) {
@@ -494,11 +372,11 @@ export const chartData = {
        }
        if (series.xAxisSource[0] === -1 || series.yAxisSource[0] === -1) {
          // x axis is time, y axis is value, so only need a device-channel data stream
-          let popData
+          let popData = []

          // get raw deviceID
-          const rawDeviceIDX = projectInfo.getRawDeviceID(series.xAxisSource[0])
-          const rawDeviceIDY = projectInfo.getRawDeviceID(series.yAxisSource[0])
+          const rawDeviceIDX = taskInfo.getRawDeviceID(series.xAxisSource[0])
+          const rawDeviceIDY = taskInfo.getRawDeviceID(series.yAxisSource[0])

          // pop data
          if (series.xAxisSource[0] === -1) {
@@ -507,9 +385,9 @@ export const chartData = {
            popData = dataStreamBuffer.pop(chartID, rawDeviceIDX, series.xAxisSource[1])
          }

-          for (const time in popData) {
-            const _popData = popData[time]
-            const _popTime = parseInt(time)
+          popData.forEach(data => {
+            const _popData = data.data
+            const _popTime = data.time
            // series data is empty or popdata time > last series data time
            if (series.xAxisSource[0] === -1) {
              if (series.data.length === 0 || _popTime > series.data[series.data.length - 1][0]) {
@@ -534,11 +412,24 @@ export const chartData = {
                }
              }
            }
-          }
+          })

-          // series data list shift
-          if (series.data.length > _chartData[chartID].maxDots) {
-            series.data.splice(0, series.data.length - _chartData[chartID].maxDots)
+          // series data list shift by points
+          // if (series.data.length > _chartData[chartID].maxDots) {
+          //   series.data.splice(0, series.data.length - _chartData[chartID].maxDots)
+          // }
+
+          // series data list shift by time
+          if (popData.length > 0) {
+            if (series.xAxisSource[0] === -1) {
+              if (series.data[series.data.length - 1][0] - series.data[0][0] > 10000000) {
+                series.data.splice(0, popData.length)
+              }
+            } else {
+              if (series.data[series.data.length - 1][1] - series.data[0][1] > 10000000) {
+                series.data.splice(0, popData.length)
+              }
+            }
          }

          // axis shift
@@ -546,32 +437,32 @@ export const chartData = {
            if (series.xAxisSource[0] === -1) {
              _chartData[chartID].xAxis[series.xAxisIndex].max = series.data[series.data.length - 1][0]
              _chartData[chartID].xAxis[series.xAxisIndex].min = series.data[0][0]
-              const center = (series.dataYMax + series.dataYMin) / 2
-              const range = (series.dataYMax - series.dataYMin)
-              if (_chartData[chartID].yAxis[series.yAxisIndex].max < center + (range * 2) || _chartData[chartID].yAxis[series.yAxisIndex].max == null) {
-                _chartData[chartID].yAxis[series.yAxisIndex].max = center + (range * 2)
-              }
-              if (_chartData[chartID].yAxis[series.yAxisIndex].min > center - (range * 2) || _chartData[chartID].yAxis[series.yAxisIndex].min == null) {
-                _chartData[chartID].yAxis[series.yAxisIndex].min = center - (range * 2)
-              }
+              // const center = (series.dataYMax + series.dataYMin) / 2
+              // const range = (series.dataYMax - series.dataYMin)
+              // if (_chartData[chartID].yAxis[series.yAxisIndex].max < center + (range * 2) || _chartData[chartID].yAxis[series.yAxisIndex].max == null) {
+              //   _chartData[chartID].yAxis[series.yAxisIndex].max = center + (range * 2)
+              // }
+              // if (_chartData[chartID].yAxis[series.yAxisIndex].min > center - (range * 2) || _chartData[chartID].yAxis[series.yAxisIndex].min == null) {
+              //   _chartData[chartID].yAxis[series.yAxisIndex].min = center - (range * 2)
+              // }
            } else {
              _chartData[chartID].yAxis[series.yAxisIndex].max = series.data[series.data.length - 1][1]
              _chartData[chartID].yAxis[series.yAxisIndex].min = series.data[0][1]
-              const center = (series.dataXMax + series.dataXMin) / 2
-              const range = (series.dataXMax - series.dataXMin)
-              if (_chartData[chartID].xAxis[series.xAxisIndex].max < center + (range * 2) || _chartData[chartID].xAxis[series.xAxisIndex].max == null) {
-                _chartData[chartID].xAxis[series.xAxisIndex].max = center + (range * 2)
-              }
-              if (_chartData[chartID].xAxis[series.xAxisIndex].min > center - (range * 2) || _chartData[chartID].xAxis[series.xAxisIndex].min == null) {
-                _chartData[chartID].xAxis[series.xAxisIndex].min = center - (range * 2)
-              }
+              // const center = (series.dataXMax + series.dataXMin) / 2
+              // const range = (series.dataXMax - series.dataXMin)
+              // if (_chartData[chartID].xAxis[series.xAxisIndex].max < center + (range * 2) || _chartData[chartID].xAxis[series.xAxisIndex].max == null) {
+              //   _chartData[chartID].xAxis[series.xAxisIndex].max = center + (range * 2)
+              // }
+              // if (_chartData[chartID].xAxis[series.xAxisIndex].min > center - (range * 2) || _chartData[chartID].xAxis[series.xAxisIndex].min == null) {
+              //   _chartData[chartID].xAxis[series.xAxisIndex].min = center - (range * 2)
+              // }
            }
          }
        } else {
          // x axis and y axis is value, so need two device-channel data stream and align
          // get real deviceID from controller
-          const rawDeviceIDX = projectInfo.getRawDeviceID(series.xAxisSource[0])
-          const rawDeviceIDY = projectInfo.getRawDeviceID(series.yAxisSource[0])
+          const rawDeviceIDX = taskInfo.getRawDeviceID(series.xAxisSource[0])
+          const rawDeviceIDY = taskInfo.getRawDeviceID(series.yAxisSource[0])

          // get real deviceID fault
          if (rawDeviceIDX == null || rawDeviceIDY == null) {
@@ -600,13 +491,13 @@ export const chartData = {

          // data align
          let indexArray = []
-          if (Math.abs(Object.keys(popDataX).length - Object.keys(popDataY).length) < 10) {
-            for (let i = 0; i < Object.keys(popDataX).length; i++) {
-              const _popDataX = (popDataX[Object.keys(popDataX)[i]])
-              const _popDataY = (popDataY[Object.keys(popDataY)[i]])
+          if (Math.abs(popDataX.length - popDataY.length) < 10) {
+            for (let i = 0; i < popDataX.length; i++) {
+              const _popDataX = (popDataX[i].data)
+              const _popDataY = (popDataY[i].data)
              if (_popDataY != null) {
                // [data1, data2, time]
-                series.data.push([_popDataX, _popDataY, parseInt(Object.keys(popDataX)[i])])
+                series.data.push([_popDataX, _popDataY, parseInt(popDataX[i].time)])
                if (series.dataXMax < _popDataX || series.dataXMax == null) {
                  series.dataXMax = _popDataX
                }
@@ -625,17 +516,17 @@ export const chartData = {
              }
            }
          } else {
-            const xLarge = Object.keys(popDataX).length > Object.keys(popDataY).length
-            const popDataLarge = Object.keys(popDataX).length > Object.keys(popDataY).length ? popDataX : popDataY
-            const popDataSmall = Object.keys(popDataX).length > Object.keys(popDataY).length ? popDataY : popDataX
+            const xLarge = popDataX.length > popDataY.length
+            const popDataLarge = popDataX.length > popDataY.length ? popDataX : popDataY
+            const popDataSmall = popDataX.length > popDataY.length ? popDataY : popDataX
            // get index array to know what time we need to copy a data to align its
-            indexArray = getIndexArrayForBalenceSampleRate([], Object.keys(popDataLarge).length - Object.keys(popDataSmall).length, Object.keys(popDataSmall).length)
+            indexArray = getIndexArrayForBalenceSampleRate([], popDataLarge.length - popDataSmall.length, popDataSmall.length)
            let _index = 0
-            for (let i = 0; i < Object.keys(popDataSmall).length; i++) {
-              let _popDataX = xLarge ? (popDataLarge[Object.keys(popDataLarge)[_index]]) : (popDataSmall[Object.keys(popDataSmall)[i]])
-              let _popDataY = xLarge ? (popDataSmall[Object.keys(popDataSmall)[i]]) : (popDataLarge[Object.keys(popDataLarge)[_index]])
+            for (let i = 0; i < popDataSmall.length; i++) {
+              let _popDataX = xLarge ? (popDataLarge[_index].data) : (popDataSmall[i].data)
+              let _popDataY = xLarge ? (popDataSmall[i].data) : (popDataLarge[_index].data)
              // [data1, data2, time]
-              series.data.push([_popDataX, _popDataY, parseInt(Object.keys(popDataLarge)[_index])])
+              series.data.push([_popDataX, _popDataY, parseInt(popDataLarge[_index].time)])
              _index++

              if (series.dataXMax < _popDataX || series.dataXMax == null) {
@@ -654,11 +545,11 @@ export const chartData = {
              indexArray.forEach(pattern => {
                if ((i + 1) % pattern[0] === 0) {
                  for (let j = 0; j < pattern[1]; j++) {
-                    _popDataX = xLarge ? (popDataLarge[Object.keys(popDataLarge)[_index]]) : (popDataSmall[Object.keys(popDataSmall)[i]])
-                    _popDataY = xLarge ? (popDataSmall[Object.keys(popDataSmall)[i]]) : (popDataLarge[Object.keys(popDataLarge)[_index]])
+                    _popDataX = xLarge ? (popDataLarge[_index].data) : (popDataSmall[i].data)
+                    _popDataY = xLarge ? (popDataSmall[i].data) : (popDataLarge[_index].data)
                    // [data1, data2, time]
                    if (_popDataX != null) {
-                      series.data.push([_popDataX, _popDataY, parseInt(Object.keys(popDataLarge)[_index])])
+                      series.data.push([_popDataX, _popDataY, parseInt(popDataLarge[_index].data)])
                      _index++
                      if (series.dataXMax < _popDataX || series.dataXMax == null) {
                        series.dataXMax = _popDataX
@@ -685,24 +576,24 @@ export const chartData = {
          }

          // update Axis
-          if (series.data.length > 0) {
-            const centerX = (series.dataXMax + series.dataXMin) / 2
-            const rangeX = (series.dataXMax - series.dataXMin)
-            const centerY = (series.dataYMax + series.dataYMin) / 2
-            const rangeY = (series.dataYMax - series.dataYMin)
-            if (_chartData[chartID].xAxis[series.xAxisIndex].max < (centerX + (rangeX * 2)) || _chartData[chartID].xAxis[series.xAxisIndex].max == null) {
-              _chartData[chartID].xAxis[series.xAxisIndex].max = (centerX + (rangeX * 2))
-            }
-            if (_chartData[chartID].xAxis[series.xAxisIndex].min > (centerX - (rangeX * 2)) || _chartData[chartID].xAxis[series.xAxisIndex].min === null) {
-              _chartData[chartID].xAxis[series.xAxisIndex].min = (centerX - (rangeX * 2))
-            }
-            if (_chartData[chartID].yAxis[series.yAxisIndex].max < (centerY + (rangeY * 2)) || _chartData[chartID].yAxis[series.yAxisIndex].max == null) {
-              _chartData[chartID].yAxis[series.yAxisIndex].max = (centerY + (rangeY * 2))
-            }
-            if (_chartData[chartID].yAxis[series.yAxisIndex].min > (centerY - (rangeY * 2)) || _chartData[chartID].yAxis[series.yAxisIndex].min === null) {
-              _chartData[chartID].yAxis[series.yAxisIndex].min = (centerY - (rangeY * 2))
-            }
-          }
+          // if (series.data.length > 0) {
+          //   const centerX = (series.dataXMax + series.dataXMin) / 2
+          //   const rangeX = (series.dataXMax - series.dataXMin)
+          //   const centerY = (series.dataYMax + series.dataYMin) / 2
+          //   const rangeY = (series.dataYMax - series.dataYMin)
+          //   if (_chartData[chartID].xAxis[series.xAxisIndex].max < (centerX + (rangeX * 2)) || _chartData[chartID].xAxis[series.xAxisIndex].max == null) {
+          //     _chartData[chartID].xAxis[series.xAxisIndex].max = (centerX + (rangeX * 2))
+          //   }
+          //   if (_chartData[chartID].xAxis[series.xAxisIndex].min > (centerX - (rangeX * 2)) || _chartData[chartID].xAxis[series.xAxisIndex].min === null) {
+          //     _chartData[chartID].xAxis[series.xAxisIndex].min = (centerX - (rangeX * 2))
+          //   }
+          //   if (_chartData[chartID].yAxis[series.yAxisIndex].max < (centerY + (rangeY * 2)) || _chartData[chartID].yAxis[series.yAxisIndex].max == null) {
+          //     _chartData[chartID].yAxis[series.yAxisIndex].max = (centerY + (rangeY * 2))
+          //   }
+          //   if (_chartData[chartID].yAxis[series.yAxisIndex].min > (centerY - (rangeY * 2)) || _chartData[chartID].yAxis[series.yAxisIndex].min === null) {
+          //     _chartData[chartID].yAxis[series.yAxisIndex].min = (centerY - (rangeY * 2))
+          //   }
+          // }
        }
      }
    })
@@ -712,12 +603,12 @@ export const chartData = {

  defaultChartGenerator: (_itemID, _chartID, _type) => {
    let item
-    projectInfo.getDeviceListRegister().forEach(_device => {
+    taskInfo.getDeviceListRegister().forEach(_device => {
      if (_itemID === _device.id) {
        item = _device
      }
    })
-    projectInfo.getFormulaList().forEach(_formula => {
+    taskInfo.getFormulaList().forEach(_formula => {
      if (_itemID === _formula.id) {
        item = _formula
      }
@@ -727,8 +618,8 @@ export const chartData = {
    }

    const _chartRegisterDevice = (chartID, device) => {
-      if (projectInfo.getDeviceInfo(device.id).info.library_name.indexOf('Elite') >= 0) {
-        switch (projectInfo.getDeviceInfo(device.id).parameterSet.MODE) {
+      if (taskInfo.getDeviceInfo(device.id).info.library_name.indexOf('Elite') >= 0) {
+        switch (taskInfo.getDeviceInfo(device.id).parameterSet.MODE) {
          case 0:
            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
            break
@@ -757,14 +648,20 @@ export const chartData = {
            chartRegister(chartID, 0, 'Elite', device.id, 2, 'Elite', device.id, 1, null)
            break
        }
-      } else if (projectInfo.getDeviceInfo(device.id).info.library_name.indexOf('Neulive') >= 0) {
-        const channelSet = projectInfo.getDeviceInfo(device.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
+      } else if (taskInfo.getDeviceInfo(device.id).info.library_name.indexOf('Neulive') >= 0) {
+        const channelSet = taskInfo.getDeviceInfo(device.id).parameterSet.RECORDING_CH.toString(2).split('').reverse()
+        const axisChannelSet = taskInfo.getDeviceInfo(device.id).parameterSet.AXIS_CH.toString(2).split('').reverse()
        let gridNumber = 0
        channelSet.forEach((element, index) => {
          if (parseInt(element) > 0) {
            gridNumber++
          }
        })
+        axisChannelSet.forEach((element, index) => {
+          if (parseInt(element) === 1) {
+            gridNumber++
+          }
+        })
        updateGridList(chartID, gridNumber)
        gridNumber = 0
        channelSet.forEach((element, index) => {
@@ -773,6 +670,23 @@ export const chartData = {
            gridNumber++
          }
        })
+        axisChannelSet.forEach((element, index) => {
+          if (parseInt(element) === 1) {
+            if (index === 0) {
+              chartRegister(chartID, gridNumber, 'Time', device.id, 1, 'Neulive', device.id, 257, null)
+              gridNumber++
+            } else if (index === 1) {
+              chartRegister(chartID, gridNumber, 'Time', device.id, 1, 'Neulive', device.id, 258, null)
+              gridNumber++
+            } else if (index === 2) {
+              chartRegister(chartID, gridNumber, 'Time', device.id, 1, 'Neulive', device.id, 259, null)
+              gridNumber++
+            } else if (index === 3) {
+              chartRegister(chartID, gridNumber, 'Time', device.id, 1, 'Neulive', device.id, 260, null)
+              gridNumber++
+            }
+          }
+        })
      }
    }

@@ -928,44 +842,38 @@ const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, dev
  // update dataZoom AxisIndex list
  const dataZoomXAxisIndex = Array.apply(null, { length: _chartData[chartID].xAxis.length }).map(Number.call, Number)
  const dataZoomYAxisIndex = Array.apply(null, { length: _chartData[chartID].yAxis.length }).map(Number.call, Number)
+  if (_chartData[chartID].dataZoom == null) {
+    _chartData[chartID].dataZoom = newDataZoom()
+  }
  _chartData[chartID].dataZoom[0].xAxisIndex = dataZoomXAxisIndex
  _chartData[chartID].dataZoom[1].xAxisIndex = dataZoomXAxisIndex
  _chartData[chartID].dataZoom[2].yAxisIndex = dataZoomYAxisIndex

  // register series
-  _chartData[chartID].series.push({
-    name: legendName,
-    type: 'line',
-    symbol: 'circle',
-    showSymbol: false,
-    symbolSize: 2,
-    sampling: 'average',
-    // clip the overflow on the coordinate system
-    // clip: true,
-    // ignore mouse events
-    // formula
-    formula: formula,
-    formulaSource: formulaSource,
-    silent: true,
-    xAxisIndex: _xAxisIndex,
-    yAxisIndex: _yAxisIndex,
-    // AxisSource: [deviceID, channel], use it to get data stream from buffer
-    xAxisSource: xAxisSource,
-    yAxisSource: yAxisSource,
-    animation: false,
-    dataXMax: null,
-    dataXMin: null,
-    dataYMax: null,
-    dataYMin: null,
-    itemStyle: {
-      normal: {
-      },
-    },
-    lineStyle: {
-      width: 2,
-    },
-    data: [],
-  })
+  const _series = newSeries('line', legendName, _xAxisIndex, _yAxisIndex, xAxisSource, yAxisSource, formula, formulaSource)
+  _chartData[chartID].series.push(_series)
+
+  // set xAxis format
+  if (sourceList[0].name === 'Time') {
+    _chartData[chartID].xAxis[_xAxisIndex].axisLabel.formatter = function (val) {
+      const label = parseInt(parseInt(val / 1000000) / 60) + ' m ' + parseInt((val % 60000000) / 1000000) + ' s'
+      return label
+    }
+  }
+
+  // set yAxis format
+  if (sourceList[1].name === 'Neulive') {
+    if (parseInt(sourceList[1].channel) === 257 || parseInt(sourceList[1].channel) === 258) {
+      _chartData[chartID].yAxis[_yAxisIndex].min = -200
+      _chartData[chartID].yAxis[_yAxisIndex].max = 200
+    } else if (parseInt(sourceList[1].channel) === 259) {
+      _chartData[chartID].yAxis[_yAxisIndex].min = -200
+      _chartData[chartID].yAxis[_yAxisIndex].max = 200
+    } else if (parseInt(sourceList[1].channel) === 260) {
+      _chartData[chartID].yAxis[_yAxisIndex].min = 0
+      _chartData[chartID].yAxis[_yAxisIndex].max = 160
+    }
+  }

  // register series into grid
  const _axisList = []
@@ -981,11 +889,11 @@ const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, dev
          _axisList.push(_axis + ' AXIS = TIME')
          break
        case 'Neulive':
-          dataStreamBuffer.register(chartID, projectInfo.getRawDeviceID(source.id), source.channel)
+          dataStreamBuffer.register(chartID, taskInfo.getRawDeviceID(source.id), source.channel)
          _axisList.push(_axis + ' AXIS = NEULIVE ' + source.id + ' CHANNEL ' + source.channel)
          break
        case 'Elite':
-          dataStreamBuffer.register(chartID, projectInfo.getRawDeviceID(source.id), source.channel)
+          dataStreamBuffer.register(chartID, taskInfo.getRawDeviceID(source.id), source.channel)
          switch (source.channel) {
            case 1:
              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CURRENT')
@@ -1002,7 +910,7 @@ const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, dev
          }
          break
        default:
-          dataStreamBuffer.register(chartID, projectInfo.getRawDeviceID(source.id), source.channel)
+          dataStreamBuffer.register(chartID, taskInfo.getRawDeviceID(source.id), source.channel)
          _axisList.push(_axis + ' AXIS = DEVICE ' + source.id + ' CHANNEL ' + source.channel)
          break
      }
@@ -1011,7 +919,7 @@ const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, dev
    _axisList.push('X AXIS = TIME')
    _axisList.push('Y AXIS = FORMULA' + formula.id)
    sourceList.forEach(source => {
-      dataStreamBuffer.register(chartID, projectInfo.getRawDeviceID(source.id), source.channel)
+      dataStreamBuffer.register(chartID, taskInfo.getRawDeviceID(source.id), source.channel)
    })
  }

@@ -1,6 +1,6 @@
 // import _global from '../global/global'
-import { chartData } from './ChartsManagement'
-import { projectInfo } from './ProjectInfo'
+// import { chartData } from './ChartsManagement'
+// import { taskInfo } from './TaskInfo'

 const _dataStreamBuffer = {}
 const _dataStreamBufferSize = 10
@@ -63,48 +63,38 @@ export const dataStreamBuffer = {
  into: (currentDataByChannel, currentDeviceID, currentChannel) => {
    // currentData = [ timeStart, d1, d2..... , timeEnd ]
    const currentData = JSON.parse(currentDataByChannel).binary.split(' ')
-    const timeStart = parseInt(currentData[0])
-    const timeEnd = parseInt(currentData[currentData.length - 1])
-    // d1, d2..., d100, timeStart=0, timeEnd=100, currentData = [ 0, d1, d2....., 100 ] (100-0)/(102-2)
-    const timeSpare = parseInt((timeEnd - timeStart) / (currentData.length - 2))
-    // add time to each data in a data batch
+    // const timeStart = parseInt(currentData[0])
+    // const timeEnd = parseInt(currentData[currentData.length - 1])
+    // // d1, d2..., d100, timeStart=0, timeEnd=100, currentData = [ 0, d1, d2....., 100 ] (100-0)/(102-2)
+    // const timeSpare = parseInt((timeEnd - timeStart) / (currentData.length - 2))
+    // // add time to each data in a data batch
    const dataBatch = []
-    for (let i = 1; i < currentData.length - 1; i++) {
+    for (let i = 0; i < currentData.length - 1; i += 2) {
+      // const dataSplit = currentData[i].split(' ')
      const tmpData = {
-        time: timeStart + ((i - 1) * timeSpare),
-        data: currentData[i],
+        time: parseInt(currentData[i]),
+        data: currentData[i + 1],
      }
+      // const tmpData = [parseInt(dataSplit[0]), dataSplit[1]]
      dataBatch.push(tmpData)
    }
    // add the datastream to buffer if chart listen the device and channel
+    // if (currentChannel === 8) {
+    //   console.log(dataBatch)
+    // }
    for (const chart in _dataStreamBuffer) {
-      const rate = chartData.getChartsData(chart).rate
      if (_dataStreamBuffer[chart][currentDeviceID] != null && _dataStreamBuffer[chart][currentDeviceID][currentChannel] != null) {
-        const samplingDataBatch = {}
-        let lastTime = -1
-        dataBatch.forEach(data => {
-          const samplingTime = parseInt(parseInt(data.time) / rate)
-          if (samplingTime > lastTime) {
-            if (projectInfo.getDeviceInfoByRawID(currentDeviceID).info.library_name.indexOf('Elite') >= 0) {
-              switch (currentChannel) {
-                case 1:
-                  samplingDataBatch[samplingTime] = parseFloat(data.data)
-                  break
-                case 2:
-                  samplingDataBatch[samplingTime] = parseFloat(data.data)
-                  break
-                case 3:
-                  samplingDataBatch[samplingTime] = parseFloat(data.data)
-                  break
-              }
-            } else {
-              samplingDataBatch[samplingTime] = parseFloat(data.data)
-            }
-          }
-          lastTime = samplingTime
-        })
+        // const samplingDataBatch = {}
+        // let lastTime = -1
+        // dataBatch.forEach(data => {
+        //   const samplingTime = parseInt(data.time)
+        //   if (samplingTime > lastTime) {
+        //     samplingDataBatch[samplingTime] = parseFloat(data.data)
+        //   }
+        //   lastTime = samplingTime
+        // })

-        _dataStreamBuffer[chart][currentDeviceID][currentChannel].push(samplingDataBatch)
+        _dataStreamBuffer[chart][currentDeviceID][currentChannel].push(dataBatch)
        if (_dataStreamBuffer[chart][currentDeviceID][currentChannel].length > _dataStreamBufferSize) {
          _dataStreamBuffer[chart][currentDeviceID][currentChannel].shift()
        }
@@ -116,17 +106,18 @@ export const dataStreamBuffer = {

  // pop the first batch data from datastream buffer
  pop: (chartID, deviceID, channel) => {
-    if (_dataStreamBuffer[chartID] != null && _dataStreamBuffer[chartID][deviceID] != null && _dataStreamBuffer[chartID][deviceID][channel] != null) {
+    if (_dataStreamBuffer[chartID] != null && _dataStreamBuffer[chartID][deviceID] != null &&
+        _dataStreamBuffer[chartID][deviceID][channel] != null && _dataStreamBuffer[chartID][deviceID][channel].length > 0) {
      return _dataStreamBuffer[chartID][deviceID][channel].shift()
    }
-    return null
+    return []
  },

  merge: (chartID, deviceID, channel) => {
    const bufferLength = _dataStreamBuffer[chartID][deviceID][channel].length
-    let newBatch = {}
+    const newBatch = []
    for (let i = 0; i < bufferLength; i++) {
-      newBatch = Object.assign(newBatch, _dataStreamBuffer[chartID][deviceID][channel].shift())
+      newBatch.concat(_dataStreamBuffer[chartID][deviceID][channel].shift())
    }
    _dataStreamBuffer[chartID][deviceID][channel].push(newBatch)
  },
@@ -0,0 +1,343 @@
+import newTask from '@/factories/task/taskFactory'
+
+const eliteImgUrl = require('@/assets/img/elite_img.png')
+const neuliveImgUrl = require('@/assets/img/neulive_img.png')
+// import { chartData } from './ChartsManagement'
+
+const _taskInfo = newTask()
+// show the devices which mac is included in task
+const _deviceList = []
+// show the devices which mac is included in task and do not show Time
+const _deviceListNoTime = []
+// show the all devices which is not register
+const _deviceListNotRegister = []
+// show the all devices which connected
+const _deviceListAll = []
+// show the all item can be mapping
+const _mappingList = []
+
+export const deviceListRegister = []
+
+const formulaIDStart = 4
+
+const updateAllList = async () => {
+  _deviceList.length = 0
+  _deviceListNoTime.length = 0
+  _deviceListNotRegister.length = 0
+  _deviceListAll.length = 0
+  _mappingList.length = 0
+  _deviceList.push({
+    id: -1,
+    name: 'Time',
+  })
+  for (const device in _taskInfo.deviceList) {
+    if (_taskInfo.deviceList[parseInt(device)].info.status === 'connected') {
+      let _deviceListNotRegisterAdd = true
+      _taskInfo.deviceAddrList.forEach(addr => {
+        if (addr.toString() === _taskInfo.deviceList[parseInt(device)].info.device_address.toString()) {
+          _deviceList.push({
+            id: _taskInfo.taskDeviceID.indexOf(parseInt(device)),
+            name: '[' + _taskInfo.taskDeviceID.indexOf(parseInt(device)) + '] ' + _taskInfo.deviceList[parseInt(device)].info.device_name,
+            type: _taskInfo.deviceList[parseInt(device)].info.library_name,
+          })
+          _deviceListNoTime.push({
+            id: _taskInfo.taskDeviceID.indexOf(parseInt(device)),
+            name: '[' + _taskInfo.taskDeviceID.indexOf(parseInt(device)) + '] ' + _taskInfo.deviceList[parseInt(device)].info.device_name,
+            type: _taskInfo.deviceList[parseInt(device)].info.library_name,
+          })
+          _mappingList.push({
+            id: _taskInfo.taskDeviceID.indexOf(parseInt(device)),
+            name: '[' + _taskInfo.taskDeviceID.indexOf(parseInt(device)) + '] ' + _taskInfo.deviceList[parseInt(device)].info.device_name,
+            type: _taskInfo.deviceList[parseInt(device)].info.library_name,
+          })
+          _deviceListNotRegisterAdd = false
+        }
+      })
+      if (_deviceListNotRegisterAdd) {
+        _deviceListNotRegister.push({
+          id: parseInt(device),
+          name: '[' + device + '] ' + _taskInfo.deviceList[parseInt(device)].info.device_name,
+          type: _taskInfo.deviceList[parseInt(device)].info.library_name,
+        })
+      }
+      _deviceListAll.push({
+        id: _taskInfo.taskDeviceID.indexOf(parseInt(device)),
+        name: '[' + _taskInfo.taskDeviceID.indexOf(parseInt(device)) + '] ' + _taskInfo.deviceList[parseInt(device)].info.device_name,
+        type: _taskInfo.deviceList[parseInt(device)].info.library_name,
+      })
+    }
+  }
+  _taskInfo.formulaList.forEach(formula => {
+    _mappingList.push({
+      id: formula.id,
+      name: formula.name,
+      type: formula.type,
+    })
+  })
+  return _deviceList
+}
+
+export const taskInfo = {
+
+  updateTaskInfo: async (taskID) => {
+    const update = async () => {
+      _taskInfo.controllerID = 'tommy_test'
+    }
+    // _taskInfo.deviceAddrList = [[128, 111, 176, 237, 124, 140], [164, 218, 50, 212, 231, 58], [24, 4, 237, 55, 198, 53]]
+    // _taskInfo.chartNumber = _taskInfo.deviceAddrList.length
+    await update()
+    return _taskInfo
+  },
+
+  destroyed: () => {
+    _taskInfo.controllerID = ''
+    _taskInfo.deviceAddrList.length = 0
+    _taskInfo.taskDeviceID.length = 0
+    _taskInfo.chartNumber = 0
+    deviceListRegister.length = 0
+    for (const device in _taskInfo.deviceList) {
+      _taskInfo.deviceList[device].info.status = ''
+      _taskInfo.deviceList[device].info.isSync = false
+    }
+    _taskInfo.formulaList.length = 0
+  },
+
+  deviceInfo: async (mes) => {
+    const mesObj = JSON.parse(mes)
+    const update = async () => {
+      try {
+        if (Array.isArray(mesObj.data)) {
+          mesObj.data.forEach(device => {
+            for (const item in device) {
+              if (parseInt(device.device_id) >= 0) {
+                if (item !== 'configuration') {
+                  _taskInfo.deviceList[device.device_id].info[item] = device[item]
+                } else {
+                  for (const parameter in device[item]) {
+                    _taskInfo.deviceList[device.device_id].parameterSet[parameter] = device[item][parameter]
+                  }
+                }
+              }
+            }
+          })
+        } else {
+          for (const item in mesObj.data) {
+            if (parseInt(mesObj.data.device_id) >= 0) {
+              if (item !== 'configuration') {
+                _taskInfo.deviceList[mesObj.data.device_id].info[item] = mesObj.data[item]
+              } else {
+                for (const parameter in mesObj.data[item]) {
+                  _taskInfo.deviceList[mesObj.data.device_id].parameterSet[parameter] = mesObj.data[item][parameter]
+                }
+              }
+            }
+          }
+        }
+      } catch (e) {
+        console.log(e)
+        return false
+      }
+    }
+    await update()
+    await updateAllList()
+    return true
+  },
+
+  deviceSavePath: async (mes) => {
+    const mesObj = JSON.parse(mes)
+    const update = async () => {
+      try {
+        _taskInfo.deviceList[mesObj.device].info.savePath = mesObj.data
+      } catch (e) {
+        console.log(e)
+        return false
+      }
+    }
+    await update()
+    return true
+  },
+
+  deviceParameter: async (mes) => {
+    const mesObj = JSON.parse(mes)
+    const update = async () => {
+      try {
+        for (const parameter in mesObj.data) {
+          _taskInfo.deviceList[mesObj.device].parameterSet[parameter] = mesObj.data[parameter]
+        }
+      } catch (e) {
+        console.log(e)
+        return false
+      }
+    }
+    await update()
+    await updateAllList()
+    return true
+  },
+
+  deviceConnected: async (id) => {
+    const update = async () => {
+      _taskInfo.deviceList[parseInt(id)].info.status = 'connected'
+    }
+    await update()
+    await updateAllList()
+  },
+
+  deviceDisconnected: async (deviceID) => {
+    const update = async () => {
+      taskInfo.getTaskInfo().deviceAddrList.splice(_taskInfo.taskDeviceID.indexOf(parseInt(deviceID)), 1)
+      deviceListRegister.forEach(device => {
+        if (device.id === _taskInfo.taskDeviceID.indexOf(parseInt(deviceID))) {
+          deviceListRegister.splice(deviceListRegister.indexOf(device), 1)
+        }
+      })
+      deviceListRegister.forEach(device => {
+        if (device.id > _taskInfo.taskDeviceID.indexOf(parseInt(deviceID))) {
+          device.id--
+        }
+      })
+      _taskInfo.taskDeviceID.splice(_taskInfo.taskDeviceID.indexOf(parseInt(deviceID)), 1)
+      _taskInfo.deviceList[parseInt(deviceID)].info.status = 'disconnected'
+    }
+    await update()
+    await updateAllList()
+  },
+
+  controllerShutdown: async () => {
+    const update = async () => {
+      for (const device in _taskInfo.deviceList) {
+        _taskInfo.deviceList[device].info.status = 'disconnected'
+      }
+      for (const chart in _taskInfo.chartList) {
+        _taskInfo.chartList[chart].run = false
+      }
+      deviceListRegister.length = 0
+    }
+    await update()
+    await updateAllList()
+  },
+
+  deviceStart: async (deviceID) => {
+    const update = async () => {
+      _taskInfo.deviceList[deviceID].info.isSync = true
+      deviceListRegister.forEach(device => {
+        if (device.id === _taskInfo.taskDeviceID.indexOf(parseInt(deviceID))) {
+          device.isSync = true
+        }
+      })
+    }
+    await update()
+  },
+
+  deviceStop: async (deviceID) => {
+    const update = async () => {
+      _taskInfo.deviceList[deviceID].info.isSync = false
+      deviceListRegister.forEach(device => {
+        if (device.id === _taskInfo.taskDeviceID.indexOf(parseInt(deviceID))) {
+          device.isSync = false
+        }
+      })
+    }
+    await update()
+  },
+
+  updateChartInfo: async () => {
+    // for (const chartID in _taskInfo.chartList) {
+    //   if (chartData.getChartsData(chartID) == null) {
+    //     chartData.init(chartID, 2000, 1, 1)
+    //   }
+    //   chartData.getChartsData(chartID).cardName = _taskInfo.chartList[chartID].cardName
+    //   chartData.getChartsData(chartID).run = _taskInfo.chartList[chartID].run
+    //   chartData.getChartsData(chartID).cardHeight = _taskInfo.chartList[chartID].cardHeight
+    //   chartData.getChartsData(chartID).cardWidth = _taskInfo.chartList[chartID].cardWidth
+    //   chartData.getChartsData(chartID).maxDots = _taskInfo.chartList[chartID].maxDots
+    //   chartData.getChartsData(chartID).samplingRate = _taskInfo.chartList[chartID].samplingRate
+    //   chartData.updateGridList(chartID, _taskInfo.chartList[chartID].grids.length)
+    //   for (let i = 0; i < _taskInfo.chartList[chartID].grids.length; i++) {
+    //     _taskInfo.chartList[chartID].grids[i].forEach(line => {
+    //       if (line.x[0] === -1) {
+    //         chartData.register('NeuLive', i, chartID, line.y[0], line.y[1])
+    //       } else {
+    //         chartData.register('Elite', i, chartID, line.x[0], line.x[1], line.y[0], line.y[1])
+    //       }
+    //     })
+    //   }
+    // }
+    // return _taskInfo
+  },
+
+  getDevicePic: (libraryName) => {
+    if (libraryName == null) {
+      return false
+    }
+    if (libraryName.indexOf('Elite') >= 0) {
+      return eliteImgUrl
+    } else if (libraryName.indexOf('Neulive') >= 0) {
+      return neuliveImgUrl
+    }
+  },
+
+  addFormula: (formula) => {
+    _taskInfo.formulaList.push(formula)
+  },
+
+  removeFormula: (formula) => {
+    _taskInfo.formulaList.splice(formula, 1)
+  },
+
+  updateAllList: async () => {
+    return await updateAllList()
+  },
+
+  getTaskInfo: () => {
+    return _taskInfo
+  },
+
+  getDeviceIDByRaw: (_deviceID) => {
+    return _taskInfo.taskDeviceID.indexOf(_deviceID)
+  },
+
+  getRawDeviceID: (_taskDeviceID) => {
+    return _taskInfo.taskDeviceID[_taskDeviceID]
+  },
+
+  getDeviceInfo: (_taskDeviceID) => {
+    return _taskInfo.deviceList[_taskInfo.taskDeviceID[_taskDeviceID]]
+  },
+
+  getDeviceInfoByRawID: (_deviceID) => {
+    return _taskInfo.deviceList[_deviceID]
+  },
+
+  getDeviceList: () => {
+    return _deviceList
+  },
+
+  getDeviceListNoTime: () => {
+    return _deviceListNoTime
+  },
+
+  getDeviceListNotRegister: () => {
+    return _deviceListNotRegister
+  },
+
+  getDeviceListAll: () => {
+    return _deviceListAll
+  },
+
+  getDeviceListRegister: () => {
+    return deviceListRegister
+  },
+
+  getMappingList: () => {
+    return _mappingList
+  },
+
+  getFormulaList: () => {
+    return _taskInfo.formulaList
+  },
+
+  getFormulaIDStart: () => {
+    return formulaIDStart
+  },
+
+}
@@ -0,0 +1,28 @@
+function newChart (chartID) {
+  return {
+    chartID: parseInt(chartID),
+    cardName: 'chart' + String(chartID),
+    cardHeight: '500px',
+    cardWidth: 'auto',
+    mappingID: -1,
+    run: false,
+    timer: 0,
+    legend: {
+      data: [],
+      x: 'center',
+      y: '92%',
+    },
+    tooltip: {},
+    axisPointer: {
+      link: [{ xAxisIndex: 'all' }],
+      snap: true,
+    },
+    grid: [],
+    xAxis: [],
+    yAxis: [],
+    dataZoom: null,
+    series: [],
+  }
+}
+
+export default newChart
@@ -0,0 +1,28 @@
+function newDataZoom () {
+  return [{
+    type: 'slider',
+    height: '10px',
+    bottom: '8%',
+    handleStyle: {
+      shadowColor: 'rgba(0, 0, 0, 0)',
+    },
+    showDataShadow: false,
+    showDetail: false,
+    xAxisIndex: [],
+  }, {
+    type: 'inside',
+    xAxisIndex: [],
+  },
+  {
+    type: 'slider',
+    filterMode: 'none',
+    height: '85%',
+    showDataShadow: false,
+    showDetail: false,
+    width: '10px',
+    right: '0%',
+    yAxisIndex: [],
+  }]
+}
+
+export default newDataZoom
@@ -0,0 +1,42 @@
+function newSeries (type, legendName, xAxisIndex, yAxisIndex, xAxisSource, yAxisSource, formula, formulaSource) {
+  return {
+    name: legendName,
+    type: type,
+    symbol: 'circle',
+    showSymbol: false,
+    showAllSymbol: false,
+    symbolSize: 2,
+    // sampling: 'average',
+    sampling: function (frame) {
+      return frame[0]
+    },
+    // clip the overflow on the coordinate system
+    // clip: true,
+    // ignore mouse events
+    // formula
+    formula: formula,
+    formulaSource: formulaSource,
+    silent: true,
+    xAxisIndex: xAxisIndex,
+    yAxisIndex: yAxisIndex,
+    // AxisSource: [deviceID, channel], use it to get data stream from buffer
+    xAxisSource: xAxisSource,
+    yAxisSource: yAxisSource,
+    animation: false,
+    hoverAnimation: false,
+    dataXMax: null,
+    dataXMin: null,
+    dataYMax: null,
+    dataYMin: null,
+    itemStyle: {
+      normal: {
+      },
+    },
+    lineStyle: {
+      width: 1.5,
+    },
+    data: [],
+  }
+}
+
+export default newSeries
@@ -0,0 +1,83 @@
+function newTooltip (chartID) {
+  return {
+    hideDelay: 5000,
+    trigger: 'axis',
+    backgroundColor: '#fff',
+    borderColor: 'rgba(0, 0, 200, 0.2)',
+    borderWidth: 1,
+    borderRadius: 0,
+    padding: 10,
+    formatter: function (params) {
+      if (params.length) {
+        if (params[0].seriesName.split('_')[0] === 'T' && params[0].seriesName.split('_')[1] !== 'T') {
+          params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[0] / 1000000).toFixed(3) + ' s'], color: '#5193f2' })
+        } else if (params[0].seriesName.split('_')[0] !== 'T' && params[0].seriesName.split('_')[1] === 'T') {
+          params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[1] / 1000000).toFixed(3) + ' s'], color: '#5193f2' })
+        } else {
+          params.unshift({ seriesName: 'Time', value: [null, parseFloat(params[0].value[2] / 1000000).toFixed(3) + ' s'], color: '#5193f2' })
+        }
+        let tip = ''
+        for (var i = 0; i < params.length; i++) {
+          const param = params[i]
+          const style = 'color: ' + param.color
+          let value
+          // console.log(param.value)
+          if (param.seriesName === 'Time') {
+            value = param.value[1]
+          } else if (param.seriesName.split('_')[1] === 'T' && param.seriesName.split('_')[0] !== 'T') {
+            if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
+              value = parseFloat(param.value[0]).toFixed(3) + ' μV'
+            } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
+              value = parseFloat(param.value[0]).toFixed(3) + ' nA'
+            } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
+              value = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
+            } else {
+              value = parseFloat(param.value[0]).toFixed(3)
+            }
+          } else if (param.seriesName.split('_')[1] !== 'T' && param.seriesName.split('_')[0] === 'T') {
+            if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
+              value = parseFloat(param.value[1]).toFixed(3) + ' μV'
+            } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
+              value = parseFloat(param.value[1]).toFixed(3) + ' nA'
+            } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
+              value = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
+            } else {
+              value = parseFloat(param.value[1]).toFixed(3)
+            }
+          } else {
+            let value1
+            let value2
+            if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'V') {
+              value1 = parseFloat(param.value[0]).toFixed(3) + ' μV'
+            } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'I') {
+              value1 = parseFloat(param.value[0]).toFixed(3) + ' nA'
+            } else if (param.seriesName.split('_')[0][param.seriesName.split('_')[0].length - 1] === 'R') {
+              value1 = parseFloat(param.value[0]).toFixed(3) + ' kΩ'
+            } else {
+              value1 = parseFloat(param.value[0]).toFixed(3)
+            }
+
+            if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'V') {
+              value2 = parseFloat(param.value[1]).toFixed(3) + ' μV'
+            } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'I') {
+              value2 = parseFloat(param.value[1]).toFixed(3) + ' nA'
+            } else if (param.seriesName.split('_')[1][param.seriesName.split('_')[1].length - 1] === 'R') {
+              value2 = parseFloat(param.value[1]).toFixed(3) + ' kΩ'
+            } else {
+              value2 = parseFloat(param.value[1]).toFixed(3)
+            }
+
+            value = value1 + ', ' + value2
+          }
+          tip += '<span style="' + style + '">' +
+                            param.seriesName +
+                            '：</span><span style="' +
+                            style + '">' + value + '</span><br>'
+        }
+        return tip
+      }
+    },
+  }
+}
+
+export default newTooltip
@@ -0,0 +1,25 @@
+
+function newState () {
+  return {
+    sidebar: {
+      opened: false,
+    },
+    config: {
+      palette: {
+        primary: '#4ae387',
+        danger: '#e34a4a',
+        info: '#4ab2e3',
+        success: '#db76df',
+        warning: '#f7cc36',
+        white: '#fff',
+        black: '#000',
+        fontColor: '#34495e',
+        transparent: 'transparent',
+        lighterGray: '#ddd',
+      },
+    },
+    isLoading: true,
+  }
+}
+
+export default newState
@@ -0,0 +1,21 @@
+import newParameterSet from './parameterSetFactory'
+
+function newDevice (deviceID) {
+  return {
+    info: {
+      battery: 0,
+      device_address: [],
+      device_id: deviceID,
+      device_name: '',
+      device_version: '',
+      library_name: '',
+      library_version: '',
+      serial_number: [],
+      status: '',
+      isSync: false,
+    },
+    parameterSet: newParameterSet(),
+  }
+}
+
+export default newDevice
@@ -0,0 +1,102 @@
+function newParameterSet () {
+  return {
+    // Neulive
+    ADC_CLOCK: 0,
+    ADDRESS: 0,
+    AMP_GAIN: 0,
+    CHANNEL: {},
+    CHOPPER_RATIO: 0,
+    CONTINUOUS_STI: true,
+    FREQUENCY: 0,
+    PERIOD: 0,
+    RECORDING: false,
+    RECORDING_CH: 0,
+    REGISTER: 0,
+    RIS_PARA: 0,
+    SAMPLE_RATE: 0,
+    STI1_CYCLE: 0,
+    STI2_CYCLE: 0,
+    STI3_CYCLE: 0,
+    STI4_CYCLE: 0,
+    STI5_CYCLE: 0,
+    STI6_CYCLE: 0,
+    STI7_CYCLE: 0,
+    STI8_CYCLE: 0,
+    STIMULATING: false,
+    STI_AMPLITUDE: 0,
+    STI_AMPLITUDE_H: 0,
+    STI_AMPLITUDE_L: 0,
+    STI_CHANNEL: 0,
+    STI_CHANNEL_SET: {},
+    STI_CLOCK_RATIO: 0,
+    STI_CYCLE: 0,
+    STI_CYCLE_LIST: [],
+    STI_H_BRIDGE: true,
+    STI_PATTERN: true,
+    STI_POLARITY: 0,
+    STI_POLARITY_LIST: [],
+    STI_REF: false,
+    STI_SWITCH: false,
+    STI_T1: [],
+    STI_T2: [],
+    STI_T3: [],
+    STI_T4: [],
+    STI_T5: [],
+    SYSTEM_CLK: 0,
+    StiChNumber: '',
+    VGRN: 0,
+    VGRP: 0,
+    VGR_INT_N: 0,
+    VGR_INT_OLD: 0,
+    VGR_INT_P: 0,
+    ch1: 0,
+    ch2: 0,
+    ch3: 0,
+    ch4: 0,
+    ch5: 0,
+    ch6: 0,
+    ch7: 0,
+    ch8: 0,
+    ADC_CHANNEL: 0,
+    // Neulive3.0
+    AXIS_CH: 0,
+    // Eilte
+    ADC_LEVEL: 0,
+    ADC_VALUE_I: 0,
+    ADC_VALUE_V: 0,
+    CHANNEL_LABEL: [],
+    CURRNET_LIMIT_VALUE: 1500000,
+    CYCLE_NUMBER: 0,
+    Charge: 1,
+    Const_Current_VStop: 0,
+    Const_Current_unit: 1,
+    Const_Current_value: 0,
+    DAC_VOLT: 25000,
+    Data_Resolution_Scan: 1000,
+    MODE: 0,
+    Resister_LEVEL: 3,
+    STEP_TIME: 1,
+    Scan_Rate: 10000,
+    VOLTSTOP_MAX: 50000,
+    VOLTSTOP_MIN: 0,
+    VOLT_EFINAL: 25000,
+    VOLT_FINAL: 25000,
+    VOLT_INITIAL: 25000,
+    VOLT_MAX: 27500,
+    VOLT_MIN: 22500,
+    VOLT_ORIGIN: 25000,
+    VOLT_STEP: 0,
+    // Elite1.5
+    ADC_LEVEL_I_15: 0,
+    ADC_LEVEL_V_IN_15: 0,
+    CTRL_HIGH_Z_15: 0,
+    ADC_DAC_CHANNEL_15: 0,
+    // Global
+    _DEVICE_ADDR_: '',
+    _DEVICE_NAME_: '',
+    _LIBRARY_: '',
+    _VERSION_: '',
+  }
+}
+
+export default newParameterSet
@@ -0,0 +1,20 @@
+import newDevice from './deviceFactory'
+
+function newTask () {
+  return {
+    controllerID: '',
+    deviceAddrList: [],
+    taskDeviceID: [],
+    chartNumber: 0,
+    deviceList: {
+      4: newDevice(4),
+      5: newDevice(5),
+      6: newDevice(6),
+      7: newDevice(7),
+    },
+    chartList: [],
+    formulaList: [],
+  }
+}
+
+export default newTask
@@ -87,14 +87,14 @@ export default new Router({
          component: () => import('../components/devices/DevicesOverview.vue'),
        },
        {
-          name: 'data-replay',
-          path: 'data-replay',
-          component: () => import('../components/analysis/replay/DataReplay.vue'),
+          name: 'neulive-data-replay',
+          path: 'data-replay/neulive/:metaList?',
+          component: () => import('../components/analysis/replay/neulive/NeuliveDataReplay.vue'),
        },
        {
-          name: 'project-content',
-          path: 'project-content/:projectID?',
-          component: () => import('../components/project/content/ProjectContent.vue'),
+          name: 'task-content',
+          path: 'task-content/:taskID?',
+          component: () => import('../components/task/content/TaskContent.vue'),
        },
        {
          name: 'file',
@@ -123,11 +123,11 @@ export default new Router({
              },
            },
            // {
-            //   name: 'project-content',
-            //   path: 'project-content/:projectID?',
-            //   component: () => import('../components/project/ProjectContent.vue'),
+            //   name: 'task-content',
+            //   path: 'task-content/:taskID?',
+            //   component: () => import('../components/task/TaskContent.vue'),
            //   meta: {
-            //     wikiLink: 'https://github.com/epicmaxco/vuestic-admin/wiki/Project-Content',
+            //     wikiLink: 'https://github.com/epicmaxco/vuestic-admin/wiki/Task-Content',
            //   },
            // },
          ],
@@ -1,20 +1,23 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import VuexI18n from 'vuex-i18n' // load vuex i18n module
-import app from './modules/app'
+// import app from './modules/app'
+import state from './state'
+import neuliveReplay from './modules/analysis/replay/neulive'
+import mutations from './mutations'

 import * as getters from './getters'

 Vue.use(Vuex)

 const store = new Vuex.Store({
-  strict: true, // process.env.NODE_ENV !== 'production',
+  strict: false, // process.env.NODE_ENV !== 'production',
  getters,
  modules: {
-    app,
+    neuliveReplay,
  },
-  state: {},
-  mutations: {},
+  state: state,
+  mutations: mutations,
 })

 Vue.use(VuexI18n.plugin, store)
@@ -0,0 +1,511 @@
+import newSeries from '@/factories/chart/seriesFactory'
+import newChart from '@/factories/chart/chartFactory'
+import newTooltip from '@/factories/chart/tooltipFactory'
+import newDataZoom from '@/factories/chart/dataZoomFactory'
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.chart
+
+// generate x axis format
+function makeXAxis (gridIndex, type) {
+  return {
+    type: type,
+    gridIndex: gridIndex,
+    axisLine: { show: false, onZero: false, lineStyle: { color: '#aaa' } },
+    axisTick: { show: false },
+    axisLabel: { show: false, showMinLabel: false, showMaxLabel: false, color: '#aaa' },
+    splitLine: { show: true, lineStyle: { color: '#eee' } },
+    scale: true,
+    min: null,
+    max: null,
+  }
+}
+
+// generate y axis format
+function makeYAxis (gridIndex, type) {
+  return {
+    type: type,
+    gridIndex: gridIndex,
+    axisTick: { show: false },
+    axisLine: { show: false }, // color: '#ccc' } },
+    axisLabel: { show: true, color: '#aaa', showMinLabel: false, showMaxLabel: false },
+    splitLine: { show: true, lineStyle: { color: '#eee' } },
+    animation: false,
+    scale: true,
+    min: null,
+    max: null,
+  }
+}
+
+// generate x axis format
+function makeXAxisOverview (gridIndex, type) {
+  return {
+    type: type,
+    gridIndex: gridIndex,
+    axisLine: { show: false, onZero: false, lineStyle: { color: '#aaa' } },
+    axisTick: { show: false },
+    axisLabel: { show: false, showMinLabel: false, showMaxLabel: false, color: '#aaa' },
+    splitLine: { show: false, lineStyle: { color: '#eee' } },
+    scale: true,
+    min: null,
+    max: null,
+  }
+}
+
+// generate y axis format
+function makeYAxisOverview (gridIndex, type) {
+  return {
+    type: type,
+    gridIndex: gridIndex,
+    axisTick: { show: false },
+    axisLine: { show: false }, // color: '#ccc' } },
+    axisLabel: { show: false, color: '#aaa', showMinLabel: false, showMaxLabel: false },
+    splitLine: { show: false, lineStyle: { color: '#eee' } },
+    animation: false,
+    scale: true,
+    min: null,
+    max: null,
+  }
+}
+
+// get legend name
+function getLegendName (sourceList, formulaID) {
+  let legendName = ''
+  if (formulaID == null) {
+    // source only 2 device
+    sourceList.forEach(source => {
+      switch (source.name) {
+        case 'Time':
+          legendName += 'T'
+          break
+        case 'Neulive':
+          legendName += '' + source.id + 'CH' + source.channel
+          break
+        case 'Elite':
+          switch (source.channel) {
+            case 1:
+              legendName += '' + source.id + '-I'
+              break
+            case 2:
+              legendName += '' + source.id + '-V'
+              break
+            case 3:
+              legendName += '' + source.id + '-R'
+              break
+            default:
+              legendName += '' + source.id + 'CH' + source.channel
+              break
+          }
+          break
+        default:
+          legendName += '' + source.id + 'CH' + source.channel
+          break
+      }
+      legendName += '_'
+    })
+    legendName = legendName.substr(0, legendName.length - 1)
+  } else {
+    legendName = 'T_F' + formulaID
+  }
+  return legendName
+}
+
+// generate grid
+function makeGrid (index, length, chartID) {
+  const _height = (82 / length) + '%'
+  const _top = index * (82 / length) + 1 + '%'
+  let _left
+  let _right
+  if (chartID === 0) {
+    _left = '0%'
+    _right = '0%'
+  } else {
+    _left = '15%'
+    _right = '4%'
+  }
+  return {
+    index: index,
+    top: _top,
+    height: _height,
+    left: _left,
+    right: _right,
+    series: [],
+  }
+}
+
+const actions = {
+
+  /**
+   * init data to chartData via chartID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID : chart id
+   * @param {int} gridLength : length of chart grid
+   * @return {object} : chart data
+   */
+  [typePath.init]: ({ state, getters, commit, dispatch }, payload) => {
+    // console.log(state)
+    if (payload.chartAllData[payload.chartID] == null) {
+      payload.chartAllData[payload.chartID] = newChart(payload.chartID)
+      if (payload.chartID !== 0) {
+        payload.chartAllData[payload.chartID].tooltip = newTooltip()
+      }
+
+      dispatch(typePath.updateGridList, { chartAllData: payload.chartAllData, chartID: payload.chartID, gridLength: payload.gridLength })
+      return payload.chartAllData[payload.chartID]
+    } else {
+      return payload.chartAllData[payload.chartID]
+    }
+  },
+
+  /**
+   * update grid length by chart ID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID
+   * @param {int} gridLength : chart data (echarts options)
+   */
+  [typePath.updateGridList]: async ({ state, getters, commit }, payload) => {
+    payload.chartAllData[payload.chartID].grid = []
+    for (let i = 0; i < payload.gridLength; i++) {
+      payload.chartAllData[payload.chartID].grid.push(makeGrid(i, payload.gridLength, payload.chartID))
+    }
+  },
+
+  /**
+   * reset data from chartData via chartID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID : chart id
+   * @param {int} gridLength : length of chart grid
+   * @return {object} : chart data
+   */
+  [typePath.reset]: ({ state, getters, commit, dispatch }, payload) => {
+    // delete
+    for (const _series of payload.chartAllData[payload.chartID].series) {
+      _series.data.length = 0
+      _series.length = 0
+    }
+    delete payload.chartAllData[payload.chartID]
+    dispatch(typePath.init, { chartAllData: payload.chartAllData, chartID: payload.chartID, gridLength: 1 })
+  },
+
+  /**
+   * clear all chart data
+   *
+   * @param {int} chartAllData
+   */
+  [typePath.clear]: ({ state, getters, commit }, payload) => {
+    for (const id in payload.chartAllData) {
+      for (const _series of payload.chartAllData[id].series) {
+        _series.data.length = 0
+        _series.length = 0
+      }
+      delete payload.chartAllData[id]
+    }
+  },
+
+  /**
+   * update datazoom by chart ID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID
+   */
+  [typePath.updateDataZoom]: (state, payload) => {
+    // update dataZoom AxisIndex list
+    const dataZoomXAxisIndex = Array.apply(null, { length: payload.chartAllData[payload.chartID].xAxis.length }).map(Number.call, Number)
+    const dataZoomYAxisIndex = Array.apply(null, { length: payload.chartAllData[payload.chartID].yAxis.length }).map(Number.call, Number)
+    if (payload.chartAllData[payload.chartID].dataZoom == null && payload.chartID !== 0) {
+      payload.chartAllData[payload.chartID].dataZoom = newDataZoom()
+    }
+    if (payload.chartAllData[payload.chartID].dataZoom != null) {
+      payload.chartAllData[payload.chartID].dataZoom[0].xAxisIndex = dataZoomXAxisIndex
+      payload.chartAllData[payload.chartID].dataZoom[1].xAxisIndex = dataZoomXAxisIndex
+      payload.chartAllData[payload.chartID].dataZoom[2].yAxisIndex = dataZoomYAxisIndex
+    }
+  },
+
+  /**
+   * set time format to xAxis by chart ID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID
+   * @param {int} xAxisIndex
+   * @param {object} series : chart series (echarts series)
+   */
+  [typePath.setTimeXAxis]: (state, payload) => {
+    payload.chartAllData[payload.chartID].xAxis[payload.xAxisIndex].axisLabel.formatter = function (val) {
+      const label = parseInt(parseInt(val / 1000000) / 60) + ' m ' + parseInt((val % 60000000) / 1000000) + ' s'
+      return label
+    }
+  },
+
+  /**
+   * register device-channel to chartData
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID : chart id
+   * @param {int} gridIndex : index of grid
+   * @param {int} deviceNameX
+   * @param {int} deviceIDX
+   * @param {int} channelX
+   * @param {int} deviceNameY
+   * @param {int} deviceIDY
+   * @param {int} channelY
+   * @param {int} formula
+   * @return {object} : chart data
+   */
+  [typePath.register]: ({ state, getters, commit, dispatch }, payload) => {
+    const chartData = payload.chartAllData[payload.chartID]
+    const sourceList = [
+      {
+        name: payload.deviceNameX,
+        id: payload.deviceIDX,
+        channel: payload.channelX,
+      },
+      {
+        name: payload.deviceNameY,
+        id: payload.deviceIDY,
+        channel: payload.channelY,
+      },
+    ]
+    if (chartData == null) {
+      return false
+    }
+
+    let xAxisType
+    let yAxisType
+    let xAxisSource
+    let yAxisSource
+    // formulaSource
+    const formulaSource = []
+    let legendName
+
+    if (payload.formula == null) {
+      legendName = getLegendName(sourceList, payload.formula)
+    } else {
+      legendName = getLegendName(sourceList, payload.formula.id)
+    }
+
+    if (payload.formula == null) {
+      switch (sourceList[0].name) {
+        case 'Time':
+          xAxisType = 'time'
+          xAxisSource = [-1, -1]
+          break
+        default:
+          xAxisType = 'value'
+          xAxisSource = [sourceList[0].id, sourceList[0].channel]
+          break
+      }
+      switch (sourceList[1].name) {
+        case 'Time':
+          yAxisType = 'time'
+          yAxisSource = [-1, -1]
+          break
+        default:
+          yAxisType = 'value'
+          yAxisSource = [sourceList[1].id, sourceList[1].channel]
+          break
+      }
+    } else {
+      sourceList.forEach(source => {
+        formulaSource.push([source.id, source.channel])
+      })
+      xAxisType = 'time'
+      yAxisType = 'value'
+    }
+
+    // register legendName
+    if (chartData.legend.data.indexOf(legendName) >= 0) {
+      // have been registered
+      return false
+    }
+
+    // push legendName
+    chartData.legend.data.push(payload.legendName)
+
+    // if AxisIndex != -1 then add new axis into list
+    let _xAxisIndex = -1
+    let _yAxisIndex = -1
+    // the grid have exist, so just use the axis in grid
+    for (let i = 0; i < chartData.xAxis.length; i++) {
+      if (chartData.xAxis[i].gridIndex === payload.gridIndex) {
+        _xAxisIndex = i
+      }
+    }
+    for (let i = 0; i < chartData.yAxis.length; i++) {
+      if (chartData.yAxis[i].gridIndex === payload.gridIndex) {
+        _yAxisIndex = i
+      }
+    }
+
+    // create new axis
+    if (_xAxisIndex === -1) {
+      if (payload.chartID === 0) {
+        chartData.xAxis.push(makeXAxisOverview(payload.gridIndex, xAxisType))
+      } else {
+        chartData.xAxis.push(makeXAxis(payload.gridIndex, xAxisType))
+      }
+      _xAxisIndex = chartData.xAxis.length - 1
+    }
+    if (_yAxisIndex === -1) {
+      if (payload.chartID === 0) {
+        chartData.yAxis.push(makeYAxisOverview(payload.gridIndex, yAxisType))
+      } else {
+        chartData.yAxis.push(makeYAxis(payload.gridIndex, yAxisType))
+      }
+      _yAxisIndex = chartData.yAxis.length - 1
+    }
+
+    dispatch(typePath.updateDataZoom, { chartAllData: payload.chartAllData, chartID: payload.chartID })
+
+    // register series
+    const _series = newSeries('line', legendName, _xAxisIndex, _yAxisIndex, xAxisSource, yAxisSource, payload.formula, formulaSource)
+    chartData.series.push(_series)
+
+    // set xAxis format
+    if (sourceList[0].name === 'Time') {
+      dispatch(typePath.setTimeXAxis, { chartAllData: payload.chartAllData, chartID: payload.chartID, xAxisIndex: _xAxisIndex })
+    }
+
+    // register series into grid
+    const _axisList = []
+
+    if (payload.formula == null) {
+      sourceList.forEach((source, index) => {
+        let _axis = 'X'
+        if (index !== 0) {
+          _axis = 'Y'
+        }
+        switch (source.name) {
+          case 'Time':
+            _axisList.push(_axis + ' AXIS = TIME')
+            break
+          case 'Neulive':
+            _axisList.push(_axis + ' AXIS = NEULIVE ' + source.id + ' CHANNEL ' + source.channel)
+            break
+          case 'Elite':
+            switch (source.channel) {
+              case 1:
+                _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CURRENT')
+                break
+              case 2:
+                _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' VOLTAGE')
+                break
+              case 3:
+                _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' RESISTANCE')
+                break
+              default:
+                _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CHANNEL ' + source.channel)
+                break
+            }
+            break
+          default:
+            _axisList.push(_axis + ' AXIS = DEVICE ' + source.id + ' CHANNEL ' + source.channel)
+            break
+        }
+      })
+    } else {
+      _axisList.push('X AXIS = TIME')
+      _axisList.push('Y AXIS = FORMULA' + payload.formula.id)
+    }
+
+    const _gridSeries = {
+      name: legendName,
+      xAxis: _axisList[0],
+      yAxis: _axisList[1],
+    }
+
+    chartData.grid[payload.gridIndex].series.push(_gridSeries)
+
+    // console.log(chartData)
+    return chartData
+  },
+
+  // /**
+  //  * remove device-channel from chart TODO
+  //  *
+  //  * @param {object} chartAllData
+  //  * @param {int} chartID
+  //  * @param {int} legendName
+  //  * @return {object} : chart data
+  //  */
+  // [typePath.remove]: ({ state, getters, commit }, payload) => {
+  //   const chartData = getters.getDataByIDChart(payload.chartID)
+  //   if (chartData == null || chartData.legend.data.length === 0) {
+  //     return false
+  //   }
+
+  //   let _xAxisIndex = -1
+  //   let _yAxisIndex = -1
+
+  //   // remove legend
+  //   const _legendIndex = chartData.legend.data.indexOf(payload.legendName)
+  //   console.log(_legendIndex)
+  //   if (_legendIndex >= 0) {
+  //     chartData.legend.data.splice(chartData.legend.data.indexOf(payload.legendName), 1)
+  //   } else {
+  //     return false
+  //   }
+  //   // remove series
+  //   for (let i = 0; i < chartData.series.length; i++) {
+  //     if (chartData.series[i].name === payload.legendName) {
+  //       _xAxisIndex = chartData.series[i].xAxisIndex
+  //       _yAxisIndex = chartData.series[i].yAxisIndex
+  //       chartData.series.splice(i, 1)
+  //       break
+  //     }
+  //   }
+  //   // remove grid series name
+  //   const _gridIndex = chartData.xAxis[_xAxisIndex].gridIndex
+  //   for (let i = 0; i < chartData.grid[_gridIndex].series.length; i++) {
+  //     if (chartData.grid[_gridIndex].series[i] === payload.legendName) {
+  //       chartData.grid[_gridIndex].series.splice(i, 1)
+  //       break
+  //     }
+  //   }
+  //   for (let i = 0; i < chartData.grid.length; i++) {
+  //     if (chartData.grid[i].name === payload.legendName) {
+  //       _xAxisIndex = chartData.series[i].xAxisIndex
+  //       _yAxisIndex = chartData.series[i].yAxisIndex
+  //       chartData.series.splice(i, 1)
+  //       break
+  //     }
+  //   }
+  //   chartData.series.forEach(series => {
+  //     if (series.xAxisIndex === _xAxisIndex) {
+  //       _xAxisIndex = -1
+  //     }
+  //     if (series.yAxisIndex === _yAxisIndex) {
+  //       _yAxisIndex = -1
+  //     }
+  //   })
+  //   // remove xAxis
+  //   if (_xAxisIndex !== -1) {
+  //     chartData.xAxis.splice(_xAxisIndex, 1)
+  //     chartData.series.forEach(series => {
+  //       if (series.xAxisIndex > _xAxisIndex) {
+  //         series.xAxisIndex--
+  //       }
+  //     })
+  //     chartData.dataZoom[0].xAxisIndex.pop()
+  //   }
+  //   // remove yAxis
+  //   if (_yAxisIndex !== -1) {
+  //     chartData.yAxis.splice(_yAxisIndex, 1)
+  //     chartData.series.forEach(series => {
+  //       if (series.yAxisIndex > _yAxisIndex) {
+  //         series.yAxisIndex--
+  //       }
+  //     })
+  //     chartData.dataZoom[2].yAxisIndex.pop()
+  //   }
+
+  //   console.log(chartData)
+  //   return true
+  // },
+
+}
+
+export default actions
@@ -0,0 +1,9 @@
+import chartAct from './chartAct'
+import metaAct from './metaAct'
+import recAct from './recAct'
+
+export default {
+  ...chartAct,
+  ...metaAct,
+  ...recAct,
+}
@@ -0,0 +1,23 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.meta
+
+const metaActs = {
+  /**
+   * init meta
+   *
+   * @param {Array} metaIDList
+   * @param {objuct} api
+   * @return {object} : meta list info
+   */
+  [typePath.init]: async ({ state, getters, commit }, payload) => {
+    const promises = payload.metaIDList.map(async id => {
+      const metaRes = await payload.api.getMetaFilesByID(id)
+      return metaRes.data[0]
+    })
+    const list = await Promise.all(promises)
+    commit(typePath.set, { list: list })
+  },
+}
+
+export default metaActs
@@ -0,0 +1,83 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.rec
+
+const recActs = {
+  /**
+   * get rec by list index
+   *
+   * @param {objuct} api
+   * @return {object} : rec info
+   */
+  [typePath.init]: async ({ state, getters, commit }, payload) => {
+    const metaList = getters.getAllMeta
+    const _rec = {}
+    metaList.forEach(meta => {
+      _rec[meta.id] = {}
+      JSON.parse(meta.channels).forEach(ch => {
+        _rec[meta.id][ch] = {
+          1: [],
+          10: [],
+          100: [],
+          1000: [],
+        }
+      })
+    })
+
+    const getRawInfo = metaList.map(async meta => {
+      const getData = JSON.parse(meta.channels).map(async ch => {
+        const res = await payload.api.getRawFilesAttrByParent(ch, meta.id, 'id-start_time-end_time')
+        res.data.forEach(_data => {
+          _data.load = false
+          _data.data = []
+          if (_data.end_time < 0) {
+            _data.end_time = meta.time_duration
+          }
+          _rec[meta.id][ch][1].push(_data)
+        })
+        return res.data
+      })
+      return await Promise.all(getData)
+    })
+    await Promise.all(getRawInfo)
+
+    const getMiniInfo = metaList.map(async meta => {
+      const getData = JSON.parse(meta.channels).map(async ch => {
+        const res = await payload.api.getMiniFilesAttrByParent(ch, meta.id, 'id-start_time-end_time-scale')
+        res.data.forEach(_data => {
+          _data.load = false
+          _data.data = []
+          if (_data.end_time < 0) {
+            _data.end_time = meta.time_duration
+          }
+          _rec[meta.id][ch][parseInt(_data.scale)].push(_data)
+        })
+        return res.data
+      })
+      return await Promise.all(getData)
+    })
+    await Promise.all(getMiniInfo)
+    commit(typePath.set, { data: _rec })
+  },
+
+  /**
+  * into data to rec
+  *
+  * @param {int} index
+  * @param {int} metaID
+  * @param {int} channel
+  * @param {int} scale
+  * @param {object} data
+  */
+  [typePath.intoData]: async ({ state, getters, commit }, payload) => {
+    commit(typePath.updateDataByIndex, {
+      index: payload.index,
+      metaID: payload.metaID,
+      channel: payload.channel,
+      scale: payload.scale,
+      data: payload.data,
+    })
+  },
+}
+
+export default recActs
@@ -0,0 +1,7 @@
+import metaGet from './metaGet'
+import recGet from './recGet'
+
+export default {
+  ...metaGet,
+  ...recGet,
+}
@@ -0,0 +1,44 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.meta
+
+const metaGets = {
+  /**
+   * get meta by list index
+   *
+   * @param {int} index
+   * @return {object} : meta info
+   */
+  [typePath.getByIndex]: (state) => (index) => {
+    if (index == null || state.chartData[index] == null) {
+      return null
+    }
+    return state.metaList[index]
+  },
+
+  /**
+   * get meta by id
+   *
+   * @param {int} id
+   * @return {object} : meta info
+   */
+  [typePath.getByID]: (state) => (id) => {
+    state.metaList.forEach(meta => {
+      if (meta.id === id) {
+        return meta
+      }
+    })
+    return null
+  },
+
+  /**
+   * get all meta info
+   *
+   * @return {Array} : meta list
+   */
+  [typePath.getAll]: (state) => {
+    return state.metaList
+  },
+}
+
+export default metaGets
@@ -0,0 +1,24 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.rec
+
+const recGets = {
+  /**
+   * get rec by meta
+   *
+   * @return {object} : rec data
+   */
+  [typePath.getByMeta]: (state) => (meta) => {
+    return state.recInfo[meta]
+  },
+
+  /**
+   * get all rec data
+   * @return {Object} : rec data
+   */
+  [typePath.getAll]: (state) => {
+    return state.recInfo
+  },
+}
+
+export default recGets
@@ -0,0 +1,12 @@
+import actions from './actions'
+import getters from './getters'
+import mutations from './mutations'
+import state from './state'
+
+export default {
+  namespaced: true,
+  state: state,
+  getters: getters,
+  actions: actions,
+  mutations: mutations,
+}
@@ -0,0 +1,7 @@
+import metaMut from './metaMut'
+import recMut from './recMut'
+
+export default {
+  ...metaMut,
+  ...recMut,
+}
@@ -0,0 +1,31 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.meta
+
+const metaMutations = {
+  /**
+   * set meta list
+   *
+   */
+  [typePath.set]: async (state, payload) => {
+    state.metaList.length = 0
+    state.metaList = payload.list
+  },
+
+  /**
+  * Updates the meta info by index
+  *
+  * @param {number} index
+  * @param {any} item
+  */
+  [typePath.updateByIndex]: function (state, payload) {
+    for (const item in payload) {
+      if (item !== 'index') {
+        state.metaList[payload.index][item] = payload[item]
+      }
+    }
+  },
+
+}
+
+export default metaMutations
@@ -0,0 +1,42 @@
+import types from '@/store/modules/analysis/replay/neulive/types'
+
+const typePath = types.rec
+
+const recMutations = {
+  /**
+   * set rec list
+   *
+   * @param {object} data
+   */
+  [typePath.set]: async (state, payload) => {
+    state.recInfo = payload.data
+  },
+
+  /**
+  * Updates the rec info by index
+  *
+  * @param {any} item
+  */
+  [typePath.update]: function (state, payload) {
+    for (const item in payload) {
+      state.recInfo[item] = payload[item]
+    }
+  },
+
+  /**
+  * update data rec
+  *
+  * @param {int} index
+  * @param {int} metaID
+  * @param {int} channel
+  * @param {int} scale
+  * @param {object} data
+  */
+  [typePath.updateDataByIndex]: function (state, payload) {
+    state.recInfo[payload.metaID][payload.channel][payload.scale][payload.index].data = payload.data
+    state.recInfo[payload.metaID][payload.channel][payload.scale][payload.index].load = true
+  },
+
+}
+
+export default recMutations
@@ -0,0 +1,20 @@
+function newState () {
+  return {
+    recInfo: {},
+    // recInfo format:
+    // {
+    //   scale: [
+    //     {
+    //       id: _id,
+    //       start_time: _start_time,
+    //       end_time: _end_time,
+    //       data: _data
+    //       load: _load
+    //     }
+    //   ]
+    // }
+    metaList: [],
+  }
+}
+
+export default newState
@@ -0,0 +1,55 @@
+
+const types = {
+  chart: {
+    init: 'initChart',
+    reset: 'resetChart',
+    register: 'registerChart',
+    remove: 'removeChart',
+    clear: 'clearChart',
+
+    getDataByID: 'getDataByIDChart',
+    getAllData: 'getAllDataChart',
+
+    setChartData: 'setChartDataChart',
+    setTooltip: 'setTooltipChart',
+    setMarkArea: 'setMarkAreaChart',
+    setMarkAreaData: 'setMarkAreaDataChart',
+    setDataZoom: 'setDataZoomChart',
+    updateDataZoom: 'updateDataZoomChart',
+    updateGridList: 'updateGridListChart',
+    pushSeries: 'pushSeriesChart',
+    pushAxis: 'pushAxisChart',
+    pushLegendName: 'pushLegendNameChart',
+    setTimeXAxis: 'setTimeXAxisChart',
+    pushGridSeries: 'pushGridSeriesChart',
+    deleteByID: 'deleteByIDChart',
+    update: 'updateChart',
+    updateSeries: 'updateSeriesChart',
+    updateAxis: 'updateAxisChart',
+    updateSeriesData: 'updateSeriesDataChart',
+  },
+  meta: {
+    init: 'initMeta',
+
+    set: 'setMeta',
+    setByApi: 'setByApiMeta',
+    updateByIndex: 'updateByIndexMeta',
+
+    getByIndex: 'getByIndexMeta',
+    getByID: 'getByIDMeta',
+    getAll: 'getAllMeta',
+  },
+  rec: {
+    init: 'initRec',
+    intoData: 'intoDataRec',
+
+    set: 'setRec',
+    update: 'updateRec',
+    updateDataByIndex: 'updateDataByIndexRec',
+
+    getAll: 'getAllRec',
+  },
+
+}
+
+export default types
@@ -1,35 +0,0 @@
-const state = {
-  sidebar: {
-    opened: false,
-  },
-  config: {
-    palette: {
-      primary: '#4ae387',
-      danger: '#e34a4a',
-      info: '#4ab2e3',
-      success: '#db76df',
-      warning: '#f7cc36',
-      white: '#fff',
-      black: '#000',
-      fontColor: '#34495e',
-      transparent: 'transparent',
-      lighterGray: '#ddd',
-    },
-  },
-  isLoading: true,
-}
-
-const mutations = {
-  setLoading (state, isLoading) {
-    state.isLoading = isLoading
-  },
-}
-
-const actions = {
-}
-
-export default {
-  state,
-  mutations,
-  actions,
-}
@@ -0,0 +1,9 @@
+import types from '@/store/types'
+
+const app = {
+  [types.global.setLoading]: (state, isLoading) => {
+    state.isLoading = isLoading
+  },
+}
+
+export default app
@@ -0,0 +1,7 @@
+import app from './app'
+
+const mutations = {
+  ...app,
+}
+
+export default mutations
@@ -0,0 +1,3 @@
+import newState from '@/factories/stateFactory'
+
+export default newState()
@@ -0,0 +1,55 @@
+
+const types = {
+  global: {
+    setLoading: 'setLoading',
+  },
+
+  // analysis: {
+  //   replay: {
+  //     neulive: {
+  //       chart: {
+  //         init: 'initReplayNeuliveChart',
+  //         reset: 'resetReplayNeuliveChart',
+  //         register: 'registerReplayNeuliveChart',
+  //         remove: 'removeReplayNeuliveChart',
+  //         clear: 'clearReplayNeuliveChart',
+
+  //         getDataByID: 'getDataByIDReplayNeuliveChart',
+  //         getAllData: 'getAllDataReplayNeuliveChart',
+
+  //         setChartData: 'setChartDataReplayNeuliveChart',
+  //         setTooltip: 'setTooltipReplayNeuliveChart',
+  //         setMarkArea: 'setMarkAreaReplayNeuliveChart',
+  //         setMarkAreaData: 'setMarkAreaDataReplayNeuliveChart',
+  //         setDataZoom: 'setDataZoomReplayNeuliveChart',
+  //         updateDataZoom: 'updateDataZoomReplayNeuliveChart',
+  //         updateGridList: 'updateGridListReplayNeuliveChart',
+  //         pushSeries: 'pushSeriesReplayNeuliveChart',
+  //         pushAxis: 'pushAxisReplayNeuliveChart',
+  //         pushLegendName: 'pushLegendNameReplayNeuliveChart',
+  //         setTimeXAxis: 'setTimeXAxisReplayNeuliveChart',
+  //         pushGridSeries: 'pushGridSeriesReplayNeuliveChart',
+  //         deleteByID: 'deleteByIDReplayNeuliveChart',
+  //         update: 'updateReplayNeuliveChart',
+  //         updateSeries: 'updateSeriesReplayNeuliveChart',
+  //         updateAxis: 'updateAxisReplayNeuliveChart',
+  //       },
+  //       meta: {
+  //         set: 'setReplayNeuliveMeta',
+  //         setByApi: 'setByApiReplayNeuliveMeta',
+  //         updateByIndex: 'updateByIndexReplayNeuliveMeta',
+
+  //         getByIndex: 'getByIndexReplayNeuliveMeta',
+  //         getByID: 'getByIDReplayNeuliveMeta',
+  //         getAll: 'getAllReplayNeuliveMeta',
+  //       },
+  //       raw: {
+
+  //       },
+  //     },
+  //   },
+  // },
+
+}
+
+export default types
Author	SHA1	Message	Date
peterlu14	471d4cf1ba	[update] start button replace record button	2021-02-19 14:41:16 +08:00
peterlu14	189e9b4507	[update] scale in time splice data fixed	2021-02-19 14:31:18 +08:00
peterlu14	17317f90a0	[update] ms -> us & M-Axis & download fix & series data splice changed	2021-02-19 14:21:00 +08:00
peterlu14	9f20d040f7	[update] axis_data	2021-02-05 13:31:28 +08:00
peterlu14	c09d79a6f5	[update] export channel fixed	2021-01-18 15:05:04 +08:00
peterlu14	33b9ce8f01	[update] fileName and parent fixed	2021-01-18 15:04:03 +08:00
peterlu14	b004434bf9	[update] record button fix event	2021-01-18 14:06:16 +08:00
peterlu14	3173e349fb	[update] add accelerometer & record button	2021-01-15 16:53:38 +08:00
peterlu14	7bb8378762	[update] download and export new format data & add meta info	2021-01-14 16:45:38 +08:00
TommyXin	b4c9e04075	Merge remote-tracking branch 'origin/master'	2021-01-13 18:10:53 +08:00
TommyXin	4fab05da44	[update] change datastream buffer into format	2021-01-13 18:10:42 +08:00
peterlu14	ba11499d80	[update] Neulive record & connect update calibration	2021-01-12 15:38:00 +08:00
TommyXin	2a09132a16	[update] try to use new data real time format	2021-01-11 20:12:47 +08:00
peterlu14	08061eb23e	[update] delete TaskInfoFormat and add parameter	2021-01-11 15:00:54 +08:00
peterlu14	4c3f36010c	Merge branch 'develop/elite1.5'	2021-01-11 14:53:57 +08:00
royluo	700cb94dd5	[update] update button:E-init	2021-01-08 14:33:57 +08:00
TommyXin	a91e4862c8	[vuex] [replay] add rec & meta to store	2021-01-06 22:41:53 +08:00
TommyXin	8efb8d4dc0	[update] [vuex] replay	2021-01-04 21:19:58 +08:00
TommyXin	96f8a9ad96	[update] [replay] [vuex] add type path	2020-12-30 22:14:28 +08:00
TommyXin	9cba5e2d0e	[update] [replay] optimize replay vuex format	2020-12-30 22:10:40 +08:00
royluo	b0a3f51cd0	[update] solve Rounding problem of Volt	2020-12-29 10:27:33 +08:00
TommyXin	a5c7133b84	[update] [replay] delete chartmanament.js	2020-12-28 22:48:26 +08:00
TommyXin	97889af002	[update] [replay] import vuex & apply to replay/neulive	2020-12-28 22:40:32 +08:00
TommyXin	37159bad12	[update] delete taskInfoFormat	2020-12-28 19:03:58 +08:00
TommyXin	49859eae05	[update] add factories to manage data format	2020-12-28 19:02:42 +08:00
royluo	84557194e4	[update] fix stop button's instruction(auto stop)	2020-12-28 17:25:23 +08:00
royluo	1ad639e2a0	[update] new component ResolutionRange	2020-12-28 15:36:08 +08:00
royluo	952b04ffe2	[update] new component ResolutionRange	2020-12-28 14:38:32 +08:00
royluo	9705b2045c	[update] new component ScanRateRange	2020-12-28 11:21:24 +08:00
royluo	419b3d323f	[update] new component (not ready)	2020-12-28 09:27:36 +08:00
royluo	becedd0fa7	[update] new component OppLevelButton	2020-12-24 18:26:12 +08:00
royluo	1578a72dee	[update] new component LevelRange	2020-12-24 09:25:54 +08:00
TommyXin	504eee4d73	[update] optimize replay chart	2020-12-23 20:00:25 +08:00
royluo	02a811ecfb	[update] new component LevelRange	2020-12-23 18:29:14 +08:00
royluo	ab6d52e50b	[update] new component MilliVoltRange	2020-12-23 14:43:24 +08:00
TommyXin	6c96b40e4b	[update] [task] parameter item component sample	2020-12-22 18:07:53 +08:00
royluo	e28271249c	change project to task in 'ParameterWindow'	2020-12-22 16:19:19 +08:00
TommyXin	1751af9c31	Merge branch 'master' into develop/elite1.5	2020-12-22 16:12:04 +08:00
royluo	4b599e06ca	[update] new elite1.5 UI	2020-12-22 16:01:06 +08:00
peterlu14	750a466707	[update] filename refresh & data last entry empty error & left grid space	2020-12-21 17:11:07 +08:00
royluo	06c2e70cb7	[update] new elite1.5 UI(I-V Curve)	2020-12-18 17:50:49 +08:00
royluo	e1da25b549	[update] new elite1.5 UI(I-V Curve)	2020-12-18 17:40:50 +08:00
royluo	b28dbc6e27	[update] new elite1.5 UI	2020-12-17 17:46:34 +08:00
peterlu14	e951426d7a	[update] [fix] create collection error & not export last line data	2020-12-17 17:07:06 +08:00
peterlu14	cb86d14144	[update] fix search error & fix export file end_time != -1	2020-12-17 17:06:09 +08:00
peterlu14	f6df94228c	Merge branch 'project-to-task'	2020-12-17 16:52:51 +08:00
TommyXin	cb563b3510	[update] [replay] fix end_time <0	2020-12-16 19:36:34 +08:00
TommyXin	a1ef860b8f	[update] remove scan1	2020-12-16 18:39:03 +08:00
peterlu14	f68ea5c1a5	[update] rename project into task	2020-12-15 20:20:32 +08:00
peterlu14	29eb4f8736	[update] recover Vuemqtt setting & device filename fixed while running	2020-12-15 18:44:37 +08:00
TommyXin	93660d66ad	[update] data replay default max scale	2020-12-15 16:14:24 +08:00
peterlu14	6ae3bbf066	[update] filename & mqtt connection	2020-12-14 14:52:11 +08:00
peterlu14	4cc29e7c93	[update] file name init & locale time	2020-12-11 11:45:39 +08:00
peterlu14	b639689a5b	[update] replay chart style change & destroy fix	2020-12-10 23:20:38 +08:00
peterlu14	9d531d083f	[update] file direct to replay & axios baseURL & replay destroy	2020-12-10 22:39:03 +08:00
peterlu14	942574f859	[update] filenameControl & export & download	2020-12-10 17:43:51 +08:00
TommyXin	551d49ceb1	[update] data replay TIME x-axis	2020-12-10 04:32:06 +08:00
TommyXin	316c3b0146	[update] replay data register	2020-12-09 15:03:29 +08:00
peterlu14	8d9f812a85	[update] optimize download rawData and miniData api	2020-12-04 03:19:55 +08:00
TommyXin	381891693b	Merge remote-tracking branch 'origin/master'	2020-12-03 03:06:52 +08:00
TommyXin	dacb9e9c13	[update] api & data replay	2020-12-03 03:06:41 +08:00
peterlu14	8c88df519b	[update] update get raw api	2020-12-03 02:58:38 +08:00
TommyXin	6c08e07148	Auto stash before merge of "master" and "origin/master"	2020-12-03 02:56:14 +08:00
peterlu14	092709e54f	[update] add get raw and mini api	2020-12-03 01:57:46 +08:00
TommyXin	37865c137e	[update] chart management	2020-12-03 00:56:35 +08:00
TommyXin	695745433c	Merge remote-tracking branch 'origin/master'	2020-12-01 21:31:09 +08:00
TommyXin	a8c9d5d7fc	[update] data replay param	2020-12-01 21:30:57 +08:00
peterlu14	cdb9966c99	[update] add download data api	2020-12-01 20:04:47 +08:00
peterlu14	08c4731f20	Merge commit 'adfab9f9fe5485527fa3baf45e9a1fe94eb72a9e'	2020-12-01 19:18:55 +08:00