From 29fa3a9ca4383fe8d9359df7d6c74bccc33c7a98 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=99=E8=BF=90=E6=A8=A1?= <1724894114@qq.com>
Date: Thu, 25 Jul 2024 19:54:58 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=96=87=E6=A1=A3=E4=B8=8A?=
 =?UTF-8?q?=E4=BC=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/icons/CreateFolder.vue    |  13 ++
 src/assets/icons/CreateShare.vue     |  13 ++
 src/assets/icons/index.js            |   2 +
 src/components/scTable/index.vue     |   1 -
 src/views/docsManager/document.vue   |  50 +++--
 src/views/docsManager/save.vue       |  37 ++--
 src/views/docsManager/uploadFile.vue | 267 +++++++++++++++++++++++++++
 7 files changed, 345 insertions(+), 38 deletions(-)
 create mode 100644 src/assets/icons/CreateFolder.vue
 create mode 100644 src/assets/icons/CreateShare.vue
 create mode 100644 src/views/docsManager/uploadFile.vue

diff --git a/src/assets/icons/CreateFolder.vue b/src/assets/icons/CreateFolder.vue
new file mode 100644
index 0000000..d198952
--- /dev/null
+++ b/src/assets/icons/CreateFolder.vue
@@ -0,0 +1,13 @@
+<template>
+	<svg t="1721826146674" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3601" width="200" height="200"><path d="M347.50000039 93.84999981c24.8500002 0 48.75000029 9.60000029 66.69999932 26.75000038l3.30000029 3.29999942 75.75000029 79.85000039c11.25 11.85000029 26.6000001 19.0000002 42.89999942 19.90000019l3.80000039 0.14999942h326.1999999a96.50000039 96.50000039 0 0 1 96.40000019 92.85000029l0.1000002 3.6500001v513.3499998a96.50000039 96.50000039 0 0 1-92.90000039 96.4500003H158.50000039A96.50000039 96.50000039 0 0 1 62 837.2999999L62 833.64999981V190.35000019A96.50000039 96.50000039 0 0 1 154.90000039 93.8999999L158.50000039 93.84999981h189z m-9.70000049 64.34999999H174.6000002a48.2500002 48.2500002 0 0 0-48.2500002 48.2500002V817.4999999a48.2500002 48.2500002 0 0 0 48.2500002 48.2500002H850.0000001a48.2500002 48.2500002 0 0 0 48.25000019-48.2500002V336.34999971a48.2500002 48.2500002 0 0 0-48.25000019-48.24999932H515.2500002a48.2500002 48.2500002 0 0 1-32.9000001-12.95000068l-111.6500001-104.0000001a48.2500002 48.2500002 0 0 0-32.9000001-12.9999999z m174.49999981 257.29999981a32.15000039 32.15000039 0 0 1 32.20000049 32.15000039v96.50000039h96.49999951a32.15000039 32.15000039 0 0 1 0 64.35H544.5000002v96.49999951a32.15000039 32.15000039 0 0 1-64.35 0v-96.49999951h-96.50000039a32.15000039 32.15000039 0 0 1 0-64.35h96.50000039v-96.50000039a32.15000039 32.15000039 0 0 1 32.14999951-32.15000039z" p-id="3602"></path></svg>
+</template>
+
+<script>
+export default {
+	name: "CreateFolder"
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/assets/icons/CreateShare.vue b/src/assets/icons/CreateShare.vue
new file mode 100644
index 0000000..64806ed
--- /dev/null
+++ b/src/assets/icons/CreateShare.vue
@@ -0,0 +1,13 @@
+<template>
+	<svg t="1721826224031" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3744" width="200" height="200"><path d="M347.50000039 93.84999981c24.8500002 0 48.75000029 9.60000029 66.69999932 26.75000038l3.30000029 3.29999942 75.75000029 79.85000039c11.25 11.85000029 26.6000001 19.0000002 42.89999942 19.90000019l3.80000039 0.14999942h326.1999999a96.50000039 96.50000039 0 0 1 96.40000019 92.85000029l0.1000002 3.6500001v513.3499998a96.50000039 96.50000039 0 0 1-92.90000039 96.4500003H158.50000039A96.50000039 96.50000039 0 0 1 62 837.2999999L62 833.64999981V190.35000019A96.50000039 96.50000039 0 0 1 154.90000039 93.8999999L158.50000039 93.84999981h189z m-9.70000049 64.34999999H174.6000002a48.2500002 48.2500002 0 0 0-48.2500002 48.2500002V817.4999999a48.2500002 48.2500002 0 0 0 48.2500002 48.2500002H850.0000001a48.2500002 48.2500002 0 0 0 48.25000019-48.2500002V336.34999971a48.2500002 48.2500002 0 0 0-48.25000019-48.24999932H515.2500002a48.2500002 48.2500002 0 0 1-32.9000001-12.95000068l-111.6500001-104.0000001a48.2500002 48.2500002 0 0 0-32.9000001-12.9999999z" p-id="3745"></path><path d="M622.04999961 393.9999998a51.00000029 51.00000029 0 0 1 0 102.00000059 51.00000029 51.00000029 0 0 1 0-102.00000059zM396.00000019 621.45000019a51.00000029 51.00000029 0 1 1 0.0500001-102.00000058 51.00000029 51.00000029 0 0 1-0.05000009 102.00000058z m226.04999942 5.85a51.00000029 51.00000029 0 0 1 0 101.99999971 51.05000039 51.05000039 0 0 1-36-87.00000029 51.00000029 51.00000029 0 0 1 36-14.99999942z m0-107.80000048a74.5999998 74.5999998 0 0 0 74.50000049-74.49999961 74.5999998 74.5999998 0 0 0-127.15000049-52.7000001 74.5999998 74.5999998 0 0 0-18.64999951 74.09999971l-104.65000049 49.10000009a74.09999971 74.09999971 0 0 0-102.74999941 2.3000001c-14.0000001 14.0000001-21.84999961 32.9000001-21.90000059 52.65a74.5999998 74.5999998 0 0 0 107.45000068 66.80000039c10.19999971-5.0000001 19.14999961-12.39999961 26.04999991-21.45000058l94.15000019 47.50000048a74.5999998 74.5999998 0 0 0 125.64999932 67.64999942 74.5999998 74.5999998 0 0 0 0-105.3 74.54999971 74.54999971 0 0 0-89.9499999-11.79999932 74.49999961 74.49999961 0 0 0-27.24999961 27.34999981l-91.35-46.0500003a74.00000039 74.00000039 0 0 0-5.0000001-60.6999999l99.8499999-46.8500001a74.45000039 74.45000039 0 0 0 60.99999961 31.89999991z" p-id="3746"></path></svg>
+</template>
+
+<script>
+export default {
+	name: "CreateShare"
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/assets/icons/index.js b/src/assets/icons/index.js
index 37aa674..4db50b4 100644
--- a/src/assets/icons/index.js
+++ b/src/assets/icons/index.js
@@ -28,6 +28,8 @@ export { default as AgentMaintenance } from './AgentMaintenance.vue'
 export { default as CostAllocation } from './CostAllocation.vue'
 export { default as DataSource } from './DataSource.vue'
 export { default as MachineRoom } from './MachineRoom.vue'
+export { default as CreateFolder } from './CreateFolder.vue'
+export { default as CreateShare } from './CreateShare.vue'
 export { default as Folder } from './Folder.vue'
 export { default as Pdf } from './Pdf.vue'
 export { default as Excel } from './Excel.vue'
diff --git a/src/components/scTable/index.vue b/src/components/scTable/index.vue
index 428d69f..cb54798 100644
--- a/src/components/scTable/index.vue
+++ b/src/components/scTable/index.vue
@@ -217,7 +217,6 @@
 								delete item.children
 							})
 							this.tableData = response.rows || [];
