!210 文件表type字段修改

Merge pull request !210 from 随心/master

Author: YunaiV

src/views/infra/file/index.vue

@@ -26,27 +26,32 @@
 
     <!-- 列表 -->
     <el-table v-loading="loading" :data="list">
-      <el-table-column label="文件名" align="center" prop="name" />
-      <el-table-column label="文件路径" align="center" prop="path" />
-      <el-table-column label="文件 URL" align="center" prop="url" />
-      <el-table-column label="文件大小" align="center" prop="size" width="120" :formatter="sizeFormat" />
-      <el-table-column label="文件类型" align="center" prop="type" width="80" />
-<!--      <el-table-column label="文件内容" align="center" prop="content">-->
-<!--        <template slot-scope="scope">-->
-<!--          <img v-if="scope.row.type === 'jpg' || scope.row.type === 'png' || scope.row.type === 'gif'"-->
-<!--               width="200px" :src="getFileUrl + scope.row.id">-->
-<!--          <i v-else>非图片，无法预览</i>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-      <el-table-column label="上传时间" align="center" prop="createTime" width="180">
+      <el-table-column label="文件名" :show-overflow-tooltip="true" align="center" min-width="200px" prop="name"/>
+      <el-table-column label="文件路径" :show-overflow-tooltip="true" align="center" min-width="250px" prop="path"/>
+      <el-table-column label="文件 URL" :show-overflow-tooltip="true" align="center" min-width="300px" prop="url"/>
+      <el-table-column label="文件大小" align="center" prop="size" min-width="120px" :formatter="sizeFormat"/>
+      <el-table-column label="文件类型" :show-overflow-tooltip="true" align="center" prop="type" width="180px"/>
+      <el-table-column label="文件内容" align="center" prop="content" min-width="150px">
+        <template slot-scope="scope">
+          <image-preview v-if="scope.row.type&&scope.row.type.indexOf('image/') === 0" :src="scope.row.url"
+                         :width="'100px'"></image-preview>
+          <i v-else>无法预览，点击
+            <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" target="_blank"
+                     :href="getFileUrl + scope.row.configId + '/get/' + scope.row.path">下载
+            </el-link>
+          </i>
+        </template>
+      </el-table-column>
+      <el-table-column label="上传时间" align="center" prop="createTime" min-width="170px">
         <template slot-scope="scope">
           <span>{{ parseTime(scope.row.createTime) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" min-width="100px">
         <template slot-scope="scope">
           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
-                     v-hasPermi="['infra:file:delete']">删除</el-button>
+                     v-hasPermi="['infra:file:delete']">删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -77,14 +82,18 @@
 </template>
 
 <script>
-import { deleteFile, getFilePage } from "@/api/infra/file";
+import {deleteFile, getFilePage} from "@/api/infra/file";
 import {getAccessToken} from "@/utils/auth";
+import ImagePreview from "@/components/ImagePreview";
 
 export default {
   name: "File",
+  components: {
+    ImagePreview
+  },
   data() {
     return {
-      getFileUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/get/',
+      getFileUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/',
       // 遮罩层
       loading: true,
       // 显示搜索条件