工具-页面调整

src/api/videoCommunication.js

@@ -1,85 +1,9 @@
 import request from '@/utils/request'
 
-// 查询会议列表
+// 视讯-会议列表
-export function listMeeting(query) {
+export function listConsultation(query) {
   return request({
-    url: '/videoCommunication/meeting/list',
+    url: '/v1/consultation/list',
-    method: 'get',
-    params: query
-  })
-}
-
-// 查询会议详情
-export function getMeeting(id) {
-  return request({
-    url: '/videoCommunication/meeting/' + id,
-    method: 'get'
-  })
-}
-
-// 新增会议
-export function addMeeting(data) {
-  return request({
-    url: '/videoCommunication/meeting',
-    method: 'post',
-    data: data
-  })
-}
-
-// 修改会议
-export function updateMeeting(data) {
-  return request({
-    url: '/videoCommunication/meeting',
-    method: 'put',
-    data: data
-  })
-}
-
-// 删除会议
-export function delMeeting(id) {
-  return request({
-    url: '/videoCommunication/meeting/' + id,
-    method: 'delete'
-  })
-}
-
-// 加入会议
-export function joinMeeting(data) {
-  return request({
-    url: '/videoCommunication/meeting/join',
-    method: 'post',
-    data: data
-  })
-}
-
-// 开始会议
-export function startMeeting(id) {
-  return request({
-    url: '/videoCommunication/meeting/start/' + id,
-    method: 'post'
-  })
-}
-
-// 结束会议
-export function endMeeting(id) {
-  return request({
-    url: '/videoCommunication/meeting/end/' + id,
-    method: 'post'
-  })
-}
-
-// 获取会议回放
-export function getMeetingReplay(id) {
-  return request({
-    url: '/videoCommunication/meeting/replay/' + id,
-    method: 'get'
-  })
-}
-
-// 查询会议统计
-export function getMeetingStats(query) {
-  return request({
-    url: '/videoCommunication/meeting/stats',
     method: 'get',
     params: query
   })

src/views/utility/index.vue

@@ -1,21 +1,27 @@
 <template>
   <div class="app-container">
+    <!-- 传输管理器卡片 -->
     <el-card>
+      <!-- 头部：标题 + 清空按钮 -->
       <div slot="header">
         <span>传输管理器</span>
         <el-button
           style="float: right; padding: 3px 0"
           type="text"
+          icon="el-icon-delete"
           @click="handleClearRecords"
         >
           清空记录
         </el-button>
       </div>
+      <div v-for="(dateItem, index) in transferDataList" :key="index">
+        <!-- 日期分割线 -->
         <el-divider>
-        <el-tag type="info">2026-05-13</el-tag>
+          <el-tag type="info">{{ dateItem.date }}</el-tag>
         </el-divider>
-      <el-table :data="fileList" :show-header="false">
+        <!-- 传输记录表格 -->
-        <el-table-column prop="name" label="缩略图" width="80" align="center">
+        <el-table :data="dateItem.list" :show-header="false">
+          <el-table-column label="缩略图标" width="80" align="center">
             <template slot-scope="scope">
               <div class="video-thumb">
                 <i class="el-icon-video-camera" />
@@ -37,58 +43,76 @@
             align="center"
           >
             <template slot-scope="scope">
-            <el-progress :percentage="scope.row.progress" />
+              <el-progress :percentage="scope.row.progress" stroke-width="8" />
             </template>
           </el-table-column>
           <el-table-column
             prop="time"
             label="上传时间"
-          width="120"
+            width="100"
             align="center"
             show-overflow-tooltip
           />
           <el-table-column
             prop="status"
             label="上传状态"
-          width="90"
+            width="100"
             align="center"
-          show-overflow-tooltip
           >
             <template slot-scope="scope">
-            <el-tag>
+              <el-tag
+                :type="scope.row.status === '上传成功' ? 'success' : 'warning'"
+              >
                 {{ scope.row.status }}
               </el-tag>
             </template>
           </el-table-column>
-        <el-table-column label="操作" width="180" align="center">
+          <!-- 操作按钮 -->
+          <el-table-column label="操作" width="200" align="center">
             <template slot-scope="scope">
               <el-button
                 type="text"
                 icon="el-icon-view"
-              @click="handleOpen(scope.row)"
+                @click="handleOpenFile(scope.row)"
               >
                 打开
               </el-button>
               <el-button
                 type="text"
-              icon="el-icon-folder"
+                icon="el-icon-folder-opened"
-              @click="handleOpenPath(scope.row)"
+                @click="handleOpenFolder(scope.row)"
               >
                 打开位置
               </el-button>
             </template>
           </el-table-column>
         </el-table>
+      </div>
     </el-card>
   </div>
 </template>
 <script>
 export default {
-  name: "TransferManager",
+  name: "Utility",
   data() {
     return {
-      // 模拟数据（实际项目中 filePath 应为网络可访问地址）
+      // 最终渲染数据：数组结构，包含日期 + 文件列表
-      fileList: [
+      transferDataList: [],
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    // 查询列表
+    getList() {
+      this.loading = true;
+      // listUser(this.addDateRange(this.queryParams, this.dateRange)).then(
+      //   (response) => {
+      this.transferDataList = [
+        {
+          date: "2026-05-13",
+          list: [
             {
               id: 1,
               name: "1633500241136.mp4",
@@ -96,19 +120,16 @@ export default {
               progress: 100,
               time: "14:31",
               status: "上传成功",
-          // 浏览器环境：必须使用网络URL，不能使用本地D盘路径
+              fileUrl: "https://www.w3school.com.cn/i/movie.mp4",
-          filePath: "https://www.w3school.com.cn/i/movie.mp4",
-          folderPath: "D:/手机照片/风景宜人",
             },
             {
               id: 2,
-          name: "TG-2023-01-21-215030828...",
+              name: "TG-2023-01-21-215030828.mp4",
               size: "11.86M",
               progress: 100,
               time: "14:31",
               status: "上传成功",
-          filePath: "D:/手机照片/风景宜人/1633500241136.mp4", // 文件完整路径（用于预览）
+              fileUrl: "https://www.w3school.com.cn/i/movie.mp4",
-          folderPath: "D:/手机照片/风景宜人",
             },
             {
               id: 3,
@@ -117,48 +138,43 @@ export default {
               progress: 100,
               time: "14:16",
               status: "上传成功",
-          filePath: "D:/手机照片/风景宜人/1633500241136.mp4", // 文件完整路径（用于预览）
+              fileUrl: "https://www.w3school.com.cn/i/movie.mp4",
-          folderPath: "D:/手机照片/风景宜人",
             },
           ],
-    };
         },
-  methods: {
+      ];
-    // 清空记录
+      //     this.total = response.total;
+      //     this.loading = false;
+      //   }
+      // );
+    },
+    // 清空所有传输记录
     handleClearRecords() {
       this.$modal
         .confirm("是否要清除本地传输记录?")
         .then(() => {
-          this.fileList = [];
+          this.transferDataList = [];
           this.$modal.msgSuccess("清空成功");
         })
         .catch(() => {});
     },
-    // 打开视频文件
+    // 打开文件
-    // 注意：浏览器安全限制禁止直接访问本地文件系统
+    handleOpenFile(row) {
-    handleOpen(row) {
+      if (!row.fileUrl) {
-      window.open(row.filePath, "_blank");
+        this.$modal.msgWarning("文件地址无效，无法打开");
+        return;
+      }
+      window.open(row.fileUrl, "_blank");
     },
-    // 打开文件所在文件夹
+    // 打开文件位置（下载）
-    // 注意：浏览器安全限制禁止直接访问本地文件系统
+    handleOpenFolder(row) {
-    handleOpenPath(row) {
+      this.$modal.msg("浏览器安全限制：请下载后在下载列表打开文件夹");
-      // const link = document.createElement("a");
+      const a = document.createElement("a");
-      // link.href = row.filePath;
+      a.href = row.fileUrl;
-      // link.download = row.name;
+      a.download = row.name;
-      // link.click();
+      document.body.appendChild(a);
-      // 4. 创建a标签模拟点击下载
+      a.click();
-      const link = document.createElement("a");
+      document.body.removeChild(a);
-      link.href = row.filePath;
-      link.download = row.name; // 自定义文件名 + 后缀
-      document.body.appendChild(link);
-      link.click();
-      // 5. 释放内存
-      document.body.removeChild(link);
-      window.URL.revokeObjectURL(downloadUrl);
-      // 弹窗引导操作
-      this.$message.info(
-        "文件已开始下载，请在浏览器下载列表右键打开文件所在文件夹"
-      );
     },
   },
 };
@@ -166,14 +182,15 @@ export default {
 
 <style lang="scss" scoped>
 .video-thumb {
-  width: 40px;
+  width: 42px;
-  height: 40px;
+  height: 42px;
-  border-radius: 4px;
+  border-radius: 6px;
-  line-height: 40px;
-  text-align: center;
-  font-size: 20px;
   background: #655dd4;
   color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
   margin: 0 auto;
 }
 </style>