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.

1200 lines
46 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='processName'>
<el-input v-model='queryParams.processName' placeholder='请输入工序名称' clearable
@keyup.enter='handleQuery' />
</el-form-item>
<el-form-item label='工序类别' prop='processType'>
<el-select v-model='queryParams.processType' placeholder='请选择工序类别' clearable>
<el-option v-for='dict in process_type' :key='dict.value' :label='dict.label' :value='dict.value' />
</el-select>
</el-form-item>
<!-- <el-form-item label="车间名称" prop="workshopId">-->
<!-- <el-input v-model="queryParams.workshopId" placeholder="请输入车间名称" clearable @keyup.enter="handleQuery" />-->
<!-- </el-form-item>-->
<el-form-item label='委外标识' prop='outsourcingFlag'>
<el-select v-model='queryParams.outsourcingFlag' placeholder='请选择委外标识' clearable>
<el-option v-for='dict in mes_outsourcing_flag' :key='dict.value' :label='dict.label'
:value='dict.value' />
</el-select>
</el-form-item>
<el-form-item label='领料方式' prop='materialMethod'>
<el-select v-model='queryParams.materialMethod' placeholder='请选择领料方式' clearable>
<el-option v-for='dict in mes_material_method' :key='dict.value' :label='dict.label'
:value='dict.value' />
</el-select>
</el-form-item>
<el-form-item label='质检方式' prop='inspectionMethod'>
<el-select v-model='queryParams.inspectionMethod' placeholder='请选择质检方式' clearable>
<el-option v-for='dict in mes_inspection_method' :key='dict.value' :label='dict.label'
:value='dict.value' />
</el-select>
</el-form-item>
<el-form-item label='工序生产类型' prop='processProductionType' label-width='100'>
<el-select v-model='queryParams.processProductionType' placeholder='请选择工序生产类型' clearable>
<el-option v-for='dict in mes_process_production_type' :key='dict.value' :label='dict.label'
:value='dict.value' />
</el-select>
</el-form-item>
<el-form-item>
<el-button type='primary' icon='Search' @click='handleQuery'>搜索</el-button>
<el-button icon='Refresh' @click='resetQuery'>重置</el-button>
</el-form-item>
</el-form>
</el-card>
</div>
</transition>
<el-card shadow='never'>
<template #header>
<el-row :gutter='10' class='mb8'>
<el-col :span='1.5'>
<el-button type='primary' plain icon='Plus' @click='handleAdd' v-hasPermi="['mes:baseProcessInfo:add']">
新增
</el-button>
</el-col>
<el-col :span='1.5'>
<el-button type='success' plain icon='Edit' :disabled='single' @click='handleUpdate()'
v-hasPermi="['mes:baseProcessInfo:edit']">修改
</el-button>
</el-col>
<el-col :span='1.5'>
<el-button type='danger' plain icon='Delete' :disabled='multiple' @click='handleDelete()'
v-hasPermi="['mes:baseProcessInfo:remove']">删除
</el-button>
</el-col>
<el-col :span='1.5'>
<el-button type='warning' plain icon='Download' @click='handleExport'
v-hasPermi="['mes:baseProcessInfo: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='baseProcessInfoList' @selection-change='handleSelectionChange'>
<el-table-column type='selection' width='55' align='center' />
<el-table-column label='主键标识' align='center' prop='processId' v-if='columns[0].visible' />
<el-table-column label='租户编号' align='center' prop='tenantId' v-if='columns[1].visible' />
<el-table-column label='工序编号' align='center' prop='processCode' v-if='columns[2].visible' />
<el-table-column label='工序名称' align='center' prop='processName' v-if='columns[3].visible' />
<el-table-column label='工序类别' align='center' prop='processType' v-if='columns[4].visible'>
<template #default='scope'>
<dict-tag :options='process_type' :value='scope.row.processType' />
</template>
</el-table-column>
<el-table-column label='工序顺序' align='center' prop='processQueue' v-if='columns[5].visible' />
<el-table-column label='单位生产时间' align='center' prop='productionTime' v-if='columns[6].visible' width='110'>
<template v-slot='scope'>
<span>{{ formatDayHourMinutes(scope.row.productionTime) }}</span>
</template>
</el-table-column>
<el-table-column label='车间名称' align='center' prop='workshopName' v-if='columns[7].visible' width='120'/>
<el-table-column label='委外标识' align='center' prop='outsourcingFlag' v-if='columns[8].visible'>
<template #default='scope'>
<dict-tag :options='mes_outsourcing_flag' :value='scope.row.outsourcingFlag' />
</template>
</el-table-column>
<el-table-column label='工序生产类型' align='center' prop='processProductionType' v-if='columns[9].visible' width='110'>
<template #default='scope'>
<dict-tag :options='mes_process_production_type' :value='scope.row.processProductionType' />
</template>
</el-table-column>
<el-table-column label='默认产出率' align='center' prop='defaultYieldRate' v-if='columns[10].visible' width='100'/>
<el-table-column label='损耗率' align='center' prop='lossRate' v-if='columns[11].visible' />
<el-table-column label='返修率' align='center' prop='reworkRate' v-if='columns[12].visible' />
<el-table-column label='领料方式' align='center' prop='materialMethod' v-if='columns[13].visible'>
<template #default='scope'>
<dict-tag :options='mes_material_method' :value='scope.row.materialMethod' />
</template>
</el-table-column>
<el-table-column label='委外提前期' align='center' prop='leadTime' v-if='columns[14].visible' width='100'/>
<el-table-column label='准备时间' align='center' prop='setupTime' v-if='columns[15].visible' />
<el-table-column label='加工时间' align='center' prop='processingTime' v-if='columns[16].visible' />
<el-table-column label='拆卸时间' align='center' prop='disassemblyTime' v-if='columns[17].visible' />
<el-table-column label='理论生产节拍' align='center' prop='theoreticalCycleTime' v-if='columns[18].visible' width='110'/>
<el-table-column label='质检方式' align='center' prop='inspectionMethod' v-if='columns[19].visible'>
<template #default='scope'>
<dict-tag :options='mes_inspection_method' :value='scope.row.inspectionMethod' />
</template>
</el-table-column>
<el-table-column label='激活标识' align='center' prop='activeFlag' v-if='columns[20].visible'>
<template #default='scope'>
<dict-tag :options='active_flag' :value='scope.row.activeFlag' />
</template>
</el-table-column>
<el-table-column label='备注' align='center' prop='remark' v-if='columns[21].visible' />
<el-table-column label='创建部门' align='center' prop='createDept' v-if='columns[22].visible' />
<el-table-column label='创建人' align='center' prop='createBy' v-if='columns[23].visible' />
<el-table-column label='创建时间' align='center' prop='createTime' width='180' v-if='columns[24].visible'>
<template #default='scope'>
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label='更新人' align='center' prop='updateBy' v-if='columns[25].visible' />
<el-table-column label='更新时间' align='center' prop='updateTime' width='180' v-if='columns[26].visible'>
<template #default='scope'>
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label='操作' align='center' class-name='small-padding fixed-width' fixed='right' width='150'>
<template #default='scope'>
<el-row :gutter='10' class='mb8'>
<el-col :span='12'>
<el-button
size='small'
type='text'
icon='circle-plus'
@click='handleProdLineUpdate(scope.row)'
>关联产线
</el-button>
</el-col>
<el-col :span='12'>
<el-button
size='small'
type='text'
icon='check'
v-if="scope.row.processType !== '3'"
@click='handleUserUpdate(scope.row)'
>关联人员
</el-button>
</el-col>
</el-row>
</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='900px' append-to-body>
<el-form ref='baseProcessInfoFormRef' :model='form' :rules='rules' label-width='130px' class="two-column-form">
<div class="form-column">
<el-form-item label='工序编号' prop='processCode'>
<el-input v-model='form.processCode' placeholder='请输入工序编号' />
</el-form-item>
<el-form-item label='工序名称' prop='processName'>
<el-input v-model='form.processName' placeholder='请输入工序名称' />
</el-form-item>
<el-form-item label='工序类别' prop='processType'>
<el-select v-model='form.processType' placeholder='请选择工序类别'>
<el-option
v-for='dict in process_type'
:key='dict.value'
:label='dict.label'
:value='dict.value'
></el-option>
</el-select>
</el-form-item>
<el-form-item label='工序顺序' prop='processQueue'>
<el-input v-model='form.processQueue' placeholder='请输入工序顺序' />
</el-form-item>
<el-form-item label='单位生产时间' prop='productionTime'>
<el-input-number v-model='form.productionTimeDays' placeholder='请输入天数' :min='0' :max='10000'
:controls='false' :style="{ width: '50px' }" />
<span>&nbsp;天&nbsp;</span>
<el-input-number v-model='form.productionTimeHours' placeholder='请输入小时' :min='0' :max='23'
:controls='false' :style="{ width: '50px' }" />
<span>&nbsp;小时&nbsp;</span>
<el-input-number v-model='form.productionTimeMinutes' placeholder='请输入分钟' :min='0' :max='59'
:controls='false' :style="{ width: '50px' }" />
<span>&nbsp;分钟&nbsp;</span>
</el-form-item>
<el-form-item label='车间名称' prop='workshopId'>
<el-select v-model="form.workshopId" placeholder="请选择车间名称">
<el-option
v-for="item in workshopInfoList"
:key="item.workshopId"
:label="item.workshopName"
:value="item.workshopId"
/>
</el-select>
</el-form-item>
<el-form-item label='委外标识' prop='outsourcingFlag'>
<el-radio-group v-model='form.outsourcingFlag'>
<el-radio
v-for='dict in mes_outsourcing_flag'
:key='dict.value'
:value='dict.value'
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label='工序生产类型' prop='processProductionType'>
<el-radio-group v-model='form.processProductionType'>
<el-radio
v-for='dict in mes_process_production_type'
:key='dict.value'
:value='dict.value'
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label='领料方式' prop='materialMethod'>
<el-radio-group v-model='form.materialMethod'>
<el-radio
v-for='dict in mes_material_method'
:key='dict.value'
:value='dict.value'
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</div>
<div class="form-column">
<el-form-item label='默认产出率(%' prop='defaultYieldRate'>
<el-input-number v-model='form.defaultYieldRate' placeholder='请输入默认产出率' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='损耗率(%' prop='lossRate'>
<el-input-number v-model='form.lossRate' placeholder='请输入损耗率' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='返修率(%' prop='reworkRate'>
<el-input-number v-model='form.reworkRate' placeholder='请输入返修率' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='委外提前期(秒)' prop='leadTime'>
<el-input-number v-model='form.leadTime' placeholder='请输入委外提前期' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='准备时间(秒)' prop='setupTime'>
<el-input-number v-model='form.setupTime' placeholder='请输入准备时间' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='加工时间(秒)' prop='processingTime'>
<el-input-number v-model='form.processingTime' placeholder='请输入加工时间' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='拆卸时间(秒)' prop='disassemblyTime'>
<el-input-number v-model='form.disassemblyTime' placeholder='请输入拆卸时间' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='理论生产节拍(秒/件)' prop='theoreticalCycleTime'>
<el-input-number v-model='form.theoreticalCycleTime' placeholder='请输入理论生产节拍' :style="{ width: '180px' }" />
</el-form-item>
<el-form-item label='质检方式' prop='inspectionMethod'>
<el-radio-group v-model='form.inspectionMethod'>
<el-radio
v-for='dict in mes_inspection_method'
:key='dict.value'
:value='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 label='备注' prop='remark'>
<el-input v-model='form.remark' placeholder='请输入备注' />
</el-form-item>
</div>
</el-form>
<!-- 工序资源表格 -->
<div class="mt-4">
<div class="mb-2">
<el-button type="primary" icon="Plus" @click="handleAddResource">新增工序资源</el-button>
</div>
<el-table :data="processResourceList" v-loading="resourceLoading">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="指派类型" align="center" prop="assignmentType">
<template #default="scope">
<dict-tag :options="mes_assignment_type" :value="scope.row.assignmentType"/>
</template>
</el-table-column>
<el-table-column label="载具工装类型" align="center" prop="toolingTypeCode">
<template #default="scope">
<dict-tag :options="tooling_type_code" :value="scope.row.toolingTypeCode"/>
</template>
</el-table-column>
<el-table-column label="必选标识" align="center" prop="requiredFlag">
<template #default="scope">
<dict-tag :options="mes_required_flag" :value="scope.row.requiredFlag"/>
</template>
</el-table-column>
<el-table-column label="选择模式" align="center" prop="selectionMode">
<template #default="scope">
<dict-tag :options="mes_selection_mode" :value="scope.row.selectionMode"/>
</template>
</el-table-column>
<el-table-column label="是否需要校验" align="center" prop="requiresValidation">
<template #default="scope">
<dict-tag :options="mes_requires_validation" :value="scope.row.requiresValidation"/>
</template>
</el-table-column>
<el-table-column label="是否需要准备任务" align="center" prop="requiresPreparation">
<template #default="scope">
<dict-tag :options="mes_requires_preparation" :value="scope.row.requiresPreparation"/>
</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="handleUpdateResource(scope.row)"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDeleteResource(scope.row)"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<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>
<!-- 关联产线对话框 -->
<el-dialog :title='dialog.title' v-model='prodLineOpen' width='700px' append-to-body>
<el-form ref='baseProcessInfoFormRef' :model='form' label-width='100px'>
<el-row :gutter='10' class='mb8'>
<el-col :span='12'>
<el-form-item label='工序编号' prop='processCode'>
<el-input v-model='form.processCode' placeholder='请输入工序编号' disabled />
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label='工序名称' prop='processName'>
<el-input v-model='form.processName' placeholder='请输入工序名称' disabled />
</el-form-item>
</el-col>
</el-row>
<el-divider content-position='center'>工序关联产线信息</el-divider>
<el-row :gutter='10' class='mb8'>
<el-col :span='1.5'>
<el-button type='primary' plain icon='Plus' @click='handleAddProdLine'>添加产线</el-button>
</el-col>
<el-col :span='1.5'>
<el-button type='danger' icon='Delete' @click='handleDeleteProdLine'>删除</el-button>
</el-col>
</el-row>
<el-table :data='prodBaseProcessProdlineBoList' :row-class-name='rowProdBaseProcessProdlineIndex'
@selection-change='handleProdLineSelectionChange'>
<el-table-column type='selection' width='50' align='center' />
<el-table-column label='序号' align='center' prop='index' />
<el-table-column label='关联产线' align='center' prop='prodLineId'>
<template #default='scope'>
<el-select v-model='scope.row.prodLineId' placeholder='请选择关联产线' clearable>
<el-option
v-for='item in prodLineList'
:key='item.prodLineId'
:label='item.prodLineName'
:value='item.prodLineId'
:disabled='prodBaseProcessProdlineBoList.some(i =>i.prodLineId === item.prodLineId)'
></el-option>
</el-select>
</template>
</el-table-column>
</el-table>
</el-form>
<template #footer>
<div class='dialog-footer'>
<el-button type='primary' @click='submitProdLineForm'>确 定</el-button>
<el-button @click='cancelProdLine'>取 消</el-button>
</div>
</template>
</el-dialog>
<!-- 关联人员对话框 -->
<el-dialog :title='dialog.title' v-model='userOpen' width='700px' append-to-body>
<el-form ref='baseProcessInfoFormRef' :model='form' label-width='100px'>
<el-row :gutter='10' class='mb8'>
<el-col :span='12'>
<el-form-item label='工序编号' prop='processCode'>
<el-input v-model='form.processCode' placeholder='请输入工序编号' disabled />
</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label='工序名称' prop='processName'>
<el-input v-model='form.processName' placeholder='请输入工序名称' disabled />
</el-form-item>
</el-col>
</el-row>
<el-divider content-position='center'>工序关联人员信息</el-divider>
<el-row :gutter='10' class='mb8'>
<el-col :span='1.5'>
<el-button type='primary' plain icon='Plus' @click='handleAddUser'>添加人员</el-button>
</el-col>
<el-col :span='1.5'>
<el-button type='danger' icon='Delete' @click='handleDeleteUser'>删除</el-button>
</el-col>
</el-row>
<el-table :data='prodBaseProcessUserBoList' :row-class-name='rowProdBaseProcessUserIndex'
@selection-change='handleUserSelectionChange'>
<el-table-column type='selection' width='50' align='center' />
<el-table-column label='序号' align='center' prop='index' />
<el-table-column label='name' align='center' prop='userName' v-if='false' />
<el-table-column label='关联人员' align='center' prop='userId'>
<template #default='scope'>
<el-select v-model='scope.row.userId' filterable placeholder='请选择关联人员' clearable
@change='handleSelectUser(scope.row)'>
<el-option
v-for='item in userList'
:key='item.userId'
:label='item.userName'
:value='item.userId'
:disabled='prodBaseProcessUserBoList.some(i =>i.userId === item.userId)'
></el-option>
</el-select>
</template>
</el-table-column>
</el-table>
</el-form>
<template #footer>
<div class='dialog-footer'>
<el-button type='primary' @click='submitUserForm'>确 定</el-button>
<el-button @click='cancelUser'>取 消</el-button>
</div>
</template>
</el-dialog>
<!-- 工序资源对话框 -->
<el-dialog :title="resourceDialog.title" v-model="resourceDialog.visible" width="600px" append-to-body>
<el-form ref="resourceFormRef" :model="resourceForm" :rules="resourceRules" label-width="140px">
<el-form-item label="指派类型" prop="assignmentType">
<el-radio-group v-model="resourceForm.assignmentType">
<el-radio
v-for="dict in mes_assignment_type"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="载具工装类型" prop="toolingTypeCode">
<el-select v-model="resourceForm.toolingTypeCode" placeholder="请选择载具工装类型">
<el-option
v-for="dict in tooling_type_code"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="必选标识" prop="requiredFlag">
<el-radio-group v-model="resourceForm.requiredFlag">
<el-radio
v-for="dict in mes_required_flag"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="选择模式" prop="selectionMode">
<el-radio-group v-model="resourceForm.selectionMode">
<el-radio
v-for="dict in mes_selection_mode"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否需要校验" prop="requiresValidation">
<el-radio-group v-model="resourceForm.requiresValidation">
<el-radio
v-for="dict in mes_requires_validation"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否需要准备任务" prop="requiresPreparation">
<el-radio-group v-model="resourceForm.requiresPreparation">
<el-radio
v-for="dict in mes_requires_preparation"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="resourceForm.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button :loading="resourceButtonLoading" type="primary" @click="submitResourceForm">确 定</el-button>
<el-button @click="cancelResource"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name='BaseProcessInfo' lang='ts'>
import {
listBaseProcessInfo,
getBaseProcessInfo,
delBaseProcessInfo,
addBaseProcessInfo,
updateBaseProcessInfo,
updateBaseProcessInfoUser
} from '@/api/mes/baseProcessInfo';
import { getProdLineList } from '@/api/mes/baseProdLineInfo';
import { getUserList } from '@/api/system/user';
import { getWorkshopList } from '@/api/mes/baseWorkshopInfo';
import {
BaseProcessInfoVO,
BaseProcessInfoQuery,
BaseProcessInfoForm
} from '@/api/mes/baseProcessInfo/types';
import {
BaseProcessResourceVO,
BaseProcessResourceQuery,
BaseProcessResourceForm
} from '@/api/mes/baseProcessResource/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const {
active_flag,
process_type,
mes_outsourcing_flag,
mes_process_production_type,
mes_material_method,
mes_inspection_method,
mes_assignment_type,
mes_requires_validation,
mes_selection_mode,
tooling_type_code,
mes_required_flag,
mes_requires_preparation
} = toRefs<any>(proxy?.useDict(
'active_flag',
'process_type',
'mes_outsourcing_flag',
'mes_process_production_type',
'mes_material_method',
'mes_inspection_method',
'mes_assignment_type',
'mes_requires_validation',
'mes_selection_mode',
'tooling_type_code',
'mes_required_flag',
'mes_requires_preparation'
));
const baseProcessInfoList = ref<BaseProcessInfoVO[]>([]);
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 prodLineOpen = ref(false);//关联产线对话框
const userOpen = ref(false);//关联人员对话框
const prodLineList = ref([]);//下拉框
const userList = ref([]);//下拉框
const chekedProdLineList = ref<any[]>([]);
const chekedUserList = ref<any[]>([]);
const prodBaseProcessProdlineBoList = ref<any[]>([]);
const prodBaseProcessUserBoList = ref<any[]>([]);
let workshopInfoList = ref([]);
/** 查询车间下拉树结构 */
const getWorkshopListSelect = async () => {
let res = await getWorkshopList(null);
workshopInfoList.value = res.data;
};
const queryFormRef = ref<ElFormInstance>();
const baseProcessInfoFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
title: ''
});
// 列显隐信息
const columns = ref<FieldOption[]>([
{ key: 0, label: `主键标识`, visible: false },
{ key: 1, label: `租户编号`, visible: false },
{ 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: `默认产出率`, visible: true },
{ key: 11, label: `损耗率`, visible: true },
{ key: 12, label: `返修率`, visible: true },
{ key: 13, label: `领料方式`, visible: true },
{ key: 14, label: `委外提前期`, visible: true },
{ key: 15, label: `准备时间`, visible: true },
{ key: 16, label: `加工时间`, visible: true },
{ key: 17, label: `拆卸时间`, visible: true },
{ key: 18, label: `理论生产节拍`, visible: true },
{ key: 19, label: `质检方式`, visible: true },
{ key: 20, label: `激活标识`, visible: true },
{ key: 21, label: `备注`, visible: false },
{ key: 22, label: `创建部门`, visible: false },
{ key: 23, label: `创建人`, visible: false },
{ key: 24, label: `创建时间`, visible: false },
{ key: 25, label: `更新人`, visible: false },
{ key: 26, label: `更新时间`, visible: false }
]);
const initFormData: BaseProcessInfoForm = {
processId: undefined,
processCode: undefined,
processName: undefined,
processType: undefined,
processQueue: undefined,
productionTime: undefined,
workshopId: undefined,
outsourcingFlag: undefined,
processProductionType: undefined,
defaultYieldRate: undefined,
lossRate: undefined,
reworkRate: undefined,
materialMethod: undefined,
leadTime: undefined,
setupTime: undefined,
processingTime: undefined,
disassemblyTime: undefined,
theoreticalCycleTime: undefined,
inspectionMethod: undefined,
activeFlag: '1',
remark: undefined,
productionTimeDays: 0,
productionTimeHours: 0,
productionTimeMinutes: 0,
prodBaseProcessProdlineBoList: [],
prodBaseProcessUserBoList: []
};
const data = reactive<PageData<BaseProcessInfoForm, BaseProcessInfoQuery>>({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
processId: undefined,
processCode: undefined,
processName: undefined,
processType: undefined,
processQueue: undefined,
productionTime: undefined,
workshopId: undefined,
outsourcingFlag: undefined,
processProductionType: undefined,
defaultYieldRate: undefined,
lossRate: undefined,
reworkRate: undefined,
materialMethod: undefined,
leadTime: undefined,
setupTime: undefined,
processingTime: undefined,
disassemblyTime: undefined,
theoreticalCycleTime: undefined,
inspectionMethod: undefined,
activeFlag: undefined,
params: {}
},
rules: {
processCode: [
{ required: true, message: '工序编号不能为空', trigger: 'blur' }
],
processName: [
{ required: true, message: '工序名称不能为空', trigger: 'blur' }
],
processType: [
{ required: true, message: '工序类别不能为空', trigger: 'change' }
],
activeFlag: [
{ required: true, message: '激活标识', trigger: 'change' }
]
}
});
const { queryParams, form, rules } = toRefs(data);
/** 天小时分钟转换为秒 */
const convertToSeconds = () => {
const daysInSeconds = form.value.productionTimeDays * 24 * 60 * 60;
const hoursInSeconds = form.value.productionTimeHours * 60 * 60;
const minutesInSeconds = form.value.productionTimeMinutes * 60;
form.value.productionTime = daysInSeconds + hoursInSeconds + minutesInSeconds;
};
/** 秒转换为天小时分钟 */
const convertToTime = () => {
const totalSeconds = form.value.productionTime;
const days = Math.floor(totalSeconds / (24 * 60 * 60));
const hours = Math.floor((totalSeconds % (24 * 60 * 60)) / 3600);
const minutes = Math.floor((totalSeconds % 3600) / 60);
// 更新到表单中
form.value.productionTimeDays = days;
form.value.productionTimeHours = hours;
form.value.productionTimeMinutes = minutes;
};
/** 查询工序信息列表 */
const getList = async () => {
loading.value = true;
const res = await listBaseProcessInfo(queryParams.value);
baseProcessInfoList.value = res.rows;
total.value = res.total;
loading.value = false;
};
/** 取消按钮 */
const cancel = () => {
reset();
dialog.visible = false;
};
const cancelUser = () => {
reset();
userOpen.value = false;
prodBaseProcessUserBoList.value = [];
};
const cancelProdLine = () => {
reset();
prodLineOpen.value = false;
prodBaseProcessProdlineBoList.value = [];
};
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
baseProcessInfoFormRef.value?.resetFields();
};
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value?.resetFields();
handleQuery();
};
/** 多选框选中数据 */
const handleSelectionChange = (selection: BaseProcessInfoVO[]) => {
ids.value = selection.map(item => item.processId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
/** 新增按钮操作 */
const handleAdd = () => {
reset();
dialog.visible = true;
dialog.title = '添加工序信息';
};
/** 修改按钮操作 */
const handleUpdate = async (row?: BaseProcessInfoVO) => {
reset();
const _processId = row?.processId || ids.value[0];
const res = await getBaseProcessInfo(_processId);
// 处理返回数据
const { prodBaseProcessResourceList, ...sourceData } = res.data as any;
Object.assign(form.value, sourceData);
// 设置资源列表
if (prodBaseProcessResourceList && Array.isArray(prodBaseProcessResourceList)) {
processResourceList.value = prodBaseProcessResourceList;
} else {
processResourceList.value = [];
}
convertToTime();
dialog.visible = true;
dialog.title = '修改工序信息';
};
/** 提交按钮 */
const submitForm = () => {
baseProcessInfoFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
convertToSeconds();
// 将资源列表添加到表单数据中
const submitData: BaseProcessInfoForm = {
...form.value,
prodBaseProcessResourceList: processResourceList.value
};
if (form.value.processId) {
await updateBaseProcessInfo(submitData).finally(() => buttonLoading.value = false);
} else {
await addBaseProcessInfo(submitData).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
chekedProdLineList.value = [];
form.value.prodBaseProcessProdlineBoList = [];
prodBaseProcessProdlineBoList.value = [];
await getList();
}
});
};
const submitUserForm = () => {
baseProcessInfoFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
form.value.prodBaseProcessUserBoList = prodBaseProcessUserBoList.value;
await updateBaseProcessInfoUser(form.value).finally(() => buttonLoading.value = false);
proxy?.$modal.msgSuccess('操作成功');
userOpen.value = false;
chekedUserList.value = [];
form.value.prodBaseProcessUserBoList = [];
prodBaseProcessProdlineBoList.value = [];
await getList();
}
});
};
const submitProdLineForm = () => {
baseProcessInfoFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
form.value.prodBaseProcessProdlineBoList = prodBaseProcessProdlineBoList.value;
convertToSeconds();
if (form.value.processId) {
await updateBaseProcessInfo(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess('操作成功');
prodLineOpen.value = false;
chekedProdLineList.value = [];
form.value.prodBaseProcessProdlineBoList = [];
prodBaseProcessProdlineBoList.value = [];
await getList();
}
});
};
/** 删除按钮操作 */
const handleDelete = async (row?: BaseProcessInfoVO) => {
const _processIds = row?.processId || ids.value;
await proxy?.$modal.confirm('是否确认删除工序信息编号为"' + _processIds + '"的数据项?').finally(() => loading.value = false);
await delBaseProcessInfo(_processIds);
proxy?.$modal.msgSuccess('删除成功');
await getList();
};
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download('mes/baseProcessInfo/export', {
...queryParams.value
}, `baseProcessInfo_${new Date().getTime()}.xlsx`);
};
//打开关联产线对话框
const handleProdLineUpdate = async (row?: BaseProcessInfoVO) => {
reset();
const _processId = row?.processId || ids.value[0];
const res = await getBaseProcessInfo(_processId);
form.value = res.data;
prodLineOpen.value = true;
prodBaseProcessProdlineBoList.value = res.data.prodBaseProcessProdlineVoList.map((item, index) => ({
...item,
index: index + 1 // 初始化 index
}));
dialog.title = '关联产线';
};
const getLineList = async () => {
const res = await getProdLineList(null);//下拉框可选择
prodLineList.value = res.data;
};
//打开关联人员对话框
const handleUserUpdate = async (row?: BaseProcessInfoVO) => {
reset();
const _processId = row?.processId || ids.value[0];
const res = await getBaseProcessInfo(_processId);
form.value = res.data;
userOpen.value = true;
prodBaseProcessUserBoList.value = res.data.prodBaseProcessUserVoList.map((item, index) => ({
...item,
index: index + 1 // 初始化 index
}));
dialog.title = '关联用户';
};
const getUsersList = async () => {
const res = await getUserList(null);//下拉框可选择
userList.value = res.data;
};
// 添加关联产线
const handleAddProdLine = () => {
return prodBaseProcessProdlineBoList.value.push({
prodLineId: null,
processId: form.value.processId, // 确保 processId 被正确赋值
index: prodBaseProcessProdlineBoList.value.length + 1
});
};
// 删除关联产线
const handleDeleteProdLine = () => {
if (chekedProdLineList.value.length === 0) {
proxy?.$modal.msgError('请先选择要删除的工序关联产线数据');
} else {
prodBaseProcessProdlineBoList.value = prodBaseProcessProdlineBoList.value
.filter(item => !chekedProdLineList.value.includes(item.prodLineId))
.map((item, index) => ({
...item,
index: index + 1 // 更新 index
}));
}
};
// 选中关联产线
const handleProdLineSelectionChange = (selection) => {
chekedProdLineList.value = selection.map(item => item.prodLineId);
};
// 添加关联人员
const handleAddUser = () => {
prodBaseProcessUserBoList.value.push({
userId: null,
processId: form.value.processId, // 确保 processId 被正确赋值
index: prodBaseProcessUserBoList.value.length + 1,
userName: null
});
};
// 删除关联人员
const handleDeleteUser = () => {
if (chekedUserList.value.length === 0) {
proxy?.$modal.msgError('请先选择要删除的工序关联人员数据');
} else {
prodBaseProcessUserBoList.value = prodBaseProcessUserBoList.value
.filter(item => !chekedUserList.value.includes(item.userId))
.map((item, index) => ({
...item,
index: index + 1 // 更新 index
}));
}
};
const handleUserSelectionChange = (selection) => {
chekedUserList.value = selection.map(item => item.userId);
};
// 选中关联人员
/*
const handleSelectUser = (row) => {
const selectedUser = userList.value.find(user => user.userId === row.userId);
if (selectedUser) {
row.userName = selectedUser.userName;
} else {
row.userName = null;
}
}
*/
const handleSelectUser = (row) => {
const selectedUser = userList.value.find(user => user.userId === row.userId);
console.log(selectedUser);
if (selectedUser) {
row.userName = selectedUser.userName;
// 更新 prodBaseProcessUserBoList 中对应项的 userName
const userIndex = prodBaseProcessUserBoList.value.findIndex(user => user.userId === row.userId);
if (userIndex !== -1) {
prodBaseProcessUserBoList.value[userIndex].userName = selectedUser.userName;
}
} else {
row.userName = null;
}
};
const rowProdBaseProcessProdlineIndex = ({ row, rowIndex }: { row: any; rowIndex: number }): string => {
// 根据行数据和行索引返回一个类名字符串
if (row.someCondition) {
return 'custom-class';
}
return '';
};
const rowProdBaseProcessUserIndex = ({ row, rowIndex }: { row: any; rowIndex: number }): string => {
// 根据行数据和行索引返回一个类名字符串
if (row.someCondition) {
return 'custom-class';
}
return '';
};
// 工序资源相关
const processResourceList = ref<BaseProcessResourceVO[]>([]);
const resourceLoading = ref(false);
const resourceButtonLoading = ref(false);
const resourceFormRef = ref<ElFormInstance>();
const resourceDialog = reactive<DialogOption>({
visible: false,
title: ''
});
const initResourceFormData: BaseProcessResourceForm = {
processResourceId: undefined,
assignmentType: undefined,
toolingTypeCode: undefined,
requiredFlag: undefined,
selectionMode: undefined,
requiresValidation: undefined,
requiresPreparation: undefined,
remark: undefined
};
const resourceData = reactive<PageData<BaseProcessResourceForm, BaseProcessResourceQuery>>({
form: {...initResourceFormData},
queryParams: {
pageNum: 1,
pageSize: 10,
processResourceId: undefined,
assignmentType: undefined,
toolingTypeCode: undefined,
requiredFlag: undefined,
selectionMode: undefined,
requiresValidation: undefined,
requiresPreparation: undefined,
params: {}
},
rules: {
assignmentType: [
{ required: true, message: "指派类型不能为空", trigger: "change" }
],
requiredFlag: [
{ required: true, message: "必选标识不能为空", trigger: "change" }
],
selectionMode: [
{ required: true, message: "选择模式不能为空", trigger: "change" }
],
requiresValidation: [
{ required: true, message: "是否需要校验不能为空", trigger: "change" }
],
requiresPreparation: [
{ required: true, message: "是否需要准备任务不能为空", trigger: "change" }
]
}
});
const { queryParams: resourceQueryParams, form: resourceForm, rules: resourceRules } = toRefs(resourceData);
/** 新增资源按钮操作 */
const handleAddResource = () => {
resourceForm.value = {...initResourceFormData};
resourceDialog.visible = true;
resourceDialog.title = "添加工序资源";
};
/** 修改资源按钮操作 */
const handleUpdateResource = async (row: BaseProcessResourceVO) => {
resourceForm.value = {...initResourceFormData};
Object.assign(resourceForm.value, row);
resourceDialog.visible = true;
resourceDialog.title = "修改工序资源";
};
/** 删除资源按钮操作 */
const handleDeleteResource = async (row: BaseProcessResourceVO) => {
await proxy?.$modal.confirm('是否确认删除该工序资源?');
const index = processResourceList.value.findIndex(item => item.processResourceId === row.processResourceId);
if (index > -1) {
processResourceList.value.splice(index, 1);
}
proxy?.$modal.msgSuccess("删除成功");
};
/** 提交资源表单 */
const submitResourceForm = () => {
resourceFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
const resourceData: BaseProcessResourceVO = {
processResourceId: resourceForm.value.processResourceId,
processId: form.value.processId,
assignmentType: resourceForm.value.assignmentType,
toolingTypeCode: resourceForm.value.toolingTypeCode,
requiredFlag: resourceForm.value.requiredFlag,
selectionMode: resourceForm.value.selectionMode,
requiresValidation: resourceForm.value.requiresValidation,
requiresPreparation: resourceForm.value.requiresPreparation,
remark: resourceForm.value.remark
};
if (resourceForm.value.processResourceId) {
// 修改资源
const index = processResourceList.value.findIndex(item => item.processResourceId === resourceForm.value.processResourceId);
if (index > -1) {
processResourceList.value[index] = resourceData;
}
} else {
// 新增资源
processResourceList.value.push(resourceData);
}
proxy?.$modal.msgSuccess("操作成功");
resourceDialog.visible = false;
}
});
};
/** 取消资源表单 */
const cancelResource = () => {
resourceForm.value = {...initResourceFormData};
resourceDialog.visible = false;
};
onMounted(() => {
getUsersList();
getLineList();
getWorkshopListSelect();// 初始化车间数据
getList();
});
</script>
<style scoped>
.two-column-form {
display: flex;
gap: 20px;
}
.form-column {
flex: 1;
min-width: 0;
}
:deep(.el-form-item) {
margin-bottom: 18px;
}
:deep(.el-form-item__content) {
flex-wrap: nowrap;
}
:deep(.el-radio-group) {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
</style>