<template>
  <div class="form_page">
    <!-- 发布 -->
    <yn-form-send
      v-if="type == 0 && action == 0"
      :baseURL="baseURL"
      :formId="formId"
    ></yn-form-send>
    <!-- 待审核 -->
    <yn-form-dsh v-if="type == 1 && action == 1" :formId="formId"></yn-form-dsh>
    <!-- 已审核 -->
    <yn-form-sh v-if="type == 1 && action == 2" :formId="formId"></yn-form-sh>
    <!-- 待办理 -->
    <yn-form-dbl v-if="type == 3 && action == 4" :formId="formId"></yn-form-dbl>
    <!-- 已办理 -->
    <yn-form-bl v-if="type == 3 && action == 5" :formId="formId"></yn-form-bl>
    <!-- 抄送 -->
    <yn-form-cs v-if="type == 2 && action == 0" :formId="formId"></yn-form-cs>
  </div>
</template>
<script>
import YnFormSend from "../../form_send/src/form.vue";
import YnFormDsh from "../../form_dsh/src/index.vue";
import YnFormSh from "../../form_sh/src/index.vue";
import YnFormDbl from "../../form_dbl/src/index.vue";
import YnFormBl from "../../form_bl/src/index.vue";
import YnFormCs from "../../form_cs/src/index.vue";
export default {
  components: {
    YnFormSend,
    YnFormDsh,
    YnFormSh,
    YnFormDbl,
    YnFormBl,
    YnFormCs,
  },
  name: "YnForm",
  data() {
    return {
      formId: "",
      type: -1,
      action: -1,
    };
  },
  props: {
    baseURL: {
      type: String,
      default: "",
    },
  },
  methods: {
    init() {
      var path = this.$route.path;

      var paths = path.split("/");
      var last = paths[paths.length - 1];
      var formInfo = last.split("_");
      var type = formInfo[0];
      var action = formInfo[1];
      var formId = formInfo[formInfo.length - 1];

      this.formId = formId;
      this.type = type;
      this.action = action;

      console.log(
        `path:${path},type:${type},action:${action},fromId:${formId}`
      );
    },
  },
  watch: {
    $route: function (to, from) {
      //from 对象中包含当前地址
      //to 对象中包含目标地址
      //其实还有一个next参数的，这个参数是控制路由是否跳转的，如果没写，可以不用写next()来代表允许路由跳转，如果写了就必须写next(),否则路由是不会生效的。
      this.formId = "";
      this.init();
    },
  },
  created() {
    this.init();
  },
};
</script>
<style lang="less" scoped>
// .form_page {
//   background-color: #eee;
// }
</style>