diff --git a/src/components/MyPhoto.vue b/src/components/MyPhoto.vue index 762ee3e..9c79ce9 100644 --- a/src/components/MyPhoto.vue +++ b/src/components/MyPhoto.vue @@ -21,7 +21,7 @@ const goBack = () => { const imageList = ref([]) const displayZhuli = ref(false); const fetchImages = async () => { - + try { const url = new URL('https://huodong2.lzlj.com/api/faceFamily/face/square'); url.searchParams.append('my_only', '1'); @@ -58,7 +58,7 @@ const fetchImages = async () => { ElMessage.error(data.message); } } catch (error) { - console.error('Error:', error) + console.error('Error:', error) } } @@ -72,7 +72,7 @@ watch(() => props.show, async (newVal) => { // 图片数据 const images = ref([]); - + import defaultBorderImage from '../assets/images/my-photo-border.webp'; import activeBorderImage from '../assets/images/my-photo-selected-border.webp'; @@ -100,21 +100,21 @@ const handleDabangClick = () => { }, body: {} }) - .then(async response => { - const data = await response.json() - if (response.status == 200 || response.status == 201) { - ElMessage.success('打榜成功!'); - displayZhuli.value = true; - globalStore.chartsBattle = true; - return { success: true, data }; - } else { - ElMessage.error(data.message); - } - }) - .catch((error) => { - ElMessage.error('打榜失败!'); - return { success: false, error }; - }); + .then(async response => { + const data = await response.json() + if (response.status == 200 || response.status == 201) { + ElMessage.success('打榜成功!'); + displayZhuli.value = true; + globalStore.chartsBattle = true; + return { success: true, data }; + } else { + ElMessage.error(data.message); + } + }) + .catch((error) => { + ElMessage.error('打榜失败!'); + return { success: false, error }; + }); }; const handleZhuliClick = () => { @@ -130,28 +130,28 @@ const downloadGenerateImg = (item) => { import haibaoCoverBorderNoTitle from "../assets/images/haibao-cover-no-title.webp" import haibaoCoverBorderSuccess from "../assets/images/haibao-cover-sucess.webp"; import failedImg from '../assets/images/failed.webp'; -const getGenerateImgStatus = async (item)=> { +const getGenerateImgStatus = async (item) => { fetch(`https://huodong2.lzlj.com/api/faceFamily/face/merge/${item.id}/status`, { method: 'GET', headers: { 'Authorization': `Bearer ${Storage.get("userinfos").api_token}` } }) - .then(async response => { - const data = await response.json() - if (response.status == 200 || response.status == 201) { - if (data.status = 'failed') { - item.result_url = failedImg; - } else if (data.status = 'success') { - item.result_url = data.result_url; + .then(async response => { + const data = await response.json() + if (response.status == 200 || response.status == 201) { + if (data.status = 'failed') { + item.result_url = failedImg; + } else if (data.status = 'success') { + item.result_url = data.result_url; + } + } else { + ElMessage.error(data.message); } - } else { - ElMessage.error(data.message); - } - }) - .catch((error) => { - ElMessage.error('获取状态失败!'); - }); + }) + .catch((error) => { + ElMessage.error('获取状态失败!'); + }); } const getBackgroundImage = (item) => { @@ -168,7 +168,7 @@ import Haibao from "@/libs/haibao"; import mask from "../assets/images/haibao-mask.webp"; import haibaoCoverBorder from "../assets/images/haibao-cover.webp"; import bg from "../assets/images/haibao-bg.webp" -const loadImage = (src)=> { +const loadImage = (src) => { return new Promise((resolve, reject) => { const img = new Image(); img.crossOrigin = "Anonymous"; @@ -240,6 +240,10 @@ const handleHaibao = async (item) => { }) }) + if (!globalStore.first_share_today) { + Request(`face/share/${globalStore.mergeId}`) + } + const haibaoCoverNoTitle = new Haibao(951, 1607) haibaoCoverNoTitle.add(userPicture, 0, 50, 951, 1698) haibaoCoverNoTitle.add(mask, 10, 100) @@ -286,16 +290,12 @@ markers.value = [ 关闭按钮 -
+

每位会员只能选一张照片参与打榜,点赞前30名即可获得中秋精美礼品,速速邀请好友为你点赞吧!

--> -
-
-
- 刷新 - border - 下载图片 +
+
+
+ 刷新 + border + 下载图片
- 助力 - 打榜 + 助力 + 打榜
@@ -364,13 +356,16 @@ markers.value = [ height: 124vw; overflow-y: auto; } + .list-item { height: 2vw; line-height: 50px; } + .marker { position: absolute; } + .fullsection { position: fixed; top: 0; @@ -418,6 +413,7 @@ markers.value = [ color: #855211; font-size: 3.6vw; } + .download-btn { width: 12.6vw; position: absolute; @@ -425,6 +421,7 @@ markers.value = [ right: 3vw; cursor: pointer; } + .refresh-btn { width: 12vw; position: absolute; @@ -432,6 +429,7 @@ markers.value = [ right: 3vw; cursor: pointer; } + .image-wrapper { position: relative; margin-right: 2vw; @@ -439,12 +437,14 @@ markers.value = [ width: 38vw; height: 59vw; } + .border-image { position: absolute; width: 40vw; top: 2.8vw; left: -0.8vw; } + .image-gallery { overflow-y: auto; overflow-x: hidden; @@ -503,6 +503,7 @@ markers.value = [ position: relative; min-height: -webkit-fill-available; } + .scene-item { position: absolute; cursor: pointer; @@ -516,6 +517,7 @@ markers.value = [ .scene-item:hover { transform: scale(1.05); } + .btn-login { text-align: center; border-radius: 1vw; @@ -525,22 +527,26 @@ markers.value = [ color: #fff; position: relative; } + .item-1 { top: 9%; width: 10vw; right: 4%; } + .item-3 { top: 16.3vh; width: 32vw; position: absolute; left: 11vw; } + .item-2 { position: fixed; width: 100%; bottom: 0; } + .scene-item img { width: 100%; height: 100%;