yinq
/
hwbm-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(wms): 添加发货单代办页面功能

Browse Source 
- 新增发货单代办页面组件，用于展示系统自动生成或手工暂存的发货草稿
- 实现发货单号、项目名称、客户名称等字段的搜索过滤功能
- 集成发货方式字典标签显示，支持表格列显隐控制
- 添加新增、修改、删除等基本CRUD操作功能
- 实现分页查询和批量选择操作功能
- 配置权限控制按钮，确保操作安全性
- 添加数据详情查看和编辑跳转功能
dev
zangch@mesnac.com 1 week ago
parent e9fb4916ba
commit 0cf3b7df2a
1 changed files with 199 additions and 0 deletions
Show Stats Download Patch File Download Diff File

199
src/views/wms/wmsShippingBill/todo.vue
Unescape Escape View File

@ -0,0 +1,199 @@
<template>
<div class="p-2">
<el-alert
title="这里只展示系统自动生成或手工暂存的发货草稿，用户补充完整后再进入编辑页手动发起流程。"
type="info"
:closable="false"
class="mb-[10px]"
/>
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="90px">
<el-form-item label="发货单号" prop="shippingCode">
<el-input v-model="queryParams.shippingCode" placeholder="请输入发货单号" clearable style="width: 180px" @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="项目名称" prop="projectName">
<el-input v-model="queryParams.projectName" placeholder="请输入项目名称" clearable style="width: 180px" @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="客户名称" prop="customerName">
<el-input v-model="queryParams.customerName" placeholder="请输入客户名称" clearable style="width: 180px" @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="发货方式" prop="shippingMode">
<el-select v-model="queryParams.shippingMode" placeholder="请选择发货方式" clearable style="width: 180px">
<el-option v-for="dict in shipping_mode" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
</div>
</transition>
<el-card shadow="never">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['wms:wmsShippingBill:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['wms:wmsShippingBill:edit']"
>修改</el-button
>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['wms:wmsShippingBill:remove']"
>删除</el-button
>
</el-col>
<right-toolbar v-model:showSearch="showSearch" :columns="columns" :search="true" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<el-table v-loading="loading" border :data="wmsShippingBillList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="发货单号" align="center" prop="shippingCode" min-width="140" v-if="columns[0].visible" />
<el-table-column label="项目名称" align="center" prop="projectName" min-width="180" show-overflow-tooltip v-if="columns[1].visible" />
<el-table-column label="合同编号" align="center" prop="contractCode" min-width="140" show-overflow-tooltip v-if="columns[2].visible" />
<el-table-column label="客户名称" align="center" prop="customerName" min-width="140" show-overflow-tooltip v-if="columns[3].visible" />
<el-table-column label="收货联系人" align="center" prop="receiverName" width="120" v-if="columns[4].visible" />
<el-table-column label="收货电话" align="center" prop="receiverPhone" width="140" v-if="columns[5].visible" />
<el-table-column label="发货方式" align="center" prop="shippingMode" width="120" v-if="columns[6].visible">
<template #default="scope">
<dict-tag :options="shipping_mode" :value="scope.row.shippingMode" />
</template>
</el-table-column>
<el-table-column label="草稿状态" align="center" prop="outStockBillStatus" width="100" v-if="columns[7].visible">
<template #default="scope">
<dict-tag :options="shipping_bill_status" :value="scope.row.outStockBillStatus" />
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" width="160" v-if="columns[8].visible">
<template #default="scope">
<span>{{ proxy?.parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="160" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="查看" placement="top">
<el-button link type="primary" icon="View" @click="handleView(scope.row)" v-hasPermi="['wms:wmsShippingBill:query']"></el-button>
</el-tooltip>
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['wms:wmsShippingBill:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['wms:wmsShippingBill:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
</div>
</template>
<script setup name="WmsShippingBillTodo" lang="ts">
import { delWmsShippingBill, listWmsShippingBill } from '@/api/wms/wmsShippingBill';
import type { WmsShippingBillQuery, WmsShippingBillVO } from '@/api/wms/wmsShippingBill/types';
const router = useRouter();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { shipping_mode, shipping_bill_status } = toRefs<any>(proxy?.useDict('shipping_mode', 'shipping_bill_status'));
const loading = ref(false);
const showSearch = ref(true);
const total = ref(0);
const single = ref(true);
const multiple = ref(true);
const ids = ref<Array<string | number>>([]);
const wmsShippingBillList = ref<WmsShippingBillVO[]>([]);
const queryFormRef = ref<ElFormInstance>();
const columns = ref<FieldOption[]>([
{ key: 0, label: '发货单号', visible: true },
{ key: 1, label: '项目名称', visible: true },
{ key: 2, label: '合同编号', visible: true },
{ key: 3, label: '客户名称', visible: true },
{ key: 4, label: '收货联系人', visible: true },
{ key: 5, label: '收货电话', visible: true },
{ key: 6, label: '发货方式', visible: true },
{ key: 7, label: '草稿状态', visible: true },
{ key: 8, label: '创建时间', visible: true }
]);
const queryParams = reactive<WmsShippingBillQuery>({
pageNum: 1,
pageSize: 10,
shippingCode: undefined,
projectName: undefined,
customerName: undefined,
shippingMode: undefined,
// Why：发货代办页面本质上就是“草稿提醒页”，固定只查暂存且未启动流程的数据
outStockBillStatus: '1',
flowStatus: 'draft',
params: {}
});
const getList = async () => {
loading.value = true;
try {
const res = await listWmsShippingBill(queryParams);
wmsShippingBillList.value = res.rows || [];
total.value = res.total || 0;
} finally {
loading.value = false;
}
};
const handleQuery = () => {
queryParams.pageNum = 1;
getList();
};
const resetQuery = () => {
queryFormRef.value?.resetFields();
queryParams.pageNum = 1;
// Why：重置时不能把代办页的固定草稿条件清掉，否则页面会退化成普通发货单列表
queryParams.outStockBillStatus = '1';
queryParams.flowStatus = 'draft';
getList();
};
const handleSelectionChange = (selection: WmsShippingBillVO[]) => {
ids.value = selection.map((item) => item.shippingBillId);
single.value = selection.length !== 1;
multiple.value = selection.length === 0;
};
const handleAdd = () => {
router.push({ path: '/shipping/wmsShippingBill/edit', query: { type: 'add' } });
};
const handleView = (row: WmsShippingBillVO) => {
router.push({ path: '/shipping/wmsShippingBill/edit', query: { type: 'view', id: row.shippingBillId } });
};
const handleUpdate = (row?: WmsShippingBillVO) => {
const shippingBillId = row?.shippingBillId || ids.value[0];
router.push({ path: '/shipping/wmsShippingBill/edit', query: { type: 'update', id: shippingBillId } });
};
const handleDelete = async (row?: WmsShippingBillVO) => {
const shippingBillIds = row?.shippingBillId || ids.value;
await proxy?.$modal.confirm(`是否确认删除发货单编号为"${shippingBillIds}"的数据项？`);
await delWmsShippingBill(shippingBillIds);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
onMounted(() => {
getList();
});
</script>
Write Preview
Loading…
Cancel
Save