<template>
  <div class="box">
    <div>
      <div class="middlebox">
        <div class="contenttitle">
          收费统计 /
          <span class="contenttitleBold">收费员报表</span>
        </div>
      </div>
      <div :style="'display: block;'">
        <div
          style="
            background-color: #fff;
            padding: 15px;
            border-radius: 8px;
            display: flex;
            flex-wrap: wrap;
            margin-bottom: 10px;
            height: 35px;
            margin-top: 7px;
          "
        >
          <div class="query">
            <span>收费员：</span>
            <el-select
              v-model="username"
              placeholder="请选择"
              size="small"
              multiple
              style="width: 100px"
            >
              <el-option
                v-for="item in registrardata"
                :key="item.id"
                :label="item.surname"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          <div class="query">
            <span>开始日期：</span>
            <el-date-picker
              type="date"
              placeholder="选择开始日期"
              size="small"
              v-model="startDate"
              value-format="yyyy-MM-dd"
              editable
              style="width: 180px"
            >
            </el-date-picker>
          </div>
          <div class="query">
            <span>结束日期：</span>
            <el-date-picker
              type="date"
              placeholder="选择结束日期"
              size="small"
              v-model="endDate"
              value-format="yyyy-MM-dd"
              editable
              style="width: 180px"
            >
            </el-date-picker>
          </div>
          <div class="query">
            <span>报表格式：</span>
            <el-select
              v-model="format"
              placeholder="请选择格式"
              size="small"
              @change="changeValue"
              style="width: 100px"
            >
              <el-option label="支付方式" value="0" />
              <el-option label="发票类型" value="1" />
              <el-option label="组合项目" value="2" />
            </el-select>
          </div>
          <div class="query">
            <el-button size="small" @click="onSubmit" class="commonbutton"
              >查询</el-button
            >
          </div>
          <div class="query">
            <el-button size="small" @click="handleExport" class="commonbutton"
              >导出excel</el-button
            >
          </div>
          <div class="query">
            <el-button size="small" @click="onPrint" class="commonbutton"
              >打印</el-button
            >
          </div>
          <div class="query">
            <el-button size="small" @click="columnarChart" class="commonbutton"
              >柱状图</el-button
            >
          </div>
          <div class="query">
            <el-button size="small" @click="peiChart" class="commonbutton"
              >饼图</el-button
            >
          </div>
        </div>
        <div
          style="
            display: flex;
            justify-content: space-between;
            position: relative;
          "
          id="domTable"
        >
          <div
            style="
              width: 47.7%;
              background-color: #fff;
              padding: 15px;
              border-radius: 8px;
            "
            ref="imageDom0"
            v-show="format == 0"
          >
            <div>
              <el-table
                border
                :span-method="objectStandardSpanMethod"
                :height="
                  flag
                    ? window.pageHeight < 600
                      ? 415
                      : window.pageHeight - 185 - 20
                    : ''
                "
                :data="standardTableData"
                id="standardTableData"
                ref="standardTableData"
                style="width: 100%"
                :header-cell-class-name="headerStyle"
                :cell-style="tableRowClassName"
                show-summary
                :summary-method="
                  (param) => paymodesummarizeRegisterCount(param, sumTotalMoney)
                "
              >
                <el-table-column label="收费员支付方式统计报表">
                  <el-table-column
                    :label="'时间：' + startDate + '至' + endDate"
                  >
                    <el-table-column
                      :label="
                        '收费票据数量：' +
                        chargeCount +
                        '退费票据数量：' +
                        chargeBackCount
                      "
                    >
                      <el-table-column
                        prop="chargeName"
                        label="收费员"
                      ></el-table-column>
                      <el-table-column
                        prop="payModeName"
                        label="支付方式"
                      ></el-table-column>
                      <el-table-column
                        prop="chargeMoney"
                        label="收费金额"
                      ></el-table-column>
                      <el-table-column prop="chargeBackMoney" label="退费金额">
                      </el-table-column>
                      <el-table-column prop="totalMoney" label="合计金额">
                      </el-table-column>
                    </el-table-column>
                  </el-table-column>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div
            style="
              width: 47.7%;
              background-color: #fff;
              padding: 15px;
              border-radius: 8px;
            "
            ref="imageDom1"
            v-show="format == 1"
          >
            <div>
              <el-table
                border
                show-summary
                :summary-method="invoicesummarizeRegisterCount"
                :height="
                  flag
                    ? window.pageHeight < 600
                      ? 415
                      : window.pageHeight - 185 - 20
                    : ''
                "
                :data="tableData"
                id="tableData"
                ref="tableData"
                style="width: 100%"
                :header-cell-class-name="headerStyle"
              >
                <el-table-column label="收费员发票类型统计报表">
                  <el-table-column
                    :label="'时间：' + startDate + '至' + endDate"
                  >
                    <el-table-column
                      :label="
                        '收费票据数量：' +
                        invoicechargeCount +
                        '退费票据数量：' +
                        invoicechargeBackCount
                      "
                    >
                      <template slot-scope="scope">
                        <el-table
                          :data="scope.row.chargeDetails.invoiceTypeDetails"
                          border
                          show-summary
                          :summary-method="summarizeRegisterCounts"
                        >
                          <el-table-column label="收费">
                            <el-table-column
                              label="发票类型"
                              prop="invoiceTypeName"
                            ></el-table-column>
                            <el-table-column
                              label="金额"
                              prop="invoiceTypeMoney"
                            ></el-table-column>
                          </el-table-column>
                        </el-table>
                        <el-table
                          :data="scope.row.chargeBackDetails.invoiceTypeDetails"
                          border
                          show-summary
                          :summary-method="summarizeRegisterCounts"
                        >
                          <el-table-column label="退费">
                            <el-table-column
                              label="发票类型"
                              prop="invoiceTypeName"
                            ></el-table-column>
                            <el-table-column
                              label="金额"
                              prop="invoiceTypeMoney"
                            ></el-table-column>
                          </el-table-column>
                        </el-table>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div
            style="
              width: 47.7%;
              background-color: #fff;
              padding: 15px;
              border-radius: 8px;
            "
            ref="imageDom2"
            v-show="format == 2"
          >
            <el-table
              border
              :height="
                flag
                  ? window.pageHeight < 600
                    ? 415
                    : window.pageHeight - 185 - 20
                  : ''
              "
              :data="projectTableData"
              id="projectTableData"
              ref="projectTableData"
              style="width: 100%"
              :header-cell-class-name="headerStyle"
              show-summary
              :summary-method="reportasbitemNamesummarizeRegisterCount"
            >
              <el-table-column label="收费员组合项目统计报表">
                <el-table-column :label="'时间：' + startDate + '至' + endDate">
                  <template slot-scope="scope">
                    <el-table :data="scope.row.details" border show-summary
                          :summary-method="asbitemNamesummarizeRegisterCounts">
                            <el-table-column
                              :label="scope.row.itemTypeName"
                            >
                              <el-table-column
                                label="组合项目"
                                prop="asbitemName"
                              ></el-table-column>
                              <el-table-column
                                label="收款金额"
                                prop="chargeMoney"
                              ></el-table-column>
                            </el-table-column>
                          </el-table>
                  </template>
                </el-table-column>
              </el-table-column>
            </el-table>
          </div>
          <div
            :style="
              'width: 47.7%;overflow: hidden;height:' +
              (window.pageHeight < 600 ? 415 : window.pageHeight - 185 - 20) +
              'px;background-color: #fff; padding: 15px; border-radius: 8px;'
            "
          >
            <div
              style="
                font-size: 20px;
                font-weight: 700;
                color: #232748;
                font-family: 'NotoSansSC-Bold';
                text-align: center;
              "
            >
              收费员支付方式统计报表
            </div>
            <div
              :style="
                'height:' +
                (window.pageHeight < 600 ? 387 : window.pageHeight - 185 - 48) +
                'px;'
              "
            >
              <ChartBlock ref="chart2"></ChartBlock>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { mapState, mapActions } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import ChartBlock from "../../components/workload/chartsBlock";
