From ed197ce7acddf4183b8459b57f0c39b0284b98b5 Mon Sep 17 00:00:00 2001
From: 疯狂的狮子li <15040126243@163.com>
Date: 星期二, 20 七月 2021 17:26:20 +0800
Subject: [PATCH] update 完成OSS模块页面功能
---
ruoyi-ui/src/api/system/oss.js | 17 -----
ruoyi-oss/src/main/java/com/ruoyi/oss/constant/CloudConstant.java | 3 -
ruoyi-oss/src/main/java/com/ruoyi/oss/service/impl/MinioCloudStorageServiceImpl.java | 4
ruoyi-ui/src/components/Editor/index.vue | 2
sql/oss.sql | 3
ruoyi-oss/src/main/java/com/ruoyi/system/controller/SysOssController.java | 19 ++++++
ruoyi-ui/src/components/FileUpload/index.vue | 4
ruoyi-ui/src/components/ImageUpload/index.vue | 10 +--
ruoyi-ui/src/utils/ossdownload.js | 33 +++++++++++
ruoyi-ui/src/views/system/oss/index.vue | 76 +++++++++++++++----------
10 files changed, 107 insertions(+), 64 deletions(-)
diff --git a/ruoyi-oss/src/main/java/com/ruoyi/oss/constant/CloudConstant.java b/ruoyi-oss/src/main/java/com/ruoyi/oss/constant/CloudConstant.java
index bc2d59e..784edad 100644
--- a/ruoyi-oss/src/main/java/com/ruoyi/oss/constant/CloudConstant.java
+++ b/ruoyi-oss/src/main/java/com/ruoyi/oss/constant/CloudConstant.java
@@ -12,7 +12,4 @@
*/
public final static String CLOUD_STORAGE_CONFIG_KEY = "sys.oss.cloudStorageService";
- public final static String DEFAULT_CONTENT_TYPE = "application/octet-stream";
-
-
}
diff --git a/ruoyi-oss/src/main/java/com/ruoyi/oss/service/impl/MinioCloudStorageServiceImpl.java b/ruoyi-oss/src/main/java/com/ruoyi/oss/service/impl/MinioCloudStorageServiceImpl.java
index f6d4cd4..d499eb5 100644
--- a/ruoyi-oss/src/main/java/com/ruoyi/oss/service/impl/MinioCloudStorageServiceImpl.java
+++ b/ruoyi-oss/src/main/java/com/ruoyi/oss/service/impl/MinioCloudStorageServiceImpl.java
@@ -1,7 +1,6 @@
package com.ruoyi.oss.service.impl;
import cn.hutool.core.util.StrUtil;
-import com.ruoyi.oss.constant.CloudConstant;
import com.ruoyi.oss.entity.UploadResult;
import com.ruoyi.oss.enumd.CloudServiceEnumd;
import com.ruoyi.oss.enumd.PolicyType;
@@ -14,6 +13,7 @@
import org.springframework.beans.factory.InitializingBean;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Lazy;
+import org.springframework.http.MediaType;
import org.springframework.stereotype.Service;
import java.io.ByteArrayInputStream;
@@ -70,7 +70,7 @@
minioClient.putObject(PutObjectArgs.builder()
.bucket(properties.getBucketName())
.object(path)
- .contentType(StrUtil.blankToDefault(contentType, CloudConstant.DEFAULT_CONTENT_TYPE))
+ .contentType(StrUtil.blankToDefault(contentType, MediaType.APPLICATION_OCTET_STREAM_VALUE))
.stream(inputStream, inputStream.available(), -1)
.build());
} catch (Exception e) {
diff --git a/ruoyi-oss/src/main/java/com/ruoyi/system/controller/SysOssController.java b/ruoyi-oss/src/main/java/com/ruoyi/system/controller/SysOssController.java
index 9d1e917..7ebca5f 100644
--- a/ruoyi-oss/src/main/java/com/ruoyi/system/controller/SysOssController.java
+++ b/ruoyi-oss/src/main/java/com/ruoyi/system/controller/SysOssController.java
@@ -1,6 +1,8 @@
package com.ruoyi.system.controller;
+import cn.hutool.core.convert.Convert;
+import cn.hutool.http.HttpUtil;
import com.ruoyi.common.annotation.Log;
import com.ruoyi.common.annotation.RepeatSubmit;
import com.ruoyi.common.core.controller.BaseController;
@@ -18,12 +20,15 @@
import io.swagger.annotations.ApiOperation;
import lombok.RequiredArgsConstructor;
import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.MediaType;
import org.springframework.security.access.prepost.PreAuthorize;
import org.springframework.validation.annotation.Validated;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
+import javax.servlet.http.HttpServletResponse;
import javax.validation.constraints.NotEmpty;
+import java.io.IOException;
import java.util.Arrays;
import java.util.HashMap;
import java.util.Map;
@@ -74,6 +79,20 @@
return AjaxResult.success(map);
}
+ @ApiOperation("涓嬭浇OSS浜戝瓨鍌�")
+ @PreAuthorize("@ss.hasPermi('system:oss:download')")
+ @GetMapping("/download/{ossId}")
+ public void download(@PathVariable Long ossId, HttpServletResponse response) throws IOException {
+ SysOss sysOss = iSysOssService.getById(ossId);
+ if (sysOss == null) {
+ throw new CustomException("鏂囦欢鏁版嵁涓嶅瓨鍦�!");
+ }
+ response.reset();
+ response.setContentType(MediaType.APPLICATION_OCTET_STREAM_VALUE + "; charset=UTF-8");
+ long data = HttpUtil.download(sysOss.getUrl(), response.getOutputStream(), false);
+ response.setContentLength(Convert.toInt(data));
+ }
+
/**
* 鍒犻櫎OSS浜戝瓨鍌�
*/
diff --git a/ruoyi-ui/src/api/system/oss.js b/ruoyi-ui/src/api/system/oss.js
index e36ef16..39be597 100644
--- a/ruoyi-ui/src/api/system/oss.js
+++ b/ruoyi-ui/src/api/system/oss.js
@@ -9,23 +9,6 @@
})
}
-// 涓婁紶OSS浜戝瓨鍌�
-export function addOss(data) {
- return request({
- url: '/system/oss/upload',
- method: 'post',
- data: data
- })
-}
-
-// 涓嬭浇OSS浜戝瓨鍌�
-export function downloadOss(ossId) {
- return request({
- url: '/system/oss/download/' + ossId,
- method: 'get'
- })
-}
-
// 鍒犻櫎OSS浜戝瓨鍌�
export function delOss(ossId) {
return request({
diff --git a/ruoyi-ui/src/components/Editor/index.vue b/ruoyi-ui/src/components/Editor/index.vue
index f78dfcc..b2ea152 100644
--- a/ruoyi-ui/src/components/Editor/index.vue
+++ b/ruoyi-ui/src/components/Editor/index.vue
@@ -54,7 +54,7 @@
},
data() {
return {
- uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
+ uploadUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
headers: {
Authorization: "Bearer " + getToken()
},
diff --git a/ruoyi-ui/src/components/FileUpload/index.vue b/ruoyi-ui/src/components/FileUpload/index.vue
index d47fb98..244ac28 100644
--- a/ruoyi-ui/src/components/FileUpload/index.vue
+++ b/ruoyi-ui/src/components/FileUpload/index.vue
@@ -27,7 +27,7 @@
<!-- 鏂囦欢鍒楄〃 -->
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
<li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
- <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
+ <el-link :href="`${file.url}`" :underline="false" target="_blank">
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link>
<div class="ele-upload-list__item-content-action">
@@ -70,7 +70,7 @@
data() {
return {
baseUrl: process.env.VUE_APP_BASE_API,
- uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
+ uploadFileUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
headers: {
Authorization: "Bearer " + getToken(),
},
diff --git a/ruoyi-ui/src/components/ImageUpload/index.vue b/ruoyi-ui/src/components/ImageUpload/index.vue
index 31940af..e074b38 100644
--- a/ruoyi-ui/src/components/ImageUpload/index.vue
+++ b/ruoyi-ui/src/components/ImageUpload/index.vue
@@ -74,7 +74,7 @@
dialogVisible: false,
hideUpload: false,
baseUrl: process.env.VUE_APP_BASE_API,
- uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
+ uploadImgUrl: process.env.VUE_APP_BASE_API + "/system/oss/upload", // 涓婁紶鐨勫浘鐗囨湇鍔″櫒鍦板潃
headers: {
Authorization: "Bearer " + getToken(),
},
@@ -90,11 +90,7 @@
// 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁�
this.fileList = list.map(item => {
if (typeof item === "string") {
- if (item.indexOf(this.baseUrl) === -1) {
- item = { name: this.baseUrl + item, url: this.baseUrl + item };
- } else {
- item = { name: item, url: item };
- }
+ item = { name: item, url: item };
}
return item;
});
@@ -122,7 +118,7 @@
},
// 涓婁紶鎴愬姛鍥炶皟
handleUploadSuccess(res) {
- this.fileList.push({ name: res.data.fileName, url: res.data.fileName });
+ this.fileList.push({ name: res.data.fileName, url: res.data.url });
this.$emit("input", this.listToString(this.fileList));
this.loading.close();
},
diff --git a/ruoyi-ui/src/utils/ossdownload.js b/ruoyi-ui/src/utils/ossdownload.js
new file mode 100644
index 0000000..e212ca8
--- /dev/null
+++ b/ruoyi-ui/src/utils/ossdownload.js
@@ -0,0 +1,33 @@
+import axios from 'axios'
+import { getToken } from '@/utils/auth'
+
+const mimeMap = {
+ oss: 'application/octet-stream'
+}
+
+const baseUrl = process.env.VUE_APP_BASE_API
+export function downLoadOss(ossId, filename) {
+ var url = baseUrl + '/system/oss/download/' + ossId
+ axios({
+ method: 'get',
+ url: url,
+ responseType: 'blob',
+ headers: { 'Authorization': 'Bearer ' + getToken() }
+ }).then(res => {
+ resolveBlob(res, mimeMap.oss, filename)
+ })
+}
+/**
+ * 瑙ｆ瀽blob鍝嶅簲鍐呭骞朵笅杞�
+ * @param {*} res blob鍝嶅簲鍐呭
+ * @param {String} mimeType MIME绫诲瀷
+ */
+export function resolveBlob(res, mimeType, filename) {
+ const aLink = document.createElement('a')
+ var blob = new Blob([res.data], { type: mimeType })
+ aLink.href = URL.createObjectURL(blob)
+ aLink.setAttribute('download', filename) // 璁剧疆涓嬭浇鏂囦欢鍚嶇О
+ document.body.appendChild(aLink)
+ aLink.click()
+ document.body.removeChild(aLink);
+}
diff --git a/ruoyi-ui/src/views/system/oss/index.vue b/ruoyi-ui/src/views/system/oss/index.vue
index 0ad14cb..12bc5d3 100644
--- a/ruoyi-ui/src/views/system/oss/index.vue
+++ b/ruoyi-ui/src/views/system/oss/index.vue
@@ -71,9 +71,19 @@
plain
icon="el-icon-plus"
size="mini"
- @click="handleAdd"
+ @click="handleFile"
v-hasPermi="['system:oss:upload']"
- >涓婁紶</el-button>
+ >涓婁紶鏂囦欢</el-button>
+ </el-col>
+ <el-col :span="1.5">
+ <el-button
+ type="primary"
+ plain
+ icon="el-icon-plus"
+ size="mini"
+ @click="handleImage"
+ v-hasPermi="['system:oss:upload']"
+ >涓婁紶鍥剧墖</el-button>
</el-col>
<el-col :span="1.5">
<el-button
@@ -94,8 +104,16 @@
<el-table-column label="浜戝瓨鍌ㄤ富閿�" align="center" prop="ossId" v-if="false"/>
<el-table-column label="鏂囦欢鍚�" align="center" prop="fileName" />
<el-table-column label="鍘熷悕" align="center" prop="originalName" />
- <el-table-column label="鏂囦欢鍚庣紑鍚�" align="center" prop="fileSuffix" />
- <el-table-column label="URL鍦板潃" align="center" prop="url" />
+ <el-table-column label="鏂囦欢鍚庣紑" align="center" prop="fileSuffix" />
+ <el-table-column label="鏂囦欢灞曠ず" align="center" prop="url" >
+ <template slot-scope="scope">
+ <el-image
+ v-if="scope.row.fileSuffix.indexOf('png','jpg','jpeg') > 0"
+ style="width: 100px; height: 100px;"
+ :src="scope.row.url"
+ :preview-src-list="[scope.row.url]"/>
+ </template>
+ </el-table-column>
<el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
@@ -135,7 +153,8 @@
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="鏂囦欢鍚�">
- <imageUpload v-model="form.file"/>
+ <fileUpload v-model="form.file" v-if="type === 0"/>
+ <imageUpload v-model="form.file" v-if="type === 1"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@@ -147,7 +166,8 @@
</template>
<script>
-import { listOss, delOss, addOss, downloadOss } from "@/api/system/oss";
+import { listOss, delOss } from "@/api/system/oss";
+import { downLoadOss } from "@/utils/ossdownload";
export default {
name: "Oss",
@@ -173,6 +193,8 @@
ossList: [],
// 寮瑰嚭灞傛爣棰�
title: "",
+ // 寮瑰嚭灞傛爣棰�
+ type: 0,
// 鏄惁鏄剧ず寮瑰嚭灞�
open: false,
// 鍒涘缓鏃堕棿鏃堕棿鑼冨洿
@@ -225,17 +247,7 @@
// 琛ㄥ崟閲嶇疆
reset() {
this.form = {
- ossId: undefined,
file: undefined,
- fileName: undefined,
- originalName: undefined,
- fileSuffix: undefined,
- url: undefined,
- createTime: undefined,
- createBy: undefined,
- updateTime: undefined,
- updateBy: undefined,
- service: undefined
};
this.resetForm("form");
},
@@ -256,26 +268,28 @@
this.single = selection.length!==1
this.multiple = !selection.length
},
- /** 鏂板鎸夐挳鎿嶄綔 */
- handleAdd() {
+ /** 鏂囦欢鎸夐挳鎿嶄綔 */
+ handleFile() {
this.reset();
this.open = true;
- this.title = "涓婁紶OSS浜戝瓨鍌�";
+ this.title = "涓婁紶鏂囦欢";
+ this.type = 0;
+ },
+ /** 鍥剧墖鎸夐挳鎿嶄綔 */
+ handleImage() {
+ this.reset();
+ this.open = true;
+ this.title = "涓婁紶鍥剧墖";
+ this.type = 1;
},
/** 鎻愪氦鎸夐挳 */
submitForm() {
- this.$refs["form"].validate(valid => {
- if (valid) {
- this.buttonLoading = true;
- addOss(this.form).then(response => {
- this.msgSuccess("涓婁紶鎴愬姛");
- this.open = false;
- this.getList();
- }).finally(() => {
- this.buttonLoading = false;
- });
- }
- });
+ this.open = false;
+ this.getList();
+ },
+ /** 涓嬭浇鎸夐挳鎿嶄綔 */
+ handleDownload(row) {
+ downLoadOss(row.ossId, row.originalName)
},
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
handleDelete(row) {
diff --git a/sql/oss.sql b/sql/oss.sql
index 4e3d8f0..2458344 100644
--- a/sql/oss.sql
+++ b/sql/oss.sql
@@ -22,4 +22,5 @@
insert into sys_menu values('1600', '鏂囦欢鏌ヨ', '118', '1', '#', '', 1, 0, 'F', '0', '0', 'system:oss:query', '#', 'admin', sysdate(), '', null, '');
insert into sys_menu values('1601', '鏂囦欢涓婁紶', '118', '2', '#', '', 1, 0, 'F', '0', '0', 'system:oss:upload', '#', 'admin', sysdate(), '', null, '');
-insert into sys_menu values('1602', '鏂囦欢鍒犻櫎', '118', '3', '#', '', 1, 0, 'F', '0', '0', 'system:oss:remove', '#', 'admin', sysdate(), '', null, '');
+insert into sys_menu values('1602', '鏂囦欢涓嬭浇', '118', '3', '#', '', 1, 0, 'F', '0', '0', 'system:oss:download', '#', 'admin', sysdate(), '', null, '');
+insert into sys_menu values('1603', '鏂囦欢鍒犻櫎', '118', '4', '#', '', 1, 0, 'F', '0', '0', 'system:oss:remove', '#', 'admin', sysdate(), '', null, '');
--
Gitblit v1.9.3