[update] add mem_rf_set

[add] burn to raspberry script

See merge request bioproscientific/bioprovue!1

package-lock.json

@@ -3012,11 +3012,18 @@
       "dev": true
     },
     "axios": {
-      "version": "0.19.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.2.tgz",
-      "integrity": "sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==",
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
+      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
       "requires": {
-        "follow-redirects": "1.5.10"
+        "follow-redirects": "^1.10.0"
+      },
+      "dependencies": {
+        "follow-redirects": {
+          "version": "1.13.3",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.3.tgz",
+          "integrity": "sha512-DUgl6+HDzB0iEptNQEXLx/KhTmDb8tZUHSeLqpnjpknR70H0nC2t9N73BK6fN4hOvJ84pKlIQVQ4k5FFlBedKA=="
+        }
       }
     },
     "babel-code-frame": {
@@ -3465,9 +3472,9 @@
       }
     },
     "bl": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-1.2.2.tgz",
-      "integrity": "sha512-e8tQYnZodmebYDWGH7KMRvtzKXaJHx3BbilrgZCfvyLUYdKpK1t5PSPmpkny/SgiTSCnjfLW7v5rlONXVFkQEA==",
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/bl/-/bl-1.2.3.tgz",
+      "integrity": "sha512-pvcNpa0UU69UT341rO6AYy4FVAIkUHuZXRIWbq+zHnsVcRzDDjIAhGuuYoi0d//cwIwtt4pkpKycWEfjdV+vww==",
       "requires": {
         "readable-stream": "^2.3.5",
         "safe-buffer": "^5.1.1"
@@ -4175,6 +4182,7 @@
           "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
           "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
           "dev": true,
+          "optional": true,
           "requires": {
             "is-extglob": "^2.1.1"
           }
@@ -5113,9 +5121,9 @@
       "dev": true
     },
     "copy-webpack-plugin": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz",
-      "integrity": "sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg==",
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.2.tgz",
+      "integrity": "sha512-Uh7crJAco3AjBvgAy9Z75CjK8IG+gxaErro71THQ+vv/bl4HaQcpkexAY8KVW/T6D2W2IRr+couF/knIRkZMIQ==",
       "dev": true,
       "requires": {
         "cacache": "^12.0.3",
@@ -5128,7 +5136,7 @@
         "normalize-path": "^3.0.0",
         "p-limit": "^2.2.1",
         "schema-utils": "^1.0.0",
-        "serialize-javascript": "^2.1.2",
+        "serialize-javascript": "^4.0.0",
         "webpack-log": "^2.0.0"
       },
       "dependencies": {
@@ -5179,10 +5187,13 @@
           }
         },
         "serialize-javascript": {
-          "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-2.1.2.tgz",
-          "integrity": "sha512-rs9OggEUF0V4jUSecXazOYsLfu7OGK2qIn3c7IPBiffz32XniEp/TX9Xmc9LQfK2nQ2QKHvZ2oygKUGU0lG4jQ==",
-          "dev": true
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
+          "integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
+          "dev": true,
+          "requires": {
+            "randombytes": "^2.1.0"
+          }
         },
         "slash": {
           "version": "1.0.0",
@@ -5642,6 +5653,7 @@
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
       "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+      "dev": true,
       "requires": {
         "ms": "2.0.0"
       }
@@ -6247,24 +6259,24 @@
       }
     },
     "elliptic": {
-      "version": "6.5.3",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz",
-      "integrity": "sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==",
+      "version": "6.5.4",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.4.tgz",
+      "integrity": "sha512-iLhC6ULemrljPZb+QutR5TQGB+pdW6KGD5RSegS+8sorOZT+rdQFbsQFJgvN3eRqNALqJer4oQ16YvJHlU8hzQ==",
       "dev": true,
       "requires": {
-        "bn.js": "^4.4.0",
-        "brorand": "^1.0.1",
+        "bn.js": "^4.11.9",
+        "brorand": "^1.1.0",
         "hash.js": "^1.0.0",
-        "hmac-drbg": "^1.0.0",
-        "inherits": "^2.0.1",
-        "minimalistic-assert": "^1.0.0",
-        "minimalistic-crypto-utils": "^1.0.0"
+        "hmac-drbg": "^1.0.1",
+        "inherits": "^2.0.4",
+        "minimalistic-assert": "^1.0.1",
+        "minimalistic-crypto-utils": "^1.0.1"
       },
       "dependencies": {
         "bn.js": {
-          "version": "4.11.9",
-          "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.9.tgz",
-          "integrity": "sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw==",
+          "version": "4.12.0",
+          "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.0.tgz",
+          "integrity": "sha512-c98Bf3tPniI+scsdk237ku1Dc3ujXQTSgyiPUDEOe7tRkhrqridvh8klBv0HCEso1OLOYcHuCv/cS6DNxKH+ZA==",
           "dev": true
         }
       }
@@ -7481,15 +7493,6 @@
         "reusify": "^1.0.4"
       }
     },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ=",
-      "dev": true,
-      "requires": {
-        "websocket-driver": ">=0.5.1"
-      }
-    },
     "fb-watchman": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.1.tgz",
@@ -7690,6 +7693,7 @@
       "version": "1.5.10",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
       "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
+      "dev": true,
       "requires": {
         "debug": "=3.1.0"
       }
@@ -8477,6 +8481,12 @@
         }
       }
     },
+    "http-parser-js": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.3.tgz",
+      "integrity": "sha512-t7hjvef/5HEK7RWTdUzVUhl8zkEu+LlaE0IYzdMuvbSDipxBRpOn4Uhw8ZyECEa808iVT8XCjzo6xmYt4CiLZg==",
+      "dev": true
+    },
     "http-proxy": {
       "version": "1.18.1",
       "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
@@ -8659,9 +8669,9 @@
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
     },
     "ini": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-      "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
       "dev": true
     },
     "inquirer": {
@@ -10925,9 +10935,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.15",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.15.tgz",
-      "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A=="
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
     "lodash._reinterpolate": {
       "version": "3.0.0",
@@ -11813,12 +11823,6 @@
         }
       }
     },
-    "node-forge": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
-      "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
-      "dev": true
-    },
     "node-gyp": {
       "version": "3.8.0",
       "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
@@ -14441,15 +14445,6 @@
       "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=",
       "dev": true
     },
-    "selfsigned": {
-      "version": "1.10.7",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.7.tgz",
-      "integrity": "sha512-8M3wBCzeWIJnQfl43IKwOmC4H/RAp50S8DF60znzjW5GVqTcSe2vWclt7hmYVPkKPlHWOu5EaWOMZ2Y6W8ZXTA==",
-      "dev": true,
-      "requires": {
-        "node-forge": "0.9.0"
-      }
-    },
     "semver": {
       "version": "5.7.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
@@ -14853,57 +14848,6 @@
         }
       }
     },
-    "sockjs": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.20.tgz",
-      "integrity": "sha512-SpmVOVpdq0DJc0qArhF3E5xsxvaiqGNb73XfgBpK1y3UD5gs8DSo8aCTsuT5pX8rssdc2NDIzANwP9eCAiSdTA==",
-      "dev": true,
-      "requires": {
-        "faye-websocket": "^0.10.0",
-        "uuid": "^3.4.0",
-        "websocket-driver": "0.6.5"
-      }
-    },
-    "sockjs-client": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.4.0.tgz",
-      "integrity": "sha512-5zaLyO8/nri5cua0VtOrFXBPK1jbL4+1cebT/mmKA1E1ZXOvJrII75bPu0l0k843G/+iAbhEqzyKr0w/eCCj7g==",
-      "dev": true,
-      "requires": {
-        "debug": "^3.2.5",
-        "eventsource": "^1.0.7",
-        "faye-websocket": "~0.11.1",
-        "inherits": "^2.0.3",
-        "json3": "^3.3.2",
-        "url-parse": "^1.4.3"
-      },
-      "dependencies": {
-        "debug": {
-          "version": "3.2.6",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
-          "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
-          "dev": true,
-          "requires": {
-            "ms": "^2.1.1"
-          }
-        },
-        "faye-websocket": {
-          "version": "0.11.3",
-          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
-          "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
-          "dev": true,
-          "requires": {
-            "websocket-driver": ">=0.5.1"
-          }
-        },
-        "ms": {
-          "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-          "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-          "dev": true
-        }
-      }
-    },
     "sort-keys": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
@@ -17392,6 +17336,11 @@
       "resolved": "https://registry.npmjs.org/vuex-i18n/-/vuex-i18n-1.13.1.tgz",
       "integrity": "sha512-VTy5QAyMI6BJwpRfN5qncWQT0ohKiAYK+iTRW4JxgV9dkNoPMuKKDqExbOm1fzpitdrIoIipC3Zqr5fJ706VQg=="
     },
+    "vuex-map-fields": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/vuex-map-fields/-/vuex-map-fields-1.4.1.tgz",
+      "integrity": "sha512-jvIcpvoIPqwvJCOfRkPU9Rj0EbjWuk7GlNC5LXU9mCXVGZph6bWGHZssnoUzpLMxJtXQEHoVyZkKf7YQV+/bnQ=="
+    },
     "vuex-router-sync": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/vuex-router-sync/-/vuex-router-sync-5.0.0.tgz",
@@ -17688,9 +17637,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "3.11.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.0.tgz",
-      "integrity": "sha512-PUxZ+oSTxogFQgkTtFndEtJIPNmml7ExwufBZ9L2/Xyyd5PnOL5UreWe5ZT7IU25DSdykL9p1MLQzmLh2ljSeg==",
+      "version": "3.11.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.11.2.tgz",
+      "integrity": "sha512-A80BkuHRQfCiNtGBS1EMf2ChTUs0x+B3wGDFmOeT4rmJOHhHTCH2naNxIHhmkr0/UillP4U3yeIyv1pNp+QDLQ==",
       "dev": true,
       "requires": {
         "ansi-html": "0.0.7",
@@ -17713,11 +17662,11 @@
         "p-retry": "^3.0.1",
         "portfinder": "^1.0.26",
         "schema-utils": "^1.0.0",
-        "selfsigned": "^1.10.7",
+        "selfsigned": "^1.10.8",
         "semver": "^6.3.0",
         "serve-index": "^1.9.1",
-        "sockjs": "0.3.20",
-        "sockjs-client": "1.4.0",
+        "sockjs": "^0.3.21",
+        "sockjs-client": "^1.5.0",
         "spdy": "^4.0.2",
         "strip-ansi": "^3.0.1",
         "supports-color": "^6.1.0",
@@ -17782,12 +17731,21 @@
           }
         },
         "debug": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
-          "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
+          "version": "4.3.1",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+          "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
           "dev": true,
           "requires": {
-            "ms": "^2.1.1"
+            "ms": "2.1.2"
+          }
+        },
+        "faye-websocket": {
+          "version": "0.11.3",
+          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.3.tgz",
+          "integrity": "sha512-D2y4bovYpzziGgbHYtGCMjlJM36vAl/y+xUyn1C+FVx8szd1E+86KwVw6XvYSzOP8iMpm1X0I4xJD+QtUb36OA==",
+          "dev": true,
+          "requires": {
+            "websocket-driver": ">=0.5.1"
           }
         },
         "fsevents": {
@@ -17831,6 +17789,12 @@
           "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
           "dev": true
         },
+        "node-forge": {
+          "version": "0.10.0",
+          "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
+          "integrity": "sha512-PPmu8eEeG9saEUvI97fm4OYxXVB6bFvyNTyiUOBichBpFG8A1Ljw3bY62+5oOjDEMHRnd0Y7HQ+x7uzxOzC6JA==",
+          "dev": true
+        },
         "readdirp": {
           "version": "2.2.1",
           "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.2.1.tgz",
@@ -17853,12 +17817,57 @@
             "ajv-keywords": "^3.1.0"
           }
         },
+        "selfsigned": {
+          "version": "1.10.8",
+          "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.8.tgz",
+          "integrity": "sha512-2P4PtieJeEwVgTU9QEcwIRDQ/mXJLX8/+I3ur+Pg16nS8oNbrGxEso9NyYWy8NAmXiNl4dlAp5MwoNeCWzON4w==",
+          "dev": true,
+          "requires": {
+            "node-forge": "^0.10.0"
+          }
+        },
         "semver": {
           "version": "6.3.0",
           "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
           "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
           "dev": true
         },
+        "sockjs": {
+          "version": "0.3.21",
+          "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.21.tgz",
+          "integrity": "sha512-DhbPFGpxjc6Z3I+uX07Id5ZO2XwYsWOrYjaSeieES78cq+JaJvVe5q/m1uvjIQhXinhIeCFRH6JgXe+mvVMyXw==",
+          "dev": true,
+          "requires": {
+            "faye-websocket": "^0.11.3",
+            "uuid": "^3.4.0",
+            "websocket-driver": "^0.7.4"
+          }
+        },
+        "sockjs-client": {
+          "version": "1.5.1",
+          "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.5.1.tgz",
+          "integrity": "sha512-VnVAb663fosipI/m6pqRXakEOw7nvd7TUgdr3PlR/8V2I95QIdwT8L4nMxhyU8SmDBHYXU1TOElaKOmKLfYzeQ==",
+          "dev": true,
+          "requires": {
+            "debug": "^3.2.6",
+            "eventsource": "^1.0.7",
+            "faye-websocket": "^0.11.3",
+            "inherits": "^2.0.4",
+            "json3": "^3.3.3",
+            "url-parse": "^1.5.1"
+          },
+          "dependencies": {
+            "debug": {
+              "version": "3.2.7",
+              "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+              "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
+              "dev": true,
+              "requires": {
+                "ms": "^2.1.1"
+              }
+            }
+          }
+        },
         "strip-ansi": {
           "version": "3.0.1",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
@@ -17877,6 +17886,27 @@
             "has-flag": "^3.0.0"
           }
         },
+        "url-parse": {
+          "version": "1.5.1",
+          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.1.tgz",
+          "integrity": "sha512-HOfCOUJt7iSYzEx/UqgtwKRMC6EU91NFhsCHMv9oM03VJcVo2Qrp8T8kI9D7amFf1cu+/3CEhgb3rF9zL7k85Q==",
+          "dev": true,
+          "requires": {
+            "querystringify": "^2.1.1",
+            "requires-port": "^1.0.0"
+          }
+        },
+        "websocket-driver": {
+          "version": "0.7.4",
+          "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
+          "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
+          "dev": true,
+          "requires": {
+            "http-parser-js": ">=0.5.1",
+            "safe-buffer": ">=5.1.0",
+            "websocket-extensions": ">=0.1.1"
+          }
+        },
         "ws": {
           "version": "6.2.1",
           "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
@@ -17925,15 +17955,6 @@
         }
       }
     },
-    "websocket-driver": {
-      "version": "0.6.5",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
-      "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY=",
-      "dev": true,
-      "requires": {
-        "websocket-extensions": ">=0.1.1"
-      }
-    },
     "websocket-extensions": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
@@ -18320,9 +18341,9 @@
       "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
     },
     "y18n": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