import { exportToExcel } from "../../utlis/Export2Excel";
import html2canvas from "html2canvas";
import printJs from "print-js";
import { projectlist } from "@/request/commonapi";
export default {
  components: {
    ChartBlock,
  },
  data() {
    return {
      registrardata: [],
      username: [],
      startDate: "",
      endDate: "",
      tableData: [],
      standardTableData: [],
      projectTableData: [],
      seriesData: [],
      yAxisData: [],
      flag: true,
      arr1: [],
      pieData: [],
      spanMap: {},
      spanMaps: {},
      mergedColumns: ["itemTypeName", "doctorName"],
      mergedColumnes: ["itemTypeName"],
      oldTableData: [],
      format: "0",
      chargeCount: "",
      chargeBackCount: "",
      invoicechargeCount: "",
      invoicechargeBackCount: "",
      sumTotalMoney: "",
    };
  },
  created() {
    this.getList();
  },
  mounted() {
    this.getNowTime();
  },
  methods: {
    tableRowClassName({ row, column, rowIndex, columnIndex }) {
      if (row.payModeName == "合计") {
        return { backgroundColor: "#F5F7FA" };
      }
    },
    changeValue(value) {
      if (value == 0) {
        this.$nextTick(() => {
          this.$refs.standardTableData.doLayout();
        });
      } else if (value == 1) {
        this.$nextTick(() => {
          this.$refs.tableData.doLayout();
        });
      } else {
        this.$nextTick(() => {
          this.$refs.projectTableData.doLayout();
        });
      }
    },
    peiChart() {
      let option2 = {
        // title: {
        //   text: "医生工作量统计",
        //   left: "center",
        // },
        tooltip: {
          trigger: "item",
          confine: true,
        },
        legend: {
          data: this.yAxisData,
          orient: "horizontal",
          right: "3%",
          top: "0%",
        },
        grid: {
          show: false,
          left: "0%",
          right: "0%",
          top: "0%",
          bottom: "0%",
          containLabel: true,
        },
        series: [
          {
            type: "pie",
            label: {
              show: true,
              formatter: "{b} : {c} ({d}%)", // b代表名称，c代表对应值，d代表百分比
            },
            data: this.pieData,
          },
        ],
      };
      this.$refs.chart2.setOption(option2);
    },
    columnarChart() {
      let option2 = {
        // title: {
        //   text: "医生工作量统计",
        //   left: "center",
        // },
        tooltip: {
          trigger: "axis",
          confine: true,
        },
        legend: {
          type: "scroll",
          orient: "horizontal",
          right: "3%",
          top: "0%",
        },
        grid: {
          show: false,
          left: "0%",
          right: "0%",
          top: "0%",
          bottom: "0%",
          containLabel: true,
        },
        xAxis: {
          type: "value",
          axisLabel: {
            textStyle: {
              fontSize: "14",
            },
          },
          axisLine: {
            show: true,
          },
        },
        yAxis: {
          type: "category",
          data: this.yAxisData,
          axisLabel: {
            textStyle: {
              fontSize: "14",
            },
          },
        },
        series: [
          {
            name: "合计金额",
            type: "bar",
            data: this.seriesData,
          },
        ],
      };
      this.$refs.chart2.setOption(option2);
    },
    headerStyle({ row, column, rowIndex, columnIndex }) {
      if (rowIndex === 1) {
        return "left-align";
      }
      if (rowIndex === 2) {
        return "left-align";
      }
    },
    paymodesummarizeRegisterCount(param, sumTotalMoney) {
      let that = this;
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        if (index === 4) {
          console.log(sumTotalMoney);
          sums[index] = sumTotalMoney;
          return;
        }
      });
      return sums;
    },
    invoicesummarizeRegisterCount(param) {
      const { columns, data } = param;
      const sums = [];
      if(data.length>0){
        columns.forEach((column, index) => {
        if (index === 0) {
          let sumPrice = 0;
          let chargeDetails = data[0].chargeDetails;
          let chargeBackDetails = data[0].chargeBackDetails;
          sumPrice = Number(
            chargeDetails.totalMoney - chargeBackDetails.totalMoney
          ).toFixed(2);
          sums[index] = "收费扣除退费余计：" + sumPrice;
          return;
        }
      });
      }
      return sums;
    },
    reportasbitemNamesummarizeRegisterCount(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          let sumPrice = 0;
          for(let i=0;i<this.projectTableData.length;i++){
            sumPrice =(Number(sumPrice)+Number(this.projectTableData[i].totalMoney)).toFixed(2);
          }
          sums[index] = "合计" + sumPrice;
          return;
        }
      });
      return sums;
    },
    summarizeRegisterCount(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }

        const values = data.map((item) => Number(item[column.property]));
        if (index === 1) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = "共" + sums[index] + "人";
        } else {
          sums[index] = "";
        }
      });

      return sums;
    },
    onPrint() {
      this.flag = false;
      let index = "";
      if (this.format == 0) {
        index = "imageDom0";
      } else if (this.format == 1) {
        index = "imageDom1";
      } else {
        index = "imageDom2";
      }
      this.$nextTick(() => {
        let width = this.$refs[index].style.width;
        let cloneDom = this.$refs[index].cloneNode(true);
        let imageDom = this.$refs[index];
        cloneDom.style.position = "absolute";
        cloneDom.style.top = "0px";
        cloneDom.style.zIndex = "-1";
        cloneDom.style.width = width;
        console.log(cloneDom);
        imageDom.appendChild(cloneDom);
        html2canvas(cloneDom).then((canvas) => {
          // 转成图片，生成图片地址
          const url = canvas.toDataURL("image/png");
          printJs({
            printable: url,
            type: "image",
            documentTitle: "", // 标题
            style: `@media print { @page {size: auto; margin: 0 0 0 0; } body{margin:0 5px}canvas{page-break-after: always;page-break-inside: avoid;
page-break-after: avoid;
page-break-before: avoid;}}`, // 去除页眉页脚
          });
        });
        cloneDom.style.display = "none";
        this.flag = true;
      });
    },
    summarizeRegisterCounts(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        if (index === 1) {
          let sum = 0;
          data.forEach((data, index) => {
            sum += Number(data.invoiceTypeMoney);
          });
          sums[index] = sum;
          return;
        }
      });

      return sums;
    },
    asbitemNamesummarizeRegisterCounts(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        if (index === 1) {
          let sum = 0;
          data.forEach((data, index) => {
            sum =(Number(sum)+Number(data.chargeMoney)).toFixed(2);
          });
          sums[index] = sum;
          return;
        }
      });

      return sums;
    },
    onSubmit() {
      let that = this;
      if (this.startDate == "") {
        return this.$message({
          message: "请先选择开始日期",
          type: "error",
        });
      }
      if (this.endDate == "") {
        return this.$message({
          message: "请先选择结束日期",
          type: "error",
        });
      }
      if (this.format == 0) {
        postapi(
          "/api/app/charge-report/get-toll-collector-fee-report-in-pay-mode",
          {
            userIds: that.username,
            startDate: that.startDate,
            endDate: that.endDate,
          }
        ).then((res) => {
          if (res.code != -1) {
            this.pieData = [];
            this.yAxisData = [];
            this.seriesData = [];
            that.computedStandardTableData(res.data.chargeDetails);
            // that.standardTableData = [...res.data.chargeDetails];
            that.chargeCount = res.data.chargeCount;
            that.chargeBackCount = res.data.chargeBackCount;
            that.sumTotalMoney = res.data.sumTotalMoney;
          }
        });
      } else if (this.format == 1) {
        postapi(
          "/api/app/charge-report/get-toll-collector-fee-report-in-invoice-type",
          {
            userIds: that.username,
            startDate: that.startDate,
            endDate: that.endDate,
          }
        ).then((res) => {
          if (res.code != -1) {
            that.tableData = [];
            that.tableData.push(res.data);
            that.invoicechargeCount = res.data.chargeCount;
            that.invoicechargeBackCount = res.data.chargeBackCount;
          }
        });
      } else {
        postapi(
          "/api/app/charge-report/get-toll-collector-fee-report-in-asbitem",
          {
            userIds: that.username,
            startDate: that.startDate,
            endDate: that.endDate,
          }
        ).then((res) => {
          if (res.code != -1) {
          that.projectTableData=[...res.data]
          // let newTableData = [];
          // let objs = {
          //   customerName: "",
          //   children: [],
          // };
          // for (let i = 0; i < res.data.length; i++) {
          //   let Index = newTableData.findIndex((item) => {
          //     return item.customerName === res.data[i].customerName;
          //   });
          //   let obj = JSON.parse(JSON.stringify(objs));
          //   if (Index == -1) {
          //     obj.customerName = res.data[i].customerName;
          //     newTableData.push(obj);
          //   }
          // }
          // for (let i = 0; i < res.data.length; i++) {
          //   for (let j = 0; j < newTableData.length; j++) {
          //     if (res.data[i].customerName === newTableData[j].customerName) {
          //       newTableData[j].children.push(res.data[i]);
          //     }
          //   }
          // }
          // that.computedProjectTableData(newTableData);
          }
        });
      }
    },
    setdates(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.mergedColumns.forEach((column) => {
            this.spanMap[column] = {
              spanArr: [1],
              pos: 0,
              // index:i
            };
          });
        } else {
          this.mergedColumns.forEach((column) => {
            if (data[i][column] === data[i - 1][column]) {
              this.spanMap[column].spanArr[this.spanMap[column].pos] += 1;
              this.spanMap[column].spanArr.push(0);
            } else {
              this.spanMap[column].spanArr.push(1);
              this.spanMap[column].pos = i;
            }
            // this.spanMap[column].index=i
          });
        }
      }
    },
    setProjectdates(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.mergedColumnes.forEach((column) => {
            this.spanMaps[column] = {
              spanArr: [1],
              pos: 0,
              // index:i
            };
          });
        } else {
          this.mergedColumnes.forEach((column) => {
            if (data[i][column] === data[i - 1][column]) {
              this.spanMaps[column].spanArr[this.spanMaps[column].pos] += 1;
              this.spanMaps[column].spanArr.push(0);
            } else {
              this.spanMaps[column].spanArr.push(1);
              this.spanMaps[column].pos = i;
            }
            // this.spanMap[column].index=i
          });
        }
      }
    },
    setStandardDates(arr) {
      var obj = {},
        k,
        arr1 = [];
      this.arr1 = [];
      for (var i = 0, len = arr.length; i < len; i++) {
        k = arr[i].chargeName; //需要合并的字段
        if (obj[k]) obj[k]++;
        else obj[k] = 1;
      }
      //保存结果{el-'元素'，count-出现次数}
      for (var o in obj) {
        for (let i = 0; i < obj[o]; i++) {
          if (i === 0) {
            this.arr1.push(obj[o]);
          } else {
            this.arr1.push(0);
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      let index = rowIndex;
      if (index === 0 && columnIndex === 0) {
        for (let i = 0; i < this.tableData.length; i++) {
          if (row.customerName === this.tableData[i].customerName) {
            this.setdates(this.tableData[i].children);
          }
        }
      }
      if (this.spanMap[column.property]) {
        const _row = this.spanMap[column.property].spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    objectStandardSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        let _row = this.arr1[rowIndex];
        let _col = this.arr1[rowIndex] > 0 ? 1 : 0;
        return [_row, _col];
      }
    },
    objectProjectSpanMethod({ row, column, rowIndex, columnIndex }) {
      let index = rowIndex;
      if (index === 0 && columnIndex === 0) {
        for (let i = 0; i < this.projectTableData.length; i++) {
          if (row.customerName === this.projectTableData[i].customerName) {
            this.setProjectdates(this.projectTableData[i].children);
          }
        }
      }
      if (this.spanMaps[column.property]) {
        const _row = this.spanMaps[column.property].spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    getList() {
      getapi("/api/identity/users/getlist").then((res) => {
        if (res.code != -1) {
          this.registrardata = [...res.data.items];
        }
      });
    },
    getNowTime() {
      var now = new Date();
      var year = now.getFullYear(); // 得到年份
      var month = now.getMonth(); // 得到月份
      var date = now.getDate(); // 得到日期
      month = month + 1;
      month = month.toString().padStart(2, "0");
      date = date.toString().padStart(2, "0");
      var defaultDate = `${year}-${month}-${date}`;
      this.startDate = defaultDate;
      this.endDate = defaultDate;
    },
    ForwardRanking(data) {
      for (let i = 0; i < data.length; i++) {
        data[i].children.sort(function (a, b) {
          return a.itemTypeName > b.itemTypeName ? -1 : 1; //根据名称属性进行排序
        });
        data[i].children.sort(function (a, b) {
          if (a.itemTypeName === b.itemTypeName)
            return a.doctorName > b.doctorName ? -1 : 1; //根据名称属性进行排序
        });
      }
      this.tableData = data;
      console.log(this.tableData);
      // this.setdates(this.tableData[0].children);
    },
    ForwardStandardRanking(data, p) {
      for (var i = 0; i < data.length - 1; i++) {
        for (var j = 0; j < data.length - 1 - i; j++) {
          var dd = data[j][p].localeCompare(data[j + 1][p], "zh"); //1---前者往后移，-1===位置不变
          if (dd > 0) {
            var temp = data[j];
            data[j] = data[j + 1];
            data[j + 1] = temp;
          }
        }
      }
      this.standardTableData = data;
      this.setStandardDates(this.standardTableData);
    },
    ForwardProjectRanking(data) {
      for (let i = 0; i < data.length; i++) {
        data[i].children.sort(function (a, b) {
          return a.itemTypeName > b.itemTypeName ? -1 : 1; //根据名称属性进行排序
        });
        // data[i].children.sort(function (a, b) {
        //   if (a.itemTypeName === b.itemTypeName)
        //     return a.asbitemName > b.asbitemName ? -1 : 1; //根据名称属性进行排序
        // });
      }
      this.projectTableData = data;
    },
    computedTableData(tableData) {
      const newData = [...tableData]; // 创建一个新的数组，避免修改原始数据
      const totalRows = {
        customerName: "",
        itemTypeName: "",
        asbitemName: "合计",
        doctorName: "",
        doctorCheckCount: 0,
        avgStandardPrice: 0,
        avgChargePrice: 0,
        sumStandardPrice: 0,
        sumChargePrice: 0,
      }; // 合计行的数据
      let newTableData = [];
      let obj = {
        customerName: "",
        children: [],
      };
      let ojk = {
        itemTypeName: "",
        children: {},
      };
      for (let i = 0; i < tableData.length; i++) {
        let objs = JSON.parse(JSON.stringify(obj));
        objs.customerName = tableData[i].customerName;
        for (let j = 0; j < tableData[i].children.length; j++) {
          let ojks = JSON.parse(JSON.stringify(ojk));
          let Index = objs.children.findIndex((item) => {
            return item.itemTypeName === tableData[i].children[j].itemTypeName;
          });
          if (Index == -1) {
            ojks.itemTypeName = tableData[i].children[j].itemTypeName;
            objs.children.push(ojks);
          }
        }
        for (let j = 0; j < tableData[i].children.length; j++) {
          for (let k = 0; k < objs.children.length; k++) {
            let item = tableData[i].children[j].doctorName;
            if (
              objs.children[k].itemTypeName ===
              tableData[i].children[j].itemTypeName
            ) {
              objs.children[k].children[item] =
                objs.children[k].children[item] + 1 || 1;
            }
          }
        }
        newTableData.push(objs);
      }
      for (let i = 0; i < newTableData.length; i++) {
        for (let j = 0; j < tableData.length; j++) {
          if (tableData[j].customerName === newTableData[i].customerName) {
            for (let k = 0; k < newTableData[i].children.length; k++) {
              Object.keys(newTableData[i].children[k].children).forEach(
                (key) => {
                  let totalRow = JSON.parse(JSON.stringify(totalRows));
                  tableData[j].children.forEach((item) => {
                    if (
                      item.itemTypeName ===
                        newTableData[i].children[k].itemTypeName &&
                      item.doctorName == key
                    ) {
                      totalRow.customerName = item.customerName;
                      totalRow.itemTypeName = item.itemTypeName;
                      totalRow.doctorName = item.doctorName;
                      totalRow.doctorCheckCount += item.doctorCheckCount;
                      totalRow.avgStandardPrice =
                        (totalRow.avgStandardPrice * 100000 +
                          item.avgStandardPrice * 100000) /
                        100000;
                      totalRow.avgChargePrice =
                        (totalRow.avgChargePrice * 100000 +
                          item.avgChargePrice * 100000) /
                        100000;
                      totalRow.sumStandardPrice =
                        (totalRow.sumStandardPrice * 100000 +
                          item.sumStandardPrice * 100000) /
                        100000;
                      totalRow.sumChargePrice =
                        (totalRow.sumChargePrice * 100000 +
                          item.sumChargePrice * 100000) /
                        100000;
                    }
                  });
                  tableData[j].children.push(totalRow);
                }
              );
            }
          }
        }
      }
      this.ForwardRanking(tableData);
    },
    computedProjectTableData(tableData) {
      const newData = [...tableData]; // 创建一个新的数组，避免修改原始数据
      const totalRows = {
        customerName: "",
        itemTypeName: "",
        asbitemName: "合计",
        doctorCheckCount: 0,
        avgStandardPrice: 0,
        avgChargePrice: 0,
        sumStandardPrice: 0,
        sumChargePrice: 0,
      }; // 合计行的数据
      let newTableData = [];
      let obj = {
        customerName: "",
        children: {},
      };
      // let ojk = {
      //   itemTypeName: "",
      //   children: {},
      // };
      for (let i = 0; i < tableData.length; i++) {
        let objs = JSON.parse(JSON.stringify(obj));
        objs.customerName = tableData[i].customerName;
        for (let j = 0; j < tableData[i].children.length; j++) {
          var item = tableData[i].children[j].itemTypeName;
          objs.children[item] = objs.children[item] + 1 || 1;
          // let ojks = JSON.parse(JSON.stringify(ojk));
          // let Index = objs.children.findIndex((item) => {
          //   return item.itemTypeName === tableData[i].children[j].itemTypeName;
          // });
          // if (Index == -1) {
          //   ojks.itemTypeName = tableData[i].children[j].itemTypeName;
          //   objs.children.push(ojks);
          // }
        }
        // for (let j = 0; j < tableData[i].children.length; j++) {
        //   for (let k = 0; k < objs.children.length; k++) {
        //     let item = tableData[i].children[j].asbitemName;
        //     if (
        //       objs.children[k].itemTypeName ===
        //       tableData[i].children[j].itemTypeName
        //     ) {
        //       objs.children[k].children[item] =
        //         objs.children[k].children[item] + 1 || 1;
        //     }
        //   }
        // }
        newTableData.push(objs);
      }
      for (let i = 0; i < newTableData.length; i++) {
        for (let j = 0; j < tableData.length; j++) {
          if (tableData[j].customerName === newTableData[i].customerName) {
            Object.keys(newTableData[i].children).forEach((key) => {
              let totalRow = JSON.parse(JSON.stringify(totalRows));
              tableData[j].children.forEach((item) => {
                if (item.itemTypeName === key) {
                  totalRow.customerName = item.customerName;
                  totalRow.itemTypeName = item.itemTypeName;
                  // totalRow.asbitemName = item.asbitemName;
                  totalRow.doctorCheckCount += item.doctorCheckCount;
                  totalRow.avgStandardPrice =
                    (totalRow.avgStandardPrice * 100000 +
                      item.avgStandardPrice * 100000) /
                    100000;
                  totalRow.avgChargePrice =
                    (totalRow.avgChargePrice * 100000 +
                      item.avgChargePrice * 100000) /
                    100000;
                  totalRow.sumStandardPrice =
                    (totalRow.sumStandardPrice * 100000 +
                      item.sumStandardPrice * 100000) /
                    100000;
                  totalRow.sumChargePrice =
                    (totalRow.sumChargePrice * 100000 +
                      item.sumChargePrice * 100000) /
                    100000;
                }
              });
              tableData[j].children.push(totalRow);
            });
          }
        }
      }
      console.log(tableData);
      this.ForwardProjectRanking(tableData);
    },
    computedStandardTableData(tableData) {
      const newData = [...tableData]; // 创建一个新的数组，避免修改原始数据
      const totalRows = {
        chargeName: "",
        payModeName: "合计",
        chargeMoney: 0,
        chargeBackMoney: 0,
        totalMoney: 0,
      }; // 合计行的数据
      let pies = {
        name: "",
        value: 0,
      };
      let obj = {};
      for (let i = 0; i < tableData.length; i++) {
        var item = tableData[i].chargeName;
        obj[item] = obj[item] + 1 || 1;
      }

      Object.keys(obj).forEach((key) => {
        let totalRow = JSON.parse(JSON.stringify(totalRows));
        let pie = JSON.parse(JSON.stringify(pies));
        tableData.forEach((item) => {
          if (item.chargeName == key) {
            totalRow.chargeName = item.chargeName;
            pie.name = item.chargeName;
            totalRow.chargeMoney =
              (totalRow.chargeMoney * 100000 + item.chargeMoney * 100000) /
              100000;
            totalRow.chargeBackMoney =
              (totalRow.chargeBackMoney * 100000 +
                item.chargeBackMoney * 100000) /
              100000;
            totalRow.totalMoney =
              (totalRow.totalMoney * 100000 + item.totalMoney * 100000) /
              100000;
            pie.value = totalRow.totalMoney;
          }
        });
        newData.push(totalRow);
        this.pieData.push(pie);
        this.yAxisData.push(totalRow.chargeName);
        this.seriesData.push(totalRow.totalMoney);
      });
      this.ForwardStandardRanking(newData, "chargeName");
      this.columnarChart();
    },
    handleExport() {
      if (this.format == 0) {
        exportToExcel("#standardTableData", "收费员支付方式统计报表", false);
      } else if (this.format == 1) {
        let index = 4;
        let list = [];
        list.push(index);
        // for (let i = 0; i < this.tableData.length - 1; i++) {
        //   index += this.tableData[i].children.length + 3;
        //   list.push(index);
        // }
        exportToExcel("#tableData", "收费员发票类型统计报表", true, list);
      } else {
        let index = 3;
        let list = [];
        list.push(index);
        for (let i = 0; i < this.projectTableData.length - 1; i++) {
          index += this.projectTableData[i].details.length + 4;
          list.push(index);
        }
        exportToExcel("#projectTableData", "收费员组合项目统计报表", true, list);
      }
    },
  },
  computed: {
    ...mapState(["window", "dict", "patientRegister", "report"]),
  },
  updated() {
    this.$nextTick(() => {
      this.$refs.tableData.doLayout();
    });
    this.$nextTick(() => {
      this.$refs.standardTableData.doLayout();
    });
    this.$nextTick(() => {
      this.$refs.projectTableData.doLayout();
    });
  },
};
</script>
<style scoped>
@import "../../assets/css/global_button.css";
@import "../../assets/css/global_dialog.css";
@import "../../assets/css/global_table.css";
@import "../../assets/css/global_form.css";
@import "../../assets/css/global_input.css";
@import "../../assets/css/global.css";
.query {
  margin-right: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  color: #232748;
  font-size: 400;
  font-family: "NotoSansSC-Regular";
}
.box {
  display: flex;
  flex-direction: column;
}
:deep .left-align .cell {
  text-align: left !important;
}
/* ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
  width: 0px;
  background: rgba(213, 215, 220, 0.3);
  border: none;
}
::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
  border: none;
} */
::v-deep .el-table th.gutter {
  display: none;
  width: 0;
}
::v-deep .el-table colgroup col[name="gutter"] {
  display: none;
  width: 0;
}
::v-deep .el-table__body {
  width: 100% !important;
}
</style>