<template>
  <div class="sellReturn 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" @selection="handleSelection"
        @screen-reset="
          pageInfo.curr = 1;
        parmValue.page = 1;
        searchList();
        " @screen-submit="
  pageInfo.curr = 1;
parmValue.page = 1;
searchList();
">
        <template #table-header="{ }">
          <div style="width: 100%">
            <el-row style="padding: 0 0 0 80px">
              <!-- 时间区间 -->
              <el-col :span="6" style="width: 363px; padding: 0 0 0 10px">
                <period-date-picker :type="1" :width="'165px'" :size="searchSize" :start="parmValue.start"
                  :end="parmValue.end" placeholder="申请" @timeReturned="handleTime" />
              </el-col>

              <el-col :span="6" style="width: 240px; padding: 0 0 0 10px">
                <el-input size="mini" v-model="parmValue.orderCode" placeholder="退货销售编号" @change="
                  pageInfo.curr = 1;
                parmValue.page = 1;
                searchList();" />
              </el-col>

              <el-col :span="6" style="width: 240px; padding: 0 0 0 10px">
                <el-input size="mini" placeholder="退货编号" v-model="parmValue.thCode" @change="
                  pageInfo.curr = 1;
                parmValue.page = 1;
                searchList();" />
              </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-row>

            <el-row style="padding: 10px 0 0 0">
              <el-col :span="6" style="width: 240px; padding: 0 10px 0 0">
                <el-input size="mini" placeholder="退货商品编号" v-model="parmValue.good_code" @change="
                  pageInfo.curr = 1;
                parmValue.page = 1;
                searchList();" />
              </el-col>

              <el-col :span="4" style="width: 200px;margin-left:10px">
                <el-select :size="searchSize" v-model="parmValue.status" filterable clearable placeholder="状态"
                  style="width: 100%" @change="
                    pageInfo.curr = 1;
                  parmValue.page = 1;
                  searchList();
                  ">
                  <el-option v-for="item in statusOptions" :key="'status' + item.value" :label="item.label"
                    :value="item.value" />
                </el-select>
              </el-col>

              <el-col :span="4" class="fr" style="width: 66px; padding: 0 0 0 10px">
                <el-button type="warning" class="fr" :size="searchSize" @click="restSearch">
                  重置
                </el-button>
              </el-col>
            </el-row>
          </div>
        </template>
        <template #status="{ scope }">
          <el-tag :size="tablebtnSize" :type="scope.row.status == '0' ? 'warning' : ''" v-text="(statusOptions.find((item) => item.value == scope.row.status) || {})
            .label || '--'
            "></el-tag>
        </template>

        <template #use_type="{ scope }">
          <el-tag size="mini">
            {{
              (usetypeOtions.find(({ value }) => value === scope.row.use_type) || {})
                .label || "---"
            }}
          </el-tag>
        </template>

        <template #th_type="{ scope }">
          <el-tag size="mini">
            {{ scope.row.th_type === "1" ? "售前退货" : "售后退货" }}
          </el-tag>
        </template>

        <template #cgdNo="{ scope }">
          {{ scope.row.purcheaseOrder ? scope.row.purcheaseOrder.cgdNo : '--' }}
        </template>

        <template #goodCode="{ scope }">
          {{ scope.row.purcheaseOrder ? scope.row.purcheaseOrder.spuCode : '--' }}
        </template>

        <template #goodName="{ scope }">
          {{ scope.row.purcheaseOrder ? scope.row.purcheaseOrder.good_name : '--' }}
        </template>

        <template #stockNum="{ scope }">
          {{ scope.row.purcheaseOrder ? scope.row.purcheaseOrder.good_num : '--' }}
        </template>

        <template #order_type="{ scope }">
          <el-tag :size="tablebtnSize" v-text="(
            xs_order_type_options.find((item) => item.id == scope.row.order_type) ||
            {}
          ).label || '--'
            "></el-tag>
        </template>

        <template #has_account="{ scope }">
          <el-tag :size="tablebtnSize" :type="(
            has_account_list.find(
              (item) => item.code == scope.row.has_account + ''
            ) || {}
          ).type || '--' " 
          v-text="(
            has_account_list.find(
              (item) => item.code == scope.row.has_account + ''
            ) || {}
          ).name || '--'
          "></el-tag>
        </template>
        <template #operation="{ scope }">
          <el-button type="text" size="mini" @click="handleAssociation(scope)"
            v-if="(scope.row.status === '1' || scope.row.status === '3') && powers.includes('098')">关联采购单</el-button>
            
            <el-button type="text" size="mini" 
              v-if="scope.row.status === '2' && powers.includes('099')" 
              @click="handleSecure(scope.row.id, scope.row.purcheaseOrder.cgdNo)">解除关联</el-button>
        </template>
      </ex-table>

      <AssociationModal :id="recordId" :showModel="centerDialogVisible" @refresh="searchList"
        @cancel="centerDialogVisible = false" />
    </div>
    <div v-else>
      <no-auth></no-auth>
    </div>
  </div>