-      "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==",
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+      "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
       "dev": true
     },
     "yallist": {

package.json

@@ -18,7 +18,7 @@
     "ammap3": "^3.21.14",
     "approximate-number": "^2.0.0",
     "asva-executors": "^0.1.22",
-    "axios": "^0.19.0",
+    "axios": "^0.21.1",
     "babel-polyfill": "^6.26.0",
     "chart.js": "^2.9.3",
     "core-js": "3",
@@ -32,7 +32,7 @@
     "google-maps": "^3.3.0",
     "ionicons": "^4.6.3",
     "leaflet-map": "^0.2.1",
-    "lodash": "4.17.15",
+    "lodash": "^4.17.21",
     "medium-editor": "^5.23.3",
     "normalize.css": "^8.0.1",
     "popper.js": "^1.16.0",
@@ -58,6 +58,7 @@
     "vuetable-2": "^1.7.5",
     "vuex": "^3.1.2",
     "vuex-i18n": "^1.13.1",
+    "vuex-map-fields": "^1.4.1",
     "vuex-router-sync": "^5.0.0"
   },
   "devDependencies": {

public/index.html

@@ -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>

shell_script/README.md

@@ -0,0 +1,14 @@
+* This is shell_script dir
+
+# 檔案說明
+burn_to_raspberry.sh : 用scp複製local npm build好的東西 & burn_to_raspberry_util.sh 去遠端（raspberry），然後在raspberry內execute 複製過去的burn_to_raspberry_util.sh 
+
+burn_to_raspberry_util.sh : 給burn_to_raspberry.sh用的，裡面的指令為在raspberry內所有要執行的指令
+
+# Usage
+burn_to_raspberry.sh
+```shell
+sh ./burn_to_raspberry.sh <HOST> <PASSWORD> 
+
+e.g. sh ./burn_to_raspberry.sh pi@192.168.3.53 raspberry
+```

shell_script/burn_to_raspberry.sh

@@ -0,0 +1,15 @@
+#!/bin/bash
+
+# sshpass: https://shazi.info/ssh-%E7%94%A8-sshpass-%E5%8F%96%E4%BB%A3-expect-%E8%87%AA%E5%8B%95%E8%BC%B8%E5%85%A5%E5%AF%86%E7%A2%BC/
+
+HOST=$1  # e.g. "pi@192.168.3.53"
+PASSWORD=$2  # e.g. raspberry
+SCP_HOST=$HOST":"
+
+cd ..
+npm run build
+sshpass -p $PASSWORD ssh $HOST "rm -rf dist"  
+sshpass -p $PASSWORD scp -r dist $SCP_HOST
+sshpass -p $PASSWORD scp shell_script/burn_to_raspberry_util.sh $SCP_HOST
+sshpass -p $PASSWORD ssh $HOST "sh ./burn_to_raspberry_util.sh"  
+# sshpass -p raspberry scp -r dist pi@192.168.3.53:

shell_script/burn_to_raspberry_util.sh

@@ -0,0 +1,7 @@
+#!/bin/bash
+
+#run in raspberry
+
+cd 
+sudo rm -rf /var/www/bioprovuebuild/*
+sudo cp -r dist/* /var/www/bioprovuebuild/

src/app/App.vue

@@ -1,6 +1,9 @@
 <template>
   <div id="app" class="app">
-    <router-view />
+    <keep-alive>
+      <router-view v-if="$route.meta.keepAlive"></router-view>
+    </keep-alive>
+    <router-view v-if="!$route.meta.keepAlive"></router-view>
   </div>
 </template>
 

src/components/admin/AppLayout.vue

@@ -60,7 +60,7 @@ export default {
   data () {
     return {
       isTopBar: false,
-      minimized: true,
+      minimized: false,
       mobileWidth: 767,
     }
   },

src/components/admin/app-navbar/AppNavbar.vue

@@ -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'"> -->

src/components/analysis/replay/elite/EliteDataReplay.vue

@@ -0,0 +1,893 @@
+<template>
+  <div class="devices-overview">
+    <div>
+      <va-item>
+        <va-item-section style='text-align: center;'>
+          <p> Filename: </p>
+          <p> {{ filename }} </p>
+        </va-item-section>
+        <va-item-section style='text-align: center;'>
+          <va-button flat small color="gray" icon="fa fa-download" @click.stop="downloadCSV()"/>
+          <va-button flat small color="gray" icon="fa fa-pencil" @click.stop="editFileConfirm()"/>
+          <va-button flat small color="gray" icon="fa fa-trash" @click.stop="deleteFileConfirm()"/>
+        </va-item-section>
+        <va-item-section style='text-align: center;'>
+          <p> Current resample: </p>
+          <p> {{ currentScale }} to 1 </p>
+        </va-item-section>
+        <va-item-section>
+          X axis
+          <va-select
+            :label="''"
+            v-model="channelXSelect"
+            textBy="description"
+            :options="channelXOptions"
+          />
+        </va-item-section>
+        <va-item-section>
+          X axis scale
+          <va-select
+            :label="''"
+            v-model="scaleXSelect"
+            textBy="description"
+            :options="scaleOptions"
+          />
+        </va-item-section>
+        <va-item-section>
+          X axis unit
+          <va-select
+            :label="''"
+            v-model="valueFormatX"
+            textBy="unit"
+            :options="valueFormatOptions[channelXSelect.id]"
+          />
+        </va-item-section>
+        <va-item-section>
+          Y axis
+          <va-select
+            :label="''"
+            v-model="channelYSelect"
+            textBy="description"
+            :options="channelYOptions"
+          />
+        </va-item-section>
+        <va-item-section>
+          Y axis scale
+          <va-select
+            :label="''"
+            v-model="scaleYSelect"
+            textBy="description"
+            :options="scaleOptions"
+          />
+        </va-item-section>
+        <va-item-section>
+          Y axis unit
+          <va-select
+            :label="''"
+            v-model="valueFormatY"
+            textBy="unit"
+            :options="valueFormatOptions[channelYSelect.id]"
+          />
+        </va-item-section>
+      </va-item>
+
+      <va-input
+        v-if="isNeedCycle"
+        v-model="showWhichCycles"
+        @change="reDraw"
+        :label="$t('See which cycles (separate by comma, e.g. 1,2,3)')"
+      />
+      <elite-replay-chart :ref="'chart_detail'" @dblclick.native="distribute()"  :cardheight="'71vh'" :data="chartDetailData" @dataZoomEvent="dataZoomEvent($event)"/>
+      <va-card :title="$t('Parameter')">
+        <va-tree-root>
+          <va-tree-category label="AxisValueRangeSetting">
+            <div>
+              <div v-for="(range, index) in valueRanges" :key="index" style='width: 50%; float: left;'>
+                <va-item v-show="range.showXMin||range.showXMax||range.showYMin||range.showYMax">
+                  <va-item-section align="right">
+                    <p v-show="range.showXMin||range.showXMax"> {{ channelXSelect.description }} </p>
+                    <p v-show="range.showYMin||range.showYMax"> {{ channelYSelect.description }} </p>
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.xMin"
+                      v-show="range.showXMin"
+                      :label="$t('xMin')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.xMax"
+                      v-show="range.showXMax"
+                      :label="$t('xMax')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.yMin"
+                      v-show="range.showYMin"
+                      :label="$t('yMin')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.yMax"
+                      v-show="range.showYMax"
+                      :label="$t('yMax')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                </va-item>
+              </div>
+            </div>
+          </va-tree-category>
+          <va-tree-category label="Recording">
+            <va-tree-node>
+              <pre><div class="title mb-3" :style="{color: this.$themes.primary}" v-html="parameterInfo.recording"></div></pre>
+            </va-tree-node>
+          </va-tree-category>
+        </va-tree-root>
+      </va-card>
+    </div>
+
+    <va-modal
+      class="flex sm12 xl12 md12 xs12"
+      v-model="showModal.editFile"
+      size="small"
+      :title="'CHANGE FILE NAME'"
+      :okText=" $t('modal.confirm') "
+      @ok="editFile()"
+      @cancel="undoEdit()"
+    >
+      <va-input
+        :value="editInfo.changedName"
+        :label="'Name'"
+        :placeholder="editInfo.name"
+        :success="editInfo.success"
+        :error="editInfo.error"
+        :error-messages="editInfo.errorMessages"
+        @input="checkFileNameValidate"
+        removable
+      />
+    </va-modal>
+    <va-modal
+      v-model="showModal.deleteFile"
+      size="small"
+      :title="'DELETE'"
+      :message="`Delete File ${deleteInfo.name}.`"
+      :okText=" $t('modal.confirm') "
+      @ok="deleteFile()"
+    >
+    </va-modal>
+  </div>
+
+</template>
+
+<script>
+import { mapActions, mapGetters, mapMutations } from 'vuex'
+import EliteReplayChart from './EliteReplayChart.vue'
+import api from '@/data/api/index'
+import { download } from '@/data/download/Download'
+import { exportData } from '@/data/export/export'
+import types from '@/store/modules/analysis/replay/elite/types'
+import { mapFields } from 'vuex-map-fields'
+import { trimValueArray, getValueArrayMinAndMax } from '@/data/tool'
+import { debounce } from 'lodash'
+
+export default {
+  name: 'elite-data-replay',
+  components: {
+    EliteReplayChart,
+  },
+  computed: {
+    slices: function () {
+      const cycleList = this.showWhichCycles.split(',')
+      return cycleList
+    },
+    ...mapFields('eliteReplay', [
+      'displaySettingInfo.channelXOptions',
+      'displaySettingInfo.channelYOptions',
+      'displaySettingInfo.scaleOptions',
+      'displaySettingInfo.valueFormatOptions',
+      'displaySettingInfo.channelXSelect',
+      'displaySettingInfo.channelYSelect',
+      'displaySettingInfo.scaleXSelect',
+      'displaySettingInfo.scaleYSelect',
+      'displaySettingInfo.valueFormatX',
+      'displaySettingInfo.valueFormatY',
+      'displaySettingInfo.valueRanges', // each element: { id: ID, name: channelName, xMin: 0, xMax: 0, yMin: 0, yMax: 0 }
+      'displaySettingInfo.filename',
+      'displaySettingInfo.parameterInfo',
+      'displaySettingInfo.editInfo',
+      'displaySettingInfo.deleteInfo',
+    ]),
+  },
+  props: {
+  },
+  async created () {
+    this.chartDetailData = await this.initChart({
+      chartAllData: this.chartData,
+      chartID: 1,
+      gridLength: 1,
+    })
+    // this.$refs.chart_detail.$children[0].$children[0].chart._zr.on('click',function(params) {
+    //   this.showSmallModal = true
+    // })
+  },
+  // use watch because va-select with @change will have bug
+  watch: {
+    channelXSelect: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, 'channelx')
+    },
+    channelYSelect: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, 'channely')
+    },
+    scaleXSelect: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, '')
+    },
+    scaleYSelect: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, '')
+    },
+    valueFormatX: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, '')
+    },
+    valueFormatY: function (newVal, oldVal) {
+      this.selectChange(newVal, oldVal, '')
+    },
+  },
+  data () {
+    return {
+      isInitDone: false,
+      showSmallModal: false,
+      channelCycleID: 3,
+      metaList: null,
+      dataInfo: {},
+      chartData: {},
+      chartDetailData: {},
+      maxTime: 0,
+      startTimeCurrent: 0,
+      endTimeCurrent: 0,
+      startTime: 0,
+      endTime: 0,
+      zoomTime: 0,
+      maxScaleDefault: '1000',
+      isNeedCycle: true,
+      showWhichCycles: '1',
+      showModal: {
+        deleteFile: false,
+        editFile: false,
+      },
+      currentScale: 0,
+    }
+  },
+  mqtt: {
+  },
+  methods: {
+    downloadCSV: async function () {
+      const meta = this.metaList[0]
+      const rawData = await download.getAllRawDatas(meta)
+      exportData.exportCSV(meta, rawData)
+    },
+    editFileConfirm: function () {
+      this.showModal.editFile = true
+    },
+    editFile: async function () {
+      await api.updateMetaFile(this.editInfo.info.id, { name: this.editInfo.changedName })
+      await this.updateDisplaySettingRec({ updateObject: { editInfo: { name: this.editInfo.changedName }, filename: this.editInfo.changedName } })
+    },
+    undoEdit: async function () {
+      await this.updateDisplaySettingRec({ updateObject: { editInfo: { success: false, error: false, changedName: '', name: '', path: '' } } })
+    },
+    checkFileNameValidate: debounce(function (term) {
+      const illegalChar = term.match(/[^(\w\-)]+/gm)
+      if (term.length === 0) {
+        // input text empty
+        this.editInfo.error = true
+        this.editInfo.success = false
+        this.editInfo.errorMessages.pop()
+        this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[1])
+      } else if (illegalChar !== null) {
+        // input text illegal
+        this.editInfo.error = true
+        this.editInfo.success = false
+        this.editInfo.errorMessages.pop()
+        this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[0] + ' ' + illegalChar[0])
+      }
+      this.editInfo.changedName = term
+    }, 200),
+    deleteFileConfirm: function () {
+      const info = this.metaList[0]
+      this.deleteInfo.path = info.path
+      this.deleteInfo.name = info.name
+      this.deleteInfo.metaID = info.id
+      this.deleteInfo.rawChannelAndIDArrays = [] // list of lists
+      this.deleteInfo.miniChannelAndIDArrays = [] // list of lists
+      for (const [channel, idArray] of Object.entries(info.raw_data)) {
+        this.deleteInfo.rawChannelAndIDArrays.push([channel, idArray[0]])
+      }
+      for (const [channel, scaleObject] of Object.entries(info.mini_data)) {
+        for (const idArray of Object.values(scaleObject)) {
+          this.deleteInfo.miniChannelAndIDArrays.push([channel, idArray[0]])
+        }
+      }
+      this.showModal.deleteFile = true
+    },
+    deleteFile: async function () {
+      for (const item of this.deleteInfo.rawChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateRawFile(channel, id, { deleted: true })
+        await api.clearDeleteRawFile(channel, id)
+      }
+      for (const item of this.deleteInfo.miniChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateMiniFile(channel, id, { deleted: true })
+        await api.clearDeleteMiniFile(channel, id)
+      }
+      await api.updateMetaFile(this.deleteInfo.metaID, { deleted: true })
+      await api.clearDeleteMetaFile(this.deleteInfo.metaID)
+      await this.deleteFileDone()
+    },
+    deleteFileDone: async function () {
+      this.showToast(`deleted ${this.deleteInfo.name}`, {
+        position: 'bottom-right',
+      })
+      this.$router.go(-1)
+    },
+    async selectChange (newVal, oldVal, attr) {
+      // show min max adjust input field
+      if (attr === 'channelx') {
+        this.updateDisplaySettingRec({ updateObject: { valueRanges: { id: newVal.id, showXMin: true, showXMax: true } } })
+      } else if (attr === 'channely') {
+        this.updateDisplaySettingRec({ updateObject: { valueRanges: { id: newVal.id, showYMin: true, showYMax: true } } })
+      }
+      if (this.isInitDone) {
+        // cancel showing previous min max adjust input field
+        if (attr === 'channelx') {
+          this.updateDisplaySettingRec({ updateObject: { valueRanges: { id: oldVal.id, showXMin: false, showXMax: false }, valueFormatX: this.valueFormatOptions[newVal.id][0] } })
+        } else if (attr === 'channely') {
+          this.updateDisplaySettingRec({ updateObject: { valueRanges: { id: oldVal.id, showYMin: false, showYMax: false }, valueFormatY: this.valueFormatOptions[newVal.id][0] } })
+        }
+        await this.reDraw()
+      }
+    },
+    showChartLoading: function (chart) {
+      const loadStyle = {
+        text: '',
+        color: '#cccccc',
+        maskColor: 'rgba(255, 255, 255, 0.8)',
+        zlevel: 0,
+      }
+      switch (chart) {
+        case 'detail':
+          this.$refs.chart_detail.$children[0].$children[0].showLoading(loadStyle)
+          break
+        default:
+          this.$refs.chart_detail.$children[0].$children[0].showLoading(loadStyle)
+          break
+      }
+    },
+    hideChartLoading: function () {
+      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
+      // })
+      chNumber = 1
+
+      this.updateGridListChart({
+        chartAllData: this.chartData,
+        chartID: this.chartDetailData.chartID,
+        gridLength: chNumber,
+      })
+      const _chNumber = 0 // [TODO] multiple graph
+      const deviceNameX = this.channelXSelect.description === 'Time' ? 'Time' : 'Elite'
+      const deviceNameY = this.channelYSelect.description === 'Time' ? 'Time' : 'Elite'
+      const channelX = this.channelXSelect.description === 'Time' ? undefined : this.channelXSelect.id
+      const channelY = this.channelYSelect.id
+
+      const register = this.metaList.map(meta => {
+        this.registerChart({
+          chartAllData: this.chartData,
+          chartID: this.chartDetailData.chartID,
+          gridIndex: _chNumber,
+          deviceNameX: deviceNameX,
+          deviceNameY: deviceNameY,
+          deviceIDX: meta.name, // [TODO] support data source from different file
+          deviceIDY: meta.name, // [TODO] support data source from different file
+          channelX: channelX,
+          channelY: channelY,
+          valueFormatX: this.valueFormatX,
+          valueFormatY: this.valueFormatY,
+        })
+        // _chNumber++
+        if (this.maxTime < parseInt(meta.time_duration)) {
+          this.maxTime = parseInt(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.chartDetailData.xAxis[this.chartDetailData.xAxis.length - 1].axisLabel.show = true
+    },
+    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.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) {
+            this.currentScale = scale
+            const dataList = this.dataInfo[meta][ch][scale]
+            if (dataList.length !== 0) {
+              if (parseInt(dataList[0].size) === 0) {
+                switch (scale) {
+                  case '1000':
+                    if (parseInt(maxScale) >= 100 || parseInt(maxScale) === -1) {
+                      maxScale = '100'
+                    }
+                    break
+                  case '100':
+                    if (parseInt(maxScale) >= 10 || parseInt(maxScale) === -1) {
+                      maxScale = '10'
+                    }
+                    break
+                  case '10':
+                    if (parseInt(maxScale) >= 1 || parseInt(maxScale) === -1) {
+                      maxScale = '1'
+                    }
+                    break
+                  default:
+                    break
+                }
+              } else {
+                for (let i = 0; i < dataList.length; i++) {
+                  const _timeZone = parseInt(dataList[i].end_time) - parseInt(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
+              }
+            } else {
+              switch (scale) {
+                case '1000':
+                  if (parseInt(maxScale) >= 100 || parseInt(maxScale) === -1) {
+                    maxScale = '100'
+                  }
+                  break
+                case '100':
+                  if (parseInt(maxScale) >= 10 || parseInt(maxScale) === -1) {
+                    maxScale = '10'
+                  }
+                  break
+                case '10':
+                  if (parseInt(maxScale) >= 1 || parseInt(maxScale) === -1) {
+                    maxScale = '1'
+                  }
+                  break
+                default:
+                  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 dataIndex = {}
+
+        const getAllData = async function (_this) {
+          for (const ch in _this.dataInfo[meta]) {
+            const dataList = _this.dataInfo[meta][ch][scale]
+            dataIndex[ch] = []
+            for (let i = 0; i < dataList.length; i++) {
+              if ((_this.startTimeCurrent >= parseInt(dataList[i].start_time) && _this.startTimeCurrent <= parseInt(dataList[i].end_time)) || (_this.endTimeCurrent >= parseInt(dataList[i].start_time) && _this.endTimeCurrent <= parseInt(dataList[i].end_time))) {
+                dataIndex[ch].push(i)
+                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),
+                  })
+                }
+              }
+
+              // fill loss datas
+              for (let i = Math.min(...dataIndex[ch]); i <= Math.max(...dataIndex[ch]); i++) {
+                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)
+        const gridIndex = 0 // [TODO] multiple grid
+
+        const channelX = parseInt(this.channelXSelect.id)
+        const channelY = parseInt(this.channelYSelect.id)
+        let dataXList = null
+        if (this.channelXSelect.description === 'Time') {
+          dataXList = JSON.parse(JSON.stringify(this.dataInfo[meta][channelY][scale])) // channelY is cuz time is not a channel, so use arbitrary channel
+          const tmpDataXList = JSON.parse(JSON.stringify(dataXList))
+          for (let i = 0; i < tmpDataXList.length; i++) {
+            tmpDataXList[i].data.forEach(function (value, index) {
+              dataXList[i].data[index][1] = dataXList[i].data[index][0] // For time, set all data value to time, for match later code
+            })
+          }
+        } else {
+          dataXList = JSON.parse(JSON.stringify(this.dataInfo[meta][channelX][scale]))
+        }
+
+        const dataYList = JSON.parse(JSON.stringify(this.dataInfo[meta][channelY][scale]))
+        let dataCycleList = []
+        if (this.channelCycleID in this.dataInfo[meta]) {
+          dataCycleList = this.dataInfo[meta][this.channelCycleID][scale]
+        }
+
+        var cycleDict = {}
+        for (let cycleNum = 0; cycleNum < dataCycleList.length; cycleNum++) {
+          var cycleStartIndex = 0
+          var cycleEndIndex = 0
+          var currentCycleIndex = 0
+          dataCycleList[cycleNum].data.forEach(function (value, index) {
+            const cycleIndex = parseInt(value[1])
+            if (cycleIndex === currentCycleIndex) {
+              if (currentCycleIndex in cycleDict) {
+                cycleEndIndex = index
+                cycleDict[cycleIndex][2] = cycleEndIndex
+              } else {
+                cycleDict[cycleIndex] = [cycleNum, cycleStartIndex, cycleEndIndex]
+              }
+            } else {
+              cycleStartIndex = index
+              currentCycleIndex++
+            }
+          })
+        }
+
+        console.assert(dataXList.length === dataYList.length) // [todo] need align 2 channel data?
+        let dataX = []
+        let dataY = []
+        if (scale >= 1) {
+          if (!this.isNeedCycle) {
+            for (let i = 0; i < dataYList.length; i++) {
+              dataX.push(...dataXList[i].data)
+              dataY.push(...dataYList[i].data)
+            }
+          } else {
+            for (const index of this.slices) {
+              if (index in cycleDict) {
+                const value = cycleDict[index]
+                const dataListIndex = value[0]
+                const start = value[1]
+                const end = value[2] + 1
+                dataX = dataX.concat(dataXList[dataListIndex].data.slice(start, end))
+                dataY = dataY.concat(dataYList[dataListIndex].data.slice(start, end))
+              } else {
+                console.log(`cycle ${index} not exist`)
+              }
+            }
+          }
+
+          const cloneData = JSON.parse(JSON.stringify(dataX))
+          for (let Index = 0; Index < cloneData.length; Index++) { // merge 2 channel data
+            const yValue = dataY[Index][1]
+            cloneData[Index].reverse()
+            cloneData[Index].splice(1, 0, yValue)
+          }
+
+          this.chartDetailData.series.forEach((series, index) => {
+            if (series.yAxisSource[0] === metaName && series.yAxisSource[1] === channelY) {
+              series.data = JSON.parse(JSON.stringify(cloneData))
+              this.$refs.chart_detail.$children[0].$children[0].appendData({
+                seriesIndex: index,
+                data: series.data,
+              })
+            }
+          })
+        } else {
+          for (let i = 0; i < dataYList.length; i++) {
+            if ((this.startTimeCurrent >= parseInt(dataYList[i].start_time) && this.startTimeCurrent <= parseInt(dataYList[i].end_time)) ||
+                (this.endTimeCurrent >= parseInt(dataYList[i].start_time) && this.endTimeCurrent <= parseInt(dataYList[i].end_time))) {
+              if (!this.isNeedCycle) { // no cycle channel data
+                const len = dataXList[i].data.length
+                dataX = dataXList[i].data.slice(0, len)
+                dataY = dataYList[i].data.slice(0, len)
+              } else {
+                for (const index of this.slices) {
+                  if (index in cycleDict) {
+                    const value = cycleDict[index]
+                    const dataListIndex = value[0]
+                    const start = value[1]
+                    const end = value[2] + 1
+                    dataX = dataX.concat(dataXList[dataListIndex].data.slice(start, end))
+                    dataY = dataY.concat(dataYList[dataListIndex].data.slice(start, end))
+                  } else {
+                    console.log(`cycle ${index} not exist`)
+                  }
+                }
+              }
+              // console.log(dataY)
+
+              // insert y channel value to x, and generate data to draw
+              const cloneData = JSON.parse(JSON.stringify(dataX))
+              for (let Index = 0; Index < cloneData.length; Index++) { // merge 2 channel data
+                const yValue = dataY[Index][1]
+                cloneData[Index].reverse()
+                cloneData[Index].splice(1, 0, yValue)
+              }
+              // console.log(this.chartDetailData)
+              this.chartDetailData.series.forEach((series, index) => {
+                if (series.yAxisSource[0] === metaName && series.yAxisSource[1] === channelY) {
+                  let deStartIndex = 0
+                  let deEndIndex = 0
+                  series.data.forEach((_data, index) => {
+                    if (_data[1] >= cloneData[0][1] && deStartIndex === 0) {
+                      deStartIndex = index
+                    } else if (_data[1] > cloneData[cloneData.length - 1][1] && 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[2] - b[2] // sort by time
+                    })
+                    return data
+                  }
+                  this.$refs.chart_detail.$children[0].$children[0].appendData({
+                    seriesIndex: index,
+                    data: getNewDataList(deStartIndex, deEndIndex, series.data, cloneData),
+                  })
+                  // console.log(series.data)
+                }
+              })
+            }
+          }
+        }
+
+        // calculate x y min and max
+        const xValueArray = trimValueArray(dataX, this.scaleXSelect.description)
+        const yValueArray = trimValueArray(dataY, this.scaleYSelect.description)
+
+        let targetGridRanges = this.valueRanges.find(x => x.id === channelX)
+        let value = getValueArrayMinAndMax(xValueArray, 'x', targetGridRanges)
+        this.chartDetailData.xAxis[gridIndex].min = value.min
+        this.chartDetailData.xAxis[gridIndex].max = value.max
+
+        targetGridRanges = this.valueRanges.find(y => y.id === channelY)
+        value = getValueArrayMinAndMax(yValueArray, 'y', targetGridRanges)
+        this.chartDetailData.yAxis[gridIndex].min = value.min
+        this.chartDetailData.yAxis[gridIndex].max = value.max
+        // this.chartDetailData.yAxis[gridIndex].interval = (max - min) / 2
+      }
+      this.hideChartLoading()
+    },
+    async reDraw () {
+      this.chartData = {}
+      this.chartDetailData = await this.initChart({
+        chartAllData: this.chartData,
+        chartID: 1,
+        gridLength: 1,
+      })
+      await this.register()
+      this.drawData()
+    },
+    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()
+        }
+      }
+    },
+    async currentAxisValueRangeChange (channelIndex, valueRange) {
+      const gridIndex = 0 // [TODO] multiple grid
+      if (channelIndex === this.channelXSelect.id) {
+        if (valueRange.xMin !== '') {
+          this.chartDetailData.xAxis[gridIndex].min = parseInt(valueRange.xMin)
+        } else {
+          await this.reDraw()
+        }
+        if (valueRange.xMax !== '') {
+          this.chartDetailData.xAxis[gridIndex].max = parseInt(valueRange.xMax)
+        } else {
+          await this.reDraw()
+        }
+      }
+
+      if (channelIndex === this.channelYSelect.id) {
+        if (valueRange.yMin !== '') {
+          this.chartDetailData.yAxis[gridIndex].min = parseInt(valueRange.yMin)
+        } else {
+          await this.reDraw()
+        }
+        if (valueRange.yMax !== '') {
+          this.chartDetailData.yAxis[gridIndex].max = parseInt(valueRange.yMax)
+        } else {
+          await this.reDraw()
+        }
+      }
+    },
+    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('eliteReplay', [types.chart.init, types.chart.reset, types.chart.register, types.chart.clear, types.chart.updateGridList]),
+    ...mapActions('eliteReplay', [types.meta.init]),
+    ...mapActions('eliteReplay', [types.rec.init, types.rec.intoData, types.rec.initDisplaySetting, types.rec.updateDisplaySetting]),
+
+    ...mapMutations('eliteReplay', [types.meta.updateByIndex]),
+
+    ...mapGetters('eliteReplay', [types.meta.getAll]),
+    ...mapGetters('eliteReplay', [types.rec.getAll, types.rec.getAllDisplaySetting, types.rec.getDisplaySettingByKey]),
+  },
+  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()
+    this.filename = this.metaList[0].name // [todo] 0
+    const meta = this.metaList[0] // [todo] 0
+    const params = meta.parameter_set
+    this.parameterInfo.recording += 'Duration: ' + parseInt(parseInt(meta.time_duration / 1000000) / 60) + ' m ' + parseInt((meta.time_duration % 60000000) / 1000000) + ' s<br/>'
+    this.parameterInfo.recording += '<br/>Parameter: <br/>'
+    for (const [key, value] of Object.entries(params)) {
+      this.parameterInfo.recording += '    ' + key + ': ' + value + '<br/>'
+    }
+
+    if (meta.parameter_set.MODE !== 1 && meta.parameter_set.MODE !== 8 && meta.parameter_set.MODE !== 9) {
+      this.showWhichCycles = '0' // === 0 mean no cycle mode
+      this.isNeedCycle = false
+    }
+
+    await this.initDisplaySettingRec({ meta: meta })
+    await this.initRec({ api: api })
+    this.dataInfo = this.getAllRec()
+    // console.log('dataInfo', this.dataInfo)
+    await this.register()
+    this.drawData()
+    this.dataZoomTimer = setInterval(this.checkDataZoom, 1000)
+    this.isInitDone = true
+  },
+  beforeDestroy () {
+    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>

src/components/analysis/replay/elite/EliteReplayChart.vue

@@ -0,0 +1,69 @@
+<template>
+  <div class="flex" :class="cardclass">
+    <va-card>
+      <template slot="header">
+        <!-- <va-icon name="fa fa-area-chart mr-3" color="primary"/> -->
+      </template>
+      <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/task/ChartsManagement'
+
+export default {
+  name: 'elite-replay-chart',
+  components: {
+  },
+  props: {
+    data: {
+      type: Object,
+      default: function () {
+        return {}
+      },
+    },
+    cardclass: {
+      type: Array,
+      default: function () {
+        return ['xs12', 'md12', 'xl12', 'sm12']
+      },
+    },
+    cardheight: {
+      type: String,
+      default: '88vh',
+    },
+    cardwidth: {
+      type: String,
+      default: 'auto',
+    },
+  },
+  created () {
+  },
+  data () {
+    return {
+    }
+  },
+  computed: {
+  },
+  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)
+  },
+}
+
+</script>

src/components/analysis/replay/neulive/NeuliveDataReplay.vue

@@ -1,12 +1,136 @@
 <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>
+        <va-item>
+          <va-item-section style='text-align: center;'>
+            <p> Filename: </p>
+            <p> {{ filename }} </p>
+          </va-item-section>
+          <va-item-section style='text-align: center;'>
+            <va-button flat small color="gray" icon="fa fa-download" @click.stop="downloadCSV()"/>
+            <va-button flat small color="gray" icon="fa fa-pencil" @click.stop="editFileConfirm()"/>
+            <va-button flat small color="gray" icon="fa fa-trash" @click.stop="deleteFileConfirm()"/>
+          </va-item-section>
+          <va-item-section style='text-align: center;'>
+            <p> Current resample: </p>
+            <p> {{ currentScale }} to 1 </p>
+          </va-item-section>
+          <!-- <va-item-section style='float: left;'>
+            X axis unit
+            <va-select
+              :label="''"
+              v-model="valueFormatX"
+              textBy="unit"
+              :options="valueFormatOptions[channelXSelect.id]"
+            />
+          </va-item-section> -->
+          <va-item-section style='float: left;'>
+            Y axis unit
+            <va-select
+              :label="''"
+              v-model="valueFormatY"
+              textBy="unit"
+              :options="valueFormatOptions[channelYSelect.id]"
+            />
+          </va-item-section>
+          <va-item-section style='float: left;'>
+            Hide grids
+            <va-select
+              :label="''"
+              v-model="ignoreGridIndexes"
+              :disabled="isDistributeMode"
+              :options="allChannelIndexes"
+              multiple
+            />
+          </va-item-section>
+        </va-item>
+      </div>
+      <neulive-replay-chart :ref="'chart_overview'" class="mb-0" :key="overviewChartKey" :cardheight="'5vh'" :data="chartOverviewData"/>
+      <neulive-replay-chart :ref="'chart_detail'" @dblclick.native="distribute()"  :cardheight="'82vh'" :data="chartDetailData" @dataZoomEvent="dataZoomEvent($event)"/>
+      <va-card :title="$t('Parameter')">
+        <va-tree-root>
+          <va-tree-category label="AxisValueRangeSetting">
+            <div>
+              <div v-for="(range, index) in valueRanges" :key="index" style='width: 20%; float: left;'>
+                <va-item v-show="range.showXMin||range.showXMax||range.showYMin||range.showYMax">
+                  <va-item-section align="right">
+                    {{ range.name }}
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.yMin"
+                      v-show="range.showYMin"
+                      :label="$t('yMin')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                  <va-item-section>
+                    <va-input
+                      v-model="range.yMax"
+                      v-show="range.showYMax"
+                      :label="$t('yMax')"
+                      @keyup.enter="currentAxisValueRangeChange(index, range)"
+                    />
+                  </va-item-section>
+                </va-item>
+              </div>
+            </div>
+            <br/>
+          </va-tree-category>
+          <va-tree-category label="Recording">
+            <va-tree-node>
+              <pre><div class="title mb-3" :style="{color: this.$themes.primary}" v-html="parameterInfo.recording"></div></pre>
+            </va-tree-node>
+          </va-tree-category>
+          <va-tree-category label="Stimulation">
+            <va-tree-node>
+              <pre><div class="title mb-3" :style="{color: this.$themes.primary}" v-html="parameterInfo.stimulation"></div></pre>
+            </va-tree-node>
+          </va-tree-category>
+        </va-tree-root>
+      </va-card>
     </div>
-  </div>
 
+    <va-modal
+      class="flex sm12 xl12 md12 xs12"
+      v-model="showModal.editFile"
+      size="small"
+      :title="'CHANGE FILE NAME'"
+      :okText=" $t('modal.confirm') "
+      @ok="editFile()"
+      @cancel="undoEdit()"
+    >
+      <va-input
+        :value="editInfo.changedName"
+        :label="'Name'"
+        :placeholder="editInfo.name"
+        :success="editInfo.success"
+        :error="editInfo.error"
+        :error-messages="editInfo.errorMessages"
+        @input="checkFileNameValidate"
+        removable
+      />
+    </va-modal>
+    <va-modal
+      v-model="showModal.deleteFile"
+      size="small"
+      :title="'DELETE'"
+      :message="`Delete File ${deleteInfo.name}.`"
+      :okText=" $t('modal.confirm') "
+      @ok="deleteFile()"
+    >
+    </va-modal>
+    <va-modal
+      v-model="showModal.deleteFile"
+      size="small"
+      :title="'DELETE'"
+      :message="`Delete File ${deleteInfo.name}.`"
+      :okText=" $t('modal.confirm') "
+      @ok="deleteFile()"
+    >
+    </va-modal>
+  </div>
 </template>
 
 <script>
@@ -14,13 +138,32 @@ import { mapActions, mapGetters, mapMutations } from 'vuex'
 import NeuliveReplayChart from './NeuliveReplayChart.vue'
 import api from '@/data/api/index'
 import { download } from '@/data/download/Download'
+import { exportData } from '@/data/export/export'
 import types from '@/store/modules/analysis/replay/neulive/types'
+import { mapFields } from 'vuex-map-fields'
+import { debounce } from 'lodash'
 
 export default {
   name: 'neulive-data-replay',
   components: {
     NeuliveReplayChart,
   },
+  computed: {
+    ...mapFields('neuliveReplay', [
+      'displaySettingInfo.valueFormatOptions',
+      'displaySettingInfo.channelXSelect',
+      'displaySettingInfo.channelYSelect',
+      'displaySettingInfo.valueFormatX',
+      'displaySettingInfo.valueFormatY',
+      'displaySettingInfo.valueRanges', // each element: { id: ID, name: channelName, xMin: 0, xMax: 0, yMin: 0, yMax: 0 }
+      'displaySettingInfo.ignoreGridIndexes',
+      'displaySettingInfo.visibleGridIndexes',
+      'displaySettingInfo.filename',
+      'displaySettingInfo.parameterInfo',
+      'displaySettingInfo.editInfo',
+      'displaySettingInfo.deleteInfo',
+    ]),
+  },
   props: {
   },
   async created () {
@@ -34,9 +177,14 @@ export default {
       chartID: 1,
       gridLength: 1,
     })
+    // this.$refs.chart_detail.$children[0].$children[0].chart._zr.on('click',function(params) {
+    //   console.log('hi')
+    // })
   },
   data () {
     return {
+      isInitDone: false,
+      isDistributeMode: false,
       metaList: null,
       dataInfo: {},
       overviewChartKey: 0,
@@ -49,12 +197,111 @@ export default {
       startTime: 0,
       endTime: 0,
       zoomTime: 0,
+      currentScale: 0,
       maxScaleDefault: '1000',
+      allChannels: [],
+      allChannelIndexes: [],
+      showModal: {
+        deleteFile: false,
+        editFile: false,
+      },
     }
   },
   mqtt: {
   },
   methods: {
+    downloadCSV: async function () {
+      const meta = this.metaList[0]
+      const rawData = await download.getAllRawDatas(meta)
+      exportData.exportCSV(meta, rawData)
+    },
+    editFileConfirm: function () {
+      this.showModal.editFile = true
+    },
+    editFile: async function () {
+      await api.updateMetaFile(this.editInfo.info.id, { name: this.editInfo.changedName })
+      await this.updateDisplaySettingRec({ updateObject: { editInfo: { name: this.editInfo.changedName }, filename: this.editInfo.changedName } })
+    },
+    undoEdit: async function () {
+      await this.updateDisplaySettingRec({ updateObject: { editInfo: { success: false, error: false, changedName: '', name: '', path: '' } } })
+    },
+    checkFileNameValidate: debounce(function (term) {
+      const illegalChar = term.match(/[^(\w\-)]+/gm)
+      if (term.length === 0) {
+        // input text empty
+        this.editInfo.error = true
+        this.editInfo.success = false
+        this.editInfo.errorMessages.pop()
+        this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[1])
+      } else if (illegalChar !== null) {
+        // input text illegal
+        this.editInfo.error = true
+        this.editInfo.success = false
+        this.editInfo.errorMessages.pop()
+        this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[0] + ' ' + illegalChar[0])
+      }
+      this.editInfo.changedName = term
+    }, 200),
+    deleteFileConfirm: function () {
+      const info = this.metaList[0]
+      this.deleteInfo.path = info.path
+      this.deleteInfo.name = info.name
+      this.deleteInfo.metaID = info.id
+      this.deleteInfo.rawChannelAndIDArrays = [] // list of lists
+      this.deleteInfo.miniChannelAndIDArrays = [] // list of lists
+      for (const [channel, idArray] of Object.entries(info.raw_data)) {
+        this.deleteInfo.rawChannelAndIDArrays.push([channel, idArray[0]])
+      }
+      for (const [channel, scaleObject] of Object.entries(info.mini_data)) {
+        for (const idArray of Object.values(scaleObject)) {
+          this.deleteInfo.miniChannelAndIDArrays.push([channel, idArray[0]])
+        }
+      }
+      this.showModal.deleteFile = true
+    },
+    deleteFile: async function () {
+      for (const item of this.deleteInfo.rawChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateRawFile(channel, id, { deleted: true })
+        await api.clearDeleteRawFile(channel, id)
+      }
+      for (const item of this.deleteInfo.miniChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateMiniFile(channel, id, { deleted: true })
+        await api.clearDeleteMiniFile(channel, id)
+      }
+      await api.updateMetaFile(this.deleteInfo.metaID, { deleted: true })
+      await api.clearDeleteMetaFile(this.deleteInfo.metaID)
+      await this.deleteFileDone()
+    },
+    deleteFileDone: async function () {
+      this.showToast(`deleted ${this.deleteInfo.name}`, {
+        position: 'bottom-right',
+      })
+      this.$router.go(-1)
+    },
+    async selectChange () {
+      if (this.isInitDone) {
+        await this.reDraw()
+      }
+    },
+    async reDraw () {
+      this.chartData = {}
+      this.chartOverviewData = await this.initChart({
+        chartAllData: this.chartData,
+        chartID: 0,
+        gridLength: 1,
+      })
+      this.chartDetailData = await this.initChart({
+        chartAllData: this.chartData,
+        chartID: 1,
+        gridLength: 1,
+      })
+      await this.register()
+      this.drawData()
+    },
     showChartLoading: function (chart) {
       const loadStyle = {
         text: '',
@@ -79,11 +326,15 @@ export default {
       this.$refs.chart_overview.$children[0].$children[0].hideLoading()
       this.$refs.chart_detail.$children[0].$children[0].hideLoading()
     },
-    getData: async function (scale, id, channel) {
+    getData: async function (scale, sampleMethod, id, channel, meta) {
       if (scale === 1) {
-        return await download.rawByIDChannels(id, channel)
+        return await download.rawByIDChannels(id, channel, meta)
       } else {
-        return await download.miniMeanByIDChannel(id, channel)
+        if (sampleMethod === 'mean') {
+          return await download.miniMeanByIDChannel(id, channel, meta)
+        } else if (sampleMethod === 'random') {
+          return await download.miniRandomByIDChannel(id, channel, meta)
+        }
       }
     },
     register: async function () {
@@ -97,19 +348,35 @@ export default {
         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,
-            })
+            if (parseInt(ch) > 255) {
+              this.registerChart({
+                chartAllData: this.chartData,
+                chartID: this.chartDetailData.chartID,
+                gridIndex: _chNumber,
+                deviceNameX: 'Time',
+                deviceNameY: 'Neulive',
+                deviceIDY: meta.name,
+                channelY: ch,
+                valueFormatX: this.valueFormatX,
+              })
+            } else {
+              this.registerChart({
+                chartAllData: this.chartData,
+                chartID: this.chartDetailData.chartID,
+                gridIndex: _chNumber,
+                deviceNameX: 'Time',
+                deviceNameY: 'Neulive',
+                deviceIDY: meta.name,
+                channelY: ch,
+                valueFormatX: this.valueFormatX,
+                valueFormatY: this.valueFormatY,
+              })
+            }
             this.registerChart({
               chartAllData: this.chartData,
               chartID: this.chartOverviewData.chartID,
@@ -122,8 +389,8 @@ export default {
             _chNumber++
           })
         })
-        if (this.maxTime < meta.time_duration) {
-          this.maxTime = meta.time_duration
+        if (this.maxTime < parseInt(meta.time_duration)) {
+          this.maxTime = parseInt(meta.time_duration)
           this.endTime = this.endTimeCurrent = this.maxTime
         }
         // }
@@ -141,7 +408,6 @@ export default {
       this.chartOverviewData.dataZoom = null
     },
     dataZoomEvent: function (e) {
-      // console.log(e)
       if (e.batch != null) {
         // console.log(e.batch)
         e.batch.forEach(dataZoom => {
@@ -196,19 +462,17 @@ export default {
           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
-                    }
+            const _timeZone = parseInt(dataList[0].end_time) - parseInt(dataList[0].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
-              }
+                }
+              })
+              getMetaScale = true
             }
             if (getMetaScale) {
               break
@@ -228,119 +492,230 @@ export default {
       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
           }
         })
+        this.currentScale = scale
 
+        const sampleMethod = 'mean'
+        const dataIndex = {}
         const getAllData = async function (_this) {
           for (const ch in _this.dataInfo[meta]) {
             const dataList = _this.dataInfo[meta][ch][scale]
+            dataIndex[ch] = []
             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 ((_this.startTimeCurrent >= parseInt(dataList[i].start_time) && _this.startTimeCurrent <= parseInt(dataList[i].end_time)) || (_this.endTimeCurrent >= parseInt(dataList[i].start_time) && _this.endTimeCurrent <= parseInt(dataList[i].end_time))) {
+                dataIndex[ch].push(i)
                 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),
+                    data: await _this.getData(parseInt(scale), sampleMethod, dataList[i].id, ch, metaInfo),
                   })
                 }
               }
+              // fill data
+            }
+            // console.log('need to download', dataIndex)
+            for (let i = Math.min(...dataIndex[ch]); i <= Math.max(...dataIndex[ch]); i++) {
+              if (dataList[i].data.length === 0) {
+                _this.intoDataRec({
+                  index: i,
+                  metaID: meta,
+                  channel: ch,
+                  scale: scale,
+                  data: await _this.getData(parseInt(scale), sampleMethod, dataList[i].id, ch, metaInfo),
+                })
+              }
             }
           }
         }
 
+        console.log('scale', scale)
         await getAllData(this)
-
-        for (const ch in this.dataInfo[meta]) {
+        for (const [gridIndex, ch] of this.allChannels.entries()) {
+          if (!this.visibleGridIndexes.includes(gridIndex.toString())) {
+            continue
+          }
           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 (scale === '1000') {
+            this.chartOverviewData.series.forEach((series, index) => {
+              if (series.data.length === 0) {
+                for (let i = 0; i < dataList.length; i++) {
+                  series.data.push(...dataList[i].data)
+                }
+              }
+              // this.$refs.chart_overview.$children[0].$children[0].appendData({
+              //   seriesIndex: index,
+              //   data: '', //TODO
+              // })
+            })
+
+            this.chartDetailData.series.forEach((series, index) => {
+              if (series.yAxisSource[0] === metaName && series.yAxisSource[1] === parseInt(ch)) {
+                series.data.length = 0
                 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
+                  for (let i = 0; i < dataList.length; i++) {
+                    series.data.push(...dataList[i].data)
+                  }
+                }
+                // this.$refs.chart_detail.$children[0].$children[0].appendData({
+                //   seriesIndex: index,
+                //   data: '', //TODO
+                // })
+              }
+            })
+          } else {
+            for (let i = 0; i < dataList.length; i++) {
+              if ((this.startTimeCurrent >= parseInt(dataList[i].start_time) && this.startTimeCurrent <= parseInt(dataList[i].end_time)) ||
+                  (this.endTimeCurrent >= parseInt(dataList[i].start_time) && this.endTimeCurrent <= parseInt(dataList[i].end_time))) {
+                const data = JSON.parse(JSON.stringify(dataList[i].data))
+                if (data.length !== 0) {
+                  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) {
+                          Array.prototype.splice.apply(dataList, [deStartIndex, deEndIndex - deStartIndex].concat(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),
+                        })
                       }
-                    })
-                    if (deEndIndex === 0) {
-                      deEndIndex = series.data.length
+                      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)
                     }
-                    const getNewDataList = function (deStartIndex, deEndIndex, dataList, data) {
-                      dataList.splice(deStartIndex, deEndIndex - deStartIndex, ...data)
-                      dataList.sort(function (a, b) {
-                        return a[0] - b[0]
+                  })
+                  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) {
+                        Array.prototype.splice.apply(dataList, [deStartIndex, deEndIndex - deStartIndex].concat(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),
                       })
-                      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
+                    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)
                   })
-                  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)
                 }
-              })
+              }
             }
           }
+
+          // [Region]: set chart y axis min and max
+          // if (!this.isDistributeMode) {
+          //   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 = JSON.parse(JSON.stringify(dataList[i].data))
+          //       const xValueArray = []
+          //       const yValueArray = []
+          //       for (let j = 0; j < data.length; j++) {
+          //         xValueArray.push(data[j][0]) // time
+          //         yValueArray.push(data[j][1])
+          //       }
+          //       // destructuring assignment, ref: https://medium.com/@vladbezden/how-to-get-min-or-max-of-an-array-in-javascript-1c264ec6e1aa
+          //       let max = Math.max(...xValueArray)
+          //       let min = Math.min(...xValueArray)
+          //       const targetGridRanges = this.valueRanges.find(x => x.id === parseInt(ch))
+          //       if (targetGridRanges.xMin !== '') {
+          //         min = parseInt(targetGridRanges.xMin)
+          //       }
+          //       this.chartDetailData.xAxis[gridIndex].min = min
+          //       if (targetGridRanges.xMax !== '') {
+          //         max = parseInt(targetGridRanges.xMax)
+          //       }
+          //       this.chartDetailData.xAxis[gridIndex].max = max
+          //       max = Math.max(...yValueArray)
+          //       min = Math.min(...yValueArray)
+          //       if (targetGridRanges.yMin !== '') {
+          //         min = parseInt(targetGridRanges.yMin)
+          //       }
+          //       this.chartDetailData.yAxis[gridIndex].min = min
+          //       if (targetGridRanges.yMax !== '') {
+          //         max = parseInt(targetGridRanges.yMax)
+          //       }
+          //       this.chartDetailData.yAxis[gridIndex].max = max
+          //       this.chartDetailData.yAxis[gridIndex].interval = (max - min) / 2
+          //     }
+          //   }
+          // }
         }
+        // else: max min will compute in distribute function
+        // [EndRegion]
       }
       this.hideChartLoading()
     },
@@ -354,20 +729,80 @@ export default {
         }
       }
     },
-    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
+    async currentAxisValueRangeChange (channelIndex, valueRange) {
+      // if (valueRange.xMin !== 0) {
+      //   this.chartDetailData.xAxis[channelIndex].min = valueRange.xMin
+      // }
+      // if (valueRange.xMax !== 0) {
+      //   this.chartDetailData.xAxis[channelIndex].max = valueRange.xMax
+      // }
+      if (valueRange.yMin !== '') {
+        this.chartDetailData.yAxis[channelIndex].min = parseInt(valueRange.yMin)
       } else {
+        await this.reDraw()
+      }
+      if (valueRange.yMax !== '') {
+        this.chartDetailData.yAxis[channelIndex].max = parseInt(valueRange.yMax)
+      } else {
+        await this.reDraw()
+      }
+    },
+    // 疊圖function
+    distribute: async function () {
+      let max = Number.MIN_SAFE_INTEGER
+      let min = Number.MAX_SAFE_INTEGER
+      if (this.chartDetailData.grid.length === 1) {
+        this.isDistributeMode = false
+        const updateVisible = this.allChannelIndexes.filter(x => !this.ignoreGridIndexes.includes(x))
+        await this.updateDisplaySettingRec({ updateObject: { visibleGridIndexes: updateVisible } })
+        await this.reDraw()
+        // [Region]: compute chart y axis min and max with only visible grid, ch < 255 is because 疊圖 don't need 3-axis chart
+        for (const [gridIndex, ch] of this.allChannels.entries()) {
+          if (!this.visibleGridIndexes.includes(gridIndex.toString())) {
+            continue
+          }
+
+          if (ch < 255) {
+            const _max = this.chartDetailData.yAxis[gridIndex].max
+            if (_max > max) {
+              max = _max
+            }
+            const _min = this.chartDetailData.yAxis[gridIndex].min
+            if (_min < min) {
+              min = _min
+            }
+          }
+        }
+        // [EndRegion]
+      } else {
+        this.isDistributeMode = true
+
+        // [Region]: reset all grid existing max min data, and compute chart y axis min and max with only visible grid, ch < 255 is because 疊圖 don't need 3-axis chart
+        await this.resetChartDataAxisLabelChart({ chartData: this.chartDetailData })
+        let updateVisible = Array.from({ length: this.allChannels.length }, (v, i) => i.toString())
+        for (const [gridIndex, ch] of this.allChannels.entries()) {
+          if (!this.visibleGridIndexes.includes(gridIndex.toString())) {
+            updateVisible = updateVisible.filter(x => x !== gridIndex.toString())
+            continue
+          }
+
+          if (ch < 255) {
+            const _max = this.chartDetailData.yAxis[gridIndex].max
+            if (_max > max) {
+              max = _max
+            }
+            const _min = this.chartDetailData.yAxis[gridIndex].min
+            if (_min < min) {
+              min = _min
+            }
+          } else {
+            this.chartDetailData.series[gridIndex].data = []
+            updateVisible = updateVisible.filter(x => x !== gridIndex.toString())
+          }
+        }
+        await this.updateDisplaySettingRec({ updateObject: { visibleGridIndexes: updateVisible } })
+        // [EndRegion]
+
         this.updateGridListChart({
           chartAllData: this.chartData,
           chartID: this.chartDetailData.chartID,
@@ -378,31 +813,51 @@ export default {
           series.yAxisIndex = 0
         })
         this.chartDetailData.xAxis[0].axisLabel.show = true
+        this.chartDetailData.yAxis[0].max = max
+        this.chartDetailData.yAxis[this.chartDetailData.yAxis.length - 1].min = min
       }
     },
 
-    ...mapActions('neuliveReplay', [types.chart.init, types.chart.register, types.chart.clear, types.chart.updateGridList]),
-
+    ...mapActions('neuliveReplay', [types.chart.init, types.chart.register, types.chart.clear, types.chart.updateGridList, types.chart.resetChartDataAxisLabel]),
     ...mapActions('neuliveReplay', [types.meta.init]),
+    ...mapActions('neuliveReplay', [types.rec.init, types.rec.intoData, types.rec.initDisplaySetting, types.rec.updateDisplaySetting]),
+
     ...mapMutations('neuliveReplay', [types.meta.updateByIndex]),
+
     ...mapGetters('neuliveReplay', [types.meta.getAll]),
-    ...mapActions('neuliveReplay', [types.rec.init, types.rec.intoData]),
-    ...mapGetters('neuliveReplay', [types.rec.getAll]),
+    ...mapGetters('neuliveReplay', [types.rec.getAll, types.rec.getAllDisplaySetting, types.rec.getDisplaySettingByKey]),
   },
+  // use watch because va-select with @change will have bug
   watch: {
+    valueFormatX: function (newVal) {
+      this.selectChange()
+    },
+    valueFormatY: function (newVal) {
+      this.selectChange()
+    },
+    ignoreGridIndexes: async function (newVal) {
+      if (this.isInitDone) {
+        const difference = this.allChannelIndexes.filter(x => !newVal.includes(x))
+        await this.updateDisplaySettingRec({ updateObject: { visibleGridIndexes: difference } })
+        await this.reDraw()
+      }
+    },
   },
   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)
+    const meta = this.metaList[0] // [todo] 0
+    await this.initDisplaySettingRec({ meta: meta })
     await this.initRec({ api: api })
     this.dataInfo = this.getAllRec()
     await this.register()
     this.drawData()
     this.dataZoomTimer = setInterval(this.checkDataZoom, 1000)
+    this.allChannels = Object.keys(meta.mini_data)
+    this.allChannelIndexes = Array.from({ length: this.allChannels.length }, (v, i) => i.toString()) // gives [0, 1, ... , length-1]
+    this.isInitDone = true
   },
   beforeDestroy () {
     this.$refs.chart_overview.$children[0].$children[0].clear()
@@ -418,7 +873,6 @@ export default {
   destroyed () {
     clearInterval(this.dataZoomTimer)
   },
-
 }
 </script>
 

src/components/analysis/replay/neulive/NeuliveReplayChart.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="flex" :class="cardclass">
-    <va-card>
-      <template slot="header">
-        <!-- <va-icon name="fa fa-area-chart mr-3" color="primary"/> -->
-      </template>
-
+    <va-card :style="'height: ' + cardheight + ';'">
       <chart :ref="'chart_ref'" :style="'width: '+ cardwidth + '; height: ' + cardheight + ';'" :options="data" @dataZoom="updateZoom" :auto-resize="true"></chart>
     </va-card>
   </div>
@@ -32,7 +28,7 @@ export default {
     },
     cardheight: {
       type: String,
-      default: '88vh',
+      default: '82vh',
     },
     cardwidth: {
       type: String,
@@ -68,3 +64,11 @@ export default {
 }
 
 </script>
+
+<style lang='scss'>
+  .va-card {
+    &__body {
+      padding-top: 0.25rem;
+    }
+  }
+</style>

src/components/devices/DevicesOverview.vue

@@ -12,7 +12,7 @@
         <div v-if="controller.status === 'running'">
           <div class="flex xs12 md12 xl12 sm12 mb-3" style="text-align: center;" >
 
-            <va-button color="primary" target="_blank" @click="scan(controller.id)" small :disabled="controller.isScan">
+            <va-button class="no-dark-style-va-button" color="primary" target="_blank" @click="scan(controller.id)" small :disabled="controller.isScan">
               SCAN
             </va-button>
             <va-button color="dark" target="_blank" @click="restartCheck(controller.id, controller.mac)" small>
@@ -53,27 +53,28 @@
                       <va-badge v-if="device.status == 'scanned'" class="px-1 py-0" color="primary">scanned</va-badge>
                       <va-badge v-if="device.status == 'connected'" class="px-1 py-0" color="success">connected</va-badge>
                     </div> -->
-
                     <va-item-section avatar class="ml-1">
                       <va-avatar style="border-radius: 0;">
                         <img :src="device.pic" :alt="device.name">
                       </va-avatar>
                     </va-item-section>
-
                     <va-item-section class="ml-3">
-
                       <va-item-label>
                         {{ device.name }}
                         <va-badge v-if="device.status == 'scanned'" class="px-1 py-0 ml-2 mt-0" color="primary">scanned</va-badge>
                         <va-badge v-if="device.status == 'connected'" class="px-1 py-0 ml-2 mt-0" color="success">connected</va-badge>
                       </va-item-label>
-
                       <va-item-label caption>
                         {{ device.addr }}
                       </va-item-label>
                     </va-item-section>
+                    <!--<div>
+                      <va-icon name="fa fa-battery-1" style="font-size: 1.5rem;" color="primary"/>
+                    </div>-->
+                  </va-item>
 
-                    <va-item-section side >
+                  <va-item class="pa-0 ma-0 mt-2">
+                    <va-item-section>
                       <div v-if="device.loading" class="mr-3">
                         <fulfilling-bouncing-circle-spinner
                           :animation-duration="3000"
@@ -82,11 +83,14 @@
                         >
                         </fulfilling-bouncing-circle-spinner>
                       </div>
-                      <va-button @click.stop="connect(controller.id, device)" v-if="device.status == 'scanned' && !device.loading" class="pl-2 pr-2" color="success" small>CONNECT</va-button>
-                      <va-button @click.stop="disconnectCheck(controller.id, device)" :disabled="controller.isScan" v-if="device.status == 'connected' && !device.loading" class="pl-2 pr-2" color="danger" small>DISCONNECT</va-button>
+                      <div>
+                        <va-button style="width: 100px;" @click.stop="connect(controller.id, device)" v-if="device.status == 'scanned' && !device.loading" class="pl-2 pr-2 mt-2" color="success" small>CONNECT</va-button>
+                        <va-button style="width: 100px;" @click.stop="disconnectCheck(controller.id, device)" :disabled="controller.isScan" v-if="device.status == 'connected' && !device.loading" class="pl-2 pr-2 mt-2" color="danger" small>DISCONNECT</va-button>
+                        <va-button @click.stop="detect(controller.id, device)" :disabled="controller.isScan" v-if="device.status == 'connected' && !device.loading && device.library_name.indexOf('Elite') !== -1" class="pl-2 pr-2 mt-2" color="primary" small>DETECT</va-button>
+                      </div>
                     </va-item-section>
-
                   </va-item>
+
                 </va-card>
               </div>
             </div>
@@ -209,7 +213,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)
@@ -244,6 +250,10 @@ export default {
                   controller.status = 'running'
                 }
               })
+              this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
+                header: 'hardware_datetime/0',
+                content: String(Date.now()),
+              }))
               this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
                 header: 'hardware_device/0',
               }))
@@ -262,6 +272,10 @@ export default {
           this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
             header: 'hardware_device/0',
           }))
+          this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
+            header: 'device_update_calibration/0',
+            device: parseInt(mes[1]),
+          }))
           // this.mqttPub(topicSplit[0] + '_user', JSON.stringify({
           //   header: 'device_parent/0',
           //   device: parseInt(mes[1]),
@@ -343,6 +357,7 @@ export default {
     },
     pageMqttSub: function () {
       this.controllerList.forEach(controller => {
+        this.mqttSub(controller.id + '/hardware_datetime/+')
         this.mqttSub(controller.id + '/hardware_device/+')
         this.mqttSub(controller.id + '/hardware_info/+')
         this.mqttSub(controller.id + '/hardware_device_connect/+')
@@ -352,6 +367,7 @@ export default {
     },
     pageMqttUnSub: function () {
       this.controllerList.forEach(controller => {
+        this.mqttUnSub(controller.id + '/hardware_datetime/+')
         this.mqttUnSub(controller.id + '/hardware_device/+')
         this.mqttUnSub(controller.id + '/hardware_info/+')
         this.mqttUnSub(controller.id + '/hardware_device_connect/+')
@@ -361,6 +377,10 @@ export default {
     },
     pageInitPub: function () {
       this.controllerList.forEach(controller => {
+        this.mqttPub(controller.id + '_user', JSON.stringify({
+          header: 'hardware_datetime/0',
+          content: String(Date.now()),
+        }))
         this.mqttPub(controller.id + '_user', JSON.stringify({
           header: 'hardware_device/0',
         }))
@@ -427,6 +447,20 @@ export default {
         device: this.selectDevice.id,
       }))
     },
+    detect (controllerID, device) {
+      this.mqttPub(controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: device.id,
+        instruction: 'VIS_DEVICE_DETECT',
+      }))
+      setTimeout(() => {
+        this.mqttPub(controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: device.id,
+          instruction: 'VIS_DEVICE_DONE',
+        }))
+      }, 5000)
+    },
     sleep: function (milliseconds) {
       var start = new Date().getTime()
       while (1) {
@@ -477,3 +511,11 @@ export default {
 
 }
 </script>
+
+<style lang="scss">
+  .no-dark-style-va-button {
+    &:focus {
+      filter: brightness(100%);
+    }
+  }
+</style>

src/components/download/Download.vue

@@ -267,11 +267,36 @@ export default {
     },
     addDownloadTask: async function (info) {
       this.downloading()
-      console.log('download')
-      console.time()
-      const rawData = await download.rawByParentChannels(info.id, info.channels)
-      console.timeEnd()
-      exportData.exportCSV(info, rawData)
+      /*
+      ** download all
+      */
+      if (parseInt(info.time_duration) < 18e8) {
+        const rawData = await download.getAllRawDatas(info)
+        exportData.exportCSV(info, rawData)
+      } else {
+        for (const channelID in info.raw_data) {
+          const rawDataIDList = info.raw_data[channelID]
+
+          while (rawDataIDList.length > 1000) {
+            const _list = rawDataIDList.splice(0, 1000)
+            const rawData = await download.getIndexRawDatas(info, channelID, _list)
+            exportData.exportCSV(info, rawData)
+          }
+          const rawData = await download.getIndexRawDatas(info, channelID, rawDataIDList)
+          exportData.exportCSV(info, rawData, channelID)
+          rawData[channelID].length = 0
+          // const rawData = await download.getAllRawDatas(info)
+          // console.timeEnd('download')
+        }
+      }
+      // console.time('download')
+      // const rawData = await download.getAllRawDatas(info)
+      // console.timeEnd('download')
+      // exportData.exportCSV(info, rawData)
+
+      /*
+      ** download split
+      */
       this.downloading()
     },
     _addDownloadTask: function (downloadPath) {

src/components/file/File.vue

@@ -36,7 +36,7 @@ export default {
     getControllerList: async function () {
       const update = async () => {
         this.controllerList.push({
-          id: 'BPS_FF',
+          id: 'tommy_test',
           mac: '',
           status: 'loading',
           isScan: true,

src/components/file/file-table/FileTable.vue

@@ -173,7 +173,7 @@
             <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)"/>
+            <va-button flat small color="gray" icon="fa fa-trash" @click.stop="deleteFileConfirm(props.rowData)"/>
           </va-popover>
         </template>
       </va-data-table>
@@ -195,7 +195,7 @@ export default {
   data () {
     return {
       term: null,
-      perPage: '20',
+      perPage: '160',
       perPageOptions: ['20', '40', '80', '160'],
 
       fileLists: [],
@@ -230,6 +230,9 @@ export default {
       deleteInfo: {
         path: '',
         name: '',
+        metaID: '',
+        rawChannelAndIDArrays: [], // list of lists
+        miniChannelAndIDArrays: [], // list of lists
       },
 
       styleList: {
@@ -352,8 +355,8 @@ export default {
     },
 
     openFile: async function (info) {
-      this.currentInfo = info
       if (info.type === 'folder') {
+        this.currentInfo = info
         this.loadingFiles = true
         // clear file and add path
         file.clearFileList()
@@ -443,7 +446,7 @@ export default {
         type: type,
         size: 0,
       })
-      this.refreshPage()
+      await this.refreshPage()
       this.showToast(`Folder ${this.createInfo.changedName} create.`, {
         position: 'bottom-right',
       })
@@ -465,10 +468,11 @@ export default {
         await api.updateMetaFile(this.editInfo.info.id, { name: this.editInfo.changedName })
       } else {
       }
-      this.editFileDone()
+      await this.editFileDone()
     },
     checkFileNameValidate: debounce(function (term) {
       const illegalChar = term.match(/[^(\w\-)]+/gm)
+      this.editInfo.changedName = term
       if (term.length === 0) {
         // input text empty
         this.editInfo.error = true
@@ -482,7 +486,13 @@ export default {
         this.editInfo.errorMessages.pop()
         this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[0] + ' ' + illegalChar[0])
       } else {
-        const existedFile = this.fileLists.filter(file => file.name.replace('/', '') === term)
+        const existedFile = this.fileLists.filter((file) => {
+          if (file.name != null) {
+            return file.name.replace('/', '') === term
+          } else {
+            return false
+          }
+        })
         if (existedFile.length === 0) {
           this.editInfo.error = false
           this.editInfo.success = true
@@ -494,10 +504,12 @@ export default {
           this.editInfo.errorMessages.push(this.editInfo.errorMessagesAll[2])
         }
       }
-      this.editInfo.changedName = term
     }, 200),
-    editFileDone: function () {
-      this.refreshPage()
+    editFileDone: async function () {
+      const tmpCurrentPage = this.$refs.datatable_ref.currentPage
+      await this.refreshPage()
+      this.$refs.datatable_ref.currentPage = tmpCurrentPage
+      this.$refs.datatable_ref.inputPage(tmpCurrentPage)
       this.showToast(`${this.editInfo.info.name} -> ${this.editInfo.changedName}`, {
         position: 'bottom-right',
       })
@@ -511,18 +523,50 @@ export default {
     },
     removeFileFromList: function () {
     },
-    deleteFileConfirm: function (path, name) {
-      this.deleteInfo.path = path
-      this.deleteInfo.name = name
+    deleteFileConfirm: function (info) {
+      // console.log(info)
+      this.deleteInfo.path = info.path
+      this.deleteInfo.name = info.name
+      this.deleteInfo.metaID = info.id
+      this.deleteInfo.rawChannelAndIDArrays = [] // list of lists
+      this.deleteInfo.miniChannelAndIDArrays = [] // list of lists
+      for (const [channel, idArray] of Object.entries(info.raw_data)) {
+        this.deleteInfo.rawChannelAndIDArrays.push([channel, idArray[0]])
+      }
+      for (const [channel, scaleObject] of Object.entries(info.mini_data)) {
+        for (const idArray of Object.values(scaleObject)) {
+          this.deleteInfo.miniChannelAndIDArrays.push([channel, idArray[0]])
+        }
+      }
+      // console.log(this.deleteInfo.rawChannelAndIDArrays)
+      // console.log(this.deleteInfo.miniChannelAndIDArrays)
+      // console.log(this.deleteInfo.metaID)
       this.showModal.deleteFile = true
     },
-    deleteFile: function () {
-      // delete editFile
+    deleteFile: async function () {
+      for (const item of this.deleteInfo.rawChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateRawFile(channel, id, { deleted: true })
+        await api.clearDeleteRawFile(channel, id)
+      }
+      for (const item of this.deleteInfo.miniChannelAndIDArrays) {
+        const channel = item[0]
+        const id = item[1]
+        await api.updateMiniFile(channel, id, { deleted: true })
+        await api.clearDeleteMiniFile(channel, id)
+      }
+      await api.updateMetaFile(this.deleteInfo.metaID, { deleted: true })
+      await api.clearDeleteMetaFile(this.deleteInfo.metaID)
+      await this.deleteFileDone()
     },
-    deleteFileDone: function () {
+    deleteFileDone: async function () {
+      const tmpCurrentPage = this.$refs.datatable_ref.currentPage
       // rebuild table
       this.fileLists = this.fileLists.filter(file => file.name !== this.deleteInfo.name)
-
+      await this.refreshPage()
+      this.$refs.datatable_ref.currentPage = tmpCurrentPage
+      this.$refs.datatable_ref.inputPage(tmpCurrentPage)
       // this.loadingFiles = false
       this.showToast(`deleted ${this.deleteInfo.name}`, {
         position: 'bottom-right',
@@ -571,10 +615,17 @@ export default {
       this.$emit('download', info)
     },
     replay: function (meta) {
-      console.log(this.$router)
-      this.$router.push({
-        path: '/admin/data-replay/neulive/' + meta.id,
-      })
+      if (meta.device.library_name.includes('Neulive') === true) {
+        // window.open('http://' + location.href.split('/')[2].split(':')[0] + '/#/admin/data-replay/neulive/' + meta.id)
+        this.$router.push({
+          path: '/admin/data-replay/neulive/' + meta.id,
+        })
+      } else if (meta.device.library_name.includes('Elite') === true) {
+        // window.open('http://' + location.href.split('/')[2].split(':')[0] + '/#/admin/data-replay/elite/' + meta.id)
+        this.$router.push({
+          path: '/admin/data-replay/elite/' + meta.id,
+        })
+      }
     },
   },
   mounted () {

src/components/project/projectContent.vue

@@ -50,7 +50,7 @@ export default {
 
     async initAll () {
       await this.initTask({ id: getUniqueID(), desc: 'task description', instructions: getDefaultInstruction() })
-      await this.initDevice({ availableDevice: ['4'], deviceInfo: { 4: { battery: 0, device_name: '', device_address: [], device_version: '', library_name: '', library_version: '', serial_number: [], status: '', isSync: false, parent: '' } } })
+      await this.initDevice({ availableDevice: ['4'], deviceInfo: { 4: { battery: 0, device_name: '', device_address: [], device_version: '', library_name: '', library_version: '', serial_number: [], status: '', isSync: false, isStimulatemulate: false, parent: '' } } })
       await this.initParam({ id: getUniqueID(), paramsSet: { alias: 'default', desc: '', recording: { ADC_CLOCK: 200, AMP_GAIN: 0, RECORDING_CH: 0 } } })
     },
     async AddTask () {

src/components/task/content/TaskContent.vue

@@ -26,9 +26,9 @@
           <div class="flex sm12 xl12 md12 xs12">
             <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">
+          <!-- <div class="flex sm12 xl12 md12 xs12">
             <task-formula :ref="'formula_ref'" @add="addFormula($event)" @remove="removeFormula($event)" class="pa-0" />
-          </div>
+          </div> -->
         </div>
 
       </div>
@@ -44,19 +44,19 @@
                   <va-icon name="fa fa-gears mr-3" color="primary"/>
                   <h5 class="mt-0 mb-0">CONTROL</h5>
                 </template>
-                <va-button class="" v-if="!showDeviceSetting" color="primary" target="_blank" @click="showDeviceSettingClick()" small>
+                <va-button class="no-dark-style-va-button" v-if="!showDeviceSetting" color="primary" target="_blank" @click="showDeviceSettingClick()" small>
                   SHOW DEVICES
                 </va-button>
-                <va-button  class="" v-if="showDeviceSetting" color="primary" target="_blank" @click="hideDeviceSettingClick()" small>
+                <va-button  class="no-dark-style-va-button" v-if="showDeviceSetting" color="primary" target="_blank" @click="hideDeviceSettingClick()" small>
                   HIDE DEVICES
                 </va-button>
                 <va-button class="" color="success" target="_blank" @click="startAllClick()" small>
                   START ALL
                 </va-button>
-                <va-button class="" color="danger" target="_blank" @click="stopAllClick()" small>
+                <va-button class="no-dark-style-va-button" color="danger" target="_blank" @click="stopAllClick()" small>
                   STOP ALL
                 </va-button>
-                <va-button class="" color="primary" target="_blank" @click.stop="addChart()" small>
+                <va-button class="no-dark-style-va-button" color="primary" target="_blank" @click.stop="addChart()" small>
                   ADD CHART
                 </va-button>
               </va-card>
@@ -99,7 +99,7 @@ import { chartData } from '../../../data/task/ChartsManagement'
 import { taskInfo } from '../../../data/task/TaskInfo'
 import CanvasChart from './chart/CanvasChart'
 import TaskDevices from './controller/TaskDevices'
-import TaskFormula from './formula/TaskFormula'
+// import TaskFormula from './formula/TaskFormula'
 
 // TODO change chart data tag format
 
@@ -108,7 +108,7 @@ export default {
   components: {
     CanvasChart,
     TaskDevices,
-    TaskFormula,
+    // TaskFormula,
   },
   async created () {
     await taskInfo.updateTaskInfo(this.$route.params.taskID)
@@ -143,6 +143,10 @@ export default {
       await taskInfo.deviceParameter(String.fromCharCode.apply(null, data))
       this.refreshDevicesWindow()
     },
+    async '+/device_parameter_value/+' (data, topic) {
+      await taskInfo.deviceParameter(String.fromCharCode.apply(null, data))
+      this.refreshDevicesWindow()
+    },
     async '+/hardware_device/+' (data, topic) {
       await taskInfo.deviceInfo(String.fromCharCode.apply(null, data))
       if (this.$refs.devices_ref != null) {
@@ -154,7 +158,6 @@ export default {
       const topicSplit = topic.split('/')
       if (!taskInfo.getDeviceInfoByRawID(parseInt(topicSplit[3])).info.isSync) {
         taskInfo.deviceStart(parseInt(topicSplit[3]))
-        this.$refs.devices_ref.setArchiveSettings()
         chartData.defaultChartGenerator(taskInfo.getDeviceIDByRaw(parseInt(topicSplit[3])), null, 'device')
       }
       dataStreamBuffer.into(String.fromCharCode.apply(null, data), parseInt(topicSplit[3]), (parseInt(topicSplit[4]) + 1))
@@ -236,6 +239,7 @@ export default {
       this.mqttSub(id + '/get_device_info_all/+')
       this.mqttSub(id + '/get_device_info/+')
       this.mqttSub(id + '/device_parameter/+')
+      this.mqttSub(id + '/device_parameter_value/+')
     },
     pageMqttUnSub: function (id) {
       for (const device in taskInfo.getTaskInfo().deviceList) {
@@ -246,6 +250,7 @@ export default {
       this.mqttUnSub(id + '/get_device_info_all/+')
       this.mqttUnSub(id + '/get_device_info/+')
       this.mqttUnSub(id + '/device_parameter/+')
+      this.mqttUnSub(id + '/device_parameter_value/+')
     },
     pageInit: async function () {
       if (await this.$refs.devices_ref != null) {
@@ -284,7 +289,7 @@ export default {
         for (const chart in chartData.getAllChartsData()) {
           defaultID[chart] = chartData.getAllChartsData()[chart].mappingID
         }
-        chartData.init(this.chartNumber, 50000, 1, 1)
+        chartData.init(this.chartNumber, 4000, 1, 1)
         this.chartNumber++
         this.chartKey++
       }
@@ -419,33 +424,69 @@ export default {
       }
       this.pageToast('The formula [' + formulaID + '] has been removed.')
     },
-    startAllClick: function () {
-      taskInfo.getDeviceListRegister().forEach(device => {
-        chartData.defaultChartGenerator(device.id, null, 'device')
-        if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+    startAllClick: async function () {
+      for (const device of taskInfo.getDeviceListRegister()) {
+        if (this.$refs.devices_ref === undefined) {
+          this.startDevice(device)
+        } else {
+          await this.$refs.devices_ref.$refs.pdlist_ref.start(device)
+        }
+      }
+      this.refreshDevicesWindow()
+      this.pageToast('The all devices have been started')
+    },
+    startDevice: async function (device) {
+      chartData.defaultChartGenerator(device.id, null, 'device')
+      if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+        if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Neulive')) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'record',
+          }))
+        } else if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Elite')) {
+          console.log('elite')
           this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
             header: 'device_instruction/0',
             device: taskInfo.getRawDeviceID(device.id),
             instruction: 'start',
           }))
-          device.isSync = true
         }
-      })
-      this.pageToast('The all devices have been started')
+        device.stopping = false
+        device.isSync = true
+        // this.$emit('refreshSetting')
+        // ### show device info
+        console.log(taskInfo.getDeviceInfo(device.id))
+      }
     },
     stopAllClick: function () {
-      dataStreamBuffer.removeAll()
-      taskInfo.getDeviceListRegister().forEach(device => {
-        if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+      for (const device of taskInfo.getDeviceListRegister()) {
+        if (this.$refs.devices_ref === undefined) {
+          this.stopDevice(device)
+        } else {
+          this.$refs.devices_ref.stopDevice(device)
+        }
+      }
+      this.pageToast('The all devices have been stopped')
+    },
+    stopDevice: async function (device) {
+      dataStreamBuffer.removeByDevice(taskInfo.getRawDeviceID(device.id))
+      if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+        if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Neulive')) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'stop_record',
+          }))
+        } else if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Elite')) {
           this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
             header: 'device_instruction/0',
             device: taskInfo.getRawDeviceID(device.id),
             instruction: 'interrupt',
           }))
         }
-        // device.isSync = false
-      })
-      this.pageToast('The all devices have been stopped')
+        device.stopping = true
+      }
     },
     exit: function () {
       this.$router.push({
@@ -465,7 +506,7 @@ export default {
 
     // this.chartNumber = taskInfo.getTaskInfo().chartNumber
 
-    this.dataRefreshTimer = setInterval(this.refreshData, 700)
+    this.dataRefreshTimer = setInterval(this.refreshData, 100)
 
     // const _this = this
     // window.onresize = function () { // define the event of window size changing
@@ -497,4 +538,10 @@ export default {
       overflow-x: hidden;
     }
   }
+
+  .no-dark-style-va-button {
+    &:focus {
+      filter: brightness(100%);
+    }
+  }
 </style>

src/components/task/content/chart/CanvasChartSource.vue

@@ -136,6 +136,32 @@ 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 (taskInfo.getDeviceInfo(this.deviceSelectX.id).info.library_name.indexOf('Elite') >= 0) {
         const channelSet = taskInfo.getDeviceInfo(this.deviceSelectX.id).parameterSet.CHANNEL_LABEL
@@ -172,6 +198,32 @@ 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 (taskInfo.getDeviceInfo(this.deviceSelectY.id).info.library_name.indexOf('Elite') >= 0) {
         const channelSet = taskInfo.getDeviceInfo(this.deviceSelectY.id).parameterSet.CHANNEL_LABEL

src/components/task/content/controller/TaskDeviceList.vue

@@ -31,8 +31,6 @@
             <va-item-section class="ml-3">
               <va-item-label>
                 {{ device.name }}
-                <va-button @click.stop="start(device)" v-if="!device.isSync" class="px-2 py-0 mr-0" color="success" small>START</va-button>
-                <va-button @click.stop="stop(device)" v-if="device.isSync" :disabled="device.stopping" class="px-2 py-0 mr-0" color="danger" small>STOP</va-button>
               </va-item-label>
 
               <va-item-label caption>
@@ -42,6 +40,19 @@
             </va-item-section>
 
           </va-item>
+
+          <va-item class="pa-0 ma-0 mt-2">
+            <va-item-section class="ml-3">
+              <va-item-label>
+                <va-button @click.stop="start(device)" v-if="!device.isSync" class="px-2 py-0 mr-0" color="success" small>START</va-button>
+                <va-button @click.stop="stop(device)" v-if="device.isSync" :disabled="device.stopping" class="px-2 py-0 mr-0" color="danger" small>STOP</va-button>
+                <va-button @click.stop="detect(device)" v-if="device.type == 'Elite'" color="primary" class="px-2 py-0 mr-0" small>DETECT</va-button>
+                <va-button @click.stop="stimulate(device)" v-if="device.type == 'Neulive' && !device.isStimulate" color="warning" class="px-2 py-0 mr-0" small>STIMULATE</va-button>
+                <va-button @click.stop="stopStimulate(device)" v-if="device.type == 'Neulive' && device.isStimulate" color="danger" class="px-2 py-0 mr-0" small>STOP</va-button>
+                <va-button @click.stop="fastSettle(device)" v-if="device.type == 'Neulive'" color="info" class="px-2 py-0 mr-0" small>R</va-button>
+              </va-item-label>
+            </va-item-section>
+          </va-item>
         </span>
         <div slot="body">
           <div class="mt-0 mb-0" style="height: 350px; overflow-y: scroll; overflow-x: hidden;" :key="'detail' + device.id">
@@ -55,7 +66,7 @@
               <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>
@@ -102,15 +113,27 @@ export default {
     },
     start: function (device) {
       this.setArchiveSettings()
-      this.$emit('start', device)
-      device.stopping = false
+      // this.$emit('start', device)
+      setTimeout(() => {
+        this.$emit('start', device)
+      }, 100)
       this.pageToast('The device ' + device.name + ' has been started.')
     },
     stop: function (device) {
-      device.stopping = true
       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)
     },
@@ -148,6 +171,22 @@ export default {
         },
       )
     },
+    detect: function (device) {
+      this.$emit('detect', device)
+      this.pageToast('The device ' + device.name + ' has been detect.')
+    },
+    stimulate: function (device) {
+      this.$emit('sti', device)
+      this.pageToast('The device ' + device.name + ' start stimulate.')
+    },
+    stopStimulate: function (device) {
+      this.$emit('sti_stop', device)
+      this.pageToast('The device ' + device.name + ' stop stimulate.')
+    },
+    fastSettle: function (device) {
+      this.$emit('fast_settle', device)
+      this.pageToast('The device ' + device.name + ' fast settle.')
+    },
   },
 }
 </script>

src/components/task/content/controller/TaskDevices.vue

@@ -15,7 +15,7 @@
       </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)" @generate="generateChart($event)" />
+        <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)" @sti="sti($event)" @sti_stop="stiStop($event)" @fast_settle="fastSettle($event)" @generate="generateChart($event)" @detect="detectDevice($event)" />
 
         <div class="row flex xs12 md12 xl12 sm12 mt-2" style="text-align: center;">
           <div class="xs10 md10 xl10 sm10">
@@ -97,11 +97,63 @@ export default {
     startDevice: async function (device) {
       await chartData.defaultChartGenerator(device.id, null, 'device')
       if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
+        if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Neulive')) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'record',
+          }))
+        } else if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Elite')) {
+          console.log('elite')
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'start',
+          }))
+        }
+        device.stopping = false
+        device.isSync = true
+        this.$emit('refreshSetting')
+        // ### show device info
+        console.log(taskInfo.getDeviceInfo(device.id))
+      }
+    },
+    stopDevice: async function (device) {
+      await dataStreamBuffer.removeByDevice(taskInfo.getRawDeviceID(device.id))
+      if (taskInfo.getDeviceInfo(device.id).info.isSync) {
+        if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Neulive')) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'stop_record',
+          }))
+        } else if (taskInfo.getDeviceInfo(device.id).info.library_name.startsWith('Elite')) {
+          this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+            header: 'device_instruction/0',
+            device: taskInfo.getRawDeviceID(device.id),
+            instruction: 'interrupt',
+          }))
+        }
+        device.stopping = true
+      }
+    },
+    detectDevice: function (device) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        instruction: 'VIS_DEVICE_DETECT',
+      }))
+      setTimeout(() => {
         this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
           header: 'device_instruction/0',
           device: taskInfo.getRawDeviceID(device.id),
-          instruction: 'start',
+          instruction: 'VIS_DEVICE_DONE',
         }))
