<script>
import Siderleftmethode from "./siderleftmethod.js";
import siderleftSerilportMethod from "./SiderleftSerilportMethod.js";
import mycard from "./mycard.vue";
import {ref} from 'vue';
import Mycard from "./mycard.vue";
import EventBus from "../eventBus.js";
import {fs} from "@tauri-apps/api";
import SerialportMethod  from "./SerialPort/SerialportMethod.js";
export default {
  name: "siderleft",
  components: {Mycard},
  data() {
    return {
      isSpecialmodeshow: true,
      dataprocessconfig:{
        useSG:false,
        usehighpass:false
      },
      outputconfig: {
        isChongCaiyang: false,
        ChongCaiyanginterval: 0.2,
      },
      caijiavgNumber:100,
      lastcaijiavgNumber:100,
      autoremovedark: true,
      caijidirection: "UP",
      ShutterTime: [100, 100],
      lastshuttime: 100,
      cajitimes: 5,
      cajitimesjiange:0,
      methodslist: [],

      Comname: '请选择',
      options: [],
      datatosave: [],
      Pathtosave: "",
      nowNumber: 0,
      Filename: "Plot",
      pathofdir: "./data",
      sensor_typeforset: "IRIS-IS11",
      Devinfo: {
        SerilNumber: "",
        Version: "0000",
        name: "暂无",
        Caji_mode: "连续采集",
        return_mode: "返回模式",
        Datatype: "DN",
        sensor_type:"IRIS-IS11"

      },
      UPStr: "UP",
      DOWNStr: "DOWN",
      Datainfoshow: {
        header: "数据信息",
        infolist: []
      },
      iscollecting: false,
      dataup: {},
      datadown: {},
      datainfoup: {
        hasrecive: false,
        header: "UP",
        infolist: []
      },
      datainfodown: {
        hasrecive: false,
        header: "DOWN",
        infolist: []
      },
      buttoncolor:{
        opencombutton:"light"
      },

      devinfoshow: {
        header: "设备信息",
        infolist: []
      },
      SerialInfo: {
        isopen: false,
      },
      cssme: {
        comportvariant: "info",
      },
      continuecaiji: false,
      Dispatcher:{
        isenable:false,
        begin:"00:00",
        end:"23:59",
      },
      continuessave:false,
    }
  },
  async mounted() {
    var configdata=await fs.readTextFile("config.json");
    configdata=JSON.parse(configdata)
    if (typeof(configdata.pathofsave)!="undefined")
      this.pathofdir=configdata.pathofsave
    if (typeof(configdata.Filename)!="undefined")
      this.Filename=configdata.Filename
    if (typeof(configdata.caijiavgNumber)!="undefined")
  {
    this.caijiavgNumber=configdata.caijiavgNumber
    this.lastcaijiavgNumber=configdata.caijiavgNumber
  }
      
    if (typeof(configdata.useSG)!="undefined")
      this.dataprocessconfig.useSG=configdata.useSG
    if (typeof(configdata.usehighpass)!="undefined")
      this.dataprocessconfig.usehighpass=configdata.usehighpass
    if (typeof(configdata.Dispatcher.isenable)!="undefined")
      this.Dispatcher.isenable=configdata.Dispatcher.isenable
    if (typeof(configdata.Dispatcher.begin)!="undefined")
      this.Dispatcher.begin=configdata.Dispatcher.begin
    if (typeof(configdata.Dispatcher.end)!="undefined")
      this.Dispatcher.end=configdata.Dispatcher.end
    if (typeof(configdata.sensor_typeforset)!="undefined")
      this.sensor_typeforset=configdata.sensor_typeforset

     await         SerialportMethod.Set_Dev_Type(this.sensor_typeforset);;


    var ports = this.listSerialPorts();
    // let btn=document.getElementById("closecomeside");
    // btn.disabled=true;
    console.log(ports);
    // var btnn = document.getElementById("closecome");
    // btnn.disabled = true;
    this.findmaxNinpath(this.pathofdir);
    window.addEventListener("keydown", this.handlekeydown)
    EventBus.on("updatamaindevinfo", this.GetSenSorInfo);
    EventBus.on("konamiactive",this.setspectralmode);
    EventBus.on("Get_Dev_Info",this.get_dev_info);
    EventBus.on("LetSiderDo",this.letmedosomething);
  },
  methods: {
    ...Siderleftmethode,
    ...siderleftSerilportMethod,
    addOption() {
      this.options.push({label: this.inputValue, value: this.inputValue}),
      this.inputValue = ''
    }
  },
  setup(props, context) {
    const optionName = ref('')
    const isAdding = ref(false)

    const onAddOption = () => {
      isAdding.value = true
    }


    const clear = () => {
      optionName.value = ''
      isAdding.value = false
    }

    return {
      optionName,
      isAdding,
      onAddOption,

      clear,
    }
  },


}
</script>

