xins
/
hwmom-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.2.1

Browse Source 
生产bom结构树前端页面完成
master
xs 1 month ago
parent 1564e35eb0
commit d29340b968
2 changed files with 414 additions and 314 deletions
Show Stats Download Patch File Download Diff File

43
src/api/mes/baseStructureBom/index.ts
Unescape Escape View File

@ -1,6 +1,7 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { BaseStructureBomVO, BaseStructureBomForm, BaseStructureBomQuery } from '@/api/mes/baseStructureBom/types';
import {BaseMaterialTypeQuery,BaseMaterialTypeVO} from "./../baseMaterialType/types";
/**
* 查询结构BOM信息列表
@ -75,3 +76,45 @@ export function getBaseStructureBomList (query) {
params: query
});
};
/**
* 查询物料结构树下拉树结构
*/
export const structureBomTreeSelect = (): AxiosPromise<BaseStructureBomVO[]> => {
return request({
url: '/mes/baseStructureBom/structureBomTree',
method: 'get'
});
};
/**
* 分页查询结构BOM信息列表
* @param query
* @returns {*}
*/
export const pageListBaseStructureBom = (query?: BaseStructureBomQuery): AxiosPromise<BaseStructureBomVO[]> => {
return request({
url: '/mes/baseStructureBom/pageList',
method: 'get',
params: query
});
};
/**
* 查询物料类型列表
* @param query
* @returns {*}
*/
export const getMaterialTypeList = (query?: BaseMaterialTypeQuery): AxiosPromise<BaseMaterialTypeVO[]> => {
return request({
url: '/mes/baseStructureBom/getMaterialTypeList',
method: 'get',
params: query
});
};

591
src/views/mes/baseStructureBom/index.vue
Unescape Escape View File

