瀏覽代碼

feat: 生成海报

L 6 月之前
父節點
當前提交
e7e7e966e6
共有 1 個文件被更改,包括 80 次插入14 次删除
  1. 80 14
      src/views/user/userListQy.vue

+ 80 - 14
src/views/user/userListQy.vue

@@ -79,7 +79,7 @@
 					<el-table-column prop="invitationCode" label="邀请码">
 						<template slot-scope="scope">
 							<span style="color: #4f9dec;cursor: pointer;"
-								@click="onChangeShow(scope.row.inviterCode)">{{ scope.row.inviterCode }}</span>
+								@click="onChangeShow(scope.row.invitationCode,scope.row.userId)">{{ scope.row.invitationCode }}</span>
 						</template>
 					</el-table-column>
 					<el-table-column label="邀请人邀请码">
@@ -538,10 +538,18 @@
 	<el-dialog title="邀请人员" :visible.sync="isShow">
 		<el-button type="text" @click="downloadTemplate">生成邀请码</el-button>
 		<el-table :data="dataSource">
-			<el-table-column property="date" label="日期" width="150"></el-table-column>
-			<el-table-column property="name" label="姓名" width="200"></el-table-column>
-			<el-table-column property="address" label="地址"></el-table-column>
+			<el-table-column property="userName" label="姓名"></el-table-column>
+			<el-table-column property="updateTime" label="邀请时间"></el-table-column>
 		</el-table>
+		<el-pagination
+			small
+			background
+			@current-change="onChangeDataSourcePage"
+			layout="prev, pager, next"
+			:current-page="dataParams.page"
+			:page-size="dataParams.limit"
+			:total="dataParams.total">
+		</el-pagination>
 	</el-dialog>
 	</div>
 </template>
@@ -641,25 +649,83 @@
 				isShow: false,
 				dataSource: [{
 					date: '2026-1-15 22:02:07',
-					name: '用户',
+					userName: '用户',
 					address: '中国'
-				}] 
+				}],
+				dataParams: {
+					page: 1,
+					total: 0,
+					limit: 10,
+				},
+				invitationCode: '',
+				invitationUserId: ''
 			}
 		},
 		methods: {
 			// 显示拉人头
-			onChangeShow(code) {
-				console.log('code :>> ', code);
+			onChangeShow(code, id) {
 				this.isShow = true
+				this.invitationCode = code
+				this.invitationUserId = id
+				this.getDataSource()
+			},
+			getDataSource(page = 1) {
+				this.$http({
+					url: this.$http.adornUrl(`user/selectUserListByInvitationCode?page=${page}&limit=${this.dataParams.limit}&invitationCode=${this.invitationCode}`),
+					method: 'get'
+				}).then((res) => {
+					this.dataSource = res.data.data.list
+					this.dataParams = {
+						page: res.data.data.currPage,
+						limit: res.data.data.pageSize,
+						total: res.data.data.totalCount,
+					}
+				})
+			},
+
+			onChangeDataSourcePage(page) {
+				this.getDataSource(page)
+			},
+
+			base64ToFileDownload(base64Data, fileName, fileType) {
+				const mimeMap = {
+					png: 'image/png',
+					jpg: 'image/jpeg',
+					jpeg: 'image/jpeg',
+					pdf: 'application/pdf',
+					xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+					docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+					txt: 'text/plain'
+				};
+				const mime = mimeMap[fileType] || 'application/octet-stream';
+				let pureBase64 = base64Data;
+				if (base64Data.includes('base64,')) {
+					pureBase64 = base64Data.split('base64,')[1];
+				}
+				const byteCharacters = window.atob(pureBase64);
+				const byteNumbers = new Array(byteCharacters.length);
+				for (let i = 0; i < byteCharacters.length; i++) {
+					byteNumbers[i] = byteCharacters.charCodeAt(i);
+				}
+				const byteArray = new Uint8Array(byteNumbers);
+				const blob = new Blob([byteArray], { type: mime }); 
+				const blobUrl = window.URL.createObjectURL(blob); 
+				const a = document.createElement('a');
+				a.href = blobUrl;
+				a.download = `${fileName}.${fileType}`;
+				document.body.appendChild(a);
+				a.click();
+				document.body.removeChild(a);
+				window.URL.revokeObjectURL(blobUrl);
 			},
 			// 下载海报
 			downloadTemplate() {
-				const url = `<图片url>?t=${new Date().getTime()}`;
-				let a = document.createElement('a');
-				a.href = url;
-				a.download = '邀请码.png';
-				a.click();
-				a.remove();
+				this.$http({
+					url: this.$http.adornUrl(`invite/selectInviteAndPoster?userId=${this.invitationUserId}`),
+					method: 'get',
+				}).then((res) => {
+					this.base64ToFileDownload(res.data.data.image, '邀请码', 'png')
+				})
 			},
 
 			//处理默认选中当前日期