From 7567409a9e0f7b4085169afa6e9569065d6c97dc Mon Sep 17 00:00:00 2001
From: xiaosi <2652281683@qq.com>
Date: Mon, 31 Aug 2026 09:43:18 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=9A=E5=8A=A1=E9=A1=B5=E5=B8=B8?=
 =?UTF-8?q?=E8=A7=84=E6=8C=89=E9=92=AE=E5=88=87=E6=8D=A2=E5=88=B0=20t-butt?=
 =?UTF-8?q?on?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Tasks 删除确认同步改为 ui.confirm；tabs/mode-segment 暂留原生。
---
 src/layout/components/SideMenu.vue            |  6 ++--
 src/layout/components/TopBar.vue              |  4 +--
 src/views/AlarmsView/AlarmsView.vue           |  4 +--
 .../DeviceDetailView/DeviceDetailView.vue     | 16 +++++-----
 src/views/MediaView/MediaView.vue             | 10 +++----
 src/views/ReplayView/ReplayView.vue           |  4 +--
 src/views/SystemView/SystemView.vue           | 10 +++----
 src/views/TasksView/TasksView.vue             | 29 ++++++++++---------
 8 files changed, 42 insertions(+), 41 deletions(-)

diff --git a/src/layout/components/SideMenu.vue b/src/layout/components/SideMenu.vue
index 7857b14..73aeca1 100644
--- a/src/layout/components/SideMenu.vue
+++ b/src/layout/components/SideMenu.vue
@@ -172,20 +172,20 @@ async function logout() {
     </t-menu>
 
     <div :class="s.bottom">
-      <button :class="s.profile" type="button" :aria-expanded="String(profileOpen)" @click="profileOpen = !profileOpen">
+      <t-button :class="s.profile" variant="text" type="button" :aria-expanded="String(profileOpen)" @click="profileOpen = !profileOpen">
         <span>{{ userName.charAt(0) }}</span>
         <div>
           <strong>{{ userName }}</strong>
           <small>嘉谷科技</small>
         </div>
         <svg :class="s.chevron"><use href="#i-chevron" /></svg>
-      </button>
+      </t-button>
       <div v-show="profileOpen" :class="s.profileMenu">
         <div :class="s.profileHeading">
           <strong>{{ userName }}</strong>
           <small>{{ userEmail }}</small>
         </div>
-        <button type="button" :class="s.logout" @click="logout">退出登录</button>
+        <t-button type="button" :class="s.logout" theme="danger" variant="text" @click="logout">退出登录</t-button>
       </div>
     </div>
   </div>
diff --git a/src/layout/components/TopBar.vue b/src/layout/components/TopBar.vue
index 0235fdf..6f0b188 100644
--- a/src/layout/components/TopBar.vue
+++ b/src/layout/components/TopBar.vue
@@ -26,9 +26,9 @@ const pageTitle = computed(() => titles[route.name] || '嘉谷低空智控平台
 
 <template>
   <div :class="s.root">
-    <button :class="s.mobileMenu" type="button" title="打开导航" @click="emit('toggle-sidebar')">
+    <t-button :class="s.mobileMenu" shape="square" variant="text" type="button" title="打开导航" @click="emit('toggle-sidebar')">
       <svg><use href="#i-menu" /></svg>
-    </button>
+    </t-button>
     <div :class="s.title">{{ pageTitle }}</div>
     <div :class="s.spacer" />
   </div>
diff --git a/src/views/AlarmsView/AlarmsView.vue b/src/views/AlarmsView/AlarmsView.vue
index b76964e..360d776 100644
--- a/src/views/AlarmsView/AlarmsView.vue
+++ b/src/views/AlarmsView/AlarmsView.vue
@@ -5,7 +5,7 @@
         <h1>告警运维</h1>
         <span>集中处理设备告警与异常事件</span>
       </div>
-      <button class="primary-command" @click="ui.toast('导出告警记录')"><svg><use href="#i-download" /></svg>导出记录</button>
+      <t-button theme="primary" @click="ui.toast('导出告警记录')"><svg><use href="#i-download" /></svg>导出记录</t-button>
     </header>
 
     <div class="business-metric-band alarm-metrics">
@@ -25,7 +25,7 @@
               <small>{{ a.device }} · {{ a.time }}</small>
             </div>
             <em class="status" :class="a.statusClass">{{ a.status }}</em>
-            <button class="alarm-handle" @click="handle(a)">处理</button>
+            <t-button class="alarm-handle" variant="outline" size="small" @click="handle(a)">处理</t-button>
           </article>
           <div v-if="!alarms.length" class="table-empty">暂无告警</div>
         </div>
diff --git a/src/views/DeviceDetailView/DeviceDetailView.vue b/src/views/DeviceDetailView/DeviceDetailView.vue
index 572a2cf..975d96b 100644
--- a/src/views/DeviceDetailView/DeviceDetailView.vue
+++ b/src/views/DeviceDetailView/DeviceDetailView.vue
@@ -2,7 +2,7 @@
   <section class="device-detail-page" :class="{ 'drone-detail': isDrone }">
     <template v-if="record">
       <header class="full-detail-header">
-        <button class="back-command" @click="router.push({ name: 'devices' })"><svg><use href="#i-chevron" /></svg>返回设备列表</button>
+        <t-button class="back-command" variant="text" @click="router.push({ name: 'devices' })"><svg><use href="#i-chevron" /></svg>返回设备列表</t-button>
         <div class="full-detail-identity">
           <span :class="{ drone: isDrone }"><svg><use :href="isDrone ? '#i-plane' : '#i-home'" /></svg></span>
           <div>
@@ -13,9 +13,9 @@
           <em class="status" :class="record.statusClass">{{ record.status }}</em>
         </div>
         <div class="full-detail-actions" v-if="!isAdmin">
-          <button v-if="!isDrone" class="plain-command" @click="editDockVisible = true">编辑信息</button>
-          <button class="plain-command" @click="goControl"><svg><use href="#i-zap" /></svg>远程控制</button>
-          <button class="primary-command" @click="goMonitor"><svg><use href="#i-radio" /></svg>实时监控</button>
+          <t-button v-if="!isDrone" variant="outline" @click="editDockVisible = true">编辑信息</t-button>
+          <t-button variant="outline" @click="goControl"><svg><use href="#i-zap" /></svg>远程控制</t-button>
+          <t-button theme="primary" @click="goMonitor"><svg><use href="#i-radio" /></svg>实时监控</t-button>
         </div>
       </header>
 
@@ -40,7 +40,7 @@
           <div class="detail-columns">
             <div class="detail-main-column">
               <section class="data-section">
-                <div class="data-section-title"><h2>机巢运行状态</h2><button @click="activeTab = 'state'">全部状态</button></div>
+                <div class="data-section-title"><h2>机巢运行状态</h2><t-button variant="text" theme="primary" @click="activeTab = 'state'">全部状态</t-button></div>
                 <div class="status-matrix">
                   <div><svg><use href="#i-door" /></svg><span>左侧舱门</span><strong>{{ doorText('left') }}</strong><i v-if="isClosed(doorValue('left'))" class="ok"></i></div>
                   <div><svg><use href="#i-door" /></svg><span>右侧舱门</span><strong>{{ doorText('right') }}</strong><i v-if="isClosed(doorValue('right'))" class="ok"></i></div>
@@ -99,7 +99,7 @@
                 </div>
               </section>
               <section class="data-section">
-                <div class="data-section-title"><h2>设备信息</h2><button v-if="!isAdmin" @click="editDockVisible = true">编辑</button></div>
+                <div class="data-section-title"><h2>设备信息</h2><t-button v-if="!isAdmin" variant="text" theme="primary" @click="editDockVisible = true">编辑</t-button></div>
                 <dl class="compact-properties">
                   <div><dt>机巢 SN</dt><dd>{{ record.sn }}</dd></div>
                   <div><dt>通信卡 ICCID</dt><dd>{{ record.iccid }}</dd></div>
@@ -237,7 +237,7 @@
       <div v-else-if="activeTab === 'logs'" class="full-detail-content">
         <div class="record-header">
           <div><h2>操作记录</h2><span>远程控制与配置变更</span></div>
-          <button @click="loadLogs">刷新</button>
+          <t-button variant="outline" @click="loadLogs">刷新</t-button>
         </div>
         <table class="record-table">
           <thead><tr><th>操作时间</th><th>操作类型</th><th>操作内容</th><th>执行结果</th><th>目标设备</th></tr></thead>
@@ -307,7 +307,7 @@
 
     <div v-if="!record" class="table-empty" style="flex:1;display:grid;place-items:center;color:var(--muted);font-size:12px">
       未找到该设备
-      <button class="primary-command" style="margin-top:10px" @click="router.push({ name: 'devices' })">返回设备列表</button>
+      <t-button theme="primary" style="margin-top:10px" @click="router.push({ name: 'devices' })">返回设备列表</t-button>
     </div>
   </section>
 </template>
diff --git a/src/views/MediaView/MediaView.vue b/src/views/MediaView/MediaView.vue
index 502b120..45e4375 100644
--- a/src/views/MediaView/MediaView.vue
+++ b/src/views/MediaView/MediaView.vue
@@ -6,7 +6,7 @@
         <span>统一查看实时直播与原始视频资产</span>
       </div>
       <div class="page-actions">
-        <button class="icon-command" title="刷新" @click="load"><svg><use href="#i-refresh" /></svg></button>
+        <t-button shape="square" variant="outline" title="刷新" @click="load"><svg><use href="#i-refresh" /></svg></t-button>
       </div>
     </header>
 
@@ -26,12 +26,12 @@
           <article v-for="s in liveStreams" :key="s.id">
             <div class="media-visual" :class="s.visualClass">
               <span class="live-corner"><i></i>LIVE</span>
-              <button @click="openLive(s)"><svg><use href="#i-play" /></svg></button>
+              <t-button shape="square" variant="text" @click="openLive(s)"><svg><use href="#i-play" /></svg></t-button>
               <small>{{ s.source }}</small>
             </div>
             <div class="media-card-copy">
               <span><strong>{{ s.name }}</strong><small>{{ s.desc }}</small></span>
-              <button class="icon-button" @click="ui.toast('更多操作')"><svg><use href="#i-more" /></svg></button>
+              <t-button class="icon-button" shape="square" variant="text" @click="ui.toast('更多操作')"><svg><use href="#i-more" /></svg></t-button>
             </div>
           </article>
           <div v-if="!liveStreams.length" class="table-empty" style="grid-column:1/-1">暂无直播流</div>
@@ -49,12 +49,12 @@
         <div class="media-grid">
           <article v-for="v in videos" :key="v.id">
             <div class="media-visual" :class="v.visualClass">
-              <button @click="ui.toast('播放：' + v.name)"><svg><use href="#i-play" /></svg></button>
+              <t-button shape="square" variant="text" @click="ui.toast('播放：' + v.name)"><svg><use href="#i-play" /></svg></t-button>
               <small class="media-duration">{{ v.duration }}</small>
             </div>
             <div class="media-card-copy">
               <span><strong>{{ v.name }}</strong><small>{{ v.desc }}</small></span>
-              <button class="icon-button" @click="download(v)"><svg><use href="#i-download" /></svg></button>
+              <t-button class="icon-button" shape="square" variant="text" @click="download(v)"><svg><use href="#i-download" /></svg></t-button>
             </div>
           </article>
           <div v-if="!videos.length" class="table-empty" style="grid-column:1/-1">暂无视频资产</div>
diff --git a/src/views/ReplayView/ReplayView.vue b/src/views/ReplayView/ReplayView.vue
index 1ac9b02..d266f8f 100644
--- a/src/views/ReplayView/ReplayView.vue
+++ b/src/views/ReplayView/ReplayView.vue
@@ -2,7 +2,7 @@
   <section class="task-replay-page">
     <header class="replay-header">
       <div class="replay-header-summary">
-        <button class="back-command" @click="router.push({ name: 'tasks', query: { view: 'records' } })"><svg><use href="#i-chevron" /></svg>返回执行记录</button>
+        <t-button class="back-command" variant="text" @click="router.push({ name: 'tasks', query: { view: 'records' } })"><svg><use href="#i-chevron" /></svg>返回执行记录</t-button>
       </div>
       <div>
         <small>执行回放</small>
@@ -18,7 +18,7 @@
     <div class="replay-map">
       <div v-if="loaded && !points.length" class="table-empty replay-empty">该执行记录暂无轨迹数据</div>
 
-      <button class="replay-map-back" @click="router.push({ name: 'tasks', query: { view: 'records' } })"><svg><use href="#i-chevron" /></svg>返回</button>
+      <t-button class="replay-map-back" variant="outline" @click="router.push({ name: 'tasks', query: { view: 'records' } })"><svg><use href="#i-chevron" /></svg>返回</t-button>
       <div class="replay-map-legend">
         <span><i class="route-start"></i>起点</span>
         <span><i class="route-end"></i>终点</span>
diff --git a/src/views/SystemView/SystemView.vue b/src/views/SystemView/SystemView.vue
index 5f7f068..000fc3f 100644
--- a/src/views/SystemView/SystemView.vue
+++ b/src/views/SystemView/SystemView.vue
@@ -21,10 +21,10 @@
             <div class="account-profile">
               <span>{{ adminInitial }}</span>
               <div><strong>{{ adminName }}</strong><small>{{ adminEmail }}</small></div>
-              <button class="table-text-action" @click="ui.toast('编辑管理员')">编辑</button>
+              <t-button variant="text" theme="primary" @click="ui.toast('编辑管理员')">编辑</t-button>
             </div>
             <div class="settings-list">
-              <div><span>登录账号</span><strong>{{ adminPhone }}</strong><button @click="ui.toast('修改账号')">修改</button></div>
+              <div><span>登录账号</span><strong>{{ adminPhone }}</strong><t-button variant="text" theme="primary" @click="ui.toast('修改账号')">修改</t-button></div>
               <div><span>所属企业</span><strong>嘉谷科技</strong></div>
               <div><span>账号角色</span><strong>{{ adminRole }}</strong></div>
             </div>
@@ -33,9 +33,9 @@
           <section class="settings-section">
             <div class="settings-heading"><div><h2>平台参数</h2><span>通用配置项</span></div></div>
             <div class="settings-list">
-              <div><span>默认时区</span><strong>Asia/Shanghai (UTC+8)</strong><button @click="ui.toast('修改时区')">修改</button></div>
-              <div><span>地图服务</span><strong>内置离线地图</strong><button @click="ui.toast('切换地图')">切换</button></div>
-              <div><span>数据保留</span><strong>90 天</strong><button @click="ui.toast('修改保留期')">修改</button></div>
+              <div><span>默认时区</span><strong>Asia/Shanghai (UTC+8)</strong><t-button variant="text" theme="primary" @click="ui.toast('修改时区')">修改</t-button></div>
+              <div><span>地图服务</span><strong>内置离线地图</strong><t-button variant="text" theme="primary" @click="ui.toast('切换地图')">切换</t-button></div>
+              <div><span>数据保留</span><strong>90 天</strong><t-button variant="text" theme="primary" @click="ui.toast('修改保留期')">修改</t-button></div>
               <div><span>语言</span><strong>简体中文</strong></div>
             </div>
           </section>
diff --git a/src/views/TasksView/TasksView.vue b/src/views/TasksView/TasksView.vue
index f00f2a3..855665f 100644
--- a/src/views/TasksView/TasksView.vue
+++ b/src/views/TasksView/TasksView.vue
@@ -5,7 +5,7 @@
         <h1>任务管理</h1>
         <span>今日 {{ todayTaskCount }} 个计划 · {{ runningTaskCount }} 个执行中</span>
       </div>
-      <button class="primary-command" @click="openCreateTask"><svg><use href="#i-plus" /></svg>新建任务</button>
+      <t-button theme="primary" @click="openCreateTask"><svg><use href="#i-plus" /></svg>新建任务</t-button>
     </header>
 
     <div class="business-metric-band task-metrics">
@@ -32,7 +32,7 @@
           </div>
           <div class="toolbar-group">
             <t-select v-model="planFilter" :options="planFilterOptions" placeholder="全部状态" style="width: 140px" />
-            <button class="plain-command" @click="resetPlanFilter">重置</button>
+            <t-button variant="outline" @click="resetPlanFilter">重置</t-button>
           </div>
         </div>
         <div class="business-table-wrap">
@@ -58,7 +58,7 @@
                 <td><span class="media-policy" :class="t.videoPolicyClass">{{ t.videoPolicy }}</span></td>
                 <td><span class="table-status" :class="t.statusClass"><i></i>{{ t.status }}</span></td>
                 <td>{{ t.lastResult }}</td>
-                <td><div class="row-actions"><button v-if="canExecuteTask(t)" @click="executeTask(t)">立即执行</button><button @click="deleteTask(t)">删除</button></div></td>
+                <td><div class="row-actions"><t-button v-if="canExecuteTask(t)" variant="text" theme="primary" @click="executeTask(t)">立即执行</t-button><t-button variant="text" theme="danger" @click="deleteTask(t)">删除</t-button></div></td>
               </tr>
             </tbody>
           </table>
@@ -102,7 +102,7 @@
                   <td>{{ r.duration }}</td>
                   <td>{{ r.collect }}</td>
                   <td><span class="table-status" :class="r.statusClass"><i></i>{{ r.result }}</span></td>
-                  <td><div class="row-actions"><button class="table-text-action" :disabled="r.statusClass === 'mission'" @click="goReplay(r)">{{ r.statusClass === 'mission' ? '执行中' : '轨迹回放' }}</button><button v-if="r.rawVideoId" class="table-text-action" :disabled="r.rawVideoStatus !== 'ready'" @click="downloadRawVideo(r)">{{ r.rawVideoStatus === 'ready' ? '下载原视频' : '视频处理中' }}</button></div></td>
+                  <td><div class="row-actions"><t-button variant="text" theme="primary" :disabled="r.statusClass === 'mission'" @click="goReplay(r)">{{ r.statusClass === 'mission' ? '执行中' : '轨迹回放' }}</t-button><t-button v-if="r.rawVideoId" variant="text" theme="primary" :disabled="r.rawVideoStatus !== 'ready'" @click="downloadRawVideo(r)">{{ r.rawVideoStatus === 'ready' ? '下载原视频' : '视频处理中' }}</t-button></div></td>
                 </tr>
               </tbody>
             </table>
@@ -119,7 +119,7 @@
                 <template #prefix-icon><t-icon name="search" /></template>
               </t-input>
             </div>
-            <button class="plain-command" @click="openRouteEditor"><svg><use href="#i-plus" /></svg>新建航线</button>
+            <t-button variant="outline" @click="openRouteEditor"><svg><use href="#i-plus" /></svg>新建航线</t-button>
           </div>
           <div class="route-grid">
             <article v-for="r in filteredRoutes" :key="r.id">
@@ -138,9 +138,9 @@
 
         <div class="route-editor" :hidden="!routeEditorOpen">
           <header class="route-editor-header">
-            <button class="back-command" type="button" @click="closeRouteEditor"><svg><use href="#i-chevron" /></svg>返回航线库</button>
+            <t-button class="back-command" variant="text" type="button" @click="closeRouteEditor"><svg><use href="#i-chevron" /></svg>返回航线库</t-button>
             <div><strong>新建航线</strong><span>{{ routeSummary }}</span></div>
-            <div><button class="plain-command" type="button" :disabled="!routePoints.length" @click="undoRoutePoint"><svg><use href="#i-refresh" /></svg>撤销</button><button class="plain-command" type="button" :disabled="!routePoints.length" @click="clearRoutePoints"><svg><use href="#i-x" /></svg>清空</button><button class="primary-command" type="button" :disabled="routeSaving" @click="submitRoute">{{ routeSaving ? '保存中…' : '保存航线' }}</button></div>
+            <div><t-button variant="outline" type="button" :disabled="!routePoints.length" @click="undoRoutePoint"><svg><use href="#i-refresh" /></svg>撤销</t-button><t-button variant="outline" type="button" :disabled="!routePoints.length" @click="clearRoutePoints"><svg><use href="#i-x" /></svg>清空</t-button><t-button theme="primary" type="button" :disabled="routeSaving" @click="submitRoute">{{ routeSaving ? '保存中…' : '保存航线' }}</t-button></div>
           </header>
           <div class="route-editor-body">
             <aside class="route-config-panel">
@@ -151,11 +151,11 @@
                 <label><span>速度</span><div class="number-input"><t-input-number v-model="routeForm.speed" theme="normal" :min="1" :max="20" :step="0.1" style="width: 100%" /><em>m/s</em></div></label>
               </div>
               <label><span>转弯方式</span><div class="mode-segment route-turn-segment"><button type="button" :class="{ active: routeForm.turnMode === 'auto' }" @click="routeForm.turnMode = 'auto'">自动转弯</button><button type="button" :class="{ active: routeForm.turnMode === 'stop' }" @click="routeForm.turnMode = 'stop'">定点转弯</button></div></label>
-              <button class="apply-all-waypoints" type="button" :disabled="!routePoints.length" @click="applyRouteDefaults"><svg><use href="#i-settings" /></svg>应用到全部航点</button>
+              <t-button class="apply-all-waypoints" variant="outline" type="button" :disabled="!routePoints.length" @click="applyRouteDefaults"><svg><use href="#i-settings" /></svg>应用到全部航点</t-button>
               <div class="waypoint-heading"><strong>航点列表</strong><span>{{ routePoints.length }}</span></div>
               <div class="waypoint-list">
                 <div v-if="!routePoints.length" class="waypoint-empty">点击右侧地图添加航点</div>
-                <div v-for="(point, index) in routePoints" :key="index" class="waypoint-item" @click="openWaypointEditor(index)"><b>{{ index + 1 }}</b><span><strong>{{ point.longitude.toFixed(6) }}, {{ point.latitude.toFixed(6) }}</strong><small>{{ point.altitude }} m · {{ point.speed }} m/s · {{ point.turnMode === 'auto' ? '自动转弯' : '定点转弯' }}</small></span><div class="waypoint-item-actions"><button type="button" title="删除航点" @click.stop="removeWaypoint(index)"><svg><use href="#i-x" /></svg></button></div></div>
+                <div v-for="(point, index) in routePoints" :key="index" class="waypoint-item" @click="openWaypointEditor(index)"><b>{{ index + 1 }}</b><span><strong>{{ point.longitude.toFixed(6) }}, {{ point.latitude.toFixed(6) }}</strong><small>{{ point.altitude }} m · {{ point.speed }} m/s · {{ point.turnMode === 'auto' ? '自动转弯' : '定点转弯' }}</small></span><div class="waypoint-item-actions"><t-button variant="text" shape="square" type="button" title="删除航点" @click.stop="removeWaypoint(index)"><svg><use href="#i-x" /></svg></t-button></div></div>
               </div>
               <div class="route-form-error">{{ routeFormError }}</div>
             </aside>
@@ -206,8 +206,8 @@
         <div class="form-error">{{ taskFormError }}</div>
       </form>
       <template #footer>
-        <button class="plain-command" type="button" @click="createTaskOpen = false">取消</button>
-        <button class="primary-command" type="button" :disabled="creatingTask" @click="submitCreateTask">{{ creatingTask ? '创建中…' : '创建任务' }}</button>
+        <t-button variant="outline" type="button" @click="createTaskOpen = false">取消</t-button>
+        <t-button theme="primary" type="button" :disabled="creatingTask" @click="submitCreateTask">{{ creatingTask ? '创建中…' : '创建任务' }}</t-button>
       </template>
     </t-dialog>
 
@@ -226,8 +226,8 @@
         <div class="route-form-error">{{ waypointFormError }}</div>
       </form>
       <template #footer>
-        <button class="plain-command" type="button" @click="closeWaypointEditor">取消</button>
-        <button class="primary-command" type="button" @click="saveWaypoint">保存航点</button>
+        <t-button variant="outline" type="button" @click="closeWaypointEditor">取消</t-button>
+        <t-button theme="primary" type="button" @click="saveWaypoint">保存航点</t-button>
       </template>
     </t-dialog>
   </section>
@@ -834,7 +834,8 @@ function resetPlanFilter() {
 }
 
 async function deleteTask(task) {
-  if (!window.confirm(`确定永久删除任务“${task.name}”吗？此操作不可恢复。`)) return
+  const ok = await ui.confirm(`确定永久删除任务“${task.name}”吗？`, '此操作不可恢复。')
+  if (!ok) return
   try {
     await request.delete(urls.TASK(task.id))
     ui.toast('任务已删除')