gaoluyang
10 天以前 3712799f3e0904f28e4268deaa5c5ee291323c38
src/views/inventoryManagement/stockManagement/index.vue
@@ -1,7 +1,7 @@
<template>
  <div class="app-container">
    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
      <!-- <el-tab-pane label="采购库存" name="production">
      <el-tab-pane label="成品库存" name="production">
        <div class="search_form">
          <div>
            <span class="search_title ml10">入库日期:</span>
@@ -14,7 +14,7 @@
              clearable
              @change="handleQuery"
            />
                     <span class="search_title ml10">产品名称:</span>
                     <span class="search_title ml10">产品大类:</span>
                     <el-input
                        v-model="searchForm.productCategory"
                        style="width: 240px"
@@ -25,6 +25,7 @@
          </div>
          <div>
            <el-button @click="handleOut">导出</el-button>
<!--            <el-button type="danger" plain @click="handleDelete">删除</el-button>-->
          </div>
        </div>
        <div class="table_list">
@@ -35,10 +36,10 @@
            <el-table-column align="center" type="selection" width="55" />
            <el-table-column align="center" label="序号" type="index" width="60" />
            <el-table-column label="入库日期" prop="createTime" width="100" show-overflow-tooltip />
            <el-table-column label="产品名称" prop="productCategory" show-overflow-tooltip />
                  <el-table-column label="销售合同号" prop="salesContractNo" width="180" show-overflow-tooltip />
            <el-table-column label="产品大类" prop="productCategory" show-overflow-tooltip />
            <el-table-column label="规格型号" prop="specificationModel" show-overflow-tooltip />
            <el-table-column label="单位" prop="unit" width="80" show-overflow-tooltip />
            <el-table-column label="入库数量" prop="inboundNum" width="100" show-overflow-tooltip />
            <el-table-column label="已出库数量" prop="totalInboundNum" width="100" show-overflow-tooltip />
            <el-table-column label="剩余库存" prop="inboundNum0" width="100" show-overflow-tooltip />
                     <el-table-column label="单价(元)" prop="unitPrice" width="150"></el-table-column>
@@ -49,54 +50,31 @@
              </template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper" :page="page.current"
  :limit="page.size" @pagination="paginationChange" />
</div>
</el-tab-pane> -->
      <el-tab-pane label="采购库存" name="purchase">
        <div class="search_form">
          <div>
            <span class="search_title ml10">产品名称:</span>
            <el-input v-model="searchForm.productCategory" style="width: 240px" placeholder="请输入" clearable />
            <el-button type="primary" @click="handleQuery" style="margin-left: 10px">搜索</el-button>
          </div>
          <div>
            <el-button @click="handleOut">导出</el-button>
          </div>
        </div>
        <div class="table_list">
          <el-table :data="tableData" border v-loading="tableLoading" @selection-change="handleSelectionChange"
            :expand-row-keys="expandedRowKeys" :row-key="row => row.id" show-summary style="width: 100%"
            :row-class-name="tableRowClassName" :summary-method="summarizeMainTable" height="calc(100vh - 18.5em)">
            <el-table-column align="center" type="selection" width="55" />
            <el-table-column align="center" label="序号" type="index" width="60" />
            <el-table-column label="产品名称" prop="productCategory" show-overflow-tooltip />
            <el-table-column label="产品高度" prop="specificationModel" width="100" show-overflow-tooltip>
              <template #default="scope">
                <div>{{ scope.row.specificationModel }}{{ scope.row.unit }}</div>
              </template>
            </el-table-column>
            <el-table-column label="每件数量/支" prop="boxNum" width="100" show-overflow-tooltip />
            <el-table-column label="入库数量" prop="inboundNum" width="100" show-overflow-tooltip />
            <el-table-column label="单价(元)/件" prop="taxInclusiveUnitPrice" width="150"></el-table-column>
            <el-table-column label="已出库数量" prop="totalInboundNum" width="100" show-overflow-tooltip />
            <el-table-column label="剩余库存" prop="inboundNum0" width="100" show-overflow-tooltip />
            <el-table-column label="纸箱规格" prop="cartonSpecifications" width="150"></el-table-column>
          </el-table>
          <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper"
            :page="page.current" :limit="page.size" @pagination="paginationChange" />
        </div>
      </el-tab-pane>
      <el-tab-pane label="成品库存" name="manual">
     <el-tab-pane label="原料库存" name="purchase">
        <div class="search_form">
          <div>
            <!--            <span class="search_title">供应商名称:</span>-->
            <!--            <el-input v-model="searchForm.supplierName" style="width: 240px" placeholder="请输入" @change="handleQuery"-->
            <!--              clearable prefix-icon="Search" />-->
            <span class="search_title ml10">产品名称:</span>
            <el-input v-model="searchForm.productCategory" style="width: 240px" placeholder="请输入" clearable />
           <span class="search_title ml10">入库日期:</span>
           <el-date-picker
             v-model="searchForm.timeStr"
             type="date"
             placeholder="请选择日期"
             value-format="YYYY-MM-DD"
             format="YYYY-MM-DD"
             clearable
             @change="handleQuery"
           />
                     <span class="search_title ml10">产品大类:</span>
                     <el-input
                        v-model="searchForm.productCategory"
                        style="width: 240px"
                        placeholder="请输入"
                        clearable
                     />
            <el-button type="primary" @click="handleQuery" style="margin-left: 10px">搜索</el-button>
          </div>
          <div>
