购物车bug修改重构

吉鹏
1 parent 7c4ec59325
Showing 2 changed files with 41 additions and 64 deletions Show diff stats
src/pages/cart/cart.vue
src/store/modules/cart.js
@@ -25,8 +25,8 @@
           @longpress="delCart(item.cart_id,index)"
         >
           <view
-            v-bind:class="childIsOpenArr[index]? 'partentChecked':'partentCheck'"
-			@click="childClick(index)"
+            v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"
+			@click="childClick(cartList[index],index)"
           >
             <span class="correct"></span>
           </view>
@@ -110,84 +110,57 @@ export default {
 		sk_id:String,
 		mp_id:String,
 		isShowBottom : false,	//底部弹窗开关
-		// totalPrice: 0,
-		pIsoPen: Boolean,
-		childIsOpenArr:[],
 		cart_id:Number,
 		maxCount: 20,
-		cartIndex:Number
+		cartIndex:Number,
+		cartList:[]
     }
   },
   computed: {
-
+	pIsoPen (){
+		if (this.cartList.length > 0){
+			return this.cartList.find(item => !item.isChecked) ? false : true;
+		}
+		return false
+	},
 	goodInfo () {
 	  return this.$store.state.read.goodInfo
 	},
-    cartList() {
-      return this.$store.state.cart.cartList
-    },
-	totalPrice() {
-		const itemPriceArr = []
-		this.cartList.map(item =>{
-			itemPriceArr.push(item.num*item.nowPrice)
+	totalPrice() {
+		let totalPrice = 0
+		this.cartList.forEach((item)=>{
+			 if(item.isChecked){
+				totalPrice += item.nowPrice * item.num;
+			 }
 		})
-		let total = 0
-		if(this.pIsoPen){
-			itemPriceArr.map(item =>{
-				total += item
-			})
-		}else{
-			this.childIsOpenArr.map((item,index) =>{
-				if(item){
-					total += itemPriceArr[index]
-				}
-			})
-		}
-		return total
-	},
-
-  },
-  onShow() {
+		return totalPrice
+	}
   },
-  onLoad: function() {
-	  //全选置否
-  	this.pIsoPen = false
-    store.dispatch('cart/getCartList', {
+  onLoad: async function() {
+    await this.$store.dispatch('cart/getCartList', {
       uid: this.$store.state.user.userInfo.uid, // 用户id
-    })
-	.then((res)=>{
-		//单选置否
-		  const temp = []
-		  temp.length = this.$store.state.cart.cartList.length
-		  for (let i = 0; i < temp.length; i++) {
-		    temp[i] = false
-		  }
-		  this.childIsOpenArr = temp
+    })
+	
+	this.cartList = this.$store.state.cart.cartList;
+	this.cartList.forEach((item)=>{
+		 item.isChecked = false
 	})
   },
   methods: {
 	  //全选按钮
-	  pClick(){
-		  if(this.pIsoPen){
-			  this.pIsoPen = false
-			  this.childIsOpenArr.map((item,index)=> {
-				  this.childIsOpenArr[index] = false
-			  })
-		  }else{
-			  this.pIsoPen = true
-			  this.childIsOpenArr.map((item,index)=> {
-				  this.childIsOpenArr[index] = true
-			  })
-		  }
+	  pClick(){
+		  let pStatus = this.cartList.find(item => !item.isChecked) ? false : true
+		  let oldList = this.cartList;
+		  oldList.forEach((item, index)=>{
+		  	 item.isChecked = !pStatus
+			  this.cartList.splice(index,1, item)
+		  })
 	  },
 	  //单选按钮
-	  childClick(index){
-		  this.childIsOpenArr[index] = !this.childIsOpenArr[index]
-		  if(this.childIsOpenArr.find(item => item == false)==undefined){
-			  this.pIsoPen = true
-		  }else{
-			  this.pIsoPen = false
-		  }
+	  childClick(type,index){
+		  this.cartList[index].isChecked = !this.cartList[index].isChecked
+		  //vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发
+		  this.cartList.splice(index,1, this.cartList[index])
 	  },
 	  //修改购物车
 	  chooseCartModi(mp_id,sk_id,price,pid,num,cart_id,index){
@@ -30,7 +30,11 @@ const actions = {
       url: cartList,
       data: param,
       success: (res) => {
-        console.log('cart===>接口数据', res.data.data)
+		let test = {
+			isChecked: false,
+			itemNum:1,
+			price:0
+		}
         commit('INIT', res.data.data)
 		resolve(res.data.data)
       },
...	...	@@ -25,8 +25,8 @@
25	25	@longpress="delCart(item.cart_id,index)"
26	26	>
27	27	<view
28		- v-bind:class="childIsOpenArr[index]? 'partentChecked':'partentCheck'"
29		- @click="childClick(index)"
	28	+ v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"
	29	+ @click="childClick(cartList[index],index)"
30	30	>
31	31	<span class="correct"></span>
32	32	</view>
...	...	@@ -110,84 +110,57 @@ export default {
110	110	sk_id:String,
111	111	mp_id:String,
112	112	isShowBottom : false, //底部弹窗开关
113		- // totalPrice: 0,
114		- pIsoPen: Boolean,
115		- childIsOpenArr:[],
116	113	cart_id:Number,
117	114	maxCount: 20,
118		- cartIndex:Number
	115	+ cartIndex:Number,
	116	+ cartList:[]
119	117	}
120	118	},
121	119	computed: {
122		-
	120	+ pIsoPen (){
	121	+ if (this.cartList.length > 0){
	122	+ return this.cartList.find(item => !item.isChecked) ? false : true;
	123	+ }
	124	+ return false
	125	+ },
123	126	goodInfo () {
124	127	return this.$store.state.read.goodInfo
125	128	},
126		- cartList() {
127		- return this.$store.state.cart.cartList
128		- },
129		- totalPrice() {
130		- const itemPriceArr = []
131		- this.cartList.map(item =>{
132		- itemPriceArr.push(item.num*item.nowPrice)
	129	+ totalPrice() {
	130	+ let totalPrice = 0
	131	+ this.cartList.forEach((item)=>{
	132	+ if(item.isChecked){
	133	+ totalPrice += item.nowPrice * item.num;
	134	+ }
133	135	})
134		- let total = 0
135		- if(this.pIsoPen){
136		- itemPriceArr.map(item =>{
137		- total += item
138		- })
139		- }else{
140		- this.childIsOpenArr.map((item,index) =>{
141		- if(item){
142		- total += itemPriceArr[index]
143		- }
144		- })
145		- }
146		- return total
147		- },
148		-
149		- },
150		- onShow() {
	136	+ return totalPrice
	137	+ }
151	138	},
152		- onLoad: function() {
153		- //全选置否
154		- this.pIsoPen = false
155		- store.dispatch('cart/getCartList', {
	139	+ onLoad: async function() {
	140	+ await this.$store.dispatch('cart/getCartList', {
156	141	uid: this.$store.state.user.userInfo.uid, // 用户id
157		- })
158		- .then((res)=>{
159		- //单选置否
160		- const temp = []
161		- temp.length = this.$store.state.cart.cartList.length
162		- for (let i = 0; i < temp.length; i++) {
163		- temp[i] = false
164		- }
165		- this.childIsOpenArr = temp
	142	+ })
	143	+
	144	+ this.cartList = this.$store.state.cart.cartList;
	145	+ this.cartList.forEach((item)=>{
	146	+ item.isChecked = false
166	147	})
167	148	},
168	149	methods: {
169	150	//全选按钮
170		- pClick(){
171		- if(this.pIsoPen){
172		- this.pIsoPen = false
173		- this.childIsOpenArr.map((item,index)=> {
174		- this.childIsOpenArr[index] = false
175		- })
176		- }else{
177		- this.pIsoPen = true
178		- this.childIsOpenArr.map((item,index)=> {
179		- this.childIsOpenArr[index] = true
180		- })
181		- }
	151	+ pClick(){
	152	+ let pStatus = this.cartList.find(item => !item.isChecked) ? false : true
	153	+ let oldList = this.cartList;
	154	+ oldList.forEach((item, index)=>{
	155	+ item.isChecked = !pStatus
	156	+ this.cartList.splice(index,1, item)
	157	+ })
182	158	},
183	159	//单选按钮
184		- childClick(index){
185		- this.childIsOpenArr[index] = !this.childIsOpenArr[index]
186		- if(this.childIsOpenArr.find(item => item == false)==undefined){
187		- this.pIsoPen = true
188		- }else{
189		- this.pIsoPen = false
190		- }
	160	+ childClick(type,index){
	161	+ this.cartList[index].isChecked = !this.cartList[index].isChecked
	162	+ //vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发
	163	+ this.cartList.splice(index,1, this.cartList[index])
191	164	},
192	165	//修改购物车
193	166	chooseCartModi(mp_id,sk_id,price,pid,num,cart_id,index){
...	...
...	...	@@ -30,7 +30,11 @@ const actions = {
30	30	url: cartList,
31	31	data: param,
32	32	success: (res) => {
33		- console.log('cart===>接口数据', res.data.data)
	33	+ let test = {
	34	+ isChecked: false,
	35	+ itemNum:1,
	36	+ price:0
	37	+ }
34	38	commit('INIT', res.data.data)
35	39	resolve(res.data.data)
36	40	},
...	...