<template>
  <div id="inforsPoint">
    <el-form ref="ruleForm" :model="form" label-width="150px" :rules="rules" :inline="true" :label-position="'left'">
      <div v-for="item in InforsList" :key="item.InfoPointCode" style="width:50%;float:left;">
        <el-form-item :label="item.InfoPointName" :prop="item.InfoPointCode" v-if="all||item.Visible"
          :class="{FloorTypeSelect:item.InputMode == 'D1'||item.Unit}">
          <el-input v-model="form[item.Path]" v-if="item.InputMode == 'B1'"></el-input>
          <el-input v-model="form[item.Path]" v-else-if="item.InputMode == 'A1'||item.InputMode == 'A2'" type="number">
            <template slot="append" v-if="item.Unit">{{item.Unit}}</template>
          </el-input>
          <el-select v-model="form[item.Path]" placeholder="请选择" v-else-if="item.InputMode == 'D1'">
            <el-option v-for="op in item.options" :key="op.Code" :label="op.Name" :value="op.Code"></el-option>
          </el-select>
          <el-input v-model="form[item.Path]"
            v-else-if="item.InputMode == 'L'||item.InputMode == 'L1'||item.InputMode == 'L2'||item.InputMode == 'M'">
            <template slot="append" v-if="item.Unit">{{item.Unit}}</template>
          </el-input>
          <el-input v-model="form[item.Path]" v-else disabled title="暂不支持"></el-input>
        </el-form-item>
      </div>
    </el-form>
  </div>
</template>
<script>
import { getDataDictionary } from "@/api/scan/request";

//  v-for="item in InforsList" :key="item.InfoPointCode"
export default {
  props: {
    type: {
      default: 'Floor'
    }
  },
  data() {
    return {
      form: {},
      InforsList: [],
      all: true, // 默认显示全部
      rules: {
        "FloorLocalName": [
          { "required": true, "message": "请输入楼层本地名称", "trigger": "blur" }
        ],
        "FloorSequenceID": [
          { "required": true, "message": "请输入楼层顺序号", "trigger": "blur" }
        ]
      }
    };
  },
  created() {
    this.getInforsPoint()
  },
  methods: {
    getInforsPoint() {
      let params = {
        data: {
          Orders: "sort asc,InfoPointCode asc",
          PageNumber: 1,
          PageSize: 50
        },
        type: this.type
      };
      getDataDictionary(params, res => {
        this.InforsList = res.Content.map(item => {
          if (item.InputMode === 'D1') {
            item.options = JSON.parse(item.DataSource)
          }
          return item
        })
      })
    },
    submitForm(call) {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          call()
        } else {
          return false;
        }
      });
    },
  }
};
</script>
<style lang="scss" scoped>
#inforsPoint {
  .el-form-item {
    /deep/ label.el-form-item__label {
      font-size: 12px;
    }
  }
  /deep/ .FloorTypeSelect .el-form-item__content {
    width: 200px;
  }
}
</style>
