Compare commits

...

2 Commits

Author SHA1 Message Date
Ironsp
1885a91994 feat 电台设置 2026-09-02 14:19:25 +08:00
Ironsp
14b661a3ac style(settings): add 1px border to wd-input in radioConfig.vue 2026-09-02 14:18:23 +08:00
5 changed files with 352 additions and 6 deletions

2
src/components.d.ts vendored
View File

@@ -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']
}

View File

@@ -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>

View File

@@ -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>

View File

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

View File

@@ -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>