<template>
  <view class="setting-funReport-funcAdd">
    <uni-forms ref="baseForm" :label-width="90" label-align="right" :modelValue="baseFormData">
      <uni-forms-item label="报备类型" required>
        <uni-data-select v-model="report_type" :localdata="report_type_select"></uni-data-select>
      </uni-forms-item>

      <view v-if="report_type == 2 || report_type == 3">
        <uni-forms-item label="设备类型" required>
          <uni-data-select v-model="device_type" :localdata="device_type_select"></uni-data-select>
        </uni-forms-item>
      </view>

      <view v-if="report_type">
        <uni-forms-item label="开始时间" required>
          <uni-datetime-picker v-model="start_time" :start="id ? '' : now" />
        </uni-forms-item>

        <uni-forms-item label="结束时间" required>
          <uni-datetime-picker v-model="end_time" :start="start_time" />
        </uni-forms-item>
      </view>

      <view v-if="report_type == 3 && device_type == 6">
        <uni-forms-item label="端口号" required>
          <uni-easyinput v-model="device_port" />
        </uni-forms-item>
        <uni-forms-item label="端口类型">
          <uni-data-select v-model="port_type" :localdata="port_type_select"></uni-data-select>
        </uni-forms-item>
      </view>

      <view v-if="report_type == 3 && device_type">
        <uni-forms-item label="报备设备">
          <uni-data-select v-model="device_code" :localdata="deviceListData"></uni-data-select>
        </uni-forms-item>
      </view>

      <uni-forms-item label="备注" v-if="report_type">
        <uni-easyinput v-model="remarks" />
      </uni-forms-item>
    </uni-forms>

    <view class="buttom">
      <button class="bg-blue round mt15" @tap="submit()">提 交</button>
    </view>
  </view>
</template>
<script setup>
import { onLoad, onShow, onReady, onHide, onLaunch, onReachBottom, onNavigationBarButtonTap } from "@dcloudio/uni-app";
import { ref, onMounted, inject, shallowRef, reactive, toRefs, watchEffect, getCurrentInstance, watch } from "vue";
import { useStores, commonStores } from "@/store/modules/index";

import { del, index } from "@/api/business/zhxf/funReport/index.js";

const useStore = useStores();

const { proxy } = getCurrentInstance();

const array = reactive({
  id: "",

  report_type: "",
  report_type_select: [
    { value: "1", text: "单位" },
    { value: "2", text: "类型" },
    { value: "3", text: "设备" },
  ],

  device_type: "",
  device_type_select: [
    { value: "1", text: "火系统" },
    { value: "2", text: "水系统" },
    { value: "3", text: "烟感系统" },
    { value: "4", text: "消防栓" },
    { value: "5", text: "液位" },
    { value: "6", text: "RTU" },
    { value: "7", text: "电气火灾" },
    { value: "16", text: "视频监控" },
    { value: "128", text: "井盖" },
    { value: "131", text: "可燃气体" },
    { value: "130", text: "门禁监测" },
    { value: "129", text: "地磁监测" },
    { value: "17", text: "电梯监测" },
  ],

  start_time: "",
  end_time: "",
  remarks: "",
  device_port: "",

  port_type: "",
  port_type_select: [
    { value: "1", text: "数字量" },
    { value: "2", text: "模拟量" },
  ],

  device_code: "",
  now: "",

  deviceListData: [],
  detailsData: "",

  // 基础表单数据
  baseFormData: {},
});

const { id, report_type, report_type_select, device_type, device_type_select, start_time, end_time, remarks, device_port, port_type, device_code, now, deviceListData, detailsData, baseFormData } =
  toRefs(array);

// 回显信息请求
function getDetailsData(params = {}) {
  const res = $myRequest({
    url: "AlarmReport/editData",
    data: params,
    showLoading: true,
  });

  detailsData.value = res.data.data[0];
  console.log(detailsData.value);
  report_type.value = detailsData.value.report_type;
  device_type.value = detailsData.value.device_type;
  start_time.value = detailsData.value.start_time;
  end_time.value = detailsData.value.end_time;
  remarks.value = detailsData.value.remarks;
  port_type.value = detailsData.value.port_type;
  device_port.value = detailsData.value.device_port;
  device_code.value = detailsData.value.device_code;
}