@ -1,42 +1,53 @@
<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-row :gutter="20">
<!-- bom结构树 -->
<el-col :lg="4" :xs="24" style="">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<!-- <el-form-item label="主键标识" prop="structureBomId">
<el-input v-model="queryParams.structureBomId" placeholder="请输入主键标识" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="父级标识" prop="parentId">
<el-input v-model="queryParams.parentId" placeholder="请输入父级标识" clearable @keyup.enter="handleQuery" />
</el-form-item>-->
<!-- <el-form-item label="物料类型ID" prop="materialTypeId">
<el-input v-model="queryParams.materialTypeId" placeholder="请输入物料类型ID" clearable @keyup.enter="handleQuery" />
</el-form-item>-->
<!-- <el-form-item label="物料类型名称" prop="materialTypeName">
<el-input v-model="queryParams.materialTypeName" placeholder="请输入物料类型名称" clearable @keyup.enter="handleQuery" />
</el-form-item>-->
<!-- <el-form-item label="结构BOM说明" prop="structureBomDesc">
<el-input v-model="queryParams.structureBomDesc" placeholder="请输入结构BOM说明" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="结构BOM版本" prop="structureBomVersion">
<el-input v-model="queryParams.structureBomVersion" placeholder="请输入结构BOM版本" clearable @keyup.enter="handleQuery" />
<el-input v-model="materialTypeName" placeholder="请输入物料类型名称" prefix-icon="Search" clearable/>
<el-tree
ref="structureBomTreeRef"
class="mt-2"
node-key="id"
:data="structureBomOptions"
:props="{ label: 'label', children: 'children' }"
:expand-on-click-node="false"
:filter-node-method="filterNode"
highlight-current
default-expand-all
@node-click="handleNodeClick"
/>
</el-card>
</el-col>
<el-col :lg="20" :xs="24">
<el-divider content-position="left">物料类型</el-divider>
<el-form ref="parentStructureBomFormRef" label-width="120px">
<el-row>
<el-form-item label="父级物料类型">
{{ parentParentMaterialTypeName }}
</el-form-item>
<el-form-item label="祖级列表" prop="ancestors">
<el-input v-model="queryParams.ancestors" placeholder="请输入祖级列表" clearable @keyup.enter="handleQuery" />
<el-form-item label="物料类型">
{{ parentMaterialTypeName }}
</el-form-item>
<el-form-item label="层级" prop="level">
<el-input v-model="queryParams.level" placeholder="请输入层级" clearable @keyup.enter="handleQuery" />
</el-row>
</el-form>
<el-divider content-position="left">子级物料类型</el-divider>
<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="materialTypeCode" label-width="120px">
<el-input v-model="queryParams.materialTypeCode" placeholder="请输入物料类型编号" clearable
@keyup.enter="handleQuery"/>
</el-form-item>
<el-form-item label="顶级标识" prop="topFlag">
<el-select v-model="queryParams.topFlag" placeholder="请选择顶级标识(1是 0否)" clearable>
<el-option v-for="dict in top_flag" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>-->
<el-form-item label="激活标识" prop="activeFlag">
<el-select v-model="queryParams.activeFlag" placeholder="请选择激活标识" clearable>
<el-option v-for="dict in active_flag" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
<el-form-item label="物料类型名称" prop="materialTypeName" label-width="120px">
<el-input v-model="queryParams.materialTypeName" placeholder="请输入物料类型名称" clearable
@keyup.enter="handleQuery"/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@ -47,182 +58,157 @@
</div>
</transition>
<el-card shadow="never">
<el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-row :gutter="10">
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd()" v-hasPermi="['mes:baseStructureBom:add']">新增</el-button>
<el-button v-has-permi="['mes:baseStructureBom:add']" type="primary" plain icon="Plus"
@click="handleAdd()">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
<el-button v-has-permi="['mes:baseStructureBom:edit']" type="success" plain :disabled="single"
icon="Edit" @click="handleUpdate()">
修改
</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
<el-col :span="1.5">
<el-button v-has-permi="['mes:baseStructureBom:remove']" type="danger" plain :disabled="multiple"
icon="Delete" @click="handleDelete()">
删除
</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" :columns="columns" :search="true"
@query-table="getList"></right-toolbar>
</el-row>
</template>
<el-table
ref="baseStructureBomTableRef"
v-loading="loading"
:data="baseStructureBomList"
row-key="structureBomId"
:default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<!-- <el-table-column label="主键标识" align="center" prop="structureBomId" />
<el-table-column label="租户编号" prop="tenantId" />
<el-table-column label="父级标识" align="center" prop="parentId" />-->
<!-- <el-table-column label="物料类型ID" align="center" prop="materialTypeId" />-->
<el-table-column label="物料类型名称" align="center" prop="materialTypeName" />
<el-table-column label="结构BOM版本" align="center" prop="structureBomVersion" />
<!-- <el-table-column label="结构BOM说明" align="center" prop="structureBomDesc" />-->
<!-- <el-table-column label="祖级列表" align="center" prop="ancestors" />-->
<!-- <el-table-column label="层级" align="center" prop="level" />-->
<!-- <el-table-column label="顶级标识" align="center" prop="topFlag">-->
<!-- <template #default="scope">-->
<!-- <dict-tag :options="top_flag" :value="scope.row.topFlag"/>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="激活标识" align="center" prop="activeFlag">
<el-table v-loading="loading" :data="structureBomList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center"/>
<el-table-column v-if="columns[0].visible" key="structureBomId" label="BOM结构编号" align="center"
prop="structureBomId"/>
<el-table-column v-if="columns[1].visible" key="materialTypeCode" label="物料类型编号" align="center"
prop="materialTypeCode" :show-overflow-tooltip="true"/>
<el-table-column v-if="columns[2].visible" key="materialTypeName" label="物料类型名称" align="center"
prop="materialTypeName" :show-overflow-tooltip="true"/>
<el-table-column v-if="columns[3].visible" label="创建时间" align="center" prop="createTime" width="160">
<template #default="scope">
<dict-tag :options="active_flag" :value="scope.row.activeFlag"/>
<span>{{ scope.row.createTime }}</span>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<!-- <el-table-column label="创建部门" align="center" prop="createDept" />
<el-table-column label="创建人" align="center" prop="createBy" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
<el-table-column v-if="columns[3].visible" label="更新时间" align="center" prop="updateTime" width="160">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
<span>{{ scope.row.updateTime }}</span>
</template>
</el-table-column>
<el-table-column label="更新人" align="center" prop="updateBy" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column label="操作" fixed="right" width="180" 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="['mes:baseStructureBom:edit']" />
</el-tooltip>
<el-tooltip content="新增" placement="top">
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['mes:baseStructureBom:add']" />
<el-button v-hasPermi="['mes:baseStructureBom:edit']" link type="primary" icon="Edit"
@click="handleUpdate(scope.row)"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['mes:baseStructureBom:remove']" />
<el-button v-hasPermi="['mes:baseStructureBom:remove']" link type="primary" icon="Delete"
@click="handleDelete(scope.row)"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<!-- <pagination-->
<!-- v-show="total > 0"-->
<!-- v-model:page="queryParams.pageNum"-->
<!-- v-model:limit="queryParams.pageSize"-->
<!-- :total="total"-->
<!-- @pagination="getList"-->
<!-- />-->
</el-card>
<!-- 添加或修改结构BOM信息对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="baseStructureBomFormRef" :model="form" :rules="rules" label-width="120px">
<!-- <el-form-item label="主键标识" prop="structureBomId">
<el-input v-model="form.structureBomId" placeholder="请输入主键标识" />
</el-form-item>-->
<el-form-item label="父级标识" prop="parentId">
<el-tree-select
v-model="form.parentId"
:data="baseStructureBomOptions"
:props="{ value: 'structureBomId', label: 'materialTypeName', children: 'children' }"
value-key="structureBomId"
placeholder="请选择父级标识"
check-strictly
/>
</el-form-item>
<el-form-item label="物料类型" prop="materialTypeId">
<!-- <el-input v-model="form.materialTypeId" placeholder="请输入物料类型ID" />-->
<el-tree-select
@current-change="currentMaterialTypeChange"
v-model="form.materialTypeId"
:data="baseMaterialTypeOptions"
:props="{ value: 'matrialTypeId', label: 'matrialTypeName', children: 'children' }"
value-key="materialTypeId"
placeholder="请选择物料类型"
check-strictly
/>
</el-form-item>
<!-- <el-form-item label="物料类型名称" prop="materialTypeName">-->
<!-- <el-input v-model="form.materialTypeName" placeholder="请输入物料类型名称" />-->
<!-- </el-form-item>-->
<el-form-item label="结构BOM版本" prop="structureBomVersion">
<el-input v-model="form.structureBomVersion" placeholder="请输入结构BOM版本" />
</el-form-item>
<!-- <el-form-item label="结构BOM说明" prop="structureBomDesc">-->
<!-- <el-input v-model="form.structureBomDesc" placeholder="请输入结构BOM说明" />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="祖级列表" prop="ancestors">
<el-input v-model="form.ancestors" placeholder="请输入祖级列表" />
</el-form-item>-->
<!-- <el-form-item label="层级" prop="level">-->
<!-- <el-input v-model="form.level" placeholder="请输入层级" />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="顶级标识" prop="topFlag">-->
<!-- <el-radio-group v-model="form.topFlag">-->
<!-- <el-radio-->
<!-- v-for="dict in top_flag"-->
<!-- :key="dict.value"-->
<!-- :value="parseInt(dict.value)"-->
<!-- >{{dict.label}}</el-radio>-->
<!-- </el-radio-group>-->
<!-- </el-form-item>-->
<el-form-item label="激活标识" prop="activeFlag">
<el-radio-group v-model="form.activeFlag">
<el-radio
v-for="dict in active_flag"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-col>
</el-row>
<!-- 添加或修改物料类型bom结构树配置对话框 -->
<el-dialog ref="formDialogRef" v-model="dialog.visible" :title="dialog.title" width="600px" append-to-body
@close="closeDialog">
<el-form ref="structureBomFormRef" :model="form" :rules="rules" label-width="90px">
<el-form-item label="物料类型">
{{ parentMaterialTypeName }}
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
<el-form-item label="子物料类型">
<el-select v-model="form.materialTypeId" placeholder="请选择">
<el-option
v-for="item in materialTypeOptions"
:key="item.matrialTypeId"
:label="item.matrialTypeName"
:value="item.matrialTypeId"
:disabled="item.activeFlag == '0'"
></el-option>
</el-select>
</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>
<el-button type="primary" @click="submitForm" :loading="submitLoading">确 定</el-button>
<el-button @click="cancel()">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="BaseStructureBom" lang="ts">
import { listBaseStructureBom, getBaseStructureBom, delBaseStructureBom, addBaseStructureBom, updateBaseStructureBom } from "@/api/mes/baseStructureBom";
import { BaseStructureBomVO, BaseStructureBomQuery, BaseStructureBomForm } from '@/api/mes/baseStructureBom/types';
import { getBaseMaterialTypeList } from '@/api/mes/baseMaterialType';
import { BaseMaterialTypeVO } from '@/api/mes/baseMaterialType/types';
type BaseStructureBomOption = {
structureBomId: number;
materialTypeName: string;
children?: BaseStructureBomOption[];
}
const { proxy } = getCurrentInstance() as ComponentInternalInstance;;
import {
structureBomTreeSelect,
listBaseStructureBom,
getBaseStructureBom,
delBaseStructureBom,
addBaseStructureBom,
updateBaseStructureBom, getMaterialTypeList
} from "@/api/mes/baseStructureBom";
import {BaseStructureBomVO, BaseStructureBomQuery, BaseStructureBomForm} from '@/api/mes/baseStructureBom/types';
import {BaseMaterialTypeVO} from '@/api/mes/baseMaterialType/types';
import {to} from 'await-to-js';
import {nextTick} from "vue";
const { top_flag, active_flag } = toRefs<any>(proxy?.useDict('top_flag', 'active_flag'));
const baseStructureBomList = ref<BaseStructureBomVO[]>([]);
const baseStructureBomOptions = ref<BaseStructureBomOption[]>([]);
const buttonLoading = ref(false);
const showSearch = ref(true);
const isExpandAll = ref(true);
const router = useRouter();
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
const {sys_normal_disable, sys_user_sex} = toRefs<any>(proxy?.useDict('sys_normal_disable', 'sys_user_sex'));
const structureBomList = ref<BaseStructureBomVO[]>();
const loading = ref(false);
const submitLoading = ref(false);
const showSearch = ref(true);
const ids = ref<Array<number | string>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
const materialTypeName = ref('');
const structureBomOptions = ref<BaseStructureBomVO[]>([]);
const materialTypeOptions = ref<BaseMaterialTypeVO[]>([]);
const parentMaterialTypeName = ref('');
const parentParentMaterialTypeName = ref('');
// 列显隐信息
const columns = ref<FieldOption[]>([
{key: 0, label: `BOM结构编号`, visible: true, children: []},
{key: 1, label: `物料类型编号`, visible: true, children: []},
{key: 2, label: `物料类型名称`, visible: true, children: []},
{key: 3, label: `创建时间`, visible: true, children: []},
{key: 4, label: `更新时间`, visible: true, children: []}
]);
const structureBomTreeRef = ref<ElTreeInstance>();
const queryFormRef = ref<ElFormInstance>();
const baseStructureBomFormRef = ref<ElFormInstance>();
const baseStructureBomTableRef = ref<ElTableInstance>()
const structureBomFormRef = ref<ElFormInstance>();
const formDialogRef = ref<ElDialogInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initFormData: BaseStructureBomForm = {
structureBomId: undefined,
parentId: undefined,
@ -250,149 +236,220 @@ const data = reactive<PageData<BaseStructureBomForm, BaseStructureBomQuery>>({
level: undefined,
topFlag: undefined,
activeFlag: undefined,
params: {
}
materialTypeCode: undefined,
params: {}
},
rules: {
materialTypeId: [
{ required: true, message: "物料类型ID不能为空", trigger: "blur" }
],
materialTypeName: [
{ required: true, message: "物料类型名称不能为空", trigger: "blur" }
],
{required: true, message: "物料类型不能为空", trigger: "blur"}
]
}
});
const { queryParams, form, rules } = toRefs(data);
const {queryParams, form, rules} = toRefs(data);
/** 通过条件过滤节点 */
const filterNode = (value: string, data: any) => {
if (!value) return true;
return data.label.indexOf(value) !== -1;
};
/** 根据名称筛选部门树 */
watchEffect(
() => {
structureBomTreeRef.value?.filter(materialTypeName.value);
},
{
flush: 'post' // watchEffect会在DOM挂载或者更新之前就会触发，此属性控制在DOM元素更新后运行
}
);
/** 查询物料类型bom结构树下拉树结构 */
const getTreeSelect = async () => {
const res = await structureBomTreeSelect();
// alert(JSON.stringify(res))
structureBomOptions.value = res.data;
/** 查询结构BOM信息列表 */
if (queryParams.value.parentId === null || queryParams.value.parentId === undefined) {
const topStructureBom = structureBomOptions.value.find(item => item.id === -1);
queryParams.value.parentId = -1;
parentMaterialTypeName.value = topStructureBom.label;
parentParentMaterialTypeName.value = "顶级";
}
nextTick(function () {
structureBomTreeRef.value?.setCurrentKey(queryParams.value.parentId, true);
handleQuery();
})
// const dd = {"id":"1","parentId":-1,"label":"dd"};
// alert(materialTypeOptions.value[0])
// materialTypeOptions.value[0].children.push(dd);
};
/** 查询用户列表 */
const getList = async () => {
loading.value = true;
const res = await listBaseStructureBom(queryParams.value);
const data = proxy?.handleTree<BaseStructureBomVO>(res.data, "structureBomId", "parentId");
if (data) {
baseStructureBomList.value = data;
// alert(JSON.stringify(res))
loading.value = false;
}
}
/** 查询结构BOM信息下拉树结构 */
const getTreeselect = async () => {
const res = await listBaseStructureBom();
baseStructureBomOptions.value = [];
const data: BaseStructureBomOption = { structureBomId: 0, materialTypeName: '顶级节点', children: [] };
data.children = proxy?.handleTree<BaseStructureBomOption>(res.data, "structureBomId", "parentId");
baseStructureBomOptions.value.push(data);
}
structureBomList.value = res.data;
// total.value = res.total;
};
// 取消按钮
const cancel = () => {
reset();
dialog.visible = false;
}
/** 节点单击事件 */
const handleNodeClick = (data: BaseStructureBomVO) => {
queryParams.value.parentId = data.id;
parentMaterialTypeName.value = data.label;
if (data.parentId === 0) {
parentParentMaterialTypeName.value = "顶级";
} else if (data.parentId === -1) {
parentParentMaterialTypeName.value = "BOM结构";
} else {
const findMaterialType = materialTypeOptions.value.find(item => item.matrialTypeId === data.parentId);
parentParentMaterialTypeName.value = findMaterialType.matrialTypeName;
}
// 表单重置
const reset = () => {
form.value = {...initFormData}
baseStructureBomFormRef.value?.resetFields();
}
handleQuery();
};
/** 搜索按钮操作 */
const handleQuery = () => {
// queryParams.value.pageNum = 1;
getList();
}
};
/** 重置按钮操作 */
const resetQuery = () => {
// dateRange.value = ['', ''];
queryFormRef.value?.resetFields();
// queryParams.value.pageNum = 1;
// queryParams.value.parentId = undefined;
// structureBomTreeRef.value?.setCurrentKey(undefined);
handleQuery();
}
};
/** 新增按钮操作 */
const handleAdd = (row?: BaseStructureBomVO) => {
reset();
getbaseMaterialTypeOptions();
getTreeselect();
if (row != null && row.structureBomId) {
form.value.parentId = row.structureBomId;
} else {
form.value.parentId = 0;
/** 删除按钮操作 */
const handleDelete = async (row?: BaseStructureBomVO) => {
const structureBomIds = row?.structureBomId || ids.value;
const [err] = await to(proxy?.$modal.confirm('是否确认删除BOM结构编号为"' + structureBomIds + '"的数据项？') as any);
if (!err) {
await delBaseStructureBom(structureBomIds)
await getTreeSelect();
handleQuery();
proxy?.$modal.msgSuccess('删除成功');
}
dialog.visible = true;
dialog.title = "添加结构BOM信息";
}
};
/** 展开/折叠操作 */
const handleToggleExpandAll = () => {
isExpandAll.value = !isExpandAll.value;
toggleExpandAll(baseStructureBomList.value, isExpandAll.value)
}
/** 选择条数 */
const handleSelectionChange = (selection: BaseStructureBomVO[]) => {
ids.value = selection.map((item) => item.structureBomId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 展开/折叠操作 */
const toggleExpandAll = (data: BaseStructureBomVO[], status: boolean) => {
data.forEach((item) => {
baseStructureBomTableRef.value?.toggleRowExpansion(item, status)
if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
})
}
/** 初始化物料类型数据 */
const initMaterialTypeData = async () => {
// 判断物料类型结构树的数据是否存在，存在不获取，不存在则获取
// alert(JSON.stringify(materialTypeOptions))
// alert(materialTypeOptions.value)
if (materialTypeOptions.value === undefined || materialTypeOptions.value.length <= 0) {
const {data} = await getMaterialTypeList();
// alert(JSON.stringify(data))
materialTypeOptions.value = data;
}
};
/** 重置操作表单 */
const reset = () => {
form.value = {...initFormData};
structureBomFormRef.value?.resetFields();
};
/** 取消按钮 */
const cancel = () => {
dialog.visible = false;
reset();
};
/** 新增按钮操作 */
const handleAdd = async () => {
reset();
// alert(JSON.stringify(data))
dialog.visible = true;
dialog.title = '新增';
await initMaterialTypeData();
form.value.parentId = queryParams.value.parentId;
};
/** 修改按钮操作 */
const handleUpdate = async (row: BaseStructureBomVO) => {
const handleUpdate = async (row?: BaseStructureBomForm) => {
reset();
getbaseMaterialTypeOptions();
await getTreeselect();
if (row != null) {
form.value.parentId = row.parentId;
}
const res = await getBaseStructureBom(row.structureBomId);
const structureBomId = row?.structureBomId || ids.value[0];
const res = await getBaseStructureBom(structureBomId);
await initMaterialTypeData();
Object.assign(form.value, res.data);
dialog.visible = true;
dialog.title = "修改结构BOM信息";
}
dialog.title = "修改";
// alert(JSON.stringify(res.data))
// form.value.materialTypeId = res.data.matrialTypeId;
};
/** 提交按钮 */
const submitForm = () => {
baseStructureBomFormRef.value?.validate(async (valid: boolean) => {
structureBomFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.structureBomId) {
await updateBaseStructureBom(form.value).finally(() => buttonLoading.value = false);
} else {
await addBaseStructureBom(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess("操作成功");
submitLoading.value = true;
// alert(JSON.stringify(materialTypeOptions.value))
const findMaterialType = materialTypeOptions.value.find(item => item.matrialTypeId === form.value.materialTypeId);
form.value.materialTypeName = findMaterialType.matrialTypeName;
try {
form.value.structureBomId ? await updateBaseStructureBom(form.value) : await addBaseStructureBom(form.value);
proxy?.$modal.msgSuccess('操作成功');
await getTreeSelect();
handleQuery();
dialog.visible = false;
getList();
submitLoading.value = false;
} catch {
submitLoading.value = false;
}
});
}
/** 删除按钮操作 */
const handleDelete = async (row: BaseStructureBomVO) => {
await proxy?.$modal.confirm('是否确认删除结构BOM信息编号为"' + row.structureBomId + '"的数据项？');
loading.value = true;
await delBaseStructureBom(row.structureBomId).finally(() => loading.value = false);
await getList();
proxy?.$modal.msgSuccess("删除成功");
}
/*获取物料下拉框*/
let baseMaterialTypeOptions = ref([]);
const getbaseMaterialTypeOptions = async () => {
let rs = await getBaseMaterialTypeList(null);
const data = proxy?.handleTree<BaseMaterialTypeVO>(rs.data, "matrialTypeId", "parentId");
if (data) {
baseMaterialTypeOptions.value = data;
// const child = {"id":"1","parentId":-1,"label":"dd"};
// alert(materialTypeOptions.value[0])
// materialTypeOptions.value[0].children.push(dd);
}
}
});
};
// 监控 form.materialTypeId 的变化
const currentMaterialTypeChange = (e)=>{
form.value.materialTypeName = e.matrialTypeName || ''
}
/**
* 关闭用户弹窗
*/
const closeDialog = () => {
dialog.visible = false;
resetForm();
};
/**
* 重置表单
*/
const resetForm = () => {
structureBomFormRef.value?.resetFields();
structureBomFormRef.value?.clearValidate();
form.value.structureBomId = undefined;
form.value.activeFlag = '1';
};
onMounted(() => {
getList();
getTreeSelect(); // 初始化物料类型结构bom数据
initMaterialTypeData();
});
// async function handleDeptChange(value: number | string) {
// const response = await optionselect(value);
// materialTypeOptions.value = response.data;
// form.value.postIds = [];
// }
</script>
<style lang="scss" scoped></style>

Write Preview
Loading…
Cancel
Save