+      }, 5000)
+    },
+    startRecord: async function (device) {
+      await chartData.defaultChartGenerator(device.id, null, 'device')
+      if (!taskInfo.getDeviceInfo(device.id).info.isSync) {
         device.isSync = true
         this.$emit('refreshSetting')
 
@@ -109,17 +161,52 @@ export default {
         console.log(taskInfo.getDeviceInfo(device.id))
       }
     },
-    stopDevice: function (device) {
+    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',
-        }))
+        // this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        //   header: 'device_instruction/0',
+        //   device: taskInfo.getRawDeviceID(device.id),
+        //   instruction: 'interrupt',
+        // }))
       }
       // device.isSync = false
     },
+    sti: function (device) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        instruction: 'stimulate',
+      }))
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        parameter: 'STIMULATING',
+        content: 1,
+      }))
+      device.isStimulate = true
+    },
+    stiStop: function (device) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        instruction: 'stop_stimulate',
+      }))
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        parameter: 'STIMULATING',
+        content: 0,
+      }))
+      device.isStimulate = false
+    },
+    fastSettle: function (device) {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(device.id),
+        instruction: 'FAST_SET',
+      }))
+    },
     // addDevice: async function () {
     //   if (this.deviceSelect.id == null) {
     //     return false
@@ -176,6 +263,7 @@ export default {
         picture: pic,
         type: type,
         isSync: taskInfo.getDeviceInfoByRawID(selectID).info.isSync,
+        isStimulate: taskInfo.getDeviceInfoByRawID(selectID).info.isStimulate,
         stopping: false,
       }
       this.deviceList.push(_device)

