// 计次作业
<template>
  <div class="sale">
    <div class="top">
      <!-- 框计算 -->
      <span class="text">计次时间：</span>
      <el-date-picker
        v-model="startTime"
        type="datetime"
        placeholder="选择日期"
      >
      </el-date-picker>
      <span class="text">至</span>
      <el-date-picker v-model="endTime" type="datetime" placeholder="选择日期">
      </el-date-picker>
      <el-button type="primary" class="btn" @click="onclick">
        <i class="el-icon-search"></i>查询
      </el-button>
      <!-- excel导出 -->
      <el-button type="primary" @click="exportAllExcel()">
        <i class="el-icon-download"></i>导出(Excel)
      </el-button>
    </div>
    <div class="tab">
      <dilTable v-bind.sync="option" ref="excelDom">
        <el-table-column fixed="right" label="操作" width="180">
          <template slot-scope="scope">
            <div class="step">
              <el-button
                @click="detailclick1(scope.row)"
                type="text"
                size="small"
              >运输详情</el-button
              >
            </div>
            <!-- <el-button @click="" type="primary" style="margin-left: 16px;">
                    运输详情
                  </el-button> -->
          </template>
        </el-table-column>
        <!-- 运输进程详情 -->
        <el-table-column type="expand" width="1">
          <template slot-scope="props">
            <el-form label-position="center" inline class="demo-table-expand">
              <div v-if="false">{{ props }}</div>
              <div>
                <el-table :data="tableData1" border>
                  <el-table-column
                    v-for="(item, i) in tableHead"
                    :key="i"
                    :prop="item.prop"
                    :label="item.label"
                    :width="item.width"
                  ></el-table-column>
                </el-table>
              </div>
            </el-form>
          </template>
        </el-table-column>
      </dilTable>
    </div>
  </div>
