@@ -2,7 +2,7 @@ | |||||
"appid": "wx75cf14e3a0d45821", | |||||
wx-"appid": "wx75cf14e3a0d45821", | |||||
git commit -m "feat: " | git commit -m "feat: " | ||||
git commit --no-verify -m "提交时的注释" 跳过检验 | git commit --no-verify -m "提交时的注释" 跳过检验 |
@@ -41,6 +41,26 @@ onLaunch(() => { | |||||
console.log(res.osName, osName, "System"); | console.log(res.osName, osName, "System"); | ||||
}, | }, | ||||
}); | }); | ||||
uni.setStorageSync("userId", "114514"); | |||||
const updateManager = uni.getUpdateManager(); | |||||
updateManager.onUpdateReady(function (res) { | |||||
uni.showModal({ | |||||
title: "更新提示", | |||||
content: "有新的版本哦,请重启小程序应用更新", | |||||
showCancel: false, | |||||
confirmText: "立刻重启", | |||||
confirmColor: "#ff4f00", | |||||
success(res) { | |||||
if (res.confirm) { | |||||
// 新的版本已经下载好,调用 applyUpdate 应用新版本并重启 | |||||
updateManager.applyUpdate(); | |||||
} | |||||
}, | |||||
}); | |||||
}); | |||||
}); | }); | ||||
onShow(() => { | onShow(() => { | ||||
console.log("App Show!"); | console.log("App Show!"); | ||||
@@ -1,9 +1,9 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
// 获取风格列表 | // 获取风格列表 | ||||
export function getListApi(pageNum, pageSize) { | |||||
export function getListApi(pageNum, pageSize, sex) { | |||||
return request({ | return request({ | ||||
url: `api/digitalAvatarMould/list?pageNum=${pageNum}&pageSize=${pageSize}`, | |||||
url: `api/digitalAvatarMould/list?pageNum=${pageNum}&pageSize=${pageSize}&sex=${sex}`, | |||||
method: 'GET', | method: 'GET', | ||||
}) | }) | ||||
} | } | ||||
@@ -1,4 +1,4 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
/** | /** | ||||
* @description:获取金币价格列表 | * @description:获取金币价格列表 | ||||
@@ -1,4 +1,4 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
// 获取风格列表 | // 获取风格列表 | ||||
export function findWorkByIdApi(id) { | export function findWorkByIdApi(id) { | ||||
@@ -1,4 +1,4 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
/** | /** | ||||
* @description:获取用户头像 | * @description:获取用户头像 | ||||
@@ -49,6 +49,19 @@ export function getConsumeListApi(pageSize, pageNum) { | |||||
}) | }) | ||||
} | } | ||||
/** | |||||
* @description:获取邀请记录 | |||||
* @param (pageSize, pageNum) | |||||
* @return: | |||||
*/ | |||||
export function getInviteListApi(pageSize, pageNum) { | |||||
return request({ | |||||
url: `api/userFrom/list?fromProject=5&pageSize=${pageSize}&pageNum=${pageNum}`, | |||||
method: 'get', | |||||
}) | |||||
} | |||||
/** | /** | ||||
* @description:删除写真 | * @description:删除写真 | ||||
* @param id | * @param id | ||||
@@ -1,11 +1,6 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
export function voiceTotalApi() { | |||||
return request({ | |||||
url: `api/voiceMould/voiceTotal`, | |||||
method: 'GET', | |||||
}) | |||||
} | |||||
// 微信登录 | // 微信登录 | ||||
export function loginApi(data) { | export function loginApi(data) { | ||||
return request({ | return request({ | ||||
@@ -22,4 +17,26 @@ export function loginPhoneApi(data) { | |||||
method: 'POST', | method: 'POST', | ||||
data | data | ||||
}) | }) | ||||
} | |||||
// 获取短信验证码 | |||||
export function getCodeApi(phone) { | |||||
return request({ | |||||
url: `api/user/sendLoginPhoneCode?phone=${phone}`, | |||||
method: 'get', | |||||
}) | |||||
} | |||||
/** | |||||
* @description:短信登录 | |||||
* @param {*} (appId, openId,phone,code) | |||||
* @return: list | |||||
*/ | |||||
export function loginByCodeApi(data) { | |||||
return request({ | |||||
url: `api/miniApp/loginPhoneCode`, | |||||
method: 'POST', | |||||
data | |||||
}) | |||||
} | } |
@@ -1,4 +1,4 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
/** | /** | ||||
@@ -38,3 +38,17 @@ export function getSupperPhotoStateApi(id) { | |||||
method: 'get', | method: 'get', | ||||
}) | }) | ||||
} | } | ||||
/** | |||||
* @description:生成画报 | |||||
* @param {appId,img} | |||||
* @return: data | |||||
*/ | |||||
export function getUserQrcodeApi(data) { | |||||
return request({ | |||||
url: `/api/miniApp/getUserQrcode`, | |||||
method: 'POST', | |||||
responseType: "arraybuffer", | |||||
data | |||||
}) | |||||
} |
@@ -1,4 +1,4 @@ | |||||
import request from "../utils/request" | |||||
import { request } from "../utils/request" | |||||
// /api/baidu/checkPhoto | // /api/baidu/checkPhoto | ||||
// /api/userDigital/checkPhoto | // /api/userDigital/checkPhoto | ||||
@@ -1,10 +0,0 @@ | |||||
<template> | |||||
<div class="myLoading">{{ title }}</div> | |||||
</template> | |||||
<script setup> | |||||
import { ref } from "vue"; | |||||
const title = ref("myLoading"); | |||||
</script> | |||||
<style lang="scss"></style> |
@@ -51,6 +51,9 @@ | |||||
/* 小程序特有相关 */ | /* 小程序特有相关 */ | ||||
"mp-weixin": { | "mp-weixin": { | ||||
"appid": "wx75cf14e3a0d45821", | "appid": "wx75cf14e3a0d45821", | ||||
// "useExtendedLib": { | |||||
// "share": true // 确保分享功能已经开启 | |||||
// }, | |||||
"permission": { | "permission": { | ||||
"scope.userLocation": { | "scope.userLocation": { | ||||
"desc": "获取您的地理位置信息" | "desc": "获取您的地理位置信息" | ||||
@@ -67,7 +70,8 @@ | |||||
"ignoreDevUnusedFiles": false, | "ignoreDevUnusedFiles": false, | ||||
"ignoreUploadUnusedFiles": false | "ignoreUploadUnusedFiles": false | ||||
}, | }, | ||||
"usingComponents": true | |||||
"usingComponents": true, | |||||
"__usePrivacyCheck__": true | |||||
}, | }, | ||||
"h5": { | "h5": { | ||||
"title": "", | "title": "", | ||||
@@ -80,7 +84,8 @@ | |||||
"usingComponents": true | "usingComponents": true | ||||
}, | }, | ||||
"mp-toutiao": { | "mp-toutiao": { | ||||
"usingComponents": true | |||||
"usingComponents": true, | |||||
"appid": "tt2eba5807b1883f9f01" | |||||
}, | }, | ||||
"uniStatistics": { | "uniStatistics": { | ||||
"enable": false | "enable": false | ||||
@@ -30,6 +30,12 @@ | |||||
"navigationBarTitleText": "上传成功" | "navigationBarTitleText": "上传成功" | ||||
} | } | ||||
}, | }, | ||||
{ | |||||
"path": "pages/uploadPhoto/camera ", | |||||
"style": { | |||||
"navigationBarTitleText": "拍照" | |||||
} | |||||
}, | |||||
{ | { | ||||
"path": "pages/closeStyle/closeStyle", | "path": "pages/closeStyle/closeStyle", | ||||
"style": { | "style": { | ||||
@@ -75,7 +81,7 @@ | |||||
{ | { | ||||
"path": "pages/protocol/coin", | "path": "pages/protocol/coin", | ||||
"style": { | "style": { | ||||
"navigationBarTitleText": "慧拍金币充值协议" | |||||
"navigationBarTitleText": "智像金币充值协议" | |||||
} | } | ||||
}, | }, | ||||
{ | { | ||||
@@ -1,13 +1,26 @@ | |||||
<template> | <template> | ||||
<div class="page"> | <div class="page"> | ||||
<u-list class="styleListBox" @scrolltolower="scrolltolower"> | |||||
<!-- 性别tab --> | |||||
<view class="sexTab"> | |||||
<view @click="sex = 2" class="sex" :class="sex == 2 ? 'sexActive' : ''" | |||||
>女</view | |||||
> | |||||
<view @click="sex = 1" class="sex" :class="sex == 1 ? 'sexActive' : ''" | |||||
>男</view | |||||
> | |||||
</view> | |||||
<u-list | |||||
class="styleListBox" | |||||
@scrolltolower="scrolltolower" | |||||
lowerThreshold="100" | |||||
> | |||||
<u-list-item class="glodYBox"> | <u-list-item class="glodYBox"> | ||||
<u-list-item | <u-list-item | ||||
v-for="item in styleList" | v-for="item in styleList" | ||||
:key="item.id" | :key="item.id" | ||||
class="styleListBoxItme" | class="styleListBoxItme" | ||||
> | > | ||||
<view class="styleInfo" @click="createPhoto(item.id)"> | |||||
<view class="styleInfo" @click="createPhoto(item)"> | |||||
<image :src="item.coverImg" mode="aspectFit" /> | <image :src="item.coverImg" mode="aspectFit" /> | ||||
<text class="name">{{ item.title }}</text> | <text class="name">{{ item.title }}</text> | ||||
<text class="single">{{ peopleNum(item.mouldType) }}</text> | <text class="single">{{ peopleNum(item.mouldType) }}</text> | ||||
@@ -20,33 +33,73 @@ | |||||
<script setup> | <script setup> | ||||
//#region 导入 | //#region 导入 | ||||
import { ref, reactive } from "vue"; | |||||
import { voiceTotalApi } from "../../api/login.js"; | |||||
import { onPullDownRefresh } from "@dcloudio/uni-app"; | |||||
import { ref, reactive, watch } from "vue"; | |||||
import { getListApi } from "../../api/closeStyle"; | import { getListApi } from "../../api/closeStyle"; | ||||
//#endregion | //#endregion | ||||
//#region 页面下拉刷新 | |||||
// onPullDownRefresh(async () => { | |||||
// uni.showLoading({ | |||||
// title: "加载中...", | |||||
// mask: true, | |||||
// }); | |||||
// pageNum.value = 1; | |||||
// pageSize.value = 8; | |||||
// styleList.value = []; | |||||
// await getList(); | |||||
// uni.hideLoading(); | |||||
// uni.stopPullDownRefresh(); | |||||
// }); | |||||
//#endregion | |||||
//#region 列表加载 | //#region 列表加载 | ||||
const pageNum = ref(1); | const pageNum = ref(1); | ||||
const pageSize = ref(6); | |||||
const pageSize = ref(20); | |||||
const sex = ref(2); //1男2女 | |||||
const styleList = ref([]); | const styleList = ref([]); | ||||
// 得到列表 | // 得到列表 | ||||
async function getList() { | async function getList() { | ||||
try { | try { | ||||
const res = await getListApi(pageNum.value, pageSize.value); | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
const res = await getListApi(pageNum.value, pageSize.value, sex.value); | |||||
styleList.value = res.data.list; | styleList.value = res.data.list; | ||||
uni.hideLoading(); | |||||
} catch (error) { | } catch (error) { | ||||
uni.hideLoading(); | |||||
uni.showToast({ | uni.showToast({ | ||||
title: "获取列表失败,请重试", | title: "获取列表失败,请重试", | ||||
icon: "none", | icon: "none", | ||||
}); | }); | ||||
} | } | ||||
} | } | ||||
// 监听性别tab变化 | |||||
watch( | |||||
() => sex.value, | |||||
(sex) => { | |||||
pageNum.value = 1; | |||||
pageSize.value = 20; | |||||
getList(); | |||||
} | |||||
); | |||||
getList(); | getList(); | ||||
// 触底加载更多 | // 触底加载更多 | ||||
const scrolltolower = async () => { | const scrolltolower = async () => { | ||||
try { | try { | ||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
pageNum.value += 1; | pageNum.value += 1; | ||||
const res = await getListApi(pageNum.value, pageSize.value); | |||||
const res = await getListApi(pageNum.value, pageSize.value, sex.value); | |||||
styleList.value.push(...res.data.list); | |||||
setTimeout(function () { | |||||
uni.hideLoading(); | |||||
}, 500); | |||||
if (res.data.list.length == 0) { | if (res.data.list.length == 0) { | ||||
pageNum.value -= 1; | pageNum.value -= 1; | ||||
uni.showToast({ | uni.showToast({ | ||||
@@ -54,8 +107,10 @@ const scrolltolower = async () => { | |||||
icon: "none", | icon: "none", | ||||
}); | }); | ||||
} | } | ||||
styleList.value.push(...res.data.list); | |||||
} catch (error) { | } catch (error) { | ||||
setTimeout(function () { | |||||
uni.hideLoading(); | |||||
}, 500); | |||||
uni.showToast({ | uni.showToast({ | ||||
title: "获取数据失败,请重试", | title: "获取数据失败,请重试", | ||||
icon: "none", | icon: "none", | ||||
@@ -76,44 +131,47 @@ function peopleNum(num) { | |||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 点击图片 | //#region 点击图片 | ||||
function createPhoto(id) { | |||||
uni.navigateTo({ | |||||
url: `/pages/closeStyle/goCreatePhoto?id=${id}`, | |||||
}); | |||||
function createPhoto(item) { | |||||
if (item.mouldType == 1) { | |||||
uni.navigateTo({ | |||||
url: `/pages/closeStyle/goCreatePhoto?id=${item.id}`, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: `/pages/closeStyle/multiplayer?id=${item.id}`, | |||||
}); | |||||
} | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
</script> | </script> | ||||
<style lang="scss"> | <style lang="scss"> | ||||
// scroll-view { | |||||
// width: 750rpx; | |||||
// } | |||||
// .uni-scroll-view-content { | |||||
// width: 750rpx; | |||||
// display: flex !important; | |||||
// flex-direction: row !important; | |||||
// flex-wrap: wrap !important; | |||||
// justify-content: space-between !important; | |||||
// .styleInfo { | |||||
// width: 350rpx; | |||||
// height: 400rpx; | |||||
// margin-bottom: 50rpx; | |||||
// image { | |||||
// width: 350rpx; | |||||
// height: 350rpx; | |||||
// } | |||||
// text { | |||||
// width: 100%; | |||||
// height: 50rpx; | |||||
// text-align: center; | |||||
// line-height: 50rpx; | |||||
// } | |||||
// } | |||||
// } | |||||
.page { | .page { | ||||
background-color: #222527; | background-color: #222527; | ||||
} | } | ||||
.sexTab { | |||||
margin: 20rpx 0; | |||||
width: 100%; | |||||
height: 60rpx; | |||||
display: flex; | |||||
justify-content: space-evenly; | |||||
line-height: 54rpx; | |||||
text-align: center; | |||||
.sex { | |||||
border-radius: 20rpx; | |||||
border: 2rpx solid #ccc; | |||||
width: 40%; | |||||
} | |||||
.sexActive { | |||||
color: #ff4f00; | |||||
border: 2rpx solid #ff4f00; | |||||
transition: all 0.3s; | |||||
} | |||||
} | |||||
.u-list { | .u-list { | ||||
overflow: hidden; | |||||
height: calc(100vh - 200rpx) !important; | |||||
width: 650rpx; | width: 650rpx; | ||||
.glodYBox { | .glodYBox { | ||||
display: flex !important; | display: flex !important; | ||||
@@ -95,8 +95,8 @@ async function createing(id) { | |||||
}; | }; | ||||
const res2 = await createPhotoApi(data); | const res2 = await createPhotoApi(data); | ||||
console.log(res2); | console.log(res2); | ||||
uni.reLaunch({ | |||||
url: `/pages/createing/index?id=${res2.data.id}`, | |||||
uni.navigateTo({ | |||||
url: `/pages/lookPhoto/index?id=${res2.data.id}`, | |||||
}); | }); | ||||
uni.hideLoading(); | uni.hideLoading(); | ||||
} catch (error) { | } catch (error) { | ||||
@@ -5,37 +5,98 @@ | |||||
/></view> | /></view> | ||||
<text class="name">{{ styleData.title }}</text> | <text class="name">{{ styleData.title }}</text> | ||||
<view class="imgBox"> | <view class="imgBox"> | ||||
<!-- 图一 --> | |||||
<view class="imgBoxItem"> | <view class="imgBoxItem"> | ||||
<image src="../../assets/img/img1.png" mode="scaleToFill" /> | |||||
<image class="avatar" :src="avatarList[0].url" mode="aspectFill" /> | |||||
<view v-if="!avatarList[0].url" class="noUrlBox" @click="chooseImg(0)" | |||||
>+</view | |||||
> | |||||
<!-- 遮罩层 --> | |||||
<view v-if="avatarList[0].url" class="maskTips">{{ | |||||
avatarList[0].isMyAvatar ? "授权用户头像" : "已上传第1个头像" | |||||
}}</view> | |||||
<view | |||||
v-if="avatarList[0].url && !avatarList[0].isMyAvatar" | |||||
class="reUploadBtn" | |||||
@click="chooseImg(0)" | |||||
>更换头像</view | |||||
> | |||||
<view | |||||
v-if="!avatarList[0].url && !avatarList[0].isMyAvatar" | |||||
class="uploadBtn" | |||||
@click="chooseImg(0)" | |||||
>上传头像</view | |||||
> | |||||
</view> | </view> | ||||
<image | <image | ||||
@click="swapItems" | |||||
class="exchange" | class="exchange" | ||||
src="../../assets/icon/exchange.png" | src="../../assets/icon/exchange.png" | ||||
mode="scaleToFill" | mode="scaleToFill" | ||||
/> | /> | ||||
<!-- 图二 --> | |||||
<view class="imgBoxItem"> | <view class="imgBoxItem"> | ||||
<image src="../../assets/img/img2.png" mode="scaleToFill" /> | |||||
<view class="reUploadBtn">更换头像</view> | |||||
<image class="avatar" :src="avatarList[1].url" mode="aspectFill" /> | |||||
<view v-if="!avatarList[1].url" class="noUrlBox" @click="chooseImg(1)" | |||||
>+</view | |||||
> | |||||
<!-- 遮罩层 --> | |||||
<view v-if="avatarList[1].url" class="maskTips">{{ | |||||
avatarList[1].isMyAvatar ? "授权用户头像" : "已上传第2个头像" | |||||
}}</view> | |||||
<view | |||||
v-if="avatarList[1].url && !avatarList[1].isMyAvatar" | |||||
class="reUploadBtn" | |||||
@click="chooseImg(1)" | |||||
>更换头像</view | |||||
> | |||||
<view | |||||
v-if="!avatarList[1].url && !avatarList[1].isMyAvatar" | |||||
class="uploadBtn" | |||||
@click="chooseImg(1)" | |||||
>上传头像</view | |||||
> | |||||
</view> | </view> | ||||
<image | <image | ||||
v-if="styleData.mouldType == 3" | |||||
@click="swapItems2" | |||||
class="exchange" | class="exchange" | ||||
src="../../assets/icon/exchange.png" | src="../../assets/icon/exchange.png" | ||||
mode="scaleToFill" | mode="scaleToFill" | ||||
/> | /> | ||||
<view class="imgBoxItem"> | |||||
<image src="../../assets/img/img3.png" mode="scaleToFill" /> | |||||
<view class="uploadBtn">上传头像</view> | |||||
<!-- 图三 --> | |||||
<view v-if="styleData.mouldType == 3" class="imgBoxItem"> | |||||
<image class="avatar" :src="avatarList[2].url" mode="aspectFill" /> | |||||
<view v-if="!avatarList[2].url" class="noUrlBox" @click="chooseImg(2)" | |||||
>+</view | |||||
> | |||||
<!-- 遮罩层 --> | |||||
<view v-if="avatarList[2].url" class="maskTips">{{ | |||||
avatarList[2].isMyAvatar ? "授权用户头像" : "已上传第3个头像" | |||||
}}</view> | |||||
<view | |||||
v-if="avatarList[2].url && !avatarList[2].isMyAvatar" | |||||
class="reUploadBtn" | |||||
@click="chooseImg(2)" | |||||
>更换头像</view | |||||
> | |||||
<view | |||||
v-if="!avatarList[2].url && !avatarList[2].isMyAvatar" | |||||
class="uploadBtn" | |||||
@click="chooseImg(2)" | |||||
>上传头像</view | |||||
> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<text class="tips">人物头像对应模板任务位置,点击按钮可以调整顺序</text> | |||||
<text class="tips">人物头像对应模板人物位置,点击按钮可以调整顺序</text> | |||||
<view class="orangeBtn" @click="createing(styleData.id)" | <view class="orangeBtn" @click="createing(styleData.id)" | ||||
>开始制作写真 | >开始制作写真 | ||||
<view class="free"> | <view class="free"> | ||||
<text>耗金币2枚</text> | |||||
<text>耗金币{{ styleData.salePrice }}枚</text> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="balance" | <view class="balance" | ||||
>金币余额: 30 | |||||
>金币余额: {{ userInfoModulesPinia.myGlod }} | |||||
<image src="../../assets/icon/coin.png" mode="aspectFit" /> | <image src="../../assets/icon/coin.png" mode="aspectFit" /> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -45,21 +106,29 @@ | |||||
//#region 导入 | //#region 导入 | ||||
import { ref, reactive } from "vue"; | import { ref, reactive } from "vue"; | ||||
import { onLoad } from "@dcloudio/uni-app"; | import { onLoad } from "@dcloudio/uni-app"; | ||||
import { BASE_URL } from "@/utils/request"; | |||||
import { | import { | ||||
findByIdApi, | findByIdApi, | ||||
findImageApi, | findImageApi, | ||||
createPhotoApi, | createPhotoApi, | ||||
} from "../../api/closeStyle"; | } from "../../api/closeStyle"; | ||||
import { findGlodApi } from "../../api/home"; | |||||
import { userInfoModules } from "@/store/modules/userInfo"; | |||||
//#endregion | //#endregion | ||||
const userInfoModulesPinia = userInfoModules(); | |||||
//#region 初始化 | //#region 初始化 | ||||
const styleId = ref(null); | const styleId = ref(null); | ||||
const styleData = ref({}); | const styleData = ref({}); | ||||
onLoad((options) => { | onLoad((options) => { | ||||
// styleId.value = options.id; | |||||
styleId.value = 4; | |||||
styleId.value = options.id; | |||||
// styleId.value = "857147862095679488"; | |||||
// styleId.value = "2003"; | |||||
// styleId.value = "246"; | |||||
getInfo(); | getInfo(); | ||||
// getMyCoin(); | |||||
}); | }); | ||||
async function getInfo() { | async function getInfo() { | ||||
try { | try { | ||||
const res = await findByIdApi(styleId.value); | const res = await findByIdApi(styleId.value); | ||||
@@ -72,25 +141,212 @@ async function getInfo() { | |||||
}); | }); | ||||
} | } | ||||
} | } | ||||
// 查询我的金币 | |||||
async function getMyCoin() { | |||||
const res4 = await findGlodApi(); | |||||
if (!res4.data) { | |||||
userInfoModulesPinia.myGlod = 0; | |||||
} else { | |||||
userInfoModulesPinia.myGlod = res4.data.digitalAvatarResidueGlod | |||||
? res4.data.digitalAvatarResidueGlod | |||||
: 0; | |||||
} | |||||
} | |||||
//#endregion --------------------- | |||||
//#region 上传图片 | |||||
const avatarList = ref([ | |||||
{ | |||||
url: userInfoModulesPinia.myAvatar, | |||||
isMyAvatar: true, | |||||
}, | |||||
{ | |||||
url: "", | |||||
isMyAvatar: false, | |||||
}, | |||||
{ | |||||
url: "", | |||||
isMyAvatar: false, | |||||
}, | |||||
]); | |||||
// 切换位置 | |||||
function swapItems() { | |||||
const temp = avatarList.value[0]; | |||||
avatarList.value[0] = avatarList.value[1]; | |||||
avatarList.value[1] = temp; | |||||
} | |||||
function swapItems2() { | |||||
const temp = avatarList.value[1]; | |||||
avatarList.value[1] = avatarList.value[2]; | |||||
avatarList.value[2] = temp; | |||||
} | |||||
// 打开图片选择,包含了百度检测人脸检测和上传图片 | |||||
function chooseImg(index) { | |||||
uni.chooseImage({ | |||||
count: 1, | |||||
success: async (res) => { | |||||
console.log(res, "887"); | |||||
uni.showLoading({ | |||||
title: "上传中...", | |||||
mask: true, | |||||
}); | |||||
// 百度敏感信息检测 | |||||
uni.uploadFile({ | |||||
url: BASE_URL + "api/baidu/checkPhoto", //上传图片api | |||||
filePath: res.tempFilePaths[0], | |||||
name: "file", | |||||
formData: { | |||||
user: "test", | |||||
}, | |||||
header: { | |||||
// Authorization: userInfoModulesPinia.token, | |||||
token: userInfoModulesPinia.token, | |||||
}, | |||||
success: async (res2) => { | |||||
if (JSON.parse(res2.data).code != 200) { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "图片不符合规范, 请重试", | |||||
icon: "none", | |||||
}); | |||||
return; | |||||
} else { | |||||
// 人脸识别接口 | |||||
uni.uploadFile({ | |||||
url: BASE_URL + "api/userDigital/checkPhoto", //上传图片api | |||||
filePath: res.tempFilePaths[0], | |||||
name: "file", | |||||
formData: { | |||||
user: "test", | |||||
}, | |||||
header: { | |||||
// Authorization: userInfoModulesPinia.token, | |||||
token: userInfoModulesPinia.token, | |||||
}, | |||||
success: (res3) => { | |||||
if (JSON.parse(res3.data).code != 200) { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "图片不符合规范, 请重试", | |||||
icon: "none", | |||||
}); | |||||
return; | |||||
} else { | |||||
// 上传接口 | |||||
uni.uploadFile({ | |||||
url: BASE_URL + "api/upload/awsImgUpload", //上传图片api | |||||
filePath: res.tempFilePaths[0], | |||||
name: "file", | |||||
formData: { | |||||
user: "test", | |||||
}, | |||||
header: { | |||||
"Content-Type": "multipart/form-data", | |||||
token: userInfoModulesPinia.token, | |||||
}, | |||||
success: async (res4) => { | |||||
if (JSON.parse(res4.data).code != 200) { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "网络被数字人偷走了, 请稍后重试", | |||||
icon: "none", | |||||
}); | |||||
return; | |||||
} | |||||
// 赋值 | |||||
avatarList.value[index].url = JSON.parse( | |||||
res4.data | |||||
).data.url; | |||||
uni.hideLoading(); | |||||
}, | |||||
fail: () => { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "网络被数字人偷走了, 请稍后重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
}, | |||||
fail: () => { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "网络被数字人偷走了, 请稍后重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
}, | |||||
fail: (err) => { | |||||
console.error("选择图片失败", err); | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "选择图片失败, 请稍后重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
}, | |||||
fail: (err) => { | |||||
console.error("选择图片失败", err); | |||||
uni.showToast({ | |||||
title: "选择图片失败, 请稍后重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
// 上传图片 | |||||
function uploadImg(index) {} | |||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 生成写真照片 | //#region 生成写真照片 | ||||
async function createing(id) { | async function createing(id) { | ||||
try { | try { | ||||
const res = await findImageApi(); | |||||
console.log(res); | |||||
let myImg = res.data.image; | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
// const res = await findImageApi(); | |||||
// console.log(res); | |||||
// let myImg = res.data.image; | |||||
let myImgList = []; | |||||
avatarList.value.forEach((item) => { | |||||
myImgList.push(item.url); | |||||
}); | |||||
const data = { | const data = { | ||||
title: styleData.value.title, | |||||
digitalAvatarId: id, | digitalAvatarId: id, | ||||
userImages: JSON.stringify([myImg]), | |||||
userImages: | |||||
styleData.value.mouldType == 2 | |||||
? JSON.stringify(myImgList.slice(0, 2)) | |||||
: JSON.stringify(myImgList), | |||||
}; | }; | ||||
if ( | |||||
myImgList[0].length == 0 || | |||||
myImgList[1].length == 0 || | |||||
(styleData.value.mouldType == 3 && myImgList[2].length == 0) | |||||
) { | |||||
uni.showToast({ | |||||
title: "头像未上传", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
return; | |||||
} | |||||
const res2 = await createPhotoApi(data); | const res2 = await createPhotoApi(data); | ||||
console.log(res2); | console.log(res2); | ||||
uni.hideLoading(); | |||||
uni.navigateTo({ | uni.navigateTo({ | ||||
url: `/pages/createing/index?id=${res2.data.id}`, | |||||
url: `/pages/lookPhoto/index?id=${res2.data.id}`, | |||||
}); | }); | ||||
} catch (error) { | } catch (error) { | ||||
console.log(error); | console.log(error); | ||||
uni.hideLoading(); | |||||
uni.showToast({ | uni.showToast({ | ||||
title: "生成失败,请重试", | title: "生成失败,请重试", | ||||
icon: "none", | icon: "none", | ||||
@@ -140,17 +396,45 @@ async function createing(id) { | |||||
margin-top: 67rpx; | margin-top: 67rpx; | ||||
} | } | ||||
.imgBoxItem { | .imgBoxItem { | ||||
position: relative; | |||||
width: 180rpx; | width: 180rpx; | ||||
height: 250rpx; | |||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
align-items: center; | align-items: center; | ||||
image { | |||||
.avatar { | |||||
position: absolute; | |||||
width: 180rpx; | |||||
height: 180rpx; | |||||
border-radius: 24rpx; | |||||
} | |||||
.noUrlBox { | |||||
position: absolute; | |||||
width: 180rpx; | width: 180rpx; | ||||
height: 180rpx; | height: 180rpx; | ||||
line-height: 180rpx; | |||||
color: #ff4f00; | |||||
font-size: 50rpx; | |||||
font-weight: 900; | |||||
text-align: center; | |||||
border-radius: 24rpx; | |||||
background-color: #393a3d; | |||||
} | |||||
.maskTips { | |||||
position: absolute; | |||||
width: 180rpx; | |||||
height: 180rpx; | |||||
line-height: 180rpx; | |||||
color: #fff; | |||||
font-size: 20rpx; | |||||
font-weight: 900; | |||||
text-align: center; | |||||
border-radius: 24rpx; | |||||
background-color: rgba(0, 0, 0, 0.3); | |||||
} | } | ||||
.reUploadBtn, | .reUploadBtn, | ||||
.uploadBtn { | .uploadBtn { | ||||
margin-top: 20rpx; | |||||
margin-top: 200rpx; | |||||
width: 150rpx; | width: 150rpx; | ||||
height: 50rpx; | height: 50rpx; | ||||
text-align: center; | text-align: center; | ||||
@@ -7,31 +7,6 @@ | |||||
<view class="changeStyle" @click="changeStyle">更换风格</view> | <view class="changeStyle" @click="changeStyle">更换风格</view> | ||||
</view> | </view> | ||||
<!-- 轮播图 --> | <!-- 轮播图 --> | ||||
<!-- <u-swiper | |||||
v-if="createState == 2" | |||||
indicator | |||||
indicatorMode="dot" | |||||
:radius="30" | |||||
:autoplay="false" | |||||
:list="swiperList" | |||||
keyName="image" | |||||
@change="" | |||||
@click="" | |||||
></u-swiper> --> | |||||
<!-- <u-swiper | |||||
v-if="createState == 2" | |||||
height="320" | |||||
:list="swiperList" | |||||
keyName="image" | |||||
previousMargin="60" | |||||
nextMargin="60" | |||||
circular | |||||
indicator | |||||
indicatorMode="line" | |||||
:autoplay="false" | |||||
radius="5" | |||||
bgColor="#1f2123" | |||||
></u-swiper> --> | |||||
<u-swiper | <u-swiper | ||||
v-if="createState == 2" | v-if="createState == 2" | ||||
indicator | indicator | ||||
@@ -88,6 +63,7 @@ const styleData = ref(""); //风格信息 | |||||
onLoad((options) => { | onLoad((options) => { | ||||
workId.value = options.id; | workId.value = options.id; | ||||
// workId.value = "857147862095679488"; | // workId.value = "857147862095679488"; | ||||
getWorkInfo(); | getWorkInfo(); | ||||
// let getWindowInfo = uni.getWindowInfo().screenWidth; | // let getWindowInfo = uni.getWindowInfo().screenWidth; | ||||
@@ -129,9 +129,17 @@ function inviteFriend() { | |||||
//#region 页面跳转 | //#region 页面跳转 | ||||
function bueCoin() { | function bueCoin() { | ||||
uni.navigateTo({ | |||||
url: "/pages/home/buyCoin", | |||||
}); | |||||
if (userInfoModulesPinia.platForm == 3) { | |||||
uni.showToast({ | |||||
title: "暂未开放", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: "/pages/index/buyCoin", | |||||
}); | |||||
} | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -13,7 +13,7 @@ | |||||
</view> | </view> | ||||
<view class="buyBtn"> | <view class="buyBtn"> | ||||
<view class="btn" @click="createProductOrder">立刻购买</view> | <view class="btn" @click="createProductOrder">立刻购买</view> | ||||
<view class="pro" @click="goPro">《慧拍金币充值协议》</view> | |||||
<view class="pro" @click="goPro">《智像金币充值协议》</view> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -210,6 +210,7 @@ getList(); | |||||
.pro { | .pro { | ||||
text-align: center; | text-align: center; | ||||
color: #ff4f00; | color: #ff4f00; | ||||
font-size: 24rpx; | |||||
} | } | ||||
} | } | ||||
</style> | </style> |
@@ -30,9 +30,7 @@ | |||||
<view class="coinBox" v-if="userInfoModulesPinia.token"> | <view class="coinBox" v-if="userInfoModulesPinia.token"> | ||||
我的金币: {{ userInfoModulesPinia.myGlod }} | 我的金币: {{ userInfoModulesPinia.myGlod }} | ||||
<image src="../../assets/icon/icon.png" mode="scaleToFill" /> | <image src="../../assets/icon/icon.png" mode="scaleToFill" /> | ||||
<text class="buyCoinText" @click="goOtherPage('buyCoin', 2)" | |||||
>购买金币</text | |||||
></view | |||||
<text class="buyCoinText" @click="goBuyCoin">购买金币</text></view | |||||
> | > | ||||
<view class="coinBox" v-if="!userInfoModulesPinia.token" | <view class="coinBox" v-if="!userInfoModulesPinia.token" | ||||
>登录即可体验更多功能哦! | >登录即可体验更多功能哦! | ||||
@@ -70,9 +68,7 @@ | |||||
v-for="item in PhotoList" | v-for="item in PhotoList" | ||||
:key="item.id" | :key="item.id" | ||||
class="showListItem" | class="showListItem" | ||||
@click=" | |||||
goOtherPage(`/pages/lookPhoto/index?id=${item.id}`, item.status) | |||||
" | |||||
@click="goLookPhoto(item.id, item.status)" | |||||
> | > | ||||
<view class="top"> | <view class="top"> | ||||
<text class="name">{{ item.title }}</text> | <text class="name">{{ item.title }}</text> | ||||
@@ -116,11 +112,7 @@ | |||||
<!-- 空处理 --> | <!-- 空处理 --> | ||||
<view v-show="PhotoList.length == 0" class="noData" | <view v-show="PhotoList.length == 0" class="noData" | ||||
>暂无数据 , | >暂无数据 , | ||||
<text | |||||
@click="goOtherPage('/pages/closeStyle/closeStyle', 2)" | |||||
class="goCreate" | |||||
>去生成!</text | |||||
> | |||||
<text @click="goCloseStyle" class="goCreate">去生成!</text> | |||||
</view> | </view> | ||||
</scroll-view> | </scroll-view> | ||||
<!-- 显示视频列表内容 --> | <!-- 显示视频列表内容 --> | ||||
@@ -226,6 +218,7 @@ import { | |||||
findGlodApi, | findGlodApi, | ||||
getPhotoListApi, | getPhotoListApi, | ||||
getConsumeListApi, | getConsumeListApi, | ||||
getInviteListApi, | |||||
deleteApi, | deleteApi, | ||||
} from "../../api/home.js"; | } from "../../api/home.js"; | ||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
@@ -252,47 +245,25 @@ function chooseAvatar() { | |||||
url: "/pages/uploadPhoto/uploadPhoto", | url: "/pages/uploadPhoto/uploadPhoto", | ||||
}); | }); | ||||
return; | return; | ||||
uni.chooseImage({ | |||||
count: 1, // 最多可以选择的图片张数,这里设置为1,只选择一张图片 | |||||
success: async (res) => { | |||||
// avatarUrl.value = res.tempFilePaths[0]; | |||||
// TODO: 在这里处理图片上传逻辑,你可以调用上传接口将图片上传到服务器 | |||||
// 示例代码: | |||||
// uploadImageToServer(tempFilePaths[0]); | |||||
// 图片压缩 | |||||
console.log(res.tempFiles[0].size); | |||||
if (userInfoModulesPinia.platForm != 1) { | |||||
uni.compressImage({ | |||||
src: res.tempFilePaths[0], | |||||
quality: 20, | |||||
success: (res2) => { | |||||
avatarUrl.value = res2.tempFilePath; | |||||
console.log(res2.tempFilePath); | |||||
}, | |||||
}); | |||||
} else { | |||||
const options = { | |||||
maxSizeMB: 2, // 最大压缩大小为 4MB | |||||
useWebWorker: true, // 使用 Web Worker 进行压缩,提高性能 | |||||
}; | |||||
const compressedFile = await imageCompression( | |||||
res.tempFiles[0], | |||||
options | |||||
); | |||||
//compressedFile是一个blob对象 | |||||
avatarUrl.value = URL.createObjectURL(compressedFile); | |||||
console.log(compressedFile); | |||||
// avatarUrl.value = compressedFile; | |||||
console.log("压缩图片h5"); | |||||
} | |||||
}, | |||||
fail: (err) => { | |||||
console.error("选择图片失败", err); | |||||
}, | |||||
}); | |||||
} | } | ||||
//#endregion | |||||
function goOtherPage(url, status) { | |||||
//#region 路由跳转 | |||||
function goBuyCoin() { | |||||
if (userInfoModulesPinia.platForm == 3) { | |||||
uni.showToast({ | |||||
title: "暂未开放", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: "/pages/index/buyCoin", | |||||
}); | |||||
} | |||||
} | |||||
function goLookPhoto(id, status) { | |||||
if (status != 2) { | if (status != 2) { | ||||
uni.showToast({ | uni.showToast({ | ||||
title: "正在生成,请稍后", | title: "正在生成,请稍后", | ||||
@@ -301,9 +272,24 @@ function goOtherPage(url, status) { | |||||
return; | return; | ||||
} | } | ||||
uni.navigateTo({ | uni.navigateTo({ | ||||
url: url, | |||||
url: `/pages/lookPhoto/index?id=${id}`, | |||||
}); | }); | ||||
} | } | ||||
function goCloseStyle() { | |||||
if (!userInfoModulesPinia.myAvatar) { | |||||
uni.showToast({ | |||||
title: "请先上传头像", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: `/pages/closeStyle/closeStyle`, | |||||
}); | |||||
} | |||||
} | |||||
//#endregion | //#endregion | ||||
//#region tab | //#region tab | ||||
@@ -319,13 +305,14 @@ function clickTabHandle(e) { | |||||
return; | return; | ||||
} | } | ||||
showListActive.value = e.id; | showListActive.value = e.id; | ||||
pageNum1.value = 1; | pageNum1.value = 1; | ||||
pageNum2.value = 1; | pageNum2.value = 1; | ||||
pageNum3.value = 1; | |||||
if (e.id == 1) { | if (e.id == 1) { | ||||
getPhotoList(pageSize1.value, pageNum1.value); | getPhotoList(pageSize1.value, pageNum1.value); | ||||
} else if (e.id == 2) { | } else if (e.id == 2) { | ||||
} else if (e.id == 3) { | } else if (e.id == 3) { | ||||
getInviteList(pageSize3.value, pageNum3.value); | |||||
} else if (e.id == 4) { | } else if (e.id == 4) { | ||||
getConsumeList(pageSize2.value, pageNum2.value); | getConsumeList(pageSize2.value, pageNum2.value); | ||||
} | } | ||||
@@ -412,11 +399,44 @@ function getSymbol(type) { | |||||
if ([1, 2, 3].includes(type)) { | if ([1, 2, 3].includes(type)) { | ||||
return "+"; | return "+"; | ||||
} else { | } else { | ||||
return "-"; | |||||
return ""; | |||||
} | } | ||||
} | } | ||||
//#endregion 获取图片,金币, | //#endregion 获取图片,金币, | ||||
//#region 获取消费记录 | |||||
const pageSize3 = ref(20); | |||||
const pageNum3 = ref(1); | |||||
const InviteList = ref(20); | |||||
async function getInviteList(pageSize, pageNum) { | |||||
try { | |||||
const res = await getInviteListApi(pageSize, pageNum); | |||||
InviteList.value = res.data.list; | |||||
} catch (error) {} | |||||
} | |||||
/** | |||||
* @description:触底加载更多消费记录 | |||||
*/ | |||||
async function getMoreInviteList() { | |||||
try { | |||||
pageNum2.value += 1; | |||||
const res = await getInviteListApi(pageSize3.value, pageNum3.value); | |||||
if (res.data && res.data.list && res.data.list.length == 0) { | |||||
pageNum3.value -= 1; | |||||
} | |||||
InviteList.value.push(...res.data.list); | |||||
} catch (error) { | |||||
console.log(error, "error"); | |||||
uni.showToast({ | |||||
title: "获取数据失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} | |||||
//#endregion | |||||
const myAvatar = ref( | const myAvatar = ref( | ||||
"https://suimang.oss-accelerate.aliyuncs.com/capi/2023-08-25/03b58cd2f52c49829435addbf1ec435a.jpg?x-oss-process=image/resize,w_10000/quality,q_60" | "https://suimang.oss-accelerate.aliyuncs.com/capi/2023-08-25/03b58cd2f52c49829435addbf1ec435a.jpg?x-oss-process=image/resize,w_10000/quality,q_60" | ||||
); | ); | ||||
@@ -494,6 +514,7 @@ onLoad(async () => { | |||||
findGlod(); | findGlod(); | ||||
getPhotoList(pageSize1.value, pageNum1.value); | getPhotoList(pageSize1.value, pageNum1.value); | ||||
getConsumeList(pageSize2.value, pageNum2.value); | getConsumeList(pageSize2.value, pageNum2.value); | ||||
getInviteList(pageSize3.value, pageNum3.value); | |||||
} | } | ||||
// setTimeout(() => { | // setTimeout(() => { | ||||
// findImage(); | // findImage(); | ||||
@@ -706,12 +727,13 @@ onShareAppMessage((res) => { | |||||
} | } | ||||
} | } | ||||
} | } | ||||
.noData { | |||||
text-align: center; | |||||
.goCreate { | |||||
color: #ff4f00; | |||||
text-decoration: underline; | |||||
} | |||||
} | |||||
.noData { | |||||
margin-top: 20rpx; | |||||
text-align: center; | |||||
.goCreate { | |||||
color: #ff4f00; | |||||
text-decoration: underline; | |||||
} | } | ||||
} | } | ||||
// 视频列表 | // 视频列表 | ||||
@@ -20,7 +20,7 @@ | |||||
</view> | </view> | ||||
<view class="bottomBox"> | <view class="bottomBox"> | ||||
<button | <button | ||||
v-if="!checkboxValue[0]" | |||||
v-if="!checkboxValue[0] && userInfoModulesPinia.platForm == 2" | |||||
class="bottomBtn" | class="bottomBtn" | ||||
type="default" | type="default" | ||||
id="getPhoneNumber" | id="getPhoneNumber" | ||||
@@ -29,7 +29,7 @@ | |||||
开始制作我的数字写真 | 开始制作我的数字写真 | ||||
</button> | </button> | ||||
<button | <button | ||||
v-if="checkboxValue[0]" | |||||
v-if="checkboxValue[0] && userInfoModulesPinia.platForm == 2" | |||||
class="bottomBtn" | class="bottomBtn" | ||||
open-type="getPhoneNumber" | open-type="getPhoneNumber" | ||||
type="default" | type="default" | ||||
@@ -38,8 +38,31 @@ | |||||
> | > | ||||
开始制作我的数字写真 | 开始制作我的数字写真 | ||||
</button> | </button> | ||||
<!-- 抖音获取手机号 --> | |||||
<!-- <button | |||||
v-if="userInfoModulesPinia.platForm == 3" | |||||
class="bottomBtn" | |||||
open-type="getPhoneNumber" | |||||
type="default" | |||||
id="getPhoneNumber" | |||||
@getphonenumber="dogetphonenumber" | |||||
> | |||||
开始制作我的数字分身 | |||||
</button> --> | |||||
<!-- 手机号登录 --> | |||||
<button | |||||
v-if="userInfoModulesPinia.platForm == 3" | |||||
class="bottomBtn" | |||||
type="default" | |||||
id="getPhoneNumber" | |||||
@click="phoneLogin" | |||||
> | |||||
开始制作我的数字分身 | |||||
</button> | |||||
<!-- <view class="bottomBtn" @click="toCreate"> 开始制作我的数字写真 </view> --> | <!-- <view class="bottomBtn" @click="toCreate"> 开始制作我的数字写真 </view> --> | ||||
<!-- 同意协议 --> | |||||
<u-checkbox-group | <u-checkbox-group | ||||
v-if="userInfoModulesPinia.platForm == 2" | |||||
v-model="checkboxValue" | v-model="checkboxValue" | ||||
placement="row" | placement="row" | ||||
@change="changedCheckbox" | @change="changedCheckbox" | ||||
@@ -57,6 +80,71 @@ | |||||
</text> | </text> | ||||
</u-checkbox-group> | </u-checkbox-group> | ||||
</view> | </view> | ||||
<!-- 手机号验证码登录 --> | |||||
<view class="phoneLoginForm" v-show="userInfoModulesPinia.platForm == 3"> | |||||
<u--form | |||||
labelPosition="left" | |||||
:model="formData" | |||||
:rules="rules" | |||||
ref="formRef" | |||||
> | |||||
<u-form-item | |||||
labelWidth="80" | |||||
label="手机号" | |||||
prop="phoneNum" | |||||
borderBottom | |||||
ref="form1" | |||||
> | |||||
<u--input | |||||
type="number" | |||||
v-model="formData.phoneNum" | |||||
border="none" | |||||
></u--input> | |||||
</u-form-item> | |||||
<!-- 获取验证码 --> | |||||
<!-- 验证码 --> | |||||
<view class="getCodeBtn" @click="getCode"> | |||||
{{ backwardsNum < 60 ? backwardsNum + "s" : "发送验证码" }} | |||||
</view> | |||||
<!-- <view v-if="backwardsNums <= 0" class="getCodeBtn">{{ | |||||
backwardsNum | |||||
}}</view> --> | |||||
<u-form-item labelWidth="80" label="验证码 " borderBottom ref="form2"> | |||||
<u--input | |||||
type="number" | |||||
v-model="formData.codeNum" | |||||
border="none" | |||||
></u--input> | |||||
</u-form-item> | |||||
</u--form> | |||||
<view class="loginBtn" @click="loginByCode">登录</view> | |||||
</view> | |||||
<view class="outSide" v-if="showPrivacy"> | |||||
<view class="showPrivacy"> | |||||
<view class="title">隐私协议更新</view> | |||||
<view class="content"> | |||||
感谢您一直以来对我们的信任和支持。为了更好地保护您的个人信息安全我们已经更新了隐私协议。如您继续使用我们的服务即表示同意并接受更新后的隐私协议。如您有任何疑问或意见,欢迎您联系我们的客户服务团队。 | |||||
</view> | |||||
<button | |||||
class="agree" | |||||
type="primary" | |||||
open-type="agreePrivacyAuthorization" | |||||
@agreeprivacyauthorization="handleAgreePrivacyAuthorization" | |||||
> | |||||
同意 | |||||
</button> | |||||
<button class="check" @click="handleOpenPrivacyContract"> | |||||
查看《隐私保护指引》 | |||||
</button> | |||||
<image | |||||
@click="closePrivacy" | |||||
class="delete" | |||||
src="../../assets/icon/delete.png" | |||||
mode="" | |||||
/> | |||||
</view> | |||||
</view> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -64,11 +152,18 @@ | |||||
//#region 导入 | //#region 导入 | ||||
import { ref, reactive, computed } from "vue"; | import { ref, reactive, computed } from "vue"; | ||||
import { onLoad } from "@dcloudio/uni-app"; | import { onLoad } from "@dcloudio/uni-app"; | ||||
import { voiceTotalApi, loginPhoneApi } from "../../api/login.js"; | |||||
import { | |||||
loginApi, | |||||
loginPhoneApi, | |||||
getCodeApi, | |||||
loginByCodeApi, | |||||
} from "../../api/login.js"; | |||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
//#endregion | //#endregion | ||||
const userInfoModulesPinia = userInfoModules(); | const userInfoModulesPinia = userInfoModules(); | ||||
const showPrivacy = ref(false); | |||||
const pageClass = computed(() => { | const pageClass = computed(() => { | ||||
if (userInfoModulesPinia.platForm == 1) { | if (userInfoModulesPinia.platForm == 1) { | ||||
return "page pageH5"; | return "page pageH5"; | ||||
@@ -76,7 +171,7 @@ const pageClass = computed(() => { | |||||
return "page"; | return "page"; | ||||
} | } | ||||
}); | }); | ||||
//#region 勾选 | |||||
//#region 勾选和手机号授权 | |||||
const checkboxValue = ref([]); | const checkboxValue = ref([]); | ||||
const checkboxList = ref([ | const checkboxList = ref([ | ||||
{ | { | ||||
@@ -87,15 +182,17 @@ function changedCheckbox(e) { | |||||
console.log(e); | console.log(e); | ||||
} | } | ||||
async function getphonenumber(e) { | |||||
console.log(e); | |||||
async function dogetphonenumber(e) { | |||||
console.log(e, "e"); | |||||
if (e.detail.errMsg.includes("ok")) { | if (e.detail.errMsg.includes("ok")) { | ||||
// if (e.detail.errMsg.includes("fail")) { | |||||
//用户授权了手机号 | //用户授权了手机号 | ||||
const data = { | const data = { | ||||
appId: "wx75cf14e3a0d45821", | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
openId: userInfoModulesPinia.openId, | openId: userInfoModulesPinia.openId, | ||||
encryptedData: e.detail.encryptedData, | encryptedData: e.detail.encryptedData, | ||||
iv: e.detail.iv, | iv: e.detail.iv, | ||||
uid: urlUid.value, | |||||
}; | }; | ||||
try { | try { | ||||
const res2 = await loginPhoneApi(data); | const res2 = await loginPhoneApi(data); | ||||
@@ -110,7 +207,7 @@ async function getphonenumber(e) { | |||||
} catch (error) { | } catch (error) { | ||||
uni.showToast({ | uni.showToast({ | ||||
icon: "none", | icon: "none", | ||||
title: "获取失败", | |||||
title: "获取手机号失败", | |||||
}); | }); | ||||
} | } | ||||
} else { | } else { | ||||
@@ -126,7 +223,7 @@ async function toCreate(e) { | |||||
console.log(); | console.log(); | ||||
if (checkboxValue.value[0]) { | if (checkboxValue.value[0]) { | ||||
// await handleLogin(); | // await handleLogin(); | ||||
await getphonenumber(e); | |||||
await dogetphonenumber(e); | |||||
} else { | } else { | ||||
uni.showModal({ | uni.showModal({ | ||||
title: "提示", | title: "提示", | ||||
@@ -135,7 +232,7 @@ async function toCreate(e) { | |||||
if (res.confirm) { | if (res.confirm) { | ||||
checkboxValue.value = ["同意智像相机用户使用协议"]; | checkboxValue.value = ["同意智像相机用户使用协议"]; | ||||
// handleLogin(); | // handleLogin(); | ||||
getphonenumber(e); | |||||
dogetphonenumber(e); | |||||
} else if (res.cancel) { | } else if (res.cancel) { | ||||
} | } | ||||
}, | }, | ||||
@@ -192,23 +289,343 @@ const goPro = () => { | |||||
}; | }; | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region | |||||
//#region 抖音手机号登录 | |||||
const formData = ref({ | |||||
phoneNum: null, | |||||
codeNum: null, | |||||
}); | |||||
const rules = { | |||||
phoneNum: [ | |||||
{ | |||||
required: true, | |||||
message: "请填写手机号", | |||||
trigger: ["blur"], | |||||
}, | |||||
{ | |||||
// 自定义验证函数,见上说明 | |||||
validator: (rule, value, callback) => { | |||||
// 上面有说,返回true表示校验通过,返回false表示不通过 | |||||
// uni.$u.test.mobile()就是返回true或者false的 | |||||
return uni.$u.test.mobile(value); | |||||
}, | |||||
message: "手机号码不正确", | |||||
// 触发器可以同时用blur和change | |||||
trigger: ["blur"], | |||||
}, | |||||
], | |||||
}; | |||||
const formRef = ref(null); | |||||
const form1 = ref(null); | |||||
const backwardsNum = ref(60); | |||||
const countdownTimer = ref(null); // 倒计时的计时器 | |||||
const timerFlag = ref(false); | |||||
function getCode() { | |||||
if (timerFlag.value) { | |||||
return; // 如果倒计时尚未结束,不执行倒计时操作 | |||||
} | |||||
timerFlag.value = true; | |||||
formRef.value | |||||
.validate() | |||||
.then(async (res) => { | |||||
try { | |||||
uni.showLoading({ | |||||
title: "请稍后", | |||||
mask: true, | |||||
}); | |||||
const res = await getCodeApi(formData.value.phoneNum); | |||||
console.log(res.code, "duanxing"); | |||||
uni.hideLoading(); | |||||
if (res.code != 200) { | |||||
uni.showToast({ | |||||
title: res.message, | |||||
icon: "none", | |||||
}); | |||||
} | |||||
console.log(res); | |||||
// 表单验证通过后开始倒计时 | |||||
countdownTimer.value = setInterval(() => { | |||||
if (backwardsNum.value > 0) { | |||||
backwardsNum.value--; | |||||
} else { | |||||
clearInterval(countdownTimer.value); | |||||
countdownTimer.value = null; | |||||
backwardsNum.value = 60; | |||||
timerFlag.value = false; | |||||
} | |||||
}, 1000); | |||||
} catch (error) { | |||||
uni.hideLoading(); | |||||
uni.$u.toast("短信验证码获取失败"); | |||||
clearInterval(countdownTimer.value); | |||||
countdownTimer.value = null; | |||||
backwardsNum.value = 5; | |||||
timerFlag.value = false; | |||||
} | |||||
}) | |||||
.catch((errors) => { | |||||
console.log(errors); | |||||
}); | |||||
} | |||||
async function loginByCode() { | |||||
uni.showLoading({ | |||||
title: "请稍后", | |||||
mask: true, | |||||
}); | |||||
const data = { | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
openId: userInfoModulesPinia.openId, | |||||
phone: formData.value.phoneNum, | |||||
code: formData.value.codeNum, | |||||
}; | |||||
try { | |||||
const res = await loginByCodeApi(data); | |||||
console.log(res); | |||||
uni.hideLoading(); | |||||
userInfoModulesPinia.token = res.data.token; | |||||
console.log(res.code, "denglu"); | |||||
if (res.code != 200) { | |||||
uni.showToast({ | |||||
title: res.message, | |||||
icon: "none", | |||||
}); | |||||
} else { | |||||
// uni.switchTab({ | |||||
// url: "/pages/uploadPhoto/uploadPhoto", | |||||
// }); | |||||
} | |||||
} catch (error) { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} | |||||
//#endregion --------------------- | |||||
//#region 隐私协议 | |||||
const getPrivacySetting = (num) => { | |||||
const canIUsePrivacy = wx.canIUse("getPrivacySetting"); | |||||
// console.log(canIUsePrivacy, "canIUse getPrivacySetting"); | |||||
if (canIUsePrivacy) { | |||||
wx.getPrivacySetting({ | |||||
success: (res) => { | |||||
// console.log(res, "getPrivacySetting"); // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' } | |||||
if (res.needAuthorization) { | |||||
// 需要弹出隐私协议 | |||||
showPrivacy.value = true; | |||||
} else { | |||||
// 用户已经同意过隐私协议,所以不需要再弹出隐私协议,也能调用已声明过的隐私接口 | |||||
if (num == 1) { | |||||
// 返回token,直接跳转首页 | |||||
// uni.switchTab({ | |||||
// url: "/pages/uploadPhoto/uploadPhoto", | |||||
// }); | |||||
} else if (num == 2) { | |||||
// 没有返回token,无事发生 | |||||
} | |||||
} | |||||
}, | |||||
fail: () => {}, | |||||
complete: () => {}, | |||||
}); | |||||
} | |||||
}; | |||||
// 关闭弹框直接退出小程序,仅对微信小程序生效 | |||||
const closePrivacy = () => { | |||||
wx.exitMiniProgram(); | |||||
}; | |||||
const handleAgreePrivacyAuthorization = () => { | |||||
// console.log("Privacy Agreed!"); | |||||
showPrivacy.value = false; | |||||
// 用户同意隐私协议事件回调 | |||||
// 用户点击了同意,之后所有已声明过的隐私接口和组件都可以调用了 | |||||
}; | |||||
const handleOpenPrivacyContract = () => { | |||||
// 打开隐私协议页面 | |||||
wx.openPrivacyContract({ | |||||
success: () => {}, // 打开成功 | |||||
fail: () => {}, // 打开失败 | |||||
complete: () => {}, | |||||
}); | |||||
}; | |||||
//#endregion --------------------------------- | |||||
//#region 初始化 | |||||
const urlUid = ref(""); //通过邀请来的会携带邀请人ID参数 | |||||
onLoad((options) => { | onLoad((options) => { | ||||
// 二维码扫描进入时 | |||||
if (options.scene) { | |||||
const str = decodeURIComponent(options.scene); | |||||
const regex = /_u:(\d+)/; // 正则表达式匹配_u:后面的数字 | |||||
const match = str.match(regex); | |||||
urlUid.value = match[1]; | |||||
} | |||||
// 分享链接进入时 | |||||
else if (options.userId) { | |||||
urlUid.value = options.userId; | |||||
} else { | |||||
urlUid.value = null; | |||||
} | |||||
console.log(urlUid.value, "邀请人id"); | |||||
uni.hideHomeButton(); | uni.hideHomeButton(); | ||||
// workId.value = options.id; | // workId.value = options.id; | ||||
if (options.type == "tokenFfalse") { | if (options.type == "tokenFfalse") { | ||||
uni.showToast({ | uni.showToast({ | ||||
title: "登录失效,请重新登录", | title: "登录失效,请重新登录", | ||||
icon: "none", | icon: "none", | ||||
}); | }); | ||||
} | } | ||||
if (userInfoModulesPinia.platForm == 2) { | |||||
uni.login({ | |||||
provider: "weixin", // 使用微信登录授权 | |||||
success: async (res) => { | |||||
if (res.code) { | |||||
try { | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
const data = { | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
code: res.code, | |||||
}; | |||||
const res2 = await loginApi(data); | |||||
userInfoModulesPinia.openId = res2.data.openId; | |||||
if (res2.data.token) { | |||||
userInfoModulesPinia.token = res2.data.token; | |||||
// uni.setStorageSync("token", userInfoModulesPinia.token); | |||||
console.log(userInfoModulesPinia.openId, "获取openid"); | |||||
// 获取头像和金币 | |||||
// const res3 = await findImageApi(); | |||||
// userInfoModulesPinia.myAvatar = | |||||
// res3.data && res3.data.image ? res3.data.image : ""; | |||||
// const res4 = await findGlodApi(); | |||||
// if (!res4.data) { | |||||
// userInfoModulesPinia.myGlod = 0; | |||||
// } else { | |||||
// userInfoModulesPinia.myGlod = res4.data.digitalAvatarResidueGlod | |||||
// ? res4.data.digitalAvatarResidueGlod | |||||
// : 0; | |||||
// } | |||||
uni.hideLoading(); | |||||
if (res2.data.token) { | |||||
getPrivacySetting(1); | |||||
} else { | |||||
console.log("error1"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} else { | |||||
getPrivacySetting(2); | |||||
} | |||||
uni.hideLoading(); | |||||
} catch (error) { | |||||
// uni.redirectTo({ | |||||
// url: "pages/index/index", | |||||
// }); | |||||
console.log(error, "error2"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} else { | |||||
// uni.redirectTo({ | |||||
// url: "pages/index/index", | |||||
// }); | |||||
console.log("error3"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
}, | |||||
fail: (err) => { | |||||
// uni.redirectTo({ | |||||
// url: "pages/index/index", | |||||
// }); | |||||
console.log("error4"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
// 抖音头条授权 | |||||
else if (userInfoModulesPinia.platForm == 3) { | |||||
uni.login({ | |||||
provider: "toutiao", // 使用微信登录授权 | |||||
success: async (res) => { | |||||
if (res.code) { | |||||
try { | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
const data = { | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
code: res.code, | |||||
}; | |||||
const res2 = await loginApi(data); | |||||
userInfoModulesPinia.openId = res2.data.openId; | |||||
if (res2.data.token) { | |||||
userInfoModulesPinia.token = res2.data.token; | |||||
// uni.setStorageSync("token", userInfoModulesPinia.token); | |||||
console.log(userInfoModulesPinia.openId, "获取openid"); | |||||
uni.hideLoading(); | |||||
} else { | |||||
uni.hideLoading(); | |||||
// uni.redirectTo({ | |||||
// url: "/pages/login/index", | |||||
// }); | |||||
console.log("error1"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
uni.hideLoading(); | |||||
} catch (error) { | |||||
uni.hideLoading(); | |||||
console.log(error, "error2"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} else { | |||||
console.log("error3"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
}, | |||||
fail: (err) => { | |||||
console.log("error4"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
}); | }); | ||||
//#endregion --------------------------------- | //#endregion --------------------------------- | ||||
//#region | //#region | ||||
//#endregion --------------------------------- | //#endregion --------------------------------- | ||||
// voiceTotalApi(); | |||||
</script> | </script> | ||||
<style lang="scss"> | <style lang="scss"> | ||||
@@ -217,13 +634,16 @@ onLoad((options) => { | |||||
padding: 0; | padding: 0; | ||||
min-height: 100vh; | min-height: 100vh; | ||||
} | } | ||||
.bgImg { | .bgImg { | ||||
width: 750rpx; | width: 750rpx; | ||||
height: 100vh; | height: 100vh; | ||||
} | } | ||||
.videoBox { | .videoBox { | ||||
width: 750rpx; | width: 750rpx; | ||||
height: 1120rpx; | height: 1120rpx; | ||||
// aspect-ratio: 9/12; | // aspect-ratio: 9/12; | ||||
video { | video { | ||||
width: 100%; | width: 100%; | ||||
@@ -231,6 +651,7 @@ onLoad((options) => { | |||||
// aspect-ratio: 9/12; | // aspect-ratio: 9/12; | ||||
} | } | ||||
} | } | ||||
.bottomBox { | .bottomBox { | ||||
position: absolute; | position: absolute; | ||||
bottom: 0; | bottom: 0; | ||||
@@ -241,6 +662,7 @@ onLoad((options) => { | |||||
align-items: center; | align-items: center; | ||||
background-color: rgba(0, 0, 0, 0.8); | background-color: rgba(0, 0, 0, 0.8); | ||||
color: #fff !important; | color: #fff !important; | ||||
.bottomBtn { | .bottomBtn { | ||||
margin-top: 55rpx; | margin-top: 55rpx; | ||||
margin-bottom: 65rpx; | margin-bottom: 65rpx; | ||||
@@ -254,13 +676,105 @@ onLoad((options) => { | |||||
font-size: 30rpx; | font-size: 30rpx; | ||||
font-weight: 900; | font-weight: 900; | ||||
} | } | ||||
.checkPro { | .checkPro { | ||||
display: inline-block; | display: inline-block; | ||||
height: 27rpx; | height: 27rpx; | ||||
line-height: 54rpx; | line-height: 54rpx; | ||||
.goPro { | .goPro { | ||||
color: #ff4f00; | color: #ff4f00; | ||||
} | } | ||||
} | } | ||||
} | } | ||||
.phoneLoginForm { | |||||
position: absolute; | |||||
top: 20%; | |||||
left: 30rpx; | |||||
width: 690rpx; | |||||
z-index: 9; | |||||
background-color: #fff; | |||||
padding: 30rpx; | |||||
.u-code { | |||||
width: 100%; | |||||
height: 50rpx; | |||||
background-color: green; | |||||
color: #ff4f00; | |||||
} | |||||
.getCodeBtn { | |||||
background-color: green; | |||||
text-align: center; | |||||
line-height: 50rpx; | |||||
} | |||||
.loginBtn { | |||||
background-color: #ff4f00; | |||||
text-align: center; | |||||
line-height: 50rpx; | |||||
} | |||||
} | |||||
.outSide { | |||||
position: fixed; | |||||
top: 0; | |||||
left: 0; | |||||
width: 100%; | |||||
height: 100%; | |||||
color: #000000; | |||||
background-color: #00000059; | |||||
.showPrivacy { | |||||
position: fixed; | |||||
width: 520rpx; | |||||
background-color: #fff; | |||||
left: 50%; | |||||
top: 50%; | |||||
transform: translate(-50%, -50%); | |||||
padding: 60rpx 50rpx; | |||||
border-radius: 20rpx; | |||||
box-shadow: #00000047 2px 1px 2px 2px; | |||||
.title { | |||||
text-align: center; | |||||
font-size: 30rpx; | |||||
font-weight: 600; | |||||
} | |||||
.content { | |||||
text-indent: 2em; | |||||
margin: 40rpx 0; | |||||
} | |||||
button { | |||||
width: 350rpx; | |||||
&.agree { | |||||
margin-bottom: 25rpx; | |||||
background-color: #ff4f00; | |||||
} | |||||
&.check { | |||||
background-color: #ffffff00; | |||||
font-size: 21rpx; | |||||
text-decoration: underline; | |||||
padding: 0; | |||||
&::after { | |||||
border: none; | |||||
} | |||||
} | |||||
} | |||||
.delete { | |||||
position: absolute; | |||||
top: 15rpx; | |||||
right: 15rpx; | |||||
width: 65rpx; | |||||
height: 65rpx; | |||||
} | |||||
} | |||||
} | |||||
</style> | </style> |
@@ -2,6 +2,7 @@ | |||||
<view class="page"> | <view class="page"> | ||||
<!-- 轮播图 --> | <!-- 轮播图 --> | ||||
<u-swiper | <u-swiper | ||||
v-if="createState == 2" | |||||
indicator | indicator | ||||
indicatorMode="dot" | indicatorMode="dot" | ||||
circular | circular | ||||
@@ -12,7 +13,14 @@ | |||||
@change="getSwiperIndex" | @change="getSwiperIndex" | ||||
@click="previewImage" | @click="previewImage" | ||||
></u-swiper> | ></u-swiper> | ||||
<view class="checkMore">左右滑动查看更多</view> | |||||
<image | |||||
v-if="createState != 2" | |||||
class="logo" | |||||
src="../../assets/img/logo-4.png" | |||||
mode="aspectFit" | |||||
/> | |||||
<view v-if="createState == 2" class="checkMore">左右滑动查看更多</view> | |||||
<view v-if="createState != 2" class="wait">生成中,请稍后...</view> | |||||
<!-- <view class="uploadBtn grayBtn"> | <!-- <view class="uploadBtn grayBtn"> | ||||
<text>我要让照片说话</text> | <text>我要让照片说话</text> | ||||
<view class="free"> | <view class="free"> | ||||
@@ -22,58 +30,91 @@ | |||||
<view @click="downloadImg" class="uploadBtn"> | <view @click="downloadImg" class="uploadBtn"> | ||||
<text>下载照片</text> | <text>下载照片</text> | ||||
</view> | </view> | ||||
<view class="grayBtn" @click="photoSupper"> | |||||
<view class="grayBtn" @click="goChooseStyle"> | |||||
重新生成 | |||||
<!-- <view v-if="supperPhotoState == 0 || supperPhotoState == 3" class="free"> | <!-- <view v-if="supperPhotoState == 0 || supperPhotoState == 3" class="free"> | ||||
<text>耗金币1枚</text> | <text>耗金币1枚</text> | ||||
</view> --> | |||||
{{ supperTips() }} | |||||
</view> | |||||
{{ supperTips() }} --> | |||||
</view> | </view> | ||||
<!-- 底部 --> | <!-- 底部 --> | ||||
<view class="bottomBox"> | <view class="bottomBox"> | ||||
<view class="tips"> | |||||
<view v-if="createState == 2" class="tips"> | |||||
<text>邀请好友可获得2枚金币</text> | <text>邀请好友可获得2枚金币</text> | ||||
</view> | </view> | ||||
<view class="shareBtn" @click="share">分享</view> | |||||
<view class="shareBtn" @click="inviteFriend">邀请好友</view> | |||||
<button open-type="share" class="shareBtn">分享</button> | |||||
<view v-if="createState == 2" class="shareBtn" @click="getUserQrcode" | |||||
>邀请好友</view | |||||
> | |||||
<view class="shareBtn" @click="buyCoin">金币充值</view> | <view class="shareBtn" @click="buyCoin">金币充值</view> | ||||
</view> | </view> | ||||
<!-- 画报 --> | |||||
<view v-if="showPictorial" class="pictorialBox"> | |||||
<image show-menu-by-longpress :src="pictorialUrl" mode="scaleToFill" /> | |||||
<text>长按保存、分享、收藏</text> | |||||
<view class="orangeBtn" @click="showPictorial = fales">关闭</view> | |||||
</view> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
<script setup> | <script setup> | ||||
// import myloading from '../../components/myLoading.vue' | |||||
//#region 导入 | //#region 导入 | ||||
import { onLoad } from "@dcloudio/uni-app"; | |||||
import { | |||||
onLoad, | |||||
onHide, | |||||
onShareAppMessage, | |||||
onShareTimeline, | |||||
} from "@dcloudio/uni-app"; | |||||
import { BASE_URL } from "../../utils/request"; | |||||
import { ref, reactive, watch } from "vue"; | import { ref, reactive, watch } from "vue"; | ||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
import { | import { | ||||
getPhotoListApi, | getPhotoListApi, | ||||
photoSupperApi, | photoSupperApi, | ||||
getSupperPhotoStateApi, | getSupperPhotoStateApi, | ||||
getUserQrcodeApi, | |||||
} from "../../api/lookPhoto.js"; | } from "../../api/lookPhoto.js"; | ||||
//#endregion | //#endregion | ||||
const userInfoModulesPinia = userInfoModules(); | const userInfoModulesPinia = userInfoModules(); | ||||
//#region 轮播图 | //#region 轮播图 | ||||
const createState = ref(null); //制作状态:1生成中,2完成,3失败 | |||||
const workId = ref(null); //作品id | const workId = ref(null); //作品id | ||||
onLoad(async (options) => { | onLoad(async (options) => { | ||||
workId.value = options.id; | workId.value = options.id; | ||||
await getSwiperList(); | await getSwiperList(); | ||||
await getSupperPhotoState(swiperList.value[0].id); | await getSupperPhotoState(swiperList.value[0].id); | ||||
}); | }); | ||||
onHide(() => { | |||||
clearTimeout(timer); | |||||
timer.value = null; | |||||
}); | |||||
const swiperList = ref([]); //轮播图 | const swiperList = ref([]); //轮播图 | ||||
const previewImageList = ref([]); //预览图片列表 | const previewImageList = ref([]); //预览图片列表 | ||||
const timer = ref(null); | |||||
async function getSwiperList() { | async function getSwiperList() { | ||||
const res = await getPhotoListApi(workId.value); | const res = await getPhotoListApi(workId.value); | ||||
console.log(res.data.photoList); | |||||
swiperList.value = res.data.photoList; | |||||
swiperList.value.forEach((item) => { | |||||
if (item.imageSuper) { | |||||
previewImageList.value.push(item.imageSuper); | |||||
} else { | |||||
previewImageList.value.push(item.image); | |||||
} | |||||
}); | |||||
createState.value = res.data.status; | |||||
if (res.data.photoList) { | |||||
swiperList.value = res.data.photoList; | |||||
swiperList.value.forEach((item) => { | |||||
if (item.imageSuper) { | |||||
previewImageList.value.push(item.imageSuper); | |||||
} else { | |||||
previewImageList.value.push(item.image); | |||||
} | |||||
}); | |||||
} | |||||
if (createState.value != 2) { | |||||
timer.value = setTimeout(() => { | |||||
getSwiperList(); | |||||
}, 3000); | |||||
} else { | |||||
clearTimeout(timer); | |||||
timer.value = null; | |||||
} | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -159,68 +200,89 @@ function previewImage(index) { | |||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 分享 | //#region 分享 | ||||
// onShareAppMessage((res) => { | |||||
// // 分享事件来源:button(页面内分享按钮)、menu(右上角分享按钮) | |||||
// if (res.from === "button") { | |||||
// // 来自页面内分享按钮 | |||||
// return { | |||||
// //分享标题 | |||||
// title: "智像", | |||||
// //页面 path | |||||
// path: `/pages/login/index`, | |||||
// // 分享图标 | |||||
// // imageUr: shopDetailsData.value?.GoodsCoverImg, | |||||
// success: function () { | |||||
// // 转发成功 | |||||
// console.log("res", res); | |||||
// }, | |||||
// fail: function () { | |||||
// // 转发失败 | |||||
// console.log("res", res); | |||||
// }, | |||||
// }; | |||||
// } else { | |||||
// return { | |||||
// title: "智像", | |||||
// path: "/pages/login/index", | |||||
// // imageUr: shopDetailsData.value?.GoodsCoverImg, | |||||
// }; | |||||
// } | |||||
// }); | |||||
// onShareAppMessage((res) => { | |||||
// return { | |||||
// title: "页面分享的标题", | |||||
// path: "pages/uploadPhoto/uploadPhoto", | |||||
// // imageUrl: "", | |||||
// }; | |||||
// }); | |||||
function share() { | function share() { | ||||
uni.showToast({ | |||||
title: "敬请期待!", | |||||
icon: "none", | |||||
}); | |||||
return; | |||||
uni.share({ | |||||
provider: "weixin", //分享服务提供商(即weixin|qq|sinaweibo) | |||||
scene: "WXSenceTimeline", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏) | |||||
type: 5, | |||||
title: "分享到朋友圈", | |||||
summary: "分享描述", | |||||
href: "www.baidu.com", //分享跳转地址 | |||||
imageUrl: "../static/lovehot.png", //分享图片路径(必须是线上可访问图片) | |||||
miniProgram: { | |||||
id: "wx75cf14e3a0d45821", | |||||
path: "pages/index/index", | |||||
type: 0, | |||||
webUrl: "", | |||||
}, | |||||
success: function (res) { | |||||
// console.log("success:" + JSON.stringify(res)); | |||||
}, | |||||
fail: function (err) { | |||||
// console.log("fail:" + JSON.stringify(err)); | |||||
}, | |||||
}); | |||||
} | |||||
function inviteFriend() { | |||||
uni.showToast({ | |||||
title: "敬请期待!", | |||||
icon: "none", | |||||
}); | |||||
return; | |||||
uni.share({ | |||||
provider: "weixin", //分享服务提供商(即weixin|qq|sinaweibo) | |||||
scene: "WXSceneSession", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏) | |||||
type: 5, | |||||
title: "分享给好友", | |||||
summary: "分享描述", | |||||
href: "www.baidu.com", //分享跳转地址 | |||||
imageUrl: "../static/lovehot.png", //分享图片路径(必须是线上可访问图片) | |||||
miniProgram: { | |||||
id: "gwx75cf14e3a0d45821", | |||||
path: "pages/index/index", | |||||
type: 0, | |||||
webUrl: "", | |||||
}, | |||||
success: function (res) { | |||||
// console.log("success:" + JSON.stringify(res)); | |||||
}, | |||||
fail: function (err) { | |||||
// console.log("fail:" + JSON.stringify(err)); | |||||
}, | |||||
}); | |||||
// -------------------------------------------------- | |||||
// uni.showToast({ | |||||
// title: "敬请期待!", | |||||
// icon: "none", | |||||
// }); | |||||
// return; | |||||
// uni.onShareAppMessage({ | |||||
// provider: "weixin", //分享服务提供商(即weixin|qq|sinaweibo) | |||||
// scene: "WXSenceTimeline", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏) | |||||
// type: 5, | |||||
// title: "分享到朋友圈", | |||||
// summary: "分享描述", | |||||
// href: "www.baidu.com", //分享跳转地址 | |||||
// imageUrl: "../static/lovehot.png", //分享图片路径(必须是线上可访问图片) | |||||
// miniProgram: { | |||||
// id: "wx75cf14e3a0d45821", | |||||
// path: "pages/index/index", | |||||
// type: 0, | |||||
// webUrl: "", | |||||
// }, | |||||
// success: function (res) { | |||||
// }, | |||||
// fail: function (err) { | |||||
// }, | |||||
// }); | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 页面跳转 | //#region 页面跳转 | ||||
function buyCoin() { | function buyCoin() { | ||||
if (userInfoModulesPinia.platForm == 3) { | |||||
uni.showToast({ | |||||
title: "暂未开放", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: "/pages/index/buyCoin", | |||||
}); | |||||
} | |||||
} | |||||
function goChooseStyle() { | |||||
uni.navigateTo({ | uni.navigateTo({ | ||||
url: "/pages/index/buyCoin", | |||||
url: "/pages/closeStyle/closeStyle", | |||||
}); | }); | ||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -255,6 +317,7 @@ async function photoSupper() { | |||||
console.log(res); | console.log(res); | ||||
uni.hideLoading(); | uni.hideLoading(); | ||||
uni.showToast({ | uni.showToast({ | ||||
title: "高清处理请求成功,请稍后", | |||||
title: "高清处理请求成功,请稍等", | title: "高清处理请求成功,请稍等", | ||||
icon: "none", | icon: "none", | ||||
}); | }); | ||||
@@ -298,6 +361,50 @@ watch( | |||||
); | ); | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 生成画报 | |||||
const pictorialUrl = ref(""); | |||||
const showPictorial = ref(false); | |||||
async function getUserQrcode() { | |||||
try { | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
const data = { | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
img: swiperList.value[swiperIndex.value].imageSuper | |||||
? swiperList.value[swiperIndex.value].imageSuper | |||||
: swiperList.value[swiperIndex.value].image, | |||||
}; | |||||
const res = await getUserQrcodeApi(data); | |||||
if (res.code == 200) { | |||||
pictorialUrl.value = `data:image/png;base64,${res.data}`; | |||||
// ${uni.arrayBufferToBase64( | |||||
// res.data | |||||
// )} | |||||
console.log(pictorialUrl.value); | |||||
showPictorial.value = true; | |||||
} else { | |||||
uni.showToast({ | |||||
title: "画报生成失败", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} | |||||
uni.hideLoading(); | |||||
} catch (error) { | |||||
uni.hideLoading(); | |||||
uni.showToast({ | |||||
title: "画报生成失败", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
console.log(error); | |||||
} | |||||
} | |||||
//#endregion --------------------- | |||||
//#region | //#region | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -305,11 +412,12 @@ watch( | |||||
<style lang="scss"> | <style lang="scss"> | ||||
.page { | .page { | ||||
padding: 0 30rpx; | |||||
background-color: rgba(24, 25, 26, 1); | background-color: rgba(24, 25, 26, 1); | ||||
} | } | ||||
// 轮播图 | // 轮播图 | ||||
.u-swiper { | .u-swiper { | ||||
margin-top: 40rpx; | |||||
margin-top: 70rpx; | |||||
width: 540rpx; | width: 540rpx; | ||||
height: 720rpx !important; | height: 720rpx !important; | ||||
border-radius: 50rpx; | border-radius: 50rpx; | ||||
@@ -333,7 +441,25 @@ watch( | |||||
} | } | ||||
} | } | ||||
.checkMore { | |||||
.logo { | |||||
width: 260rpx; | |||||
margin: 90rpx; | |||||
animation: rotateAnimation 3s 0s infinite; | |||||
opacity: 0.7; | |||||
} | |||||
@keyframes rotateAnimation { | |||||
0% { | |||||
transform: rotate(0deg); | |||||
} | |||||
66.66% { | |||||
transform: rotate(360deg); | |||||
} | |||||
100% { | |||||
transform: rotate(360deg); | |||||
} | |||||
} | |||||
.checkMore, | |||||
.wait { | |||||
color: #ffffff; | color: #ffffff; | ||||
margin-top: 30rpx; | margin-top: 30rpx; | ||||
} | } | ||||
@@ -385,6 +511,7 @@ watch( | |||||
} | } | ||||
} | } | ||||
.grayBtn { | .grayBtn { | ||||
margin-bottom: 220rpx; | |||||
.free { | .free { | ||||
position: absolute; | position: absolute; | ||||
color: #fff; | color: #fff; | ||||
@@ -402,13 +529,13 @@ watch( | |||||
} | } | ||||
.bottomBox { | .bottomBox { | ||||
flex: 1; | |||||
position: relative; | |||||
bottom: -30rpx; | |||||
// flex: 1; | |||||
position: absolute; | |||||
bottom: 60rpx; | |||||
width: 100%; | width: 100%; | ||||
display: flex; | display: flex; | ||||
justify-content: space-between; | |||||
padding: 65rpx 10rpx 0; | |||||
justify-content: space-evenly; | |||||
padding: 65rpx 40rpx 0; | |||||
.tips { | .tips { | ||||
position: absolute; | position: absolute; | ||||
top: 0rpx; | top: 0rpx; | ||||
@@ -423,12 +550,36 @@ watch( | |||||
text-align: center; | text-align: center; | ||||
} | } | ||||
.shareBtn { | .shareBtn { | ||||
margin: 0; | |||||
color: #fff; | |||||
width: 200rpx; | width: 200rpx; | ||||
height: 70rpx; | height: 70rpx; | ||||
line-height: 70rpx; | line-height: 70rpx; | ||||
text-align: center; | text-align: center; | ||||
border-radius: 70rpx; | border-radius: 70rpx; | ||||
font-size: 26rpx; | |||||
background-color: rgba(255, 255, 255, 0.1); | background-color: rgba(255, 255, 255, 0.1); | ||||
} | } | ||||
} | } | ||||
.pictorialBox { | |||||
position: absolute; | |||||
width: 100%; | |||||
height: 100%; | |||||
display: flex; | |||||
flex-direction: column; | |||||
align-items: center; | |||||
background-color: rgba($color: #000000, $alpha: 0.9); | |||||
image { | |||||
margin-top: 80rpx; | |||||
width: 630rpx; | |||||
height: 940rpx; | |||||
border-radius: 24rpx; | |||||
margin-bottom: 50rpx; | |||||
} | |||||
text { | |||||
margin-bottom: 30rpx; | |||||
} | |||||
z-index: 9; | |||||
} | |||||
</style> | </style> |
@@ -1,24 +1,24 @@ | |||||
<template> | <template> | ||||
<div class="page"> | <div class="page"> | ||||
<div class="title">慧拍“金币”充值协议</div> | |||||
<div class="title">智像“金币”充值协议</div> | |||||
<div class="paragraph"> | <div class="paragraph"> | ||||
欢迎您使用慧拍的“金币”付费服务!为了使用慧拍内的特定付费产品和服务,您必须仔细阅读并遵守《慧拍“金币”充值协议》(以下简称“本协议”)。 | |||||
欢迎您使用智像的“金币”付费服务!为了使用智像内的特定付费产品和服务,您必须仔细阅读并遵守《智像“金币”充值协议》(以下简称“本协议”)。 | |||||
</div> | </div> | ||||
<div class="paragraph"> | <div class="paragraph"> | ||||
注意:请用户仔细阅读以下全部内容。如果您不同意本服务协议的任一或全部条款内容,请不要使用慧拍“金币”服务。慧拍“金币”服务是慧拍服务的子服务,因此,当您开始使用慧拍“金币”服务时,即表示您与慧拍已达成协议关系,并自愿接受并遵守慧拍服务及慧拍“金币”服务的所有服务协议,包括但不限于《用户服务协议》、本服务协议及相关子协议和管理规范等。 | |||||
注意:请用户仔细阅读以下全部内容。如果您不同意本服务协议的任一或全部条款内容,请不要使用智像“金币”服务。智像“金币”服务是智像服务的子服务,因此,当您开始使用智像“金币”服务时,即表示您与智像已达成协议关系,并自愿接受并遵守智像服务及智像“金币”服务的所有服务协议,包括但不限于《用户服务协议》、本服务协议及相关子协议和管理规范等。 | |||||
</div> | </div> | ||||
<div class="paragraph"> | <div class="paragraph"> | ||||
特别提示:在您开始使用本服务之前,您应当具备中华人民共和国法律规定的与您行为相适应的民事行为能力。若您不具备前述与您行为相适应的民事行为能力,则应获得监护人的知情同意。您及您的监护人应依照法律规定承担因此而导致的相应责任。特别地,如果您是未成年人,请在您的监护人的同意和指导下访问和/或使用我们的平台。慧拍谨此提醒家长合理引导未成年子女的上网及消费行为。 | |||||
特别提示:在您开始使用本服务之前,您应当具备中华人民共和国法律规定的与您行为相适应的民事行为能力。若您不具备前述与您行为相适应的民事行为能力,则应获得监护人的知情同意。您及您的监护人应依照法律规定承担因此而导致的相应责任。特别地,如果您是未成年人,请在您的监护人的同意和指导下访问和/或使用我们的平台。智像谨此提醒家长合理引导未成年子女的上网及消费行为。 | |||||
</div> | </div> | ||||
<div class="item"> | <div class="item"> | ||||
<div class="name">一、协议的范围</div> | <div class="name">一、协议的范围</div> | ||||
<div class="child"> | <div class="child"> | ||||
1.1 | 1.1 | ||||
协议适用主体范围:本协议是用户与慧拍之间关于用户在使用指定付费产品/服务和充值规则等相关事宜所订立的协议。 | |||||
协议适用主体范围:本协议是用户与智像之间关于用户在使用指定付费产品/服务和充值规则等相关事宜所订立的协议。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
1.2 | 1.2 | ||||
协议关系及冲突条款:本协议视为《慧拍用户服务协议》的补充协议,是其不可分割的组成部分。如果本协议与上述内容存在冲突,以本协议为准。 | |||||
协议关系及冲突条款:本协议视为《智像用户服务协议》的补充协议,是其不可分割的组成部分。如果本协议与上述内容存在冲突,以本协议为准。 | |||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -26,11 +26,11 @@ | |||||
<div class="name">二、名词定义</div> | <div class="name">二、名词定义</div> | ||||
<div class="child"> | <div class="child"> | ||||
2.1 | 2.1 | ||||
慧拍“金币”:指按照慧拍的指定方式支付一定费用后,可以享有由慧拍提供的特定付费产品和服务。慧拍“金币”不具有法定货币的流通和支付功能,不得兑换为法定货币或实物。慧拍提醒用户注意,慧拍“金币”付费服务非存款、预付款或其他可无理由退还性质的商品或财产权利。 | |||||
智像“金币”:指按照智像的指定方式支付一定费用后,可以享有由智像提供的特定付费产品和服务。智像“金币”不具有法定货币的流通和支付功能,不得兑换为法定货币或实物。智像提醒用户注意,智像“金币”付费服务非存款、预付款或其他可无理由退还性质的商品或财产权利。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
2.2 | 2.2 | ||||
充值服务:用户通过慧拍“金币”充值,享有由慧拍或第三方提供的特定付费产品/服务。用户所享有的具体服务内容会根据充值金额而有所不同。同时,慧拍可能会在不同时间推出具体不同的服务内容,以不断完善和优化本服务。具体服务内容请参阅慧拍相关服务页面的公布和实际提供的内容。 | |||||
充值服务:用户通过智像“金币”充值,享有由智像或第三方提供的特定付费产品/服务。用户所享有的具体服务内容会根据充值金额而有所不同。同时,智像可能会在不同时间推出具体不同的服务内容,以不断完善和优化本服务。具体服务内容请参阅智像相关服务页面的公布和实际提供的内容。 | |||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -38,49 +38,49 @@ | |||||
<div class="name">三、付费服务及充值规则</div> | <div class="name">三、付费服务及充值规则</div> | ||||
<div class="child"> | <div class="child"> | ||||
3.1 | 3.1 | ||||
用户理解并同意,用户必须成为慧拍的普通注册用户后,才能继续进行付费服务。本服务收取的充值金额是慧拍向最终用户收取互联网增值服务使用费的一种通用收费渠道或计费方式。该充值金额仅可用于慧拍指定服务,不适用于其他任何产品或服务。 | |||||
用户理解并同意,用户必须成为智像的普通注册用户后,才能继续进行付费服务。本服务收取的充值金额是智像向最终用户收取互联网增值服务使用费的一种通用收费渠道或计费方式。该充值金额仅可用于智像指定服务,不适用于其他任何产品或服务。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
3.2 | 3.2 | ||||
慧拍将有权决定所提供的服务资费标准和收费方式。可能会针对不同的服务制定不同的资费标准和收费方式,也可能根据慧拍所提供的服务的不同阶段确定不同的资费标准和收费方式。 | |||||
智像将有权决定所提供的服务资费标准和收费方式。可能会针对不同的服务制定不同的资费标准和收费方式,也可能根据智像所提供的服务的不同阶段确定不同的资费标准和收费方式。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
3.3 充值 | 3.3 充值 | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.1 | 3.3.1 | ||||
用户通过所用客户端相应的支付方式(具体支付方式请见充值页面),为其账号充值所直接获得的慧拍“金币”,可在指定的付费产品/服务中使用。 | |||||
安卓端:慧拍“金币”费用将通过支付宝、微信等第三方代收费的方式支付,具体价格请见购买收银台标示。 | |||||
iOS端:慧拍“金币”费用将通过支付宝、微信等第三方代收费的方式支付,具体价格为人民币0.1元。 | |||||
用户通过所用客户端相应的支付方式(具体支付方式请见充值页面),为其账号充值所直接获得的智像“金币”,可在指定的付费产品/服务中使用。 | |||||
安卓端:智像“金币”费用将通过支付宝、微信等第三方代收费的方式支付,具体价格请见购买收银台标示。 | |||||
iOS端:智像“金币”费用将通过支付宝、微信等第三方代收费的方式支付。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.2 | 3.3.2 | ||||
用户可以通过登录慧拍,在首页点击“我的金币”,查询已购买或尚未消费的慧拍“金币”。 | |||||
用户可以通过登录智像,在首页点击“我的金币”,查询已购买或尚未消费的智像“金币”。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.3 | 3.3.3 | ||||
用户理解并知晓,慧拍不提供用户间交易慧拍“金币”服务。用户间交易慧拍“金币”构成对本协议的违反,慧拍有权在未经通知的情况下采取相应适当措施,以确保不提供用户间交易慧拍“金币”服务。 | |||||
用户理解并知晓,智像不提供用户间交易智像“金币”服务。用户间交易智像“金币”构成对本协议的违反,智像有权在未经通知的情况下采取相应适当措施,以确保不提供用户间交易智像“金币”服务。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.4 | 3.3.4 | ||||
用户理解并同意,充值的慧拍“金币”不适用无理由退换。充值一旦成功,即视为充值完成。用户不得以消费完成后账户内仍有剩余慧拍“金币”为由要求退费。 | |||||
用户理解并同意,充值的智像“金币”不适用无理由退换。充值一旦成功,即视为充值完成。用户不得以消费完成后账户内仍有剩余智像“金币”为由要求退费。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.5 | 3.3.5 | ||||
当用户在慧拍进行慧拍“金币”充值时,用户必须仔细确认自己的账号及信息。若因为用户自身操作不当、不了解或未充分了解充值计费方式等因素造成充错账号、错选充值种类等情况而损害自身权益,由用户自行负责。 | |||||
当用户在智像进行智像“金币”充值时,用户必须仔细确认自己的账号及信息。若因为用户自身操作不当、不了解或未充分了解充值计费方式等因素造成充错账号、错选充值种类等情况而损害自身权益,由用户自行负责。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.6 | 3.3.6 | ||||
用户在充值时使用第三方支付企业提供的服务应遵守与该第三方的各项协议及其服务规则。在使用第三方支付服务过程中,用户应妥善保管个人信息,包括但不限于银行卡账号、密码、验证码等。用户同意并确认,慧拍对因第三方支付服务产生的纠纷不承担任何责任。 | |||||
用户在充值时使用第三方支付企业提供的服务应遵守与该第三方的各项协议及其服务规则。在使用第三方支付服务过程中,用户应妥善保管个人信息,包括但不限于银行卡账号、密码、验证码等。用户同意并确认,智像对因第三方支付服务产生的纠纷不承担任何责任。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.7 | 3.3.7 | ||||
若因违反本协议条款,导致账号被冻结和/或终止使用的用户,不得因此要求慧拍作任何补偿或赔偿。 | |||||
若因违反本协议条款,导致账号被冻结和/或终止使用的用户,不得因此要求智像作任何补偿或赔偿。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.3.8 | 3.3.8 | ||||
若因慧拍“金币”充值系统自身充值故障原因造成用户充值失实,在慧拍恢复、存有有效数据和用户提供合法有效凭证的情况下,慧拍将根据用户充值情况作出变动及补救措施。 | |||||
因慧拍“金币”充值系统自身故障原因,造成系统充值额小于用户实际充值额的,慧拍将补其差额。 | |||||
因慧拍“金币”充值系统自身故障原因,造成系统充值额大于用户实际充值额的,慧拍有权追回差额。 | |||||
若因智像“金币”充值系统自身充值故障原因造成用户充值失实,在智像恢复、存有有效数据和用户提供合法有效凭证的情况下,智像将根据用户充值情况作出变动及补救措施。 | |||||
因智像“金币”充值系统自身故障原因,造成系统充值额小于用户实际充值额的,智像将补其差额。 | |||||
因智像“金币”充值系统自身故障原因,造成系统充值额大于用户实际充值额的,智像有权追回差额。 | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -89,22 +89,22 @@ | |||||
<div class="name">四、服务的变更、中止或终止</div> | <div class="name">四、服务的变更、中止或终止</div> | ||||
<div class="child"> | <div class="child"> | ||||
4.1 本服务的中止或终止包含如下情况: | 4.1 本服务的中止或终止包含如下情况: | ||||
因用户的违约或违规行为,慧拍主动中止或终止服务。 | |||||
因国家或相关政府监管部门要求或发生不可抗力事件时,慧拍中止或终止服务。 | |||||
因用户的违约或违规行为,智像主动中止或终止服务。 | |||||
因国家或相关政府监管部门要求或发生不可抗力事件时,智像中止或终止服务。 | |||||
其他根据法律法规应中止或终止服务的情况。 | 其他根据法律法规应中止或终止服务的情况。 | ||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
4.2 | 4.2 | ||||
中止或终止服务后,慧拍会以法律允许的方式通知用户。当用户发现无法登录或享受服务时,可以咨询客服人员。 | |||||
中止或终止服务后,智像会以法律允许的方式通知用户。当用户发现无法登录或享受服务时,可以咨询客服人员。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
4.3 中止或终止后的处理: | 4.3 中止或终止后的处理: | ||||
除法律规定的责任外,慧拍对本服务的中止或终止对用户和第三人不承担任何责任。 | |||||
除法律规定的责任外,智像对本服务的中止或终止对用户和第三人不承担任何责任。 | |||||
除法律规定或本协议另有约定外,已收取的费用不予退还。 | 除法律规定或本协议另有约定外,已收取的费用不予退还。 | ||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
4.4 | 4.4 | ||||
对于本服务或本协议可能发生的变更(包括但不限于本协议修改、服务细则调整等),慧拍将根据本协议的约定通知用户。请用户仔细阅读并选择是否按照调整和/或变更后的本协议/服务细则等继续选择本服务。如用户同意上述调整和/或变更,用户可以继续使用本服务,以表明用户已经接受上述调整和/或变更。如用户不同意调整和/或变更,建议用户立即停止使用本服务。如用户对上述调整和/或变更有任何问题,可以咨询客服。 | |||||
对于本服务或本协议可能发生的变更(包括但不限于本协议修改、服务细则调整等),智像将根据本协议的约定通知用户。请用户仔细阅读并选择是否按照调整和/或变更后的本协议/服务细则等继续选择本服务。如用户同意上述调整和/或变更,用户可以继续使用本服务,以表明用户已经接受上述调整和/或变更。如用户不同意调整和/或变更,建议用户立即停止使用本服务。如用户对上述调整和/或变更有任何问题,可以咨询客服。 | |||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -112,11 +112,11 @@ | |||||
<div class="name">五、违约责任</div> | <div class="name">五、违约责任</div> | ||||
<div class="child"> | <div class="child"> | ||||
5.1 | 5.1 | ||||
如果慧拍发现用户有违反本协议任何行为的,慧拍有权进行独立判断并采取技术手段予以删除、屏蔽或断开相关信息。同时,慧拍有权视用户的行为性质,对用户采取包括但不限于暂停或终止部分或全部本服务、中止或终止用户对慧拍账号使用、追究法律责任等措施。由此给用户带来的损失(包括但不限于通信中断、相关数据清空、服务费用作为违约金而归慧拍所有等),由用户自行承担。造成慧拍损失的,用户也应予以赔偿。若慧拍依前述约定对用户采取暂停或终止部分或全部本服务的,慧拍无需向用户退还任何费用,剩余的服务费用作为违约金而归慧拍所有。 | |||||
如果智像发现用户有违反本协议任何行为的,智像有权进行独立判断并采取技术手段予以删除、屏蔽或断开相关信息。同时,智像有权视用户的行为性质,对用户采取包括但不限于暂停或终止部分或全部本服务、中止或终止用户对智像账号使用、追究法律责任等措施。由此给用户带来的损失(包括但不限于通信中断、相关数据清空、服务费用作为违约金而归智像所有等),由用户自行承担。造成智像损失的,用户也应予以赔偿。若智像依前述约定对用户采取暂停或终止部分或全部本服务的,智像无需向用户退还任何费用,剩余的服务费用作为违约金而归智像所有。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
5.2 | 5.2 | ||||
如用户有违反本协议任何行为,导致任何第三方损害,用户应当独立承担责任。慧拍因此遭受损失的,用户也应当一并赔偿。 | |||||
如用户有违反本协议任何行为,导致任何第三方损害,用户应当独立承担责任。智像因此遭受损失的,用户也应当一并赔偿。 | |||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -144,7 +144,7 @@ | |||||
</div> | </div> | ||||
<div class="paragraph"> | <div class="paragraph"> | ||||
以上为慧拍“金币”充值协议的内容,请您仔细阅读并遵守。如您同意并愿意继续使用慧拍“金币”服务,请进行相应操作。如有任何疑问,请咨询客服人员。谢谢! | |||||
以上为智像“金币”充值协议的内容,请您仔细阅读并遵守。如您同意并愿意继续使用智像“金币”服务,请进行相应操作。如有任何疑问,请咨询客服人员。谢谢! | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -4,7 +4,7 @@ | |||||
<div class="date">生效日期:2023年8月2日</div> | <div class="date">生效日期:2023年8月2日</div> | ||||
<div class="version">版本号:2023V1</div> | <div class="version">版本号:2023V1</div> | ||||
<div class="paragraph"> | <div class="paragraph"> | ||||
欢迎您使用慧拍!为使用未序网络科技(上海)有限公司(以下简称“我方”)运营的慧拍客户端软件提供的相关服务(以下简称“我方平台服务”),您应当阅读并遵守《用户服务协议》(以下简称“本协议”)。建议您仔细阅读本协议的全部内容,尤其是以加粗形式展示的与您的权益(可能)存在重大关系的条款(包括相关约定免除或者限制责任的条款、法律适用和争议解决等条款),请您务必审慎阅读、充分理解个条款内容。各条款标题仅为帮助您理解该条款表达的主旨之用,不影响或限制本协议条款的含义或解释。 | |||||
欢迎您使用智像!为使用未序网络科技(上海)有限公司(以下简称“我方”)运营的智像客户端软件提供的相关服务(以下简称“我方平台服务”),您应当阅读并遵守《用户服务协议》(以下简称“本协议”)。建议您仔细阅读本协议的全部内容,尤其是以加粗形式展示的与您的权益(可能)存在重大关系的条款(包括相关约定免除或者限制责任的条款、法律适用和争议解决等条款),请您务必审慎阅读、充分理解个条款内容。各条款标题仅为帮助您理解该条款表达的主旨之用,不影响或限制本协议条款的含义或解释。 | |||||
</div> | </div> | ||||
<div class="paragraph"> | <div class="paragraph"> | ||||
您点击同意或您使用我方平台服务(使用”行为指包括但不限于下载安装、启动、浏览、注册、登录等行为中的一种或多种,下同),即表示您已阅读并同意签署本协议所有内容,本协议即在您与我方之间产生法律效力,成为对双方均具有约束力的法律文件。如您不同意我方不时对本协议的修改或补充内容,您应放弃注册、停止使用或主动取消本服务。 | 您点击同意或您使用我方平台服务(使用”行为指包括但不限于下载安装、启动、浏览、注册、登录等行为中的一种或多种,下同),即表示您已阅读并同意签署本协议所有内容,本协议即在您与我方之间产生法律效力,成为对双方均具有约束力的法律文件。如您不同意我方不时对本协议的修改或补充内容,您应放弃注册、停止使用或主动取消本服务。 | ||||
@@ -21,7 +21,7 @@ | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
1.2 | 1.2 | ||||
我方平台:慧拍(www.metavatar.cc)向您提供的各项产品及/或服务的网站、客户端、小程序以及随技术发展出现的新形态。 | |||||
我方平台:智像(www.metavatar.cc)向您提供的各项产品及/或服务的网站、客户端、小程序以及随技术发展出现的新形态。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
1.3 | 1.3 | ||||
@@ -56,7 +56,7 @@ | |||||
3.2 账户说明 | 3.2 账户说明 | ||||
<div class="inside"> | <div class="inside"> | ||||
3.2.1 | 3.2.1 | ||||
[账户获得]当您按照注册页面提示填写信息、阅读并同意本协议目完成全部注册程序后,您可获得我方平台账户(“慧拍账户”)并成为我方平台用户。 | |||||
[账户获得]当您按照注册页面提示填写信息、阅读并同意本协议目完成全部注册程序后,您可获得我方平台账户(“智像账户”)并成为我方平台用户。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
3.2.2 | 3.2.2 | ||||
@@ -69,7 +69,7 @@ | |||||
<div class="name">4.1 我方平台服务</div> | <div class="name">4.1 我方平台服务</div> | ||||
<div class="child"> | <div class="child"> | ||||
4.1.1 | 4.1.1 | ||||
服务范围:我方平台服务是指由我们提供的名称为慧拍的服务。根据您选择的功能不同,您可能将上传您的照片用于AI生成,系统将通过后期技术生成新的内容。“您的上传内容”与“AI生成内容”,统称为“您的内容”。 | |||||
服务范围:我方平台服务是指由我们提供的名称为智像的服务。根据您选择的功能不同,您可能将上传您的照片用于AI生成,系统将通过后期技术生成新的内容。“您的上传内容”与“AI生成内容”,统称为“您的内容”。 | |||||
</div> | </div> | ||||
<div class="child"> | <div class="child"> | ||||
4.1.2 | 4.1.2 | ||||
@@ -79,7 +79,7 @@ | |||||
4.1.3 知识产权: | 4.1.3 知识产权: | ||||
<div class="inside"> | <div class="inside"> | ||||
(1) | (1) | ||||
我方知识产权:除非另有约定或我方另行声明,本服务所使用的我方平台内的所有内容及我方平台的Logo、“慧拍”等文字、图形及其组合,以及我方平台的其他标识、徽记、产品和服务名称均归我方或我方关联公司所有或控制。未经我方书面授权,任何人不得以任何方式展示、使用或作其他处理,也不得向他人表明您有权展示、使用或作其他处理。 | |||||
我方知识产权:除非另有约定或我方另行声明,本服务所使用的我方平台内的所有内容及我方平台的Logo、“智像”等文字、图形及其组合,以及我方平台的其他标识、徽记、产品和服务名称均归我方或我方关联公司所有或控制。未经我方书面授权,任何人不得以任何方式展示、使用或作其他处理,也不得向他人表明您有权展示、使用或作其他处理。 | |||||
</div> | </div> | ||||
<div class="inside"> | <div class="inside"> | ||||
(2) | (2) | ||||
@@ -0,0 +1,288 @@ | |||||
<template> | |||||
<view class="page" @touchmove.stop.prevent=""> | |||||
<image src="../../assets/img/img1.png" mode="aspectFit" /> | |||||
<view v-show="!audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="开始录音" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="openPopup" | |||||
></up-button> | |||||
</view> | |||||
<view v-show="audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="试听" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="playVoice" | |||||
></up-button> | |||||
</view> | |||||
<view v-show="audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="重新录音" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="openPopup" | |||||
></up-button> | |||||
</view> | |||||
<view class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="生成视频" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
<!-- 分享 --> | |||||
<view class="shareBox"> | |||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="分享" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
open-type="share" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="邀请好友" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
open-type="share" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="购买金币" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
</view> | |||||
<!-- 弹出层 --> | |||||
<view class="popup" v-show="showPopup" @click.stop="showPopup = false"> | |||||
<!-- 声纹图片 --> | |||||
<u-transition :show="showPopup"> | |||||
<view class="transition wavyIcon"> | |||||
<!-- <image src="../../assets/icon/u152.png" /> --> | |||||
</view> | |||||
</u-transition> | |||||
<!-- 底部框 --> | |||||
<u-transition | |||||
:show="showPopup" | |||||
@touchstart.stop="startRecord" | |||||
@touchend.stop="endRecord" | |||||
> | |||||
<view class="transition microphoneIcon"> | |||||
<view class="mask"></view> | |||||
<image src="../../assets/icon/u149.png" mode="aspectFit" /> | |||||
</view> | |||||
</u-transition> | |||||
</view> | |||||
</view> | |||||
</template> | |||||
<script setup> | |||||
// import myloading from '../../components/myLoading.vue' | |||||
//#region 导入 | |||||
import { ref, reactive } from "vue"; | |||||
import { userInfoModules } from "@/store/modules/userInfo"; | |||||
const userInfoModulesPinia = userInfoModules(); | |||||
//#endregion | |||||
//#region 页面跳转 | |||||
function bueCoin() { | |||||
uni.navigateTo({ | |||||
url: "/pages/home/buyCoin", | |||||
}); | |||||
} | |||||
//#endregion --------------------- | |||||
//#region 弹出层 | |||||
const showPopup = ref(true); | |||||
function openPopup() { | |||||
showPopup.value = true; | |||||
} | |||||
function close() { | |||||
console.log("close"); | |||||
} | |||||
function open() { | |||||
console.log("open"); | |||||
} | |||||
//#endregion --------------------- | |||||
//#region 录音功能 | |||||
let Recorder = null; //h5定义录音对象 | |||||
let recorder = null; //h5定义录音实例 | |||||
let recorderManager = null; //小程序定义录音实例 | |||||
let innerAudioContext = null; //小程序定义mp3实例 | |||||
const audioUrl = ref(null); | |||||
const audioRef = ref(null); | |||||
if (userInfoModulesPinia.platForm == 1) { | |||||
// 在 H5 平台导入 Recorder | |||||
import("js-audio-recorder").then((module) => { | |||||
const Recorder = module.default; | |||||
// 也可以继续使用 recorder 变量 | |||||
const parameter = { | |||||
sampleBits: 16, // 采样位数,支持 8 或 16,默认是16 | |||||
sampleRate: 16000, // 采样率,支持 11025、16000、22050、24000、44100、48000,根据浏览器默认值,我的chrome是48000 | |||||
numChannels: 1, // 声道,支持 1 或 2, 默认是1 | |||||
}; | |||||
recorder = new Recorder(parameter); | |||||
}); | |||||
} else { | |||||
recorderManager = uni.getRecorderManager(); | |||||
innerAudioContext = uni.createInnerAudioContext(); | |||||
innerAudioContext.autoplay = false; | |||||
} | |||||
//#endregion | |||||
//#region 录音 | |||||
function startRecord() { | |||||
if (userInfoModulesPinia.platForm != 1) { | |||||
console.log("开始录音xcx"); | |||||
recorderManager.start({ | |||||
// format: "mp3", // 录音的格式 | |||||
duration: 60000, // 最大录音时长,单位毫秒 | |||||
}); | |||||
} else { | |||||
console.log("开始录音h5"); | |||||
recorder.start(); | |||||
} | |||||
} | |||||
async function endRecord() { | |||||
if (userInfoModulesPinia.platForm != 1) { | |||||
recorderManager.onStop((res) => { | |||||
console.log("录音结束xcx", res); | |||||
audioUrl.value = res.tempFilePath; | |||||
innerAudioContext.src = audioUrl.value; | |||||
}); | |||||
recorderManager.stop(); | |||||
} else { | |||||
console.log("录音结束h5"); | |||||
await recorder.stop(); | |||||
audioUrl.value = URL.createObjectURL(recorder.getWAVBlob()); | |||||
} | |||||
showPopup.value = false; | |||||
} | |||||
async function playVoice() { | |||||
if (userInfoModulesPinia.platForm != 1) { | |||||
await innerAudioContext.play(); | |||||
console.log("试听了xcx"); | |||||
} else { | |||||
const link = document.createElement("audio"); | |||||
link.src = audioUrl.value; | |||||
link.play(); | |||||
console.log("试听了h5"); | |||||
} | |||||
} | |||||
//#endregion --------------------- | |||||
//#region | |||||
//#endregion --------------------- | |||||
</script> | |||||
<style lang="scss"> | |||||
.page { | |||||
position: relative; | |||||
} | |||||
image { | |||||
height: 650rpx; | |||||
} | |||||
.myBtnbox { | |||||
margin-top: 30rpx; | |||||
} | |||||
.shareBox { | |||||
margin-top: 250rpx; | |||||
width: 100%; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
.buttonBox { | |||||
width: 30%; | |||||
} | |||||
} | |||||
.popup { | |||||
position: absolute; | |||||
width: 100vw; | |||||
height: 100vh; | |||||
background-color: rgba(0, 0, 0, 0.5); | |||||
z-index: 2; | |||||
.wavyIcon { | |||||
position: absolute; | |||||
top: 50%; | |||||
left: 50%; | |||||
transform: translate(-50%, -50%); | |||||
height: 160rpx; | |||||
width: 50%; | |||||
background-color: #fff; | |||||
z-index: 3; | |||||
overflow: hidden; | |||||
image { | |||||
position: absolute; | |||||
left: -500rpx; | |||||
display: inline-block; | |||||
width: 1000rpx; | |||||
height: 160rpx; | |||||
z-index: 3; | |||||
// animation: moveImage 3s linear infinite; | |||||
} | |||||
@keyframes moveImage { | |||||
0% { | |||||
left: -100rpx; | |||||
} | |||||
50% { | |||||
left: -500rpx; | |||||
} | |||||
100% { | |||||
left: -100rpx; | |||||
} | |||||
} | |||||
} | |||||
.microphoneIcon { | |||||
position: absolute; | |||||
bottom: 0; | |||||
height: 500rpx; | |||||
width: 100%; | |||||
background-color: #fff; | |||||
z-index: 3; | |||||
display: flex; | |||||
flex-direction: column; | |||||
align-items: center; | |||||
justify-content: center; | |||||
.mask { | |||||
position: absolute; | |||||
top: 40%; | |||||
left: 47%; | |||||
transform: translate(-50%, -50%); | |||||
width: 95rpx; | |||||
height: 95rpx; | |||||
transform: rotate(45deg); | |||||
z-index: 4; | |||||
background: url("../../assets/icon/u149.png"); | |||||
} | |||||
image { | |||||
max-width: 0%; | |||||
max-height: 0%; | |||||
transform: rotate(45deg); | |||||
touch-action: none; | |||||
z-index: -1; | |||||
pointer-events: none; | |||||
} | |||||
// img { | |||||
// pointer-events: none; | |||||
// } | |||||
} | |||||
} | |||||
</style> |
@@ -1,75 +1,50 @@ | |||||
<template> | <template> | ||||
<view class="page" @touchmove.stop.prevent=""> | <view class="page" @touchmove.stop.prevent=""> | ||||
<image src="../../assets/img/img1.png" mode="aspectFit" /> | |||||
<view v-show="!audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="开始录音" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="openPopup" | |||||
></up-button> | |||||
</view> | |||||
<image class="modeImage" src="../../assets/img/img1.png" mode="aspectFit" /> | |||||
<!-- 轮播图 --> | |||||
<!-- <u-swiper | |||||
indicator | |||||
indicatorMode="dot" | |||||
circular | |||||
:radius="30" | |||||
:autoplay="false" | |||||
:list="swiperList" | |||||
keyName="image" | |||||
@change="getSwiperIndex" | |||||
@click="previewImage" | |||||
></u-swiper> --> | |||||
<view v-show="audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="试听" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="playVoice" | |||||
></up-button> | |||||
</view> | |||||
<!-- 按钮部分 --> | |||||
<view v-show="!audioUrl" class="orangeBtn" @click="openPopup"> | |||||
<image | |||||
src="../../assets/icon/sound-2.png" | |||||
mode="scaleToFill" | |||||
/>开始录音</view | |||||
> | |||||
<view v-show="audioUrl" class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="重新录音" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="openPopup" | |||||
></up-button> | |||||
</view> | |||||
<view class="myBtnbox"> | |||||
<up-button | |||||
type="primary" | |||||
text="生成视频" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="" | |||||
></up-button> | |||||
<view v-show="audioUrl" class="orangeBtn transparentBtn" @click="playVoice" | |||||
><image src="../../assets/icon/sound-2.png" mode="scaleToFill" />试听 | |||||
<view class="rerecord" @click.stop="openPopup">重新录音</view> | |||||
</view> | </view> | ||||
<!-- <view v-show="audioUrl" class="orangeBtn" @click="openPopup">重新录音</view> --> | |||||
<view class="orangeBtn" @click="">生成视频</view> | |||||
<!-- 分享 --> | <!-- 分享 --> | ||||
<view class="shareBox"> | <view class="shareBox"> | ||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="分享" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
open-type="share" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="邀请好友" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
open-type="share" | |||||
@click="" | |||||
></up-button> | |||||
</view> | |||||
<view class="buttonBox"> | |||||
<up-button | |||||
type="primary" | |||||
text="购买金币" | |||||
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))" | |||||
@click="" | |||||
></up-button> | |||||
<view class="tips"> | |||||
<text>邀请好友可获得2枚金币</text> | |||||
</view> | </view> | ||||
<view class="shareBtn" @click="">分享</view> | |||||
<view class="shareBtn" @click="">邀请好友 </view> | |||||
<view class="shareBtn" @click="">购买金币</view> | |||||
</view> | </view> | ||||
<!-- 弹出层 --> | <!-- 弹出层 --> | ||||
<view class="popup" v-show="showPopup" @click.stop="showPopup = false"> | <view class="popup" v-show="showPopup" @click.stop="showPopup = false"> | ||||
<!-- 声纹图片 --> | <!-- 声纹图片 --> | ||||
<u-transition :show="showPopup"> | <u-transition :show="showPopup"> | ||||
<view class="transition wavyIcon"> | <view class="transition wavyIcon"> | ||||
<image src="../../assets/icon/u152.png" /> | |||||
<image src="../../assets/icon/soundBG.png" /> | |||||
</view> | </view> | ||||
</u-transition> | </u-transition> | ||||
@@ -80,8 +55,7 @@ | |||||
@touchend.stop="endRecord" | @touchend.stop="endRecord" | ||||
> | > | ||||
<view class="transition microphoneIcon"> | <view class="transition microphoneIcon"> | ||||
<view class="mask"></view> | |||||
<image src="../../assets/icon/u149.png" mode="aspectFit" /> | |||||
<image src="../../assets/icon/sound.png" mode="aspectFit" /> | |||||
</view> | </view> | ||||
</u-transition> | </u-transition> | ||||
</view> | </view> | ||||
@@ -91,17 +65,57 @@ | |||||
<script setup> | <script setup> | ||||
// import myloading from '../../components/myLoading.vue' | // import myloading from '../../components/myLoading.vue' | ||||
//#region 导入 | //#region 导入 | ||||
import { onLoad } from "@dcloudio/uni-app"; | |||||
import { ref, reactive } from "vue"; | import { ref, reactive } from "vue"; | ||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
import { getPhotoListApi } from "../../api/lookPhoto.js"; | |||||
const userInfoModulesPinia = userInfoModules(); | const userInfoModulesPinia = userInfoModules(); | ||||
//#endregion | //#endregion | ||||
//#region 轮播图 | |||||
const swiperList = ref([]); //轮播图 | |||||
async function getSwiperList() { | |||||
const res = await getPhotoListApi(workId.value); | |||||
console.log(res.data.photoList); | |||||
swiperList.value = res.data.photoList; | |||||
swiperList.value.forEach((item) => { | |||||
if (item.imageSuper) { | |||||
previewImageList.value.push(item.imageSuper); | |||||
} else { | |||||
previewImageList.value.push(item.image); | |||||
} | |||||
}); | |||||
} | |||||
// 轮播图滚动 | |||||
const swiperIndex = ref(0); | |||||
function getSwiperIndex(index) { | |||||
swiperIndex.value = index.current; | |||||
} | |||||
// 轮播图预览 | |||||
const previewImageList = ref([]); //预览图片列表 | |||||
function previewImage(index) { | |||||
uni.previewImage({ | |||||
current: index, //预览图片的下标 | |||||
urls: previewImageList.value, //预览图片的地址,必须要数组形式,如果不是数组形式就转换成数组形式就可以 | |||||
loop: true, | |||||
}); | |||||
} | |||||
//#endregion --------------------- | |||||
//#region 页面跳转 | //#region 页面跳转 | ||||
function bueCoin() { | function bueCoin() { | ||||
uni.navigateTo({ | |||||
url: "/pages/home/buyCoin", | |||||
}); | |||||
if (userInfoModulesPinia.platForm == 3) { | |||||
uni.showToast({ | |||||
title: "暂未开放", | |||||
icon: "none", | |||||
mask: true, | |||||
}); | |||||
} else { | |||||
uni.navigateTo({ | |||||
url: "/pages/index/buyCoin", | |||||
}); | |||||
} | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -147,7 +161,6 @@ if (userInfoModulesPinia.platForm == 1) { | |||||
//#endregion | //#endregion | ||||
//#region 录音 | //#region 录音 | ||||
function startRecord() { | function startRecord() { | ||||
if (userInfoModulesPinia.platForm != 1) { | if (userInfoModulesPinia.platForm != 1) { | ||||
console.log("开始录音xcx"); | console.log("开始录音xcx"); | ||||
@@ -188,6 +201,15 @@ async function playVoice() { | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 初始化 | |||||
const workId = ref(null); //作品id | |||||
onLoad(async (options) => { | |||||
workId.value = options.id; | |||||
// await getSwiperList(); | |||||
// await getSupperPhotoState(swiperList.value[0].id); | |||||
}); | |||||
//#endregion --------------------- | |||||
//#region | //#region | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -196,20 +218,75 @@ async function playVoice() { | |||||
<style lang="scss"> | <style lang="scss"> | ||||
.page { | .page { | ||||
position: relative; | position: relative; | ||||
padding-bottom: 200rpx; | |||||
} | } | ||||
image { | |||||
height: 650rpx; | |||||
.modeImage { | |||||
width: 540rpx; | |||||
height: 720rpx; | |||||
} | } | ||||
.myBtnbox { | .myBtnbox { | ||||
margin-top: 30rpx; | margin-top: 30rpx; | ||||
} | } | ||||
.orangeBtn { | |||||
position: relative; | |||||
margin-top: 30rpx; | |||||
image { | |||||
vertical-align: text-top; | |||||
width: 52rpx; | |||||
height: 40rpx; | |||||
margin-right: 20rpx; | |||||
} | |||||
.rerecord { | |||||
position: absolute; | |||||
top: -14rpx; | |||||
right: -78rpx; | |||||
height: 50rpx; | |||||
width: 142rpx; | |||||
text-align: center; | |||||
line-height: 50rpx; | |||||
border-radius: 25rpx; | |||||
background-color: #000; | |||||
font-size: 22rpx; | |||||
font-weight: bold; | |||||
} | |||||
} | |||||
.transparentBtn { | |||||
background-color: transparent; | |||||
border: 2rpx solid #fff; | |||||
} | |||||
.shareBox { | .shareBox { | ||||
margin-top: 250rpx; | |||||
position: absolute; | |||||
bottom: 100rpx; | |||||
padding: 0 60rpx; | |||||
// margin-top: 150rpx; | |||||
width: 100%; | width: 100%; | ||||
display: flex; | display: flex; | ||||
justify-content: space-between; | justify-content: space-between; | ||||
.buttonBox { | |||||
width: 30%; | |||||
.tips { | |||||
position: absolute; | |||||
top: -70rpx; | |||||
right: 60rpx; | |||||
width: 313rpx; | |||||
height: 50rpx; | |||||
background-color: #000; | |||||
border-radius: 25rpx 25rpx 25rpx 0; | |||||
font-size: 22rpx; | |||||
font-weight: 900; | |||||
line-height: 50rpx; | |||||
text-align: center; | |||||
} | |||||
.shareBtn { | |||||
width: 200rpx; | |||||
height: 72rpx; | |||||
line-height: 72rpx; | |||||
text-align: center; | |||||
background-color: #3d3e3f; | |||||
border-radius: 36rpx; | |||||
font-size: 26rpx; | |||||
font-weight: 400; | |||||
color: #ffffff; | |||||
} | } | ||||
} | } | ||||
.popup { | .popup { | ||||
@@ -223,21 +300,24 @@ image { | |||||
top: 50%; | top: 50%; | ||||
left: 50%; | left: 50%; | ||||
transform: translate(-50%, -50%); | transform: translate(-50%, -50%); | ||||
height: 160rpx; | |||||
width: 50%; | |||||
background-color: #fff; | |||||
width: 530rpx; | |||||
height: 173rpx; | |||||
// background-color: #fff; | |||||
z-index: 3; | z-index: 3; | ||||
overflow: hidden; | overflow: hidden; | ||||
image { | image { | ||||
position: absolute; | |||||
left: -500rpx; | |||||
display: inline-block; | |||||
width: 1000rpx; | |||||
height: 160rpx; | |||||
z-index: 3; | |||||
// animation: moveImage 3s linear infinite; | |||||
width: 520rpx; | |||||
height: 173rpx; | |||||
} | } | ||||
// image { | |||||
// position: absolute; | |||||
// left: -500rpx; | |||||
// display: inline-block; | |||||
// width: 1000rpx; | |||||
// height: 160rpx; | |||||
// z-index: 3; | |||||
// // animation: moveImage 3s linear infinite; | |||||
// } | |||||
@keyframes moveImage { | @keyframes moveImage { | ||||
0% { | 0% { | ||||
left: -100rpx; | left: -100rpx; | ||||
@@ -253,36 +333,25 @@ image { | |||||
.microphoneIcon { | .microphoneIcon { | ||||
position: absolute; | position: absolute; | ||||
bottom: 0; | bottom: 0; | ||||
height: 500rpx; | |||||
height: 410rpx; | |||||
width: 100%; | width: 100%; | ||||
border-radius: 36rpx 36rpx 0 0; | |||||
background-color: #fff; | background-color: #fff; | ||||
z-index: 3; | z-index: 3; | ||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
align-items: center; | align-items: center; | ||||
justify-content: center; | justify-content: center; | ||||
.mask { | |||||
position: absolute; | |||||
top: 40%; | |||||
left: 47%; | |||||
transform: translate(-50%, -50%); | |||||
width: 95rpx; | |||||
height: 95rpx; | |||||
transform: rotate(45deg); | |||||
z-index: 4; | |||||
background: url("../../assets/icon/u149.png"); | |||||
} | |||||
image { | image { | ||||
max-width: 0%; | |||||
max-height: 0%; | |||||
transform: rotate(45deg); | |||||
// max-width: 0%; | |||||
// max-height: 0%; | |||||
width: 108rpx; | |||||
height: 83rpx; | |||||
touch-action: none; | touch-action: none; | ||||
z-index: -1; | z-index: -1; | ||||
pointer-events: none; | pointer-events: none; | ||||
} | } | ||||
// img { | |||||
// pointer-events: none; | |||||
// } | |||||
} | } | ||||
} | } | ||||
</style> | </style> |
@@ -0,0 +1,106 @@ | |||||
<template> | |||||
<camera output-dimension="540" :device-position="cameraPosition"> | |||||
<cover-image | |||||
src="../../assets/img/people.png" | |||||
style="width: 100%; height: 700rpx; margin-top: 100rpx" | |||||
></cover-image> | |||||
<!-- <button type="primary" @click="takePhoto">拍照</button> --> | |||||
<view class="btnBox"> | |||||
<view class="takePhoto" style="opacity: 0">闪光灯</view> | |||||
<view class="takePhoto" @click="takePhoto">拍照</view> | |||||
<view class="device" @click="device"> | |||||
<image src="../../assets/img/reset.png" mode="scaleToFill" /> | |||||
</view> | |||||
</view> | |||||
</camera> | |||||
</template> | |||||
<script setup> | |||||
import { ref } from "vue"; | |||||
import { userInfoModules } from "@/store/modules/userInfo"; | |||||
const userInfoModulesPinia = userInfoModules(); | |||||
const cameraPosition = ref("back"); // 后置摄像头 | |||||
// const cameraFlash = ref("auto"); // 自动闪光灯 | |||||
// 翻转摄像头 | |||||
function device() { | |||||
if (cameraPosition.value == "back") { | |||||
cameraPosition.value = "front"; | |||||
} else { | |||||
cameraPosition.value = "back"; | |||||
} | |||||
} | |||||
function takePhoto() { | |||||
const ctx = uni.createCameraContext(); | |||||
ctx.takePhoto({ | |||||
quality: "high", | |||||
success: (res) => { | |||||
// 拍照成功后的回调 | |||||
// onPhotoTaken(res.tempImagePath); | |||||
userInfoModulesPinia.photoPath = res.tempImagePath; | |||||
uni.setStorageSync("action", 2); | |||||
uni.switchTab({ | |||||
url: "/pages/uploadPhoto/uploadPhoto", | |||||
}); | |||||
}, | |||||
fail: (err) => { | |||||
console.error("拍照失败", err); | |||||
}, | |||||
}); | |||||
} | |||||
// const takePhoto = () => { | |||||
// // 调用拍照方法 | |||||
// uni.takePhoto({ | |||||
// success: (res) => { | |||||
// // 拍照成功后的回调 | |||||
// // onPhotoTaken(res.tempImagePath); | |||||
// userInfoModulesPinia.photoPath = res.tempImagePath; | |||||
// uni.setStorageSync("action", 2); | |||||
// uni.switchTab({ | |||||
// url: "/pages/uploadPhoto/uploadPhoto", | |||||
// }); | |||||
// }, | |||||
// fail: (err) => { | |||||
// console.error("拍照失败", err); | |||||
// }, | |||||
// }); | |||||
// }; | |||||
const onScanCode = (e) => { | |||||
console.log("Scanned Code: ", e.detail); | |||||
}; | |||||
</script> | |||||
<style lang="scss"> | |||||
camera { | |||||
width: 100vw; | |||||
height: 100vh; | |||||
.btnBox { | |||||
width: 100%; | |||||
position: absolute; | |||||
bottom: 50rpx; | |||||
display: flex; | |||||
// flex-direction: column; | |||||
align-items: center; | |||||
justify-content: space-evenly; | |||||
.takePhoto { | |||||
width: 120rpx; | |||||
height: 120rpx; | |||||
border-radius: 60rpx; | |||||
line-height: 120rpx; | |||||
text-align: center; | |||||
background-color: #fd4e00; | |||||
color: #fff; | |||||
font-size: 40rpx; | |||||
} | |||||
.device { | |||||
image { | |||||
margin-top: 0rpx; | |||||
width: 120rpx; | |||||
height: 120rpx; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -37,7 +37,7 @@ | |||||
<script setup> | <script setup> | ||||
//#region 导入 | //#region 导入 | ||||
import { ref, reactive } from "vue"; | import { ref, reactive } from "vue"; | ||||
import { voiceTotalApi } from "../../api/login.js"; | |||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
import imageCompression from "browser-image-compression"; //压缩图片插件 | import imageCompression from "browser-image-compression"; //压缩图片插件 | ||||
import { onShow } from "@dcloudio/uni-app"; | import { onShow } from "@dcloudio/uni-app"; | ||||
@@ -61,7 +61,7 @@ function router2(url) { | |||||
} | } | ||||
function getRandomRange() { | function getRandomRange() { | ||||
randomNum.value = Math.floor(Math.random() * (100 - 81)) + 80; | |||||
randomNum.value = Math.floor(Math.random() * (99 - 95 + 1)) + 95; | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -22,21 +22,22 @@ | |||||
<!-- 上传按钮 --> | <!-- 上传按钮 --> | ||||
<image | <image | ||||
class="addImg" | class="addImg" | ||||
v-show="!showImgUrl" | |||||
v-show="!showImgUrl && !userInfoModulesPinia.myAvatar" | |||||
src="../../assets/icon/add.png" | src="../../assets/icon/add.png" | ||||
alt="" | alt="" | ||||
/> | /> | ||||
<!-- @click.prevent="chooseImage" --> | <!-- @click.prevent="chooseImage" --> | ||||
<image | <image | ||||
class="showImg" | class="showImg" | ||||
v-show="showImgUrl" | |||||
:src="showImgUrl" | |||||
v-show="showImgUrl || userInfoModulesPinia.myAvatar" | |||||
:src="showImgUrl ? showImgUrl : userInfoModulesPinia.myAvatar" | |||||
alt="" | alt="" | ||||
mode="aspectFit" | mode="aspectFit" | ||||
/> | /> | ||||
</view> | </view> | ||||
<view class="uploadBtn"> | <view class="uploadBtn"> | ||||
<view @click="toCloseStyle" class="orangeBtn">上传新头像</view> | <view @click="toCloseStyle" class="orangeBtn">上传新头像</view> | ||||
<!-- '/pages/closeStyle/closeStyle' '/pages/closeStyle/multiplayer' --> | |||||
<view | <view | ||||
class="grayBtn" | class="grayBtn" | ||||
v-if="userInfoModulesPinia.myAvatar" | v-if="userInfoModulesPinia.myAvatar" | ||||
@@ -46,10 +47,10 @@ | |||||
<view class="grayBtn" v-if="uploadState == 4" @click="chooseImage" | <view class="grayBtn" v-if="uploadState == 4" @click="chooseImage" | ||||
>重新上传</view | >重新上传</view | ||||
> | > | ||||
<view class="free"> | |||||
<!-- <view class="free" v-if="false"> | |||||
<image src="../../assets/icon/blackBG.png" mode="aspectFit" /> | <image src="../../assets/icon/blackBG.png" mode="aspectFit" /> | ||||
<text>新用户免费制作</text> | <text>新用户免费制作</text> | ||||
</view> | |||||
</view> --> | |||||
</view> | </view> | ||||
<!-- 底部盒子 --> | <!-- 底部盒子 --> | ||||
<view class="bottomBox"> | <view class="bottomBox"> | ||||
@@ -79,19 +80,22 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
<!-- 摄像头 --> | |||||
<!-- <camera> | |||||
<cover-image | |||||
src="../../assets/img/people.png" | |||||
style="width: 100%; height: 700rpx; margin-top: 100rpx" | |||||
></cover-image> | |||||
<button type="primary" @click="takePhoto">拍照</button> | |||||
</camera> --> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
<script setup> | <script setup> | ||||
//#region 导入 | //#region 导入 | ||||
import { ref, reactive, nextTick } from "vue"; | import { ref, reactive, nextTick } from "vue"; | ||||
import { | |||||
onLoad, | |||||
onShareAppMessage, | |||||
onShareTimeline, | |||||
onAddToFavorites, | |||||
onShow, | |||||
} from "@dcloudio/uni-app"; | |||||
import { BASE_URL } from "../../utils/request"; | |||||
import { onLoad, onShow } from "@dcloudio/uni-app"; | |||||
import { loginApi } from "../../api/login"; | import { loginApi } from "../../api/login"; | ||||
import { addImageApi } from "../../api/uploadphoto.js"; | import { addImageApi } from "../../api/uploadphoto.js"; | ||||
import { userInfoModules } from "@/store/modules/userInfo"; | import { userInfoModules } from "@/store/modules/userInfo"; | ||||
@@ -104,11 +108,9 @@ const userInfoModulesPinia = userInfoModules(); | |||||
const uploadState = ref(1); //上传状态 | const uploadState = ref(1); //上传状态 | ||||
const showImgUrl = ref(""); //回显路径 压缩 | const showImgUrl = ref(""); //回显路径 压缩 | ||||
const showImgUrl2 = ref(null); //回显路径 未压缩 | const showImgUrl2 = ref(null); //回显路径 未压缩 | ||||
const showImgData = ref(null); //上传数据 | |||||
// 点击上传图片 | |||||
// 点击上传图片或打开相机 | |||||
function chooseImage() { | function chooseImage() { | ||||
console.log("chooseImage"); | |||||
// 检查token | // 检查token | ||||
if (!userInfoModulesPinia.token) { | if (!userInfoModulesPinia.token) { | ||||
uni.showModal({ | uni.showModal({ | ||||
@@ -134,7 +136,7 @@ function chooseImage() { | |||||
uploadState.value = 2; | uploadState.value = 2; | ||||
// 图片压缩 | // 图片压缩 | ||||
console.log(res.tempFiles[0].size); | console.log(res.tempFiles[0].size); | ||||
showImgUrl2.value = res.tempFiles[0]; | |||||
// showImgUrl2.value = res.tempFiles[0]; | |||||
if (userInfoModulesPinia.platForm != 1) { | if (userInfoModulesPinia.platForm != 1) { | ||||
uni.compressImage({ | uni.compressImage({ | ||||
src: res.tempFilePaths[0], | src: res.tempFilePaths[0], | ||||
@@ -155,7 +157,6 @@ function chooseImage() { | |||||
); | ); | ||||
//compressedFile是一个blob对象 | //compressedFile是一个blob对象 | ||||
showImgUrl.value = URL.createObjectURL(compressedFile); | showImgUrl.value = URL.createObjectURL(compressedFile); | ||||
showImgData.value = compressedFile; | |||||
} | } | ||||
}, | }, | ||||
fail: (err) => { | fail: (err) => { | ||||
@@ -190,10 +191,10 @@ async function toCloseStyle() { | |||||
}); | }); | ||||
} else { | } else { | ||||
if (!showImgUrl.value) { | if (!showImgUrl.value) { | ||||
uni.showToast({ | |||||
title: "请先上传图片", | |||||
icon: "none", | |||||
}); | |||||
// uni.showToast({ | |||||
// title: "请先上传图片", | |||||
// icon: "none", | |||||
// }); | |||||
chooseImage(); | chooseImage(); | ||||
return; | return; | ||||
} | } | ||||
@@ -203,11 +204,11 @@ async function toCloseStyle() { | |||||
}); | }); | ||||
uploadState.value = 3; | uploadState.value = 3; | ||||
console.log(showImgUrl.value); | console.log(showImgUrl.value); | ||||
console.log(showImgUrl2.value.path); | |||||
console.log(showImgUrl2.value); | |||||
// 百度敏感信息检测 | // 百度敏感信息检测 | ||||
uni.uploadFile({ | uni.uploadFile({ | ||||
url: "https://test.metavatar.cc/C/api/baidu/checkPhoto", //上传图片api | |||||
filePath: showImgUrl2.value.path, | |||||
url: BASE_URL + "api/baidu/checkPhoto", //上传图片api | |||||
filePath: showImgUrl.value, | |||||
name: "file", | name: "file", | ||||
formData: { | formData: { | ||||
user: "test", | user: "test", | ||||
@@ -224,8 +225,8 @@ async function toCloseStyle() { | |||||
} | } | ||||
// 人脸识别接口 | // 人脸识别接口 | ||||
uni.uploadFile({ | uni.uploadFile({ | ||||
url: "https://test.metavatar.cc/C/api/userDigital/checkPhoto", //上传图片api | |||||
filePath: showImgUrl2.value.path, | |||||
url: BASE_URL + "api/userDigital/checkPhoto", //上传图片api | |||||
filePath: showImgUrl.value, | |||||
name: "file", | name: "file", | ||||
formData: { | formData: { | ||||
user: "test", | user: "test", | ||||
@@ -242,8 +243,8 @@ async function toCloseStyle() { | |||||
} | } | ||||
// 上传接口 | // 上传接口 | ||||
uni.uploadFile({ | uni.uploadFile({ | ||||
url: "https://test.metavatar.cc/C/api/upload/awsImgUpload", //上传图片api | |||||
filePath: showImgUrl2.value.path, | |||||
url: BASE_URL + "api/upload/awsImgUpload", //上传图片api | |||||
filePath: showImgUrl.value, | |||||
name: "file", | name: "file", | ||||
formData: { | formData: { | ||||
user: "test", | user: "test", | ||||
@@ -326,22 +327,21 @@ async function toCloseStyle() { | |||||
//#region 页面初始化 | //#region 页面初始化 | ||||
onLoad((options) => { | onLoad((options) => { | ||||
// showImgUrl.value = userInfoModulesPinia.myAvatar; | |||||
// 获取微信小程序的 AppID | |||||
// const appid = uni.getAccountInfoSync().miniProgram.appId; | |||||
// 微信登录授权 | // 微信登录授权 | ||||
if (userInfoModulesPinia.platForm != 1) { | |||||
if (userInfoModulesPinia.platForm == 2) { | |||||
uni.login({ | uni.login({ | ||||
provider: "weixin", // 使用微信登录授权 | provider: "weixin", // 使用微信登录授权 | ||||
success: async (res) => { | success: async (res) => { | ||||
console.log(res); | |||||
if (res.code) { | if (res.code) { | ||||
console.log(res.code); | |||||
try { | try { | ||||
uni.showLoading({ | uni.showLoading({ | ||||
title: "加载中...", | title: "加载中...", | ||||
mask: true, | mask: true, | ||||
}); | }); | ||||
const data = { | const data = { | ||||
appId: "wx75cf14e3a0d45821", | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
code: res.code, | code: res.code, | ||||
}; | }; | ||||
const res2 = await loginApi(data); | const res2 = await loginApi(data); | ||||
@@ -352,9 +352,13 @@ onLoad((options) => { | |||||
console.log(userInfoModulesPinia.openId, "获取openid"); | console.log(userInfoModulesPinia.openId, "获取openid"); | ||||
// 获取头像和金币 | // 获取头像和金币 | ||||
const res3 = await findImageApi(); | const res3 = await findImageApi(); | ||||
userInfoModulesPinia.myAvatar = | userInfoModulesPinia.myAvatar = | ||||
res3.data && res3.data.image ? res3.data.image : ""; | res3.data && res3.data.image ? res3.data.image : ""; | ||||
const res4 = await findGlodApi(); | const res4 = await findGlodApi(); | ||||
if (res4.data) { | |||||
uni.setStorageSync("userId", res4.data.id); | |||||
} | |||||
if (!res4.data) { | if (!res4.data) { | ||||
userInfoModulesPinia.myGlod = 0; | userInfoModulesPinia.myGlod = 0; | ||||
} else { | } else { | ||||
@@ -412,7 +416,78 @@ onLoad((options) => { | |||||
}, | }, | ||||
}); | }); | ||||
} | } | ||||
console.log(options); | |||||
// 抖音头条授权 | |||||
else if (userInfoModulesPinia.platForm == 3) { | |||||
uni.login({ | |||||
provider: "toutiao", // 使用微信登录授权 | |||||
success: async (res) => { | |||||
if (res.code) { | |||||
try { | |||||
uni.showLoading({ | |||||
title: "加载中...", | |||||
mask: true, | |||||
}); | |||||
const data = { | |||||
appId: userInfoModulesPinia.getAppId(), | |||||
code: res.code, | |||||
}; | |||||
const res2 = await loginApi(data); | |||||
userInfoModulesPinia.openId = res2.data.openId; | |||||
if (res2.data.token) { | |||||
userInfoModulesPinia.token = res2.data.token; | |||||
// uni.setStorageSync("token", userInfoModulesPinia.token); | |||||
console.log(userInfoModulesPinia.openId, "获取openid"); | |||||
// 获取头像和金币 | |||||
const res3 = await findImageApi(); | |||||
userInfoModulesPinia.myAvatar = | |||||
res3.data && res3.data.image ? res3.data.image : ""; | |||||
const res4 = await findGlodApi(); | |||||
if (!res4.data) { | |||||
userInfoModulesPinia.myGlod = 0; | |||||
} else { | |||||
userInfoModulesPinia.myGlod = res4.data.digitalAvatarResidueGlod | |||||
? res4.data.digitalAvatarResidueGlod | |||||
: 0; | |||||
} | |||||
uni.hideLoading(); | |||||
} else { | |||||
uni.hideLoading(); | |||||
uni.redirectTo({ | |||||
url: "/pages/login/index", | |||||
}); | |||||
console.log("error1"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
uni.hideLoading(); | |||||
} catch (error) { | |||||
uni.hideLoading(); | |||||
console.log(error, "error2"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
} else { | |||||
console.log("error3"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
} | |||||
}, | |||||
fail: (err) => { | |||||
console.log("error4"); | |||||
uni.showToast({ | |||||
title: "登录失败,请重试", | |||||
icon: "none", | |||||
}); | |||||
}, | |||||
}); | |||||
} | |||||
// 如果是从相机页返回 | |||||
}); | }); | ||||
onShow(() => { | onShow(() => { | ||||
// 若来自我的页面的更换头像按钮,直接触发以下操作 | // 若来自我的页面的更换头像按钮,直接触发以下操作 | ||||
@@ -421,6 +496,12 @@ onShow(() => { | |||||
chooseImage(); | chooseImage(); | ||||
uni.removeStorageSync("action"); | uni.removeStorageSync("action"); | ||||
} | } | ||||
// 若来相机页拍照,直接触发以下操作 | |||||
if (uni.getStorageSync("action") == 2) { | |||||
showImgUrl.value = userInfoModulesPinia.photoPath; | |||||
toCloseStyle(); | |||||
uni.removeStorageSync("action"); | |||||
} | |||||
}); | }); | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -433,6 +514,19 @@ function goOtherPage(url) { | |||||
} | } | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
//#region 相机 | |||||
const photoPath = ref(null); | |||||
function takePhoto() { | |||||
const ctx = uni.createCameraContext(); | |||||
ctx.takePhoto({ | |||||
quality: "high", | |||||
success: (res) => { | |||||
showImgUrl.value = res.tempImagePath; | |||||
}, | |||||
}); | |||||
} | |||||
//#endregion --------------------- | |||||
//#region | //#region | ||||
//#endregion --------------------- | //#endregion --------------------- | ||||
@@ -14,6 +14,9 @@ export const userInfoModules = defineStore("userInfoStore", () => { | |||||
const token = ref(null) | const token = ref(null) | ||||
const myAvatar = ref('') | const myAvatar = ref('') | ||||
const myGlod = ref(0) | const myGlod = ref(0) | ||||
const wxappid = "wx75cf14e3a0d45821" | |||||
const dyappid = "tt2eba5807b1883f9f01" | |||||
const photoPath = ref(null) //自定义相机拍照得到照片路径 | |||||
/** | /** | ||||
* @description:依托平台:(web、mp-weixin、mp-toutiao) | * @description:依托平台:(web、mp-weixin、mp-toutiao) | ||||
* @example 平台名:"web-H5",枚举值:1 | * @example 平台名:"web-H5",枚举值:1 | ||||
@@ -40,7 +43,14 @@ export const userInfoModules = defineStore("userInfoStore", () => { | |||||
// async function getMyGlod(params) { | // async function getMyGlod(params) { | ||||
// } | // } | ||||
return { userInfo, openId, token, myAvatar, myGlod, platForm, hostSystem }; | |||||
function getAppId() { | |||||
if (platForm.value == 2) { | |||||
return wxappid | |||||
} else if (platForm.value == 3) { | |||||
return dyappid | |||||
} | |||||
} | |||||
return { userInfo, openId, token, myAvatar, myGlod, platForm, hostSystem, wxappid, dyappid, getAppId }; | |||||
}, | }, | ||||
{ | { | ||||
@@ -44,4 +44,4 @@ const request = (requestObj) => { | |||||
}) | }) | ||||
}) | }) | ||||
}; | }; | ||||
export default request | |||||
export { BASE_URL, request } |
@@ -2,6 +2,8 @@ export default { | |||||
onShareAppMessage() { | onShareAppMessage() { | ||||
return { | return { | ||||
title: "邃芒智像", | title: "邃芒智像", | ||||
path: `/pages/login/index?userId=${uni.getStorageSync('userId')}`, | |||||
}; | }; | ||||
}, | }, | ||||
@@ -9,6 +11,8 @@ export default { | |||||
onShareTimeline() { | onShareTimeline() { | ||||
return { | return { | ||||
title: "邃芒智像", | title: "邃芒智像", | ||||
path: `/pages/login/index?userId=${uni.getStorageSync('userId')}`, | |||||
}; | }; | ||||
}, | }, | ||||
@@ -16,6 +20,7 @@ export default { | |||||
onAddToFavorites() { | onAddToFavorites() { | ||||
return { | return { | ||||
title: "邃芒智像", | title: "邃芒智像", | ||||
}; | }; | ||||
} | } | ||||
} | } |