文章目录

  • 一、app.js
  • 二、app.json
  • 三、utils.js
  • 四、index
    • 1.index.wxml
    • 2.index.wxss
    • 3.index.js
  • 五、logs
    • 1.logs.wxml
    • 2.logs.wxss
    • 2.logs.js
  • 六、appointments
    • appointments主页
    • 2.appointmentsDetails
  • 七、orderForms
    • orderForms主页
    • 1.orderFormsDetails
  • 八、shoopLists
    • shoopLists主页
    • 1.add
    • 2.detail
    • 3.edit

一、app.js

代码如下（示例）：

//app.js
App({backstageUrls:'http://116.62.201.243:8080/wxxcx/',onLaunch: function () {// 展示本地存储能力var logs = wx.getStorageSync('logs') || []logs.unshift(Date.now())wx.setStorageSync('logs', logs)// 登录wx.login({success: res => {// 发送 res.code 到后台换取 openId, sessionKey, unionId}})// 获取用户信息wx.getSetting({success: res => {if (res.authSetting['scope.userInfo']) {// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框wx.getUserInfo({success: res => {// 可以将 res 发送给后台解码出 unionIdthis.globalData.userInfo = res.userInfo// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回// 所以此处加入 callback 以防止这种情况if (this.userInfoReadyCallback) {this.userInfoReadyCallback(res)}}})}}})},globalData: {userInfo: null}
})

二、app.json

{"pages": ["pages/index/index","pages/shoopLists/shoopLists","pages/shoopLists/edit/edit","pages/shoopLists/add/add","pages/shoopLists/details/details","pages/logs/logs","pages/orderForms/orderForms","pages/orderForms/orderFormsDetails/orderFormsDetails","pages/appointments/appointments","pages/appointments/appointmentsDetails/appointmentsDetails"],"window": {"backgroundTextStyle": "light","navigationBarBackgroundColor": "#fff","navigationBarTitleText": "Weixin","navigationBarTextStyle": "black"},"tabBar": {"color": "#000000","list": [{"pagePath": "pages/shoopLists/shoopLists","iconPath": "imgs/shoopList.png","text": "商品"},{"pagePath": "pages/appointments/appointments","iconPath": "imgs/orderForm.png","text": "预约"},{"pagePath": "pages/orderForms/orderForms","iconPath": "imgs/appointment.png","text": "订单"}]},"sitemapLocation": "sitemap58.json"
,"sitemapLocation": "sitemap39.json"}

三、utils.js

代码如下（示例）：

const formatTime = date => {const year = date.getFullYear()const month = date.getMonth() + 1const day = date.getDate()const hour = date.getHours()const minute = date.getMinutes()const second = date.getSeconds()return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}const formatNumber = n => {n = n.toString()return n[1] ? n : '0' + n
}module.exports = {formatTime: formatTime
}

四、index

1.index.wxml

代码如下（示例）：

<!--index.wxml-->
<view>
<image src="/imgs/background.png" class="box"></image>
<view class="box1" bindtap="log">欢迎您</view>
</view>

2.index.wxss

代码如下（示例）：

/**index.wxss**/
.box{width: 100vw;height: 100vh;
}
.box1{position: fixed;top: 350px;left: 140px;background-color: lavenderblush;width: 100px;
height: 40px;
border-radius: 50%;
text-align: center;
padding-top: 20px;
}

3.index.js

代码如下（示例）：

//index.js
//获取应用实例
const app = getApp()Page({data: {motto: 'Hello World',userInfo: {},hasUserInfo: false,canIUse: wx.canIUse('button.open-type.getUserInfo')},log:function(){wx.navigateTo({url: '/pages/logs/logs',})},//事件处理函数bindViewTap: function() {wx.navigateTo({url: '../logs/logs'})},onLoad: function () {if (app.globalData.userInfo) {this.setData({userInfo: app.globalData.userInfo,hasUserInfo: true})} else if (this.data.canIUse){// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回// 所以此处加入 callback 以防止这种情况app.userInfoReadyCallback = res => {this.setData({userInfo: res.userInfo,hasUserInfo: true})}} else {// 在没有 open-type=getUserInfo 版本的兼容处理wx.getUserInfo({success: res => {app.globalData.userInfo = res.userInfothis.setData({userInfo: res.userInfo,hasUserInfo: true})}})}},getUserInfo: function(e) {console.log(e)app.globalData.userInfo = e.detail.userInfothis.setData({userInfo: e.detail.userInfo,hasUserInfo: true})}
})

五、logs

1.logs.wxml

代码如下（示例）：

<!--logs.wxml-->
<view><view><image src="/imgs/logs.jpg" class="box"></image><view class="box01">o2o商城</view></view><view class="box1"><form bindsubmit="denglu"><view class="box11">用户名：</view><view class="box12"><input type="text" placeholder="请输入用户名" name='username'></input></view><text class="box13" decode="{{true}}">密&nbsp;&nbsp;&nbsp;码：</text><view class="box14"><input type="password" placeholder="请输入密码" name='password'></input></view><button class="box15" form-type ='submit' open-type="getUserInfo">登录</button></form></view>
</view>

2.logs.wxss

代码如下（示例）：

.box{width: 100vw;height: 100vh;
}
.box01{position: fixed;top: 52px;left: 115px;font-size: 25px;
}
.box1{direction: flex;flex-direction: row;border:1px solid red;}
.box11{position: fixed;top: 250px;left: 95px;font-size: 18px;
}
.box12{position: fixed;top:252px;left: 155px;width: 120px;border:1px solid black;
}
.box13{position: fixed;top: 265px;left: 95px;font-size: 18px;}
.box14{position: fixed;top: 290px;left: 155px;width: 120px;border:1px solid black;
}
.box15{position: fixed;top: 340px;left: 150px;
}

2.logs.js

代码如下（示例）：

//logs.js
// const util = require('../../utils/util.js')
var backstageUrls=getApp().backstageUrls;
var name;
var headImage;
Page({//页面初始化内容data: {},denglu:function(event){console.log("event",event)var username=event.detail.value.username;var password=event.detail.value.password;if(password=='123456' && username=='111'){wx.login({success(res){var code=res.codewx.getUserInfo({success:(res)=>{console.log(res)name=res.userInfo.nickNameheadImage=res.userInfo.avatarUrlwx.request({url:backstageUrls+'user/login',data:{code:code,name:name,headImage:headImage},method:"POST",success(res){console.log("获取数据",res.data)var userId=res.data.data.userId//存放在数据缓存中wx.setStorage({key:'nickName',data:userId })wx.switchTab({url: '/pages/shoopLists/shoopLists',})},fail(err){console.log("失败",err)}})}})}})}else{if(password=='' && username==''){wx.showToast({title: '请输入用户名或密码',icon:'none'})}else{wx.showToast({title: '用户名或密码错误',icon:'none'})}}},onLoad: function () {}
})

六、appointments

appointments主页

appointments.wxml：

<!--pages/appointments/appointments.wxml-->
<view class="list" wx:for="{{list}}" bindtap="tz" data-index="{{index}}"><view class="left"><view>{{item.bookItem}}</view><view>到店时间：{{item.comeTime}}</view></view><view class="{{item.status=='0' ?  'dota': item.status=='2' ? 'dota2':'dota1'}}"></view>
</view>

appointments.wxss：

/* pages/appointments/appointments.wxss */
.list{width: 100vw;height: 130rpx;border-bottom: 1px solid #ededed;display: flex;flex-direction: row;justify-content: space-between;align-items: center;
}
.left{width: 80vw;height: 130rpx;margin-left: 30rpx;display: flex;flex-direction: column;justify-content: center;
}
.dota{width: 20rpx;height: 20rpx;background-color: #ff0000;border-radius: 50%;margin-right: 30rpx;
}
.dota1{width: 20rpx;height: 20rpx;background-color: #2c08ad;border-radius: 50%;margin-right: 30rpx;
}
.dota2{width: 20rpx;height: 20rpx;background-color: #0cf56d;border-radius: 50%;margin-right: 30rpx;
}

appointments.js：

// pages/appointments/appointments.js
var backstageUrls=getApp().backstageUrls
Page({tz:function(event){console.log(event)var index=event.currentTarget.dataset.indexvar bookId=this.data.list[index].bookIdwx.navigateTo({url: '../appointments/appointmentsDetails/appointmentsDetails?bookId='+bookId,})},/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {var userId=wx.getStorageSync('nickName')wx.request({url: backstageUrls+'book/getAllById',data:{userId:userId},method:'POST',success:(res)=>{// console.log(res)var list=res.data.datathis.setData({list:list})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

2.appointmentsDetails

appointmentsDetails.wxml：

<!--pages/appointments/appointmentsDetails/appointmentsDetails.wxml-->
<view class="top"><view class="left">预约申请：</view><view class="right {{data.status=='0' ? 'color' : data.status=='1' ? 'color1' : data.status=='2' ? 'color2' : 'color3'}}">{{data.status=='0' ? '已过期' : data.status=='1' ? '已接受' : data.status=='2' ? '已拒绝' : '未处理'}}</view>
</view><view class="top1"><view>服务项目：</view><view>{{data.bookItem}}</view>
</view><view class="top2"><view>预约时间：</view><view>{{data.bookTime}}</view>
</view><view class="top1"><view>到店时间：</view><view>{{data.comeTime}}</view>
</view><view class="top1"><view>留言：</view><view>{{data.message}}</view>
</view><view class="{{data.status=='3' ? 'cl' : 'cln'}}"><view class="dcl">预约待处理</view><view class="an"><button size="mini" bindtap="js" class="js">接受</button><button size="mini" bindtap="jj" class="jj">拒绝</button>
</view>
</view>

appointmentsDetails.wxss：

/* pages/appointments/appointmentsDetails/appointmentsDetails.wxss */
.top{width: 100vw;height: 80rpx;display: flex;flex-direction: row;justify-content: space-between;align-items: center;border-bottom: 1px solid #ededed;
}
.left{margin-left: 30rpx;
}
.right{margin-right: 30rpx;
}
.color{color: #ff0000;
}
.color1{color: #2c08ad;
}
.color2{color: #0cf56d;
}
.color3{color: #b506eb;
}
.top1{width: 100vw;height: 100rpx;padding-left: 30rpx;border-bottom: 1px solid #ededed;
}
.top2{width: 100vw;height: 100rpx;padding-left: 30rpx;border-bottom: 1px solid #ededed;display: flex;flex-direction: row;align-items: center;
}
.cln{width: 100vw;height: 100rpx;position: fixed;bottom: 0;display: flex;flex-direction: row;justify-content: space-between;align-items: center;visibility: hidden;
}
.cl{width: 100vw;height: 100rpx;position: fixed;bottom: 0;display: flex;flex-direction: row;justify-content: space-between;align-items: center;border-top: 1px solid #ededed;
}
.js{margin: 0 20rpx;background-color: red;color: white;
}
.jj{margin: 0 20rpx;background-color: green;color: white;
}

appointmentsDetails.js：

// pages/appointments/appointmentsDetails/appointmentsDetails.js
var backstageUrls=getApp().backstageUrls
var bookId
Page({js:function(){wx.request({url: backstageUrls+'book/update',data:{bookId:bookId,status:'1'},method:'POST',success:(res)=>{wx.switchTab({url: '../appointments',})}})},jj:function(){wx.request({url: backstageUrls+'book/update',data:{bookId:bookId,status:'2'},method:'POST',success:(res)=>{wx.switchTab({url: '../appointments',})}})},/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {bookId=options.bookId// console.log(bookId)wx.request({url: backstageUrls+'book/details',data:{bookId:bookId},method:'POST',success:(res)=>{console.log(res)var data=res.data.datathis.setData({data:data})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

七、orderForms

orderForms主页

orderFormsDetails.wxml：


<!--pages/orderForms/orderForms.wxml-->
<view class="top"><view class="{{choose ? 'color' : 'color1'}}" bindtap="a" data-index="1">待发货</view><view class="{{choose1 ? 'color' : 'color1'}}" bindtap="a1" data-index="2">待收货</view><view class="{{choose2 ? 'color' : 'color1'}}" bindtap="a2" data-index="3">已完成</view>
</view><view class="body" wx:for="{{list}}" bindtap="tz" data-index="{{index}}"><view class="left"><view style="font-size: 30rpx;">订单号：<text style="color: blue;">{{item.orderNum}}</text></view><view style="font-size: 20rpx;">{{item.createTime}}</view></view><view class="right"><view style="color:red;text-align: right;">￥{{item.money}}</view><view class="{{item.status=='1' ? 'fh' : 'fh1'}}" catchtap="fh" data-index="{{index}}">确认发货</view></view>
</view>

orderFormsDetails.wxss：


/* pages/orderForms/orderForms.wxss */
.top{width: 100vw;height: 150rpx;display: flex;flex-direction: row;justify-content: center;align-items: center;
}
.color{width: 150rpx;height: 60rpx;background-color: palevioletred;color: white;display: flex;flex-direction: column;justify-content: center;align-items: center;border: 1px solid palevioletred;
}
.color1{width: 150rpx;height: 60rpx;background-color: white;color: palevioletred;display: flex;flex-direction: column;justify-content: center;align-items: center;border: 1px solid palevioletred;
}
.body{width: 100vw;height: 130rpx;display: flex;flex-direction: row;justify-content: space-between;align-items: center;border-bottom: 1px solid #ededed;
}
.left{margin-left: 30rpx;
}
.right{margin-right: 20rpx;
}
.fh{width: 160rpx;height: 60rpx;border-radius: 16rpx;background-color: red;color: white;display: flex;justify-content: center;align-items: center;
}
.fh1{width: 160rpx;height: 60rpx;border-radius: 16rpx;background-color: red;color: white;display: flex;justify-content: center;align-items: center;visibility: hidden;
}

orderFormsDetails.js：


// pages/orderForms/orderForms.js
var backstageUrls=getApp().backstageUrls
Page({a:function(event){// console.log(event)this.setData({choose:true,choose1:false,choose2:false})var status=event.currentTarget.dataset.indexwx.request({url: backstageUrls+'order/showAllByStatus',data:{status:status},method:'POST',success:(res)=>{console.log(res)var list=res.data.datathis.setData({list:list})}})},a1:function(event){// console.log(event)this.setData({choose:false,choose1:true,choose2:false})var status=event.currentTarget.dataset.indexwx.request({url: backstageUrls+'order/showAllByStatus',data:{status:status},method:'POST',success:(res)=>{console.log(res)var list=res.data.datathis.setData({list:list})}})},a2:function(event){// console.log(event)this.setData({choose:false,choose1:false,choose2:true})var status=event.currentTarget.dataset.indexwx.request({url: backstageUrls+'order/showAllByStatus',data:{status:status},method:'POST',success:(res)=>{console.log(res)var list=res.data.datathis.setData({list:list})}})},fh:function(event){var index=event.currentTarget.dataset.indexvar list=this.data.listvar orderNum=list[index].orderNumvar message=list[index].messagewx.request({url: backstageUrls+'order/updateStatus',data:{orderNum:orderNum,status:'2',message:message},method:'POST',success:(res)=>{console.log(res)wx.showToast({title: '已发货',icon:'none',success:(res)=>{wx.request({url: backstageUrls+'order/showAllByStatus',data:{status:'1'},method:'POST',success:(res)=>{console.log(res)var list=res.data.datathis.setData({list:list})}})}})}})},tz:function(event){var index=event.currentTarget.dataset.indexvar list=this.data.listvar orderNum=list[index].orderNumwx.navigateTo({url: '../orderForms/orderFormsDetails/orderFormsDetails?orderNum='+orderNum,})},/*** 页面的初始数据*/data: {choose:true,choose1:false,choose2:false},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {wx.request({url: backstageUrls+'order/showAllByStatus',data:{status:'1'},method:'POST',success:(res)=>{console.log(res)var list=res.data.datathis.setData({list:list})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

1.orderFormsDetails

orderFormsDetails.wxml：

<!--pages/orderForms/orderFormsDetails/orderFormsDetails.wxml-->
<view class="top"><view>订单编号：{{order.orderNum}}</view><view class="{{order.status=='0' ? 'color' : order.status=='1' ? 'color1' :  'color2'}}">{{data.status=='0' ? '已完成' : data.status=='1' ? '待发货' : '待收货'}}</view>
</view>
<view class="top"><view>创建时间：{{order.createTime}}</view>
</view><view class="top1"><view>收货地址:</view><view class="a"><view>{{address.name}}</view><view style="margin-right: 20rpx;">{{address.phone}}</view></view><view>{{address.province}}{{address.city}}{{address.disfaultFlag}}</view>
</view><view>商品列表:</view><view class="top2" wx:for="{{item_list}}"><image src="http://116.62.201.243:8080/wxxcx/{{item.image}}"></image><view class="sx"><view>{{item.name}}</view><view class="rl"><view style="color : yellow;">￥{{item.price}}</view><view>*{{item.num}}</view></view></view>
</view><view class="zj">{{order.money}}</view>
<view>备注:</view>
<view>{{order.message=='' ? '暂无备注':order.message}}</view>

orderFormsDetails.wxss：

/* pages/orderForms/orderFormsDetails/orderFormsDetails.wxss */
.top{width: 100vw;height: 100rpx;border-bottom: 1px solid #ededed;display: flex;flex-direction: row;justify-content: space-between;align-items: center;
}
.color{color: #ff0000;
}
.color1{color: #2c08ad;
}
.color2{color: #0cf56d;
}
.top1{width: 100vw;height: 160rpx;border-bottom: 1px solid #ededed;}
.a{width: 100vw;height: 30rpx;display: flex;flex-direction: row;justify-content:space-between;align-items: center;margin-right: 20rpx;}
image{width: 100rpx;height: 100rpx;
}
.top2{width: 100vw;height: 130rpx;display: flex;flex-direction: row;align-items: center;
}
.sx{width: 80vw;height: 100rpx;display: flex;flex-direction: column;justify-content: center;
}
.rl{display: flex;flex-direction: row;justify-content: space-between;
}
.zj{width: 100vw;height: 50rpx;text-align: right;color: #0cf56d;
}

orderFormsDetails.js：

// pages/orderForms/orderFormsDetails/orderFormsDetails.js
var backstageUrls=getApp().backstageUrls
Page({/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {var orderNum=options.orderNumconsole.log(orderNum)wx.request({url: backstageUrls+'order/details ',data:{orderNum:orderNum},method:'POST',success:(res)=>{console.log(res)var order=res.data.data.ordervar address=res.data.data.addressvar item_list=res.data.data.item_listthis.setData({order:order,address:address,item_list:item_list})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

八、shoopLists

shoopLists主页

shoopLists.wxml：


<!--pages/shoopLists/shoopLists.wxml-->
<movable-area class='h' wx:for="{{data}}"><movable-view class="hh" direction='horizontal'><view class="box1"  x='130'><image src="http://116.62.201.243:8080/wxxcx/{{item.image}}" class="img1"></image><view class="box11"  bindtap="details" data-index="{{index}}"><view>{{item.name}}</view><view>￥{{item.price}}</view></view><view class="sc" bindtap="sc" data-index="{{item.goodsId}}">删除</view></view></movable-view>
</movable-area>
<button class="bt" bindtap="tianjia">添加商品</button><!-- <view><view class="box1" wx:for="{{data}}" bindtap="details" data-index="{{index}}"><image src="http://116.62.201.243:8080/wxxcx/{{item.image}}" class="img1"></image><view class="box11"><view>{{item.name}}</view><view>￥{{item.price}}</view></view></view><button class="bt" bindtap="tianjia">添加商品</button>
</view>  -->

shoopLists.wxss：


/* pages/shoopLists/shoopLists.wxss */
.ma{width: 80vw;height: 200px;background-color: red;
}
.mv{width: 100vw;height: 200px;background-color: green;
}
.a{position: fixed;right: 0;z-index: -10;
}
.box1{width: 100vw;height: 150rpx;display: flex;flex-direction: row;align-items: center;border-bottom: 1px solid gainsboro;
}
.img1{width: 120rpx;height: 120rpx;
}
.box11{display: flex;flex-direction: column;justify-content: space-between;padding-top: 15px;padding-bottom: 15px;margin-left: 30rpx;}
.bt{width: 50vw;background-color: green;
}
.h{width: 80vw;height: 150rpx;display: block;
}
.hh{width: 100vw;height: 150rpx;margin-top: 150rpx;display: block;
}.sc{position: fixed;font-family: Monaco;background-color: red;width: 230rpx;height: 108rpx;padding-top: 20px;padding-left: 20px;z-index: 4;right: -140px;color: #fff
}

shoopLists.js：


// pages/shoopLists/shoopLists.js
var  backstageUrls=getApp().backstageUrls
var userId=wx.getStorageSync('userInfo')
var page=1;Page({/*** 页面的初始数据*/data: {data:[]},//删除商品sc:function(event){console.log(event)var goodsId=event.currentTarget.dataset.indexconsole.log(goodsId)wx.request({url: backstageUrls+'/goods/deleteById ',data:{goodsId:goodsId},method:'POST',success:(res)=>{console.log(res.data)console.log(page)var list=this.data.dataconsole.log(list)console.log(tt)list.splice(((page-1))*8,8)console.log(list)this.sp()}})// var index=event.currentTarget.dataset.index// console.log("index",index)// var data=this.data.data// console.log("data",data)// data.splice(index,1)// this.setData({//   data:data// })},//添加商品tianjia:function(){wx.navigateTo({url: '/pages/shoopLists/add/add',})},//跳转到详情details:function(event){console.log(event)var index=event.currentTarget.dataset.indexconsole.log("index",index)var data=this.data.dataconsole.log("data",data)var gooodsId=data[index].goodsIdconsole.log(gooodsId)wx.navigateTo({url: '/pages/shoopLists/details/details?goodsId='+gooodsId,})},//商品列表页sp:function(event){console.log("数据",event)console.log("page",page)wx.request({url: backstageUrls+'goods/getGoodsByPage',data:{page:page,pageSize:8   },method:'POST',success:(res)=>{console.log(res.data)var lists=this.data.dataconsole.log("lists",lists)var list=res.data.dataconsole.log("listaaaa",list)if(list === undefined){page--wx.showToast({title: '已加载完数据',icon:'none'})}else if(page === 1){lists=listconsole.log("lists",lists)}else{for(var i=0;i<list.length;i++){lists.push(list[i])console.log("lists1",lists)}}console.log(lists)this.setData({data:lists})}})},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {wx.showToast({title: '刷新中',icon: 'loading',success:(res)=>{console.log("刷新成功",res)page=1this.sp()var l=setTimeout(()=> {wx.stopPullDownRefresh()clearTimeout(l)}, 2000)}})},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {page++var l = setTimeout(() => {wx.showToast({title: '加载数据中',icon: 'loading',mask: true,success: (res) => {clearInterval(l)this.sp()}})}, 1000)},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function (event) {},/*** 生命周期函数--监听页面显示*/onShow: function () {page=1this.sp()},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

1.add

add.wxml：

<!--pages/shoopLists/add/add.wxml-->
<form bindsubmit="formSubmit"><view class="box1" ><view>商品名称：</view><input placeholder="请输入商品名称" name="commodityname"></input></view><view class="box2" bindtap="chooseimage"><view>封面照片：</view><image src="{{img}}" class="box21"></image></view><view class="box3"><view>商品简介：</view>
<input placeholder="请输入商品简介" name="commodityjj"></input></view><view class="box5"> <text class="title">单价：￥</text><input placeholder="请输入商品价格" class="box51"name="commodityprice" ></input><button class="box52" bindtap="queding" form-type="submit">确定</button></view></form>

add.wxss：


/* pages/shoopLists/add/add.wxss */
/* pages/shoopLists/edit/edit.wxss */
.box1{border-bottom: 1px solid gainsboro;padding:5px;
}
.box2{border-bottom: 1px solid gainsboro;padding:5px;
}
.box21{padding-left: 20px;
}
.box3{padding:5px;
}
.box4{padding:5px;
}
.box5{width: 100vw;display: flex;flex-direction: row;justify-content: space-between;position: fixed;bottom: 10px;
}
.box51{width: 200px;height: 40px;padding-left: 5px;
}
.box52{width: 80px;height: 40px;right: 0px;background-color: green;color: aliceblue;
}
.title{padding-top: 10px;
}

add.js：


// pages/shoopLists/add/add.js
var backstageUrls = getApp().backstageUrls
var img
var backstageUrls = getApp().backstageUrls
var name
var price
var image
var detail
Page({/*** 页面的初始数据*/data: {},//点击确定添加queding: function () {wx.switchTab({url: '../../shoopLists/shoopLists',})},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {console.log(options)},//添加图片chooseimage: function () {wx.chooseImage({count: 1,sourceType: ['album'],success: (res) => {img = res.tempFilePaths[0]if(img==undefined){img=this.data.img}console.log(img)wx.uploadFile({filePath: img,name: 'multFile',url: backstageUrls + '/goods/uploadImage',success: (res) => {console.log(res)img = JSON.parse(res.data).data}})this.setData({img: img})}})},formSubmit: function (e) {console.log(e)var sname = e.detail.value.commoditynamevar sjj = e.detail.value.commodityjjvar price = e.detail.value.commoditypriceif (sname == "" || sjj == "" || price == "" || img == "") {wx.showToast({title: '请填写完整商品信息',icon: "none"})} else {wx.request({url: backstageUrls + '/goods/add',data: {name: sname,price: price,detail: sjj,image: img},method: 'POST',success: (res) => {console.log(res)wx.switchTab({url: '/pages/shoopLists/shoopLists',})}})}},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

2.detail

detail.wxml：


<!--pages/shoopLists/details/details.wxml-->
<view><view class="box1" ><view>商品名称：</view><view>{{list.name}}</view></view><view class="box2"><view>封面照片：</view><image src="http://116.62.201.243:8080/wxxcx/{{list.image}}" class="box21"></image></view><view class="box3"><view>商品简介：</view><view>{{list.detail}}</view></view><view class="box4">上架时间：{{list.upTime}}</view><view class="box5"> <view class="box51">单价：￥{{list.price}}</view><button class="box52" bindtap="bianji" data-index="index">编辑</button></view>
</view>

detail.wxss：


/* pages/shoopLists/details/details.wxss */
.box1{border-bottom: 1px solid gainsboro;padding:5px;
}
.box2{border-bottom: 1px solid gainsboro;padding:5px;
}
.box21{padding-left: 20px;
}
.box3{border-bottom: 1px solid gainsboro;padding:5px;
}
.box4{padding:5px;
}
.box5{width: 100vw;display: flex;flex-direction: row;justify-content: space-between;position: fixed;bottom: 0;
}
.box51{width: 200px;height: 40px;padding-left: 5px;padding-top: 15px;
}
.box52{width: 80px;height: 40px;right: -40px;margin-top: 5px;background-color: green;color: aliceblue;padding-bottom: 10px;
}

detail.js：

// pages/shoopLists/details/details.js
var  backstageUrls=getApp().backstageUrls
var userId=wx.getStorageSync('userInfo')
Page({/*** 页面的初始数据*/data: {},
//跳转在编辑页面
bianji:function(event){var list=JSON.stringify(this.data.list)console.log(list)wx.navigateTo({url: '/pages/shoopLists/edit/edit?list='+list,})
},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {console.log("options",options)var goodsId=options.goodsIdconsole.log("goodsId",goodsId)wx.request({url: backstageUrls+'/goods/goodsDetails',data:{goodsId:goodsId},method:'POST',success:(res)=>{console.log("res",res)var list=res.data.dataconsole.log("list",list)this.setData({list:list,})}})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

3.edit

edit.wxml：


<!--pages/shoopLists/edit/edit.wxml-->
<view><form bindsubmit='tj'><view class="box1"><view>商品名称：</view><input value="{{list.name}}" name='name'></input></view><view class="box2"><view>封面照片：</view><image src="http://116.62.201.243:8080/wxxcx/{{image}}" class="box21" name='img' bindtap="moneychane"></image></view><view class="box3"><view>商品简介：</view><input value="{{list.name}}" name='xq'></input></view><view class="box5"> <view class="box51">单价：￥ <input value="{{list.price}}" name='dj'></input></view><button class="box52" bindtap="queding" form-type='submit'>确定</button></view></form>
</view>

edit.wxss：

/* pages/shoopLists/edit/edit.wxss */
.box1{border-bottom: 1px solid gainsboro;padding:5px;
}
.box2{border-bottom: 1px solid gainsboro;padding:5px;
}
.box21{padding-left: 20px;
}
.box3{padding:5px;
}
.box4{padding:5px;
}
.box5{width: 100vw;display: flex;flex-direction: row;justify-content: space-between;position: fixed;bottom: 0;
}
.box51{width: 200px;height: 40px;padding-left: 5px;padding-top: 15px;
}
.box52{width: 80px;height: 40px;right: -40px;margin-top: 5px;background-color: green;color: aliceblue;padding-bottom: 15px;
}

edit.js：


// pages/shoopLists/edit/edit.js
var  backstageUrls=getApp().backstageUrls
var path
Page({tj:function(event){console.log(event)var list=this.data.listconsole.log(list)var image=this.data.imageconsole.log(image)var dj=event.detail.value.djvar name=event.detail.value.namevar xq=event.detail.value.xqwx.request({url: backstageUrls+'goods/update',data:{goodsId:list.goodsId,name:name,price:dj,image:image,detail:xq},method:'POST',success:(res)=>{console.log(res)}    })},moneychane:function(){wx.chooseImage({count:1,sourceType:['album'],success:(res)=>{console.log(res)wx.uploadFile({url: backstageUrls+'goods/uploadImage',filePath:res.tempFilePaths[0],name:"multFile",method:'POST',success:(res)=>{var data=JSON.parse(res.data).dataconsole.log(data)this.setData({image:data})}})}})},queding:function(){wx.switchTab({url: '../../shoopLists/shoopLists',})},/*** 页面的初始数据*/data: {},/*** 生命周期函数--监听页面加载*/onLoad: function (options) {var list=JSON.parse(options.list) var image=list.imagethis.setData({list:list,image:image})},/*** 生命周期函数--监听页面初次渲染完成*/onReady: function () {},/*** 生命周期函数--监听页面显示*/onShow: function () {},/*** 生命周期函数--监听页面隐藏*/onHide: function () {},/*** 生命周期函数--监听页面卸载*/onUnload: function () {},/*** 页面相关事件处理函数--监听用户下拉动作*/onPullDownRefresh: function () {},/*** 页面上拉触底事件的处理函数*/onReachBottom: function () {},/*** 用户点击右上角分享*/onShareAppMessage: function () {}
})

微信小程序OTO商城（商务端）相关推荐

  1. 微信小程序OTO商城（客户端）

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一.app.js 二.app.json 三.index(登录页) 1.index.wxml 2.index.wxss 2.i ...

  2. 微信小程序分析送积分功能如何实现_微信小程序积分商城系统如何裂变营销购物?...

    小程序积分商城系统通过以积分的形式,通过购物返积分,签到领积分等各种方式,让消费者对品牌和产品形成一定认知和信赖,从而提高消费者的购物积极性,提高产品的复购率,通过微信访问.传播.交易一体化的裂变营销 ...

  3. 微信小程序购物商城系统开发系列-工具篇

    微信小程序购物商城系统开发系列-工具篇 微信小程序开放公测以来,一夜之间在各种技术社区中就火起来啦.对于它 估计大家都不陌生了,对于它未来的价值就不再赘述,简单一句话:可以把小程序简单理解为一个新的操 ...

  4. [转]微信小程序之购物车 —— 微信小程序实战商城系列（5）

    本文转自:http://blog.csdn.net/michael_ouyang/article/details/70755892 续上一篇的文章:微信小程序之商品属性分类  -- 微信小程序实战商城 ...

  5. 微信小程序分析送积分功能如何实现_微信小程序积分商城解决方案（一）

    概念 微信小程序积分商城的"积分商城"概念,是指的用户访问微信小程序经过授权用户信息或是验证注册的用户加入会员,基于微信APP环境使用微信支付等工具进行交易,推出的一种会员奖励计划 ...

  6. 微信小程序分析送积分功能如何实现_微信小程序积分商城该怎么进行操作？

    共享经济是我们这个时代特有的产物,但是现在已经出现下滑的趋势,作为线上营销的卖家,想要实现线上经济共享,还需要一定的手段才能实现,这种手段就是微信小程序积分商城,今天来带大家了解一下. 1.小程序积分 ...

  7. 想开发微信小程序分销商城需要做好哪些地方？

    想要把微信小程序分销商城做好,有很多细节的地方要注意,这里给大家分析下 第一:系统的逻辑性,好的分销商城,一定是需要强大的后台系统逻辑来实现,商业逻辑不出问题,才能保证我们使用的时候不会出错 第二:后 ...

  8. [宝塔版] 如何搭建一个微信小程序开源商城？

    如果你想做一个微信小程序商城,或者H5网页商城以及开源APP商城,你可以参考这篇文章希望能帮到你,文章主要的内容是关于云服务器安装宝塔的相关资料和来客推电商开源系统的相关配置,有相关基础的小伙伴那阅读 ...

  9. 微信小程序积分商城接入兑吧

    微信小程序积分商城接入兑吧 用户获取积分后,可进入积分通兑商城消耗用户企业积分进行兑换:提高用户满意度及用户黏性. 积分商城说明 1.兑吧的积分商城为HTML5页面,需要通过小程序的<web-v ...

最新文章

  1. ARM NEON指令集优化理论与实践
  2. 在Ubuntu中打开pycharm步骤：
  3. 神经网络-预测财产损失
  4. VS2010/MFC编程入门之二十九（常用控件：列表视图控件List Control 下）
  5. 深度学习在CTR预估中的应用 | CTR深度模型大盘点
  6. SpringMVC的简单知识
  7. android xml: xliff:g
  8. win10安装mysql5.7.15_win10上如何安装mysql5.7.16（解压缩版）
  9. UI设计素材之按钮和选框，悠闲素材帮你轻松搞定设计。
  10. 心情随笔（三）:注入新的血液
  11. 软件单元测试（Unit Test ）最佳实践
  12. 【KITTI可视化】kitti三维目标标注可视化
  13. 硬盘img镜像备份工具
  14. 政府行业数据保护方案
  15. AutoCAD哪个版本好
  16. cudnn 免Nvidia登入下载
  17. 程序员在网吧敲代码，这波操作真的太秀了！
  18. USB NCM usbnet 枚举流程代码分析
  19. 2020小迪培训（第21天 WEB 漏洞-文件上传之后端黑白名单绕过）
  20. 计算二叉树的深度和叶子结点数

热门文章

  1. IBM Installation Manager安装的几种安装方式
  2. 学习软件测试的第十九天
  3. Lottie: 让动画实现更简单
  4. 全景软件：探索数据基因，提升企业数据效能
  5. 人肉搜索：网络隐私权的侵犯与保护
  6. Codeforces Round#768(Div.2) B. Fun with Even Subarrays
  7. 亲测可用：两个在线的测试数据生成工具
  8. 你这么努力转型，就为了证明失败？——数字化陷阱系列报道（1）
  9. JAVA编程思想第四版笔记 十、内部类
  10. 使用百度翻译api制作自己的字典