lzh
/
lzh
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

首页接口数据渲染, 书库列表渲染 

个人中心小程序授权登陆接口编写
This commit is contained in:
lanzhehang 2022-05-10 18:20:27 +08:00
parent d15ad5b4fb
commit 2afce8be07
13 changed files with 222 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app.js
View File

@ -1,6 +1,6 @@
// app.js // app.js
let utils = require("./utils/util") let utils = require("./utils/util")
// let http = require("./utils/request") let http = require("./utils/request")
App({ App({
onLaunch() { onLaunch() {
// 展示本地存储能力 // 展示本地存储能力
@ -20,4 +20,5 @@ App({
}, },
utils:utils, utils:utils,
getset:utils.getDataset, getset:utils.getDataset,
http:http
}) })

1
compoments/book/book.js
View File

@ -31,7 +31,6 @@ Component({
methods: { methods: {
goDetail:function(e){ goDetail:function(e){
let item = app.getset(e).item let item = app.getset(e).item
wx.navigateTo({ wx.navigateTo({
url: '/pages/detail/book/book?bookNo='+item.bookNo　　// 页面 B url: '/pages/detail/book/book?bookNo='+item.bookNo　　// 页面 B
}) })

5
compoments/book/book.scss
View File

@ -6,7 +6,12 @@
overflow: hidden; overflow: hidden;
margin-bottom: 20rpx; margin-bottom: 20rpx;
padding-bottom: 20rpx; padding-bottom: 20rpx;
// image{
// width: 100%;
// height: 200rpx;
// }
} }
} }
} }
.heng{ .heng{

12
compoments/book/book.wxml
View File

@ -21,7 +21,7 @@
</view> </view>
<!-- 竖向 --> <!-- 竖向 -->
<view class="shu center-flex-left flex-top" wx:if="{{type==31}}"> <view class="shu center-flex-left flex-top" wx:if="{{type==31}}">
<view> <!-- <view>
<view wx:for="{{list}}" wx:if="{{index%2==0}}" class="margin_tb_20"> <view wx:for="{{list}}" wx:if="{{index%2==0}}" class="margin_tb_20">
<image style=" width: 200rpx;" mode="widthFix" src="{{item.bookImg}}" /> <image style=" width: 200rpx;" mode="widthFix" src="{{item.bookImg}}" />
<view> <view>
@ -31,7 +31,7 @@
<view class="font12">出版社：<text class="color-333">{{item.publisher}}</text> </view> <view class="font12">出版社：<text class="color-333">{{item.publisher}}</text> </view>
</view> </view>
</view> </view>
</view> </view> -->
</view> </view>
<!-- 双排 --> <!-- 双排 -->
@ -40,8 +40,8 @@
<view wx:for="{{list}}" wx:if="{{index%2==0}}" wx:key="index" data-item="{{item}}" class="" bindtap="goDetail"> <view wx:for="{{list}}" wx:if="{{index%2==0}}" wx:key="index" data-item="{{item}}" class="" bindtap="goDetail">
<image style=" width: 100%;" mode="widthFix" src="{{item.bookImg}}" /> <image style=" width: 100%;" mode="widthFix" src="{{item.bookImg}}" />
<view class="padding_lr_10"> <view class="padding_lr_10">
<view class="m-view-lin2 margin_tb_10 bold">{{item.bookName}}</view> <view class="m-view-lin2 margin_tb_10 bold ">{{item.bookName}}</view>
<view class="align-left"> <view class="align-left margin_t_30">
<view class="font12">作者：<text class="color-333">{{item.author}}</text></view> <view class="font12">作者：<text class="color-333">{{item.author}}</text></view>
<view class="font12"> 出版社：<text class="color-333">{{item.publisher}}</text> </view> <view class="font12"> 出版社：<text class="color-333">{{item.publisher}}</text> </view>
<view class="center-flex-between margin_t_10 font12"> <view class="center-flex-between margin_t_10 font12">
@ -55,9 +55,9 @@
<view class="right flex-1 margin_r_20 margin_l_10"> <view class="right flex-1 margin_r_20 margin_l_10">
<view wx:for="{{list}}" wx:if="{{index%2==1}}" wx:key="index" data-item="{{item}}" class="" bindtap="goDetail"> <view wx:for="{{list}}" wx:if="{{index%2==1}}" wx:key="index" data-item="{{item}}" class="" bindtap="goDetail">
<image style=" width: 100%;" mode="widthFix" src="{{item.bookImg}}" /> <image style=" width: 100%;" mode="widthFix" src="{{item.bookImg}}" />
<view class="padding_lr_10"> <view class="padding_lr_10 ">
<view class="m-view-lin2 margin_tb_10 bold">{{item.bookName}}</view> <view class="m-view-lin2 margin_tb_10 bold">{{item.bookName}}</view>
<view class="align-left"> <view class="align-left margin_t_30">
<view class="font12">作者：<text class="color-333">{{item.author}}</text></view> <view class="font12">作者：<text class="color-333">{{item.author}}</text></view>
<view class="font12"> 出版社：<text class="color-333">{{item.publisher}}</text> </view> <view class="font12"> 出版社：<text class="color-333">{{item.publisher}}</text> </view>
<view class="center-flex-between margin_t_10 font12"> <view class="center-flex-between margin_t_10 font12">

43
pages/detail/book/book.js
View File

@ -1,4 +1,5 @@
// pages/detail/book/book.js // pages/detail/book/book.js
let app = getApp();
Page({ Page({
/** /**
@ -14,22 +15,32 @@ Page({
*/ */
onLoad(options) { onLoad(options) {
console.log(options); console.log(options);
var index = 12; let bookNo = options? options.bookNo:'242627';
let js = { this.getBook(bookNo);
bookName:"理想国", // var index = 12;
author:"柏拉图(古希腊)", // let js = {
publisher:"华夏出版社", // bookName:"理想国",
publisherTime:"2012", // author:"柏拉图(古希腊)",
stock:(index+1)*23, // publisher:"华夏出版社",
bookNo:index, // publisherTime:"2012",
out:(index+2)*33, // stock:(index+1)*23,
score:4.5, // bookNo:index,
bookImg:"https://bkimg.cdn.bcebos.com/pic/f2deb48f8c5494ee91d6137127f5e0fe98257ee5?x-bce-process=image/watermark,image_d2F0ZXIvYmFpa2U5Mg==,g_7,xp_5,yp_5/format,f_auto", // out:(index+2)*33,
context:'柏拉图在《理想国》中以故事为题材，叙述苏格拉底到贝尔斯祷神，归途被派拉麦克邀往家中，宾主滔滔谈论起来。两人的辩论从各个角度暴露奴隶主阶级的哲学思想、政治思想、艺术思想及教育思想。故事中的苏格拉底是虚拟的、假托的，实际上就是柏拉图的代言人。文中借苏格拉底之口和人讨论正义，分析个人正义与城邦正义之间的互通性，系统地阐述了正义的概念。柏拉图设计并展望着心目中理想国度的蓝图，提出在“理想国”中才能真正实现正义。' // score:4.5,
} // bookImg:"https://bkimg.cdn.bcebos.com/pic/f2deb48f8c5494ee91d6137127f5e0fe98257ee5?x-bce-process=image/watermark,image_d2F0ZXIvYmFpa2U5Mg==,g_7,xp_5,yp_5/format,f_auto",
this.setData({ // context:'柏拉图在《理想国》中以故事为题材，叙述苏格拉底到贝尔斯祷神，归途被派拉麦克邀往家中，宾主滔滔谈论起来。两人的辩论从各个角度暴露奴隶主阶级的哲学思想、政治思想、艺术思想及教育思想。故事中的苏格拉底是虚拟的、假托的，实际上就是柏拉图的代言人。文中借苏格拉底之口和人讨论正义，分析个人正义与城邦正义之间的互通性，系统地阐述了正义的概念。柏拉图设计并展望着心目中理想国度的蓝图，提出在“理想国”中才能真正实现正义。'
book:js // }
}) // this.setData({
// book:js
// })
},
getBook(id){
app.http._post("book/getBookByBookNo",{bookNo:id}).then(res=>{
console.log(res);
this.setData({
book:res.data
})
})
}, },
doLike:function(){ doLike:function(){
console.log(112); console.log(112);

4
pages/detail/book/book.wxml
View File

@ -7,9 +7,9 @@
<!-- 评论按钮 --> <!-- 评论按钮 -->
<view class="center-flex margin_t_30"> <view class="center-flex margin_t_30">
<view class="center-flex-around " style="width: 50%;"> <view class="center-flex-around " style="width: 50%; text-shadow: 1px 1px 5px #000; color: #fff;">
<view bindtap="doLike"> <view bindtap="doLike">
<van-icon wx:if="{{!like}}" name="like-o" class="margin_b_12"/> <van-icon wx:if="{{!like}}" name="like-o" class="margin_b_6 font16"/>
<image wx:if="{{like}}" style="width:38rpx;height:38rpx" src="/static/img/b-like.png"></image> <image wx:if="{{like}}" style="width:38rpx;height:38rpx" src="/static/img/b-like.png"></image>
<view class="font11 margin_t_10">收藏</view> <view class="font11 margin_t_10">收藏</view>
</view> </view>

112
pages/index/home/index.js
View File

@ -3,37 +3,83 @@
const app = getApp() const app = getApp()
Page({ Page({
data: { data: {
info:'hello world', info: 'hello world',
randomNum:Math.random()*10, randomNum: Math.random() * 10,
bookList:[] bookList: [],
}, bookListTui: [],
onLoad() { bannerList: [{
let tempArray=[]; img: "https://img.zcool.cn/community/018e8e562aec816ac7254878e36954.jpg?x-oss-process=image/auto-orient,1"
for (let index = 0; index < 7; index++) { },
let js = { {
bookName:"理想国", img: "https://img.zcool.cn/community/016333592531d1b5b3086ed42ec672.png?x-oss-process=image/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/format,webp/quality,Q_100"
author:"柏拉图(古希腊)", }, {
publisher:"华夏出版社", img: "https://img.zcool.cn/community/01a7a85b3ee8c0a80120b9596f2831.JPG?x-oss-process=image/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100/format,webp/quality,Q_100"
publisherTime:"2012", },
stock:(index+1)*23,
bookNo:index,
out:(index+2)*33,
bookImg:"https://bkimg.cdn.bcebos.com/pic/f2deb48f8c5494ee91d6137127f5e0fe98257ee5?x-bce-process=image/watermark,image_d2F0ZXIvYmFpa2U5Mg==,g_7,xp_5,yp_5/format,f_auto",
context:'柏拉图在《理想国》中以故事为题材，叙述苏格拉底到贝尔斯祷神，归途被派拉麦克邀往家中，宾主滔滔谈论起来。两人的辩论从各个角度暴露奴隶主阶级的哲学思想、政治思想、艺术思想及教育思想。故事中的苏格拉底是虚拟的、假托的，实际上就是柏拉图的代言人。文中借苏格拉底之口和人讨论正义，分析个人正义与城邦正义之间的互通性，系统地阐述了正义的概念。柏拉图设计并展望着心目中理想国度的蓝图，提出在“理想国”中才能真正实现正义。'
}
tempArray.push(js)
}
this.setData({
bookList : tempArray
})
},
goDetail:function(e){
let item = app.getset(e).item;
wx.navigateTo({
url: '/pages/detail/book/book?bookNo='+item.bookNo　　// 页面 B
})
}
}) ]
},
onLoad() {
this.getBookList();
// let tempArray = [];
// for (let index = 0; index < 7; index++) {
// let js = {
// bookName: "理想国",
// author: "柏拉图(古希腊)",
// publisher: "华夏出版社",
// publisherTime: "2012",
// stock: (index + 1) * 23,
// bookNo: index,
// out: (index + 2) * 33,
// bookImg: "https://bkimg.cdn.bcebos.com/pic/f2deb48f8c5494ee91d6137127f5e0fe98257ee5?x-bce-process=image/watermark,image_d2F0ZXIvYmFpa2U5Mg==,g_7,xp_5,yp_5/format,f_auto",
// context: '柏拉图在《理想国》中以故事为题材，叙述苏格拉底到贝尔斯祷神，归途被派拉麦克邀往家中，宾主滔滔谈论起来。两人的辩论从各个角度暴露奴隶主阶级的哲学思想、政治思想、艺术思想及教育思想。故事中的苏格拉底是虚拟的、假托的，实际上就是柏拉图的代言人。文中借苏格拉底之口和人讨论正义，分析个人正义与城邦正义之间的互通性，系统地阐述了正义的概念。柏拉图设计并展望着心目中理想国度的蓝图，提出在“理想国”中才能真正实现正义。'
// }
// tempArray.push(js)
// }
// this.setData({
// bookList: tempArray
// })
// wx.login({
// success(res) {
// if (res.code) {
// console.log(res.code);
// //发起网络请求
// // app.http._post('user/getUserInfoByCode',{code:res.code}).then(res=>{
// // console.log(res);
// // })
// app.http._post('http://127.0.0.1:889/hb/jd/getcode',{code:res.code}).then(res=>{
// console.log(res);
// })
// } else {
// console.log('登录失败！' + res.errMsg)
// }
// }
// })
},
goDetail: function (e) {
let item = app.getset(e).item;
wx.navigateTo({
url: '/pages/detail/book/book?bookNo=' + item.bookNo // 页面 B
})
},
getBookList() {
app.http._post("book/queryBooksByType").then(res => {
console.log(res);
console.log(res.data.list);
this.setData({
bookList: res.data.list
})
})
app.http._post("book/zuixinBooks").then(res => {
console.log(res);
this.setData({
bookListTui: res.data
})
})
},
})

2
pages/index/home/index.scss
View File

@ -25,7 +25,7 @@ page{
} }
.templateitem{ .templateitem{
flex-shrink: 0 flex-shrink: 0;
} }
.jin_book{ .jin_book{

47
pages/index/home/index.wxml
View File

@ -1,15 +1,10 @@
<view class="banner"> <view class="banner">
<!-- 顶部轮播图 --> <!-- 顶部轮播图 -->
<swiper class="swiper-container" autoplay interval="4000" circular indicator-dots indicator-color="white" <swiper class="swiper-container" autoplay interval="4000" circular indicator-dots indicator-color="white" indicator-active-color="#ff5500">
indicator-active-color="#ff5500"> <swiper-item wx:for="{{bannerList}}" wx:key="index">
<swiper-item> <view>
<view class="item">A</view> <van-image width="100%" height="150" fit="scale-down" src="{{item.img}}" />
</swiper-item> </view>
<swiper-item>
<view class="item">B</view>
</swiper-item>
<swiper-item>
<view class="item">C</view>
</swiper-item> </swiper-item>
</swiper> </swiper>
</view> </view>
@ -35,22 +30,22 @@
<view style="background-color: #fff;"> <view style="background-color: #fff;">
<view class="center-flex-between"> <view class="center-flex-between">
<view class="bold margin_l_30 margin_tb_10" style="font-size: large;color: #333;">今日推荐</view> <view class="bold margin_l_30 margin_tb_10" style="font-size: large;color: #333;">今日推荐</view>
<view class=" margin_r_20 font12 " style="color: #666;">更多 <view class=" margin_r_20 font12 " style="color: #666;">更多
<van-icon name="arrow" /> <van-icon name="arrow" />
</view> </view>
</view> </view>
<scroll-view scroll-x class="flex " > <scroll-view scroll-x class="flex ">
<view style="white-space: nowrap;flex-direction:row; display: flex; " > <view style="white-space: nowrap;flex-direction:row; display: flex; ">
<view class="templateitem font12" wx:for="{{bookList}}" wx:key="index" data-item="{{item}}" bindtap="goDetail"> <view class="templateitem font12" wx:for="{{bookList}}" wx:key="index" data-item="{{item}}" bindtap="goDetail">
<view class="margin_l_20 center-flex-left jin_book {{index+1 == bookList.length ? 'margin_r_20':''}}" style="width: 400rpx;" > <view class="margin_l_20 center-flex-left jin_book {{index+1 == bookList.length ? 'margin_r_20':''}}" style="width: 400rpx;height: 200rpx;">
<view> <view>
<image style="width: 140rpx;" mode="widthFix" src="{{item.bookImg}}"></image> <image style="height: 200rpx;" mode="heightFix" src="{{item.bookImg}}"></image>
</view> </view>
<view class="center-vertical-between margin_lr_20" style="height: 180rpx;"> <view class="center-vertical-between margin_lr_20" style="height: 180rpx;">
<view class="bold m-view-lin">{{item.bookName}}</view> <view class="bold m-view-lin">{{item.bookName}}</view>
<view> <view>
<view>5.0</view> <view>5.0</view>
<view class=" m-view-lin margin_tb_10">{{item.author}}</view> <view class=" m-view-lin margin_tb_10">{{item.author}}</view>
<view class="">{{item.out}}人借阅</view> <view class="">{{item.out}}人借阅</view>
</view> </view>
</view> </view>
@ -61,24 +56,24 @@
</view> </view>
<!-- 新书推荐 --> <!-- 新书推荐 -->
<view style="background-color: #fff;"> <view style="background-color: #fff;">
<view class="center-flex-between margin_t_20" > <view class="center-flex-between margin_t_20">
<view class="bold margin_l_30 margin_tb_10" style="font-size: large;color: #333;">新书推荐</view> <view class="bold margin_l_30 margin_tb_10" style="font-size: large;color: #333;">新书推荐</view>
<view class=" margin_r_20 font12" style="color: #666;">更多 <view class=" margin_r_20 font12" style="color: #666;">更多
<van-icon name="arrow" /> <van-icon name="arrow" />
</view> </view>
</view> </view>
<scroll-view scroll-x class="flex" > <scroll-view scroll-x class="flex">
<view style="white-space: nowrap;flex-direction:row; display: flex; " > <view style="white-space: nowrap;flex-direction:row; display: flex; ">
<view class="templateitem font12" wx:for="{{bookList}}" wx:key="index" data-item="{{item}}" bindtap="goDetail"> <view class="templateitem font12" style="height: 460rpx;" wx:for="{{bookListTui}}" wx:key="index" data-item="{{item}}" bindtap="goDetail">
<view class="margin_l_20 jin_book {{index+1 == bookList.length ? 'margin_r_20':''}}" style="width: 200rpx;" > <view class="margin_l_20 center-vertical-between jin_book {{index+1 == bookListTui.length ? 'margin_r_20':''}}" style="width: 200rpx;height: 400rpx;">
<view> <view>
<image style="width: 200rpx;" mode="widthFix" src="{{item.bookImg}}"></image> <image style="width: 200rpx;" mode="widthFix" src="{{item.bookImg}}"></image>
</view> </view>
<view class="center-vertical-between margin_t_10" style="height: 100rpx;"> <view class="center-vertical-between margin_t_10" style="height: 100rpx;">
<view class="bold m-view-lin">{{item.bookName}}</view> <view class="bold m-view-lin ">{{item.bookName}}</view>
<view> <view class="font10">
<view>5.0</view> <view>5.0</view>
<view class=" m-view-lin">{{item.author}}</view> <view class=" m-view-lin">{{item.author}}</view>
</view> </view>
</view> </view>
</view> </view>

111
pages/index/my/my.js
View File

@ -1,4 +1,5 @@
// pages/index/my/my.js // pages/index/my/my.js
let app = getApp()
Page({ Page({
/** /**
@ -14,37 +15,38 @@ Page({
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad(options) { onLoad(options) {
let userInfo = wx.getStorageSync('userInfo'); let userInfo = wx.getStorageSync('userInfo');
if (userInfo) { console.log(userInfo);
this.setData({ if (userInfo) {
userInfo:userInfo, this.setData({
hasUserInfo:true userInfo: userInfo,
}) hasUserInfo: true
}else{ })
} else {
// 查看是否授权 // 查看是否授权
let _this = this; // let _this = this;
wx.getSetting({ // wx.getSetting({
success(res) { // success(res) {
if (res.authSetting['scope.userInfo']) { // if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称 // // 已经授权，可以直接调用 getUserInfo 获取头像昵称
wx.getUserInfo({ // wx.getUserInfo({
success: function (res) { // success: function (res) {
console.log(res); // console.log(res);
if (res.userInfo.nickName === '微信用户') { // if (res.userInfo.nickName === '微信用户') {
return; // return;
} // }
_this.setData({ // _this.setData({
userInfo:res.userInfo, // userInfo:res.userInfo,
hasUserInfo:true // hasUserInfo:true
}) // })
wx.setStorageSync('userInfo', res.userInfo); // wx.setStorageSync('userInfo', res.userInfo);
} // }
}) // })
} // }
} // }
}) // })
} }
}, },
getUserInfo(e) { getUserInfo(e) {
console.log(e.detail.userInfo) console.log(e.detail.userInfo)
@ -57,11 +59,12 @@ Page({
desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写 desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
success: (res) => { success: (res) => {
console.log(res); console.log(res);
this.setData({ // this.setData({
userInfo: res.userInfo, // userInfo: res.userInfo,
hasUserInfo: true // hasUserInfo: true
}) // })
wx.setStorageSync('userInfo', res.userInfo); wx.setStorageSync('userProfile', res);
this.getdatainfo();
} }
}) })
}, },
@ -84,6 +87,44 @@ Page({
onShow(e) { onShow(e) {
console.log(e); console.log(e);
console.log(121); console.log(121);
},
getdatainfo() {
let _this = this;
wx.login({
success(res) {
if (res.code) {
console.log(res.code);
//发起网络请求
let d = wx.getStorageSync('userProfile');
if (!d) {
return;
}
console.log(d);
// app.http._post('http://127.0.0.1:889/hb/jd/getcode',{code:res.code,encryptedData:d.encryptedData,iv:d.iv}).then(res3=>{
// console.log(res3);
// })
app.http._post('user/loginUser', {
code: res.code,
encryptedData: d.encryptedData,
iv: d.iv
}).then(res => {
console.log(res);
if (res.code == 1) {
wx.setStorageSync('userInfo', res.data);
_this.setData({
userInfo: res.data,
hasUserInfo: true
})
}
})
} else {
console.log('登录失败！' + res.errMsg)
}
}
})
}, },
/** /**

2
pages/index/my/my.wxml
View File

@ -6,7 +6,7 @@
<view class="padding_lr_20 center-flex-between " wx:if="{{userInfo.avatarUrl}}"> <view class="padding_lr_20 center-flex-between " wx:if="{{userInfo.avatarUrl}}">
<view class="center-flex-left"> <view class="center-flex-left">
<view style="border-radius: 100%;width: 100rpx;height:100rpx;overflow: hidden;" class="margin_r_20"> <view style="border-radius: 100%;width: 100rpx;height:100rpx;overflow: hidden;" class="margin_r_20">
<image mode="widthFix" class="w100 h100" src="{{userInfo.avatarUrl}}"></image> <image mode="widthFix" class="w100 h100" src="{{userInfo.avatar}}"></image>
</view> </view>
<view class="color_fff"> <view class="color_fff">
<view> <view>

2
project.config.json
View File

@ -55,7 +55,7 @@
}, },
"compileType": "miniprogram", "compileType": "miniprogram",
"libVersion": "2.19.4", "libVersion": "2.19.4",
"appid": "wxcce1d71d141e1925", "appid": "wx701382727b843476",
"projectname": "test", "projectname": "test",
"condition": {}, "condition": {},
"editorSetting": { "editorSetting": {

2
project.private.config.json
View File

@ -11,7 +11,7 @@
{ {
"name": "书籍详情", "name": "书籍详情",
"pathName": "pages/detail/book/book", "pathName": "pages/detail/book/book",
"query": "bookNo=0", "query": "bookNo=242627",
"launchMode": "default", "launchMode": "default",
"scene": null "scene": null
}, },