-							console.log('数据处理')
 						}else{
 							this.tableData = response.rows || [];
 						}
diff --git a/src/views/docsManager/document.vue b/src/views/docsManager/document.vue
index 6e77452..3cf06eb 100644
--- a/src/views/docsManager/document.vue
+++ b/src/views/docsManager/document.vue
@@ -14,7 +14,6 @@
 						<div class="breadcrumb">
 							<el-breadcrumb separator-icon="el-icon-ArrowRight">
 								<el-breadcrumb-item>我的文档</el-breadcrumb-item>
-<!--								<el-breadcrumb-item>固本</el-breadcrumb-item>-->
 <!--								<el-breadcrumb-item>中学</el-breadcrumb-item>-->
 							</el-breadcrumb>
 						</div>
@@ -27,19 +26,33 @@
 		</el-header>
 		<el-header>
 			<div class="left-panel">
-				<el-dropdown>
-					<el-button type="primary" :size="size">新建文档</el-button>
+				<el-dropdown placement="bottom-start">
+					<el-button type="primary" :size="size" style="margin-right: 12px;">新建文档 <el-icon class="el-icon--right"><el-icon-ArrowDown/></el-icon></el-button>
 					<template #dropdown>
 						<el-dropdown-menu>
-							<el-dropdown-item @click="table_show('see')" icon="sc-icon-See">查看详情</el-dropdown-item>
-							<el-dropdown-item @click="table_edit('edit')" icon="sc-icon-Edit">编辑公司</el-dropdown-item>
+							<el-dropdown-item @click="add" icon="sc-icon-CreateFolder">创建文件夹</el-dropdown-item>
+							<el-dropdown-item @click="table_edit('edit')" icon="sc-icon-CreateShare">创建共享文件夹</el-dropdown-item>
 						</el-dropdown-menu>
 					</template>
 				</el-dropdown>
