add csv download test

src/components/data-analysis/ControlPanel.vue

@@ -2,7 +2,7 @@
   <div>
     <va-card class="h-full">
       <va-card-content>
-        <!-- {{ simpleSelectModel}} -->
+        <va-input v-model="dataNameValue" class="mb-4" label="Data Name" placeholder="Keyword" />
         <va-select
           v-model="simpleSelectModel"
           :label="'Filter Mode'"
@@ -14,12 +14,14 @@
           <div v-if="simpleSelectModel.id === 1">
             <va-slider v-model="VTModeModel" label="percentage(%)" track-label-visible :min="0" :max="50" />
           </div>
-          <div v-else-if="simpleSelectModel.id === 2">b</div>
+          <div v-else-if="simpleSelectModel.id === 2">
+            <va-slider v-model="slopModeModel" label="1D window" track-label-visible :min="1" :max="50" />
+          </div>
           <div v-else></div>
         </va-card-content>
 
         <va-button class="mt-2" @click="filterData">Start</va-button>
-        <!-- <div v-if="simpleSelectModel.id === 1">
+        <!-- <div v-if="simpleSelectModel.id === 1"> 
           <va-button>test</va-button>
           <va-input></va-input>
         </div> -->
@@ -33,16 +35,18 @@
   export default {
     emits: ['filter-data'],
     setup(props, { emit }) {
-      const VTModeModel = 5
+      const dataNameValue = ref('')
+      const VTModeModel = ref(10)
+      const slopModeModel = ref(20)
       const simpleSelectModel = ref({})
       const simpleOptions = ref([
         {
           id: 1,
-          description: 'V-T mode',
+          description: 'V-T Mode',
         },
         {
           id: 2,
-          description: 'Second option',
+          description: '1st Order Differential',
         },
         {
           id: 3,
@@ -50,10 +54,24 @@
         },
       ])
       const filterData = function () {
-        emit('filter-data')
+        console.log(VTModeModel.value)
+        // switch(simpleSelectModel.value.id) {
+        //   case 1:
+        //     const return_data = { mode: 1, data_id: 166, data: { persentage: 0 } };
+        //   case 2:
+        //     const return_data = { mode: 2, data_id: 166, data: { persentage: 0 } };
+        //   default:
+        // }
+        // console.log(return_data)
+        emit('filter-data', {
+          mode: simpleSelectModel.value.id,
+          data_id: [],
+          data_name: dataNameValue.value,
+          data: { persentage: VTModeModel.value, window: slopModeModel.value },
+        })
       }
 
-      return { props, simpleSelectModel, simpleOptions, VTModeModel, filterData }
+      return { props, dataNameValue, simpleSelectModel, simpleOptions, VTModeModel, slopModeModel, filterData }
     },
   }
 </script>

src/pages/admin/data-analysis/DataAnalysis.vue

@@ -25,6 +25,7 @@
       startMqtt(`${controllerID}/data_analysis/#`, (topic: string, message: ArrayBuffer) => {
         // [data, data, ceiling, ground]
         const msg = JSON.parse(message.toString())
+        console.log('startMqtt', msg)
 
         // try draw line
         // msg.push(1500000, -1500000)
@@ -40,13 +41,14 @@
 
         // stop loading
         linechart_ref.value?.stopLoading()
+
+        // draw line
+        if (msg.length < 3) return true
         let yAxis_list = msg[2].map((x) => ({ yAxis: x }))
         let coord_list = [{ coord: [msg[3][0][0], msg[3][0][1]] }, { coord: [msg[3][1][0], msg[3][1][1]] }]
         // yAxis_list.append([{ coord:[ msg[3][0][0],msg[3][0][1]]},{ coord:[ msg[3][1][0], msg[3][1][1]]}])
         yAxis_list.push(coord_list)
         console.log('yAxis_list', yAxis_list)
-        // draw line
-        if (msg.length < 3) return true
         linechart_ref.value.setOption({
           series: [
             {
@@ -66,10 +68,11 @@
       const linechart_ref = ref()
 
       // methods
-      const filterData = function () {
+      const filterData = function (e: any) {
         linechart_ref.value?.startLoading()
         console.log(linechart_ref)
-        publish(`${controllerID}_data_analysis/get_analysis_data`, JSON.stringify({}))
+        console.log(e)
+        publish(`${controllerID}_data_analysis/get_analysis_data`, JSON.stringify({ e }))
       }
 
       return { linechart_ref, filterData }