From 02409bfbe15f22fc3b5dccadabfd860a660a49d9 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 11 Oct 2025 10:37:14 +0800
Subject: [PATCH] feat: 名称修改
---
src/views/dataCenter/dataCenter.vue | 105 ++++++++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 100 insertions(+), 5 deletions(-)
diff --git a/src/views/dataCenter/dataCenter.vue b/src/views/dataCenter/dataCenter.vue
index 7b77d2d..2a53060 100644
--- a/src/views/dataCenter/dataCenter.vue
+++ b/src/views/dataCenter/dataCenter.vue
@@ -7,10 +7,13 @@
ref="searchBoxRef"
:searchjobId="searchjobId"
:switchFolders="switchFolders"
+ :switchStar = "switchStar"
@search="searchClick"
@downFun="downloadFile"
@allDownFun="aLLDownloadFile"
@handleswitchFolders="handleswitchFolders"
+ @handleswitchList="handleswitchList"
+ @handleStartList="handleStartList"
@handleBack ="handleBack"
:viewDetails ="viewDetails"
@@ -145,7 +148,7 @@
<span>{{ resultTypeMap[row?.resultType] }}</span>
</template>
</el-table-column>
- <el-table-column label="操作" width="200" align="center">
+ <el-table-column label="操作" width="240" align="center">
<template #default="scope">
<el-button icon="el-icon-view" type="text" @click="lookDetail(scope.row)"
>查看</el-button
@@ -164,6 +167,22 @@
>
<img :src="positionicon" class="custom-icon" />定位</el-button
>
+ <el-button type="text" @click="handleStar(scope.row)"><el-icon><Star /></el-icon>{{ scope.row.isFavorite ? '取消收藏':'收藏' }}</el-button>
+ <el-popover
+ placement="top-start"
+ title="扫二维码分享"
+ :width="148"
+ trigger="click"
+ popper-class="custom-qrcode-popover-share"
+ @show="handleShare(scope.row)"
+ >
+ <template #reference>
+ <el-button type="text"><el-icon><Share /></el-icon>分享</el-button>
+ </template>
+ <div class="qrcode-content">
+ <div class="myQrCode" :id="`myQrCode-${scope.row.id}`" :ref="setQrCodeRef(scope.row.id)"></div>
+ </div>
+ </el-popover>
</template>
</el-table-column>
</el-table>
@@ -343,6 +362,7 @@
import PanoramaPopup from '@/components/PanoramaPopup/PanoramaPopup.vue'; //全景
import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
import searchData from '@/views/dataCenter/components/searchData.vue';
+import QRCode from 'qrcodejs2-fix'
import fy1 from '@/assets/images/dataCenter/1.jpeg';
import _ from 'lodash';
import {
@@ -351,7 +371,7 @@
deleteFileMultipleApi,
downloadApi,
updataTitleApi,
- getOrthoimageInfo, getDownloadStatusApi,getJobIdsBySnApi
+ getOrthoimageInfo, getDownloadStatusApi,getJobIdsBySnApi, starAdd, cancelStar
} from '@/api/dataCenter/dataCenter';
const userInfo = computed(() => store.getters.userInfo);
const isShow = defineModel('show');
@@ -362,6 +382,7 @@
const currentAreaPosition = ref({ height: 1987280, latitude: 27.636112, longitude: 115.732975 });
let handler = null;
const switchFolders = ref(false)
+const switchStar = ref(false)
function bytesToMB(bytes, decimalPlaces = 2) {
if (typeof bytes !== 'number' || bytes < 0) return '0';
return (bytes / 1048576).toFixed(decimalPlaces) + ' MB';
@@ -442,7 +463,7 @@
current: 1,
size: 10,
orderByCreateTime: true,
- searchParams: { startTime: timeRange[0], endTime: timeRange[1] },
+ searchParams: { startTime: timeRange[0], endTime: timeRange[1], isFavorite: false },
});
const FolderListParams = reactive({
page: 1,
@@ -521,10 +542,20 @@
getaiImagesPage();
}
};
+// 列表
+function handleswitchList() {
+ switchFolders.value = false;
+ switchStar.value = false;
+ jobListParams.current = 1;
+ jobListParams.size = 10;
+ jobListParams.searchParams.isFavorite = false;
+ getaiImagesPage();
+}
// 切换文件夹
const handleswitchFolders = () => {
searchjobId.value = ''
- switchFolders.value = !switchFolders.value;
+ switchFolders.value = true;
+ switchStar.value = false;
jobListParams.current = 1;
FolderListParams.page = 1;
@@ -541,7 +572,15 @@
}
const searchBoxRef = ref(null);
-
+// 收藏列表
+const handleStartList = () => {
+ switchFolders.value = false;
+ switchStar.value = true;
+ jobListParams.current = 1;
+ jobListParams.size = 10;
+ jobListParams.searchParams.isFavorite = true;
+ getaiImagesPage();
+}
// 查询
const searchClick = params => {
if(switchFolders.value){
@@ -882,6 +921,57 @@
})
}
}
+
+// 收藏 or 取消收藏
+function handleStar(row) {
+ if (row.isFavorite) {
+ cancelStar(row.id).then(res => {
+ ElMessage.success('取消收藏成功')
+ getaiImagesPage();
+ })
+ } else {
+ starAdd({ attachId: row.id }).then(res => {
+ ElMessage.success('收藏成功')
+ getaiImagesPage();
+ })
+ }
+}
+
+// 分享
+const myQrCode = ref(null)
+let qrCodeInstance = null
+
+const qrCodeRefs = ref({});
+
+// 设置动态ref的方法
+const setQrCodeRef = (id) => (el) => {
+ if (el) {
+ qrCodeRefs.value[id] = el;
+ }
+};
+
+async function handleShare(row) {
+ try {
+ await nextTick();
+ const qrCodeElement = qrCodeRefs.value[row.id]
+
+ if (qrCodeInstance) {
+ qrCodeInstance.clear();
+ qrCodeInstance = null;
+ qrCodeElement.innerHTML = '';
+ }
+ // await nextTick();
+ qrCodeInstance = new QRCode(qrCodeElement, {
+ width: 130,
+ height: 130,
+ text: row.link,
+ });
+ qrCodeElement.removeAttribute('title');
+ } catch (error) {
+ console.error('生成二维码失败:', error);
+ }
+}
+
onMounted(() => {
getaiImagesPage();
// 监听打开全景事件
@@ -897,6 +987,11 @@
viewInstance.value?.viewerDestroy();
});
</script>
+<style lang="scss">
+.custom-qrcode-popover-share {
+ width: 120px;
+}
+</style>
<style scoped lang="scss">
.dataCenter-table {
height: 0;
--
Gitblit v1.9.3