From 3a157c1e07a319fb30b993c96324b73a1495acb6 Mon Sep 17 00:00:00 2001
From: lld <15027638633@163.com>
Date: Thu, 12 Feb 2026 01:58:28 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=A0=B7=E5=BC=8F=E6=8F=90?=
=?UTF-8?q?=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
pages/index.vue | 58 +++++++++++++++++++++++++++++++++++++++----------
1 file changed, 47 insertions(+), 11 deletions(-)
diff --git a/pages/index.vue b/pages/index.vue
index 18936b3..f208ea1 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -15,12 +15,20 @@
class="list-item"
@tap="onItemTap(item)"
>
- {{ item.title }}
- {{ item.subtitle }}
+
+ {{ item.title }}
+ {{ item.status }}
+
+
+
+ {{ item.subtitle }}
+ {{ item.online }}
+
- {{ item.city }}
- {{ item.level }}
- {{ item.status }}
+ 温度1: {{ item.temp1 }}℃
+ 温度2: {{ item.temp2 }}℃
+ 温度3: {{ item.temp3 }}℃
+ 温度4: {{ item.temp4 }}℃
@@ -85,9 +93,12 @@ export default {
id: `item-${i}`,
title: `项目名称${i}`,
subtitle: `公司名称${i}`,
- city: '广州',
- level: '省级项目',
- status: '已开工'
+ temp1: Math.floor(Math.random() * 51),
+ temp2: Math.floor(Math.random() * 51),
+ temp3: Math.floor(Math.random() * 51),
+ temp4: Math.floor(Math.random() * 51),
+ status: '自动模式',
+ online: '在线'
})
}
@@ -182,6 +193,7 @@ page {
font-size: 26rpx;
color: #666;
line-height: 52rpx;
+ display: flex;
}
.item-tags {
@@ -197,18 +209,42 @@ page {
border-radius: 4rpx;
display: inline-block; /* 修复H5端padding不生效问题 */
}
+.tag-status {
+ background-color: #f8f1f1;
+ color: #e66060;
+ margin-left: 20rpx;
+ font-weight: lighter;
+ line-height: 40rpx;
+}
-.tag-city {
+.tag-online {
+ font-size: 22rpx;
+ padding: 0 20rpx;
+ border-radius: 4rpx;
+ background-color: #f0f9eb;
+ color: #67c23a;
+ white-space: nowrap; /* 标签不换行 */
+ /* 兜底:如果flex失效,用margin-left:auto强制居右 */
+ margin-left: auto;
+ display: inline-block; /* 确保样式生效 */
+ transform: translateY(-30rpx) translateX(-60rpx);
+}
+.tag-temp1 {
background-color: #e8f4ff;
color: #409eff;
}
-.tag-level {
+.tag-temp2 {
background-color: #fdf4e4;
color: #f5961d;
}
-.tag-status {
+.tag-temp3 {
+ background-color: #f4f4f5;
+ color: #909399;
+}
+
+.tag-temp4 {
background-color: #f0f9eb;
color: #67c23a;
}