1

App.vue

@@ -34,15 +34,6 @@
 		height: 88rpx;
 		position: relative;
 	}
-
-	uni-slider .uni-slider-value {
-		position: absolute;
-		color: rgba(255, 255, 255, 0.8);
-		font-size: 32rpx;
-		right: 2.5%;
-		top: -60rpx
-	}
-
 	.custom-file-picker .file-picker__box-content {
 		background: rgba(26, 26, 26, 1);
 		border: none !important;

pages/6170/deviceControl/index.vue

@@ -52,13 +52,14 @@
 			</view>
 			<view class="info-row">
 				<text class="info-label">灯光亮度</text>
-				<text class="info-value status-running">%</text>
+				<text class="info-value status-running">{{ sliderValue }}%</text>
 			</view>
 
 			<!-- 灯光亮度控制 -->
 			<view class="control-card">
 				<slider :value="sliderValue" min="0" max="100" activeColor="rgb(187, 230, 0)"
-					backgroundColor="rgb(26, 26, 26)" show-value />
+					backgroundColor="rgb(26, 26, 26)" :show-value="false" @changing="onSliderChanging"
+					@change="onSliderChanging" />
 			</view>
 
 			<!-- 灯光模式选择 -->
@@ -100,7 +101,6 @@
 					<view class="section-title">人员信息登记</view>
 					<!-- <button class="send-btn">发送</button> -->
 					<view class="right-icons">
-
 						<uni-icons @click="toggleForm" :type="isFormExpanded ? 'arrowup' : 'down'" size="20"
 							color="rgba(255, 255, 255, 0.87" class="toggle-icon" />
 					</view>
@@ -248,25 +248,9 @@
 			}
 		},
 		methods: {
-			async initMQTT() {
+			onSliderChanging(e) {
-				try {
+				this.sliderValue = e.detail.value;
-					if (!isMQTTConnected()) {
-						await connectMQTT()
-					}
-					await publishMessage('/test/123/456/set', 'Hello MQTT!')
-					uni.showToast({
-						title: '消息发送成功'
-					})
-				} catch (error) {
-					console.error('发送失败:', error)
-					uni.showToast({
-						title: '发送失败',
-						icon: 'none'
-					})
-				}
 			},
-
-
 			selectMode(type) {
 				this.modeType = type;
 				this.lightModeA = true;
@@ -639,7 +623,7 @@
 		display: flex;
 		align-items: center;
 		margin-bottom: 20rpx;
-		background: rgb(42, 42, 42);
+		background: rgba(42, 42, 42, 1);
 		border-radius: 16rpx;
 		padding-left: 20rpx;
 	}