<template>
|
<basic-container>
|
<avue-crud ref="crud"
|
v-model="form"
|
:before-open="beforeOpen"
|
:data="data"
|
:option="option"
|
:page.sync="page"
|
:permission="permissionList"
|
:table-loading="loading"
|
@row-del="rowDel"
|
@search-change="searchChange"
|
@search-reset="searchReset"
|
@selection-change="selectionChange"
|
@row-click="selectedRowClick"
|
@current-change="currentChange"
|
@size-change="sizeChange"
|
@refresh-change="refreshChange"
|
@on-load="onLoad">
|
<template slot="menuLeft">
|
<el-button v-if="hasUpload" icon="el-icon-upload2"
|
plain
|
size="small"
|
type="primary"
|
@click="handleUpload">上 传
|
</el-button>
|
<el-button v-if="hasEdit" icon="el-icon-edit"
|
plain
|
size="small"
|
type="primary"
|
@click="handleEdit">修 改
|
</el-button>
|
<el-button v-if="hasDownload" icon="el-icon-download"
|
plain
|
size="small"
|
type="primary"
|
@click="handleDownload">下 载
|
</el-button>
|
<el-button v-if="hasDel" icon="el-icon-delete"
|
plain
|
size="small"
|
type="danger"
|
@click="handleDelete">删 除
|
</el-button>
|
</template>
|
<template slot="menu" slot-scope="scope">
|
<el-button v-if="hasDownload" icon="el-icon-download"
|
size="small"
|
type="text"
|
@click="handleDownload(scope.row)">下载
|
</el-button>
|
</template>
|
</avue-crud>
|
<el-dialog :visible.sync="attachBox"
|
append-to-body
|
title="附件管理"
|
width="555px">
|
<avue-form ref="form" v-model="attachForm" :option="attachOption" :upload-after="uploadAfter"
|
:upload-before="uploadBefore" :upload-error="uploadError">
|
</avue-form>
|
</el-dialog>
|
</basic-container>
|
</template>
|
|
<script>
|
import {getList, getFile, upload, update, remove, download} from "@/api/resource/file";
|
import {mapGetters} from "vuex";
|
import {validatenull} from "@/util/validate";
|
import func from "@/util/func";
|
|
export default {
|
props: ["options", "visible", "ownbizOid"],
|
data() {
|
return {
|
form: {},
|
query: {},
|
params: {},
|
loading: false,
|
hasPage: this.options.hasPage || false,
|
page: {
|
pageSize: 10,
|
currentPage: 1,
|
total: 0
|
},
|
attachBox: false,
|
selectionList: [],
|
//默认为null全部是true
|
hasUpload: validatenull(this.options.hasUpload) ? true : this.options.hasUpload,
|
hasEdit: validatenull(this.options.hasEdit) ? true : this.options.hasEdit,
|
hasDel: validatenull(this.options.hasDel) ? true : this.options.hasDel,
|
hasDownload: validatenull(this.options.hasDownload) ? true : this.options.hasDownload,
|
option: {
|
height: (this.options.tableHeight ? this.options.tableHeight : '300'),
|
calcHeight: 30,
|
tip: false,
|
searchShow: false,
|
searchMenuSpan: 6,
|
border: true,
|
index: true,
|
viewBtn: true,
|
refreshBtn: false,
|
selection: true,
|
dialogClickModal: false,
|
column: [
|
{
|
label: "文件名称",
|
prop: "name",
|
search: true,
|
/*formatter:function(d){
|
if(this.options.hasDownloadRight != false){
|
//说明有下载文件的权限，那么我们就添加一个超链接
|
return ''//'<a name="filenamedownloadlink " class="layui-btn layui-btn-intable" lay-event="PREVIEW" fileoid="' + d.oid +'">' + (d.id?d.id:d.name) + '</a>';
|
}else{
|
return d.id || d.name;
|
}
|
}*/
|
},
|
{
|
label: "文件大小",
|
prop: "fileSize",
|
formatter: function (d) {
|
if (!d.fileSize || d.fileSize == null || d.fileSize * 1 == 0 || isNaN(d.fileSize * 1)) {
|
return "未知大小";
|
} else {
|
//原始大小是B
|
var filesize = d.fileSize * 1;
|
if (filesize > 1024 * 1024 * 1024 * 1024) {
|
return parseInt(filesize / (1024 * 1024 * 1024 * 1024)) + "TB";
|
} else if (filesize > 1024 * 1024 * 1024) {
|
return parseInt(filesize / (1024 * 1024 * 1024)) + "GB";
|
} else if (filesize > 1024 * 1024) {
|
return parseInt(filesize / (1024 * 1024)) + "MB";
|
} else if (filesize > 1024) {
|
return parseInt(filesize / 1024) + "KB";
|
} else {
|
return filesize + "B";
|
}
|
}
|
}
|
},
|
{
|
label: "创建者",
|
prop: "creator"
|
},
|
{
|
label: "创建时间",
|
prop: "createTime"
|
},
|
]
|
},
|
columnType: {
|
text: "input",
|
combox: "select",
|
truefalse: "switch",
|
number: "number",
|
textarea: "textarea",
|
datetime: "datetime",
|
date: "date",
|
refer: "refer",
|
},
|
data: [],
|
attachForm: {},
|
attachOption: {
|
submitBtn: false,
|
emptyBtn: false,
|
column: [{
|
prop: 'fileDocClassify',
|
label: '文件类型',
|
props: {
|
label: 'value',
|
value: 'key'
|
},
|
change: () => {
|
(!!this.options.fileDocClassifyCombox) && this.changeFun('fileDocClassify');
|
},
|
blur: () => {
|
(!this.options.fileDocClassifyCombox) && this.changeFun('fileDocClassify');
|
},
|
value: this.options.fileDocClassify || "ADMIN_SHARE",
|
type: (!this.options.fileDocClassifyCombox) ? 'input' : 'select',
|
dicData: (this.options.fileDocClassifyCombox || []),//[{key: 'text', value: '文本框'}]
|
display: (!!this.options.fileDocClassifyCombox)
|
}, {
|
label: '附件上传',
|
prop: 'attachFile',
|
type: 'upload',
|
dragFile: true,
|
showFileList: false,
|
accept: this.options.uploadAccept || 'file',
|
loadText: '文件上传中，请稍等',
|
span: 24,
|
propsHttp: {
|
res: 'data'
|
},
|
data: {
|
ownbizOid: this.options.ownbizOid || "share",
|
ownBtmName: this.options.ownbizBtm || "share",
|
fileDocClassify: this.options.fileDocClassify || "ADMIN_SHARE",
|
fileDocClassifyName: this.options.fileDocClassifyName || "管理员共享文件"
|
},
|
action: "/api/ubcs-resource/fileController/uploadFile"
|
}
|
]
|
}
|
};
|
},
|
computed: {
|
...mapGetters(["permission"]),
|
permissionList() {
|
return {
|
addBtn: false,
|
viewBtn: false,
|
delBtn: this.vaildData(this.permission.attach_delete, false),
|
editBtn: false
|
};
|
},
|
oids() {
|
let oids = [];
|
this.selectionList.forEach(ele => {
|
oids.push(ele.oid);
|
});
|
return oids.join(",");
|
}
|
},
|
created() {
|
this.setFormItem();
|
this.setParams()
|
},
|
mounted() {
|
|
},
|
watch: {
|
ownbizOid(val) {
|
this.setParams()
|
this.refreshChange()
|
},
|
},
|
methods: {
|
setFormItem() {
|
/*this.options.formItems=[{
|
field: 'fileDocClassify11',
|
title: '文件类型',
|
type: 'combox',
|
data: [{key: 'text', value: '文本框'},{key: 'number', value: '数字框'}]
|
}]*/
|
if (this.options && this.options.formItems) {
|
this.options.formItems.forEach(item => {
|
// 设置表单校验的规则，文本
|
let message = "请选择";
|
let trigger = "change";
|
if (item.type === "text") {
|
message = "请输入";
|
trigger = "blur";
|
}
|
this.attachOption.column.push({
|
...item,
|
label: item.title,
|
prop: item.field,
|
display: !item.hidden,
|
value: item.defaultValue,
|
disabled: item.readOnly,
|
type: this.columnType[item.type],
|
dicData: this.getDataList(item.type, item.data),
|
change: () => {
|
if (item.type !== "text" && item.type !== "number" && item.type !== "textarea") {
|
this.changeFun(item.field);
|
}
|
},
|
blur: () => {
|
if (item.type == "text" || item.type == "number" || item.type == "textarea") {
|
this.changeFun(item.field);
|
}
|
},
|
rules: [
|
{
|
required: item.required,
|
message: `请${message}${item.title}`,
|
trigger,
|
},
|
{
|
// 如果没有正则则匹配任何字符
|
pattern: item.verify ? item.verify : /[\s\S.]*/g,
|
message: item.tooltips,
|
trigger,
|
},
|
],
|
props: {
|
label: 'value',
|
value: 'key'
|
}
|
})
|
})
|
}
|
},
|
changeFun(prop) {
|
this.attachOption.column[1].data[prop] = this.attachForm[prop]
|
},
|
getDataList(type, dicData) {
|
if (type === "truefalse") {
|
return [
|
{
|
key: false,
|
value: "否",
|
},
|
{
|
key: true,
|
value: "是",
|
},
|
];
|
} else if (type === "combox") {
|
return dicData;
|
}
|
return [];
|
},
|
setParams() {
|
var queryMap = {
|
currentButtonKey: 'VIEW',
|
ownbizOid: this.options.ownbizOid || "share",
|
ownBtmName: this.options.ownbizBtm || "share",
|
fileDocClassify: this.options.fileDocClassify || "ADMIN_SHARE",
|
fileDocClassifyName: this.options.fileDocClassifyName || "管理员共享文件"
|
};
|
if (this.options.where) {
|
Object.assign(queryMap, this.options.where);
|
}
|
this.params = queryMap;
|
|
if (!this.options.pageObject) {
|
this.options.pageObject = {
|
limit: 10,
|
page: 1
|
};
|
}
|
this.page.pageSize = this.options.pageObject.limit;
|
this.page.currentPage = this.options.pageObject.page;
|
|
this.attachOption.column[1].data.ownbizOid = this.options.ownbizOid || "share";
|
this.attachOption.column[1].data.ownBtmName = this.options.ownbizBtm || "share";
|
this.attachOption.column[1].data.fileDocClassify = this.options.fileDocClassify || "ADMIN_SHARE";
|
this.attachOption.column[1].data.fileDocClassifyName = this.options.fileDocClassifyName || "管理员共享文件"
|
|
},
|
handleUpload() {
|
this.attachOption.column[1].data.fileOid = '';
|
delete this.attachOption.column[1].data.oid;
|
delete this.attachOption.column[1].data.updateFileFlag;
|
this.attachBox = true;
|
},
|
handleEdit() {
|
if (this.selectionList.length == 0) {
|
this.$message.warning('请选择需要修改的文件')
|
return false;
|
} else if (this.selectionList.length > 1) {
|
this.$message.warning('请选择一条数据')
|
return false;
|
}
|
this.attachOption.column[1].data.fileOid = this.oids;
|
this.attachOption.column[1].data.oid = this.oids;
|
this.attachOption.column[1].data.updateFileFlag = true
|
this.attachBox = true;
|
},
|
uploadBefore(file, done, loading, column) {
|
done();
|
},
|
uploadAfter(res, done, loading, column) {
|
this.attachBox = false;
|
this.$message.success('文件上传成功')
|
this.refreshChange();
|
done();
|
},
|
uploadError(error, column) {
|
this.$message.error(error || '上传文件出现了异常')
|
},
|
handleDownload(row) {
|
//window.open(`${row.link}`);
|
let data = new FormData();
|
if (row && row.oid) {
|
data.append('fileOids', row.oid)
|
this.downloadFile(data);
|
} else {
|
if (this.selectionList.length === 0) {
|
this.$message.warning("请选择至少一条数据");
|
return;
|
}
|
data.append('fileOids', this.oids)
|
this.downloadFile(data);
|
}
|
},
|
downloadFile(data) {
|
download(data).then(res => {
|
console.log(res);
|
if (res) {
|
func.downloadFileByBlobHandler(res);
|
}
|
});
|
},
|
rowDel(row) {
|
this.$confirm("确定将选择文件删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove([row.oid]);
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
});
|
},
|
handleDelete() {
|
if (this.selectionList.length === 0) {
|
this.$message.warning("请选择至少一条数据");
|
return;
|
}
|
this.$confirm("确定将选择数据删除?", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
})
|
.then(() => {
|
return remove(this.oids.split(','));
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: "success",
|
message: "操作成功!"
|
});
|
this.$refs.crud.toggleSelection();
|
});
|
},
|
beforeOpen(done, type) {
|
if (["edit", "view"].includes(type)) {
|
getDetail(this.form.id).then(res => {
|
this.form = res.data.data;
|
});
|
}
|
done();
|
},
|
searchReset() {
|
this.query = {};
|
this.onLoad(this.page);
|
},
|
searchChange(params, done) {
|
this.query = params;
|
this.page.currentPage = 1;
|
this.onLoad(this.page);
|
done();
|
},
|
selectionChange(list) {
|
this.selectionList = list;
|
this.$refs.crud.setCurrentRow(this.selectionList[list.length - 1]);
|
},
|
selectedRowClick(row) {
|
this.selectionList = row;
|
this.$refs.crud.toggleSelection();
|
this.$refs.crud.setCurrentRow(row);
|
this.$refs.crud.toggleRowSelection(row); //选中当前行
|
},
|
selectionClear() {
|
this.selectionList = [];
|
this.$refs.crud.toggleSelection();
|
},
|
currentChange(currentPage) {
|
this.page.currentPage = currentPage;
|
},
|
sizeChange(pageSize) {
|
this.page.pageSize = pageSize;
|
},
|
refreshChange() {
|
this.onLoad(this.page);
|
},
|
onLoad(page, params = {}) {
|
this.loading = true;
|
var query = {}
|
if (this.query) {
|
for (var key in this.query) {
|
query['conditionMap["' + key + '"]'] = this.query[key];
|
}
|
}
|
getList(page.currentPage, page.pageSize, Object.assign(params, this.params, query, this.query)).then(res => {
|
const data = res.data.data;
|
this.page.total = data.total;
|
if (this.options.fileDocClassifyCombox) {
|
this.data = data.records.map(item => {
|
if (validatenull(item.fileDocClassifyName) && !validatenull(item.fileDocClassify)) {
|
item.fileDocClassifyName = this.options.fileDocClassifyCombox[item.fileDocClassify] || '';
|
}
|
return {
|
...item
|
}
|
})
|
} else {
|
this.data = data.records;
|
}
|
|
this.loading = false;
|
this.selectionClear();
|
}).catch(error => {
|
this.$message.error(error);
|
this.loading = false;
|
});
|
}
|
}
|
};
|
</script>
|
|
<style>
|
</style>
|
