<template>
  <Modal
    ref="modalRef"
    title="考生承诺书"
    footer-hide
    width="800"
    :closable="false"
    :mask-closable="false"
  >
    <div style="font-size: 16px">
      <div class="privacy-content" v-html="content"></div>

      <div style="display: flex; justify-content: center; margin-top: 10px">
        <i-button
          style="margin: 0; margin-right: 5px; width: 150px"
          class="qm-primary-button"
          @click="onOk"
        >
          同意
        </i-button>
        <i-button
          style="margin: 0; margin-right: 5px; width: 150px"
          class="qm-primary-button"
          @click="onDecline"
        >
          拒绝
        </i-button>
      </div>
    </div>
  </Modal>
</template>

<script>
export default {
  name: "CommittmentDialog",
  props: {
    content: { type: String, default: "" },
  },
  methods: {
    showDialog(resolve, reject) {
      this.$refs.modalRef.visible = true;
      this.parentResolve = resolve;
      this.parentReject = reject;
      return true;
    },
    onOk() {
      this.parentResolve(true);
      this.$refs.modalRef.visible = false;
      this.logger({ action: "考生承诺书", detail: "承诺同意" });
    },
    onDecline() {
      this.parentReject(false);
      this.$refs.modalRef.visible = false;
      this.logger({ action: "考生承诺书", detail: "拒绝承诺" });
    },
  },
};
</script>

<style scoped>
.home {
  margin: 20px;
}
.privacy-content {
  font-size: 14px;
  width: 100%;
  height: 400px;
  overflow-y: scroll;
  text-align: left;
}
.privacy-content p {
  margin-bottom: 5px;
}
</style>
