<template>
  <span class="button-sty">
    <el-button
      type="success"
      class="btn-connect"
      icon="iconfont icon-zancun"
      @click="openSubmitDialog"
      plain
      :disabled="disabled"
    >
      {{ $t1("暂存") }}
    </el-button>
    <el-tooltip class="item" effect="dark" :content="$t1('查看暂存数据')" placement="top">
      <el-button
        class="btn-connect"
        @click="openTempStorageDialog"
        icon="iconfont icon-chakanshuju"
        type="success"
        :disabled="disabled"
      ></el-button>
    </el-tooltip>

    <tempStorageDialog
      v-if="showTempStorageDialog"
      :visiable.sync="showTempStorageDialog"
      @confirm="confirmTempStorageDialog"
      :storageType="storageType"
      multi="false"
    />
    <el-dialog
      v-if="showSubmitDialog"
      :visible.sync="showSubmitDialog"
      :title="$t1('暂存')"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :modal="false"
      custom-class="dialog-style wf-dialog"
      v-el-drag-dialog
      v-el-dialog-center
    >
      <el-form>
        <div id="containt">
          <table class="table-detail">
            <tbody>
              <tr>
                <th>
                  <span class="t">
                    {{ $t1("描述") }}
                  </span>
                </th>
                <td>
                  <el-input type="textarea" :rows="8" v-model="remark"></el-input>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          plain
          class="button-sty"
          @click="showSubmitDialog = false"
        >
          <i class="el-icon-close el-icon"></i>
          {{ $t1("取 消") }}
        </el-button>
        <el-button type="primary" @click="saveData" class="button-sty">
          <i class="el-icon-check el-icon"></i>
          {{ $t1("确 定") }}
        </el-button>
      </span>
    </el-dialog>
  </span>
</template>
<script>
import tempStorageDialog from "./tempStorageDialog.vue";

export default {
  props: {
    option: Object,
    disabled: Boolean,
  },
  components: {
    tempStorageDialog,
  },
  data() {
    return {
      storageType: null,
      showTempStorageDialog: false,
      showSubmitDialog: false,
      remark: null,
    };
  },
  created() {},
  mounted() {},
  methods: {
    openSubmitDialog() {
      this.remark = null;
      this.showSubmitDialog = true;
    },
    saveData() {
      let url = USER_PREFIX + "/temp_storage/save";
      let billData = this.option.data() || {};
      let data = JSON.stringify(billData);

      let that = this.option.vue || this.$attrs["parent-target"] || this.$parent;
      this.showSubmitDialog = false;
      that.$http({
        url: url,
        method: `post`,
        data: {
          storageType: this.option.storageType,
          data: data,
          remark: this.remark,
          retains: this.option.retains || null,
        },
        isLoading: true,
        success: (res) => {
          this.$message({
            message: res.content,
            type: "success",
            duration: 500,
            onClose: (t) => {
              this.option.saveConfirm && this.option.saveConfirm(res);
            },
          });
        },
      });
    },
    openTempStorageDialog() {
      this.storageType = this.option.storageType;
      this.showTempStorageDialog = true;
    },
    confirmTempStorageDialog(rows) {
      let billData = rows.length ? JSON.parse(rows[0].data) : null;
      if (billData) {
        this.option.chooseConfirm && this.option.chooseConfirm(billData, rows);
      }
    },
  },
};
</script>
<style scoped></style>
