Sumuxi/fastbee
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

20260905:微信小程序-蓝牙采集网关-样式调试

Browse Source
This commit is contained in:
zhugongping 2026-09-05 15:35:20 +08:00
parent 823ce54419
commit d146afe5fa
12 changed files with 102 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
yack-mini/miniprogram/assets/images/default-avatar.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

4
yack-mini/miniprogram/components/device-card/device-card.wxml
View File

@ -32,6 +32,8 @@
bindchange="handleSwitch"
/>
<!-- 删除按钮 -->
<view class="delete-btn" catchtap="handleDelete">删除</view>
<button class="delete-btn" catchtap="handleDelete" size="mini">
删除
</button>
</view>
</view>

25
yack-mini/miniprogram/components/device-card/device-card.wxss
View File

@ -83,7 +83,9 @@
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: space-between;
margin-left: 20rpx;
height: 120rpx;
}
.device-switch {
@ -92,7 +94,28 @@
}
.delete-btn {
display: flex;
align-items: center;
justify-content: center;
min-width: 100rpx;
height: 56rpx;
padding: 0 20rpx;
margin: 0;
font-size: 24rpx;
color: #ff4d4f;
padding: 4rpx 12rpx;
background-color: #fff1f0;
border: 1rpx solid #ffa39e;
border-radius: 28rpx;
line-height: 1;
transition: all 0.2s ease;
}
.delete-btn::after {
border: none;
}
.delete-btn:active {
background-color: #ff4d4f;
color: #fff;
border-color: #ff4d4f;
}

4
yack-mini/miniprogram/env.config.js
View File

@ -5,8 +5,8 @@
// 开发环境
const DEV_CONFIG = {
baseUrl: 'http://localhost:8080',
mqttServer: 'wxs://localhost:8084/mqtt',
baseUrl: 'http://192.168.110.117:8080',
mqttServer: 'wxs://192.168.110.117:8084/mqtt',
};
// 生产环境

13
yack-mini/miniprogram/pages/device/detail/detail.wxss
View File

@ -140,11 +140,22 @@
.btn-upload {
flex: 1;
min-width: 200rpx;
display: flex;
align-items: center;
justify-content: center;
height: 80rpx;
line-height: 80rpx;
line-height: 1;
font-size: 28rpx;
border-radius: 8rpx;
border: none;
padding: 0;
margin: 0;
}
.btn-connect::after,
.btn-mqtt::after,
.btn-upload::after {
border: none;
}
.btn-connect {

34
yack-mini/miniprogram/pages/device/scan/scan.wxss
View File

@ -119,22 +119,40 @@
.btn-scan {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
background-color: #1890ff;
color: #fff;
height: 88rpx;
line-height: 88rpx;
line-height: 1;
border-radius: 44rpx;
border: none;
padding: 0;
margin: 0;
}
.btn-scan::after {
border: none;
}
.btn-stop {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
background-color: #ff4d4f;
color: #fff;
height: 88rpx;
line-height: 88rpx;
line-height: 1;
border-radius: 44rpx;
border: none;
padding: 0;
margin: 0;
}
.btn-stop::after {
border: none;
}
/* 配置弹窗 */
@ -212,12 +230,22 @@
.btn-cancel,
.btn-confirm {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
height: 100rpx;
line-height: 100rpx;
line-height: 1;
font-size: 30rpx;
border: none;
border-radius: 0;
background-color: transparent;
padding: 0;
margin: 0;
}
.btn-cancel::after,
.btn-confirm::after {
border: none;
}
.btn-cancel {

4
yack-mini/miniprogram/pages/index/index.wxml
View File

@ -1,14 +1,14 @@
<!-- 首页 - 设备列表 -->
<view class="container">
<!-- 已登录用户信息栏 -->
<view class="user-bar card" wx:if="{{userInfo}}">
<!-- <view class="user-bar card" wx:if="{{userInfo}}">
<image class="user-avatar" src="{{userInfo.avatar || '/assets/images/default-avatar.png'}}" mode="aspectFill"></image>
<view class="user-info">
<text class="user-name">{{userInfo.userName}}</text>
<text class="user-id">ID: {{userInfo.userId}}</text>
</view>
<view class="logout-btn" bindtap="handleLogout">退出</view>
</view>
</view> -->
<!-- 设备列表 -->
<view class="device-list" wx:if="{{devices.length > 0}}">

12
yack-mini/miniprogram/pages/index/index.wxss
View File

@ -58,16 +58,26 @@
}
.add-btn {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
background-color: #1890ff;
color: #fff;
height: 92rpx;
line-height: 92rpx;
line-height: 1;
font-size: 32rpx;
border-radius: 46rpx;
border: none;
padding: 0;
margin: 0;
box-shadow: 0 8rpx 24rpx rgba(24, 144, 255, 0.4);
}
.add-btn::after {
border: none;
}
.add-btn:active {
background-color: #096dd9;
}

2
yack-mini/miniprogram/pages/login/login.wxml
View File

@ -4,7 +4,7 @@
<view class="login-header">
<image class="logo" src="/assets/images/logo_zh.png" mode="aspectFit"></image>
<text class="title">岩安测控蓝牙网关</text>
<text class="subtitle">采集 BLE 设备数据，透传至云平台</text>
<!-- <text class="subtitle">采集 BLE 设备数据，透传至云平台</text> -->
</view>
<!-- 登录表单 -->

9
yack-mini/miniprogram/pages/login/login.wxss
View File

@ -78,12 +78,21 @@
.btn-login {
width: 100%;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: #1890ff;
color: #fff;
font-size: 32rpx;
border-radius: 8rpx;
margin-top: 40rpx;
border: none;
padding: 0;
line-height: 1;
}
.btn-login::after {
border: none;
}
.btn-login:active {

2
yack-mini/miniprogram/pages/mine/mine.wxml
View File

@ -6,7 +6,7 @@
<image class="avatar" src="/assets/images/default-avatar.png" mode="aspectFill"></image>
<view class="info">
<text class="username">{{userInfo.userName || '未登录'}}</text>
<text class="user-id">ID: {{userInfo.userId || '-'}}</text>
<!-- <text class="user-id">ID: {{userInfo.userId || '-'}}</text> -->
</view>
</view>
</view>

7
yack-mini/miniprogram/pages/mine/mine.wxss
View File

@ -118,12 +118,17 @@
.logout-btn {
width: 100%;
height: 88rpx;
line-height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: #fff;
color: #ff4d4f;
font-size: 32rpx;
border: none;
border-radius: 8rpx;
padding: 0;
margin: 0;
line-height: 1;
}
.logout-btn::after {