提交 8e1277e0 authored 作者: 刘守彩's avatar 刘守彩

feat(巡检): 其他增加水箱检查

上级 89406c09
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
"name" : "杭州内网机房巡检", "name" : "杭州内网机房巡检",
"appid" : "__UNI__A11BFD5", "appid" : "__UNI__A11BFD5",
"description" : "", "description" : "",
"versionName" : "1.0.2", "versionName" : "1.0.3",
"versionCode" : 102, "versionCode" : 103,
"transformPx" : false, "transformPx" : false,
/* 5+App特有相关 */ /* 5+App特有相关 */
"app-plus" : { "app-plus" : {
......
<template> <template>
<view class="detail-box"> <view class="detail-box">
<!-- <image <!-- <image
class="weitu" class="weitu"
src="@/static/img/add-img/weitu.png" src="@/static/img/add-img/weitu.png"
mode="aspectFit" mode="aspectFit"
></image> --> ></image> -->
<view class="container"> <view class="container">
<!-- 物理环境 --> <!-- 物理环境 -->
<view v-if="detailsItem.wlhj" class="container-item"> <view v-if="detailsItem.wlhj" class="container-item">
<view class="title">物理环境</view> <view class="title">物理环境</view>
<view class="cards"> <view class="cards">
<view <view v-for="(item, index) in detailsItem.wlhj.detail" :key="index" class="cards-item">
v-for="(item, index) in detailsItem.wlhj.detail" <view class="name">{{ item.label
:key="index" }}<text class="status"
class="cards-item" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
> <view class="list">
<view class="name" <view class="label">情况描述:</view>
>{{ item.label <view class="content">
}}<text {{ item.conclusion }}
class="status" </view>
:class="{ warning: item.inspectionResult === 1 }" </view>
>{{ item.inspectionResultLable }}</text <view class="list">
></view <view class="label">现场照片:</view>
> <view v-if="item.photos.length === 0" class="content">
<view class="list"> 未拍摄照片
<view class="label">情况描述:</view> </view>
<view class="content"> <view v-else class="content">
{{ item.conclusion }} <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
</view> mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
</view> </view>
<view class="list"> </view>
<view class="label">现场照片:</view> </view>
<view v-if="item.photos.length === 0" class="content"> </view>
未拍摄照片 </view>
</view> <!-- 安防系统 -->
<view v-else class="content"> <view v-if="detailsItem.afxt" class="container-item">
<image <view class="title">安防系统</view>
v-for="(url, urlIndex) in item.photos" <view class="cards">
:key="urlIndex" <view v-for="(item, index) in detailsItem.afxt.detail" :key="index" class="cards-item" v-if="showItem(item)">
class="image-item" <template></template>
:src="url" <view class="name">{{ item.label
mode="aspectFit" }}<text class="status"
@click="previewImage(item.photos, urlIndex)" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
></image> <view class="list">
</view> <view class="label">情况描述:</view>
</view> <view class="content">
</view> {{ item.conclusion }}
</view> </view>
</view> </view>
<!-- 安防系统 --> <view class="list">
<view v-if="detailsItem.afxt" class="container-item"> <view class="label">现场照片:</view>
<view class="title">安防系统</view> <view v-if="item.photos && item.photos.length === 0" class="content">
<view class="cards"> 未拍摄照片
<view </view>
v-for="(item, index) in detailsItem.afxt.detail" <view v-else class="content">
:key="index" <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
class="cards-item" mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
v-if="showItem(item)" </view>
> </view>
<template></template> </view>
<view class="name" </view>
>{{ item.label </view>
}}<text <!-- 电池状态 -->
class="status" <view v-if="detailsItem.dczt" class="container-item">
:class="{ warning: item.inspectionResult === 1 }" <view class="title">电池状态</view>
>{{ item.inspectionResultLable }}</text <view class="cards">
></view <view v-for="(item, index) in detailsItem.dczt.detail" :key="index" class="cards-item">
> <view class="name">{{ item.label
<view class="list"> }}<text class="status"
<view class="label">情况描述:</view> :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
<view class="content"> <view class="list">
{{ item.conclusion }} <view class="label">{{ item.settingLabelShow }}:</view>
</view> <view class="content">
</view> {{ item.setting }}
<view class="list"> </view>
<view class="label">现场照片:</view> </view>
<view <!-- <view class="list">
v-if="item.photos && item.photos.length === 0" <view class="label">{{ item.sjLabelShow }}:</view>
class="content" <view class="content"> {{ item.value }}{{ item.unit }} </view>
>
未拍摄照片
</view>
<view v-else class="content">
<image
v-for="(url, urlIndex) in item.photos"
:key="urlIndex"
class="image-item"
:src="url"
mode="aspectFit"
@click="previewImage(item.photos, urlIndex)"
></image>
</view>
</view>
</view>
</view>
</view>
<!-- 电池状态 -->
<view v-if="detailsItem.dczt" class="container-item">
<view class="title">电池状态</view>
<view class="cards">
<view
v-for="(item, index) in detailsItem.dczt.detail"
:key="index"
class="cards-item"
>
<view class="name"
>{{ item.label
}}<text
class="status"
:class="{ warning: item.inspectionResult === 1 }"
>{{ item.inspectionResultLable }}</text
></view
>
<view class="list">
<view class="label">{{ item.settingLabelShow }}:</view>
<view class="content">
{{ item.setting }}
</view>
</view>
<!-- <view class="list">
<view class="label">{{ item.sjLabelShow }}:</view>
<view class="content"> {{ item.value }}{{ item.unit }} </view>
</view> --> </view> -->
<view class="list"> <view class="list">
<view class="label">情况描述:</view> <view class="label">情况描述:</view>
<view class="content"> <view class="content">
{{ item.conclusion }} {{ item.conclusion }}
</view> </view>
</view> </view>
<view class="list"> <view class="list">
<view class="label">现场照片:</view> <view class="label">现场照片:</view>
<view v-if="item.photos.length === 0" class="content"> <view v-if="item.photos.length === 0" class="content">
未拍摄照片 未拍摄照片
</view> </view>
<view v-else class="content"> <view v-else class="content">
<image <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
v-for="(url, urlIndex) in item.photos" mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
:key="urlIndex" </view>
class="image-item" </view>
:src="url" </view>
mode="aspectFit" </view>
@click="previewImage(item.photos, urlIndex)" </view>
></image> <!-- 设备告警 -->
</view> <view v-if="detailsItem.sbgj" class="container-item">
</view> <view class="title">设备告警</view>
</view> <view class="cards">
</view> <view v-for="(item, index) in detailsItem.sbgj.detail" :key="index" class="cards-item sbgj">
</view> <view class="name">{{ item.label
<!-- 设备告警 --> }}<text class="status"
<view v-if="detailsItem.sbgj" class="container-item"> :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
<view class="title">设备告警</view> <view v-if="item.inspectionResult === 1" class="list">
<view class="cards"> <view class="label">故障设备:</view>
<view <view class="content">
v-for="(item, index) in detailsItem.sbgj.detail" <text v-for="(current,idx) in item.cabinets" :key="idx">
:key="index" 【{{ current.deviceId }}机柜,{{ current.UpositonS }}~{{
class="cards-item sbgj" current.UpositonE
>
<view class="name"
>{{ item.label
}}<text
class="status"
:class="{ warning: item.inspectionResult === 1 }"
>{{ item.inspectionResultLable }}</text
></view
>
<view v-if="item.inspectionResult === 1" class="list">
<view class="label">故障设备:</view>
<view class="content">
<text v-for="(current,idx) in item.cabinets" :key="idx">
【{{ current.deviceId }}机柜,{{ current.UpositonS }}~{{
current.UpositonE
}}U】 }}U】
</text> </text>
</view> </view>
</view> </view>
<view class="list"> <view class="list">
<view class="label">情况描述:</view> <view class="label">情况描述:</view>
<view class="content"> <view class="content">
{{ item.conclusion }} {{ item.conclusion }}
</view> </view>
</view> </view>
<view class="list"> <view class="list">
<view class="label">现场照片:</view> <view class="label">现场照片:</view>
<view v-if="item.photos.length === 0" class="content"> <view v-if="item.photos.length === 0" class="content">
未拍摄照片 未拍摄照片
</view> </view>
<view v-else class="content"> <view v-else class="content">
<image <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
v-for="(url, urlIndex) in item.photos" mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
:key="urlIndex" </view>
class="image-item" </view>
:src="url" </view>
mode="aspectFit" </view>
@click="previewImage(item.photos, urlIndex)" </view>
></image> <!-- 机房温湿度 -->
</view> <view v-if="detailsItem.jfwsd" class="container-item">
</view> <view class="title">机房温湿度</view>
</view> <view class="cards">
</view> <view v-for="(item, index) in detailsItem.jfwsd.detail" :key="index" class="cards-item">
</view> <view class="name">{{ item.label
<!-- 机房温湿度 --> }}<text class="status"
<view v-if="detailsItem.jfwsd" class="container-item"> :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
<view class="title">机房温湿度</view> <view class="list">
<view class="cards"> <view class="label">{{ item.settingLabel }}:</view>
<view <view class="content"> {{ item.setting }}{{ item.unit }} </view>
v-for="(item, index) in detailsItem.jfwsd.detail" </view>
:key="index" <view class="list">
class="cards-item" <view class="label">{{ item.sjLabel }}:</view>
> <view class="content"> {{ item.value }}{{ item.unit }} </view>
<view class="name" </view>
>{{ item.label <view class="list">
}}<text <view class="label">情况描述:</view>
class="status" <view class="content">
:class="{ warning: item.inspectionResult === 1 }" {{ item.conclusion }}
>{{ item.inspectionResultLable }}</text </view>
></view </view>
>
<view class="list">
<view class="label">{{ item.settingLabel }}:</view>
<view class="content"> {{ item.setting }}{{ item.unit }} </view>
</view>
<view class="list">
<view class="label">{{ item.sjLabel }}:</view>
<view class="content"> {{ item.value }}{{ item.unit }} </view>
</view>
<view class="list"> <view class="list">
<view class="label">情况描述:</view> <view class="label">现场照片:</view>
<view class="content"> <view v-if="item.photos.length === 0" class="content">
{{ item.conclusion }} 未拍摄照片
</view> </view>
</view> <view v-else class="content">
<view class="list"> <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
<view class="label">现场照片:</view> mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
<view v-if="item.photos.length === 0" class="content"> </view>
未拍摄照片 </view>
</view> </view>
<view v-else class="content"> </view>
<image </view>
v-for="(url, urlIndex) in item.photos" <!-- 电力系统 -->
:key="urlIndex" <view v-if="detailsItem.dlxt" class="container-item">
class="image-item" <view class="title">电力系统</view>
:src="url" <view class="cards">
mode="aspectFit" <view v-for="(item, index) in detailsItem.dlxt.detail" :key="index" class="cards-item">
@click="previewImage(item.photos, urlIndex)" <view class="name">{{ item.label
></image> }}<text class="status"
</view> :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}</text></view>
</view> <view class="list">
</view> <view class="label">情况描述:</view>
</view> <view class="content">
</view> {{ item.conclusion }}
<!-- 电力系统 --> </view>
<view v-if="detailsItem.dlxt" class="container-item"> </view>
<view class="title">电力系统</view> <view class="list">
<view class="cards"> <view class="label">现场照片:</view>
<view <view v-if="item.photos.length === 0" class="content">
v-for="(item, index) in detailsItem.dlxt.detail" 未拍摄照片
:key="index" </view>
class="cards-item" <view v-else class="content">
> <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
<view class="name" mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
>{{ item.label </view>
}}<text </view>
class="status" </view>
:class="{ warning: item.inspectionResult === 1 }" </view>
>{{ item.inspectionResultLable }}</text </view>
></view <!-- 消防系统 -->
> <view v-if="detailsItem.xfxt" class="container-item">
<view class="list"> <view class="title">消防系统</view>
<view class="label">情况描述:</view> <view class="cards">
<view class="content"> <view v-for="(item, index) in detailsItem.xfxt.detail" :key="index" class="cards-item">
{{ item.conclusion }}
</view> <view class="name">
</view>
<view class="list">
<view class="label">现场照片:</view>
<view v-if="item.photos.length === 0" class="content">
未拍摄照片
</view>
<view v-else class="content">
<image
v-for="(url, urlIndex) in item.photos"
:key="urlIndex"
class="image-item"
:src="url"
mode="aspectFit"
@click="previewImage(item.photos, urlIndex)"
></image>
</view>
</view>
</view>
</view>
</view>
<!-- 消防系统 -->
<view v-if="detailsItem.xfxt" class="container-item">
<view class="title">消防系统</view>
<view class="cards">
<view
v-for="(item, index) in detailsItem.xfxt.detail"
:key="index"
class="cards-item"
>
<view class="name"
>
<template v-if="index==0"> <template v-if="index==0">
<view> <view>
{{ item.label }} (气压范围:{{item.setting}} {{ item.label }} (气压范围:{{item.setting}}
<text <text class="status"
class="status" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}
:class="{ warning: item.inspectionResult === 1 }" </text>
>{{ item.inspectionResultLable }}
</text>
</view> </view>
</template> </template>
<template v-else> <template v-else>
{{ item.label }} {{ item.label }}
<text <text class="status" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}
class="status"
:class="{ warning: item.inspectionResult === 1 }"
>{{ item.inspectionResultLable }}
</text> </text>
</template> </template>
</view </view>
>
<!-- <template v-if="index==0"> <!-- <template v-if="index==0">
<view class="list"> <view class="list">
<view class="label" style="width: 70px;">{{item.settingLabel}}:</view> <view class="label" style="width: 70px;">{{item.settingLabel}}:</view>
...@@ -336,235 +231,230 @@ ...@@ -336,235 +231,230 @@
{{ item.value || '--' }} MPa {{ item.value || '--' }} MPa
</view> </view>
</view> </view>
</template> --> </template> -->
<view class="list"> <view class="list">
<view class="label">情况描述:</view> <view class="label">情况描述:</view>
<view class="content"> <view class="content">
{{ item.conclusion }} {{ item.conclusion }}
</view> </view>
</view> </view>
<view class="list"> <view class="list">
<view class="label">现场照片:</view> <view class="label">现场照片:</view>
<view v-if="item.photos.length === 0" class="content"> <view v-if="item.photos.length === 0" class="content">
未拍摄照片 未拍摄照片
</view> </view>
<view v-else class="content"> <view v-else class="content">
<image <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
v-for="(url, urlIndex) in item.photos" mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
:key="urlIndex" </view>
class="image-item" </view>
:src="url" </view>
mode="aspectFit" </view>
@click="previewImage(item.photos, urlIndex)" </view>
></image> <!-- 线路情况 -->
</view> <view v-if="detailsItem.xlqk" class="container-item">
</view> <view class="title">线路情况</view>
</view> <view class="cards">
</view> <view v-for="(item, index) in detailsItem.xlqk.detail" :key="index" class="cards-item">
</view> <view class="name">{{ item.label
<!-- 线路情况 --> }}<text class="status" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}
<view v-if="detailsItem.xlqk" class="container-item"> </text></view>
<view class="title">线路情况</view> <view class="list">
<view class="cards"> <view class="label">情况描述:</view>
<view <view class="content">
v-for="(item, index) in detailsItem.xlqk.detail" {{ item.conclusion }}
:key="index" </view>
class="cards-item" </view>
> <view class="list">
<view class="name" <view class="label">现场照片:</view>
>{{ item.label <view v-if="item.photos.length === 0" class="content">
}}<text 未拍摄照片
class="status" </view>
:class="{ warning: item.inspectionResult === 1 }" <view v-else class="content">
>{{ item.inspectionResultLable }} <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
</text></view mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
> </view>
<view class="list"> </view>
<view class="label">情况描述:</view> </view>
<view class="content"> </view>
{{ item.conclusion }} </view>
</view> <!-- 其它 -->
</view> <view v-if="detailsItem.qt" class="container-item">
<view class="list"> <view class="title">其它</view>
<view class="label">现场照片:</view> <view class="cards">
<view v-if="item.photos.length === 0" class="content"> <view v-for="(item, index) in detailsItem.qt.detail" :key="index" class="cards-item">
未拍摄照片 <template v-if="item.required">
</view> <view class="name">{{ item.label }}
<view v-else class="content"> <text class="status" :class="{ warning: item.inspectionResult === 1 }">{{ item.inspectionResultLable }}
<image </text>
v-for="(url, urlIndex) in item.photos" </view>
:key="urlIndex" <view class="list">
class="image-item" <view class="label">情况描述:</view>
:src="url" <view class="content">
mode="aspectFit" {{ item.conclusion }}
@click="previewImage(item.photos, urlIndex)" </view>
></image> </view>
</view> </template>
</view> <view v-if="!item.required" class="list">
</view> <view class="label">其它问题:</view>
</view> <view class="content">
</view> {{ item.conclusion }}
<!-- 其它 --> </view>
<view v-if="detailsItem.qt" class="container-item"> </view>
<view class="title">其它</view> <view class="list">
<view class="cards"> <view class="label">现场照片:</view>
<view <view v-if="item.photos.length === 0" class="content">
v-for="(item, index) in detailsItem.qt.detail" 未拍摄照片
:key="index" </view>
class="cards-item" <view v-else class="content">
> <image v-for="(url, urlIndex) in item.photos" :key="urlIndex" class="image-item" :src="url"
<view class="list"> mode="aspectFit" @click="previewImage(item.photos, urlIndex)"></image>
<view class="label">其它问题:</view> </view>
<view class="content"> </view>
{{ item.conclusion }} </view>
</view> </view>
</view> </view>
<view class="list"> </view>
<view class="label">现场照片:</view> </view>
<view v-if="item.photos.length === 0" class="content"> </template>
未拍摄照片
</view> <script>
<view v-else class="content"> export default {
<image props: {
v-for="(url, urlIndex) in item.photos" // 父组件传递的详情
:key="urlIndex" detailsItem: {
class="image-item" type: Object,
:src="url" default: () => {},
mode="aspectFit" },
@click="previewImage(item.photos, urlIndex)" },
></image> data() {
</view> return {};
</view> },
</view> mounted() {
</view> console.log("this.detailsItem", this.detailsItem);
</view> console.log(this.detailsItem)
</view> },
</view> methods: {
</template> showItem(item) {
const hasMonitor = this.detailsItem.afxt.detail.find(i => i.label === "是否有监控");
<script> if (hasMonitor && hasMonitor.inspectionResultLable === "无监控") {
export default { return !["监控外观破损", "监控画面清晰", "监控存储连续"].includes(item.label);
props: { }
// 父组件传递的详情 return true;
detailsItem: { },
type: Object, previewImage(images, index) {
default: () => {}, uni.previewImage({
}, current: index,
}, urls: images,
data() { });
return {}; },
}, },
mounted() { };
console.log("this.detailsItem", this.detailsItem); </script>
console.log(this.detailsItem)
}, <style scoped lang="less">
methods: { .detail-box {
showItem(item) { height: calc(100vh - 180px);
const hasMonitor = this.detailsItem.afxt.detail.find(i => i.label === "是否有监控"); border-radius: 0 0 9.6px 9.6px;
if (hasMonitor && hasMonitor.inspectionResultLable === "无监控") { background-color: #fff;
return !["监控外观破损", "监控画面清晰", "监控存储连续"].includes(item.label);
} .weitu {
return true; width: 100%;
}, margin-bottom: 19.2px;
previewImage(images, index) { height: 280px;
uni.previewImage({ }
current: index,
urls: images, .container {
}); .container-item {
}, margin-bottom: 19.2px;
},
}; .title {
</script> font-size: 12.8px;
color: #000000;
<style scoped lang="less"> line-height: 19.2px;
.detail-box { font-weight: 500;
height: calc(100vh - 180px); margin-bottom: 9.6px;
border-radius: 0 0 9.6px 9.6px; }
background-color: #fff;
.weitu { .cards {
width: 100%; display: flex;
margin-bottom: 19.2px; flex-wrap: wrap;
height: 280px; justify-content: space-between;
}
.container { .cards-item {
.container-item { width: calc(50% - 6.4px);
margin-bottom: 19.2px; margin-bottom: 12.8px;
.title { background: #f9f9f9;
font-size: 12.8px; border-radius: 6.4px;
color: #000000; padding: 6.4px;
line-height: 19.2px;
font-weight: 500; &.sbgj {
margin-bottom: 9.6px; width: 100%;
} }
.cards {
display: flex; .name {
flex-wrap: wrap; font-size: 12.8px;
justify-content: space-between; color: #000000;
.cards-item { line-height: 19.2px;
width: calc(50% - 6.4px); font-weight: 500;
margin-bottom: 12.8px; margin-bottom: 9.6px;
background: #f9f9f9;
border-radius: 6.4px; .status {
padding: 6.4px; margin-left: 6.4px;
&.sbgj { padding: 0 6.4px;
width: 100%; font-size: 9.6px;
} background: #e6f9f3;
.name { border-radius: 8.8px;
font-size: 12.8px; color: #0cc991;
color: #000000; line-height: 16px;
line-height: 19.2px; font-weight: 400;
font-weight: 500;
margin-bottom: 9.6px; &.warning {
.status { background: #fdebe9;
margin-left: 6.4px; color: #f55a42;
padding: 0 6.4px; }
font-size: 9.6px; }
background: #e6f9f3; }
border-radius: 8.8px;
color: #0cc991; .list {
line-height: 16px; display: flex;
font-weight: 400; align-items: flex-start;
&.warning { margin-bottom: 9.6px;
background: #fdebe9;
color: #f55a42; &:last-child {
} margin-bottom: 0;
} }
}
.list { .label {
display: flex; width: 56px;
align-items: flex-start; font-size: 11.2px;
margin-bottom: 9.6px; color: #7c7c7c;
&:last-child { line-height: 17.6px;
margin-bottom: 0; font-weight: 400;
} }
.label {
width: 56px; .content {
font-size: 11.2px; flex: 1;
color: #7c7c7c; word-wrap: break-word;
line-height: 17.6px; font-size: 11.2px;
font-weight: 400; color: #000000;
} line-height: 17.6px;
.content { font-weight: 400;
flex: 1; display: flex;
word-wrap: break-word; flex-wrap: nowrap;
font-size: 11.2px;
color: #000000; // justify-content: space-between;
line-height: 17.6px; .image-item {
font-weight: 400; width: 57.6px;
display: flex; height: 57.6px;
flex-wrap: nowrap; margin-right: 6.4px;
// justify-content: space-between; border-radius: 3.2px;
.image-item { }
width: 57.6px; }
height: 57.6px; }
margin-right: 6.4px; }
border-radius: 3.2px; }
} }
} }
} }
} </style>
} \ No newline at end of file
}
}
}
</style>
<template> <template>
<!-- 机房巡检操作 --> <!-- 机房巡检操作 -->
<view> <view>
<view v-for="(item, index) in itemData.detail" :key="index"> <view v-for="(item, index) in itemData.detail" :key="index">
<view class="form-item"> <view v-if="index==0" class="form-item">
<text class="form-label" <text class="form-label"><text class="required" v-if="item.required">*</text>{{ item.label }}</text>
><text class="required"></text>{{ item.label }}</text <view class="switch-container">
> <view :class="['status-btn', { active: item.inspectionResult === 0 }]"
<text @click="setInspectionResult(index, 0, item.lableArr[0])">
:class="['conclusion', { 'no-text': !item.conclusion }]" {{ item.lableArr[0] }}
@click="showPopup(item, index)" </view>
> <view :class="['status-btn', { active: item.inspectionResult === 1 }]"
{{ item.conclusion || "请输入情况摘要" }}</text @click="setInspectionResult(index, 1, item.lableArr[1])">
> {{ item.lableArr[1] }}
</view> </view>
<view class="form-item"> </view>
<text class="form-label"><text class="required"></text>现场照片</text> </view>
<CommonUpload <template v-if="item.inspectionResult === 1 && index==0">
v-model="item.photos" <view class="form-item">
:max-count="9999" <text class="form-label"><text class="required">*</text>情况摘要</text>
@input="onPhotoChange" <text :class="['conclusion', { 'no-text': !item.conclusion }]" @click="showPopup(item, index)">
> {{ item.conclusion || "请输入情况摘要" }}</text>
<template #tip><div></div></template> </view>
</CommonUpload> <view class="form-item">
</view> <text class="form-label"><text class="required">*</text>现场照片</text>
</view> <CommonUpload v-model="item.photos" :max-count="5">
<custom-popup </CommonUpload>
ref="customPopup" </view>
:inspectionItem="inspectionItem" </template>
@confirm="handlePopupConfirm" <template v-if="index==1">
> <view class="form-item">
</custom-popup> <text class="form-label"><text class="required" v-if="item.required"></text>{{ item.label }}</text>
</view> <text :class="['conclusion', { 'no-text': !item.conclusion }]" @click="showPopup(item, index)">
</template> {{ item.conclusion || "请输入情况摘要" }}</text>
</view>
<script> <view class="form-item">
import CommonUpload from "@/components/CommonUpload/index.vue"; <text class="form-label"><text class="required"></text>现场照片</text>
import customPopup from "./customPopup.vue"; <CommonUpload v-model="item.photos" :max-count="9999" @input="onPhotoChange">
import _ from "lodash"; <template #tip>
<div></div>
import mixin from "./mixin"; </template>
export default { </CommonUpload>
mixins: [mixin], </view>
components: { </template>
CommonUpload, </view>
customPopup, <custom-popup ref="customPopup" :inspectionItem="inspectionItem" @confirm="handlePopupConfirm">
}, </custom-popup>
props: { </view>
// 父组件传递的巡检状态 </template>
status: {
type: Number, <script>
default: 0, import CommonUpload from "@/components/CommonUpload/index.vue";
}, import customPopup from "./customPopup.vue";
// 父组件传递的巡检事项名 import _ from "lodash";
inspectionItem: {
type: String, import mixin from "./mixin";
default: "", export default {
}, mixins: [mixin],
// 父组件传递的数据 components: {
defaultData: { CommonUpload,
type: Object, customPopup,
default: () => ({}), },
}, props: {
}, // 父组件传递的巡检状态
data() { status: {
return { type: Number,
isQt: true, default: 0,
currentIndex: 0, // 当前操作的索引 },
photos: [], // 父组件传递的巡检事项名
// 父组件传递的数据 inspectionItem: {
itemData: { type: String,
isValid: true, // true是不校验 default: "",
status: 0, //0是未巡检 1是已巡检 2巡检异常 },
statusLabel: "未巡检", // 父组件传递的数据
inspectionItem: "", //巡检事项 defaultData: {
detail: [ type: Object,
{ default: () => ({}),
label: "其他问题", },
inspectionResult: 0, },
inspectionResultLable: "正常", data() {
lableArr: ["正常", "异常"], return {
conclusion: "", isQt: true,
photos: [], currentIndex: 0, // 当前操作的索引
}, photos: [],
], // 父组件传递的数据
}, itemData: {
}; isValid: false, // true是不校验
}, status: 0, //0是未巡检 1是已巡检 2巡检异常
computed: { statusLabel: "未巡检",
userInfo() { inspectionItem: "", //巡检事项
return this.$store.state.now_user || {}; detail: [{
}, required: true,
}, label: "水箱",
watch: { inspectionResult: "",
defaultData(newVal) { inspectionResultLable: "正常",
// 在这里处理数据变化 lableArr: ["正常", "异常"],
if (Object.keys(this.defaultData).length !== 0) { conclusion: "",
this.itemData = this.defaultData; photos: [],
} },
}, {
}, required: false,
mounted() {}, label: "其他问题",
methods: { inspectionResult: 0,
// 设置巡检结论 inspectionResultLable: "正常",
setInspectionResult(index, value) { lableArr: ["正常", "异常"],
this.itemData.detail[index].inspectionResult = value; // 0正常 1异常 conclusion: "",
}, photos: [],
// 处理弹窗确认 },
handlePopupConfirm(summary) { ],
this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域 },
}, };
// 处理】数据 },
getFromData() { computed: {
this.itemData.inspectionItem = this.inspectionItem; userInfo() {
console.log(222, this.itemData); return this.$store.state.now_user || {};
// 全都是正常 },
this.itemData.status = 1; //1表示已经巡检过没有异常 },
this.itemData.statusLabel = "已巡检"; watch: {
return this.itemData; defaultData(newVal) {
}, // 在这里处理数据变化
// 数据校验方法 true说明有未填项 if (Object.keys(this.defaultData).length !== 0) {
areAllObjectsValid(arr) { this.itemData = this.defaultData;
for (let i = 0; i < arr.length; i++) { }
const obj = arr[i]; },
const keys = Object.keys(obj); },
for (let j = 0; j < keys.length; j++) { mounted() {},
const key = keys[j]; methods: {
const value = obj[key]; // 处理弹窗确认
if (value === null || value === undefined || value === "") { handlePopupConfirm(summary) {
return false; this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域
} },
if (Array.isArray(value)) { // 处理】数据
if (value.length === 0) { getFromData() {
return false; this.itemData.inspectionItem = this.inspectionItem;
} const {isValid, status, statusLabel} = this.validForm(this.itemData.detail);
for (let k = 0; k < value.length; k++) { this.itemData.isValid = isValid;
if (typeof value[k] === "object" && value[k] !== null) { this.itemData.status = status
if (!validateArrayObjects([value[k]])) { this.itemData.statusLabel = statusLabel
return false; return this.itemData;
} },
} validForm(list) {
} let isValid = list.every(item => this.validFormItem(item))
} else if (typeof value === "object" && value !== null) { let status = list.some(item => item.inspectionResult === 1 && item.required) ? 2: 1;
if (!validateArrayObjects([value])) { let statusLabel = isValid ? '已巡检' : '未巡检'
return false;
} const ret = {
} isValid, // 必填 false 不通过 true 通过
} status, // 1 正常 2 异常
} statusLabel // 已巡检 | 未巡检
return true; }
}, console.log('validForm', ret)
// 校验是否有异常 return ret;
areAllInspectionResultsOne(arr) { },
return arr.every((obj) => obj.inspectionResult === 0); validFormItem(item) {
}, if(item.required) {
onPhotoChange(val) { if (item.inspectionResult === 1) {
this.itemData.detail[this.currentIndex].photos = val; // 如果 inspectionResult 为 1,检查 conclusion 和 photos
}, if (!item.conclusion || item.photos.length === 0) {
}, return false;
}; } else {
</script> return true
<style scoped lang="less"> }
.form-item { } else {
display: flex; return true
align-items: center; }
padding: 9.6px 0; } else {
line-height: 28.8px; return true
border-bottom: 0.8px solid #f2f3f5; }
},
.form-label { // 数据校验方法 true说明有未填项
font-size: 11.2px; areAllObjectsValid(arr) {
margin-right: 25.6px; for (let i = 0; i < arr.length; i++) {
width: 88px; const obj = arr[i];
text-align: right; const keys = Object.keys(obj);
color: #7c7c7c; for (let j = 0; j < keys.length; j++) {
const key = keys[j];
.required { const value = obj[key];
color: red; if (value === null || value === undefined || value === "") {
margin-right: 3.2px; return false;
} }
} if (Array.isArray(value)) {
.conclusion { if (value.length === 0) {
&.no-text { return false;
color: #c7c7c7; }
} for (let k = 0; k < value.length; k++) {
.have { if (typeof value[k] === "object" && value[k] !== null) {
color: #000; if (!validateArrayObjects([value[k]])) {
} return false;
} }
.label { }
font-size: 11.2px; }
} } else if (typeof value === "object" && value !== null) {
if (!validateArrayObjects([value])) {
.switch-container { return false;
display: flex; }
gap: 9.6px; }
}
.status-btn { }
flex: 1; return true;
padding: 5.6px 19.2px; },
font-size: 12.8px; // 校验是否有异常
color: #000000; areAllInspectionResultsOne(arr) {
background: #f2f2f2; return arr.every((obj) => obj.inspectionResult === 0);
text-align: center; },
font-weight: 400; onPhotoChange(val) {
line-height: 17.6px; this.itemData.detail[1].photos = val;
border-radius: 14.4px; },
},
&.active { };
color: #ffffff; </script>
background: #3774f6; <style scoped lang="less">
border: 0.32px solid rgba(224, 224, 224, 1); .form-item {
} display: flex;
} align-items: center;
} padding: 9.6px 0;
line-height: 28.8px;
.input-box { border-bottom: 0.8px solid #f2f3f5;
flex: 1;
border-radius: 3.2px; .form-label {
font-size: 12.8px; font-size: 11.2px;
line-height: 19.2px; margin-right: 25.6px;
} width: 88px;
text-align: right;
.photo-limit { color: #7c7c7c;
font-size: 12.8px;
color: #959595; .required {
line-height: 19.2px; color: red;
font-weight: 400; margin-right: 3.2px;
} }
}
.photo-container {
display: flex; .conclusion {
flex-wrap: wrap; &.no-text {
margin-bottom: 6.4px; color: #c7c7c7;
}
.photo-item {
position: relative; .have {
margin-right: 6.4px; color: #000;
margin-bottom: 6.4px; }
}
.photo {
width: 57.6px; .label {
height: 57.6px; font-size: 11.2px;
border-radius: 3.2px; }
margin-left: 9.6px;
} .switch-container {
display: flex;
.delete-photo { gap: 9.6px;
position: absolute;
top: -6.4px; .status-btn {
right: -6.4px; flex: 1;
background-color: #ff4d4f; padding: 5.6px 19.2px;
color: #fff; font-size: 12.8px;
width: 12.8px; color: #000000;
height: 12.8px; background: #f2f2f2;
border-radius: 50%; text-align: center;
text-align: center; font-weight: 400;
line-height: 12.8px; line-height: 17.6px;
font-size: 9.6px; border-radius: 14.4px;
}
} &.active {
} color: #ffffff;
background: #3774f6;
.photo-btn { border: 0.32px solid rgba(224, 224, 224, 1);
background: #ffffff; }
border: 0.272px solid rgba(221, 221, 221, 1); }
border-radius: 1.64px; }
width: 57.6px;
height: 57.6px; .input-box {
font-size: 57.6px; flex: 1;
color: #cccccc; border-radius: 3.2px;
text-align: center; font-size: 12.8px;
line-height: 51.2px; line-height: 19.2px;
} }
}
</style> .photo-limit {
font-size: 12.8px;
color: #959595;
line-height: 19.2px;
font-weight: 400;
}
.photo-container {
display: flex;
flex-wrap: wrap;
margin-bottom: 6.4px;
.photo-item {
position: relative;
margin-right: 6.4px;
margin-bottom: 6.4px;
.photo {
width: 57.6px;
height: 57.6px;
border-radius: 3.2px;
margin-left: 9.6px;
}
.delete-photo {
position: absolute;
top: -6.4px;
right: -6.4px;
background-color: #ff4d4f;
color: #fff;
width: 12.8px;
height: 12.8px;
border-radius: 50%;
text-align: center;
line-height: 12.8px;
font-size: 9.6px;
}
}
}
.photo-btn {
background: #ffffff;
border: 0.272px solid rgba(221, 221, 221, 1);
border-radius: 1.64px;
width: 57.6px;
height: 57.6px;
font-size: 57.6px;
color: #cccccc;
text-align: center;
line-height: 51.2px;
}
}
</style>
\ No newline at end of file
<template> <template>
<!-- 机房巡检操作 --> <!-- 机房巡检操作 -->
<view> <view>
<view v-for="(item, index) in itemData.detail" :key="index"> <view v-for="(item, index) in itemData.detail" :key="index">
<view class="form-item"> <view class="form-item">
<text class="form-label" <text class="form-label"><text class="required">*</text>{{ item.label }}</text>
><text class="required">*</text>{{ item.label }}</text <view class="switch-container">
> <view :class="['status-btn', { active: item.inspectionResult === 0 }]"
<view class="switch-container"> @click="setInspectionResult(index, 0, item.lableArr[0])">
<view {{ item.lableArr[0] }}
:class="['status-btn', { active: item.inspectionResult === 0 }]" </view>
@click="setInspectionResult(index, 0, item.lableArr[0])" <view :class="['status-btn', { active: item.inspectionResult === 1 }]"
> @click="setInspectionResult(index, 1, item.lableArr[1])">
{{ item.lableArr[0] }} {{ item.lableArr[1] }}
</view> </view>
<view </view>
:class="['status-btn', { active: item.inspectionResult === 1 }]" </view>
@click="setInspectionResult(index, 1, item.lableArr[1])" <template v-if="item.inspectionResult === 1">
> <view class="form-item">
{{ item.lableArr[1] }} <text class="form-label"><text class="required">*</text>情况摘要</text>
</view> <text :class="['conclusion', { 'no-text': !item.conclusion }]" @click="showPopup(item, index)">
</view> {{ item.conclusion || "请输入情况摘要" }}</text>
</view> </view>
<template v-if="item.inspectionResult === 1"> <view class="form-item">
<view class="form-item"> <text class="form-label"><text class="required">*</text>现场照片</text>
<text class="form-label" <CommonUpload v-model="item.photos" :max-count="5">
><text class="required">*</text>情况摘要</text </CommonUpload>
> </view>
<text </template>
:class="['conclusion', { 'no-text': !item.conclusion }]" </view><custom-popup ref="customPopup" :inspectionItem="inspectionItem"
@click="showPopup(item, index)" @confirm="handlePopupConfirm"></custom-popup>
> </view>
{{ item.conclusion || "请输入情况摘要" }}</text </template>
>
</view> <script>
<view class="form-item"> import CommonUpload from "@/components/CommonUpload/index.vue";
<text class="form-label" import customPopup from "./customPopup.vue";
><text class="required">*</text>现场照片</text import _ from "lodash";
> import mixin from "./mixin";
<CommonUpload v-model="item.photos" :max-count="5">
</CommonUpload> </view export default {
></template> </view components: {
><custom-popup CommonUpload,
ref="customPopup" customPopup,
:inspectionItem="inspectionItem" },
@confirm="handlePopupConfirm" mixins: [mixin],
></custom-popup> props: {
</view> // 父组件传递的巡检状态
</template> status: {
type: Number,
<script> default: 0,
import CommonUpload from "@/components/CommonUpload/index.vue"; },
import customPopup from "./customPopup.vue"; // 父组件传递的巡检事项名
import _ from "lodash"; inspectionItem: {
import mixin from "./mixin"; type: String,
default: "",
export default { },
components: { // 父组件传递的数据
CommonUpload, defaultData: {
customPopup, type: Object,
}, default: () => ({}),
mixins: [mixin], },
props: { },
// 父组件传递的巡检状态 data() {
status: { return {
type: Number, currentIndex: 0, // 当前操作的索引
default: 0, photos: [],
}, itemData: {
// 父组件传递的巡检事项名 isValid: false, // false是校验未通过 true是校验通过
inspectionItem: { status: 0, //0是未巡检 1是已巡检 2巡检异常
type: String, statusLabel: "未巡检",
default: "", inspectionItem: "", //巡检事项
}, detail: [{
// 父组件传递的数据 label: "地板、墙壁破损",
defaultData: { inspectionResult: "",
type: Object, inspectionResultLable: "正常",
default: () => ({}), lableArr: ["正常", "异常"],
}, conclusion: "",
}, photos: [],
data() { },
return { {
currentIndex: 0, // 当前操作的索引 label: "机房清洁",
photos: [], inspectionResult: "",
itemData: { inspectionResultLable: "正常",
isValid: false, // false是校验未通过 true是校验通过 lableArr: ["正常", "异常"],
status: 0, //0是未巡检 1是已巡检 2巡检异常 conclusion: "",
statusLabel: "未巡检", photos: [],
inspectionItem: "", //巡检事项 },
detail: [ {
{ label: "机房通风",
label: "地板、墙壁破损", inspectionResult: "",
inspectionResult: "", inspectionResultLable: "正常",
inspectionResultLable: "正常", lableArr: ["正常", "异常"],
lableArr: ["正常", "异常"], conclusion: "",
conclusion: "", photos: [],
photos: [], },
}, {
{ label: "机房照明",
label: "机房清洁", inspectionResult: "",
inspectionResult: "", inspectionResultLable: "正常",
inspectionResultLable: "正常", lableArr: ["正常", "异常"],
lableArr: ["正常", "异常"], conclusion: "",
conclusion: "", photos: [],
photos: [], },
}, {
{ label: "漏水检测",
label: "机房通风", inspectionResult: "",
inspectionResult: "", inspectionResultLable: "正常",
inspectionResultLable: "正常", lableArr: ["正常", "异常"],
lableArr: ["正常", "异常"], conclusion: "",
conclusion: "", photos: [],
photos: [], },
}, ],
{ },
label: "机房照明", };
inspectionResult: "", },
inspectionResultLable: "正常", computed: {
lableArr: ["正常", "异常"], userInfo() {
conclusion: "", return this.$store.state.now_user || {};
photos: [], },
}, },
{ watch: {
label: "漏水检测", defaultData(newVal) {
inspectionResult: "", // 在这里处理数据变化
inspectionResultLable: "正常", if (Object.keys(this.defaultData).length !== 0) {
lableArr: ["正常", "异常"], this.itemData = this.defaultData;
conclusion: "", }
photos: [], },
}, },
], async mounted() {
}, console.log("sdsadasd", this.itemData);
}; // if (Object.keys(this.defaultData).length !== 0) {
}, // this.itemData = this.defaultData;
computed: { // }
userInfo() { },
return this.$store.state.now_user || {}; methods: {
}, // 拍照
}, takePhoto(index) {
watch: { uni.chooseImage({
defaultData(newVal) { count: 1,
// 在这里处理数据变化 sourceType: ["camera"], // 可以从相机拍摄
if (Object.keys(this.defaultData).length !== 0) { success: async (res) => {
this.itemData = this.defaultData; if (this.photos.length < 5) {
} const base64 = await this.convertFileToBase64(res.tempFilePaths[0]);
}, this.itemData.detail[index].photos.push(base64);
}, } else {
async mounted() { uni.showToast({
console.log("sdsadasd", this.itemData); title: "最多只能上传5张照片",
// if (Object.keys(this.defaultData).length !== 0) { icon: "none",
// this.itemData = this.defaultData; });
// } }
}, },
methods: { });
// 拍照 },
takePhoto(index) { // 转化为base64
uni.chooseImage({ convertFileToBase64(filePath) {
count: 1, return new Promise((resolve, reject) => {
sourceType: ["camera"], // 可以从相机拍摄 plus.io.resolveLocalFileSystemURL(
success: async (res) => { filePath,
if (this.photos.length < 5) { function(entry) {
const base64 = await this.convertFileToBase64(res.tempFilePaths[0]); entry.file(
this.itemData.detail[index].photos.push(base64); function(file) {
} else { const reader = new plus.io.FileReader();
uni.showToast({ reader.onloadend = function(evt) {
title: "最多只能上传5张照片", const base64 = evt.target.result; // 获取 Base64 数据
icon: "none", resolve(base64); // 返回 Base64 数据
}); };
} reader.readAsDataURL(file); // 读取文件并转换为 Base64
}, },
}); function(error) {
}, reject("获取文件对象失败:" + error.message);
// 转化为base64 }
convertFileToBase64(filePath) { );
return new Promise((resolve, reject) => { },
plus.io.resolveLocalFileSystemURL( function(error) {
filePath, reject("解析文件路径失败:" + error.message);
function (entry) { }
entry.file( );
function (file) { });
const reader = new plus.io.FileReader(); },
reader.onloadend = function (evt) { // 删除照片
const base64 = evt.target.result; // 获取 Base64 数据 deletePhoto(index, itemIndex) {
resolve(base64); // 返回 Base64 数据 this.itemData.detail[index].photos.splice(itemIndex, 1);
}; },
reader.readAsDataURL(file); // 读取文件并转换为 Base64 // 处理弹窗确认
}, handlePopupConfirm(summary) {
function (error) { this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域
reject("获取文件对象失败:" + error.message); },
} // 处理】数据
); getFromData() {
}, const isValid = this.areAllObjectsValid(this.itemData.detail); //false不通过 true通过
function (error) { console.log("wlhj", isValid);
reject("解析文件路径失败:" + error.message); const isAllOne = this.areAllInspectionResultsOne(this.itemData.detail);
} console.log("isAllOne", isAllOne);
); this.itemData.isValid = isValid;
}); this.itemData.inspectionItem = this.inspectionItem;
}, this.itemData.status = isAllOne.status; //1表示已经巡检过没有异常
// 删除照片 this.itemData.statusLabel = isAllOne.statusLabel;
deletePhoto(index, itemIndex) { console.log("查看数据", this.itemData);
this.itemData.detail[index].photos.splice(itemIndex, 1); return this.itemData;
}, },
// 处理弹窗确认 // 数据校验方法 true说明有未填项
handlePopupConfirm(summary) { areAllObjectsValid(details) {
this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域 // 检查是否有任何项的 inspectionResult 为空字符串
}, const hasEmptyResult = details.some(
// 处理】数据 (item) => item.inspectionResult === ""
getFromData() { );
const isValid = this.areAllObjectsValid(this.itemData.detail); //false不通过 true通过 if (hasEmptyResult) {
console.log("wlhj", isValid); return false;
const isAllOne = this.areAllInspectionResultsOne(this.itemData.detail); }
console.log("isAllOne", isAllOne);
this.itemData.isValid = isValid; // 遍历每一项进行检查
this.itemData.inspectionItem = this.inspectionItem; for (const item of details) {
this.itemData.status = isAllOne.status; //1表示已经巡检过没有异常 if (item.inspectionResult === 0) {
this.itemData.statusLabel = isAllOne.statusLabel; // 如果 inspectionResult 为 0,跳过此项的其他检查
console.log("查看数据", this.itemData); continue;
return this.itemData; } else if (item.inspectionResult === 1) {
}, // 如果 inspectionResult 为 1,检查 conclusion 和 photos
// 数据校验方法 true说明有未填项 if (!item.conclusion || item.photos.length === 0) {
areAllObjectsValid(details) { return false;
// 检查是否有任何项的 inspectionResult 为空字符串 }
const hasEmptyResult = details.some( } else {
(item) => item.inspectionResult === "" // 其他情况(理论上不应该存在,根据当前规则)
); return false;
if (hasEmptyResult) { }
return false; }
} // 所有检查都通过
return true;
// 遍历每一项进行检查 },
for (const item of details) { areAllInspectionResultsOne(details) {
if (item.inspectionResult === 0) { let hasEmpty = false;
// 如果 inspectionResult 为 0,跳过此项的其他检查 let allZero = true;
continue; let hasOne = false;
} else if (item.inspectionResult === 1) {
// 如果 inspectionResult 为 1,检查 conclusion 和 photos for (const item of details) {
if (!item.conclusion || item.photos.length === 0) { if (item.inspectionResult === "") {
return false; hasEmpty = true;
} break;
} else { } else if (item.inspectionResult === 1) {
// 其他情况(理论上不应该存在,根据当前规则) hasOne = true;
return false; allZero = false;
} } else if (item.inspectionResult === 0) {
} // 继续检查
// 所有检查都通过 } else {
return true; // 如果有其他值,可以在这里处理
}, allZero = false;
areAllInspectionResultsOne(details) { }
let hasEmpty = false; }
let allZero = true;
let hasOne = false; if (hasEmpty) {
return {
for (const item of details) { statusLabel: "未巡检",
if (item.inspectionResult === "") { status: 0
hasEmpty = true; };
break; } else if (allZero) {
} else if (item.inspectionResult === 1) { return {
hasOne = true; statusLabel: "已巡检",
allZero = false; status: 1
} else if (item.inspectionResult === 0) { };
// 继续检查 } else if (hasOne) {
} else { return {
// 如果有其他值,可以在这里处理 statusLabel: "巡检异常",
allZero = false; status: 2
} };
} } else {
// 默认情况,可以根据需求调整
if (hasEmpty) { return {
return { statusLabel: "未巡检", status: 0 }; statusLabel: "未巡检",
} else if (allZero) { status: 0
return { statusLabel: "已巡检", status: 1 }; };
} else if (hasOne) { }
return { statusLabel: "巡检异常", status: 2 }; },
} else { setNormal() {
// 默认情况,可以根据需求调整 this.itemData.detail.forEach((item) => {
return { statusLabel: "未巡检", status: 0 }; item.inspectionResult = 0;
} });
}, },
setNormal() { },
this.itemData.detail.forEach((item) => { };
item.inspectionResult = 0; </script>
}); <style scoped lang="less">
}, .form-item {
}, display: flex;
}; align-items: center;
</script> padding: 9.6px 0;
<style scoped lang="less"> line-height: 28.8px;
.form-item { border-bottom: 0.8px solid #f2f3f5;
display: flex;
align-items: center; .form-label {
padding: 9.6px 0; font-size: 11.2px;
line-height: 28.8px; margin-right: 25.6px;
border-bottom: 0.8px solid #f2f3f5; width: 88px;
text-align: right;
.form-label { color: #7c7c7c;
font-size: 11.2px;
margin-right: 25.6px; .required {
width: 88px; color: red;
text-align: right; margin-right: 3.2px;
color: #7c7c7c; }
}
.required {
color: red; .conclusion {
margin-right: 3.2px; &.no-text {
} color: #c7c7c7;
} }
.conclusion {
&.no-text { .have {
color: #c7c7c7; color: #000;
} }
.have { }
color: #000;
} .label {
} font-size: 11.2px;
.label { }
font-size: 11.2px;
} .switch-container {
display: flex;
.switch-container { gap: 9.6px;
display: flex;
gap: 9.6px; .status-btn {
flex: 1;
.status-btn { padding: 5.6px 19.2px;
flex: 1; font-size: 12.8px;
padding: 5.6px 19.2px; color: #000000;
font-size: 12.8px; background: #f2f2f2;
color: #000000; text-align: center;
background: #f2f2f2; font-weight: 400;
text-align: center; line-height: 17.6px;
font-weight: 400; border-radius: 14.4px;
line-height: 17.6px;
border-radius: 14.4px; &.active {
color: #ffffff;
&.active { background: #3774f6;
color: #ffffff; border: 0.32px solid rgba(224, 224, 224, 1);
background: #3774f6; }
border: 0.32px solid rgba(224, 224, 224, 1); }
} }
}
} .input-box {
flex: 1;
.input-box { border-radius: 3.2px;
flex: 1; font-size: 12.8px;
border-radius: 3.2px; line-height: 19.2px;
font-size: 12.8px; }
line-height: 19.2px;
} .photo-limit {
font-size: 12.8px;
.photo-limit { color: #959595;
font-size: 12.8px; line-height: 19.2px;
color: #959595; font-weight: 400;
line-height: 19.2px; }
font-weight: 400;
} .photo-container {
display: flex;
.photo-container { flex-wrap: wrap;
display: flex; margin-bottom: 6.4px;
flex-wrap: wrap;
margin-bottom: 6.4px; .photo-item {
position: relative;
.photo-item { margin-right: 6.4px;
position: relative; margin-bottom: 6.4px;
margin-right: 6.4px;
margin-bottom: 6.4px; .photo {
width: 57.6px;
.photo { height: 57.6px;
width: 57.6px; border-radius: 3.2px;
height: 57.6px; margin-left: 9.6px;
border-radius: 3.2px; }
margin-left: 9.6px;
} .delete-photo {
position: absolute;
.delete-photo { top: -6.4px;
position: absolute; right: -6.4px;
top: -6.4px; background-color: #ff4d4f;
right: -6.4px; color: #fff;
background-color: #ff4d4f; width: 12.8px;
color: #fff; height: 12.8px;
width: 12.8px; border-radius: 50%;
height: 12.8px; text-align: center;
border-radius: 50%; line-height: 12.8px;
text-align: center; font-size: 9.6px;
line-height: 12.8px; }
font-size: 9.6px; }
} }
}
} .photo-btn {
background: #ffffff;
.photo-btn { border: 0.272px solid rgba(221, 221, 221, 1);
background: #ffffff; border-radius: 1.64px;
border: 0.272px solid rgba(221, 221, 221, 1); width: 57.6px;
border-radius: 1.64px; height: 57.6px;
width: 57.6px; font-size: 57.6px;
height: 57.6px; color: #cccccc;
font-size: 57.6px; text-align: center;
color: #cccccc; line-height: 51.2px;
text-align: center; }
line-height: 51.2px; }
} </style>
} \ No newline at end of file
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论