<template>
  <div class="pagePadding">
    <div
      v-if=" powers.some((i) => i == '001')"
    >
    <ex-table
      v-loading="loading"
      :table="table"
      :data="tableData"
      :columns="columns"
      :page="pageInfo"
      :size="size"
      @page-curr-change="handlePageChange"
      @page-size-change="handleSizeChange"
      @screen-reset="
        pageInfo.curr = 1;
        parmValue.page = 1;
        searchList();
      "
      @screen-submit="
        pageInfo.curr = 1;
        parmValue.page = 1;
        searchList();
      "
      @selection="selection_change"
    >
      <template #table-header="{}">
        <div style="width: 100%">
          <el-row style="padding: 0 0 0 80px">
            <el-col :span="4" style="width: 106px; float: left">
              <el-button
                type="primary"
                style="margin-left: 30px"
                @click="dialogFormVisible = true"
                :size="searchSize"
                class="fr"
              >
                筛选条件汇总
              </el-button>
            </el-col>
            <el-col :span="3" style="width: 66px; float: right">
              <el-button
                :size="searchSize"
                type="primary"
                style="float: right; margin-left: 5px"
                @click="searchList()"
              >
                刷新
              </el-button>
            </el-col>
            <el-col :span="4" style="width: 66px; float: right">
              <el-button
                type="warning"
                class="fr"
                :size="searchSize"
                @click="restSearch"
              >
                重置
              </el-button>
            </el-col>
          </el-row>
        </div>
      </template>

      <template #operation="{ scope }">
        <el-tooltip effect="dark" content="详情" placement="top"  v-if="powers.some((i) => i == '007')">
          <!-- 路由跳转参数需更改 -->
          <i
            class="el-icon-view tb-icon"
            @click="getRouter(`standingBookDetail`, scope.row.id)"
          ></i>
        </el-tooltip>
      </template>
    </ex-table>

    <el-dialog
      title="筛选条件汇总"
      :visible.sync="dialogFormVisible"
      width="1140px"
    >
      <div>
        <el-col
          style="padding: 0 20px 30px"
          v-for="(item, index) in schTahead"
          :span="8"
          :key="item.prop + index"
        >
          <!-- <el-tooltip
            class="item"
            effect="dark"
            :content="parmValue[item.prop]"
            placement="top"
          ></el-tooltip> -->
            <el-input v-model="parmValue[item.prop]" :placeholder="item.label+'编号'">
              <template slot="prepend">
                <div style="width: 70px">{{ item.label }}</div>
              </template>
            </el-input>
          
        </el-col>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="clear">清空</el-button>
        <el-button type="primary" @click="search">搜索</el-button>
      </div>
      <div style="margin-bottom: 20px"></div>
    </el-dialog>
  </div>
  <div v-else>
      <no-auth></no-auth>
    </div>
  </div>
</template>
   <script>
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
import urlConfig from "@/apis/url-config";
import asyncRequest from "@/apis/service/reportQuery/standingBook";
import { columns, schTahead } from "./columns";
import { mapGetters } from "vuex";

