<template>
  <view class="content">
    <view class="card">
      <u-form labelPosition="left" :model="form" :rules="rules" ref="formRef" labelWidth="140px">
        <block v-if="GAS_NAME1">
          <u-form-item :label="GAS_NAME1" prop="GAS_NAME1" borderBottom>
            <u-input v-model="form.DATA1" border="none"/>
          </u-form-item>
        </block>
        <block v-if="GAS_NAME2">
          <u-form-item :label="GAS_NAME2" prop="GAS_NAME1" borderBottom>
            <u-input v-model="form.DATA2" border="none"/>
          </u-form-item>
        </block>
        <block v-if="GAS_NAME3">
          <u-form-item :label="GAS_NAME3" prop="GAS_NAME1" borderBottom>
            <u-input v-model="form.DATA3" border="none"/>
          </u-form-item>
        </block>
        <block v-if="GAS_NAME4">
          <u-form-item :label="GAS_NAME4" prop="GAS_NAME1" borderBottom>
            <u-input v-model="form.DATA4" border="none"/>
          </u-form-item>
        </block>
        <u-form-item label="取样分析时间" prop="ANALYZE_TIME" borderBottom required
                     @click="fnDateTimePickerClick('ANALYZE_TIME')">
          <u-input v-model="form.ANALYZE_TIME" border="none" readonly/>
          <u-icon name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="分析地点" prop="ANALYZE_PLACE" borderBottom required>
          <u-input v-model="form.ANALYZE_PLACE" border="none"/>
        </u-form-item>
        <u-form-item label="氧气含量" prop="OXYGEN_CONTENT" borderBottom required>
          <u-input v-model="form.OXYGEN_CONTENT" border="none"/>
        </u-form-item>
        <u-form-item label="分析人" prop="ANALYZE_USER" borderBottom>
          <u-input v-model="form.ANALYZE_USER" border="none" readonly/>
        </u-form-item>
      </u-form>
      <view class="mt-10">
        <u-button type="primary" text="保存" @click="$u.debounce(fnSubmit, 1000,true)"/>
      </view>
    </view>
    <u-datetime-picker :show="dateTimePicker.show" v-model="dateTimePicker.value" :mode="dateTimePicker.mode"
                       :maxDate="dateTimePicker.max" :key="dateTimePicker.type" @confirm="fnDateTimePickerConfirm"
                       @cancel="fnDateTimePickerCancel"/>
  </view>
</template>

<script>
import {setConfinedSpaceGasInfoSave} from "@/api";

export default {
  data() {
    return {
      form: {
        DATA1: '',
        DATA2: '',
        DATA3: '',
        DATA4: '',
        ANALYZE_TIME: '',
        ANALYZE_PLACE: '',
        OXYGEN_CONTENT: '',
        ANALYZE_USER: this.$store.getters.getUserInfo.NAME,
      },
      rules: {
        ANALYZE_TIME: [{type: 'string', required: true, message: '请选择分析时间', trigger: ['blur', 'change']}],
        ANALYZE_PLACE: [{type: 'string', required: true, message: '请输入分析部位', trigger: ['blur', 'change']}],
        OXYGEN_CONTENT: [{type: 'string', required: true, message: '请输入氧气含量', trigger: ['blur', 'change']}],
      },
      GAS_NAME1: '',
      GAS_NAME2: '',
      GAS_NAME3: '',
      GAS_NAME4: '',
      EW_RU_TASK_ID: '',
      EW_RU_JOB_ID: '',
      dateTimePicker: {
        show: false,
        value: Number(new Date()),
        max: new Date().getTime(),
        mode: 'datetime',
        type: 'datetime-picker'
      },
    }
  },
  onLoad(query) {
    this.GAS_NAME1 = query.GAS_NAME1
    this.GAS_NAME2 = query.GAS_NAME2
    this.GAS_NAME3 = query.GAS_NAME3
    this.GAS_NAME4 = query.GAS_NAME4
    this.EW_RU_TASK_ID = query.EW_RU_TASK_ID;
    this.EW_RU_JOB_ID = query.EW_RU_JOB_ID;
  },
  methods: {
    fnDateTimePickerClick(event) {
      this.dateTimePicker.type = event
      this.dateTimePicker.value = Number(new Date(this.form[event])) || Number(new Date())
      this.dateTimePicker.show = true
    },
    fnDateTimePickerConfirm(event) {
      this.form[this.dateTimePicker.type] = uni.$u.timeFormat(event.value, 'yyyy-mm-dd hh:MM')
      this.fnDateTimePickerCancel()
    },
    fnDateTimePickerCancel() {
      this.dateTimePicker.show = false
    },
    async fnSubmit() {
      try {
        await this.$refs.formRef.validate()
        try {
          for (let i = 0; i < 4; i++) {
            if (this[`GAS_NAME${i + 1}`] && !this.form[`DATA${i + 1}`]) this.form[`DATA${i + 1}`] = 0
          }
          await setConfinedSpaceGasInfoSave({
            data: {...this.form},
            EW_RU_TASK_ID: this.EW_RU_TASK_ID,
            EW_RU_JOB_ID: this.EW_RU_JOB_ID,
            postMethod: 'application/json',
          })
          uni.$u.toast('保存成功')
          setTimeout(() => {
            uni.switchTab({
              url: '/pages/index/index'
            })
          }, 2000)
        } catch {
        }
      } catch (e) {
        uni.$u.toast('请补全必填项')
      }
    }
  },
}
</script>

<style scoped lang="scss">

</style>