<!--库存流水-->
<template>
  <ContainerQuery>
    <div slot="left">
      <el-dropdown
        v-if="$accessCheck($Access.inventoryInfoAddStocktaking)"
        type="primary"
        split-button
        @click="$router.push('/stock/WarehouseManagement/AddInventoryInfo')"
      >
        新建盘点
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item>
            <div class="dropdown-div" @click="getData(1)">导出</div>
          </el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
      <el-button v-else size="small" type="primary" @click="getData(1)">
        导出
      </el-button>
    </div>
    <!-- 搜索 -->
    <div
      v-if="$accessCheck($Access.inventoryInfoSearchAllStocktaking)"
      slot="more"
    >
      <el-form inline size="small">
        <el-form-item>
          <el-input
            v-model="searchData.keyWord"
            placeholder="商品名称/条码/编码/单号/制单人"
            style="width: 280px"
            clearable
            @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>
          <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-form>
    </div>

    <!-- // 搜索 -->
    <!-- 表格 -->
    <el-table :data="tabelData" @row-dblclick="goDetail">
      <el-table-column
        prop="id"
        align="left"
        label="ID"
        min-width="50"
      ></el-table-column>
      <el-table-column
        prop="no"
        align="left"
        label="盘点单号"
        show-overflow-tooltip
        min-width="180"
      >
        <template slot-scope="scope">
          <span
            v-if="$accessCheck($Access.inventoryInfoGetStocktakingInfo)"
            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="auditStatus"
        align="left"
        label="单据状态"
        min-width="100"
      >
        <template slot-scope="scope">
          <span v-if="scope.row.auditStatus === 1" class="info-status">
            待审核
          </span>
          <span v-if="scope.row.auditStatus === 2" class="success-status">
            已审核
          </span>
          <span v-if="scope.row.auditStatus === 3" class="danger-status">
            审核未通过
          </span>
          <span v-if="scope.row.auditStatus === 4" class="warning-status">
            审核中
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="warehouseName"
        align="left"
        label="仓库/门店"
        min-width="140"
        :show-overflow-tooltip="true"
      ></el-table-column>
      <el-table-column
        prop="num"
        align="left"
        label="种类数"
        min-width="80"
      ></el-table-column>
      <el-table-column
        prop="createTime"
        align="left"
        label="盘点日期"
        min-width="160"
      >
        <template slot-scope="scope">
          {{ $_common.formatDate(scope.row.createTime, "yyyy-MM-dd") }}
        </template>
      </el-table-column>
      <el-table-column
        prop="operatorName"
        align="left"
        label="制单人"
        min-width="100"
      ></el-table-column>
      <el-table-column
        header-align="left"
        align="left"
        fixed="right"
        label="操作"
        min-width="160"
      >
        <template slot-scope="scope">
          <el-button
            v-if="$accessCheck($Access.inventoryInfoAuditStocktaking)"
            :disabled="parseInt(scope.row.auditStatus) === 2"
            type="text"
            @click="updateAuditStatus(scope.row)"
          >
            审核
          </el-button>

          <el-button
            v-if="
              $accessCheck($Access.inventoryInfoGetStocktakingInfo) &&
              $accessCheck($Access.inventoryInfoUpdateStocktaking)
            "
            type="text"
            :disabled="parseInt(scope.row.auditStatus) === 2"
            @click="
              $router.push(
                '/stock/WarehouseManagement/EditInventoryInfo/' + 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>
  </ContainerQuery>
</template>

<script>
  import {
    auditStocktaking,
    getAllStocktaking,
    exportSearchAllStocktaking,
    exportGetAllStocktaking,
    searchAllStocktaking,
  } from "@/api/Stock";
  export default {
    name: "Flowing",
    data() {
      return {
        page: 1, // 页码
        pageSize: 10, // 每页显示条数
        total_data: 0,
        search_time: [],
        tabelData: [],
        stock_list: [],
        searchData: {
          startTime: "",
          endTime: "",
          keyWord: "",
        },
      };
    },
    async created() {
      await this.getAllStocktaking();
    },
    activated() {
      if (this.$_isInit()) return;
      this.getData();
    },
    methods: {
      goDetail(row) {
        if (!this.$accessCheck(this.$Access.inventoryInfoGetStocktakingInfo)) {
          return;
        }
        this.$router.push(
          "/stock/WarehouseManagement/InventoryDetail/" + row.id
        );
      },
      //  审核
      async updateAuditStatus(row) {
        this.$confirm("确定要审核通过该单据吗?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(async () => {
          const data = await auditStocktaking(row.id, {
            auditName: this.userName,
          });

          this.$message({
            type: "success",
            message: "审核成功",
          });
          this.getAllStocktaking();
        });
      },
      // 盘点库存列表
      async getAllStocktaking(exports) {
        if (exports) {
          const target = await exportGetAllStocktaking({
            page: this.page,
            pageSize: this.pageSize,
            export: 1,
          });
        } else {
          const data = await getAllStocktaking({
            page: this.page,
            pageSize: this.pageSize,
          });

          this.tabelData = data.data;
          this.total_data = data.pageTotal;
        }
      },
      //  盘点库存搜索
      async searchAllStocktaking(exports) {
        const params = {
          start: this.searchData.startTime,
          end: this.searchData.endTime,
          search: this.searchData.keyWord,
          page: this.page,
          pageSize: this.pageSize,
        };
        if (exports) {
          const target = await exportSearchAllStocktaking({
            ...params,
            export: 1,
          });
        } else {
          const data = await searchAllStocktaking({
            ...params,
          });

          this.tabelData = data.data;
          this.total_data = data.pageTotal;
        }
      },
      //  判断
      getData(exports) {
        const isKey = this.$_common.isSerch(this.searchData);
        if (isKey) {
          this.searchAllStocktaking(exports);
        } else {
          this.getAllStocktaking(exports);
        }
      },
      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);
      },
    },
  };
</script>

<style>
  .box-search-form .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 10px;
  }
</style>
