├── README.md ├── app.js ├── app.json ├── app.wxss ├── components ├── audioPlay │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── find │ ├── punchCardProjectListItem.js │ ├── punchCardProjectListItem.json │ ├── punchCardProjectListItem.wxml │ └── punchCardProjectListItem.wxss └── mine │ ├── diaryItem.js │ ├── diaryItem.json │ ├── diaryItem.wxml │ └── diaryItem.wxss ├── images ├── backgroundImg │ └── img_1.png ├── bottomIcon │ ├── add.png │ ├── cancel.png │ ├── collect-btn.png │ ├── collect-fill-btn.png │ ├── custom_label_icon.png │ ├── delete.png │ ├── down.png │ ├── down_gray.png │ ├── edit.png │ ├── edit_2.png │ ├── find.png │ ├── find_light.png │ ├── gold.png │ ├── index.png │ ├── index_light.png │ ├── more.png │ ├── my.png │ ├── my_light.png │ ├── news.png │ ├── news_light.png │ ├── picture.png │ ├── picture_2.png │ ├── picture_3.png │ ├── project_label_icon_0.png │ ├── project_label_icon_1.png │ ├── project_label_icon_2.png │ ├── project_label_icon_3.png │ ├── project_label_icon_4.png │ ├── project_label_icon_5.png │ ├── project_label_icon_6.png │ ├── project_label_icon_7.png │ ├── project_label_icon_8.png │ ├── recommend.png │ ├── search.png │ ├── sound.png │ ├── text.png │ └── video.png ├── button │ ├── add.png │ ├── add_200.png │ ├── address_light.png │ ├── audio_pause.png │ ├── audio_pause_2.png │ ├── audio_play.png │ ├── audio_play_2.png │ ├── audio_play_3.png │ ├── back_setting.png │ ├── base_setting.png │ ├── calendar.png │ ├── cancel.png │ ├── cancel_red.png │ ├── close.png │ ├── close_2.png │ ├── close_red.png │ ├── comment_btn.png │ ├── creator_college.png │ ├── creator_marketing_tool.png │ ├── delete.png │ ├── diaryPunchAddress.png │ ├── down_btn.png │ ├── edit.png │ ├── edit_project_detail.png │ ├── end.png │ ├── filter.png │ ├── hide.png │ ├── honour.png │ ├── into_btn_black.png │ ├── into_btn_gray.png │ ├── into_button.png │ ├── into_index_black.png │ ├── into_index_gray.png │ ├── invite-btn.png │ ├── invite.png │ ├── like_200.png │ ├── like_btn.png │ ├── like_btn_2.png │ ├── location.png │ ├── location_light.png │ ├── mail.png │ ├── member_manage.png │ ├── more.png │ ├── more_200.png │ ├── my_collect.png │ ├── my_collect_2.png │ ├── my_create_project.png │ ├── my_create_project_2.png │ ├── my_follow.png │ ├── my_follow_2.png │ ├── my_follower.png │ ├── my_follower_2.png │ ├── my_gold_coin.png │ ├── news_comment.png │ ├── news_like.png │ ├── pause.png │ ├── pc_back_stage.png │ ├── people.png │ ├── punch_card_creator_icon.png │ ├── qr_code_img.png │ ├── question.png │ ├── remark.png │ ├── return_button.png │ ├── setting-black.png │ ├── setting.png │ ├── setting_2.png │ ├── sex_female.png │ ├── sex_male.png │ ├── share_btn.png │ ├── start.png │ ├── sticky.png │ ├── time.png │ ├── unlike_btn.png │ ├── up_btn.png │ └── userInfoSetBtn.png ├── default │ ├── empty_notice.png │ ├── project_cover_img.png │ ├── punch_card_invite.png │ └── userAvatar.png └── loginAuth │ └── loginAuth.png ├── lib └── qqmap-wx-jssdk.js ├── note.md ├── pages ├── createPunchCardProject │ ├── stepOne │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss │ ├── stepThree │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ ├── index.wxss │ │ ├── updateCoverImg │ │ │ ├── index.js │ │ │ ├── index.json │ │ │ ├── index.wxml │ │ │ └── index.wxss │ │ ├── updateCreatorInfo │ │ │ ├── index.js │ │ │ ├── index.json │ │ │ ├── index.wxml │ │ │ └── index.wxss │ │ └── updateProjectIntrInfo │ │ │ ├── index.js │ │ │ ├── index.json │ │ │ ├── index.wxml │ │ │ └── index.wxss │ └── stepTwo │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss ├── diaryDetailPage │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── find │ ├── index.js │ ├── index.json │ ├── index.wxml │ ├── index.wxss │ ├── searchPunchCardProject │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss │ └── showPunchCardProjectByType │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss ├── index │ ├── allProjectList │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── loginAuth │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── mine │ ├── index.js │ ├── index.json │ ├── index.wxml │ ├── index.wxss │ └── personalHomePage │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ ├── index.wxss │ │ ├── setting.js │ │ ├── setting.json │ │ ├── setting.wxml │ │ └── setting.wxss ├── news │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── newsDetailPage │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── position │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── projectBackStageManage │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── publishComment │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss └── punchCardDetailPage │ ├── index.js │ ├── index.json │ ├── index.wxml │ ├── index.wxss │ └── publishPunchCardDiary │ ├── index.js │ ├── index.json │ ├── index.wxml │ └── index.wxss ├── project.config.json ├── sitemap.json ├── utils └── common.js └── weui.wxss /README.md: -------------------------------------------------------------------------------- 1 | #### 1、项目说明 2 | 本项目为个人学习项目,仿照于微信小程序小打卡,只提供于参考学习!!! 3 | 4 | #### 2、项目详细说明 5 | 页面展示、项目详细功能暂时放在博客上面了https://blog.csdn.net/qq_32346189/article/details/90757733 6 | 7 | #### 3、开发工具 8 | 9 | - webstorm(编码) 10 | - webstorm无法识别微信小程序尺寸单位rpx: 安装webstorm插件**wxapp-support** 11 | 12 | - 微信小程序开发者工具(预览、调试) 13 | 14 | #### 4、开发过程遇到的问题,先做个粗糙的笔记 15 | [笔记地址](https://github.com/MYxu/SmallPunchCardMiniProgram/blob/master/note.md) 16 | -------------------------------------------------------------------------------- /app.js: -------------------------------------------------------------------------------- 1 | App({ 2 | 3 | /** 4 | * 当小程序初始化完成时,会触发 onLaunch(全局只触发一次) 5 | */ 6 | onLaunch: function () { 7 | 8 | let that = this; 9 | // 获取设备的相关信息 10 | wx.getSystemInfo({ 11 | success: function (res) { 12 | that.globalData.windowWidth = res.windowWidth; 13 | that.globalData.windowHeight = res.windowHeight; 14 | that.globalData.pixelRatio = res.pixelRatio; 15 | 16 | }, 17 | fail: function (res) { 18 | console.log(res); 19 | } 20 | }) 21 | 22 | 23 | }, 24 | 25 | /** 26 | * 当小程序启动,或从后台进入前台显示,会触发 onShow 27 | */ 28 | onShow: function (options) { 29 | }, 30 | 31 | /** 32 | * 当小程序从前台进入后台,会触发 onHide 33 | */ 34 | onHide: function () { 35 | 36 | }, 37 | 38 | /** 39 | * 当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息 40 | */ 41 | onError: function (msg) { 42 | 43 | }, 44 | globalData: { 45 | openid: '0', 46 | userInfo: { 47 | nick_name: '', 48 | avatar_url: '', 49 | sex: 0 // 性别 0-未知,1-男性,2-女性 50 | }, 51 | urlRootPath: "https://armin-xu.cn/SmallPunchMiniProgramAfterEnd/public/", 52 | // urlRootPath_local: 53 | // "http://myxu.com/EndProject/SmallPunchMiniProgramAfterEnd/public/", 54 | // urlRootPath: "http://myxu.com/EndProject/SmallPunchMiniProgramAfterEnd/public/", 55 | // 服务器图片访问BaseURl 56 | imgBaseSeverUrl: "https://armin-xu.cn/SmallPunchMiniProgramAfterEnd/" 57 | // imgBaseSeverUrl: "http://myxu.com/EndProject/SmallPunchMiniProgramAfterEnd/" 58 | 59 | } 60 | }); -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "pages": [ 3 | "pages/index/index", 4 | "pages/loginAuth/index", 5 | "pages/find/index", 6 | "pages/news/index", 7 | "pages/mine/index", 8 | "pages/mine/personalHomePage/index", 9 | "pages/mine/personalHomePage/setting", 10 | "pages/createPunchCardProject/stepOne/index", 11 | "pages/createPunchCardProject/stepTwo/index", 12 | "pages/createPunchCardProject/stepThree/index", 13 | "pages/createPunchCardProject/stepThree/updateCreatorInfo/index", 14 | "pages/createPunchCardProject/stepThree/updateProjectIntrInfo/index", 15 | "pages/punchCardDetailPage/index", 16 | "pages/createPunchCardProject/stepThree/updateCoverImg/index", 17 | "pages/punchCardDetailPage/publishPunchCardDiary/index", 18 | "pages/position/index", 19 | "pages/publishComment/index", 20 | "pages/projectBackStageManage/index", 21 | "pages/find/searchPunchCardProject/index", 22 | "pages/find/showPunchCardProjectByType/index", 23 | "pages/index/allProjectList/index", 24 | "pages/diaryDetailPage/index", 25 | "pages/newsDetailPage/index" 26 | ], 27 | "permission": { 28 | "scope.userLocation": { 29 | "desc": "你的位置信息将用于推荐附近的小打卡用户、打卡地点定位" 30 | } 31 | }, 32 | "window": { 33 | "navigationBarBackgroundColor": "#F0B27A", 34 | "navigationBarTitleText": "", 35 | "navigationStyle": "default" 36 | }, 37 | "tabBar": { 38 | "color": "#8a8a8a", 39 | "selectedColor": "#F0B27A", 40 | "list": [ 41 | { 42 | "pagePath": "pages/index/index", 43 | "text": "首页", 44 | "iconPath": "images/bottomIcon/index.png", 45 | "selectedIconPath": "images/bottomIcon/index_light.png" 46 | }, 47 | { 48 | "pagePath": "pages/find/index", 49 | "text": "发现", 50 | "iconPath": "images/bottomIcon/find.png", 51 | "selectedIconPath": "images/bottomIcon/find_light.png" 52 | }, 53 | { 54 | "pagePath": "pages/news/index", 55 | "text": "消息", 56 | "iconPath": "images/bottomIcon/news.png", 57 | "selectedIconPath": "images/bottomIcon/news_light.png" 58 | }, 59 | { 60 | "pagePath": "pages/mine/index", 61 | "text": "我的", 62 | "iconPath": "images/bottomIcon/my.png", 63 | "selectedIconPath": "images/bottomIcon/my_light.png" 64 | } 65 | ] 66 | }, 67 | "networkTimeout": { 68 | "request": 10000, 69 | "downloadFile": 10000 70 | }, 71 | "debug": true, 72 | "sitemapLocation": "sitemap.json" 73 | } -------------------------------------------------------------------------------- /app.wxss: -------------------------------------------------------------------------------- 1 | @import "weui.wxss"; 2 | page { 3 | height: 100%; 4 | width: 100%; 5 | } 6 | 7 | .container { 8 | width: 100%; 9 | height: 100%; 10 | } 11 | 12 | .separator-height-1px { 13 | width: 100%; 14 | height: 1px; 15 | background-color: #e5e5e5; 16 | } 17 | 18 | .separator-height-2px { 19 | width: 100%; 20 | height: 2px; 21 | background-color: #e5e5e5; 22 | } 23 | 24 | .separator-height-5px { 25 | width: 100%; 26 | height: 5px; 27 | background-color: whitesmoke; 28 | } 29 | 30 | 31 | .separator-height-8px { 32 | width: 100%; 33 | height: 8px; 34 | background-color: whitesmoke; 35 | } 36 | 37 | .separator-height-10px { 38 | width: 100%; 39 | height: 10px; 40 | background-color: whitesmoke; 41 | } 42 | -------------------------------------------------------------------------------- /components/audioPlay/index.js: -------------------------------------------------------------------------------- 1 | import {formatSeconds} from "../../utils/common"; 2 | 3 | let app = getApp(); 4 | Component({ 5 | /** 6 | * 组件的属性列表 7 | */ 8 | properties: { 9 | audioFileInfo: { 10 | type: Object, 11 | // 属性说明: { 12 | // resource_url: '音频文件的路径', 13 | // id: '资源文件id', 14 | // type: '资源文件类型' 15 | // } 16 | }, 17 | audioName: { 18 | type: String 19 | }, 20 | audioPlayStatusFlag: { 21 | type: String 22 | } 23 | }, 24 | 25 | /** 26 | * 组件的初始数据 27 | */ 28 | data: { 29 | resRootPath: app.globalData.imgBaseSeverUrl, // 服务器资源访问BaseURL 30 | 31 | innerAudioContext: '', // 用于播放所录音频的内部audio上下文InnerAudioContext 32 | audioPlayStatus: 'pause', // 音频播放状态 pause => 暂停播放中 & play => 播放中 33 | audioPlayCurrTime: 0, // 音频当前播放时长 秒 34 | audioPlayCurrTimeStr: '00:00', // 音频当前播放时长 字符串 35 | audioPlayEndTime: 0, // 音频总时长 秒 36 | audioPlayEndTimeStr: '00:00', // 音频总时长 字符串 37 | }, 38 | 39 | // 在音频未播放之前获取总时长 40 | attached: function () { 41 | let that = this; 42 | let innerAudioContext = that.getInnerAudioContext(); 43 | 44 | // 设置音频文件播放源 45 | innerAudioContext.src = that.data.resRootPath + that.data.audioFileInfo.resource_url; 46 | 47 | //音频进入可以播放状态,但不保证后面可以流畅播放 48 | // innerAudioContext.onCanplay(() => { 49 | // innerAudioContext.duration //类似初始化-必须触发-不触发此函数延时也获取不到 50 | // setTimeout(function () { 51 | // that.data.audioPlayEndTime = Math.floor(innerAudioContext.duration); 52 | // that.setData({ 53 | // audioPlayEndTime: innerAudioContext.duration, 54 | // audioPlayEndTimeStr: formatSeconds(that.data.audioPlayEndTime) 55 | // }); 56 | // }, 1000)  //这里设置延时100毫秒获取 57 | // }); 58 | 59 | console.log('audioPlayComponent attached'); 60 | }, 61 | 62 | observers: { 63 | 'audioPlayStatusFlag': function (audioPlayStatusFlag) { 64 | console.log('音频组件--'+ this.data.audioFileInfo.id +'播放状态'+ audioPlayStatusFlag); 65 | if (audioPlayStatusFlag === 'play') { 66 | this.startAudioPlayNoNotify() 67 | } 68 | 69 | if (audioPlayStatusFlag === 'pause') { 70 | this.pauseAudioPlayNoNotify() 71 | } 72 | } 73 | }, 74 | 75 | /** 76 | * 组件的方法列表 77 | */ 78 | methods: { 79 | 80 | // 获取用于播放所录音频的内部audio上下文InnerAudioContext 81 | getInnerAudioContext: function () { 82 | let that = this; 83 | 84 | if (that.data.innerAudioContext === '') 85 | that.data.innerAudioContext = wx.createInnerAudioContext(); 86 | 87 | return that.data.innerAudioContext; 88 | }, 89 | 90 | // 开始播放录制好的音频 91 | startAudioPlay: function () { 92 | let that = this; 93 | let innerAudioContext = that.getInnerAudioContext(); 94 | 95 | // 设置音频文件播放源 96 | innerAudioContext.src = that.data.resRootPath + that.data.audioFileInfo.resource_url; 97 | 98 | innerAudioContext.play(); 99 | 100 | // 动态修改播放时间和进度条 101 | innerAudioContext.onPlay(function () { 102 | 103 | innerAudioContext.onTimeUpdate(function () { 104 | that.data.audioPlayCurrTime = Math.floor(innerAudioContext.currentTime); 105 | that.data.audioPlayEndTime = Math.floor(innerAudioContext.duration); 106 | that.setData({ 107 | audioPlayCurrTimeStr: formatSeconds(that.data.audioPlayCurrTime), 108 | audioPlayEndTimeStr: formatSeconds(that.data.audioPlayEndTime), 109 | audioPlayCurrTime: that.data.audioPlayCurrTime, 110 | audioPlayEndTime: that.data.audioPlayEndTime 111 | }); 112 | }); 113 | }); 114 | 115 | // 设置音频播放至结束后的回调函数 设置结束后的控制按钮为播放按钮 116 | innerAudioContext.onEnded(function () { 117 | innerAudioContext.offTimeUpdate(); 118 | setTimeout(function () { 119 | that.setData({ 120 | audioPlayCurrTimeStr: '00:00', 121 | audioPlayCurrTime: 0 122 | }); 123 | }, 500); 124 | 125 | that.setData({ 126 | audioPlayStatus: 'pause', 127 | }); 128 | 129 | console.log('音频暂停'); 130 | // 音频组件播放状态发生改变,通知父级组件或者使用该组件的页面 131 | let eventDetail = { 132 | audioId: that.data.audioFileInfo.id, 133 | audioPlayStatus: 'pause' 134 | }; 135 | that.triggerEvent('audioStatusChangeNotice', eventDetail); 136 | }); 137 | 138 | that.setData({ 139 | audioPlayStatus: 'play' 140 | }); 141 | 142 | console.log('音频播放'); 143 | // 音频组件播放状态发生改变,通知父级组件或者使用该组件的页面 144 | let eventDetail = { 145 | audioId: that.data.audioFileInfo.id, 146 | audioPlayStatus: 'play' 147 | }; 148 | that.triggerEvent('audioStatusChangeNotice', eventDetail); 149 | }, 150 | startAudioPlayNoNotify: function () { 151 | let that = this; 152 | let innerAudioContext = that.getInnerAudioContext(); 153 | 154 | // 设置音频文件播放源 155 | innerAudioContext.src = that.data.resRootPath + that.data.audioFileInfo.resource_url; 156 | 157 | innerAudioContext.play(); 158 | 159 | // 动态修改播放时间和进度条 160 | innerAudioContext.onPlay(function () { 161 | 162 | innerAudioContext.onTimeUpdate(function () { 163 | that.data.audioPlayCurrTime = Math.floor(innerAudioContext.currentTime); 164 | that.data.audioPlayEndTime = Math.floor(innerAudioContext.duration); 165 | that.setData({ 166 | audioPlayCurrTimeStr: formatSeconds(that.data.audioPlayCurrTime), 167 | audioPlayEndTimeStr: formatSeconds(that.data.audioPlayEndTime), 168 | audioPlayCurrTime: that.data.audioPlayCurrTime, 169 | audioPlayEndTime: that.data.audioPlayEndTime 170 | }); 171 | }); 172 | }); 173 | 174 | // 设置音频播放至结束后的回调函数 设置结束后的控制按钮为播放按钮 175 | innerAudioContext.onEnded(function () { 176 | innerAudioContext.offTimeUpdate(); 177 | setTimeout(function () { 178 | that.setData({ 179 | audioPlayCurrTimeStr: '00:00', 180 | audioPlayCurrTime: 0 181 | }); 182 | }, 500); 183 | 184 | that.setData({ 185 | audioPlayStatus: 'pause', 186 | }); 187 | 188 | console.log('音频暂停'); 189 | }); 190 | 191 | that.setData({ 192 | audioPlayStatus: 'play' 193 | }); 194 | }, 195 | 196 | // 暂停播放录制好的音频 197 | pauseAudioPlay: function () { 198 | let that = this; 199 | let innerAudioContext = that.getInnerAudioContext(); 200 | innerAudioContext.pause(); 201 | innerAudioContext.onPause(function () { 202 | // 取消监听音频播放进度更新事件 203 | innerAudioContext.offTimeUpdate(); 204 | }); 205 | 206 | that.setData({ 207 | audioPlayStatus: 'pause' 208 | }); 209 | 210 | console.log('音频暂停'); 211 | // 音频组件播放状态发生改变,通知父级组件或者使用该组件的页面 212 | let eventDetail = { 213 | audioId: that.data.audioFileInfo.id, 214 | audioPlayStatus: 'pause' 215 | }; 216 | that.triggerEvent('audioStatusChangeNotice', eventDetail); 217 | }, 218 | pauseAudioPlayNoNotify: function () { 219 | let that = this; 220 | let innerAudioContext = that.getInnerAudioContext(); 221 | innerAudioContext.pause(); 222 | innerAudioContext.onPause(function () { 223 | // 取消监听音频播放进度更新事件 224 | innerAudioContext.offTimeUpdate(); 225 | }); 226 | 227 | that.setData({ 228 | audioPlayStatus: 'pause' 229 | }); 230 | }, 231 | } 232 | }); 233 | -------------------------------------------------------------------------------- /components/audioPlay/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "component": true, 3 | "usingComponents": {} 4 | } -------------------------------------------------------------------------------- /components/audioPlay/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | {{audioName}} 23 | 24 | 25 | {{audioPlayCurrTimeStr}} 26 | 27 | 28 | 29 | 31 | 32 | 33 | 34 | {{audioPlayEndTimeStr}} 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /components/audioPlay/index.wxss: -------------------------------------------------------------------------------- 1 | /*音频播放视图*/ 2 | .punch-card-diary-audio-play-item { 3 | width: auto; 4 | height: 130rpx; 5 | margin: 20rpx 0; 6 | 7 | background-color: #B2DFDB; 8 | 9 | border-radius: 14rpx; 10 | 11 | display: flex; 12 | flex-direction: row; 13 | justify-content: flex-start; 14 | align-items: center; 15 | flex-wrap: nowrap; 16 | } 17 | 18 | /*音频播放视图 控制按钮区块*/ 19 | .audio-control-btn-area { 20 | /*background-color: #64DD17;*/ 21 | width: 20%; 22 | height: 130rpx; 23 | 24 | display: flex; 25 | flex-direction: row; 26 | flex-wrap: nowrap; 27 | justify-content: center; 28 | align-items: center; 29 | } 30 | .audio-control-btn { 31 | /*width: 60%;*/ 32 | /*height: 60%;*/ 33 | /*border: 6rpx solid whitesmoke;*/ 34 | /*border-radius: 50%;*/ 35 | 36 | /*display: flex;*/ 37 | /*flex-direction: row;*/ 38 | /*justify-content: center;*/ 39 | /*align-items: center;*/ 40 | 41 | /*解决图片高度等同宽度问题*/ 42 | /** 43 | * 个人理解是: 44 | * 1、在父级元素中设置高度为0,设置padding-bottom的百分比来撑开元素高度, 45 | * 由于padding-bottom、padding-top这两个属性的百分比是根据元素宽度计算的,所以只要 46 | * padding-bottom的百分比跟宽度百分比一致,这时候得到就是一个正方形的父级元素了 47 | * 2、最后还要分别设置父级、子级元素relative|absolute定位属性,现在我还没搞懂原理(不设置不行) 48 | */ 49 | width: 60%; 50 | height: 0; 51 | padding-bottom: 60%; 52 | position: relative; 53 | } 54 | .audio-control-btn > image { 55 | /*width: 40rpx;*/ 56 | /*height: 40rpx;*/ 57 | 58 | /*解决图片高度等同于宽度问题*/ 59 | width: 100%; 60 | height: 100%; 61 | position: absolute; 62 | } 63 | 64 | /*音频播放视图 播放进度条区域*/ 65 | .audio-play-progress-area { 66 | /*background-color: yellow;*/ 67 | width: 80%; 68 | height: 130rpx; 69 | 70 | display: flex; 71 | flex-direction: column; 72 | flex-wrap: nowrap; 73 | justify-content: flex-start; 74 | align-items: flex-start; 75 | } 76 | 77 | .audio-name { 78 | height: 26rpx; 79 | width: 85%; 80 | line-height: 26rpx; 81 | margin: 20rpx 0 20rpx 30rpx; 82 | 83 | font-size: 26rpx; 84 | color: white; 85 | 86 | overflow: hidden; 87 | text-overflow: ellipsis; 88 | white-space: nowrap; 89 | } 90 | 91 | .audio-play-progress { 92 | height: 40rpx; 93 | width: 85%; 94 | margin-left: 30rpx; 95 | font-size: 26rpx; 96 | color: white; 97 | 98 | display: flex; 99 | flex-wrap: nowrap; 100 | flex-direction: row; 101 | justify-content: flex-start; 102 | align-items: center; 103 | } 104 | 105 | .audio-play-last-time .audio-play-end-time { 106 | color: whitesmoke; 107 | font-size: 24rpx; 108 | width: auto; 109 | } 110 | 111 | .audio-play-progress-item { 112 | width: 80%; 113 | } 114 | slider { 115 | margin: 10px !important; 116 | } 117 | -------------------------------------------------------------------------------- /components/find/punchCardProjectListItem.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Component({ 3 | /** 4 | * 组件的属性列表 5 | */ 6 | properties: { 7 | punchCardProjectItemData: { 8 | type: Object, 9 | // value: { 10 | // id: 111, 11 | // cover_img_url: 'default_cover_img', 12 | // project_name: '啦啦啦啦啦啦', 13 | // all_punch_card_num: 777, 14 | // attend_user_num: 999 15 | // } 16 | } 17 | 18 | }, 19 | 20 | /** 21 | * 组件的初始数据 22 | */ 23 | data: { 24 | 25 | imgRootPath: app.globalData.imgBaseSeverUrl, // 服务器图片访问BaseURL 26 | 27 | // 打卡圈子子项右边圈子信息的宽度 28 | projectBaseInfoWidth: app.globalData.windowWidth - (10 + 100 + 5 + 10), 29 | 30 | }, 31 | 32 | /** 33 | * 组件的方法列表 34 | */ 35 | methods: { 36 | 37 | // 进入指定的打卡圈子的打卡详情页 38 | _intoPunchCardDetail: function (e) { 39 | console.log(e); 40 | wx.navigateTo({ 41 | url: '/pages/punchCardDetailPage/index' 42 | + "?projectId=" + e.currentTarget.dataset.projectId 43 | + "&isCreator=" + -1 // 未知是否为创建者 44 | }); 45 | }, 46 | 47 | } 48 | }); 49 | -------------------------------------------------------------------------------- /components/find/punchCardProjectListItem.json: -------------------------------------------------------------------------------- 1 | { 2 | "component": true, 3 | "usingComponents": {} 4 | } -------------------------------------------------------------------------------- /components/find/punchCardProjectListItem.wxml: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | {{punchCardProjectItemData.project_name}} 21 | 22 | 23 | 24 | {{punchCardProjectItemData.attend_user_num}}人参加 25 | 26 | 27 | {{punchCardProjectItemData.all_punch_card_num}}次打卡 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /components/find/punchCardProjectListItem.wxss: -------------------------------------------------------------------------------- 1 | .punch-card-project-list-item { 2 | width: calc(100vw - 40rpx); 3 | height: auto; 4 | padding: 30rpx 0; 5 | margin-left: 20rpx; 6 | margin-right: 20rpx; 7 | 8 | display: flex; 9 | flex-direction: row; 10 | justify-content: flex-start; 11 | 12 | border-bottom: 2rpx whitesmoke solid; 13 | } 14 | 15 | .project-cover-img { 16 | width: 200rpx; 17 | height: auto; 18 | display: flex; 19 | flex-direction: row; 20 | justify-content: flex-start; 21 | margin-right: 16rpx; 22 | 23 | } 24 | .project-cover-img > image { 25 | width: 200rpx; 26 | height: 120rpx; 27 | 28 | border-radius: 10rpx; 29 | } 30 | 31 | .project-base-info { 32 | /*高度由js控制,使之占满父级宽度除去左边图片宽度之外的区域*/ 33 | height: auto; 34 | width: 420rpx; 35 | } 36 | 37 | .project-name { 38 | width: 100%; 39 | height: auto; 40 | margin-bottom: 8rpx; 41 | 42 | font-size: 32rpx; 43 | color: black; 44 | font-weight: bolder; 45 | overflow: hidden; 46 | text-overflow: ellipsis; 47 | white-space: nowrap; 48 | } 49 | 50 | .punch-card-info { 51 | height: auto; 52 | width: 100%; 53 | 54 | font-size: 24rpx; 55 | color: #8a8a8a; 56 | 57 | display: flex; 58 | flex-direction: row; 59 | justify-content: flex-start; 60 | align-items: center; 61 | } 62 | 63 | .attend-num-info { 64 | margin-right: 30rpx; 65 | } 66 | -------------------------------------------------------------------------------- /components/mine/diaryItem.json: -------------------------------------------------------------------------------- 1 | { 2 | "component": true, 3 | "usingComponents": { 4 | "punch-card-diary-audio-play": "/components/audioPlay/index" 5 | } 6 | } -------------------------------------------------------------------------------- /images/backgroundImg/img_1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/backgroundImg/img_1.png -------------------------------------------------------------------------------- /images/bottomIcon/add.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/add.png -------------------------------------------------------------------------------- /images/bottomIcon/cancel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/cancel.png -------------------------------------------------------------------------------- /images/bottomIcon/collect-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/collect-btn.png -------------------------------------------------------------------------------- /images/bottomIcon/collect-fill-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/collect-fill-btn.png -------------------------------------------------------------------------------- /images/bottomIcon/custom_label_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/custom_label_icon.png -------------------------------------------------------------------------------- /images/bottomIcon/delete.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/delete.png -------------------------------------------------------------------------------- /images/bottomIcon/down.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/down.png -------------------------------------------------------------------------------- /images/bottomIcon/down_gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/down_gray.png -------------------------------------------------------------------------------- /images/bottomIcon/edit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/edit.png -------------------------------------------------------------------------------- /images/bottomIcon/edit_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/edit_2.png -------------------------------------------------------------------------------- /images/bottomIcon/find.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/find.png -------------------------------------------------------------------------------- /images/bottomIcon/find_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/find_light.png -------------------------------------------------------------------------------- /images/bottomIcon/gold.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/gold.png -------------------------------------------------------------------------------- /images/bottomIcon/index.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/index.png -------------------------------------------------------------------------------- /images/bottomIcon/index_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/index_light.png -------------------------------------------------------------------------------- /images/bottomIcon/more.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/more.png -------------------------------------------------------------------------------- /images/bottomIcon/my.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/my.png -------------------------------------------------------------------------------- /images/bottomIcon/my_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/my_light.png -------------------------------------------------------------------------------- /images/bottomIcon/news.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/news.png -------------------------------------------------------------------------------- /images/bottomIcon/news_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/news_light.png -------------------------------------------------------------------------------- /images/bottomIcon/picture.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/picture.png -------------------------------------------------------------------------------- /images/bottomIcon/picture_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/picture_2.png -------------------------------------------------------------------------------- /images/bottomIcon/picture_3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/picture_3.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_0.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_0.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_1.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_2.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_3.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_4.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_5.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_6.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_7.png -------------------------------------------------------------------------------- /images/bottomIcon/project_label_icon_8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/project_label_icon_8.png -------------------------------------------------------------------------------- /images/bottomIcon/recommend.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/recommend.png -------------------------------------------------------------------------------- /images/bottomIcon/search.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/search.png -------------------------------------------------------------------------------- /images/bottomIcon/sound.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/sound.png -------------------------------------------------------------------------------- /images/bottomIcon/text.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/text.png -------------------------------------------------------------------------------- /images/bottomIcon/video.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/bottomIcon/video.png -------------------------------------------------------------------------------- /images/button/add.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/add.png -------------------------------------------------------------------------------- /images/button/add_200.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/add_200.png -------------------------------------------------------------------------------- /images/button/address_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/address_light.png -------------------------------------------------------------------------------- /images/button/audio_pause.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/audio_pause.png -------------------------------------------------------------------------------- /images/button/audio_pause_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/audio_pause_2.png -------------------------------------------------------------------------------- /images/button/audio_play.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/audio_play.png -------------------------------------------------------------------------------- /images/button/audio_play_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/audio_play_2.png -------------------------------------------------------------------------------- /images/button/audio_play_3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/audio_play_3.png -------------------------------------------------------------------------------- /images/button/back_setting.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/back_setting.png -------------------------------------------------------------------------------- /images/button/base_setting.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/base_setting.png -------------------------------------------------------------------------------- /images/button/calendar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/calendar.png -------------------------------------------------------------------------------- /images/button/cancel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/cancel.png -------------------------------------------------------------------------------- /images/button/cancel_red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/cancel_red.png -------------------------------------------------------------------------------- /images/button/close.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/close.png -------------------------------------------------------------------------------- /images/button/close_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/close_2.png -------------------------------------------------------------------------------- /images/button/close_red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/close_red.png -------------------------------------------------------------------------------- /images/button/comment_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/comment_btn.png -------------------------------------------------------------------------------- /images/button/creator_college.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/creator_college.png -------------------------------------------------------------------------------- /images/button/creator_marketing_tool.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/creator_marketing_tool.png -------------------------------------------------------------------------------- /images/button/delete.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/delete.png -------------------------------------------------------------------------------- /images/button/diaryPunchAddress.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/diaryPunchAddress.png -------------------------------------------------------------------------------- /images/button/down_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/down_btn.png -------------------------------------------------------------------------------- /images/button/edit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/edit.png -------------------------------------------------------------------------------- /images/button/edit_project_detail.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/edit_project_detail.png -------------------------------------------------------------------------------- /images/button/end.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/end.png -------------------------------------------------------------------------------- /images/button/filter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/filter.png -------------------------------------------------------------------------------- /images/button/hide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/hide.png -------------------------------------------------------------------------------- /images/button/honour.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/honour.png -------------------------------------------------------------------------------- /images/button/into_btn_black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/into_btn_black.png -------------------------------------------------------------------------------- /images/button/into_btn_gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/into_btn_gray.png -------------------------------------------------------------------------------- /images/button/into_button.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/into_button.png -------------------------------------------------------------------------------- /images/button/into_index_black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/into_index_black.png -------------------------------------------------------------------------------- /images/button/into_index_gray.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/into_index_gray.png -------------------------------------------------------------------------------- /images/button/invite-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/invite-btn.png -------------------------------------------------------------------------------- /images/button/invite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/invite.png -------------------------------------------------------------------------------- /images/button/like_200.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/like_200.png -------------------------------------------------------------------------------- /images/button/like_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/like_btn.png -------------------------------------------------------------------------------- /images/button/like_btn_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/like_btn_2.png -------------------------------------------------------------------------------- /images/button/location.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/location.png -------------------------------------------------------------------------------- /images/button/location_light.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/location_light.png -------------------------------------------------------------------------------- /images/button/mail.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/mail.png -------------------------------------------------------------------------------- /images/button/member_manage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/member_manage.png -------------------------------------------------------------------------------- /images/button/more.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/more.png -------------------------------------------------------------------------------- /images/button/more_200.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/more_200.png -------------------------------------------------------------------------------- /images/button/my_collect.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_collect.png -------------------------------------------------------------------------------- /images/button/my_collect_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_collect_2.png -------------------------------------------------------------------------------- /images/button/my_create_project.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_create_project.png -------------------------------------------------------------------------------- /images/button/my_create_project_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_create_project_2.png -------------------------------------------------------------------------------- /images/button/my_follow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_follow.png -------------------------------------------------------------------------------- /images/button/my_follow_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_follow_2.png -------------------------------------------------------------------------------- /images/button/my_follower.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_follower.png -------------------------------------------------------------------------------- /images/button/my_follower_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_follower_2.png -------------------------------------------------------------------------------- /images/button/my_gold_coin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/my_gold_coin.png -------------------------------------------------------------------------------- /images/button/news_comment.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/news_comment.png -------------------------------------------------------------------------------- /images/button/news_like.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/news_like.png -------------------------------------------------------------------------------- /images/button/pause.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/pause.png -------------------------------------------------------------------------------- /images/button/pc_back_stage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/pc_back_stage.png -------------------------------------------------------------------------------- /images/button/people.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/people.png -------------------------------------------------------------------------------- /images/button/punch_card_creator_icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/punch_card_creator_icon.png -------------------------------------------------------------------------------- /images/button/qr_code_img.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/qr_code_img.png -------------------------------------------------------------------------------- /images/button/question.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/question.png -------------------------------------------------------------------------------- /images/button/remark.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/remark.png -------------------------------------------------------------------------------- /images/button/return_button.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/return_button.png -------------------------------------------------------------------------------- /images/button/setting-black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/setting-black.png -------------------------------------------------------------------------------- /images/button/setting.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/setting.png -------------------------------------------------------------------------------- /images/button/setting_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/setting_2.png -------------------------------------------------------------------------------- /images/button/sex_female.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/sex_female.png -------------------------------------------------------------------------------- /images/button/sex_male.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/sex_male.png -------------------------------------------------------------------------------- /images/button/share_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/share_btn.png -------------------------------------------------------------------------------- /images/button/start.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/start.png -------------------------------------------------------------------------------- /images/button/sticky.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/sticky.png -------------------------------------------------------------------------------- /images/button/time.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/time.png -------------------------------------------------------------------------------- /images/button/unlike_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/unlike_btn.png -------------------------------------------------------------------------------- /images/button/up_btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/up_btn.png -------------------------------------------------------------------------------- /images/button/userInfoSetBtn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/button/userInfoSetBtn.png -------------------------------------------------------------------------------- /images/default/empty_notice.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/default/empty_notice.png -------------------------------------------------------------------------------- /images/default/project_cover_img.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/default/project_cover_img.png -------------------------------------------------------------------------------- /images/default/punch_card_invite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/default/punch_card_invite.png -------------------------------------------------------------------------------- /images/default/userAvatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/default/userAvatar.png -------------------------------------------------------------------------------- /images/loginAuth/loginAuth.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Zzard10/SmallPunchCardMiniProgram/81ce2393f2e86fe1a8a7213c023edb97e4891380/images/loginAuth/loginAuth.png -------------------------------------------------------------------------------- /note.md: -------------------------------------------------------------------------------- 1 | **记录下遇到的问题,后期做汇总** 2 | 3 | #### 1、设置元素高度等同于宽度(宽度使用百分比) 4 | 5 | 原本的音频组件并没有对不同机型做适配,现在进行适配就碰到了一个问题。由于组件用于多个页面,所以组件根元素是不能写死宽度的,组件里面的子元素宽度也只能用百分比。在此过程中,播放、暂停按钮的icon图片要设置宽、高一致,也就是宽度使用百分比下(动态变化),要怎 么设置元素高度等同于宽度。 6 | 7 | ``` 8 | 9 | 10 | 11 | ``` 12 | ``` 13 | .audio-control-btn { 14 | /** 15 | * 个人理解是: 16 | * 1、在父级元素中设置高度为0,设置padding-bottom的百分比来撑开元素高度, 17 | * 由于padding-bottom、padding-top这两个属性的百分比是【根据元素宽度计算】的,所以只要 18 | * padding-bottom的百分比跟宽度百分比一致,这时候得到就是一个正方形的父级元素了 19 | * 2、最后还要分别设置父级、子级元素relative|absolute定位属性,现在我还没搞懂原理(不设置不行) 20 | */ 21 | width: 60%; 22 | height: 0; 23 | padding-bottom: 60%; 24 | position: relative; 25 | } 26 | .audio-control-btn > image { 27 | width: 100%; 28 | height: 100%; 29 | position: absolute; 30 | } 31 | ``` 32 | 33 | 记录于:**2020-03-27 01:29:08 星期五** 34 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepOne/index.js: -------------------------------------------------------------------------------- 1 | // pages/createPunchCardProject/stepOne/index.js 2 | let app = getApp(); 3 | Page({ 4 | 5 | /** 6 | * 页面的初始数据 7 | */ 8 | data: { 9 | user_id: 0, // 用户id 10 | privacy_type: 0, // 打卡圈子隐私类型,默认为0--公开 11 | btn_disable: true // 禁用下一步按钮直至数据验证通过 12 | 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function () { 19 | let that = this; 20 | that.setData({ 21 | user_id: app.globalData.userInfo.id 22 | }); 23 | 24 | }, 25 | 26 | /** 27 | * 生命周期函数--监听页面初次渲染完成 28 | */ 29 | onReady: function () { 30 | 31 | }, 32 | 33 | /** 34 | * 生命周期函数--监听页面显示 35 | */ 36 | onShow: function () { 37 | 38 | }, 39 | 40 | /** 41 | * 页面相关事件处理函数--监听用户下拉动作 42 | */ 43 | onPullDownRefresh: function () { 44 | 45 | }, 46 | 47 | /** 48 | * 页面上拉触底事件的处理函数 49 | */ 50 | onReachBottom: function () { 51 | 52 | }, 53 | 54 | // 监听单选按钮 55 | radioChange:function (e) { 56 | let that = this; 57 | that.setData({ 58 | privacy_type: parseInt(e.detail.value) 59 | }); 60 | console.log(e.detail.value); 61 | }, 62 | 63 | 64 | // 输入框失去焦点检测输入的数据正确性,并根据检测结果控制下一步按钮 65 | checkInput: function (e) { 66 | let that = this; 67 | 68 | // 检测是否为十五个汉字以内的字符 69 | let reg = /^[\u4e00-\u9fa5]{1,15}$/; 70 | if(reg.test(e.detail.value)){ 71 | that.setData({ 72 | btn_disable: false, 73 | project_name: e.detail.value 74 | }) 75 | 76 | } else { 77 | this.setData({btn_disable: true}); 78 | let title = "圈子名称格式错误!"; 79 | if (e.detail.value.length > 15) 80 | title = "圈子名称限制十五字符!"; 81 | 82 | if (e.detail.value.length === 0) 83 | title = "请填写圈子名称"; 84 | wx.showToast({ 85 | title: title, 86 | icon: "none" 87 | }) 88 | } 89 | }, 90 | 91 | // 下一步按钮点击事件 92 | intoSetTwo : function () { 93 | let project_name = this.data.project_name; 94 | let privacy_type = this.data.privacy_type; 95 | wx.navigateTo({ 96 | url: '../stepTwo/index' 97 | +'?project_name='+project_name 98 | +'&privacy_type='+privacy_type 99 | 100 | }) 101 | } 102 | }); -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepOne/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "新建圈子", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": false 8 | } 9 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepOne/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 7 | 8 | 9 | 10 | 11 | 12 | 15 | 18 | 19 | 20 | 21 | 22 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepOne/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | display: flex; 3 | flex-direction: column; 4 | } 5 | 6 | /*打卡圈子名称输入框*/ 7 | .input-project-name { 8 | width: auto; 9 | height: 30%; 10 | margin: 200rpx 10% 0 10%; 11 | text-align: center; 12 | font-size: 40rpx; 13 | color: black; 14 | } 15 | 16 | /*输入框下边的横线*/ 17 | .input-project-name > view { 18 | width: 100%; 19 | height: 4rpx; 20 | margin-top: 5rpx; 21 | background-color: lightseagreen; 22 | } 23 | 24 | /*打卡圈子隐私类型选择*/ 25 | .chose-project-privacy-type { 26 | width: auto; 27 | height: 30%; 28 | padding: 480rpx 15% 0 15%; 29 | 30 | font-size: 28rpx; 31 | color: black; 32 | 33 | } 34 | .radio-group radio { 35 | margin-bottom: 12rpx; 36 | } 37 | 38 | /*下一步按钮*/ 39 | .submitBtn { 40 | width: auto; 41 | height: 40%; 42 | margin: 0 5% 0 5%; 43 | padding-top: 40rpx; 44 | } 45 | 46 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "圈子详情", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": false 8 | } -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCoverImg/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "更换背景图", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": true 8 | } -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCoverImg/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 上传本地图片 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 推荐图片 13 | 14 | 15 | 17 | 19 | 20 | 21 | 22 | 23 | 24 | {{sysRecommendCoverImgLoadNotice}} 25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCoverImg/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | background-color: white; 3 | width: auto; 4 | height: 100%; 5 | padding: 0 30rpx 30rpx 30rpx; 6 | } 7 | 8 | /*上传本地图片*/ 9 | .upload-custom-img { 10 | width: 100%; 11 | height: auto; 12 | } 13 | .title { 14 | width: 100%; 15 | height: 120rpx; 16 | line-height: 120rpx; 17 | color: black; 18 | } 19 | .upload-img-btn { 20 | width: 48%; 21 | height: 160rpx; 22 | background-color: #616161; 23 | display: flex; 24 | justify-content: space-around; 25 | align-items: center; 26 | } 27 | 28 | .upload-img-btn > image { 29 | width: 80rpx; 30 | height: 80rpx; 31 | } 32 | 33 | /*系统推荐的封面背景图*/ 34 | .system-recommend-img { 35 | width: 100%; 36 | height: auto; 37 | 38 | display: flex; 39 | flex-direction: row; 40 | justify-content: space-between; 41 | flex-wrap: wrap; 42 | align-items: center; 43 | } 44 | 45 | .cover-img-item { 46 | width: 48%; 47 | height: 160rpx; 48 | margin-bottom: 20rpx; 49 | } 50 | .cover-img-item > image { 51 | width: 100%; 52 | height: 100%; 53 | } 54 | 55 | 56 | /*没有系统推荐封面背景图提示*/ 57 | .not-recommend-img-notice { 58 | width: 100%; 59 | height: 80rpx; 60 | line-height: 80rpx; 61 | text-align: center; 62 | color: orangered; 63 | } 64 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCreatorInfo/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | projectId: 0, 9 | creatorIntrInfo: '', 10 | inputTextNum: 0, 11 | creatorWeiXinNum: '', 12 | creatorWeiXinNumFlag: true, 13 | inputWeiXinNum: 0 14 | }, 15 | 16 | /** 17 | * 生命周期函数--监听页面加载 18 | */ 19 | onLoad: function (options) { 20 | console.log(options); 21 | let that = this; 22 | that.data.projectId = options.projectId; 23 | that.setData({ 24 | creatorIntrInfo: options.creatorIntrInfo, 25 | creatorWeiXinNum: options.weixinNum 26 | }); 27 | }, 28 | 29 | /** 30 | * 生命周期函数--监听页面初次渲染完成 31 | */ 32 | onReady: function () { 33 | 34 | }, 35 | 36 | /** 37 | * 生命周期函数--监听页面显示 38 | */ 39 | onShow: function () { 40 | 41 | }, 42 | 43 | /** 44 | * 生命周期函数--监听页面隐藏 45 | */ 46 | onHide: function () { 47 | 48 | }, 49 | 50 | // 圈主简介信息输入触发事件 51 | creatorIntrInfoInput: function (e) { 52 | console.log(e); 53 | let that = this; 54 | that.data.creatorIntrInfo = e.detail.value; 55 | that.setData({ 56 | inputTextNum: e.detail.cursor 57 | }); 58 | }, 59 | 60 | // 圈主微信输入触发事件 61 | creatorWeiXinInfoInput: function (e) { 62 | console.log(e); 63 | let that = this; 64 | 65 | that.data.creatorWeiXinNum = e.detail.value; 66 | that.setData({ 67 | inputWeiXinNum: e.detail.cursor 68 | }); 69 | }, 70 | 71 | // 微信号格式检测 72 | checkWeiXinNumInput: function(e) { 73 | let that = this; 74 | // 对输入的微信号进行验证 长度为6-20,由字母、数字、下划线、减号组成,字母开头 75 | let creatorWeiXinNum = e.detail.value; 76 | that.data.creatorWeiXinNumFlag = true; // 允许微信号不填写 77 | if (creatorWeiXinNum !== '') { 78 | let reg = /^[a-zA-Z][-_a-zA-Z0-9]{5,19}$/; 79 | if (reg.test(creatorWeiXinNum)) { 80 | that.data.creatorWeiXinNumFlag = true; 81 | } else { 82 | that.data.creatorWeiXinNumFlag = false; 83 | wx.showToast({ 84 | title: "微信号由6-20个字母开头、字母、数字、下划线、减号组成", 85 | icon: "none" 86 | }) 87 | } 88 | } 89 | }, 90 | 91 | // 上传更改圈主简介 92 | updateCreatorIntrInfo: function () { 93 | let that = this; 94 | 95 | if (that.data.creatorWeiXinNumFlag === true) { 96 | wx.request({ 97 | url: app.globalData.urlRootPath 98 | + "index/PunchCardProject/updateCreatorInfo", 99 | method: "post", 100 | data:{ 101 | project_id: that.data.projectId, 102 | creator_introduce: that.data.creatorIntrInfo, 103 | weixin_num: that.data.creatorWeiXinNum 104 | }, 105 | success: function (response) { 106 | console.log(response); 107 | switch (response.statusCode) { 108 | case 200: 109 | wx.navigateBack({ 110 | delta: 1 111 | }); 112 | break; 113 | default: 114 | wx.showToast({ 115 | title: response.data.errMsg, 116 | icon: "none" 117 | }); 118 | break; 119 | } 120 | }, 121 | fail: function () { 122 | wx.showToast({ 123 | title: "网络异常...", 124 | icon: "none" 125 | }); 126 | } 127 | }); 128 | } else { 129 | wx.showToast({ 130 | title: "微信号格式错误!", 131 | icon: "none" 132 | }); 133 | } 134 | 135 | 136 | } 137 | }); -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCreatorInfo/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "编辑圈主信息", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": false 8 | } -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCreatorInfo/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 圈主简介 5 | 6 | 8 | 9 | {{inputTextNum}}/50 10 | 11 | 12 | 13 | 14 | 圈主微信号 15 | 16 | 填写圈主微信号,有助于让成员找到您 17 | 18 | 19 | 22 | 23 | {{inputWeiXinNum}}/20 24 | 25 | 26 | 27 | 保存 28 | 29 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateCreatorInfo/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | background-color: whitesmoke; 3 | display: flex; 4 | flex-direction: column; 5 | justify-content: flex-start; 6 | } 7 | 8 | /*填写圈主简介*/ 9 | .input-creator-intr-info { 10 | width: 100%; 11 | height: 400rpx; 12 | margin-bottom: 20rpx; 13 | padding-left: 30rpx; 14 | background-color: white; 15 | } 16 | 17 | .title { 18 | width: 100%; 19 | height: 120rpx; 20 | line-height: 120rpx; 21 | font-size: 32rpx; 22 | color: black; 23 | font-weight: bolder; 24 | } 25 | 26 | .input-creator-intr-info-area { 27 | width: 100%; 28 | height: 240rpx; 29 | line-height: 1.3; 30 | } 31 | .input-text-num-notice { 32 | width: auto; 33 | height: auto; 34 | font-size: 22rpx; 35 | text-align: right; 36 | padding-right: 50rpx; 37 | margin-bottom: 10rpx; 38 | } 39 | 40 | /*填写圈主微信号*/ 41 | .input-creator-weixin-info { 42 | width: 100%; 43 | height: 360rpx; 44 | padding-left: 30rpx; 45 | background-color: white; 46 | } 47 | 48 | .input-creator-weixin-info-notice { 49 | font-size: 28rpx; 50 | color: #cccccc; 51 | margin-bottom: 20rpx; 52 | } 53 | 54 | .input-creator-weixin-info-area { 55 | width: 60%; 56 | height: 60rpx; 57 | padding-left: 10rpx; 58 | border: 2rpx #cccccc solid; 59 | border-radius: 10rpx; 60 | 61 | 62 | } 63 | .input-creator-weixin-info-area input { 64 | width: 100%; 65 | height: 100%; 66 | line-height: 60rpx; 67 | font-size: 30rpx; 68 | color: black; 69 | } 70 | 71 | .placeholder-style { 72 | font-size: 30rpx; 73 | color: #cccccc; 74 | } 75 | 76 | /*保存按钮*/ 77 | .update-creator-intr-info-btn { 78 | width: 100%; 79 | height: 120rpx; 80 | text-align: center; 81 | background-color: white; 82 | } 83 | .update-creator-intr-info-btn text { 84 | width: auto; 85 | height: 80rpx; 86 | padding: 20rpx 25%; 87 | line-height: 80rpx; 88 | border-radius: 10rpx; 89 | color: white; 90 | background-color: #F0B27A; 91 | } 92 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateProjectIntrInfo/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "圈子介绍", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": false 8 | } -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepThree/updateProjectIntrInfo/index.wxss: -------------------------------------------------------------------------------- 1 | .container{ 2 | background-color: white; 3 | } 4 | 5 | /*填写圈子简介获取金币活动提示*/ 6 | .edit-project-intr-activity-notice { 7 | height: 60rpx; 8 | width: 100%; 9 | display: flex; 10 | flex-direction: row; 11 | align-items: center; 12 | justify-content: space-between; 13 | background-color: beige; 14 | margin-bottom: 20rpx; 15 | } 16 | 17 | .gold-icon { 18 | width: 10%; 19 | height: 60rpx; 20 | display: flex; 21 | flex-direction: column; 22 | justify-content: center; 23 | } 24 | .gold-icon > image { 25 | width: 30rpx; 26 | height: 30rpx; 27 | margin-left: 30rpx; 28 | } 29 | 30 | .notice-message { 31 | width: 80%; 32 | height: 60rpx; 33 | line-height: 60rpx; 34 | font-size: 26rpx; 35 | color: orangered; 36 | } 37 | .into-btn-icon { 38 | width: 10%; 39 | height: 60rpx; 40 | display: flex; 41 | flex-direction: column; 42 | justify-content: center; 43 | align-items: flex-end; 44 | } 45 | .into-btn-icon > image { 46 | width: 40rpx; 47 | height: 40rpx; 48 | margin-right: 24rpx; 49 | } 50 | 51 | 52 | /*编辑按钮面板:添加文字、图片、录音、视频简介等按钮*/ 53 | .edit-btn-panel { 54 | width: 100%; 55 | height: 240rpx; 56 | background-color: white; 57 | padding-top: 40rpx; 58 | } 59 | 60 | .edit-btn-panel-title { 61 | width: 100%; 62 | height: 80rpx; 63 | line-height: 80rpx; 64 | margin-left: 30rpx; 65 | font-size: 32rpx; 66 | color: #cccccc; 67 | } 68 | 69 | .edit-btn-group { 70 | width: 100%; 71 | height: 120rpx; 72 | 73 | display: flex; 74 | flex-direction: row; 75 | justify-content: space-around; 76 | 77 | } 78 | 79 | .edit-btn-item { 80 | width: 60rpx; 81 | height: 120rpx; 82 | display: flex; 83 | flex-direction: column; 84 | justify-content: space-between; 85 | } 86 | 87 | .edit-btn-item > image { 88 | width: 60rpx; 89 | height: 60rpx; 90 | } 91 | .edit-btn-item > text { 92 | width: 60rpx; 93 | height: 60rpx; 94 | line-height: 60rpx; 95 | font-size: 26rpx; 96 | color: #cccccc; 97 | } 98 | 99 | .text > image { 100 | width: 56rpx; 101 | height: 56rpx; 102 | border-radius: 6rpx; 103 | border: 4rpx #F0B27A solid; 104 | } 105 | .image > image { 106 | height: 60rpx; 107 | width: 52rpx; 108 | border-radius: 8rpx; 109 | border: 4rpx #F0B27A solid; 110 | } 111 | .sound > image { 112 | height: 56rpx; 113 | width: 60rpx; 114 | } 115 | 116 | /*圈子简介信息编辑、展示区域*/ 117 | .project-intr-info-list { 118 | width: 100%; 119 | height: auto; 120 | background-color: white; 121 | } 122 | /*编辑区域的操作按钮:排序上、下移,删除当前简介编辑区域*/ 123 | .intr-info-btn { 124 | width: auto; 125 | height: 80rpx; 126 | margin: 0 30rpx; 127 | display: flex; 128 | flex-direction: row; 129 | justify-content: space-between; 130 | align-items: center; 131 | } 132 | .edit-area-title { 133 | height: 80rpx; 134 | width: 15%; 135 | line-height: 80rpx; 136 | color: black; 137 | font-weight: bolder; 138 | font-size: 30rpx; 139 | } 140 | 141 | /*上移按钮*/ 142 | .intr-info-up-order-btn { 143 | width: 10%; 144 | height: 80rpx; 145 | display: flex; 146 | flex-direction: column; 147 | justify-content: center; 148 | 149 | } 150 | .intr-info-up-order-btn > image { 151 | transform: rotate(180deg); 152 | height: 40rpx; 153 | width: 40rpx; 154 | border: 2rpx #F0B27A solid; 155 | border-radius: 50%; 156 | } 157 | 158 | .intr-info-down-order-btn { 159 | width: 65%; 160 | height: 80rpx; 161 | display: flex; 162 | flex-direction: column; 163 | justify-content: center; 164 | 165 | } 166 | .intr-info-down-order-btn > image { 167 | height: 40rpx; 168 | width: 40rpx; 169 | border: 2rpx #F0B27A solid; 170 | border-radius: 50%; 171 | } 172 | 173 | .intr-info-delete-btn { 174 | width: 10%; 175 | height: 80rpx; 176 | display: flex; 177 | flex-direction: column; 178 | justify-content: center; 179 | align-items: flex-end; 180 | } 181 | .intr-info-delete-btn > image { 182 | height: 20rpx; 183 | width: 20rpx; 184 | padding: 10rpx; 185 | border: 2rpx #F0B27A solid; 186 | border-radius: 50%; 187 | } 188 | 189 | /*文字编辑区域*/ 190 | .intr-info-text-item { 191 | width: auto; 192 | min-height: 240rpx; 193 | height: auto; 194 | margin: 0 30rpx; 195 | } 196 | .intr-info-text-item > textarea { 197 | width: 100%; 198 | min-height: 240rpx; 199 | height: auto; 200 | line-height: 1.2; 201 | } 202 | /*文字简介字数限制提示*/ 203 | .text-num-notice { 204 | width: auto; 205 | height: 30rpx; 206 | line-height: 30rpx; 207 | font-size: 24rpx; 208 | color: #cccccc; 209 | text-align: right; 210 | margin-bottom: 10rpx; 211 | margin-right: 30rpx; 212 | } 213 | 214 | 215 | /*对选择、拍摄的简介图片进行预览*/ 216 | .intr-info-image-item { 217 | width: 92%; 218 | margin-left: 4%; 219 | margin-right: 4%; 220 | margin-bottom: 10rpx; 221 | } 222 | .intr-info-image-item > image { 223 | width: 100%; 224 | } 225 | 226 | 227 | /*电脑端编辑提示*/ 228 | .web-site-edit-notice { 229 | width: 100%; 230 | height: 160rpx; 231 | background-color: white; 232 | font-size: 26rpx; 233 | 234 | } 235 | .web-site-edit-notice > view { 236 | width: auto; 237 | height: auto; 238 | padding: 20rpx 16rpx; 239 | margin: 0 4%; 240 | line-height: 1.3; 241 | color: #cccccc; 242 | background-color: #fafafa; 243 | } 244 | .web-site { 245 | display: inline-block; 246 | color: #F0B27A; 247 | } 248 | 249 | 250 | /*保存按钮*/ 251 | .update-project-intr-info { 252 | width: 100%; 253 | height: 120rpx; 254 | text-align: center; 255 | background-color: white; 256 | } 257 | .update-project-intr-info text { 258 | width: auto; 259 | height: 80rpx; 260 | padding: 20rpx 25%; 261 | line-height: 80rpx; 262 | border-radius: 10rpx; 263 | color: white; 264 | background-color: #F0B27A; 265 | } 266 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepTwo/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "选择圈子类型", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundColor": "#eeeeee", 6 | "backgroundTextStyle": "light", 7 | "enablePullDownRefresh": false 8 | } -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepTwo/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 点击展开分类,最多可以添加3个标签 4 | 6 | 7 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | {{parentItem.label_name}} 18 | 19 | 20 | 21 | {{parentItem.chooseLabelNameStr}} 22 | 23 | 24 | 25 | 27 | 28 | 29 | 30 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 自定义 60 | 61 | 62 | {{customLabelName}} 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 75 | 76 | 77 | 78 | 填写自定义标签 79 | 80 | 81 | 85 | 86 | 87 | 88 | 取消 90 | 91 | 确定 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 103 | 104 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /pages/createPunchCardProject/stepTwo/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | } 5 | 6 | /*圈子类型标签展示*/ 7 | .project-type-label-list { 8 | width: 100%; 9 | height: auto; 10 | margin-bottom: 160rpx; 11 | background-color: white; 12 | } 13 | .notice-message { 14 | width: 100%; 15 | height: 80rpx; 16 | margin-left: 40rpx; 17 | font-size: 30rpx; 18 | line-height: 80rpx; 19 | } 20 | 21 | /*一级标签展示*/ 22 | .parent-label-item { 23 | width: 100%; 24 | height: 160rpx; 25 | display: flex; 26 | flex-direction: row; 27 | justify-content: space-around; 28 | } 29 | /*标签图标*/ 30 | .label-img { 31 | width: 15%; 32 | height: 100%; 33 | margin-left: 40rpx; 34 | position: relative; 35 | } 36 | .label-img > image { 37 | width: 80rpx; 38 | height: 80rpx; 39 | position: absolute; 40 | top: 50%; 41 | margin-top: -40rpx; 42 | 43 | } 44 | 45 | /*标签名*/ 46 | .label-name { 47 | width: 25%; 48 | height: 160rpx; 49 | line-height: 160rpx; 50 | color: black; 51 | font-size: 30rpx; 52 | } 53 | 54 | /*被选的当前父级标签的子级标签*/ 55 | .choose-child-label-list { 56 | width: 45%; 57 | height: 160rpx; 58 | line-height: 160rpx; 59 | 60 | text-align: right; 61 | color: #F0B27A; 62 | font-size: 28rpx; 63 | } 64 | 65 | /*子标签显示、隐藏icon*/ 66 | .show-child-label-btn { 67 | width: 15%; 68 | height:100%; 69 | position: relative; 70 | } 71 | 72 | /*显示*/ 73 | .show-child-label { 74 | width: 40rpx; 75 | height: 40rpx; 76 | position: absolute; 77 | top: 50%; 78 | margin-top: -20rpx; 79 | margin-left: 10rpx; 80 | 81 | transition:transform 0.3s; 82 | 83 | } 84 | /*隐藏*/ 85 | .hidden-child-label { 86 | transform:rotate(180deg); 87 | } 88 | /*分割线*/ 89 | .break-line-mix { 90 | width: 100%; 91 | height: 3rpx; 92 | background-color: #efefef; 93 | } 94 | 95 | 96 | /*父级标签下的子级标签列表显示*/ 97 | .child-label-list { 98 | width: 100%; 99 | height: 100%; 100 | background-color: #FAFAFA; 101 | padding: 40rpx 10rpx 10rpx 50rpx; 102 | } 103 | 104 | .child-label-list > view { 105 | width: auto; 106 | height: auto; 107 | display: flex; 108 | flex-direction: row; 109 | flex-wrap: wrap; 110 | justify-content: flex-start; 111 | align-content: center; 112 | } 113 | 114 | /*子级标签名*/ 115 | .child-label-item { 116 | margin-right: 40rpx; 117 | margin-bottom: 30rpx; 118 | width: 160rpx; 119 | height: 80rpx; 120 | line-height: 80rpx; 121 | border: 2rpx solid whitesmoke; 122 | border-radius: 10rpx; 123 | background-color: white; 124 | color: black; 125 | font-size: 32rpx; 126 | text-align: center; 127 | } 128 | 129 | /*子级标签被选中之后的显示状态*/ 130 | .child-label-item-choose { 131 | border: 2rpx solid #F0B27A; 132 | color: #F0B27A; 133 | } 134 | 135 | 136 | /*添加自定义标签Icon*/ 137 | .add-custom-project-label-btn { 138 | width: 15%; 139 | height:100%; 140 | position: relative; 141 | } 142 | .add-custom-project-label-btn > image { 143 | width: 40rpx; 144 | height: 40rpx; 145 | position: absolute; 146 | top: 50%; 147 | margin-top: -20rpx; 148 | margin-left: 10rpx; 149 | } 150 | 151 | /*自定义的添加自定义标签模态框*/ 152 | 153 | /*弹出层蒙层*/ 154 | .modal-mask { 155 | width: 100%; 156 | height: 100%; 157 | position: fixed; 158 | top: 0; 159 | left: 0; 160 | background: #000; 161 | opacity: 0.5; 162 | overflow: hidden; 163 | z-index: 9000; 164 | color: #fff; 165 | } 166 | 167 | /*模态对话框*/ 168 | .modal-dialog { 169 | width: 80%; 170 | overflow: hidden; 171 | position: fixed; 172 | top: 50%; 173 | left: 0; 174 | z-index: 9999; 175 | background: #f9f9f9; 176 | margin: -200rpx 10%; 177 | border-radius: 20rpx; 178 | } 179 | /*对话框标题*/ 180 | .modal-title { 181 | padding-top: 40rpx; 182 | font-size: 36rpx; 183 | font-weight: bolder; 184 | color: black; 185 | text-align: center; 186 | } 187 | /*对话框内容*/ 188 | .modal-content { 189 | padding: 30rpx 30rpx; 190 | } 191 | 192 | /*对话框内容:添加自定义标签输入框*/ 193 | .modal-input { 194 | display: flex; 195 | background: #fff; 196 | border: 2rpx solid whitesmoke; 197 | border-radius: 10rpx; 198 | font-size: 28rpx; 199 | } 200 | 201 | /*输入框*/ 202 | .input { 203 | width: 100%; 204 | height: 80rpx; 205 | font-size: 28rpx; 206 | line-height: 80rpx; 207 | padding: 0 10rpx; 208 | box-sizing: border-box; 209 | color: black; 210 | } 211 | /*输入框placeholder样式*/ 212 | .input-holder { 213 | color: #666; 214 | font-size: 28rpx; 215 | } 216 | 217 | /*对话框按钮*/ 218 | .modal-footer { 219 | display: flex; 220 | flex-direction: row; 221 | height: 100rpx; 222 | border-top: 2rpx solid #dedede; 223 | font-size: 34rpx; 224 | line-height: 100rpx; 225 | } 226 | /*取消按钮*/ 227 | .btn-cancel { 228 | width: 50%; 229 | color: #666; 230 | text-align: center; 231 | border-right: 2rpx solid #dedede; 232 | } 233 | /*确认按钮*/ 234 | .btn-confirm { 235 | width: 50%; 236 | color: #F0B27A; 237 | text-align: center; 238 | } 239 | 240 | 241 | 242 | /*创建打卡圈子提交按钮*/ 243 | .submit-btn { 244 | width: 90%; 245 | height: auto; 246 | position: fixed; 247 | bottom: 0; 248 | padding: 30rpx 5%; 249 | background-color: whitesmoke; 250 | } 251 | 252 | /* 画布绘制过程不能隐藏 但是又不能被用户看见 所以定位在用户看不到地方 */ 253 | canvas{ 254 | position: fixed; 255 | top: 0; 256 | left: 999px; 257 | } 258 | 259 | .preview { 260 | margin-bottom: 400rpx; 261 | } 262 | -------------------------------------------------------------------------------- /pages/diaryDetailPage/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | "navigationBarBackgroundColor": "#FFFFFF", 4 | "navigationBarTextStyle": "black", 5 | "navigationStyle": "custom", 6 | "usingComponents": { 7 | "punch-card-diary-audio-play": "/components/audioPlay/index" 8 | } 9 | } -------------------------------------------------------------------------------- /pages/find/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | "navigationBarTitleText": "发现", 4 | 5 | "usingComponents": { 6 | "punch-card-project-item": "/components/find/punchCardProjectListItem" 7 | } 8 | } -------------------------------------------------------------------------------- /pages/find/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 搜索 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 34 | 35 | 36 | 推荐 37 | 38 | 39 | 41 | 42 | 外语 43 | 44 | 45 | 47 | 48 | 阅读 49 | 50 | 51 | 53 | 54 | 健康生活 55 | 56 | 57 | 59 | 60 | 教育 61 | 62 | 63 | 65 | 66 | 亲子幼教 67 | 68 | 69 | 71 | 72 | 艺术兴趣 73 | 74 | 75 | 77 | 78 | 美妆 79 | 80 | 81 | 83 | 84 | 运动 85 | 86 | 87 | 89 | 90 | 职场 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 111 | 112 | 117 | 118 | 119 | 120 | 121 | 122 | 啊咧,没有系统推荐的打卡圈子,建一个呗 123 | 124 | 126 | 127 | 创建打卡圈子 128 | 129 | 130 | 131 | -------------------------------------------------------------------------------- /pages/find/index.wxss: -------------------------------------------------------------------------------- 1 | /*搜索打卡圈子按钮*/ 2 | .search-punch-card-project-btn { 3 | width: auto; 4 | height: 70rpx; 5 | margin: 40rpx; 6 | border-radius: 10rpx; 7 | background-color: whitesmoke; 8 | 9 | display: flex; 10 | flex-direction: row; 11 | justify-content: space-between; 12 | align-items: center; 13 | 14 | padding: 0 265rpx; 15 | 16 | } 17 | 18 | .search-punch-card-project-btn > image { 19 | width: 40rpx; 20 | height: 40rpx; 21 | } 22 | .search-punch-card-project-btn > text { 23 | width: auto; 24 | font-size: 32rpx; 25 | color: #8a8a8a; 26 | 27 | } 28 | 29 | /*展示精选打卡圈子专题*/ 30 | .project-special-subject-swiper-container { 31 | width: 100%; 32 | height: 300rpx; 33 | } 34 | 35 | .project-special-subject-item { 36 | width: auto; 37 | height: 300rpx; 38 | margin: 0 20rpx 20rpx; 39 | border-radius: 10rpx; 40 | 41 | font-size: 32rpx; 42 | color: #F0B27A; 43 | line-height: 300rpx; 44 | text-align: center; 45 | background-color: whitesmoke; 46 | } 47 | 48 | /*打卡圈子类型标签*/ 49 | .punch-card-project-type { 50 | width: auto; 51 | height: auto; 52 | margin: 20rpx 20rpx 10rpx 20rpx; 53 | 54 | display: flex; 55 | flex-direction: row; 56 | flex-wrap: wrap; 57 | justify-content: flex-start; 58 | align-items: center; 59 | } 60 | 61 | .punch-card-project-type-item { 62 | width: 20%; 63 | height: auto; 64 | margin-bottom: 20rpx; 65 | 66 | display: flex; 67 | flex-direction: column; 68 | justify-content: flex-start; 69 | align-items: center; 70 | 71 | font-size: 24rpx; 72 | color: black; 73 | } 74 | 75 | .punch-card-project-type-item > image { 76 | width: 80rpx; 77 | height: 80rpx; 78 | margin-bottom: 10rpx; 79 | border-radius: 50%; 80 | } 81 | 82 | /*打卡圈子推荐列表展示*/ 83 | .punch-card-project-recommend-list { 84 | width: auto; 85 | height: auto; 86 | } 87 | 88 | 89 | /*没有系统推荐的打卡圈子数据提示*/ 90 | .not-recommend-punch-card-project-notice { 91 | width: 100%; 92 | height: 80rpx; 93 | line-height: 80rpx; 94 | text-align: center; 95 | font-size: 32rpx; 96 | color: #F0B27A; 97 | } 98 | 99 | .create-punch-card-project-btn { 100 | width: 240rpx; 101 | height: 60rpx; 102 | position: relative; 103 | left: 50%; 104 | margin-left: -120rpx; 105 | display: flex; 106 | flex-direction: row; 107 | justify-content: space-around; 108 | align-items: center; 109 | border: 2rpx #F0B27A solid; 110 | border-radius: 10rpx; 111 | 112 | font-size: 30rpx; 113 | color: #F0B27A; 114 | } 115 | .create-punch-card-project-btn > image { 116 | width: 30rpx; 117 | height: 30rpx; 118 | } 119 | -------------------------------------------------------------------------------- /pages/find/searchPunchCardProject/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | inputShowed: true, 9 | inputVal: "", 10 | 11 | // 符合搜索添加的打卡圈子列表 12 | punchCardProjectList: [], 13 | pageNo: 1, // 符合条件的搜索记录页码,默认第一页开始 14 | pageSize: 8, // 每一页的数据记录条数 15 | showSearchLoading: false, // 搜索加载动画 16 | moreSearchDataLoad: false, // 控制上拉加载更多符合搜索关键字的打卡圈子数据的加载动画 17 | notMoreSearchData: false, // 符合条件的打卡圈子已全部加载标志 18 | 19 | scrollTimer: '', 20 | scrollArr: '', 21 | direction: 0, 22 | searchBarFixClass: '' 23 | }, 24 | 25 | 26 | // 进入搜素输入状态 27 | showInput: function () { 28 | this.setData({ 29 | inputShowed: true 30 | }); 31 | }, 32 | 33 | // 关闭输入状态 34 | hideInput: function () { 35 | this.setData({ 36 | inputVal: "", 37 | inputShowed: false, 38 | 39 | // 清空上一次查询到结果记录&&并重新初始化相关状态变量 40 | punchCardProjectList: [], 41 | pageNo: 1, 42 | notMoreSearchData: false 43 | }); 44 | }, 45 | 46 | // 清除搜索的内容 47 | clearInput: function () { 48 | this.setData({ 49 | inputVal: "", 50 | inputShowed: true, 51 | 52 | // 清空上一次查询到结果记录&&并重新初始化相关状态变量 53 | punchCardProjectList: [], 54 | pageNo: 1, 55 | notMoreSearchData: false 56 | }); 57 | }, 58 | 59 | // 监听输入内容 60 | inputTyping: function (e) { 61 | this.setData({ 62 | inputVal: e.detail.value 63 | }); 64 | }, 65 | 66 | // 监听键盘的搜索按钮点击事件,若点击则进行打卡圈子搜素 67 | search: function () { 68 | let that = this; 69 | 70 | // 获取用户输入的搜索关键字 71 | let keyword = that.data.inputVal; 72 | 73 | if (keyword.length <= 0) { 74 | wx.showToast({ 75 | title: '请输入搜索关键字', 76 | icon: 'none', 77 | duration: 1000 78 | }); 79 | return false; 80 | } 81 | 82 | // 开启打卡圈子搜索中的加载动画 83 | that.setData({ 84 | showSearchLoading: true 85 | }); 86 | 87 | // 这时候获取到符合搜索条件的数据为第一页的 88 | that.searchPunchCardProject(keyword, 1, that.data.pageSize, function (res) { 89 | 90 | let respData = res.data; 91 | 92 | switch (res.statusCode) { 93 | case 200: 94 | that.data.punchCardDiaryList = []; 95 | that.setData({ 96 | showSearchLoading: false, // 关闭搜索中加载动画 97 | punchCardProjectList: respData.data, 98 | pageNo: 1 99 | }); 100 | break; 101 | 102 | // 没有符合搜索关键字的打卡圈子数据 103 | case 400: 104 | that.setData({ 105 | showSearchLoading: false 106 | }); 107 | wx.showToast({ 108 | title: '没有符合的打卡圈子', 109 | icon: 'none', 110 | duration: 2000 111 | }); 112 | break; 113 | 114 | default: 115 | wx.showToast({ 116 | title: respData.errMsg, 117 | icon: 'none', 118 | duration: 2000 119 | }); 120 | break; 121 | } 122 | }) 123 | }, 124 | 125 | // 上拉加载更多符合搜索关键字的打卡圈子列表数据 126 | onReachBottom: function () { 127 | let that = this, 128 | nextPageNo = that.data.pageNo + 1, 129 | keyword = that.data.inputVal; 130 | 131 | // 如果符合查询关键字的打卡圈子列表加载完毕则不再进行请求 132 | if (that.data.notMoreSearchData === true) 133 | return false; 134 | 135 | // 显示加载下一页数据的加载动画 136 | that.setData({ 137 | moreSearchDataLoad: true 138 | }); 139 | 140 | that.searchPunchCardProject(keyword, nextPageNo, that.data.pageSize, function (res) { 141 | let respData = res.data; 142 | switch (res.statusCode) { 143 | case 200: 144 | let length = respData.data.length; 145 | 146 | // 当前请求页已经没有数据,说明上一页为最后一页数据 147 | if (length <= 0) { 148 | that.setData({ 149 | notMoreSearchData: true, // 设置符合搜索关键字的打卡圈子列表数据已经全部加载 150 | moreSearchDataLoad: false, // 关闭加载更多动画 151 | pageNo: nextPageNo - 1 152 | }); 153 | 154 | } else { 155 | // 将当前请求页的数据追加到前面已获取的数据列表中 156 | for (let i = 0; i < length; i++) { 157 | that.data.punchCardProjectList[length + i] = respData.data[i]; 158 | } 159 | that.setData({ 160 | notMoreSearchData: false, // 下一页是否还有符合的数据未知 161 | moreSearchDataLoad: false, 162 | pageNo: nextPageNo, // 修改当前请求页为最新获取的页号 163 | punchCardProjectList: that.data.punchCardProjectList 164 | }); 165 | } 166 | break; 167 | 168 | default: 169 | wx.showToast({ 170 | title: respData.errMsg, 171 | icon: 'none', 172 | duration: 2000 173 | }); 174 | break; 175 | } 176 | }); 177 | }, 178 | 179 | /** 180 | * 向服务器端获取打卡圈子搜索数据,分页返回符合搜索条件的数据 181 | * @param keyword 搜索添加字符串 182 | * @param pageNo 符合条件的数据的页号 183 | * @param pageSize 每页返回的数据条数 184 | * @param callback 请求成功后的回调处理函数 185 | */ 186 | searchPunchCardProject: function (keyword, pageNo, pageSize, callback) { 187 | wx.request({ 188 | url: app.globalData.urlRootPath + 'index/PunchCardProject/search', 189 | 'method': 'post', 190 | data: { 191 | pageNo: pageNo, 192 | pageSize: pageSize, 193 | keyword: keyword 194 | }, 195 | success: function (res) { 196 | // 请求成功后执行对应的函数进行后续处理 197 | callback && callback(res); 198 | }, 199 | fail: function () { 200 | wx.showToast({ 201 | title: '网络异常!', 202 | icon: 'none', 203 | duration: 2000 204 | }); 205 | } 206 | }) 207 | }, 208 | 209 | onPageScroll: function (e) { 210 | let that = this; 211 | clearTimeout(this.scrollTimer); 212 | this.scrollArr = Array.isArray(this.scrollArr) ? this.scrollArr : []; //记录滚动坐标 213 | this.scrollArr.push(e.scrollTop); 214 | if (this.scrollArr.length > 2) { 215 | that.searchBarFixClass = '' 216 | if (e.scrollTop !== 0 && (this.scrollArr[this.scrollArr.length - 1] - this.scrollArr[0]) <= 0) { 217 | that.searchBarFixClass = 'search-bar-fix'; 218 | } 219 | that.setData({ 220 | searchBarFixClass: that.searchBarFixClass 221 | }); 222 | 223 | //1向下滚动 -1向上滚动 224 | this.direction = (this.scrollArr[this.scrollArr.length - 1] - this.scrollArr[0]) > 0 ? 1 : -1; 225 | console.log('direction -- ', this.direction); 226 | } 227 | this.scrollTimer = setTimeout(() => {//延迟清除记录 228 | this.scrollArr = []; 229 | }, 100); 230 | } 231 | }); 232 | -------------------------------------------------------------------------------- /pages/find/searchPunchCardProject/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": false, 3 | "navigationBarTitleText": "搜索页", 4 | 5 | "usingComponents": { 6 | "punch-card-project-item": "/components/find/punchCardProjectListItem" 7 | } 8 | } -------------------------------------------------------------------------------- /pages/find/searchPunchCardProject/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 25 | 26 | 27 | 28 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 搜索中... 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 56 | 57 | 58 | 59 | 60 | 63 | 64 | -------------------------------------------------------------------------------- /pages/find/searchPunchCardProject/index.wxss: -------------------------------------------------------------------------------- 1 | .search-input-container { 2 | width: 100vw; 3 | height: auto; 4 | } 5 | .search-bar-fix { 6 | position: fixed; 7 | top: 0; 8 | } 9 | .weui-search-bar { 10 | border-bottom: 1px solid white; 11 | } 12 | 13 | .search-result-list { 14 | width: auto; 15 | height: auto; 16 | /*margin-top: 47px;*/ 17 | } 18 | 19 | /* 底部*/ 20 | .bottom { 21 | width: 100vw; 22 | height: 60rpx; 23 | line-height: 60rpx; 24 | margin-bottom: 15px; 25 | padding-top: 20rpx; 26 | text-align: center; 27 | 28 | color: #8a8a8a; 29 | font-size: 30rpx; 30 | } 31 | -------------------------------------------------------------------------------- /pages/find/showPunchCardProjectByType/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | 4 | "usingComponents": { 5 | "punch-card-project-item": "/components/find/punchCardProjectListItem" 6 | } 7 | } -------------------------------------------------------------------------------- /pages/find/showPunchCardProjectByType/index.wxml: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 加载中... 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 暂无系统推荐的打卡圈子,建一个呗 39 | 40 | 42 | 43 | 创建打卡圈子 44 | 45 | 46 | 47 | 48 | 49 | 50 | 52 | 53 | 57 | {{item.label_name}} 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 加载中... 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 84 | 85 | 86 | 87 | 88 | 89 | 暂无该类型的打卡圈子,建一个呗 90 | 91 | 93 | 94 | 创建打卡圈子 95 | 96 | 97 | 98 | 99 | 100 | 101 | 104 | 105 | -------------------------------------------------------------------------------- /pages/find/showPunchCardProjectByType/index.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | height: auto; 3 | } 4 | .container { 5 | height: auto; 6 | } 7 | .project-children-type-navigation { 8 | width: 100vw; 9 | height: 42px; 10 | padding-left: 10px; 11 | white-space: nowrap; 12 | position: fixed; 13 | top: 0; 14 | background-color: white; 15 | z-index: 999; 16 | } 17 | 18 | .children-label-item { 19 | height: 40px; 20 | line-height: 40px; 21 | width: auto; 22 | margin-right: 40px; 23 | 24 | display: inline-block; 25 | } 26 | 27 | /*标识出当前选择的圈子类型*/ 28 | .selected-tab-indicate{ 29 | width: 16px; 30 | height: 3px; 31 | /*默认定位到第一个类型选项卡中间*/ 32 | margin-left: 10px; 33 | background-color: #F0B27A; 34 | } 35 | 36 | /*没有该类型的打卡圈子数据提示*/ 37 | .not-punch-card-project { 38 | height: auto; 39 | width: 100%; 40 | margin-top: 50%; 41 | } 42 | .not-punch-card-project-notice { 43 | width: 100%; 44 | height: 80rpx; 45 | line-height: 80rpx; 46 | text-align: center; 47 | font-size: 32rpx; 48 | color: #F0B27A; 49 | } 50 | 51 | .create-punch-card-project-btn { 52 | width: 240rpx; 53 | height: 60rpx; 54 | position: relative; 55 | left: 50%; 56 | margin-left: -120rpx; 57 | display: flex; 58 | flex-direction: row; 59 | justify-content: space-around; 60 | align-items: center; 61 | border: 2rpx #F0B27A solid; 62 | border-radius: 10rpx; 63 | 64 | font-size: 30rpx; 65 | color: #F0B27A; 66 | } 67 | .create-punch-card-project-btn > image { 68 | width: 30rpx; 69 | height: 30rpx; 70 | } 71 | 72 | /* 底部*/ 73 | .bottom { 74 | width: 100vw; 75 | height: 60rpx; 76 | line-height: 60rpx; 77 | margin-bottom: 30rpx; 78 | padding-top: 20rpx; 79 | text-align: center; 80 | 81 | color: #8a8a8a; 82 | font-size: 30rpx; 83 | } 84 | 85 | -------------------------------------------------------------------------------- /pages/index/allProjectList/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | // 服务器图片访问BaseURL 9 | imgRootPath: app.globalData.imgBaseSeverUrl, 10 | punchCardProjectList: [] 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | let that = this; 18 | let punchCardProjectList = JSON.parse(options.punchCardProjectList); 19 | that.setData({ 20 | punchCardProjectList: punchCardProjectList 21 | }); 22 | console.log(that.data.punchCardProjectList); 23 | }, 24 | 25 | /** 26 | * 生命周期函数--监听页面初次渲染完成 27 | */ 28 | onReady: function () { 29 | 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面显示 34 | */ 35 | onShow: function () { 36 | 37 | }, 38 | 39 | 40 | /** 41 | * 页面相关事件处理函数--监听用户下拉动作 42 | */ 43 | onPullDownRefresh: function () { 44 | 45 | }, 46 | 47 | /** 48 | * 页面上拉触底事件的处理函数 49 | */ 50 | onReachBottom: function () { 51 | 52 | }, 53 | 54 | // 进入打卡详情页点击事件 55 | intoPunchCardDetail: function (e) { 56 | console.log(e); 57 | wx.navigateTo({ 58 | url: '/pages/punchCardDetailPage/index' 59 | + "?projectId=" + e.currentTarget.dataset.projectId 60 | + "&isCreator=" + e.currentTarget.dataset.isCreator 61 | }) 62 | }, 63 | }); -------------------------------------------------------------------------------- /pages/index/allProjectList/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {}, 3 | "navigationBarBackgroundColor": "#F0B27A", 4 | "navigationBarTitleText": "我的圈子" 5 | } -------------------------------------------------------------------------------- /pages/index/allProjectList/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | {{item.project_name}} 30 | 暂无人打卡 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 去打卡 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 啊哈~还是空的呢 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /pages/index/allProjectList/index.wxss: -------------------------------------------------------------------------------- 1 | .my-all-punch-card-project-lists { 2 | width: 100%; 3 | height: auto; 4 | margin: 0; 5 | padding: 0; 6 | } 7 | 8 | .punch-card-project-item { 9 | width: 100%; 10 | height: 140rpx; 11 | 12 | display: flex; 13 | flex-direction: row; 14 | justify-content: flex-start; 15 | align-items: flex-start; 16 | } 17 | .punch-card-project-item:last-child { 18 | margin-bottom: 70rpx; 19 | } 20 | 21 | .punch-card-project-cover-img { 22 | width: 140rpx; 23 | height: 140rpx; 24 | margin-left: 20rpx; 25 | display: flex; 26 | flex-direction: row; 27 | justify-content: flex-start; 28 | align-items: center; 29 | 30 | position: relative; 31 | } 32 | .punch-card-project-cover-img > image:first-child{ 33 | width: 140rpx; 34 | height: 100rpx; 35 | border-radius: 10rpx; 36 | } 37 | .punch-card-project-creator-icon { 38 | width: 25rpx; 39 | height: 25rpx; 40 | position: absolute; 41 | bottom: 25rpx; 42 | right: 5rpx; 43 | background-color: white; 44 | border-radius: 50%; 45 | font-size: 0; 46 | } 47 | .punch-card-project-creator-icon > image { 48 | width: 25rpx; 49 | height: 25rpx; 50 | } 51 | .punch-card-project-info { 52 | width: 390rpx; 53 | height: 140rpx; 54 | 55 | display: flex; 56 | flex-direction: row; 57 | justify-content: flex-start; 58 | align-items: flex-start; 59 | 60 | margin-left: 20rpx; 61 | } 62 | .punch-card-project-info > .left { 63 | width: 300rpx; 64 | height: 140rpx; 65 | } 66 | .punch-card-project-info > .left > .punch-card-project-name { 67 | margin-top: 20rpx; 68 | margin-bottom: 6rpx; 69 | line-height: 1.2; 70 | font-size: 30rpx; 71 | letter-spacing: 2rpx; 72 | text-align: left; 73 | 74 | background-color: #FBDA61; 75 | background-image: linear-gradient(45deg,#FBDA61 0%,#FF5ACD 70%); 76 | background-image: -webkit-linear-gradient(45deg,#FBDA61 0%,#FF5ACD 70%); 77 | background-image: -moz-linear-gradient(45deg,#FBDA61 0%,#FF5ACD 70%); 78 | background-image: -o-linear-gradient(45deg,#FBDA61 0%,#FF5ACD 70%); 79 | -webkit-background-clip: text; 80 | -webkit-text-fill-color: transparent; 81 | } 82 | .punch-card-project-info > .left > .today-punch-card-people-num { 83 | font-size: 22rpx; 84 | color: #8a8a8a; 85 | } 86 | .punch-card-project-info > .right { 87 | width: 90rpx; 88 | height: 120rpx; 89 | margin-top: 20rpx; 90 | text-align: center; 91 | } 92 | .punch-card-project-info > .right > .punch-card-project-creator { 93 | width: 60rpx; 94 | font-size: 22rpx; 95 | color: white; 96 | background-color: #F9A825; 97 | padding: 2rpx 4rpx; 98 | border-radius: 8rpx; 99 | } 100 | 101 | .go-to-punch-card-btn { 102 | width: 160rpx; 103 | height: 100%; 104 | margin-right: 20rpx; 105 | 106 | display: flex; 107 | justify-content: center; 108 | align-items: center; 109 | } 110 | 111 | .go-to-punch-card-btn > text { 112 | border: 2rpx solid #F0B27A; 113 | border-radius: 6rpx; 114 | background-color: #F0B27A; 115 | color: white; 116 | padding: 4rpx 10rpx; 117 | } 118 | 119 | .empty-data-notify { 120 | display: flex; 121 | flex-direction: column; 122 | justify-content: center; 123 | align-items: center; 124 | height: 100vh; 125 | } 126 | .empty-data-notify .wrap { 127 | display: flex; 128 | flex-direction: column; 129 | justify-content: flex-start; 130 | align-items: center; 131 | 132 | font-size: 32rpx; 133 | color: black; 134 | } 135 | .empty-data-notify .wrap > image { 136 | width: 240rpx; 137 | height: 252rpx; 138 | margin-bottom: 20rpx; 139 | } 140 | -------------------------------------------------------------------------------- /pages/index/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | "navigationBarTitleText": "首页", 4 | "navigationBarBackgroundColor": "#FFFFFF", 5 | "navigationBarTextStyle": "black", 6 | 7 | "usingComponents": { 8 | "punch-card-diary-audio-play": "/components/audioPlay/index" 9 | } 10 | } -------------------------------------------------------------------------------- /pages/loginAuth/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | data: { 4 | //判断小程序的API,回调,参数,组件等是否在当前版本可用。 5 | canIUse: wx.canIUse('button.open-type.getUserInfo') 6 | }, 7 | onLoad: function() { 8 | let that = this; 9 | // 微信登录,获取用户openID 10 | // wx.login({ 11 | // success: function(res) { 12 | // if (res.code) { 13 | // wx.request({ 14 | // url: app.globalData.urlRootPath + 15 | // 'index/user/getOpenId', 16 | // data: { 17 | // code: res.code 18 | // }, 19 | // success: function(response) { 20 | // if (response.statusCode !== 200) { 21 | // wx.showToast({ 22 | // title: response.data.errMsg, 23 | // icon: "none" 24 | // }) 25 | // } else { 26 | // app.globalData.openid = response.data.data.openid 27 | // } 28 | // console.log(response); 29 | // console.log(app.globalData.openid); 30 | // }, 31 | // 32 | // fail: function() { 33 | // wx.showToast({ 34 | // title: '网络异常...', 35 | // icon: "none" 36 | // }) 37 | // } 38 | // }) 39 | // 40 | // } else { 41 | // console.error('微信登录失败:' + res.errMsg); 42 | // } 43 | // } 44 | // }); 45 | 46 | // 查看是否授权 47 | // wx.getSetting({ 48 | // success: function(res) { 49 | // // 用户已经授权 50 | // if (res.authSetting['scope.userInfo']) { 51 | // 52 | // // 获取用户信息 53 | // wx.getUserInfo({ 54 | // success: function(res) { 55 | // console.log("获取用户信息:"); 56 | // console.log(res); 57 | // console.log(app.globalData.openid); 58 | // 59 | // // 保存用户微信信息至全局变量,同时保证字段名与表字段名一致 60 | // app.globalData.userInfo.avatar_url = res.userInfo.avatarUrl; 61 | // app.globalData.userInfo.nick_name = res.userInfo.nickName; 62 | // app.globalData.userInfo.sex = parseInt(res.userInfo.gender); 63 | // 64 | // // 为了防止在用户第一次授权的时候,服务器未能成功添加用户信息 65 | // // 在授权成功依旧根据openId检测,再次添加,添加成功返回服务器 66 | // // 数据库用户信息 67 | // that.addWeiXinUserInfo(); 68 | // 69 | // // 进入首页 70 | // wx.switchTab({ 71 | // url: '../index/index' 72 | // // url: '../mine/detailPage/userInfo' 73 | // }) 74 | // } 75 | // }); 76 | // 77 | // } // 没有授权则不进入首页,显示当前的授权页面,进行用户授权 78 | // } 79 | // }) 80 | }, 81 | 82 | // 授权登录回调函数,返回值的detail.userInfo等同于wx.getUserInfo的用户信息 83 | bindGetUserInfo: function(e) { 84 | 85 | // 若是用户信息存在则说明授权成功 86 | if (e.detail.userInfo) { 87 | 88 | // 保存用户微信信息至全局变量,同时保证字段名与表字段名一致 89 | app.globalData.userInfo.avatar_url = e.detail.userInfo.avatarUrl; 90 | app.globalData.userInfo.nick_name = e.detail.userInfo.nickName; 91 | app.globalData.userInfo.sex = e.detail.userInfo.gender; 92 | 93 | // 一般而言,授权只有一次,也就是第一次,在授权成功后需要将微信的一些信息 94 | // 写入服务器端的数据库 95 | let that = this; 96 | that.addWeiXinUserInfo(); 97 | 98 | 99 | //授权成功后,跳转进入小程序首页 100 | wx.switchTab({ 101 | url: '../index/index' 102 | }) 103 | 104 | } else { 105 | // 用户拒接授权 106 | wx.showModal({ 107 | title: '警告', 108 | content: '您点击了拒绝授权,将无法进入小程序,请授权之后再进入!!!', 109 | showCancel: false, 110 | confirmText: '返回授权', 111 | success: function (res) { 112 | if (res.confirm) { 113 | console.log('用户点击了“返回授权”') 114 | } 115 | } 116 | }) 117 | } 118 | }, 119 | 120 | 121 | // 服务器端根据openid判断用户信息是否存在,不存在将用户微信信息存入数据库 122 | addWeiXinUserInfo: function() { 123 | console.log(app.globalData.userInfo); 124 | let that = this; 125 | let avatarUrl = app.globalData.userInfo.avatar_url; 126 | wx.request({ 127 | url: app.globalData.urlRootPath + 'index/user/addUserInfo', 128 | data: { 129 | open_id: app.globalData.openid, 130 | nick_name: app.globalData.userInfo.nick_name, // 微信昵称 131 | avatar_url: avatarUrl === "" ? "default_avatar": avatarUrl, // 微信用户头像 132 | sex: parseInt(app.globalData.userInfo.sex) // 性别 0-未知,1-男性,2-女性 133 | }, 134 | header: { 135 | 'content-type': 'application/json' 136 | }, 137 | success: function (res) { 138 | that.setData({ 139 | showLoading: true 140 | }); 141 | wx.hideLoading(); 142 | switch (res.statusCode) { 143 | case 200: 144 | // 本地保存服务器端返回的用户信息 145 | app.globalData.userInfo = res.data.userInfo; 146 | break; 147 | default: 148 | wx.showToast({ 149 | title: res.data.errMsg, 150 | icon: 'none', 151 | duration: 2000 152 | }); 153 | break; 154 | } 155 | 156 | console.log(res); 157 | console.log("服务器端处理用户授权信息并返回用户数据"); 158 | 159 | // 由于request是异步网络请求,可能会在Page.onLoad执行结束才能返回数据 160 | // 这也就会导致在Page.onLoad获取不到request设置的全局变量 161 | // 因为Page.onLoad结束在request之前,这时候获取的变量是空值 162 | // 因此加入全局回调函数 163 | if (app.userInfoReadyCallBack !== '') { 164 | app.userInfoReadyCallBack(res.data.userInfo); 165 | } 166 | 167 | }, 168 | fail: function () { 169 | wx.showToast({ 170 | title: '网络异常...', 171 | icon: "none" 172 | }) 173 | } 174 | }); 175 | }, 176 | 177 | 178 | }); -------------------------------------------------------------------------------- /pages/loginAuth/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "授权登录" 3 | } -------------------------------------------------------------------------------- /pages/loginAuth/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 申请获取以下权限 9 | 获得你的公开信息(昵称,头像等) 10 | 11 | 12 | 15 | 16 | 17 | 18 | 请升级微信版本 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /pages/loginAuth/index.wxss: -------------------------------------------------------------------------------- 1 | /* pages/loginAuth/index.wxss */ 2 | .header { 3 | margin: 90rpx 0 90rpx 50rpx; 4 | border-bottom: 1px solid #ccc; 5 | text-align: center; 6 | width: 650rpx; 7 | height: 300rpx; 8 | line-height: 450rpx; 9 | } 10 | 11 | .header image { 12 | width: 200rpx; 13 | height: 200rpx; 14 | } 15 | 16 | .content { 17 | margin-left: 50rpx; 18 | margin-bottom: 90rpx; 19 | } 20 | 21 | .content text { 22 | display: block; 23 | color: #9d9d9d; 24 | margin-top: 40rpx; 25 | } 26 | 27 | .bottom { 28 | border-radius: 80rpx; 29 | margin: 70rpx 50rpx; 30 | font-size: 35rpx; 31 | } 32 | -------------------------------------------------------------------------------- /pages/mine/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | "navigationBarTitleText": "我的", 4 | 5 | "usingComponents": { 6 | "mine-diary-item": "/components/mine/diaryItem" 7 | } 8 | } -------------------------------------------------------------------------------- /pages/mine/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | {{userInfo.nick_name}} 46 | 用户ID:{{userInfo.id}} 47 | 48 | 49 | 50 | 51 | 查看我的主页 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 我的关注 67 | 68 | 69 | 70 | 71 | 72 | 我的粉丝 73 | 74 | 75 | 76 | 77 | 78 | 我的收藏 79 | 80 | 81 | 82 | 83 | 84 | 我建的圈子 85 | 86 | 87 | 88 | 89 | 90 | 设置 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 正在加载 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 暂无打卡日记~ 111 | 112 | 快去发布打卡日记吧 113 | 去打卡列表 114 | 115 | 116 | 117 | 118 | 119 | 我的打卡日记 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 132 | 133 | 134 | 135 | 136 | 137 | 141 | 142 | 143 | 144 | 147 | 148 | -------------------------------------------------------------------------------- /pages/mine/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | } 5 | 6 | .container_userInfo { 7 | width: 100%; 8 | height: 160rpx; 9 | background-color: #F0B27A; 10 | color: white; 11 | display: flex; 12 | justify-content: space-between; 13 | align-items: center; 14 | 15 | } 16 | /* 用户头像*/ 17 | .userInfo_avatar { 18 | width: 20%; 19 | height: 160rpx; 20 | } 21 | .avatar { 22 | width: 100rpx; 23 | height: 100rpx; 24 | border: 2rpx solid white; 25 | margin: 26rpx 20rpx 20rpx 20rpx; 26 | border-radius: 50%; 27 | } 28 | 29 | 30 | /*性别*/ 31 | .user-sex-male { 32 | width: 34rpx; 33 | height: 34rpx; 34 | 35 | border-radius: 50%; 36 | background-color: white; 37 | 38 | position: absolute; 39 | left: 90rpx; 40 | top: 90rpx; 41 | 42 | display: flex; 43 | flex-direction: row; 44 | justify-content: space-around; 45 | align-items: center; 46 | } 47 | .user-sex-male > image{ 48 | width: 30rpx; 49 | height: 30rpx; 50 | } 51 | 52 | .user-sex-female { 53 | width: 34rpx; 54 | height: 34rpx; 55 | 56 | border-radius: 50%; 57 | background-color: white; 58 | 59 | position: absolute; 60 | left: 90rpx; 61 | top: 90rpx; 62 | 63 | display: flex; 64 | flex-direction: row; 65 | justify-content: space-around; 66 | align-items: center; 67 | } 68 | .user-sex-female > image{ 69 | width: 30rpx; 70 | height: 30rpx; 71 | transform: rotate(30deg); 72 | } 73 | 74 | 75 | 76 | /* 用户id、昵称、进入个人主页按钮图标*/ 77 | .nickname_userId { 78 | height: 100%; 79 | width: 40%; 80 | display: flex; 81 | flex-direction: column; 82 | justify-content: flex-start; 83 | align-items: flex-start; 84 | } 85 | 86 | .nick-name { 87 | margin-top: 32rpx; 88 | font-size: 36rpx; 89 | } 90 | 91 | .user-id { 92 | font-size: 22rpx; 93 | } 94 | 95 | /* 进入个人主页按钮 */ 96 | .mine { 97 | width: 40%; 98 | height: 160rpx; 99 | 100 | font-size: 24rpx; 101 | 102 | display: flex; 103 | flex-direction: row; 104 | justify-content: flex-end; 105 | align-items: center; 106 | } 107 | 108 | .into_mine_page { 109 | width: 60rpx; 110 | height: 60rpx; 111 | margin-right: 20rpx; 112 | } 113 | 114 | /* 间隔线 */ 115 | .interval_line { 116 | height: 20rpx; 117 | width: 100%; 118 | background-color: whitesmoke; 119 | } 120 | 121 | /*相关功能*/ 122 | .functional-module { 123 | width: 100%; 124 | height: auto; 125 | margin-top: 40rpx; 126 | 127 | display: flex; 128 | flex-direction: row; 129 | flex-wrap: wrap; 130 | align-items: center; 131 | justify-content: flex-start; 132 | 133 | font-size: 24rpx; 134 | } 135 | 136 | /*我的关注*/ 137 | .my-follow { 138 | width: 25%; 139 | height: 140rpx; 140 | display: flex; 141 | flex-direction: column; 142 | align-items: center; 143 | } 144 | 145 | .my-follow > image { 146 | width: 60rpx; 147 | height: 60rpx; 148 | border-radius: 10rpx; 149 | margin-bottom: 10rpx; 150 | } 151 | 152 | /*我的粉丝*/ 153 | .my-follower { 154 | width: 25%; 155 | height: 140rpx; 156 | display: flex; 157 | flex-direction: column; 158 | align-items: center; 159 | } 160 | 161 | .my-follower > image { 162 | width: 60rpx; 163 | height: 60rpx; 164 | border-radius: 10rpx; 165 | margin-bottom: 10rpx; 166 | } 167 | 168 | /*我的收藏*/ 169 | .my-collect { 170 | width: 25%; 171 | height: 140rpx; 172 | 173 | display: flex; 174 | flex-direction: column; 175 | align-items: center; 176 | } 177 | 178 | .my-collect > image { 179 | width: 60rpx; 180 | height: 60rpx; 181 | border-radius: 10rpx; 182 | margin-bottom: 10rpx; 183 | } 184 | 185 | /*我创建的打卡圈子*/ 186 | .my-create-project { 187 | width: 25%; 188 | height: 140rpx; 189 | display: flex; 190 | flex-direction: column; 191 | align-items: center; 192 | } 193 | 194 | .my-create-project > image { 195 | width: 60rpx; 196 | height: 60rpx; 197 | border-radius: 10rpx; 198 | margin-bottom: 10rpx; 199 | } 200 | 201 | /*设置*/ 202 | .setting { 203 | width: 25%; 204 | height: 140rpx; 205 | display: flex; 206 | flex-direction: column; 207 | align-items: center; 208 | } 209 | 210 | .setting > image{ 211 | width: 60rpx; 212 | height: 60rpx; 213 | border-radius: 10rpx; 214 | margin-bottom: 10rpx; 215 | } 216 | 217 | /*打卡日记列表为空时的提示信息展示*/ 218 | .empty-diary-list-notice { 219 | width: 100%; 220 | height: auto; 221 | display: flex; 222 | flex-direction: column; 223 | justify-content: center; 224 | align-items: center; 225 | 226 | font-size: 24rpx; 227 | } 228 | .empty-diary-list-notice > image { 229 | margin: 50rpx 0 20rpx 0; 230 | width: 240rpx; 231 | height: 240rpx; 232 | } 233 | 234 | /*跳转至我参与的打卡圈子列表即首页*/ 235 | .goto-punch-card-list-page > text { 236 | color: #F0B27A; 237 | } 238 | 239 | /*打卡日记列表展示*/ 240 | .user-punch-card-diary-list-info { 241 | width: 100%; 242 | height: auto; 243 | } 244 | 245 | .title { 246 | width: auto; 247 | height: 100rpx; 248 | line-height: 100rpx; 249 | margin: 0 20rpx; 250 | 251 | font-size: 34rpx; 252 | color: black; 253 | font-weight: bolder; 254 | } 255 | 256 | 257 | /* 底部*/ 258 | .bottom { 259 | width: 100%; 260 | height: 60rpx; 261 | line-height: 60rpx; 262 | margin-bottom: 30rpx; 263 | padding-top: 20rpx; 264 | text-align: center; 265 | 266 | color: #8a8a8a; 267 | font-size: 30rpx; 268 | } 269 | -------------------------------------------------------------------------------- /pages/mine/personalHomePage/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": true, 3 | "usingComponents": { 4 | "mine-diary-item": "/components/mine/diaryItem" 5 | } 6 | } -------------------------------------------------------------------------------- /pages/mine/personalHomePage/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | /*background-color: cyan;*/ 5 | } 6 | 7 | /* 8 | * 头部信息: 个人主页背景图、头像、个人主页设置 9 | */ 10 | .headerInfo { 11 | width: 100%; 12 | height: 520rpx; 13 | } 14 | 15 | /* 16 | * 个人主页背景图 17 | */ 18 | .backgroundImg { 19 | width: 100%; 20 | height: 400rpx; 21 | } 22 | 23 | /* 进入个人主页设置页面按钮 */ 24 | .intoUserInfoSetBtn { 25 | width: auto; 26 | height: 40rpx; 27 | padding: 6rpx 10rpx 6rpx 10rpx; 28 | border: 2rpx solid white; 29 | border-radius: 6rpx; 30 | background-color: transparent; 31 | font-size: 24rpx; 32 | font-weight: bolder; 33 | color: white; 34 | 35 | position: absolute; 36 | top: 316rpx; 37 | right: 20rpx; 38 | 39 | /*设置图片居中*/ 40 | display: table; 41 | vertical-align: middle; 42 | 43 | } 44 | .intoUserInfoSetBtn image { 45 | height: 40rpx; 46 | width: 40rpx; 47 | margin-right: 6rpx; 48 | vertical-align: middle; 49 | 50 | } 51 | 52 | 53 | /* 54 | * 用户头像 55 | */ 56 | .userAvatar { 57 | width: 200rpx; 58 | height: 200rpx; 59 | border: 2rpx solid white; 60 | border-radius: 50%; 61 | 62 | /*绝对定位水平居中*/ 63 | position: absolute; 64 | top: 300rpx; 65 | left: 50%; 66 | margin-left: -100rpx; 67 | } 68 | 69 | /*用户昵称*/ 70 | .userNickName { 71 | width: 100%; 72 | height: auto; 73 | margin-bottom: 20rpx; 74 | 75 | 76 | font-size: 38rpx; 77 | text-align: center; 78 | } 79 | 80 | /* 关注与粉丝 */ 81 | .followAndFollower { 82 | width: 100%; 83 | height: 60rpx; 84 | display: flex; 85 | justify-content: space-between; 86 | } 87 | 88 | /* 我的关注 */ 89 | .myFollowNum { 90 | width: 45%; 91 | text-align: right; 92 | color: cornflowerblue; 93 | 94 | } 95 | 96 | /* 分隔符 */ 97 | .decollator { 98 | width: 10%; 99 | padding-top: 14rpx; 100 | text-align: center; 101 | color: #8a8a8a; 102 | font-size: 20rpx; 103 | } 104 | 105 | /* 我的粉丝 */ 106 | .myFollowerNum { 107 | width: 45%; 108 | text-align: left; 109 | color: cornflowerblue; 110 | } 111 | 112 | /* 个人标签:身份标签 & 兴趣标签 & 添加按钮*/ 113 | /*容器:flex布局*/ 114 | .personalLabel { 115 | height: auto; 116 | width: 80%; 117 | margin-right: 10%; 118 | margin-left: 10%; 119 | padding: 0 10rpx 10rpx 10rpx; 120 | 121 | display: flex; 122 | flex-direction: row; 123 | flex-wrap: wrap; 124 | justify-content: center; 125 | align-items: center; 126 | 127 | /*background-color: yellow;*/ 128 | } 129 | 130 | /* min flex item*/ 131 | .minLabelItem { 132 | width: auto; 133 | height: 30rpx; 134 | 135 | padding: 10rpx 24rpx 10rpx 24rpx; 136 | margin: 6rpx; 137 | 138 | border: 2rpx solid darkorange; 139 | border-radius: 30rpx; 140 | 141 | flex-grow: 0; 142 | 143 | color: darkorange; 144 | font-size: 26rpx; 145 | line-height: 30rpx; 146 | text-align: center; 147 | 148 | } 149 | 150 | /* 小号添加按钮 图标 */ 151 | .minLabelItem image { 152 | display: inline-block; 153 | width: 20rpx; 154 | height: 20rpx; 155 | margin-right: 6rpx; 156 | } 157 | 158 | /* max flex item*/ 159 | .maxLabelItem { 160 | width: auto; 161 | height: 50rpx; 162 | 163 | padding: 10rpx 24rpx 10rpx 24rpx; 164 | margin: 6rpx; 165 | 166 | border: 2rpx solid darkorange; 167 | border-radius: 30rpx; 168 | 169 | flex-grow: 0; 170 | 171 | color: darkorange; 172 | font-size: 32rpx; 173 | line-height: 50rpx; 174 | text-align: center; 175 | 176 | } 177 | /* 大号添加按钮 图标 */ 178 | .maxLabelItem image { 179 | display: inline-block; 180 | width: 28rpx; 181 | height: 30rpx; 182 | margin-right: 12rpx; 183 | margin-bottom: 4rpx; 184 | vertical-align: middle; 185 | } 186 | 187 | /* 分割线 */ 188 | .breakupLineMin { 189 | background-color: #e7e7e7; 190 | height: 2rpx; 191 | margin-top: 20rpx; 192 | margin-right: 20rpx; 193 | margin-left: 20rpx; 194 | } 195 | 196 | /* 个人主页访客记录: 访客人数 & 最近访问的五个人头像 & 详细访问记录页面入口*/ 197 | .visitorRecord { 198 | width: 100%; 199 | height: 100rpx; 200 | display: flex; 201 | justify-content: space-between; 202 | } 203 | 204 | /*访客人数*/ 205 | .visitorNum { 206 | width: 45%; 207 | height: 100rpx; 208 | padding-left: 20rpx; 209 | 210 | line-height: 100rpx; 211 | font-size: 28rpx; 212 | 213 | } 214 | 215 | /*最近访问的五个人的头像*/ 216 | .visitorAvatarList { 217 | width: 45%; 218 | height: 100%; 219 | 220 | display: flex; 221 | flex-direction: row; 222 | flex-wrap: nowrap; 223 | justify-content: flex-end; 224 | align-items: center; 225 | 226 | } 227 | 228 | .visitorAvatarItem { 229 | width: 50rpx; 230 | height: 50rpx; 231 | margin-left: 10rpx; 232 | } 233 | .visitorAvatarItem image { 234 | width: 100%; 235 | height: 100%; 236 | border-radius: 50%; 237 | } 238 | 239 | /*详细访问记录页面入口图标*/ 240 | .intoVisitorDetailPageIcon { 241 | width: 10%; 242 | height: 100%; 243 | } 244 | .intoVisitorDetailPageIcon image { 245 | width: 70%; 246 | height: 70rpx; 247 | padding-top: 14rpx; 248 | } 249 | 250 | /*分割线*/ 251 | .breakupLineMax { 252 | background-color: whitesmoke; 253 | height: 20rpx; 254 | width: 100%; 255 | } 256 | 257 | 258 | /* 我加入的打卡圈子 */ 259 | .joinInPunchCardProject { 260 | width: 100%; 261 | height: 330rpx; 262 | padding-top: 20rpx; 263 | 264 | } 265 | 266 | .joinInPunchCardProject text { 267 | width: 100%; 268 | height: 60rpx; 269 | 270 | font-size: 36rpx; 271 | font-weight: bolder; 272 | line-height: 60rpx; 273 | padding-left: 20rpx; 274 | } 275 | 276 | /* 加入的打卡圈子通过scroll-view横向展示 */ 277 | .joinInPunchCardProjectList { 278 | height: 200rpx; 279 | width: auto; 280 | margin-top: 20rpx; 281 | padding-left: 20rpx; 282 | padding-right: 20rpx; 283 | 284 | white-space: nowrap; 285 | } 286 | 287 | /*还未参与任何一个打卡圈子*/ 288 | .noJoinInPunchCardProjectNotice { 289 | height: 200rpx; 290 | width: 100%; 291 | line-height: 200rpx; 292 | 293 | font-weight: bolder; 294 | text-align: center; 295 | } 296 | 297 | /* 加入的打卡圈子相关信息展示 */ 298 | .joinInPunchCardProjectItem { 299 | width: 400rpx; 300 | height: 100%; 301 | margin-right: 20rpx; 302 | border-radius: 10rpx; 303 | 304 | display: inline-block; 305 | } 306 | 307 | /*打卡圈子名称*/ 308 | .punchCardProjectName { 309 | height: 120rpx; 310 | width: 100%; 311 | line-height: 120rpx; 312 | text-align: center; 313 | color: white; 314 | } 315 | 316 | /* 所属打卡圈子打卡天数、排名*/ 317 | .punchCardDaysAndRand { 318 | height: 80rpx; 319 | width: 100%; 320 | line-height: 80rpx; 321 | text-align: center; 322 | color: white; 323 | font-size: 24rpx; 324 | 325 | } 326 | 327 | 328 | /* 间隔线 */ 329 | .interval_line { 330 | height: 20rpx; 331 | width: 100%; 332 | background-color: whitesmoke; 333 | } 334 | 335 | /*打卡日记列表为空时的提示信息展示*/ 336 | .empty-diary-list-notice { 337 | width: 100%; 338 | height: auto; 339 | display: flex; 340 | flex-direction: column; 341 | justify-content: center; 342 | align-items: center; 343 | 344 | font-size: 28rpx; 345 | } 346 | .empty-diary-list-notice > image { 347 | margin: 50rpx 0 20rpx 0; 348 | width: 240rpx; 349 | height: 240rpx; 350 | } 351 | 352 | 353 | /*打卡日记列表展示*/ 354 | .user-punch-card-diary-list-info { 355 | width: 100%; 356 | height: auto; 357 | } 358 | 359 | .title { 360 | width: auto; 361 | height: 100rpx; 362 | line-height: 100rpx; 363 | margin: 0 20rpx; 364 | 365 | font-size: 34rpx; 366 | color: black; 367 | font-weight: bolder; 368 | } 369 | 370 | 371 | /* 底部*/ 372 | .bottom { 373 | width: 100%; 374 | height: 60rpx; 375 | line-height: 60rpx; 376 | margin-bottom: 30rpx; 377 | padding-top: 20rpx; 378 | text-align: center; 379 | 380 | color: #8a8a8a; 381 | font-size: 30rpx; 382 | } 383 | -------------------------------------------------------------------------------- /pages/mine/personalHomePage/setting.js: -------------------------------------------------------------------------------- 1 | // pages/mine/detailPage/userInfoSetting.js 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | 9 | }, 10 | 11 | /** 12 | * 生命周期函数--监听页面加载 13 | */ 14 | onLoad: function (options) { 15 | 16 | }, 17 | 18 | /** 19 | * 生命周期函数--监听页面初次渲染完成 20 | */ 21 | onReady: function () { 22 | 23 | }, 24 | 25 | /** 26 | * 生命周期函数--监听页面显示 27 | */ 28 | onShow: function () { 29 | 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面隐藏 34 | */ 35 | onHide: function () { 36 | 37 | }, 38 | 39 | /** 40 | * 生命周期函数--监听页面卸载 41 | */ 42 | onUnload: function () { 43 | 44 | }, 45 | 46 | /** 47 | * 页面相关事件处理函数--监听用户下拉动作 48 | */ 49 | onPullDownRefresh: function () { 50 | 51 | }, 52 | 53 | /** 54 | * 页面上拉触底事件的处理函数 55 | */ 56 | onReachBottom: function () { 57 | 58 | }, 59 | 60 | /** 61 | * 用户点击右上角分享 62 | */ 63 | onShareAppMessage: function () { 64 | 65 | } 66 | }) -------------------------------------------------------------------------------- /pages/mine/personalHomePage/setting.json: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /pages/mine/personalHomePage/setting.wxml: -------------------------------------------------------------------------------- 1 | 2 | pages/mine/detailPage/userInfoSetting.wxml 3 | -------------------------------------------------------------------------------- /pages/mine/personalHomePage/setting.wxss: -------------------------------------------------------------------------------- 1 | /* pages/mine/detailPage/userInfoSetting.wxss */ -------------------------------------------------------------------------------- /pages/news/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | 3 | Page({ 4 | 5 | /** 6 | * 页面的初始数据 7 | */ 8 | data: { 9 | userInfo: '', 10 | // 服务器图片访问BaseURL 11 | imgRootPath: app.globalData.imgBaseSeverUrl, 12 | windowWidth: app.globalData.windowWidth, 13 | unreadLikeNewsNum: 0, // 未读的被点赞消息数 14 | unreadCommentNewsNum: 0, // 未读的被评论消息数 15 | 16 | showLoading: true, // 页面加载数据时显示加载动画并显示空白页 17 | }, 18 | 19 | /** 20 | * 生命周期函数--监听页面加载 21 | */ 22 | onLoad: function (options) { 23 | console.log(options); 24 | let that = this; 25 | wx.hideShareMenu(); 26 | that.data.userInfo = app.globalData.userInfo; 27 | 28 | }, 29 | 30 | /** 31 | * 生命周期函数--监听页面初次渲染完成 32 | */ 33 | onReady: function () { 34 | wx.setNavigationBarTitle({ 35 | title: '消息' 36 | }) 37 | }, 38 | 39 | /** 40 | * 生命周期函数--监听页面显示 41 | */ 42 | onShow: function () { 43 | let that = this; 44 | // 获取我的未读消息 45 | that.getUnreadNewsNum(); 46 | }, 47 | 48 | /** 49 | * 生命周期函数--监听页面隐藏 50 | */ 51 | onHide: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 生命周期函数--监听页面卸载 57 | */ 58 | onUnload: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 页面相关事件处理函数--监听用户下拉动作 64 | */ 65 | onPullDownRefresh: function () { 66 | let that = this; 67 | 68 | // 获取我的未读消息 69 | that.getUnreadNewsNum(); 70 | }, 71 | 72 | /** 73 | * 页面上拉触底事件的处理函数 74 | */ 75 | onReachBottom: function () { 76 | 77 | }, 78 | 79 | // 获取我的未读消息条数 80 | getUnreadNewsNum: function () { 81 | let that = this; 82 | wx.showLoading({ 83 | title: '消息获取中...' 84 | }); 85 | that.setData({ 86 | showLoading: true 87 | }); 88 | 89 | wx.request({ 90 | url: app.globalData.urlRootPath 91 | + 'index/UnreadNewsCount/getUnreadNewsNum', 92 | method: 'post', 93 | data: { 94 | user_id: that.data.userInfo.id 95 | }, 96 | success: function (res) { 97 | wx.hideLoading(); 98 | wx.stopPullDownRefresh(); 99 | let respData = res.data; 100 | if (res.statusCode === 200) { 101 | let unreadLikeNewsNum = parseInt(respData.data.unreadLikeNewsNum); 102 | let unreadCommentNewsNum = parseInt(respData.data.unreadCommentNewsNum); 103 | 104 | that.setData({ 105 | unreadLikeNewsNum: unreadLikeNewsNum, 106 | unreadCommentNewsNum: unreadCommentNewsNum, 107 | showLoading: false, 108 | }); 109 | 110 | if ((unreadLikeNewsNum + unreadCommentNewsNum) !== 0) { 111 | // 在小程序tab页右上角设置文本 即未读的消息数 112 | wx.setTabBarBadge({ 113 | index: 2, 114 | text: unreadCommentNewsNum + unreadLikeNewsNum + '' 115 | }); 116 | } else { 117 | wx.removeTabBarBadge({ 118 | index: 2 119 | }); 120 | } 121 | 122 | } else { 123 | that.setData({ 124 | showLoading: false, 125 | }); 126 | wx.showToast({ 127 | title: respData.errMsg, 128 | icon: 'none' 129 | }); 130 | } 131 | }, 132 | fail: function () { 133 | wx.hideLoading(); 134 | wx.stopPullDownRefresh(); 135 | wx.showToast({ 136 | title: '网络异常,无法获取未读消息', 137 | icon: 'none', 138 | duration: 1000 139 | }) 140 | } 141 | }); 142 | }, 143 | 144 | // 当点击进入被点赞、被评论的消息列表时,设置该用户未读的被点赞、被评论 145 | // 消息数为0 146 | setNewsReadStatus: function(unreadNewsType) { 147 | let that = this; 148 | wx.request({ 149 | url: app.globalData.urlRootPath 150 | + 'index/UnreadNewsCount/setNewsReadStatus', 151 | method: 'post', 152 | data: { 153 | user_id: that.data.userInfo.id, 154 | unread_news_type: unreadNewsType 155 | }, 156 | success: function (res) { 157 | if (res.statusCode === 200) { 158 | let unreadLikeNewsNum = that.data.unreadLikeNewsNum; 159 | let unreadCommentNewsNum = that.data.unreadCommentNewsNum; 160 | 161 | if (unreadNewsType === 'likeNews') 162 | unreadLikeNewsNum = 0; 163 | if (unreadNewsType === 'commentNews') 164 | unreadCommentNewsNum = 0; 165 | 166 | 167 | that.setData({ 168 | unreadLikeNewsNum: unreadLikeNewsNum, 169 | unreadCommentNewsNum: unreadCommentNewsNum 170 | }); 171 | console.log(unreadLikeNewsNum + unreadCommentNewsNum); 172 | console.log((unreadLikeNewsNum + unreadCommentNewsNum) !== 0); 173 | 174 | 175 | if ((unreadLikeNewsNum + unreadCommentNewsNum) !== 0) { 176 | // 在小程序tab页右上角设置文本 即未读的消息数 177 | wx.setTabBarBadge({ 178 | index: 2, 179 | text: unreadCommentNewsNum + unreadLikeNewsNum + '' 180 | }); 181 | } 182 | 183 | 184 | } else { 185 | wx.showToast({ 186 | title: respData.errMsg, 187 | icon: 'none' 188 | }); 189 | } 190 | }, 191 | fail: function () { 192 | wx.showToast({ 193 | title: '网络异常,无法设置消息已读', 194 | icon: 'none', 195 | duration: 1000 196 | }) 197 | } 198 | }) 199 | }, 200 | 201 | // 点击评论消息进入 消息详情页展示所有的评论消息列表 202 | intoCommentNewsListsPage: function () { 203 | let that = this; 204 | 205 | // 设置被评论的消息已读 206 | that.setNewsReadStatus('commentNews'); 207 | 208 | wx.navigateTo({ 209 | url: '/pages/newsDetailPage/index' 210 | + '?pageTitle=' + '日记评论' 211 | + '&newsType=' + 'commentNews' 212 | }); 213 | }, 214 | 215 | // 点击点赞消息进入 消息详情页展示所有的点赞消息列表 216 | intoLikeNewsListsPage: function () { 217 | let that = this; 218 | 219 | // 设置被评论的消息已读 220 | that.setNewsReadStatus('likeNews'); 221 | 222 | wx.navigateTo({ 223 | url: '/pages/newsDetailPage/index' 224 | + '?pageTitle=' + '日记评论' 225 | + '&newsType=' + 'likeNews' 226 | }); 227 | } 228 | }); -------------------------------------------------------------------------------- /pages/news/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "消息", 3 | "enablePullDownRefresh": true 4 | } -------------------------------------------------------------------------------- /pages/news/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 日记评论 14 | 15 | 16 | {{unreadCommentNewsNum}} 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /pages/news/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | } 5 | .comment-news, .like-news{ 6 | width: auto; 7 | height: 140rpx; 8 | display: flex; 9 | flex-direction: row; 10 | justify-content: flex-start; 11 | align-items: center; 12 | } 13 | .comment-news-icon, .like-news-icon{ 14 | width: 140rpx; 15 | height: 140rpx; 16 | display: flex; 17 | flex-direction: row; 18 | justify-content: center; 19 | align-items: center; 20 | } 21 | .comment-news-icon > image, .like-news-icon > image { 22 | width: 90rpx; 23 | height: 90rpx; 24 | } 25 | 26 | .comment-news-title-area, .like-news-title-area { 27 | width: 100%; 28 | height: 140rpx; 29 | display: flex; 30 | flex-direction: row; 31 | align-items: center; 32 | justify-content: space-between; 33 | color: black; 34 | font-size: 30rpx; 35 | } 36 | .into-comment-lists-page-icon, .into-like-lists-page-icon{ 37 | width: 100rpx; 38 | height: 100rpx; 39 | display: flex; 40 | flex-direction: row; 41 | align-items: center; 42 | justify-content: center; 43 | } 44 | .unread-news-notice { 45 | width: 30rpx; 46 | height: 30rpx; 47 | background-color: red; 48 | border-radius: 50%; 49 | font-size: 22rpx; 50 | line-height: 22rpx; 51 | text-align: center; 52 | color: white; 53 | } 54 | .into-comment-lists-page-icon > image, .into-like-lists-page-icon > image{ 55 | height: 64rpx; 56 | width: 64rpx; 57 | } 58 | 59 | .item-separator { 60 | width: 100%; 61 | height: 2rpx; 62 | background-color: #e5e5e5; 63 | margin-left: 70px; 64 | } 65 | -------------------------------------------------------------------------------- /pages/newsDetailPage/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | userInfo: '', 9 | 10 | windowWidth: app.globalData.windowWidth, 11 | pageTitle: '', // 页面标题栏标题 12 | newsType: '', // 消息类型 日记点赞消息likeNews 日记评论消息 commentNews 13 | 14 | showDataLoading: true, // 控制显示页面加载数据时的加载动画以及显示空白页面 15 | emptyNewsList: false, // 没有被点赞或者被评论的消息时,显示空内容提示 16 | emptyContentNotice: '暂无数据', 17 | 18 | myLikedList: [ 19 | // 属性说明 20 | // { 21 | // "id": 113, // 点赞记录id 22 | // "diary_id": 45, // 对应的日记记录id 23 | // "liked_user_id": 1, // 被点赞者用户id 也就是当前用户id 24 | // "create_time": "2019-05-11 14:52:45", // 点赞时间 25 | // "admirer": { // 点赞者信息 26 | // "id": 9, // 点赞者用户id 27 | // "avatar_url": "", // 点赞者用户头像 28 | // "nick_name": "李圣英" // 点赞者昵称 29 | // } 30 | // }, 31 | ], 32 | 33 | myCommentedList:[ 34 | // 属性说明 35 | // { 36 | // "id": 55, // 评论id 37 | // "diary_id": 45, // 所属日记id 38 | // "respondent_id": 1, // 被评论者用户id 也是当前用户id 39 | // "text_comment": "检测他人评论自己是否发送未读评论消息2", // 评论内容 40 | // "create_time": "2019-05-11 14:55:39", // 评论时间 41 | // "reviewer": { // 评论者信息 42 | // "id": 9, // 用户id 43 | // "avatar_url": "",// 用户头像地址 44 | // "nick_name": "李圣英" // 昵称 45 | // } 46 | // } 47 | ], 48 | }, 49 | 50 | /** 51 | * 生命周期函数--监听页面加载 52 | */ 53 | onLoad: function (options) { 54 | console.log(options); 55 | let that = this; 56 | that.data.userInfo = app.globalData.userInfo; 57 | let pageTitle = options.pageTitle; 58 | 59 | that.data.newsType = options.newsType; 60 | 61 | 62 | if (that.data.newsType === 'likeNews') 63 | that.data.emptyContentNotice = "暂无日记被点赞消息"; 64 | 65 | if (that.data.newsType === 'commentNews') 66 | that.data.emptyContentNotice = "暂无日记被评论消息"; 67 | 68 | that.setData({ 69 | userInfo: that.data.userInfo, 70 | emptyContentNotice: that.data.emptyContentNotice, 71 | newsType: that.data.newsType 72 | }); 73 | 74 | wx.setNavigationBarTitle({ 75 | title: pageTitle 76 | }); 77 | }, 78 | 79 | 80 | 81 | /** 82 | * 生命周期函数--监听页面显示 83 | */ 84 | onShow: function () { 85 | let that = this; 86 | that.setData({ 87 | showDataLoading: true, 88 | emptyNewsList: false, 89 | myLikedList: [], 90 | myCommentList:[] 91 | }); 92 | // 根据newsType=likeNews||commentNews 93 | // 来获取当前用户所有日记被点赞||评论的数据列表 94 | console.log(that.data.newsType === 'likeNews'); 95 | console.log(that.data.newsType); 96 | 97 | if (that.data.newsType === 'likeNews') 98 | that.getMyLikedList(); 99 | else 100 | that.getMyCommentedList(); 101 | }, 102 | 103 | 104 | //获取当前用户所有打卡日记被点赞的记录消息 105 | getMyLikedList: function () { 106 | let that = this; 107 | wx.request({ 108 | url: app.globalData.urlRootPath 109 | + 'index/DiaryLike/getMyLikedList', 110 | method: 'post', 111 | data: { 112 | user_id: that.data.userInfo.id, 113 | }, 114 | success: function (res) { 115 | let respData = res.data; 116 | switch (res.statusCode) { 117 | case 200: 118 | that.data.myLikedList = respData.data; 119 | that.setData({ 120 | showDataLoading: false, 121 | emptyNewsList: false, 122 | myLikedList: that.data.myLikedList 123 | }); 124 | console.log(that.data.myLikedList); 125 | break; 126 | case 400: 127 | that.setData({ 128 | showDataLoading: false, 129 | emptyNewsList: true, 130 | }); 131 | break; 132 | default: 133 | wx.showToast({ 134 | title: respData.errMsg, 135 | icon: 'none' 136 | }); 137 | setTimeout(function () { 138 | wx.navigateBack({ 139 | delta: 1 140 | }); 141 | },1000); 142 | break 143 | } 144 | 145 | }, 146 | fail: function () { 147 | wx.showToast({ 148 | title: '网络异常,无法设置消息已读', 149 | icon: 'none', 150 | duration: 1000 151 | }) 152 | } 153 | }); 154 | }, 155 | 156 | //获取当前用户所有打卡日记被评论的记录消息 157 | getMyCommentedList: function () { 158 | let that = this; 159 | wx.request({ 160 | url: app.globalData.urlRootPath 161 | + 'index/DiaryComment/getMyCommentedList', 162 | method: 'post', 163 | data: { 164 | user_id: that.data.userInfo.id, 165 | }, 166 | success: function (res) { 167 | let respData = res.data; 168 | switch (res.statusCode) { 169 | case 200: 170 | that.data.myCommentedList = respData.data; 171 | that.setData({ 172 | showDataLoading: false, 173 | emptyNewsList: false, 174 | myCommentedList: that.data.myCommentedList 175 | }); 176 | console.log(that.data.myCommentedList); 177 | break; 178 | case 400: 179 | that.setData({ 180 | showDataLoading: false, 181 | emptyNewsList: true, 182 | }); 183 | break; 184 | default: 185 | wx.showToast({ 186 | title: respData.errMsg, 187 | icon: 'none' 188 | }); 189 | setTimeout(function () { 190 | wx.navigateBack({ 191 | delta: 1 192 | }); 193 | },1000); 194 | break 195 | } 196 | 197 | }, 198 | fail: function () { 199 | wx.showToast({ 200 | title: '网络异常,无法设置消息已读', 201 | icon: 'none', 202 | duration: 1000 203 | }) 204 | } 205 | }) 206 | }, 207 | 208 | // 点击头像进入指定用户的个人主页 209 | intoPersonalHomePage: function(e) { 210 | console.log(e); 211 | 212 | // 传递被访问者的用户id, 在个人主页根据此id查询被访问者的个人信息 213 | let visitedUserId = e.currentTarget.dataset.userId; 214 | 215 | wx.navigateTo({ 216 | url: '/pages/mine/personalHomePage/index' 217 | + '?visitedUserId=' + visitedUserId 218 | }) 219 | }, 220 | 221 | // 进入指定的打卡日记详情页 222 | intoDiaryDetailPage:function (e) { 223 | console.log(e); 224 | let diaryId = e.currentTarget.dataset.diaryId; 225 | wx.navigateTo({ 226 | url: '/pages/diaryDetailPage/index' 227 | + '?diaryId=' + diaryId 228 | }); 229 | }, 230 | 231 | 232 | 233 | 234 | 235 | }); -------------------------------------------------------------------------------- /pages/newsDetailPage/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "enablePullDownRefresh": false, 3 | "usingComponents": {} 4 | } -------------------------------------------------------------------------------- /pages/newsDetailPage/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 正在加载 7 | 8 | 9 | 10 | 11 | {{emptyContentNotice}} 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 22 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 53 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 74 | {{item.text_comment}} 75 | {{item.create_time}} 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /pages/newsDetailPage/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | background-color: white; 5 | } 6 | 7 | .empty-content-notice { 8 | width: 100%; 9 | height: 100%; 10 | 11 | display: flex; 12 | flex-direction: row; 13 | justify-content: center; 14 | align-items: center; 15 | font-size: 32rpx; 16 | color: black; 17 | } 18 | 19 | 20 | 21 | .container { 22 | width: 100%; 23 | height: 100%; 24 | } 25 | .liked-news-list-item{ 26 | width: auto; 27 | height: 140rpx; 28 | display: flex; 29 | flex-direction: row; 30 | justify-content: flex-start; 31 | align-items: center; 32 | } 33 | .admirer-avatar { 34 | width: 140rpx; 35 | height: 140rpx; 36 | display: flex; 37 | flex-direction: row; 38 | justify-content: center; 39 | align-items: center; 40 | } 41 | .admirer-avatar > image { 42 | width: 90rpx; 43 | height: 90rpx; 44 | border-radius: 50%; 45 | } 46 | 47 | .like-info-area { 48 | width: 100%; 49 | height: 140rpx; 50 | display: flex; 51 | flex-direction: row; 52 | align-items: center; 53 | justify-content: space-between; 54 | color: #F0B27A; 55 | font-size: 32rpx; 56 | } 57 | .like-info { 58 | display: flex; 59 | flex-direction: column; 60 | align-items: flex-start; 61 | justify-content: flex-start; 62 | } 63 | .like-create_time { 64 | font-size: 24rpx; 65 | color: black; 66 | } 67 | 68 | .into-diary-detail-page-btn { 69 | width: 100rpx; 70 | height: 100rpx; 71 | display: flex; 72 | flex-direction: row; 73 | align-items: center; 74 | justify-content: center; 75 | } 76 | 77 | .into-diary-detail-page-btn > image { 78 | height: 64rpx; 79 | width: 64rpx; 80 | } 81 | 82 | .item-separator { 83 | width: 100%; 84 | height: 2rpx; 85 | background-color: #e5e5e5; 86 | margin-left: 140rpx; 87 | } 88 | 89 | /*---------------------------------------------------------------*/ 90 | .commented-news-list-item{ 91 | width: auto; 92 | height: auto; 93 | display: flex; 94 | flex-direction: row; 95 | justify-content: flex-start; 96 | align-items: flex-start; 97 | padding-top: 30rpx; 98 | } 99 | .reviewer-avatar { 100 | width: 140rpx; 101 | height: auto; 102 | display: flex; 103 | flex-direction: row; 104 | justify-content: center; 105 | align-items: center; 106 | } 107 | .reviewer-avatar > image { 108 | width: 90rpx; 109 | height: 90rpx; 110 | border-radius: 50%; 111 | } 112 | 113 | .comment-info-area { 114 | width: 100%; 115 | height: auto; 116 | display: flex; 117 | flex-direction: row; 118 | align-items: center; 119 | justify-content: space-between; 120 | color: black; 121 | font-size: 32rpx; 122 | } 123 | .comment-info { 124 | display: flex; 125 | flex-direction: column; 126 | align-items: flex-start; 127 | justify-content: flex-start; 128 | } 129 | .comment-user-info { 130 | display: flex; 131 | flex-direction: row; 132 | align-items: center; 133 | justify-content: flex-start; 134 | } 135 | .respondent-nick-name, .reviewer-nick-name { 136 | color: #F0B27A; 137 | } 138 | .comment-text { 139 | color: black; 140 | font-size: 14px; 141 | } 142 | .comment-create_time { 143 | font-size: 24rpx; 144 | color: #C9C9C9; 145 | margin-bottom: 20rpx; 146 | } 147 | 148 | .comment-news-into-diary-detail-page-btn { 149 | width: 100rpx; 150 | height: auto; 151 | display: flex; 152 | flex-direction: row; 153 | align-items: center; 154 | justify-content: center; 155 | } 156 | 157 | .comment-news-into-diary-detail-page-btn > image { 158 | height: 64rpx; 159 | width: 64rpx; 160 | } 161 | 162 | -------------------------------------------------------------------------------- /pages/position/index.js: -------------------------------------------------------------------------------- 1 | let QQMapWX = require('../../lib/qqmap-wx-jssdk.js'); 2 | let QQMapSDK; 3 | Page({ 4 | data: {}, 5 | onLoad: function () { 6 | // 实例化API核心类 7 | QQMapSDK = new QQMapWX({ 8 | key: 'TLMBZ-XG43U-R7IVE-2BCJY-VA4M7-KQFMJ' 9 | }); 10 | 11 | let that = this; 12 | that.moveToLocation(); 13 | }, 14 | 15 | //移动选点 16 | moveToLocation: function () { 17 | 18 | // 打开地图选择当前选择的地理位置 获取相关的信息:地理位置名称 & 经度 & 纬度 19 | wx.chooseLocation({ 20 | success: function (res) { 21 | console.log(res); 22 | 23 | // 为上一个页面栈设置用户选择的地理位置信息 24 | let pages = getCurrentPages(); 25 | pages[pages.length - 2].setData({ 26 | address: res.name, 27 | latitude: res.latitude, 28 | longitude: res.longitude 29 | }); 30 | 31 | //选择地点之后返回到原来页面 32 | wx.navigateBack({ 33 | delta: 1 34 | }); 35 | }, 36 | fail: function (err) { 37 | console.log(err) 38 | } 39 | }); 40 | } 41 | }); -------------------------------------------------------------------------------- /pages/position/index.json: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /pages/position/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /pages/position/index.wxss: -------------------------------------------------------------------------------- 1 | /* pages/position/index.wxss */ -------------------------------------------------------------------------------- /pages/projectBackStageManage/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | projectId: 0, 9 | projectName: '', 10 | showUpdateProjectNameModel: false, // 控制显示、隐藏修改圈子名称的自定义模态框 11 | newProjectNameCheckFlag: false, // 修改后的圈子名是否合法标志 12 | dataUpdateTime: '', 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | console.log(options); 20 | let that = this; 21 | let date = new Date(); 22 | console.log(date.getFullYear()); 23 | that.setData({ 24 | projectId: options.projectId, 25 | projectName: options.projectName, 26 | 27 | // 圈子的统计皆为昨天的数据 28 | dataUpdateTime: date.getFullYear() + '-' 29 | + (date.getMonth() + 1) + '-' 30 | + (date.getDate() - 1) 31 | }); 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面初次渲染完成 36 | */ 37 | onReady: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面显示 43 | */ 44 | onShow: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 生命周期函数--监听页面隐藏 50 | */ 51 | onHide: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 生命周期函数--监听页面卸载 57 | */ 58 | onUnload: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 页面相关事件处理函数--监听用户下拉动作 64 | */ 65 | onPullDownRefresh: function () { 66 | 67 | }, 68 | 69 | /** 70 | * 页面上拉触底事件的处理函数 71 | */ 72 | onReachBottom: function () { 73 | 74 | }, 75 | 76 | // 阻止模态框之外的页面点击事件 77 | preventTab: function () { 78 | 79 | }, 80 | 81 | // 弹出框蒙层截断touchmove事件 82 | preventTouchMove: function() { 83 | 84 | }, 85 | 86 | // 显示修改圈子名称的自定义模态框 87 | showUpdateProjectNameModal: function() { 88 | let that = this; 89 | that.setData({ 90 | showUpdateProjectNameModel: true 91 | }) 92 | }, 93 | 94 | // 输入框失去焦点时检测输入的圈子名称正确性 95 | checkInputProjectName: function(e) { 96 | let that = this; 97 | 98 | // 检测是否为十五个汉字以内的字符 99 | let reg = /^[\u4e00-\u9fa5]{1,15}$/; 100 | if(reg.test(e.detail.value)){ 101 | that.setData({ 102 | newProjectName: e.detail.value, 103 | newProjectNameCheckFlag: true 104 | }) 105 | 106 | } else { 107 | let title = "圈子名称格式错误!"; 108 | if (e.detail.value.length > 15) 109 | title = "圈子名称限制十五字符!"; 110 | 111 | if (e.detail.value.length === 0) 112 | title = "请填写圈子名称"; 113 | 114 | that.data.newProjectNameCheckFlag = false; 115 | 116 | wx.showToast({ 117 | title: title, 118 | icon: "none" 119 | }) 120 | } 121 | }, 122 | 123 | // 取消修改圈子名称,隐藏模态框 124 | onCancel: function () { 125 | let that = this; 126 | that.setData({ 127 | newProjectNameCheckFlag: false, 128 | showUpdateProjectNameModel: false 129 | }) 130 | }, 131 | 132 | // 确认修改 133 | onConfirm: function () { 134 | let that = this; 135 | if (that.data.newProjectNameCheckFlag === false) { 136 | wx.showToast({ 137 | title: '新圈子名称格式错误!', 138 | icon: "none" 139 | }); 140 | return false; 141 | } 142 | 143 | wx.showLoading({ 144 | title: '处理中...' 145 | }); 146 | 147 | // 新圈子名合法则提交服务器 148 | wx.request({ 149 | 'url': app.globalData.urlRootPath + 'index/PunchCardProject/updateName', 150 | data: { 151 | 'project_id': that.data.projectId, 152 | 'project_name': that.data.newProjectName 153 | }, 154 | success: function (response) { 155 | wx.hideLoading(); 156 | console.log(response); 157 | 158 | switch (response.statusCode) { 159 | case 200: 160 | // 服务器修改成功后客户端再重新渲染圈子名称 161 | that.setData({ 162 | newProjectNameCheckFlag: false, 163 | projectName: that.data.newProjectName, 164 | showUpdateProjectNameModel: false 165 | }); 166 | break; 167 | 168 | default: 169 | wx.showToast({ 170 | title: response.data.errMsg, 171 | icon: "none" 172 | }); 173 | break; 174 | } 175 | }, 176 | fail: function () { 177 | wx.showToast({ 178 | title: '网络异常...' 179 | }); 180 | } 181 | }); 182 | }, 183 | 184 | // 进入统计数据详情页 185 | intoDataStatisticsDetailPage: function() { 186 | wx.showToast({ 187 | title: 'todo' 188 | }) 189 | }, 190 | 191 | // 进入圈子竞争力排名详情页 192 | intoProjectCompeteRankDetailPage: function() { 193 | wx.showToast({ 194 | title: 'todo' 195 | }) 196 | }, 197 | 198 | // 进入创建打卡契约详情页 199 | intoCreatePunchCardConventionPage: function() { 200 | wx.showToast({ 201 | title: 'todo' 202 | }) 203 | }, 204 | 205 | // 打卡契约详情页简介信息 206 | conventionHelp: function() { 207 | wx.showToast({ 208 | title: '打卡契约说明todo' 209 | }) 210 | }, 211 | 212 | problemFeedback: function () { 213 | wx.showToast({ 214 | title: 'TODO', 215 | icon: 'none' 216 | }) 217 | }, 218 | 219 | }); -------------------------------------------------------------------------------- /pages/projectBackStageManage/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "管理后台", 3 | "navigationBarBackgroundColor": "#E3F2FD", 4 | "navigationBarTextStyle": "black", 5 | "backgroundTextStyle": "light", 6 | "enablePullDownRefresh": true 7 | } -------------------------------------------------------------------------------- /pages/projectBackStageManage/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {{projectName}} 7 | 9 | 10 | 11 | 12 | 13 | 16 | 17 | 18 | 19 | 填写圈子名称 20 | 21 | 22 | 30 | 31 | 32 | 33 | 取消 35 | 36 | 确定 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 圈子编号: {{projectId}} 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 昨日数据报告 55 | 数据更新至{{dataUpdateTime}} 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 0 65 | 访问 (人) 66 | 67 | 68 | 69 | 70 | 0 71 | 已打卡 (人) 72 | 73 | 74 | 75 | 76 | 0 77 | 点赞 (人) 78 | 79 | 80 | 81 | 82 | 0 83 | 评论 (人) 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 竞争力排名 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 打卡契约 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 基础设置 126 | 127 | 128 | 129 | 130 | 131 | 编辑圈子详情 132 | 133 | 134 | 135 | 136 | 137 | 成员管理 138 | 139 | 140 | 141 | 142 | 143 | 圈主营销工具 144 | 145 | 146 | 147 | 148 | 149 | 圈主学院 150 | 151 | 152 | 153 | 154 | 155 | 电脑版后台 156 | 157 | 158 | 159 | 问题反馈 160 | 161 | -------------------------------------------------------------------------------- /pages/projectBackStageManage/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | height: 100%; 4 | background-color: whitesmoke; 5 | } 6 | 7 | .container-header { 8 | width: 100%; 9 | height: auto; 10 | padding: 20rpx 0; 11 | background-color: white; 12 | } 13 | 14 | /*圈子名称*/ 15 | .project-name { 16 | width: auto; 17 | height: auto; 18 | margin: 0 30rpx; 19 | 20 | display: flex; 21 | flex-direction: row; 22 | justify-content: flex-start; 23 | align-items: center; 24 | } 25 | .project-name image { 26 | width: 32rpx; 27 | height: 32rpx; 28 | margin-left: 10rpx; 29 | } 30 | .project-name > text { 31 | font-size: 34rpx; 32 | font-weight: bolder; 33 | color: black; 34 | } 35 | 36 | /*自定义的修改圈子名称模态框*/ 37 | /*弹出层蒙层*/ 38 | .modal-mask { 39 | width: 100%; 40 | height: 100%; 41 | position: fixed; 42 | top: 0; 43 | left: 0; 44 | background: #000; 45 | opacity: 0.5; 46 | overflow: hidden; 47 | z-index: 9000; 48 | color: #fff; 49 | } 50 | 51 | /*模态对话框*/ 52 | .modal-dialog { 53 | width: 80%; 54 | overflow: hidden; 55 | position: fixed; 56 | top: 50%; 57 | left: 0; 58 | z-index: 9999; 59 | background: #f9f9f9; 60 | margin: -200rpx 10%; 61 | border-radius: 20rpx; 62 | } 63 | /*对话框标题*/ 64 | .modal-title { 65 | padding-top: 40rpx; 66 | font-size: 36rpx; 67 | font-weight: bolder; 68 | color: black; 69 | text-align: center; 70 | } 71 | /*对话框内容*/ 72 | .modal-content { 73 | padding: 30rpx 30rpx; 74 | } 75 | 76 | /*对话框内容:添加自定义标签输入框*/ 77 | .modal-input { 78 | display: flex; 79 | background: #fff; 80 | border: 2rpx solid whitesmoke; 81 | border-radius: 10rpx; 82 | font-size: 28rpx; 83 | } 84 | 85 | /*输入框*/ 86 | .input { 87 | width: 100%; 88 | height: 80rpx; 89 | font-size: 28rpx; 90 | line-height: 80rpx; 91 | padding: 0 10rpx; 92 | box-sizing: border-box; 93 | color: black; 94 | } 95 | /*输入框placeholder样式*/ 96 | .input-holder { 97 | color: #666; 98 | font-size: 28rpx; 99 | } 100 | 101 | /*对话框按钮*/ 102 | .modal-footer { 103 | display: flex; 104 | flex-direction: row; 105 | height: 100rpx; 106 | border-top: 2rpx solid #dedede; 107 | font-size: 34rpx; 108 | line-height: 100rpx; 109 | } 110 | /*取消按钮*/ 111 | .btn-cancel { 112 | width: 50%; 113 | color: #666; 114 | text-align: center; 115 | border-right: 2rpx solid #dedede; 116 | } 117 | /*确认按钮*/ 118 | .btn-confirm { 119 | width: 50%; 120 | color: #F0B27A; 121 | text-align: center; 122 | } 123 | 124 | /*圈子编号*/ 125 | .project-id { 126 | width: auto; 127 | height: auto; 128 | margin: 0 30rpx; 129 | font-size: 26rpx; 130 | color: #C9C9C9; 131 | } 132 | 133 | /*昨日圈子数据统计面板:访问人数 & 已打卡人数 & 点赞条数 & 评论数*/ 134 | .project-data-statistics-panel { 135 | width: 100%; 136 | height: auto; 137 | background-color: white; 138 | } 139 | /*统计面板标题 & 统计时间*/ 140 | .panel-title { 141 | width: auto; 142 | height: 100rpx; 143 | margin: 0 30rpx; 144 | 145 | display: flex; 146 | flex-direction: row; 147 | justify-content: space-between; 148 | align-items: center; 149 | 150 | font-size: 32rpx; 151 | color: black; 152 | 153 | border-bottom: 2rpx #E5E5E5 solid; 154 | } 155 | 156 | .data-update-time { 157 | font-size: 22rpx; 158 | color: #C9C9C9; 159 | } 160 | 161 | /*面板统计数据 & 统计数据详情页面进入提示图标*/ 162 | .data-statistics-content { 163 | width: auto; 164 | height: auto; 165 | margin: 0 30rpx; 166 | 167 | display: flex; 168 | flex-direction: row; 169 | justify-content: flex-start; 170 | align-items: center; 171 | 172 | padding: 30rpx 0 10rpx 0; 173 | } 174 | 175 | /*统计数据显示*/ 176 | .data-statistics-list { 177 | width: 94%; 178 | height: auto; 179 | display: flex; 180 | flex-direction: row; 181 | justify-content: flex-start; 182 | align-items: center; 183 | flex-wrap: wrap; 184 | } 185 | .data-statistics-item { 186 | width: 50%; 187 | height: 120rpx; 188 | display: flex; 189 | flex-direction: column; 190 | align-items: flex-start; 191 | justify-content: space-around; 192 | 193 | font-size: 28rpx; 194 | color: #C9C9C9; 195 | 196 | margin-bottom: 30rpx; 197 | } 198 | 199 | .data { 200 | font-size: 46rpx; 201 | font-weight: bolder; 202 | color: black; 203 | } 204 | 205 | /*统计数据详情页进入图标*/ 206 | .into-data-statistics-detail-page-icon { 207 | width: 6%; 208 | height: auto; 209 | display: flex; 210 | flex-direction: row; 211 | justify-content: flex-end; 212 | align-items: center; 213 | } 214 | .into-data-statistics-detail-page-icon > image { 215 | width: 60rpx; 216 | height: 60rpx; 217 | } 218 | 219 | /*圈子竞争力排名*/ 220 | .project-compete-rank { 221 | background-color: white; 222 | width: 100%; 223 | display: flex; 224 | flex-direction: row; 225 | justify-content: flex-start; 226 | align-items: center; 227 | } 228 | 229 | .project-compete-rank > view { 230 | width: 80%; 231 | height: 100rpx; 232 | margin-left: 30rpx; 233 | line-height: 100rpx; 234 | font-size: 32rpx; 235 | color: black; 236 | } 237 | .rank { 238 | color: red; 239 | font-size: 26rpx; 240 | } 241 | 242 | .project-compete-rank > image { 243 | width: 60rpx; 244 | height: 60rpx; 245 | } 246 | 247 | /*打卡契约*/ 248 | .punch-card-convention { 249 | background-color: white; 250 | width: auto; 251 | display: flex; 252 | padding: 0 30rpx; 253 | flex-direction: row; 254 | justify-content: flex-start; 255 | align-items: center; 256 | } 257 | 258 | .punch-card-convention-help { 259 | width: 40%; 260 | height: 100rpx; 261 | display: flex; 262 | flex-direction: row; 263 | justify-content: flex-start; 264 | align-items: center; 265 | font-size: 32rpx; 266 | color: black; 267 | } 268 | .punch-card-convention-help > image { 269 | width: 30rpx; 270 | height: 30rpx; 271 | margin-left: 10rpx; 272 | } 273 | 274 | .into-create-punch-card-convention-page { 275 | width:60%; 276 | height: 100rpx; 277 | display: flex; 278 | flex-direction: row; 279 | justify-content: flex-end; 280 | align-items: center; 281 | } 282 | .into-create-punch-card-convention-page > image { 283 | width: 60rpx; 284 | height: 60rpx; 285 | } 286 | 287 | 288 | 289 | /*管理功能列表*/ 290 | .back-stage-manage-function-list { 291 | width: 100%; 292 | height: 404rpx; 293 | display: flex; 294 | flex-direction: row; 295 | flex-wrap: wrap; 296 | justify-content: space-between; 297 | align-items: center; 298 | background-color: whitesmoke; 299 | } 300 | 301 | /*单项功能样式*/ 302 | .function-item { 303 | width: 33%; 304 | height: 200rpx; 305 | background-color: white; 306 | display: flex; 307 | flex-direction: column; 308 | justify-content: flex-start; 309 | align-items: center; 310 | 311 | font-size: 26rpx; 312 | color: black; 313 | 314 | } 315 | .function-item > image { 316 | margin: 40rpx 0 30rpx 0; 317 | width: 60rpx; 318 | height: 60rpx; 319 | } 320 | 321 | 322 | /*页脚问题反馈按钮*/ 323 | .container-footer { 324 | width: 100%; 325 | height: 60rpx; 326 | padding-bottom: 40rpx; 327 | line-height: 60rpx; 328 | font-size: 28rpx; 329 | color: cornflowerblue; 330 | text-align: center; 331 | background-color: whitesmoke; 332 | } 333 | -------------------------------------------------------------------------------- /pages/publishComment/index.js: -------------------------------------------------------------------------------- 1 | let app = getApp(); 2 | Page({ 3 | 4 | /** 5 | * 页面的初始数据 6 | */ 7 | data: { 8 | prePage: '', // 发表评论页面的上一个页面 9 | 10 | diaryId: 0, // 需要评论的日记记录id 11 | diaryIndex:0, // 需要评论的日记在总的日记数据集中的索引 12 | diaryList: [], // 当前圈子的打卡日记数据集 13 | 14 | textComment: '', // 用户输入的文本内容评论 15 | textCommentLength: 0, 16 | placeholder: '', // 文本评论内容的输入提示 17 | }, 18 | 19 | /** 20 | * 生命周期函数--监听页面加载 21 | */ 22 | onLoad: function (options) { 23 | console.log(options); 24 | let that = this; 25 | that.data.diaryId = options.diaryId; 26 | that.data.diaryIndex = options.diaryIndex; 27 | that.data.pid = options.pid; 28 | that.data.respondentId = options.respondentId; 29 | 30 | that.setData({ 31 | placeholder: options.placeholder 32 | }); 33 | 34 | // 获取发表页面的上一个页面 35 | let pages = getCurrentPages(); 36 | that.data.prePage = pages[pages.length - 2]; 37 | 38 | // 获取日记总数据集 39 | that.data.diaryList = that.data.prePage.data.punchCardDiaryList; 40 | 41 | console.log(that.data); 42 | }, 43 | 44 | onUnload: function() { 45 | // 返回圈子的打卡详情页时告知为由评论也返回, 46 | // 在打卡详情页的onShow中不要进行打卡日记的重新获取 47 | let that = this; 48 | that.data.prePage.setData({ 49 | commentPageReturn: true 50 | }); 51 | 52 | }, 53 | 54 | // 用户的文本类型评论内容的输入监听事件 55 | editTextComment: function(e) { 56 | let that = this; 57 | that.data.textComment = e.detail.value; 58 | that.setData({ 59 | textCommentLength: that.data.textComment.length 60 | }); 61 | }, 62 | 63 | // 取消评论 64 | cancelComment: function () { 65 | // 通知圈子的打卡详情页不进行获取新数据 66 | wx.navigateBack({ 67 | delta: 1 68 | }); 69 | }, 70 | 71 | // 发表评论 72 | publishComment: function () { 73 | let that = this; 74 | 75 | if (that.data.textCommentLength <= 0) { 76 | wx.showToast({ 77 | title: '评论内容不能为空!', 78 | icon: 'none', 79 | duration: 2000 80 | }); 81 | return false; 82 | } 83 | wx.request({ 84 | url: app.globalData.urlRootPath + 'index/DiaryComment/addComment', 85 | method: 'post', 86 | data: { 87 | diary_id: that.data.diaryId, 88 | pid: that.data.pid, 89 | reviewer_id: app.globalData.userInfo.id, // 评论者id 90 | text_comment: that.data.textComment, 91 | respondent_id: that.data.respondentId // 被评论者id 92 | }, 93 | success: function (res) { 94 | console.log(res); 95 | let respData = res.data; 96 | switch (res.statusCode) { 97 | case 200: 98 | // 将新的评论数据追加至本地日记数据集对应的评论列表中 99 | let newCommentInfo = respData.data; 100 | let commentInfo = that.data.diaryList[that.data.diaryIndex].allCommentInfo; 101 | commentInfo[commentInfo.length] = newCommentInfo; 102 | 103 | that.data.diaryList[that.data.diaryIndex].allCommentInfo = commentInfo; 104 | 105 | that.data.prePage.setData({ 106 | punchCardDiaryList: that.data.diaryList 107 | }); 108 | wx.showToast({ 109 | title: '评论成功' 110 | }); 111 | wx.navigateBack({ 112 | delta: 1 113 | }); 114 | console.log(respData); 115 | break; 116 | default: 117 | wx.showToast({ 118 | title: respData.errMsg, 119 | icon: 'none', 120 | duration: 2000 121 | }); 122 | break; 123 | } 124 | }, 125 | fail: function () { 126 | wx.showToast({ 127 | title: '网络异常', 128 | icon: 'none', 129 | duration: 2000 130 | }); 131 | } 132 | }) 133 | } 134 | 135 | 136 | }); -------------------------------------------------------------------------------- /pages/publishComment/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "发表评论", 3 | "navigationBarBackgroundColor": "#F0B27A", 4 | "navigationBarTextStyle": "white", 5 | "backgroundTextStyle": "light", 6 | "disableScroll": true 7 | } -------------------------------------------------------------------------------- /pages/publishComment/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 13 | 14 | 15 | 16 | 17 | 22 | 23 | {{textCommentLength}}/500 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 取消 38 | 发表评论 39 | 40 | 41 | -------------------------------------------------------------------------------- /pages/publishComment/index.wxss: -------------------------------------------------------------------------------- 1 | .container { 2 | overflow: hidden; 3 | } 4 | /*文本内容编辑区域*/ 5 | .text-comment-edit-area { 6 | width: auto; 7 | height: auto; 8 | margin: 20rpx 30rpx ; 9 | border: 2rpx #e5e5e5 solid; 10 | padding: 50rpx 20rpx 0 20rpx; 11 | } 12 | .text-comment-edit-area > textarea { 13 | width: 100%; 14 | min-height: 320rpx; 15 | max-height: 440rpx; 16 | height: auto; 17 | line-height: 1.4; 18 | font-size: 36rpx; 19 | color: black; 20 | } 21 | .text-comment-num-notice { 22 | font-size: 26rpx; 23 | color: #C9C9C9; 24 | text-align: right; 25 | } 26 | 27 | /*输入为空的提示信息样式*/ 28 | .edit-comment-notice { 29 | font-size: 34rpx; 30 | color: #8a8a8a; 31 | } 32 | 33 | /*音频评论添加按钮*/ 34 | .sound-comment-btn { 35 | width: 140rpx; 36 | height: 140rpx; 37 | margin-left: 30rpx; 38 | border: 2rpx #E5E5E5 solid; 39 | display: flex; 40 | flex-direction: row; 41 | justify-content: center; 42 | align-items: center; 43 | } 44 | 45 | .sound-comment-btn > image { 46 | width: 100rpx; 47 | height: 100rpx; 48 | } 49 | 50 | /*评论提交按钮*/ 51 | .comment-publish-btn { 52 | width: 100%; 53 | height: 100rpx; 54 | display: flex; 55 | flex-direction: row; 56 | justify-content: flex-start; 57 | align-items: center; 58 | background-color: #F0B27A; 59 | 60 | font-size: 34rpx; 61 | color: white; 62 | 63 | position: fixed; 64 | bottom: 0; 65 | } 66 | 67 | .cancel-btn { 68 | width: 35%; 69 | height: 100rpx; 70 | text-align: center; 71 | line-height: 100rpx; 72 | background-color: #BDBDBD; 73 | } 74 | 75 | 76 | .publish-btn { 77 | width: 65%; 78 | height: 100rpx; 79 | text-align: center; 80 | line-height: 100rpx; 81 | } 82 | 83 | -------------------------------------------------------------------------------- /pages/punchCardDetailPage/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "", 3 | "navigationBarTextStyle": "white", 4 | "backgroundTextStyle": "light", 5 | "enablePullDownRefresh": true, 6 | "usingComponents": { 7 | "punch-card-diary-audio-play": "/components/audioPlay/index" 8 | } 9 | } -------------------------------------------------------------------------------- /pages/punchCardDetailPage/publishPunchCardDiary/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "发表日记", 3 | "navigationBarBackgroundColor": "#ffffff", 4 | "navigationBarTextStyle": "black", 5 | "backgroundTextStyle": "light" 6 | } -------------------------------------------------------------------------------- /pages/punchCardDetailPage/publishPunchCardDiary/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 10 | 11 | {{textContentLength}}/500 12 | 13 | 14 | 15 | 16 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 录音音频 79 | 80 | 81 | {{audioPlayCurrTimeStr}} 82 | 83 | 84 | 85 | 87 | 88 | 89 | 90 | {{audioPlayEndTimeStr}} 91 | 92 | 93 | 94 | 95 | 96 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 111 | 112 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 所在位置 148 | 149 | 150 | 151 | 152 | 154 | 156 | 157 | {{address}} 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 167 | 168 | {{diaryType[index]}} 169 | 170 | 171 | 172 | 173 | 177 | 178 | 179 | -------------------------------------------------------------------------------- /project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "description": "项目配置文件", 3 | "packOptions": { 4 | "ignore": [] 5 | }, 6 | "setting": { 7 | "urlCheck": false, 8 | "es6": true, 9 | "enhance": true, 10 | "postcss": true, 11 | "minified": true, 12 | "newFeature": true, 13 | "nodeModules": true, 14 | "autoAudits": false, 15 | "uglifyFileName": true, 16 | "checkInvalidKey": true, 17 | "checkSiteMap": true, 18 | "uploadWithSourceMap": true, 19 | "babelSetting": { 20 | "ignore": [], 21 | "disablePlugins": [], 22 | "outputPath": "" 23 | } 24 | }, 25 | "compileType": "miniprogram", 26 | "libVersion": "2.7.2", 27 | "appid": "wx5948189d45b17788", 28 | "projectname": "SmallPunch_FrontEnd", 29 | "debugOptions": { 30 | "hidedInDevtools": [] 31 | }, 32 | "isGameTourist": false, 33 | "simulatorType": "wechat", 34 | "simulatorPluginLibVersion": {}, 35 | "condition": { 36 | "search": { 37 | "current": -1, 38 | "list": [] 39 | }, 40 | "conversation": { 41 | "current": -1, 42 | "list": [] 43 | }, 44 | "game": { 45 | "currentL": -1, 46 | "list": [] 47 | }, 48 | "miniprogram": { 49 | "current": -1, 50 | "list": [] 51 | } 52 | } 53 | } -------------------------------------------------------------------------------- /sitemap.json: -------------------------------------------------------------------------------- 1 | { 2 | "desc": "关于本文件的更多信息,请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html", 3 | "rules": [{ 4 | "action": "allow", 5 | "page": "*" 6 | }] 7 | } -------------------------------------------------------------------------------- /utils/common.js: -------------------------------------------------------------------------------- 1 | // 将时间(秒)转换成 '00:00'格式 2 | const formatSeconds = (s) => { 3 | let str = ""; 4 | if(s > 0){ 5 | const minutes = Math.floor(s / 60); 6 | const seconds = Math.floor(s - minutes * 60); 7 | let m_str = minutes < 10 ? "0" + minutes : minutes; 8 | let s_str = seconds < 10 ? "0" + seconds : seconds; 9 | str = m_str + ":" + s_str; 10 | } else { 11 | str = "00:00"; 12 | } 13 | return str; 14 | }; 15 | 16 | module.exports = { 17 | formatSeconds: formatSeconds 18 | }; --------------------------------------------------------------------------------