Commit 29d2aad176feeaec091982935f7f679a54a76927

Authored by gaibu
1 parent 427d031b

fix: 上传视频无法预览

yudao-ui-admin/src/views/infra/file/index.vue
1 1 <template>
2 2 <div class="app-container">
3   - <doc-alert title="上传下载" url="https://doc.iocoder.cn/file/" />
  3 + <doc-alert title="上传下载" url="https://doc.iocoder.cn/file/"/>
4 4 <!-- 搜索工作栏 -->
5 5 <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
6 6 <el-form-item label="文件路径" prop="path">
7 7 <el-input v-model="queryParams.path" placeholder="请输入文件路径" clearable @keyup.enter.native="handleQuery"/>
8 8 </el-form-item>
9 9 <el-form-item label="创建时间" prop="createTime">
10   - <el-date-picker v-model="queryParams.createTime" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss" type="daterange"
11   - range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" />
  10 + <el-date-picker v-model="queryParams.createTime" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss"
  11 + type="daterange"
  12 + range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
  13 + :default-time="['00:00:00', '23:59:59']"/>
12 14 </el-form-item>
13 15 <el-form-item>
14 16 <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
... ... @@ -35,6 +37,9 @@
35 37 <template v-slot="scope">
36 38 <image-preview v-if="scope.row.type&&scope.row.type.indexOf('image/') === 0" :src="scope.row.url"
37 39 :width="'100px'"></image-preview>
  40 + <video v-else-if="scope.row.type&&scope.row.type.indexOf('video/') === 0" :width="'100px'">
  41 + <source :src="scope.row.url"/>
  42 + </video>
38 43 <i v-else>无法预览,点击
39 44 <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" target="_blank"
40 45 :href="getFileUrl + scope.row.configId + '/get/' + scope.row.path">下载
... ... @@ -118,7 +123,7 @@ export default {
118 123 title: "", // 弹出层标题
119 124 isUploading: false, // 是否禁用上传
120 125 url: process.env.VUE_APP_BASE_API + "/admin-api/infra/file/upload", // 请求地址
121   - headers: { Authorization: "Bearer " + getAccessToken() }, // 设置上传的请求头部
  126 + headers: {Authorization: "Bearer " + getAccessToken()}, // 设置上传的请求头部
122 127 data: {} // 上传的额外数据,用于文件名
123 128 },
124 129 };
... ... @@ -189,19 +194,20 @@ export default {
189 194 /** 删除按钮操作 */
190 195 handleDelete(row) {
191 196 const id = row.id;
192   - this.$modal.confirm('是否确认删除文件编号为"' + id + '"的数据项?').then(function() {
  197 + this.$modal.confirm('是否确认删除文件编号为"' + id + '"的数据项?').then(function () {
193 198 return deleteFile(id);
194 199 }).then(() => {
195 200 this.getList();
196 201 this.$modal.msgSuccess("删除成功");
197   - }).catch(() => {});
  202 + }).catch(() => {
  203 + });
198 204 },
199 205 // 用户昵称展示
200 206 sizeFormat(row, column) {
201   - const unitArr = ["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"];
  207 + const unitArr = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
202 208 const srcSize = parseFloat(row.size);
203 209 const index = Math.floor(Math.log(srcSize) / Math.log(1024));
204   - let size =srcSize/Math.pow(1024,index);
  210 + let size = srcSize / Math.pow(1024, index);
205 211 size = size.toFixed(2);//保留的小数位数
206 212 return size + ' ' + unitArr[index];
207 213 },
... ...