<!-- 性诱测报控制 -->
<template>
  <div class=''>
    <div class="equipId">设备ID：{{equipId}}</div>
    <el-form ref="equipContrlRef" label-position="top" :model="setFrom" label-width="180px">
        <el-form-item label="载玻片滴液时间(s): " prop="drop_time">
          <el-select v-model="setFrom.drop_time">
            <el-option
              v-for="item in 30"
              :key="item"
              :label="item"
              :value="item"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="孢子培养时间(h): " prop="cul_time">
          <div class="sliderParent">
            <div class="block">
              <el-slider
                v-model="setFrom.cul_time"
                show-input
                :min="1"
                :max="24"
              ></el-slider>
            </div>
          </div>
        </el-form-item>
        <el-form-item label="保温仓设定温度(℃): " prop="set_temp">
          <div class="sliderParent">
            <div class="block">
              <el-slider
                v-model="setFrom.set_temp"
                show-input
                :min="10"
                :max="40"
              ></el-slider>
            </div>
          </div>
        </el-form-item>
        <el-form-item label="数据上传时间间隔(min): " prop="datt">
          <div class="sliderParent">
            <div class="block">
              <el-slider
                v-model="setFrom.datt"
                show-input
                :min="10"
                :max="60"
              ></el-slider>
            </div>
          </div>
        </el-form-item>
        <el-form-item label="采集开启和关闭时间: ">
          <div class="timeSet">
            <el-time-select
              placeholder="起始时间"
              v-model="coll_time.time01"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
              }"
            ></el-time-select>
            <span>至</span>
            <el-time-select
              placeholder="结束时间"
              v-model="coll_time.time02"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
                minTime: coll_time.time01,
              }"
            ></el-time-select>
          </div>
          <div class="timeSet">
            <el-time-select
              placeholder="起始时间"
              v-model="coll_time.time03"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
                minTime: coll_time.time02,
              }"
            ></el-time-select>
            <span>至</span>
            <el-time-select
              placeholder="结束时间"
              v-model="coll_time.time04"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
                minTime: coll_time.time03,
              }"
            ></el-time-select>
          </div>
          <div class="timeSet">
            <el-time-select
              placeholder="起始时间"
              v-model="coll_time.time05"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
                minTime: coll_time.time04,
              }"
            ></el-time-select>
            <span>至</span>
            <el-time-select
              placeholder="结束时间"
              v-model="coll_time.time06"
              :picker-options="{
                start: '01:00',
                step: '1:00',
                end: '24:00',
                minTime: coll_time.time05,
              }"
            ></el-time-select>
          </div>
        </el-form-item>
        <el-form-item class="handAddFormBtn">
            <el-button
              type="blueInfo"
              size="small"
              @click="equipSetSubm()"
              >确定</el-button
            >
            <el-button type="grayInfo" size="small" @click="resetForm()"
              >取消</el-button
            >
          </el-form-item>
      </el-form>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

