删除旧的代码
qianlishi
3 years ago
parent
2e24a4a4a7
commit
2175ca7b3a
@ -1,99 +0,0 @@
|
|||||||
<!--
|
|
||||||
* @Author: lide1202@hotmail.com
|
|
||||||
* @Date: 2021-5-4 11:04:24
|
|
||||||
* @Last Modified by: lide1202@hotmail.com
|
|
||||||
* @Last Modified time: 2021-5-5 11:04:24
|
|
||||||
!-->
|
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<el-input class="filterInput" placeholder="搜索" v-model="filterText" v-if="enableFilter" />
|
|
||||||
<div class="title">{{ labelName }}</div>
|
|
||||||
<el-tree ref="table_tree" :data="treeData" node-key="id" :default-expand-all="isOpen" :expand-on-click-node="false" :filter-node-method="filterNode" @node-click="nodeClick" @check="checkedEvent" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import request from '@/utils/request'
|
|
||||||
export default {
|
|
||||||
components: {},
|
|
||||||
props: {
|
|
||||||
url: {
|
|
||||||
type: [String],
|
|
||||||
default: () => {
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
id: {
|
|
||||||
type: [String],
|
|
||||||
default: () => {
|
|
||||||
return 'id'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
label: {
|
|
||||||
type: [String],
|
|
||||||
default: () => {
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
value: {
|
|
||||||
type: [String],
|
|
||||||
default: () => {
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
labelName: String,
|
|
||||||
enableFilter: Boolean,
|
|
||||||
isOpen: Boolean,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
filterText: '',
|
|
||||||
treeData: [],
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {},
|
|
||||||
watch: {
|
|
||||||
filterText(val) {
|
|
||||||
this.$refs.table_tree.filter(val)
|
|
||||||
},
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.queryData()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
filterNode(val, data) {
|
|
||||||
if (!val) return true
|
|
||||||
return data.label.indexOf(val) !== -1
|
|
||||||
},
|
|
||||||
queryData() {
|
|
||||||
if (this.isBlank(this.url)) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
request({
|
|
||||||
url: this.url,
|
|
||||||
method: 'GET',
|
|
||||||
}).then((response) => {
|
|
||||||
if (response.code != '200') {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
this.treeData = Object.prototype.toString.call(response.data) == '[object Array]' ? response.data : response.data.tree|| response.data.menuTree
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 点击tree节点时 将tree的id作为上级机构代码 查询列表
|
|
||||||
nodeClick(node) {
|
|
||||||
this.$emit('input', node['id'])
|
|
||||||
this.$emit('node-click', node['id'])
|
|
||||||
},
|
|
||||||
checkedEvent(item, evt) {
|
|
||||||
var ids = evt.checkedKeys.toString()
|
|
||||||
this.$emit('input', ids)
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.filterInput {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,161 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="uploadImage">
|
|
||||||
<el-upload
|
|
||||||
:headers="headers"
|
|
||||||
:limit="limit"
|
|
||||||
:action="requestUrl"
|
|
||||||
list-type="picture-card"
|
|
||||||
:file-list="fileList"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
:on-remove="handleRemove"
|
|
||||||
:on-success="handleSuccess"
|
|
||||||
:show-file-list="true"
|
|
||||||
:before-upload="handleBeforeUpload"
|
|
||||||
:class="fileList && fileList.length >= limit ? 'hide_box' : ''"
|
|
||||||
>
|
|
||||||
<i class="el-icon-plus" />
|
|
||||||
</el-upload>
|
|
||||||
<el-dialog :visible.sync="dialogVisibleImageUpload" :modal="false">
|
|
||||||
<img width="100%" :src="imageUploadUrl" alt="" />
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import { getToken } from "@/utils/auth"; // get token from cookie
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
upLoadUrl: {
|
|
||||||
type: String,
|
|
||||||
default: () => {
|
|
||||||
return "";
|
|
||||||
}
|
|
||||||
},
|
|
||||||
viewUrl: {
|
|
||||||
type: String,
|
|
||||||
default: () => {
|
|
||||||
return process.env.BASE_API + "/file/download/";
|
|
||||||
}
|
|
||||||
},
|
|
||||||
limit: {
|
|
||||||
type: Number,
|
|
||||||
default: () => {
|
|
||||||
return 1;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
value: {
|
|
||||||
type: String,
|
|
||||||
default: () => {
|
|
||||||
return "";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
imageUploadUrl: "",
|
|
||||||
dialogVisibleImageUpload: false,
|
|
||||||
fileList: []
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
requestUrl() {
|
|
||||||
if (this.upLoadUrl != null && this.upLoadUrl.trim() != "") {
|
|
||||||
return process.env.BASE_API + this.upLoadUrl;
|
|
||||||
} else {
|
|
||||||
return process.env.BASE_API + "/file/upload";
|
|
||||||
}
|
|
||||||
},
|
|
||||||
headers() {
|
|
||||||
return {
|
|
||||||
Authorization: getToken() // 直接从本地获取token就行
|
|
||||||
};
|
|
||||||
}
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
value: {
|
|
||||||
handler(val) {
|
|
||||||
this.echoUpload(this.value);
|
|
||||||
},
|
|
||||||
immediate: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.echoUpload(this.value);
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
handleRemove(file) {
|
|
||||||
this.fileList = [];
|
|
||||||
this.change();
|
|
||||||
},
|
|
||||||
handlePictureCardPreview(file) {
|
|
||||||
this.imageUploadUrl = file.url;
|
|
||||||
this.dialogVisibleImageUpload = true;
|
|
||||||
},
|
|
||||||
// 上传成功的回调
|
|
||||||
handleSuccess(response, file, fileList) {
|
|
||||||
if (response.code != 200) {
|
|
||||||
this.$message.error("上传失败");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.fileList.push({
|
|
||||||
url: file.response.data.urlPath
|
|
||||||
});
|
|
||||||
this.change();
|
|
||||||
},
|
|
||||||
// 回传出去
|
|
||||||
change() {
|
|
||||||
const fileList = (this.fileList.length > 0 && this.fileList[0].url) || "";
|
|
||||||
this.$emit("input", fileList);
|
|
||||||
this.$emit("change", fileList);
|
|
||||||
},
|
|
||||||
// 上传检验
|
|
||||||
handleBeforeUpload(file) {
|
|
||||||
const extension = file.name
|
|
||||||
.split(".")
|
|
||||||
[file.name.split(".").length - 1].toLowerCase();
|
|
||||||
// .png|.jpg|.gif|.icon|.pdf|.xlsx|.xls|.csv|.mp4|.avi
|
|
||||||
const extensionList = ["png", "jpg", "gif", "icon"];
|
|
||||||
if (extensionList.indexOf(extension) < 0) {
|
|
||||||
this.$message.warning("请上传正确的格式文件");
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
// 回显
|
|
||||||
echoUpload(val) {
|
|
||||||
if (!val) {
|
|
||||||
this.fileList = [];
|
|
||||||
} else {
|
|
||||||
const list = [{ url: val }];
|
|
||||||
this.fileList = list;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.uploadImage .el-upload--picture-card {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
line-height: 65px;
|
|
||||||
}
|
|
||||||
.uploadImage .el-upload-list__item {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
}
|
|
||||||
.hide_box /deep/ .el-upload--picture-card {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.el-upload-list__item {
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
.el-upload-list--picture-card .el-upload-list__item-actions {
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
.imgBox,
|
|
||||||
.iconFont {
|
|
||||||
width: 100% !important;
|
|
||||||
height: 100% !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in New Issue