diff --git a/src/pages/closeStyle/multiplayer copy 2.vue b/src/pages/closeStyle/multiplayer copy 2.vue
new file mode 100644
index 0000000..6ad56b8
--- /dev/null
+++ b/src/pages/closeStyle/multiplayer copy 2.vue
@@ -0,0 +1,253 @@
+
+
+
+ {{ styleData.title }}
+
+
+
+
+ +
+ 更换头像
+ 上传头像
+
+
+
+
+
+
+
+
+ 人物头像对应模板任务位置,点击按钮可以调整顺序
+ 开始制作写真
+
+ 耗金币2枚
+
+
+ 金币余额: 30
+
+
+
+
+
+
+
+
diff --git a/src/pages/closeStyle/multiplayer copy.vue b/src/pages/closeStyle/multiplayer copy.vue
new file mode 100644
index 0000000..bcd0e10
--- /dev/null
+++ b/src/pages/closeStyle/multiplayer copy.vue
@@ -0,0 +1,235 @@
+
+
+
+ {{ styleData.title }}
+
+
+
+
+
+
+
+
+
+ 更换头像
+
+
+
+
+
+ 上传头像
+
+
+ 人物头像对应模板任务位置,点击按钮可以调整顺序
+ 开始制作写真
+
+ 耗金币2枚
+
+
+ 金币余额: 30
+
+
+
+
+
+
+
+
diff --git a/src/pages/closeStyle/multiplayer.vue b/src/pages/closeStyle/multiplayer.vue
index cd67564..ddbc581 100644
--- a/src/pages/closeStyle/multiplayer.vue
+++ b/src/pages/closeStyle/multiplayer.vue
@@ -5,37 +5,97 @@
/>
{{ styleData.title }}
+
-
+
+ +
+
+ {{
+ avatarList[0].isMyAvatar ? "授权用户头像" : "已上传第1个头像"
+ }}
+ 更换头像
+ 上传头像
+
-
- 更换头像
+
+ +
+
+ {{
+ avatarList[1].isMyAvatar ? "授权用户头像" : "已上传第2个头像"
+ }}
+ 更换头像
+ 上传头像
+
-
- 上传头像
+
+ +
+
+ {{
+ avatarList[2].isMyAvatar ? "授权用户头像" : "已上传第3个头像"
+ }}
+ 更换头像
+ 上传头像
- 人物头像对应模板任务位置,点击按钮可以调整顺序
+ 人物头像对应模板人物位置,点击按钮可以调整顺序
开始制作写真
- 耗金币2枚
+ 耗金币{{ styleData.salePrice }}枚
金币余额: 30
+ >金币余额: {{ userInfoModulesPinia.myGlod }}
@@ -50,16 +110,22 @@ import {
findImageApi,
createPhotoApi,
} from "../../api/closeStyle";
+import { findGlodApi } from "../../api/home";
+import { userInfoModules } from "@/store/modules/userInfo";
//#endregion
+const userInfoModulesPinia = userInfoModules();
//#region 初始化
const styleId = ref(null);
const styleData = ref({});
onLoad((options) => {
// styleId.value = options.id;
- styleId.value = 4;
+ // styleId.value = "857147862095679488";
+ styleId.value = "245";
getInfo();
+ // getMyCoin();
});
+
async function getInfo() {
try {
const res = await findByIdApi(styleId.value);
@@ -72,8 +138,137 @@ 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,
+ // url: "https://suimang.oss-accelerate.aliyuncs.com/builtin/digital_avatar/girl/%E9%A3%8E%E9%87%87%E5%87%BA%E4%BC%97.jpg",
+ isMyAvatar: true,
+ },
+ {
+ url: "",
+ // url: "https://suimang.oss-accelerate.aliyuncs.com/builtin/digital_avatar/girl/%E9%AA%8F%E9%A9%AC%E4%BD%B3%E4%BA%BA.jpg",
+ isMyAvatar: false,
+ },
+ {
+ url: "",
+ // url: "https://suimang.oss-accelerate.aliyuncs.com/builtin/digital_avatar/girl/%E7%B4%AB%E8%96%87%E7%90%B4%E9%9F%B5.png",
+ 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: "https://test.metavatar.cc/C/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;
+ }
+ // 人脸识别接口
+ uni.uploadFile({
+ url: "https://test.metavatar.cc/C/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;
+ }
+ // 赋值
+ avatarList.value[index].url = res.tempFilePaths[0];
+ uni.hideLoading();
+ },
+ 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 ---------------------
+
//#region 生成写真照片
async function createing(id) {
try {
@@ -140,17 +335,45 @@ async function createing(id) {
margin-top: 67rpx;
}
.imgBoxItem {
+ position: relative;
width: 180rpx;
+ height: 250rpx;
display: flex;
flex-direction: column;
align-items: center;
- image {
+ .avatar {
+ position: absolute;
width: 180rpx;
height: 180rpx;
+ border-radius: 24rpx;
+ }
+ .noUrlBox {
+ position: absolute;
+ width: 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,
.uploadBtn {
- margin-top: 20rpx;
+ margin-top: 200rpx;
width: 150rpx;
height: 50rpx;
text-align: center;