<template>
  <div class="app-container">
    <div style="margin-bottom: 20px;display: flex;align-items: center;justify-content: space-between;">
      <div>
        {{ '盘点结果' }}
        <el-text v-show="dialogParams.status == 0">(当前为正常数据)</el-text>
        <el-text v-show="dialogParams.status == 1">(当前为未扫描到，但数据库里有的数据)</el-text>
        <el-text v-show="dialogParams.status == 2">(当前为已扫描到，但数据库里没有的数据)</el-text>
      </div>
      <el-button
        type="warning"
        plain
        icon="Download"
        @click="handleExport"
      >导出</el-button>
    </div>


    <el-tabs v-model="activeTabs" type="border-card" @tab-change="handleQueryInfo">
      <el-tab-pane v-for="item in statusList" :label="item.label" :name="item.value">
        <el-table :data="dialogData" border empty-text="暂无数据" show-overflow-tooltip show-summary
          :summary-method="getSummaries" v-if="dialogParams.status == 0 || dialogParams.status == 1">
          <el-table-column label="序号" align="center" type="index" width="70" />
          <el-table-column label="单据号" align="center" prop="billNo" width="180" />
          <el-table-column label="库存类型" align="center" prop="operationTypeName" width="150" />
          <el-table-column label="订单编号" align="center" prop="sapNo" width="150" />
          <el-table-column label="项目号" align="center" prop="xmNo" width="150" />
          <el-table-column label="项目描述" align="center" prop="xmMs" width="150" />
          <el-table-column label="物料号" align="center" prop="wlNo" width="100" />
          <el-table-column label="物料描述" align="center" prop="wlMs" width="150" />
          <el-table-column label="供应商名称" align="center" prop="gysMc" width="150" />
          <el-table-column label="合同单价" align="center" prop="htDj" />
          <el-table-column label="总计" align="center" prop="totalAmount" />
          <el-table-column label="单位" align="center" prop="dw" />
          <el-table-column label="实际入库数量" align="center" prop="realQty" width="120" />
          <el-table-column label="库位码" align="center" prop="pcode" width="120" />
          <el-table-column label="托盘码" align="center" prop="trayCode" />
          <el-table-column label="身份码" align="center" prop="entityId" width="150" />
          <el-table-column label="物资类型" align="center" prop="wlTypeName" />
          <el-table-column label="场景" align="center" prop="sceneName" width="150" />
          <el-table-column label="所属大库" align="center" prop="parentWarehouseName" width="150" />
          <el-table-column label="所属小库" align="center" prop="warehouseName" width="150" />
          <el-table-column label="入库类型" align="center" prop="operationTypeName" width="150" />
          <el-table-column label="入库时间" align="center" prop="operationTime" width="150" />
          <el-table-column label="还料时间" align="center" prop="returnTime" width="150">
            <template #default="scope">
              <span>{{ parseTime(scope.row.returnTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
            </template>
          </el-table-column>
          <el-table-column label="库龄" align="center" prop="stockAge" />



          <el-table-column label="备注" align="center" prop="remark" width="150" />
          <el-table-column label="一次封样号" align="center" prop="fycde1" width="150" />
          <el-table-column label="二次封样号" align="center" prop="fycde2" width="150" />
          <!-- <el-table-column prop="count" label="操作" class-name="small-padding fixed-width">
            <template #default="scope">
              <el-button link type="primary" icon="View" @click="handleView(scope.row)">查看</el-button>
            </template>
          </el-table-column> -->
        </el-table>

        <el-table :data="dialogData" border empty-text="暂无数据" v-if="dialogParams.status == 2">
          <el-table-column prop="rkPcode" label="存放位置" />
        </el-table>
        <div style="margin-top: 20px;width: 100%;display: flex;align-items: center;justify-content: flex-end;">
          <div style="margin-right: 20px;color: #606266;">共{{ dialogTotal }}条</div>
          <el-pagination background layout="prev, pager, next" :total="dialogTotal" @change="chageDialogPage" />
        </div>
      </el-tab-pane>
    </el-tabs>


    <el-dialog v-model="taskView" title="详情" width="85%" draggable>
      <el-table :data="viewData" border empty-text="暂无数据">
        <el-table-column prop="sapNo" label="订单" />
        <el-table-column prop="wlNo" label="物料号" />
        <el-table-column prop="wlMs" label="物料描述" />
        <el-table-column prop="realQty" label="数量">
          <template #default="scope">{{ scope.row.realQty }}({{ scope.row.dw }})</template>
        </el-table-column>
        <el-table-column prop="xmMs" label="项目名称" />
        <el-table-column prop="gysMc" label="供应商" />
        <el-table-column prop="cangkuName" label="所属仓库" />
        <el-table-column prop="rkTime" label="入库时间">
          <template #default="scope">{{ parseTime(scope.row.rkTime, '{y}-{m}-{d}') }}</template>
        </el-table-column>
      </el-table>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="taskView=false">关闭</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup name="InventoryResult">
import {  getStockList, getTotalStatistics, inventoryList } from "@/api/Inventory/autoInventory";
import { onMounted, ref } from "vue";
import { useRoute } from 'vue-router';

const { proxy } = getCurrentInstance();

const statusList = ref(
  [
    {
      label: '正常',
      value: 0
    },
    {
      label: '未扫到',
      value: 1
    },
    {
      label: '无数据',
      value: 2
    }
  ]
)  // 盘点状态
const activeTabs = ref(0)
const dialogParams = ref({
  status: 0,
  pageNum: 1,
  pageSize: 10,
  warehouseCode: '',
  sceneId: '',
})
const dialogData = ref([])
const dialogTotal = ref(0)

const getHistoryInfo = () => {
  if(dialogParams.value.status!=0){
    dialogData.value =null
    dialogTotal.value = 0
    return;
  }
  inventoryList(dialogParams.value).then(res => {
    dialogData.value = res.rows
    dialogTotal.value = res.total
  })
}

/** 导出按钮操作 */
function handleExport() {
  proxy.download('/MatchScan/export', {taskId: dialogParams.value.taskId}, `盘点结果_${new Date().getTime()}.xlsx`)
}

const handleQueryInfo = (tab) => {
  dialogParams.value.status = tab
  dialogParams.value.pageNum = 1
  getHistoryInfo()
}
const chageDialogPage = (e) => {
  dialogParams.value.pageNum = e
  getHistoryInfo()
}


const taskView = ref(false)
const viewData = ref([])
const handleView = (row) => {
  getStockList(row.rkPcode).then(res => {
    console.log(res)
    viewData.value = res.data
    taskView.value = true
  })
}
const totalMoney = ref(null)
const pcodeCount = ref(null)
const sumQty = ref(null)
function getSummaries(param) {
  const { columns, data } = param;
  const sums = [];
  columns.forEach((column, index) => {
    if (index === 1) { // 第一列不进行合计操作，通常是序列号或选择框等非数值列。
      sums[index] = '总计'; // 这里可以设置为其他文字或空字符串。
      return;
    } else if (index === 2) { // 第二列是金额列，进行求和操作。
      sums[index] = '总金额：' + totalMoney.value;
    } else if (index === 3) {
      sums[index] = '共存于：' + pcodeCount.value + '个库位'
    } else if (index === 4) {
      sums[index] = '总数：' + sumQty.value
    }
  })
  return sums
}

const route = useRoute()
onMounted(() => {
  // dialogParams.value.taskId = route.query.taskId
  dialogParams.value.warehouseCode = route.query.warehouseCode
  dialogParams.value.sceneId = route.query.sceneId
  dialogParams.value.pageNum = 1
  dialogParams.value.pageSize = 10
  getHistoryInfo()
})
// 获取总计

function getSumInfo() {
  //统计信息
  let rkInfo = JSON.parse(JSON.stringify({
     warehouseCode:route.query.warehouseCode,
     sceneId:route.query.sceneId,
  }))
  delete rkInfo.pageNum
  delete rkInfo.pageSize
  getTotalStatistics(rkInfo).then(response => {
    totalMoney.value = response.data.totalAmount
    pcodeCount.value = response.data.locationCount
    sumQty.value = response.data.totalQuantity
  });
}
getSumInfo()
</script>

<style scoped lang="scss"></style>
