HolyKnightIX 1 년 전
부모
커밋
35a192beed
12개의 변경된 파일280개의 추가작업 그리고 145개의 파일을 삭제
  1. +1
    -0
      README.md
  2. +62
    -3
      src/App.vue
  3. +17
    -0
      src/api/login.js
  4. BIN
      src/assets/icon/db_fill.png
  5. +54
    -47
      src/pages/closeStyle/closeStyle.vue
  6. +57
    -18
      src/pages/closeStyle/goCreatePhoto.vue
  7. +47
    -47
      src/pages/createing/index.vue
  8. +21
    -21
      src/pages/index/index.vue
  9. +7
    -7
      src/pages/lookPhoto/index.vue
  10. +1
    -1
      src/store/modules/userInfo.js
  11. +11
    -0
      src/style/my.scss
  12. +2
    -1
      src/utils/request.js

+ 1
- 0
README.md 파일 보기

@@ -2,6 +2,7 @@



"appid": "wx75cf14e3a0d45821",

git commit -m "feat: "
git commit --no-verify -m "提交时的注释" 跳过检验

+ 62
- 3
src/App.vue 파일 보기

@@ -5,7 +5,7 @@
<script setup>
import { onLaunch, onShow, onHide } from "@dcloudio/uni-app";
import { userInfoModules } from "@/store/modules/userInfo";
import { loginApi } from "./api/login";
const userInfoModulesPinia = userInfoModules();
onLaunch(() => {
console.log("App Launch!");
@@ -14,7 +14,6 @@ onLaunch(() => {
success: function (res) {
let uniPlatform = "";
let osName = "";
if (res.uniPlatform == "web") {
uniPlatform = 1;
} else if (res.uniPlatform == "mp-weixin") {
@@ -22,7 +21,6 @@ onLaunch(() => {
} else if (res.uniPlatform == "mp-toutiao") {
uniPlatform = 3;
}
if (res.osName == "windows") {
osName = 1;
} else if (res.osName == "ios") {
@@ -41,6 +39,67 @@ onLaunch(() => {
console.log(res.osName, osName, "System");
},
});
// 微信登录授权
uni.login({
provider: "weixin", // 使用微信登录授权
success: async (res) => {
console.log(res);
if (res.code) {
console.log(res.code);
try {
uni.showLoading({
title: "加载中...",
mask: true,
});
const data = {
appId: "wx75cf14e3a0d45821",
code: res.code,
};
const res2 = await loginApi(data);
userInfoModulesPinia.openId = res2.openId;
uni.hideLoading();
if (res2.code == 200) {
uni.redirectTo({
url: "pages/home/index",
});
} else {
// uni.redirectTo({
// url: "pages/index/index",
// });
uni.showToast({
title: "登录失败,请重试",
icon: "none",
});
}
} catch (error) {
// uni.redirectTo({
// url: "pages/index/index",
// });
uni.showToast({
title: "登录失败,请重试",
icon: "none",
});
}
} else {
// uni.redirectTo({
// url: "pages/index/index",
// });
uni.showToast({
title: "登录失败,请重试",
icon: "none",
});
}
},
fail: (err) => {
// uni.redirectTo({
// url: "pages/index/index",
// });
uni.showToast({
title: "登录失败,请重试",
icon: "none",
});
},
});
});
onShow(() => {
console.log("App Show!");


+ 17
- 0
src/api/login.js 파일 보기

@@ -5,4 +5,21 @@ export function voiceTotalApi() {
url: `api/voiceMould/voiceTotal`,
method: 'GET',
})
}
// 微信登录
export function loginApi(data) {
return request({
url: `api/miniApp/login`,
method: 'POST',
data
})
}
// 授权手机号登陆
export function loginPhoneApi(data) {
return request({
url: `api/miniApp/loginPhone`,
method: 'POST',
data
})
}

BIN
src/assets/icon/db_fill.png 파일 보기

Before After
Width: 200  |  Height: 200  |  Size: 2.5 KiB Width: 51  |  Height: 39  |  Size: 837 B

+ 54
- 47
src/pages/closeStyle/closeStyle.vue 파일 보기

@@ -1,9 +1,5 @@
<template>
<div class="page">
<view class="title imgContenBox"
><image src="../../assets/text/closeStyleText.png" mode="aspectFit"
/></view>

<u-list class="styleListBox" @scrolltolower="scrolltolower">
<u-list-item class="glodYBox">
<u-list-item
@@ -12,8 +8,9 @@
class="styleListBoxItme"
>
<view class="styleInfo" @click="createPhoto">
<image src="../../assets/icon/uploadImg.png" />
<text>样式风格</text>
<image src="../../assets/img/homeImg.png" mode="aspectFit" />
<text class="name">样式风格</text>
<text class="single">单人</text>
</view>
</u-list-item>
</u-list-item>
@@ -48,41 +45,33 @@ function createPhoto() {
</script>

<style lang="scss">
.title {
width: 100%;
height: 80rpx;
image {
width: 40%;
height: 80rpx;
}
}
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;
}
}
}
// 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;
// }
// }
// }
.u-list {
width: 100%;
width: 650rpx;
.glodYBox {
display: flex !important;
flex-direction: row !important;
@@ -96,20 +85,38 @@ scroll-view {
justify-content: space-between !important;
}
.styleInfo {
position: relative;
display: flex !important;
flex-wrap: wrap !important;
width: 350rpx;
height: 400rpx;
width: 300rpx;
height: 480rpx;
margin-bottom: 50rpx;
border-radius: 24rpx;
overflow: hidden;
image {
width: 350rpx;
height: 350rpx;
width: 300rpx;
height: 400rpx;
}
text {
.name {
background-color: red;
width: 100%;
height: 50rpx;
height: 80rpx;
text-align: center;
line-height: 80rpx;
font-size: 30rpx;
font-weight: bold;
}
.single {
position: absolute;
top: 11rpx;
right: 13rpx;
width: 72rpx;
height: 41rpx;
text-align: center;
line-height: 50rpx;
line-height: 41rpx;
background: #000000;
opacity: 0.4;
border-radius: 12rpx;
}
}
}


+ 57
- 18
src/pages/closeStyle/goCreatePhoto.vue 파일 보기

@@ -4,15 +4,17 @@
><image src="../../assets/img/img1.png" mode="aspectFit"
/></view>
<text class="name">风格名称</text>
<view class="buttonBox">
<up-button
type="primary"
text="开始制作写真"
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"
@click="createing"
></up-button>
<view class="orangeBtn" @click="createing"
>开始制作写真
<view class="free">
<image src="../../assets/icon/blackBG.png" mode="aspectFit" />
<text>耗金币2枚</text>
</view>
</view>
<view class="balance"
>金币余额:&nbsp;&nbsp;30
<image src="../../assets/icon/coin.png" mode="aspectFit" />
</view>
<text class="balance">金币余额:&nbsp;&nbsp;30</text>
</view>
</template>
@@ -37,9 +39,10 @@ function createing() {
<style lang="scss">
.showImgBox {
width: 710rpx;
height: 800rpx;
background-color: #ccc;
margin-top: 30rpx;
width: 540rpx;
height: 720rpx;
// background-color: #ccc;
border-radius: 30rpx;
image {
max-width: 100%;
@@ -47,15 +50,51 @@ function createing() {
}
}
.name {
margin-top: 30rpx;
margin-bottom: 50rpx;
margin-top: 80rpx;
margin-bottom: 110rpx;
font-size: 44rpx;
font-weight: 800;
}
.buttonBox {
width: 60%;
.orangeBtn {
position: relative;
.free {
position: absolute;
top: -18rpx;
right: -70rpx;
width: 142rpx;
height: 50rpx;
image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
text {
position: absolute;
top: 0rpx;
left: 0;
line-height: 49rpx;
width: 100%;
height: 100%;
font-size: 22rpx;
font-weight: 900;
z-index: 2;
}
}
}
.balance {
margin-top: 30rpx;
font-size: 40rpx;
display: inline-block;
margin-top: 70rpx;
font-size: 30rpx;
font-weight: bold;
line-height: 33rpx;
image {
display: inline-block;
width: 33rpx;
height: 33rpx;
vertical-align: middle;
}
}
</style>

+ 47
- 47
src/pages/createing/index.vue 파일 보기

@@ -4,47 +4,30 @@
<view class="imgContenBox">
<image src="../../assets/img/img2.png" mode="aspectFit" />
</view>
<up-button
type="primary"
text="更换风格"
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"
@click="changeStyle"
></up-button>
</view>
<view class="imgListBox">
<view
class="imgContenBox"
v-for="item in 4"
:key="item"
@click="goLookPhoto"
>
<image src="../../assets/img/img2.png" mode="aspectFit" />
</view>
<view class="changeStyle" @click="changeStyle">更换风格</view>
</view>
<!-- 轮播图 -->
<u-swiper
:list="swiperList"
previousMargin="60"
nextMargin="60"
circular
indicator
indicatorMode="line"
:autoplay="false"
radius="5"
bgColor="#333"
@click="goLookPhoto"
></u-swiper>
<!-- 生成中的底部栏 -->
<view v-show="false" class="createIng">
<text class="time">写真生成中,预计用时X分X秒</text>
<text class="inform">做好后通知我</text>
<up-button
class="goon"
type="primary"
text="继续制作写真"
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"
@click="changeStyle"
></up-button>
<view class="orangeBtn" @click="changeStyle">继续制作写真</view>
</view>
<!-- 生成成功的底部栏 -->
<view class="createEd">
<text class="look">点击查看高清写真</text>
<view class="buttonBox">
<up-button
class="goon"
type="primary"
text="重新生成"
color="linear-gradient(to right, rgb(66, 83, 216), rgb(213, 51, 186))"
@click="changeStyle"
></up-button>
</view>
<view class="orangeBtn anew" @click="changeStyle">重新生成</view>
</view>
</view>
</template>
@@ -56,7 +39,11 @@ import { voiceTotalApi } from "../../api/login.js";
//#endregion
//#region 生成写真照片
const swiperList = [
"https://cdn.uviewui.com/uview/swiper/swiper3.png",
"https://cdn.uviewui.com/uview/swiper/swiper2.png",
"https://cdn.uviewui.com/uview/swiper/swiper1.png",
];
//#endregion ---------------------
//#region 页面跳转
@@ -79,23 +66,30 @@ function goLookPhoto() {
<style lang="scss">
.topBox {
margin-top: 20rpx;
display: flex;
align-items: flex-end;
justify-content: flex-start;
align-items: center;
justify-content: space-between;
width: 100%;
height: 200rpx;
.imgContenBox {
width: 200rpx;
width: 150rpx;
height: 100%;
background-color: #ccc;
border-radius: 30rpx;
image {
width: 200rpx;
width: 150rpx;
max-height: 200rpx;
}
}
button {
width: 200rpx !important;
margin: 0 50rpx;
.changeStyle {
margin-right: 70rpx;
width: 220rpx;
height: 72rpx;
border: 1px solid #ff4f00;
border-radius: 36rpx;
text-align: center;
line-height: 72rpx;
color: #ff4f00;
}
}
.imgListBox {
@@ -117,7 +111,10 @@ function goLookPhoto() {
}
}
}
.u-swiper {
width: 100%;
height: 695rpx !important;
}
.createIng,
.createEd {
width: 100%;
@@ -126,12 +123,15 @@ function goLookPhoto() {
align-items: center;
justify-content: center;
.time {
font-size: 40rpx;
font-size: 26rpx;
font-weight: 900;
margin-top: 20rpx;
margin-bottom: 10rpx;
margin-bottom: 20rpx;
}
.inform {
font-size: 22rpx;
color: #ffffff;
opacity: 0.5;
margin-bottom: 30rpx;
}
.look {
@@ -140,8 +140,8 @@ function goLookPhoto() {
margin-top: 20rpx;
margin-bottom: 30rpx;
}
.buttonBox {
width: 50%;
.anew {
margin-top: 120rpx;
}
}
</style>

+ 21
- 21
src/pages/index/index.vue 파일 보기

@@ -37,7 +37,8 @@
<script setup>
//#region 导入
import { ref, reactive } from "vue";
import { voiceTotalApi } from "../../api/login.js";
import { voiceTotalApi, loginPhoneApi } from "../../api/login.js";
//#endregion
//#region 勾选
@@ -48,12 +49,9 @@ const checkboxList1 = reactive([
disabled: false,
},
]);
function toCreate() {
async function toCreate() {
if (checkboxValue1.value[0]) {
handleLogin();
uni.redirectTo({
url: "/pages/uploadPhoto/uploadPhoto",
});
await handleLogin();
} else {
uni.showModal({
title: "提示",
@@ -61,29 +59,31 @@ function toCreate() {
success: function (res) {
if (res.confirm) {
handleLogin();
uni.redirectTo({
url: "/pages/uploadPhoto/uploadPhoto",
});
} else if (res.cancel) {
}
},
});
}
}
function handleLogin() {
uni.login({
provider: "weixin", // 使用微信登录授权
success: (res) => {
console.log(res);
if (res.code) {
// 获取到微信授权登录的code,将code发送给后端
// this.loginWithCode(res.code);
} else {
console.log("登录失败:", res.errMsg);
}
const userInfo = ref(null);
async function handleLogin() {
// uni.getUserInfo({});
uni.getUserProfile({
desc: "用于完善用户信息",
success: (res1) => {
userInfo.value = res1.userInfo;
console.log(res1);
uni.showToast({
icon: "none",
title: "获取成功",
});
},
fail: (err) => {
console.log("登录失败:", err.errMsg);
console.log(err);
uni.showToast({
icon: "none",
title: "用户拒绝获取",
});
},
});
}


+ 7
- 7
src/pages/lookPhoto/index.vue 파일 보기

@@ -14,7 +14,7 @@
<text>我要让照片说话</text>
<view class="free">
<image src="../../assets/icon/blackBG.png" mode="aspectFit" />
<text>耗金币2枚</text>
<text>耗金币2枚</text>
</view>
</view>
<view @click="downloadImg" class="uploadBtn">
@@ -203,9 +203,9 @@ function bueCoin() {
font-weight: 900;
.free {
position: absolute;
top: -25rpx;
right: -80rpx;
width: 185rpx;
top: -18rpx;
right: -70rpx;
width: 142rpx;
height: 50rpx;
image {
position: absolute;
@@ -217,9 +217,9 @@ function bueCoin() {
}
text {
position: absolute;
top: -25rpx;
left: 50%;
transform: translate(-50%, 0);
top: 0rpx;
left: 0;
line-height: 49rpx;
width: 100%;
height: 100%;
font-size: 22rpx;


+ 1
- 1
src/store/modules/userInfo.js 파일 보기

@@ -3,7 +3,7 @@ import { ref, reactive } from "vue";
export const userInfoModules = defineStore("userInfoStore", () => {
// state
const userInfo = ref(null)
const openId = ref(null)
/**
* @description:依托平台:(web、mp-weixin、mp-toutiao)
* @example 平台名:"web-H5",枚举值:1


+ 11
- 0
src/style/my.scss 파일 보기

@@ -63,6 +63,17 @@ view {
width: 50%;
}
.orangeBtn {
background-color: #FF4F00;
width: 520rpx;
height: 100rpx;
line-height: 100rpx;
font-size: 30rpx;
font-weight: bold;
text-align: center;
border-radius: 100rpx;
}
// 主要文字颜色和图片颜色
// .imgggg {
// color: #4452d7;


+ 2
- 1
src/utils/request.js 파일 보기

@@ -1,4 +1,5 @@
const BASE_URL = 'https://test.metavatar.cc/C/';
// const BASE_URL = 'https://test.metavatar.cc/';
// 通用的网络请求函数,接收请求的URL和请求参数,返回一个Promise
const request = (requestObj) => {
@@ -6,7 +7,7 @@ const request = (requestObj) => {
uni.request({
url: BASE_URL + requestObj.url,
method: requestObj.method, // 这里可以根据需要更改请求方法
data: requestObj.params,
data: requestObj.data,
success: (res) => {
if (res.statusCode === 200) {
resolve(res.data)


불러오는 중...
취소
저장