<template>
  <el-dialog
    title="新建售后申请"
    :center="true"
    align="left"
    top="22vh"
    width="1000px"
    :close-on-click-modal="false"
    :visible.sync="showModelThis"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
    @close="closeModel"
  >
    <!-- {{ sitem }} -->
    <el-card style="margin-top: -20px" v-loading="loading">
      <add-edit-form
        v-if="showModel"
        :id="id"
        :sitem="sitem"
        :show-model="showModel"
        :is-detail="isDetail"
        @closeModel="handClick"
        @refresh="refresh"
      />
    </el-card>
  </el-dialog>
</template>
<script>
import addEditForm from "./addEditForm.vue";
export default {
  name: "handover",
  props: ["showModel", "id", "isDetail", "sitem"],
  components: {
    addEditForm,
  },
  data() {
    return {
      sitem: null,
      title: "",
      showModelThis: this.showModel,
    };
  },
  watch: {
    showModel: function (val) {
      this.showModelThis = val;
      if (val) {
        this.initForm();
      }
    },
    showModelThis(val) {
      if (!val) {
        this.$emit("cancel");
      }
    },
  },
  methods: {
    closeModel() {
      console.log("closeModel!!");
    },
    async initForm() {
      this.loading = true;
      console.log(this.id);

      if (this.id === "add") {
        this.title = "新建售后申请";
        this.rulesThis = this.rules;
      } else {
        if (this.isDetail) {
          this.rulesThis = {};
        } else {
          this.rulesThis = this.rules;
        }
      }
      this.loading = false;
    },
    handClick(e) {
      console.log(e);
      this.showModelThis = e;
    },
    refresh(e) {
      console.log(e);
      this.showModelThis = e;
      this.$emit("refresh", true);
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
