login.wxml
<view class="margin flex">
<text class="ver">用户名：</text>
<input bindinput="getU" class="winput" type="text"/>
</view>
<view class="margin flex">
<text>密码：</text>
<input bindinput="getP" class="winput" type="password"/>
</view>
<button bindtap='login' plain class="margin">
登录
</button>
login.wxss
.winput {
border: 1px #aaa solid;
height: 50rpx;
}
.margin {
margin-top: 30rpx;
}
.flex {
display: flex;
align-items: baseline;
justify-content: flex-end;
padding-right: 120rpx;
}
login.js
// pages/login/login.js
Page({
/**
* 页面的初始数据
*/
data: {
p: "",
u: ""
},
getU(e) {
this.setData({
u: e.detail.value
})
},
getP(e) {
this.setData({
p: e.detail.value
})
},
login() {
let reg = /^[a-zA-Z0-9]{1,}$/
if (!reg.test(this.data.u)) {
wx.showToast({
title: '用户名错误',
icon: 'error',
})
} else if (!reg.test(this.data.p)) {
wx.showToast({
title: '密码输入有误',
icon: 'error',
duration: 3000
})
return
} else {
wx.request({
url: 'http://timemeetyou.com:8889/api/private/v1/login', //仅为示例，并非真实的接口地址
method: 'POST',
data: {
username: this.data.u,
password: this.data.p
},
success(res) {
if (res.data.meta.status == 200) {
wx.showToast({
title: '正在跳转...',
icon: 'success',
duration: 1000
})
// 设置微信本地存储
wx.setStorageSync('token11', res.data.data.token)
console.log(res.data.data.token)
// 登录成功后跳转到表格数据页面
setTimeout(() => {
wx.navigateTo({
url: '../order/order',
})
}, 2000);
} else {
wx.showToast({
title: "错误ing",
icon: "error",
duration: 2000
})
}
}
})
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
order.wxml
<!--pages/order/order.wxml-->
<block wx:if="{{orderList.length}}">
<block wx:for="{{orderList}}" wx:key="index">
<view class="list">
<view>订单号：{{item.order_id}}</view>
<view>用户id：{{item.user_id}}</view>
<view>发票抬头：{{item.order_fapiao_title}}</view>
<view>订单价格：{{item.order_price}}</view>
<view>是否支付：{{item.order_pay}}</view>
<text>\n</text>
</view>
</block>
</block>
<block wx:else>
<view style="text-align:center;margin:20rpx 0;">数据为空!!!</view>
</block>
order.js
// pages/order/order.js
Page({
/**
* 页面的初始数据
*/
data: {
pagenum: 1,
orderList: []
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.getOrderList();
},
getOrderList() {
wx.request({
url: 'http://timemeetyou.com:8889/api/private/v1/orders',
method: 'GET',
data: {
pagenum: this.data.pagenum,
pagesize: 5
},
header: {
'Authorization': wx.getStorageSync('token11'),
},
success: (res) => {
console.log('获取的数据', res);
if (this.data.pagenum == 1) {
this.setData({
orderList: res.data.data.goods
})
return
}
this.setData({
orderList: [...this.data.orderList, ...res.data.data.goods]
})
}
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
this.data.pagenum = 1;
this.getOrderList();
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
this.data.pagenum++;
this.getOrderList();
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