@@ -107,31 +85,74 @@
        <div class="table_list">
          <el-table :data="tableData" border v-loading="tableLoading" @selection-change="handleSelectionChange"
            :expand-row-keys="expandedRowKeys" :row-key="row => row.id" show-summary style="width: 100%"
            :row-class-name="tableRowClassName" :summary-method="summarizeMainTable" height="calc(100vh - 18.5em)">
           :row-class-name="tableRowClassName"
           :summary-method="summarizeMainTable" height="calc(100vh - 18.5em)">
            <el-table-column align="center" type="selection" width="55" />
            <el-table-column align="center" label="序号" type="index" width="60" />
            <el-table-column label="产品图片" width="100" align="center">
              <template #default="scope">
                <img class="barcode-img" :src="javaApiUrl + scope.row.url"></img>
              </template>
            </el-table-column>
            <el-table-column label="产品名称" prop="productCategory" show-overflow-tooltip />
            <el-table-column label="产品高度" prop="specificationModel" width="100" show-overflow-tooltip>
              <template #default="scope">
                <div>{{ scope.row.specificationModel }}{{ scope.row.unit }}</div>
              </template>
            </el-table-column>
            <el-table-column label="单价(美元)/件" prop="taxInclusiveUnitPrice" width="150"></el-table-column>
            <el-table-column label="每件数量/支" prop="boxNum" width="100" show-overflow-tooltip />
            <el-table-column label="入库数量" prop="inboundNum" width="100" show-overflow-tooltip />
           <el-table-column label="入库日期" prop="createTime" width="100" show-overflow-tooltip />
                <el-table-column label="采购合同号" prop="purchaseContractNumber" width="180" show-overflow-tooltip />
           <el-table-column label="产品大类" prop="productCategory" show-overflow-tooltip />
           <el-table-column label="规格型号" prop="specificationModel" show-overflow-tooltip />
           <el-table-column label="单位" prop="unit" width="80" show-overflow-tooltip />
                     <el-table-column label="已出库数量" prop="totalInboundNum" show-overflow-tooltip />
                     <el-table-column label="剩余库存" prop="inboundNum0" show-overflow-tooltip />
                   <el-table-column label="含税单价(元)" prop="taxInclusiveUnitPrice" width="150"></el-table-column>
                   <el-table-column label="含税总价(元)" prop="taxInclusiveTotalPrice" width="150"></el-table-column>
         </el-table>
         <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper"
           :page="page.current" :limit="page.size" @pagination="paginationChange" />
       </div>
     </el-tab-pane>
      <el-tab-pane label="材料库存" name="manual">
        <div class="search_form">
          <div>
            <span class="search_title ml10">入库日期:</span>
            <el-date-picker
              v-model="searchForm.timeStr"
              type="date"
              placeholder="请选择日期"
              value-format="YYYY-MM-DD"
              format="YYYY-MM-DD"
              clearable
              @change="handleQuery"
            />
                     <span class="search_title ml10">产品大类:</span>
                     <el-input
                        v-model="searchForm.productCategory"
                        style="width: 240px"
                        placeholder="请输入"
                        clearable
                     />
            <el-button type="primary" @click="handleQuery" style="margin-left: 10px">搜索</el-button>
          </div>
          <div>
            <el-button @click="handleOut">导出</el-button>
