diff --git a/miniprogram/app.json b/miniprogram/app.json
index 3d96a25..6b8c50c 100644
--- a/miniprogram/app.json
+++ b/miniprogram/app.json
@@ -1,12 +1,12 @@
{
"pages": [
- "pages/data/data",
+ "pages/equipment/equipment",
"pages/login/login",
"pages/supplementPersonal/supplementPersonal",
"pages/connectedDevice/connectedDevice",
"pages/connectedWifi/connectedWifi",
"pages/home/home",
- "pages/equipment/equipment",
+ "pages/data/data",
"pages/my/my",
"pages/personalInformation/personalInformation",
"pages/helpCenter/helpCenter",
diff --git a/miniprogram/components/equipmentDialog/equipmentDialog.json b/miniprogram/components/equipmentDialog/equipmentDialog.json
new file mode 100644
index 0000000..59a1db6
--- /dev/null
+++ b/miniprogram/components/equipmentDialog/equipmentDialog.json
@@ -0,0 +1,4 @@
+{
+ "component": true,
+ "usingComponents": {}
+}
diff --git a/miniprogram/components/equipmentDialog/equipmentDialog.less b/miniprogram/components/equipmentDialog/equipmentDialog.less
new file mode 100644
index 0000000..aae644b
--- /dev/null
+++ b/miniprogram/components/equipmentDialog/equipmentDialog.less
@@ -0,0 +1,42 @@
+.equipment-mask {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(37, 37, 53, 0.6);
+ z-index: 100;
+}
+
+.equipment-panel {
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 560rpx;
+ box-sizing: border-box;
+ background-color: #FFFFFF;
+ border-radius: 24rpx;
+ z-index: 101;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding: 100rpx 40rpx;
+
+ .equipment-title {
+ color: #252535;
+ height: 32rpx;
+ font-size: 32rpx;
+ line-height: 32rpx;
+ text-align: center;
+ }
+
+ .equipment-content {
+ color: #808080;
+ font-size: 24rpx;
+ line-height: 34rpx;
+ text-align: center;
+ margin-top: 24rpx;
+ white-space: pre-line;
+ }
+}
diff --git a/miniprogram/components/equipmentDialog/equipmentDialog.ts b/miniprogram/components/equipmentDialog/equipmentDialog.ts
new file mode 100644
index 0000000..456a77c
--- /dev/null
+++ b/miniprogram/components/equipmentDialog/equipmentDialog.ts
@@ -0,0 +1,26 @@
+Component({
+ properties: {
+ /** 是否显示弹框 */
+ show: {
+ type: Boolean,
+ value: false
+ },
+ /** 标题 */
+ title: {
+ type: String,
+ value: ''
+ },
+ /** 副标题(支持 \n 换行) */
+ content: {
+ type: String,
+ value: ''
+ }
+ },
+
+ methods: {
+ /** 点击遮罩关闭 */
+ onTapMask() {
+ this.triggerEvent('close')
+ }
+ }
+})
diff --git a/miniprogram/components/equipmentDialog/equipmentDialog.wxml b/miniprogram/components/equipmentDialog/equipmentDialog.wxml
new file mode 100644
index 0000000..7362989
--- /dev/null
+++ b/miniprogram/components/equipmentDialog/equipmentDialog.wxml
@@ -0,0 +1,7 @@
+
+
+
+ {{ title }}
+ {{ content }}
+
+
diff --git a/miniprogram/images/addBtn.png b/miniprogram/images/addBtn.png
new file mode 100644
index 0000000..e12630f
Binary files /dev/null and b/miniprogram/images/addBtn.png differ
diff --git a/miniprogram/images/equipment/bg.png b/miniprogram/images/equipment/bg.png
new file mode 100644
index 0000000..0583d95
Binary files /dev/null and b/miniprogram/images/equipment/bg.png differ
diff --git a/miniprogram/images/equipment/bluetooth.png b/miniprogram/images/equipment/bluetooth.png
new file mode 100644
index 0000000..cd87790
Binary files /dev/null and b/miniprogram/images/equipment/bluetooth.png differ
diff --git a/miniprogram/images/equipment/reload.png b/miniprogram/images/equipment/reload.png
new file mode 100644
index 0000000..ff3e0e2
Binary files /dev/null and b/miniprogram/images/equipment/reload.png differ
diff --git a/miniprogram/images/equipment/users.png b/miniprogram/images/equipment/users.png
new file mode 100644
index 0000000..e5b98b7
Binary files /dev/null and b/miniprogram/images/equipment/users.png differ
diff --git a/miniprogram/images/equipment/wifi.png b/miniprogram/images/equipment/wifi.png
new file mode 100644
index 0000000..0b71172
Binary files /dev/null and b/miniprogram/images/equipment/wifi.png differ
diff --git a/miniprogram/pages/equipment/equipment.json b/miniprogram/pages/equipment/equipment.json
index 326bb13..9e7cb2b 100644
--- a/miniprogram/pages/equipment/equipment.json
+++ b/miniprogram/pages/equipment/equipment.json
@@ -1,5 +1,8 @@
{
- "usingComponents": {},
- "navigationBarTitleText": "black" ,
- "navigationBarBackgroundColor": "#FFFFFF"
-}
\ No newline at end of file
+ "usingComponents": {
+ "equipment-dialog": "/components/equipmentDialog/equipmentDialog"
+ },
+ "navigationBarTitleText": "设备管理",
+ "navigationBarTextStyle": "black",
+ "navigationBarBackgroundColor": "#FFFFFF"
+}
diff --git a/miniprogram/pages/equipment/equipment.less b/miniprogram/pages/equipment/equipment.less
index 3382fb4..12cb48f 100644
--- a/miniprogram/pages/equipment/equipment.less
+++ b/miniprogram/pages/equipment/equipment.less
@@ -1 +1,283 @@
-/* pages/equipment/equipment.wxss */
\ No newline at end of file
+.equipment {
+ width: 100%;
+ min-height: 100%;
+ padding: 24rpx 32rpx;
+ box-sizing: border-box;
+ background-color: #F5F7FB;
+
+ /* 运维模式提示行 */
+ .ops-bar {
+ width: 100%;
+ height: 48rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 24rpx;
+
+ .ops-mode {
+ color: #1385FA;
+ height: 28rpx;
+ font-size: 28rpx;
+ line-height: 28rpx;
+ }
+
+ /* 描边按钮(蓝色/红色) */
+ .ops-btn {
+ width: 180rpx;
+ height: 48rpx;
+ border-radius: 8rpx;
+ font-size: 24rpx;
+ line-height: 44rpx;
+ text-align: center;
+ box-sizing: border-box;
+ flex-shrink: 0;
+ }
+
+ .ops-btn--blue {
+ border: 2rpx solid #1385FA;
+ color: #1385FA;
+ }
+
+ .ops-btn--red {
+ border: 2rpx solid #F24439;
+ color: #F24439;
+ }
+ }
+
+ /* 顶部卡片(渐变背景 + 设备图片占位) */
+ .top-banner {
+ width: 100%;
+ height: 180rpx;
+ overflow: hidden;
+ border-radius: 24rpx;
+ margin-bottom: 30rpx;
+ }
+
+ /* 已配对设备行 */
+ .section-bar {
+ width: 100%;
+ height: 48rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 24rpx;
+
+ .section-left {
+ height: 28rpx;
+ display: flex;
+ align-items: center;
+
+ .bt-icon {
+ width: 28rpx;
+ height: 28rpx;
+ display: flex;
+ margin-right: 8rpx;
+ align-items: center;
+ }
+
+ .section-title {
+ color: #808080;
+ height: 26rpx;
+ font-size: 26rpx;
+ line-height: 26rpx;
+ }
+ }
+
+ /* 描边按钮(蓝色/红色) */
+ .ops-btn {
+ width: 180rpx;
+ height: 48rpx;
+ border-radius: 8rpx;
+ font-size: 24rpx;
+ line-height: 44rpx;
+ text-align: center;
+ box-sizing: border-box;
+ flex-shrink: 0;
+ }
+
+ .ops-btn--blue {
+ border: 2rpx solid #1385FA;
+ color: #1385FA;
+ }
+
+ .ops-btn--red {
+ border: 2rpx solid #F24439;
+ color: #F24439;
+ }
+ }
+
+ /* 设备卡片 */
+ .device-card {
+ width: 100%;
+ padding: 32rpx;
+ border-radius: 24rpx;
+ background-color: #FFFFFF;
+ box-sizing: border-box;
+ margin-bottom: 24rpx;
+
+ .device-top {
+ width: 100%;
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ margin-bottom: 24rpx;
+
+ .device-icon {
+ width: 88rpx;
+ height: 88rpx;
+ overflow: hidden;
+ margin-right: 24rpx;
+ border-radius: 24rpx;
+ background-color: #1385FA;
+ }
+
+ .device-info {
+ flex: 1;
+
+ .device-info_ {
+ width: 100%;
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 16rpx;
+
+ .device-name {
+ color: #252535;
+ height: 32rpx;
+ font-size: 32rpx;
+ line-height: 32rpx;
+ }
+
+ .device-unpair {
+ color: #77849E;
+ height: 26rpx;
+ font-size: 26rpx;
+ line-height: 26rpx;
+ border-bottom: 2rpx solid #77849E;
+ }
+ }
+
+ .device-status {
+ width: 100%;
+ display: flex;
+ flex-wrap: nowrap;
+
+ .device-status--connected {
+ height: 40rpx;
+ padding: 0 16rpx;
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ border-radius: 20rpx;
+ overflow: hidden;
+ background-color: #EAFAF6;
+
+ .status-dot {
+ width: 12rpx;
+ height: 12rpx;
+ border-radius: 50%;
+ background-color: #2AC79F;
+ margin-right: 8rpx;
+ }
+
+ .status-text {
+ color: #2AC79F;
+ height: 22rpx;
+ font-size: 22rpx;
+ line-height: 22rpx;
+ }
+ }
+ }
+ }
+ }
+
+ .device-meta {
+ width: 100%;
+ margin-bottom: 24rpx;
+ border-bottom: 2rpx solid #EAECF1;
+
+ .meta-row {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 24rpx;
+
+ .meta-label {
+ color: #808080;
+ height: 26rpx;
+ font-size: 26rpx;
+ line-height: 26rpx;
+ }
+
+ .meta-value {
+ color: #252535;
+ height: 26rpx;
+ font-size: 26rpx;
+ line-height: 26rpx;
+ }
+ }
+ }
+
+ .device-actions {
+ width: 100%;
+ gap: 12px;
+ display: flex;
+ flex-wrap: nowrap;
+ justify-content: space-around;
+
+ .device-action-btn {
+ flex: 1;
+ height: 56rpx;
+ display: flex;
+ flex-wrap: nowrap;
+ align-items: center;
+ justify-content: center;
+ border-radius: 28rpx;
+ border: 2rpx solid #EAECF1;
+
+ > view:nth-of-type(1) {
+ width: 26rpx;
+ height: 26rpx;
+ display: flex;
+ align-items: center;
+ margin-right: 10rpx;
+ }
+
+ > view:nth-of-type(2) {
+ color: #77849E;
+ height: 26rpx;
+ font-size: 26rpx;
+ line-height: 26rpx;
+ }
+ }
+ }
+ }
+
+ /* 添加设备按钮 */
+ .add-btn {
+ width: 100%;
+ height: 96rpx;
+ border-radius: 48rpx;
+ background-color: #1385FA;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .add-icon {
+ width: 40rpx;
+ height: 40rpx;
+ display: flex;
+ align-items: center;
+ margin-right: 16rpx;
+ }
+
+ .add-text {
+ color: #FFFFFF;
+ height: 36rpx;
+ font-size: 36rpx;
+ font-weight: bolder;
+ line-height: 36rpx;
+ }
+ }
+}
diff --git a/miniprogram/pages/equipment/equipment.ts b/miniprogram/pages/equipment/equipment.ts
index 0cb72be..a8a939d 100644
--- a/miniprogram/pages/equipment/equipment.ts
+++ b/miniprogram/pages/equipment/equipment.ts
@@ -1,66 +1,79 @@
// pages/equipment/equipment.ts
Page({
-
- /**
- * 页面的初始数据
- */
data: {
-
+ devices: [
+ {
+ id: 1,
+ name: '家庭蓝牙体脂秤 S1',
+ status: '已连接',
+ connected: true,
+ model: 'BS-A100',
+ serial: 'BL2024A00158',
+ },
+ {
+ id: 2,
+ name: '家庭蓝牙体脂秤 S1',
+ status: '未连接',
+ connected: false,
+ model: 'BW-B200',
+ serial: 'BL2024B00321',
+ }
+ ],
+ loadingShow: true,
+ loadingTitle: '',
+ loadingContent: ''
},
- /**
- * 生命周期函数--监听页面加载
- */
- onLoad() {
-
+ /** 取消配对:使用小程序自带 showModal */
+ onTapUnpair() {
+ wx.showModal({
+ title: '取消配对',
+ content: '是否确认取消配对当前设备?',
+ cancelText: '取消',
+ confirmText: '确定',
+ confirmColor: '#F24439'
+ })
},
- /**
- * 生命周期函数--监听页面初次渲染完成
- */
- onReady() {
-
+ /** 底部操作:数据补传 / 设备连接 弹 loading */
+ onTapAction(e: WechatMiniprogram.TouchEvent) {
+ const action = e.currentTarget.dataset.action as string
+ if (action === '数据补传') {
+ this.setData({
+ loadingShow: true,
+ loadingTitle: '正在获取设备本地未上传数据',
+ loadingContent: '请稍等...'
+ })
+ } else if (action === '设备连接') {
+ this.setData({
+ loadingShow: true,
+ loadingTitle: '正在连接设备',
+ loadingContent: '请确保设备处于开启状态\n请勿离开...'
+ })
+ }
},
- /**
- * 生命周期函数--监听页面显示
- */
- onShow() {
-
+ onCloseLoading() {
+ this.setData({ loadingShow: false })
},
- /**
- * 生命周期函数--监听页面隐藏
- */
- onHide() {
-
+ onTapAdd() {
+ // 添加设备(待接入)
},
- /**
- * 生命周期函数--监听页面卸载
- */
- onUnload() {
-
+ /** 关闭运维模式 */
+ onCloseOps() {
+ // 关闭运维模式(待接入)
},
- /**
- * 页面相关事件处理函数--监听用户下拉动作
- */
- onPullDownRefresh() {
-
- },
-
- /**
- * 页面上拉触底事件的处理函数
- */
- onReachBottom() {
-
- },
-
- /**
- * 用户点击右上角分享
- */
- onShareAppMessage() {
-
+ /** 取消全部配对 */
+ onUnpairAll() {
+ wx.showModal({
+ title: '取消全部配对',
+ content: '是否确认取消全部设备的配对?',
+ cancelText: '取消',
+ confirmText: '确定',
+ confirmColor: '#F24439'
+ })
}
-})
\ No newline at end of file
+})
diff --git a/miniprogram/pages/equipment/equipment.wxml b/miniprogram/pages/equipment/equipment.wxml
index 9d50783..1b7c93d 100644
--- a/miniprogram/pages/equipment/equipment.wxml
+++ b/miniprogram/pages/equipment/equipment.wxml
@@ -1,2 +1,86 @@
-
-pages/equipment/equipment.wxml
\ No newline at end of file
+
+
+
+ 当前为:运维模式
+ 关闭运维模式
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 已配对设备
+
+ 取消全部配对
+
+
+
+
+
+
+
+
+
+ {{ item.name }}
+ 取消配对
+
+
+
+
+ {{ item.status }}
+
+
+
+
+
+
+
+ 型号
+ {{ item.model }}
+
+
+ 设备编号
+ {{ item.serial }}
+
+
+
+
+
+
+
+
+ 设备WIFI
+
+
+
+
+
+ 用户(4)
+
+
+
+
+
+ 数据补传
+
+
+
+
+
+
+
+
+
+
+ 添加设备
+
+
+
+