| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :inline="true" :model="queryParams" class="search-form"> |
| | | <el-form-item label="搜索"> |
| | | <el-input |
| | | v-model="queryParams.searchText" |
| | | placeholder="请输入关键词" |
| | | clearable |
| | | :style="{ width: '100%' }" |
| | | <el-form-item label="登记日期"> |
| | | <el-date-picker |
| | | v-model="queryParams.registrationDate" |
| | | type="date" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | style="width: 100%" |
| | | placeholder="请选择日期" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="供应商名称"> |
| | | <el-form-item label="煤种"> |
| | | <el-input |
| | | v-model="queryParams.supplierName" |
| | | placeholder="请输入" |
| | | clearable |
| | | :style="{ width: '100%' }" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="统一人识别号"> |
| | | <el-input |
| | | v-model="queryParams.identifyNumber" |
| | | placeholder="请输入" |
| | | clearable |
| | | :style="{ width: '100%' }" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="经营地址"> |
| | | <el-input |
| | | v-model="queryParams.address" |
| | | placeholder="请输入" |
| | | clearable |
| | | :style="{ width: '100%' }" |
| | | v-model="queryParams.coal" |
| | | placeholder="请输入煤种" |
| | | clearable |
| | | :style="{ width: '100%' }" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | |
| | | <el-card> |
| | | <!-- 标签页 --> |
| | | <el-tabs |
| | | v-model="activeTab" |
| | | class="info-tabs" |
| | | @tab-click="handleTabClick" |
| | | v-model="activeTab" |
| | | class="info-tabs" |
| | | @tab-click="handleTabClick" |
| | | > |
| | | <el-tab-pane |
| | | v-for="tab in tabs" |
| | | :key="tab.name" |
| | | :label="tab.label" |
| | | :name="tab.name" |
| | | v-for="tab in tabs" |
| | | :key="tab.name" |
| | | :label="tab.label" |
| | | :name="tab.name" |
| | | /> |
| | | </el-tabs> |
| | | <!-- 操作按钮区 --> |
| | | <el-space> |
| | | <el-button type="primary" :icon="Plus" >新建</el-button> |
| | | <el-button type="danger" :icon="Delete">删除</el-button> |
| | | <el-button type="info" plain :icon="Download">导出</el-button> |
| | | <el-button type="success" plain :icon="Refresh" v-if="activeTab=== 'officialInventory'" @click="mergeRows">合并</el-button> |
| | | <!-- <el-button type="danger" :icon="Delete">删除</el-button>--> |
| | | <!-- <el-button type="info" plain :icon="Download">导出</el-button> --> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | :icon="Refresh" |
| | | v-if="activeTab === 'officialInventory'" |
| | | @click="mergeRows('merge')" |
| | | >合并</el-button |
| | | > |
| | | <el-button |
| | | type="info" |
| | | plain |
| | | :icon="Download" |
| | | v-if="activeTab === 'officialInventory'" |
| | | @click="handleExport" |
| | | >导出</el-button |
| | | > |
| | | </el-space> |
| | | <div> |
| | | <el-table :data="tableData" border @selection-change="selectionChange"> |
| | | <el-table |
| | | :data="tableData" |
| | | border |
| | | @selection-change="selectionChange" |
| | | style="width: 100%; height: calc(100vh - 30em)" |
| | | show-summary |
| | | :summary-method="summarizeChildrenTable" |
| | | > |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column label="序号" type="index" width="60" align="center" /> |
| | | <el-table-column prop="name" label="供货商名称" width="180" sortable/> |
| | | <el-table-column prop="type" label="煤种" sortable/> |
| | | <el-table-column prop="unit" label="单位" width="70"/> |
| | | <el-table-column prop="number" label="库存数量" sortable/> |
| | | <el-table-column prop="money" label="单价(含税)" sortable width="130"/> |
| | | <el-table-column prop="money1" label="总价(含税)" width="130" /> |
| | | <el-table-column prop="money2" label="成本单价" /> |
| | | <el-table-column prop="money3" label="利润" /> |
| | | <el-table-column prop="money4" label="煤质" sortable/> |
| | | <el-table-column prop="createUser" label="登记人" /> |
| | | <el-table-column prop="createTime" label="登记日期" /> |
| | | <el-table-column fixed="right" label="操作" min-width="90" align="center"> |
| | | <template #default> |
| | | <el-button link type="primary" size="small">编辑</el-button> |
| | | <el-table-column |
| | | label="序号" |
| | | type="index" |
| | | width="60" |
| | | align="center" |
| | | /> |
| | | <el-table-column |
| | | prop="supplierName" |
| | | label="供货商名称" |
| | | width="180" |
| | | sortable |
| | | /> |
| | | <el-table-column prop="coal" label="煤种" sortable /> |
| | | <el-table-column prop="unit" label="单位" width="70" /> |
| | | <el-table-column |
| | | prop="inventoryQuantity" |
| | | label="库存数量" |
| | | sortable |
| | | min-width="110" |
| | | /> |
| | | <el-table-column |
| | | prop="priceIncludingTax" |
| | | label="单价(含税)" |
| | | sortable |
| | | width="130" |
| | | /> |
| | | <el-table-column |
| | | prop="totalPriceIncludingTax" |
| | | label="总价(含税)" |
| | | width="130" |
| | | /> |
| | | <el-table-column |
| | | prop="priceExcludingTax" |
| | | label="单价(不含税)" |
| | | width="130" |
| | | /> |
| | | <el-table-column |
| | | prop="totalPriceExcludingTax" |
| | | label="总价(不含税)" |
| | | width="130" |
| | | /> |
| | | <el-table-column |
| | | prop="pendingReplenishment" |
| | | label="待补库" |
| | | width="130" |
| | | v-if="activeTab === 'officialInventory'" |
| | | /> |
| | | <el-table-column |
| | | label="煤质" |
| | | align="center" |
| | | v-if="activeTab === 'officialInventory'" |
| | | width="600" |
| | | > |
| | | <el-table-column |
| | | v-for="col in columnTitle" |
| | | :key="col.prop" |
| | | :prop="col.prop" |
| | | :label="col.label" |
| | | align="center" |
| | | sortable |
| | | min-width="200" |
| | | /> |
| | | </el-table-column> |
| | | <el-table-column prop="registrant" label="登记人" width="180" /> |
| | | <el-table-column |
| | | prop="registrationDate" |
| | | label="登记日期" |
| | | width="180" |
| | | /> |
| | | <el-table-column |
| | | fixed="right" |
| | | label="操作" |
| | | min-width="100" |
| | | align="center" |
| | | > |
| | | <template #default="scope"> |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | size="small" |
| | | @click="reviewDia(scope.row)" |
| | | v-if="activeTab !== 'officialInventory'" |
| | | >审核</el-button |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | size="small" |
| | | @click="mergeRows('edit', scope.row)" |
| | | v-if="activeTab === 'officialInventory'" |
| | | >编辑</el-button |
| | | > |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | size="small" |
| | | @click="mergeRows('view', scope.row)" |
| | | v-if="activeTab === 'officialInventory'" |
| | | >详情</el-button |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <pagination |
| | | v-if="total>0" |
| | | :page-num="pageNum" |
| | | :page-size="pageSize" |
| | | :total="total" |
| | | @pagination="handleQuery" |
| | | :layout="'total, prev, pager, next, jumper'" |
| | | v-if="total > 0" |
| | | :page="pageNum" |
| | | :limit="pageSize" |
| | | :total="total" |
| | | @pagination="handlePagination" |
| | | :layout="'total, prev, pager, next, jumper'" |
| | | /> |
| | | </div> |
| | | </el-card> |
| | | <!-- 审核待入库弹框 --> |
| | | <el-dialog title="审核入库" v-model="reviewVisible" width="1000px"> |
| | | <el-form :model="form" :rules="rules" ref="formRef" label-width="180px"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="供应商名称" prop="supplierId"> |
| | | <el-select v-model="form.supplierId" placeholder="请选择供应商"> |
| | | <el-option |
| | | :label="item.label" |
| | | v-for="item in supplyList" |
| | | :key="item.value" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="煤种" prop="coalId"> |
| | | <el-select v-model="form.coalId" placeholder="请选择煤种"> |
| | | <el-option |
| | | :label="item.label" |
| | | v-for="item in coalList" |
| | | :key="item.value" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单位" prop="unit"> |
| | | <el-input |
| | | v-model="form.unit" |
| | | placeholder="请输入单位" |
| | | maxlength="30" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="库存数量" prop="inventoryQuantity"> |
| | | <el-input |
| | | v-model="form.inventoryQuantity" |
| | | placeholder="请输入库存数量" |
| | | :max="inventoryQuantity" |
| | | type="number" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单价(含税)" prop="priceIncludingTax"> |
| | | <el-input |
| | | v-model="form.priceIncludingTax" |
| | | placeholder="请输入单价(含税)" |
| | | maxlength="30" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="总价(含税)" prop="totalPriceIncludingTax"> |
| | | <el-input |
| | | v-model="form.totalPriceIncludingTax" |
| | | placeholder="请输入总价(含税)" |
| | | maxlength="30" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单价(不含税)" prop="priceExcludingTax"> |
| | | <el-input |
| | | v-model="form.priceExcludingTax" |
| | | placeholder="请输入成本单价" |
| | | maxlength="30" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="总价(不含税)" prop="totalPriceExcludingTax"> |
| | | <el-input |
| | | v-model="form.totalPriceExcludingTax" |
| | | placeholder="请输入成本单价" |
| | | maxlength="30" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="煤质方案" prop="coalPlanId"> |
| | | <el-select |
| | | v-model="form.coalPlanId" |
| | | placeholder="请选择" |
| | | @change="coalPlanByIdList" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="dict in qualityPlanOption" |
| | | :key="dict.id" |
| | | :label="dict.plan" |
| | | :value="dict.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-divider></el-divider> |
| | | <el-row> |
| | | <el-col :span="12" v-for="item in filteredList" :key="item.id"> |
| | | <el-form-item :label="item.fieldName"> |
| | | <el-input v-model="form[item.fields]" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="submitReviewForm">确 定</el-button> |
| | | <el-button @click="cancelReview">取 消</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <!-- 合并数据弹框 --> |
| | | <el-dialog title="合并库存" v-model="mergeVisible" width="800px"> |
| | | <el-form :model="form" :rules="rules" ref="userRef" label-width="100px"> |
| | | <el-dialog |
| | | :title="operationType.value === 'edit' ? '编辑库存' : '合并库存'" |
| | | v-model="mergeVisible" |
| | | width="800px" |
| | | > |
| | | <el-form |
| | | :model="mergeForm" |
| | | :rules="mergeRules" |
| | | ref="mergeRef" |
| | | label-width="100px" |
| | | > |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="供货商名称" prop="userName"> |
| | | <el-input v-model="form.userName" placeholder="请输入手机号码" maxlength="30" /> |
| | | <el-form-item label="供应商名称" prop="supplierId"> |
| | | <el-select |
| | | v-model="mergeForm.supplierId" |
| | | placeholder="请选择供应商" |
| | | :disabled="operationType === 'view'" |
| | | > |
| | | <el-option |
| | | :label="item.label" |
| | | v-for="item in supplyList" |
| | | :key="item.value" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="煤种" prop="nickName"> |
| | | <el-input v-model="form.nickName" placeholder="请输入姓名" maxlength="30" /> |
| | | <el-form-item label="煤种" prop="coalId"> |
| | | <el-select |
| | | v-model="mergeForm.coalId" |
| | | placeholder="请选择煤种" |
| | | :disabled="operationType === 'view'" |
| | | > |
| | | <el-option |
| | | :label="item.label" |
| | | v-for="item in coalList" |
| | | :key="item.value" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单价(含税)" prop="userName"> |
| | | <el-input v-model="form.userName" placeholder="请输入手机号码" maxlength="30" /> |
| | | <el-form-item label="单位" prop="unit"> |
| | | <el-input |
| | | v-model="mergeForm.unit" |
| | | placeholder="请输入单位" |
| | | maxlength="30" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="成本单价" prop="nickName"> |
| | | <el-input v-model="form.nickName" placeholder="请输入姓名" maxlength="30" /> |
| | | <el-form-item label="库存数量" prop="inventoryQuantity"> |
| | | <el-input |
| | | v-model="mergeForm.inventoryQuantity" |
| | | placeholder="请输入库存数量" |
| | | :max="inventoryQuantity" |
| | | type="number" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="煤质" prop="userName"> |
| | | <el-input v-model="form.userName" placeholder="请输入手机号码" maxlength="30" /> |
| | | <el-form-item label="单价(含税)" prop="priceIncludingTax"> |
| | | <el-input |
| | | v-model="mergeForm.priceIncludingTax" |
| | | placeholder="请输入单价(含税)" |
| | | maxlength="30" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="总价(含税)" prop="totalPriceIncludingTax"> |
| | | <el-input |
| | | v-model="mergeForm.totalPriceIncludingTax" |
| | | placeholder="请输入总价(含税)" |
| | | maxlength="30" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单价(不含税)" prop="priceExcludingTax"> |
| | | <el-input |
| | | v-model="mergeForm.priceExcludingTax" |
| | | placeholder="请输入单价(不含税)" |
| | | maxlength="30" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="总价(不含税)" prop="totalPriceExcludingTax"> |
| | | <el-input |
| | | v-model="mergeForm.totalPriceExcludingTax" |
| | | placeholder="请输入总价(不含税)" |
| | | maxlength="30" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="煤质方案" prop="coalPlanId"> |
| | | <el-select |
| | | v-model="mergeForm.coalPlanId" |
| | | placeholder="请选择" |
| | | @change="coalPlanByIdList" |
| | | clearable |
| | | :disabled="operationType === 'view'" |
| | | > |
| | | <el-option |
| | | v-for="dict in qualityPlanOption" |
| | | :key="dict.id" |
| | | :label="dict.plan" |
| | | :value="dict.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-divider></el-divider> |
| | | <el-row> |
| | | <el-col :span="12" v-for="item in filteredList" :key="item.id"> |
| | | <el-form-item :label="item.fieldName"> |
| | | <el-input |
| | | v-model="mergeForm[item.fields]" |
| | | :disabled="operationType === 'view'" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import {onMounted, ref} from "vue"; |
| | | import {Delete, Download, Plus, Refresh} from "@element-plus/icons-vue"; |
| | | import { onMounted, ref } from "vue"; |
| | | import { Delete, Download, Refresh } from "@element-plus/icons-vue"; |
| | | import Pagination from "@/components/Pagination/index.vue"; |
| | | const { proxy } = getCurrentInstance() |
| | | import { |
| | | addOrEditCoalValue, |
| | | coalFieldList, |
| | | coalPlanById, |
| | | coalPlanList, |
| | | officialInventoryList, |
| | | pendingInventoryList, |
| | | } from "@/api/warehouseManagement/index.js"; |
| | | import { editOfficial, merge } from "../../api/warehouseManagement/index.js"; |
| | | import { getSupplyList } from "@/api/procureMent/index.js"; |
| | | import { getCoalInfoList } from "@/api/production/index.js"; |
| | | import { ElMessage } from "element-plus"; |
| | | |
| | | const tableData = ref([]) |
| | | const selectedRows = ref([]) |
| | | const columns = ref([]) |
| | | const { proxy } = getCurrentInstance(); |
| | | |
| | | const tableData = ref([]); |
| | | const selectedRows = ref([]); |
| | | const qualityPlanOption = ref([]); |
| | | const filteredList = ref([]); |
| | | const tableLoading = ref(false); |
| | | const total = ref(0); |
| | | const pageNum = ref(1); |
| | | const pageSize = ref(10); |
| | | const inventoryQuantity = ref(0); |
| | | const count = ref(0); |
| | | const mean = ref(0); |
| | | const totalPrice = ref(0); |
| | | // 审核弹框 |
| | | const reviewVisible = ref(false); |
| | | // 合并弹框 |
| | | const mergeVisible = ref(false) |
| | | const mergeVisible = ref(false); |
| | | const operationType = ref(""); |
| | | const data = reactive({ |
| | | form: {}, |
| | | form: { |
| | | supplierName: "", |
| | | coal: "", |
| | | unit: "", |
| | | inventoryQuantity: "", |
| | | priceIncludingTax: "", |
| | | totalPriceIncludingTax: "", |
| | | priceExcludingTax: "", |
| | | totalPriceExcludingTax: "", |
| | | coalPlanId: "", |
| | | pId: "", |
| | | }, |
| | | mergeForm: { |
| | | supplierId: "", |
| | | coalId: "", |
| | | unit: "", |
| | | inventoryQuantity: "", |
| | | priceIncludingTax: "", |
| | | totalPriceIncludingTax: "", |
| | | priceExcludingTax: "", |
| | | totalPriceExcludingTax: "", |
| | | coalPlanId: "", |
| | | pId: "", |
| | | }, |
| | | rules: { |
| | | userName: [{ required: true, message: "登录账号不能为空", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }], |
| | | nickName: [{ required: true, message: "用户姓名不能为空", trigger: "blur" }], |
| | | roleIds: [{ required: true, message: "角色不能为空", trigger: "change" }], |
| | | deptId: [{ required: true, message: "部门不能为空", trigger: "change" }], |
| | | password: [{ required: true, message: "用户密码不能为空", trigger: "blur" }, { min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur" }, { pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符:< > \" ' \\\ |", trigger: "blur" }], |
| | | } |
| | | }) |
| | | supplierName: [ |
| | | { required: true, message: "请输入供应商名称", trigger: "blur" }, |
| | | ], |
| | | coal: [{ required: true, message: "请输入煤种", trigger: "blur" }], |
| | | unit: [{ required: true, message: "请输入单位", trigger: "blur" }], |
| | | coalPlanId: [{ required: true, message: "请选择", trigger: "change" }], |
| | | supplierId: [ |
| | | { required: true, message: "请选择供应商", trigger: "change" }, |
| | | ], |
| | | }, |
| | | mergeRules: { |
| | | supplierName: [ |
| | | { required: true, message: "请输入供应商名称", trigger: "blur" }, |
| | | ], |
| | | coal: [{ required: true, message: "请输入煤种", trigger: "blur" }], |
| | | unit: [{ required: true, message: "请输入单位", trigger: "blur" }], |
| | | coalPlanId: [{ required: true, message: "请选择", trigger: "change" }], |
| | | supplierId: [ |
| | | { required: true, message: "请选择供应商", trigger: "change" }, |
| | | ], |
| | | }, |
| | | }); |
| | | |
| | | const { form, rules } = toRefs(data) |
| | | const { form, rules, mergeForm, mergeRules } = toRefs(data); |
| | | // 当前标签 |
| | | const activeTab = ref("pendingInbound"); |
| | | const tabName = ref("pendingInbound"); |
| | |
| | | ]); |
| | | // 查询参数 |
| | | const queryParams = reactive({ |
| | | searchText: "", |
| | | supplierName: "", |
| | | identifyNumber: "", |
| | | address: "", |
| | | }) |
| | | registrationDate: "", |
| | | coal: "", |
| | | }); |
| | | const columnTitle = ref([]); |
| | | const supplyList = ref([]); |
| | | const coalList = ref([]); |
| | | |
| | | // 获取供应商下拉和煤种下拉 |
| | | const getDropdownData = async () => { |
| | | try { |
| | | const [supplyRes, coalRes] = await Promise.all([ |
| | | getSupplyList(), |
| | | getCoalInfoList(), |
| | | ]); |
| | | let supplyData = supplyRes.data; |
| | | let coalData = coalRes.data; |
| | | supplyList.value = supplyData.map((item) => ({ |
| | | value: item.id, |
| | | label: item.supplierName, |
| | | })); |
| | | coalList.value = coalData.map((item) => ({ |
| | | value: item.id, |
| | | label: item.coal, |
| | | })); |
| | | } catch (error) { |
| | | ElMessage.error("获取下拉数据失败,请稍后重试"); |
| | | } |
| | | }; |
| | | defineExpose({ |
| | | getDropdownData, |
| | | }); |
| | | onMounted(() => { |
| | | handleTabClick({ props: { name: "supplier" } }); |
| | | handleTabClick({ props: { name: "pendingInbound" } }); |
| | | }); |
| | | // 标签页点击 |
| | | const handleTabClick = (tab) => { |
| | | getList(); |
| | | tableLoading.value = true; |
| | | tabName.value = tab.props.name; |
| | | tableData.value = []; |
| | | getList(); |
| | | // switch (tabName.value) { |
| | | // case "pendingInbound": |
| | | // columns.value = pendingColumns; |
| | | // break; |
| | | // case "officialInventory": |
| | | // columns.value = officialColumns; |
| | | // break; |
| | | // } |
| | | setTimeout(() => { |
| | | tableLoading.value = false; |
| | | }, 500); |
| | | }; |
| | | const summarizeChildrenTable = (param) => { |
| | | return proxy.summarizeTable(param, [ |
| | | "inventoryQuantity", |
| | | "priceIncludingTax", |
| | | "totalPriceIncludingTax", |
| | | "priceExcludingTax", |
| | | "totalPriceExcludingTax", |
| | | ]); |
| | | }; |
| | | // 点击查询 |
| | | const handleQuery = () => { |
| | | tableLoading.value = true; |
| | | setTimeout(() => { |
| | | tableLoading.value = false; |
| | | }, 500); |
| | | } |
| | | pageNum.value = 1; |
| | | pageSize.value = 10; |
| | | getList(); |
| | | }; |
| | | // 分页处理 |
| | | const handlePagination = (val) => { |
| | | pageNum.value = val.page; |
| | | pageSize.value = val.limit; |
| | | getList(); |
| | | }; |
| | | const getList = () => { |
| | | tableLoading.value = true; |
| | | setTimeout(() => { |
| | | // 暂时引入测试数据 |
| | | tableData.value = [ |
| | | { name: "供应商A", type: "动力煤", unit: "吨", number: 120, money: 500, money1: 200, money2: 200, money3: 300, money4: '高位', createUser: 'admin', createTime: '2025-06-01' }, |
| | | { name: "供应商A", type: "动力煤", unit: "吨", number: 100, money: 600, money1: 300, money2: 300, money3: 300, money4: '低位', createUser: 'admin', createTime: '2025-06-01' }, |
| | | { name: "供应商B", type: "焦煤", unit: "吨", number: 300, money: 789,money1: 400, money2: 400, money3: 400, money4: '高位', createUser: 'admin', createTime: '2025-06-01' }, |
| | | { name: "供应商B", type: "焦煤", unit: "吨", number: 256, money: 800, money1: 420, money2: 420, money3: 420, money4: '低位', createUser: 'admin', createTime: '2025-06-01' }, |
| | | { name: "供应商C", type: "无烟煤", unit: "吨", number: 256, money: 700, money1: 300, money2: 300, money3: 300, money4: '高位', createUser: 'admin', createTime: '2025-06-01' } |
| | | ]; |
| | | total.value = tableData.value.length; |
| | | tableLoading.value = false; |
| | | }, 500); |
| | | // 赋值煤质表头展示字段 |
| | | if (tabName.value === "pendingInbound") { |
| | | pendingInventoryList({ |
| | | ...queryParams, |
| | | current: pageNum.value, |
| | | size: pageSize.value, |
| | | }).then((res) => { |
| | | tableLoading.value = false; |
| | | tableData.value = res.data.records; |
| | | total.value = res.data.total; |
| | | }); |
| | | } else { |
| | | officialInventoryList({ |
| | | ...queryParams, |
| | | current: pageNum.value, |
| | | size: pageSize.value, |
| | | }).then((res) => { |
| | | tableLoading.value = false; |
| | | const result = flattenFields(res.data.records); |
| | | tableData.value = result; |
| | | total.value = res.data.total; |
| | | coalFieldListOption(); |
| | | }); |
| | | } |
| | | }; |
| | | // 扁平化处理函数 |
| | | const flattenFields = (data) => { |
| | | return data.map((item) => { |
| | | const mergedFields = item.fields.reduce((acc, obj) => { |
| | | const key = Object.keys(obj)[0]; |
| | | acc[key] = obj[key]; |
| | | return acc; |
| | | }, {}); |
| | | |
| | | // 合并主对象与提取出的 fields 字段 |
| | | return { |
| | | ...item, |
| | | ...mergedFields, |
| | | }; |
| | | }); |
| | | }; |
| | | // 重置查询 |
| | | const resetQuery = () => { |
| | |
| | | }); |
| | | handleQuery(); |
| | | }; |
| | | // 合并相同行的方法 |
| | | const mergeSameRows = ({ row, column, rowIndex, columnIndex }) => { |
| | | const fieldsToMerge = ['number', 'money', 'money1', 'money2', 'money3', 'money4', 'type', 'unit', 'name']; |
| | | |
| | | if (fieldsToMerge.includes(column.property)) { |
| | | const prevRow = tableData.value[rowIndex - 1] |
| | | const nextRow = tableData.value[rowIndex + 1] |
| | | // 判断当前行和下一行是否相等 |
| | | if ( |
| | | (!prevRow || prevRow[column.property] !== row[column.property]) && |
| | | (!nextRow || nextRow[column.property] === row[column.property]) |
| | | ) { |
| | | let count = 1 |
| | | while ( |
| | | tableData.value[rowIndex + count] && |
| | | tableData.value[rowIndex + count][column.property] === row[column.property] |
| | | ) { |
| | | count++ |
| | | } |
| | | return { rowspan: count, colspan: 1 } |
| | | } else if (prevRow && prevRow[column.property] === row[column.property]) { |
| | | // 隐藏被合并的单元格 |
| | | return { rowspan: 0, colspan: 0 } |
| | | } |
| | | return { rowspan: 1, colspan: 1 } |
| | | } |
| | | |
| | | // 其他列不合并 |
| | | return { rowspan: 1, colspan: 1 } |
| | | } |
| | | // 表格选择数据 |
| | | const selectionChange = (rows) => { |
| | | selectedRows.value = rows |
| | | } |
| | | selectedRows.value = rows; |
| | | }; |
| | | // 打开审核弹框 |
| | | const reviewDia = (row) => { |
| | | reviewVisible.value = true; |
| | | filteredList.value = []; |
| | | form.value = { ...row }; |
| | | form.value.pId = row.id; |
| | | inventoryQuantity.value = row.inventoryQuantity; |
| | | getDropdownData(); |
| | | coalPlanListOptions(); |
| | | }; |
| | | // 查询煤质方案下拉框 |
| | | const coalPlanListOptions = () => { |
| | | coalPlanList().then((res) => { |
| | | qualityPlanOption.value = res.data; |
| | | }); |
| | | }; |
| | | // 查询煤质方案字段 |
| | | const coalPlanByIdList = (id) => { |
| | | coalPlanById({ id: id }).then((res) => { |
| | | filteredList.value = res.data; |
| | | if (!id) { |
| | | filteredList.value = []; |
| | | } |
| | | }); |
| | | }; |
| | | // 查询煤质字段 |
| | | const coalFieldListOption = () => { |
| | | coalFieldList().then((res) => { |
| | | filteredList.value = res.data; |
| | | columnTitle.value = res.data.map((item) => { |
| | | return { |
| | | prop: item.fields, |
| | | label: item.fieldName, // 使用 fieldName 作为 label |
| | | }; |
| | | }); |
| | | }); |
| | | }; |
| | | const handleExport = () => { |
| | | const config = { api: "/officialInventory/export", name: "正式库" }; |
| | | proxy.$modal |
| | | .confirm( |
| | | "是否要导出" + |
| | | (selectedRows.value.length > 0 |
| | | ? `选中的${selectedRows.value.length}条` |
| | | : "全部") + |
| | | "数据?" |
| | | ) |
| | | .then((res) => { |
| | | console.log(res); |
| | | if (res) { |
| | | ElMessage.success("正在导出数据,请稍候..."); |
| | | exportData(config.api, config.name); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | const exportData = (api, name) => { |
| | | proxy.download( |
| | | api, |
| | | { exportIds: selectedRows.value.map((row) => row.id) }, |
| | | `${new Date().getTime()}${name}${new Date().toLocaleDateString("en-CA")}.xlsx` |
| | | ); |
| | | }; |
| | | // 合并库存数据方法 |
| | | const mergeRows = () => { |
| | | if (selectedRows.value.length < 2) { |
| | | proxy.$modal.msgWarning('请至少选择两条数据') |
| | | return |
| | | const mergeRows = (type, row) => { |
| | | getDropdownData(); |
| | | coalPlanListOptions(); |
| | | if (type === "edit" || type === "view") { |
| | | mergeVisible.value = true; |
| | | } |
| | | operationType.value = type; |
| | | if (type !== "merge") { |
| | | mergeForm.value = { ...row }; |
| | | } else { |
| | | if (selectedRows.value.length < 2) { |
| | | proxy.$modal.msgWarning("请至少选择两条数据"); |
| | | return; |
| | | } |
| | | mergeVisible.value = true; |
| | | filteredList.value.forEach((item) => { |
| | | mergeForm.value[item.fields] = ""; |
| | | }); |
| | | const data = selectedRows.value; |
| | | const selectedIds = selectedRows.value.map((row) => row.id); |
| | | // 初始化合计和均值变量 |
| | | let totalInventory = 0; |
| | | let totalPriceIncludingTax = 0; |
| | | let totalPriceExcludingTax = 0; |
| | | let priceIncludingTaxSum = 0; |
| | | let priceExcludingTaxSum = 0; |
| | | // 遍历所有选中数据,累加计算 |
| | | data.forEach((row) => { |
| | | totalInventory += parseFloat(row.inventoryQuantity) || 0; |
| | | priceIncludingTaxSum += parseFloat(row.priceIncludingTax) || 0; |
| | | totalPriceIncludingTax += parseFloat(row.totalPriceIncludingTax) || 0; |
| | | priceExcludingTaxSum += parseFloat(row.priceExcludingTax) || 0; |
| | | totalPriceExcludingTax += parseFloat(row.totalPriceExcludingTax) || 0; |
| | | }); |
| | | // 计算平均值并保留两位小数 |
| | | const avgPriceIncludingTax = Number( |
| | | (priceIncludingTaxSum / data.length).toFixed(2) |
| | | ); |
| | | const avgTotalPriceIncludingTax = Number( |
| | | (totalPriceIncludingTax / data.length).toFixed(2) |
| | | ); |
| | | const avgPriceExcludingTax = Number( |
| | | (priceExcludingTaxSum / data.length).toFixed(2) |
| | | ); |
| | | const avgTotalPriceExcludingTax = Number( |
| | | (totalPriceExcludingTax / data.length).toFixed(2) |
| | | ); |
| | | // 设置表单显示 |
| | | mergeForm.value.inventoryQuantity = totalInventory; |
| | | mergeForm.value.priceIncludingTax = avgPriceIncludingTax; |
| | | mergeForm.value.totalPriceIncludingTax = avgTotalPriceIncludingTax; |
| | | mergeForm.value.priceExcludingTax = avgPriceExcludingTax; |
| | | mergeForm.value.totalPriceExcludingTax = avgTotalPriceExcludingTax; |
| | | mergeForm.value.ids = selectedIds; |
| | | } |
| | | mergeVisible.value = true |
| | | } |
| | | }; |
| | | // 提交合并表单 |
| | | const submitForm = () => { |
| | | |
| | | } |
| | | proxy.$refs.mergeRef.validate((valid) => { |
| | | if (valid) { |
| | | delete mergeForm.value.createTime; |
| | | delete mergeForm.value.updateTime; |
| | | if (operationType.value === "edit") { |
| | | mergeForm.value.fields = filteredList.value.reduce((acc, item) => { |
| | | const key = item.fields; |
| | | const value = mergeForm.value[key]; |
| | | // 判断是否有值(你可以根据需要修改判断条件) |
| | | if (value !== null && value !== undefined && value !== "") { |
| | | acc.push({ [key]: value }); |
| | | } |
| | | return acc; |
| | | }, []); |
| | | editOfficial(mergeForm.value).then(() => { |
| | | cancel(); |
| | | proxy.$modal.msgSuccess("修改成功"); |
| | | handleQuery(); |
| | | }); |
| | | } else { |
| | | mergeForm.value.fields = filteredList.value.reduce((acc, item) => { |
| | | const key = item.fields; |
| | | const value = mergeForm.value[key]; |
| | | // 判断是否有值(你可以根据需要修改判断条件) |
| | | if (value !== null && value !== undefined && value !== "") { |
| | | acc.push({ [key]: value }); |
| | | } |
| | | return acc; |
| | | }, []); |
| | | mergeForm.value.type = 2; |
| | | merge(mergeForm.value).then(() => { |
| | | cancel(); |
| | | proxy.$modal.msgSuccess("合并成功"); |
| | | handleQuery(); |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | }; |
| | | // 关闭合并表单 |
| | | const cancel = () => { |
| | | mergeVisible.value = false |
| | | } |
| | | proxy.$refs.mergeRef.resetFields(); |
| | | mergeVisible.value = false; |
| | | }; |
| | | // 提交审核表单 |
| | | const submitReviewForm = () => { |
| | | proxy.$refs.formRef.validate((valid) => { |
| | | if (valid) { |
| | | delete form.value.registrationTime; |
| | | delete form.value.createTime; |
| | | delete form.value.updateTime; |
| | | form.value.type = 1; |
| | | form.value.fieldValue = filteredList.value.map((item) => ({ |
| | | [item.fields]: form.value[item.fields], |
| | | })); |
| | | addOrEditCoalValue(form.value).then(() => { |
| | | cancelReview(); |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | handleQuery(); |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | // 关闭审核弹框 |
| | | const cancelReview = () => { |
| | | proxy.$refs.formRef.resetFields(); |
| | | reviewVisible.value = false; |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | :deep(.el-table) { |
| | | margin: 20px 0; |
| | | } |
| | | </style> |
| | | </style> |