<template>


  <BAccordion class="bAccordionme" size="sm" >
    <BAccordionItem title="高级设置" v-show="isSpecialmodeshow">
      <!-- 设备切换 a-select -->
      <b-input-group prepend="设备切换" size="sm" style="width: 100%">
        <b-form-select v-model="sensor_typeforset" style="padding-right: 8px" @change="onDevchange" :disabled="SerialInfo.isopen" >
          <b-form-select-option value="IRIS-IS11">高光谱传感器</b-form-select-option>
          <b-form-select-option value="IS3">IS3</b-form-select-option>
          <b-form-select-option value="IS11">IS11</b-form-select-option>
        </b-form-select>
      </b-input-group>

<!--      <b-input-group prepend="平均次数" size="sm" style="width: 100%">-->
<!--        <b-form-input type="number" v-model="caijiavgNumber"></b-form-input>-->
<!--        <b-input-group-append>-->

<!--        </b-input-group-append>-->
<!--      </b-input-group>-->
<!--      <b-input-group prepend="滤波" size="sm">-->
<!--       <div style="margin: auto; margin-left: 10px;">SG<input type="checkbox" v-model="dataprocessconfig.useSG" ></div>-->
<!--        <div style="margin: auto; margin-left: 10px;"> HighPass<input type="checkbox" v-model="dataprocessconfig.usehighpass" ></div>-->
<!--      </b-input-group>-->
      <b-input-group prepend="平均次数" size="sm" style="width: 100%">
        <b-form-input type="number" v-model="caijiavgNumber" :change="onshuttimechange(ShutterTime[0])"></b-form-input>
        <b-input-group-append>

        </b-input-group-append>
      </b-input-group>
      <b-input-group prepend="滤波" size="sm">
              <div style="margin: auto; margin-left: 10px;">SG<input type="checkbox" v-model="dataprocessconfig.useSG" ></div>
       <div style="margin: auto; margin-left: 10px;"> HighPass<input type="checkbox" v-model="dataprocessconfig.usehighpass" ></div>
        <!-- <div style="margin: auto; margin-left: 10px;"><input type="checkbox" v-model="dataprocessconfig.useSG" ></div>
        <div style="margin: auto; margin-left: 10px;"><input type="checkbox" v-model="dataprocessconfig.usehighpass" ></div> -->
      </b-input-group>
      <b-input-group  prepend="开始时间" size="sm">
        <b-form-input type="time" v-model="Dispatcher.begin" :disabled="!Dispatcher.isenable"></b-form-input>
        <b-input-group-append>
         <div style="margin: auto; margin-left: 10px;"><input type="checkbox" v-model="Dispatcher.isenable" ></div>
        </b-input-group-append>
        
      </b-input-group>
      <b-input-group  prepend="结束时间" size="sm">
        <b-form-input type="time" v-model="Dispatcher.end" :disabled="!Dispatcher.isenable"></b-form-input>

        </b-input-group>



      <b-button @click="saveconfig" variant="light" size="sm">保存</b-button>
    </BAccordionItem>
    <BAccordionItem title="控制" visible >


      <b-input-group append="ms" v-if="Devinfo.work_mode=='advanced_mode'"
                     style="margin-bottom: 2px;width: 100%;margin-left: auto;margin-right: auto" size="sm">
        <b-input-group-prepend>
          <b-button style="min-width:80px" :disabled="iscollecting || !SerialInfo.isopen" @click="Dingbiao_OPT">OPT
          </b-button>
        </b-input-group-prepend>
        <b-form-input v-model="ShutterTime[0]" type="text" :disabled="iscollecting || !SerialInfo.isopen"
                      v-show="caijidirection!='DOWN'" :change="onshuttimechange(ShutterTime[0])"></b-form-input>
        <b-form-input v-model="ShutterTime[1]" type="text" :disabled="iscollecting || !SerialInfo.isopen"
                      v-show="caijidirection=='DOWN'||caijidirection=='ALL'" ></b-form-input>

      </b-input-group>
      
      <b-input-group style="margin-bottom: 2px;width: 100%;margin-left: auto;margin-right: auto" size="sm">


        <b-button @click="GetoneData" :disabled="iscollecting || !SerialInfo.isopen" style="min-width:80px">
          快速展示
<!--          单次采集-->
        </b-button>
