yuto-water/yuto-water-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Batch 3 - business pages (19 pages)

Browse Source 
Agent Loop: 3 agents, all passed iteration 1
- 7 report/problem pages (flooded/inspection/equipment/supervise/project/construction)
- 6 supervisor+records pages
- 6 equipment+records pages
This commit is contained in:
Ubuntu
2026-06-15 21:18:52 +08:00
parent 7cd91082d6
commit 40869da927
20 changed files with 3170 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
src/views/yxkjzyRecords/detail.vue Normal file
View File

@@ -0,0 +1,200 @@
<script setup lang="ts">
/**
* 有限空间作业记录详情页
*
* 展示有限空间作业的详细信息，包含基本信息、
* 安全条件确认清单、作业审批和参与人员。
*/
import { ref, computed } from 'vue'
import { useRouter, useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()
const detailId = (route.params.detail as string) || '1'
/** 模拟作业记录详情 */
const record = ref({
id: detailId,
title: '污水井清淤作业 2025-0615-01',
location: '城北工业大道12号污水井',
spaceType: '污水井',
status: 'in_progress',
operator: '张作业员',
supervisor: '王监督员',
guardian: '李监护人',
startTime: '2025-06-15 08:00',
endTime: '',
duration: '进行中',
depth: '4.5 m',
diameter: '1.2 m',
oxygenContent: '20.8%',
hazardousGas: '未检出',
temperature: '28°C',
humidity: '65%',
ventilation: '正常',
description: '对城北工业大道12号污水井进行清淤作业，清理井内沉积物，检查井壁结构完整性。',
/** 安全条件确认清单 */
safetyChecklist: [
{ id: 1, item: '作业审批手续是否完备', checked: true, required: true },
{ id: 2, item: '通风设备是否正常运行', checked: true, required: true },
{ id: 3, item: '气体检测是否合格', checked: true, required: true },
{ id: 4, item: '安全绳/安全带是否完好', checked: true, required: true },
{ id: 5, item: '通讯设备是否畅通', checked: true, required: true },
{ id: 6, item: '应急救援设备是否就位', checked: true, required: true },
{ id: 7, item: '人员防护装备是否齐全', checked: true, required: true },
{ id: 8, item: '现场警示标识是否设置', checked: false, required: true },
{ id: 9, item: '现场监护人是否到位', checked: true, required: true },
{ id: 10, item: '作业环境照明是否充足', checked: true, required: false },
],
})
const statusMap: Record<string, string> = {
pending: '待开始',
in_progress: '进行中',
completed: '已完成',
}
const statusColorMap: Record<string, string> = {
pending: 'warning',
in_progress: 'primary',
completed: 'success',
}
/** 安全清单统计 */
const checklistStats = computed(() => {
const total = record.value.safetyChecklist.length
const checked = record.value.safetyChecklist.filter(c => c.checked).length
const required = record.value.safetyChecklist.filter(c => c.required).length
const requiredChecked = record.value.safetyChecklist.filter(c => c.required && c.checked).length
return { total, checked, required, requiredChecked }
})
</script>
<template>
<div class="yxkjzy-detail-page">
<van-nav-bar title="作业记录详情" left-text="返回" left-arrow fixed placeholder @click-left="router.back()" />
<!-- 状态标签 -->
<div class="status-bar">
<van-tag :type="statusColorMap[record.status] as never" size="large">
{{ statusMap[record.status] }}
</van-tag>
</div>
<!-- 基本信息 -->
<van-cell-group title="基本信息" class="info-group">
<van-cell title="作业编号" :value="record.title" />
<van-cell title="作业地点" :value="record.location" />
<van-cell title="空间类型" :value="record.spaceType" />
<van-cell title="作业员" :value="record.operator" />
<van-cell title="监督员" :value="record.supervisor" />
<van-cell title="监护人" :value="record.guardian" />
<van-cell title="开始时间" :value="record.startTime" />
<van-cell title="结束时间" :value="record.endTime || '-'" />
<van-cell title="作业时长" :value="record.duration" />
</van-cell-group>
<!-- 空间参数 -->
<van-cell-group title="空间参数" class="info-group">
<van-cell title="深度" :value="record.depth" />
<van-cell title="直径" :value="record.diameter" />
</van-cell-group>
<!-- 环境监测 -->
<van-cell-group title="环境监测" class="info-group">
<van-cell title="氧气含量" :value="record.oxygenContent" />
<van-cell title="有害气体" :value="record.hazardousGas" />
<van-cell title="温度" :value="record.temperature" />
<van-cell title="湿度" :value="record.humidity" />
<van-cell title="通风状态" :value="record.ventilation" />
</van-cell-group>
<!-- 安全条件确认清单 -->
<van-cell-group :title="`安全条件确认清单 (${checklistStats.requiredChecked}/${checklistStats.required} 必检项)`" class="info-group">
<van-cell v-for="item in record.safetyChecklist" :key="item.id">
<template #title>
<div class="checklist-item">
<van-icon
:name="item.checked ? 'success' : 'close'"
:color="item.checked ? '#4CAF50' : '#F44336'"
size="18"
/>
<span :class="{ 'required-tag': item.required }">{{ item.required ? '【必检】' : '' }}{{ item.item }}</span>
</div>
</template>
<template #value>
<van-tag :type="item.checked ? 'success' : 'danger'" size="medium">
{{ item.checked ? '已确认' : '未确认' }}
</van-tag>
</template>
</van-cell>
</van-cell-group>
<!-- 作业描述 -->
<van-cell-group title="作业描述" class="info-group">
<van-cell>
<p class="desc-text">{{ record.description }}</p>
</van-cell>
</van-cell-group>
<!-- 安全提示 -->
<div class="safety-tips">
<van-notice-bar
left-icon="warning-o"
color="#FF9800"
background="#FFF3E0"
:scrollable="false"
>
有限空间作业必须严格遵守"先通风、再检测、后作业"原则，未确认安全条件不得进入。
</van-notice-bar>
</div>
</div>
</template>
<style lang="scss" scoped>
.yxkjzy-detail-page {
min-height: 100vh;
background: var(--color-bg-page);
padding-bottom: 24px;
:deep(.van-nav-bar) {
background: var(--color-primary);
--van-nav-bar-title-text-color: #fff;
--van-nav-bar-text-color: #fff;
--van-nav-bar-icon-color: #fff;
}
}
.status-bar {
padding: 12px 16px;
background: var(--color-bg-card);
text-align: center;
}
.info-group {
margin-top: 8px;
}
.checklist-item {
display: flex;
align-items: center;
gap: 8px;
.required-tag {
color: var(--color-text-regular);
}
}
.desc-text {
font-size: 14px;
line-height: 1.8;
color: var(--color-text-regular);
padding: 4px 0;
text-indent: 2em;
}
.safety-tips {
margin: 12px 0;
}
</style>

153
src/views/yxkjzyRecords/index.vue Normal file
View File

@@ -0,0 +1,153 @@
<script setup lang="ts">
/**
* 有限空间作业记录列表页
*
* 展示有限空间作业记录，支持搜索和状态筛选（全部/进行中/已完成），
* 点击卡片跳转作业记录详情。
*/
import { ref, computed } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
/** 搜索关键词 */
const searchText = ref('')
/** 当前激活的 Tab */
const activeTab = ref(0)
/** 模拟有限空间作业记录数据 */
const mockRecords = [
{ id: 1, title: '污水井清淤作业 2025-0615-01', location: '城北工业大道12号污水井', status: 'in_progress', operator: '张作业员', startTime: '2025-06-15 08:00', spaceType: '污水井' },
{ id: 2, title: '阀门井维修作业 2025-0614-03', location: '高新区3号阀门井', status: 'completed', operator: '李作业员', startTime: '2025-06-14 14:00', spaceType: '阀门井' },
{ id: 3, title: '蓄水池清洗作业 2025-0615-02', location: '东区蓄水池2号', status: 'in_progress', operator: '王作业员', startTime: '2025-06-15 09:00', spaceType: '蓄水池' },
{ id: 4, title: '管道检修作业 2025-0613-01', location: '商业区地下管廊B段', status: 'completed', operator: '赵作业员', startTime: '2025-06-13 10:00', spaceType: '管廊' },
{ id: 5, title: '检查井勘察作业 2025-0615-04', location: '老城区中山路检查井', status: 'pending', operator: '孙作业员', startTime: '2025-06-15 13:00', spaceType: '检查井' },
{ id: 6, title: '污水井疏通作业 2025-0612-02', location: '南城污水处理厂入口井', status: 'completed', operator: '钱作业员', startTime: '2025-06-12 08:30', spaceType: '污水井' },
]
/** 状态映射 */
const statusMap: Record<string, string> = {
pending: '待开始',
in_progress: '进行中',
completed: '已完成',
}
const statusColorMap: Record<string, string> = {
pending: 'warning',
in_progress: 'primary',
completed: 'success',
}
/** 空间类型图标映射 */
const spaceIconMap: Record<string, string> = {
'污水井': 'orders-o',
'阀门井': 'setting-o',
'蓄水池': 'aim-o',
'管廊': 'guide-o',
'检查井': 'search',
}
/** 筛选后的列表 */
const filteredRecords = computed(() => {
let list = mockRecords
if (searchText.value) {
const kw = searchText.value.toLowerCase()
list = list.filter(r =>
r.title.toLowerCase().includes(kw) ||
r.location.toLowerCase().includes(kw) ||
r.operator.toLowerCase().includes(kw) ||
r.spaceType.toLowerCase().includes(kw)
)
}
if (activeTab.value === 1) list = list.filter(r => r.status === 'in_progress')
else if (activeTab.value === 2) list = list.filter(r => r.status === 'completed')
return list
})
/** 跳转详情 */
function goDetail(id: number) {
router.push(`/yxkjzyRecordsDetail/${id}`)
}
</script>
<template>
<div class="yxkjzy-records-page">
<van-nav-bar title="有限空间作业记录" left-arrow fixed placeholder @click-left="router.back()" />
<van-search v-model="searchText" placeholder="搜索作业标题、位置、作业员" shape="round" />
<van-tabs v-model:active="activeTab" sticky>
<van-tab title="全部" />
<van-tab title="进行中" />
<van-tab title="已完成" />
</van-tabs>
<div class="record-list">
<van-empty v-if="filteredRecords.length === 0" description="暂无作业记录" />
<van-card
v-for="record in filteredRecords"
:key="record.id"
:title="record.title"
:desc="`位置: ${record.location}`"
@click="goDetail(record.id)"
>
<template #tags>
<van-tag :type="statusColorMap[record.status] as never" size="medium">
{{ statusMap[record.status] }}
</van-tag>
</template>
<template #thumb>
<van-icon :name="spaceIconMap[record.spaceType] || 'label-o'" size="32" color="#999" />
</template>
<template #footer>
<div class="record-meta">
<span class="meta-type">空间类型: {{ record.spaceType }}</span>
<span>作业员: {{ record.operator }}</span>
<span>开始时间: {{ record.startTime }}</span>
</div>
</template>
</van-card>
</div>
</div>
</template>
<style lang="scss" scoped>
.yxkjzy-records-page {
min-height: 100vh;
background: var(--color-bg-page);
:deep(.van-nav-bar) {
background: var(--color-primary);
--van-nav-bar-title-text-color: #fff;
--van-nav-bar-text-color: #fff;
--van-nav-bar-icon-color: #fff;
}
}
.record-list {
padding: 0 8px;
:deep(.van-card) {
margin: 8px;
border-radius: 10px;
background: var(--color-bg-card);
}
:deep(.van-tag) {
margin-right: 4px;
}
}
.record-meta {
display: flex;
flex-direction: column;
gap: 2px;
font-size: 12px;
color: var(--color-text-secondary);
.meta-type {
color: var(--color-text-regular);
}
}
</style>