feat 电台设置

src/components.d.ts

@@ -23,8 +23,10 @@ declare module 'vue' {
     MessageList: typeof import('./components/message/list.vue')['default']
     SettingsProjectForm: typeof import('./components/settings/projectForm.vue')['default']
     SettingsProjectSettings: typeof import('./components/settings/projectSettings.vue')['default']
+    SettingsRadioConfig: typeof import('./components/settings/radioConfig.vue')['default']
     SettingsRadioSettings: typeof import('./components/settings/radioSettings.vue')['default']
     SettingsSensor: typeof import('./components/settings/sensor.vue')['default']
+    SettingsSensorConfig: typeof import('./components/settings/sensorConfig.vue')['default']
     SettingsWifiNetwork: typeof import('./components/settings/wifiNetwork.vue')['default']
     SettingsWifiSettings: typeof import('./components/settings/wifiSettings.vue')['default']
   }

src/components/settings/radioConfig.vue

@@ -0,0 +1,167 @@
+<script setup lang="ts">
+const gaa = ref('1Hz')
+const hpd = ref('1Hz')
+const vtg = ref('1Hz')
+
+const elevationRms = ref('1.00000')
+const horizontalRms = ref('1.00000')
+
+const radioEnabled = ref(false)
+const dataEnabled = ref(true)
+const dataChannel = ref('qxwz5dk')
+
+const dataTransType = ref('TCP')
+</script>
+
+<template>
+  <view class="radio-card">
+    <!-- 频率 -->
+    <view class="section">
+      <text class="section-title">
+        频率
+      </text>
+      <view class="form-row">
+        <view class="form-item">
+          <text class="form-label">
+            GAA:
+          </text>
+          <wd-input v-model="gaa" placeholder="1Hz" />
+        </view>
+        <view class="form-item">
+          <text class="form-label">
+            HPD:
+          </text>
+          <wd-input v-model="hpd" placeholder="1Hz" />
+        </view>
+        <view class="form-item">
+          <text class="form-label">
+            VTG:
+          </text>
+          <wd-input v-model="vtg" placeholder="1Hz" />
+        </view>
+      </view>
+    </view>
+
+    <!-- 精度 -->
+    <view class="section">
+      <text class="section-title">
+        精度
+      </text>
+      <view class="form-row">
+        <view class="form-item">
+          <text class="form-label">
+            高程:
+          </text>
+          <view class="input-with-unit">
+            <wd-input v-model="elevationRms" placeholder="1.00000" />
+            <text class="unit">
+              m RMS
+            </text>
+          </view>
+        </view>
+        <view class="form-item">
+          <text class="form-label">
+            水平:
+          </text>
+          <view class="input-with-unit">
+            <wd-input v-model="horizontalRms" placeholder="1.00000" />
+            <text class="unit">
+              m RMS
+            </text>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 差分 -->
+    <view class="section">
+      <text class="section-title">
+        差分
+      </text>
+      <view class="form-row">
+        <view class="checkbox-group">
+          <wd-checkbox v-model="radioEnabled" shape="square">
+            电台
+          </wd-checkbox>
+          <wd-checkbox v-model="dataEnabled" shape="square">
+            数据
+          </wd-checkbox>
+        </view>
+        <wd-input v-model="dataChannel" placeholder="qxwz5dk" />
+      </view>
+    </view>
+
+    <!-- 数据发送 -->
+    <view class="section">
+      <text class="section-title">
+        数据发送
+      </text>
+      <view class="form-row">
+        <wd-checkbox v-model="dataEnabled" shape="square">
+          数据
+        </wd-checkbox>
+        <wd-input v-model="dataTransType" placeholder="TCP" />
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.radio-card {
+  background-color: #ffffff;
+  border-radius: 12px;
+  padding: 16px;
+}
+
+.section {
+  margin-bottom: 20px;
+}
+
+.section:last-child {
+  margin-bottom: 0;
+}
+
+.section-title {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 12px;
+  display: block;
+}
+
+.form-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+
+.form-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.form-label {
+  font-size: 18px;
+  color: #333;
+  white-space: nowrap;
+}
+
+.input-with-unit {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.unit {
+  font-size: 14px;
+  color: #999;
+  white-space: nowrap;
+}
+
+.checkbox-group {
+  display: flex;
+  gap: 16px;
+}
+</style>

src/components/settings/radioSettings.vue

@@ -3,12 +3,21 @@
 
 <template>
   <view class="radio-settings">
-    <text>电台设置内容</text>
+    <!-- 设备卡片 -->
+    <device-card />
+
+    <!-- 电台配置 -->
+    <settings-radioConfig />
+
+    <!-- 设备信息 -->
+    <device-info />
   </view>
 </template>
 
 <style scoped>
 .radio-settings {
-  min-height: 280px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
 }
 </style>

src/components/settings/sensor.vue

@@ -2,13 +2,22 @@
 </script>
 
 <template>
-  <view class="sensor">
+  <view class="sensor-settings">
-    <text>传感器内容</text>
+    <!-- 设备卡片 -->
+    <device-card />
+
+    <!-- 传感器配置 -->
+    <settings-sensorConfig />
+
+    <!-- 设备信息 -->
+    <device-info />
   </view>
 </template>
 
 <style scoped>
-.sensor {
+.sensor-settings {
-  min-height: 280px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
 }
 </style>

src/components/settings/sensorConfig.vue

@@ -0,0 +1,159 @@
+<script setup lang="ts">
+const sensorList = ref([
+  { name: '压实度', id: 0, position: '前轮侧边' },
+  { name: '振动频率', id: 1, position: '前轮侧边' },
+])
+
+function handleAdd() {
+  console.log('添加传感器')
+}
+
+function handleDelete(index: number) {
+  console.log('删除传感器', index)
+}
+</script>
+
+<template>
+  <view class="sensor-card">
+    <text class="card-title">
+      传感器
+    </text>
+
+    <view class="sensor-table">
+      <!-- 表头 -->
+      <view class="table-header">
+        <text class="col-name">
+          名称
+        </text>
+        <text class="col-id">
+          ID
+        </text>
+        <text class="col-position">
+          安装位置
+        </text>
+        <text class="col-action">
+          操作
+        </text>
+      </view>
+
+      <!-- 表格内容 -->
+      <view v-for="(sensor, index) in sensorList" :key="index" class="table-row">
+        <view class="col-name">
+          <wd-input v-model="sensor.name" placeholder="请输入名称" />
+        </view>
+        <text class="col-id">
+          {{ sensor.id }}
+        </text>
+        <view class="col-position">
+          <wd-input v-model="sensor.position" placeholder="请输入安装位置" />
+        </view>
+        <view class="col-action">
+          <view v-if="index === sensorList.length - 1" class="action-btn add" @tap="handleAdd">
+            <wd-icon name="add" size="16px" color="#fff" />
+          </view>
+          <view v-else class="action-btn delete" @tap="handleDelete(index)">
+            <wd-icon name="close" size="16px" color="#fff" />
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.sensor-card {
+  background-color: #ffffff;
+  border-radius: 12px;
+  padding: 16px;
+}
+
+.card-title {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+  margin-bottom: 16px;
+  display: block;
+}
+
+.sensor-table {
+  border: 1px solid #e8e8e8;
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+.table-header {
+  display: flex;
+  background-color: #fafafa;
+  padding: 12px 0;
+  border-bottom: 1px solid #e8e8e8;
+}
+
+.table-row {
+  display: flex;
+  padding: 12px 0;
+  border-bottom: 1px solid #e8e8e8;
+}
+
+.table-row:last-child {
+  border-bottom: none;
+}
+
+.col-name {
+  flex: 2;
+  padding: 0 12px;
+  display: flex;
+  align-items: center;
+}
+
+.col-id {
+  flex: 1;
+  padding: 0 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 18px;
+  color: #333;
+}
+
+.col-position {
+  flex: 2;
+  padding: 0 12px;
+  display: flex;
+  align-items: center;
+}
+
+.col-action {
+  flex: 1;
+  padding: 0 12px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.table-header .col-name,
+.table-header .col-id,
+.table-header .col-position,
+.table-header .col-action {
+  font-size: 18px;
+  font-weight: bold;
+  color: #333;
+}
+
+.action-btn {
+  width: 32px;
+  height: 32px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+
+.action-btn.add {
+  background-color: #1890ff;
+}
+
+.action-btn.delete {
+  background-color: #ff4d4f;
+}
+</style>