<!--        <select  v-model="caijidirection" v-if="Devinfo.work_mode=='advanced_mode'"  :disabled="iscollecting || !SerialInfo.isopen"-->
<!--                 style="margin-left: auto;margin-right: auto;padding:0px">-->
<!--          <option value="UP">UP</option>-->
<!--          <option value="DOWN">DOWN</option>-->
<!--          <option value="DARK">DARK</option>-->
<!--          <option value="ALL">ALL</option>-->
<!--        </select>-->

        <b-form-select v-model="caijidirection" v-if="Devinfo.work_mode=='advanced_mode'"
                       :disabled="iscollecting || !SerialInfo.isopen"
                        style="padding-right: 8px">
          <b-form-select-option value="UP">{{ UPStr }} </b-form-select-option>
          <b-form-select-option value="DOWN" v-if="Devinfo.sensor_type=='IRIS-IS11'" >{{ DOWNStr }}</b-form-select-option>
          <b-form-select-option value="DARK" v-if="Devinfo.sensor_type=='IRIS-IS11'">DARK</b-form-select-option>
          <b-form-select-option value="ALL" v-if="Devinfo.sensor_type=='IRIS-IS11'">ALL</b-form-select-option>
          <b-form-select-option value="RAD_UP">RAD_UP</b-form-select-option>
          <!-- <b-form-select-option value="RAD_UP" v-if="Devinfo.sensor_type=='IRIS-IS11'">RAD_UP</b-form-select-option> -->
          <b-form-select-option value="RAD_DOWN" v-if="Devinfo.sensor_type=='IRIS-IS11'">RAD_DOWN</b-form-select-option>
          <b-form-select-option value="REF" v-if="Devinfo.sensor_type=='IRIS-IS11'">REF</b-form-select-option>

        </b-form-select>
        <b-input-group-prepend is-text style="padding: 0px;padding-right: 6px;padding-left: 10px" v-if="Devinfo.work_mode=='advanced_mode'" >
          <div style="font-size:8px;margin: 0px;padding: 0px;position: relative;top:0px" ><div>R_D</div>
            <input type="checkbox"  style="height: 12px;width: 12px" v-model="autoremovedark"/>
          </div></b-input-group-prepend>

      </b-input-group>

      <b-input-group append=" 次" style="margin-bottom: 2px;width: 100%;margin-left: auto;margin-right: auto" size="sm">
        <b-input-group-prepend>
          <b-button @click="ContinueCelect(cajitimes)" :disabled="iscollecting || !SerialInfo.isopen"
                    style="min-width:80px">
            采集数据
<!--            连续采集-->
          </b-button>
        </b-input-group-prepend>

        <b-form-input v-model="cajitimes" type="number" :disabled="iscollecting || !SerialInfo.isopen"></b-form-input>

        



      </b-input-group>

      <b-input-group style="margin-bottom: 2px;width: 100%;margin-left: auto;margin-right: auto;align-items: center;" size="sm" >
    
          <b-button @click="ContinueCelect(-1)" :disabled="iscollecting || !SerialInfo.isopen"
                    style="min-width:60%;margin: auto;" v-show="!continuecaiji">
            连续
<!--            连续采集-->
          </b-button>
          <b-button @click="ContinueCelect(-1)" :disabled=" !SerialInfo.isopen"
                    style="min-width:60%;margin: auto;" v-show="continuecaiji">
            停止
<!--            连续采集-->
          </b-button>
          <b-input-group-append>
            保存<input type="checkbox" style="margin: 10px" v-model="continuessave" :disabled="continuecaiji"/>
            </b-input-group-append> 
        

        



      </b-input-group>


      <b-input-group  append="秒" size="sm"  style="margin-bottom: 5px">
        <b-input-group-prepend style="margin-bottom: 2px;width: 100%;margin-left: auto;margin-right: auto">
          <b-input-group-text style="min-width:80px">保存间隔</b-input-group-text>
        </b-input-group-prepend>
        <b-form-input type="number" v-model="cajitimesjiange" :disabled="iscollecting || !SerialInfo.isopen"></b-form-input>
      </b-input-group>

    <!-- </BAccordionItem>
    <BAccordionItem title="保存配置"   > -->
      <div>
        <b-input-group  size="sm" style="margin-bottom: 5px">
          <b-input-group-text style="min-width:80px">重 采 样</b-input-group-text>
          <b-form-input type="number" max="10" min="0.05" step="0.05" v-model="outputconfig.ChongCaiyanginterval"></b-form-input>
          <b-input-group-append>
            <input type="checkbox" style="margin: 10px" v-model="outputconfig.isChongCaiyang"/>
          </b-input-group-append>
        </b-input-group>
        <!--        <b-button @click="closemain" id="closecome" variant="light"  >退出</b-button>-->
        <b-input-group size="sm" style="width: 100% ;margin-bottom: 5px" >
          <b-input-group-text style="min-width:80px">保存名称</b-input-group-text>
          <b-form-input type="text" v-model="Filename" :update="filenamechange()"></b-form-input>
          <div></div>
          <b-input-group-append>
            <div style="width: 30px;margin-top: 5px;">
            {{ nowNumber }}
          </div>
          </b-input-group-append>
        </b-input-group>


        <b-input-group  size="sm">
          <b-input-group-text style="min-width:80px">保存路径</b-input-group-text>
          <b-form-input type="text" v-model="Pathtosave"></b-form-input>
          <b-input-group-append>
            <b-button @click="choosesavepath">...</b-button>
          </b-input-group-append>
        </b-input-group>
      


      </div>

    </BAccordionItem>



  </BAccordion>