<!--            <el-button type="danger" plain @click="handleDelete">删除</el-button>-->
          </div>
        </div>
        <div class="table_list">
          <el-table :data="tableData" border v-loading="tableLoading" @selection-change="handleSelectionChange"
            :expand-row-keys="expandedRowKeys" :row-key="row => row.id" show-summary style="width: 100%"
            :row-class-name="tableRowClassName"
            :summary-method="summarizeMainTable" height="calc(100vh - 18.5em)">
            <el-table-column align="center" type="selection" width="55" />
            <el-table-column align="center" label="序号" type="index" width="60" />
            <el-table-column label="入库日期" prop="inboundDate" width="100" show-overflow-tooltip />
                  <el-table-column label="批次号" prop="code" width="130" show-overflow-tooltip />
            <el-table-column label="产品大类" prop="productCategory" show-overflow-tooltip />
            <el-table-column label="规格型号" prop="specificationModel" show-overflow-tooltip />
            <el-table-column label="单位" prop="unit" width="80" show-overflow-tooltip />
            <el-table-column label="物品类型" prop="itemType" width="120" show-overflow-tooltip />
            <el-table-column label="已出库数量" prop="totalInboundNum" width="100" show-overflow-tooltip />
            <el-table-column label="剩余库存" prop="inboundNum0" width="100" show-overflow-tooltip />
            <el-table-column label="纸箱规格" prop="cartonSpecifications" width="150"></el-table-column>
            <!-- <el-table-column fixed="right" label="操作" width="100" align="center">
                     <el-table-column label="单价(元)" prop="taxInclusiveUnitPrice" width="150"></el-table-column>
                     <el-table-column label="总价(元)" prop="taxInclusiveTotalPrice" width="150"></el-table-column>
            <el-table-column fixed="right" label="操作" width="100" align="center">
              <template #default="scope">
                <el-button link type="primary" size="small" @click="openForm('edit', scope.row);">编辑</el-button>
              </template>
            </el-table-column> -->
            </el-table-column>
          </el-table>
          <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper"
            :page="page.current" :limit="page.size" @pagination="paginationChange" />
@@ -140,62 +161,32 @@
    </el-tabs>
    <!-- 成品库存弹框 -->
    <FormDiaProduction v-model:dialogFormVisible="productionDialogVisible" :operationType="operationType"
      :formData="form" @submit="submitForm" @close="closeDia" />
    <FormDiaProduction
      v-model:dialogFormVisible="productionDialogVisible"
      :operationType="operationType"
      :formData="form"
      @submit="submitForm"
      @close="closeDia"
    />
    <!-- 原料库存弹框 -->
    <FormDiaPurchase v-model:dialogFormVisible="purchaseDialogVisible" :operationType="operationType" :formData="form"
      @submit="submitForm" @close="closeDia" />
    <FormDiaPurchase
      v-model:dialogFormVisible="purchaseDialogVisible"
      :operationType="operationType"
      :formData="form"
      @submit="submitForm"
      @close="closeDia"
    />
    <!-- 材料库存弹框 -->
    <FormDiaManual v-model:dialogFormVisible="manualDialogVisible" :operationType="operationType" :formData="form"
      @submit="submitForm" @close="closeDia" />
    <FormDiaManual
      v-model:dialogFormVisible="manualDialogVisible"
      :operationType="operationType"
      :formData="form"
      @submit="submitForm"
      @close="closeDia"
    />
  </div>
  <el-dialog v-model="barcodeDia" title="产品信息" width="70%" @close="closeBarcodeDia">
    <div>
      <el-row :gutter="30">
        <el-col :span="12">
          <div class="barcode-item">
            <div class="barcode-label">名称</div>
            <div class="barcode-value">{{ barcodeDetail.barcode }}</div>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="barcode-item">
            <div class="barcode-label">单价</div>
            <div class="barcode-value">xxx元</div>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="12">
          <div class="barcode-item">
            <div class="barcode-label">产品高度</div>
            <div class="barcode-value">222cm</div>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="barcode-item">
            <div class="barcode-label">数量/件</div>
            <div class="barcode-value">120</div>
          </div>
        </el-col>
      </el-row>
      <el-row :gutter="30">
        <el-col :span="12">
          <div class="barcode-item">
            <div class="barcode-label">规格</div>
            <div class="barcode-value">12*20*30</div>
          </div>
        </el-col>
      </el-row>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="closeBarcodeDia">关闭</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
