Skip to content

C
computedRoomPad
提交 06977511 authored 作者: caodi\cd's avatar caodi\cd
浏览文件
操作

fix:详情优化

上级 fdc4b2ad
隐藏空白字符变更
内嵌 并排
正在显示 包含 289 行增加 和 52 行删除
pages/inspectionContent/components/detail.vue
浏览文件 @ 06977511
......@@ -382,52 +382,52 @@ export default {
<style scoped lang="less">
.detail-box {
height: calc(100vh - 225px);
border-radius: 0 0 12px 12px;
height: calc(100vh - 180px);
border-radius: 0 0 9.6px 9.6px;
background-color: #fff;
padding: 0 24px 24px;
padding: 0 19.2px 19.2px;
.weitu {
width: 100%;
margin-bottom: 24px;
height: 350px;
margin-bottom: 19.2px;
height: 280px;
}
.container {
.container-item {
margin-bottom: 24px;
margin-bottom: 19.2px;
.title {
font-size: 16px;
font-size: 12.8px;
color: #000000;
line-height: 24px;
line-height: 19.2px;
font-weight: 500;
margin-bottom: 12px;
margin-bottom: 9.6px;
}
.cards {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.cards-item {
width: calc(50% - 8px);
margin-bottom: 16px;
width: calc(50% - 6.4px);
margin-bottom: 12.8px;
background: #f9f9f9;
border-radius: 8px;
padding: 8px;
border-radius: 6.4px;
padding: 6.4px;
&.sbgj {
width: 100%;
}
.name {
font-size: 16px;
font-size: 12.8px;
color: #000000;
line-height: 24px;
line-height: 19.2px;
font-weight: 500;
margin-bottom: 12px;
margin-bottom: 9.6px;
.status {
margin-left: 8px;
padding: 0 8px;
font-size: 12px;
margin-left: 6.4px;
padding: 0 6.4px;
font-size: 9.6px;
background: #e6f9f3;
border-radius: 11px;
border-radius: 8.8px;
color: #0cc991;
line-height: 20px;
line-height: 16px;
font-weight: 400;
&.warning {
background: #fdebe9;
......@@ -437,33 +437,33 @@ export default {
}
.list {
display: flex;
align-items: flex-start; /* 让内容垂直对齐在顶部 */
margin-bottom: 12px;
align-items: flex-start;
margin-bottom: 9.6px;
&:last-child {
margin-bottom: 0;
}
.label {
width: 70px; /* 设置左侧 label 的宽度 */
font-size: 14px;
width: 56px;
font-size: 11.2px;
color: #7c7c7c;
line-height: 22px;
line-height: 17.6px;
font-weight: 400;
}
.content {
flex: 1; /* 右侧内容占据剩余空间 */
word-wrap: break-word; /* 使文本自动换行 */
font-size: 14px;
flex: 1;
word-wrap: break-word;
font-size: 11.2px;
color: #000000;
line-height: 22px;
line-height: 17.6px;
font-weight: 400;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
.image-item {
width: 72px;
height: 72px;
margin-right: 8px;
border-radius: 4px;
width: 57.6px;
height: 57.6px;
margin-right: 6.4px;
border-radius: 3.2px;
}
}
}
......@@ -472,4 +472,4 @@ export default {
}
}
}
</style>
</style>
\ No newline at end of file
pages/inspectionContent/inspectionContentList.vue
浏览文件 @ 06977511
......@@ -13,7 +13,7 @@
</block>
<block slot="right" class="nav-right">
<view class="header-buttons">
<button class="button" @click="lookLog">查看样表</button>
<button class="button" @click="lookTable">查看样表</button>
</view>
</block>
</uni-nav-bar>
......@@ -53,7 +53,7 @@
>
</view>
</view>
<view class="card-box">
<view v-if="!isSign" class="card-box">
<view
class="card-row"
:class="{ right: rowIndex % 2 !== 0 }"
......@@ -91,7 +91,7 @@
</view>
</view></view
>
<view class="card-box">
<view v-else class="card-box">
<view
class="card-row"
:class="{ right: rowIndex % 2 !== 0 }"
......@@ -117,14 +117,6 @@
<text class="location">{{ card.name }}</text>
</view>
</view>
<view class="spacer-image right" v-if="cardIndex < row.length - 1">
<!-- <image src="@/static/img/arr2.svg" mode="aspectFit"></image> -->
</view>
<view class="spacer-image bottom" v-if="rowIndex < rows.length - 1">
<view v-if="cardIndex == 0 || cardIndex == 4">
<!-- <image src="@/static/img/arr2.svg" mode="aspectFit"></image> -->
</view>
</view>
</view>
</view>
</view>
......@@ -279,6 +271,11 @@ export default {
url: `/pages/inspectionContent/inspectionContentNew?value=${value}&inspectionCode=${this.inspectionCode}&jfType=${jfType}&location=${location}&uid=${this.uid}&backValue=${this.backValue}`,
});
},
lookTable() {
uni.navigateTo({
url: "/pages/report/sampleTable?isJF=1",
});
},
toSign() {
this.$refs.signDialog.open();
},
......
pages/shaftInspection/model/detail.vue 0 → 100644
浏览文件 @ 06977511
<template>
<view class="detail-box">
<!-- <image
class="weitu"
src="@/static/img/add-img/weitu.png"
mode="aspectFit"
></image> -->
<view class="container">
<view class="container-item">
<view class="cards">
<view
v-for="(item, index) in detailsItem"
:key="index"
class="cards-item"
>
<view class="name"
>{{ item.dictLabel
}}<text
class="status"
:class="{ warning: item.inspectionResult === 1 }"
>{{ item.inspectionResult?"异常":"正常" }}</text
></view
>
<view class="list">
<view class="label">情况描述：</view>
<view class="content">
{{ item.conclusion }}
</view>
</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="center"
></image>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
// 父组件传递的详情
detailsItem: {
type: Object,
default: () => {},
},
},
data() {
return {};
},
mounted() {
console.log("this.detailsItem", this.detailsItem);
},
methods: {},
};
</script>
<style scoped lang="less">
.detail-box {
border-radius: 0 0 9.6px 9.6px;
background-color: #fff;
margin-top: 6.4px;
.weitu {
width: 100%;
margin-bottom: 19.2px;
height: 280px;
}
.container {
.container-item {
margin-bottom: 19.2px;
.title {
font-size: 12.8px;
color: #000000;
line-height: 19.2px;
font-weight: 500;
margin-bottom: 9.6px;
}
.cards {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.cards-item {
width: calc(50% - 6.4px);
margin-bottom: 12.8px;
background: #f9f9f9;
border-radius: 6.4px;
padding: 6.4px;
&.sbgj {
width: 100%;
}
.name {
font-size: 12.8px;
color: #000000;
line-height: 19.2px;
font-weight: 500;
margin-bottom: 9.6px;
.status {
margin-left: 6.4px;
padding: 0 6.4px;
font-size: 9.6px;
background: #e6f9f3;
border-radius: 8.8px;
color: #0cc991;
line-height: 16px;
font-weight: 400;
&.warning {
background: #fdebe9;
color: #f55a42;
}
}
}
.list {
display: flex;
align-items: flex-start;
margin-bottom: 9.6px;
&:last-child {
margin-bottom: 0;
}
.label {
width: 56px;
font-size: 11.2px;
color: #7c7c7c;
line-height: 17.6px;
font-weight: 400;
}
.content {
flex: 1;
word-wrap: break-word;
font-size: 11.2px;
color: #000000;
line-height: 17.6px;
font-weight: 400;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
.image-item {
width: 57.6px;
height: 57.6px;
margin-right: 6.4px;
border-radius: 3.2px;
}
}
}
}
}
}
}
}
</style>
\ No newline at end of file
pages/shaftInspection/shaftInspectionList.vue
浏览文件 @ 06977511
......@@ -14,7 +14,7 @@
</block>
<block slot="right" class="nav-right">
<view class="header-buttons">
<button class="button" @click="lookLog">查看样表</button>
<button class="button" @click="lookTable">查看样表</button>
</view>
</block>
</uni-nav-bar>
......@@ -43,7 +43,7 @@
</view>
</view>
</view>
<view class="content-box">
<view v-if="!isSign" class="content-box">
<!-- 左侧模块 -->
<view class="left-side">
<view
......@@ -102,6 +102,56 @@
</view>
</view>
</view>
<view v-else class="content-box">
<!-- 左侧模块 -->
<view class="left-side">
<view
v-for="(tab, index) in tabsDetail"
:key="index"
:class="['tab-item', { active: activeTab === index }]"
@click="getActiveTabDetails(index)"
>
{{ tab }}
</view>
</view>
<!-- 右侧模块 -->
<view class="right-side">
<!-- 第二部分：卡片组 -->
<view class="card-box">
<view
class="card-group"
v-for="(item, index) in cardsInfo"
:key="index"
>
<view class="card-title">{{ item.name }}</view>
<view class="card-list">
<view
v-for="position in item.position"
:key="position.dictValue"
class="card"
@click="getDetailsItem(item.value, position.dictValue)"
>
<view class="card-content">
<view class="status-line">
<image src="/static/status-icon.png" class="status-icon" />
<text class="status-text">{{ position.statusLable }}</text>
</view>
<view class="info-line">
<text class="info-text"
>{{ item.name }}{{ position.dictLabel }}</text
>
</view>
</view>
</view>
</view>
</view>
<view v-if="isShow" class="card-group">
<detail ref="detail" :detailsItem="detailsItem"></detail
></view>
</view>
</view>
</view>
<signDialog ref="signDialog" @confirm="handlePopupConfirm"></signDialog>
</view>
</template>
......@@ -117,13 +167,16 @@ import {
} from "@/utils/IoReadingAndWriting.js";
import { getInspectionDetails } from "@/request/index.js";
import signDialog from "@/components/signDialog.vue";
import detail from "./model/detail.vue";
export default {
components: {
signDialog,
detail,
},
data() {
return {
tabs: ["所有井道"], // 选项卡内容
tabsDetail: [],
activeTab: 0, // 默认选中的选项卡
inspectionNumber: 0, // 已巡检的井道数量
cards: [
......@@ -152,6 +205,8 @@ export default {
options: {}, //存储数据
backValue: "",
all_data: [], //所有数据
detailsItem: {}, //单个井道详情
isShow:false,
};
},
computed: {
......@@ -177,7 +232,7 @@ export default {
} else {
this.init();
}
this.all_data = this.$store.state.all_data
this.all_data = this.$store.state.all_data;
},
mounted() {},
methods: {
......@@ -216,6 +271,19 @@ export default {
resolve();
});
},
// 获取井道详情
getDetailsItem(value, dictValue) {
let item = this.detailsInfo.originData[value - 1].position[dictValue - 1];
if (item.status < 1) {
uni.showToast({
title: "该井道暂无数据",
icon: "none",
});
}
this.detailsItem = item.details;
this.isShow = true
console.log("this.detailsItem", this.detailsItem);
},
getActiveTab(index) {
this.activeTab = index;
console.log("this.activeTab", this.activeTab);
......@@ -225,6 +293,11 @@ export default {
this.cardsInfo = [this.tabList[index - 1]];
}
},
getActiveTabDetails(index) {
this.activeTab = index;
this.cardsInfo = [this.tabList[index]];
this.isShow = false
},
// 回显数据
getDetails(uid) {
uni.showLoading();
......@@ -239,11 +312,13 @@ export default {
this.cardsInfo = this.tabList = detailsInfo.originData;
this.isSubmit = this.detailsInfo.isSubmit;
this.isSign = this.detailsInfo.isSign;
console.log("this.cardsInfo", this.cardsInfo);
this.cardsInfo.forEach((item) => {
this.tabs.push(item.name);
this.tabsDetail.push(item.name);
});
if (this.isSign) {
this.getActiveTabDetails(0);
}
this.isDisable = this.isDisable || detailsInfo.synchronization == 1; // 是否禁用 1:已同步数据 0: 未同步数据
uni.hideLoading();
})
......@@ -287,7 +362,7 @@ export default {
params.signImg = value;
console.log("all_data", all_data);
const index = all_data.findIndex((element) => element.uid == this.uid);
console.log("签字获取数据",params)
console.log("签字获取数据", params);
all_data[index] = params;
const logContent = getLogContent(LOG_TYPE_ENUM.sign, "签字", "机房巡检");
// 更新巡检list
......@@ -312,6 +387,7 @@ export default {
title: type == "sign" ? "签字成功" : "同步成功",
icon: "success",
});
this.getActiveTabDetails(0);
},
lookTable() {
uni.navigateTo({
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论