src/components/task/content/meta/FileControlWindow.vue

@@ -65,53 +65,94 @@ export default {
       fileNameInput: '',
       directory: '',
       directoryOptions: [],
-      deviceInfo: {},
+      deviceInfo: null,
+      enableSetting: false,
+      enableTimer: null,
     }
   },
   mqtt: {
   },
   methods: {
-    fileNameChange: function (name) {
-      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-        header: 'device_recording_file_name/0',
-        device: taskInfo.getRawDeviceID(this.deviceID),
-        content: name,
-      }))
+    fileNameChange: async function (name) {
+      if (this.enableSetting) {
+        if (this.deviceInfo.info.isSync === false) {
+          let fileNameCount = await api.getMetaFilesByName(name)
+          if (fileNameCount.data != null) {
+            let duplicateCount = 1
+            let fileName = name
+            while (fileNameCount.data.length !== 0) {
+              const res = name.split('(')[0]
+              fileName = `${res}(${duplicateCount})`
+              fileNameCount = await api.getMetaFilesByName(fileName)
+              duplicateCount += 1
+            }
+            this.fileNameInput = fileName
+          }
+
+          if (name !== this.deviceInfo.info.recording_file_name) {
+            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 (typeof directoryInfo === 'object') {
-        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parent/0',
-          device: taskInfo.getRawDeviceID(this.deviceID),
-          content: {
-            folder: [directoryInfo.id],
-          },
-        }))
+      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 () {
-      this.deviceInfo = taskInfo.getDeviceInfo(this.deviceID)
-      const now = this.getCurrentTime()
-      // filename init
-      // TODO this.deviceInfo.info.isSync is false, beacause refresh is faster than get_device_info response
-      if (this.deviceInfo.info.isSync) {
-        this.fileNameInput = this.deviceInfo.info.recording_file_name
-      } else {
-        this.fileNameInput = now
-      }
+      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)
+        this.fileNameChange(this.fileNameInput)
 
-      // directory init
-      const collection = await api.getCollectionsAll()
-      this.directoryOptions = collection.data.filter(el => el.name !== 'root')
+        // 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
+        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
+            }
           }
         }
       }
@@ -137,6 +178,10 @@ export default {
   },
   mounted () {
     this.pageInit()
+    this.enableTimer = setTimeout(this.enableChangeFile, 1500)
+  },
+  destroyed () {
+    clearTimeout(this.enableTimer)
   },
   watch: {
     deviceID: function (val) {

src/components/task/content/parameter/EliteParameterRecordingElitezm15.vue

@@ -1,11 +1,10 @@
 <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()"
+            @input="workingModeSelectChange(workingModeSelect)"
             :label="'WORKING MODE'"
             v-model="workingModeSelect"
             textBy="description"
@@ -14,7 +13,7 @@
             style="width: 200px;"
           />
           <va-button
-            v-if="!measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11)"
+            v-if="!measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9)"
             color="primary"
             target="_blank"
             @click="measureEoc()"
@@ -22,7 +21,7 @@
             {{measureEocButton.start}}
           </va-button>
           <va-button
-            v-if="measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11)"
+            v-if="measureEocButton.status && workingModeSelect != null && (workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9)"
             color="danger"
             target="_blank"
             @click="measureEocStop()"
@@ -32,20 +31,9 @@
         </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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1 || workingModeSelect.id == 5 || workingModeSelect.id == 6 || workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 11"
         style="font-size: 20px;"
         :label="'Range ( ' + currentRangeOptions[currentRangeSelect].label + ' )'">
         <va-tree-node>
@@ -54,7 +42,7 @@
       </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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1 || workingModeSelect.id == 4 ||workingModeSelect.id == 6 || workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 11"
         style="font-size: 20px;"
         :label="'Range ( ' + voltageInRangeOptions[voltageInRangeSelect].label + ' )'">
         <va-tree-node>
@@ -63,7 +51,7 @@
       </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"
+        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"
         style="font-size: 20px;"
         :label="'HighZ ( ' + highzOptions[highzSelect].label + ' )'">
         <va-tree-node>
@@ -72,7 +60,7 @@
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 13"
+        v-if="workingModeSelect != null && workingModeSelect.id == 11"
         style="font-size: 20px;"
         :label="'Cali Channel ( ' + caliChannelOptions[caliChannelSelect].label + ' )'">
         <va-tree-node>
@@ -81,7 +69,7 @@
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 12"
+        v-if="workingModeSelect != null && workingModeSelect.id == 10"
         style="font-size: 20px;"
         :label="'cali Volt ( ' + caliVoltNumber + ' )'">
         <va-tree-node>
@@ -92,7 +80,7 @@
       <va-tree-category
         v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
         style="font-size: 20px;"
-        :label="'Volt start ( ' + startVoltNumber/100 + 'V )'">
+        :label="'Volt start ( ' + startVoltNumber/1000 + 'V )'">
         <va-tree-node>
           <volt-range :ref="'startVoltNumber'" :deviceID="deviceID" :parameterName="'VOLT_ORIGIN'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
         </va-tree-node>
@@ -101,7 +89,7 @@
       <va-tree-category
         v-if="workingModeSelect != null && workingModeSelect.id == 0 || workingModeSelect.id == 1"
         style="font-size: 20px;"
-        :label="'Volt stop ( ' + stopVoltNumber/100 + 'V )'">
+        :label="'Volt stop ( ' + stopVoltNumber/1000 + 'V )'">
         <va-tree-node>
           <volt-range :ref="'stopVoltNumber'" :deviceID="deviceID" :parameterName="'VOLT_FINAL'" :minValue="-5" :maxValue="5" @parameterChange="deviceParameterChange($event)" />
         </va-tree-node>
@@ -128,23 +116,23 @@
       <va-tree-category
         v-if="workingModeSelect != null && workingModeSelect.id == 2"
         style="font-size: 20px;"
-        :label="'Volt out ( ' + outputVoltNumber/100 + 'V )'">
+        :label="'Volt out ( ' + outputVoltNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 2 || workingModeSelect.id == 3 || workingModeSelect.id == 4 || workingModeSelect.id == 5 || workingModeSelect.id == 6"
         style="font-size: 20px;"
-        :label="'Sample rate ( ' + sampleRateOptions[sampleRateSelect].label + ' )'">
+        :label="'Sample rate ( ' + sampleRateNumber/10 + 'sps )'">
         <va-tree-node>
-          <level-button :ref="'sampleRateSelect'" :deviceID="deviceID" :options="sampleRateOptions" :parameterName="'SAMPLE_RATE'" @parameterChange="deviceParameterChange($event)" />
+          <resolution-range :ref="'sampleRateNumber'" :deviceID="deviceID" :parameterName="'SAMPLE_RATE'" :minValue="0.1" :maxValue="100" @parameterChange="deviceParameterChange($event)" />
         </va-tree-node>
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        v-if="workingModeSelect != null && workingModeSelect.id == 6"
         style="font-size: 20px;"
         :label="'Charge ( ' + chargeOptions[chargeSelect].label + ' )'">
         <va-tree-node>
@@ -153,7 +141,7 @@
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        v-if="workingModeSelect != null && workingModeSelect.id == 6"
         style="font-size: 20px;"
         :label="'Current ( ' + parseFloat(currentNumber / 100) + 'μA )'">
         <va-tree-node>
@@ -162,70 +150,70 @@
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 7"
+        v-if="workingModeSelect != null && workingModeSelect.id == 6"
         style="font-size: 20px;"
-        :label="'Volt max stop ( ' + stopVoltMaxNumber/100 + 'V )'">
+        :label="'Volt max stop ( ' + stopVoltMaxNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 6"
         style="font-size: 20px;"
-        :label="'Volt min stop ( ' + stopVoltMinNumber/100 + 'V )'">
+        :label="'Volt min stop ( ' + stopVoltMinNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 7 || workingModeSelect.id == 8"
         style="font-size: 20px;"
-        :label="'E-Initial ( ' + voltInitialNumber/100 + 'V )'">
+        :label="'E-Initial ( ' + voltInitialNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
         style="font-size: 20px;"
-        :label="'E1 ( ' + voltMaxNumber/100 + 'V )'">
+        :label="'E1 ( ' + voltMaxNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 7"
         style="font-size: 20px;"
-        :label="'E2 ( ' + voltMinNumber/100 + 'V )'">
+        :label="'E2 ( ' + voltMinNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 8"
         style="font-size: 20px;"
-        :label="'E-Final ( ' + voltEFinalNumber/100 + 'V )'">
+        :label="'E-Final ( ' + voltEFinalNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 9"
         style="font-size: 20px;"
-        :label="'VScan ( ' + voltVScanNumber/100 + 'V )'">
+        :label="'VScan ( ' + voltVScanNumber/1000 + '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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 7 || workingModeSelect.id == 8"
         style="font-size: 20px;"
         :label="'ScanRate ( ' + voltScanRateNumber/100 + 'mV/s )'">
         <va-tree-node>
@@ -234,22 +222,124 @@
       </va-tree-category>
 
       <va-tree-category
-        v-if="workingModeSelect != null && workingModeSelect.id == 8 || workingModeSelect.id == 9 || workingModeSelect.id == 10 || workingModeSelect.id == 11"
+        v-if="workingModeSelect != null && workingModeSelect.id == 7 || workingModeSelect.id == 8 || workingModeSelect.id == 9"
         style="font-size: 20px;"
-        :label="'Resolution ( ' + resolutionNumber/10 + 'sps )'">
+        :label="'Resolution ( ' + sampleRateNumber/10 + 'sps )'">
         <va-tree-node>
-          <resolution-range :ref="'resolutionNumber'" :deviceID="deviceID" :parameterName="'Data_Resolution_Scan'" :minValue="0.1" :maxValue="100" @parameterChange="deviceParameterChange($event)" />
+          <resolution-range :ref="'sampleRateNumber'" :deviceID="deviceID" :parameterName="'SAMPLE_RATE'" :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"
+        v-if="workingModeSelect != null && workingModeSelect.id == 1 || workingModeSelect.id == 7"
         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-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 12"
+        style="font-size: 20px;"
+        :label="'RIS instruction (HEX)'">
+        <va-card>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div class="flex row align--center">
+                <va-input
+                  @keyup.enter="instruParameterChange([instru.parameterName, instru.write])"
+                  @blur="instruParameterChange([instru.parameterName, instru.write])"
+                  class="mb-0"
+                  v-model="instru.write"
+                  label="Write value (0x3000FF ... )"
+                  style="width: 100px;"
+                  maxlength="34"
+                />
+                <va-button slot="append" class="mr-2 pa-1 shrink" style="width: 2em; height: 2em; border-radius: 50%; font-size: 20px;" small @click="sendInstr()">
+                  W
+                </va-button>
+              </div>
+            </div>
+          </div>
+
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div class="flex row align--center">
+                <va-input
+                  disabled="disabled"
+                  class="mb-0"
+                  v-model="instru.read"
+                  label="Read value"
+                  style="width: 100px; font-size: 30px;"
+                />
+                <va-button slot="append" class="mr-2 pa-1 shrink" style="width: 2em; height: 2em; border-radius: 50%; font-size: 20px;" small @click="readCisData()">
+                  R
+                </va-button>
+              </div>
+            </div>
+          </div>
+
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div class="flex row align--center">
+                <va-input
+                  disabled="disabled"
+                  class="mb-0"
+                  v-model="instru.notify"
+                  label="Notify value"
+                  style="width: 100px;"
+                />
+                <va-button slot="append" class="mr-2 pa-1 shrink" style="width: 2em; height: 2em; border-radius: 50%; font-size: 20px;" small @click="detect()">
+                  N
+                </va-button>
+              </div>
+            </div>
+          </div>
+        </va-card>
+      </va-tree-category>
+
+      <va-tree-category
+        v-if="workingModeSelect != null && workingModeSelect.id == 12"
+        style="font-size: 20px;"
+        :label="'VIS & CIS instruction'">
+        <va-card>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <div class="flex row align--center">
+                <va-input
+                  disabled="disabled"
+                  class="mb-0"
+                  v-model="instru.read"
+                  label="Read value"
+                  style="width: 100px; font-size: 30px;"
+                />
+                <va-button slot="append" class="mr-2 pa-1 shrink" style="width: 2em; height: 2em; border-radius: 50%; font-size: 20px;" small @click="readCisData()">
+                  R
+                </va-button>
+              </div>
+            </div>
+          </div>
+
+          <div>
+            <va-button class="mr-2 pa-1" style="width: 4em; height: 2em; font-size: 15px;" small @click="detect()">
+              Detect
+            </va-button>
+          </div>
+          <div>
+            <va-button class="mr-2 pa-1" style="width: 4em; height: 2em; font-size: 15px;" small @click="version()">
+              Version
+            </va-button>
+          </div>
+          <div>
+            <va-button class="mr-2 pa-1" style="width: 4em; height: 2em; font-size: 15px;" small @click="battery()">
+              Battery
+            </va-button>
+          </div>
+
+        </va-card>
+      </va-tree-category>
+
     </va-tree-root>
   </div>
 </template>
@@ -323,36 +413,32 @@ export default {
         },
         {
           id: 6,
-          description: 'ADC_Test',
-        },
-        {
-          id: 7,
           description: 'Constant Current',
         },
         {
-          id: 8,
+          id: 7,
           description: 'Cyclic Voltammetry',
         },
         {
-          id: 9,
-          description: 'Cyclic Voltammetry-hi-cycles',
-        },
-        {
-          id: 10,
+          id: 8,
           description: 'Linear Sweep Voltammetry',
         },
         {
-          id: 11,
+          id: 9,
           description: 'Chronoamperometric Graph',
         },
         {
-          id: 12,
+          id: 10,
           description: 'Cali DAC - test',
         },
         {
-          id: 13,
+          id: 11,
           description: 'Cali ADC - test',
         },
+        {
+          id: 12,
+          description: 'Dev Mode',
+        },
       ],
       currentRangeSelect: null,
       currentRangeOptions: [
@@ -427,33 +513,7 @@ export default {
       ],
       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',
-        },
-      ],
+      sampleRateNumber: null,
       chargeSelect: null,
       chargeOptions: [
         {
@@ -492,6 +552,11 @@ export default {
       voltEFinalNumber: null,
       voltVScanNumber: null,
       caliVoltNumber: null,
+      instru: {
+        write: '',
+        read: '',
+        notify: '',
+      },
     }
   },
   mqtt: {
@@ -512,6 +577,10 @@ export default {
     },
     refresh () {
       this.workingModeSelect = this.workingModeOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.MODE]
+      if (this.workingModeSelect != null) {
+        this.workingModeSelectChange(this.workingModeSelect)
+      }
+
       this.currentRangeSelect = taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_LEVEL_I_15
       if (this.$refs.currentRangeSelect != null) {
         this.$refs.currentRangeSelect.updateLevelButton(this.currentRangeSelect)
@@ -537,21 +606,17 @@ export default {
         this.$refs.caliVoltNumber.updateCycleNumber(this.caliVoltNumber)
       }
 
-      this.startVoltNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN) / 5000) * 100)
+      this.startVoltNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_ORIGIN - 25000) / 5
       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)
