yos_web/src/optionSystem/optionOrder/detail/modules/edit.vue

<template>
  <div>
    <el-button
      type="primary"
      size="mini"
      @click="onShow"
      :disabled="data.status != '待评审'"
    >
      {{ $t("编辑") }}</el-button
    >
    <el-drawer
      custom-class="custom-select-option_class"
      :visible.sync="drawer"
      size="1300px"
      append-to-body
      :show-close="false"
      :wrapperClosable="false"
      :close-on-press-escape="false"
    >
      <component
        ref="target"
        @close="drawer = false"
        :is="formComponent"
        :data="data"
        @onEditSuccess="onEditSuccess"
      ></component>
    </el-drawer>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
  props: ["data"],
  data() {
    return {
      drawer: false,
      type: "",
      userid: JSON.parse(sessionStorage.getItem("active_account")).userid,
    };
  },
  provide() {
    return {
      valvetype: () => this.type,
    };
  },
  watch: {
    drawer(val) {
      if (!val) this.$refs.target.close();
    },
  },
  computed: {
    ...mapGetters({
      loading: "loading",
    }),

    formComponent() {
      switch (this.type) {
        case "蝶阀":
          return () =>
            import(
              "@/optionSystem/optionOrder/detail/modules/components/DieFa.vue"
            );
          break;
        default:
          break;
      }
    },
  },
  methods: {
    onShow() {
      this.type = this.data.valvetype;
      this.drawer = true;
      if (this.$refs.target) {
        this.$refs.target.init();
      }
    },
    onSubmit() {
      this.$refs.target.$refs["form"].validate(async (valid) => {
        if (!valid) return false;
        this.$refs.target.onSubmit(() => {
          this.$refs.target.refresh();
          this.drawer = false;
        });
      });
    },
    onEditSuccess() {
      this.$emit("onEditSuccess");
    },
  },
  created() {},
};
</script>
<style scoped>
/deep/.el-drawer__header {
  display: none !important;
}
/deep/.el-step__title {
  width: 100px !important;
  cursor: pointer;
}
</style>