export default {
props: ["equipId", "equipType","d_id","model"],
//import引入的组件需要注入到对象中才能使用
components: {},
data() {
//这里存放数据
return {
  setFrom: {
    drop_time: "1", //载玻片滴液时间
    imgres: "0", //图片上传分辨率
    cul_time: 0, //孢子培养时间
    set_temp: 0, //保温仓设定温度
    datt: 0, //数据上传时间间隔(h)-m
    coll_time: [], //采集开启和关闭时间
  },
  coll_time: {
    time01: "",
    time02: "",
    time03: "",
    time04: "",
    time05: "",
    time06: "",
  },
  equipContrlForm2: "{}",
};
},
//监听属性 类似于data概念
computed: {},
//监控data中的数据变化
watch: {},
//方法集合
methods: {
  //设备控制
  equipSet() {
    this.$axios({
      method: "POST",
      url:"/api/api_gateway?method=forecast.send_control.device_control_info",
      data: this.qs.stringify({ d_id:this.d_id, cmd: "paramconf" }),
    }).then((res) => {
      if (res.data.data && Object.keys(res.data.data).length > 0) {
        let data = res.data.data;
        this.setFrom = data;
        this.equipContrlForm2 = JSON.stringify(data)
        let { coll_time } = this.setFrom;
        for (let i in coll_time) {
          if (i == 0) {
            let arr = coll_time[i].split("-");
            this.coll_time.time01 =
              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
            this.coll_time.time02 =
              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
          } else if (i == 1) {
            let arr = coll_time[i].split("-");
            this.coll_time.time03 =
              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
            this.coll_time.time04 =
              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
          } else if (i == 2) {
            let arr = coll_time[i].split("-");
            this.coll_time.time05 =
              Number(arr[0]) < 10 ? "0" + arr[0] + ":00" : arr[0] + ":00";
            this.coll_time.time06 =
              Number(arr[1]) < 10 ? "0" + arr[1] + ":00" : arr[1] + ":00";
          }
        }
        console.log(this.coll_time);
      }
    });
  },
  equipSetSubm() {
    this.setFrom.coll_time = [];
    if (this.coll_time.time01 && this.coll_time.time02) {
      let t1 =
        this.coll_time.time01.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time01.slice(0, 2)
          : this.coll_time.time01.slice(1, 2);
      let t2 =
        this.coll_time.time02.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time02.slice(0, 2)
          : this.coll_time.time02.slice(1, 2);
      this.setFrom.coll_time.push(`${t1}-${t2}`);
    }
    if (this.coll_time.time03 && this.coll_time.time04) {
      let t1 =
        this.coll_time.time03.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time03.slice(0, 2)
          : this.coll_time.time03.slice(1, 2);
      let t2 =
        this.coll_time.time04.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time04.slice(0, 2)
          : this.coll_time.time04.slice(1, 2);
      this.setFrom.coll_time.push(`${t1}-${t2}`);
    }
    if (this.coll_time.time05 && this.coll_time.time06) {
      let t1 =
        this.coll_time.time05.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time05.slice(0, 2)
          : this.coll_time.time05.slice(1, 2);
      let t2 =
        this.coll_time.time06.slice(0, 2).charAt(0) != "0"
          ? this.coll_time.time06.slice(0, 2)
          : this.coll_time.time06.slice(1, 2);
      this.setFrom.coll_time.push(`${t1}-${t2}`);
    }
    this.$axios({
      method: "POST",
      url: "/api/api_gateway?method=forecast.send_control.device_control",
      data: this.qs.stringify({
        device_type_id: 7,
        d_id: this.d_id,
        config: JSON.stringify(this.setFrom),
      }),
    }).then((res) => {
      if (res.data.message == "") {
        this.$message.success("设备控制修改成功");
      } else {
        this.$message.err("设备控制修改失败");
      }
      this.setDialogVisible = false;
    });
  },
  resetForm() {
    if(this.equipContrlForm2){
     this.setFrom = JSON.parse(this.equipContrlForm2)
    }else{
      this.setFrom = {}
    }
  }
},
//生命周期 - 创建完成（可以访问当前this实例）
created() {

},
//生命周期 - 挂载完成（可以访问DOM元素）
mounted() {
  this.equipSet()
},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style scoped lang="less">
.equipId{
  line-height: 33px;
  text-align: center;
  background: #eee;
}
.handAddFormBtn{
  margin-top: 20px;
  text-align: right;
}
// 时间input框
/deep/.el-date-editor.el-input, 
/deep/.el-date-editor.el-input__inner{
  width: 120px;
}
.timeSet{
  margin-bottom: 13px;
}
/deep/.el-slider__input{
  width: 103px;
}
/deep/.el-input-number--small .el-input-number__decrease, /deep/.el-input-number--small .el-input-number__increase{
  width: 26px;
}
/deep/.el-slider__runway.show-input{
  margin-right: 119px;
}
</style>