+      this.stopVoltNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_FINAL - 25000) / 5
       if (this.$refs.stopVoltNumber != null) {
         this.$refs.stopVoltNumber.updateVoltNumber(this.stopVoltNumber)
       }
 
-      this.stepVoltNumber = parseInt((2 + (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP * 2)))
+      this.stepVoltNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_STEP)
       if (this.$refs.stepVoltNumber != null) {
         this.$refs.stepVoltNumber.updateStepVoltNumber(this.stepVoltNumber)
       }
@@ -566,14 +631,14 @@ export default {
         this.$refs.cycleNoNumber.updateCycleNumber(this.cycleNoNumber)
       }
 
-      this.outputVoltNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT) / 5000) * 100)
+      this.outputVoltNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.DAC_VOLT - 25000) / 5
       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.sampleRateNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.SAMPLE_RATE
+      if (this.$refs.sampleRateNumber != null) {
+        this.$refs.sampleRateNumber.updateResolutionNumber(this.sampleRateNumber)
       }
 
       this.chargeSelect = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.Charge + 1) % 2
@@ -586,62 +651,58 @@ export default {
         this.$refs.currentNumber.updateMicroAmpereNumber(this.currentNumber)
       }
 
-      this.stopVoltMaxNumber = Math.round((-5.00 + parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX) / 5000) * 100)
+      this.stopVoltMaxNumber = this.voltInitialNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MAX - 25000) / 5
       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)
+      this.stopVoltMinNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLTSTOP_MIN - 25000) / 5
       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)
+      this.voltInitialNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_INITIAL - 25000) / 5
       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)
+      this.voltMaxNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MAX - 25000) / 5
       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)
+      this.voltMinNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_MIN - 25000) / 5
       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)
+      this.voltEFinalNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_EFINAL - 25000) / 5
       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)
+      this.voltVScanNumber = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.VOLT_VSCAN - 25000) / 5
       if (this.$refs.voltVScanNumber != null) {
         this.$refs.voltVScanNumber.updateVoltNumber(this.voltVScanNumber)
       }
 
-      this.voltScanRateNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate + 1
+      this.voltScanRateNumber = taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate
       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)
-      }
+      this.instru.read = (taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_VALUE_I).toString(16).toUpperCase()
     },
-    workingModeSelectChange () {
+    workingModeSelectChange (val) {
       if (this.workingModeSelect.id === -1) {
         return false
       }
+
+      this.workingModeSelect = val
+
       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,
-        }))
+        this.deviceParameterChange(['MODE', this.workingModeSelect.id])
+        console.log(this.workingModeSelect.id, this.workingModeSelect.description)
       }
     },
     measureEoc () {
@@ -660,6 +721,67 @@ export default {
       }))
       this.measureEocButton.status = false
     },
+    instruParameterChange: function (e) {
+      while (e[1].length <= 33) {
+        e[1] = e[1] + '0'
+      }
+
+      const sendIns = new Array(17).fill(0)
+      for (let i = 0; i <= 16; i++) {
+        const startIndex = i * 2
+        sendIns[i] = e[1].substring(startIndex, startIndex + 2)
+        sendIns[i] = parseInt(sendIns[i], 16)
+      }
+
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        parameter: 'BLE_WRITE',
+        content: '0:16=' + String(sendIns),
+      }))
+    },
+    sendInstr () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'ble_instru_send',
+      }))
+    },
+    readCisData () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_parameter_value/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        parameter: 'ADC_VALUE_I',
+      }))
+    },
+    detect () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'VIS_DEVICE_DETECT',
+      }))
+      setTimeout(() => {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_instruction/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          instruction: 'VIS_DEVICE_DONE',
+        }))
+      }, 5000)
+    },
+    version () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'dev_version',
+      }))
+    },
+    battery () {
+      this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+        header: 'device_instruction/0',
+        device: taskInfo.getRawDeviceID(this.deviceID),
+        instruction: 'dev_battery',
+      }))
+    },
   },
   mounted () {
     this.refresh()

src/components/task/content/parameter/NeuliveParameterRecording.vue

@@ -1,5 +1,27 @@
 <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
@@ -10,7 +32,7 @@
             <div class="flex sm12 xl12 md12 xs12">
               <div
                 style='display: inline-block;'
-                v-for="channel in [1, 2, 3, 4, 5, 6, 7, 8]"
+                v-for="channel in [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]"
                 :key="channel"
               >
                 <va-button
@@ -35,6 +57,39 @@
         </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'">
@@ -42,7 +97,7 @@
           <div class="row">
             <div class="flex sm12 xl12 md12 xs12">
               <va-select
-                :on-change="ampGainSelectChange()"
+                @input="ampGainSelectChange()"
                 :label="''"
                 v-model="ampGainSelect"
                 textBy="description"
@@ -54,6 +109,96 @@
       </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">
+              <va-select
+                @input="sampleRateSelectChange()"
+                :label="''"
+                v-model="sampleRateSelect"
+                textBy="description"
+                :options="sampleRateOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Radio Frequency'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <va-select
+                @input="radioFrequencySelectChange()"
+                :label="''"
+                v-model="radioFrequencySelect"
+                textBy="description"
+                :options="radioFrequencyOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Mem Radio Frequency'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <va-select
+                @input="memRadioFrequencySelectChange()"
+                :label="''"
+                v-model="memRadioFrequencySelect"
+                textBy="description"
+                :options="memRadioFrequencyOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Led Brightness'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <va-select
+                @input="ledBrightnessSelectChange()"
+                :label="''"
+                v-model="ledBrightnessSelect"
+                textBy="description"
+                :options="ledBrightnessOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <va-tree-category
+        style="font-size: 20px;"
+        :label="'Accelerator Sensitivity'">
+        <va-tree-node>
+          <div class="row">
+            <div class="flex sm12 xl12 md12 xs12">
+              <va-select
+                @input="acceleratorSensitivitySelectChange()"
+                :label="''"
+                v-model="acceleratorSensitivitySelect"
+                textBy="description"
+                :options="acceleratorSensitivityOptions"
+              />
+            </div>
+          </div>
+        </va-tree-node>
+      </va-tree-category>
+
+      <!-- <va-tree-category
         style="font-size: 20px;"
         :label="'Sample rate'">
         <va-tree-node>
@@ -90,7 +235,7 @@
             </div>
           </div>
         </va-tree-node>
-      </va-tree-category>
+      </va-tree-category> -->
     </va-tree-root>
 
   </div>
@@ -98,6 +243,7 @@
 
 <script>
 import { taskInfo } from '../../../../data/task/TaskInfo'
+import { chartData } from '../../../../data/task/ChartsManagement'
 
 export default {
   name: 'NeuliveParameterRecording',
@@ -118,25 +264,187 @@ export default {
       channelList: [],
       ampGainSelect: null,
       ampGainOptions: [
+        // {
+        //   id: 0,
+        //   description: '25',
+        // },
         {
           id: 0,
-          description: '25',
-        },
-        {
-          id: 1,
           description: '100',
         },
         {
-          id: 2,
+          id: 1,
           description: '400',
         },
         {
-          id: 3,
+          id: 2,
           description: '800',
         },
       ],
-      sampleRateInput: '1000',
-      sampleRate: null,
+      sampleRateSelect: null,
+      sampleRateOptions: [
+        {
+          id: 0,
+          value: 800,
+          description: '1k',
+        },
+        {
+          id: 1,
+          value: 400,
+          description: '2k',
+        },
+        {
+          id: 2,
+          value: 200,
+          description: '4k',
+        },
+        {
+          id: 3,
+          value: 160,
+          description: '5k',
+        },
+        {
+          id: 4,
+          value: 100,
+          description: '8k',
+        },
+        {
+          id: 5,
+          value: 80,
+          description: '10k',
+        },
+      ],
+      radioFrequencySelect: null,
+      radioFrequencyOptions: [
+        {
+          id: 0,
+          value: -20,
+          description: '-20',
+        },
+        {
+          id: 1,
+          value: -16,
+          description: '-16',
+        },
+        {
+          id: 2,
+          value: -12,
+          description: '-12',
+        },
+        {
+          id: 3,
+          value: -8,
+          description: '-8',
+        },
+        {
+          id: 4,
+          value: -4,
+          description: '-4',
+        },
+        {
+          id: 5,
+          value: 0,
+          description: '0',
+        },
+        {
+          id: 6,
+          value: 4,
+          description: '4',
+        },
+        {
+          id: 7,
+          value: 8,
+          description: '8',
+        },
+      ],
+      memRadioFrequencySelect: null,
+      memRadioFrequencyOptions: [
+        {
+          id: 0,
+          value: -20,
+          description: '-20',
+        },
+        {
+          id: 1,
+          value: -16,
+          description: '-16',
+        },
+        {
+          id: 2,
+          value: -12,
+          description: '-12',
+        },
+        {
+          id: 3,
+          value: -8,
+          description: '-8',
+        },
+        {
+          id: 4,
+          value: -4,
+          description: '-4',
+        },
+        {
+          id: 5,
+          value: 0,
+          description: '0',
+        },
+        {
+          id: 6,
+          value: 4,
+          description: '4',
+        },
+        {
+          id: 7,
+          value: 8,
+          description: '8',
+        },
+      ],
+      ledBrightnessSelect: null,
+      ledBrightnessOptions: [
+        {
+          id: 0,
+          value: 0,
+          description: 'off',
+        },
+        {
+          id: 1,
+          value: 1,
+          description: 'bright',
+        },
+        {
+          id: 2,
+          value: 2,
+          description: 'normal',
+        },
+      ],
+      acceleratorSensitivitySelect: null,
+      acceleratorSensitivityOptions: [
+        {
+          id: 0,
+          value: 3,
+          description: '2G',
+        },
+        {
+          id: 1,
+          value: 5,
+          description: '4G',
+        },
+        {
+          id: 2,
+          value: 8,
+          description: '8G',
+        },
+        {
+          id: 3,
+          value: 12,
+          description: '16G',
+        },
+      ],
+      // sampleRateInput: '1000',
+      // sampleRate: null,
+      recordOn: false,
+      axisChannelList: [],
     }
   },
   mqtt: {
@@ -153,16 +461,36 @@ export default {
           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.ampGainSelect = this.ampGainOptions[(taskInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN) % 4]
+      this.sampleRateSelect = this.sampleRateOptions[this.sampleRateOptions.findIndex(ele => ele.value === taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK)]
+      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')
+          }
+        }
+      })
+
+      this.radioFrequencySelect = this.radioFrequencyOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.RADIO_FREQUENCY]
+      this.memRadioFrequencySelect = this.memRadioFrequencyOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.MEM_RADIO_FREQUENCY]
+      this.ledBrightnessSelect = this.ledBrightnessOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.LED_BRIGHTNESS]
+      this.acceleratorSensitivitySelect = this.acceleratorSensitivityOptions[taskInfo.getDeviceInfo(this.deviceID).parameterSet.ACCELERATOR_S]
     },
     channelClickAdd (val) {
-      if (this.channelList.indexOf(val) < 0) {
+      if (this.channelList.indexOf(val) < 0 && this.channelList.length < 15) {
         this.channelList.push(val)
 
         let channelSet = ''
-        for (let i = 8; i >= 1; i--) {
+        for (let i = 16; i >= 1; i--) {
           if (this.channelList.indexOf(i) >= 0) {
             channelSet += '1'
           } else {
@@ -179,13 +507,15 @@ export default {
             content: channelValue,
           }))
         }
+      } else if (this.channelList.length === 15) {
+        this.pageToast('Recording channels cannot choose more than 15.')
       }
     },
     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--) {
+        for (let i = 16; i >= 1; i--) {
           if (this.channelList.indexOf(i) >= 0) {
             channelSet += '1'
           } else {
@@ -204,37 +534,215 @@ export default {
       }
     },
     ampGainSelectChange () {
-      if (this.ampGainSelect != null && this.ampGainSelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN + 1) % 4)) {
+      if (this.ampGainSelect != null && this.ampGainSelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.AMP_GAIN) % 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),
+          content: ((this.ampGainSelect.id) % 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))) {
+    sampleRateSelectChange () {
+      if (this.sampleRateSelect != null && this.sampleRateSelect.value !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.ADC_CLOCK))) {
         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),
+          content: this.sampleRateSelect.value,
         }))
       }
     },
+    radioFrequencySelectChange () {
+      if (this.radioFrequencySelect != null && this.radioFrequencySelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.RADIO_FREQUENCY))) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'RADIO_FREQUENCY',
+          content: this.radioFrequencySelect.id,
+        }))
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_update_radio_frequency/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          content: this.radioFrequencySelect.value,
+        }))
+      }
+    },
+    memRadioFrequencySelectChange () {
+      if (this.memRadioFrequencySelect != null && this.memRadioFrequencySelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.MEM_RADIO_FREQUENCY))) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'MEM_RADIO_FREQUENCY',
+          content: this.memRadioFrequencySelect.id,
+        }))
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_set_central_rf/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          content: this.memRadioFrequencySelect.value,
+        }))
+      }
+    },
+    ledBrightnessSelectChange () {
+      if (this.ledBrightnessSelect != null && this.ledBrightnessSelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.LED_BRIGHTNESS))) {
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'LED_BRIGHTNESS',
+          content: this.ledBrightnessSelect.id,
+        }))
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_update_led_brightness/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          content: this.ledBrightnessSelect.value,
+        }))
+      }
+    },
+    acceleratorSensitivitySelectChange () {
+      if (this.acceleratorSensitivitySelect != null && this.acceleratorSensitivitySelect.id !== ((taskInfo.getDeviceInfo(this.deviceID).parameterSet.ACCELERATOR_S))) {
+        let scaleRange
+        switch (this.acceleratorSensitivitySelect.id) {
+          case 0:
+            scaleRange = 200
+            break
+          case 1:
+            scaleRange = 400
+            break
+          case 2:
+            scaleRange = 800
+            break
+          case 3:
+            scaleRange = 1600
+            break
+          default:
+            scaleRange = 0
+            break
+        }
+
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_parameter/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          parameter: 'ACCELERATOR_S',
+          content: this.acceleratorSensitivitySelect.id,
+        }))
+        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
+          header: 'device_update_accelerator_sensitivity/0',
+          device: taskInfo.getRawDeviceID(this.deviceID),
+          content: this.acceleratorSensitivitySelect.value,
+        }))
+        const charts = chartData.getAllChartsData()
+        for (const chartID in charts) {
+          for (const seriesIndex in charts[chartID].series) {
+            if (charts[chartID].series[seriesIndex].yAxisSource[1] >= 256 && charts[chartID].series[seriesIndex].yAxisSource[1] <= 260) {
+              charts[chartID].yAxis[seriesIndex].min = -scaleRange
+              charts[chartID].yAxis[seriesIndex].max = scaleRange
+            }
+          }
+        }
+      }
+    },
+    // 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,
+          }))
+        }
+      }
+    },
+    pageToast: function (mes) {
+      this.showToast(
+        mes,
+        {
+          icon: 'fa-bell',
+          position: 'bottom-right',
+          duration: 4000,
+        },
+      )
+    },
   },
   mounted () {
     this.refresh()

src/components/task/content/parameter/NeuliveParameterStimulation.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex">
     <div>
-      <div>
+      <!-- <div>
         <div class="row sm12 xl12 md12 xs12">
           <va-button
             class="mx-1 px-2"
@@ -23,7 +23,7 @@
             Stop
           </va-button>
         </div>
-      </div>
+      </div> -->
 
       <div class="mt-4">
         <div class="row sm12 xl12 md12 xs12">
@@ -32,7 +32,7 @@
         <div class="row">
           <div class="flex sm12 xl12 md12 xs12">
             <va-button-toggle
-              :on-change="stimulateElectrodeSelectChange()"
+              @click.native="stimulateElectrodeSelectChange()"
               small
               outline
               v-model="stimulateElectrodeSelect"
@@ -91,7 +91,7 @@
         <div class="row">
           <div class="flex sm12 xl12 md12 xs12">
             <va-button-toggle
-              :on-change="cycleNumberSelectChange()"
+              @click.native="cycleNumberSelectChange()"
               small
               outline
               v-model="cycleNumberSelect"
@@ -115,8 +115,8 @@
                   Rounds
                 </p>
               </va-input>
-              <va-button slot="append" class="ml-2 pa-1 shrink" small @click="cycleNumberChange(256)">
-                256
+              <va-button slot="append" class="ml-2 pa-1 shrink" small @click="cycleNumberChange(255)">
+                255
               </va-button>
             </div>
             <va-slider
@@ -127,7 +127,7 @@
               value-visible
               v-model="cycleNumber"
               :min="1"
-              :max="256"
+              :max="255"
             />
           </div>
         </div>
@@ -178,7 +178,7 @@
         <div class="row">
           <div class="flex sm12 xl12 md12 xs12">
             <va-button-toggle
-              :on-change="patternModeSelectChange()"
+              @click.native="patternModeSelectChange()"
               small
               outline
               v-model="patternModeSelect"
@@ -236,7 +236,7 @@
         <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="patternModeSelect?timeRangeChange(1, 0):timeRangeChange(1, 0)">
+              <va-button slot="append" class="mr-2 pa-1 shrink" small @click="timeRangeChange(1, 0)">
                 0
               </va-button>
               <va-input
@@ -431,7 +431,7 @@ export default {
       // posChannel and negChannel at least one && t1 ~ t4 > 0
       const totalStiTime = (this.t1Range + this.t2Range + this.t3Range + this.t4Range) * 10
       if (this.t1Range >= 0 && this.t2Range >= 0 && this.t3Range >= 0 && this.t4Range >= 0 && this.periodNumber === totalStiTime) {
-        return !(this.posChannelList.length > 0 && this.negChannelList.length > 0)
+        return this.stimulateElectrodeSelect ? !(this.posChannelList.length > 0 && this.negChannelList.length > 0) : !(this.posChannelList.length > 0 || this.negChannelList.length > 0)
       } else {
         return true
       }
@@ -478,12 +478,16 @@ export default {
       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.t1RangeArray.fill(this.t1Range, 0)
       this.t2Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T2[0]
       this.t2RangeInput = String((this.t2Range * 10) / this.unitMultiply)
+      this.t2RangeArray.fill(this.t2Range, 0)
       this.t3Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T3[0]
       this.t3RangeInput = String((this.t3Range * 10) / this.unitMultiply)
+      this.t3RangeArray.fill(this.t3Range, 0)
       this.t4Range = taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_T4[0]
       this.t4RangeInput = String((this.t4Range * 10) / this.unitMultiply)
+      this.t4RangeArray.fill(this.t4Range, 0)
 
       if (this.pattternModeSelect === 0) {
         this.periodNumber = (this.t1Range + this.t4Range) * 10
@@ -578,7 +582,7 @@ export default {
       }
     },
     cycleNumberChange (val) {
-      if (isNaN(val) || parseInt(val) > 256 || parseInt(val) < 1) {
+      if (isNaN(val) || parseInt(val) > 255 || parseInt(val) < 1) {
         this.cycleNumberInput = '1'
         this.cycleNumber = 1
       }
@@ -618,11 +622,12 @@ export default {
         }
       }
       if (parseInt(this.amplitudeNumber / 5) !== parseInt(taskInfo.getDeviceInfo(this.deviceID).parameterSet.STI_AMPLITUDE)) {
+        const content = parseInt(this.amplitudeNumber / 5)
         this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
           header: 'device_parameter/0',
           device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_AMPLITUDE',
-          content: parseInt(this.amplitudeNumber / 5),
+          parameter: 'STI_AMPLITUDE|STI_AMPLITUDE_H|STI_AMPLITUDE_L',
+          content: `${content}|${content}|${content}`,
         }))
       }
     },
@@ -651,6 +656,7 @@ export default {
           content: this.patternModeSelect,
         }))
       }
+      this.updateTimeRange()
     },
     frequencyNumberChange (val) {
       if (this.frequencyNumberInput == null) {
@@ -718,8 +724,10 @@ export default {
         case 1:
           this.t1Range = parseInt((val * this.unitMultiply) / 10)
           this.t1RangeInput = val
-          this.t3Range = parseInt((val * this.unitMultiply) / 10)
-          this.t3RangeInput = val
+          if (this.patternModeSelect === 1) {
+            this.t3Range = parseInt((val * this.unitMultiply) / 10)
+            this.t3RangeInput = val
+          }
           break
         case 2:
           this.t2Range = parseInt((val * this.unitMultiply) / 10)
@@ -768,58 +776,46 @@ export default {
       const stiChannelValue = parseInt(stiChannelSet, 2)
       const stiPolarityValue = parseInt(stiPolaritySet, 2)
 
-      if (stiChannelValue !== taskInfo.getDeviceInfo(this.deviceID).STI_CHANNEL) {
+      if (stiChannelValue !== taskInfo.getDeviceInfo(this.deviceID).STI_CHANNEL || stiPolarityValue !== taskInfo.getDeviceInfo(this.deviceID).STI_POLARITY) {
         this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
           header: 'device_parameter/0',
           device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_CHANNEL',
-          content: stiChannelValue,
-        }))
-      }
-      if (stiPolarityValue !== taskInfo.getDeviceInfo(this.deviceID).STI_POLARITY) {
-        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_POLARITY',
-          content: stiPolarityValue,
+          parameter: 'STI_CHANNEL|STI_POLARITY',
+          content: `${stiChannelValue}|${stiPolarityValue}`,
         }))
       }
     },
     updateTimeRange () {
+      let parameter = ''
+      let content = ''
       if (this.t1RangeArray[0] !== this.t1Range) {
         this.t1RangeArray.fill(this.t1Range, 0)
-        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_T1',
-          content: '0:9=' + String(this.t1RangeArray),
-        }))
+        parameter += 'STI_T1|'
+        content += '0:9=' + String(this.t1RangeArray) + '|'
       }
       if (this.t2RangeArray[0] !== this.t2Range) {
         this.t2RangeArray.fill(this.t2Range, 0)
-        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_T2',
-          content: '0:9=' + String(this.t2RangeArray),
-        }))
+        parameter += 'STI_T2|'
+        content += '0:9=' + String(this.t2RangeArray) + '|'
       }
       if (this.t3RangeArray[0] !== this.t3Range) {
         this.t3RangeArray.fill(this.t3Range, 0)
-        this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
-          header: 'device_parameter/0',
-          device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_T3',
-          content: '0:9=' + String(this.t3RangeArray),
-        }))
+        parameter += 'STI_T3|'
+        content += '0:9=' + String(this.t3RangeArray) + '|'
       }
       if (this.t4RangeArray[0] !== this.t4Range) {
         this.t4RangeArray.fill(this.t4Range, 0)
+        parameter += 'STI_T4|'
+        content += '0:9=' + String(this.t4RangeArray) + '|'
+      }
+      if (parameter.length > 0) {
+        parameter = parameter.slice(0, -1)
+        content = content.slice(0, -1)
         this.mqttPub(taskInfo.getTaskInfo().controllerID + '_user', JSON.stringify({
           header: 'device_parameter/0',
           device: taskInfo.getRawDeviceID(this.deviceID),
-          parameter: 'STI_T4',
-          content: '0:9=' + String(this.t4RangeArray),
+          parameter: parameter,
+          content: content,
         }))
       }
     },

src/components/task/content/parameter/NeuliveParameterWindow.vue

@@ -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
@@ -72,6 +72,12 @@ export default {
         }
       })
     },
+    start: function () {
+      this.$emit('record')
+    },
+    stop: function () {
+      this.$emit('record_stop')
+    },
   },
   mounted () {
     this.pageInit()

src/components/task/content/parameter/item/CycleRange.vue

@@ -23,7 +23,6 @@
         @touchend.native="cycleNumberChange(cycleNoNumber)"
         @click.native="cycleNumberChange(cycleNoNumber)"
         class="flex sm12 xl12 md12 xs12"
-        value-visible
         v-model="cycleNoNumber"
         :min="minValue"
         :max="maxValue"
@@ -76,11 +75,11 @@ export default {
         return false
       }
       if (isNaN(val) || parseInt(val) > this.maxValue || parseInt(val) < this.minValue) {
-        this.cycleNoNumber = String(this.minValue)
-        this.cycleNoNumberInput = this.minValue
+        this.cycleNoNumber = this.minValue
+        this.cycleNoNumberInput = String(this.minValue)
         return false
       }
-      if (parseInt(this.cycleNoNumberInput) !== this.cycleNoNumber || this.cycleNoNumber !== parseInt(val)) {
+      if (this.cycleNoNumberInput !== this.cycleNoNumber || this.cycleNoNumber !== val) {
         this.cycleNoNumberInput = String(val)
         this.cycleNoNumber = parseInt(val)
       }

src/components/task/content/parameter/item/MicroAmpereRange.vue

@@ -81,14 +81,17 @@ export default {
         if (isNaN(val) || parseFloat(val) > this.maxValue * 100 || parseFloat(val) < this.minValue * 100) {
           this.currentNumberInput = '0.00'
           this.currentNumber = 0
+          return false
         }
         if (parseFloat(this.currentNumberInput) !== parseFloat(this.currentNumber / 100)) {
           this.currentNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+          this.currentNumberInput = String(parseFloat(this.currentNumber / 100).toFixed(2))
         }
       } else {
         if (isNaN(val) || parseFloat(val) > this.maxValue * 100 || parseFloat(val) < this.minValue * 100) {
           this.currentNumberInput = '0.00'
           this.currentNumber = 0
+          return false
         }
         if (parseFloat(this.currentNumberInput) !== parseFloat(this.currentNumber / 100) || this.currentNumber !== val) {
           this.currentNumberInput = String(parseFloat(val / 100).toFixed(2))

src/components/task/content/parameter/item/MilliVoltRange.vue

@@ -65,8 +65,8 @@ export default {
   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)),
+      voltNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+      voltNumberInput: String(parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] / 10).toFixed(1)),
     }
   },
   mqtt: {
@@ -81,22 +81,34 @@ export default {
         if (isNaN(val) || parseFloat(val) > 100 || parseFloat(val) < 0.2) {
           this.voltNumberInput = '0.2'
           this.voltNumber = 2
+          return false
         }
+        // console.log('conpare',parseFloat(this.voltNumberInput),parseFloat(this.voltNumber / 10))
         if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 10)) {
-          this.voltNumber = parseInt(parseFloat(val).toFixed(1) * 10)
+          if (Math.floor(parseFloat(val) * 10) % 2 !== 0) { // odd number
+            this.voltNumber = Math.floor(parseFloat(val) * 10) + 1
+            this.voltNumberInput = String(parseFloat(this.voltNumber / 10).toFixed(1))
+          } else {
+            this.voltNumber = Math.floor(parseFloat(val) * 10)
+            this.voltNumberInput = String(parseFloat(this.voltNumber / 10).toFixed(1))
+          }
         }
       } else {
         if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 2) {
           this.voltNumberInput = '0.2'
           this.voltNumber = 2
+          return false
         }
         if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 10) || this.voltNumber !== val) {
+          if (this.voltNumber % 2 !== 0) { // odd number
+            val = val + 1
+          }
           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])
