<template>
  <div class="paramAndFile">
    <el-tabs v-model="activeName" type="card">
      <el-tab-pane label="请求参数" name="first">
        <p><label style="padding: 0 10px">地址</label>{{ url }}</p>
        <el-divider></el-divider>
        <service-param
          :srvId="srvId"
          :url="url"
          @forwardStep="forwardStep"
          @nextStep="nextStep"
        ></service-param>
      </el-tab-pane>
      <el-tab-pane label="返回值" name="second">
        <p><label style="padding: 0 10px">地址</label>{{ url }}</p>
        <el-divider></el-divider>
        <service-return
          :srvId="srvId"
          :url="url"
          @forwardStep="forwardStep"
          @nextStep="nextStep"
        ></service-return>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import ServiceParam from "./serviceParam.vue";
import ServiceReturn from "./serviceReturn.vue";

export default {
  props: ["srvId", "url"],
  components: {ServiceParam, ServiceReturn},
  data() {
    return {
      activeName: "first",
    };
  },
  methods: {
    // 前进一步
    forwardStep() {
      this.$emit("forwardStep");
    },
    // 后退一步
    nextStep() {
      this.$emit("nextStep");
    },
  },
};
</script>
