msb-mca
/
shop-pc
2.1k
2
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'feature/task1.0.0-0505-ch' into feature/task1.0.0

Browse Source
merge-requests/57/head
ch 2 years ago
parent 191f13df5a 879a7bd04d
commit a7b5be58ba
6 changed files with 133 additions and 119 deletions
Show Stats Download Patch File Download Diff File

162
components/UiChosen.vue → components/BsChosen.vue
Unescape View File

@ -1,81 +1,81 @@
<template>
<div class="chosen">
<div class="chosen-title flex flex-between flex-middle">
<h3 class="chosen-title--txt">为你精选</h3>
<div class="chosen-title--btn flex" @click="getRecommendedGoodsList()">
<img src="@/assets/img/goods/each.png" alt="切换推荐" />
<span>换一组</span>
</div>
</div>
<div class="chosen-list">
<UiGoodsItem
:item="item"
v-for="item in recommendedData"
:key="item.id"
></UiGoodsItem>
</div>
</div>
</template>
<script>
import { ApiGetRecommendedGoodsList } from "@/plugins/api/goods";
import UiGoodsItem from "@/components/UiGoodsItem.vue";
export default {
components: { UiGoodsItem },
data() {
return {
recommendedData: [],
};
},
created() {
this.getRecommendedGoodsList();
},
methods: {
async getRecommendedGoodsList() {
let vm = this;
let res = await ApiGetRecommendedGoodsList();
vm.recommendedData = res.result;
},
},
};
</script>
<style lang="scss" scoped>
.chosen {
width: 100%;
padding: 30px 0 40px;
background: #f8f8f8;
&-title {
@include layout-box;
&--txt {
font-size: 24px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
}
&--btn {
width: 140px;
cursor: pointer;
img {
width: 27px;
height: 27px;
margin-right: 5px;
}
span {
font-size: 18px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #999999;
}
}
}
&-list {
@include layout-box;
padding-top: 40px;
display: grid;
grid-template-columns: repeat(auto-fill, 232px);
justify-content: space-between;
grid-row-gap: 10px;
}
}
</style>
<template>
<div class="chosen">
<div class="chosen-title flex flex-between flex-middle">
<h3 class="chosen-title--txt">为你精选</h3>
<div class="chosen-title--btn flex" @click="getRecommendedGoodsList()">
<img src="@/assets/img/goods/each.png" alt="切换推荐" />
<span>换一组</span>
</div>
</div>
<div class="chosen-list">
<UiGoodsItem
:item="item"
v-for="item in recommendedData"
:key="item.id"
></UiGoodsItem>
</div>
</div>
</template>
<script>
import { ApiGetRecommendedGoodsList } from "@/plugins/api/goods";
import UiGoodsItem from "@/components/UiGoodsItem.vue";
export default {
components: { UiGoodsItem },
data() {
return {
recommendedData: [],
};
},
created() {
this.getRecommendedGoodsList();
},
methods: {
async getRecommendedGoodsList() {
let vm = this;
let res = await ApiGetRecommendedGoodsList();
vm.recommendedData = res.result;
},
},
};
</script>
<style lang="scss" scoped>
.chosen {
width: 100%;
padding: 30px 0 40px;
background: #f8f8f8;
&-title {
@include layout-box;
&--txt {
font-size: 24px;
font-family: Microsoft YaHei-Bold, Microsoft YaHei;
font-weight: bold;
color: #333333;
}
&--btn {
width: 140px;
cursor: pointer;
img {
width: 27px;
height: 27px;
margin-right: 5px;
}
span {
font-size: 18px;
font-family: Microsoft YaHei-Regular, Microsoft YaHei;
font-weight: 400;
color: #999999;
}
}
}
&-list {
@include layout-box;
padding-top: 40px;
display: grid;
grid-template-columns: repeat(auto-fill, 232px);
justify-content: space-between;
grid-row-gap: 10px;
}
}
</style>

10
components/UiRadio.vue
Unescape View File

