feat(mes): 完善物料分类与物料产品前端功能
1. 新增 ItemTypeTree 左侧分类树组件(支持搜索过滤、点击切换)
2. 物料列表改为左右布局(左侧树 + 右侧列表)
3. 新增 MesItemOrProductEnum 常量({ label, value } 结构)
4. 物料/产品列用 getItemOrProductLabel 翻译,安全库存列用 dict-tag 渲染
5. 表单改为 3 列布局(span=8),增加编码生成按钮和底部 Tab 占位
6. 分类管理移除导出按钮,分类表单修复 TS 类型和枚举默认值
7. 分类 API 移除 exportItemType
pull/871/MERGE
parent
6bb27899c1
commit
27f5fcb66e
|
|
@ -42,10 +42,5 @@ export const MdItemTypeApi = {
|
||||||
// 删除物料产品分类
|
// 删除物料产品分类
|
||||||
deleteItemType: async (id: number) => {
|
deleteItemType: async (id: number) => {
|
||||||
return await request.delete({ url: `/mes/md/item-type/delete?id=` + id })
|
return await request.delete({ url: `/mes/md/item-type/delete?id=` + id })
|
||||||
},
|
|
||||||
|
|
||||||
// 导出物料产品分类 Excel
|
|
||||||
exportItemType: async (params: any) => {
|
|
||||||
return await request.download({ url: `/mes/md/item-type/export-excel`, params })
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,78 @@
|
||||||
|
<template>
|
||||||
|
<div class="head-container">
|
||||||
|
<el-input v-model="filterName" class="mb-20px" clearable placeholder="请输入分类名称">
|
||||||
|
<template #prefix>
|
||||||
|
<Icon icon="ep:search" />
|
||||||
|
</template>
|
||||||
|
</el-input>
|
||||||
|
</div>
|
||||||
|
<div class="head-container">
|
||||||
|
<el-tree
|
||||||
|
ref="treeRef"
|
||||||
|
:data="itemTypeList"
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
:filter-node-method="filterNode"
|
||||||
|
:props="defaultProps"
|
||||||
|
default-expand-all
|
||||||
|
highlight-current
|
||||||
|
node-key="id"
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ElTree } from 'element-plus'
|
||||||
|
import { MdItemTypeApi } from '@/api/mes/md/item/type'
|
||||||
|
import { defaultProps, handleTree } from '@/utils/tree'
|
||||||
|
|
||||||
|
defineOptions({ name: 'MesItemTypeTree' })
|
||||||
|
|
||||||
|
const filterName = ref('')
|
||||||
|
const itemTypeList = ref<Tree[]>([])
|
||||||
|
const treeRef = ref<InstanceType<typeof ElTree>>()
|
||||||
|
|
||||||
|
/** 获得分类树 */
|
||||||
|
const getTree = async () => {
|
||||||
|
const res = await MdItemTypeApi.getItemTypeSimpleList()
|
||||||
|
itemTypeList.value = []
|
||||||
|
itemTypeList.value.push(...handleTree(res))
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 基于名字过滤 */
|
||||||
|
const filterNode = (name: string, data: Tree) => {
|
||||||
|
if (!name) {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
return data.name.includes(name)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 处理分类被点击 */
|
||||||
|
let currentNode: any = {}
|
||||||
|
const handleNodeClick = async (row: { [key: string]: any }, treeNode: any) => {
|
||||||
|
if (currentNode && currentNode.name === row.name) {
|
||||||
|
treeNode.checked = !treeNode.checked
|
||||||
|
} else {
|
||||||
|
treeNode.checked = true
|
||||||
|
}
|
||||||
|
if (treeNode.checked) {
|
||||||
|
currentNode = row
|
||||||
|
emits('node-click', row)
|
||||||
|
} else {
|
||||||
|
treeRef.value!.setCurrentKey(undefined)
|
||||||
|
emits('node-click', undefined)
|
||||||
|
currentNode = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const emits = defineEmits(['node-click'])
|
||||||
|
|
||||||
|
/** 监听过滤名称 */
|
||||||
|
watch(filterName, (val) => {
|
||||||
|
treeRef.value!.filter(val)
|
||||||
|
})
|
||||||
|
|
||||||
|
/** 初始化 */
|
||||||
|
onMounted(async () => {
|
||||||
|
await getTree()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<!-- MES 物料产品的新增/修改 -->
|
<!-- MES 物料产品的新增/修改 -->
|
||||||
<template>
|
<template>
|
||||||
<Dialog :title="dialogTitle" v-model="dialogVisible">
|
<Dialog :title="dialogTitle" v-model="dialogVisible" width="1000px">
|
||||||
<el-form
|
<el-form
|
||||||
ref="formRef"
|
ref="formRef"
|
||||||
:model="formData"
|
:model="formData"
|
||||||
|
|
@ -8,31 +8,34 @@
|
||||||
label-width="120px"
|
label-width="120px"
|
||||||
v-loading="formLoading"
|
v-loading="formLoading"
|
||||||
>
|
>
|
||||||
<!-- TODO @AI:一行 3 个? -->
|
|
||||||
<el-row :gutter="20">
|
<el-row :gutter="20">
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<!-- TODO @AI:有个生成按钮,类似 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/iot/product/product/ProductForm.vue -->
|
|
||||||
<!-- TODO @芋艿:先做个假的,ai;把交互做通;后续会有个后端接口 -->
|
|
||||||
<el-form-item label="物料编码" prop="code">
|
<el-form-item label="物料编码" prop="code">
|
||||||
<el-input v-model="formData.code" placeholder="请输入物料编码" />
|
<el-input v-model="formData.code" placeholder="请输入物料编码">
|
||||||
|
<template #append>
|
||||||
|
<el-button @click="generateCode" :disabled="formType === 'update'">
|
||||||
|
生成
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="物料名称" prop="name">
|
<el-form-item label="物料名称" prop="name">
|
||||||
<el-input v-model="formData.name" placeholder="请输入物料名称" />
|
<el-input v-model="formData.name" placeholder="请输入物料名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="规格型号" prop="specification">
|
<el-form-item label="规格型号" prop="specification">
|
||||||
<el-input v-model="formData.specification" placeholder="请输入规格型号" />
|
<el-input v-model="formData.specification" placeholder="请输入规格型号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="单位" prop="unitOfMeasure">
|
<el-form-item label="单位" prop="unitOfMeasure">
|
||||||
<el-input v-model="formData.unitOfMeasure" placeholder="请输入单位编码" />
|
<el-input v-model="formData.unitOfMeasure" placeholder="请输入单位编码" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="物料分类" prop="itemTypeId">
|
<el-form-item label="物料分类" prop="itemTypeId">
|
||||||
<el-tree-select
|
<el-tree-select
|
||||||
v-model="formData.itemTypeId"
|
v-model="formData.itemTypeId"
|
||||||
|
|
@ -45,7 +48,7 @@
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-radio-group v-model="formData.status">
|
<el-radio-group v-model="formData.status">
|
||||||
<el-radio
|
<el-radio
|
||||||
|
|
@ -58,22 +61,22 @@
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="高值物料" prop="highValue">
|
<el-form-item label="高值物料" prop="highValue">
|
||||||
<el-switch v-model="formData.highValue" />
|
<el-switch v-model="formData.highValue" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="批次管理" prop="batchFlag">
|
<el-form-item label="批次管理" prop="batchFlag">
|
||||||
<el-switch v-model="formData.batchFlag" />
|
<el-switch v-model="formData.batchFlag" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="8">
|
||||||
<el-form-item label="安全库存" prop="safeStockFlag">
|
<el-form-item label="安全库存" prop="safeStockFlag">
|
||||||
<el-switch v-model="formData.safeStockFlag" />
|
<el-switch v-model="formData.safeStockFlag" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" v-if="formData.safeStockFlag">
|
<el-col :span="8" v-if="formData.safeStockFlag">
|
||||||
<el-form-item label="最低库存量" prop="minStock">
|
<el-form-item label="最低库存量" prop="minStock">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-model="formData.minStock"
|
v-model="formData.minStock"
|
||||||
|
|
@ -84,7 +87,7 @@
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" v-if="formData.safeStockFlag">
|
<el-col :span="8" v-if="formData.safeStockFlag">
|
||||||
<el-form-item label="最高库存量" prop="maxStock">
|
<el-form-item label="最高库存量" prop="maxStock">
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-model="formData.maxStock"
|
v-model="formData.maxStock"
|
||||||
|
|
@ -102,8 +105,28 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
<!-- TODO @AI:底部的 tab 有 BOM组成、批次属性、替代品、SIP、SOP;做法类似:/Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/member/user/detail 有很多 tab;只有修改时,才展示 -->
|
<!-- 底部 Tab:仅修改时展示 -->
|
||||||
<!-- TODO @AI:是不是要有个组件,BarcodeImg 二维码查看; -->
|
<el-tabs v-model="activeTab" v-if="formType === 'update' && formData.id">
|
||||||
|
<!-- TODO @芋艿:BOM 组成,等 BOM 模块实现后对接 -->
|
||||||
|
<el-tab-pane label="BOM 组成" name="bom" lazy>
|
||||||
|
<el-empty description="BOM 组成(待实现)" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<!-- TODO @芋艿:批次属性,等批次模块实现后对接 -->
|
||||||
|
<el-tab-pane label="批次属性" name="batch" lazy>
|
||||||
|
<el-empty description="批次属性(待实现)" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<!-- TODO @芋艿:替代品,等替代品模块实现后对接 -->
|
||||||
|
<el-tab-pane label="替代品" name="substitute" lazy>
|
||||||
|
<el-empty description="替代品(待实现)" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<!-- TODO @芋艿:SIP/SOP,等工艺模块实现后对接 -->
|
||||||
|
<el-tab-pane label="SIP" name="sip" lazy>
|
||||||
|
<el-empty description="SIP(待实现)" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="SOP" name="sop" lazy>
|
||||||
|
<el-empty description="SOP(待实现)" />
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
|
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||||
|
|
@ -112,6 +135,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||||
|
import { generateRandomStr } from '@/utils'
|
||||||
import { MdItemApi, MdItemVO } from '@/api/mes/md/item'
|
import { MdItemApi, MdItemVO } from '@/api/mes/md/item'
|
||||||
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
||||||
import { CommonStatusEnum } from '@/utils/constants'
|
import { CommonStatusEnum } from '@/utils/constants'
|
||||||
|
|
@ -127,12 +151,13 @@ const dialogVisible = ref(false) // 弹窗的是否展示
|
||||||
const dialogTitle = ref('') // 弹窗的标题
|
const dialogTitle = ref('') // 弹窗的标题
|
||||||
const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
|
const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
|
||||||
const formType = ref('') // 表单的类型:create - 新增;update - 修改
|
const formType = ref('') // 表单的类型:create - 新增;update - 修改
|
||||||
|
const activeTab = ref('bom') // 当前激活的 Tab
|
||||||
const formData = ref({
|
const formData = ref({
|
||||||
id: undefined,
|
id: undefined,
|
||||||
code: undefined,
|
code: undefined,
|
||||||
name: undefined,
|
name: undefined,
|
||||||
specification: undefined,
|
specification: undefined,
|
||||||
unitOfMeasure: undefined, // TODO @芋艿:等等关联的组件搞完,我们补充下!另外,这个字段貌似改成 unitMeasureId 更好?
|
unitOfMeasure: undefined,
|
||||||
itemTypeId: undefined,
|
itemTypeId: undefined,
|
||||||
status: CommonStatusEnum.ENABLE,
|
status: CommonStatusEnum.ENABLE,
|
||||||
safeStockFlag: false,
|
safeStockFlag: false,
|
||||||
|
|
@ -152,11 +177,18 @@ const formRules = reactive({
|
||||||
const formRef = ref() // 表单 Ref
|
const formRef = ref() // 表单 Ref
|
||||||
const itemTypeList = ref<MdItemTypeVO[]>([]) // 物料分类列表
|
const itemTypeList = ref<MdItemTypeVO[]>([]) // 物料分类列表
|
||||||
|
|
||||||
|
/** 生成物料编码 */
|
||||||
|
const generateCode = () => {
|
||||||
|
// TODO @芋艿:后续对接后端编码生成接口
|
||||||
|
formData.value.code = 'IF' + generateRandomStr(12)
|
||||||
|
}
|
||||||
|
|
||||||
/** 打开弹窗 */
|
/** 打开弹窗 */
|
||||||
const open = async (type: string, id?: number) => {
|
const open = async (type: string, id?: number) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
dialogTitle.value = t('action.' + type)
|
dialogTitle.value = t('action.' + type)
|
||||||
formType.value = type
|
formType.value = type
|
||||||
|
activeTab.value = 'bom'
|
||||||
resetForm()
|
resetForm()
|
||||||
// 修改时,设置数据
|
// 修改时,设置数据
|
||||||
if (id) {
|
if (id) {
|
||||||
|
|
|
||||||
|
|
@ -1,132 +1,144 @@
|
||||||
|
<!-- MES 物料产品列表 -->
|
||||||
<template>
|
<template>
|
||||||
<ContentWrap>
|
<el-row :gutter="20">
|
||||||
<!-- 搜索工作栏 -->
|
<!-- 左侧分类树 -->
|
||||||
<el-form
|
<el-col :span="4" :xs="24">
|
||||||
class="-mb-15px"
|
<ContentWrap class="h-1/1">
|
||||||
:model="queryParams"
|
<ItemTypeTree @node-click="handleTypeNodeClick" />
|
||||||
ref="queryFormRef"
|
</ContentWrap>
|
||||||
:inline="true"
|
</el-col>
|
||||||
label-width="68px"
|
<el-col :span="20" :xs="24">
|
||||||
>
|
<ContentWrap>
|
||||||
<el-form-item label="物料编码" prop="code">
|
<!-- 搜索工作栏 -->
|
||||||
<el-input
|
<el-form
|
||||||
v-model="queryParams.code"
|
class="-mb-15px"
|
||||||
placeholder="请输入物料编码"
|
:model="queryParams"
|
||||||
clearable
|
ref="queryFormRef"
|
||||||
@keyup.enter="handleQuery"
|
:inline="true"
|
||||||
class="!w-240px"
|
label-width="68px"
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="物料名称" prop="name">
|
|
||||||
<el-input
|
|
||||||
v-model="queryParams.name"
|
|
||||||
placeholder="请输入物料名称"
|
|
||||||
clearable
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
class="!w-240px"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<!-- TODO @AI:需要类似 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/system/user,放在左侧; -->
|
|
||||||
<!-- TODO @AI:检索的时候,选择父分类时,子分类也要检索出来; -->
|
|
||||||
<el-form-item label="物料分类" prop="itemTypeId">
|
|
||||||
<el-tree-select
|
|
||||||
v-model="queryParams.itemTypeId"
|
|
||||||
:data="itemTypeList"
|
|
||||||
:props="defaultProps"
|
|
||||||
check-strictly
|
|
||||||
default-expand-all
|
|
||||||
placeholder="请选择物料分类"
|
|
||||||
clearable
|
|
||||||
class="!w-240px"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="状态" prop="status">
|
|
||||||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px">
|
|
||||||
<el-option
|
|
||||||
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
|
|
||||||
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
|
|
||||||
<el-button
|
|
||||||
type="primary"
|
|
||||||
plain
|
|
||||||
@click="openForm('create')"
|
|
||||||
v-hasPermi="['mes:md-item:create']"
|
|
||||||
>
|
>
|
||||||
<Icon icon="ep:plus" class="mr-5px" /> 新增
|
<el-form-item label="物料编码" prop="code">
|
||||||
</el-button>
|
<el-input
|
||||||
<el-button
|
v-model="queryParams.code"
|
||||||
type="success"
|
placeholder="请输入物料编码"
|
||||||
plain
|
clearable
|
||||||
@click="handleExport"
|
@keyup.enter="handleQuery"
|
||||||
:loading="exportLoading"
|
class="!w-240px"
|
||||||
v-hasPermi="['mes:md-item:export']"
|
/>
|
||||||
>
|
</el-form-item>
|
||||||
<Icon icon="ep:download" class="mr-5px" /> 导出
|
<el-form-item label="物料名称" prop="name">
|
||||||
</el-button>
|
<el-input
|
||||||
</el-form-item>
|
v-model="queryParams.name"
|
||||||
</el-form>
|
placeholder="请输入物料名称"
|
||||||
</ContentWrap>
|
clearable
|
||||||
|
@keyup.enter="handleQuery"
|
||||||
|
class="!w-240px"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select
|
||||||
|
v-model="queryParams.status"
|
||||||
|
placeholder="请选择状态"
|
||||||
|
clearable
|
||||||
|
class="!w-240px"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button @click="handleQuery"
|
||||||
|
><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
|
||||||
|
>
|
||||||
|
<el-button @click="resetQuery"
|
||||||
|
><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button
|
||||||
|
>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
plain
|
||||||
|
@click="openForm('create')"
|
||||||
|
v-hasPermi="['mes:md-item:create']"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:plus" class="mr-5px" /> 新增
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
type="success"
|
||||||
|
plain
|
||||||
|
@click="handleExport"
|
||||||
|
:loading="exportLoading"
|
||||||
|
v-hasPermi="['mes:md-item:export']"
|
||||||
|
>
|
||||||
|
<Icon icon="ep:download" class="mr-5px" /> 导出
|
||||||
|
</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</ContentWrap>
|
||||||
|
|
||||||
<!-- 列表 -->
|
<!-- 列表 -->
|
||||||
<ContentWrap>
|
<ContentWrap>
|
||||||
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
|
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
|
||||||
<el-table-column label="物料编码" align="center" prop="code" />
|
<el-table-column label="物料编码" align="center" prop="code" />
|
||||||
<el-table-column label="物料名称" align="center" prop="name" />
|
<el-table-column label="物料名称" align="center" prop="name" />
|
||||||
<el-table-column label="规格型号" align="center" prop="specification" />
|
<el-table-column label="规格型号" align="center" prop="specification" />
|
||||||
<!-- TODO @AI:放到 constants 里 -->
|
<el-table-column label="单位" align="center" prop="unitOfMeasure" />
|
||||||
<el-table-column label="单位" align="center" prop="unitOfMeasure" />
|
<el-table-column label="物料分类" align="center" prop="itemTypeName" />
|
||||||
<el-table-column label="物料分类" align="center" prop="itemTypeName" />
|
<el-table-column label="物料/产品" align="center" prop="itemOrProduct">
|
||||||
<el-table-column label="物料/产品" align="center" prop="itemOrProduct" />
|
<template #default="scope">
|
||||||
<el-table-column label="状态" align="center" prop="status">
|
{{ getItemOrProductLabel(scope.row.itemOrProduct) }}
|
||||||
<template #default="scope">
|
</template>
|
||||||
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
|
</el-table-column>
|
||||||
</template>
|
<el-table-column label="安全库存" align="center" prop="safeStockFlag">
|
||||||
</el-table-column>
|
<template #default="scope">
|
||||||
<!-- TODO @AI:设置安全库存 -->
|
<dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.safeStockFlag" />
|
||||||
<el-table-column
|
</template>
|
||||||
label="创建时间"
|
</el-table-column>
|
||||||
align="center"
|
<el-table-column label="状态" align="center" prop="status">
|
||||||
prop="createTime"
|
<template #default="scope">
|
||||||
:formatter="dateFormatter"
|
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
|
||||||
width="180px"
|
</template>
|
||||||
/>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" width="110">
|
<el-table-column
|
||||||
<!-- TODO @芋艿:【标签打印】 -->
|
label="创建时间"
|
||||||
<template #default="scope">
|
align="center"
|
||||||
<el-button
|
prop="createTime"
|
||||||
link
|
:formatter="dateFormatter"
|
||||||
type="primary"
|
width="180px"
|
||||||
@click="openForm('update', scope.row.id)"
|
/>
|
||||||
v-hasPermi="['mes:md-item:update']"
|
<el-table-column label="操作" align="center" width="110">
|
||||||
>
|
<template #default="scope">
|
||||||
编辑
|
<el-button
|
||||||
</el-button>
|
link
|
||||||
<el-button
|
type="primary"
|
||||||
link
|
@click="openForm('update', scope.row.id)"
|
||||||
type="danger"
|
v-hasPermi="['mes:md-item:update']"
|
||||||
@click="handleDelete(scope.row.id)"
|
>
|
||||||
v-hasPermi="['mes:md-item:delete']"
|
编辑
|
||||||
>
|
</el-button>
|
||||||
删除
|
<el-button
|
||||||
</el-button>
|
link
|
||||||
</template>
|
type="danger"
|
||||||
</el-table-column>
|
@click="handleDelete(scope.row.id)"
|
||||||
</el-table>
|
v-hasPermi="['mes:md-item:delete']"
|
||||||
<!-- 分页 -->
|
>
|
||||||
<Pagination
|
删除
|
||||||
:total="total"
|
</el-button>
|
||||||
v-model:page="queryParams.pageNo"
|
</template>
|
||||||
v-model:limit="queryParams.pageSize"
|
</el-table-column>
|
||||||
@pagination="getList"
|
</el-table>
|
||||||
/>
|
<!-- 分页 -->
|
||||||
</ContentWrap>
|
<Pagination
|
||||||
|
:total="total"
|
||||||
|
v-model:page="queryParams.pageNo"
|
||||||
|
v-model:limit="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
</ContentWrap>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
<!-- 表单弹窗:添加/修改 -->
|
<!-- 表单弹窗:添加/修改 -->
|
||||||
<MdItemForm ref="formRef" @success="getList" />
|
<MdItemForm ref="formRef" @success="getList" />
|
||||||
|
|
@ -135,14 +147,12 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||||
import { dateFormatter } from '@/utils/formatTime'
|
import { dateFormatter } from '@/utils/formatTime'
|
||||||
import { handleTree } from '@/utils/tree'
|
|
||||||
import { defaultProps } from '@/utils/tree'
|
|
||||||
import download from '@/utils/download'
|
import download from '@/utils/download'
|
||||||
import { MdItemApi, MdItemVO } from '@/api/mes/md/item'
|
import { MdItemApi, MdItemVO } from '@/api/mes/md/item'
|
||||||
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
|
||||||
import MdItemForm from './MdItemForm.vue'
|
import MdItemForm from './MdItemForm.vue'
|
||||||
|
import ItemTypeTree from './ItemTypeTree.vue'
|
||||||
|
import { getItemOrProductLabel } from '@/views/mes/utils/constants'
|
||||||
|
|
||||||
/** MES 物料产品 列表 */
|
|
||||||
defineOptions({ name: 'MesMdItem' })
|
defineOptions({ name: 'MesMdItem' })
|
||||||
|
|
||||||
const message = useMessage() // 消息弹窗
|
const message = useMessage() // 消息弹窗
|
||||||
|
|
@ -161,7 +171,6 @@ const queryParams = reactive({
|
||||||
})
|
})
|
||||||
const queryFormRef = ref() // 搜索的表单
|
const queryFormRef = ref() // 搜索的表单
|
||||||
const exportLoading = ref(false) // 导出的加载中
|
const exportLoading = ref(false) // 导出的加载中
|
||||||
const itemTypeList = ref<MdItemTypeVO[]>([]) // 物料分类列表
|
|
||||||
|
|
||||||
/** 查询列表 */
|
/** 查询列表 */
|
||||||
const getList = async () => {
|
const getList = async () => {
|
||||||
|
|
@ -184,6 +193,13 @@ const handleQuery = () => {
|
||||||
/** 重置按钮操作 */
|
/** 重置按钮操作 */
|
||||||
const resetQuery = () => {
|
const resetQuery = () => {
|
||||||
queryFormRef.value.resetFields()
|
queryFormRef.value.resetFields()
|
||||||
|
queryParams.itemTypeId = undefined
|
||||||
|
handleQuery()
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 处理分类树节点点击 */
|
||||||
|
const handleTypeNodeClick = (row: any) => {
|
||||||
|
queryParams.itemTypeId = row?.id
|
||||||
handleQuery()
|
handleQuery()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -224,8 +240,5 @@ const handleExport = async () => {
|
||||||
/** 初始化 **/
|
/** 初始化 **/
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await getList()
|
await getList()
|
||||||
// 物料分类
|
|
||||||
const categoryData = await MdItemTypeApi.getItemTypeSimpleList()
|
|
||||||
itemTypeList.value = handleTree(categoryData)
|
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -26,10 +26,9 @@
|
||||||
<el-input v-model="formData.name" placeholder="请输入分类名称" />
|
<el-input v-model="formData.name" placeholder="请输入分类名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="物料/产品标识" prop="itemOrProduct">
|
<el-form-item label="物料/产品标识" prop="itemOrProduct">
|
||||||
<!-- TODO @AI:搞个 mes/constants,类似 ts;然后这个字段要翻译掉;另外,MdItemTypeForm 里的相关,也要通过这个方式复用; -->
|
|
||||||
<el-radio-group v-model="formData.itemOrProduct">
|
<el-radio-group v-model="formData.itemOrProduct">
|
||||||
<el-radio value="ITEM">物料</el-radio>
|
<el-radio :value="MesItemOrProductEnum.ITEM.value">物料</el-radio>
|
||||||
<el-radio value="PRODUCT">产品</el-radio>
|
<el-radio :value="MesItemOrProductEnum.PRODUCT.value">产品</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="显示排序" prop="sort">
|
<el-form-item label="显示排序" prop="sort">
|
||||||
|
|
@ -61,6 +60,7 @@ import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||||
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
||||||
import { defaultProps, handleTree } from '@/utils/tree'
|
import { defaultProps, handleTree } from '@/utils/tree'
|
||||||
import { CommonStatusEnum } from '@/utils/constants'
|
import { CommonStatusEnum } from '@/utils/constants'
|
||||||
|
import { MesItemOrProductEnum } from '@/views/mes/utils/constants'
|
||||||
|
|
||||||
defineOptions({ name: 'MdItemTypeForm' })
|
defineOptions({ name: 'MdItemTypeForm' })
|
||||||
|
|
||||||
|
|
@ -72,14 +72,14 @@ const dialogTitle = ref('') // 弹窗的标题
|
||||||
const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
|
const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
|
||||||
const formType = ref('') // 表单的类型:create - 新增;update - 修改
|
const formType = ref('') // 表单的类型:create - 新增;update - 修改
|
||||||
const formData = ref({
|
const formData = ref({
|
||||||
id: undefined,
|
id: undefined as unknown as number,
|
||||||
parentId: undefined,
|
parentId: undefined as unknown as number,
|
||||||
code: undefined,
|
code: undefined as unknown as string,
|
||||||
name: undefined,
|
name: undefined as unknown as string,
|
||||||
itemOrProduct: 'ITEM',
|
itemOrProduct: MesItemOrProductEnum.ITEM.value as string,
|
||||||
sort: 0,
|
sort: 0,
|
||||||
status: CommonStatusEnum.ENABLE,
|
status: CommonStatusEnum.ENABLE,
|
||||||
remark: undefined
|
remark: undefined as unknown as string
|
||||||
})
|
})
|
||||||
const formRules = reactive({
|
const formRules = reactive({
|
||||||
parentId: [{ required: true, message: '上级分类不能为空', trigger: 'blur' }],
|
parentId: [{ required: true, message: '上级分类不能为空', trigger: 'blur' }],
|
||||||
|
|
@ -109,7 +109,6 @@ const open = async (type: string, id?: number, parentId?: number) => {
|
||||||
}
|
}
|
||||||
// 新增子分类时,设置父分类
|
// 新增子分类时,设置父分类
|
||||||
if (parentId) {
|
if (parentId) {
|
||||||
// TODO @AI:TS2322: Type number is not assignable to type undefined 报错;
|
|
||||||
formData.value.parentId = parentId
|
formData.value.parentId = parentId
|
||||||
}
|
}
|
||||||
await getItemTypeTree()
|
await getItemTypeTree()
|
||||||
|
|
@ -147,8 +146,7 @@ const resetForm = () => {
|
||||||
parentId: undefined,
|
parentId: undefined,
|
||||||
code: undefined,
|
code: undefined,
|
||||||
name: undefined,
|
name: undefined,
|
||||||
// TODO @AI:使用 constants 里的枚举。
|
itemOrProduct: MesItemOrProductEnum.ITEM.value,
|
||||||
itemOrProduct: 'ITEM',
|
|
||||||
sort: 0,
|
sort: 0,
|
||||||
status: CommonStatusEnum.ENABLE,
|
status: CommonStatusEnum.ENABLE,
|
||||||
remark: undefined
|
remark: undefined
|
||||||
|
|
|
||||||
|
|
@ -39,16 +39,6 @@
|
||||||
>
|
>
|
||||||
<Icon icon="ep:plus" class="mr-5px" /> 新增
|
<Icon icon="ep:plus" class="mr-5px" /> 新增
|
||||||
</el-button>
|
</el-button>
|
||||||
<!-- TODO @AI:不需要导出 -->
|
|
||||||
<el-button
|
|
||||||
type="success"
|
|
||||||
plain
|
|
||||||
@click="handleExport"
|
|
||||||
:loading="exportLoading"
|
|
||||||
v-hasPermi="['mes:md-item-type:export']"
|
|
||||||
>
|
|
||||||
<Icon icon="ep:download" class="mr-5px" /> 导出
|
|
||||||
</el-button>
|
|
||||||
<el-button type="danger" plain @click="toggleExpandAll">
|
<el-button type="danger" plain @click="toggleExpandAll">
|
||||||
<Icon icon="ep:sort" class="mr-5px" /> 展开/折叠
|
<Icon icon="ep:sort" class="mr-5px" /> 展开/折叠
|
||||||
</el-button>
|
</el-button>
|
||||||
|
|
@ -69,8 +59,11 @@
|
||||||
>
|
>
|
||||||
<el-table-column label="分类名称" align="left" prop="name" />
|
<el-table-column label="分类名称" align="left" prop="name" />
|
||||||
<el-table-column label="分类编码" align="center" prop="code" />
|
<el-table-column label="分类编码" align="center" prop="code" />
|
||||||
<!-- TODO @AI:搞个 mes/constants,类似 ts;然后这个字段要翻译掉;另外,MdItemTypeForm 里的相关,也要通过这个方式复用; -->
|
<el-table-column label="物料/产品" align="center" prop="itemOrProduct">
|
||||||
<el-table-column label="物料/产品" align="center" prop="itemOrProduct" />
|
<template #default="scope">
|
||||||
|
{{ getItemOrProductLabel(scope.row.itemOrProduct) }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column label="排序" align="center" prop="sort" />
|
<el-table-column label="排序" align="center" prop="sort" />
|
||||||
<el-table-column label="状态" align="center" prop="status">
|
<el-table-column label="状态" align="center" prop="status">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
|
|
@ -123,8 +116,8 @@
|
||||||
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||||
import { dateFormatter } from '@/utils/formatTime'
|
import { dateFormatter } from '@/utils/formatTime'
|
||||||
import { handleTree } from '@/utils/tree'
|
import { handleTree } from '@/utils/tree'
|
||||||
import download from '@/utils/download'
|
|
||||||
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
import { MdItemTypeApi, MdItemTypeVO } from '@/api/mes/md/item/type'
|
||||||
|
import { getItemOrProductLabel } from '@/views/mes/utils/constants'
|
||||||
import MdItemTypeForm from './MdItemTypeForm.vue'
|
import MdItemTypeForm from './MdItemTypeForm.vue'
|
||||||
|
|
||||||
defineOptions({ name: 'MesMdItemType' })
|
defineOptions({ name: 'MesMdItemType' })
|
||||||
|
|
@ -139,7 +132,6 @@ const queryParams = reactive({
|
||||||
status: undefined
|
status: undefined
|
||||||
})
|
})
|
||||||
const queryFormRef = ref() // 搜索的表单
|
const queryFormRef = ref() // 搜索的表单
|
||||||
const exportLoading = ref(false) // 导出的加载中
|
|
||||||
|
|
||||||
/** 查询列表 */
|
/** 查询列表 */
|
||||||
const getList = async () => {
|
const getList = async () => {
|
||||||
|
|
@ -182,21 +174,6 @@ const handleDelete = async (id: number) => {
|
||||||
} catch {}
|
} catch {}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 导出按钮操作 */
|
|
||||||
const handleExport = async () => {
|
|
||||||
try {
|
|
||||||
// 导出的二次确认
|
|
||||||
await message.exportConfirm()
|
|
||||||
// 发起导出
|
|
||||||
exportLoading.value = true
|
|
||||||
const data = await MdItemTypeApi.exportItemType(queryParams)
|
|
||||||
download.excel(data, '物料产品分类.xls')
|
|
||||||
} catch {
|
|
||||||
} finally {
|
|
||||||
exportLoading.value = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 展开/折叠操作 */
|
/** 展开/折叠操作 */
|
||||||
const isExpandAll = ref(true) // 是否展开,默认全部展开
|
const isExpandAll = ref(true) // 是否展开,默认全部展开
|
||||||
const refreshTable = ref(true) // 重新渲染表格状态
|
const refreshTable = ref(true) // 重新渲染表格状态
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
/** MES 物料/产品标识枚举 */
|
||||||
|
export const MesItemOrProductEnum = {
|
||||||
|
ITEM: {
|
||||||
|
label: '物料',
|
||||||
|
value: 'ITEM'
|
||||||
|
},
|
||||||
|
PRODUCT: {
|
||||||
|
label: '产品',
|
||||||
|
value: 'PRODUCT'
|
||||||
|
}
|
||||||
|
} as const
|
||||||
|
|
||||||
|
/** 获取物料/产品标识的标签 */
|
||||||
|
export const getItemOrProductLabel = (value: string): string => {
|
||||||
|
for (const item of Object.values(MesItemOrProductEnum)) {
|
||||||
|
if (item.value === value) {
|
||||||
|
return item.label
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return value
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue