From 83ffbc0b4246f3f9d833bd6193b6d82a1f781ca7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E5=AD=A6=E6=96=87?= Date: Sat, 23 Nov 2019 22:21:10 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E7=99=BB=E5=BD=95?= =?UTF-8?q?=E5=8A=9F=E8=83=BD=E5=BC=80=E5=8F=91=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app.js | 9 +- config/config.js | 4 +- pages/circle/circle.js | 133 +++++++++++++++++-------- pages/circle/circle.wxml | 65 +++++++++++- pages/circle/circle.wxss | 207 ++++++++++++++++++++++++++++++++++++++- 5 files changed, 367 insertions(+), 51 deletions(-) diff --git a/app.js b/app.js index bd81042..877cc23 100644 --- a/app.js +++ b/app.js @@ -105,10 +105,13 @@ App({ // 请求服务端的登录接口 wx.request({ url: api.loginUrl, - + method: 'post', + header:{ + APP_ID: api.appInfo.appId + }, data: { code: loginRes.code, // 临时登录凭证 - userInfo: infoRes.rawData, // 用户非敏感信息 + userInfo: JSON.parse(infoRes.rawData), // 用户非敏感信息 signature: infoRes.signature, // 签名 encryptedData: infoRes.encryptedData, // 用户敏感信息 iv: infoRes.iv // 解密算法的向量 @@ -121,7 +124,7 @@ App({ if (res.result == 0) { that.globalData.userInfo = res.userInfo; wx.setStorageSync('userInfo', JSON.stringify(res.userInfo)); - wx.setStorageSync('loginFlag', res.skey); + wx.setStorageSync('loginFlag', res.sessionKey); callback(); } else { that.showInfo(res.errmsg); diff --git a/config/config.js b/config/config.js index 702cf6e..e9e6a21 100644 --- a/config/config.js +++ b/config/config.js @@ -1,5 +1,5 @@ // 服务器域名 -const baseUrl = 'https://api.demo.winqi.cn/'; +const baseUrl = 'http://hc.demo.winqi.cn:8012/'; // 获取书籍信息接口地址(可选择全部或单个书籍) const getBooksUrl = baseUrl + 'api/book/getBooks'; // 写评论接口 @@ -7,7 +7,7 @@ const commentUrl = baseUrl + 'api/comment/write'; // 查询当前用户是否已经购买该书籍并返回评论列表接口 const queryBookUrl = baseUrl + 'api/book/queryBook'; // 登录接口 -const loginUrl = baseUrl + 'login'; +const loginUrl = baseUrl + 'app/loginWx'; // 获取当前用户已购书籍接口 const getBoughtBooksUrl = baseUrl + 'api/user/getBoughtBooks'; // 兑换书籍接口 diff --git a/pages/circle/circle.js b/pages/circle/circle.js index 8a771cb..58b9a9a 100644 --- a/pages/circle/circle.js +++ b/pages/circle/circle.js @@ -1,66 +1,113 @@ -// pages/circle/circle.js -Page({ +// pages/CircleFriends/CircleFriends.js +var app = getApp() +var that +Page({ /** * 页面的初始数据 */ data: { + DataSource: [1, 1, 1, 1, 1], + icon: 'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3175633703,3855171020&fm=27&gp=0.jpg', + content: '我大学毕业到一家集团公司的办公室当文员。办公室主任有一特长，即文章写得好，很有思想，公司董事长很器重他，董事长的讲话稿和企业的年终总结等一系列重大文章都是出自他的手笔。', + resource: ['http://img2.imgtn.bdimg.com/it/u=2118739199,3378602431&fm=27&gp=0.jpg', + 'http://img0.imgtn.bdimg.com/it/u=2277942808,1417432970&fm=27&gp=0.jpg', + 'http://img5.imgtn.bdimg.com/it/u=1504812505,3480403568&fm=27&gp=0.jpg', + 'http://img4.imgtn.bdimg.com/it/u=3456219059,4251129897&fm=27&gp=0.jpg', + 'http://img3.imgtn.bdimg.com/it/u=3912316188,1981132393&fm=27&gp=0.jpg' + ], + zanSource: ['张三', '李四', '王五', '找钱', '孙俪', '王宝'], + contnet: [{ + 'firstname': '张三', + 'content': '你好漂亮呀！！' + }, + { + 'firstname': '李四', + 'content': '纳尼！！' + }, + { + 'firstname': '王五', + 'content': '鬼扯咧' + }, + { + 'firstname': '王宝', + 'content': '昨晚11点左右，一则郑爽胡彦斌疑似复合的消息刷爆各大论坛，微博在深夜11点热度高达200万直接爆掉，中国意难忘又开始了！！！' + } + ], + photoWidth: wx.getSystemInfoSync().windowWidth / 5, + popTop: 0, //弹出点赞评论框的位置 + popWidth: 0, //弹出框宽度 + isShow: true, //判断是否显示弹出框 }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { - + that = this + }, + // 点击图片进行大图查看 + LookPhoto: function (e) { + wx.previewImage({ + current: e.currentTarget.dataset.photurl, + urls: this.data.resource, + }) }, - /** - * 生命周期函数--监听页面初次渲染完成 - */ - onReady: function () { - + // 点击点赞的人 + TouchZanUser: function (e) { + wx.showModal({ + title: e.currentTarget.dataset.name, + showCancel: false + }) }, - /** - * 生命周期函数--监听页面显示 - */ - onShow: function () { - + // 删除朋友圈 + delete: function () { + wx.showToast({ + title: '删除成功', + }) }, - /** - * 生命周期函数--监听页面隐藏 - */ - onHide: function () { + // 点击了点赞评论 + TouchDiscuss: function (e) { + // this.data.isShow = !this.data.isShow + // 动画 + var animation = wx.createAnimation({ + duration: 300, + timingFunction: 'linear', + delay: 0, + }) - }, + if (that.data.isShow == false) { + that.setData({ + popTop: e.target.offsetTop - (e.detail.y - e.target.offsetTop) / 2, + popWidth: 0, + isShow: true + }) - /** - * 生命周期函数--监听页面卸载 - */ - onUnload: function () { - - }, - - /** - * 页面相关事件处理函数--监听用户下拉动作 - */ - onPullDownRefresh: function () { - - }, - - /** - * 页面上拉触底事件的处理函数 - */ - onReachBottom: function () { - - }, - - /** - * 用户点击右上角分享 - */ - onShareAppMessage: function () { + // 0.3秒后滑动 + setTimeout(function () { + animation.width(0).opacity(1).step() + that.setData({ + animation: animation.export(), + }) + }, 100) + } else { + // 0.3秒后滑动 + setTimeout(function () { + animation.width(120).opacity(1).step() + that.setData({ + animation: animation.export(), + }) + }, 100) + that.setData({ + popTop: e.target.offsetTop - (e.detail.y - e.target.offsetTop) / 2, + popWidth: 0, + isShow: false + }) + } } }) \ No newline at end of file diff --git a/pages/circle/circle.wxml b/pages/circle/circle.wxml index 7f03283..eefec79 100644 --- a/pages/circle/circle.wxml +++ b/pages/circle/circle.wxml @@ -1,2 +1,63 @@ - -pages/circle/circle.wxml + + + + + + + + + + + + + + + + {{content}} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/pages/circle/circle.wxss b/pages/circle/circle.wxss index ec48dcc..e2a492b 100644 --- a/pages/circle/circle.wxss +++ b/pages/circle/circle.wxss @@ -1 +1,206 @@ -/* pages/circle/circle.wxss */ \ No newline at end of file +/* pages/CircleFriends/CircleFriends.wxss */ +page{ + background: whitesmoke; +} + +.page{ + width: 100%; + /* overflow-x: hidden */ +} + +/* 列表 */ +.CircleList{ + background: white; + margin-bottom: 1px; + border-bottom: 1px solid whitesmoke; + border-top: 1px solid whitesmoke; +} + +.body-view{ + display: flex; +} + +/* .left-view{ + width: 150rpx; + /* background: rebeccapurple; +} */ + +.right-view{ + /* background: red; */ + padding: 0rpx 40rpx 0rpx 40prx; +} + +/* 头像 */ +.user-icon{ + /* display: flex; */ + width:100rpx; + height: 100rpx; + margin-left: 20rpx; + margin-top: 30rpx; + margin-right: 20rpx; +} + +.user-name-view{ + display: flex; + direction: row; +} + +.user-name-view image{ + width: 80rpx; + height: 80rpx; + border-radius: 80rpx; +} + +/* 昵称 */ +.user-name{ + display: flex; + height: 50rpx; + line-height: 50rpx; + font-size: 18px; + color: rgb(88, 103, 138); + margin-top: 30rpx; + margin-left: 10rpx; +} + +.user-name label{ + line-height: 80rpx; +} + +/* 内容 */ +.user-content{ + display: flex; + font-size: 18px; + line-height: 50rpx; + margin-left: 10rpx; +} + +/* 图片 */ +.photo-view{ + background: rebeccapurple; + margin-left: 10rpx; + margin-bottom: 20rpx; +} +.photo{ + background: rgb(255, 166, 0); + float: left; + margin-right: 10rpx; + margin-top: 10rpx; +} + +/* 地理位置 */ +.user-address-view{ + display: flex; + margin-top: 20rpx; + width: 100%; +} +.user-address-view label{ + font-size: 12px; + margin: 10rpx; +} + +/* 时间、删除、点赞评论 */ +.TDD-view{ + width: 100%; + height: 60rpx; + display: flex; + align-items: center; + background: white; +} +.TDD-view label{ + font-size: 13px; + margin-left: 10rpx; +} +.TDD-view button{ + font-size: 13px; + margin-left: 20rpx; + color: black; + background: white; +} +.TDD-view button::after{ + border: white; +} +.TDD-view image{ + width: 50rpx; + height: 40rpx; + margin-right: 20rpx; +} + +/* 点赞 */ +.zan-view { + width: 100%; + background: white; + margin-bottom: 20rpx; +} +.trigon-view{ + /* height: 20rpx; */ + margin-bottom: -15rpx; +} +.trigon{ + display: flex; + width: 40rpx; + height: 20rpx; + margin-top: 10rpx; + margin-left: 10rpx; +} +.zan-bg-view{ + display: inline-block; + width: 97%; + background: rgb(235, 235, 235); + margin-right: 20rpx; + margin-bottom: -11rpx; + border-top-left-radius: 7rpx; + border-top-right-radius: 7rpx; +} +.zan-user-view{ + display: flex; + float: left; + height: 40rpx; + margin-left: 10rpx; + /* margin-top: 5rpx; */ + align-content: center; +} +.zan-user{ + font-size: 12px; + line-height: 40rpx; + height: 40rpx; + color: rgb(88, 103, 138); +} + +.line{ + width: 97%; + height: 1px; + background: white; +} + +/* 评论 */ +.discuss-view{ + background: white; + width: 97%; +} + +.discuss{ + background: rgb(235, 235, 235); + line-height: 35rpx; +} + +.discuss label{ + font-size: 12px; +} + +.discuss-user{ + color: rgb(88, 103, 138); + margin-left: 10rpx; +} + +.content{ + margin-left: 10rpx; +} + +/* 弹出框 */ +.pop-up-box{ + position: absolute; + height: 60rpx; + border-radius: 10rpx; + right: 90rpx; + background: rgba(0, 0, 0, 0.7) +} \ No newline at end of file