@ -1,10 +0,0 @@
<!--
* @Author: ch
* @Date: 2022-05-07 22:57:24
* @LastEditors: ch
* @LastEditTime: 2022-05-07 22:57:39
* @Description: file content
-->
<template>
<el-radio/>
</template>

2
pages/account/index.vue
Unescape View File

@ -2,7 +2,7 @@
* @Author: ch
* @Date: 2022-05-08 17:48:36
* @LastEditors: ch
* @LastEditTime: 2022-05-10 12:19:04
* @LastEditTime: 2022-05-12 19:42:49
* @Description: file content
-->
<template>

42
pages/cart/index.vue
Unescape View File

@ -2,12 +2,13 @@
* @Author: ch
* @Date: 2022-05-03 22:41:15
* @LastEditors: ch
* @LastEditTime: 2022-05-12 17:36:08
* @LastEditTime: 2022-05-12 19:40:43
* @Description: file content
-->
<template>
<div>
<UiEmpty v-if="!isLoading && !list.length" desc="购物车空空如也，去挑点喜欢的好货吧~" :icon="require('@/assets/img/cart/empty.png')">
<UiEmpty v-if="!isLoading && !list.length" desc="购物车空空如也，去挑点喜欢的好货吧~"
:icon="require('@/assets/img/cart/empty.png')">
<UiButton type="grey" @click="$router.push('/')">去逛逛</UiButton>
</UiEmpty>
<UiLoading v-if="isLoading" ></UiLoading>
@ -32,22 +33,21 @@
<tbody>
<tr v-for="item in list" :key="item.id" :class="item.status !== 'normal' && 'disable'">
<td width="50">
<el-checkbox v-if="item.status === 'normal'" :label="item.id" class="checkbox"></el-checkbox>
<el-checkbox v-if="item.status === 'normal'" :label="item.id" class="checkbox" />
<span v-else class="tag">失效</span>
</td>
<td>
<UIGoodsInfo :goods="item"></UIGoodsInfo>
<UIGoodsInfo :goods="item" />
</td>
<td width="115">
<UiMoney :money="item.productSku ? item.productSku.sellPrice : 0"></UiMoney>
<UiMoney :money="item.productSku ? item.productSku.sellPrice : 0" />
</td>
<td width="115">
<el-input-number :value="item.number" @change="onChangeStepper($event, item)"
:min="1" :max="item.maxBuyNum" size="mini">
</el-input-number>
:min="1" :max="item.maxBuyNum" size="mini" />
</td>
<td width="115">
<UiMoney :money="item.totalPrice"></UiMoney>
<UiMoney :money="item.totalPrice" />
</td>
<td width="115">
<a @click="handleDelete(item.id)" class="del">删除</a>
@ -58,33 +58,35 @@
</el-checkbox-group>
<div class="operation">
<div>
<el-checkbox label="全选" @change="handleCheckAll"
v-model="checkAll" :indeterminate="isIndeterminate"></el-checkbox>
<el-checkbox label="全选" @change="handleCheckAll" v-model="checkAll" :indeterminate="isIndeterminate" />
<a @click="handleDelete()" class="operation--del">批量删除</a>
</div>
<div class="operation--right">
<p>已选<span class="operation--count">{{checkedIds.length}}</span>件</p>
<p class="operation--total">总计：
<UiMoney class="operation--total-price" :money="totalPrice"
size="20px" float prefix preSize="14px"/>
<p class="operation--total">
总计：
<UiMoney class="operation--total-price" size="20px" float prefix preSize="14px"
:money="totalPrice"/>
</p>
<UiButton class="operation--settlement" @click="settlement" :disabled="!checkedIds.length">去结算</UiButton>
</div>
</div>
</div>
<BsChosen></BsChosen>
</div>
</template>
<script>
import {ApiGetCartList, ApiDeleteCartGoods, ApiPutCartNum} from '@/plugins/api/cart';
import {Debounce} from '@/plugins/utils';
import UIGoodsInfo from '../../components/UIGoodsInfo.vue';
import UiButton from '../../components/UiButton.vue';
import UiMoney from '../../components/UiMoney.vue';
import UiEmpty from '../../components/UiEmpty.vue';
import UiLoading from '../../components/UiLoading.vue';
import UIGoodsInfo from '@/components/UIGoodsInfo.vue';
import UiButton from '@/components/UiButton.vue';
import UiMoney from '@/components/UiMoney.vue';
import UiEmpty from '@/components/UiEmpty.vue';
import UiLoading from '@/components/UiLoading.vue';
import BsChosen from '@/components/BsChosen.vue';
export default {
components: { UIGoodsInfo, UiButton, UiMoney, UiEmpty, UiLoading },
components: { UIGoodsInfo, UiButton, UiMoney, UiEmpty, UiLoading, BsChosen },
data(){
return {
isLoading : false,
@ -104,7 +106,6 @@ export default {
tempPrice += unitPrice * (item.number || 0)
});
return (tempPrice / 100).toFixed(2);
},
// 正常可结算的商品
normalList(){
@ -276,6 +277,7 @@ export default {
td{
text-align: center;
padding: 40px 0;
border-bottom: 1px solid #ddd;
}
}
.operation{

30
pages/goods/detail/_id.vue
Unescape View File

@ -136,7 +136,7 @@
<span>此商品暂无库存啦~看看其他的吧</span>
</div>
<div class="main__details-pay">
<UiButton type="yellow_line">加入购物车</UiButton>
<UiButton type="yellow_line" @click="addCart">加入购物车</UiButton>
<UiButton type="yellow_panel" @click="buyNow">立即购买</UiButton>
</div>
</article>
@ -168,21 +168,22 @@
</div>
</div>
</section>
<UiChosen v-else></UiChosen>
<BsChosen v-else></BsChosen>
</div>
</template>
<script>
import UiMoney from "@/components/UiMoney.vue";
import UiButton from "@/components/UiButton.vue";
import UiGoodsItem from "@/components/UiGoodsItem.vue";
import UiChosen from "@/components/UiChosen.vue";
import BsChosen from "@/components/BsChosen.vue";
import {ApiPutAddCart} from "@/plugins/api/cart";
import {
ApiGetGoodsDetail,
ApiGetGoodsSkus,
ApiGetRecommendedGoodsList,
} from "@/plugins/api/goods";
export default {
componetns: { UiMoney, UiButton, UiGoodsItem, UiChosen },
componetns: { UiMoney, UiButton, UiGoodsItem, BsChosen },
data() {
return {
curBuyNum: 1,
@ -424,6 +425,27 @@ export default {
query,
});
},
/**
* 加入购物车
*/
async addCart(){
if(!this.curSku.skuId){
this.$message.error("请选择规格~");
return false;
}
const {error, result} = await ApiPutAddCart({
productSkuId : this.curSku.skuId,
productId : this.detailData.id,
number : this.curBuyNum
});
if(error){
this.$message.error(error.message);
return false;
}
this.$message.success('加入购物车成功~');
// this.$Router.push('/cart');
},
},
};
</script>

6
pages/goods/list/index.vue
Unescape View File

@ -70,7 +70,7 @@
<img class="main-none-img" src="@/assets/img/goods/none.png" alt="" />
<p class="main-none-txt">没有搜到你想要的商品哦，换个关键词试试</p>
</main>
<UiChosen></UiChosen>
<BsChosen></BsChosen>
</div>
</template>
<script>
@ -81,9 +81,9 @@ import {
} from "@/plugins/api/goods";
import Sort from "./module/SortItem.vue";
import UiGoodsItem from "@/components/UiGoodsItem.vue";
import UiChosen from '@/components/UiChosen.vue';
import BsChosen from '@/components/BsChosen.vue';
export default {
components: { Sort, UiGoodsItem,UiChosen },
components: { Sort, UiGoodsItem,BsChosen },
data() {
return {
navActive: 0,

Write Preview
Loading…
Cancel
Save