上传组件完成

This commit is contained in:
20932067@zju.edu.cn 2021-02-21 23:30:58 +08:00
parent 9f861e2365
commit 4245ac1d62
15 changed files with 306 additions and 300 deletions

View File

@ -1,12 +0,0 @@
import axios from "axios";
import {getToken} from "@/utils/auth";
export function downloadFile(fileId) {
return axios({
method: 'get',
url: process.env.VUE_APP_BASE_API + '/system/file/download/' + fileId,
headers: {
token: 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
}
})
}

View File

@ -61,7 +61,7 @@ export default {
},
handleUploadSuccess(res) {
this.$emit("input", res.url);
this.$emit("changeAddress",res.fileName);
this.$emit("change",res.fileName,res.url);
this.loading.close();
},
handleBeforeUpload() {

View File

@ -133,15 +133,15 @@ export const constantRoutes = [
]
},
{
path: '/test',
path: '/download',
component: Layout,
hidden: true,
children: [
{
path: '/',
component: (resolve) => require(['@/views/test/sqltest'], resolve),
name: 'sqltest',
meta: { title: 'sql语法高亮测试' }
component: (resolve) => require(['@/views/test/downloadtest'], resolve),
name: 'download',
meta: { title: '下载组件测试' }
}
]
},

View File

@ -0,0 +1,34 @@
import axios from "axios";
import {getToken} from "@/utils/auth";
import {Message} from "element-ui";
export function downloadFile(fileId) {
return axios({
method: 'get',
url: process.env.VUE_APP_BASE_API + '/system/file/download/' + fileId,
headers: {
token: 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
}
})
}
export function uploadFile(data) {
return axios({
url: process.env.VUE_APP_BASE_API + '/system/file',
method: 'post',
data: data,
headers: {
Authorization: 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
}
}).then(res => {
if (res.data.code === 200) {
return res.data
} else {
Message({
message: res.data.msg,
type: 'error'
})
return false
}
})
}

View File

