update
This commit is contained in:
@@ -1,7 +1,5 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { Request, Storage } from "../libs/utils"
|
|
||||||
import ModalTransition from "./ModalTransition.vue"
|
import ModalTransition from "./ModalTransition.vue"
|
||||||
import { globalStore } from "../globalstore.js";
|
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
show: false
|
show: false
|
||||||
|
|||||||
@@ -37,8 +37,6 @@ const props = defineProps({
|
|||||||
|
|
||||||
const emit = defineEmits(['close'])
|
const emit = defineEmits(['close'])
|
||||||
|
|
||||||
// const emit = defineEmits(['update:show'])
|
|
||||||
|
|
||||||
// Lottery 相关状态
|
// Lottery 相关状态
|
||||||
const lotteryShow = ref(false)
|
const lotteryShow = ref(false)
|
||||||
const lotteryType = ref('draw')
|
const lotteryType = ref('draw')
|
||||||
@@ -51,10 +49,6 @@ const circularArea = ref({
|
|||||||
size: '25vw' // 可配置:圆形区域的大小
|
size: '25vw' // 可配置:圆形区域的大小
|
||||||
})
|
})
|
||||||
|
|
||||||
// const handleGoHome = () => {
|
|
||||||
// emit('update:show', false)
|
|
||||||
// }
|
|
||||||
|
|
||||||
const handleGoBack = () => {
|
const handleGoBack = () => {
|
||||||
emit('close')
|
emit('close')
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -60,7 +60,6 @@ import ModalTransition from "./ModalTransition.vue"
|
|||||||
import confetti from "canvas-confetti";
|
import confetti from "canvas-confetti";
|
||||||
import { Request, Sleep } from "../libs/utils"
|
import { Request, Sleep } from "../libs/utils"
|
||||||
import { globalStore } from "@/globalstore";
|
import { globalStore } from "@/globalstore";
|
||||||
import getUserPicture from "../libs/getUserPicture";
|
|
||||||
|
|
||||||
const navigatePopupMore = () => {
|
const navigatePopupMore = () => {
|
||||||
globalToastEvent.emit(ToastType.SHOW_POPUPMORE)
|
globalToastEvent.emit(ToastType.SHOW_POPUPMORE)
|
||||||
|
|||||||
@@ -1,159 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { Request, Storage } from "../libs/utils"
|
|
||||||
import ModalTransition from "./ModalTransition.vue"
|
|
||||||
import { globalStore } from "../globalstore.js";
|
|
||||||
import { ElMessage } from 'element-plus';
|
|
||||||
|
|
||||||
defineProps({
|
|
||||||
show: false
|
|
||||||
})
|
|
||||||
|
|
||||||
const emit = defineEmits(['update:show']);
|
|
||||||
|
|
||||||
const cancelBtn = () => {
|
|
||||||
emit('update:show', false);
|
|
||||||
}
|
|
||||||
|
|
||||||
const confirmBtn = () => {
|
|
||||||
fetch(`https://huodong2.lzlj.com/api/faceFamily/face/publish/${globalStore.mergeId}`, {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
Accept: "application/json",
|
|
||||||
'Authorization': `Bearer ${Storage.get("userinfos").api_token}`
|
|
||||||
},
|
|
||||||
body: {}
|
|
||||||
})
|
|
||||||
.then(async response => {
|
|
||||||
const data = await response.json()
|
|
||||||
if (response.status == 200 || response.status == 201) {
|
|
||||||
if (data.message === '您已经有一张发布的照片,不能再次发布') {
|
|
||||||
weui.alert('您已经有一张发布的照片,不能再次发布')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
ElMessage.success('打榜成功!');
|
|
||||||
console.log('Success:', data);
|
|
||||||
return { success: true, data };
|
|
||||||
} else {
|
|
||||||
ElMessage.error(data.message);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
ElMessage.error('打榜失败!');
|
|
||||||
return { success: false, error };
|
|
||||||
});
|
|
||||||
emit('update:show', false);
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<ModalTransition class="popup" :show="show">
|
|
||||||
<div class="home-bg">
|
|
||||||
<div class="popup-bg">
|
|
||||||
<div class="scene-item item-1">
|
|
||||||
<img src="../assets/images/confirm.webp" @click="cancelBtn" alt="确认">
|
|
||||||
</div>
|
|
||||||
<p class="message">活动已结束</p>
|
|
||||||
<!-- <div class="scene-item item-2">
|
|
||||||
<img src="../assets/images/cancel.webp" @click="cancelBtn" alt="取消">
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ModalTransition>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.home-bg {
|
|
||||||
position: absolute;
|
|
||||||
top: 60vw;
|
|
||||||
left: 12vw;
|
|
||||||
}
|
|
||||||
.message {
|
|
||||||
width: 60vw;
|
|
||||||
position: absolute;
|
|
||||||
top: 42%;
|
|
||||||
color: #774107;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.popup-bg {
|
|
||||||
width: 77vw;
|
|
||||||
height: 60vw;
|
|
||||||
background-image: url('../assets/images/popup.webp');
|
|
||||||
background-size: 100%;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.scene-item {
|
|
||||||
position: absolute;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: all 0.4s ease;
|
|
||||||
border-radius: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 3px solid transparent;
|
|
||||||
animation: float 4s ease-in-out infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.scene-item:hover {
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
.btn-login {
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 1vw;
|
|
||||||
background-color: #70b2e2;
|
|
||||||
margin-top: 4vw;
|
|
||||||
padding: 3vw;
|
|
||||||
color: #fff;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.item-1 {
|
|
||||||
top: 50vw;
|
|
||||||
width: 40vw;
|
|
||||||
}
|
|
||||||
.item-2 {
|
|
||||||
top: 50vw;
|
|
||||||
width: 40vw;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
.scene-item img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-login.disable {
|
|
||||||
opacity: .6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-login.subloading {
|
|
||||||
opacity: .6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-login.subloading::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
border: .5vw solid #fff;
|
|
||||||
border-color: rgba(255, 255, 255, .8) transparent transparent transparent;
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 3vw;
|
|
||||||
height: 3vw;
|
|
||||||
top: 30%;
|
|
||||||
left: calc(50% - 14vw);
|
|
||||||
animation: loginloading 1s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes loginloading {
|
|
||||||
0% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,14 +1,12 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { isWeixinPlatform, miniJumpToScene, getMiniPageBtnHack } from "../libs/utils"
|
import { isWeixinPlatform, miniJumpToScene, getMiniPageBtnHack } from "../libs/utils"
|
||||||
import ModalTransition from "./ModalTransition.vue"
|
import ModalTransition from "./ModalTransition.vue"
|
||||||
import { globalStore } from "../globalstore.js";
|
|
||||||
|
|
||||||
defineProps({
|
defineProps({
|
||||||
show: false
|
show: false
|
||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['close'])
|
const emit = defineEmits(['close'])
|
||||||
// const emit = defineEmits(['update:show']);
|
|
||||||
|
|
||||||
const cancelBtn = () => {
|
const cancelBtn = () => {
|
||||||
emit('close')
|
emit('close')
|
||||||
|
|||||||
@@ -27,7 +27,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, watch } from "vue"
|
import { ref } from "vue"
|
||||||
import { isWeixinPlatform, miniJumpToScene, getMiniPageBtnHack } from "../libs/utils"
|
import { isWeixinPlatform, miniJumpToScene, getMiniPageBtnHack } from "../libs/utils"
|
||||||
import ModalTransition from "./ModalTransition.vue";
|
import ModalTransition from "./ModalTransition.vue";
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { Request, Storage, generateQR } from "../libs/utils.js"
|
import { Storage, generateQR } from "../libs/utils.js"
|
||||||
import ModalTransition from "./ModalTransition.vue"
|
import ModalTransition from "./ModalTransition.vue"
|
||||||
import { ref, onMounted, computed } from "vue"
|
import { ref, onMounted } from "vue"
|
||||||
import Haibao from "../libs/haibao.js"
|
import Haibao from "../libs/haibao.js"
|
||||||
import ruleBg from "../assets/images/new/rule-share.png"
|
import ruleBg from "../assets/images/new/rule-share.png"
|
||||||
import globalToastEvent, { ToastType } from '../globalToastEvent';
|
import globalToastEvent, { ToastType } from '../globalToastEvent';
|
||||||
@@ -11,7 +11,6 @@ const props = defineProps({
|
|||||||
})
|
})
|
||||||
|
|
||||||
const emit = defineEmits(['close'])
|
const emit = defineEmits(['close'])
|
||||||
// const emit = defineEmits(['update:show'])
|
|
||||||
const gotoLottery = () => {
|
const gotoLottery = () => {
|
||||||
globalToastEvent.emit(ToastType.SHOW_LOTTERY);
|
globalToastEvent.emit(ToastType.SHOW_LOTTERY);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,204 +0,0 @@
|
|||||||
import * as faceapi from 'face-api.js'
|
|
||||||
|
|
||||||
// 模型加载状态
|
|
||||||
let modelsLoaded = false
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 加载 face-api.js 模型
|
|
||||||
*/
|
|
||||||
export async function loadFaceApiModels() {
|
|
||||||
if (modelsLoaded) {
|
|
||||||
console.log('Face API 模型已经加载过了')
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
console.log('开始加载 Face API 模型...')
|
|
||||||
|
|
||||||
// 获取基础路径,处理 vite 的 base 配置
|
|
||||||
const basePath = import.meta.env.BASE_URL || '/'
|
|
||||||
const modelsPath = basePath.endsWith('/') ? basePath + 'models' : basePath + '/models'
|
|
||||||
|
|
||||||
console.log('模型加载路径:', modelsPath)
|
|
||||||
|
|
||||||
// 加载必需的模型
|
|
||||||
await Promise.all([
|
|
||||||
faceapi.nets.tinyFaceDetector.loadFromUri(modelsPath),
|
|
||||||
faceapi.nets.faceLandmark68Net.loadFromUri(modelsPath),
|
|
||||||
faceapi.nets.faceRecognitionNet.loadFromUri(modelsPath)
|
|
||||||
])
|
|
||||||
|
|
||||||
console.log('Face API 模型加载完成')
|
|
||||||
modelsLoaded = true
|
|
||||||
return true
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Face API 模型加载失败:', error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 检查模型是否已加载
|
|
||||||
*/
|
|
||||||
export function areModelsLoaded() {
|
|
||||||
return modelsLoaded
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 验证图片中的人脸
|
|
||||||
* @param {File} file - 图片文件
|
|
||||||
* @returns {Promise<Object>} - 验证结果
|
|
||||||
*/
|
|
||||||
export async function validateFaceInImage(file) {
|
|
||||||
// 如果模型未加载,先加载模型
|
|
||||||
if (!modelsLoaded) {
|
|
||||||
const loaded = await loadFaceApiModels()
|
|
||||||
if (!loaded) {
|
|
||||||
return {
|
|
||||||
success: false,
|
|
||||||
message: '人脸识别模型加载失败,请刷新页面重试'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return new Promise((resolve) => {
|
|
||||||
const img = new Image()
|
|
||||||
|
|
||||||
img.onload = async () => {
|
|
||||||
try {
|
|
||||||
console.log('开始进行人脸检测...')
|
|
||||||
|
|
||||||
// 使用 TinyFaceDetector 进行人脸检测
|
|
||||||
const detections = await faceapi
|
|
||||||
.detectAllFaces(img, new faceapi.TinyFaceDetectorOptions({
|
|
||||||
inputSize: 416,
|
|
||||||
scoreThreshold: 0.3
|
|
||||||
}))
|
|
||||||
.withFaceLandmarks()
|
|
||||||
|
|
||||||
console.log(`检测到 ${detections.length} 张人脸`)
|
|
||||||
|
|
||||||
// 检查是否检测到人脸
|
|
||||||
if (detections.length === 0) {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '未检测到人脸,请上传包含清晰人脸的图片'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 检查是否只有一张人脸
|
|
||||||
if (detections.length > 1) {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '检测到多张人脸,请上传只包含一张人脸的图片'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
const detection = detections[0]
|
|
||||||
const confidence = detection.detection.score
|
|
||||||
|
|
||||||
console.log('人脸检测置信度:', confidence)
|
|
||||||
|
|
||||||
// 检查置信度是否足够高
|
|
||||||
const minConfidence = 0.3 // 降低到 0.6 以提高通过率
|
|
||||||
if (confidence < minConfidence) {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: `人脸清晰度不够(置信度: ${(confidence * 100).toFixed(1)}%),请上传更清晰的人脸图片`
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 检查人脸大小(相对于图片尺寸)
|
|
||||||
const faceBox = detection.detection.box
|
|
||||||
const imageArea = img.naturalWidth * img.naturalHeight
|
|
||||||
const faceArea = faceBox.width * faceBox.height
|
|
||||||
const faceRatio = faceArea / imageArea
|
|
||||||
|
|
||||||
console.log('人脸占图片比例:', (faceRatio * 100).toFixed(2) + '%')
|
|
||||||
|
|
||||||
const minFaceRatio = 0.01 // 降低到 1.5% 以提高通过率
|
|
||||||
if (faceRatio < minFaceRatio) {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '人脸在图片中占比太小,请上传人脸更大更清晰的图片'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 检查人脸角度(通过关键点判断)
|
|
||||||
if (detection.landmarks) {
|
|
||||||
const landmarks = detection.landmarks
|
|
||||||
const leftEye = landmarks.getLeftEye()
|
|
||||||
const rightEye = landmarks.getRightEye()
|
|
||||||
|
|
||||||
// 计算眼睛之间的角度来判断人脸是否正面
|
|
||||||
if (leftEye.length > 0 && rightEye.length > 0) {
|
|
||||||
const leftEyeCenter = leftEye[0]
|
|
||||||
const rightEyeCenter = rightEye[3]
|
|
||||||
|
|
||||||
const eyeAngle = Math.abs(
|
|
||||||
Math.atan2(
|
|
||||||
rightEyeCenter.y - leftEyeCenter.y,
|
|
||||||
rightEyeCenter.x - leftEyeCenter.x
|
|
||||||
) * 180 / Math.PI
|
|
||||||
)
|
|
||||||
|
|
||||||
console.log('人脸角度:', eyeAngle.toFixed(1) + '度')
|
|
||||||
|
|
||||||
const maxAngle = 30 // 放宽到 20 度
|
|
||||||
if (eyeAngle > maxAngle) {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '请上传正面人脸照片,避免侧脸或过度倾斜的角度'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 所有验证通过
|
|
||||||
resolve({
|
|
||||||
success: true,
|
|
||||||
message: `人脸验证通过(置信度: ${(confidence * 100).toFixed(1)}%)`,
|
|
||||||
confidence: confidence,
|
|
||||||
faceRatio: faceRatio,
|
|
||||||
faceBox: {
|
|
||||||
x: faceBox.x,
|
|
||||||
y: faceBox.y,
|
|
||||||
width: faceBox.width,
|
|
||||||
height: faceBox.height
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
console.error('人脸检测过程中出错:', error)
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '人脸检测失败,请重试或更换图片'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
img.onerror = () => {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '图片加载失败,请检查图片格式'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 加载图片
|
|
||||||
const reader = new FileReader()
|
|
||||||
reader.onload = (e) => {
|
|
||||||
img.src = e.target.result
|
|
||||||
}
|
|
||||||
reader.onerror = () => {
|
|
||||||
resolve({
|
|
||||||
success: false,
|
|
||||||
message: '图片读取失败,请重试'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
reader.readAsDataURL(file)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
@@ -1,29 +0,0 @@
|
|||||||
import { globalStore } from "@/globalstore";
|
|
||||||
import { generateQR, Request } from "../libs/utils"
|
|
||||||
import Haibao from "@/libs/haibao"
|
|
||||||
import mask from "../assets/images/haibao-mask.webp"
|
|
||||||
import haibaoCoverBorder from "../assets/images/haibao-cover.webp"
|
|
||||||
|
|
||||||
|
|
||||||
export default async () => {
|
|
||||||
let userUrl = globalStore.result_url
|
|
||||||
|
|
||||||
if (!userUrl) {
|
|
||||||
const result = await Request('face/square', { my_only: 1, page: 1, per_page: 100 }, "GET", true)
|
|
||||||
if (result.res.status === 200) {
|
|
||||||
const dataHit = result.json.data.find(v => v.is_public)
|
|
||||||
if (!dataHit) {
|
|
||||||
return weui.alert("请先去参与打榜")
|
|
||||||
}
|
|
||||||
userUrl = dataHit.result_url
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const haibaoCover = new Haibao(951, 1607)
|
|
||||||
haibaoCover.add(userUrl, 0, 50, 951, 1698)
|
|
||||||
haibaoCover.add(mask, 10, 100)
|
|
||||||
haibaoCover.add(haibaoCoverBorder, 0, 0)
|
|
||||||
|
|
||||||
await haibaoCover.draw('destination-in');
|
|
||||||
return await haibaoCover.generate({ mimeType: 'image/png' });
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user