<template>
  <div>
    <h3 style="color: #1482f0">接口详情:{{api.productName}}</h3>
    <el-divider></el-divider>
    {{api}}
    <center>
      <el-form :model="api" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        <el-form-item label="序号" prop="productId" style="width: 70%">
         {{api.productId}}
        </el-form-item>
        <el-form-item label="接口名称" prop="productName" style="width: 70%">
          {{api.productName}}
        </el-form-item>
        <el-form-item label="接口类型" prop="productType" style="width: 70%">
          {{api.productType}}
        </el-form-item>
        <el-form-item label="接口描述" prop="productContent" style="width: 70%">
         {{api.productContent}}
        </el-form-item>
        <el-form-item label="接口销量" prop="productSales" style="width: 70%">
          {{api.productSales}}
        </el-form-item>
        <el-form-item label="接口价格" prop="productPrice" style="width: 70%">
          {{api.productPrice}}
        </el-form-item>
        <el-form-item label="接口来源" prop="productFrom" style="width: 70%">
          {{api.productFrom}}
        </el-form-item>
        <el-form-item label="重要路由" prop="apiRouter" style="width: 70%">
          {{api.apiRouter}}
        </el-form-item>
        <el-form-item label="接口地址" prop="apiAddress" style="width: 70%">
          {{api.apiAddress}}
        </el-form-item>
        <el-form-item label="返回格式" prop="returnFormat" style="width: 70%">
          {{api.returnFormat}}
        </el-form-item>
        <el-form-item label="请求方式" prop="requestMethod" style="width: 70%">
          {{api.requestMethod}}
        </el-form-item>



        <el-form-item>
          <el-button type="primary" @click="submitForm('ruleForm')">返回</el-button>
        </el-form-item>
      </el-form>
    </center>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
//例如：import 《组件名称》 from '《组件路径》,
  export default {
    name: "Apidetailmessage",
    //import引入的组件需要注入到对象中才能使用"
    components: {},
    props: {},
    data() {
      //这里存放数据"
      return {
        api:{}
      };
    },
    //计算属性 类似于data概念",
    computed: {},
    //监控data中的数据变化",
    watch: {},
    //方法集合",
    methods: {
      submitForm(){
        this.$router.push("/apimanage/index")
      }
    },
    //生命周期 - 创建完成（可以访问当前this实例）",
    created() {
    },
    //生命周期 - 挂载完成（可以访问DOM元素）",
    mounted() {
      this.api = this.$route.query.api
    },
    beforeCreate() {
    }, //生命周期 - 创建之前",
    beforeMount() {
    }, //生命周期 - 挂载之前",
    beforeUpdate() {
    }, //生命周期 - 更新之前",
    updated() {
    }, //生命周期 - 更新之后",
    beforeDestroy() {
    }, //生命周期 - 销毁之前",
    destroyed() {
    }, //生命周期 - 销毁完成",
    activated() {
    } //如果页面有keep-alive缓存功能，这个函数会触发",
  };
</script>
<style scoped>

</style>
