- 共12张照片
+ 共{{ imageStore.countTotalImages(albumList) }}张照片
-
@@ -50,8 +60,10 @@ import Vue3JustifiedLayout from "vue3-justified-layout";
import 'vue3-justified-layout/dist/style.css';
import {queryLocationDetailListApi} from "@/api/storage";
import useStore from "@/store";
+import ImageToolbar from "@/views/Photograph/ImageToolbar/ImageToolbar.vue";
+import empty from "@/assets/svgs/empty.svg";
-const selected = ref<(string | number)[]>([]);
+const imageStore = useStore().image;
const albumList = ref
+
+
{{ itemList.date }}
@@ -21,7 +22,7 @@
class="photo-item"
margin="0"
border-radius="0"
- v-model="selected"
+ v-model="imageStore.selected"
:showHoverCircle="true"
:iconSize="20"
:showSelectedEffect="true"
@@ -41,6 +42,15 @@
+
+
+
+ 暂无照片，快去上传吧
+
+
+
+
{{ item.location }}
+ style="width: 100%;"
+ v-model:activeKey="imageStore.tabActiveKey"
+ @change="handleTabChange">
已全部加载，共 {{ albumList ? albumList.length : 0 }} 个相册
-
+
-
+
-
+
-
+
(null);
const albumNameValue = ref("未命名相册");
const albumRenameValue = ref("");
-const selecetedKey = ref(true);
+const selectedKey = ref(true);
const albumList = ref([]);
const loading = ref(false);
+const imageStore = useStore().image;
+
/**
* 创建相册
*/
@@ -286,7 +291,7 @@ async function createAlbumSubmit() {
const res: any = await createAlbumApi(albumNameValue.value);
if (res && res.code === 200) {
albumNameValue.value = "未命名相册";
- await getAlbumList(0, selecetedKey.value);
+ await getAlbumList(parseInt(imageStore.tabActiveKey), selectedKey.value);
} else {
message.error("创建相册失败");
}
@@ -297,8 +302,8 @@ async function createAlbumSubmit() {
* @param key
*/
async function handleSelect({key}) {
- selecetedKey.value = key;
- await getAlbumList(0, key);
+ selectedKey.value = key;
+ await getAlbumList(parseInt(imageStore.tabActiveKey), key);
}
/**
@@ -306,7 +311,8 @@ async function handleSelect({key}) {
* @param activeKey
*/
async function handleTabChange(activeKey: string) {
- await getAlbumList(parseInt(activeKey), selecetedKey.value);
+ imageStore.tabActiveKey = activeKey;
+ await getAlbumList(parseInt(activeKey), selectedKey.value);
}
/**
@@ -337,7 +343,7 @@ async function renameAlbum(id: number, name: string) {
const res: any = await renameAlbumApi(id, name);
if (res && res.code === 200) {
albumRenameValue.value = "";
- await getAlbumList(0, selecetedKey.value);
+ await getAlbumList(parseInt(imageStore.tabActiveKey), selectedKey.value);
}
}
@@ -348,7 +354,7 @@ async function renameAlbum(id: number, name: string) {
async function deleteAlbum(id: number) {
const res: any = await deleteAlbumApi(id);
if (res && res.code === 200) {
- await getAlbumList(0, selecetedKey.value);
+ await getAlbumList(parseInt(imageStore.tabActiveKey), selectedKey.value);
} else {
message.error("删除相册失败");
}
@@ -360,13 +366,16 @@ const router = useRouter();
/**
* 点击相册跳转到详情页
* @param id
+ * @param albumName
*/
-function handleClick(id: number) {
- router.push({path: route.path + `/${id}`});
+function handleClick(id: number, albumName: string) {
+ router.push({
+ path: route.path + `/${id}`, query: {name: albumName}
+ });
}
onMounted(() => {
- getAlbumList(0, selecetedKey.value);
+ getAlbumList(parseInt(imageStore.tabActiveKey), selectedKey.value);
});
diff --git a/src/views/Album/ThingAlbum/ThingAlbumDetail.vue b/src/views/Album/ThingAlbum/ThingAlbumDetail.vue
index 3ec122c..b7e6ddf 100644
--- a/src/views/Album/ThingAlbum/ThingAlbumDetail.vue
+++ b/src/views/Album/ThingAlbum/ThingAlbumDetail.vue
@@ -2,14 +2,16 @@
-
-
![]()
- ([]);
const route = useRoute();
diff --git a/src/views/Album/Phoalbum/PhoalbumList.vue b/src/views/Album/Phoalbum/PhoalbumList.vue
index 15c8b10..b059657 100644
--- a/src/views/Album/Phoalbum/PhoalbumList.vue
+++ b/src/views/Album/Phoalbum/PhoalbumList.vue
@@ -31,7 +31,7 @@
排序
-
+
按时间排序
按名称排序
@@ -49,18 +49,20 @@
- 共12张照片
+ 共{{ imageStore.countTotalImages(images) }}张照片
- ([]);
+const imageStore = useStore().image;
+const images = ref([]);
const route = useRoute();
const router = useRouter();
@@ -74,7 +84,7 @@ const options = reactive({
async function getAlbumList(id: number) {
const res: any = await getFaceSamplesDetailList(id, upload.storageSelected?.[0], upload.storageSelected?.[1]);
if (res && res.code === 200) {
- albumList.value = res.data.records;
+ images.value = res.data.records;
}
}
diff --git a/src/views/Album/PeopleAlbum/PeopleAlbumList.vue b/src/views/Album/PeopleAlbum/PeopleAlbumList.vue
index bc1bfcf..8d27d35 100644
--- a/src/views/Album/PeopleAlbum/PeopleAlbumList.vue
+++ b/src/views/Album/PeopleAlbum/PeopleAlbumList.vue
@@ -3,11 +3,11 @@
- {{ selecetedKey === '0' ? '人 物' : '已隐藏' }}
+ {{ selectedKey === '0' ? '人 物' : '已隐藏' }}
-
+
人 物
已隐藏
@@ -33,7 +33,7 @@
@@ -55,7 +55,7 @@
([]);
const addNameInputValue = ref('');
-const selecetedKey = ref('0');
+const selectedKey = ref('0');
const loading = ref(false);
const selected = ref([]);
@@ -180,7 +180,7 @@ async function modifyFaceName(id: number, index: number) {
* @param key
*/
function handleSelect({key}) {
- selecetedKey.value = key;
+ selectedKey.value = key;
getFaceList(parseInt(key));
}
@@ -203,7 +203,7 @@ function cancelSelectPeople() {
*/
async function hiddenFace() {
if (selected.value.length === 0) return;
- const res: any = await modifyFaceTypeBatch(selected.value, selecetedKey.value === '0' ? 1 : 0);
+ const res: any = await modifyFaceTypeBatch(selected.value, selectedKey.value === '0' ? 1 : 0);
if (res && res.code === 200) {
await getFaceList();
selected.value = [];
@@ -216,9 +216,10 @@ const router = useRouter();
/**
* 点击人物跳转到详情页
* @param id
+ * @param name
*/
-function handleClick(id: number) {
- router.push({path: route.path + `/${id}`});
+function handleClick(id: number, name: string | null) {
+ router.push({path: route.path + `/${id}`, query: {name: name}});
}
onMounted(() => {
diff --git a/src/views/Album/Phoalbum/PhoalbumDetail.vue b/src/views/Album/Phoalbum/PhoalbumDetail.vue
index 69ae192..3e8370a 100644
--- a/src/views/Album/Phoalbum/PhoalbumDetail.vue
+++ b/src/views/Album/Phoalbum/PhoalbumDetail.vue
@@ -26,17 +26,18 @@
下载相册
-
-
@@ -58,10 +67,11 @@ import 'vue3-justified-layout/dist/style.css';
import {getFaceSamplesDetailList} from "@/api/storage";
import ImageToolbar from "@/views/Photograph/ImageToolbar/ImageToolbar.vue";
import useStore from "@/store";
+import empty from "@/assets/svgs/empty.svg";
-const selected = ref<(string | number)[]>([]);
-const albumList = ref
+
+
+
{{ itemList.date }}
@@ -29,7 +29,7 @@
class="photo-item"
margin="0"
border-radius="0"
- v-model="selected"
+ v-model="imageStore.selected"
:showHoverCircle="true"
:iconSize="20"
:showSelectedEffect="true"
@@ -49,6 +49,15 @@
+
+
+
+ 暂无照片，快去上传吧
+
+
+
+
- 全部相册
+
+ {{ imageStore.tabMap[imageStore.tabActiveKey] }}
>
- 网盘导入
+ {{ route.query.name }}
- 共15张照片,1个视频，创建于2025年1月1日
+ 共 {{ imageStore.countTotalImages(albumList) }} 张照片
@@ -44,7 +45,7 @@
相册描述
-
+
+
{{ itemList.date }}
@@ -54,7 +55,7 @@
class="photo-item"
margin="0"
border-radius="0"
- v-model="selected"
+ v-model="imageStore.selected"
:showHoverCircle="true"
:iconSize="20"
:showSelectedEffect="true"
@@ -74,6 +75,15 @@
+
+
+
+ 暂无照片，快去上传吧
+
+
+
+
- 人物
+
+ {{ getZhCategoryNameByEnName(route.query.category as string) }}
+
>
- 人物
+ {{ getZhLabelNameByEnName(route.query.tag as string) }}
- 共12张照片
+ 共{{ imageStore.countTotalImages(albumList) }}张照片
@@ -22,7 +24,7 @@
class="photo-item"
margin="0"
border-radius="0"
- v-model="selected"
+ v-model="imageStore.selected"
:showHoverCircle="true"
:iconSize="20"
:showSelectedEffect="true"
@@ -53,9 +55,10 @@ import 'vue3-justified-layout/dist/style.css';
import {queryThingDetailListApi} from "@/api/storage";
import ImageToolbar from "@/views/Photograph/ImageToolbar/ImageToolbar.vue";
import useStore from "@/store";
+import {getZhCategoryNameByEnName, getZhLabelNameByEnName} from "@/constant/coco_ssd_label_category.ts";
-const selected = ref<(string | number)[]>([]);
+const imageStore = useStore().image;
const albumList = ref([]);
const upload = useStore().upload;
const route = useRoute();
@@ -113,7 +116,7 @@ function goBack(): void {
justify-content: flex-start;
width: 1000%;
height: 100%;
- gap: 10px;
+ gap: 5px;
.thing-detail-content-nav-title {
font-size: 20px;
@@ -121,6 +124,7 @@ function goBack(): void {
display: flex;
align-items: center;
justify-content: center;
+ padding: 7px;
}
.thing-detail-content-nav-separator {
@@ -141,13 +145,13 @@ function goBack(): void {
flex-direction: row;
align-items: center;
justify-content: flex-start;
- margin-left: 30px;
+ margin-left: 15px;
width: 100%;
height: 22px;
}
.thing-album-detail-list {
- width: 99%;
+ width: 100%;
height: 100%;
//margin-left: 5px;
}
diff --git a/src/views/Album/ThingAlbum/ThingAlbumList.vue b/src/views/Album/ThingAlbum/ThingAlbumList.vue
index bbe835c..2f9fcbd 100644
--- a/src/views/Album/ThingAlbum/ThingAlbumList.vue
+++ b/src/views/Album/ThingAlbum/ThingAlbumList.vue
@@ -10,7 +10,7 @@
{{ getZhCategoryNameByEnName(item.category) }}
+ @click="handleClick(tags.tag_name,item.category,tags.tag_name)">
![]()
-
- (false);
const upload = useStore().upload;
@@ -91,20 +251,29 @@ const options = reactive({
});
const images = ref([]);
+const loading = ref(false);
/**
* 获取所有图片
*/
-async function getAllImages() {
- const res: any = await queryAllImagesApi("image", false, upload.storageSelected?.[0], upload.storageSelected?.[1]);
+async function getAllImages(type: string) {
+ images.value = [];
+ loading.value = true;
+ const res: any = await queryAllImagesApi(type, false, upload.storageSelected?.[0], upload.storageSelected?.[1]);
if (res && res.code === 200) {
images.value = res.data.records;
}
+ loading.value = false;
+}
+
+async function handleTabChange(activeKey: string) {
+ imageStore.homeTabActiveKey = activeKey;
+ await getAllImages(activeKey);
}
onMounted(() => {
- getAllImages();
+ getAllImages(imageStore.homeTabActiveKey);
});
diff --git a/src/views/Photograph/ImageToolbar/ImageToolbar.vue b/src/views/Photograph/ImageToolbar/ImageToolbar.vue
index ec4dd1f..f4f10f5 100644
--- a/src/views/Photograph/ImageToolbar/ImageToolbar.vue
+++ b/src/views/Photograph/ImageToolbar/ImageToolbar.vue
@@ -1,18 +1,8 @@
-
-
+
diff --git a/src/views/ImageShare/ShareUpload.vue b/src/views/Share/ImageShare/ShareUpload.vue
similarity index 94%
rename from src/views/ImageShare/ShareUpload.vue
rename to src/views/Share/ImageShare/ShareUpload.vue
index 3cd7d54..0b85588 100644
--- a/src/views/ImageShare/ShareUpload.vue
+++ b/src/views/Share/ImageShare/ShareUpload.vue
@@ -23,18 +23,30 @@
上 传 照 片
+
+
+
+
+
+
+
+
+
-
@@ -143,7 +155,7 @@
-
-
+
+
-
-
+
+
+
-
-
+
+
+
@@ -80,9 +239,10 @@ import ImageUpload from "@/views/Photograph/ImageUpload/ImageUpload.vue";
import useStore from "@/store";
import {queryAllImagesApi} from "@/api/storage";
import ImageToolbar from "@/views/Photograph/ImageToolbar/ImageToolbar.vue";
+import empty from "@/assets/svgs/empty.svg";
+const imageStore = useStore().image;
-const selected = ref<(string | number)[]>([]);
const switchValue = ref
- {{ itemList.date }}
-
-
-
-
-
+
+
+
+
-
+ {{ itemList.date }}
+
+
+
+
+
-
-
-
-
-
-
-
+ loading="lazy">
+
+
+
+
+
+
+
+
+
+
+
+ 还没检测到任何图片，快去上传吧！
+
+
+
+
+
-
-
-
+
+
+
+ {{ itemList.date }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 还没检测到任何视频，快去上传吧！
+
+
+
+
+
+
+
+ {{ itemList.date }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 还没检测到任何动图，快去上传吧！
+
+
+
+
+
+
+
+ {{ itemList.date }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 还没检测到任何屏幕截图，快去上传吧！
+
+
+
+
+ 单击或拖动文件到此区域以上传
-
-