<template>
  <div class="from-clues">
    <div class="invalid-title">
      <i class="el-icon-question invalid-icon"></i>
      <div class="invalid-body">您是否确定终止该业务办理？</div>
    </div>
    <div class="invalid-reson">终止原因：</div>
    <el-input
      v-model="stopMessage"
      placeholder="请输入终止原因"
      type="textarea"
      :rows="4"
    ></el-input>
    <el-button style="float: right">取消</el-button>
    <el-button type="primary" @click="onSubmit" style="float: right"
      >退件</el-button
    >
  </div>
</template>

<script>
import { stopTask } from "@/api/fqsq.js";
export default {
  props: {
    formData: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      stopMessage: "",
    };
  },
  methods: {
    onSubmit() {
      stopTask({
        bsmSlsq: this.formData.bsmSlsq,
        bestepid: this.formData.bestepid,
        stopMessage: this.stopMessage,
      }).then((res) => {
        this.$message.success("终止成功");
        setTimeout(() => {
          // window.opener.location.reload(); //刷新父窗口
          if (window.opener && window.opener.getBpageList) {
            window.opener.getBpageList();
          } else {
            window.opener.frames[0].getBpageList();
          }
          window.close();
          this.$emit("input", false);
        }, 1000);
      });
    },
  },
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
.invalid-title {
  display: flex;
  align-content: center;

  .invalid-icon {
    color: rgb(254, 148, 0);
    font-size: 34px;
    margin-right: 10px;
  }

  .invalid-body {
    line-height: 40px;
    margin-bottom: 10px;
  }
}

.invalid-reson {
  margin-bottom: 10px;
}

.dialog-footer {
  margin-top: 10px;
  display: flex;
  justify-content: flex-end;
}
</style>