</template>

<script>
import mixinPage from "@/mixins/elPaginationHandle";
import resToken from "@/mixins/resToken";
import columns from "./columns";
import asyncRequest from "@/apis/service/sellOut/returnTransferStock";
import AssociationModal from "./component/association-modal.vue"
import { mapGetters } from "vuex";
import urlConfig from "@/apis/url-config";
import companyHelper from "@/mixins/companyHelper";

import {
  xs_order_type_options,
  xs_order_source_options,
  has_account_list,
  usetypeOtions,
} from "@/assets/js/statusList";

export default {
  name: "returnTransferStock",
  mixins: [mixinPage, resToken, companyHelper],
  components: { AssociationModal },
  computed: {
    ...mapGetters(["tablebtnSize", "searchSize", "size", "isSupertube"]),
    powers() {
      const { btnList } = this.$store.getters;
      const tran = btnList.find((item) => item.menu_route == "returnTransferStock") || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
  },
  data() {
    return {
      xs_order_type_options,
      xs_order_source_options,
      fileUrl: urlConfig.baseURL,
      usetypeOtions,
      has_account_list,
      centerDialogVisible: false,
      select: "returnCode", //默认选择下拉框
      s_input: "", //搜索框内容
      select_list: [],
      sitem: null,
      cancelStatus: ["1", "8", "9", "10"],
      // 状态
      statusOptions: [
        { value: "1", label: "待关联" },
        { value: "2", label: "已关联" },
        { value: "3", label: "已取消关联" }
      ],
      loading: false,
      showModel: false,
      isDetail: false,
      modelId: 0,
      parmValue: {
        orderCode: "",
        thCode: "",
        good_code: "",
        companyNo: "",
        start: "",
        end: "",
        status: "", //节点状态
        page: 1, // 页码
        size: 15, // 每页显示条数
      },
      tableData: [],
      passwordModel: false,
      passwordModelId: 0,
      isPasswordDetail: false,
      // 表格 - 数据
      tableData: [],
      // 表格 - 参数
      table: {
        stripe: true,
        border: true,
        _defaultHeader_: ["setcol"],
      },
      // 表格 - 分页
      pageInfo: {
        size: 15,
        curr: 1,
        total: 0,
      },
      // 表格 - 列参数
      columns: columns,
    };
  },
  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.select = this.parmValue.select;
      // this.sselect = this.parmValue.sselect;
      this.s_input = this.parmValue.s_input;
    } else {
      this.select = "returnCode";
    }
    this.searchList();
  },

  methods: {
    handleAssociation(scope) {
      this.centerDialogVisible = true;
      this.recordId = scope.row.id
    },
    companyNosearchChange({ code }) {
      this.parmValue.companyNo = code
      this.searchList();
    },
    async supplierChange(e) {
      const { code, label } = e;
      this.parmValue.supplierNo = code ? [code] : [];
      this.parmValue.supplierName = label;
      this.searchList();
    },
    customer_code_change(e) {
      this.parmValue.customer_code = [e.code];
      this.parmValue.customerName = e.label
      this.searchList();
    },
    handleExport() {
      if (this.select_list.length === 0) {
        this.$message.warning("请选择一条退货单");
        return;
      }

      const returnCode = this.select_list.map(({ returnCode }) => returnCode);
      if (!this.loading) {
        this.loading = true;
        let httpType = `aplication/zip`;
        axios({
          method: "post",
          url: this.fileUrl + "/admin/reorderExport",
          responseType: "blob",
          data: { returnCode },
          headers: {
            Accept: httpType,
          },
        })
          .then((res) => {
            if (res && res.status == 200 && res.data) {
              let url = window.URL.createObjectURL(
                new Blob([res.data], { type: httpType })
              );
              let link = document.createElement("a");
              link.style.display = "none";
              link.href = url;
              let excelName = "退货单.zip";
              link.setAttribute("download", excelName);
              document.body.appendChild(link);
              link.click();
              link.remove();
              window.URL.revokeObjectURL(url); //释放掉blob对象
              this.$message.success(`导出成功！`);
              setTimeout(() => {
                this.loading = false;
              }, 500);
            } else {
              this.$message.error(res.data.message);
              setTimeout(() => {
                this.loading = false;
              }, 500);
            }
          })
          .catch((error) => {
            console.log(error);
            this.loading = false;
          });
      }
    },
    handleSelection(order) {
      const { list } = order;
      this.select_list = list;
    },
    async handleSecure(id, rela_cgdNo) {
      this.$confirm("是否确认解除关联", "").then(async () => {
          this.loading = true
          const response = await asyncRequest.thstockstatus({ rela_cgdNo, status: "3", id })
          this.loading = false
          if (Number(response.code) === 0) {
            this.searchList();
          } else {
            this.$message.warning(response.message)
          }
      })
    },
    getRouter(toRouter, queryId) {
      if (toRouter && queryId) {
        let model = {
          id: queryId,
          // type: 'view',
        };

        //有多选框的条件
        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.s_input = ""; //清除输入框内容
      this.select = ""; //清除下拉框选中项
      this.parmValue = {
        orderCode: "",
        thCode: "",
        good_code: "",
        companyNo: "",
        start: "",
        end: "",
        status: "", //节点状态
        page: 1, // 页码
        size: 15, // 每页显示条数
      };
      // 表格 - 分页
      this.pageInfo = {
        size: 15,
        curr: 1,
        total: 0,
      };
      this.searchList();
    },

    openModal(id, isDetail, sitem) {
      this.showModel = true;
      this.modelId = id;
      this.isDetail = isDetail;
      this.sitem = sitem;
    },
    async searchList() {
      if (
        (this.parmValue.start !== "" && this.parmValue.end === "") ||
        (this.parmValue.start === "" && this.parmValue.end !== "")
      ) {
        this.$message.warning("时间区间不完整！");
        return;
      }
      this.loading = true;

      let model = JSON.parse(JSON.stringify(this.parmValue));

      const res = await asyncRequest.list({
        ...model,
        // customer_code: Array.isArray(this.parmValue.customer_code)
        //   ? this.parmValue.customer_code[0]
        //   : this.parmValue.customer_code,
        // supplierNo: Array.isArray(model.supplierNo) ? model.supplierNo[0] : model.supplierNo,
        // needRela: true,
        companyNo: this.currentCompany
      });

      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;
    },

    //物流公司查询
    async handleCompany(e) {
      console.log(e, "要求传快递简称，不传id"); //
      if (e && e.code) {
        this.parmValue.postCompany = [e.shortName];
        this.parmValue.page = 1;
      }
      await this.searchList();
    },

    // 时间
    async handleTime(e) {
      if (e.startTime !== "") {
        this.parmValue.start = e.startTime;
      } else {
        this.parmValue.start = "";
      }
      if (e.endTime !== "") {
        this.parmValue.end = e.endTime;
      } else {
        this.parmValue.end = "";
      }
      if (this.parmValue.start !== "" && this.parmValue.end !== "") {
        this.parmValue.page = 1;
        await this.searchList();
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.sellReturn {}
</style>
