项目初始化
This commit is contained in:
260
ruoyi-ui/src/views/search/StockSummary/index.vue
Normal file
260
ruoyi-ui/src/views/search/StockSummary/index.vue
Normal file
@@ -0,0 +1,260 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="分组选项">
|
||||
<el-checkbox-group v-model="queryParams.groupFields" @change="handleQuery">
|
||||
<el-checkbox label="productId">物料编号(SKU)</el-checkbox>
|
||||
<el-checkbox label="productName">物料名称</el-checkbox>
|
||||
<!-- <el-checkbox label="spec">规格</el-checkbox>-->
|
||||
<el-checkbox label="unit">单位</el-checkbox>
|
||||
<!-- <el-checkbox label="lotNo">批号</el-checkbox>-->
|
||||
<el-checkbox label="warehouseId">仓库名称</el-checkbox>
|
||||
<!-- <el-checkbox label="roadwayId">巷道</el-checkbox>-->
|
||||
<el-checkbox label="cargoSpaceId">货位号</el-checkbox>
|
||||
<el-checkbox label="price">单价(元)</el-checkbox>
|
||||
<el-checkbox label="spare1">英文名称</el-checkbox>
|
||||
<el-checkbox label="spare2">单件净重(kg)</el-checkbox>
|
||||
<el-checkbox label="spare5">长度(mm)</el-checkbox>
|
||||
<el-checkbox label="spare6">宽度(mm)</el-checkbox>
|
||||
<el-checkbox label="spare7">高度(mm)</el-checkbox>
|
||||
<el-checkbox label="spare8">体积(m³)</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<br>
|
||||
<el-form-item label="仓库名称" prop="warehouseId">
|
||||
<el-select v-model="queryParams.warehouseId" placeholder="请选择仓库名称" clearable>
|
||||
<el-option
|
||||
v-for="dict in warehouseOptions"
|
||||
:key="dict.warehouseId"
|
||||
:label="dict.warehouseName"
|
||||
:value="dict.warehouseId"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="物料编号" prop="productId">
|
||||
<el-input
|
||||
v-model="queryParams.productId"
|
||||
placeholder="请输入物料编号(SKU)"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="物料名称" prop="productName">
|
||||
<el-input
|
||||
v-model="queryParams.productName"
|
||||
placeholder="请输入物料名称关键字"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="规格" prop="spec"> <!– 规格 –>-->
|
||||
<!-- <el-input-->
|
||||
<!-- v-model="queryParams.spec"-->
|
||||
<!-- placeholder="请输入规格"-->
|
||||
<!-- clearable-->
|
||||
<!-- @keyup.enter.native="handleQuery"-->
|
||||
<!-- />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="批号" prop="lotNo"> <!– 批号 –>-->
|
||||
<!-- <el-input-->
|
||||
<!-- v-model="queryParams.lotNo"-->
|
||||
<!-- placeholder="请输入批号"-->
|
||||
<!-- clearable-->
|
||||
<!-- @keyup.enter.native="handleQuery"-->
|
||||
<!-- />-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item label="货位编号" prop="cargoSpaceId">
|
||||
<el-input
|
||||
v-model="queryParams.cargoSpaceId"
|
||||
placeholder="请输入货位号"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['search:StockSummary:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="stockSummaryList"
|
||||
@selection-change="handleSelectionChange"
|
||||
max-height="650"
|
||||
>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="物料编号(SKU)" align="left" prop="productId" width="120" v-if="queryParams.groupFields.includes('productId')" />
|
||||
<el-table-column label="物料名称" align="left" prop="productName" width="120" v-if="queryParams.groupFields.includes('productName')" />
|
||||
<el-table-column label="单位" align="left" prop="unit" width="120" v-if="queryParams.groupFields.includes('unit')" />
|
||||
<el-table-column label="仓库名称" align="left" prop="warehouseName" width="120" v-if="queryParams.groupFields.includes('warehouseId')" />
|
||||
<el-table-column label="货位号" align="left" prop="cargoSpaceName" width="120" v-if="queryParams.groupFields.includes('cargoSpaceId')" />
|
||||
<el-table-column label="数量(件)" align="right" prop="quantity" width="120" />
|
||||
<el-table-column label="英文名称" align="left" prop="spare1" width="120" v-if="queryParams.groupFields.includes('spare1')" />
|
||||
<el-table-column label="单件净重(kg)" align="right" prop="spare2" width="120" v-if="queryParams.groupFields.includes('spare2')" />
|
||||
<el-table-column label="长度(mm)" align="right" prop="spare5" width="120" v-if="queryParams.groupFields.includes('spare5')" />
|
||||
<el-table-column label="宽度(mm)" align="right" prop="spare6" width="120" v-if="queryParams.groupFields.includes('spare6')" />
|
||||
<el-table-column label="高度(mm)" align="right" prop="spare7" width="120" v-if="queryParams.groupFields.includes('spare7')" />
|
||||
<el-table-column label="体积(m³)" align="right" prop="spare8" width="120" v-if="queryParams.groupFields.includes('spare8')" />
|
||||
<el-table-column label="单价(元)" align="right" prop="price" width="120" v-if="queryParams.groupFields.includes('price')" />
|
||||
<el-table-column label="备注" align="left" prop="remark" width="120" />
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listStockSummary, getStockSummary } from "@/api/search/StockSummary";
|
||||
import { listWarehouse } from "@/api/bas/warehouse"
|
||||
|
||||
export default {
|
||||
name: "StockSummary",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 仓库选项
|
||||
warehouseOptions: [],
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 库存汇总表格数据
|
||||
stockSummaryList: [],
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
productId: null,
|
||||
productName: null,
|
||||
spec: null,
|
||||
unit: null,
|
||||
lotNo: null,
|
||||
warehouseId: null,
|
||||
roadwayId: null,
|
||||
quantity: null,
|
||||
//分组字段
|
||||
groupFields: []
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
// 初始化时全选分组选项
|
||||
this.queryParams.groupFields = [
|
||||
'productId', 'productName', 'spec', 'unit', 'lotNo', 'warehouseId', 'cargoSpaceId',
|
||||
'price', 'spare1', 'spare2', 'spare5', 'spare6', 'spare7', 'spare8'
|
||||
];
|
||||
this.getList();
|
||||
this.getWarehouseList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询仓库列表 */
|
||||
getWarehouseList() {
|
||||
var quaryParam = {
|
||||
pageNum:1,
|
||||
pageSize:99
|
||||
}
|
||||
listWarehouse(quaryParam).then(response => {
|
||||
this.warehouseOptions = response.rows;
|
||||
});
|
||||
},
|
||||
/** 查询库存汇总列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
// 将选中的分组字段转换为后端需要的格式
|
||||
const params = {};
|
||||
// 先设置查询条件
|
||||
Object.keys(this.queryParams).forEach(key => {
|
||||
if (key !== 'groupFields' && this.queryParams[key] !== null) {
|
||||
params[key] = this.queryParams[key];
|
||||
}
|
||||
});
|
||||
// 再设置分组字段
|
||||
this.queryParams.groupFields.forEach(field => {
|
||||
params[`groupBy${field.charAt(0).toUpperCase() + field.slice(1)}`] = true;
|
||||
});
|
||||
|
||||
listStockSummary(params).then(response => {
|
||||
this.stockSummaryList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
// 重置时恢复全选状态
|
||||
this.queryParams.groupFields = [
|
||||
'productId', 'productName', 'spec', 'unit', 'lotNo', 'warehouseId', 'cargoSpaceId',
|
||||
'price', 'spare1', 'spare2', 'spare5', 'spare6', 'spare7', 'spare8'
|
||||
];
|
||||
this.handleQuery();
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
// 将选中的分组字段转换为后端需要的格式
|
||||
const params = {};
|
||||
// 先设置查询条件
|
||||
Object.keys(this.queryParams).forEach(key => {
|
||||
if (key !== 'groupFields' && this.queryParams[key] !== null) {
|
||||
params[key] = this.queryParams[key];
|
||||
}
|
||||
});
|
||||
// 再设置分组字段
|
||||
this.queryParams.groupFields.forEach(field => {
|
||||
params[`groupBy${field.charAt(0).toUpperCase() + field.slice(1)}`] = true;
|
||||
});
|
||||
|
||||
this.download('search/StockSummary/export', params, `库存汇总_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.onlyIdentity)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-table >>> .current-row {
|
||||
background-color: #f0f9eb;
|
||||
}
|
||||
.el-form-item >>> .el-form-item__label {
|
||||
white-space: nowrap;
|
||||
width: auto;
|
||||
min-width: fit-content;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user