<template>
  <div>
    <el-dialog title="报表打印" :visible.sync="visible" width="40%" v-dialogDrag :close-on-click-modal="false"
      :before-close="cancel">
      <div class="dia-box">
        <el-table :data="tableData" border max-height="350px">
          <el-table-column label="报表名称" prop="entity_name" align="left">
            <template slot-scope="scope">
              <el-row>
                <el-col :span="18" :offset="2">
                  <el-radio :label="scope.row.templatePath" v-model="radioType" @change="handleRadio">
                    {{scope.row.reportName}}</el-radio>
                </el-col>
                <el-col :span="4">
                  <el-button @click.stop="handleDelete(scope.row)" size="mini" type="warning">删除</el-button>
                </el-col>
              </el-row>
            </template>
          </el-table-column>
        </el-table>
        <div style="text-align:right;margin:15px 0 20px;">
          <el-button type="primary" size="mini" @click="submit">
            报表打印
          </el-button>
          <el-button size="mini" @click="cancel">关闭</el-button>
        </div>
      </div>
    </el-dialog>
    <dia-preview :visible="diaPreview1" :pdfUrl="pdfUrl" @cancel="cancelPreview" />
  </div>
</template>

<script>
import { message } from "@/utils/common";
import {
  generateReport,
  showPdf,
  deleteReportMatching,
} from "@/api/reportTemplate";
import diaPreview from "./diaPreview.vue";
export default {
  props: {
    visible: {
      type: Boolean,
      default: () => false,
    },
  },
  components: {
    diaPreview,
  },
  data() {
    return {
      tableData: [],
      radioType: "",
      rname: {},
      treeRow: {},
      tableRow: {},
      fileType: null,
      multipleSelection: [],
      ids: [],
      diaPreview1: false,
      pdfUrl: undefined,
    };
  },
  methods: {
    cancel() {
      this.$emit("cancel");
    },
    submit() {
      console.log('-------')
      if (!this.radioType) {
        message("warning", "请选择报表类型", 2000);
        return false;
      }
      this.pdfUrl = undefined;
      let data = {
        classId: this.treeRow.id,
        // companyId: this.rname.id,
        fileType: this.fileType,
        ids: this.ids.join(","),
        model: "1",
        tableName: this.tableRow.tableName,
        templatePath: this.radioType,
      };
      generateReport(data).then((res) => {
        if (res.code === "100") {
          // message("success", "生成成功", 2000);
          let data = {
            templatePath: res.body.path,
            token: sessionStorage.getItem("token"),
          };

          showPdf(data).then((res) => {
            let arr = [];
            arr.push(res);
            this.pdfUrl = window.URL.createObjectURL(
              new Blob(arr, { type: "application/pdf" })
            );
            this.diaPreview1 = true;
          });
        }
      });
    },
    handleDelete(row) {
      let data = {
        classId: this.treeRow.id,
        fileType: this.fileType,
        templatePath: row.templatePath,
      };
      let _this = this;
      this.$confirm("确认删除吗?, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          deleteReportMatching(data).then((res) => {
            if (res.code === "100") {
              message("success", "删除成功", 3000);
              _this.$emit("reset", this.fileType, this.rname, this.treeRow);
            }
          });
        })
        .catch(() => {});
    },
    handleRadio(val) {
      this.radioType = val;
    },
    cancelPreview() {
      this.diaPreview1 = false;
    },
  },
};
</script>

<style lang='scss' scoped>
::v-deep .el-button--warning {
  color: #ffffff;
  background-color: #e6a23c;
  border-color: #e6a23c;
}
</style>
