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 request from '@/utils/request';
import { AxiosPromise } from 'axios'; import { AxiosPromise } from 'axios';
import { BaseStructureBomVO, BaseStructureBomForm, BaseStructureBomQuery } from '@/api/mes/baseStructureBom/types'; import { BaseStructureBomVO, BaseStructureBomForm, BaseStructureBomQuery } from '@/api/mes/baseStructureBom/types';
import {BaseMaterialTypeQuery,BaseMaterialTypeVO} from "./../baseMaterialType/types";
/** /**
* 查询结构BOM信息列表 * 查询结构BOM信息列表
@ -75,3 +76,45 @@ export function getBaseStructureBomList (query) {
params: 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
});
};

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

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

Write Preview
Loading…
Cancel
Save