@@ -214,7 +205,6 @@
import {
  updateManagement, updateManagementByCustom, updateStockIn
} from "@/api/inventoryManagement/stockIn.js";
const javaApiUrl = __BASE_API__;
// 导入三个独立的弹框组件
import FormDiaProduction from './components/FormDiaProduction.vue'
@@ -240,7 +230,7 @@
const loading = ref(false);
// 用户信息表单弹框数据
const operationType = ref('')
const activeTab = ref('purchase')
const activeTab = ref('production')
// 三个独立的弹框显示状态
const productionDialogVisible = ref(false)
@@ -252,6 +242,7 @@
    // supplierName: '',
    productCategory: '',
    customerName: '',
    timeStr: getCurrentDate(),
  },
  form: {
    supplierId: null,
@@ -309,6 +300,7 @@
const buildQueryParams = () => {
  const params = {
    ...page,
    timeStr: searchForm.value.timeStr,
  }
  params.productCategory = searchForm.value.productCategory
  if (activeTab.value === 'production') {
@@ -372,6 +364,7 @@
  page.current = 1
  // searchForm.value.supplierName = ''
  searchForm.value.customerName = ''
  searchForm.value.timeStr = ''
  selectedRows.value = []
  searchForm.value.productCategory = ''
  getList()
@@ -456,7 +449,7 @@
  delete submitData.taxExclusiveTotalPrice
  console.log('提交给后端的数据(已移除总价字段):', submitData)
  submitData.inboundNum = parseFloat(submitData.inboundNum) || 0
  // 根据当前标签页调用不同的提交接口
  let apiCall
  if (activeTab.value === 'production') {
@@ -567,40 +560,7 @@
  const day = String(today.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
}
//扫码相关参数
const barcodeDia = ref(false);
const scanBarcodeInput = ref('');
const barcodeDetail = ref({})
// 扫码函数
const scanBarcode = (e) => {
  if (!e || !e.target || !e.target.tagName) {
    return;
  }
  if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') {
    return
  }
  if (e.key === 'Enter') {
    let _value = scanBarcodeInput.value
    getDetail(_value)
    scanBarcodeInput.value = ""
  } else {
    scanBarcodeInput.value += e.key
  }
}
const getDetail = (barcode) => {
  barcodeDetail.value = {
    barcode: barcode
  }
  barcodeDia.value = true
}
const closeBarcodeDia = () => {
  barcodeDia.value = false
}
onMounted(() => {
  // 添加扫码枪监听事件
  // document.addEventListener('keypress', scanBarcode)
  getList()
  // checkStockAndCreatePurchase();
  // 每小时检查一次库存
@@ -610,11 +570,6 @@
  //   // 组件卸载时清除定时器
  //   clearInterval(intervalId);
  // });
})
onUnmounted(() => {
  // 移除键盘监听事件
  document.removeEventListener('keypress', scanBarcode)
  console.log('组件卸载')
})
</script>
@@ -626,18 +581,5 @@
:deep(.row-low-stock:hover > td) {
  background-color: #fcd4d4;
}
.barcode-item {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
}
.barcode-img {
  width: 80px;
  height: 80px;
  border-radius: 5px;
  background-color: #F5F5F5;
}
</style>