完成签到

This commit is contained in:
LittleBoy 2022-11-21 17:37:51 +08:00
parent 86b1cd4d5f
commit f8a9856f0c
17 changed files with 356 additions and 84 deletions

View File

@ -1,27 +1,29 @@
{
"pages": [
"pages/user/login",
"pages/personal/personal",
"pages/index/index",
"pages/logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "Weixin",
"navigationBarTextStyle": "black"
},
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
},
{
"pagePath": "pages/personal/personal",
"text": "个人中心"
}
"pages": [
"pages/sign/index",
"pages/personal/personal",
"pages/user/login",
"pages/index/index",
"pages/logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "Weixin",
"navigationBarTextStyle": "black"
},
"tabBar": {
"list": [
{
"pagePath": "pages/index/index",
"text": "首页"
},
{
"pagePath": "pages/personal/personal",
"text": "个人中心"
}
]
},
"style": "v2",
"sitemapLocation": "sitemap.json"
},
"style": "v2",
"sitemapLocation": "sitemap.json"
}

View File

@ -7,4 +7,61 @@
justify-content: space-between;
padding: 200rpx 0;
box-sizing: border-box;
}
}
@content-widht:90%;
.content-container{
width: @content-widht;
margin: auto;
}
.user-info {
.header {
background-color: #ceb17f;
color: white;
width: 100%;
padding: 30px 0;
.content-container {
display: flex;
justify-content: space-between;
align-items: center;
}
.user-info {
display: flex;
align-items: center;
}
.user-avatar-wrapper {
width: 60px;
height: 60px;
border-radius: 50%;
display: inline-block;
overflow: hidden;
}
.nickname {
margin-left: 10px;
font-size: 20px;
}
.user-avatar {
width: 100%;
height: 100%;
display: block;
}
}
}
// 列表样式
.list{
background-color: white;
.list-title{}
.list-items{}
.item{
display: flex;
}
}
button[disabled],
button[aria-disabled=true]{
background-color: rgb(78, 61, 61);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -0,0 +1 @@
<svg class="svg-icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3698"><path d="M584.704 998.4H439.296c-228.352 0-413.696-185.344-413.696-413.696V439.296c0-228.352 185.344-413.696 413.696-413.696h145.408c228.352 0 413.696 185.344 413.696 413.696v145.408c0 228.352-185.344 413.696-413.696 413.696z" fill="#FF9A23" p-id="3699"></path><path d="M998.4 584.704V439.296c0-228.352-185.344-413.696-413.696-413.696H439.296C210.944 25.6 25.6 210.944 25.6 439.296v145.408c0 228.352 185.344 413.696 413.696 413.696h145.408c13.312 0 26.624-1.024 38.912-2.048 162.816-61.44 294.912-185.344 368.64-342.016 4.096-22.528 6.144-46.08 6.144-69.632z" fill="#FF9A23" p-id="3700"></path><path d="M584.704 25.6H439.296C210.944 25.6 25.6 210.944 25.6 439.296v145.408c0 158.72 90.112 296.96 222.208 366.592 45.056 10.24 91.136 16.384 139.264 16.384C715.776 967.68 983.04 700.416 983.04 371.712c0-17.408-1.024-34.816-2.048-51.2-51.2-171.008-208.896-294.912-396.288-294.912z" fill="#FF9F23" p-id="3701"></path><path d="M911.36 371.712c0-91.136-23.552-177.152-64.512-252.928-71.68-58.368-161.792-93.184-261.12-93.184H439.296C210.944 25.6 25.6 210.944 25.6 439.296v145.408c0 78.848 22.528 153.6 61.44 216.064 84.992 59.392 188.416 94.208 300.032 94.208C675.84 896 911.36 660.48 911.36 371.712z" fill="#FFA423" p-id="3702"></path><path d="M439.296 25.6C210.944 25.6 25.6 210.944 25.6 439.296v145.408c0 22.528 2.048 44.032 5.12 65.536 82.944 105.472 210.944 173.056 356.352 173.056C636.928 823.296 839.68 620.544 839.68 370.688 838.656 240.64 783.36 122.88 695.296 40.96c-34.816-9.216-71.68-15.36-109.568-15.36H439.296z" fill="#FFAA23" p-id="3703"></path><path d="M544.768 25.6H439.296C210.944 25.6 25.6 210.944 25.6 439.296v51.2c52.224 158.72 205.824 271.36 385.024 260.096 189.44-11.264 343.04-163.84 355.328-353.28 11.264-163.84-82.944-308.224-221.184-371.712z" fill="#FFAF23" p-id="3704"></path><path d="M391.168 375.808m-308.224 0a308.224 308.224 0 1 0 616.448 0 308.224 308.224 0 1 0-616.448 0Z" fill="#FFB423" p-id="3705"></path><path d="M155.648 374.784a235.52 235.52 0 1 0 471.04 0 235.52 235.52 0 1 0-471.04 0Z" fill="#FFB923" p-id="3706"></path><path d="M681.984 340.992c-107.52-107.52-300.032-91.136-380.928 52.224-41.984 72.704-41.984 164.864 0 237.568 80.896 142.336 272.384 159.744 380.928 52.224 93.184-93.184 96.256-248.832 0-342.016zM568.32 572.416c-14.336 14.336-27.648 29.696-37.888 44.032-9.216 12.288-27.648 12.288-36.864 0-11.264-14.336-24.576-29.696-39.936-44.032-15.36-15.36-30.72-29.696-46.08-40.96-11.264-8.192-11.264-25.6 1.024-33.792 15.36-10.24 30.72-23.552 46.08-37.888 16.384-16.384 30.72-34.816 43.008-51.2 7.168-9.216 21.504-9.216 28.672 0 11.264 16.384 25.6 33.792 41.984 50.176 14.336 14.336 30.72 27.648 45.056 38.912 11.264 8.192 12.288 25.6 0 33.792-14.336 10.24-29.696 23.552-45.056 40.96z" fill="#FFFFFF"></path></svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@ -4,7 +4,7 @@ type ApplicationConfig = {
}
const ConfigData = {
dev: {
api_url: 'http://localhost:8001',
api_url: 'http://localhost:8080',
env: 'dev'
},
prod: {

View File

@ -1,37 +1 @@
/* pages/personal.wxss */
@content-widht:90%;
.content-container{
width: @content-widht;
margin: auto;
}
.header{
background-color: #ceb17f;
color:white;
width: 100%;
padding: 30px 0;
.content-container{
display: flex;
justify-content: space-between;
align-items: center;
}
.user-info{
display: flex;
align-items: center;
}
.user-avatar-wrapper{
width: 60px;
height: 60px;
border-radius: 50%;
display: inline-block;
overflow: hidden;
}
.nickname{
margin-left: 10px;
font-size: 20px;
}
.user-avatar{
width: 100%;
height: 100%;
display: block;
}
}

View File

@ -1,5 +1,5 @@
<!--pages/personal.wxml-->
<view class="page-person">
<view class="page-person user-info">
<view class="header">
<div class="content-container">
<view class="user-info">

View File

@ -0,0 +1,6 @@
{
"usingComponents": {},
"navigationBarTitleText": "每日签到",
"navigationBarBackgroundColor": "#ceb17f",
"navigationBarTextStyle": "white"
}

View File

@ -0,0 +1,92 @@
/* pages/sign/index.less */
.page-sign{
background-color: #efeff4;
.header{
// 签到信息
.sign-info{
margin-left: 10px;
font-size: 14px;
}
.tomorrow{
color: rgba(255, 255, 255, 0.7);
margin-top: 2px;
font-size: 12px;
}
.user-score{
display: flex;
line-height: 30px;
}
.icon-coin{
width: 30px;
height: 30px;
margin-right: 5px;
}
}
.sign-container{
position: relative;
padding: 0px 0 20px;
.bg{
background-color: #ceb17f;
height: 100px;
position: absolute;
left:0;top:0;
right:0;
z-index: 1;
}
}
.sign-content-wrapper{
background-color: white;
padding: 15px;
position: relative;
z-index: 2;
width: 85%;
margin: auto;
border-radius: 20rpx;
}
.title-bar{
color: #333;
font-size: 30rpx;
font-weight: bold;
}
.sign-items{
font-size:10px;
display: flex;
margin-top: 10px;
.item{
flex:1;
margin-right: 10px;
text-align: center;
&:last-child{
margin-right: 0;
}
}
.point{
background-color: #f0f0f0;
padding: 8px 0 6px;
border-radius: 6px;
margin-bottom: 5px;
&.signed{
background-color: #fbe2d8;
color:#ef7e67;
}
}
image{
width: 30px;
height: 30px;
}
}
.btn-sign{
background-color: #ec653c;
color:white;
width: 100%;
margin-top: 20px;
border-radius: 30px;
&[disabled]{
background-color: #ccc;
}
}
}

View File

@ -0,0 +1,36 @@
import message from "../../utils/message"
import { info, sign } from "../user/api"
// pages/sign/index.ts
Page({
/**
*
*/
data: {
signToday: false,
continuousDays: 0,
dayTextArray:[
'一','二','三','四','五','六','七'
]
},
/**
* --
*/
onLoad() {
info().then(res=>{
this.setData(res)
})
},
onSignTag(){
message.showLoading({})
sign().then(res=>{
message.hideLoading()
this.setData(res)
}).catch(err=>{
message.hideLoading()
message.toast(err.message)
})
}
})

View File

@ -0,0 +1,85 @@
<!--pages/sign/index.wxml-->
<view class="page-sign user-info">
<view class="header">
<div class="content-container">
<view class="user-info">
<view class="user-avatar-wrapper">
<open-data class="user-avatar" type="userAvatarUrl"></open-data>
</view>
<view class="sign-info">
<view class="text-days">
已连续签到 {{continuousDays}} 天
</view>
<view class="tomorrow">
{{signToday?'明':'今'}}日签到可获得 {{
(continuousDays+1)*5
}} 积分
</view>
</view>
</view>
<view class="user-score">
<image class="icon-coin" src="./../../assets/images/coin.svg"></image>
<text>111</text>
</view>
</div>
</view>
<view class="sign-container">
<view class="bg"></view>
<view class="sign-content-wrapper ">
<view class="title-bar">
<text>连续签到得积分</text>
</view>
<view class="sign-items">
<view wx:for="{{dayTextArray}}" class="item">
<view class="point {{index<continuousDays?'signed':''}}">
<view>
<image src="./../../assets/images/coin.svg" alt="" />
</view>
<text>{{(index +1 ) * 5}}积分</text>
</view>
<view>
<text>第{{item}}天</text>
</view>
</view>
</view>
<!-- disabled="true" -->
<button disabled="{{signToday}}" bindtap="onSignTag" class="btn-sign">立即签到</button>
</view>
</view>
<view class="list">
<view class="list-title">
<text>做任务领积分</text>
</view>
<view class="list-items">
<view class="item">
<view class="icon"></view>
<view class="content">
完善个人资料
</view>
<view class="right">
<button>完成任务</button>
</view>
</view>
<view class="item">
<view class="icon"></view>
<view class="content">
开通VIP会员
</view>
<view class="right">
<button>完成任务</button>
</view>
</view>
<view class="item">
<view class="icon"></view>
<view class="content">
首次兑换商品
</view>
<view class="right">
<button>完成任务</button>
</view>
</view>
</view>
</view>
</view>

5
miniprogram/pages/types.d.ts vendored Normal file
View File

@ -0,0 +1,5 @@
type UserInfo = {
id: number
nickname: string
headImage: string
}

View File

@ -0,0 +1,19 @@
import request from "../../utils/request";
export type SignInfo = {
signToday: boolean
continuousDays: number
}
/**
*
*/
export function info(){
return request<SignInfo>('/sign/info');
}
/**
*
*/
export function sign(){
return request<SignInfo>('/sign/today');
}

View File

@ -18,10 +18,12 @@ Page({
async onLoad() {
},
async onGetUserInfo() {
message.showLoading()
message.showLoading({})
try {
// 发起登录的授权
const data = await getUserProfile()
const res = await request('/wechat/login', data)
const res = await request<UserInfo>('/wechat/login', data)
console.log(res)
} finally {
message.hideLoading()

View File

@ -1,7 +1,7 @@
import message from "./message"
/**
* wx.login
* wx.login code
* @param timeout
*/
export function login(timeout = 10000) {
@ -37,29 +37,29 @@ type UserProfileData = {
*/
code: string
}
export function getUserProfile(timeout = 10000) {
return new Promise<UserProfileData>((resolve, reject) => {
login(timeout).then(code => {
wx.getUserProfile({
desc: '展示用户信息并参与相关活动',
success: (res) => {
console.log(res)
if (res.errMsg == 'getUserProfile:ok' && res.encryptedData) {
wx.getUserProfile({
desc: '展示用户信息并参与相关活动',
success: (res) => {
if (res.errMsg == 'getUserProfile:ok' && res.encryptedData) {
login(timeout).then(code => {
resolve({
encryptedData: res.encryptedData,
iv: res.iv,
code
})
} else {
message.toast('登录失败,请重新登录', 'error')
reject('登录失败,' + res.errMsg)
}
},
fail: (e) => {
}).catch(reject)
} else {
message.toast('登录失败,请重新登录', 'error')
reject('登录失败,' + e.errMsg)
reject('登录失败,' + res.errMsg)
}
})
}).catch(reject)
},
fail: (e) => {
message.toast('登录失败,请重新登录', 'error')
reject('登录失败,' + e.errMsg)
}
})
});
}

View File

@ -25,10 +25,10 @@ function request<T>(api: string, data: any = null, method: HttpMethod = 'POST')
header.token = token
}
// 对于post请求发送json数据
if (method === 'POST') {
if (method !== 'POST') {
header['content-type'] = 'application/json'
}
return new Promise((resolve, reject) => {
return new Promise<T>((resolve, reject) => {
wx.request<ApiResponse<T>>({
url: config.api_url + api,
data,
@ -44,12 +44,14 @@ function request<T>(api: string, data: any = null, method: HttpMethod = 'POST')
reject(new BizError('请求数据失败(empty)', -1))
return;
}
// 获取响应数据
const result = res.data
// 验证接口是否正确
if (result.code !== 0) {
reject(new BizError(result.message, result.code))
return;
}
// 请求成功 直接回调
resolve(result.data)
},
fail: (e) => {

View File

@ -9,7 +9,8 @@
"projectname": "ts-demo",
"setting": {
"useCompilerPlugins": [
"typescript"
"typescript",
"less"
],
"babelSetting": {
"ignore": [],