| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <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" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | @change="handleQuery" |
| | | /> |
| | | <el-button type="primary" @click="handleQuery" style="margin-left: 10px" |
| | | >搜索</el-button |
| | | > |
| | | </div> |
| | | <div> |
| | | <!-- <el-button type="primary" @click="openForm('add')">新增</el-button> --> |
| | | <el-button @click="handleOut">导出</el-button> |
| | | <el-button type="danger" plain @click="handleDelete">删除</el-button> |
| | | <el-button type="primary" plain @click="handlePrint">打印</el-button> |
| | | </div> |
| | | </div> |
| | | <el-tabs v-model="activeTab" @tab-change="handleTabChange"> |
| | | <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" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | @change="handleQuery" |
| | | /> |
| | | <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> |
| | | <el-button type="primary" plain @click="handlePrint">打印</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="table_list"> |
| | | <el-table |
| | | :data="tableData" |
| | | border |
| | | v-loading="tableLoading" |
| | | :expand-row-keys="expandedRowKeys" |
| | | :row-key="(row) => row.id" |
| | | show-summary |
| | | style="width: 100%" |
| | | :summary-method="summarizeMainTable" |
| | | height="calc(100vh - 18.5em)" |
| | | > |
| | | <el-table-column align="center" label="序号" type="index" width="60" /> |
| | | <el-table-column label="出库日期" prop="createTime" min-width="250" show-overflow-tooltip /> |
| | | <el-table-column label="客户名称" prop="customerName" width="250" show-overflow-tooltip /> |
| | | <el-table-column label="产品大类" prop="productCategory" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="规格型号" prop="specificationModel" width="100" 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="taxInclusiveUnitPrice" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="含税总价(元)" prop="taxInclusiveTotalPrice" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="税率(%)" prop="taxRate" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="不含税总价(元)" prop="taxExclusiveTotalPrice" width="180" show-overflow-tooltip /> |
| | | <el-table-column label="出库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | </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">供应商名称:</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" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | @change="handleQuery" |
| | | /> |
| | | <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> |
| | | <el-button type="primary" plain @click="handlePrint">打印</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%" |
| | | :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" min-width="250" show-overflow-tooltip /> |
| | | <el-table-column label="供应商名称" prop="supplierName" width="250" show-overflow-tooltip /> |
| | | <el-table-column label="产品大类" prop="productCategory" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="规格型号" prop="specificationModel" width="100" 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="taxInclusiveUnitPrice" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="含税总价(元)" prop="taxInclusiveTotalPrice" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="税率(%)" prop="taxRate" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="不含税总价(元)" prop="taxExclusiveTotalPrice" width="180" show-overflow-tooltip /> |
| | | <el-table-column label="出库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | </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">供应商名称:</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" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | @change="handleQuery" |
| | | /> |
| | | <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> |
| | | <el-button type="primary" plain @click="handlePrint">打印</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%" |
| | | :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" min-width="250" show-overflow-tooltip /> |
| | | <el-table-column label="供应商名称" prop="supplierName" width="250" show-overflow-tooltip /> |
| | | <el-table-column label="产品大类" prop="productCategory" width="100" show-overflow-tooltip /> |
| | | <el-table-column label="规格型号" prop="specificationModel" width="100" 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="inboundNum" width="100" show-overflow-tooltip /> |
| | | <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="100" show-overflow-tooltip /> |
| | | <el-table-column label="不含税总价(元)" prop="taxExclusiveTotalPrice" width="180" show-overflow-tooltip /> |
| | | <el-table-column label="出库人" prop="createBy" width="80" show-overflow-tooltip /> |
| | | </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-tabs> |
| | | <div class="table_list"> |
| | | <el-table |
| | | :data="tableData" |
| | |
| | | |
| | | <script setup> |
| | | import pagination from "@/components/PIMTable/Pagination.vue"; |
| | | import { ref } from "vue"; |
| | | import { ref, reactive, toRefs, onMounted, getCurrentInstance } from "vue"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import useUserStore from "@/store/modules/user"; |
| | | import { |
| | | getStockOutPage, |
| | | delStockOut, |
| | | } from "@/api/inventoryManagement/stockOut.js"; |
| | | import { |
| | | getStockInPageByProduct, |
| | | getStockInPageByCustom, |
| | | } from "@/api/inventoryManagement/stockIn.js"; |
| | | |
| | | const userStore = useUserStore(); |
| | | const { proxy } = getCurrentInstance(); |
| | | const tableData = ref([]); |
| | | const activeTab = ref('production'); |
| | | const selectedRows = ref([]); |
| | | const tableLoading = ref(false); |
| | | const page = reactive({ |
| | |
| | | const data = reactive({ |
| | | searchForm: { |
| | | supplierName: "", |
| | | customerName: "", |
| | | timeStr: "", |
| | | }, |
| | | form: { |
| | |
| | | }; |
| | | const getList = () => { |
| | | tableLoading.value = true; |
| | | getStockOutPage({ ...searchForm.value, ...page }) |
| | | const params = { ...page } |
| | | if (activeTab.value === 'production') { |
| | | params.customerName = searchForm.value.customerName |
| | | params.timeStr = searchForm.value.timeStr |
| | | } else { |
| | | params.supplierName = searchForm.value.supplierName |
| | | params.timeStr = searchForm.value.timeStr |
| | | } |
| | | |
| | | // 根据不同的 tab 类型调用不同的接口 |
| | | const apiCall = activeTab.value === 'production' |
| | | ? getStockInPageByProduct(params) |
| | | : activeTab.value === 'manual' |
| | | ? getStockInPageByCustom(params) |
| | | : getStockOutPage(params) |
| | | |
| | | apiCall |
| | | .then((res) => { |
| | | tableLoading.value = false; |
| | | tableData.value = res.data.records; |
| | |
| | | }); |
| | | }; |
| | | |
| | | const handleTabChange = () => { |
| | | page.current = 1 |
| | | searchForm.value.supplierName = '' |
| | | searchForm.value.customerName = '' |
| | | searchForm.value.timeStr = '' |
| | | selectedRows.value = [] |
| | | getList() |
| | | }; |
| | | |
| | | // 表格选择数据 |
| | | const handleSelectionChange = (selection) => { |
| | | // 过滤掉子数据 |