<template>
  <div>
    <el-form>
      <el-row :gutter="20" class="el-row" type="flex" align="middle">
        <el-col :span="24" class="el-col" style="margin-left: 20px">
          <div>
            <el-radio-group v-model="inputDetailQuery.fromType" :disabled="!inputDetailQuery.enabled"
                            style="margin-right: 20px" @change="agreeChange">
              <el-radio-button :label="0" size="mini" disabled>接口实时获取</el-radio-button>
              <el-radio-button :label="3" size="mini">接口方式</el-radio-button>
              <el-radio-button :label="2" size="mini" disabled>第三方上传缓存</el-radio-button>
              <el-radio-button :label="1" size="mini">文件方式</el-radio-button>

            </el-radio-group>
            <!--<el-checkbox :disabled="inputDetailQuery.fromType!=0 || !inputDetailQuery.enabled"-->
            <!--v-model="inputDetailQuery.itrCache">是否启用接口缓存-->
            <!--</el-checkbox>-->
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="20" class="el-row" type="flex" align="middle" style="margin-top: 25px">
        <el-col :span="24" class="el-col">
          <el-form-item label-width="100px" label="接口名称">
            <el-input
                style="width: 80%"
                splaceholder="请输入内容"
                :disabled="true"
                v-model="inputDetailQuery.name"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20" class="el-row" type="flex" align="middle">
        <el-col :span="24" class="el-col">
          <el-form-item label-width="100px" label="接口地址">
            <el-input
                style="width: 80%"
                splaceholder="请输入内容"
                v-model="inputDetailQuery.value"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row v-if="inputDetailQuery.fromType === 3" :gutter="20" class="el-row" type="flex" align="middle">
        <el-col :span="24" class="el-col">
          <el-form-item label-width="100px" label="请求时间">
            <el-input
              style="width: 80%"
              splaceholder="请输入请求时间 单位：分钟"
              type="number"
              min="0"
              v-model="inputDetailQuery.time"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20" class="el-row" type="flex" align="middle">
        <el-col :span="24" class="el-col">
          <el-form-item label-width="100px" label="备注说明">
            <el-input
                style="width: 80%"
                splaceholder="请输入内容"
                type="textarea"
                row="3"
                v-model="inputDetailQuery.remark"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "inputDetailQuery",
  props: {
    inputDetailQuery: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      temp: null,
    }
  },
  methods: {
    agreeChange() {
      this.$confirm('请咨询系统技术支持方，否则可能导致基础数据缺失，系统无法正常运行。是否继续', '提示', {
        confirmButtonText: '确定',
        type: 'warning'
      }).then(() => {

        this.temp = this.inputDetailQuery.fromType;
      }).catch(() => {
        this.inputDetailQuery.fromType = this.temp;
      });
    },
  },
  created() {
    this.temp = this.inputDetailQuery.fromType;
  },
};
</script>
<style scoped>

</style>
