<template>
  <app-dialog v-model="visible" :loading="loading" :title="title" append-to-body class="detail-dialog" width="700px" @cancel="onCancel" @confirm="onCancel">
    <el-form ref="form" :disabled="disabled" :model="form" label-width="180px">
      <el-row :gutter="15">
        <app-filter-item :span="24" label="调用方名称:" prop="consumerName">
          <!--          <el-input v-model="form.consumerName" />-->
          <span>{{ form.consumerName }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用方系统名称:" prop="appName">
          <span>{{ form.appName }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用方编码:" prop="appName">
          <span>{{ form.appName }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用访问的资源名称:" prop="consumerCode">
          <span>{{ form.consumerCode }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用访问的资源编码:" prop="resourceCode">
          <span>{{ form.resourceCode }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用访问的接口名称:" prop="apiName">
          <span>{{ form.apiName }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="调用访问的接口地址:" prop="apiUrl">
          <span>{{ form.apiUrl }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="请求返回数据量:" prop="responseNum">
          <span>{{ form.responseNum }}</span>
        </app-filter-item>
        <app-filter-item :span="24" label="返回的参数信息:" prop="responseResult">
          <span class="divider">{{ form.responseResult }}</span>
        </app-filter-item>

        <app-filter-item :span="24" label="请求访问状态:" prop="requestStatus">
          <!--          <span>{{ form.requestStatus }}</span>-->
          <el-radio-group v-model="form.requestStatus">
            <el-radio-button v-for="radio in tableNameList" :key="radio.value" :label="radio.value">{{ radio.label }} </el-radio-button>
          </el-radio-group>
        </app-filter-item>
      </el-row>
    </el-form>
  </app-dialog>
</template>

<script>
import dialogMixin from '@/mixins/dialog.js';

export default {
  companyName: 'CompanyDialog',
  mixins: [dialogMixin],
  props: {
    selectedRows: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {
      disabled: true,
      form: {
        sourceType: '1',
      },
      tableNameList: [
        { label: '成功', value: 1 },
        { label: '失败', value: 0 },
      ],
      loading: false,
    };
  },
  mounted() {},
  methods: {
    /**
     * @description: dialog每次显示时触发的init方法
     * @param {*} data 传入data
     * @return {*}
     */
    initData(data) {
      const orgForm = this.$options.data().form;
      this.form = { ...orgForm, ...data };
      this.$nextTick(() => {
        this.$refs.form.clearValidate();
      });
    },
    // 取消       confirm 确定
    onCancel() {
      this.visible = false;
    },
  },
};
</script>

<style lang="scss" scoped>
.divider {
  display: inline-block;
  //border: solid 0.5px #e0e0e0;
  max-height: 80px;
  overflow-y: auto;
}
</style>
