feat 项目设置Info

src/components.d.ts

@@ -10,6 +10,7 @@ declare module 'vue' {
     BackNav: typeof import('./components/backNav.vue')['default']
     BluetoothConnect: typeof import('./components/bluetooth/connect.vue')['default']
     DeviceCard: typeof import('./components/deviceCard.vue')['default']
+    DeviceInfo: typeof import('./components/deviceInfo.vue')['default']
     HomeConstruction: typeof import('./components/home/construction.vue')['default']
     HomeHomeNav: typeof import('./components/home/homeNav.vue')['default']
     HomeList: typeof import('./components/home/list.vue')['default']
@@ -20,5 +21,11 @@ declare module 'vue' {
     HomeWarning: typeof import('./components/home/warning.vue')['default']
     HomeWarning_list: typeof import('./components/home/warning_list.vue')['default']
     MessageList: typeof import('./components/message/list.vue')['default']
+    SettingsDeviceInfo: typeof import('./components/deviceInfo.vue')['default']
+    SettingsProjectForm: typeof import('./components/settings/projectForm.vue')['default']
+    SettingsProjectSettings: typeof import('./components/settings/projectSettings.vue')['default']
+    SettingsRadioSettings: typeof import('./components/settings/radioSettings.vue')['default']
+    SettingsSensor: typeof import('./components/settings/sensor.vue')['default']
+    SettingsWifiSettings: typeof import('./components/settings/wifiSettings.vue')['default']
   }
 }

src/components/deviceInfo.vue

@@ -0,0 +1,113 @@
+<script setup lang="ts">
+withDefaults(defineProps<{
+  systemName?: string
+  deviceId?: string
+  version?: string
+  registerStatus?: string
+  expiryDate?: string
+}>(), {
+  systemName: 'UCS300',
+  deviceId: 'XS64H-2024-001',
+  version: 'HZ_UCS_V2.1.2.260513',
+  registerStatus: '已激活',
+  expiryDate: '2026年8月14日16:25:24',
+})
+</script>
+
+<template>
+  <view class="device-info">
+    <text class="section-title">
+      关于设备
+    </text>
+
+    <view class="info-list">
+      <view class="info-item">
+        <text class="info-label">
+          系统名称
+        </text>
+        <text class="info-value">
+          {{ systemName }}
+        </text>
+      </view>
+
+      <view class="info-item">
+        <text class="info-label">
+          设备ID
+        </text>
+        <text class="info-value">
+          {{ deviceId }}
+        </text>
+      </view>
+
+      <view class="info-item">
+        <text class="info-label">
+          版本号
+        </text>
+        <text class="info-value">
+          {{ version }}
+        </text>
+      </view>
+
+      <view class="info-item">
+        <text class="info-label">
+          注册状态
+        </text>
+        <text class="info-value status-active">
+          {{ registerStatus }}
+        </text>
+      </view>
+
+      <view class="info-item">
+        <text class="info-label">
+          到期日期
+        </text>
+        <text class="info-value">
+          {{ expiryDate }}
+        </text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.device-info {
+  background-color: #ffffff;
+  border-radius: 12px;
+  margin-bottom: 12px;
+  padding: 16px;
+}
+
+.section-title {
+  font-size: 16px;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 16px;
+  display: block;
+}
+
+.info-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.info-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.info-label {
+  font-size: 14px;
+  color: #666;
+}
+
+.info-value {
+  font-size: 14px;
+  color: #333;
+}
+
+.status-active {
+  color: #52c41a;
+}
+</style>

src/components/settings/projectForm.vue

