Browse Source

reactor:随手拍新增导出;

zhangchong 3 months ago
parent
commit
291b834890
1 changed files with 27 additions and 45 deletions
  1. 27 45
      src/views/snapshot/inviteCode/list/components/Export-code.vue

+ 27 - 45
src/views/snapshot/inviteCode/list/components/Export-code.vue

@@ -1,13 +1,12 @@
 <template>
 	<el-dialog v-model="state.dialogVisible" width="70%" draggable title="导出邀请码" destroy-on-close append-to-body>
-		<div
-			ref="exportWordRef"
-			style="display: grid; grid-template-columns: repeat(auto-fill, 300px); grid-gap: 20px; justify-items: center; align-items: center"
-		>
-			<div v-for="(item, index) in list" :key="index" style="text-align: center; border: var(--el-border); padding: 10px 0">
-				<img :src="item.url" alt="" style="width: 300px" />
-				<div style="margin-top: 10px">{{ item.title }}</div>
-				<div style="margin-top: 10px">{{ item.code }}</div>
+		<div ref="exportWordRef">
+			<div style="display: grid; grid-template-columns: repeat(auto-fill, 300px); grid-gap: 20px; justify-items: center; align-items: center">
+				<div v-for="(item, index) in list" :key="index" style="text-align: center; border: 1px solid #ccc; padding: 10px 0">
+					<img :src="item.url" style="width: 300px" alt="加载失败" />
+					<div style="margin-top: 10px">{{ item.title }}</div>
+					<div style="margin-top: 10px">{{ item.code }}</div>
+				</div>
 			</div>
 		</div>
 		<template #footer>
@@ -22,52 +21,18 @@
 <script setup lang="ts">
 import { reactive, ref } from 'vue';
 import { exportAsDocx } from '@/utils/exportAsWord';
+import { getInviteCodeList } from '@/api/snapshot/inviteCode';
 
 // 定义变量内容
 const state = reactive<any>({
 	dialogVisible: false,
 });
-const list = ref<EmptyArrayType>([
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-	{
-		title: '高新区管委会及下属单位',
-		code: '1200 ~ 1999',
-		url: 'http://171.94.154.9:81/UploadFiles/QRCode/11192406-5126-4a7f-97ed-514c174c8d2c.png',
-	},
-]);
+const list = ref<EmptyArrayType>([]);
 // 打开弹窗
 const openDialog = async () => {
 	try {
 		state.dialogVisible = true;
+		getList();
 	} catch (error) {
 		console.log(error);
 	}
@@ -76,6 +41,23 @@ const openDialog = async () => {
 const closeDialog = () => {
 	state.dialogVisible = false;
 };
+const getList = () => {
+	state.loading = true;
+	getInviteCodeList({ PageIndex: 1, PageSize: 999 })
+		.then((res) => {
+			list.value = res.result.items.map((item: any) => {
+				return {
+					title: item.orgName,
+					code: item.beginCode + '~' + item.endCode,
+					url: import.meta.env.VITE_API_UPLOAD_URL + item.qrCodeUrl,
+				};
+			});
+			state.loading = false;
+		})
+		.finally(() => {
+			state.loading = false;
+		});
+};
 // 导出
 const exportWordRef = ref<RefType>();
 const exportWord = () => {