<template>
  <el-form :inline="true" :model="formInline" label-position="top" class="form-inline">
    <div style="display: flex;flex-direction: column;height: 86vh">
      <div style="flex-grow: 1;">
        <div class="disposition-title">提示音配置</div>
        <el-row :gutter="20">
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">正点值班时间提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">仪器检定证提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">自动编发报文声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">传感器故障提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">正点值班时间提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">仪器检定证提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">自动编发报文声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item style="width: 250px">
              <el-checkbox v-model="formInline.checkboxValue">传感器故障提醒声音选择</el-checkbox>
              <el-select v-model="formInline.region">
                <el-option label="传感器故障.wav" value="1"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="disposition-title">全局策略配置</div>
        <el-row :gutter="20">
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">能见度</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">大气电场</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">能见度</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">气温</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">湿度</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">雨量</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="10">
            <el-form-item>
              <el-checkbox v-model="formInline.checkboxValue">云低</el-checkbox>
              <el-input v-model="formInline.user" placeholder="请输入告警条件"></el-input>
              <el-input v-model="formInline.user" placeholder="请输入消警条件" style="margin-top: 10px"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <div class="disposition-bottom">
        <el-button > 重置 </el-button>
        <el-button type="primary"> 确定 </el-button>
      </div>
    </div>
  </el-form>
</template>

<script setup lang="tsx">
import {ref} from "vue";

const formInline = ref<any>({
  user:"",
  region:"",
  checkboxValue:false
})
</script>

<style scoped>
</style>