+      if (this.voltNumber !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, this.voltNumber])
       }
     },
     updateStepVoltNumber (val) {

src/components/task/content/parameter/item/ResolutionRange.vue

@@ -65,8 +65,8 @@ export default {
   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)),
+      resolutionNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+      resolutionNumberInput: String(((taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) / 10).toFixed(1)),
     }
   },
   mqtt: {
@@ -81,22 +81,25 @@ export default {
         if (isNaN(val) || parseFloat(val) > 100 || parseFloat(val) < 0.1) {
           this.resolutionNumberInput = '0.1'
           this.resolutionNumber = 1
+          return false
         }
-        if (parseFloat(this.resolutionNumberInput) !== parseFloat(this.resolutionNumber / 100)) {
-          this.resolutionNumber = parseInt(parseFloat(val).toFixed(2) * 10)
+        if (parseFloat(this.resolutionNumberInput) !== parseFloat(this.resolutionNumber / 10)) {
+          this.resolutionNumber = parseInt(parseFloat(val) * 10)
+          this.resolutionNumberInput = String(parseFloat(this.resolutionNumber / 10).toFixed(1))
         }
       } else {
         if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 1) {
           this.resolutionNumberInput = '0.1'
           this.resolutionNumber = 1
+          return false
         }
         if (parseFloat(this.resolutionNumberInput) !== parseFloat(this.resolutionNumber / 10) || this.resolutionNumber !== val) {
-          this.resolutionNumberInput = String(parseFloat(val / 10))
+          this.resolutionNumberInput = String(parseFloat(val / 10).toFixed(1))
           this.resolutionNumber = val
         }
       }
-      if ((this.resolutionNumber) !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] + 1) {
-        this.$emit('parameterChange', [this.parameterName, this.resolutionNumber - 1])
+      if ((this.resolutionNumber) !== taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) {
+        this.$emit('parameterChange', [this.parameterName, this.resolutionNumber])
       }
     },
     updateResolutionNumber (val) {

src/components/task/content/parameter/item/ScanRateRange.vue

@@ -65,8 +65,8 @@ export default {
   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)),
+      voltScanRateNumber: taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName],
+      voltScanRateNumberInput: String(((taskInfo.getDeviceInfo(this.deviceID).parameterSet.Scan_Rate) / 100).toFixed(2)),
     }
   },
   mqtt: {
@@ -81,22 +81,25 @@ export default {
         if (isNaN(val) || parseFloat(val) > 1000 || parseFloat(val) < 0.01) {
           this.voltScanRateNumberInput = '0.01'
           this.voltScanRateNumber = 1
+          return false
         }
         if (parseFloat(this.voltScanRateNumberInput) !== parseFloat(this.voltScanRateNumber / 100)) {
-          this.voltScanRateNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+          this.voltScanRateNumber = parseInt((parseFloat(val) * 100).toFixed(0))
+          this.voltScanRateNumberInput = String(parseFloat(this.voltScanRateNumber / 100).toFixed(2))
         }
       } else {
         if (isNaN(val) || parseFloat(val) > 100000 || parseFloat(val) < 1) {
           this.voltScanRateNumberInput = '0.01'
           this.voltScanRateNumber = 1
+          return false
         }
         if (parseFloat(this.voltScanRateNumberInput) !== parseFloat(this.voltScanRateNumber / 100) || this.voltScanRateNumber !== val) {
-          this.voltScanRateNumberInput = String(parseFloat(val / 100))
+          this.voltScanRateNumberInput = String(parseFloat(val / 100).toFixed(2))
           this.voltScanRateNumber = val
         }
       }
-      if (this.voltScanRateNumber !== parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName]) + 1) {
-        this.$emit('parameterChange', [this.parameterName, this.voltScanRateNumber - 1])
+      if (this.voltScanRateNumber !== parseFloat(taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName])) {
+        this.$emit('parameterChange', [this.parameterName, this.voltScanRateNumber])
       }
     },
     updateVoltScanRateNumber (val) {

src/components/task/content/parameter/item/VoltRange.vue

@@ -2,7 +2,7 @@
   <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)">
+        <va-button slot="append" class="mr-2 pa-1 shrink" small @click="voltNumberChange(minValue*1000)">
           {{ minValue }}
         </va-button>
         <va-input
@@ -16,7 +16,7 @@
             V
           </p>
         </va-input>
-        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="voltNumberChange(maxValue*100)">
+        <va-button slot="append" class="ml-2 pa-1 shrink" small @click="voltNumberChange(maxValue*1000)">
           {{ maxValue }}
         </va-button>
       </div>
@@ -27,8 +27,8 @@
         @click.native="voltNumberChange(voltNumber)"
         class="flex sm12 xl12 md12 xs12"
         v-model="voltNumber"
-        :min="minValue*100"
-        :max="maxValue*100"
+        :min="minValue*1000"
+        :max="maxValue*1000"
       />
     </div>
   </div>
@@ -65,8 +65,8 @@ export default {
   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)),
+      voltNumber: (taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] - 25000) / 5,
+      voltNumberInput: String(parseFloat((taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] - 25000) / 5000).toFixed(3)),
     }
   },
   mqtt: {
@@ -81,22 +81,25 @@ export default {
         if (isNaN(val) || parseFloat(val) > 5 || parseFloat(val) < -5) {
           this.voltNumberInput = '0.00'
           this.voltNumber = 0
+          return false
         }
-        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 100)) {
-          this.voltNumber = parseInt(parseFloat(val).toFixed(2) * 100)
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 1000)) {
+          this.voltNumber = parseInt(parseFloat(val).toFixed(3) * 1000)
+          this.voltNumberInput = String(parseFloat(this.voltNumber / 1000).toFixed(3))
         }
       } else {
-        if (isNaN(val) || parseFloat(val) > 500 || parseFloat(val) < -500) {
+        if (isNaN(val) || parseFloat(val) > 5000 || parseFloat(val) < -5000) {
           this.voltNumberInput = '0.00'
           this.voltNumber = 0
+          return false
         }
-        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 100) || this.voltNumber !== val) {
-          this.voltNumberInput = String(parseFloat(val / 100).toFixed(2))
+        if (parseFloat(this.voltNumberInput) !== parseFloat(this.voltNumber / 1000) || this.voltNumber !== val) {
+          this.voltNumberInput = String(parseFloat(val / 1000).toFixed(3))
           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)])
