<template>
  <div>
    <el-dialog
        :model-value="modelValue"
        title="WCS调用其他系统记录详情"
        @close="() => $emit('update:modelValue', false)"
    >
      <el-form label-position="left" label-width="120px">
        <el-form-item label="请求ID：">
          <el-input class="showInput" v-model="apiData.requestId"/>
        </el-form-item>
        <el-form-item label="请求Url：">
          <el-input class="showInput" v-model="apiData.requestUrl"/>
        </el-form-item>
        <el-form-item label="是否成功：">
          <el-input class="showInput" v-model="apiData.isSuccess"/>
        </el-form-item>
        <el-form-item label="请求方法：">
          <el-input class="showInput" v-model="apiData.requestMethod"/>
        </el-form-item>
        <el-form-item label="请求时间：">
          <el-input class="showInput" v-model="apiData.requestTime"/>
        </el-form-item>
        <el-form-item label="响应时间：">
          <el-input class="showInput" v-model="apiData.responseTime"/>
        </el-form-item>
        <el-form-item label="耗时（ms）：">
          <el-input class="showInput" v-model="apiData.useTime"/>
        </el-form-item>
        <el-form-item label="请求信息：">
          <el-input class="showInput" v-model="apiData.requestMsg"
                    :autosize="{ minRows: 3, maxRows: 20 }"
                    type="textarea"/>
        </el-form-item>
        <el-form-item label="响应信息：">
          <el-input class="showInput" v-model="apiData.responseMsg"
                    :autosize="{ minRows: 3, maxRows: 20 }"
                    type="textarea"/>
        </el-form-item>
        <el-form-item label="异常信息：">
          <el-input class="showInput" v-model="apiData.errMsg"
                    :autosize="{ minRows: 3, maxRows: 20 }"
                    type="textarea"/>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="danger" @click="$emit('update:modelValue', false)">关闭窗口</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
// import  《组件名称》  from '《组件路径》 ';

export default {
  // import 引入的组件需要注入到对象中才能使用
  components: {},
  props: ['modelValue', 'apiData'],
  emits: ['update:modelValue'],
  data() {
    // 这里存放数据
    return {}
  },
  // 计算属性 类似于 data 概念
  computed: {},
  // 监控 data 中的数据变化
  watch: {},
  // 方法集合
  methods: {},
  // 组合式 API
  setup() {
  },
  // 创建之前
  beforeCreate() {
  },
  // 创建完成(可以访问 this 实例)
  created() {
  },
  // 生命周期 - 挂载之前
  beforeMount() {
  },
  // 生命周期 - 挂载完成（可以访问 DOM 元素）
  mounted() {
  },
  // 更新之前
  beforeUpdate() {
  },
  // 更新之后
  updated() {
  },
  // 销毁之前
  beforeUnmount() {
  },
  // 销毁完成
  unmounted() {
  }
}
</script>

<style scoped>

</style>