</template>
<script>
import { getCookie } from "@/utils/util.js";
import { sjTime } from "@/utils/sharedJsFile";
export default {
  data() {
    return {
      inputText: "",
      option: {
        // 表格请求数据的地址
        requestUrl: ""
      },
      tableHead: [
        {
          prop: "linkName",
          label: "计次状态",
          width: 150
        },
        {
          prop: "pointDate",
          label: "时间",
          width: 150
        }
      ],
      tableData1: [],
      tableData: [],
      startTime: null,
      endTime: null,
      oldRow1: "",
      oldRowCount1: 1,
      drawer: false,
      direction: "rtl",
      orderId: 0,
      stepList: [],
      tableTitle: "计次统计",
      exportAllList:[],
      noSettleDetailsColumn:[]
    };
  },
  created() {
    if (
      getCookie("orgCode") == "dagangadmin" ||
      getCookie("orgCode") == "zidonghuabu" ||
      getCookie("orgCode") == "wuliuchuyunzhongxin"
    ) {
      this.option.requestUrl = "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26";
    } else {
      this.option.requestUrl =
        "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26&userId=" +
        getCookie("orgCode");
    }
  },
  methods: {
    exportAllExcel() {
      this.tableTitle = '计次统计'
      let startTime = null;
      let endTime = null;
      if (this.startTime) {
        startTime = sjTime(this.startTime);
      }
      if (this.endTime) {
        endTime = sjTime(this.endTime);
      }
      if (startTime && endTime) {
        if (startTime < endTime) {
          console.log(startTime);
          console.log(endTime);
          if (
            getCookie("orgCode") == "dagangadmin" ||
            getCookie("orgCode") == "zidonghuabu" ||
            getCookie("orgCode") == "wuliuchuyunzhongxin"
          ) {
            this.axios
              .post(
                "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26&startTime=" +
                startTime +
                "&endTime=" +
                endTime +
                "&i=" +
                new Date()
              )
              .then(res => {
                console.log(res.data.data)
                console.log(res.data.data)
                this.exportAllList = res.data.data.list
                this.noSettleDetailsColumn=res.data.data.columnData
                this.exportAllReportToExcel(
                  this.tableTitle,
                  this.exportAllList,
                  this.noSettleDetailsColumn
                )
              })
          } else {
            this.axios
              .post(
                "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26&userId=" +
                getCookie("orgCode") +
                "&startTime=" +
                startTime +
                "&endTime=" +
                endTime +
                "&i=" +
                new Date()
              )
              .then(res => {
                console.log(res.data.data)
                console.log(res.data.data)
                this.exportAllList = res.data.data.list
                this.noSettleDetailsColumn=res.data.data.columnData
                this.exportAllReportToExcel(
                  this.tableTitle,
                  this.exportAllList,
                  this.noSettleDetailsColumn
                )
              })
          }
        } else {
          this.startTime = null;
          this.endTime = null;
          this.$message.warning("开始时间要比结束时间早");
        }
      } else {
      }

    },
    //导出excel
    exportAllReportToExcel(tableTitle, dataArr, columnData) {
      var title = tableTitle
      let tHeader = []
      let filterVal = []
      columnData.forEach(e1 => {
        if (tHeader.indexOf(e1.label) === -1) {
          tHeader.push(e1.label)
        }
        if (filterVal.indexOf(e1.prop) === -1) {
          filterVal.push(e1.prop)
        }
      })
      //导出为excel
      this.downloadLoading = true
      require.ensure([], () => {
        const {
          export_json_to_excel
        } = require('@/assets/excel/Export2Excel.js') //这里必须使用绝对路径，使用@/+存放export2Excel的路径
        // let list = this.$refs.excelDom.dataTabel;
        let data = dataArr.map(v => filterVal.map(j => v[j])) //3.formatJson格式转换
        export_json_to_excel(tHeader, data, title) // (title)导出的表格名称
      })
    },
    // -------查看物资详情(已拒绝)
    detailclick1(row) {
      // 记录重复点击次数
      if (this.oldRow1 === row) {
        this.oldRowCount1 += 1;
      }
      this.orderId = row.orderId;
      let map = {
        orderId: this.orderId
      };
      // 切换当前详情表
      this.$refs.excelDom.toggleRowExpansion(row);
      // 打开前关闭上一个详情表
      if (this.oldRow1 != "") {
        if (this.oldRow1 != row) {
          if (this.oldRowCount1 % 2 === 1) {
            this.$refs.excelDom.toggleRowExpansion(this.oldRow1);
          } else {
            this.oldRowCount1 = 1;
          }
        } else {
          this.oldRow1 = null;
          return;
        }
      }
      // 重置上一个点击对象
      this.oldRow1 = row;
      // 根据销售订单物资中间表id查询物资信息
      this.axios.post("/api/v1/oms/getOrderResult?orderId=", map).then(res => {
        console.log("res", res);
        this.tableData1 = res.data;
      });
    },
    getStepsList(row) {
      console.log(row.orderId);
      this.orderId = row.orderId;
      this.drawer = true;
      let map = {
        orderId: this.orderId
      };
      this.axios.post("/api/v1/oms/getOrderResult", map).then(res => {
        console.log(res);
        if (res.status == 200) {
          this.stepList = res.data;
        } else {
          this.$message.error("展示失败！");
        }
      });
      console.log(this.stepList);
    },
    getRequirementMaterial1(row) {
      // 记录重复点击次数
      if (this.oldRow1 === row) {
        this.oldRowCount1 += 1;
      }
      // 切换当前详情表
      this.$refs.excelDom.toggleRowExpansion(row);
      // 打开前关闭上一个详情表
      if (this.oldRow1 != "") {
        if (this.oldRow1 != row) {
          if (this.oldRowCount1 % 2 === 1) {
            this.$refs.excelDom.toggleRowExpansion(this.oldRow1);
          } else {
            this.oldRowCount1 = 1;
          }
        } else {
          this.oldRow1 = null;
          return;
        }
      }
      // 重置上一个点击对象
      this.oldRow1 = row;
      this.getMaterial(row.orderId);
    },
    onclick() {
      let startTime = null;
      let endTime = null;
      if (this.startTime) {
        startTime = sjTime(this.startTime);
      }
      if (this.endTime) {
        endTime = sjTime(this.endTime);
      }
      if (startTime && endTime) {
        if (startTime < endTime) {
          console.log(startTime);
          console.log(endTime);
          if (
            getCookie("orgCode") == "dagangadmin" ||
            getCookie("orgCode") == "zidonghuabu" ||
            getCookie("orgCode") == "wuliuchuyunzhongxin"
          ) {
            this.option.requestUrl =
              "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26&startTime=" +
              startTime +
              "&endTime=" +
              endTime +
              "&i=" +
              new Date();
          } else {
            this.option.requestUrl =
              "/api/v1/tms/getAllTimeTaskResult?apiId=458&orderType=26&userId=" +
              getCookie("orgCode") +
              "&startTime=" +
              startTime +
              "&endTime=" +
              endTime +
              "&i=" +
              new Date();
          }
        } else {
          this.startTime = null;
          this.endTime = null;
          this.$message.warning("开始时间要比结束时间早");
        }
      } else {
      }
    },
    getMaterial(orderId) {
      console.log(orderId);
      this.axios
        .post("/api/v1/oms/getPauseTimeTaskDetail/" + orderId)
        .then(res => {
          console.log(res);
          this.tableData = res.data.data;
        });
    }
  }
};
</script>
<style lang="scss">
.sale {
  .top {
    padding: 1.25rem 1.875rem;
    .el-input {
      width: 20%;
    }
  }
}
.el-table th.el-table__cell > .cell {
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  vertical-align: middle;
  padding-left: 10px;
  padding-right: 10px;
  width: 100%;
  text-align: center;
}
.step {
  text-align: center;
}
</style>