export default {
  name: "standingBook",
  mixins: [mixinPage, resToken],
  components: {},
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size"]),
     powers() {
      const tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "standingBook"
        ) || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
  },
  data() {
    return {
      dialogFormVisible: false,
      //选中数组
      changeList: [],
      //全局url
      fileUrl: urlConfig.baseURL,
      //loading
      loading: false,
      //请求参数集合
      parmValue: {
        page: 1, // 页码
        size: 15, // 每页显示条数
        start_date: "",
        end_date: "",

        standBookNo: "",
        projectNo: "",
        infoNo: "",
        bargainNo: "",
        bk_code: "",
        orderCode: "",
        outCode: "",
        returnCode: "",
        thNo: "",
        returnGoodCode: "",
        cgdNo: "",
        wsm_in_code: "",
        cgdReturnCode: "",
        spuCode: "",
        skuCode: "",
        order_type: "",
        supplierNo: "",
        companyNo: "",
        customer_code: "",
      },
      // 表格 - 数据集合
      tableData: [],
      // 表格 - 参数
      table: {
        stripe: true,
        border: true,
        _defaultHeader_: ["setcol"],
      },
      // 表格 - 分页
      pageInfo: {
        size: 15,
        curr: 1,
        total: 0,
      },
      // 表格表头 - 列参数
      columns: columns,

      //筛选相关
      schTahead: schTahead,
    };
  },
  mounted() {
    const { back } = this.$route.query;
    if (back) {
      this.parmValue = JSON.parse(back);
      const { page, size } = this.parmValue;
      this.pageInfo = {
        size: size,
        curr: page,
        total: 0,
      };
    }
    this.searchList();
  },

  methods: {
    //搜索
    async search() {
      let index = 0;
      for(let item of this.schTahead){
        if((this.parmValue[item.prop] ?? "") != ""){
          index++
        }
      }
      if(index>1){
        this.$message.warning("只能同时搜索一条编号")
        this.dialogFormVisible = false;
        return;
      }

      this.pageInfo = {
        size: 15,
        curr: 1,
        total: 0,
      },
      this.searchList();
      this.dialogFormVisible = false;
    },
    //初始化http请求
    async searchList() {
      if (
        (this.parmValue.start_date !== "" && this.parmValue.end_date === "") ||
        (this.parmValue.start_date === "" && this.parmValue.end_date !== "")
      ) {
        this.$message.warning("时间区间不完整！");
        return;
      }

      this.loading = true;

      const res = await asyncRequest.standbooklist(this.parmValue);
      if (res && res.code === 0 && res.data) {
        this.tableData = res.data.list;
        this.pageInfo.total = Number(res.data.count);
      } else if (res && res.code >= 100 && res.code <= 104) {
        await this.logout();
      } else {
        this.tableData = [];
        this.pageInfo.total = 0;
      }
      this.loading = false;
    },
    //点击详情
    getRouter(toRouter, queryId) {
      // this.$router.push(toRouter)
      // return;
      if (toRouter && queryId) {
        let model = {
          id: queryId,
          // row:row,
          type: "view",
        };
        // alert(queryId)

        //有多选框的条件
        // this.parmValue.select = this.select ;
        // this.parmValue.sselect = this.sselect ;
        // this.parmValue.s_input= this.s_input;
        //
        let routerModel = {
          options: JSON.parse(JSON.stringify(this.parmValue)),
          router: this.$route.path,
        };
        model.preModel = JSON.stringify(routerModel);

        this.routeGoto(toRouter, model);
      } else {
        this.$message.warning("暂未找到相关流程！");
      }
    },

    //重置
    restSearch() {
      this.parmValue = {
        // is_export:0,//是否导出0/1
        page: 1, // 页码
        size: 15, // 每页显示条数
        start_date: "",
        end_date: "",

        standBookNo: "",
        projectNo: "",
        infoNo: "",
        bargainNo: "",
        bk_code: "",
        orderCode: "",
        outCode: "",
        returnCode: "",
        thNo: "",
        returnGoodCode: "",
        cgdNo: "",
        wsm_in_code: "",
        cgdReturnCode: "",
        spuCode: "",
        skuCode: "",
        order_type: "",
        supplierNo: "",
        companyNo: "",
        customer_code: "",
      };
      // 表格 - 分页
      this.pageInfo = {
        size: 15,
        curr: 1,
        total: 0,
      };
      this.searchList();
    },

    //选中触发函数
    selection_change(e) {
      const { list } = e;
      //选中的数组集合
      this.changeList = list.length > 0 ? JSON.parse(JSON.stringify(list)) : [];
    },
    //清空
    clear() {
      this.parmValue = {
        // is_export:0,//是否导出0/1
        page: 1, // 页码
        size: 15, // 每页显示条数
        start_date: "",
        end_date: "",

        standBookNo: "",
        projectNo: "",
        infoNo: "",
        bargainNo: "",
        bk_code: "",
        orderCode: "",
        outCode: "",
        returnCode: "",
        thNo: "",
        returnGoodCode: "",
        cgdNo: "",
        wsm_in_code: "",
        cgdReturnCode: "",
        spuCode: "",
        skuCode: "",
        order_type: "",
        supplierNo: "",
        companyNo: "",
        customer_code: "",
      };
    },
  },
};
</script>
   <style lang="scss" scoped>
.purchaseOrder {
  // text-align: right;
}
/deep/.table-header {
  margin: 10px 0 5px 0;
}

/deep/ .el-dialog {
  padding-bottom: 10px;
}
/deep/ .el-dialog__body{
  padding: 0;
}
</style>
   