pizhengyu/threeonecheck_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

隐患详情重新设计，检查计划重新设计成做题排查式

Browse Source
This commit is contained in:
王利强
2026-06-21 16:30:12 +08:00
parent 1fe87ec438
commit cc94d3e3e9
256 changed files with 12542 additions and 5956 deletions
Download Patch File Download Diff File Expand all files Collapse all files

250
pages/index/index.vue
View File

@@ -6,7 +6,7 @@
<image class="header-bg-image" src="/static/home_icon/jianbianbeijing.png" mode="aspectFill"></image>
<!-- 自定义导航栏 -->
<u-navbar
title="三查一曝光"
title="湘西州“三个一”安全管理平台"
:placeholder="false"
:fixed="false"
:safeAreaInsetTop="true"
@@ -45,65 +45,81 @@
</view>
<!-- 我的检查计划 -->
<view class="bg-white margin-top radius" style="padding: 40rpx; margin-left: -30rpx; margin-right: -30rpx;">
<view class="flex margin-bottom-xl">
<!-- <view class="border-tite"></view> -->
<view class="flex margin-bottom-xl align-center justify-between">
<view class="text-bold margin-left-xs" style="font-size: 32rpx;">我的检查计划</view>
<!-- <button class="cu-btn round sm line-blue inspect-list-btn" @click="goInspectList">检查列表</button> -->
</view>
<!-- 无数据提示 -->
<view v-if="checkPlanData.length === 0" class="text-center text-gray padding">
暂无检查计划
</view>
<!-- 列表渲染 -->
<view class="plan-card margin-bottom" v-for="(item, index) in checkPlanData" :key="item.id">
<view class="plan-card margin-bottom" v-for="item in checkPlanData" :key="item.id">
<!-- 蓝色标题栏 -->
<view class="plan-header">
<!-- <image src="/static/蒙版组 273.png" class="plan-header-icon"></image> -->
<view class="plan-header" @click="togglePlanExpand(item.id)">
<text class="plan-header-title">{{ item.name }}</text>
<view class="plan-toggle-btn" @click.stop="togglePlanExpand(item.id)">
<u-icon
:name="isPlanExpanded(item.id) ? 'arrow-down' : 'arrow-up'"
color="#ffffff"
size="18"
></u-icon>
</view>
</view>
<!-- 内容区域 -->
<view class="plan-body">
<view class="flex">
<view class="border-border margin-right-xs">{{ item.runModeName }}完成</view>
<view class="border-border">{{ item.cycle }}</view>
<!-- 内容区域：收起时保留标签与计划时间 -->
<view class="plan-body" :class="{ 'plan-body--collapsed': !isPlanExpanded(item.id) }">
<view class="plan-body-summary">
<view class="flex">
<view class="border-border margin-right-xs">{{ item.runModeName }}完成</view>
<view class="border-border">{{ item.cycle }}</view>
</view>
<view class="flex text-gray margin-top">
<view>计划时间：</view>
<view style="color: #333333;">{{ formatDate(item.planStartTime) }}至{{ formatDate(item.planEndTime) }}</view>
</view>
</view>
<view class="flex text-gray margin-top">
<view>计划时间：</view>
<view style="color: #333333;">{{ formatDate(item.planStartTime) }}至{{ formatDate(item.planEndTime) }}</view>
</view>
<view class="flex margin-top align-center">
<view style="color: #B5B5B5;">完成进度：</view>
<view class="flex align-center margin-left-sm">
<view class="cu-progress round">
<view class="bg-green" :style="{ width: item.progress + '%' }"></view>
<view v-show="isPlanExpanded(item.id)" class="plan-body-detail">
<view class="flex margin-top align-center">
<view style="color: #B5B5B5;">完成进度：</view>
<view class="flex align-center margin-left-sm">
<view class="cu-progress round">
<view class="bg-green" :style="{ width: formatProgress(item.progress) + '%' }"></view>
</view>
<text class="margin-left-sm">{{ formatProgress(item.progress) }}%</text>
</view>
<text class="margin-left-sm">{{ item.progress }}%</text>
</view>
</view>
<view class="plan-stats margin-top">
<view class="plan-stat-item">
<view class="plan-stat-num text-orange">{{ item.totalCount }}</view>
<view class="plan-stat-label">排查项</view>
<view class="plan-stats margin-top">
<view class="plan-stat-item">
<view class="plan-stat-num text-orange">{{ item.pendingCount ?? 0 }}</view>
<view class="plan-stat-label">未完成</view>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-yellow">{{ item.waitCheckNum ?? 0 }}</view>
<view class="plan-stat-label">待排查</view>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-red">{{ item.unusualNum ?? 0 }}</view>
<view class="plan-stat-label">异常数</view>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-blue">{{ item.finishedCount ?? 0 }}</view>
<view class="plan-stat-label">已完成</view>
</view>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-yellow">{{ item.totalCount - item.finishedCount }}</view>
<view class="plan-stat-label">待排查</view>
<view class="margin-top margin-bottom flex justify-end">
<button class="cu-btn round lg light bg-blue margin-right" @click.stop="goTodayInspect(item)">今日检查</button>
<button class="cu-btn round lg bg-blue" @click.stop="goPlanCheckList(item)">检查清单</button>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-olive">0</view>
<view class="plan-stat-label">待验收</view>
</view>
<view class="plan-stat-item">
<view class="plan-stat-num text-blue">{{ item.finishedCount }}</view>
<view class="plan-stat-label">已完成</view>
</view>
</view>
<view class="margin-top margin-bottom flex justify-end">
<button class="cu-btn round lg light bg-blue margin-right" @click.stop="ViewDetails(item)">查看详情</button>
<button v-if="item.finishedCount < item.totalCount" class="cu-btn round lg bg-blue" @click.stop="goDetails(item)">开始检查</button>
<view v-else class="cu-btn round lg bg-green">已完成</view>
</view>
</view>
</view>
<view
v-if="hasMoreCheckPlans"
class="plan-load-more"
@click="loadMoreCheckPlans"
>
加载更多
</view>
</view>
<!-- 我的隐患 -->
<view class="bg-white margin-top radius" style="padding: 40rpx; margin-left: -40rpx; margin-right: -40rpx;">
@@ -177,7 +193,7 @@
<script setup>
import { ref, reactive, computed } from 'vue';
// import { onLoad } from '@dcloudio/uni-app';
import {getCheckPlanList,getHiddenDangerList} from '@/request/api.js'
import {getCheckPlanList, getHiddenDangerList} from '@/request/api.js'
import { getProfileDetail } from '@/request/three_one_api/info.js';
import { onLoad, onShow } from '@dcloudio/uni-app';
import { toImageUrl } from '@/request/request.js';
@@ -293,15 +309,50 @@
// admin、manage 及其他角色展示全部菜单
return allMenuList;
});
const ViewDetails = (item) => {
const goInspectList = () => {
uni.navigateTo({
url: `/pages/plandetail/plandetail?id=${item.id}`
url: '/pages/Inspectionresult/list'
})
}
const goDetails = (item) => {
const formatProgress = (progress) => {
const num = Number(progress);
if (Number.isNaN(num)) return 0;
return Math.min(100, Math.max(0, num));
}
const getTodayDateStr = () => {
const date = new Date();
const y = date.getFullYear();
const m = String(date.getMonth() + 1).padStart(2, '0');
const d = String(date.getDate()).padStart(2, '0');
return `${y}-${m}-${d}`;
};
const goTodayInspect = (item) => {
const oneTableId = item.id;
const taskDate = getTodayDateStr();
const tableId = item.tableId ?? item.id;
if (!oneTableId || !taskDate) {
uni.showToast({ title: '缺少任务参数', icon: 'none' });
return;
}
const name = item.name || '';
const tableIdQuery = tableId ? `&tableId=${tableId}` : '';
uni.navigateTo({
url: `/pages/Inspectionresult/Inspectionresult?id=${item.id}`
})
url: `/pages/Inspectionresult/detail?oneTableId=${oneTableId}&taskDate=${encodeURIComponent(taskDate)}&name=${encodeURIComponent(name)}${tableIdQuery}`
});
}
const goPlanCheckList = (item) => {
const tableId = item.tableId ?? item.id;
if (!tableId) {
uni.showToast({ title: '缺少检查表ID', icon: 'none' });
return;
}
uni.navigateTo({
url: `/pages/Inspectionresult/list?tableId=${tableId}&name=${encodeURIComponent(item.name || '')}`
});
}
// 菜单点击跳转
const handleMenuClick = (item) => {
@@ -326,19 +377,55 @@
}
//我的检查计划
const PLAN_INITIAL_SIZE = 4;
const checkPlanParams = ref({
pageNum: 1,
pageSize: 10,
pageSize: PLAN_INITIAL_SIZE,
name: ''
});
const checkPlanData = ref([]);
const checkPlanTotal = ref(0);
const planShowAll = ref(false);
const expandedPlanMap = ref({});
const hasMoreCheckPlans = computed(() => {
return !planShowAll.value && checkPlanTotal.value > PLAN_INITIAL_SIZE;
});
const initPlanExpandedState = (records = [], { reset = false, expandFirst = false } = {}) => {
const map = reset ? {} : { ...expandedPlanMap.value };
records.forEach((item, index) => {
if (reset) {
map[item.id] = expandFirst && index === 0;
} else if (!(item.id in map)) {
map[item.id] = false;
}
});
expandedPlanMap.value = map;
};
const isPlanExpanded = (id) => !!expandedPlanMap.value[id];
const togglePlanExpand = (id) => {
expandedPlanMap.value = {
...expandedPlanMap.value,
[id]: !expandedPlanMap.value[id]
};
};
const getCheckPlanLists = async () => {
planShowAll.value = false;
try {
const res = await getCheckPlanList(checkPlanParams.value);
console.log(res);
const res = await getCheckPlanList({
pageNum: 1,
pageSize: PLAN_INITIAL_SIZE,
name: checkPlanParams.value.name
});
if (res.code === 0) {
checkPlanData.value = res.data.records;
const records = res.data?.records || [];
checkPlanTotal.value = Number(res.data?.total ?? records.length);
checkPlanData.value = records;
initPlanExpandedState(records, { reset: true, expandFirst: true });
}
} catch (error) {
console.error(error);
@@ -346,6 +433,28 @@
loading.value = false;
}
};
const loadMoreCheckPlans = async () => {
if (!hasMoreCheckPlans.value) return;
try {
const res = await getCheckPlanList({
pageNum: 1,
pageSize: checkPlanTotal.value,
name: checkPlanParams.value.name
});
if (res.code === 0) {
const records = res.data?.records || [];
initPlanExpandedState(records);
checkPlanData.value = records;
planShowAll.value = true;
} else {
uni.showToast({ title: res.msg || '加载失败', icon: 'none' });
}
} catch (error) {
console.error(error);
uni.showToast({ title: '加载失败', icon: 'none' });
}
};
// 格式化日期 (2025-12-18 00:00:00 -> 2025-12-18)
const formatDate = (dateStr) => {
@@ -422,7 +531,7 @@
// 查看隐患详情
const viewHazardDetail = (item) => {
uni.navigateTo({
url: `/pages/hiddendanger/view?hazardId=${item.hazardId}&assignId=${item.assignId}`
url: `/pages/hiddendanger/detail2?hazardId=${item.hazardId}&assignId=${item.assignId || ''}`
})
}
@@ -605,6 +714,15 @@
}
// ========== 检查计划卡片 ==========
.inspect-list-btn {
margin: 0;
padding: 0 24rpx;
height: 56rpx;
line-height: 56rpx;
font-size: 24rpx;
flex-shrink: 0;
}
.plan-card {
border-radius: 16rpx;
overflow: hidden;
@@ -616,6 +734,7 @@
padding: 24rpx 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
.plan-header-icon {
width: 36rpx;
@@ -624,15 +743,38 @@
}
.plan-header-title {
flex: 1;
min-width: 0;
padding-right: 16rpx;
color: #fff;
font-size: 30rpx;
font-weight: bold;
}
}
.plan-toggle-btn {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
width: 48rpx;
height: 48rpx;
}
.plan-body {
padding: 24rpx 30rpx 10rpx 30rpx;
background: #fff;
&--collapsed {
padding-bottom: 24rpx;
}
}
.plan-load-more {
text-align: center;
padding: 24rpx 0 8rpx;
font-size: 28rpx;
color: #2667E9;
}
.plan-stats {