@ -158,7 +158,7 @@ export default {
.title {
margin: 0px auto 30px auto;
text-align: center;
color: #707070;
color: white;
}
.login-form {
@ -168,6 +168,8 @@ export default {
padding: 25px 25px 5px 25px;
.el-input {
height: 38px;
background-color: white;
border-radius: 6px;
input {
height: 38px;
}

View File

@ -181,7 +181,7 @@
</el-form-item>
<div v-show="isPublicShow">
<el-form-item v-show="isAdd" label="文件夹">
<el-select v-model="form.pId" placeholder="请选择">
<el-select v-model="form.pId" clearable placeholder="请选择">
<el-option
v-for="item in folderOptions"
:key="item.fileId"
@ -191,7 +191,7 @@
</el-select>
</el-form-item>
<el-form-item label="角色" prop="roleIds">
<el-select v-model="form.roleIds" multiple placeholder="请选择">
<el-select v-model="form.roleIds" clearable multiple placeholder="请选择">
<el-option
v-for="item in roleOptions"
:key="item.roleId"
@ -211,10 +211,10 @@
</el-switch>
</el-form-item>
<el-form-item label="图片上传" v-show="!fileForm.fileType" >
<ImageUpload v-model="fileForm.url" v-on:changeAddress="changeAddress"/>
<ImageUpload v-model="fileForm.url" v-on:change="changeAddress"/>
</el-form-item>
<el-form-item label="文件上传" v-show="fileForm.fileType" >
<FileUpload v-model="fileForm.url" v-on:changeAddress="changeAddress"/>
<FileUpload v-model="fileForm.url" v-on:change="changeAddress"/>
</el-form-item>
</div>
</el-form>
@ -229,7 +229,7 @@
<script>
import {listFile, getFile, delFile, addFile, updateFile, exportFile, getRoleAll, getFolder} from "@/api/system/file";
import {downloadFile} from '@/api/system/download'
import {downloadFile} from '@/utils/fileUtils'
import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload';
@ -240,7 +240,7 @@ export default {
FileUpload,
},
data() {
var checkRoleIds = (rule, value, callback) => {
const checkRoleIds = (rule, value, callback) => {
if (this.form.isPublic === "2") {
if (value.length === 0) {
callback(new Error('角色不能为空'));
@ -257,7 +257,6 @@ export default {
url: "",
open: false,
fileType: false,
isPulic: false,
},
//
roleOptions: [],
@ -351,7 +350,6 @@ export default {
*/
changeAddress(addr) {
this.form.fileAddr = addr
console.log(addr)
},
/** 文件上传 */
handleFileUpdate() {
@ -412,7 +410,9 @@ export default {
this.resetForm("queryForm");
this.handleQuery();
},
//
/**
* 多选框选中数据
*/
handleSelectionChange(selection) {
this.ids = selection.map(item => item.fileId)
this.single = selection.length !== 1

View File

@ -0,0 +1,176 @@
<template>
<div>
<el-form ref="uploadFrom" :model="form" :rules="rules" label-width="80px">
<div v-if="vPublic === null">
<el-form-item label="是否公开">
<el-radio-group v-model="form.isPublic" @change="isPublicChange">
<el-radio label="1">公开</el-radio>
<el-radio label="2">保护</el-radio>
</el-radio-group>
</el-form-item>
</div>
<div v-show="!isPublicShow">
<el-form-item label="文件夹">
<el-select v-model="form.pId" clearable placeholder="请选择">
<el-option
v-for="item in folderOptions"
:key="item.fileId"
:value="item.fileId"
:label="item.fileName"/>
</el-select>
</el-form-item>
<el-form-item label="角色" prop="roleIds">
<el-select v-model="form.roleIds" clearable multiple placeholder="请选择">
<el-option
v-for="item in roleOptions"
:key="item.roleId"
:value="item.roleId"
:label="item.roleName"/>
</el-select>
</el-form-item>
</div>
<el-form-item label="文件类型">
<el-switch
v-model="fileType"
active-text="文件"
inactive-color="#1890ff"
inactive-text="图片" @change="fileTypeChange">
</el-switch>
</el-form-item>
<el-form-item label="图片上传" v-show="!fileType">
<ImageUpload v-model="staticUrl" v-on:change="changeAddress"/>
</el-form-item>
<el-form-item label="文件上传" v-show="fileType">
<FileUpload v-model="staticUrl" v-on:change="changeAddress"/>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {getRoleAll, getFolder, updateFile, addFile} from "@/api/system/file";
import {uploadFile} from '@/utils/fileUtils'
import ImageUpload from '@/components/ImageUpload'
import FileUpload from '@/components/FileUpload'
export default {
name: "download",
components: {
ImageUpload,
FileUpload
},
props: {
// value: {
// type: String,
// default: "",
// },
vData: {
type: Boolean,
default: true
},
vPublic: {
type: Boolean,
default: null
},
vId:{
type: String,
default:null
}
},
data() {
const checkRoleIds = (rule, value, callback) => {
if (this.form.isPublic === "2") {
if (value.length === 0) {
callback(new Error('角色不能为空'));
} else {
callback();
}
} else {
callback()
}
};
return {
form: {
pId: null,
roleIds: [],
isPublic: (this.vPublic === null) ? "1" : (this.vPublic === true) ? "1" : "2",
fileAddr: "",
uuid: this.vId,
},
staticUrl: "",
//
folderOptions: [],
//
roleOptions: [],
isPublicShow: (this.vPublic === null) ? true : this.vPublic,
fileType: false,
rules: {
roleIds: [
{required: true, validator: checkRoleIds, trigger: 'change'},
]
}
}
},
created() {
getRoleAll().then(res => {
this.roleOptions = res.data
})
getFolder().then(res => {
this.folderOptions = res.data
})
},
methods: {
/**
*是否公开值改变
*/
isPublicChange() {
this.isPublicShow = (this.form.isPublic === "1")
},
/**
* 文件类型改变
*/
fileTypeChange() {
this.form.fileAddr = ""
this.staticUrl = ""
},
/**
* 改变地址
*/
changeAddress(addr) {
this.form.fileAddr = addr
},
uploadFile() {
let flag = false
this.$refs["uploadFrom"].validate(valid => {
if (valid) {
let roleIds = ""
if (this.form.isPublic === "2") {
for (let i = 0; i < this.form.roleIds.length; i++) {
roleIds += this.form.roleIds[i]
if (i < this.form.roleIds.length - 1) {
roleIds += ","
}
}
}
this.form.roleIds = roleIds
if (this.vData) {
this.$emit("input", this.form)
flag = true
} else {
flag = uploadFile(this.form).then(res => {
this.$emit("input", res)
})
}
} else {
flag = false
}
})
return flag
}
}
}
</script>
<style scoped>
</style>

View File

@ -0,0 +1,39 @@
<template>
<div>
F:{{ value }}
<download ref="download" v-model="value" :v-data="true" :v-public="true"/>
<el-button @click="submitForm"> </el-button>
</div>
</template>
<script>
import download from './download'
export default {
name: "downloadtest",
components: {
download
},
data() {
return {
value: "",
url:"",
uri:"",
}
},
methods: {
submitForm() {
const start = this.$refs.download.uploadFile();
if (start) {
console.log(this.value)
}else {
console.log(start)
}
}
},
}
</script>
<style scoped>
</style>

View File

@ -1,241 +0,0 @@
<template>
<div>
<!-- 操作按钮 -->
<el-button @click="handleAdd">代码编辑高亮补全</el-button>
<el-button @click="handleUpdate">代码版本差异对比</el-button>
<!-- 代码编辑高亮补全 对话框内容 -->
<el-dialog :title="title" :visible.sync="open">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="脚本内容">
<div class="in-coder-panel">
<textarea ref="textarea"></textarea>
<el-select class="code-mode-select" v-model="mode" @change="changeMode">
<el-option v-for="mode in modes" :key="mode.value" :label="mode.label" :value="mode.value">
</el-option>
</el-select>
</div>
</el-form-item>
</el-form>
</el-dialog>
<!-- 代码版本差异对比 对话框内容 -->
<el-dialog :title="titleBBB" :visible.sync="openBBB">
<div id="view"></div>
</el-dialog>
</div>
</template>
<script>
//
import CodeMirror from 'codemirror'
//
import 'codemirror/lib/codemirror.css'
// options
import 'codemirror/theme/idea.css'
//
// codemirror /addon/mode/loadmode.js /mode/meta.js
// vue JS JS
import 'codemirror/mode/sql/sql.js'
//
import 'codemirror/addon/hint/show-hint.css';
import 'codemirror/addon/hint/show-hint.js';
import 'codemirror/addon/hint/sql-hint.js';
//
import 'codemirror/addon/merge/merge.js'
import 'codemirror/addon/merge/merge.css'
import DiffMatchPatch from 'diff-match-patch'
window.diff_match_patch = DiffMatchPatch
window.DIFF_DELETE = -1
window.DIFF_INSERT = 1
window.DIFF_EQUAL = 0
export default {
name: "Code",
props: {
//
value: String,
//
language: {
type: String,
default: null
}
},
data() {
return {
//
code: '#!/bin/bash\n' +
'cd /root/\n' +
'list=(`ls`)\n' +
' \n' +
'for i in ${list[@]}\n' +
'do\n' +
' if [ -d $i ]\n' +
' then\n' +
' cp -r $i /tmp/\n' +
' fi\n' +
'done',
//
mode: 'sql',
//
coder: null,
//
options: {
//
tabSize: 4,
// JS
theme: 'idea',
//
lineNumbers: true,
line: true,
extraKeys: {"Tab": "autocomplete"},
},
// JS
// 使 MIME-TYPE text/
modes: [{
value: 'css',
label: 'CSS'
}, {
value: 'javascript',
label: 'Javascript'
}, {
value: 'html',
label: 'XML/HTML'
}, {
value: 'x-sh',
label: 'Shell'
}, {
value: 'x-sql',
label: 'SQL'
}],
//
title: "",
titleBBB: "",
//
open: false,
openBBB: false,
}
},
created() {
this.handleAdd
},
methods: {
//
_initialize() {
//
this.coder = CodeMirror.fromTextArea(this.$refs.textarea, this.options)
//
this.coder.setValue(this.value || this.code)
//
this.coder.on('change', (coder) => {
this.code = coder.getValue()
if (this.$emit) {
this.$emit('input', this.code)
}
})
},
initUI(value, orig) {
if (value == null) return;
let target = document.getElementById("view");
target.innerHTML = "";
CodeMirror.MergeView(target, {
value: value,//
origLeft: null,
orig: orig,//
lineNumbers: true,//
mode: "shell",
highlightDifferences: true,
styleActiveLine: true,
matchBrackets: true,
connect: 'align',
readOnly: true,//
});
},
/** 按钮操作 */
handleAdd() {
this.open = true;
this.title = "代码编辑,高亮补全";
this.$nextTick(function () {
this._initialize();
});
},
/** 按钮操作 */
handleUpdate() {
this.openBBB = true;
this.titleBBB = "代码版本,差异对比";
//
this.$nextTick(function () {
this.initUI("#!/bin/bash\n" +
"ip=\"123.21.12.11\"\n" +
"email=\"lgx@example\"\n" +
" \n" +
"while 1\n" +
"do\n" +
" ping -c10 $ip > /dev/null 2>/dev/null\n" +
" if [ $? != \"0\" ]\n" +
" then\n" +
" # 调用一个用于发邮件的脚本\n" +
" python /usr/local/sbin/mail.py $email \"$ip down\" \"$ip is down\"\n" +
" fi\n" +
" sleep 30\n" +
"done", "#!/bin/bash\n" +
"ip=\"123.21.12.11\"\n" +
"email=\"admin@example\"\n" +
" \n" +
"while 1\n" +
"do\n" +
" ping -c10 $ip > /dev/null 2>/dev/null\n" +
" if [ $? != \"0\" ]\n" +
" then\n" +
" # 调用一个用于发邮件的脚本\n" +
" python /usr/local/sbin/mail.py $email \"$ip down\" \"$ip is down\"\n" +
" fi\n" +
"done")
});
},
}
};
</script>
<style lang="scss">
.in-coder-panel{
flex-grow :1;
display :flex;
position: relative;
}
.CodeMirror{
flex-grow :1;
z-index: 1
}
.CodeMirror-code{
line-height: 19px;
}
.code-mode-select {
position :absolute;
z-index: 2 ;
right: 10px;
top: 10px;
max-width: 130px;
}
</style>

View File

@ -76,12 +76,12 @@ public class FileController extends HcyBaseController {
}
@GetMapping("/folder")
public AjaxResult getFolder(){
public AjaxResult getFolder() {
try {
ServerResult<List<SysFile>> serverResult = fileService.selectFileFolder();
if (serverResult.isStart()){
if (serverResult.isStart()) {
return AjaxResult.success(serverResult.getData());
}else {
} else {
return AjaxResult.error(serverResult.getMsg());
}
} catch (RuntimeException e) {
@ -138,21 +138,25 @@ public class FileController extends HcyBaseController {
@PostMapping
public AjaxResult add(@RequestBody SysFile sysFile) {
try {
if (sysFile.getFileAddr() == null||sysFile.getFileAddr().equals("")){
if (sysFile.getFileAddr() == null || sysFile.getFileAddr().equals("")) {
return AjaxResult.error("上传文件不能为空!");
}
Map<String, String> modeMap = new HashMap<>();
ServerResult<SysFile> serverResult = fileService.insertFile(sysFile);
if (serverResult.isStart()) {
if (sysFile.getIsPublic().equals("1")) {
String fileUrl = FtpUtils.getResources() + sysFile.getFileAddr().substring(FtpUtils.getPubfiles().length()) + "/" + sysFile.getMapping();
modeMap.put("url", fileUrl);
if (sysFile.getIsPublic().equals("1") || sysFile.getIsPublic().equals("2")) {
Map<String, String> modeMap = new HashMap<>();
ServerResult<SysFile> serverResult = fileService.insertFile(sysFile);
if (serverResult.isStart()) {
if (sysFile.getIsPublic().equals("1")) {
String fileUrl = FtpUtils.getResources() + sysFile.getFileAddr().substring(FtpUtils.getPubfiles().length()) + "/" + sysFile.getMapping();
modeMap.put("url", fileUrl);
}
String fileUri = sysFile.getFileAddr() + "/" + sysFile.getMapping();
modeMap.put("uri", fileUri);
return AjaxResult.success(modeMap);
} else {
return AjaxResult.error(serverResult.getMsg());
}
String filrUri = sysFile.getFileAddr() + "/" + sysFile.getMapping();
modeMap.put("uri", filrUri);
return AjaxResult.success(modeMap);
} else {
return AjaxResult.error(serverResult.getMsg());
}else {
return AjaxResult.error("isPublic为空或者状态有误!");
}
} catch (RuntimeException e) {
logger.error(e.getMessage());
@ -208,7 +212,7 @@ public class FileController extends HcyBaseController {
public AjaxResult download(@PathVariable Long fileId, HttpServletRequest request, HttpServletResponse response) {
try {
LoginUser user = tokenService.getFileUser(request);
ServerResult<SysFile> serverResult = fileService.downloadFile(fileId,user);
ServerResult<SysFile> serverResult = fileService.downloadFile(fileId, user);
if (serverResult.isStart()) {
return AjaxResult.success(serverResult.getData().getFileName());
} else {
@ -219,8 +223,9 @@ public class FileController extends HcyBaseController {
return AjaxResult.error(ReturnConstants.SYS_ERROR);
}
}
@GetMapping("/download/api")
public AjaxResult api(){
public AjaxResult api() {
return AjaxResult.success("8085");
}
}

View File

@ -16,7 +16,6 @@
</description>
<dependencies>
<!--velocity代码生成使用模板 -->
<dependency>
<groupId>org.apache.velocity</groupId>

View File

@ -1,5 +1,5 @@
# 代码生成
gen:
gen:
# 作者
author: hchyun
# 默认生成包路径 system 需改成自己的模块名称 如 system monitor tool

View File

@ -74,12 +74,12 @@
</resultMap>
<sql id="selectInterTableVo">
select id, m_id, c_id, it_name, it_describe, is_permission, requrl, method, is_generate, type, create_time, create_by from sys_inter_table
select id, m_id, c_id, it_name, it_describe, is_permission, requrl, method, is_generate, type, create_time, create_by from gen_inter_table
</sql>
<select id="selectInterTableClass" resultMap="ApiclassResult" parameterType="Long">
select sa.*, sit.*, sm.*
from gen_apiclass sa
left join sys_inter_table sit on sit.c_id = sa.id
left join gen_inter_table sit on sit.c_id = sa.id
left join gen_module sm on sm.id = sa.m_id
where sa.id = #{id} and sit.type = 2
</select>
@ -87,7 +87,7 @@
<select id="selectInterTableModule" resultMap="InterTableResult" parameterType="Long">
SELECT (select m_name from gen_module sm WHERE sm.id=sit.m_id) AS m_name, sit.*,
sa.id as class_id, sa.m_id, sa.c_name, sa.c_describe, sa.package_name, sa.author, sa.email, sa.prefix, sa.remark, sa.create_time, sa.create_by, sa.update_time, sa.update_by
from sys_inter_table sit
from gen_inter_table sit
LEFT JOIN gen_apiclass sa ON sa.id = sit.c_id
WHERE sit.m_id=#{id} AND sit.type = 1;
</select>
@ -113,20 +113,20 @@
</select>
<insert id="insertInterTables" parameterType="java.util.List">
insert into sys_inter_table (m_id, c_id, it_name, it_describe, is_permission, requrl, method, is_generate, type, create_by) VALUES
insert into gen_inter_table (m_id, c_id, it_name, it_describe, is_permission, requrl, method, is_generate, type, create_by) VALUES
<foreach collection="list" item="item" index="index" separator=",">
(#{item.mId},#{item.cId},#{item.itName},#{item.itDescribe},#{item.isPermission},#{item.requrl},#{item.method},#{item.isGenerate},#{item.type},#{item.createBy})
</foreach>
</insert>
<delete id="deleteInterTableByClassId" parameterType="Long">
delete from sys_inter_table where c_id = #{cId} and type = 2
delete from gen_inter_table where c_id = #{cId} and type = 2
</delete>
<delete id="deleteInterTableByModuleId" parameterType="Long">
delete from sys_inter_table where c_id = #{cId} and type = 1
delete from gen_inter_table where c_id = #{cId} and type = 1
</delete>
<insert id="insertInterTable" parameterType="InterTable" useGeneratedKeys="true" keyProperty="id">
insert into sys_inter_table
insert into gen_inter_table
<trim prefix="(" suffix=")" suffixOverrides=",">
<if test="mId != null">m_id,</if>
<if test="cId != null">c_id,</if>
@ -154,7 +154,7 @@
</insert>
<update id="updateInterTable" parameterType="InterTable">
update sys_inter_table
update gen_inter_table
<trim prefix="SET" suffixOverrides=",">
<if test="mId != null">m_id = #{mId},</if>
<if test="cId != null">c_id = #{cId},</if>
@ -171,11 +171,11 @@
</update>
<delete id="deleteInterTableById" parameterType="Long">
delete from sys_inter_table where id = #{id}
delete from gen_inter_table where id = #{id}
</delete>
<delete id="deleteInterTableByIds" parameterType="String">
delete from sys_inter_table where id in
delete from gen_inter_table where id in
<foreach item="id" collection="array" open="(" separator="," close=")">
#{id}
</foreach>

View File

@ -96,14 +96,17 @@ public class FileServiceImpl implements FileService {
if (sysFile == null) {
return new ServerResult<>(false, "文件上传失败!");
}
if (sysFile.getpId() != null || sysFile.getpId() > 0) {
SysFile folder = fileDao.selectFileById(sysFile.getpId());
sysFile.setInherit(folder.getRoleIds());
if (sysFile.getpId() != null) {
if (sysFile.getpId() > 0) {
SysFile folder = fileDao.selectFileById(sysFile.getpId());
sysFile.setInherit(folder.getRoleIds());
}
}
sysFile.setCreateBy(SecurityUtils.getUserId());
try {
sysFile = FtpUtils.uploadFtp(sysFile);
} catch (RuntimeException e) {
logger.error(e.getMessage());
return new ServerResult<>(false, "文件处理出错,请重新上传文件!");
}
Integer renewal = fileDao.insertFile(sysFile);

View File

@ -172,6 +172,7 @@
<artifactId>hchyun-generator</artifactId>
<version>${hchyun.version}</version>
</dependency>
<!-- 测试模块-->
<dependency>
<groupId>com.hchyun</groupId>