feat(wms): 添加收货确认功能并优化表单布局

1. 在入库页面添加收货确认弹窗及功能
2. 调整多个页面的表单布局比例
3. 初始化表单字段避免undefined错误
4. 优化日期格式化处理
This commit is contained in:
砂糖
2025-11-29 17:56:38 +08:00
parent 6c37c934bc
commit 49e5024f89
4 changed files with 106 additions and 76 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div class="app-container">
<el-row :gutter="10">
<el-col :span="4">
<el-col :span="6">
<el-card>
<el-input v-model="planQueryParams.planName" placeholder="计划名称" clearable @change="handlePlanQuery"
style="width: 100%;" />
@@ -20,7 +20,7 @@
</el-card>
</el-col>
<el-col :span="20">
<el-col :span="18">
<el-card>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
label-width="68px">

View File

@@ -2,18 +2,10 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="计划名称" prop="planName">
<el-input
v-model="queryParams.planName"
placeholder="请输入收货计划名称"
clearable
@keyup.enter.native="handleQuery"
/>
<el-input v-model="queryParams.planName" placeholder="请输入收货计划名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="计划日期" prop="planDate">
<el-date-picker clearable
v-model="queryParams.planDate"
type="date"
value-format="yyyy-MM-dd HH:mm:ss"
<el-date-picker clearable v-model="queryParams.planDate" type="date" value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择计划日期">
</el-date-picker>
</el-form-item>
@@ -25,42 +17,18 @@
<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-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
>修改</el-button>
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
@click="handleUpdate">修改</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-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
@click="handleDelete">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
>导出</el-button>
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@@ -91,30 +59,15 @@
</div>
</div>
<div class="card-actions">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(row)"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(row)"
>删除</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(row)">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(row)">删除</el-button>
</div>
</el-card>
</el-col>
</el-row>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改收货计划对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
@@ -123,10 +76,7 @@
<el-input v-model="form.planName" placeholder="请输入收货计划名称" />
</el-form-item>
<el-form-item label="计划日期" prop="planDate">
<el-date-picker clearable
v-model="form.planDate"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
<el-date-picker clearable v-model="form.planDate" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择计划日期">
</el-date-picker>
</el-form-item>
@@ -178,7 +128,10 @@ export default {
planType: 1
},
// 表单参数
form: {},
form: {
planName: '',
planDate: '',
},
// 表单校验
rules: {
}
@@ -246,7 +199,8 @@ export default {
handleAdd() {
// this.reset();
// 默认选中今天的日期和时间, 格式化未yyyy-MM-dd HH:mm:ss
this.form.planDate = new Date().toLocaleString().replace('T', ' ').replace().replace(/\//g, '-')
this.form.planDate = new Date().toLocaleString().substring(0, 19).replace(/\//g, '-').replace('T', ' ')
console.log(this.form.planDate, 'this.form.planDate')
// 收货计划名称格式为年-月-日命名
this.form.planName = new Date().toLocaleDateString().replace(/\//g, '-') + '收货计划'
// 计划类型为收货计划