refactor(layout, live-stream, lss): streamline component structure and improve readability

- Consolidated attributes in Vue components for the layout, live stream, and LSS management views to enhance code clarity.
- Reduced unnecessary line breaks and improved formatting for better maintainability.
- Updated the sidebar and table structures for a more cohesive user experience across different components.

src/layout/index.vue

@@ -217,36 +217,36 @@ const menuItems: MenuItem[] = [
   { path: '/', title: '仪表盘', icon: 'mdi:view-dashboard' },
   { path: '/lss', title: 'LSS 管理', icon: 'mdi:power-plug' },
   { path: '/live-stream', title: 'LiveStream 管理', icon: 'mdi:broadcast' },
-  { path: '/camera', title: '摄像头管理', icon: 'mdi:video' },
-  { path: '/machine', title: '机器管理', icon: 'mdi:monitor' },
   { path: '/cc', title: 'Cloudflare Stream', icon: 'mdi:cloud' },
+  { path: '/camera-vendor', title: '摄像头配置', icon: 'mdi:cctv' },
   { path: '/webrtc', title: 'WebRTC 流', icon: 'mdi:wifi' },
   { path: '/monitor', title: '多视频监控', icon: 'mdi:video' },
-  { path: '/camera-vendor', title: '摄像头配置', icon: 'mdi:cctv' },
-  {
-    path: '/demo',
-    title: '视频测试',
-    icon: 'mdi:play-circle-outline',
-    children: [
-      { path: '/demo/directurl', title: '直接 URL', icon: 'mdi:link' },
-      { path: '/demo/rtsp', title: 'RTSP 流', icon: 'mdi:wifi' },
-      { path: '/demo/samples', title: '测试视频', icon: 'mdi:filmstrip' },
-      { path: '/demo/hls', title: 'M3U8/HLS', icon: 'mdi:play-circle' }
-    ]
-  },
-  {
-    path: '/stream',
-    title: 'Stream 管理',
-    icon: 'mdi:play-circle',
-    children: [
-      { path: '/stream/videos', title: '视频管理', icon: 'mdi:filmstrip' },
-      { path: '/stream/live', title: '直播管理', icon: 'mdi:video-wireless' },
-      { path: '/stream/config', title: 'Stream 配置', icon: 'mdi:cog' },
-      { path: '/streamtest', title: '快速测试', icon: 'mdi:test-tube' }
-    ]
-  },
-  { path: '/stats', title: '观看统计', icon: 'mdi:chart-bar' },
-  { path: '/audit', title: '审计日志', icon: 'mdi:file-document' }
+  { path: '/machine', title: '机器管理', icon: 'mdi:monitor' },
+  { path: '/camera', title: '摄像头管理', icon: 'mdi:video' }
+  // {
+  //   path: '/demo',
+  //   title: '视频测试',
+  //   icon: 'mdi:play-circle-outline',
+  //   children: [
+  //     { path: '/demo/directurl', title: '直接 URL', icon: 'mdi:link' },
+  //     { path: '/demo/rtsp', title: 'RTSP 流', icon: 'mdi:wifi' },
+  //     { path: '/demo/samples', title: '测试视频', icon: 'mdi:filmstrip' },
+  //     { path: '/demo/hls', title: 'M3U8/HLS', icon: 'mdi:play-circle' }
+  //   ]
+  // },
+  // {
+  //   path: '/stream',
+  //   title: 'Stream 管理',
+  //   icon: 'mdi:play-circle',
+  //   children: [
+  //     { path: '/stream/videos', title: '视频管理', icon: 'mdi:filmstrip' },
+  //     { path: '/stream/live', title: '直播管理', icon: 'mdi:video-wireless' },
+  //     { path: '/stream/config', title: 'Stream 配置', icon: 'mdi:cog' },
+  //     { path: '/streamtest', title: '快速测试', icon: 'mdi:test-tube' }
+  //   ]
+  // },
+  // { path: '/stats', title: '观看统计', icon: 'mdi:chart-bar' },
+  // { path: '/audit', title: '审计日志', icon: 'mdi:file-document' }
 ]
 
 const userInitial = computed(() => {

src/views/live-stream/index.vue

@@ -102,8 +102,11 @@
             {{ formatDateTime(row.createdAt) }}
           </template>
         </el-table-column>
-        <el-table-column :label="t('操作')" width="120" align="center" fixed="right">
+        <el-table-column :label="t('操作')" width="200" align="center" fixed="right">
           <template #default="{ row }">
+            <el-button :icon="VideoPlay" type="primary" link @click="handleViewCloudflare(row)">
+              {{ t('流媒体') }}
+            </el-button>
             <el-button type="primary" link @click="handleEdit(row)">{{ t('编辑') }}</el-button>
             <el-button type="danger" link @click="handleDelete(row)">{{ t('删除') }}</el-button>
           </template>
@@ -225,7 +228,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted, computed, watch } from 'vue'
 import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
-import { Search, RefreshRight, Plus } from '@element-plus/icons-vue'
+import { Search, RefreshRight, Plus, VideoPlay } from '@element-plus/icons-vue'
 import { listLiveStreams, addLiveStream, updateLiveStream, deleteLiveStream } from '@/api/live-stream'
 import { listAllLssNodes } from '@/api/lss'
 import { adminListCameras } from '@/api/camera'

src/views/lss/index.vue

@@ -51,8 +51,13 @@
       >
         <el-table-column prop="lssId" label="LSS ID" min-width="120" sortable="custom" show-overflow-tooltip />
         <el-table-column prop="lssName" :label="t('名称')" min-width="140" sortable="custom" show-overflow-tooltip />
-        <el-table-column prop="ip" :label="t('IP')" min-width="180" sortable="custom" show-overflow-tooltip />
         <el-table-column prop="address" :label="t('地址')" min-width="180" sortable="custom" show-overflow-tooltip />
+        <el-table-column prop="ip" :label="t('IP')" min-width="180" sortable="custom" show-overflow-tooltip />
+        <el-table-column label="心跳" align="center">
+          <template #default="{ row }">
+            {{ formatTime(row.lastHeartbeatAt) }}
+          </template>
+        </el-table-column>
         <el-table-column prop="status" :label="t('状态')" min-width="100" sortable="custom">
           <template #default="{ row }">
             <el-tag :type="getStatusTagType(row.status)" size="small">
@@ -83,11 +88,7 @@
             <el-button type="primary" link :icon="View" @click="handleViewDetail(row)" />
           </template>
         </el-table-column>
-        <el-table-column label="心跳时间" align="center">
-          <template #default="{ row }">
-            {{ formatTime(row.lastHeartbeatAt) }}
-          </template>
-        </el-table-column>
+
         <el-table-column label="status" align="center">
           <template #default="{ row }">
             {{ row.status === 'ONLINE' ? '在线' : '离线' }}