+      if (this.voltNumber !== (taskInfo.getDeviceInfo(this.deviceID).parameterSet[this.parameterName] - 25000) / 5) {
+        this.$emit('parameterChange', [this.parameterName, this.voltNumber * 5 + 25000])
       }
     },
     updateVoltNumber (val) {

src/data/api/index.js

@@ -1,6 +1,6 @@
 import axios from 'axios'
 
-// axios.defaults.baseURL = 'http://192.168.0.127:3000'
+// axios.defaults.baseURL = 'http://192.168.3.53:3000'
 axios.defaults.baseURL = 'http://' + location.href.split('/')[2].split(':')[0] + ':3000'
 
 const _header = {}
@@ -101,7 +101,61 @@ async function updateMetaFile (id, attrs) {
   console.log('updateMetaFile')
   const _header = getHeader()
   try {
-    return await axios.post('/api/file/meta/update/' + id, attrs, { headers: _header })
+    return await axios.post(`/api/file/meta/update/${id}`, attrs, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function updateRawFile (channel, id, attrs) {
+  console.log('updateRawFile')
+  const _header = getHeader()
+  try {
+    return await axios.post(`/api/file/raw/update/${channel}/${id}`, attrs, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function updateMiniFile (channel, id, attrs) {
+  console.log('updateMiniFile')
+  const _header = getHeader()
+  try {
+    return await axios.post(`/api/file/mini/update/${channel}/${id}`, attrs, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+async function clearDeleteMetaFile (id) {
+  console.log('clearDeleteMetaFile')
+  const _header = getHeader()
+  try {
+    return await axios.get(`/api/file/meta/clear_deleted/${id}`, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function clearDeleteRawFile (channel, id) {
+  console.log('clearDeleteRawFile')
+  const _header = getHeader()
+  try {
+    return await axios.get(`/api/file/raw/clear_deleted/${channel}/${id}`, { headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function clearDeleteMiniFile (channel, id) {
+  console.log('clearDeleteMiniFile')
+  const _header = getHeader()
+  try {
+    return await axios.get(`/api/file/mini/clear_deleted/${channel}/${id}`, { headers: _header })
   } catch (e) {
     console.error(e)
     return false
@@ -128,6 +182,26 @@ async function getRawFilesByID (channel, id) {
   }
 }
 
+async function getRawFilesByIDs (channel, id) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/raw/get_by_ids/' + channel + '/' + id, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
+async function getRawFilesAttrByIDs (channel, id, attr) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/raw/get_attr_by_ids/' + channel + '/' + id + '/' + attr, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
 async function getMetaFilesByID (id) {
   const _header = getHeader()
   try {
@@ -138,6 +212,16 @@ async function getMetaFilesByID (id) {
   }
 }
 
+async function getMetaFilesByName (name) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/meta/get_by_name/' + name, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
 async function getRawFilesByParent (channel, parent) {
   const _header = getHeader()
   try {
@@ -188,6 +272,16 @@ async function getMiniFilesAttrByParent (channel, parent, attr) {
   }
 }
 
+async function getMiniFilesAttrByID (channel, id, attr) {
+  const _header = getHeader()
+  try {
+    return await axios.get('/api/file/mini/get_attr_by_id/' + channel + '/' + id + '/' + attr, { responseType: 'json', headers: _header })
+  } catch (e) {
+    console.error(e)
+    return false
+  }
+}
+
 async function getMiniFilesMeanDataByID (channel, id) {
   const _header = getHeader()
   try {
@@ -218,15 +312,24 @@ const api = {
   getCollectionsAll,
   createMetaFile,
   updateMetaFile,
+  updateRawFile,
+  updateMiniFile,
+  clearDeleteMetaFile,
+  clearDeleteRawFile,
+  clearDeleteMiniFile,
   getFolderMetaFileByParent,
   getRawFilesByParent,
   getRawFilesByID,
+  getRawFilesByIDs,
+  getRawFilesAttrByIDs,
   getMiniFilesByID,
   getMiniFilesByParent,
   getMiniFilesMeanDataByID,
   getMiniFilesRandomDataByID,
   getMetaFilesByID,
+  getMetaFilesByName,
   getRawFilesAttrByParent,
+  getMiniFilesAttrByID,
   getMiniFilesAttrByParent,
 }
 

src/data/download/Download.js

@@ -1,332 +1,149 @@
-// 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 download = {
-  rawByParentChannels: async function (parent, channels) {
+  getAllRawDatas: async function (meta) {
     const result = {}
-    const promises = JSON.parse(channels).map(async ch => {
-      return await api.getRawFilesByParent(ch, parent)
-    })
-    const rawDatas = await Promise.all(promises)
-    if (rawDatas.length >= 0) {
-      rawDatas.forEach(rawData => {
-        const [channel, data] = this.parseRawData(rawData)
-        result[channel] = data
-      })
+    for (const channelID in meta.raw_data) {
+      let prevLastTime = 0
+      result[channelID] = []
+      const rawDataIDList = JSON.parse(JSON.stringify(meta.raw_data[channelID]))
+
+      while (rawDataIDList.length >= 1000) {
+        const _rawDataIDList = rawDataIDList.splice(0, 1000)
+        const _data = await api.getRawFilesAttrByIDs(channelID, _rawDataIDList, 'id-channel-size-serial_number-start_time-end_time-data')
+        prevLastTime = await this.parseRawData(_data.data, prevLastTime, meta, result[channelID])
+      }
+      const _data = await api.getRawFilesAttrByIDs(channelID, rawDataIDList, 'id-channel-size-serial_number-start_time-end_time-data')
+      prevLastTime = await this.parseRawData(_data.data, prevLastTime, meta, result[channelID])
     }
     return result
   },
-  rawByIDChannels: async function (id, channel) {
+  getIndexRawDatas: async function (meta, channelID, list) {
+    const result = {}
+
+    result[channelID] = []
+
+    const prevLastTime = 0
+    const _data = await api.getRawFilesAttrByIDs(channelID, list, 'id-channel-size-serial_number-start_time-end_time-data')
+    await this.parseRawData(_data.data, prevLastTime, meta, result[channelID])
+    return result
+  },
+  rawByIDChannels: async function (id, channel, meta) {
+    const data = []
     const rawData = await api.getRawFilesByID(channel, id)
-    return this.parseRawData(rawData)[1]
+    await this.parseRawData(rawData.data, null, meta, data)
+    return data
   },
-  // rawByParentChannelsTimeValue: async function (parent, channels) {
-  //   const result = {}
-  //   const promises = JSON.parse(channels).map(async ch => {
-  //     return await api.getRawFilesByParent(ch, parent)
-  //   })
-  //   const rawDatas = await Promise.all(promises)
-  //   rawDatas.forEach(rawData => {
-  //     const [channel, time, value] = this.channelTimeValue(rawData)
-  //     if (result[channel] === undefined) {
-  //       result[channel] = {}
-  //     }
-  //     result[channel].time = time
-  //     result[channel].value = value
-  //   })
-  //   return result
-  // },
-  miniByParentChannels: async function (parent, channels) {
-    const result = {}
-    const promises = JSON.parse(channels).map(async ch => {
-      return await api.getMiniFilesByParent(ch, parent)
-    })
-    const miniDatas = await Promise.all(promises)
-    if (miniDatas.length >= 0) {
-      miniDatas.forEach(miniData => {
-        miniData.data.forEach(scaleData => {
-          const [channel, scale, miniType, data] = this.parseMiniData(scaleData, 'data_mean')
-          // console.log(channel, scale, miniType, data)
-          if (result[channel] === undefined) {
-            result[channel] = {}
-          }
-          if (result[channel][scale] === undefined) {
-            result[channel][scale] = {}
-          }
-          result[channel][scale][miniType] = data
-        })
-      })
-    }
-    return result
-  },
-  miniMeanByIDChannel: async function (id, channel) {
+  miniMeanByIDChannel: async function (id, channel, meta) {
     const miniData = await api.getMiniFilesByID(channel, id)
-    return this.parseMiniData(miniData, 'data_mean')[3]
+    return await this.parseMiniData(miniData, 'data_mean', meta)
   },
-  miniRandomByIDChannel: async function (id, channel) {
+  miniRandomByIDChannel: async function (id, channel, meta) {
     const rawData = await api.getMiniFilesByID(channel, id)
-    return this.parseMiniData(rawData, 'data_random')[3]
+    return await this.parseMiniData(rawData, 'data_random', meta)
   },
-  parseRawData: function (rawData) {
-    let channel = -1
-    const channelData = []
-
-    rawData.data.forEach(raw => {
-      channel = raw.channel
-      const encodedData = raw.data.split('"***"')
-
-      if (encodedData.length > 1) {
-        encodedData.splice(encodedData.length - 1, 1)
-      }
-
-      const unzipDatas = encodedData.map(ctx => {
-        const decodedData = atob(ctx)
-        const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
-        return inflateSync(decodedDataBuffer).toString().split(' ')
-      })
-
-      // Deal with last data entry with empty value
-      const lastDataEntry = unzipDatas[unzipDatas.length - 1]
-      if (lastDataEntry.length === 1) {
-        if (lastDataEntry[0].length === 0) {
-          unzipDatas.splice(unzipDatas.length - 1, 1)
+  parseRawData: async function (rawData, prevLastTime, meta, dataArray) {
+    for (const raw of rawData) {
+      if (raw.data !== null && raw.data.length > 0) {
+        const encodedData = raw.data.split('"***"')
+        const unzipDatas = []
+        for (const data of encodedData) {
+          if (data.length !== 0) {
+            const decodedData = atob(data)
+            const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
+            const inflateData = inflateSync(decodedDataBuffer)
+            const _inflateData = new TextDecoder('utf-8').decode(inflateData).split(' ')
+            unzipDatas.push(_inflateData)
+          }
         }
-      }
 
-      const dataLength = unzipDatas.length
-
-      if (raw.end_time > 0) {
-        if (dataLength === 1) {
-          channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[0], raw.start_time, raw.end_time, true))
-        } else if (dataLength > 1) {
-          while (unzipDatas.length) {
-            const currentData = unzipDatas.shift()
-            if (unzipDatas.length > 0) {
-              const endTime = unzipDatas[0][0]
-              if (unzipDatas.length === dataLength - 1) {
-                // first push use rawInfo.start_time
-                channelData.push(...this.parseDataIntoTimeValuePair(currentData, raw.start_time, endTime))
-              } else {
-                // middle push
-                channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], endTime))
-              }
-            } else {
-              // last push use rawInfo.end_time
-              channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], raw.end_time, true))
-            }
+        for (let i = 0; i <= unzipDatas.length - 1; i++) {
+          if (unzipDatas[i].length > 0) {
+            prevLastTime = this.parseDataWithTimeStamp(unzipDatas[i], prevLastTime, meta, dataArray)
           }
         }
       }
-
-      // for (let i = 0; i < unzipDatas.length - 1; i++) {
-      //   if (i === 0) {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], raw.start_time, unzipDatas[i + 1][0]))
-      //   } else {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], unzipDatas[i][0], unzipDatas[i + 1][0]))
-      //   }
-      // }
-      // channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[unzipDatas.length - 1], unzipDatas[unzipDatas.length - 1][0], raw.end_time, true))
-    })
-    return [channel, channelData]
+    }
+    return prevLastTime
   },
-  channelTimeValue: function (rawData) {
-    let channel = -1
-    const channelData = []
-    const valueArray = []
-    const timeArray = []
-
-    rawData.data.forEach(raw => {
-      channel = raw.channel
-      const encodedData = raw.data.split('"***"')
-
-      if (encodedData.length > 1) {
-        encodedData.splice(encodedData.length - 1, 1)
-      }
-
-      const unzipDatas = encodedData.map(ctx => {
-        const decodedData = atob(ctx)
-        const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
-        return inflateSync(decodedDataBuffer).toString().split(' ')
-      })
-
-      const dataLength = unzipDatas.length
-
-      if (dataLength === 1) {
-        channelData.push(...this.parseDataIntoTimeValue(unzipDatas[0], raw.start_time, raw.end_time, true))
-      } else if (dataLength > 1) {
-        while (unzipDatas.length) {
-          const currentData = unzipDatas.shift()
-          if (unzipDatas.length > 0) {
-            const endTime = unzipDatas[0][0]
-            if (unzipDatas.length === dataLength - 1) {
-              // first push use rawInfo.start_time
-              const [time, value] = this.parseDataIntoTimeValue(currentData, raw.start_time, endTime)
-              timeArray.push(...time)
-              valueArray.push(...value)
-            } else {
-              // middle push
-              const [time, value] = this.parseDataIntoTimeValue(currentData, currentData[0], endTime)
-              timeArray.push(...time)
-              valueArray.push(...value)
-            }
-          } else {
-            // last push use rawInfo.end_time
-            const [time, value] = this.parseDataIntoTimeValue(currentData, currentData[0], raw.end_time, true)
-            timeArray.push(...time)
-            valueArray.push(...value)
-          }
-        }
-      }
-
-      // for (let i = 0; i < unzipDatas.length - 1; i++) {
-      //   if (i === 0) {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], raw.start_time, unzipDatas[i + 1][0]))
-      //   } else {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], unzipDatas[i][0], unzipDatas[i + 1][0]))
-      //   }
-      // }
-      // channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[unzipDatas.length - 1], unzipDatas[unzipDatas.length - 1][0], raw.end_time, true))
-    })
-    return [channel, timeArray, valueArray]
-  },
-  parseMiniData: function (miniData, miniType) {
-    let channel = -1
-    let scale = -1
+  parseMiniData: async function (miniData, miniType, meta) {
     const channelData = []
 
-    // console.log('miniData', miniData)
-    if (Array.isArray(miniData.data)) {
-      miniData.data.forEach(mini => {
-        // console.log('mini', mini)
-        // console.log('size:', Buffer.byteLength(mini[miniType], 'utf8'))
-        channel = mini.channel
-        scale = mini.scale
+    for (const mini of miniData.data) {
+      if (mini[miniType] !== null && mini[miniType].length > 0) {
         const encodedData = mini[miniType].split('"***"')
-
-        if (encodedData.length > 1) {
-          encodedData.splice(encodedData.length - 1, 1)
-        }
         // 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)
 
-        // Deal with last data entry with empty value
-        const lastDataEntry = unzipDatas[unzipDatas.length - 1]
-        if (lastDataEntry.length === 1) {
-          if (lastDataEntry[0].length === 0) {
-            unzipDatas.splice(unzipDatas.length - 1, 1)
-          }
-        }
-
-        // unzipDatas.forEach(u => {
-        //   console.log(u)
-        // })
-        // console.log('unzipDatas', unzipDatas[0], unzipDatas[1], unzipDatas[2])
-        const dataLength = unzipDatas.length
-        if (mini.end_time > 0) {
-          if (dataLength === 1) {
-            channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[0], mini.start_time, mini.end_time, true))
-          } else if (dataLength > 1) {
-            while (unzipDatas.length) {
-              const currentData = unzipDatas.shift()
-              if (unzipDatas.length > 0) {
-                const endTime = unzipDatas[0][0]
-                if (unzipDatas.length === dataLength - 1) {
-                  // first push use rawInfo.start_time
-                  channelData.push(...this.parseDataIntoTimeValuePair(currentData, mini.start_time, endTime))
-                } else {
-                  // middle push
-                  channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], endTime))
-                }
-              } else {
-                // last push use rawInfo.end_time
-                channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], mini.end_time, true))
-              }
+        for (let i = 0; i <= unzipDatas.length - 1; i++) {
+          if (unzipDatas[i].length > 0) {
+            if (unzipDatas[i + 1].length === 0) {
+              const endTime = (meta && parseInt(mini.end_time) === -1) ? parseInt(meta.time_duration) : parseInt(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]))
             }
           }
         }
-
-        // for (let i = 0; i < unzipDatas.length - 1; i++) {
-        //   if (i === 0) {
-        //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], mini.start_time, unzipDatas[i + 1][0]))
-        //   } else {
-        //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], unzipDatas[i][0], unzipDatas[i + 1][0]))
+      }
+    }
+    return channelData
+  },
+  parseDataWithTimeStamp: function (currentData, prevLastTime, meta, dataArray) {
+    // 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)
+        //     }
         //   }
         // }
-        // channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[unzipDatas.length - 1], unzipDatas[unzipDatas.length - 1][0], mini.end_time, true))
-      })
-      return [channel, scale, miniType, channelData]
-    } else {
-      channel = miniData.channel
-      scale = miniData.scale
-      const encodedData = miniData[miniType].split('"***"')
 
-      if (encodedData.length > 1) {
-        encodedData.splice(encodedData.length - 1, 1)
-      }
-      // console.log('encodedData', encodedData)
-
-      const unzipDatas = encodedData.map(ctx => {
-        const decodedData = atob(ctx)
-        const decodedDataBuffer = Buffer.from(decodedData, 'ascii')
-        return inflateSync(decodedDataBuffer).toString().split(' ')
-      })
-
-      // Deal with last data entry with empty value
-      const lastDataEntry = unzipDatas[unzipDatas.length - 1]
-      if (lastDataEntry.length === 1) {
-        if (lastDataEntry[0].length === 0) {
-          unzipDatas.splice(unzipDatas.length - 1, 1)
-        }
-      }
-
-      const dataLength = unzipDatas.length
-
-      if (dataLength === 1) {
-        const currentData = unzipDatas.shift()
-        channelData.push(...this.parseDataIntoTimeValuePair(currentData, miniData.start_time, miniData.end_time, true))
-      } else if (dataLength > 1) {
-        while (unzipDatas.length) {
-          const currentData = unzipDatas.shift()
-          if (unzipDatas.length > 0) {
-            const endTime = unzipDatas[0][0]
-            if (unzipDatas.length === dataLength - 1) {
-              // first push use rawInfo.start_time
-              channelData.push(...this.parseDataIntoTimeValuePair(currentData, miniData.start_time, endTime))
-            } else {
-              // middle push
-              channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], endTime))
-            }
-          } else {
-            // last push use rawInfo.end_time
-            channelData.push(...this.parseDataIntoTimeValuePair(currentData, currentData[0], miniData.end_time, true))
+        if (meta !== undefined) {
+          if (time <= parseInt(meta.time_duration)) {
+            const data = currentData[i + 1]
+            const tmpData = [time, data]
+            dataArray.push(tmpData)
           }
         }
+        prevLastTime = time
       }
-
-      // for (let i = 0; i < unzipDatas.length - 1; i++) {
-      //   if (i === 0) {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], mini.start_time, unzipDatas[i + 1][0]))
-      //   } else {
-      //     channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[i], unzipDatas[i][0], unzipDatas[i + 1][0]))
-      //   }
-      // }
-      // channelData.push(...this.parseDataIntoTimeValuePair(unzipDatas[unzipDatas.length - 1], unzipDatas[unzipDatas.length - 1][0], mini.end_time, true))
-      return [channel, scale, miniType, channelData]
     }
+    return prevLastTime
   },
-  parseDataIntoTimeValuePair: function (currentData, startTime, endTime, last) {
+  parseDataWithHeadTimeStamp: function (currentData, startTime, endTime, last) {
     const transData = []
     const timeStart = parseInt(startTime)
     const timeEnd = endTime
@@ -345,202 +162,4 @@ export const download = {
     }
     return transData
   },
-  parseDataIntoTimeValue: function (currentData, startTime, endTime, last) {
-    const timeArray = []
-    const valueArray = []
-    const timeStart = parseInt(startTime)
-    const timeEnd = endTime
-    let timeSpare
-    if (last) {
-      timeSpare = (timeEnd - timeStart) / (currentData.length - 2)
-    } else {
-      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]
-      timeArray.push(time)
-      valueArray.push(data)
-    }
-    return [timeArray, valueArray]
-  },
-  // 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])
-  //       }
-  //     }
-
-  //     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)
-
-  //       if (availableChannel.includes(parseInt(subfileChannel))) {
-  //         if (timeRangeInMillisecond[0] <= subfileEndTime() && timeRangeInMillisecond[1] >= subfileStartTime) {
-  //           file.pushDownloadSubFileList(path, subFile)
-  //         }
-  //       }
-  //     } 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(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()
-  // },
-  // getFileSegmentMaxIndex: function () {
-  //   return _fileSegmentInfo.segment_total
-  // },
-  // /* ------- 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)))
-  //   } else {
-  //     for (var item in _downloadOptions) {
-  //       _downloadOptions[item] = _downloadOptionsList[downloadOptionsIndex][item]
-  //     }
-  //   }
-  //   return _downloadOptions
-  // },
-  // 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()
-  // },
 }

src/data/export/export.js

@@ -1,31 +1,35 @@
 import golbalMethods from '../global/global'
 
-// const NeuliveParameterOrder = ['RECORDING_CH', 'AMP_GAIN', 'ADC_CLOCK']
-// const NeuliveAmpGain = [100, 400, 800, 25]
+const NeuliveParameterOrder = ['RECORDING_CH', 'AMP_GAIN', 'ADC_CLOCK']
+const NeuliveAmpGain = [100, 400, 800, 25]
 
 export const exportData = {
-  createHeadersString: function (headers) {
+  createHeadersString: function (headers, channel) {
     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]
+      NeuliveParameterOrder.forEach(p => {
+        const value = headers.parameter_set[p]
+        if (p === 'RECORDING_CH') {
+          let result = ''
+          if (channel !== undefined) {
+            result = String(parseInt(channel) + 1)
+          } else {
+            const channelList = value.toString(2).split('').reverse()
+            channelList.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(8e5 / (value * JSON.parse(headers.channels).length))])
+        }
       })
-      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') {
-      //     parameter.push(['Record channels', '[' + value.toString(2).split('').reverse().join('.') + ']'])
-      //   } 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))])
-      //   }
-      // })
     } else if (headers.device.library_name.indexOf('Elite') >= 0) {
       const sortedParameterSet = {}
       Object.keys(headers.parameter_set).sort().forEach(key => {
@@ -42,16 +46,40 @@ export const exportData = {
     })
     return headersString
   },
-  createTitlesString: function (headers, cycle) {
+  createTitlesString: function (headers, cycle, channel) {
     let channelString = ''
     let titleString = ''
+    let channelList = []
+    if (channel !== undefined) {
+      channelList.push(channel)
+    } else {
+      channelList = JSON.parse(headers.channels)
+    }
+    console.log(channelList)
+
     while (cycle !== -1) {
-      for (const _ch of JSON.parse(headers.channels)) {
+      for (const _ch of channelList) {
         if (headers.device.library_name.indexOf('Neulive') >= 0) {
-          channelString += `channel ${_ch + 1},,`
-          titleString += 'Time[ms],value[uV],'
+          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,${parseInt(_ch) + 1},`
+              break
+          }
+          titleString += 'Time[us],value[uV],'
         } else if (headers.device.library_name.indexOf('Elite') >= 0) {
-          const _time = 'Time[ms]'
+          const _time = 'Time[us]'
           let _title = ''
           switch (_ch) {
             case 0:
@@ -61,7 +89,7 @@ export const exportData = {
               _title = 'Voltage[uV]'
               break
             case 2:
-              _title = 'Resister[kohm]'
+              _title = 'Resister[mohm]'
               break
             default:
               _title = ''
@@ -83,34 +111,54 @@ export const exportData = {
     }
     return ''
   },
-  createDatasString: function (headers, data) {
+  createDatasString: function (headers, data, channel) {
     let dataString = ''
     let cycle = 0
     let idx = 0
+    let maxLength = 0
 
-    if (headers.channels.length > 0) {
-      const firstChannel = JSON.parse(headers.channels)[0]
-      const stop = (data[firstChannel].length)
-      cycle = parseInt(stop / 1000000)
+    if (JSON.parse(headers.channels).length > 0) {
+      for (const channel of JSON.parse(headers.channels)) {
+        if (data[channel] && data[channel].length > maxLength) {
+          maxLength = data[channel].length
+        }
+      }
+      for (const channel of JSON.parse(headers.channels)) {
+        if (data[channel] && maxLength > data[channel].length) {
+          let lengthDiff = maxLength - data[channel].length
+          while (lengthDiff !== 0) {
+            data[channel].push(['', ''])
+            lengthDiff -= 1
+          }
+        }
+      }
+      const stopIndex = maxLength
+      cycle = parseInt(stopIndex / 1e6)
 
       if (cycle === 0) {
-        while (stop !== idx) {
+        while (stopIndex !== idx) {
           const indexData = []
           for (const _ch of JSON.parse(headers.channels)) {
-            indexData.push(...data[_ch][idx])
+            if (data[_ch] !== undefined) {
+              if (data[_ch][idx] !== undefined) {
+                indexData.push(...data[_ch][idx])
+              }
+            }
           }
           idx = idx + 1
           dataString = dataString + indexData.join(',') + '\r\n'
         }
       } else {
-        for (let i = 0; i < 1000000; i++) {
+        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)])
+              if (data[_ch] !== undefined) {
+                if (data[_ch][idx + (j * 1e6)] === undefined) {
+                  indexData.push(...[])
+                } else {
+                  indexData.push(...data[_ch][idx + (j * 1e6)])
+                }
               }
             }
           }
@@ -122,16 +170,26 @@ export const exportData = {
     }
     return ''
   },
-  exportCSV: async function (headers, data) {
-    const fileName = headers.name + '.csv'
-    // console.log('headers', headers)
-    // console.log('data', data)
-    console.log('build string')
-    console.time()
-    const headersString = this.createHeadersString(headers)
-    const [datasString, cycle] = this.createDatasString(headers, data)
-    const titlesString = this.createTitlesString(headers, cycle)
-    console.timeEnd()
+  exportCSV: async function (headers, data, channel) {
+    console.log('channel', channel)
+    let fileName, headersString, datasString, cycle, titlesString
+
+    if (channel !== undefined) {
+      fileName = headers.name + '-' + String(channel) + '.csv'
+      headersString = this.createHeadersString(headers, channel)
+      const [_datasString, _cycle] = this.createDatasString(headers, data, channel)
+      datasString = _datasString
+      cycle = _cycle
+      titlesString = this.createTitlesString(headers, cycle, channel)
+    } else {
+      fileName = headers.name + '.csv'
+      headersString = this.createHeadersString(headers)
+      const [_datasString, _cycle] = this.createDatasString(headers, data)
+      datasString = _datasString
+      cycle = _cycle
+      titlesString = this.createTitlesString(headers, cycle)
+    }
+
     // console.log('data', datasString)
     // console.log('header', headersString)
     // console.log('title', titlesString)
@@ -156,5 +214,9 @@ export const exportData = {
       link = null
     }
     getCSVFile()
+
+    headersString = ''
+    titlesString = ''
+    datasString = ''
   },
 }

src/data/file/FileFormat.js

@@ -165,6 +165,11 @@ export const getFileInfoFormat = () => {
           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,
           _DEVICE_ADDR_: '',
           _DEVICE_NAME_: '',
           _LIBRARY_: '',

src/data/global/global.js

@@ -44,27 +44,27 @@ const transFileSize = (fileSize) => {
   return `${(Math.round(fs * 10) / 10).toString()} ${unit}`
 }
 
-const transTime = (millisecond) => {
-  if (millisecond === undefined) {
-    return ''
+const transTime = (microsecond) => {
+  if (microsecond === undefined || microsecond === 'None') {
+    return '0 s'
   }
 
   let result = ''
 
-  if (millisecond < 1000) {
-    result = '~ 1 sec'
+  if (microsecond < 1000000) {
+    result = '~ 1 s'
   } else {
-    let seconds = Math.round(millisecond / 1000)
+    let seconds = parseInt(microsecond / 1000000)
 
     if (seconds < 60) {
       result = `${seconds} s`
     } else {
-      let minutes = Math.round(seconds / 60)
+      let minutes = parseInt(seconds / 60)
       seconds %= 60
       if (minutes < 60) {
         result = `${minutes} m ${seconds} s`
       } else {
-        const hours = Math.round(minutes / 60)
+        const hours = parseInt(minutes / 60)
         minutes %= 60
         result = `${hours} h ${minutes} m ${seconds} s`
       }

src/data/task/ChartsManagement.js

@@ -1,5 +1,5 @@
 import newDataZoom from '@/factories/chart/dataZoomFactory'
-import newChart from '@/factories/chart/chartFactory'
+import newChart, { newChartMode } from '@/factories/chart/chartFactory'
 import newTooltip from '@/factories/chart/tooltipFactory'
 import newSeries from '@/factories/chart/seriesFactory'
 import { dataStreamBuffer } from './DataStreamBuffer'
@@ -77,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) {
@@ -123,6 +140,7 @@ export const chartData = {
   init: (chartID, maxDots, samplingRate, gridLength) => {
     if (_chartData[parseInt(chartID)] == null) {
       _chartData[parseInt(chartID)] = newChart(chartID)
+      _chartData[chartID].maxDots = maxDots
       _chartData[chartID].tooltip = newTooltip()
       updateGridList(chartID, gridLength)
       return _chartData[chartID]
@@ -285,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) {
@@ -307,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) {
@@ -354,7 +372,7 @@ 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 = taskInfo.getRawDeviceID(series.xAxisSource[0])
@@ -367,12 +385,15 @@ 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]) {
+              // if (series.data.length === 0 || _popTime > series.data[series.data.length - 1][0]) {
+              if (_popTime < 0) {
+                series.data.push([])
+              } else {
                 series.data.push([_popTime, _popData])
                 // get max/min value
                 if (series.dataYMax < _popData || series.dataYMax == null) {
@@ -382,8 +403,12 @@ export const chartData = {
                   series.dataYMin = _popData
                 }
               }
+              // }
             } else {
-              if (series.data.length === 0 || _popTime > series.data[series.data.length - 1][1]) {
+              // if (series.data.length === 0 || _popTime > series.data[series.data.length - 1][1]) {
+              if (_popTime < 0) {
+                series.data.push([])
+              } else {
                 series.data.push([_popData, _popTime])
                 // get max/min value
                 if (series.dataXMax < _popData || series.dataXMax == null) {
@@ -393,38 +418,71 @@ export const chartData = {
                   series.dataXMin = _popData
                 }
               }
+              // }
+            }
+          })
+
+          // console.log(series.data)
+          // series data list shift by points
+          // if (series.data.length > _chartData[chartID].maxDots) {
+          //   series.data.splice(0, series.data.length - _chartData[chartID].maxDots)
+          // }
+
+          if (series.data.length > 0) {
+            if (series.data[series.data.length - 1][0] - series.data[0][0] > 3000000) {
+              series.data.splice(0, popData.length)
             }
           }
 
-          // 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 time
+          // if (series.data.length > 0) {
+          //   if (series.xAxisSource[0] === -1) {
+          //     if (taskInfo.getDeviceInfo(series.yAxisSource[0]).info.library_name.indexOf('Elite') >= 0) {
+          //       if (series.data.length > _chartData[chartID].maxDots) {
+          //         series.data.splice(0, series.data.length - _chartData[chartID].maxDots)
+          //       }
+          //     } else {
+          //       if (series.data[series.data.length - 1][0] - series.data[0][0] > 3000000) {
+          //         series.data.splice(0, popData.length)
+          //       }
+          //     }
+          //   } else if (series.yAxisSource[0] === -1) {
+          //     if (taskInfo.getDeviceInfo(series.xAxisSource[0]).info.library_name.indexOf('Elite') >= 0) {
+          //       if (series.data.length > _chartData[chartID].maxDots) {
+          //         series.data.splice(0, series.data.length - _chartData[chartID].maxDots)
+          //       }
+          //     } else {
+          //       if (series.data[series.data.length - 1][1] - series.data[0][1] > 3000000) {
+          //         series.data.splice(0, popData.length)
+          //       }
+          //     }
+          //   }
+          // }
 
           // axis shift
           if (series.data.length > 0) {
             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 {
@@ -460,13 +518,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
                 }
@@ -485,17 +543,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) {
@@ -514,11 +572,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
@@ -545,24 +603,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))
+          //   }
+          // }
         }
       }
     })
@@ -588,43 +646,27 @@ export const chartData = {
 
     const _chartRegisterDevice = (chartID, device) => {
       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
-          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
-        }
+        const setting = newChartMode(taskInfo.getDeviceInfo(device.id).parameterSet.MODE)
+        console.log(setting)
+        const xType = setting[0]
+        const xValue = setting[1]
+        const yType = setting[2]
+        const yValue = setting[3]
+        chartRegister(chartID, 0, xType, device.id, xValue, yType, device.id, yValue, null)
       } 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) => {
@@ -633,6 +675,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++
+            }
+          }
+        })
       }
     }
 
@@ -802,11 +861,56 @@ const chartRegister = (chartID, gridIndex, deviceNameX, deviceIDX, channelX, dev
   // set xAxis format
   if (sourceList[0].name === 'Time') {
     _chartData[chartID].xAxis[_xAxisIndex].axisLabel.formatter = function (val) {
-      const label = parseInt(parseInt(val / 1000) / 60) + ' m ' + parseInt((val % 60000) / 1000) + ' s'
+      const hour = parseInt(val / 3.6e9)
+      const minute = parseInt((val % 3.6e9) / 1000000 / 60)
+      const second = parseInt((val % 6e7) / 1000000)
+      const millisecond = parseInt((val % 1e6) / 1000)
+      let label = ''
+      if (hour > 0) {
+        label += hour + ' h '
+      }
+      if (minute > 0) {
+        label += minute + ' m '
+      }
+      if (second > 0) {
+        label += second + ' s '
+      }
+      if (millisecond > 0) {
+        label += millisecond + ' ms '
+      }
+
+      // const label = parseInt(parseInt(val / 1000000) / 60) + ' m ' + parseInt((val % 60000000) / 1000000) + ' s'
       return label
     }
   }
 
+  // set yAxis format
+  if (sourceList[1].name === 'Neulive') {
+    const AcceleratorS = taskInfo.getDeviceInfo(sourceList[1].id).parameterSet.ACCELERATOR_S
+    let scaleRange
+    switch (AcceleratorS) {
+      case 0:
+        scaleRange = 200
+        break
+      case 1:
+        scaleRange = 400
+        break
+      case 2:
+        scaleRange = 800
+        break
+      case 3:
+        scaleRange = 1600
+        break
+      default:
+        break
+    }
+
+    if (parseInt(sourceList[1].channel) >= 257 && parseInt(sourceList[1].channel) <= 260) {
+      _chartData[chartID].yAxis[_yAxisIndex].min = -scaleRange
+      _chartData[chartID].yAxis[_yAxisIndex].max = scaleRange
+    }
+  }
+
   // register series into grid
   const _axisList = []
 

src/data/task/DataStreamBuffer.js

@@ -3,7 +3,7 @@
 // import { taskInfo } from './TaskInfo'
 
 const _dataStreamBuffer = {}
-const _dataStreamBufferSize = 10
+const _dataStreamBufferSize = 1000
 
 export const dataStreamBuffer = {
 
@@ -62,37 +62,47 @@ export const dataStreamBuffer = {
 
   into: (currentDataByChannel, currentDeviceID, currentChannel) => {
     // currentData = [ timeStart, d1, d2..... , timeEnd ]
-    const currentData = JSON.parse(currentDataByChannel).binary.split(' ')
+    // const currentData = JSON.parse(currentDataByChannel).binary.split(' ')
+    const currentData = currentDataByChannel.split(' ')
+    // console.log(currentData)
     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)
+    // // 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
+    // // add time to each data in a data batch
     const dataBatch = []
     for (let i = 1; i < currentData.length - 1; i++) {
       const tmpData = {
+        // time: parseInt(currentData[i]),
         time: timeStart + ((i - 1) * timeSpare),
         data: currentData[i],
       }
+      // const tmpData = [parseInt(dataSplit[0]), dataSplit[1]]
       dataBatch.push(tmpData)
+      // const dataSplit = currentData[i].split(' ')
     }
+    // console.log(dataBatch)
     // add the datastream to buffer if chart listen the device and channel
+    // if (currentChannel === 8) {
+    //   console.log(dataBatch)
+    // }
     for (const chart in _dataStreamBuffer) {
       if (_dataStreamBuffer[chart][currentDeviceID] != null && _dataStreamBuffer[chart][currentDeviceID][currentChannel] != null) {
-        const samplingDataBatch = {}
-        let lastTime = -1
-        dataBatch.forEach(data => {
-          const samplingTime = parseInt(data.time)
-          if (samplingTime > lastTime) {
-            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()
         }
+        // console.log(_dataStreamBuffer[chart][currentDeviceID][currentChannel].length)
       }
     }
     // console.log(_dataStreamBuffer)
@@ -101,17 +111,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)
   },

src/data/task/TaskInfo.js

@@ -1,4 +1,5 @@
 import newTask from '@/factories/task/taskFactory'
+import { dataStreamBuffer } from './DataStreamBuffer'
 
 const eliteImgUrl = require('@/assets/img/elite_img.png')
 const neuliveImgUrl = require('@/assets/img/neulive_img.png')
@@ -98,6 +99,7 @@ export const taskInfo = {
     for (const device in _taskInfo.deviceList) {
       _taskInfo.deviceList[device].info.status = ''
       _taskInfo.deviceList[device].info.isSync = false
+      _taskInfo.deviceList[device].info.isStimulate = false
     }
     _taskInfo.formulaList.length = 0
   },
@@ -128,6 +130,17 @@ export const taskInfo = {
               } else {
                 for (const parameter in mesObj.data[item]) {
                   _taskInfo.deviceList[mesObj.data.device_id].parameterSet[parameter] = mesObj.data[item][parameter]
+                  if (parameter === 'STIMULATING') {
+                    if (mesObj.data[item][parameter] === 1) {
+                      // temp update stimulate stauts way
+                      _taskInfo.deviceList[mesObj.data.device_id].info.isStimulate = true
+                      deviceListRegister.forEach(device => {
+                        if (device.id === _taskInfo.taskDeviceID.indexOf(parseInt(mesObj.data.device_id))) {
+                          device.isStimulate = true
+                        }
+                      })
+                    }
+                  }
                 }
               }
             }
@@ -230,6 +243,7 @@ export const taskInfo = {
 
   deviceStop: async (deviceID) => {
     const update = async () => {
+      await dataStreamBuffer.removeByDevice(taskInfo.getRawDeviceID(deviceID))
       _taskInfo.deviceList[deviceID].info.isSync = false
       deviceListRegister.forEach(device => {
         if (device.id === _taskInfo.taskDeviceID.indexOf(parseInt(deviceID))) {

src/data/tool.js

@@ -17,11 +17,46 @@ export function getCurrentTimestamp () {
   return timestamp
 }
 
-// export function getNewIndexFromObject (obj) {
-//   const tmpKeys = Object.keys(obj)
-//   if (tmpKeys.length <= 0) {
-//     return 0
-//   } else {
-//     return parseInt(tmpKeys[tmpKeys.length - 1]) + 1
-//   }
-// }
+export function trimValueArray (data, mode) {
+  const valueArray = []
+  for (let j = 0; j < data.length; j++) {
+    let tmp = data[j][1]
+    if (mode === 'Log') {
+      tmp = Math.log10(Math.abs(tmp))
+      if (tmp >= 12) {
+        tmp = 12
+      } else if (tmp <= -12) {
+        tmp = -12
+      }
+    }
+    data[j][1] = tmp
+    valueArray.push(tmp)
+  }
+  return valueArray
+}
+
+export function getValueArrayMinAndMax (data, axis, targetGridRanges) {
+  // destructuring assignment, ref: https://medium.com/@vladbezden/how-to-get-min-or-max-of-an-array-in-javascript-1c264ec6e1aa
+  let max = Math.max(...data)
+  let min = Math.min(...data)
+  if (axis === 'x') {
+    if (targetGridRanges.xMin !== '') {
+      min = parseInt(targetGridRanges.xMin)
+    }
+    if (targetGridRanges.xMax !== '') {
+      max = parseInt(targetGridRanges.xMax)
+    }
+  } else if (axis === 'y') {
+    if (targetGridRanges.yMin !== '') {
+      min = parseInt(targetGridRanges.yMin)
+    }
+    if (targetGridRanges.yMax !== '') {
+      max = parseInt(targetGridRanges.yMax)
+    }
+  }
+
+  return {
+    min: min,
+    max: max,
+  }
+}

src/factories/chart/chartFactory.js

@@ -25,4 +25,21 @@ function newChart (chartID) {
   }
 }
 
+function newChartMode (mode) {
+  // 1: I, 2: V, 3: R
+  const settings = {}
+  settings[0] = ['Elite', 2, 'Elite', 1]
+  settings[1] = ['Elite', 2, 'Elite', 1]
+  settings[2] = ['Time', 2, 'Elite', 2]
+  settings[3] = ['Time', 2, 'Elite', 3]
+  settings[4] = ['Time', 2, 'Elite', 2]
+  settings[5] = ['Time', 2, 'Elite', 1]
+  settings[6] = ['Time', 2, 'Elite', 2]
+  settings[7] = ['Elite', 2, 'Elite', 1]
+  settings[8] = ['Elite', 2, 'Elite', 1]
+  settings[9] = ['Time', 2, 'Elite', 1]
+  return settings[mode]
+}
+
 export default newChart
+export { newChartMode }

src/factories/chart/seriesFactory.js

@@ -2,18 +2,19 @@ function newSeries (type, legendName, xAxisIndex, yAxisIndex, xAxisSource, yAxis
   return {
     name: legendName,
     type: type,
-    symbol: 'circle',
+    // symbol: 'circle',
     showSymbol: false,
     showAllSymbol: false,
     symbolSize: 2,
-    // sampling: 'average',
-    sampling: function (frame) {
-      return frame[0]
-    },
+    sampling: 'average',
+    // sampling: function (frame) {
+    //   return frame[0]
+    // },
     // clip the overflow on the coordinate system
     // clip: true,
     // ignore mouse events
     // formula
+    // connectNulls: false,
     formula: formula,
     formulaSource: formulaSource,
     silent: true,

src/factories/chart/tooltipFactory.js

@@ -10,11 +10,11 @@ function newTooltip (chartID) {
     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' })
+          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] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
+          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] / 1000).toFixed(3) + ' s'], color: '#5193f2' })
+          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++) {
@@ -30,7 +30,7 @@ function newTooltip (chartID) {
             } 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Ω'
+              value = parseFloat(param.value[0]).toFixed(3) + ' mΩ'
             } else {
               value = parseFloat(param.value[0]).toFixed(3)
             }
@@ -40,7 +40,7 @@ function newTooltip (chartID) {
             } 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Ω'
+              value = parseFloat(param.value[1]).toFixed(3) + ' mΩ'
             } else {
               value = parseFloat(param.value[1]).toFixed(3)
             }
@@ -52,7 +52,7 @@ function newTooltip (chartID) {
             } 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Ω'
+              value1 = parseFloat(param.value[0]).toFixed(3) + ' mΩ'
             } else {
               value1 = parseFloat(param.value[0]).toFixed(3)
             }
@@ -62,7 +62,7 @@ function newTooltip (chartID) {
             } 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Ω'
+              value2 = parseFloat(param.value[1]).toFixed(3) + ' mΩ'
             } else {
               value2 = parseFloat(param.value[1]).toFixed(3)
             }

src/factories/task/deviceFactory.js

@@ -13,6 +13,7 @@ function newDevice (deviceID) {
       serial_number: [],
       status: '',
       isSync: false,
+      isStimulate: false,
     },
     parameterSet: newParameterSet(),
   }

src/factories/task/parameterSetFactory.js

@@ -58,6 +58,8 @@ function newParameterSet () {
     ch7: 0,
     ch8: 0,
     ADC_CHANNEL: 0,
+    // Neulive3.0
+    AXIS_CH: 0,
     // Eilte
     ADC_LEVEL: 0,
     ADC_VALUE_I: 0,
@@ -89,6 +91,8 @@ function newParameterSet () {
     ADC_LEVEL_V_IN_15: 0,
     CTRL_HIGH_Z_15: 0,
     ADC_DAC_CHANNEL_15: 0,
+    BLE_READ: 0,
+    BLE_WRITE: [],
     // Global
     _DEVICE_ADDR_: '',
     _DEVICE_NAME_: '',

src/router/index.js

@@ -91,6 +91,11 @@ export default new Router({
           path: 'data-replay/neulive/:metaList?',
           component: () => import('../components/analysis/replay/neulive/NeuliveDataReplay.vue'),
         },
+        {
+          name: 'elite-data-replay',
+          path: 'data-replay/elite/:metaList?',
+          component: () => import('../components/analysis/replay/elite/EliteDataReplay.vue'),
+        },
         {
           name: 'task-content',
           path: 'task-content/:taskID?',
@@ -105,6 +110,9 @@ export default new Router({
           name: 'file',
           path: 'file',
           component: () => import('../components/file/File.vue'),
+          // meta: {
+          //   keepAlive: true,
+          // },
         },
         {
           name: 'statistics',

src/store/index.js

@@ -4,6 +4,7 @@ import VuexI18n from 'vuex-i18n' // load vuex i18n module
 // import app from './modules/app'
 import state from './state'
 import neuliveReplay from './modules/analysis/replay/neulive'
+import eliteReplay from './modules/analysis/replay/elite'
 import projectContent from './modules/project/content'
 import mutations from './mutations'
 
@@ -16,6 +17,7 @@ const store = new Vuex.Store({
   getters,
   modules: {
     neuliveReplay,
+    eliteReplay,
     projectContent,
   },
   state: state,

src/store/modules/analysis/replay/elite/actions/chartAct.js

@@ -0,0 +1,518 @@
+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/elite/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 0:
+              legendName += '' + source.id + '-I'
+              break
+            case 1:
+              legendName += '' + source.id + '-V'
+              break
+            case 2:
+              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) => {
+    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
+    }
+  },
+
+  /**
+   * set value format by chart ID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID
+   * @param {string} axis ('x' or 'y')
+   * @param {int} axisIndex
+   * @param {object} format
+   */
+  [typePath.setAxisValueFormat]: (state, payload) => {
+    const unit = payload.format.unit // string
+    const unitScale = payload.format.unitScale // int
+    if (payload.axis === 'x') {
+      payload.chartAllData[payload.chartID].xAxis[payload.axisIndex].axisLabel.formatter = function (val) {
+        const label = (val / unitScale).toFixed(2) + unit
+        return label
+      }
+    } else if (payload.axis === 'y') {
+      payload.chartAllData[payload.chartID].yAxis[payload.axisIndex].axisLabel.formatter = function (val) {
+        const label = (val / unitScale).toFixed(2) + unit
+        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 {object} valueFormatX // { unit: string, unitScale: int}
+   * @param {int} deviceNameY
+   * @param {int} deviceIDY
+   * @param {int} channelY
+   * @param {object} valueFormatY // { unit: string, unitScale: int}
+   * @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
+
+    const legendName = getLegendName(sourceList, 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
+    }
+
+    // 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, null, [])
+    chartData.series.push(_series)
+
+    // set xAxis format
+    dispatch(typePath.setAxisValueFormat, { chartAllData: payload.chartAllData, chartID: payload.chartID, axis: 'x', axisIndex: _xAxisIndex, format: payload.valueFormatX })
+
+    // set yAxis format
+    dispatch(typePath.setAxisValueFormat, { chartAllData: payload.chartAllData, chartID: payload.chartID, axis: 'y', axisIndex: _yAxisIndex, format: payload.valueFormatY })
+
+    // register series into grid
+    const _axisList = []
+
+    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 0:
+              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' CURRENT')
+              break
+            case 1:
+              _axisList.push(_axis + ' AXIS = ELITE ' + source.id + ' VOLTAGE')
+              break
+            case 2:
+              _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
+      }
+    })
+
+    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

src/store/modules/analysis/replay/elite/actions/index.js

@@ -0,0 +1,9 @@
+import chartAct from './chartAct'
+import metaAct from './metaAct'
+import recAct from './recAct'
+
+export default {
+  ...chartAct,
+  ...metaAct,
+  ...recAct,
+}

src/store/modules/analysis/replay/elite/actions/metaAct.js

@@ -0,0 +1,23 @@
+import types from '@/store/modules/analysis/replay/elite/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

src/store/modules/analysis/replay/elite/actions/recAct.js

@@ -0,0 +1,113 @@
+import types from '@/store/modules/analysis/replay/elite/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-size')
+        res.data.forEach(_data => {
+          _data.load = false
+          _data.data = []
+          if (parseInt(_data.end_time) <= parseInt(meta.time_duration)) {
+            if (parseInt(_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 miniIDs = Object.values(meta.mini_data[ch])
+        const combineMiniIDs = [].concat.apply([], miniIDs)
+        for (const id of combineMiniIDs) {
+          const res = await payload.api.getMiniFilesAttrByID(ch, id, 'id-start_time-end_time-scale-size')
+          res.data.forEach(_data => {
+            _data.load = false
+            _data.data = []
+            if (parseInt(_data.end_time) <= parseInt(meta.time_duration)) {
+              if (parseInt(_data.end_time) < 0) {
+                _data.end_time = meta.time_duration
+              }
+              // console.log(meta.id, ch, parseInt(_data.scale), _data)
+              _rec[meta.id][ch][parseInt(_data.scale)].push(_data)
+            }
+          })
+        }
+        // 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,
+    })
+  },
+
+  [typePath.initDisplaySetting]: async ({ state, getters, commit }, payload) => {
+    commit(typePath.initDisplaySetting, {
+      meta: payload.meta,
+    })
+  },
+
+  [typePath.updateDisplaySetting]: async ({ state, getters, commit }, payload) => {
+    commit(typePath.updateDisplaySetting, {
+      updateObject: payload.updateObject,
+    })
+  },
+}
+
+export default recActs

src/store/modules/analysis/replay/elite/getters/index.js

@@ -0,0 +1,9 @@
+import metaGet from './metaGet'
+import recGet from './recGet'
+import { getField } from 'vuex-map-fields'
+
+export default {
+  ...metaGet,
+  ...recGet,
+  getField,
+}

src/store/modules/analysis/replay/elite/getters/metaGet.js

@@ -0,0 +1,44 @@
+import types from '@/store/modules/analysis/replay/elite/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

src/store/modules/analysis/replay/elite/getters/recGet.js

@@ -0,0 +1,32 @@
+import types from '@/store/modules/analysis/replay/elite/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
+  },
+
+  [typePath.getAllDisplaySetting]: (state) => {
+    return JSON.parse(JSON.stringify(state.displaySettingInfo))
+  },
+
+  [typePath.getDisplaySettingByKey]: (state) => (key) => {
+    return JSON.parse(JSON.stringify(state.displaySettingInfo[key]))
+  },
+}
+
+export default recGets

src/store/modules/analysis/replay/elite/index.js

@@ -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,
+}

src/store/modules/analysis/replay/elite/mutations/index.js

@@ -0,0 +1,9 @@
+import metaMut from './metaMut'
+import recMut from './recMut'
+import { updateField } from 'vuex-map-fields'
+
+export default {
+  ...metaMut,
+  ...recMut,
+  updateField,
+}

src/store/modules/analysis/replay/elite/mutations/metaMut.js

@@ -0,0 +1,31 @@
+import types from '@/store/modules/analysis/replay/elite/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

src/store/modules/analysis/replay/elite/mutations/recMut.js

@@ -0,0 +1,267 @@
+import types from '@/store/modules/analysis/replay/elite/types'
+import { newChartMode } from '@/factories/chart/chartFactory'
+
+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
+  },
+
+  /**
+  * init rec display setting
+  *
+  * @param {object} meta
+  */
+  [typePath.initDisplaySetting]: function (state, payload) {
+    state.displaySettingInfo.valueRanges = []
+    for (const key of Object.keys(payload.meta.mini_data)) {
+      if (parseInt(key) < 255) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'ch ' + parseInt(key), xMin: '', xMax: '', yMin: '', yMax: '', showXMin: false, showXMax: false, showYMin: false, showYMax: false })
+      } else if (parseInt(key) === 256) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'x', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: false, showXMax: false, showYMin: false, showYMax: false })
+      } else if (parseInt(key) === 257) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'y', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: false, showXMax: false, showYMin: false, showYMax: false })
+      } else if (parseInt(key) === 258) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'z', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: false, showXMax: false, showYMin: false, showYMax: false })
+      } else if (parseInt(key) === 259) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'magnitude', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: false, showXMax: false, showYMin: false, showYMax: false })
+      }
+    }
+
+    state.displaySettingInfo.channelXOptions = [
+      {
+        id: 0,
+        description: 'Current',
+      },
+      {
+        id: 1,
+        description: 'Voltage',
+      },
+      {
+        id: 2,
+        description: 'Resistance',
+      },
+      {
+        id: 3,
+        description: 'Time',
+      },
+    ]
+
+    state.displaySettingInfo.channelYOptions = [
+      {
+        id: 0,
+        description: 'Current',
+      },
+      {
+        id: 1,
+        description: 'Voltage',
+      },
+      {
+        id: 2,
+        description: 'Resistance',
+      },
+    ]
+
+    state.displaySettingInfo.scaleOptions = [
+      {
+        id: 0,
+        description: 'Linear',
+      },
+      {
+        id: 1,
+        description: 'Log',
+      },
+    ]
+
+    state.displaySettingInfo.valueFormatOptions = {
+      0: [ // Current
+        {
+          id: 0,
+          unit: 'nA',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'uA',
+          unitScale: 1000,
+        },
+        {
+          id: 2,
+          unit: 'mA',
+          unitScale: 1000000,
+        },
+      ],
+      1: [ // Voltage
+        {
+          id: 0,
+          unit: 'uV',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'mV',
+          unitScale: 1000,
+        },
+        {
+          id: 2,
+          unit: 'V',
+          unitScale: 1000000,
+        },
+      ],
+      2: [ // Resistance
+        {
+          id: 0,
+          unit: 'kohm',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'ohm',
+          unitScale: 0.001,
+        },
+        {
+          id: 2,
+          unit: 'Mohm',
+          unitScale: 1000,
+        },
+      ],
+      3: [ // Time
+        {
+          id: 0,
+          unit: 'us',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'ms',
+          unitScale: 1000,
+        },
+        {
+          id: 2,
+          unit: 's',
+          unitScale: 1000000,
+        },
+      ],
+    }
+    const setting = newChartMode(payload.meta.parameter_set.MODE)
+    const xType = setting[0]
+    const xValue = setting[1]
+    const yType = setting[2]
+    const yValue = setting[3]
+    if (xType === 'Elite') {
+      // 1: I, 2: V, 3: R
+      if (xValue === 1) {
+        state.displaySettingInfo.valueFormatX = { id: 0, unit: 'nA', unitScale: 1 }
+        state.displaySettingInfo.channelXSelect = { id: 0, description: 'Current' }
+      } else if (xValue === 2) {
+        state.displaySettingInfo.valueFormatX = { id: 0, unit: 'uV', unitScale: 1 }
+        state.displaySettingInfo.channelXSelect = { id: 1, description: 'Voltage' }
+      } else if (xValue === 3) {
+        state.displaySettingInfo.valueFormatX = { id: 0, unit: 'kohm', unitScale: 1 }
+        state.displaySettingInfo.channelXSelect = { id: 2, description: 'Resistance' }
+      }
+    } else if (xType === 'Time') {
+      state.displaySettingInfo.valueFormatX = { id: 0, unit: 'us', unitScale: 1 }
+      state.displaySettingInfo.channelXSelect = { id: 3, description: 'Time' }
+    }
+
+    if (yType === 'Elite') {
+      // 1: I, 2: V, 3: R
+      if (yValue === 1) {
+        state.displaySettingInfo.valueFormatY = { id: 0, unit: 'nA', unitScale: 1 }
+        state.displaySettingInfo.channelYSelect = { id: 0, description: 'Current' }
+      } else if (yValue === 2) {
+        state.displaySettingInfo.valueFormatY = { id: 0, unit: 'uV', unitScale: 1 }
+        state.displaySettingInfo.channelYSelect = { id: 1, description: 'Voltage' }
+      } else if (yValue === 3) {
+        state.displaySettingInfo.valueFormatY = { id: 0, unit: 'kohm', unitScale: 1 }
+        state.displaySettingInfo.channelYSelect = { id: 2, description: 'Resistance' }
+      }
+    }
+
+    state.displaySettingInfo.scaleXSelect = { id: 0, description: 'Linear' }
+    state.displaySettingInfo.scaleYSelect = { id: 0, description: 'Linear' }
+    state.displaySettingInfo.ignoreGridIndex = []
+    state.displaySettingInfo.filename = payload.meta.name
+
+    const params = payload.meta.parameter_set
+    state.displaySettingInfo.parameterInfo = { recording: '' }
+    state.displaySettingInfo.parameterInfo.recording += 'Duration: ' + parseInt(parseInt(payload.meta.time_duration / 1000000) / 60) + ' m ' + parseInt((payload.meta.time_duration % 60000000) / 1000000) + ' s<br/>'
+    state.displaySettingInfo.parameterInfo.recording += '<br/>Parameter: <br/>'
+    for (const [key, value] of Object.entries(params)) {
+      if (!(key.includes('sti') || key.includes('STI'))) {
+        state.displaySettingInfo.parameterInfo.recording += '    ' + key + ': ' + value + '<br/>'
+      }
+    }
+
+    state.displaySettingInfo.editInfo = {
+      info: { id: payload.meta.id },
+      changedName: '',
+      success: false,
+      error: false,
+      errorMessagesAll: ['File name contains illegal character', 'File name empty', 'File name exist'],
+      errorMessages: [],
+    }
+    state.displaySettingInfo.deleteInfo = {
+      path: '',
+      name: '',
+      metaID: payload.meta.id,
+      rawChannelAndIDArrays: [], // list of lists
+      miniChannelAndIDArrays: [], // list of lists
+    }
+  },
+
+  /**
+  * update rec display setting
+  *
+  * @param {object} updateObject { settingInfoKey, value (object) }
+  */
+  [typePath.updateDisplaySetting]: function (state, payload) {
+    const infoNames = Object.keys(payload.updateObject)
+    for (const infoName of infoNames) {
+      const _object = payload.updateObject[infoName]
+      if (Array.isArray(state.displaySettingInfo[infoName])) {
+        const id = _object.id
+        const index = state.displaySettingInfo[infoName].findIndex(x => x.id === id)
+        for (const [key, value] of Object.entries(_object)) {
+          state.displaySettingInfo[infoName][index][key] = value
+        }
+      } else {
+        state.displaySettingInfo[infoName] = _object
+      }
+    }
+  },
+}
+
+export default recMutations

src/store/modules/analysis/replay/elite/state.js

@@ -0,0 +1,38 @@
+function newState () {
+  return {
+    recInfo: {},
+    // recInfo format:
+    // {
+    //   scale: [
+    //     {
+    //       id: _id,
+    //       start_time: _start_time,
+    //       end_time: _end_time,
+    //       data: _data
+    //       load: _load
+    //     }
+    //   ]
+    // }
+    metaList: [],
+    displaySettingInfo: {
+      valueRanges: [], // each element: { id: ID, name: channelName, xMin: 0, xMax: 0, yMin: 0, yMax: 0 }
+      channelXOptions: [],
+      channelYOptions: [],
+      scaleOptions: [],
+      valueFormatOptions: {},
+      valueFormatX: {},
+      valueFormatY: {},
+      channelXSelect: {},
+      channelYSelect: {},
+      scaleXSelect: {},
+      scaleYSelect: {},
+      ignoreGridIndex: [],
+      filename: '',
+      parameterInfo: {},
+      editInfo: {},
+      deleteInfo: {},
+    },
+  }
+}
+
+export default newState

src/store/modules/analysis/replay/elite/types.js

@@ -0,0 +1,60 @@
+
+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',
+    setAxisValueFormat: 'setAxisValueFormatChart',
+    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',
+    initDisplaySetting: 'initDisplaySettingRec',
+
+    set: 'setRec',
+    update: 'updateRec',
+    updateDataByIndex: 'updateDataByIndexRec',
+    updateDisplaySetting: 'updateDisplaySettingRec',
+
+    getAll: 'getAllRec',
+    getAllDisplaySetting: 'getAllDisplaySettingRec',
+    getDisplaySettingByKey: 'getDisplaySettingByKeyRec',
+  },
+
+}
+
+export default types

src/store/modules/analysis/replay/neulive/actions/chartAct.js

@@ -13,8 +13,9 @@ function makeXAxis (gridIndex, type) {
     gridIndex: gridIndex,
     axisLine: { show: false, onZero: false, lineStyle: { color: '#aaa' } },
     axisTick: { show: false },
-    axisLabel: { show: false, showMinLabel: false, showMaxLabel: false, color: '#aaa' },
+    axisLabel: { show: false, showMinLabel: true, showMaxLabel: true, color: '#aaa' },
     splitLine: { show: true, lineStyle: { color: '#eee' } },
+    splitNumber: 2,
     scale: true,
     min: null,
     max: null,
@@ -28,8 +29,9 @@ function makeYAxis (gridIndex, type) {
     gridIndex: gridIndex,
     axisTick: { show: false },
     axisLine: { show: false }, // color: '#ccc' } },
-    axisLabel: { show: true, color: '#aaa', showMinLabel: false, showMaxLabel: false },
+    axisLabel: { show: true, color: '#aaa', showMinLabel: true, showMaxLabel: true },
     splitLine: { show: true, lineStyle: { color: '#eee' } },
+    splitNumber: 2,
     animation: false,
     scale: true,
     min: null,
@@ -79,7 +81,7 @@ function getLegendName (sourceList, formulaID) {
           legendName += 'T'
           break
         case 'Neulive':
-          legendName += '' + source.id + 'CH' + source.channel
+          legendName += '' + source.id + 'CH' + String(parseInt(source.channel) + 1)
           break
         case 'Elite':
           switch (source.channel) {
@@ -112,7 +114,7 @@ function getLegendName (sourceList, formulaID) {
 
 // generate grid
 function makeGrid (index, length, chartID) {
-  const _height = (82 / length) + '%'
+  const _height = (82 / length) - 1.5 + '%'
   const _top = index * (82 / length) + 1 + '%'
   let _left
   let _right
@@ -120,7 +122,7 @@ function makeGrid (index, length, chartID) {
     _left = '0%'
     _right = '0%'
   } else {
-    _left = '15%'
+    _left = '6%'
     _right = '4%'
   }
   return {
@@ -144,7 +146,6 @@ const actions = {
    * @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) {
@@ -187,7 +188,7 @@ const actions = {
       _series.length = 0
     }
     delete payload.chartAllData[payload.chartID]
-    dispatch(typePath.init, { chartAllData: payload.chartAllData, chartID: payload.chartID, gridLength: 1 })
+    dispatch(typePath.init, { chartAllData: payload.chartAllData, chartID: payload.chartID, gridLength: payload.gridLength })
   },
 
   /**
@@ -235,11 +236,52 @@ const actions = {
    */
   [typePath.setTimeXAxis]: (state, payload) => {
     payload.chartAllData[payload.chartID].xAxis[payload.xAxisIndex].axisLabel.formatter = function (val) {
-      const label = parseInt(parseInt(val / 1000) / 60) + ' m ' + parseInt((val % 60000) / 1000) + ' s'
+      const label = parseInt(parseInt(val / 1000000) / 60) + ' m ' + parseInt((val % 60000000) / 1000000) + ' s'
       return label
     }
   },
 
+  /**
+   * set value format by chart ID
+   *
+   * @param {object} chartAllData
+   * @param {int} chartID
+   * @param {string} axis ('x' or 'y')
+   * @param {int} axisIndex
+   * @param {optional, object} format
+   */
+  [typePath.setAxisValueFormat]: (state, payload) => {
+    let name = '' // string
+    let unit = '' // string
+    let unitScale = 1 // int
+    if (payload.format !== undefined) {
+      name = payload.format.name // string
+      unit = payload.format.unit // string
+      unitScale = payload.format.unitScale // int
+    }
+    if (payload.axis === 'x') {
+      payload.chartAllData[payload.chartID].xAxis[payload.axisIndex].axisLabel.formatter = function (val) {
+        if (name !== 'time') {
+          const label = (val / unitScale).toFixed(2) + unit
+          return label
+        } else {
+          var hr = Math.floor(val / 3600000000)
+          var min = Math.floor((val - (hr * 3600000000)) / 60000000)
+          var sec = parseInt((val - (hr * 3600000000) - (min * 60000000)) / 1000000)
+          while (min.length < 2) { min = '0' + min }
+          while (sec.length < 2) { sec = '0' + min }
+          if (hr) hr += 'h'
+          return hr + min + 'm' + sec + 's'
+        }
+      }
+    } else if (payload.axis === 'y') {
+      payload.chartAllData[payload.chartID].yAxis[payload.axisIndex].axisLabel.formatter = function (val) {
+        const label = (val / unitScale).toFixed(2) + unit
+        return label
+      }
+    }
+  },
+
   /**
    * register device-channel to chartData
    *
@@ -249,9 +291,11 @@ const actions = {
    * @param {int} deviceNameX
    * @param {int} deviceIDX
    * @param {int} channelX
+   * @param {object} valueFormatX // { unit: string, unitScale: int}
    * @param {int} deviceNameY
    * @param {int} deviceIDY
    * @param {int} channelY
+   * @param {object} valueFormatY // { unit: string, unitScale: int}
    * @param {int} formula
    * @return {object} : chart data
    */
@@ -324,7 +368,6 @@ const actions = {
 
     // push legendName
     chartData.legend.data.push(payload.legendName)
-
     // if AxisIndex != -1 then add new axis into list
     let _xAxisIndex = -1
     let _yAxisIndex = -1
@@ -366,9 +409,17 @@ const actions = {
 
     // set xAxis format
     if (sourceList[0].name === 'Time') {
-      dispatch(typePath.setTimeXAxis, { chartAllData: payload.chartAllData, chartID: payload.chartID, xAxisIndex: _xAxisIndex })
+      // dispatch(typePath.setTimeXAxis, { chartAllData: payload.chartAllData, chartID: payload.chartID, xAxisIndex: _xAxisIndex })
+      if (typeof payload.valueFormatX !== 'undefined') {
+        const format = payload.valueFormatX
+        format.name = 'time'
+      }
+      dispatch(typePath.setAxisValueFormat, { chartAllData: payload.chartAllData, chartID: payload.chartID, axis: 'x', axisIndex: _xAxisIndex, format: payload.valueFormatX })
     }
 
+    // set yAxis format
+    dispatch(typePath.setAxisValueFormat, { chartAllData: payload.chartAllData, chartID: payload.chartID, axis: 'y', axisIndex: _yAxisIndex, format: payload.valueFormatY })
+
     // register series into grid
     const _axisList = []
 
@@ -419,10 +470,22 @@ const actions = {
 
     chartData.grid[payload.gridIndex].series.push(_gridSeries)
 
-    // console.log(chartData)
     return chartData
   },
 
+  /**
+   * reset chart axis label
+   *
+   * @param {object} chartData
+   */
+  [typePath.resetChartDataAxisLabel]: async (state, payload) => {
+    const axisArray = payload.chartData.yAxis
+    for (let index = 0; index < axisArray.length; ++index) {
+      payload.chartData.yAxis[index].max = null
+      payload.chartData.yAxis[index].min = null
+    }
+  },
+
   // /**
   //  * remove device-channel from chart TODO
   //  *

src/store/modules/analysis/replay/neulive/actions/recAct.js

@@ -30,10 +30,12 @@ const recActs = {
         res.data.forEach(_data => {
           _data.load = false
           _data.data = []
-          if (_data.end_time < 0) {
-            _data.end_time = meta.time_duration
+          if (parseInt(_data.end_time) <= parseInt(meta.time_duration)) {
+            if (parseInt(_data.end_time) < 0) {
+              _data.end_time = parseInt(meta.time_duration)
+            }
+            _rec[meta.id][ch][1].push(_data)
           }
-          _rec[meta.id][ch][1].push(_data)
         })
         return res.data
       })
@@ -43,16 +45,52 @@ const recActs = {
 
     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
+        const miniIDs = Object.values(meta.mini_data[ch])
+        const combineMiniIDs = [].concat.apply([], miniIDs)
+        // console.log(miniIDs)
+        // console.time()
+        // const combine = miniIDs.flat(1)
+        // console.timeEnd()
+        // console.time()
+        // const combine1 = [].concat(...miniIDs)
+        // console.timeEnd()
+        // console.time()
+        // const combine2 = [].concat.apply([], miniIDs)
+        // console.timeEnd()
+        // console.time()
+        // const combine3 = miniIDs.reduce((a, b) => {
+        //   return a.concat(b)
+        // })
+        // console.timeEnd()
+        // console.log('c', combine)
+        // console.log('c1', combine1)
+        // console.log('c2', combine2)
+        // console.log('c3', combine3)
+
+        for (const id of combineMiniIDs) {
+          const res = await payload.api.getMiniFilesAttrByID(ch, id, 'id-start_time-end_time-scale')
+          res.data.forEach(_data => {
+            _data.load = false
+            _data.data = []
+            if (parseInt(_data.end_time) <= parseInt(meta.time_duration)) {
+              if (parseInt(_data.end_time) < 0) {
+                _data.end_time = parseInt(meta.time_duration)
+              }
+              _rec[meta.id][ch][parseInt(_data.scale)].push(_data)
+            }
+          })
+        }
+
+        // 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)
     })
@@ -78,6 +116,18 @@ const recActs = {
       data: payload.data,
     })
   },
+
+  [typePath.initDisplaySetting]: async ({ state, getters, commit }, payload) => {
+    commit(typePath.initDisplaySetting, {
+      meta: payload.meta,
+    })
+  },
+
+  [typePath.updateDisplaySetting]: async ({ state, getters, commit }, payload) => {
+    commit(typePath.updateDisplaySetting, {
+      updateObject: payload.updateObject,
+    })
+  },
 }
 
 export default recActs

src/store/modules/analysis/replay/neulive/getters/chartGet.js

@@ -1,29 +0,0 @@
-import types from '@/store/modules/analysis/replay/neulive/types'
-
-const typePath = types.chart
-
-const chartGets = {
-  /**
-   * get chart data by chart ID
-   *
-   * @param {int} chartID
-   * @return {object} : chart data
-   */
-  [typePath.getDataByID]: (state) => (id) => {
-    if (id == null || state.chartData[id] == null) {
-      return null
-    }
-    return state.chartData[id]
-  },
-
-  /**
-   * get all chart data
-   *
-   * @return {object} : chart data
-   */
-  [typePath.getAllData]: (state) => {
-    return state.chartData
-  },
-}
-
-export default chartGets

src/store/modules/analysis/replay/neulive/getters/index.js

@@ -1,7 +1,9 @@
 import metaGet from './metaGet'
 import recGet from './recGet'
+import { getField } from 'vuex-map-fields'
 
 export default {
   ...metaGet,
   ...recGet,
+  getField,
 }

src/store/modules/analysis/replay/neulive/getters/recGet.js

@@ -19,6 +19,14 @@ const recGets = {
   [typePath.getAll]: (state) => {
     return state.recInfo
   },
+
+  [typePath.getAllDisplaySetting]: (state) => {
+    return JSON.parse(JSON.stringify(state.displaySettingInfo))
+  },
+
+  [typePath.getDisplaySettingByKey]: (state) => (key) => {
+    return JSON.parse(JSON.stringify(state.displaySettingInfo[key]))
+  },
 }
 
 export default recGets

src/store/modules/analysis/replay/neulive/mutations/index.js

@@ -1,7 +1,9 @@
 import metaMut from './metaMut'
 import recMut from './recMut'
+import { updateField } from 'vuex-map-fields'
 
 export default {
   ...metaMut,
   ...recMut,
+  updateField,
 }

src/store/modules/analysis/replay/neulive/mutations/recMut.js

@@ -37,6 +37,129 @@ const recMutations = {
     state.recInfo[payload.metaID][payload.channel][payload.scale][payload.index].load = true
   },
 
+  /**
+  * init rec display setting
+  *
+  * @param {object} meta
+  */
+  [typePath.initDisplaySetting]: function (state, payload) {
+    state.displaySettingInfo.valueRanges = []
+    state.displaySettingInfo.visibleGridIndexes = Array.from({ length: Object.keys(payload.meta.mini_data).length }, (v, i) => i.toString()) // gives [0, 1, ... , length-1]
+    for (const key of Object.keys(payload.meta.mini_data)) {
+      if (parseInt(key) < 255) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'ch ' + (parseInt(key) + 1), xMin: '', xMax: '', yMin: '', yMax: '', showXMin: true, showXMax: true, showYMin: true, showYMax: true })
+      } else if (parseInt(key) === 256) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'x', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: true, showXMax: true, showYMin: true, showYMax: true })
+      } else if (parseInt(key) === 257) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'y', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: true, showXMax: true, showYMin: true, showYMax: true })
+      } else if (parseInt(key) === 258) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'z', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: true, showXMax: true, showYMin: true, showYMax: true })
+      } else if (parseInt(key) === 259) {
+        state.displaySettingInfo.valueRanges.push({ id: parseInt(key), name: 'magnitude', xMin: '', xMax: '', yMin: '', yMax: '', showXMin: true, showXMax: true, showYMin: true, showYMax: true })
+      }
+    }
+
+    state.displaySettingInfo.valueFormatOptions = {
+      0: [ // Voltage
+        {
+          id: 0,
+          unit: 'uV',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'mV',
+          unitScale: 1000,
+        },
+      ],
+      1: [ // Time
+        {
+          id: 0,
+          unit: 'us',
+          unitScale: 1,
+        },
+        {
+          id: 1,
+          unit: 'ms',
+          unitScale: 1000,
+        },
+        {
+          id: 2,
+          unit: 's',
+          unitScale: 1000000,
+        },
+      ],
+    }
+
+    state.displaySettingInfo.valueFormatX = { id: 2, unit: 's', unitScale: 1000000 } // [todo] init by meta mode
+    state.displaySettingInfo.valueFormatY = { id: 0, unit: 'uV', unitScale: 1 } // [todo] init by meta mode
+    state.displaySettingInfo.channelXSelect = { id: 1, description: 'Time' }
+    state.displaySettingInfo.channelYSelect = { id: 0, description: 'Voltage' }
+    state.displaySettingInfo.ignoreGridIndexes = []
+    state.displaySettingInfo.filename = payload.meta.name
+
+    const params = payload.meta.parameter_set
+    state.displaySettingInfo.parameterInfo = { recording: '', stimulation: '' }
+    state.displaySettingInfo.parameterInfo.recording += 'Duration: ' + parseInt(parseInt(payload.meta.time_duration / 1000000) / 60) + ' m ' + parseInt((payload.meta.time_duration % 60000000) / 1000000) + ' s<br/>'
+    state.displaySettingInfo.parameterInfo.recording += '<br/>Parameter: <br/>'
+    for (const [key, value] of Object.entries(params)) {
+      if (!(key.includes('sti') || key.includes('STI'))) {
+        state.displaySettingInfo.parameterInfo.recording += '    ' + key + ': ' + value + '<br/>'
+      }
+    }
+    state.displaySettingInfo.parameterInfo.stimulation += 'Duration: ' + parseInt(parseInt(payload.meta.time_duration / 1000000) / 60) + ' m ' + parseInt((payload.meta.time_duration % 60000000) / 1000000) + ' s<br/>'
+    state.displaySettingInfo.parameterInfo.stimulation += '<br/>Parameter: <br/>'
+    for (const [key, value] of Object.entries(params)) {
+      if (key.includes('sti') || key.includes('STI')) {
+        state.displaySettingInfo.parameterInfo.stimulation += '    ' + key + ': ' + value + '<br/>'
+      }
+    }
+
+    state.displaySettingInfo.editInfo = {
+      info: { id: payload.meta.id },
+      changedName: '',
+      success: false,
+      error: false,
+      errorMessagesAll: ['File name contains illegal character', 'File name empty', 'File name exist'],
+      errorMessages: [],
+    }
+    state.displaySettingInfo.deleteInfo = {
+      path: '',
+      name: '',
+      metaID: payload.meta.id,
+      rawChannelAndIDArrays: [], // list of lists
+      miniChannelAndIDArrays: [], // list of lists
+    }
+  },
+
+  /**
+  * update rec display setting
+  *
+  * @param {object} updateObject { settingInfoKey, value (array or object) }
+  */
+  [typePath.updateDisplaySetting]: function (state, payload) {
+    const infoNames = Object.keys(payload.updateObject)
+    for (const infoName of infoNames) {
+      const updateObject = payload.updateObject[infoName]
+      if (typeof updateObject === 'object' && updateObject !== null) { // is object
+        if (Object.prototype.hasOwnProperty.call(updateObject, 'id')) {
+          const id = updateObject.id
+          const index = state.displaySettingInfo[infoName].findIndex(x => x.id === id)
+          for (const [key, value] of Object.entries(updateObject)) {
+            state.displaySettingInfo[infoName][index][key] = value
+          }
+        } else {
+          for (const [key, value] of Object.entries(updateObject)) {
+            state.displaySettingInfo[infoName][key] = value
+          }
+        }
+      } else if (Array.isArray(updateObject)) { // is array
+        state.displaySettingInfo[infoName] = updateObject
+      } else { // e.g. string
+        state.displaySettingInfo[infoName] = updateObject
+      }
+    }
+  },
 }
 
 export default recMutations

src/store/modules/analysis/replay/neulive/state.js

@@ -1,6 +1,5 @@
 function newState () {
   return {
-    chartData: {},
     recInfo: {},
     // recInfo format:
     // {
@@ -15,6 +14,20 @@ function newState () {
     //   ]
     // }
     metaList: [],
+    displaySettingInfo: {
+      valueRanges: [], // each element: { id: ID, name: channelName, xMin: 0, xMax: 0, yMin: 0, yMax: 0 }
+      valueFormatOptions: {},
+      valueFormatX: {},
+      valueFormatY: {},
+      channelXSelect: {},
+      channelYSelect: {},
+      ignoreGridIndexes: [], // each element type: string
+      visibleGridIndexes: [], // each element type: string
+      filename: '',
+      parameterInfo: {},
+      editInfo: {},
+      deleteInfo: {},
+    },
   }
 }
 

src/store/modules/analysis/replay/neulive/types.js

@@ -21,12 +21,15 @@ const types = {
     pushAxis: 'pushAxisChart',
     pushLegendName: 'pushLegendNameChart',
     setTimeXAxis: 'setTimeXAxisChart',
+    setAxisValueFormat: 'setAxisValueFormatChart',
     pushGridSeries: 'pushGridSeriesChart',
     deleteByID: 'deleteByIDChart',
     update: 'updateChart',
     updateSeries: 'updateSeriesChart',
     updateAxis: 'updateAxisChart',
     updateSeriesData: 'updateSeriesDataChart',
+
+    resetChartDataAxisLabel: 'resetChartDataAxisLabelChart',
   },
   meta: {
     init: 'initMeta',
@@ -42,12 +45,16 @@ const types = {
   rec: {
     init: 'initRec',
     intoData: 'intoDataRec',
+    initDisplaySetting: 'initDisplaySettingRec',
 
     set: 'setRec',
     update: 'updateRec',
     updateDataByIndex: 'updateDataByIndexRec',
+    updateDisplaySetting: 'updateDisplaySettingRec',
 
     getAll: 'getAllRec',
+    getAllDisplaySetting: 'getAllDisplaySettingRec',
+    getDisplaySettingByKey: 'getDisplaySettingByKeyRec',
   },
 
 }