@@ -0,0 +1,78 @@
+<script setup lang="ts">
+const projectName = ref('')
+const startEndStation = ref('k12+300-k125+800')
+const totalArea = ref('')
+
+function handleSave() {
+  console.log('保存项目设置')
+}
+</script>
+
+<template>
+  <view class="project-form">
+    <view class="form-item">
+      <text class="form-label">
+        项目名称
+      </text>
+      <wd-input v-model="projectName" placeholder="请输入项目名称，保存后将显示首页顶部" />
+    </view>
+
+    <view class="form-item">
+      <text class="form-label">
+        起止桩号
+      </text>
+      <view class="input-with-button">
+        <wd-input v-model="startEndStation" placeholder="请输入起止桩号" />
+        <wd-button size="small" type="primary" class="map-btn">
+          地图框选
+        </wd-button>
+      </view>
+    </view>
+
+    <view class="form-item">
+      <text class="form-label">
+        项目设计总面积 (m²)
+      </text>
+      <wd-input v-model="totalArea" placeholder="请输入项目设计总面积" />
+    </view>
+
+    <wd-button type="primary" block class="save-btn" @tap="handleSave">
+      保存
+    </wd-button>
+  </view>
+</template>
+
+<style scoped>
+.project-form {
+  background-color: #ffffff;
+  border-radius: 12px;
+  margin-bottom: 12px;
+  padding: 16px;
+}
+
+.form-item {
+  margin-bottom: 16px;
+}
+
+.form-label {
+  font-size: 14px;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 8px;
+  display: block;
+}
+
+.input-with-button {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.map-btn {
+  flex-shrink: 0;
+}
+
+.save-btn {
+  margin-top: 8px;
+}
+</style>

src/components/settings/projectSettings.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <view class="project-settings">
+    <!-- 设备卡片 -->
+    <device-card />
+
+    <!-- 项目设置表单 -->
+    <settings-projectForm />
+
+    <!-- 设备信息 -->
+    <device-info />
+  </view>
+</template>
+
+<style scoped>
+.project-settings {
+  display: flex;
+  flex-direction: column;
+}
+</style>

src/components/settings/radioSettings.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <view class="radio-settings">
+    <text>电台设置内容</text>
+  </view>
+</template>
+
+<style scoped>
+.radio-settings {
+  min-height: 280px;
+}
+</style>

src/components/settings/sensor.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <view class="sensor">
+    <text>传感器内容</text>
+  </view>
+</template>
+
+<style scoped>
+.sensor {
+  min-height: 280px;
+}
+</style>

src/components/settings/wifiSettings.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <view class="wifi-settings">
+    <text>WIFI设置内容</text>
+  </view>
+</template>
+
+<style scoped>
+.wifi-settings {
+  min-height: 280px;
+}
+</style>

src/pages/bluetooth/index.vue

@@ -26,6 +26,6 @@ definePage({
 
 .content {
   padding: 16px;
-  padding-top: 100px;
+  padding-top: 72px;
 }
 </style>

src/pages/settings/index.vue

@@ -5,6 +5,8 @@ definePage({
     navigationStyle: 'custom',
   },
 })
+
+const activeTab = ref(0)
 </script>
 
 <template>
@@ -12,7 +14,26 @@ definePage({
     <back-nav title="设置" />
 
     <view class="content">
-      <!-- 设置内容区域 -->
+      <view class="tabs-card">
+        <view
+          v-for="(tab, index) in ['项目设置', 'WIFI设置', '传感器', '电台设置']"
+          :key="index"
+          class="tab-item"
+          :class="{ active: activeTab === index }"
+          @tap="activeTab = index"
+        >
+          <text class="tab-text">
+            {{ tab }}
+          </text>
+        </view>
+      </view>
+
+      <view class="card">
+        <settings-projectSettings v-if="activeTab === 0" />
+        <settings-wifiSettings v-else-if="activeTab === 1" />
+        <settings-sensor v-else-if="activeTab === 2" />
+        <settings-radioSettings v-else />
+      </view>
     </view>
   </view>
 </template>
@@ -25,6 +46,42 @@ definePage({
 
 .content {
   padding: 16px;
-  padding-top: 100px;
+  padding-top: 72px;
 }
+
+.tabs-card {
+  display: flex;
+  gap: 140rpx;
+  margin-bottom: 16px;
+}
+
+.tab-item {
+  flex: 1;
+  background: #fff;
+  border-radius: 8px;
+  padding: 12px 24px;
+  text-align: center;
+}
+
+.tab-item.active {
+  background: #e6f7ff;
+  border: 1px solid #1890ff;
+}
+
+.tab-text {
+  font-size: 14px;
+  color: #333;
+}
+
+.tab-item.active .tab-text {
+  color: #1890ff;
+  font-weight: bold;
+}
+
+/* .card {
+  background: #fff;
+  border-radius: 12px;
+  padding: 16px;
+  min-height: 300px;
+} */
 </style>