ChengQiqian
/
yuanxingsheji
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
yuanxingsheji/项目管理/组织实施管理（工作台、人员分布、设备管理、安全、质量）...

2721 lines
137 KiB
HTML
Raw Normal View History

1
2025-07-08 10:16:29 +08:00
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>项目管理 - 武汉迪特聚能科技</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.15.13/lib/theme-chalk/index.css">
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/element-ui@2.15.13/lib/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js"></script>
<style>
.app-container {
padding: 20px;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", Arial, sans-serif;
}
.header {
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
.card-container {
margin-bottom: 20px;
}
.tab-content {
padding: 15px 0;
}
.personnel-table {
margin-top: 15px;
}
.chart-container {
width: 100%;
height: 400px;
}
.filter-container {
margin-bottom: 15px;
}
.role-tag {
margin-right: 5px;
}
.project-card {
margin-bottom: 20px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.project-header {
display: flex;
justify-content: space-between;
align-items: center;
}
1
2025-07-25 17:57:25 +08:00
.dashboard-card {
margin-bottom: 20px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.equipment-status {
display: flex;
align-items: center;
}
.status-indicator {
width: 10px;
height: 10px;
border-radius: 50%;
margin-right: 5px;
}
.status-available {
background-color: #67C23A;
}
.status-in-use {
background-color: #409EFF;
}
.status-maintenance {
background-color: #E6A23C;
}
.status-scrapped {
background-color: #F56C6C;
}
.workbench-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
}
.workbench-card {
flex: 1;
min-width: 300px;
}
.task-item {
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ebeef5;
border-radius: 4px;
}
.task-highlight {
background-color: #f0f7ff;
border-left: 4px solid #409EFF;
}
1
2025-07-08 10:16:29 +08:00
</style>
</head>
<body>
<div id="app" class="app-container">
<div class="header">
1
2025-07-25 17:57:25 +08:00
<h2>项目管理平台 - 风机叶片检查</h2>
1
2025-07-08 10:16:29 +08:00
<el-breadcrumb separator="/">
<el-breadcrumb-item>项目管理</el-breadcrumb-item>
<el-breadcrumb-item>{{ activeTab }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-tabs v-model="activeTab" @tab-click="handleTabClick">
1
2025-07-25 17:57:25 +08:00
<!-- 个人工作台 -->
<el-tab-pane label="我的工作台" name="dashboard">
<div class="tab-content">
<el-card class="dashboard-card">
<div slot="header">
<span>我的任务</span>
<el-button type="primary" size="small" style="float: right;" @click="refreshTasks">刷新</el-button>
</div>
<div class="workbench-container">
<el-card class="workbench-card">
<div slot="header">当前项目</div>
<el-table :data="currentProjects" style="width: 100%">
<el-table-column prop="name" label="项目名称"></el-table-column>
<el-table-column prop="role" label="我的角色"></el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button type="text" @click="viewProjectDetail(scope.row)">详情</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<el-card class="workbench-card">
<div slot="header">待办任务</div>
<div v-if="pendingTasks.length > 0">
<div v-for="task in pendingTasks" :key="task.id"
class="task-item"
:class="{'task-highlight': task.priority === '高'}">
<div><strong>{{ task.name }}</strong></div>
<div>项目: {{ task.project }}</div>
<div>截止时间: {{ task.deadline }}</div>
<div>优先级:
<el-tag :type="task.priority === '高' ? 'danger' : task.priority === '中' ? 'warning' : ''" size="mini">
{{ task.priority }}
</el-tag>
</div>
<el-button type="primary" size="mini" @click="startTask(task)" style="margin-top: 5px;">开始任务</el-button>
</div>
</div>
<el-empty v-else description="暂无待办任务"></el-empty>
</el-card>
</div>
</el-card>
<el-card class="dashboard-card">
<div slot="header">我的工作进度</div>
<div class="chart-container" ref="personalProgressChart"></div>
</el-card>
<el-card class="dashboard-card">
<div slot="header">我的设备</div>
<el-table :data="myEquipment" style="width: 100%">
<el-table-column prop="name" label="设备名称"></el-table-column>
<el-table-column prop="type" label="设备类型"></el-table-column>
<el-table-column prop="project" label="所属项目"></el-table-column>
<el-table-column label="状态">
<template slot-scope="scope">
<div class="equipment-status">
<div :class="['status-indicator', getStatusClass(scope.row.status)]"></div>
{{ scope.row.status }}
</div>
</template>
</el-table-column>
<el-table-column prop="borrowDate" label="领用时间"></el-table-column>
<el-table-column prop="returnDate" label="预计归还"></el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button type="text" @click="returnEquipment(scope.row)">归还</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</el-tab-pane>
<!-- 人员分布模块 -->
1
2025-07-08 10:16:29 +08:00
<el-tab-pane label="人员分布" name="personnel">
<div class="tab-content">
<div class="filter-container">
<el-form :inline="true" :model="personnelQuery" class="demo-form-inline">
<el-form-item label="项目选择">
<el-select v-model="personnelQuery.project" placeholder="请选择项目" clearable @change="handleProjectChange">
<el-option
v-for="item in projectOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="角色筛选">
<el-select v-model="personnelQuery.role" placeholder="请选择角色" clearable multiple>
<el-option
v-for="item in roleOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间范围">
<el-date-picker
v-model="personnelQuery.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="fetchPersonnelData">查询</el-button>
<el-button @click="resetPersonnelQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<!-- 项目人员分布卡片 -->
<div v-if="selectedProject">
<el-card class="project-card">
<div slot="header" class="project-header">
<span>{{ selectedProject.name }} 人员分布</span>
<div>
<el-radio-group v-model="viewType" size="small">
<el-radio-button label="chart">分布图</el-radio-button>
<el-radio-button label="table">分布表</el-radio-button>
1
2025-07-25 17:57:25 +08:00
<el-radio-button label="gantt">甘特图</el-radio-button>
1
2025-07-08 10:16:29 +08:00
</el-radio-group>
<el-button type="primary" size="small" @click="showPersonnelDialog" style="margin-left: 10px;">新增安排</el-button>
1
2025-07-25 17:57:25 +08:00
<el-button type="success" size="small" @click="exportPersonnelData" style="margin-left: 10px;">导出</el-button>
1
2025-07-08 10:16:29 +08:00
</div>
</div>
<!-- 角色分布饼图 -->
<div v-if="viewType === 'chart'" class="chart-container" ref="personnelChart"></div>
<!-- 人员分布表格 -->
<div v-if="viewType === 'table'">
<el-table
:data="filteredPersonnelTableData"
border
style="width: 100%">
<el-table-column
prop="name"
label="姓名"
width="120">
</el-table-column>
<el-table-column
label="角色"
width="180">
<template slot-scope="scope">
<el-tag
v-for="role in scope.row.roles"
:key="role"
:type="getRoleTagType(role)"
class="role-tag">
{{ role }}
</el-tag>
</template>
</el-table-column>
<el-table-column
prop="department"
label="部门">
</el-table-column>
<el-table-column
prop="startDate"
label="开始时间"
width="120">
</el-table-column>
<el-table-column
prop="endDate"
label="结束时间"
width="120">
</el-table-column>
<el-table-column
prop="progress"
label="进度">
<template slot-scope="scope">
<el-progress :percentage="scope.row.progress" :status="getProgressStatus(scope.row.progress)"></el-progress>
</template>
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="editPersonnel(scope.row)">编辑</el-button>
<el-button type="text" size="small" @click="viewPersonnelDetail(scope.row)">详情</el-button>
</template>
</el-table-column>
</el-table>
</div>
1
2025-07-25 17:57:25 +08:00
<!-- 人员甘特图 -->
<div v-if="viewType === 'gantt'" class="chart-container" ref="personnelGanttChart"></div>
1
2025-07-08 10:16:29 +08:00
</el-card>
</div>
<div v-else style="text-align: center; padding: 50px 0;">
<el-empty description="请选择一个项目查看人员分布"></el-empty>
</div>
</div>
</el-tab-pane>
1
2025-07-25 17:57:25 +08:00
<!-- 设备管理模块 -->
<el-tab-pane label="设备管理" name="equipment">
<div class="tab-content">
<el-tabs v-model="activeEquipmentTab">
<el-tab-pane label="设备调配" name="dispatch">
<div class="filter-container">
<el-form :inline="true" :model="equipmentQuery" class="demo-form-inline">
<el-form-item label="项目选择">
<el-select v-model="equipmentQuery.project" placeholder="请选择项目" clearable>
<el-option
v-for="item in projectOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="设备类型">
<el-select v-model="equipmentQuery.type" placeholder="请选择设备类型" clearable>
<el-option
v-for="item in equipmentTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="设备状态">
<el-select v-model="equipmentQuery.status" placeholder="请选择状态" clearable>
<el-option
v-for="item in equipmentStatusOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="fetchEquipmentData">查询</el-button>
<el-button @click="resetEquipmentQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<el-card class="project-card">
<div slot="header" class="project-header">
<span>设备列表</span>
<div>
<el-button type="primary" size="small" @click="showEquipmentDialog">新增设备</el-button>
<el-button type="success" size="small" @click="exportEquipmentData" style="margin-left: 10px;">导出</el-button>
</div>
</div>
<el-table
:data="filteredEquipmentData"
border
style="width: 100%">
<el-table-column
prop="name"
label="设备名称"
width="180">
</el-table-column>
<el-table-column
prop="type"
label="设备类型"
width="120">
</el-table-column>
<el-table-column
prop="model"
label="型号"
width="150">
</el-table-column>
<el-table-column
prop="serialNumber"
label="序列号"
width="150">
</el-table-column>
<el-table-column
label="状态"
width="120">
<template slot-scope="scope">
<div class="equipment-status">
<div :class="['status-indicator', getStatusClass(scope.row.status)]"></div>
{{ scope.row.status }}
</div>
</template>
</el-table-column>
<el-table-column
prop="currentUser"
label="当前使用人">
</el-table-column>
<el-table-column
prop="currentProject"
label="所属项目">
</el-table-column>
<el-table-column
label="操作"
width="220">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewEquipmentDetail(scope.row)">详情</el-button>
<el-button type="text" size="small" @click="editEquipment(scope.row)">编辑</el-button>
<el-button
type="text"
size="small"
@click="scope.row.status === '可用' ? borrowEquipment(scope.row) : returnEquipment(scope.row)"
:disabled="scope.row.status === '维修中' || scope.row.status === '报废'">
{{ scope.row.status === '可用' ? '领用' : '归还' }}
</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-tab-pane>
<el-tab-pane label="设备统计" name="statistics">
<div class="chart-container" ref="equipmentStatisticsChart"></div>
</el-tab-pane>
<el-tab-pane label="维护记录" name="maintenance">
<div class="filter-container">
<el-form :inline="true" :model="maintenanceQuery" class="demo-form-inline">
<el-form-item label="设备名称">
<el-select v-model="maintenanceQuery.equipment" placeholder="请选择设备" clearable filterable>
<el-option
v-for="item in equipmentOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="维护类型">
<el-select v-model="maintenanceQuery.type" placeholder="请选择维护类型" clearable>
<el-option
v-for="item in maintenanceTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="时间范围">
<el-date-picker
v-model="maintenanceQuery.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="fetchMaintenanceData">查询</el-button>
<el-button @click="resetMaintenanceQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<el-card class="project-card">
<div slot="header" class="project-header">
<span>维护记录</span>
<div>
<el-button type="primary" size="small" @click="showMaintenanceDialog">新增记录</el-button>
<el-button type="success" size="small" @click="exportMaintenanceData" style="margin-left: 10px;">导出</el-button>
</div>
</div>
<el-table
:data="filteredMaintenanceData"
border
style="width: 100%">
<el-table-column
prop="equipmentName"
label="设备名称"
width="180">
</el-table-column>
<el-table-column
prop="type"
label="维护类型"
width="120">
</el-table-column>
<el-table-column
prop="date"
label="维护日期"
width="150">
</el-table-column>
<el-table-column
prop="maintainer"
label="维护人">
</el-table-column>
<el-table-column
prop="cost"
label="费用(元)"
width="120">
</el-table-column>
<el-table-column
prop="result"
label="结果">
<template slot-scope="scope">
<el-tag :type="scope.row.result === '正常' ? 'success' : 'danger'">
{{ scope.row.result }}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewMaintenanceDetail(scope.row)">详情</el-button>
<el-button type="text" size="small" @click="editMaintenance(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-tab-pane>
</el-tabs>
</div>
</el-tab-pane>
<!-- 安全管理模块 -->
1
2025-07-08 10:16:29 +08:00
<el-tab-pane label="安全管理" name="safety">
<div class="tab-content">
<el-collapse v-model="activeSafetyCollapse">
<el-collapse-item title="安全会议管理" name="meeting">
<div>
<el-button type="primary" @click="showSafetyMeetingDialog" style="margin-bottom: 15px;">新增安全会议</el-button>
<el-table
:data="safetyMeetings"
border
style="width: 100%">
<el-table-column
prop="title"
label="会议主题"
width="200">
</el-table-column>
<el-table-column
prop="date"
label="会议时间"
width="180">
</el-table-column>
<el-table-column
prop="organizer"
label="组织者">
</el-table-column>
<el-table-column
prop="participants"
label="参与人数">
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewSafetyMeeting(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editSafetyMeeting(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="风险点管控" name="risk">
<div>
<el-button type="primary" @click="showRiskDialog" style="margin-bottom: 15px;">新增风险点</el-button>
<el-table
:data="riskPoints"
border
style="width: 100%">
<el-table-column
prop="name"
label="风险点名称"
width="200">
</el-table-column>
<el-table-column
prop="project"
label="所属项目">
</el-table-column>
<el-table-column
prop="level"
label="风险等级">
<template slot-scope="scope">
<el-tag :type="getRiskTagType(scope.row.level)">
{{ scope.row.level }}
</el-tag>
</template>
</el-table-column>
<el-table-column
prop="manager"
label="责任人">
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewRiskDetail(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editRiskPoint(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="安全培训与考试" name="training">
<div>
<el-button type="primary" @click="showTrainingDialog" style="margin-bottom: 15px;">新增培训计划</el-button>
<el-table
:data="trainings"
border
style="width: 100%">
<el-table-column
prop="title"
label="培训主题"
width="200">
</el-table-column>
<el-table-column
prop="type"
label="培训类型">
</el-table-column>
<el-table-column
prop="date"
label="培训时间"
width="180">
</el-table-column>
<el-table-column
prop="participants"
label="参与人数">
</el-table-column>
<el-table-column
label="状态">
<template slot-scope="scope">
<el-tag :type="scope.row.status === '已完成' ? 'success' : 'warning'">
{{ scope.row.status }}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewTrainingDetail(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editTraining(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="工艺流程安全控制" name="process">
<div>
<el-button type="primary" @click="showProcessDialog" style="margin-bottom: 15px;">新增工艺流程</el-button>
<el-table
:data="processControls"
border
style="width: 100%">
<el-table-column
prop="name"
label="流程名称"
width="200">
</el-table-column>
<el-table-column
prop="project"
label="所属项目">
</el-table-column>
<el-table-column
prop="riskPoints"
label="风险点数量">
</el-table-column>
<el-table-column
prop="manager"
label="责任人">
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewProcessDetail(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editProcessControl(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
</el-collapse>
</div>
</el-tab-pane>
1
2025-07-25 17:57:25 +08:00
<!-- 质量管理模块 -->
1
2025-07-08 10:16:29 +08:00
<el-tab-pane label="质量管理" name="quality">
<div class="tab-content">
<el-collapse v-model="activeQualityCollapse">
<el-collapse-item title="质量会议管理" name="meeting">
<div>
<el-button type="primary" @click="showQualityMeetingDialog" style="margin-bottom: 15px;">新增质量会议</el-button>
<el-table
:data="qualityMeetings"
border
style="width: 100%">
<el-table-column
prop="title"
label="会议主题"
width="200">
</el-table-column>
<el-table-column
prop="date"
label="会议时间"
width="180">
</el-table-column>
<el-table-column
prop="organizer"
label="组织者">
</el-table-column>
<el-table-column
prop="participants"
label="参与人数">
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewQualityMeeting(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editQualityMeeting(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="数据质量管理" name="data">
<div>
<el-button type="primary" @click="showDataQualityDialog" style="margin-bottom: 15px;">新增数据质量检查</el-button>
<el-table
:data="dataQualityChecks"
border
style="width: 100%">
<el-table-column
prop="project"
label="项目名称"
width="200">
</el-table-column>
<el-table-column
prop="dataType"
label="数据类型">
</el-table-column>
<el-table-column
prop="checker"
label="检查人">
</el-table-column>
<el-table-column
prop="checkDate"
label="检查时间"
width="180">
</el-table-column>
<el-table-column
prop="result"
label="检查结果">
<template slot-scope="scope">
<el-tag :type="scope.row.result === '合格' ? 'success' : 'danger'">
{{ scope.row.result }}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewDataQualityDetail(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editDataQualityCheck(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="质量标准管理" name="standard">
<div>
<el-button type="primary" @click="showQualityStandardDialog" style="margin-bottom: 15px;">新增质量标准</el-button>
<el-table
:data="qualityStandards"
border
style="width: 100%">
<el-table-column
prop="name"
label="标准名称"
width="200">
</el-table-column>
<el-table-column
prop="type"
label="标准类型">
</el-table-column>
<el-table-column
prop="version"
label="版本号">
</el-table-column>
<el-table-column
prop="publishDate"
label="发布时间"
width="180">
</el-table-column>
<el-table-column
prop="manager"
label="负责人">
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewQualityStandard(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editQualityStandard(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
<el-collapse-item title="报告质量管理" name="report">
<div>
<el-button type="primary" @click="showReportQualityDialog" style="margin-bottom: 15px;">新增报告检查</el-button>
<el-table
:data="reportQualityChecks"
border
style="width: 100%">
<el-table-column
prop="project"
label="项目名称"
width="200">
</el-table-column>
<el-table-column
prop="reportType"
label="报告类型">
</el-table-column>
<el-table-column
prop="checker"
label="检查人">
</el-table-column>
<el-table-column
prop="checkDate"
label="检查时间"
width="180">
</el-table-column>
<el-table-column
prop="result"
label="检查结果">
<template slot-scope="scope">
<el-tag :type="scope.row.result === '合格' ? 'success' : 'danger'">
{{ scope.row.result }}
</el-tag>
</template>
</el-table-column>
<el-table-column
label="操作"
width="150">
<template slot-scope="scope">
<el-button type="text" size="small" @click="viewReportQualityDetail(scope.row)">查看</el-button>
<el-button type="text" size="small" @click="editReportQualityCheck(scope.row)">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-collapse-item>
</el-collapse>
</div>
</el-tab-pane>
</el-tabs>
<!-- 人员分布图对话框 -->
<el-dialog :title="personnelDialogTitle" :visible.sync="personnelDialogVisible" width="50%">
<el-form :model="personnelForm" label-width="100px">
<el-form-item label="人员姓名">
<el-select v-model="personnelForm.name" placeholder="请选择人员" filterable>
<el-option
v-for="item in employeeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="所属项目">
<el-select v-model="personnelForm.project" placeholder="请选择项目" disabled>
<el-option
v-for="item in projectOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="角色">
<el-select v-model="personnelForm.roles" multiple placeholder="请选择角色">
<el-option
v-for="item in roleOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="部门">
<el-input v-model="personnelForm.department"></el-input>
</el-form-item>
<el-form-item label="工作时间">
<el-date-picker
v-model="personnelForm.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="工作进度">
<el-input-number v-model="personnelForm.progress" :min="0" :max="100"></el-input-number> %
</el-form-item>
<el-form-item label="工作内容">
<el-input type="textarea" v-model="personnelForm.description"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="personnelDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="savePersonnel">确 定</el-button>
</span>
</el-dialog>
<!-- 人员详情对话框 -->
<el-dialog title="人员安排详情" :visible.sync="personnelDetailVisible" width="50%">
<el-descriptions :column="1" border>
<el-descriptions-item label="姓名">{{ currentPersonnel.name }}</el-descriptions-item>
<el-descriptions-item label="项目">{{ currentPersonnel.project }}</el-descriptions-item>
<el-descriptions-item label="角色">
<el-tag
v-for="role in currentPersonnel.roles"
:key="role"
:type="getRoleTagType(role)"
class="role-tag">
{{ role }}
</el-tag>
</el-descriptions-item>
<el-descriptions-item label="部门">{{ currentPersonnel.department }}</el-descriptions-item>
<el-descriptions-item label="工作时间">{{ currentPersonnel.startDate }} 至 {{ currentPersonnel.endDate }}</el-descriptions-item>
<el-descriptions-item label="工作进度">
<el-progress :percentage="currentPersonnel.progress" :status="getProgressStatus(currentPersonnel.progress)"></el-progress>
</el-descriptions-item>
<el-descriptions-item label="工作内容">{{ currentPersonnel.description || '无' }}</el-descriptions-item>
</el-descriptions>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="personnelDetailVisible = false">关 闭</el-button>
</span>
</el-dialog>
1
2025-07-25 17:57:25 +08:00
<!-- 设备管理对话框 -->
<el-dialog :title="equipmentDialogTitle" :visible.sync="equipmentDialogVisible" width="50%">
<el-form :model="equipmentForm" label-width="100px">
<el-form-item label="设备名称" required>
<el-input v-model="equipmentForm.name"></el-input>
</el-form-item>
<el-form-item label="设备类型" required>
<el-select v-model="equipmentForm.type" placeholder="请选择设备类型">
<el-option
v-for="item in equipmentTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="型号">
<el-input v-model="equipmentForm.model"></el-input>
</el-form-item>
<el-form-item label="序列号">
<el-input v-model="equipmentForm.serialNumber"></el-input>
</el-form-item>
<el-form-item label="购买日期">
<el-date-picker
v-model="equipmentForm.purchaseDate"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="价格(元)">
<el-input-number v-model="equipmentForm.price" :min="0" :precision="2"></el-input-number>
</el-form-item>
<el-form-item label="供应商">
<el-input v-model="equipmentForm.supplier"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="equipmentForm.status" placeholder="请选择状态">
<el-option
v-for="item in equipmentStatusOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="equipmentForm.remark"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="equipmentDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="saveEquipment">确 定</el-button>
</span>
</el-dialog>
<!-- 设备详情对话框 -->
<el-dialog title="设备详情" :visible.sync="equipmentDetailVisible" width="50%">
<el-descriptions :column="1" border>
<el-descriptions-item label="设备名称">{{ currentEquipment.name }}</el-descriptions-item>
<el-descriptions-item label="设备类型">{{ currentEquipment.type }}</el-descriptions-item>
<el-descriptions-item label="型号">{{ currentEquipment.model || '无' }}</el-descriptions-item>
<el-descriptions-item label="序列号">{{ currentEquipment.serialNumber || '无' }}</el-descriptions-item>
<el-descriptions-item label="购买日期">{{ currentEquipment.purchaseDate || '无' }}</el-descriptions-item>
<el-descriptions-item label="价格(元)">{{ currentEquipment.price || '无' }}</el-descriptions-item>
<el-descriptions-item label="供应商">{{ currentEquipment.supplier || '无' }}</el-descriptions-item>
<el-descriptions-item label="状态">
<div class="equipment-status">
<div :class="['status-indicator', getStatusClass(currentEquipment.status)]"></div>
{{ currentEquipment.status }}
</div>
</el-descriptions-item>
<el-descriptions-item label="当前使用人">{{ currentEquipment.currentUser || '无' }}</el-descriptions-item>
<el-descriptions-item label="所属项目">{{ currentEquipment.currentProject || '无' }}</el-descriptions-item>
<el-descriptions-item label="备注">{{ currentEquipment.remark || '无' }}</el-descriptions-item>
</el-descriptions>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="equipmentDetailVisible = false">关 闭</el-button>
</span>
</el-dialog>
<!-- 设备领用对话框 -->
<el-dialog title="设备领用" :visible.sync="borrowDialogVisible" width="50%">
<el-form :model="borrowForm" label-width="100px">
<el-form-item label="设备名称">
<el-input v-model="borrowForm.equipmentName" disabled></el-input>
</el-form-item>
<el-form-item label="领用人" required>
<el-select v-model="borrowForm.user" placeholder="请选择领用人">
<el-option
v-for="item in employeeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="项目" required>
<el-select v-model="borrowForm.project" placeholder="请选择项目">
<el-option
v-for="item in projectOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="预计归还日期" required>
<el-date-picker
v-model="borrowForm.returnDate"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="领用原因">
<el-input type="textarea" v-model="borrowForm.reason"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="borrowDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmBorrow">确 定</el-button>
</span>
</el-dialog>
<!-- 设备归还对话框 -->
<el-dialog title="设备归还" :visible.sync="returnDialogVisible" width="50%">
<el-form :model="returnForm" label-width="100px">
<el-form-item label="设备名称">
<el-input v-model="returnForm.equipmentName" disabled></el-input>
</el-form-item>
<el-form-item label="归还人">
<el-input v-model="returnForm.user" disabled></el-input>
</el-form-item>
<el-form-item label="项目">
<el-input v-model="returnForm.project" disabled></el-input>
</el-form-item>
<el-form-item label="实际归还日期" required>
<el-date-picker
v-model="returnForm.returnDate"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="设备状态" required>
<el-select v-model="returnForm.status" placeholder="请选择设备状态">
<el-option
v-for="item in equipmentStatusOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="归还备注">
<el-input type="textarea" v-model="returnForm.remark"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="returnDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmReturn">确 定</el-button>
</span>
</el-dialog>
<!-- 维护记录对话框 -->
<el-dialog :title="maintenanceDialogTitle" :visible.sync="maintenanceDialogVisible" width="50%">
<el-form :model="maintenanceForm" label-width="100px">
<el-form-item label="设备名称" required>
<el-select v-model="maintenanceForm.equipmentId" placeholder="请选择设备" filterable>
<el-option
v-for="item in equipmentOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="维护类型" required>
<el-select v-model="maintenanceForm.type" placeholder="请选择维护类型">
<el-option
v-for="item in maintenanceTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="维护日期" required>
<el-date-picker
v-model="maintenanceForm.date"
type="date"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="维护人" required>
<el-select v-model="maintenanceForm.maintainer" placeholder="请选择维护人">
<el-option
v-for="item in employeeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="维护内容" required>
<el-input type="textarea" v-model="maintenanceForm.content"></el-input>
</el-form-item>
<el-form-item label="维护结果" required>
<el-select v-model="maintenanceForm.result" placeholder="请选择维护结果">
<el-option label="正常" value="正常"></el-option>
<el-option label="异常" value="异常"></el-option>
</el-select>
</el-form-item>
<el-form-item label="维护费用(元)">
<el-input-number v-model="maintenanceForm.cost" :min="0" :precision="2"></el-input-number>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="maintenanceForm.remark"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="maintenanceDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="saveMaintenance">确 定</el-button>
</span>
</el-dialog>
<!-- 维护记录详情对话框 -->
<el-dialog title="维护记录详情" :visible.sync="maintenanceDetailVisible" width="50%">
<el-descriptions :column="1" border>
<el-descriptions-item label="设备名称">{{ currentMaintenance.equipmentName }}</el-descriptions-item>
<el-descriptions-item label="维护类型">{{ currentMaintenance.type }}</el-descriptions-item>
<el-descriptions-item label="维护日期">{{ currentMaintenance.date }}</el-descriptions-item>
<el-descriptions-item label="维护人">{{ currentMaintenance.maintainer }}</el-descriptions-item>
<el-descriptions-item label="维护内容">{{ currentMaintenance.content }}</el-descriptions-item>
<el-descriptions-item label="维护结果">
<el-tag :type="currentMaintenance.result === '正常' ? 'success' : 'danger'">
{{ currentMaintenance.result }}
</el-tag>
</el-descriptions-item>
<el-descriptions-item label="维护费用(元)">{{ currentMaintenance.cost || '无' }}</el-descriptions-item>
<el-descriptions-item label="备注">{{ currentMaintenance.remark || '无' }}</el-descriptions-item>
</el-descriptions>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="maintenanceDetailVisible = false">关 闭</el-button>
</span>
</el-dialog>
<!-- 安全会议对话框 -->
1
2025-07-08 10:16:29 +08:00
<el-dialog :title="safetyMeetingDialogTitle" :visible.sync="safetyMeetingDialogVisible" width="50%">
<el-form :model="safetyMeetingForm" label-width="100px">
<el-form-item label="会议主题">
<el-input v-model="safetyMeetingForm.title"></el-input>
</el-form-item>
<el-form-item label="会议时间">
<el-date-picker
v-model="safetyMeetingForm.date"
type="datetime"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="组织者">
<el-input v-model="safetyMeetingForm.organizer"></el-input>
</el-form-item>
<el-form-item label="参与人员">
<el-select
v-model="safetyMeetingForm.participants"
multiple
placeholder="请选择参与人员">
<el-option
v-for="item in employeeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="会议内容">
<el-input type="textarea" v-model="safetyMeetingForm.content"></el-input>
</el-form-item>
<el-form-item label="会议记录">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="safetyMeetingForm.files">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">可上传会议记录文档或图片</div>
</el-upload>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="safetyMeetingDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="saveSafetyMeeting">确 定</el-button>
</span>
</el-dialog>
1
2025-07-25 17:57:25 +08:00
<!-- 质量会议对话框 -->
1
2025-07-08 10:16:29 +08:00
<el-dialog :title="qualityMeetingDialogTitle" :visible.sync="qualityMeetingDialogVisible" width="50%">
<el-form :model="qualityMeetingForm" label-width="100px">
<el-form-item label="会议主题">
<el-input v-model="qualityMeetingForm.title"></el-input>
</el-form-item>
<el-form-item label="会议时间">
<el-date-picker
v-model="qualityMeetingForm.date"
type="datetime"
placeholder="选择日期时间">
</el-date-picker>
</el-form-item>
<el-form-item label="组织者">
<el-input v-model="qualityMeetingForm.organizer"></el-input>
</el-form-item>
<el-form-item label="参与人员">
<el-select
v-model="qualityMeetingForm.participants"
multiple
placeholder="请选择参与人员">
<el-option
v-for="item in employeeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="会议内容">
<el-input type="textarea" v-model="qualityMeetingForm.content"></el-input>
</el-form-item>
<el-form-item label="会议记录">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="qualityMeetingForm.files">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">可上传会议记录文档或图片</div>
</el-upload>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="qualityMeetingDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="saveQualityMeeting">确 定</el-button>
</span>
</el-dialog>
</div>
<script>
new Vue({
el: '#app',
data() {
return {
1
2025-07-25 17:57:25 +08:00
activeTab: 'dashboard',
1
2025-07-08 10:16:29 +08:00
viewType: 'chart',
1
2025-07-25 17:57:25 +08:00
activeEquipmentTab: 'dispatch',
// 当前用户信息 (模拟)
currentUser: {
name: '李四',
roles: ['安全经理'],
department: '安全管理部'
},
// 个人工作台数据
currentProjects: [
{ id: 'project1', name: '风电塔下检测项目', role: '安全经理', progress: 80 },
{ id: 'project3', name: '光伏巡检项目', role: '安全顾问', progress: 75 }
],
pendingTasks: [
{ id: 'task1', name: '安全巡检', project: '风电塔下检测项目', deadline: '2023-07-15', priority: '高' },
{ id: 'task2', name: '安全培训', project: '光伏巡检项目', deadline: '2023-07-20', priority: '中' },
{ id: 'task3', name: '风险评估', project: '风电塔下检测项目', deadline: '2023-07-25', priority: '低' }
],
myEquipment: [
{ id: 'equip1', name: '红外热像仪', type: '检测设备', project: '风电塔下检测项目', status: '使用中', borrowDate: '2023-06-01', returnDate: '2023-08-31' },
{ id: 'equip2', name: '安全绳套装', type: '安全设备', project: '风电塔下检测项目', status: '使用中', borrowDate: '2023-06-01', returnDate: '2023-08-31' }
],
1
2025-07-08 10:16:29 +08:00
// 人员分布图数据
personnelQuery: {
project: '',
role: [],
dateRange: ''
},
projectOptions: [
{ value: 'project1', label: '风电塔下检测项目' },
{ value: 'project2', label: '叶片维修项目' },
{ value: 'project3', label: '光伏巡检项目' },
{ value: 'project4', label: '大坝裂缝检测项目' }
],
selectedProject: null,
projects: [
{
id: 'project1',
name: '风电塔下检测项目',
personnel: [
{
id: 'p1-1',
name: '张三',
roles: ['项目经理'],
department: '项目管理部',
startDate: '2023-06-01',
endDate: '2023-08-31',
progress: 65,
description: '负责项目整体管理和协调工作'
},
{
id: 'p1-2',
name: '李四',
roles: ['安全经理'],
department: '安全管理部',
startDate: '2023-06-01',
endDate: '2023-08-31',
progress: 80,
description: '负责项目安全管理和风险控制'
},
{
id: 'p1-3',
name: '王五',
roles: ['施工人员'],
department: '施工部',
startDate: '2023-06-15',
endDate: '2023-07-15',
progress: 100,
description: '负责现场检测工作'
},
{
id: 'p1-4',
name: '赵六',
roles: ['质量经理'],
department: '质量管理部',
startDate: '2023-06-01',
endDate: '2023-08-31',
progress: 70,
description: '负责项目质量监督和检查'
}
]
},
{
id: 'project2',
name: '叶片维修项目',
personnel: [
{
id: 'p2-1',
name: '钱七',
roles: ['项目经理'],
department: '项目管理部',
startDate: '2023-07-01',
endDate: '2023-09-30',
progress: 30,
description: '负责项目整体管理和协调工作'
},
{
id: 'p2-2',
name: '孙八',
roles: ['施工人员', '工作组长'],
department: '施工部',
startDate: '2023-07-01',
endDate: '2023-09-30',
progress: 25,
description: '负责现场维修工作和小组管理'
},
{
id: 'p2-3',
name: '周九',
roles: ['项目远程顾问'],
department: '技术部',
startDate: '2023-07-01',
endDate: '2023-09-30',
progress: 40,
description: '提供远程技术支持和咨询'
}
]
},
{
id: 'project3',
name: '光伏巡检项目',
personnel: [
{
id: 'p3-1',
name: '吴十',
roles: ['项目经理'],
department: '项目管理部',
startDate: '2023-06-20',
endDate: '2023-07-20',
progress: 80,
description: '负责项目整体管理和协调工作'
},
{
id: 'p3-2',
name: '郑十一',
roles: ['施工人员'],
department: '施工部',
startDate: '2023-06-20',
endDate: '2023-07-20',
progress: 85,
description: '负责现场巡检工作'
},
{
id: 'p3-3',
name: '王十二',
roles: ['现场经理'],
department: '施工部',
startDate: '2023-06-20',
endDate: '2023-07-20',
progress: 75,
description: '负责现场管理和协调'
}
]
},
{
id: 'project4',
name: '大坝裂缝检测项目',
personnel: [
{
id: 'p4-1',
name: '冯十三',
roles: ['项目经理'],
department: '项目管理部',
startDate: '2023-07-10',
endDate: '2023-08-10',
progress: 10,
description: '负责项目整体管理和协调工作'
},
{
id: 'p4-2',
name: '陈十四',
roles: ['施工人员'],
department: '施工部',
startDate: '2023-07-10',
endDate: '2023-08-10',
progress: 5,
description: '负责现场检测工作'
},
{
id: 'p4-3',
name: '褚十五',
roles: ['安全经理'],
department: '安全管理部',
startDate: '2023-07-10',
endDate: '2023-08-10',
progress: 15,
description: '负责项目安全管理和风险控制'
}
]
}
],
roleOptions: [
{ value: '施工人员', label: '施工人员' },
{ value: '安全经理', label: '安全经理' },
{ value: '项目经理', label: '项目经理' },
{ value: '商务', label: '商务' },
{ value: '财务', label: '财务' },
{ value: '高级管理员', label: '高级管理员' },
{ value: '项目远程顾问', label: '项目远程顾问' },
{ value: '质量经理', label: '质量经理' },
{ value: '现场经理', label: '现场经理' },
{ value: '工作组长', label: '工作组长' }
],
employeeOptions: [
{ value: '张三', label: '张三' },
{ value: '李四', label: '李四' },
{ value: '王五', label: '王五' },
{ value: '赵六', label: '赵六' },
{ value: '钱七', label: '钱七' },
{ value: '孙八', label: '孙八' },
{ value: '周九', label: '周九' },
{ value: '吴十', label: '吴十' },
{ value: '郑十一', label: '郑十一' },
{ value: '王十二', label: '王十二' },
{ value: '冯十三', label: '冯十三' },
{ value: '陈十四', label: '陈十四' },
{ value: '褚十五', label: '褚十五' }
],
personnelDialogVisible: false,
personnelDialogTitle: '新增人员安排',
personnelForm: {
id: '',
name: '',
project: '',
roles: [],
department: '',
dateRange: '',
progress: 0,
description: ''
},
personnelDetailVisible: false,
currentPersonnel: {},
1
2025-07-25 17:57:25 +08:00
// 设备管理数据
equipmentQuery: {
project: '',
type: '',
status: ''
},
equipmentTypeOptions: [
{ value: '检测设备', label: '检测设备' },
{ value: '维修设备', label: '维修设备' },
{ value: '安全设备', label: '安全设备' },
{ value: '办公设备', label: '办公设备' },
{ value: '车辆', label: '车辆' }
],
equipmentStatusOptions: [
{ value: '可用', label: '可用' },
{ value: '使用中', label: '使用中' },
{ value: '维修中', label: '维修中' },
{ value: '报废', label: '报废' }
],
equipmentOptions: [
{ value: 'equip1', label: '红外热像仪' },
{ value: 'equip2', label: '安全绳套装' },
{ value: 'equip3', label: '叶片内窥镜' },
{ value: 'equip4', label: '防雷测试仪' },
{ value: 'equip5', label: '高空作业车' }
],
equipmentList: [
{
id: 'equip1',
name: '红外热像仪',
type: '检测设备',
model: 'FLIR T1020',
serialNumber: 'IR2023001',
purchaseDate: '2023-01-15',
price: 125000,
supplier: 'FLIR公司',
status: '使用中',
currentUser: '李四',
currentProject: '风电塔下检测项目',
remark: '用于检测叶片内部温度分布'
},
{
id: 'equip2',
name: '安全绳套装',
type: '安全设备',
model: '3M DBI-SALA',
serialNumber: 'SA2023001',
purchaseDate: '2023-01-20',
price: 5800,
supplier: '3M公司',
status: '使用中',
currentUser: '李四',
currentProject: '风电塔下检测项目',
remark: '高空作业必备安全装备'
},
{
id: 'equip3',
name: '叶片内窥镜',
type: '检测设备',
model: 'Olympus IPLEX GX/GT',
serialNumber: 'EN2023001',
purchaseDate: '2023-02-10',
price: 98000,
supplier: '奥林巴斯',
status: '可用',
currentUser: '',
currentProject: '',
remark: '用于检查叶片内部结构'
},
{
id: 'equip4',
name: '防雷测试仪',
type: '检测设备',
model: 'FLUKE 1653',
serialNumber: 'LT2023001',
purchaseDate: '2023-03-05',
price: 32000,
supplier: '福禄克',
status: '使用中',
currentUser: '王五',
currentProject: '叶片维修项目',
remark: '用于测试叶片防雷系统导通性'
},
{
id: 'equip5',
name: '高空作业车',
type: '车辆',
model: 'JLG 600S',
serialNumber: 'HV2023001',
purchaseDate: '2023-01-25',
price: 850000,
supplier: 'JLG公司',
status: '维修中',
currentUser: '',
currentProject: '',
remark: '液压系统维修中'
}
],
equipmentDialogVisible: false,
equipmentDialogTitle: '新增设备',
equipmentForm: {
id: '',
name: '',
type: '',
model: '',
serialNumber: '',
purchaseDate: '',
price: 0,
supplier: '',
status: '可用',
remark: ''
},
equipmentDetailVisible: false,
currentEquipment: {},
borrowDialogVisible: false,
borrowForm: {
equipmentId: '',
equipmentName: '',
user: '',
project: '',
returnDate: '',
reason: ''
},
returnDialogVisible: false,
returnForm: {
equipmentId: '',
equipmentName: '',
user: '',
project: '',
returnDate: '',
status: '可用',
remark: ''
},
// 维护记录数据
maintenanceQuery: {
equipment: '',
type: '',
dateRange: ''
},
maintenanceTypeOptions: [
{ value: '日常维护', label: '日常维护' },
{ value: '定期保养', label: '定期保养' },
{ value: '故障维修', label: '故障维修' },
{ value: '校准检测', label: '校准检测' }
],
maintenanceList: [
{
id: 'm1',
equipmentId: 'equip1',
equipmentName: '红外热像仪',
type: '定期保养',
date: '2023-06-15',
maintainer: '张三',
content: '定期清洁镜头，校准温度传感器',
result: '正常',
cost: 1200,
remark: '设备状态良好'
},
{
id: 'm2',
equipmentId: 'equip5',
equipmentName: '高空作业车',
type: '故障维修',
date: '2023-07-01',
maintainer: '李四',
content: '液压系统泄漏维修',
result: '异常',
cost: 8500,
remark: '需要更换液压油管'
},
{
id: 'm3',
equipmentId: 'equip4',
equipmentName: '防雷测试仪',
type: '校准检测',
date: '2023-06-20',
maintainer: '王五',
content: '年度校准检测',
result: '正常',
cost: 2000,
remark: '精度符合标准要求'
}
],
maintenanceDialogVisible: false,
maintenanceDialogTitle: '新增维护记录',
maintenanceForm: {
id: '',
equipmentId: '',
type: '',
date: '',
maintainer: '',
content: '',
result: '正常',
cost: 0,
remark: ''
},
maintenanceDetailVisible: false,
currentMaintenance: {},
// 安全管理数据
1
2025-07-08 10:16:29 +08:00
activeSafetyCollapse: ['meeting', 'risk', 'training', 'process'],
safetyMeetings: [
{ title: '风电项目安全工作会议', date: '2023-06-10 14:00', organizer: '张三', participants: 8 },
{ title: '高空作业安全培训', date: '2023-06-15 09:30', organizer: '李四', participants: 12 },
{ title: '设备使用安全规范', date: '2023-06-20 10:00', organizer: '王五', participants: 10 }
],
riskPoints: [
{ name: '高空坠落风险', project: '风电塔下检测项目', level: '高', manager: '张三' },
{ name: '设备操作风险', project: '叶片维修项目', level: '中', manager: '李四' },
{ name: '电气安全风险', project: '光伏巡检项目', level: '低', manager: '王五' }
],
trainings: [
{ title: '高空作业安全培训', type: '现场培训', date: '2023-06-15', participants: 12, status: '已完成' },
{ title: '设备安全操作培训', type: '在线培训', date: '2023-06-25', participants: 15, status: '进行中' },
{ title: '应急处理培训', type: '现场培训', date: '2023-07-05', participants: 10, status: '未开始' }
],
processControls: [
{ name: '风电塔检测流程', project: '风电塔下检测项目', riskPoints: 3, manager: '张三' },
{ name: '叶片维修流程', project: '叶片维修项目', riskPoints: 5, manager: '李四' },
{ name: '光伏巡检流程', project: '光伏巡检项目', riskPoints: 2, manager: '王五' }
],
safetyMeetingDialogVisible: false,
safetyMeetingDialogTitle: '新增安全会议',
safetyMeetingForm: {
title: '',
date: '',
organizer: '',
participants: [],
content: '',
files: []
},
1
2025-07-25 17:57:25 +08:00
// 质量管理数据
1
2025-07-08 10:16:29 +08:00
activeQualityCollapse: ['meeting', 'data', 'standard', 'report'],
qualityMeetings: [
{ title: '风电项目质量分析会', date: '2023-06-12 14:00', organizer: '张三', participants: 8 },
{ title: '检测数据质量评审', date: '2023-06-18 09:30', organizer: '李四', participants: 6 },
{ title: '维修质量总结会', date: '2023-06-22 10:00', organizer: '王五', participants: 5 }
],
dataQualityChecks: [
{ project: '风电塔下检测项目', dataType: '检测数据', checker: '张三', checkDate: '2023-06-15', result: '合格' },
{ project: '叶片维修项目', dataType: '维修记录', checker: '李四', checkDate: '2023-06-20', result: '不合格' },
{ project: '光伏巡检项目', dataType: '巡检数据', checker: '王五', checkDate: '2023-06-25', result: '合格' }
],
qualityStandards: [
{ name: '风电检测质量标准', type: '检测标准', version: 'V1.0', publishDate: '2023-01-15', manager: '张三' },
{ name: '叶片维修质量标准', type: '维修标准', version: 'V1.2', publishDate: '2023-03-20', manager: '李四' },
{ name: '光伏巡检质量标准', type: '巡检标准', version: 'V2.0', publishDate: '2023-05-10', manager: '王五' }
],
reportQualityChecks: [
{ project: '风电塔下检测项目', reportType: '检测报告', checker: '张三', checkDate: '2023-06-16', result: '合格' },
{ project: '叶片维修项目', reportType: '维修报告', checker: '李四', checkDate: '2023-06-21', result: '合格' },
{ project: '光伏巡检项目', reportType: '巡检报告', checker: '王五', checkDate: '2023-06-26', result: '不合格' }
],
qualityMeetingDialogVisible: false,
qualityMeetingDialogTitle: '新增质量会议',
qualityMeetingForm: {
title: '',
date: '',
organizer: '',
participants: [],
content: '',
files: []
}
}
},
computed: {
personnelTableData() {
if (!this.selectedProject) return [];
return this.selectedProject.personnel;
},
filteredPersonnelTableData() {
let data = this.personnelTableData;
// 按角色筛选
if (this.personnelQuery.role && this.personnelQuery.role.length > 0) {
data = data.filter(item => {
return this.personnelQuery.role.some(role => item.roles.includes(role));
});
}
// 按时间范围筛选
if (this.personnelQuery.dateRange && this.personnelQuery.dateRange.length === 2) {
const startDate = new Date(this.personnelQuery.dateRange[0]);
const endDate = new Date(this.personnelQuery.dateRange[1]);
data = data.filter(item => {
const itemStart = new Date(item.startDate);
const itemEnd = new Date(item.endDate);
return itemStart <= endDate && itemEnd >= startDate;
});
}
1
2025-07-25 17:57:25 +08:00
return data;
},
filteredEquipmentData() {
let data = this.equipmentList;
// 按项目筛选
if (this.equipmentQuery.project) {
data = data.filter(item => item.currentProject === this.equipmentQuery.project);
}
// 按设备类型筛选
if (this.equipmentQuery.type) {
data = data.filter(item => item.type === this.equipmentQuery.type);
}
// 按状态筛选
if (this.equipmentQuery.status) {
data = data.filter(item => item.status === this.equipmentQuery.status);
}
return data;
},
filteredMaintenanceData() {
let data = this.maintenanceList;
// 按设备筛选
if (this.maintenanceQuery.equipment) {
data = data.filter(item => item.equipmentId === this.maintenanceQuery.equipment);
}
// 按维护类型筛选
if (this.maintenanceQuery.type) {
data = data.filter(item => item.type === this.maintenanceQuery.type);
}
// 按时间范围筛选
if (this.maintenanceQuery.dateRange && this.maintenanceQuery.dateRange.length === 2) {
const startDate = new Date(this.maintenanceQuery.dateRange[0]);
const endDate = new Date(this.maintenanceQuery.dateRange[1]);
data = data.filter(item => {
const itemDate = new Date(item.date);
return itemDate >= startDate && itemDate <= endDate;
});
}
1
2025-07-08 10:16:29 +08:00
return data;
}
},
mounted() {
this.initPersonnelChart();
1
2025-07-25 17:57:25 +08:00
this.initPersonalProgressChart();
this.initEquipmentStatisticsChart();
1
2025-07-08 10:16:29 +08:00
},
methods: {
handleTabClick(tab) {
console.log(tab.name);
1
2025-07-25 17:57:25 +08:00
if (tab.name === 'equipment') {
this.$nextTick(() => {
this.initEquipmentStatisticsChart();
});
}
},
// 个人工作台方法
refreshTasks() {
this.$message({
message: '任务列表已刷新',
type: 'success'
});
},
startTask(task) {
this.$message({
message: `开始任务: ${task.name}`,
type: 'success'
});
},
viewProjectDetail(project) {
this.$message({
message: `查看项目详情: ${project.name}`,
type: 'info'
});
},
returnEquipment(equipment) {
this.returnForm = {
equipmentId: equipment.id,
equipmentName: equipment.name,
user: equipment.currentUser,
project: equipment.currentProject,
returnDate: new Date(),
status: '可用',
remark: ''
};
this.returnDialogVisible = true;
},
initPersonalProgressChart() {
const chartDom = this.$refs.personalProgressChart;
if (!chartDom) return;
const myChart = echarts.init(chartDom);
const option = {
title: {
text: '我的工作进度',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['计划进度', '实际进度'],
top: 30
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'value',
boundaryGap: [0, 0.01]
},
yAxis: {
type: 'category',
data: this.currentProjects.map(p => p.name)
},
series: [
{
name: '计划进度',
type: 'bar',
data: this.currentProjects.map(p => Math.min(100, p.progress + 15 + Math.random() * 10))
},
{
name: '实际进度',
type: 'bar',
data: this.currentProjects.map(p => p.progress)
}
]
};
myChart.setOption(option);
window.addEventListener('resize', function() {
myChart.resize();
});
1
2025-07-08 10:16:29 +08:00
},
// 人员分布图方法
handleProjectChange(projectId) {
this.selectedProject = this.projects.find(p => p.id === projectId) || null;
if (this.selectedProject) {
this.personnelForm.project = projectId;
this.initPersonnelChart();
}
},
fetchPersonnelData() {
console.log('查询人员分布数据', this.personnelQuery);
this.$message({
message: '数据加载成功',
type: 'success'
});
this.initPersonnelChart();
},
resetPersonnelQuery() {
this.personnelQuery = {
project: this.personnelQuery.project, // 保留当前项目
role: [],
dateRange: ''
};
},
initPersonnelChart() {
const chartDom = this.$refs.personnelChart;
if (!chartDom || !this.selectedProject) return;
// 按角色统计人员数量
const roleCount = {};
this.roleOptions.forEach(role => {
roleCount[role.value] = 0;
});
this.selectedProject.personnel.forEach(person => {
person.roles.forEach(role => {
if (roleCount.hasOwnProperty(role)) {
roleCount[role]++;
}
});
});
// 过滤掉数量为0的角色
const chartData = Object.entries(roleCount)
.filter(([_, count]) => count > 0)
.map(([role, count]) => ({ value: count, name: role }));
const myChart = echarts.init(chartDom);
const option = {
title: {
text: `${this.selectedProject.name} - 角色分布`,
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
legend: {
orient: 'vertical',
left: 10,
data: chartData.map(item => item.name)
},
series: [
{
name: '角色分布',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '18',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: chartData
}
]
};
myChart.setOption(option);
window.addEventListener('resize', function() {
myChart.resize();
});
},
getRoleTagType(role) {
const roleColors = {
'施工人员': '',
'安全经理': 'danger',
'项目经理': 'primary',
'商务': 'success',
'财务': 'warning',
'高级管理员': 'info',
'项目远程顾问': '',
'质量经理': 'success',
'现场经理': 'primary',
'工作组长': 'warning'
};
return roleColors[role] || '';
},
getProgressStatus(progress) {
if (progress >= 80) return 'success';
if (progress >= 50) return '';
if (progress >= 20) return 'warning';
return 'exception';
},
showPersonnelDialog() {
if (!this.selectedProject) {
this.$message.warning('请先选择项目');
return;
}
this.personnelDialogTitle = '新增人员安排';
this.personnelForm = {
id: '',
name: '',
project: this.selectedProject.id,
roles: [],
department: '',
dateRange: '',
progress: 0,
description: ''
};
this.personnelDialogVisible = true;
},
editPersonnel(row) {
this.personnelDialogTitle = '编辑人员安排';
this.personnelForm = {
id: row.id,
name: row.name,
project: this.selectedProject.id,
roles: [...row.roles],
department: row.department,
dateRange: [row.startDate, row.endDate],
progress: row.progress,
description: row.description
};
this.personnelDialogVisible = true;
},
viewPersonnelDetail(row) {
this.currentPersonnel = { ...row };
this.personnelDetailVisible = true;
},
savePersonnel() {
console.log('保存人员安排', this.personnelForm);
if (!this.personnelForm.name || this.personnelForm.roles.length === 0) {
this.$message.error('请填写完整信息');
return;
}
const personnelData = {
id: this.personnelForm.id || `p-${Date.now()}`,
name: this.personnelForm.name,
roles: this.personnelForm.roles,
department: this.personnelForm.department,
startDate: this.personnelForm.dateRange[0],
endDate: this.personnelForm.dateRange[1],
progress: this.personnelForm.progress,
description: this.personnelForm.description
};
if (this.personnelForm.id) {
// 更新现有人员
const index = this.selectedProject.personnel.findIndex(p => p.id === this.personnelForm.id);
if (index !== -1) {
this.selectedProject.personnel.splice(index, 1, personnelData);
}
} else {
// 新增人员
this.selectedProject.personnel.push(personnelData);
}
this.$message({
message: '保存成功',
type: 'success'
});
this.personnelDialogVisible = false;
this.initPersonnelChart();
},
1
2025-07-25 17:57:25 +08:00
exportPersonnelData() {
this.$message({
message: '导出人员分布数据',
type: 'success'
});
},
// 设备管理方法
fetchEquipmentData() {
console.log('查询设备数据', this.equipmentQuery);
this.$message({
message: '数据加载成功',
type: 'success'
});
},
resetEquipmentQuery() {
this.equipmentQuery = {
project: '',
type: '',
status: ''
};
},
initEquipmentStatisticsChart() {
const chartDom = this.$refs.equipmentStatisticsChart;
if (!chartDom) return;
// 按状态统计设备数量
const statusCount = {
'可用': 0,
'使用中': 0,
'维修中': 0,
'报废': 0
};
this.equipmentList.forEach(equipment => {
statusCount[equipment.status]++;
});
const myChart = echarts.init(chartDom);
const option = {
title: {
text: '设备状态统计',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
legend: {
orient: 'vertical',
left: 10,
data: ['可用', '使用中', '维修中', '报废']
},
series: [
{
name: '设备状态',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '18',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: statusCount['可用'], name: '可用' },
{ value: statusCount['使用中'], name: '使用中' },
{ value: statusCount['维修中'], name: '维修中' },
{ value: statusCount['报废'], name: '报废' }
]
}
]
};
myChart.setOption(option);
window.addEventListener('resize', function() {
myChart.resize();
});
},
getStatusClass(status) {
switch(status) {
case '可用': return 'status-available';
case '使用中': return 'status-in-use';
case '维修中': return 'status-maintenance';
case '报废': return 'status-scrapped';
default: return '';
}
},
showEquipmentDialog() {
this.equipmentDialogTitle = '新增设备';
this.equipmentForm = {
id: '',
name: '',
type: '',
model: '',
serialNumber: '',
purchaseDate: '',
price: 0,
supplier: '',
status: '可用',
remark: ''
};
this.equipmentDialogVisible = true;
},
editEquipment(row) {
this.equipmentDialogTitle = '编辑设备';
this.equipmentForm = { ...row };
this.equipmentDialogVisible = true;
},
viewEquipmentDetail(row) {
this.currentEquipment = { ...row };
this.equipmentDetailVisible = true;
},
saveEquipment() {
console.log('保存设备信息', this.equipmentForm);
if (!this.equipmentForm.name || !this.equipmentForm.type) {
this.$message.error('请填写完整信息');
return;
}
if (this.equipmentForm.id) {
// 更新现有设备
const index = this.equipmentList.findIndex(e => e.id === this.equipmentForm.id);
if (index !== -1) {
this.equipmentList.splice(index, 1, { ...this.equipmentForm });
}
} else {
// 新增设备
this.equipmentForm.id = `equip${this.equipmentList.length + 1}`;
this.equipmentList.push({ ...this.equipmentForm });
}
this.$message({
message: '保存成功',
type: 'success'
});
this.equipmentDialogVisible = false;
this.initEquipmentStatisticsChart();
},
borrowEquipment(row) {
this.borrowForm = {
equipmentId: row.id,
equipmentName: row.name,
user: this.currentUser.name,
project: '',
returnDate: '',
reason: ''
};
this.borrowDialogVisible = true;
},
confirmBorrow() {
console.log('确认领用设备', this.borrowForm);
if (!this.borrowForm.user || !this.borrowForm.project || !this.borrowForm.returnDate) {
this.$message.error('请填写完整信息');
return;
}
const index = this.equipmentList.findIndex(e => e.id === this.borrowForm.equipmentId);
if (index !== -1) {
this.equipmentList[index].status = '使用中';
this.equipmentList[index].currentUser = this.borrowForm.user;
this.equipmentList[index].currentProject = this.borrowForm.project;
// 添加到我的设备列表
this.myEquipment.push({
id: this.borrowForm.equipmentId,
name: this.borrowForm.equipmentName,
type: this.equipmentList[index].type,
project: this.borrowForm.project,
status: '使用中',
borrowDate: new Date().toISOString().split('T')[0],
returnDate: this.borrowForm.returnDate.toISOString().split('T')[0]
});
}
this.$message({
message: '设备领用成功',
type: 'success'
});
this.borrowDialogVisible = false;
this.initEquipmentStatisticsChart();
},
confirmReturn() {
console.log('确认归还设备', this.returnForm);
if (!this.returnForm.returnDate || !this.returnForm.status) {
this.$message.error('请填写完整信息');
return;
}
const index = this.equipmentList.findIndex(e => e.id === this.returnForm.equipmentId);
if (index !== -1) {
this.equipmentList[index].status = this.returnForm.status;
this.equipmentList[index].currentUser = '';
this.equipmentList[index].currentProject = '';
if (this.returnForm.remark) {
this.equipmentList[index].remark = this.returnForm.remark;
}
// 从我的设备列表中移除
const myEquipIndex = this.myEquipment.findIndex(e => e.id === this.returnForm.equipmentId);
if (myEquipIndex !== -1) {
this.myEquipment.splice(myEquipIndex, 1);
}
}
this.$message({
message: '设备归还成功',
type: 'success'
});
this.returnDialogVisible = false;
this.initEquipmentStatisticsChart();
},
exportEquipmentData() {
this.$message({
message: '导出设备数据',
type: 'success'
});
},
// 维护记录方法
fetchMaintenanceData() {
console.log('查询维护记录', this.maintenanceQuery);
this.$message({
message: '数据加载成功',
type: 'success'
});
},
resetMaintenanceQuery() {
this.maintenanceQuery = {
equipment: '',
type: '',
dateRange: ''
};
},
showMaintenanceDialog() {
this.maintenanceDialogTitle = '新增维护记录';
this.maintenanceForm = {
id: '',
equipmentId: '',
type: '',
date: '',
maintainer: '',
content: '',
result: '正常',
cost: 0,
remark: ''
};
this.maintenanceDialogVisible = true;
},
editMaintenance(row) {
this.maintenanceDialogTitle = '编辑维护记录';
this.maintenanceForm = { ...row };
this.maintenanceDialogVisible = true;
},
viewMaintenanceDetail(row) {
this.currentMaintenance = { ...row };
this.maintenanceDetailVisible = true;
},
saveMaintenance() {
console.log('保存维护记录', this.maintenanceForm);
if (!this.maintenanceForm.equipmentId || !this.maintenanceForm.type ||
!this.maintenanceForm.date || !this.maintenanceForm.maintainer ||
!this.maintenanceForm.content || !this.maintenanceForm.result) {
this.$message.error('请填写完整信息');
return;
}
const equipment = this.equipmentList.find(e => e.id === this.maintenanceForm.equipmentId);
if (!equipment) {
this.$message.error('未找到相关设备');
return;
}
if (this.maintenanceForm.id) {
// 更新现有记录
const index = this.maintenanceList.findIndex(m => m.id === this.maintenanceForm.id);
if (index !== -1) {
this.maintenanceList.splice(index, 1, {
...this.maintenanceForm,
equipmentName: equipment.name
});
}
} else {
// 新增记录
this.maintenanceForm.id = `m${this.maintenanceList.length + 1}`;
this.maintenanceList.push({
...this.maintenanceForm,
equipmentName: equipment.name
});
// 如果维护结果是异常，更新设备状态
if (this.maintenanceForm.result === '异常') {
equipment.status = '维修中';
}
}
this.$message({
message: '保存成功',
type: 'success'
});
this.maintenanceDialogVisible = false;
},
exportMaintenanceData() {
this.$message({
message: '导出维护记录数据',
type: 'success'
});
},
1
2025-07-08 10:16:29 +08:00
1
2025-07-25 17:57:25 +08:00
// 安全管理方法
1
2025-07-08 10:16:29 +08:00
getRiskTagType(level) {
switch(level) {
case '高': return 'danger';
case '中': return 'warning';
case '低': return 'success';
default: return '';
}
},
showSafetyMeetingDialog() {
this.safetyMeetingDialogTitle = '新增安全会议';
this.safetyMeetingForm = {
title: '',
date: '',
organizer: '',
participants: [],
content: '',
files: []
};
this.safetyMeetingDialogVisible = true;
},
viewSafetyMeeting(row) {
console.log('查看安全会议', row);
this.$message({
message: '查看安全会议详情: ' + row.title,
type: 'info'
});
},
editSafetyMeeting(row) {
this.safetyMeetingDialogTitle = '编辑安全会议';
this.safetyMeetingForm = {
title: row.title,
date: row.date,
organizer: row.organizer,
participants: [],
content: '',
files: []
};
this.safetyMeetingDialogVisible = true;
},
saveSafetyMeeting() {
console.log('保存安全会议', this.safetyMeetingForm);
this.$message({
message: '保存成功',
type: 'success'
});
this.safetyMeetingDialogVisible = false;
},
showRiskDialog() {
this.$message({
message: '打开新增风险点对话框',
type: 'info'
});
},
viewRiskDetail(row) {
this.$message({
message: '查看风险点详情: ' + row.name,
type: 'info'
});
},
editRiskPoint(row) {
this.$message({
message: '编辑风险点: ' + row.name,
type: 'info'
});
},
showTrainingDialog() {
this.$message({
message: '打开新增培训计划对话框',
type: 'info'
});
},
viewTrainingDetail(row) {
this.$message({
message: '查看培训详情: ' + row.title,
type: 'info'
});
},
editTraining(row) {
this.$message({
message: '编辑培训: ' + row.title,
type: 'info'
});
},
showProcessDialog() {
this.$message({
message: '打开新增工艺流程对话框',
type: 'info'
});
},
viewProcessDetail(row) {
this.$message({
message: '查看工艺流程详情: ' + row.name,
type: 'info'
});
},
editProcessControl(row) {
this.$message({
message: '编辑工艺流程: ' + row.name,
type: 'info'
});
},
1
2025-07-25 17:57:25 +08:00
// 质量管理方法
1
2025-07-08 10:16:29 +08:00
showQualityMeetingDialog() {
this.qualityMeetingDialogTitle = '新增质量会议';
this.qualityMeetingForm = {
title: '',
date: '',
organizer: '',
participants: [],
content: '',
files: []
};
this.qualityMeetingDialogVisible = true;
},
viewQualityMeeting(row) {
console.log('查看质量会议', row);
this.$message({
message: '查看质量会议详情: ' + row.title,
type: 'info'
});
},
editQualityMeeting(row) {
this.qualityMeetingDialogTitle = '编辑质量会议';
this.qualityMeetingForm = {
title: row.title,
date: row.date,
organizer: row.organizer,
participants: [],
content: '',
files: []
};
this.qualityMeetingDialogVisible = true;
},
saveQualityMeeting() {
console.log('保存质量会议', this.qualityMeetingForm);
this.$message({
message: '保存成功',
type: 'success'
});
this.qualityMeetingDialogVisible = false;
},
showDataQualityDialog() {
this.$message({
message: '打开新增数据质量检查对话框',
type: 'info'
});
},
viewDataQualityDetail(row) {
this.$message({
message: '查看数据质量检查详情: ' + row.project,
type: 'info'
});
},
editDataQualityCheck(row) {
this.$message({
message: '编辑数据质量检查: ' + row.project,
type: 'info'
});
},
showQualityStandardDialog() {
this.$message({
message: '打开新增质量标准对话框',
type: 'info'
});
},
viewQualityStandard(row) {
this.$message({
message: '查看质量标准详情: ' + row.name,
type: 'info'
});
},
editQualityStandard(row) {
this.$message({
message: '编辑质量标准: ' + row.name,
type: 'info'
});
},
showReportQualityDialog() {
this.$message({
message: '打开新增报告检查对话框',
type: 'info'
});
},
viewReportQualityDetail(row) {
this.$message({
message: '查看报告检查详情: ' + row.project,
type: 'info'
});
},
editReportQualityCheck(row) {
this.$message({
message: '编辑报告检查: ' + row.project,
type: 'info'
});
},
// 通用方法
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }？`);
}
}
});
</script>
</body>
</html>