<!--入库管理-->
<template>
  <Container>
    <el-button
      v-if="false"
      slot="left"
      type="primary"
      size="small"
      @click="$router.push({ path: '/stock/OutInWarehouse/newStorage' })"
    >
      新增
    </el-button>
    <!-- 搜索 -->
    <div
      v-if="$accessCheck($Access.InventoryInSearchAllInventoryIn)"
      slot="left"
    >
      <el-form inline size="small">
        <!--        <el-form-item>-->
        <!--          <el-input-->
        <!--            placeholder="单据编号/经办人员"-->
        <!--            style="width: 220px"-->
        <!--            @keyup.enter.native="pageChange(1)"-->
        <!--            @clear="pageChange(1)"-->
        <!--          >-->
        <!--            <el-button-->
        <!--              slot="append"-->
        <!--              icon="el-icon-search"-->
        <!--              @click="pageChange(1)"-->
        <!--            ></el-button>-->
        <!--          </el-input>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item v-if="systemType === 1">-->
        <!--          <SelectShop-->
        <!--            v-model="searchData.shopId"-->
        <!--            placeholder="选择商铺"-->
        <!--            width="150"-->
        <!--            @change="selShop"-->
        <!--            @clear="clearShop"-->
        <!--          />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item>-->
        <!--          <el-input-->
        <!--            v-model="goods"-->
        <!--            placeholder="请输入商品名称"-->
        <!--            style="width: 220px"-->
        <!--            clearable-->
        <!--            @keyup.enter.native="getUserList()"-->
        <!--            @clear="getUserList()"-->
        <!--          >-->
        <!--            <el-button-->
        <!--              slot="append"-->
        <!--              icon="el-icon-search"-->
        <!--              @click="getUserList()"-->
        <!--            ></el-button>-->
        <!--          </el-input>-->
        <!--        </el-form-item>-->
        <el-form-item>
          <el-select
            v-model="searchData.statusArr"
            multiple
            placeholder="审核状态(可多选)"
            style="width: 150px"
            @change="pageChange(1)"
          >
            <el-option
              v-for="item in status"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-date-picker
            v-model="search_time"
            type="daterange"
            :unlink-panels="true"
            range-separator="-"
            start-placeholder="制单开始日期"
            end-placeholder="制单结束日期"
            @change="searchTimeChange"
          ></el-date-picker>
        </el-form-item>
        <el-button size="small" type="primary" @click="getAllPurchaseIn(1)">
          导出
        </el-button>
      </el-form>
    </div>
    <el-tabs
      v-if="$accessCheck($Access.InventoryInSearchAllInventoryIn)"
      v-model="top_sel"
      type="card"
      @tab-click="selTopType"
    >
      <el-tab-pane
        :label="'采购入库（' + warehousingStatistics[0].count + '）'"
        name="purchaseStorage"
      ></el-tab-pane>
      <el-tab-pane
        :label="'商户入库（' + warehousingStatistics[3].count + '）'"
        name="Merchant"
      ></el-tab-pane>
      <el-tab-pane
        :label="'销售退货（' + warehousingStatistics[2].count + '）'"
        name="salesReturns"
      ></el-tab-pane>
      <el-tab-pane
        :label="'调拨入库（' + warehousingStatistics[1].count + '）'"
        name="transferWarehouse"
      ></el-tab-pane>
      <el-tab-pane
        :label="
          '全部单据（' +
          $NP.plus(
            warehousingStatistics[1].count,
            warehousingStatistics[0].count,
            warehousingStatistics[2].count,
            warehousingStatistics[3].count
          ) +
          '）'
        "
        name="allDocuments"
      ></el-tab-pane>
    </el-tabs>
    <el-tabs v-else v-model="top_sel" type="card" @tab-click="selTopType">
      <el-tab-pane label="采购入库" name="purchaseStorage"></el-tab-pane>
      <el-tab-pane label="商户入库" name="Merchant"></el-tab-pane>
      <el-tab-pane label="销售退货" name="salesReturns"></el-tab-pane>
      <el-tab-pane label="调拨入库" name="transferWarehouse"></el-tab-pane>
      <el-tab-pane label="全部单据" name="allDocuments"></el-tab-pane>
    </el-tabs>
    <!-- 表格 -->
    <el-table :data="queryData" @row-dblclick="goDetail">
      <el-table-column
        prop="id"
        label="ID"
        fixed="left"
        min-width="50"
      ></el-table-column>
      <el-table-column
        prop="no"
        min-width="180"
        label="入库单号"
        show-overflow-tooltip
      >
        <template slot-scope="scope">
          <span
            v-if="$accessCheck($Access.InventoryInGetInventoryInInfo)"
            class="click-div"
            @click="goDetail(scope.row)"
          >
            {{ scope.row.no }}
          </span>
          <span v-else>{{ scope.row.no }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="warehouseName"
        :label="top_sel !== 'transferWarehouse' ? '仓库名称' : '调入仓库'"
        min-width="140"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        v-if="storageTypeFlag"
        label="入库类型"
        min-width="130"
        show-overflow-tooltip
        prop="typeName"
      ></el-table-column>
      <el-table-column
        v-if="inventoryQuantityFlag"
        prop="materielNum"
        label="入库数量"
        min-width="90"
      >
        <template slot-scope="scope">
          {{ $_common.formatNub(scope.row.materielNum) }}
        </template>
      </el-table-column>
      <el-table-column
        v-if="auditorFlag"
        prop="auditName"
        label="审核人员"
        show-overflow-tooltip
        min-width="100"
      />
      <el-table-column
        v-if="preparedByFlag"
        prop="operatorName"
        label="制单人员"
        min-width="100"
        show-overflow-tooltip
      />
      <el-table-column
        v-if="sourceNumberFlag"
        min-width="180"
        label="来源单号"
        show-overflow-tooltip
      >
        <template slot-scope="scope">
          <span
            v-if="
              (scope.row.type === 3 &&
                $accessCheck($Access.PurchaseOrderGetPurchaseInfoById)) ||
              (scope.row.type === 15 &&
                $accessCheck($Access.AllocationFormGetAllocateInfo)) ||
              (scope.row.type === 12 &&
                $accessCheck($Access.ReturnWarehousingOrderGetOrderReturn))
            "
            class="click-div"
            @click="goOtherDetail(scope.row)"
          >
            {{ scope.row.sourceNo }}
          </span>
          <span v-else>{{ scope.row.sourceNo }}</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="auditStatusFlag"
        prop="auditStatus"
        label="审核状态"
        min-width="120"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.auditStatus === 1" class="info-status">
            未审核
          </span>
          <span v-else class="success-status">已审核</span>
        </template>
      </el-table-column>
      <el-table-column
        v-if="timeFlag"
        prop="createTime"
        label="制单日期"
        min-width="160"
      >
        <template slot-scope="scope">
          {{ $_common.formatDate(scope.row.createTime) }}
        </template>
      </el-table-column>
      <el-table-column label="操作" fixed="right" width="160">
        <template slot="header" slot-scope="scope">
          <span v-if="false">{{ scope.$index }}</span>
          <span class="operation">操作</span>
          <el-popover popper-class="custom-table-checkbox" trigger="click">
            <el-checkbox-group v-model="checkList">
              <el-checkbox
                v-for="(item, index) in columns"
                :key="index"
                :label="item.label"
                @change="change"
              ></el-checkbox>
            </el-checkbox-group>
            <el-button
              slot="reference"
              icon="el-icon-setting"
              type="text"
            ></el-button>
          </el-popover>
        </template>
        <template slot-scope="scope">
          <el-button
            v-if="['采购入库', '商户入库'].includes(scope.row.typeName)"
            :disabled="scope.row.auditStatus === 2"
            type="text"
            @click="rejectInventoryTip(scope.row.id)"
          >
            驳回
          </el-button>
          <el-button
            v-if="$accessCheck($Access.InventoryInUpdateInventoryInStatus)"
            type="text"
            :disabled="scope.row.auditStatus === 2"
            @click="updatePurchaseInStatus(scope.row.id)"
          >
            审核
          </el-button>
          <el-button
            v-if="['采购入库', '销售退货入库'].includes(scope.row.typeName)"
            type="text"
            @click="openUrl(scope.row.id)"
          >
            打印
          </el-button>
          <el-button
            v-if="['商户入库'].includes(scope.row.typeName)"
            type="text"
            @click="openPrintMerchants(scope.row.id)"
          >
            打印
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- // 表格 -->
    <FooterPage
      :page-size="pageSize"
      :total-page.sync="total_data"
      :current-page.sync="page"
      @pageChange="pageChange"
      @sizeChange="sizeChange"
    ></FooterPage>
  </Container>
</template>

<script>
  import SelectShop from "@/component/goods/SelectShop.vue";

  import {
    statisticsAllPurchaseIn,
    updatePurchaseInStatus,
    getAllPurchaseIn,
    exportsGetAllPurchaseIn,
    searchAllPurchaseIn,
    rejectInventory,
    getPurchaseInInfo,
  } from "@/api/Stock";
  import { exportSearchAllPurchaseDetails } from "@/api/Purchase";

  export default {
    name: "Storage",
    // components: {
    //   SelectShop,
    // },
    data() {
      return {
        goods: "",
        search_time: [],
        productionData: "",
        shopId: "",
        shopName: "",
        show_shop: false,
        is_check: false,
        top_sel: "purchaseStorage",
        warehouseData: [], // 所有仓库数据
        operatorList: [], // 获取所有操作人列表
        supplierData: [], // 所有供应商数据
        source: 3,
        searchData: {
          source: 3,
          statusArr: [],
          shopId: "",
          shopName: "",
          goodsName: "",
          operatorId: "",
          startTime: "",
          endTime: "",
        },
        status: [
          // { value: 1, label: '暂存' },
          { value: 1, label: "待审核" },
          { value: 2, label: "审核通过" },
          // { value: 4, label: '审核失败' }
        ],
        page: 1,
        pageSize: 10,
        warehousingStatistics: [
          { count: 0 },
          { count: 0 },
          { count: 0 },
          { count: 0 },
        ],
        total_data: 1,
        queryData: [],
        checkList: [
          "入库类型",
          "入库数量",
          "审核人员",
          "制单人员",
          "来源单号",
          "审核状态",
          "制单日期",
        ],
        columns: [
          {
            label: "入库类型",
          },
          {
            label: "入库数量",
          },
          {
            label: "审核人员",
          },
          {
            label: "制单人员",
          },
          {
            label: "来源单号",
          },
          {
            label: "审核状态",
          },
          {
            label: "制单日期",
          },
        ],
        storageTypeFlag: true,
        inventoryQuantityFlag: true,
        auditorFlag: true,
        preparedByFlag: true,
        sourceNumberFlag: true,
        auditStatusFlag: true,
        timeFlag: true,
      };
    },
    computed: {
      type_on_color() {
        return { color: this.themeA };
      },
      type_on_style() {
        return {
          borderColor: this.themeA,
          // backgroundColor: this.hexToRgba(this.themeA, 10).rgba,
        };
      },
    },
    created() {
      this.statisticsAllPurchaseIn();
      this.getAllPurchaseIn();
      this.productionData = new Date().getTime();
    },
    activated() {
      if (this.$_isInit()) return;
      this.getData();
      this.statisticsAllPurchaseIn();
      this.productionData = new Date().getTime();
    },
    methods: {
      // 打印
      openUrl(id) {
        let routeData = this.$router.resolve({
          path: `/StoragePrinting/${id}`,
        });
        window.open(routeData.href, "_blank");
      },
      //打印商户入库
      openPrintMerchants(id) {
        let routeData = this.$router.resolve({
          path: `/PrintMerchants/${id}`,
        });
        window.open(routeData.href, "_blank");
      },
      goDetail(row) {
        if (!this.$accessCheck(this.$Access.InventoryInGetInventoryInInfo)) {
          return;
        }
        this.$router.push("/stock/OutIn/storageInfo/" + row.id);
      },
      //  入库统计
      async statisticsAllPurchaseIn() {
        if (!this.$accessCheck(this.$Access.InventoryInSearchAllInventoryIn)) {
          return;
        }
        const { data } = await statisticsAllPurchaseIn({
          type: [
            3, // 采购入库
            12, // 调拨入库
            15, // 销售退货
            30, //商户入库
          ],
        });
        this.warehousingStatistics = data;
      },
      goOtherDetail(row) {
        switch (row.type) {
          case 3: // 采购入库
            this.$router.push(
              "/Purchase/ManageP/PurchaseOrderLook/" + row.sourceId
            );
            break;
          case 15: // 销售退货
            this.$router.push("/order/manageO/LookWareOrder/" + row.sourceId);
            break;
          case 12: // 调拨入库
            this.$router.push("/stock/OutIn/outgoingInfo/" + row.sourceId);
            break;
        }
      },
      // 顶部筛选
      selTopType(tag) {
        switch (this.top_sel) {
          case "purchaseStorage":
            this.searchData.source = 3;
            break;
          case "salesReturns":
            this.searchData.source = 15;
            break;
          case "transferWarehouse":
            this.searchData.source = 12;
            break;
          case "allDocuments":
            // this.searchData.statusArr = []
            this.searchData.source = "";
            break;
          case "Merchant":
            // this.searchData.statusArr = []
            this.searchData.source = 30;
            break;
        }
        this.source = this.searchData.source;
        this.pageChange(1);
      },
      // 入库审核
      updatePurchaseInStatus(id) {
        this.$router.push("/stock/OutIn/storageInfo/" + id);
        return;
        // 开启保质期设置，进行保质期验证
        if (this.shelfLifeSetUp === 5) {
          this.$router.push("/stock/OutIn/storageInfo/" + id);
          return;
        }
        this.$confirm("确定要审核该入库单吗？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(async () => {
          const data = await updatePurchaseInStatus({
            id: id,
            auditName: this.userName,
          });

          this.$message({
            type: "success",
            message: "操作成功!",
          });
          await this.getAllPurchaseIn();
        });
      },
      //  获取列表
      async getAllPurchaseIn(exports) {
        const params = {
          warehouseId: this.searchData.shopId,
          auditStatus: this.searchData.statusArr,
          type: this.searchData.source,
          start: this.searchData.startTime,
          end: this.searchData.endTime,
          search: this.searchData.goodsName,
          page: this.page,
          pageSize: this.pageSize,
        };
        if (exports) {
          params.export = exports;
          const target = await exportsGetAllPurchaseIn({
            ...params,
          });
        } else {
          const { data, pageTotal } = await getAllPurchaseIn({ ...params });
          this.queryData = data;
          this.total_data = pageTotal;
        }
      },
      //  搜索
      async searchAllPurchaseIn() {
        const { data, pageTotal } = await searchAllPurchaseIn({
          warehouseId: this.searchData.shopId,
          auditStatus: this.searchData.statusArr,
          type: this.searchData.source,
          start: this.searchData.startTime,
          end: this.searchData.endTime,
          search: this.searchData.goodsName,
          page: this.page,
          pageSize: this.pageSize,
        });

        this.queryData = data;
        this.total_data = pageTotal;
      },
      //  判断
      getData() {
        // const searchData = this.$_common.deepClone(this.searchData);
        // delete searchData.source;
        // const isKey = this.$_common.isSerch(searchData);
        // if (isKey) {
        //   this.searchAllPurchaseIn();
        // } else {
        //   this.getAllPurchaseIn();
        // }
        this.getAllPurchaseIn();
      },
      clearShop() {
        this.searchData.shopId = "";
        this.searchData.shopName = "";
        this.searchData.warehouseId = "";
        this.pageChange(1);
      },
      selShop(val, row) {
        this.searchData.shopName = row[0].name;
        this.pageChange(1);
      },
      pageChange(page) {
        this.page = page;
        this.getData();
      },
      sizeChange(size) {
        this.pageSize = size;
        this.pageChange(1);
      },
      // 时间组件导出数据
      searchTimeChange(val) {
        if (val && val.length) {
          this.searchData.startTime = val[0] / 1000;
          this.searchData.endTime = val[1] / 1000 + 86399;
        } else {
          this.searchData.startTime = "";
          this.searchData.endTime = "";
        }
        this.pageChange(1);
      },
      change() {
        this.storageTypeFlag = this.checkList.some(
          (item) => item === "入库类型"
        );
        this.inventoryQuantityFlag = this.checkList.some(
          (item) => item === "入库数量"
        );
        this.auditorFlag = this.checkList.some((item) => item === "审核人员");
        this.preparedByFlag = this.checkList.some(
          (item) => item === "制单人员"
        );
        this.sourceNumberFlag = this.checkList.some(
          (item) => item === "来源单号"
        );
        this.auditStatusFlag = this.checkList.some(
          (item) => item === "审核状态"
        );
        this.timeFlag = this.checkList.some((item) => item === "制单日期");
      },
      // 驳回提示
      rejectInventoryTip(id) {
        this.$confirm("确定要驳回该入库单吗？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(async () => {
          this.getPurchaseInInfo(id);
        });
      },
      // 获取详情
      async getPurchaseInInfo(id) {
        const { data } = await getPurchaseInInfo(id);
        const inventoryInDetailIds = data.details.map((item) => {
          return item.id;
        });
        this.rejectInventory(id, inventoryInDetailIds);
      },
      // 驳回接口
      async rejectInventory(inventoryInId, inventoryInDetailIds) {
        const data = await rejectInventory({
          inventoryInId: inventoryInId,
          inventoryInDetailIds: inventoryInDetailIds,
        });
        this.$message({
          type: "success",
          message: "操作成功!",
        });
        this.getAllPurchaseIn();
      },
    },
  };
</script>

<style scoped lang="scss">
  .query-form-view {
    /*background: #f7f8fa;*/
    padding: 10px;
    border: 1px solid #eee;
    margin-bottom: 10px;
  }
  .customer-type-li {
    background: #fff;
    padding: 10px;
    border: 1px solid #eee;
    cursor: pointer;
    box-shadow: 0 0 4px 0 hsla(0, 0%, 73%, 0.5);
  }
  .num-p {
    font-size: 12px;
    color: #969799;
  }
  /* .type-row{
    border-bottom: 1px solid #dcdee0;
    padding-bottom: 10px;
  } */
  .custom-table-checkbox {
    .el-checkbox {
      display: block !important;
      margin: 0 0 $base-padding/4 0;
    }
  }
</style>
