Commit 29d2aad176feeaec091982935f7f679a54a76927
1 parent
427d031b
fix: 上传视频无法预览
Showing
1 changed file
with
14 additions
and
8 deletions
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 | }, | ... | ... |