Compare commits
2 Commits
35145dbf76
...
5b6ad327eb
| Author | SHA1 | Date | |
|---|---|---|---|
| 5b6ad327eb | |||
| efbb542d83 |
36
README.md
36
README.md
@ -31,6 +31,12 @@
|
|||||||
- **profile/mijiazhongce.html** - 米家众测:产品试用申请
|
- **profile/mijiazhongce.html** - 米家众测:产品试用申请
|
||||||
- **profile/product-encyclopedia.html** - 产品百科:产品知识
|
- **profile/product-encyclopedia.html** - 产品百科:产品知识
|
||||||
- **profile/whole-house-smart.html** - 全屋智能:智能解决方案
|
- **profile/whole-house-smart.html** - 全屋智能:智能解决方案
|
||||||
|
- **profile/voice-settings.html** - 语音设置:小爱设置,语音控制管理
|
||||||
|
- **profile/my-youpin.html** - 我的有品:订单管理,购物功能
|
||||||
|
- **profile/hub-gateway.html** - 中枢与网关:网关设备管理
|
||||||
|
- **profile/device-consumables.html** - 设备耗材:耗材管理,购买提醒
|
||||||
|
- **profile/share.html** - 分享页面:设备分享,权限管理
|
||||||
|
- **profile/home-network.html** - 家庭网络:网络设置,连接管理
|
||||||
|
|
||||||
## 💻 核心代码解释
|
## 💻 核心代码解释
|
||||||
|
|
||||||
@ -101,7 +107,7 @@ function updateSensorData() {
|
|||||||
```
|
```
|
||||||
project-fin-takeaway/
|
project-fin-takeaway/
|
||||||
├── index.html # 米家首页 - 设备控制中心
|
├── index.html # 米家首页 - 设备控制中心
|
||||||
├── home.html # 备用首页文件
|
|
||||||
├── smart.html # 智能页面
|
├── smart.html # 智能页面
|
||||||
├── product.html # 产品页面
|
├── product.html # 产品页面
|
||||||
├── mall.html # 商城页面
|
├── mall.html # 商城页面
|
||||||
@ -110,7 +116,16 @@ project-fin-takeaway/
|
|||||||
├── profile/
|
├── profile/
|
||||||
│ ├── user-profile.html # 个人资料详情页面
|
│ ├── user-profile.html # 个人资料详情页面
|
||||||
│ ├── settings.html # 设置页面
|
│ ├── settings.html # 设置页面
|
||||||
│ └── home-network.html # 家庭网络页面
|
│ ├── home-network.html # 家庭网络页面
|
||||||
|
│ ├── voice-settings.html # 语音设置页面
|
||||||
|
│ ├── my-youpin.html # 我的有品页面
|
||||||
|
│ ├── hub-gateway.html # 中枢与网关页面
|
||||||
|
│ ├── device-consumables.html # 设备耗材页面
|
||||||
|
│ ├── scene.html # 智能场景页面
|
||||||
|
│ ├── mijiazhongce.html # 米家众测页面
|
||||||
|
│ ├── product-encyclopedia.html # 产品百科页面
|
||||||
|
│ ├── whole-house-smart.html # 全屋智能页面
|
||||||
|
│ └── share.html # 分享页面
|
||||||
├── notifications.html # 通知中心页面
|
├── notifications.html # 通知中心页面
|
||||||
├── environment-settings.html # 环境设置页面
|
├── environment-settings.html # 环境设置页面
|
||||||
|
|
||||||
@ -171,12 +186,17 @@ npx http-server
|
|||||||
│ ├── mall.html ───── 商城页面
|
│ ├── mall.html ───── 商城页面
|
||||||
│ └── profile.html ── 个人中心
|
│ └── profile.html ── 个人中心
|
||||||
│ ├── → profile/user-profile.html
|
│ ├── → profile/user-profile.html
|
||||||
│ ├── → profile/scene.html
|
├── → profile/scene.html
|
||||||
│ ├── → profile/mijiazhongce.html
|
├── → profile/mijiazhongce.html
|
||||||
│ ├── → profile/product-encyclopedia.html
|
├── → profile/product-encyclopedia.html
|
||||||
│ ├── → profile/whole-house-smart.html
|
├── → profile/whole-house-smart.html
|
||||||
│ ├── → profile/settings.html
|
├── → profile/voice-settings.html
|
||||||
│ └── → profile/home-network.html
|
├── → profile/my-youpin.html
|
||||||
|
├── → profile/hub-gateway.html
|
||||||
|
├── → profile/device-consumables.html
|
||||||
|
├── → profile/share.html
|
||||||
|
├── → profile/settings.html
|
||||||
|
└── → profile/home-network.html
|
||||||
└── 📁 资源文件
|
└── 📁 资源文件
|
||||||
├── styles/ ──── CSS样式
|
├── styles/ ──── CSS样式
|
||||||
├── scripts/ ─── JavaScript
|
├── scripts/ ─── JavaScript
|
||||||
|
|||||||
170
home.html
170
home.html
@ -1,170 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="zh-CN">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>米家 - 米家智能家居</title>
|
|
||||||
<link rel="stylesheet" href="styles/common.css">
|
|
||||||
<link rel="stylesheet" href="styles/home.css">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container" id="home-page">
|
|
||||||
<!-- 顶部导航 -->
|
|
||||||
<header class="header">
|
|
||||||
<div class="header-left">
|
|
||||||
<span class="home-name">shenghuo2的家</span>
|
|
||||||
<i class="fas fa-chevron-down"></i>
|
|
||||||
</div>
|
|
||||||
<div class="header-right">
|
|
||||||
<i class="fas fa-comment-dots"></i>
|
|
||||||
<i class="fas fa-plus-circle"></i>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- 房间导航 -->
|
|
||||||
<nav class="room-nav">
|
|
||||||
<div class="room-tabs">
|
|
||||||
<span class="room-tab active">全屋</span>
|
|
||||||
<span class="room-tab">出租屋</span>
|
|
||||||
<span class="room-tab">十五中</span>
|
|
||||||
<span class="room-tab">客厅</span>
|
|
||||||
<span class="room-tab">卧室</span>
|
|
||||||
</div>
|
|
||||||
<i class="fas fa-bars home-menu-icon"></i>
|
|
||||||
</nav>
|
|
||||||
|
|
||||||
<!-- 空气质量 -->
|
|
||||||
<div class="air-quality">
|
|
||||||
<span>空气质量 4</span>
|
|
||||||
<i class="fas fa-chevron-right"></i>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 设备网格 -->
|
|
||||||
<div class="device-grid">
|
|
||||||
<!-- 手机红外遥控器 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-mobile-alt"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">手机红外遥控器</div>
|
|
||||||
<div class="device-status">已连接</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 小米智能插座 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-plug"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">小米智能插座</div>
|
|
||||||
<div class="device-status off">已关闭</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 小米台灯 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-lightbulb"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">小米台灯</div>
|
|
||||||
<div class="device-status">已开启</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 空调 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-snowflake"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">空调</div>
|
|
||||||
<div class="device-status off">已关闭</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 小爱音箱 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-volume-up"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">小爱音箱</div>
|
|
||||||
<div class="device-status">播放中</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 扫地机器人 -->
|
|
||||||
<div class="device-card">
|
|
||||||
<div class="device-icon">
|
|
||||||
<i class="fas fa-robot"></i>
|
|
||||||
</div>
|
|
||||||
<div class="device-name">扫地机器人</div>
|
|
||||||
<div class="device-status off">待机中</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 传感器数据 -->
|
|
||||||
<div class="sensor-grid">
|
|
||||||
<div class="sensor-card">
|
|
||||||
<div class="sensor-icon">
|
|
||||||
<i class="fas fa-thermometer-half"></i>
|
|
||||||
</div>
|
|
||||||
<div class="sensor-data">
|
|
||||||
<span class="sensor-value" id="temperature">23°C</span>
|
|
||||||
<span class="sensor-label">温度</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="sensor-card">
|
|
||||||
<div class="sensor-icon">
|
|
||||||
<i class="fas fa-tint"></i>
|
|
||||||
</div>
|
|
||||||
<div class="sensor-data">
|
|
||||||
<span class="sensor-value" id="humidity">65%</span>
|
|
||||||
<span class="sensor-label">湿度</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="sensor-card">
|
|
||||||
<div class="sensor-icon">
|
|
||||||
<i class="fas fa-wind"></i>
|
|
||||||
</div>
|
|
||||||
<div class="sensor-data">
|
|
||||||
<span class="sensor-value" id="air-quality">良好</span>
|
|
||||||
<span class="sensor-label">空气质量</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="sensor-card">
|
|
||||||
<div class="sensor-icon">
|
|
||||||
<i class="fas fa-sun"></i>
|
|
||||||
</div>
|
|
||||||
<div class="sensor-data">
|
|
||||||
<span class="sensor-value" id="light">450 lux</span>
|
|
||||||
<span class="sensor-label">光照</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 底部导航 -->
|
|
||||||
<nav class="bottom-nav">
|
|
||||||
<div class="nav-item active">
|
|
||||||
<i class="fas fa-home"></i>
|
|
||||||
<span>米家</span>
|
|
||||||
</div>
|
|
||||||
<div class="nav-item" onclick="location.href='smart.html'">
|
|
||||||
<i class="fas fa-cube"></i>
|
|
||||||
<span>智能</span>
|
|
||||||
</div>
|
|
||||||
<div class="nav-item" onclick="location.href='product.html'">
|
|
||||||
<i class="fas fa-star"></i>
|
|
||||||
<span>产品</span>
|
|
||||||
</div>
|
|
||||||
<div class="nav-item" onclick="location.href='mall.html'">
|
|
||||||
<i class="fas fa-shopping-bag"></i>
|
|
||||||
<span>商城</span>
|
|
||||||
</div>
|
|
||||||
<div class="nav-item" onclick="location.href='profile.html'">
|
|
||||||
<i class="fas fa-user"></i>
|
|
||||||
<span>我的</span>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="scripts/main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@ -90,7 +90,7 @@
|
|||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
<nav class="bottom-nav">
|
<nav class="bottom-nav">
|
||||||
<div class="nav-item" onclick="location.href='home.html'">
|
<div class="nav-item" onclick="location.href='index.html'">
|
||||||
<i class="fas fa-home"></i>
|
<i class="fas fa-home"></i>
|
||||||
<span>米家</span>
|
<span>米家</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -152,7 +152,7 @@
|
|||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
<nav class="bottom-nav">
|
<nav class="bottom-nav">
|
||||||
<div class="nav-item" onclick="location.href='home.html'">
|
<div class="nav-item" onclick="location.href='index.html'">
|
||||||
<i class="fas fa-home"></i>
|
<i class="fas fa-home"></i>
|
||||||
<span>米家</span>
|
<span>米家</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -186,7 +186,7 @@
|
|||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
<nav class="bottom-nav">
|
<nav class="bottom-nav">
|
||||||
<div class="nav-item" onclick="location.href='home.html'">
|
<div class="nav-item" onclick="location.href='../index.html'">
|
||||||
<i class="fas fa-home"></i>
|
<i class="fas fa-home"></i>
|
||||||
<span>米家</span>
|
<span>米家</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -213,7 +213,7 @@
|
|||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
<nav class="bottom-nav">
|
<nav class="bottom-nav">
|
||||||
<div class="nav-item" onclick="location.href='home.html'">
|
<div class="nav-item" onclick="location.href='../index.html'">
|
||||||
<i class="fas fa-home"></i>
|
<i class="fas fa-home"></i>
|
||||||
<span>米家</span>
|
<span>米家</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -100,7 +100,7 @@
|
|||||||
|
|
||||||
<!-- 底部导航 -->
|
<!-- 底部导航 -->
|
||||||
<nav class="bottom-nav">
|
<nav class="bottom-nav">
|
||||||
<div class="nav-item" onclick="location.href='home.html'">
|
<div class="nav-item" onclick="location.href='../index.html'">
|
||||||
<i class="fas fa-home"></i>
|
<i class="fas fa-home"></i>
|
||||||
<span>米家</span>
|
<span>米家</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user