DeXun/attractor
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始化项目

Browse Source
This commit is contained in:
86156
2026-04-07 11:18:02 +08:00
commit e277bb47cb
1114 changed files with 125107 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1252
attractor-ui/pages/devices/attractor/attractor.vue Normal file
View File

File diff suppressed because it is too large Load Diff

276
attractor-ui/pages/devices/detail/detail.vue Normal file
View File

@@ -0,0 +1,276 @@
<template>
<view class="device-detail-page">
<!-- 顶部导航 -->
<view class="nav-bar">
<button class="back-btn" @click="goBack">← 返回</button>
<text class="nav-title">设备详情</text>
<button class="save-btn" @click="saveDevice">保存</button>
</view>
<!-- 基础信息编辑区 -->
<view class="base-info">
<text class="section-title">基础信息</text>
<!-- 设备图片编辑 -->
<view class="info-item">
<text class="label">设备图片：</text>
<view class="img-upload">
<image class="device-img" :src="currentDevice.image" mode="aspectFill"></image>
<button class="change-img-btn" @click="chooseImage">更换图片</button>
</view>
</view>
<!-- 设备名称编辑 -->
<view class="info-item">
<text class="label">设备名称：</text>
<input
class="input"
v-model="currentDevice.name"
placeholder="请输入设备名称"
/>
</view>
<!-- SN码（不可编辑） -->
<view class="info-item">
<text class="label">SN码：</text>
<text class="sn-text">{{ currentDevice.sn }}</text>
</view>
<!-- 设备类型（不可编辑） -->
<view class="info-item">
<text class="label">设备类型：</text>
<text class="type-text">
{{ deviceTabs.find(item => item.type === currentDevice.type).name || '未知类型' }}
</text>
</view>
</view>
<!-- 使用者/团队管理区 -->
<view class="manager-info">
<text class="section-title">归属管理</text>
<!-- 使用者选择 -->
<view class="info-item">
<text class="label">使用者：</text>
<picker
mode="selector"
:range="userList"
@change="selectUser"
>
<view class="picker">
{{ currentDevice.user || '请选择使用者' }}
</view>
</picker>
</view>
<!-- 所属团队选择 -->
<view class="info-item">
<text class="label">所属团队：</text>
<picker
mode="selector"
:range="teamList"
@change="selectTeam"
>
<view class="picker">
{{ currentDevice.team || '请选择所属团队' }}
</view>
</picker>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
currentDevice: {}, // 当前编辑的设备信息
deviceTabs: [
{ name: '全部设备', type: '' },
{ name: '智能硬件', type: 'hardware' },
{ name: '传感器', type: 'sensor' },
{ name: '控制器', type: 'controller' }
],
// 模拟使用者列表
userList: ['张三', '李四', '王五', '赵六'],
// 模拟团队列表
teamList: ['研发部', '测试部', '运维部', '市场部']
}
},
onLoad(options) {
// 获取设备ID并从列表中匹配设备信息
const deviceId = Number(options.id);
// 从全局/本地存储获取设备列表（实际项目建议用vuex/本地存储）
const deviceList = getApp().globalData.deviceList || [];
this.currentDevice = JSON.parse(JSON.stringify(deviceList.find(item => item.id === deviceId)));
// 若未找到设备，返回上一页
if (!this.currentDevice) {
uni.showToast({ title: '设备不存在', icon: 'none' });
setTimeout(() => this.goBack(), 1500);
}
},
onShow() {
// 初始化全局设备列表（方便跨页面共享）
if (!getApp().globalData.deviceList) {
getApp().globalData.deviceList = [
{
id: 1,
name: '温湿度传感器',
sn: 'SN20260210001',
type: 'sensor',
image: '/static/device/sensor.png',
user: '张三',
team: '研发部'
},
{
id: 2,
name: '智能控制器',
sn: 'SN20260210002',
type: 'controller',
image: '/static/device/controller.png',
user: '李四',
team: '测试部'
}
];
}
},
methods: {
// 返回上一页
goBack() {
uni.navigateBack();
},
// 选择设备图片（uniapp上传图片API）
async chooseImage() {
try {
const res = await uni.chooseImage({
count: 1, // 仅选1张
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'] // 相册/相机
});
// 模拟上传图片（实际项目需上传到服务器，替换为返回的图片URL）
this.currentDevice.image = res.tempFilePaths[0];
} catch (err) {
console.error('选择图片失败：', err);
uni.showToast({ title: '选择图片失败', icon: 'none' });
}
},
// 选择使用者
selectUser(e) {
this.currentDevice.user = this.userList[e.detail.value];
},
// 选择所属团队
selectTeam(e) {
this.currentDevice.team = this.teamList[e.detail.value];
},
// 保存设备信息
saveDevice() {
// 更新全局设备列表
const deviceList = getApp().globalData.deviceList;
const index = deviceList.findIndex(item => item.id === this.currentDevice.id);
if (index > -1) {
deviceList[index] = this.currentDevice;
getApp().globalData.deviceList = deviceList;
}
uni.showToast({ title: '保存成功', icon: 'success' });
setTimeout(() => this.goBack(), 1000);
}
}
};
</script>
<style scoped>
/* 页面整体样式 */
.device-detail-page {
background-color: #f5f5f5;
min-height: 100vh;
}
/* 导航栏 */
.nav-bar {
display: flex;
align-items: center;
justify-content: space-between;
padding: 15px 20px;
background-color: #fff;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.back-btn, .save-btn {
background-color: transparent;
border: none;
font-size: 14px;
}
.back-btn {
color: #666;
}
.save-btn {
color: #409eff;
}
.nav-title {
font-size: 18px;
font-weight: 600;
color: #333;
}
/* 信息区块 */
.base-info, .manager-info {
background-color: #fff;
margin: 10px;
padding: 15px;
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.section-title {
display: block;
font-size: 16px;
font-weight: 600;
color: #333;
margin-bottom: 15px;
padding-bottom: 5px;
border-bottom: 1px solid #f0f0f0;
}
/* 信息项 */
.info-item {
display: flex;
align-items: center;
margin-bottom: 15px;
}
.label {
width: 80px;
font-size: 14px;
color: #666;
}
.input, .picker, .sn-text, .type-text {
flex: 1;
padding: 8px 10px;
font-size: 14px;
}
.input {
border: 1px solid #e5e5e5;
border-radius: 4px;
}
.sn-text, .type-text {
color: #999;
}
/* 图片上传区 */
.img-upload {
flex: 1;
display: flex;
align-items: center;
gap: 10px;
}
.device-img {
width: 60px;
height: 60px;
border-radius: 8px;
}
.change-img-btn {
background-color: #e5e5e5;
color: #666;
border: none;
border-radius: 4px;
padding: 5px 10px;
font-size: 12px;
}
</style>

229
attractor-ui/pages/devices/devices.vue Normal file
View File

@@ -0,0 +1,229 @@
<template>
<view class="device-page">
<view class="search-row">
<view class="search-box">
<uni-icons type="search" size="16" color="#7b8794"></uni-icons>
<input class="search-input" placeholder="搜索设备名称或SN" v-model="searchKeyword" @confirm="fetchMyDevices" />
<button v-if="searchKeyword" class="clear-btn" @click="clearSearch">×</button>
</view>
<button class="scan-chip" @click="refreshScan">扫描连接</button>
</view>
<view class="section" v-if="scannedDevices.length">
<view class="section-head">
<text class="section-title">可连接设备</text>
<text class="section-sub">点击连接后自动写入后端</text>
</view>
<view v-for="s in scannedDevices" :key="s.deviceId" class="device-card" @click="askConnect(s)">
<image class="device-icon" :src="getIconForType()" mode="aspectFit" />
<view class="device-main">
<text class="device-name">{{ s.name }}</text>
<text class="device-meta">SN: {{ s.deviceId }}</text>
</view>
<view class="state-pill running">连接</view>
</view>
</view>
<scroll-view class="content" scroll-y>
<view class="section">
<view class="section-head">
<text class="section-title">我的设备</text>
<text class="section-sub">后端持久化数据</text>
</view>
<view v-if="deviceList.length === 0" class="empty-card">
<text>暂无设备，请先扫描连接</text>
</view>
<view v-for="item in deviceList" :key="item.deviceId" class="device-card" @click="gotoDetail(item)">
<image class="device-icon" :src="getIconForType()" mode="aspectFit" />
<view class="device-main">
<text class="device-name">{{ item.deviceName || '未命名设备' }}</text>
<text class="device-meta">SN: {{ item.deviceSn || '--' }}</text>
<text class="device-meta" v-if="item.lastConnectedAt">最近连接：{{ formatTime(item.lastConnectedAt) }}</text>
</view>
<view class="device-actions">
<view class="state-pill" :class="item.status === '0' ? 'running' : 'offline'">
{{ item.status === '0' ? '正常' : '停用' }}
</view>
<button class="delete-btn" @click.stop="removeDevice(item)">
<uni-icons type="trash" size="12" color="#64748b"></uni-icons>
<text>删除</text>
</button>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
import { listMyDevices, deleteMyDevices, addMyDevice, updateMyDevice } from '@/api/device'
export default {
data() {
return {
searchKeyword: '',
deviceList: [],
scannedDevices: [],
_bluetoothFoundHandler: null
}
},
onLoad() {
this.fetchMyDevices()
},
onUnload() {
this.stopScan()
},
methods: {
fetchMyDevices() {
const params = {}
if ((this.searchKeyword || '').trim()) params.deviceName = this.searchKeyword.trim()
listMyDevices(params).then(res => {
this.deviceList = Array.isArray(res.rows) ? res.rows : []
})
},
clearSearch() {
this.searchKeyword = ''
this.fetchMyDevices()
},
refreshScan() {
this.scannedDevices = []
this.startScan()
},
startScan() {
uni.openBluetoothAdapter({
success: () => {
uni.startBluetoothDevicesDiscovery({
allowDuplicatesKey: false,
success: () => {
if (this._bluetoothFoundHandler) {
try { uni.offBluetoothDeviceFound(this._bluetoothFoundHandler) } catch (e) {}
}
this._bluetoothFoundHandler = res => {
const arr = res.devices || []
arr.forEach(dev => {
const id = dev.deviceId
const name = (dev.name || dev.localName || '').trim()
if (!id || !name) return
if (this.scannedDevices.some(s => s.deviceId === id)) return
this.scannedDevices.push({ deviceId: id, name })
})
}
uni.onBluetoothDeviceFound(this._bluetoothFoundHandler)
uni.showToast({ title: '扫描中...', icon: 'none' })
setTimeout(() => this.stopScan(), 10000)
}
})
},
fail: () => uni.showToast({ title: '请开启蓝牙权限', icon: 'none' })
})
},
stopScan() {
try { uni.stopBluetoothDevicesDiscovery({}) } catch (e) {}
if (this._bluetoothFoundHandler) {
try { uni.offBluetoothDeviceFound(this._bluetoothFoundHandler) } catch (e) {}
this._bluetoothFoundHandler = null
}
},
askConnect(device) {
uni.showModal({
title: '连接确认',
content: `连接设备「${device.name}」后将自动写入后端，是否继续？`,
success: res => {
if (res.confirm) this.connectDevice(device)
}
})
},
connectDevice(device) {
uni.showLoading({ title: '连接中...' })
uni.createBLEConnection({
deviceId: device.deviceId,
success: () => {
this.upsertDeviceToServer(device).finally(() => uni.hideLoading())
},
fail: () => {
uni.hideLoading()
uni.showToast({ title: '连接失败', icon: 'none' })
}
})
},
upsertDeviceToServer(device) {
const exist = this.deviceList.find(d => d.deviceSn === device.deviceId)
const payload = {
deviceName: device.name,
deviceSn: device.deviceId,
deviceType: 'attractor',
status: '0',
lastConnectedAt: new Date().toISOString()
}
if (exist) {
return updateMyDevice({ ...payload, deviceId: exist.deviceId }).then(() => {
uni.showToast({ title: '连接成功，已更新', icon: 'success' })
this.fetchMyDevices()
})
}
return addMyDevice(payload).then(() => {
uni.showToast({ title: '连接成功，已入库', icon: 'success' })
this.fetchMyDevices()
})
},
formatTime(ts) {
if (!ts) return ''
const d = new Date(ts)
const y = d.getFullYear()
const m = String(d.getMonth() + 1).padStart(2, '0')
const day = String(d.getDate()).padStart(2, '0')
const h = String(d.getHours()).padStart(2, '0')
const min = String(d.getMinutes()).padStart(2, '0')
return `${y}-${m}-${day} ${h}:${min}`
},
getIconForType() {
return '/static/images/app_icon_pack_schemeA_tealLogo/master_1024.png'
},
removeDevice(item) {
uni.showModal({
title: '删除设备',
content: '确认删除该设备吗？',
success: res => {
if (res.confirm) {
deleteMyDevices(item.deviceId).then(() => {
uni.showToast({ title: '删除成功', icon: 'none' })
this.fetchMyDevices()
})
}
}
})
},
gotoDetail(device) {
if (!device || !device.deviceSn) return
uni.navigateTo({ url: `/pages/devices/attractor/attractor?deviceId=${encodeURIComponent(device.deviceSn)}` })
}
}
}
</script>
<style scoped>
.device-page { min-height: 100vh; background: #f4f7f8; padding: 20rpx 20rpx 0; box-sizing: border-box; }
.search-row { display: flex; gap: 12rpx; align-items: center; margin-bottom: 18rpx; }
.search-box { flex: 1; height: 72rpx; display: flex; align-items: center; gap: 10rpx; padding: 0 16rpx; background: #fff; border-radius: 14rpx; border: 1rpx solid #e7eeef; }
.search-input { flex: 1; font-size: 24rpx; color: #0f172a; }
.clear-btn { border: none; background: transparent; font-size: 32rpx; color: #9ca3af; line-height: 1; }
.scan-chip { height: 72rpx; padding: 0 16rpx; border-radius: 14rpx; background: #e6f5f4; border: 1rpx solid #bfe9e7; display: flex; align-items: center; font-size: 22rpx; color: #0f7f7a; }
.content { height: calc(100vh - 240rpx); }
.section { margin-bottom: 20rpx; }
.section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12rpx; }
.section-title { font-size: 26rpx; font-weight: 600; color: #0f172a; }
.section-sub { font-size: 22rpx; color: #94a3b8; }
.empty-card { background: #fff; border-radius: 16rpx; border: 1rpx dashed #d6dde3; padding: 24rpx; text-align: center; color: #94a3b8; font-size: 24rpx; }
.device-card { display: flex; align-items: center; padding: 18rpx; border-radius: 18rpx; background: #fff; border: 1rpx solid #e7eeef; margin-bottom: 12rpx; }
.device-icon { width: 70rpx; height: 70rpx; border-radius: 16rpx; background: #f2f7f6; margin-right: 16rpx; }
.device-main { flex: 1; display: flex; flex-direction: column; gap: 4rpx; }
.device-name { font-size: 26rpx; font-weight: 600; color: #0f172a; }
.device-meta { font-size: 22rpx; color: #94a3b8; }
.device-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 10rpx; }
.state-pill { padding: 4rpx 12rpx; border-radius: 999rpx; font-size: 20rpx; font-weight: 600; background: #f1f5f9; color: #64748b; }
.state-pill.running { background: #ecfdf3; color: #059669; }
.state-pill.offline { background: #f1f5f9; color: #94a3b8; }
.delete-btn { display: inline-flex; align-items: center; gap: 6rpx; height: 44rpx; padding: 0 12rpx; border-radius: 12rpx; border: 1rpx solid #e2e8f0; background: #f8fafc; color: #64748b; font-size: 20rpx; }
</style>

430
attractor-ui/pages/devices/master.vue Normal file
View File

@@ -0,0 +1,430 @@
<template>
<view class="master-page">
<view class="hero-card">
<view>
<text class="hero-title">设备管理</text>
<text class="hero-sub">统一管理你的 Attractor 设备</text>
</view>
<button class="hero-btn" @click="openAddDeviceModal">新增设备</button>
</view>
<view class="filter-row">
<view
v-for="(tab, index) in deviceTabs"
:key="tab.type || index"
class="filter-pill"
:class="{ active: activeTab === index }"
@click="switchTab(index)"
>
{{ tab.name }}
</view>
</view>
<scroll-view class="device-list" scroll-y>
<view v-if="filteredDevices.length === 0" class="empty-card">
<text class="empty-title">当前分类暂无设备</text>
<text class="empty-sub">你可以点击右上角“新增设备”进行添加</text>
</view>
<view
class="device-card"
v-for="device in filteredDevices"
:key="device.id"
@click="toDeviceDetail(device.id)"
>
<image class="device-icon" :src="device.image" mode="aspectFit" />
<view class="device-main">
<text class="device-name">{{ device.name }}</text>
<text class="device-sn">SN: {{ device.sn }}</text>
<view class="meta-row">
<text class="meta-tag">{{ typeText(device.type) }}</text>
<text class="meta-text" v-if="device.user">使用者：{{ device.user }}</text>
</view>
</view>
<button class="delete-btn" @click.stop="deleteDevice(device.id)">
<uni-icons type="trash" size="13" color="#64748b"></uni-icons>
<text>删除</text>
</button>
</view>
</scroll-view>
<uni-popup ref="addDevicePopup" type="center">
<view class="popup-card">
<text class="popup-title">新增设备</text>
<button class="pair-btn" @click="bluetoothPair">蓝牙配对设备</button>
<view class="form-item">
<text class="form-label">设备名称</text>
<input class="form-input" v-model="newDevice.name" placeholder="请输入设备名称" />
</view>
<view class="form-item">
<text class="form-label">SN 码</text>
<input class="form-input" v-model="newDevice.sn" placeholder="配对后自动填充/手动输入" />
</view>
<view class="form-item">
<text class="form-label">设备类型</text>
<picker :range="pickerTypes" :value="newDevice.type" @change="onTypeChange">
<view class="picker-view">{{ pickerTypes[newDevice.type] }}</view>
</picker>
</view>
<view class="popup-actions">
<button class="ghost" @click="closeAddDeviceModal">取消</button>
<button class="primary" @click="confirmAddDevice">确认添加</button>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
deviceTabs: [
{ name: '全部', type: '' },
{ name: '智能硬件', type: 'hardware' },
{ name: '传感器', type: 'sensor' },
{ name: '控制器', type: 'controller' }
],
activeTab: 0,
deviceList: [
{
id: 1,
name: 'Attractor 主控器',
sn: 'ATR-20260327001',
type: 'controller',
image: '/static/images/app_icon_pack_schemeA_tealLogo/master_1024.png',
user: 'Attractor_001'
},
{
id: 2,
name: '环境传感器 A1',
sn: 'ATR-20260327002',
type: 'sensor',
image: '/static/images/app_icon_pack_schemeA_tealLogo/master_1024.png',
user: ''
}
],
newDevice: {
name: '',
sn: '',
type: 0
},
pickerTypes: ['智能硬件', '传感器', '控制器']
}
},
computed: {
filteredDevices() {
if (this.activeTab === 0) return this.deviceList
const targetType = this.deviceTabs[this.activeTab].type
return this.deviceList.filter(item => item.type === targetType)
}
},
methods: {
typeText(type) {
const map = {
hardware: '智能硬件',
sensor: '传感器',
controller: '控制器'
}
return map[type] || '未知类型'
},
switchTab(index) {
this.activeTab = index
},
openAddDeviceModal() {
this.newDevice = { name: '', sn: '', type: 0 }
this.$refs.addDevicePopup.open()
},
closeAddDeviceModal() {
this.$refs.addDevicePopup.close()
},
onTypeChange(e) {
this.newDevice.type = Number(e.detail.value)
},
bluetoothPair() {
this.newDevice.sn = `ATR-${Date.now().toString().slice(-8)}`
uni.showToast({ title: '配对成功，SN 已填充', icon: 'none' })
},
confirmAddDevice() {
if (!this.newDevice.name || !this.newDevice.sn) {
uni.showToast({ title: '设备名称和 SN 不能为空', icon: 'none' })
return
}
const typeMap = ['hardware', 'sensor', 'controller']
const id = Math.max(...this.deviceList.map(d => d.id), 0) + 1
this.deviceList.unshift({
id,
name: this.newDevice.name,
sn: this.newDevice.sn,
type: typeMap[this.newDevice.type],
image: '/static/images/app_icon_pack_schemeA_tealLogo/master_1024.png',
user: ''
})
this.closeAddDeviceModal()
uni.showToast({ title: '设备已添加', icon: 'success' })
},
deleteDevice(id) {
uni.showModal({
title: '删除设备',
content: '确认删除该设备吗？',
success: res => {
if (res.confirm) {
this.deviceList = this.deviceList.filter(item => item.id !== id)
uni.showToast({ title: '删除成功', icon: 'none' })
}
}
})
},
toDeviceDetail(id) {
uni.navigateTo({
url: '/pages/devices/detail/detail?id=' + id
})
}
}
}
</script>
<style scoped>
.master-page {
min-height: 100vh;
background: #f4f7f8;
padding: 20rpx;
box-sizing: border-box;
}
.hero-card {
background: #ffffff;
border: 1rpx solid #e7eeef;
border-radius: 18rpx;
padding: 22rpx;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 14rpx;
}
.hero-title {
display: block;
font-size: 34rpx;
font-weight: 700;
color: #0f172a;
}
.hero-sub {
display: block;
margin-top: 4rpx;
font-size: 22rpx;
color: #94a3b8;
}
.hero-btn {
height: 62rpx;
line-height: 62rpx;
padding: 0 20rpx;
border-radius: 14rpx;
border: 1rpx solid #bfe9e7;
background: #e6f5f4;
color: #0f7f7a;
font-size: 24rpx;
}
.filter-row {
display: flex;
gap: 10rpx;
overflow-x: auto;
padding-bottom: 8rpx;
margin-bottom: 10rpx;
}
.filter-pill {
flex-shrink: 0;
padding: 8rpx 18rpx;
border-radius: 999rpx;
border: 1rpx solid #e2e8f0;
background: #ffffff;
color: #64748b;
font-size: 23rpx;
}
.filter-pill.active {
border-color: #bfe9e7;
background: #e6f5f4;
color: #0f7f7a;
font-weight: 600;
}
.device-list {
height: calc(100vh - 240rpx);
}
.empty-card {
background: #ffffff;
border: 1rpx dashed #d7dee5;
border-radius: 16rpx;
padding: 40rpx 20rpx;
text-align: center;
}
.empty-title {
display: block;
font-size: 26rpx;
color: #64748b;
}
.empty-sub {
display: block;
margin-top: 8rpx;
font-size: 22rpx;
color: #94a3b8;
}
.device-card {
background: #ffffff;
border: 1rpx solid #e7eeef;
border-radius: 16rpx;
padding: 16rpx;
display: flex;
align-items: center;
margin-bottom: 10rpx;
}
.device-icon {
width: 72rpx;
height: 72rpx;
border-radius: 14rpx;
margin-right: 14rpx;
background: #f0fdfa;
}
.device-main {
flex: 1;
display: flex;
flex-direction: column;
gap: 4rpx;
}
.device-name {
font-size: 26rpx;
color: #0f172a;
font-weight: 600;
}
.device-sn,
.meta-text {
font-size: 22rpx;
color: #94a3b8;
}
.meta-row {
display: flex;
gap: 10rpx;
align-items: center;
}
.meta-tag {
font-size: 21rpx;
color: #0f7f7a;
background: #e6f5f4;
border-radius: 8rpx;
padding: 2rpx 10rpx;
}
.delete-btn {
display: inline-flex;
align-items: center;
gap: 6rpx;
height: 46rpx;
padding: 0 12rpx;
border-radius: 12rpx;
border: 1rpx solid #e2e8f0;
background: #f8fafc;
color: #64748b;
font-size: 20rpx;
}
.popup-card {
width: 620rpx;
background: #ffffff;
border-radius: 18rpx;
padding: 24rpx;
box-sizing: border-box;
}
.popup-title {
display: block;
text-align: center;
font-size: 30rpx;
color: #0f172a;
font-weight: 700;
margin-bottom: 16rpx;
}
.pair-btn {
height: 68rpx;
line-height: 68rpx;
border-radius: 14rpx;
border: 1rpx solid #bfe9e7;
background: #e6f5f4;
color: #0f7f7a;
font-size: 24rpx;
margin-bottom: 16rpx;
}
.form-item {
margin-bottom: 12rpx;
}
.form-label {
display: block;
font-size: 23rpx;
color: #64748b;
margin-bottom: 6rpx;
}
.form-input,
.picker-view {
height: 64rpx;
line-height: 64rpx;
border-radius: 12rpx;
border: 1rpx solid #e2e8f0;
background: #f8fafc;
padding: 0 14rpx;
font-size: 24rpx;
color: #0f172a;
}
.popup-actions {
margin-top: 16rpx;
display: flex;
gap: 10rpx;
}
.popup-actions button {
flex: 1;
height: 68rpx;
line-height: 68rpx;
border-radius: 12rpx;
font-size: 24rpx;
}
.popup-actions .ghost {
border: 1rpx solid #e2e8f0;
background: #f8fafc;
color: #64748b;
}
.popup-actions .primary {
border: 1rpx solid #bfe9e7;
background: #e6f5f4;
color: #0f7f7a;
}
</style>