feat(bid): 新增操作记录模块并优化物料管理页面
1. 新增系统操作日志的后端控制器、前端API、路由与完整页面 2. 为物料管理页面添加发货记录标签页，新增物料发货记录查询功能
This commit is contained in:
@@ -1,70 +1,104 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<el-input v-model="queryParams.materialName" placeholder="请输入物料名称" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="物料编码" prop="materialCode">
|
||||
<el-input v-model="queryParams.materialCode" placeholder="请输入物料编码" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="厂家/品牌" prop="brand">
|
||||
<el-select v-model="queryParams.brand" placeholder="全部品牌" clearable style="width:160px" filterable>
|
||||
<el-option v-for="b in brandList" :key="b" :label="b" :value="b" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属分类">
|
||||
<el-select v-model="queryParams.categoryId" placeholder="全部分类" clearable style="width:160px">
|
||||
<el-option v-for="c in flatCategories" :key="c.categoryId"
|
||||
:label="c.categoryName" :value="c.categoryId" />
|
||||
</el-select>
|
||||
</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-tabs v-model="activeTab">
|
||||
<!-- ═══════════ Tab 1: 物料列表（原有内容） ═══════════ -->
|
||||
<el-tab-pane label="物料列表" name="list">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
|
||||
<el-form-item label="物料名称" prop="materialName">
|
||||
<el-input v-model="queryParams.materialName" placeholder="请输入物料名称" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="物料编码" prop="materialCode">
|
||||
<el-input v-model="queryParams.materialCode" placeholder="请输入物料编码" clearable @keyup.enter.native="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="厂家/品牌" prop="brand">
|
||||
<el-select v-model="queryParams.brand" placeholder="全部品牌" clearable style="width:160px" filterable>
|
||||
<el-option v-for="b in brandList" :key="b" :label="b" :value="b" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属分类">
|
||||
<el-select v-model="queryParams.categoryId" placeholder="全部分类" clearable style="width:160px">
|
||||
<el-option v-for="c in flatCategories" :key="c.categoryId"
|
||||
:label="c.categoryName" :value="c.categoryId" />
|
||||
</el-select>
|
||||
</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="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="materialList"
|
||||
@selection-change="handleSelectionChange"
|
||||
border
|
||||
stripe
|
||||
style="width:100%"
|
||||
:header-cell-style="{ background: '#f5f7fa', color: '#303133', fontWeight: 700, fontSize: '13px' }"
|
||||
:cell-style="{ fontSize: '12px', color: '#606266' }"
|
||||
size="small">
|
||||
<el-table-column type="selection" width="44" align="center" />
|
||||
<el-table-column label="物料编码" prop="materialCode" width="120" header-align="center" align="center" />
|
||||
<el-table-column label="物料名称" prop="materialName" min-width="130" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="分类" prop="categoryName" width="100" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="品牌" prop="brand" width="120" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="规格型号" prop="spec" min-width="140" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="材质" prop="material" width="80" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="用途" prop="purpose" min-width="100" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="状态" align="center" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="180" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" @click="handleDetail(scope.row)">详情</el-button>
|
||||
<el-button size="mini" type="text" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" style="color:#f56c6c" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="materialList"
|
||||
@selection-change="handleSelectionChange"
|
||||
border stripe style="width:100%"
|
||||
:header-cell-style="{ background: '#f5f7fa', color: '#303133', fontWeight: 700, fontSize: '13px' }"
|
||||
:cell-style="{ fontSize: '12px', color: '#606266' }"
|
||||
size="small">
|
||||
<el-table-column type="selection" width="44" align="center" />
|
||||
<el-table-column label="物料编码" prop="materialCode" width="120" header-align="center" align="center" />
|
||||
<el-table-column label="物料名称" prop="materialName" min-width="130" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="分类" prop="categoryName" width="100" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="品牌" prop="brand" width="120" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="规格型号" prop="spec" min-width="140" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="材质" prop="material" width="80" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="用途" prop="purpose" min-width="100" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="状态" align="center" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="180" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" @click="handleDetail(scope.row)">详情</el-button>
|
||||
<el-button size="mini" type="text" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" style="color:#f56c6c" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- ═══════════ Tab 2: 发货记录（新增） ═══════════ -->
|
||||
<el-tab-pane label="发货记录" name="records">
|
||||
<el-select v-model="recordMaterialId" filterable placeholder="选择物料" style="width:400px" @change="loadRecords" clearable>
|
||||
<el-option v-for="m in materialOptions" :key="m.materialId"
|
||||
:label="m.materialCode + ' | ' + (m.materialName || '')" :value="m.materialId" />
|
||||
</el-select>
|
||||
|
||||
<el-table v-loading="recordLoading" :data="recordList" border stripe size="small" style="width:100%;margin-top:12px">
|
||||
<el-table-column label="发货单号" prop="doNo" width="160" />
|
||||
<el-table-column label="供应商" prop="supplierName" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="甲方客户" prop="clientName" width="150" show-overflow-tooltip />
|
||||
<el-table-column label="数量" prop="quantity" width="80" align="right" />
|
||||
<el-table-column label="单价" width="100" align="right">
|
||||
<template slot-scope="s">¥{{ s.row.unitPrice }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="小计" width="100" align="right">
|
||||
<template slot-scope="s">¥{{ s.row.totalPrice }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="交货期" prop="deliveryDate" width="95" align="center" />
|
||||
<el-table-column label="结单日期" prop="actualCloseDate" width="95" align="center" />
|
||||
<el-table-column label="状态" width="85" align="center">
|
||||
<template slot-scope="s">
|
||||
<el-tag :type="recordStatusType(s.row.deliveryStatus)" size="small" effect="dark">{{ recordStatusLabel(s.row.deliveryStatus) }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-empty v-if="!recordMaterialId && !recordLoading" description="请先选择物料" />
|
||||
<el-empty v-if="recordMaterialId && !recordList.length && !recordLoading" description="该物料暂无发货记录" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<!-- 新增/修改对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="760px" append-to-body>
|
||||
@@ -161,6 +195,7 @@
|
||||
<script>
|
||||
import { listMaterial, getMaterial, addMaterial, updateMaterial, delMaterial, listManufacturer } from "@/api/bid/material";
|
||||
import { getCategoryList } from "@/api/bid/category";
|
||||
import request from '@/utils/request'
|
||||
|
||||
export default {
|
||||
name: "Material",
|
||||
@@ -173,6 +208,12 @@ export default {
|
||||
flatCategories: [],
|
||||
brandList: [],
|
||||
perfParams: [],
|
||||
// 发货记录
|
||||
activeTab: "list",
|
||||
recordMaterialId: null,
|
||||
recordLoading: false,
|
||||
recordList: [],
|
||||
materialOptions: [],
|
||||
rules: {
|
||||
materialCode: [{ required: true, message: "物料编码不能为空", trigger: "blur" }],
|
||||
materialName: [{ required: true, message: "物料名称不能为空", trigger: "blur" }],
|
||||
@@ -183,6 +224,7 @@ export default {
|
||||
this.getList();
|
||||
this.loadCategories();
|
||||
this.loadBrands();
|
||||
this.loadMaterialOptions();
|
||||
},
|
||||
methods: {
|
||||
loadCategories() {
|
||||
@@ -281,7 +323,23 @@ export default {
|
||||
const action = this.form.materialId ? updateMaterial : addMaterial;
|
||||
action(this.form).then(() => { this.$modal.msgSuccess("操作成功"); this.open = false; this.getList(); });
|
||||
});
|
||||
}
|
||||
},
|
||||
// ═══════════ 发货记录 ═══════════
|
||||
loadMaterialOptions() {
|
||||
listMaterial({ pageSize: 999 }).then(r => { this.materialOptions = r.rows || [] }).catch(() => {})
|
||||
},
|
||||
loadRecords(materialId) {
|
||||
if (!materialId) { this.recordList = []; return }
|
||||
this.recordLoading = true
|
||||
request({ url: '/bid/delivery/materialRecords/' + materialId, method: 'get' })
|
||||
.then(r => { this.recordList = (r.data || []).map(d => ({
|
||||
...d, deliveryDate: d.deliveryDate ? d.deliveryDate.substring(0, 10) : '',
|
||||
actualCloseDate: d.actualCloseDate ? d.actualCloseDate.substring(0, 10) : ''
|
||||
})); this.recordLoading = false })
|
||||
.catch(() => { this.recordLoading = false })
|
||||
},
|
||||
recordStatusType(s) { return { pending: "warning", transit: "primary", history: "success" }[s] || "" },
|
||||
recordStatusLabel(s) { return { pending: "待发", transit: "在途", history: "已收货" }[s] || s || "-" }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user