<template>
  <section class="settingDialog">
    <ai-dialog :visible.sync="dialog" title="基础设置" @close="$emit('visible',false)">
      <el-form ref="deviceForm" size="small" label-width="140px">
        <el-form-item label="设备名称" class="full">
          <el-input v-model="form.name" clearable placeholder="设备名称"/>
        </el-form-item>
        <el-form-item label="摄像头状态">
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="高清视频">
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="摄像头麦克风">
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="状态指示灯">
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="夜视">
          <el-radio v-model="form.status" label="自动"/>
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="旋转180°">
          <el-radio v-model="form.status" label="开启"/>
          <el-radio v-model="form.status" label="关闭"/>
        </el-form-item>
        <el-form-item label="WIFI网络" class="full">-</el-form-item>
        <el-form-item label="MAC地址">(34:75:6b:c9:10)</el-form-item>
        <el-form-item label="摄像头型号">C71</el-form-item>
        <el-form-item label="固件">20.0326.251.2486</el-form-item>
        <el-form-item label="嵌入式应用">2.3.37.8954</el-form-item>
        <el-form-item label="IMEI">110003953100302</el-form-item>
      </el-form>
    </ai-dialog>
  </section>
</template>

<script>
export default {
  name: "settingDialog",
  model: {
    prop: "visible",
    event: "visible",
  },
  props: {
    visible: Boolean,
    detail: {default: () => ({})}
  },
  data() {
    return {
      dialog: false,
      form: {}
    }
  },
  watch: {
    visible(v) {
      this.dialog = v
    }
  },
  created() {
    this.form = JSON.parse(JSON.stringify(this.form))
  }
}
</script>

<style lang="scss" scoped>
.settingDialog {
  .el-form {
    display: flex;
    flex-wrap: wrap;
  }

  :deep( .el-form-item ){
    width: 50%;

    .el-form-item__label {
      padding-right: 40px;
    }

    &.full {
      width: 100%;
    }
  }
}
</style>
