
<template>
  <div v-if="data">
    <template v-for="(item, index) in data">
      <div v-if="item.type == 'end'" :key="item.label">
        <limitEnd :rule="item" @submitAns="submitAns"></limitEnd>
      </div>
      <div v-if="item.type == 'select'" :key="item.label">
        <el-form-item
          :label="item.label ? item.label : ''"
          :rules="[{ required: true, message: '请选择', trigger: 'change' }]"
        >
          <el-select
            v-model="item.ans"
            placeholder="请选择"
            @change="changeSelect(index)"
          >
            <el-option
              v-for="(option, option_index) in item.content"
              :key="option.label"
              :label="option.label"
              :value="option_index"
            ></el-option>
          </el-select>
        </el-form-item>
        <template v-if="item.child">
          <limitLevel
            :rule="item.child"
            :moIndex="item.index"
            @submitAns="submitAns"
          ></limitLevel>
        </template>
      </div>
    </template>
  </div>
</template>
<script>
import limitEnd from "./LimitEnd";
export default {
  name: "LimitLevel",
  components: {
    limitEnd,
  },
  data() {
    return {
      data: null,
      value_index: null,
      value: null,
      child: null,
    };
  },
  props: {
    data: {
      type: Array,
      required: true,
      default: null,
    },
    moIndex: {
      type: Number,
      required: true,
      default: null,
    },
  },
  created() {
    console.log(222)
    this.fileList = this.list;
  },
  watch: {
    $route() {
      console.log(2222)
    }
},
  methods: {
    changeSelect(index) {
      this.$set(this.data[index], "child", null);

      this.$nextTick(() => {
        let ans = this.data[index].ans;
        let option = this.data[index].content[ans];
        this.$set(this.data[index], "child", option.children);
        this.$set(this.data[index], "index", index);
      });
    },
    judgeAnsIsNull(item, label) {
      if (!item && item != 0) {
        this.$message({
          type: "error",
          message: "请填写" + label,
        });

        return false;
      }
      return true;
    },
    submitAns(data, des, all_data, mo_index) {
      let ans = null;
      let label = "";

      if (mo_index || mo_index == 0) {
        this.$set(this.data[mo_index], "child", all_data);
      }

      if (data) {
        ans = deepClone(data);
      } else {
        ans = {};
      }

      for (let i = 0; i < this.data.length; i++) {
        // 没有答案，提醒填写
        if (this.data[i].type == "end") {
          continue;
        }

        switch (this.data[i].type) {
          case "end":
            break;

          case "select":
            this.judgeAnsIsNull(this.data[i].ans, this.data[i].label);
            let index = this.data[i].ans;
            let option = this.data[i].content[index];
            ans[this.data[i].name] = option.value;
            label += " " + option.label;
            break;

          default:
            break;
        }
      }

      this.$emit("submitAns", ans, label + " " + des, this.data, this.moIndex);
    },
  },
};