-				<el-button type="primary" :size="size" icon="el-icon-plus" @click="add">新建文档</el-button>
-				<el-button type="primary" :size="size" plain @click="permission">上传</el-button>
-				<el-button type="primary" :size="size" plain @click="permission">操作</el-button>
-				<el-button type="danger" :size="size" plain icon="el-icon-delete" :disabled="selection.length==0" @click="batch_del"></el-button>
+				<el-dropdown placement="bottom-start">
+					<el-button type="primary" plain :size="size" style="margin-right: 12px;">上传 <el-icon class="el-icon--right"><el-icon-ArrowDown/></el-icon></el-button>
+					<template #dropdown>
+						<el-dropdown-menu>
+							<el-dropdown-item @click="uploadFile" icon="sc-icon-Upload">上传附件</el-dropdown-item>
+						</el-dropdown-menu>
+					</template>
+				</el-dropdown>
+				<el-dropdown placement="bottom-start">
+					<el-button type="primary" plain :size="size" style="margin-right: 12px;">操作 <el-icon class="el-icon--right"><el-icon-ArrowDown/></el-icon></el-button>
+					<template #dropdown>
+						<el-dropdown-menu>
+							<el-dropdown-item @click="table_show('see')" icon="sc-icon-Delete">删除</el-dropdown-item>
+							<el-dropdown-item @click="table_edit('edit')" icon="sc-icon-Edit">重命名</el-dropdown-item>
+						</el-dropdown-menu>
+					</template>
+				</el-dropdown>
+				<el-button type="primary" plain :size="size" icon="el-icon-sort" :disabled="selection.length==0" @click="batch_del"></el-button>
 			</div>
 			<div class="right-panel">
 
@@ -75,6 +88,8 @@
 		</el-main>
 	</el-container>
 
+	<uploadFile ref="uploadFile" @uploadFileSuccess="uploadFileSuccess" title="上传附件"></uploadFile>
+<!--	importFile-->
 	<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSaveSuccess" @closed="dialog.save=false"></save-dialog>
 	<!--	<permission-dialog v-if="dialog.permission" ref="permissionDialog" @closed="dialog.permission=false"></permission-dialog>-->
 
