You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

452 lines
19 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="p-2">
<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">
<el-form-item label="出库单 主键" prop="outstockId">
<el-input v-model="queryParams.outstockId" placeholder="请输入出库单 主键" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="仓库ID" prop="warehouseId">
<el-select v-model="form.warehouseId" placeholder="请选择所属仓库">
<el-option
v-for="item in baseStoreList"
:key="item.warehouseId"
:label="item.warehouseName"
:value="item.warehouseId"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="出库单号" prop="outstockCode">
<el-input v-model="queryParams.outstockCode" placeholder="请输入出库单号" clearable @keyup.enter="handleQuery" />
</el-form-item>
<!-- <el-form-item label="出库类型" prop="outstockType">
<el-select v-model="queryParams.outstockType" placeholder="请选择出库类型" clearable >
<el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item> -->
<el-form-item label="物料大类" prop="materialCategories">
<el-input v-model="queryParams.materialCategories" placeholder="请输入物料大类" clearable @keyup.enter="handleQuery" />
</el-form-item>
<!-- <el-form-item label="工单类型(字典1销售订单,2生产订单,3手工,4系统生成)" prop="orderType">
<el-select v-model="queryParams.orderType" placeholder="请选择工单类型(字典1销售订单,2生产订单,3手工,4系统生成)" clearable >
<el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item> -->
<el-form-item label="订单编号" prop="orderNo">
<el-input v-model="queryParams.orderNo" placeholder="请输入订单编号" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="审核人" prop="auditBy">
<el-input v-model="queryParams.auditBy" placeholder="请输入审核人" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="审核时间" prop="auditTime">
<el-date-picker clearable
v-model="queryParams.auditTime"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择审核时间"
/>
</el-form-item>
<!-- <el-form-item label="审核状态(0待审核,1审核通过,2审核未通过)" prop="auditStatus">
<el-select v-model="queryParams.auditStatus" placeholder="请选择审核状态(0待审核,1审核通过,2审核未通过)" clearable >
<el-option v-for="dict in ${dictType}" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item> -->
<el-form-item label="审核意见" prop="auditComments">
<el-input v-model="queryParams.auditComments" placeholder="请输入审核意见" clearable @keyup.enter="handleQuery" />
</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="['system:outstockOrder:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:outstockOrder:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:outstockOrder:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:outstockOrder:export']">导出</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" :data="outstockOrderList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="出库单 主键" align="center" prop="outstockId" v-if="columns[0].visible"/> -->
<el-table-column label="仓库ID" align="center" prop="warehouseCode" v-if="columns[1].visible"/>
<el-table-column label="出库单号" align="center" prop="outstockCode" v-if="columns[2].visible"/>
<el-table-column label="出库类型" align="center" prop="outstockType" v-if="columns[3].visible">
<template #default="scope">
<dict-tag :options="wms_out_type" :value="scope.row.outstockType"/>
</template>
</el-table-column>
<el-table-column label="物料大类" align="center" prop="materialCategories" v-if="columns[9].visible">
<template #default="scope">
<dict-tag :options="material_mategories" :value="scope.row.materialCategories"/>
</template>
</el-table-column>
<el-table-column label="工单类型" align="center" prop="orderType" v-if="columns[10].visible">
<template #default="scope">
<dict-tag :options="wms_instock_type" :value="scope.row.orderType"/>
</template>
</el-table-column>
<el-table-column label="订单编号" align="center" prop="orderNo" v-if="columns[11].visible"/>
<el-table-column label="审核人" align="center" prop="auditBy" v-if="columns[12].visible"/>
<el-table-column label="审核时间" align="center" prop="auditTime" width="180" v-if="columns[13].visible">
<template #default="scope">
<span>{{ parseTime(scope.row.auditTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="审核状态" align="center" prop="auditStatus" v-if="columns[14].visible">
<template #default="scope">
<dict-tag :options="approve_status" :value="scope.row.auditStatus"/>
</template>
</el-table-column>
<el-table-column label="审核意见" align="center" prop="auditComments" v-if="columns[15].visible"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:outstockOrder:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:outstockOrder:remove']"></el-button>
</el-tooltip>
<el-tooltip content="详情" placement="top">
<el-button link type="primary" icon="Star" @click="HandleInfo(scope.row)"></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>
<!-- 添加或修改出库单对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="outstockOrderFormRef" :model="form" :rules="rules" label-width="80px">
<el-form-item label="仓库ID" prop="warehouseId">
<el-select v-model="form.warehouseId" placeholder="请选择所属仓库">
<el-option
v-for="item in baseStoreList"
:key="item.warehouseId"
:label="item.warehouseName"
:value="item.warehouseId"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="出库类型" prop="outstockType">
<el-select v-model="form.outstockType" placeholder="请选择出库类型">
<el-option
v-for="dict in wms_out_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="物料大类" prop="materialCategories">
<el-select v-model="form.materialCategories" placeholder="请选择物料大类">
<el-option
v-for="dict in material_mategories"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="工单类型" prop="orderType">
<el-select v-model="form.orderType" placeholder="请选择工单类型(字典1销售订单,2生产订单,3手工,4系统生成)">
<el-option
v-for="dict in wms_instock_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="审核人" prop="auditBy">
<el-select v-model="form.auditBy" placeholder="请选择审核人">
<el-option
v-for="item in userList"
:key="item.userId"
:label="item.userName"
:value="item.userName"
/>
</el-select>
</el-form-item>
<el-form-item label="审核时间" prop="auditTime">
<el-date-picker clearable
v-model="form.auditTime"
type="datetime"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择审核时间">
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="审核状态(0待审核,1审核通过,2审核未通过)" prop="auditStatus">
<el-radio-group v-model="form.auditStatus">
<el-radio
v-for="dict in ${dictType}"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item> -->
<!-- <el-form-item label="审核意见" prop="auditComments">
<el-input v-model="form.auditComments" placeholder="请输入审核意见" />
</el-form-item> -->
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="OutstockOrder" lang="ts">
import { listOutstockOrder, getOutstockOrder, delOutstockOrder, addOutstockOrder, updateOutstockOrder } from '@/api/wms/outstockOrder';
import { OutstockOrderVO, OutstockOrderQuery, OutstockOrderForm } from '@/api/wms/outstockOrder/types';
import { UserForm, UserQuery, UserVO } from '@/api/system/user/types';
import api from '@/api/system/user';
import {getBaseWarehouseList} from "@/api/wms/baseWarehouse";
import { useRouter } from 'vue-router';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { wms_instock_type, approve_status, material_mategories, wms_out_type } = toRefs<any>(proxy?.useDict('wms_instock_type', 'approve_status', 'material_mategories', 'wms_out_type'));
const outstockOrderList = ref<OutstockOrderVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const userList = ref<UserVO[]>();
const queryFormRef = ref<ElFormInstance>();
const outstockOrderFormRef = ref<ElFormInstance>();
let router = useRouter();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
// 列显隐信息
const columns = ref<FieldOption[]>([
{ key: 0, label: `出库单 主键`, visible: true },
{ key: 1, label: `仓库ID`, 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 },
{ key: 9, label: `物料大类`, visible: true },
{ key: 10, label: `工单类型(字典1销售订单,2生产订单,3手工,4系统生成)`, visible: true },
{ key: 11, label: `订单编号`, visible: true },
{ key: 12, label: `审核人`, visible: true },
{ key: 13, label: `审核时间`, visible: true },
{ key: 14, label: `审核状态(0待审核,1审核通过,2审核未通过)`, visible: true },
{ key: 15, label: `审核意见`, visible: true },
]);
const initFormData: OutstockOrderForm = {
outstockId: undefined,
warehouseId: undefined,
outstockCode: undefined,
outstockType: undefined,
materialCategories: undefined,
orderType: undefined,
orderNo: undefined,
auditBy: undefined,
auditTime: undefined,
auditStatus: undefined,
auditComments: undefined
}
const data = reactive<PageData<OutstockOrderForm, OutstockOrderQuery>>({
form: {...initFormData},
queryParams: {
pageNum: 1,
pageSize: 10,
outstockId: undefined,
warehouseId: undefined,
outstockCode: undefined,
outstockType: undefined,
materialCategories: undefined,
orderType: undefined,
orderNo: undefined,
auditBy: undefined,
auditTime: undefined,
auditStatus: undefined,
auditComments: undefined,
params: {
}
},
rules: {
outstockId: [
{ required: true, message: "出库单 主键不能为空", trigger: "blur" }
],
warehouseId: [
{ required: true, message: "仓库ID不能为空", trigger: "blur" }
],
outstockCode: [
{ required: true, message: "出库单号不能为空", trigger: "blur" }
],
outstockType: [
{ required: true, message: "出库类型不能为空", trigger: "change" }
],
materialCategories: [
{ required: true, message: "物料大类不能为空", trigger: "blur" }
],
orderType: [
{ required: true, message: "工单类型(字典1销售订单,2生产订单,3手工,4系统生成)不能为空", trigger: "change" }
],
orderNo: [
{ required: true, message: "订单编号不能为空", trigger: "blur" }
],
auditBy: [
{ required: true, message: "审核人不能为空", trigger: "blur" }
],
auditTime: [
{ required: true, message: "审核时间不能为空", trigger: "blur" }
],
auditStatus: [
{ required: true, message: "审核状态(0待审核,1审核通过,2审核未通过)不能为空", trigger: "change" }
],
auditComments: [
{ required: true, message: "审核意见不能为空", trigger: "blur" }
]
}
});
const { queryParams, form, rules } = toRefs(data);
let baseStoreList = ref([]);
/** 查询车间下拉树结构 */
const getBaseWarehouseListsss = async () => {
let res = await getBaseWarehouseList(null);
baseStoreList.value = res.data;
};
/** 查询出库单列表 */
const getList = async () => {
loading.value = true;
const res = await listOutstockOrder(queryParams.value);
outstockOrderList.value = res.rows;
total.value = res.total;
loading.value = false;
}
/** 查询用户列表 */
const getUserList = async () => {
const res = await api.listUser(null);
userList.value = res.rows;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
}
/** 表单重置 */
const reset = () => {
form.value = {...initFormData};
outstockOrderFormRef.value?.resetFields();
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
}
/** 多选框选中数据 */
const handleSelectionChange = (selection: OutstockOrderVO[]) => {
ids.value = selection.map(item => item.outstockId);
single.value = selection.length != 1;
multiple.value = !selection.length;
}
/** 新增按钮操作 */
const handleAdd = () => {
reset();
getUserList();
dialog.visible = true;
dialog.title = "添加出库单";
}
/** 修改按钮操作 */
const handleUpdate = async (row?: OutstockOrderVO) => {
reset();
const _outstockId = row?.outstockId || ids.value[0]
const res = await getOutstockOrder(_outstockId);
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = "修改出库单";
}
/** 提交按钮 */
const submitForm = () => {
outstockOrderFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.outstockId) {
await updateOutstockOrder(form.value).finally(() => buttonLoading.value = false);
} else {
await addOutstockOrder(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess("操作成功");
dialog.visible = false;
await getList();
}
});
}
/** 删除按钮操作 */
const handleDelete = async (row?: OutstockOrderVO) => {
const _outstockIds = row?.outstockId || ids.value;
await proxy?.$modal.confirm('是否确认删除出库单编号为"' + _outstockIds + '"的数据项?').finally(() => loading.value = false);
await delOutstockOrder(_outstockIds);
proxy?.$modal.msgSuccess("删除成功");
await getList();
}
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download('wms/outstockOrder/export', {
...queryParams.value
}, `outstockOrder_${new Date().getTime()}.xlsx`)
}
const HandleInfo = async (row?: OutstockOrderVO) => {
const outstockId = row?.outstockId;
const materialCategories = row?.materialCategories;
const outstockCode = row?.outstockCode;
router.push({
path: '/wms/outStockDetail',query: {'outstockId': outstockId,'materialCategories': materialCategories,'outstockCode':outstockCode}
});
}
onMounted(() => {
getBaseWarehouseListsss();
getList();
});
</script>