| | |
| | | <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">客户名称:</span>--> |
| | | <!-- <el-input v-model="searchForm.customerName" style="width: 240px" placeholder="请输入" @change="handleQuery"--> |
| | | <!-- clearable prefix-icon="Search" />--> |
| | | <span class="search_title ml10">入库日期:</span> |
| | | <el-date-picker |
| | | v-model="searchForm.timeStr" |
| | |
| | | <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" show-overflow-tooltip /> |
| | | <!-- <el-table-column label="入库批次" prop="inboundBatches" show-overflow-tooltip /> --> |
| | | <!-- <el-table-column label="客户名称" prop="customerName" width="240" 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="70" show-overflow-tooltip /> |
| | | <el-table-column label="入库数量" prop="inboundNum" width="100" show-overflow-tooltip /> |
| | | <!-- <el-table-column label="剩余库存" prop="inboundNum0" show-overflow-tooltip />--> |
| | | <el-table-column label="单价(元)" prop="unitPrice" width="150"></el-table-column> |
| | | <el-table-column label="总价(元)" prop="totalPrice" width="150"></el-table-column> |
| | | <!-- <el-table-column label="含税单价" prop="taxInclusiveUnitPrice" width="100" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="含税总价" prop="taxInclusiveTotalPrice" width="100" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="税率(%)" prop="taxRate" width="80" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="不含税总价" prop="taxExclusiveTotalPrice" width="100" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="入库人" prop="createBy" width="80" show-overflow-tooltip /> --> |
| | | <el-table-column fixed="right" label="操作" min-width="60" align="center"> |
| | | <template #default="scope"> |
| | | <el-button link type="primary" size="small" @click="openForm('edit', scope.row, 'production');">编辑</el-button> |
| | | <el-button link type="success" size="small" @click="showQRCode(scope.row)">生成条形码</el-button> |
| | | <el-button link type="success" size="small" @click="showERCode(scope.row)">生成二维码</el-button> |
| | | <el-button link type="success" size="small" @click="showQRCode(scope.row,1)">生成条形码</el-button> |
| | | <el-button link type="success" size="small" @click="showERCode(scope.row,1)">生成二维码</el-button> |
| | | </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> --> |
| | | |
| | | <el-tab-pane label="原料入库" name="purchase"> |
| | | <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-date-picker |
| | | v-model="searchForm.timeStr" |
| | |
| | | :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="createTime" width="100" show-overflow-tooltip /> |
| | | <!-- <el-table-column label="入库批次" prop="inboundBatches" width="160" show-overflow-tooltip /> --> |
| | | <el-table-column label="供应商名称" prop="supplierName" width="240" 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="70" show-overflow-tooltip /> |
| | | <el-table-column label="入库数量" prop="inboundNum" width="100" 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-column label="含税单价" prop="taxInclusiveUnitPrice" width="100" show-overflow-tooltip />–>--> |
| | | <!--<!– <el-table-column label="含税总价" prop="taxInclusiveTotalPrice" width="100" show-overflow-tooltip />–>--> |
| | | <!--<!– <el-table-column label="税率(%)" prop="taxRate" width="80" show-overflow-tooltip />–>--> |
| | | <!--<!– <el-table-column label="不含税总价" prop="taxExclusiveTotalPrice" width="100" show-overflow-tooltip />–>--> |
| | | <el-table-column label="入库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | <el-table-column label="入库时间" prop="inboundDate" width="100" show-overflow-tooltip /> |
| | | <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="inboundNum" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="每件数量/支" prop="boxNum" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="单价(元)" prop="taxInclusiveUnitPrice" width="150"></el-table-column> |
| | | <el-table-column label="纸箱规格" prop="cartonSpecifications" width="150"></el-table-column> |
| | | <el-table-column label="入库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | <el-table-column fixed="right" label="操作" min-width="60" align="center"> |
| | | <template #default="scope"> |
| | | <el-button link type="primary" size="small" @click="openForm('edit', scope.row, 'purchase');">编辑</el-button> |
| | |
| | | </div> |
| | | </el-tab-pane> |
| | | |
| | | <el-tab-pane label="材料入库" name="manual"> |
| | | <el-tab-pane label="成品入库" name="manual"> |
| | | <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-date-picker |
| | | v-model="searchForm.timeStr" |
| | |
| | | :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="inboundDate" width="100" show-overflow-tooltip /> |
| | | <!-- <el-table-column label="入库批次" prop="inboundBatches" show-overflow-tooltip /> --> |
| | | <!-- <el-table-column label="供应商名称" prop="supplierName" width="240" 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="70" show-overflow-tooltip /> |
| | | <el-table-column label="物品类型" prop="itemType" show-overflow-tooltip /> |
| | | <el-table-column label="入库数量" prop="inboundNum" width="100" 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-column label="含税单价" prop="taxInclusiveUnitPrice" width="100" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="含税总价" prop="taxInclusiveTotalPrice" width="100" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="税率(%)" prop="taxRate" width="80" show-overflow-tooltip />--> |
| | | <!-- <el-table-column label="不含税总价" prop="taxExclusiveTotalPrice" width="100" show-overflow-tooltip />--> |
| | | <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="inboundNum" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="每件数量/支" prop="boxNum" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="单价(元)" prop="taxInclusiveUnitPrice" width="150"></el-table-column> |
| | | <el-table-column label="纸箱规格" prop="cartonSpecifications" width="150"></el-table-column> |
| | | <el-table-column label="入库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | <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, 'manual');">编辑</el-button> |
| | | <el-button link type="success" size="small" @click="showQRCode(scope.row)">生成条形码</el-button> |
| | | <el-button link type="success" size="small" @click="showERCode(scope.row)">生成二维码</el-button> |
| | | <el-button link type="success" size="small" @click="showQRCode(scope.row,2)">生成条形码</el-button> |
| | | <el-button link type="success" size="small" @click="showERCode(scope.row,2)">生成二维码</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | </div> |
| | | </div> |
| | | </el-dialog> |
| | | <el-dialog v-model="barcodeDia" title="产品信息" width="40%" @close="closeBarcodeDia"> |
| | | <div> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <div class="barcode-item"> |
| | | <div class="barcode-label">图片</div> |
| | | <img class="barcode-img" :src="javaApiUrl+barcodeDetail.url"></img> |
| | | </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">{{barcodeDetail.productCategory}}</div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="barcode-item"> |
| | | <div class="barcode-label">单价</div> |
| | | <div class="barcode-value">{{barcodeDetail.productCategory}}元</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">{{barcodeDetail.createBy}}</div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="barcode-item"> |
| | | <div class="barcode-label">数量/{{barcodeDetail.unit}}</div> |
| | | <div class="barcode-value">{{barcodeDetail.inboundNum}}</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">{{barcodeDetail.specificationModel}}</div> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button @click="closeBarcodeDia">关闭</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | import { ElMessageBox } from "element-plus"; |
| | | import useUserStore from '@/store/modules/user' |
| | | import dayjs from 'dayjs' |
| | | const javaApiUrl = __BASE_API__; |
| | | import { |
| | | getStockInPage, |
| | | getStockInPageByProduction, |
| | | delStockIn, |
| | | delStockInCustom, getInPageByCustom, |
| | | stockinDetail,detailManagementByCustom |
| | | } from "@/api/inventoryManagement/stockIn.js"; |
| | | import FormDia from './components/formDia.vue' |
| | | import FormDiaManual from './components/formDiaManual.vue' |
| | |
| | | const formDia = ref() |
| | | const formDiaManual = ref() |
| | | const formDiaProduct = ref() |
| | | const activeTab = ref('production') // 当前激活的 tab |
| | | const activeTab = ref('purchase') // 当前激活的 tab |
| | | |
| | | const page = reactive({ |
| | | current: 1, |
| | |
| | | |
| | | // 打开弹框 |
| | | const openForm = async (type, row, tabType) => { |
| | | if(barcodeDia.value)return |
| | | const currentTab = tabType || activeTab.value |
| | | await nextTick(() => { |
| | | if (currentTab === 'manual') { |
| | |
| | | } else { |
| | | // 材料入库 |
| | | deleteApi = delStockInCustom |
| | | deleteParams = { ids } |
| | | deleteParams = [...ids] |
| | | } |
| | | |
| | | deleteApi(deleteParams).then(() => { |
| | |
| | | // 二维码相关变量 |
| | | const qrCodeDialogVisible = ref(false); |
| | | const qrCodeUrl = ref(""); |
| | | const showQRCode = async (row) => { |
| | | const showQRCode = async (row,type) => { |
| | | if(barcodeDia.value)return |
| | | try { |
| | | // 构建二维码内容,只包含采购合同号(纯文本) |
| | | const qrContent = row.id || ''; |
| | | let qrContent = row.id || ''; |
| | | // 检查内容是否为空 |
| | | if (!qrContent) { |
| | | proxy.$modal.msgWarning("该行商品id,无法生成条形码"); |
| | | return; |
| | | } |
| | | qrContent+=`,${type}` |
| | | qrCodeDialogVisible.value = true; |
| | | await nextTick(); |
| | | JsBarcode("#barcode", qrContent+'', { |
| | |
| | | |
| | | const erCodeDialogVisible = ref(false); |
| | | const erCodeUrl = ref(""); |
| | | const showERCode = async (row) => { |
| | | const qrContent = row.id || ''; |
| | | const showERCode = async (row,type) => { |
| | | if(barcodeDia.value)return |
| | | let qrContent = row.id || ''; |
| | | // 检查内容是否为空 |
| | | if (!qrContent) { |
| | | proxy.$modal.msgWarning("该行商品id,无法生成二维码"); |
| | | return; |
| | | } |
| | | qrContent+=`,${type}` |
| | | try { |
| | | erCodeUrl.value = await QRCode.toDataURL(qrContent+'', { |
| | | width: 200, |
| | |
| | | proxy.$modal.msgSuccess("下载成功"); |
| | | }; |
| | | |
| | | //扫码相关参数 |
| | | 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)=>{ |
| | | if(barcode.indexOf(",")==-1){ |
| | | proxy.$modal.msgWarning("请扫描正确的条形码") |
| | | return |
| | | } |
| | | let barcodeList = barcode.split(",") |
| | | let barcodeId = barcodeList[0] |
| | | let type = barcodeList[1] |
| | | let detailApi = null |
| | | if(type==1){ |
| | | detailApi = stockinDetail |
| | | }else if(type==2){ |
| | | detailApi = detailManagementByCustom |
| | | } |
| | | |
| | | if(!detailApi){ |
| | | proxy.$modal.msgWarning("请扫描正确的条形码") |
| | | return |
| | | } |
| | | detailApi({id:barcodeId}).then((resp) => { |
| | | if(resp.code!=200||!resp.data)return |
| | | barcodeDetail.value = resp.data |
| | | barcodeDia.value = true |
| | | }).catch(() => { |
| | | proxy.$modal.msgError("查看详情失败") |
| | | }) |
| | | |
| | | } |
| | | |
| | | const closeBarcodeDia = () => { |
| | | barcodeDia.value = false |
| | | } |
| | | |
| | | onMounted(() => { |
| | | // 添加扫码枪监听事件 |
| | | document.addEventListener('keypress', scanBarcode) |
| | | getList() |
| | | }) |
| | | </script> |
| | | |
| | | <style scoped lang="scss"></style> |
| | | <style scoped lang="scss"> |
| | | .barcode-item{ |
| | | display: flex; |
| | | justify-content: space-between; |
| | | padding: 5px 0; |
| | | |
| | | } |
| | | .barcode-img{ |
| | | width: 80px; |
| | | height: 80px; |
| | | border-radius: 5px; |
| | | background-color: #F5F5F5; |
| | | } |
| | | </style> |
| | | |
| | | |
| | | |