@@ -82,12 +97,14 @@
 
 <script>
 import saveDialog from './save'
+import uploadFile from './uploadFile'
 // import permissionDialog from './permission'
 
 export default {
 	name: 'document',
 	components: {
 		saveDialog,
+		uploadFile
 		// permissionDialog
 	},
 	data() {
@@ -129,6 +146,11 @@ export default {
 				this.$refs.saveDialog.open('show').setData(row)
 			})
 		},
+		uploadFile(){
+			this.$nextTick(()=>{
+				this.$refs.uploadFile.importFile();
+			})
+		},
 		//权限设置
 		permission(){
 			this.dialog.permission = true
@@ -173,12 +195,12 @@ export default {
 			}, 500)
 		},
 		//搜索
-		upsearch(){
+		upSearch(){
 
 		},
 		//根据ID获取树结构
 		filterTree(id){
-			var target = null;
+			let target = null;
 			function filter(tree){
 				tree.forEach(item => {
 					if(item.id == id){
@@ -199,7 +221,11 @@ export default {
 			}else if(mode=='edit'){
 				this.$refs.table.refresh()
 			}
-		}
+		},
+
+		uploadFileSuccess(){
+			this.$refs.table.refresh();
+		},
 	}
 }
 </script>
diff --git a/src/views/docsManager/save.vue b/src/views/docsManager/save.vue
index bd7ee74..4eda28a 100644
--- a/src/views/docsManager/save.vue
+++ b/src/views/docsManager/save.vue
@@ -1,14 +1,8 @@
 <template>
-	<el-dialog :title="titleMap[mode]" v-model="visible" :width="500" draggable destroy-on-close @closed="$emit('closed')">
-		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="right">
-			<el-form-item label="角色名称" prop="role_name">
-				<el-input v-model="form.role_name" placeholder="请填写角色名称" clearable></el-input>
-			</el-form-item>
-			<el-form-item label="状态" prop="active_status">
-				<el-switch v-model="form.active_status" :active-value="true" :inactive-value="false"></el-switch>
-			</el-form-item>
-			<el-form-item label="备注" prop="remark">
-				<el-input v-model="form.remark" clearable type="textarea"></el-input>
+	<el-dialog :title="titleMap[mode]" v-model="visible" :width="460" draggable destroy-on-close @closed="$emit('closed')">
+		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="top">
+			<el-form-item label="请输入文件夹名称" prop="name">
+				<el-input v-model="form.name" placeholder="请输入文件夹名称" clearable></el-input>
 			</el-form-item>
 		</el-form>
 		<template #footer>
@@ -25,7 +19,7 @@ export default {
 		return {
 			mode: "add",
 			titleMap: {
-				add: '新增',
+				add: '新建文件夹',
 				edit: '编辑',
 				show: '查看'
 			},
@@ -33,19 +27,14 @@ export default {
 			isSave: false,
 			//表单数据
 			form: {
-				id:"",
-				role_name: "",
-				active_status: true,
-				remark: ""
+				parent_id:"",
+				name: "",
 			},
 			//验证规则
 			rules: {
-				role_name: [
-					{required: true, message: '请输入角色名称'}
+				name: [
+					{required: true, message: '请输入文件夹名称'}
 				],
-				active_status: [
-					{required: true,}
-				]
 			}
 		}
 	},
@@ -64,7 +53,7 @@ export default {
 			this.$refs.dialogForm.validate(async (valid) => {
 				if (valid) {
 					this.isSave = true;
-					const res = await this.$API.system.role.add.post(this.form);
+					const res = await this.$API.docs.manager.add.post(this.form);
 					this.isSave = false;
 					if(res.code == 200){
 						this.$emit('success', this.form, this.mode)
@@ -76,10 +65,8 @@ export default {
 		},
 		//表单注入数据
 		setData(data){
-			this.form.id = data.id
-			this.form.role_name = data.role_name
-			this.form.active_status = data.active_status
-			this.form.remark = data.remark
+			this.form.parent_id = data.id
+			this.form.name = data.name
 		}
 	}
 }
diff --git a/src/views/docsManager/uploadFile.vue b/src/views/docsManager/uploadFile.vue
new file mode 100644
index 0000000..ce97bb1
--- /dev/null
+++ b/src/views/docsManager/uploadFile.vue
@@ -0,0 +1,267 @@
+<template>
+	<slot name="header"></slot>
+
+	<el-dialog v-bind="$attrs" :title="title" v-model="visible" :width="560" destroy-on-close draggable @closed="visible=false">
+		<div class="importBody">
+			<el-upload
+				class="upload"
+				:action="oss.host"
+				:data="upload_data"
+				:show-file-list="false"
+				:on-success="handleSuccess"
+				:on-error="handleError"
+				:before-upload="beforeUpload"
+				:http-request="uploadFile"
+				drag
+				multiple
+				:limit="5"
+				:disabled="importDis"
+			>
+				<div v-if="!importTrue">
+					<el-icon class="el-icon--upload"><sc-icon-UploadExcel /></el-icon>
+					<div class="el-upload__text">
+						<span class="laText">请将Excel拖到此处</span>
+						<span class="tipText">，或点击上传</span><em> Excel</em>
+					</div>
+				</div>
+				<div v-else>
+					<div class="el-upload__text">
+						<el-icon class="trueIcon el-icon&#45;&#45;upload">
+							<sc-icon-FormXls />
+<!--							<div class="deleteFile" @click="deleteFile"><el-icon class="icon"><el-icon-Close/></el-icon></div>-->
+						</el-icon>
+						<div class="el-upload__text">文件已选择最大，可以点击立即上传或替换文件。</div>
+					</div>
+				</div>
+
+				<template #tip>
+					<div class="el-upload__tip">
+						<span class="tip">最多上传5个文件,单个文件不要超过10M,请上传 xlsx/docx 格式文件</span>
+						<span class="btn">
+							<slot name="download"></slot>
+						</span>
+					</div>
+					<div class="importBox" v-if="progressShow">
+						<div class="item" v-for="item in listProgress" :key="item">
+							<div class="name">{{item.type_desc}}</div>
+							<el-progress class="exportPopover" :text-inside="true" :stroke-width="12" :percentage="item.rate" />
+						</div>
+					</div>
+				</template>
+			</el-upload>
+		</div>
+		<template #footer>
+			<el-button @click="visible=false">取 消</el-button>
+			<el-button type="primary" @click="save">确 定</el-button>
+		</template>
+	</el-dialog>
+</template>
+
+<script>
+import {eventBus} from "@/utils/eventBus"
+
+export default {
+	name: "uploadFile",
+	emits: ['closed', "uploadFileSuccess"],
+	props:{
+		size:{type:String, default:'small'},
+		title:{type:String, default: ""},
+	},
+	data(){
+		return{
+			visible: false,
+			text:"",
+			listFile:[],
+			listProgress:[],
+
+			oss:{
+				host:''
+			},
+			upload_data:{},
+			fileShow:false,
+			params:{},
+
+			importDis:false,
+			importTrue:false,
+			progressShow:false,
+		}
+	},
+	setup(){
+
+	},
+	watch:{
+
+	},
+	mounted() {
+		eventBus.$on('sockBack', this.getWsResult);
+	},
+	unmounted() {
+		eventBus.$off('sockBack', this.getWsResult);
+	},
+	methods:{
+		getWsResult(res){
+			if(res.data && (res.data.type == 12)){
+				let flag = this.listProgress.some(em=>em.file_unique_id == res.data.file_unique_id);
+				if(!flag){
+					this.listProgress.push(res.data)
+				}else{
+					this.listProgress.forEach((em,index)=>{
+						if(em.file_unique_id == res.data.file_unique_id){
+							em.rate = res.data.rate
+							if(res.data.status == 1){
+								this.listProgress.splice(index,1);
+							}
+						}
+					})
+				}
+				this.progressShow = true;
+				if(this.listProgress.length==0 && res.data.status == 1){
+					this.progressShow = false;
+				}
+				if(res.data.status == 1){
+					this.$emit('uploadFileSuccess');
+				}
+			}
+		},
+
+		// 导入文件
+		importFile(){
+			this.visible = true;
+		},
+		// 上传前
+		beforeUpload(file){
+			// const text = file.name.split('.').pop();
+			// if(!['xls','xlsx'].includes(text)){
+			// 	this.$message.warning(`只能选择的excel文件类型`);
+			// 	return false;
+			// }
+			// this.progressShow = true;
+			this.text = file.name;
+			this.listFile.push(file);
+			return  true
+		},
+		async uploadFile() {
+			try {
+				const formData = new FormData();
+				for(let i in this.listFile){
+					formData.append('files[]', this.listFile[i]);
+				}
+				for (const key in this.upload_data) {
+					formData.append(key, this.upload_data[key]);
+				}
+				this.params = formData;
+				this.importTrue = this.listFile.length>4?true:false;
+				this.importDis = this.listFile.length>4?true:false;
+			} catch (error) {
+				console.log(error)
+			}
+		},
+		deleteFile(){
+			this.importTrue = false;
+			setTimeout(()=>{
+				this.importDis = false;
+			},100)
+		},
+		async save() {
+			const res = await this.$API.docs.manager.upload.post(this.params);
+			if (res.code == 200) {
+				this.$message.success('提交成功,正在上传');
+			}
+		},
+		// 上传成功
+		handleSuccess(){
+
+		},
+		// 上传失败
+		handleError(){
+			this.$message.warning('上传失败请重新上传');
+		}
+	}
+}
+</script>
+
+<style scoped lang="scss">
+.importBody{
+	padding: 0 20px;
+}
+.upload .el-icon--upload{
+	width: 54px;height: 54px;
+}
+.upload ::v-deep .el-upload__text{
+	.trueIcon{
+		position: relative;
+		border: 1px solid var(--el-border-color);
+		border-radius: 4px;
+	}
+	.laText{
+		color: var(--el-color-dark);
+	}
+	.tipText{
+		color: var(--el-text-color-placeholder);
+	}
+	.deleteFile{
+		position: absolute;
+		right: -6px;
+		top: -10px;
+		width: 16px;
+		height: 16px;
+		border-radius: 50%;
+		background: var(--el-color-danger);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.icon{
+			width: 12px;height: 12px;
+			color: var(--el-color-white);
+		}
+
+	}
+}
+.upload ::v-deep .el-upload__tip{
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	margin-top: 15px;
+	color: var(--el-text-color-placeholder);
+	.btn{
+		color: var(--el-color-primary);
+		cursor: pointer;
+	}
+}
+.importBox{
+	border: 1px solid var(--el-border-color);
+	padding: 10px 5px;
+	margin: 15px 0;
+	border-radius: 4px;
+	.item{margin-bottom: 10px;}
+	.item:last-child{margin-bottom: 0;}
+	.name{margin-bottom: 5px;font-size: 13px;}
+	.exportPopover ::v-deep .el-progress-bar__innerText{
+		height: 100%;
+		display: flex;align-items: center;justify-content: flex-end;
+		font-size: 10px;
+	}
+}
+.errText{
+	margin: 15px 0 0 0;
+	padding: 10px;
+	border-radius: 6px;
+	background: var(--el-color-danger-light-9);
+	position: relative;
+	.name{
+		color: var(--el-color-danger);
+		font-size: 12px;
+		line-height: 20px;
+	}
+	.deleteErr{
+		position: absolute;
+		right: 4px;
+		top: 4px;
+		z-index: 20;
+		cursor: pointer;
+		.icon{
+			font-size: 16px;
+		}
+	}
+}
+</style>