function submit() {
  //提交验证

  if (!report_type.value) {
    uni.showToast({
      title: "请输入报备类型",
      icon: "none",
    });
    return;
  }
  if (report_type.value == 1) {
    if (!start_time.value.replace(/^\s*/g, "")) {
      uni.showToast({
        title: "请选择开始时间",
        icon: "none",
      });
      return;
    }
    if (!end_time.value.replace(/^\s*/g, "")) {
      uni.showToast({
        title: "请选择结束时间",
        icon: "none",
      });
      return;
    }
  }
  if (report_type.value == 2 || report_type.value == 3) {
    if (!device_type.value) {
      uni.showToast({
        title: "请选择设备类型",
        icon: "none",
      });
      return;
    }
    if (!start_time.value.replace(/^\s*/g, "")) {
      uni.showToast({
        title: "请输入开始时间",
        icon: "none",
      });
      return;
    }
    if (!end_time.value.replace(/^\s*/g, "")) {
      uni.showToast({
        title: "请输入结束时间",
        icon: "none",
      });
      return;
    }
  }

  if (report_type.value == 3 && device_type.value) {
    if (device_type.value == 6) {
      if (!device_port.value.replace(/^\s*/g, "")) {
        uni.showToast({
          title: "请输入端口号",
          icon: "none",
        });
        return;
      }
      if (!port_type.value) {
        uni.showToast({
          title: "请选择端口类型",
          icon: "none",
        });
        return;
      }
      if (!device_code.value) {
        uni.showToast({
          title: "请选择报备设备",
          icon: "none",
        });
        return;
      }
    }
    if (!device_code.value) {
      uni.showToast({
        title: "请选择报备设备",
        icon: "none",
      });
      return;
    }
  }

  let queryParam = {};
  if (id.value) {
    queryParam.id = id.value;
  }
  queryParam.report_type = report_type.value;
  queryParam.company_code = uni.getStorageSync("selectedCode");
  queryParam.remarks = remarks.value;
  queryParam.start_time = start_time.value;
  queryParam.end_time = end_time.value;

  if (id.value) {
    queryParam.id = id.value;
  }

  if (report_type.value == 1) {
    addDevice(queryParam);
    return;
  }
  if (report_type.value == 2) {
    queryParam.device_type = device_type.value;
    addDevice(queryParam);
    return;
  }
  if (report_type.value == 3) {
    queryParam.device_type = device_type.value;
    if (device_type.value == 6) {
      queryParam.port_type = port_type.value;
      queryParam.device_port = device_port.value;
    }
    queryParam.device_code = device_code.value;
    addDevice(queryParam);
    return;
  }

  addDevice(queryParam);
}

function addDevice(params = {}) {
  const res = $myRequest({
    url: id.value ? "AlarmReport/edit" : "AlarmReport/add",
    data: params,
  });

  if (!res.data.flag) {
    uni.showToast({
      title: "提交失败",
      icon: "none",
    });
  } else {
    uni.showToast({
      title: "提交成功",
    });
  }
  setTimeout(() => {
    uni.redirectTo({
      url: "/pages/business/zhxf/funReport/index",
    });
  }, 1000);
}

function radioChange(e) {
  console.log("type:" + e.detail.value);
  radioOne.value = e.detail.value;
}

//报备设备下拉请求数据
function deviceList(params = {}) {
  const res = $myRequest({
    url: "AlarmReport/deviceList",
    data: params,
  });
  deviceListData.value = res.data.data;

  var arr = [];
  deviceListData.value.forEach(function (item) {
    arr.push(item.owner_code);
  });
  if (arr.indexOf(device_code.value) == -1) {
    device_code.value = "";
  }
}

onLoad((option) => {
  id.value = option.id;
  uni.setNavigationBarTitle({
    title: option.id ? "编辑" : "新增",
  });

  var nowTemp = new Date();
  now.value = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

  if (option.id) {
    getDetailsData({ id: option.id });
  }
});

onReady(() => {
  //调用系统主题颜色
  proxy.$settingStore.systemThemeColor([1]);
});

watch(
  () => report_type.value,
  (newVal) => {
    if (newVal) {
      var array123 = ["", "1", "2", "3", "4", "5", "6", "7", "16", "128", "131", "130", "129", "17"];
      if (array123.indexOf(device_type.value) == -1) {
        device_type.value = "";
      }
    }
  }
);

watch(
  () => device_type.value,
  (newVal) => {
    if (newVal) {
      deviceList({
        company_code: uni.getStorageSync("selectedCode"),
        device_type: device_type.value,
      });
    }
  }
);
</script>

<style lang="scss" scoped>
.setting-funReport-funcAdd {
  position: relative;
  height: 100%;
  padding: 10px;
  overflow: scroll;
  background: #fff;
}
</style>