<!--  <VueDragResize :isActive="true"  :h="10">-->
<!--    -->
<!--  </VueDragResize>-->

    <div class="buttom">

      <b-button-group size="sm" style="width: 100%">

        <BDropdown dropup :text="Comname" :variant="cssme.comportvariant" class="me-2" size="sm"
                   style="max-width: 30%; --bs-dropdown-min-width: 30%;font-size: xx-small" id="selectitem">
        <BFormInput v-model="inputValue" @keydown.enter.prevent="addOption" @click.stop size="sm"
                  placeholder="手动输入" style="font-size: xx-small; margin-bottom: 5px;" />


          <BDropdownItem v-for="item in options" @click="Comname=item.value" style=" --bs-dropdown-min-width: 10px;"
                         variant="success" size="sm">
           {{ item.label }}
          </BDropdownItem>
        </BDropdown>


        <BButton @click="initserialport" id="opencom" :variant="buttoncolor.opencombutton" size="sm"
                 style="font-size: xx-small;max-width: 30%;">打开串口
        </BButton>

        <BButton @click="closecomport" id="closecomeside" variant="light" size="sm"
                 style="font-size: xx-small;max-width: 30%;">关闭串口
        </BButton>

      </b-button-group>

    </div>




    <div class="Devinfo" >

<!--      <mycard v-if="datainfoup.hasrecive" :datatoshow="datainfoup" style="margin-bottom: 2px"></mycard>-->
<!--      <mycard v-if="datainfodown.hasrecive" :datatoshow="datainfodown" style="margin-bottom: 2px"></mycard>-->
<!--     // <mycard v-show="SerialInfo.isopen" :datatoshow="devinfoshow"></mycard>-->
    </div>

<!--  <Draggable style=" position: fixed; bottom: 120px;left: 0px;min-width: 14vw" >-->
<!--    <div style=" z-index: 10; " >-->
<!--      <mycard v-if="datainfoup.hasrecive" :datatoshow="datainfoup" style="margin-bottom: 2px"></mycard>-->
<!--    </div>-->
<!--  </Draggable>-->
<!--  <Draggable style=" position: fixed; bottom: 80px;left: 0px; min-width: 14vw" >-->
<!--    <div style=" z-index: 10; " >-->
<!--      <mycard v-if="datainfodown.hasrecive" :datatoshow="datainfodown" style="margin-bottom: 2px"></mycard>-->
<!--    </div>-->
<!--  </Draggable>-->


  <Draggable style=" position: fixed; bottom: 40px;left: 0px;min-width: 14vw" >

    <div style=" z-index: 10; " >
      <mycard v-if="datainfoup.hasrecive" :datatoshow="datainfoup" style="margin-bottom: 2px"></mycard>
      <mycard v-if="datainfodown.hasrecive" :datatoshow="datainfodown" style="margin-bottom: 2px"></mycard>
    <mycard v-show="SerialInfo.isopen" :datatoshow="devinfoshow"></mycard>
    </div>

  </Draggable>



</template>

<style scoped>

.buttom {
  position: absolute;
  bottom: 20px;
  left: 20px;
  height: 20px;
  width: 95%;
}

.Devinfo {
  position: absolute;
  bottom: 40px;
  left: 0px;
  width: 100%;

  user-select: none;


}

.devinfolist {
  text-align: left;
}

el-option {
  font-size: 5px;
}

.dropdown-menu {
  --bs-dropdown-min-width: 10rem;
}

:root {
  --bs-dropdown-min-width: 100px; /* 设置下拉菜单的最小宽度为200px */
  user-select: none;
}

.bAccordionme {
  user-select: none;
  radio: 0px;
}


</style>
