提交 6a72f2ce authored 作者: caodi\cd's avatar caodi\cd

fix:机房事项

上级 72c8969d
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
差异被折叠。
...@@ -3,17 +3,19 @@ ...@@ -3,17 +3,19 @@
<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="required">*</text>巡检结论</text> <text class="form-label"
><text class="required">*</text>{{ item.label }}</text
>
<view class="switch-container"> <view class="switch-container">
<view <view
:class="['status-btn', { active: item.inspectionResult === 0 }]" :class="['status-btn', { active: item.inspectionResult === 0 }]"
@click="setInspectionResult(0)" @click="setInspectionResult(index, 0)"
> >
正常 正常
</view> </view>
<view <view
:class="['status-btn', { active: item.inspectionResult === 1 }]" :class="['status-btn', { active: item.inspectionResult === 1 }]"
@click="setInspectionResult(1)" @click="setInspectionResult(index, 1)"
> >
异常 异常
</view> </view>
...@@ -27,20 +29,24 @@ ...@@ -27,20 +29,24 @@
}}</text> }}</text>
</view> </view>
<view class="form-item"> <view class="form-item">
<text class="form-label">现场照片</text> <text class="form-label"><text class="required">*</text>现场照片</text>
<view class="photo-box"> <view class="photo-box">
<view class="photo-container"> <view class="photo-container">
<view @click="takePhoto" class="photo-btn"> + </view> <view @click="takePhoto(index)" class="photo-btn"> + </view>
<view <view
v-for="(photo, index) in item && item.photos" v-for="(photo, itemIndex) in item && item.photos"
:key="index" :key="itemIndex"
class="photo-item" class="photo-item"
> >
<image :src="photo" class="photo"></image> <image :src="photo" class="photo"></image>
<text class="delete-photo" @click="deletePhoto(index)">×</text> <text class="delete-photo" @click="deletePhoto(index, itemIndex)"
>×</text
>
</view> </view>
</view> </view>
<view class="photo-limit">请对检查项进行拍照留存(限5张)。</view> <view class="photo-limit"
>请对检查项进行拍照留存(限5张)。发现“异常、告警”时,需拍照留存。</view
>
</view> </view>
</view> </view </view> </view
><custom-popup ><custom-popup
...@@ -52,7 +58,7 @@ ...@@ -52,7 +58,7 @@
</template> </template>
<script> <script>
import customPopup from "../components/customPopup.vue"; import customPopup from "./customPopup.vue";
import _ from "lodash"; import _ from "lodash";
export default { export default {
...@@ -74,8 +80,9 @@ export default { ...@@ -74,8 +80,9 @@ export default {
itemData: { itemData: {
type: Object, type: Object,
default: () => ({ default: () => ({
// 0是未巡检 1是已巡检 2巡检异常 isValid: false, // false是校验未通过 true是校验通过
status: 0, // status: 0, 0是未巡检 1是已巡检 2巡检异常 statusLabel: "未巡检",
inspectionItem: "", //巡检事项
detail: [ detail: [
{ {
label: "地板、墙壁破损", label: "地板、墙壁破损",
...@@ -114,6 +121,7 @@ export default { ...@@ -114,6 +121,7 @@ export default {
data() { data() {
return { return {
currentIndex: 0, // 当前操作的索引 currentIndex: 0, // 当前操作的索引
photos: [],
}; };
}, },
computed: { computed: {
...@@ -123,6 +131,59 @@ export default { ...@@ -123,6 +131,59 @@ export default {
}, },
mounted() {}, mounted() {},
methods: { methods: {
// 拍照
takePhoto(index) {
uni.chooseImage({
count: 1,
sourceType: ["camera"], // 可以从相机拍摄
success: async (res) => {
if (this.photos.length < 5) {
const base64 = await this.convertFileToBase64(res.tempFilePaths[0]);
this.itemData.detail[index].photos.push(base64);
} else {
uni.showToast({
title: "最多只能上传5张照片",
icon: "none",
});
}
},
});
},
// 转化为base64
convertFileToBase64(filePath) {
return new Promise((resolve, reject) => {
plus.io.resolveLocalFileSystemURL(
filePath,
function (entry) {
entry.file(
function (file) {
const reader = new plus.io.FileReader();
reader.onloadend = function (evt) {
const base64 = evt.target.result; // 获取 Base64 数据
resolve(base64); // 返回 Base64 数据
};
reader.readAsDataURL(file); // 读取文件并转换为 Base64
},
function (error) {
reject("获取文件对象失败:" + error.message);
}
);
},
function (error) {
reject("解析文件路径失败:" + error.message);
}
);
});
},
// 删除照片
deletePhoto(index, itemIndex) {
this.itemData.detail[index].photos.splice(itemIndex, 1);
},
// 设置巡检结论
setInspectionResult(index, value) {
this.itemData.detail[index].inspectionResult = value; // 0正常 1异常
},
// 显示弹窗 // 显示弹窗
showPopup(index) { showPopup(index) {
this.currentIndex = index; this.currentIndex = index;
...@@ -130,7 +191,59 @@ export default { ...@@ -130,7 +191,59 @@ export default {
}, },
// 处理弹窗确认 // 处理弹窗确认
handlePopupConfirm(summary) { handlePopupConfirm(summary) {
this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域 this.itemData.detail[this.currentIndex].conclusion = summary; // 回显到文字显示区域
},
// 处理】数据
getFromData() {
const isValid = this.areAllObjectsValid(this.itemData.detail); //false不通过 true通过
const isAllOne = this.areAllInspectionResultsOne(this.itemData.detail);
this.itemData.isValid = isValid;
this.itemData.inspectionItem = this.inspectionItem;
// if (isAllOne) {
// // 全都是正常
// this.itemData.status = 1; //1表示已经巡检过没有异常
// this.itemData.statusLabel = "已巡检";
// } else {
// this.itemData.status = 2; //1表示已经巡检过有异常
// this.itemData.statusLabel = "巡检异常";
// }
// console.log(this.itemData);
return this.itemData;
},
// 数据校验方法 true说明有未填项
areAllObjectsValid(arr) {
function isEmpty(value) {
return (
value === null ||
value === undefined ||
(typeof value === "string" && value.trim() === "") ||
(Array.isArray(value) && value.length === 0) ||
(typeof value === "object" &&
!Array.isArray(value) &&
Object.keys(value).length === 0)
);
}
for (let i = 0; i < arr.length; i++) {
const obj = arr[i];
for (const key in obj) {
if (obj.hasOwnProperty(key)) {
const value = obj[key];
if (typeof value === "object") {
if (isEmpty(value) || !allPropertiesNonEmpty([value])) {
return false;
}
} else if (isEmpty(value)) {
return false;
}
}
}
}
return true;
},
// 校验是否有异常
areAllInspectionResultsOne(arr) {
return arr.every((obj) => obj.inspectionResult === 0);
}, },
}, },
}; };
...@@ -146,7 +259,7 @@ export default { ...@@ -146,7 +259,7 @@ export default {
.form-label { .form-label {
font-size: 11.2px; font-size: 11.2px;
margin-right: 25.6px; margin-right: 25.6px;
width: 58.4px; width: 88px;
text-align: right; text-align: right;
color: #7c7c7c; color: #7c7c7c;
...@@ -158,6 +271,9 @@ export default { ...@@ -158,6 +271,9 @@ export default {
.conclusion { .conclusion {
color: #c7c7c7; color: #c7c7c7;
font-size: 11.2px; font-size: 11.2px;
.have {
color: #000;
}
} }
.label { .label {
font-size: 11.2px; font-size: 11.2px;
......
差异被折叠。
差异被折叠。
...@@ -94,7 +94,7 @@ ...@@ -94,7 +94,7 @@
</template> </template>
<script> <script>
import moment from "moment"; import moment from "moment";
import { pad_1_1_inspection_position } from "@/utils/dictJF.js"; import { pad_all_inspection_position } from "@/utils/dict.js";
import { getInspectionDetails } from "@/request/index.js"; import { getInspectionDetails } from "@/request/index.js";
export default { export default {
data() { data() {
...@@ -126,7 +126,7 @@ export default { ...@@ -126,7 +126,7 @@ export default {
methods: { methods: {
init() { init() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let list = pad_1_1_inspection_position.rows.map((item, index) => { let list = pad_all_inspection_position.rows.map((item, index) => {
return item; return item;
}); });
const group1 = list.slice(0, 5); const group1 = list.slice(0, 5);
......
<template>
<view class="container">
<!-- 表单区域 -->
<view class="form">
<view
class="form-item"
v-for="(item, index) in formData"
:key="index"
>
<!-- 文字显示区域 -->
<view class="text-display" @click="showPopup(index)">
{{ item.text || '点击输入文字' }}
</view>
<!-- 图片上传区域 -->
<view class="image-upload">
<image
v-if="item.image"
:src="item.image"
mode="aspectFill"
class="uploaded-image"
></image>
<button @click="uploadImage(index)">上传图片</button>
</view>
</view>
</view>
<!-- 提交按钮 -->
<button class="submit-btn" @click="submitForm">提交</button>
<!-- 自定义弹窗组件 -->
<custom-popup
ref="customPopup"
:inspection-item="currentInspectionItem"
:fixed-words="fixedWords"
@confirm="handlePopupConfirm"
></custom-popup>
</view>
</template>
<script>
import CustomPopup from '@/components/CustomPopup.vue';
export default {
components: {
CustomPopup
},
data() {
return {
formData: [
{ text: '', image: '' },
{ text: '', image: '' },
{ text: '', image: '' },
{ text: '', image: '' },
{ text: '', image: '' }
],
currentIndex: -1, // 当前操作的索引
currentInspectionItem: '巡检事项', // 当前巡检事项
fixedWords: ['漏水', '损坏', '正常', '异常'] // 固定词
};
},
methods: {
// 显示弹窗
showPopup(index) {
this.currentIndex = index;
this.$refs.customPopup.open();
},
// 处理弹窗确认
handlePopupConfirm(summary) {
if (this.currentIndex !== -1) {
this.formData[this.currentIndex].text = summary; // 回显到文字显示区域
this.currentIndex = -1;
}
},
// 上传图片
uploadImage(index) {
uni.chooseImage({
count: 1,
success: (res) => {
if (this.formData[index].image) {
uni.showToast({
title: '每组只能上传一张图片',
icon: 'none'
});
return;
}
this.formData[index].image = res.tempFilePaths[0]; // 保存图片路径
}
});
},
// 提交表单
submitForm() {
let isValid = true;
this.formData.forEach((item, index) => {
if (!item.text || !item.image) {
isValid = false;
uni.showToast({
title: `第 ${index + 1} 组数据未填写完整`,
icon: 'none'
});
}
});
if (isValid) {
uni.showToast({
title: '提交成功',
icon: 'success'
});
console.log('提交的数据:', this.formData);
// 这里可以处理提交逻辑,比如将数据发送到后端
}
}
}
};
</script>
<style scoped>
.container {
padding: 20px;
}
.form {
margin-bottom: 20px;
}
.form-item {
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 8px;
padding: 10px;
}
.text-display {
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
margin-bottom: 10px;
cursor: pointer;
}
.image-upload {
display: flex;
align-items: center;
}
.uploaded-image {
width: 100px;
height: 100px;
margin-right: 10px;
border-radius: 5px;
}
.submit-btn {
background-color: #007aff;
color: #fff;
padding: 10px;
border-radius: 5px;
text-align: center;
}
</style>
\ No newline at end of file
...@@ -593,7 +593,8 @@ export default { ...@@ -593,7 +593,8 @@ export default {
switchTab(index) { switchTab(index) {
this.activeTab = index; this.activeTab = index;
this.updateCurrentTabData(); this.updateCurrentTabData();
}, // 设置巡检结论 },
// 设置巡检结论
setInspectionResult(value) { setInspectionResult(value) {
console.log("value", value); console.log("value", value);
this.inspectionResult = value; this.inspectionResult = value;
......
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论