編輯? ：? ?數(shù)量加減? ?價(jià)格匯總? 數(shù)據(jù)清空
mina/pages/cart/index.wxml
<!--index.wxml-->
<view class="container">
<view class="title-box" wx:if="{{ !list.length }}">
購物車空空如也～
</view>
<view class="to-index-btn" bindtap="toIndexPage" wx:if="{{ !list.length }}">
去逛逛
</view>
<view class="list-top" wx:if="{{ list.length }}">
<view class="label">購物車</view>
<view class="edit-btn" hidden="{{!saveHidden}}" bindtap="editTap">編輯</view>
<view class="edit-btn" hidden="{{saveHidden}}" bindtap="saveTap">完成</view>
</view>
<view class="goodsList" wx:if="{{ list.length }}">
<view class="a-gooods" wx:for="{{ list }}" wx:key="{{index}}" >
<view class="a-goods-conts {{item.active? 'active':''}}" bindtap="selectTap" data-index="{{index}}">
<view class="goods-info">
<view class="img-box">
<image src="{{item.pic_url}}" class="img"/>
</view>
<view class="text-box">
<view class="goods-title">{{item.name}}</view>
<view class="goods-price">￥ {{item.price}}</view>
<view class="buy-num">
<view class="jian-btn" catchtap="jianBtnTap" data-index="{{index}}">-</view>
<input type="number" value="{{item.number}}" disabled/>
<view class="jia-btn" catchtap="jiaBtnTap" data-index="{{index}}">+</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="jiesuan-box" wx:if="{{ list.length }}">
<view class="left-price">
<view class="all-selected {{allSelect?'active':''}}" bindtap="bindAllSelect">全選</view>
<view class="total" hidden="{{noSelect}}">合計(jì)：￥ {{totalPrice}}</view>
</view>
<view class="to-pay-btn {{noSelect?'no-select':''}}" hidden="{{!saveHidden}}" bindtap="toPayOrder">去結(jié)算</view>
<view class="to-pay-btn {{noSelect?'no-select':''}}" hidden="{{saveHidden}}" bindtap="deleteSelected">刪除</view>
</view>
</view>
知識(shí)點(diǎn)1: <view class="jian-btn" catchtap="jianBtnTap" data-index="{{index}}">
是一個(gè)微信小程序中的一個(gè)視圖組件，具有以下特點(diǎn)：
-
class="jian-btn"：該組件的樣式類名為jian-btn，可以通過CSS樣式表對(duì)其進(jìn)行樣式設(shè)置。 -
catchtap="jianBtnTap"：該組件綁定了一個(gè)catchtap事件，當(dāng)用戶點(diǎn)擊該組件時(shí)，會(huì)觸發(fā)名為jianBtnTap的事件處理函數(shù)。微信小程序 事件_w3cschool -
data-index="{{index}}"：該組件設(shè)置了一個(gè)自定義屬性data-index，其值為{{index}}，可以在事件處理函數(shù)中獲取該屬性的值。
根據(jù)提供的信息，這個(gè)組件可能是一個(gè)按鈕，當(dāng)用戶點(diǎn)擊該按鈕時(shí)，會(huì)觸發(fā)jianBtnTap事件處理函數(shù)，并且可以通過data-index屬性傳遞一些額外的數(shù)據(jù)。
請(qǐng)注意，以上是根據(jù)提供的引用內(nèi)容推測的答案，具體的功能和效果還需要根據(jù)實(shí)際代碼和上下文來確定。
mina/pages/cart/index.js
//index.js
var app = getApp();
Page({
data: {},
onLoad: function () {
},
onShow:function(){
this.getCartList();
},
//每項(xiàng)前面的選中框
selectTap: function (e) {
var index = e.currentTarget.dataset.index;
var list = this.data.list;
if (index !== "" && index != null) {
list[ parseInt(index) ].active = !list[ parseInt(index) ].active;
this.setPageData(this.getSaveHide(), this.totalPrice(), this.allSelect(), this.noSelect(), list);
}
},
//計(jì)算是否全選了
allSelect: function () {
var list = this.data.list;
var allSelect = false;
for (var i = 0; i < list.length; i++) {
var curItem = list[i];
if (curItem.active) {
allSelect = true;
} else {
allSelect = false;
break;
}
}
return allSelect;
},
//計(jì)算是否都沒有選
noSelect: function () {
var list = this.data.list;
var noSelect = 0;
for (var i = 0; i < list.length; i++) {
var curItem = list[i];
if (!curItem.active) {
noSelect++;
}
}
if (noSelect == list.length) {
return true;
} else {
return false;
}
},
//全選和全部選按鈕
bindAllSelect: function () {
var currentAllSelect = this.data.allSelect;
var list = this.data.list;
for (var i = 0; i < list.length; i++) {
list[i].active = !currentAllSelect;
}
this.setPageData(this.getSaveHide(), this.totalPrice(), !currentAllSelect, this.noSelect(), list);
},
//加數(shù)量
jiaBtnTap: function (e) {
var that = this;
var index = e.currentTarget.dataset.index;
var list = that.data.list;
list[parseInt(index)].number++;
that.setPageData(that.getSaveHide(), that.totalPrice(), that.allSelect(), that.noSelect(), list);
this.setCart( list[parseInt(index)].food_id,list[parseInt(index)].number );
},
//減數(shù)量
jianBtnTap: function (e) {
var index = e.currentTarget.dataset.index;
var list = this.data.list;
if (list[parseInt(index)].number > 1) {
list[parseInt(index)].number--;
this.setPageData(this.getSaveHide(), this.totalPrice(), this.allSelect(), this.noSelect(), list);
this.setCart( list[parseInt(index)].food_id,list[parseInt(index)].number );
}
},
//編輯默認(rèn)全不選
editTap: function () {
var list = this.data.list;
for (var i = 0; i < list.length; i++) {
var curItem = list[i];
curItem.active = false;
}
this.setPageData(!this.getSaveHide(), this.totalPrice(), this.allSelect(), this.noSelect(), list);
},
//選中完成默認(rèn)全選
saveTap: function () {
var list = this.data.list;
for (var i = 0; i < list.length; i++) {
var curItem = list[i];
curItem.active = true;
}
this.setPageData(!this.getSaveHide(), this.totalPrice(), this.allSelect(), this.noSelect(), list);
},
getSaveHide: function () {
return this.data.saveHidden;
},
totalPrice: function () {
var list = this.data.list;
var totalPrice = 0.00;
for (var i = 0; i < list.length; i++) {
if ( !list[i].active) {
continue;
}
totalPrice = totalPrice + parseFloat( list[i].price ) * list[i].number;
}
return totalPrice;
},
setPageData: function (saveHidden, total, allSelect, noSelect, list) {
this.setData({
list: list,
saveHidden: saveHidden,
totalPrice: total,
allSelect: allSelect,
noSelect: noSelect,
});
},
//去結(jié)算
toPayOrder: function () {
var data = {
type:"cart",
goods: []
};
var list = this.data.list;
for (var i = 0; i < list.length; i++) {
if ( !list[i].active) {
continue;
}
data['goods'].push({
"id": list[i].food_id,
"price": list[i].price,
"number": list[i].number
});
}
wx.navigateTo({
url: "/pages/order/index?data=" + JSON.stringify(data)
});
},
//如果沒有顯示去光光按鈕事件
toIndexPage: function () {
wx.switchTab({
url: "/pages/food/index"
});
},
//選中刪除的數(shù)據(jù)
deleteSelected: function () {
var list = this.data.list;
var goods = [];
list = list.filter(function ( item ) {
if( item.active ){
goods.push( {
"id":item.food_id
} )
}
return !item.active;
});
this.setPageData( this.getSaveHide(), this.totalPrice(), this.allSelect(), this.noSelect(), list);
//發(fā)送請(qǐng)求到后臺(tái)刪除數(shù)據(jù)
wx.request({
url: app.buildUrl("/cart/del"),
header: app.getRequestHeader(),
method: 'POST',
data: {
goods: JSON.stringify( goods )
},
success: function (res) {
}
});
},
getCartList: function () {
var that = this;
wx.request({
url: app.buildUrl("/cart/index"),
header: app.getRequestHeader(),
success: function (res) {
var resp = res.data;
if (resp.code != 200) {
app.alert({"content": resp.msg});
return;
}
that.setData({
list:resp.data.list,
saveHidden: true,
totalPrice: 0.00,
allSelect: true,
noSelect: false
});
that.setPageData(that.getSaveHide(), that.totalPrice(), that.allSelect(), that.noSelect(), that.data.list);
}
});
},
setCart:function( food_id, number ){
var that = this;
var data = {
"id": food_id,
"number": number
};
wx.request({
url: app.buildUrl("/cart/set"),
header: app.getRequestHeader(),
method: 'POST',
data: data,
success: function (res) {
}
});
}
});
setCart 數(shù)據(jù)統(tǒng)一提交
問題1： .push()
JavaScript push() 方法_w3cschool? ? ?類似python中append
push() 方法可向數(shù)組的末尾添加一個(gè)或多個(gè)元素，并返回新的長度。
注意：?新元素將添加在數(shù)組的末尾。
注意：?此方法改變數(shù)組的長度。
提示：?在數(shù)組起始位置添加元素請(qǐng)使用?unshift()?方法。
問題2:? JSON.stringify(? )
JSON.stringify()方法用于將JavaScript對(duì)象轉(zhuǎn)換為JSON字符串。
下面是一個(gè)關(guān)于goods對(duì)象的例子：
const goods = {
name: "Apple",
price: 2.99,
quantity: 10
};
const jsonString = JSON.stringify(goods);
console.log(jsonString);輸出結(jié)果為：
{"name":"Apple","price":2.99,"quantity":10}這里，goods對(duì)象被轉(zhuǎn)換為了一個(gè)JSON字符串，其中包含了對(duì)象的屬性和對(duì)應(yīng)的值。注意，JSON.stringify()方法會(huì)自動(dòng)將對(duì)象的屬性名和屬性值轉(zhuǎn)換為字符串，并且會(huì)忽略掉不可枚舉的屬性。
web/controllers/api/Cart.py
# -*- coding: utf-8 -*-
from web.controllers.api import route_api
from flask import request,jsonify,g
from common.models.food.Food import Food
from common.models.member.MemberCart import MemberCart
from common.libs.member.CartService import CartService
from common.libs.Helper import selectFilterObj,getDictFilterField
from common.libs.UrlManager import UrlManager
from application import app,db
import json
@route_api.route("/cart/index")
def cartIndex():
resp = {'code': 200, 'msg': '添加購物車成功~', 'data': {}}
member_info = g.member_info
if not member_info:
resp['code'] = -1
resp['msg'] = "獲取失敗，偽登錄~~"
return jsonify(resp)
cart_list = MemberCart.query.filter_by( member_id=member_info.id).all()
data_cart_list = []
if cart_list:
food_ids = selectFilterObj( cart_list,"food_id" )
food_map = getDictFilterField( Food,Food.id,"id",food_ids )
for item in cart_list:
tmp_food_info = food_map[ item.food_id ]
tmp_data = {
"id":item.id,
"number":item.quantity,
"food_id": item.food_id,
"name":tmp_food_info.name,
"price":str( tmp_food_info.price ),
"pic_url": UrlManager.buildImageUrl( tmp_food_info.main_image ),
"active":True
}
data_cart_list.append( tmp_data )
resp['data']['list'] = data_cart_list
return jsonify(resp)
@route_api.route("/cart/set", methods=["POST"])
def setCart():
resp = {'code': 200, 'msg': '添加購物車成功~', 'data': {}}
req = request.values
food_id = int(req['id']) if 'id' in req else 0
number = int(req['number']) if 'number' in req else 0
if food_id < 1 or number < 1:
resp['code'] = -1
resp['msg'] = "添加購物車失敗-1~~"
return jsonify(resp)
member_info = g.member_info
if not member_info:
resp['code'] = -1
resp['msg'] = "添加購物車失敗-2~~"
return jsonify(resp)
food_info = Food.query.filter_by( id = food_id ).first()
if not food_info:
resp['code'] = -1
resp['msg'] = "添加購物車失敗-3~~"
return jsonify(resp)
if food_info.stock < number:
resp['code'] = -1
resp['msg'] = "添加購物車失敗,庫存不足~~"
return jsonify(resp)
ret = CartService.setItems( member_id=member_info.id,food_id = food_info.id,number = number )
if not ret:
resp['code'] = -1
resp['msg'] = "添加購物車失敗-4~~"
return jsonify(resp)
return jsonify(resp)
@route_api.route("/cart/del", methods=["POST"])
def delCart():
resp = {'code': 200, 'msg': '添加購物車成功~', 'data': {}}
req = request.values
params_goods = req['goods'] if 'goods' in req else None
items = []
if params_goods:
items = json.loads(params_goods)
if not items or len( items ) < 1:
return jsonify(resp)
member_info = g.member_info
if not member_info:
resp['code'] = -1
resp['msg'] = "刪除購物車失敗-1~~"
return jsonify(resp)
ret = CartService.deleteItem( member_id = member_info.id, items = items )
if not ret:
resp['code'] = -1
resp['msg'] = "刪除購物車失敗-2~~"
return jsonify(resp)
return jsonify(resp)@route_api.route("/cart/del", methods=["POST"])
問題1： json.loads()
json.loads()是Python標(biāo)準(zhǔn)庫json模塊中的一個(gè)方法，用于將JSON字符串轉(zhuǎn)換為Python數(shù)據(jù)類型。它的使用方法如下所示：
import json
json_str = '{"name": "John", "age": 30, "city": "New York"}'
data = json.loads(json_str)
print(data) # 輸出：{'name': 'John', 'age': 30, 'city': 'New York'}在上面的例子中，我們首先導(dǎo)入了json模塊。然后，我們定義了一個(gè)JSON字符串json_str，其中包含了一個(gè)名為"name"的鍵和對(duì)應(yīng)的值"John"，一個(gè)名為"age"的鍵和對(duì)應(yīng)的值30，以及一個(gè)名為"city"的鍵和對(duì)應(yīng)的值"New York"。接下來，我們使用json.loads()方法將JSON字符串轉(zhuǎn)換為Python數(shù)據(jù)類型，并將結(jié)果賦值給變量data。最后，我們打印出data的值，即轉(zhuǎn)換后的Python字典。文章來源：http://www.zghlxwxcb.cn/news/detail-816306.html
需要注意的是，json.loads()只適用于讀取JSON字符串，如果想要從JSON文件中讀取數(shù)據(jù)，請(qǐng)使用json.load()方法。文章來源地址http://www.zghlxwxcb.cn/news/detail-816306.html
common/libs/Helper.py
# -*- coding: utf-8 -*-
import hashlib,requests,random,string,json
from application import app,db
from common.models.member.MemberCart import MemberCart
from common.libs.Helper import getCurrentDate
class CartService():
@staticmethod
def deleteItem( member_id = 0,items = None ):
if member_id < 1 or not items:
return False
for item in items:
MemberCart.query.filter_by( food_id = item['id'],member_id = member_id ).delete()
db.session.commit()
return True
@staticmethod
def setItems( member_id = 0,food_id = 0,number = 0 ):
if member_id < 1 or food_id < 1 or number < 1:
return False
cart_info = MemberCart.query.filter_by( food_id = food_id, member_id= member_id ).first()
if cart_info:
model_cart = cart_info
else:
model_cart = MemberCart()
model_cart.member_id = member_id
model_cart.created_time = getCurrentDate()
model_cart.food_id = food_id
model_cart.quantity = number
model_cart.updated_time = getCurrentDate()
db.session.add(model_cart)
db.session.commit()
return True
到了這里，關(guān)于flask 與小程序 購物車刪除和編輯庫存功能的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
