|
|
@@ -0,0 +1,958 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container rel-maint-plan-page">
|
|
|
+ <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
+ <el-form-item label="装置" prop="plant">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.plant"
|
|
|
+ placeholder="请输入装置"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="设备名称" prop="devName">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.devName"
|
|
|
+ placeholder="请输入设备名称"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="设备位号" prop="devTag">
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.devTag"
|
|
|
+ placeholder="请输入设备位号"
|
|
|
+ clearable
|
|
|
+ size="small"
|
|
|
+ @keyup.enter.native="handleQuery"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="计划维修时间" prop="planTime">
|
|
|
+ <el-date-picker clearable size="small" style="width: 200px"
|
|
|
+ v-model="queryParams.planTime"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择计划维修时间">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="计划审批状态" prop="approvalStatus">
|
|
|
+ <el-select v-model="queryParams.approvalStatus" placeholder="请选择计划审批状态" clearable size="small">
|
|
|
+ <el-option label="待审批" value="0" />
|
|
|
+ <el-option label="已通过" value="1" />
|
|
|
+ <el-option label="未通过" value="-1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="计划完成状态" prop="completionStatus">
|
|
|
+ <el-select v-model="queryParams.completionStatus" placeholder="请选择计划完成状态" clearable size="small">
|
|
|
+ <el-option label="未完成" value="0" />
|
|
|
+ <el-option label="已完成" value="1" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
+ <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ size="mini"
|
|
|
+ @click="handleAdd"
|
|
|
+ v-hasPermi="['reliability:rel_maint_plan:add']"
|
|
|
+ >新增</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1.5" v-if="!hasApprovalStatus">
|
|
|
+ <el-button
|
|
|
+ type="success"
|
|
|
+ icon="el-icon-edit"
|
|
|
+ size="mini"
|
|
|
+ :disabled="single"
|
|
|
+ @click="handleUpdate"
|
|
|
+ v-hasPermi="['reliability:rel_maint_plan:edit']"
|
|
|
+ >修改</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1.5" v-if="!hasApprovalStatus">
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ size="mini"
|
|
|
+ :disabled="multiple"
|
|
|
+ @click="handleDelete"
|
|
|
+ v-hasPermi="['reliability:rel_maint_plan:remove']"
|
|
|
+ >删除</el-button>
|
|
|
+ </el-col>
|
|
|
+<!-- <el-col :span="1.5">-->
|
|
|
+<!-- <el-button-->
|
|
|
+<!-- type="warning"-->
|
|
|
+<!-- icon="el-icon-download"-->
|
|
|
+<!-- size="mini"-->
|
|
|
+<!-- @click="handleExport"-->
|
|
|
+<!-- v-hasPermi="['reliability:rel_maint_plan:list']"-->
|
|
|
+<!-- >导出</el-button>-->
|
|
|
+<!-- </el-col>-->
|
|
|
+ <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table v-loading="loading" :data="rel_maint_planList" @selection-change="handleSelectionChange" :height="clientHeight" border>
|
|
|
+ <el-table-column type="selection" width="55" align="center" />
|
|
|
+ <el-table-column label="装置" align="center" prop="plant" width="120" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="设备名称" align="center" prop="devName" width="150" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="设备位号" align="center" prop="devTag" width="150" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="计划维修时间" align="center" prop="planTime" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ parseTime(scope.row.planTime, '{y}-{m}-{d}') }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="计划审批状态" align="center" prop="approvalStatus" width="120" :show-overflow-tooltip="true">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag v-if="scope.row.approvalStatus === '0'" type="warning" size="mini">待审批</el-tag>
|
|
|
+ <el-tag v-else-if="scope.row.approvalStatus === '1'" type="success" size="mini">已通过</el-tag>
|
|
|
+ <el-tag v-else-if="scope.row.approvalStatus === '-1'" type="danger" size="mini">未通过</el-tag>
|
|
|
+ <span v-else>{{ scope.row.approvalStatus }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="责任人" align="center" prop="responsible" width="100" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="计划完成状态" align="center" prop="completionStatus" width="120" :show-overflow-tooltip="true">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag v-if="scope.row.completionStatus === '0'" type="info" size="mini">未完成</el-tag>
|
|
|
+ <el-tag v-else-if="scope.row.completionStatus === '1'" type="success" size="mini">已完成</el-tag>
|
|
|
+ <span v-else>{{ scope.row.completionStatus }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="审批人" align="center" prop="approver" width="100" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="备注" align="center" prop="remarks" :show-overflow-tooltip="true"/>
|
|
|
+ <el-table-column label="操作" align="center" fixed="right" width="120" class-name="small-padding fixed-width">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-edit"
|
|
|
+ @click="handleUpdate(scope.row)"
|
|
|
+ v-hasPermi="['reliability:rel_maint_plan:edit']"
|
|
|
+ >修改</el-button>
|
|
|
+ <el-button
|
|
|
+ v-if="scope.row.approvalStatus !== '0'"
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ @click="handleDelete(scope.row)"
|
|
|
+ v-hasPermi="['reliability:rel_maint_plan:remove']"
|
|
|
+ >删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <pagination
|
|
|
+ v-show="total>0"
|
|
|
+ :total="total"
|
|
|
+ :page.sync="queryParams.pageNum"
|
|
|
+ :limit.sync="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 添加或修改设备维修计划对话框 -->
|
|
|
+ <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
|
|
|
+ <el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
|
|
+ <!-- 基础信息区域 -->
|
|
|
+ <div class="form-section">
|
|
|
+ <div class="section-header">
|
|
|
+ <i class="el-icon-info"></i>
|
|
|
+ <span class="section-title">基础信息</span>
|
|
|
+ </div>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="选择设备" prop="devId">
|
|
|
+ <el-select
|
|
|
+ v-model="form.devId"
|
|
|
+ filterable
|
|
|
+ remote
|
|
|
+ :remote-method="searchDevice"
|
|
|
+ :loading="deviceLoading"
|
|
|
+ placeholder="请输入设备位号或名称搜索"
|
|
|
+ style="width: 100%"
|
|
|
+ @change="handleDeviceChange"
|
|
|
+ @focus="handleDeviceFocus"
|
|
|
+ :disabled="!!form.planId"
|
|
|
+ clearable>
|
|
|
+ <el-option
|
|
|
+ v-for="device in deviceOptions"
|
|
|
+ :key="device.devId"
|
|
|
+ :label="`${device.devTag} - ${device.devName}`"
|
|
|
+ :value="device.devId">
|
|
|
+ <span style="float: left">{{ device.devTag }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 13px">{{ device.devName }}</span>
|
|
|
+ </el-option>
|
|
|
+ <div v-if="deviceOptions.length === 0 && !deviceLoading" style="padding: 10px; text-align: center; color: #909399;">
|
|
|
+ 请输入设备位号或名称进行搜索
|
|
|
+ </div>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="计划维修时间" prop="planTime">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.planTime"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ placeholder="选择计划维修时间"
|
|
|
+ style="width: 100%">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="责任人" prop="responsible">
|
|
|
+ <el-input v-model="form.responsible" placeholder="请输入责任人" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="审批人" prop="approver">
|
|
|
+ <el-select
|
|
|
+ v-model="form.approver"
|
|
|
+ placeholder="请选择审批人"
|
|
|
+ style="width: 100%"
|
|
|
+ clearable
|
|
|
+ filterable>
|
|
|
+ <el-option
|
|
|
+ v-for="staff in staffOptions"
|
|
|
+ :key="staff.staffid"
|
|
|
+ :label="staff.name"
|
|
|
+ :value="staff.name">
|
|
|
+ </el-option>
|
|
|
+ <div v-if="staffOptions.length === 0" style="padding: 10px; text-align: center; color: #909399;">
|
|
|
+ 暂无人员数据
|
|
|
+ </div>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="备注" prop="remarks">
|
|
|
+ <el-input v-model="form.remarks" type="textarea" :rows="2" placeholder="请输入备注" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 设备信息展示 -->
|
|
|
+ <div class="form-section" v-if="selectedDevice">
|
|
|
+ <div class="section-header">
|
|
|
+ <i class="el-icon-s-platform"></i>
|
|
|
+ <span class="section-title">设备信息</span>
|
|
|
+ </div>
|
|
|
+ <el-descriptions :column="3" border size="small">
|
|
|
+ <el-descriptions-item label="装置">{{ selectedDevice.plant }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="设备位号">{{ selectedDevice.devTag }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="设备名称">{{ selectedDevice.devName }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="位置">{{ selectedDevice.devLoc }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="设备类型">{{ selectedDevice.devType }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="区域负责人">{{ selectedDevice.areaResponsible }}</el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 部件列表及维修记录选择 -->
|
|
|
+ <div class="form-section" v-if="compoList.length > 0">
|
|
|
+ <div class="section-header">
|
|
|
+ <i class="el-icon-s-grid"></i>
|
|
|
+ <span class="section-title">部件维修选择</span>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="compoList"
|
|
|
+ border
|
|
|
+ size="small"
|
|
|
+ :height="500"
|
|
|
+ style="margin-top: 10px">
|
|
|
+ <el-table-column type="index" label="序号" width="60" align="center" />
|
|
|
+ <el-table-column label="部件名称" prop="compoName" width="150" :show-overflow-tooltip="true" />
|
|
|
+ <el-table-column label="检查频率/日期" width="120" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div style="line-height: 1.2;">
|
|
|
+ <div style="font-weight: bold; margin-bottom: 2px;">{{ translateFrequency(scope.row.checkFreq) || '-' }}</div>
|
|
|
+ <div style="font-size: 12px; color: #666;">{{ scope.row.lastCheckDate ? parseTime(scope.row.lastCheckDate, '{y}-{m}-{d}') : '-' }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="维修频率/日期" width="120" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div style="line-height: 1.2;">
|
|
|
+ <div style="font-weight: bold; margin-bottom: 2px;">{{ translateFrequency(scope.row.maintFreq) || '-' }}</div>
|
|
|
+ <div style="font-size: 12px; color: #666;">{{ scope.row.lastMaintDate ? parseTime(scope.row.lastMaintDate, '{y}-{m}-{d}') : '-' }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="更换频率/日期" width="120" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div style="line-height: 1.2;">
|
|
|
+ <div style="font-weight: bold; margin-bottom: 2px;">{{ translateFrequency(scope.row.replaceFreq) || '-' }}</div>
|
|
|
+ <div style="font-size: 12px; color: #666;">{{ scope.row.lastReplaceDate ? parseTime(scope.row.lastReplaceDate, '{y}-{m}-{d}') : '-' }}</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="本次维修" width="100" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-checkbox v-model="scope.row.needMaint" @change="handleMaintCheckChange(scope.row)">需要维修</el-checkbox>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="维修形式" width="200" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="scope.row.maintType"
|
|
|
+ :disabled="!scope.row.needMaint"
|
|
|
+ @change="handleMaintTypeChange(scope.row)"
|
|
|
+ style="display: flex; flex-direction: row; gap: 0px;">
|
|
|
+ <el-radio label="1" style="margin-right: 0; margin-left: 0;">检查</el-radio>
|
|
|
+ <el-radio label="2" style="margin-right: 0; margin-left: 0;">维修</el-radio>
|
|
|
+ <el-radio label="3" style="margin-right: 0; margin-left: 0;">更换</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="负责人" width="150" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-select
|
|
|
+ v-model="scope.row.maintResponsible"
|
|
|
+ :placeholder="getResponsiblePlaceholder(scope.row.maintType)"
|
|
|
+ style="width: 100%"
|
|
|
+ :disabled="!scope.row.needMaint"
|
|
|
+ clearable
|
|
|
+ filterable>
|
|
|
+ <el-option
|
|
|
+ v-for="staff in staffOptions"
|
|
|
+ :key="staff.staffid"
|
|
|
+ :label="staff.name"
|
|
|
+ :value="staff.name">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 修改模式额外字段 -->
|
|
|
+ <div class="form-section" v-if="form.planId">
|
|
|
+ <div class="section-header">
|
|
|
+ <i class="el-icon-setting"></i>
|
|
|
+ <span class="section-title">状态管理</span>
|
|
|
+ </div>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="计划审批状态">
|
|
|
+ <el-radio-group v-model="form.approvalStatus">
|
|
|
+ <el-radio label="0">待审批</el-radio>
|
|
|
+ <el-radio label="1">已通过</el-radio>
|
|
|
+ <el-radio label="-1">未通过</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="计划完成状态">
|
|
|
+ <el-radio-group v-model="form.completionStatus">
|
|
|
+ <el-radio label="0">未完成</el-radio>
|
|
|
+ <el-radio label="1">已完成</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitForm" v-if="!form.planId">提交申请</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm" v-else>确 定</el-button>
|
|
|
+ <el-button @click="cancel">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 用户导入对话框 -->
|
|
|
+ <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
|
|
|
+ <el-upload
|
|
|
+ ref="upload"
|
|
|
+ :limit="1"
|
|
|
+ accept=".xlsx, .xls"
|
|
|
+ :headers="upload.headers"
|
|
|
+ :action="upload.url + '?updateSupport=' + upload.updateSupport"
|
|
|
+ :disabled="upload.isUploading"
|
|
|
+ :on-progress="handleFileUploadProgress"
|
|
|
+ :on-success="handleFileSuccess"
|
|
|
+ :auto-upload="false"
|
|
|
+ drag
|
|
|
+ >
|
|
|
+ <i class="el-icon-upload"></i>
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 将文件拖到此处,或
|
|
|
+ <em>点击上传</em>
|
|
|
+ </div>
|
|
|
+ <div class="el-upload__tip" slot="tip">
|
|
|
+ <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
|
|
|
+ <el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>
|
|
|
+ </div>
|
|
|
+ <div class="el-upload__tip" style="color:red" slot="tip">提示:仅允许导入“xls”或“xlsx”格式文件!</div>
|
|
|
+ </el-upload>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitFileForm">确 定</el-button>
|
|
|
+ <el-button @click="upload.open = false">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { listRel_maint_plan, getRel_maint_plan, delRel_maint_plan, addRel_maint_plan, updateRel_maint_plan, exportRel_maint_plan, importTemplate, submitApprove} from "@/api/reliability/rel_maint_plan";
|
|
|
+import { listRel_device, getRel_device } from "@/api/reliability/rel_device";
|
|
|
+import { listRel_compo } from "@/api/reliability/rel_compo";
|
|
|
+import { listRel_maint_record } from "@/api/reliability/rel_maint_record";
|
|
|
+import { listUser } from "@/api/system/user";
|
|
|
+import { listStaffmgr, listStaffmgrAll } from "@/api/plant/staffmgr";
|
|
|
+import { treeselect } from "@/api/system/dept";
|
|
|
+import { getToken } from "@/utils/auth";
|
|
|
+import Treeselect from "@riophae/vue-treeselect";
|
|
|
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "Rel_maint_plan",
|
|
|
+ components: { Treeselect },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // 遮罩层
|
|
|
+ loading: true,
|
|
|
+ // 选中数组
|
|
|
+ ids: [],
|
|
|
+ // 非单个禁用
|
|
|
+ single: true,
|
|
|
+ // 非多个禁用
|
|
|
+ multiple: true,
|
|
|
+ // 显示搜索条件
|
|
|
+ showSearch: false,
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ // 设备维修计划表格数据
|
|
|
+ rel_maint_planList: [],
|
|
|
+ // 弹出层标题
|
|
|
+ title: "",
|
|
|
+ // 部门树选项
|
|
|
+ deptOptions: undefined,
|
|
|
+ clientHeight:300,
|
|
|
+ // 是否显示弹出层
|
|
|
+ open: false,
|
|
|
+ // 用户导入参数
|
|
|
+ upload: {
|
|
|
+ // 是否显示弹出层(用户导入)
|
|
|
+ open: false,
|
|
|
+ // 弹出层标题(用户导入)
|
|
|
+ title: "",
|
|
|
+ // 是否禁用上传
|
|
|
+ isUploading: false,
|
|
|
+ // 是否更新已经存在的用户数据
|
|
|
+ updateSupport: 0,
|
|
|
+ // 设置上传的请求头部
|
|
|
+ headers: { Authorization: "Bearer " + getToken() },
|
|
|
+ // 上传的地址
|
|
|
+ url: process.env.VUE_APP_BASE_API + "/reliability/rel_maint_plan/importData"
|
|
|
+ },
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ plant: null,
|
|
|
+ devName: null,
|
|
|
+ devTag: null,
|
|
|
+ planTime: null,
|
|
|
+ approvalStatus: null,
|
|
|
+ responsible: null,
|
|
|
+ completionStatus: null,
|
|
|
+ processId: null,
|
|
|
+ approver: null,
|
|
|
+ createrCode: null,
|
|
|
+ createdate: null,
|
|
|
+ updaterCode: null,
|
|
|
+ updatedate: null,
|
|
|
+ deptId: null,
|
|
|
+ remarks: null
|
|
|
+ },
|
|
|
+ // 表单参数
|
|
|
+ form: {},
|
|
|
+ // 表单校验
|
|
|
+ rules: {
|
|
|
+ devId: [
|
|
|
+ { required: true, message: "请选择设备", trigger: "change" }
|
|
|
+ ],
|
|
|
+ planTime: [
|
|
|
+ { required: true, message: "请选择计划维修时间", trigger: "change" }
|
|
|
+ ],
|
|
|
+ approver: [
|
|
|
+ { required: true, message: "请选择审批人", trigger: "change" }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ // 设备相关
|
|
|
+ deviceOptions: [],
|
|
|
+ deviceLoading: false,
|
|
|
+ selectedDevice: null,
|
|
|
+ // 部件相关
|
|
|
+ compoList: [],
|
|
|
+ // 审批人相关
|
|
|
+ approverOptions: [],
|
|
|
+ approverLoading: false,
|
|
|
+ // 所有人员选项
|
|
|
+ staffOptions: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // 判断选中的条目中是否有审批中的状态
|
|
|
+ hasApprovalStatus() {
|
|
|
+ return this.ids.some(id => {
|
|
|
+ const item = this.rel_maint_planList.find(row => row.planId === id);
|
|
|
+ return item && item.approvalStatus === '0';
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ // 根据名称筛选部门树
|
|
|
+ deptName(val) {
|
|
|
+ this.$refs.tree.filter(val);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ //设置表格高度对应屏幕高度
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.clientHeight = document.body.clientHeight -250
|
|
|
+ })
|
|
|
+ this.getList();
|
|
|
+ this.getTreeselect();
|
|
|
+ this.getStaffList(); // 加载所有人员
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /** 查询人员列表 */
|
|
|
+ getStaffList() {
|
|
|
+ listStaffmgrAll().then(response => {
|
|
|
+ console.log('人员数据响应:', response);
|
|
|
+ this.staffOptions = response.rows || response.data || [];
|
|
|
+ console.log('staffOptions:', this.staffOptions);
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('加载人员数据失败:', error);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ this.loading = true;
|
|
|
+ listRel_maint_plan(this.queryParams).then(response => {
|
|
|
+ this.rel_maint_planList = response.rows;
|
|
|
+ this.total = response.total;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 查询部门下拉树结构 */
|
|
|
+ getTreeselect() {
|
|
|
+ treeselect().then(response => {
|
|
|
+ this.deptOptions = response.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 取消按钮
|
|
|
+ cancel() {
|
|
|
+ this.open = false;
|
|
|
+ this.reset();
|
|
|
+ },
|
|
|
+ // 表单重置
|
|
|
+ reset() {
|
|
|
+ this.form = {
|
|
|
+ planId: null,
|
|
|
+ devId: null,
|
|
|
+ plant: null,
|
|
|
+ devName: null,
|
|
|
+ devTag: null,
|
|
|
+ planTime: null,
|
|
|
+ approvalStatus: "0",
|
|
|
+ responsible: null,
|
|
|
+ completionStatus: "0",
|
|
|
+ processId: null,
|
|
|
+ approver: null,
|
|
|
+ delFlag: null,
|
|
|
+ createrCode: null,
|
|
|
+ createdate: null,
|
|
|
+ updaterCode: null,
|
|
|
+ updatedate: null,
|
|
|
+ deptId: null,
|
|
|
+ remarks: null,
|
|
|
+ // 维修记录关联
|
|
|
+ compoRecords: []
|
|
|
+ };
|
|
|
+ this.selectedDevice = null;
|
|
|
+ this.compoList = [];
|
|
|
+ this.deviceOptions = [];
|
|
|
+ this.approverOptions = [];
|
|
|
+ this.resetForm("form");
|
|
|
+ },
|
|
|
+ /** 搜索按钮操作 */
|
|
|
+ handleQuery() {
|
|
|
+ this.queryParams.pageNum = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ /** 重置按钮操作 */
|
|
|
+ resetQuery() {
|
|
|
+ this.resetForm("queryForm");
|
|
|
+ this.handleQuery();
|
|
|
+ },
|
|
|
+ // 多选框选中数据
|
|
|
+ handleSelectionChange(selection) {
|
|
|
+ this.ids = selection.map(item => item.planId)
|
|
|
+ this.single = selection.length!==1
|
|
|
+ this.multiple = !selection.length
|
|
|
+ },
|
|
|
+ /** 新增按钮操作 */
|
|
|
+ handleAdd() {
|
|
|
+ this.reset();
|
|
|
+ this.open = true;
|
|
|
+ this.title = "添加设备维修计划";
|
|
|
+ },
|
|
|
+ /** 修改按钮操作 */
|
|
|
+ handleUpdate(row) {
|
|
|
+ this.reset();
|
|
|
+ const planId = row.planId || this.ids
|
|
|
+ getRel_maint_plan(planId).then(response => {
|
|
|
+ this.form = response.data;
|
|
|
+
|
|
|
+ // 如果有设备ID,加载设备信息和部件列表
|
|
|
+ if (this.form.devId) {
|
|
|
+ this.loadDeviceInfo(this.form.devId);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.open = true;
|
|
|
+ this.title = "修改设备维修计划";
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 设备下拉框获得焦点 */
|
|
|
+ handleDeviceFocus() {
|
|
|
+ // 如果没有数据且没有在加载,可以加载一些初始数据
|
|
|
+ if (this.deviceOptions.length === 0 && !this.deviceLoading) {
|
|
|
+ // 可以加载最近的设备或空列表
|
|
|
+ // this.searchDevice('');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 设备选择改变 */
|
|
|
+ handleDeviceChange(devId) {
|
|
|
+ if (!devId) {
|
|
|
+ this.selectedDevice = null;
|
|
|
+ this.compoList = [];
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 获取设备详情
|
|
|
+ getRel_device(devId).then(response => {
|
|
|
+ this.selectedDevice = response.data;
|
|
|
+ this.form.plant = response.data.plant;
|
|
|
+ this.form.devName = response.data.devName;
|
|
|
+ this.form.devTag = response.data.devTag;
|
|
|
+
|
|
|
+ // 加载该设备的部件列表
|
|
|
+ this.loadCompoList(devId);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 搜索设备 */
|
|
|
+ searchDevice(query) {
|
|
|
+ if (query !== '') {
|
|
|
+ this.deviceLoading = true;
|
|
|
+ listRel_device({
|
|
|
+ devTag: query,
|
|
|
+ devName: query,
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 50
|
|
|
+ }).then(response => {
|
|
|
+ this.deviceOptions = response.rows || [];
|
|
|
+ this.deviceLoading = false;
|
|
|
+ }).catch(() => {
|
|
|
+ this.deviceLoading = false;
|
|
|
+ this.deviceOptions = [];
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.deviceOptions = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 加载设备信息 */
|
|
|
+ loadDeviceInfo(devId) {
|
|
|
+ // 获取设备详情
|
|
|
+ getRel_device(devId).then(response => {
|
|
|
+ this.selectedDevice = response.data;
|
|
|
+
|
|
|
+ // 加载该设备的部件列表
|
|
|
+ this.loadCompoList(devId);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 加载部件列表 */
|
|
|
+ loadCompoList(devId) {
|
|
|
+ listRel_compo({
|
|
|
+ devTag: this.selectedDevice.devTag,
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 1000
|
|
|
+ }).then(response => {
|
|
|
+ const compos = response.rows || [];
|
|
|
+ // 为每个部件初始化维修记录数组
|
|
|
+ this.compoList = compos.map(compo => ({
|
|
|
+ ...compo,
|
|
|
+ // 维修计划相关字段
|
|
|
+ needMaint: false,
|
|
|
+ maintType: '',
|
|
|
+ maintResponsible: '',
|
|
|
+ // 频率和日期字段 - 使用正确的字段名
|
|
|
+ checkFreq: compo.inspFreq || '',
|
|
|
+ lastCheckDate: compo.lastInspDate || '',
|
|
|
+ maintFreq: compo.fixFreq || '',
|
|
|
+ lastMaintDate: compo.lastFixDate || '',
|
|
|
+ replaceFreq: compo.replaceFreq || '',
|
|
|
+ lastReplaceDate: compo.lastReplaceDate || '',
|
|
|
+ // 负责人字段
|
|
|
+ inspector: compo.inspector || '', // 检查人
|
|
|
+ fixer: compo.fixer || '', // 维修更换人
|
|
|
+ inspectorName: compo.inspectorName || '', // 检查人姓名
|
|
|
+ fixerName: compo.fixerName || '', // 维修更换人姓名
|
|
|
+ // 负责人搜索相关
|
|
|
+ responsibleOptions: [],
|
|
|
+ responsibleLoading: false,
|
|
|
+ // 原有的维修记录相关(保留用于修改模式)
|
|
|
+ selectedRecords: [],
|
|
|
+ maintRecords: [],
|
|
|
+ recordLoading: false
|
|
|
+ }));
|
|
|
+
|
|
|
+ // 为每个部件加载可选的维修记录(修改模式)
|
|
|
+ if (this.form.planId) {
|
|
|
+ this.compoList.forEach(compo => {
|
|
|
+ this.loadMaintRecords(compo);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 加载维修记录 */
|
|
|
+ loadMaintRecords(compo) {
|
|
|
+ compo.recordLoading = true;
|
|
|
+ listRel_maint_record({
|
|
|
+ compoId: compo.compoId,
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 1000
|
|
|
+ }).then(response => {
|
|
|
+ compo.maintRecords = (response.rows || []).map(record => ({
|
|
|
+ ...record,
|
|
|
+ // 确保maintContent是纯文本(去除HTML标签)
|
|
|
+ maintContent: record.maintContent ? String(record.maintContent).replace(/<[^>]+>/g, '').trim() : ''
|
|
|
+ }));
|
|
|
+ compo.recordLoading = false;
|
|
|
+ }).catch(() => {
|
|
|
+ compo.recordLoading = false;
|
|
|
+ compo.maintRecords = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 维修记录选择改变 */
|
|
|
+ handleRecordChange(compo) {
|
|
|
+ // 可以在这里添加其他逻辑
|
|
|
+ },
|
|
|
+ /** 维修负责人搜索 */
|
|
|
+ /** 维修选择改变 */
|
|
|
+ handleMaintCheckChange(compo) {
|
|
|
+ if (!compo.needMaint) {
|
|
|
+ // 如果取消维修,清空相关字段
|
|
|
+ compo.maintType = '';
|
|
|
+ compo.maintResponsible = '';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 维修形式改变 */
|
|
|
+ handleMaintTypeChange(compo) {
|
|
|
+ // 根据维修形式自动设置负责人
|
|
|
+ if (compo.maintType === '1') {
|
|
|
+ // 检查 - 使用检查人姓名
|
|
|
+ compo.maintResponsible = compo.inspectorName || '';
|
|
|
+ } else if (compo.maintType === '2' || compo.maintType === '3') {
|
|
|
+ // 维修或更换 - 使用维修更换人姓名
|
|
|
+ compo.maintResponsible = compo.fixerName || '';
|
|
|
+ } else {
|
|
|
+ // 其他情况清空负责人选择
|
|
|
+ compo.maintResponsible = '';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 根据姓名获取工号 */
|
|
|
+ getStaffIdByName(name) {
|
|
|
+ if (!name) return '';
|
|
|
+ const staff = this.staffOptions.find(s => s.name === name);
|
|
|
+ return staff ? staff.staffid : '';
|
|
|
+ },
|
|
|
+ getResponsiblePlaceholder(maintType) {
|
|
|
+ switch(maintType) {
|
|
|
+ case '1': return '选择检查人';
|
|
|
+ case '2': return '选择维修人';
|
|
|
+ case '3': return '选择更换人';
|
|
|
+ default: return '选择负责人';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 提交按钮 */
|
|
|
+ submitForm() {
|
|
|
+ this.$refs["form"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ // 收集需要维修的部件信息
|
|
|
+ if (!this.form.planId && this.compoList.length > 0) {
|
|
|
+ // 收集需要维修的部件,转换为TRelMaintRecord格式
|
|
|
+ const maintComponents = this.compoList
|
|
|
+ .filter(compo => compo.needMaint)
|
|
|
+ .map(compo => ({
|
|
|
+ compoId: compo.compoId,
|
|
|
+ compoName: compo.compoName,
|
|
|
+ maintType: compo.maintType,
|
|
|
+ responsible: this.getStaffIdByName(compo.maintResponsible), // 转换为工号
|
|
|
+ // 可以添加其他需要的字段
|
|
|
+ inspectContent: '', // 检查内容
|
|
|
+ maintContent: '', // 维修内容
|
|
|
+ maintResult: '', // 维修结果
|
|
|
+ maintCost: null, // 维修费用
|
|
|
+ maintDuration: null, // 维修时长
|
|
|
+ processLoss: '', // 工艺损失
|
|
|
+ attachments: '', // 附件
|
|
|
+ remarks: '' // 备注
|
|
|
+ }));
|
|
|
+
|
|
|
+ this.form.maintComponents = maintComponents;
|
|
|
+ console.log('收集到的维修部件:', maintComponents);
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log('提交的表单数据:', this.form);
|
|
|
+
|
|
|
+ // 转换审批人姓名为工号
|
|
|
+ if (this.form.approver) {
|
|
|
+ this.form.approver = this.getStaffIdByName(this.form.approver);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.form.planId != null) {
|
|
|
+ // 修改模式
|
|
|
+ updateRel_maint_plan(this.form).then(response => {
|
|
|
+ this.msgSuccess("修改成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ // 新增模式 - 提交申请
|
|
|
+ submitApprove(this.form).then(response => {
|
|
|
+ this.msgSuccess("维修计划申请提交成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ }).catch(error => {
|
|
|
+ this.msgError("提交失败:" + (error.message || "未知错误"));
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 删除按钮操作 */
|
|
|
+ handleDelete(row) {
|
|
|
+ const planIds = row.planId || this.ids;
|
|
|
+ this.$confirm('是否确认删除?', "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(function() {
|
|
|
+ return delRel_maint_plan(planIds);
|
|
|
+ }).then(() => {
|
|
|
+ this.getList();
|
|
|
+ this.msgSuccess("删除成功");
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** 导出按钮操作 */
|
|
|
+ handleExport() {
|
|
|
+ const queryParams = this.queryParams;
|
|
|
+ this.$confirm('是否确认导出所有设备维修计划数据项?', "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(function() {
|
|
|
+ return exportRel_maint_plan(queryParams);
|
|
|
+ }).then(response => {
|
|
|
+ this.download(response.msg);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** 导入按钮操作 */
|
|
|
+ handleImport() {
|
|
|
+ this.upload.title = "用户导入";
|
|
|
+ this.upload.open = true;
|
|
|
+ },
|
|
|
+ /** 下载模板操作 */
|
|
|
+ importTemplate() {
|
|
|
+ importTemplate().then(response => {
|
|
|
+ this.download(response.msg);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 文件上传中处理
|
|
|
+ handleFileUploadProgress(event, file, fileList) {
|
|
|
+ this.upload.isUploading = true;
|
|
|
+ },
|
|
|
+ // 文件上传成功处理
|
|
|
+ handleFileSuccess(response, file, fileList) {
|
|
|
+ this.upload.open = false;
|
|
|
+ this.upload.isUploading = false;
|
|
|
+ this.$refs.upload.clearFiles();
|
|
|
+ this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ // 提交上传文件
|
|
|
+ submitFileForm() {
|
|
|
+ this.$refs.upload.submit();
|
|
|
+ },
|
|
|
+ /** 翻译频率字段 */
|
|
|
+ translateFrequency(frequency) {
|
|
|
+ if (!frequency) return '';
|
|
|
+
|
|
|
+ // 匹配数字和单位
|
|
|
+ const match = frequency.match(/^(\d+)([ym])$/);
|
|
|
+ if (match) {
|
|
|
+ const number = match[1];
|
|
|
+ const unit = match[2];
|
|
|
+
|
|
|
+ switch (unit) {
|
|
|
+ case 'y':
|
|
|
+ return `${number}年一次`;
|
|
|
+ case 'm':
|
|
|
+ return `${number}月一次`;
|
|
|
+ default:
|
|
|
+ return frequency;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return frequency;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.form-section {
|
|
|
+ margin-bottom: 20px;
|
|
|
+
|
|
|
+ .section-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #e4e7ed;
|
|
|
+
|
|
|
+ .el-icon-info,
|
|
|
+ .el-icon-s-platform,
|
|
|
+ .el-icon-s-grid {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #409EFF;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .section-title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #303133;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.dialog-footer {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+// 紧凑的radio按钮样式 - 仅影响维修计划页面的维修形式列
|
|
|
+.rel-maint-plan-page ::v-deep .el-table .el-radio__label {
|
|
|
+ padding-left: 2px !important;
|
|
|
+}
|
|
|
+</style>
|