<template>
  <div id="testpaper">
    <div class="card">
      <el-card shadow="hover">
        <Radio
          v-if="Data.type=='radio'"
          :Data="Data"
          :State="State"
        />
        <Checkbox
          v-if="Data.type=='checkbox'"
          :Data="Data"
          :State="State"
        />
        <Input
          v-if="Data.type=='input'"
          :Data="Data"
          :State="State"
        />
        <Bool
          v-if="Data.type=='bool'"
          :Data="Data"
          :State="State"
        />
      </el-card>
    </div>
  </div>
</template>
<script>
const Radio = () => import("@/components/WTestPaper/components/radio");
const Checkbox = () => import("@/components/WTestPaper/components/checkbox");
const Input = () => import("@/components/WTestPaper/components/input");
const Bool = () => import("@/components/WTestPaper/components/bool");
const SelectCircle = () => import("@/components/SelectCircle/index");
export default {
  components: {
    Radio, Checkbox, Input, Bool, SelectCircle
  },
  props: {
    //状态  答题 查看答案
    State: {
      type: Boolean,
      default: false
    },
    // 题
    Data: {
      type: Object,
      default: {}
    },
    // 总题数
    Total: {
      type: Number / String,
      default: 1
    },
    // 计时器
    Timer: {
      type: Number / String,
      default: 0,
    },
    // 未做题目
    Unselected: {
      type: Number / String,
      default: 0
    },
    // 答题卡
    StateData: {
      type: Array,
      default: function () {
        return [];
      }
    },
  },
  data () {
    return {
      value: null,//答题的值
      timer_msg: '',//计时器
      A: false, B: false,
      dialogVisible: false,//对话框,
      dialog_msg: "",
    }
  },
  created () {

  },
  mounted () {
  },
  methods: {

  },
  watch: {
    Data (val, oldval) {
      val.id == 1 ? this.A = true : this.A = false;
      val.id == this.Total ? this.B = true : this.B = false;
      this.value = [];
    }
  }

}
</script>
<style lang="less" scoped>
#testpaper {
  display: flex;
  .card {
    width: 100%;
    box-sizing: border-box;
  }
  .list {
    width: 300px;
    margin-left: 20px;
  }

  .exam-card {
    h3 {
      margin-top: 0;
    }
    .el-button {
      margin-top: 10px;
      width: 100%;
    }
  }
}
</style>