修改导出封装组件

src/components/scExport/index.vue

@@ -4,19 +4,24 @@
 		title=""
 		trigger="click"
 		content=""
-		width="280"
-		:visible="exportVisible"
+		width="300"
+		v-bind="$attrs"
+		:visible="show"
 	>
 		<template #reference>
-			<el-button v-bind="$attrs" :size="size" icon="sc-icon-Download" @click="exportClick">下载</el-button>
+			<el-button :size="size" icon="sc-icon-Download" @click="exportClick">下载</el-button>
 		</template>
 		<template #default>
-			<div class="exportHeader">
-				<div class="name">{{info.type_desc}}</div>
-				<div class="status" v-if="info.status==0">{{info.msg}}</div>
-				<div class="finish" v-if="info.status==1"><i class="icon"><sc-icon-Finish/></i> 文件生成完成</div>
+			<div v-for="item in list" :key="item">
+				<div v-if="list.length>0 && type == item.type">
+					<div class="exportHeader">
+						<div class="name">{{item.type_desc}}</div>
+						<div class="status" v-if="item.status==0">{{item.msg}}</div>
+						<div class="finish" v-if="item.status==1"><i class="icon"><sc-icon-Finish/></i> 文件生成完成</div>
+					</div>
+					<el-progress class="exportPopover" :text-inside="true" :stroke-width="12" :percentage="item.rate" />
+				</div>
 			</div>
-			<el-progress class="exportPopover" :text-inside="true" :stroke-width="12" :percentage="info.rate" />
 		</template>
 	</el-popover>
 </template>
@@ -26,15 +31,15 @@ export default {
 	name: "index",
 	props:{
 		size:{ type: String, default: "small" },
+		show:{type:Boolean, default: false},
+		type:{type: String, default: ""}
+	},
+	watch:{
+
 	},
 	data(){
 		return{
-			exportVisible:false,
-			info:{
-				name:"",
-				status:"",
-				rate:0,
-			}
+			list:[{},{},{}],
 		}
 	},
 	mounted() {
@@ -44,17 +49,27 @@ export default {
 	methods:{
 		getWsResult(res){
 			if(res.data && (res.data.type == 6 || res.data.type == 7 || res.data.type == 8)){
-				if(res.data.status == 0){
-					this.exportVisible = true;
+				let item = {
+					type:res.data.type,
+					type_desc:res.data.type_desc,
+					msg:res.data.msg,
+					status:res.data.status,
+					rate:res.data.rate,
 				}
-				this.info = res.data;
+				if(res.data.type == 6){
+					this.list[0] = item;
+				}
+				if(res.data.type == 7){
+					this.list[1] = item;
+				}
+				if(res.data.type == 8){
+					this.list[2] = item;
+				}
+				this.$emit('updateShow',item);
 				if(res.data.status==1){
-					this.exportVisible = false;
-					this.info = {};
 					this.down(res.data);
 				}
 			}
-
 		},
 		down(item){
 			const link = document.createElement('a');
@@ -65,10 +80,6 @@ export default {
 			document.body.removeChild(link);
 		},
 		exportClick(){
-			if(this.exportVisible){
-				this.exportVisible = false;
-				return
-			}
 			this.$emit('exportData');
 		},
 	}
@@ -80,8 +91,8 @@ export default {
 		font-size: 12px;
 		display: flex;align-items: center;justify-content: space-around;
 		margin-bottom: 6px;
-		.name{width: 60%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
-		.status{width: 40%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
+		.name{width: 50%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
+		.status{width: 50%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
 		.finish{
 			display: flex;align-items: center;justify-content: flex-end;color: var(--el-color-success);
 			.icon{width: 14px;height: 14px;margin-right: 4px;}