yudao
/
mall-uniapp
mirror of https://gitee.com/yudaocode/yudao-mall-uniapp.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

商品详情.评价页面.购物车页面.首页轮播图.搜索功能.分类接口

pull/9/head
落日晚风 2023-10-31 17:41:57 +08:00
parent 6a327ac0e7
commit f4c1b30f2e
14 changed files with 496 additions and 470 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
pages/goods/comment/list.vue
View File

@ -1,33 +1,29 @@
<!-- 页面 -->
<template>
<s-layout title="全部评价">
<su-tabs
:list="state.type"
:scrollable="false"
@change="onTabsChange"
:current="state.currentTab"
></su-tabs>
<su-tabs :list="state.type" :scrollable="false" @change="onTabsChange" :current="state.currentTab"></su-tabs>
<view class="ss-m-t-20">
<view class="list-item" v-for="item in state.pagination.data" :key="item">
<comment-item :item="item"></comment-item>
</view>
</view>
<s-empty v-if="state.pagination.total === 0" text="暂无数据" icon="/static/data-empty.png" />
<uni-load-more
v-if="state.pagination.total > 0"
:status="state.loadStatus"
:content-text="{
<uni-load-more v-if="state.pagination.total > 0" :status="state.loadStatus" :content-text="{
contentdown: '上拉加载更多',
}"
@tap="loadmore"
/>
}" @tap="loadmore" />
</s-layout>
</template>
<script setup>
import sheep from '@/sheep';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { computed, reactive } from 'vue';
import {
onLoad,
onReachBottom
} from '@dcloudio/uni-app';
import {
computed,
reactive
} from 'vue';
import _ from 'lodash';
import commentItem from '../components/detail/comment-item.vue';
@ -48,7 +44,7 @@
last_page: 1,
},
commentId: 0,
code: 'all',
code: 0,
});
// 切换选项卡
function onTabsChange(e) {
@ -58,20 +54,26 @@
getList(state.commentId, e.code);
}
async function getType(id) {
const { error, data } = await sheep.$api.goods.getType(id);
const {
error,
data
} = await sheep.$api.goods.getType(id);
if (error === 0) {
state.type = data;
console.log(data)
// state.type = data;
state.type = [{code:0,name:'全部'},{code:1,name:'好评'},{code:2,name:'中评'},{code:3,name:'差评'}];
}
}
async function getList(id, code, page = 1, list_rows = 6) {
async function getList(id, code=0, page = 1, list_rows = 6) {
state.loadStatus = 'loading';
let res = await sheep.$api.goods.comment(id, {
let res = await sheep.$api.goods.comment2(id, {
type: code,
list_rows,
page,
pageSize: list_rows,
pageNo: page,
});
if (res.error === 0) {
let orderList = _.concat(state.pagination.data, res.data.data);
console.log(res);
if (res.code === 0) {
let orderList = _.concat(state.pagination.data, res.data.list);
state.pagination = {
...res.data,
data: orderList,
@ -104,35 +106,42 @@
.list-item {
padding: 32rpx 30rpx 20rpx 20rpx;
background: #fff;
.avatar {
width: 52rpx;
height: 52rpx;
border-radius: 50%;
}
.nickname {
font-size: 26rpx;
font-weight: 500;
color: #999999;
}
.create-time {
font-size: 24rpx;
font-weight: 500;
color: #c4c4c4;
}
.content-title {
font-size: 26rpx;
font-weight: 400;
color: #666666;
line-height: 42rpx;
}
.content-img {
width: 174rpx;
height: 174rpx;
}
.cicon-info-o {
font-size: 26rpx;
color: #c4c4c4;
}
.foot-title {
font-size: 24rpx;
font-weight: 500;
@ -146,6 +155,7 @@
background: #fff;
border-top: 2rpx solid #eee;
}
.tab-btn {
width: 130rpx;
height: 62rpx;

8
pages/goods/components/detail/comment-item.vue
View File

@ -5,19 +5,19 @@
<image class="avatar" :src="sheep.$url.cdn(item.user_avatar)"></image>
</view>
<view class="nickname ss-m-r-20">
{{ item.user_nickname }}
{{ item.userNickname }}
</view>
<view class="">
<uni-rate :readonly="true" v-model="item.level" size="18" />
<uni-rate :readonly="true" v-model="item.scores" size="18" />
</view>
</view>
<view class="content">
{{ item.content }}
</view>
<view class="ss-m-t-24" v-if="item.images?.length">
<view class="ss-m-t-24" v-if="item.picUrls?.length">
<scroll-view class="scroll-box" scroll-x scroll-anchoring>
<view class="ss-flex">
<view v-for="(item, index) in item.images" :key="item" class="ss-m-r-10">
<view v-for="(item, index) in item.picUrls" :key="item" class="ss-m-r-10">
<su-image class="content-img" isPreview :previewList="state.commentImages" :current="index" :src="item"
:height="120" :width="120" mode="aspectFill"></su-image>
</view>

4
pages/goods/components/detail/detail-comment-card.vue
View File

@ -47,9 +47,9 @@
const { data } = await sheep.$api.goods.comment(id, {
list_rows: 3,
});
console.log(data)
const {data:datas} = await sheep.$api.goods.comment2(id);
state.commentList = data;
state.total = data.total;
state.total = datas.total;
}
onBeforeMount(() => {
getComment(props.goodsId);

2
pages/goods/index.vue
View File

@ -95,7 +95,7 @@
<!-- 评价 -->
<detail-comment-card class="detail-comment-selector" :goodsId="state.goodsId" />
<!-- 详情 -->
<detail-content-card class="detail-content-selector" :content="state.goodsInfo.content" />
<detail-content-card class="detail-content-selector" :content="state.goodsInfo.description" />
<!-- 活动跳转 -->
<detail-activity-tip

8
pages/goods/list.vue
View File

@ -261,12 +261,12 @@
sort: Sort,
order: Order,
category_id: !keyword ? categoryId : '',
list_rows,
pageSize:list_rows,
keyword: keyword,
page,
pageNo:page,
});
if (res.error === 0) {
let couponList = _.concat(state.pagination.data, res.data.data);
if (res.code === 0) {
let couponList = _.concat(state.pagination.data, res.data.list);
state.pagination = {
...res.data,
data: couponList,

16
pages/index/cart.vue
View File

@ -36,19 +36,19 @@
/>
</label>
<s-goods-item
:title="item.goods.title"
:img="item.sku_price.image || item.goods.image"
:price="item.sku_price.price"
:skuText="item.sku_price.goods_sku_text"
:title="item.spu.name"
:img="item.spu.picUrl || item.goods.image"
:price="item.sku.price/100"
:skuText="item.sku.properties.length>1? item.sku.properties.reduce((items2,items)=>items2.valueName+' '+items.valueName):item.sku.properties[0].valueName"
priceColor="#FF3000"
:titleWidth="400"
>
<template v-if="!state.editMode" v-slot:tool>
<su-number-box
:min="0"
:max="item.sku_price.stock"
:max="item.sku.stock"
:step="1"
v-model="item.goods_num"
v-model="item.count"
@change="onNumberChange($event, item)"
></su-number-box>
</template>
@ -112,9 +112,9 @@
isAllSelected: computed(() => cart.isAllSelected),
totalPriceSelected: computed(() => cart.totalPriceSelected),
});
// 单选选中
function onSelectSingle(id) {
console.log('单选')
cart.selectSingle(id);
}
// 全选
@ -154,7 +154,7 @@
if(cartItem.goods_num === e) return;
cartItem.goods_num = e;
cart.update({
goods_id: cartItem.goods_id,
goods_id: cartItem.id,
goods_num: e,
goods_sku_price_id: cartItem.goods_sku_price_id,
});

116
pages/index/category.vue
View File

@ -3,67 +3,33 @@
<view class="s-category">
<view class="three-level-wrap ss-flex ss-col-top" :style="[{ height: pageHeight + 'px' }]">
<scroll-view class="side-menu-wrap" scroll-y :style="[{ height: pageHeight + 'px' }]">
<view
class="menu-item ss-flex"
v-for="(item, index) in state.categoryList?.children"
:key="item.id"
:class="[{ 'menu-item-active': index == state.activeMenu }]"
@tap="onMenu(index)"
>
<view class="menu-item ss-flex" v-for="(item, index) in state.categoryList?.children" :key="item.id"
:class="[{ 'menu-item-active': index == state.activeMenu }]" @tap="onMenu(index)">
<view class="menu-title ss-line-1">
{{ item.name }}
</view>
</view>
</scroll-view>
<scroll-view
class="goods-list-box"
scroll-y
:style="[{ height: pageHeight + 'px' }]"
v-if="state.categoryList?.children?.length"
>
<image
v-if="state.categoryList.children[state.activeMenu].image"
class="banner-img"
:src="sheep.$url.cdn(state.categoryList.children[state.activeMenu].image)"
mode="widthFix"
>
<scroll-view class="goods-list-box" scroll-y :style="[{ height: pageHeight + 'px' }]"
v-if="state.categoryList?.children?.length">
<image v-if="state.categoryList.children[state.activeMenu].image" class="banner-img"
:src="sheep.$url.cdn(state.categoryList.children[state.activeMenu].image)" mode="widthFix">
</image>
<first-one
v-if="state.categoryList.style === 'first_one'"
:data="state.categoryList"
:activeMenu="state.activeMenu"
:pagination="state.pagination"
/>
<first-two
v-if="state.categoryList.style === 'first_two'"
:data="state.categoryList"
:activeMenu="state.activeMenu"
:pagination="state.pagination"
/>
<second-one
v-if="state.categoryList.style === 'second_one'"
:data="state.categoryList"
:activeMenu="state.activeMenu"
:pagination="state.pagination"
/>
<third-one
v-if="state.categoryList.style === 'third_one'"
:data="state.categoryList"
:activeMenu="state.activeMenu"
:pagination="state.pagination"
/>
<uni-load-more
v-if="
<first-one v-if="state.categoryList.style === 'first_one'" :data="state.categoryList"
:activeMenu="state.activeMenu" :pagination="state.pagination" />
<first-two v-if="state.categoryList.style === 'first_two'" :data="state.categoryList"
:activeMenu="state.activeMenu" :pagination="state.pagination" />
<second-one v-if="state.categoryList.style === 'second_one'" :data="state.categoryList"
:activeMenu="state.activeMenu" :pagination="state.pagination" />
<third-one v-if="state.categoryList.style === 'third_one'" :data="state.categoryList"
:activeMenu="state.activeMenu" :pagination="state.pagination" />
<uni-load-more v-if="
(state.categoryList.style === 'first_one' ||
state.categoryList.style === 'first_two') &&
state.pagination.total > 0
"
:status="state.loadStatus"
:content-text="{
" :status="state.loadStatus" :content-text="{
contentdown: '点击查看更多',
}"
@tap="loadmore"
/>
}" @tap="loadmore" />
</scroll-view>
</view>
</view>
@ -77,8 +43,14 @@
import firstTwo from './components/first-two.vue';
import sheep from '@/sheep';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { computed, reactive } from 'vue';
import {
onLoad,
onReachBottom
} from '@dcloudio/uni-app';
import {
computed,
reactive
} from 'vue';
import _ from 'lodash';
const state = reactive({
categoryList: [],
@ -93,15 +65,25 @@
loadStatus: '',
});
const { screenHeight, safeAreaInsets, screenWidth, safeArea } = sheep.$platform.device;
const {
screenHeight,
safeAreaInsets,
screenWidth,
safeArea
} = sheep.$platform.device;
const pageHeight = computed(() => safeArea.height - 44 - 50);
async function getList(options) {
const { error, data } = await sheep.$api.category.list({
const {
code,
data
} = await sheep.$api.category.list({
id: options.id,
});
if (error === 0) {
state.categoryList = data;
if (code === 0) {
state.categoryList = {
children: data
};
}
}
@ -114,23 +96,25 @@
total: 1,
last_page: 1,
};
getGoodsList(state.categoryList.children[val].id);
}
// 这段代码本来是在判断里的
getGoodsList(state.categoryList.children[val].id);
};
async function getGoodsList(id, page = 1, list_rows = 6) {
state.loadStatus = 'loading';
const res = await sheep.$api.goods.list({
category_id: id,
list_rows,
page,
categoryId: id,
pageSize:list_rows,
pageNo:page,
});
if (res.error === 0) {
let couponList = _.concat(state.pagination.data, res.data.data);
if (res.code === 0) {
let couponList = _.concat(state.pagination.data, res.data.list);
state.pagination = {
...res.data,
data: couponList,
};
console.log(state.pagination)
if (state.pagination.current_page < state.pagination.last_page) {
state.loadStatus = 'more';
} else {
@ -186,11 +170,9 @@
content: '';
width: 64rpx;
height: 12rpx;
background: linear-gradient(
90deg,
background: linear-gradient(90deg,
var(--ui-BG-Main-gradient),
var(--ui-BG-Main-light)
) !important;
var(--ui-BG-Main-light)) !important;
position: absolute;
left: -64rpx;
bottom: 0;

36
pages/index/index.vue
View File

@ -1,13 +1,7 @@
<template>
<view v-if="template">
<s-layout
title="首页"
navbar="custom"
tabbar="/pages/index/index"
:bgStyle="template.style?.background"
:navbarStyle="template.style?.navbar"
onShareAppMessage
>
<s-layout title="首页" navbar="custom" tabbar="/pages/index/index" :bgStyle="template.style?.background"
:navbarStyle="template.style?.navbar" onShareAppMessage>
<s-block v-for="(item, index) in template.data" :key="index" :styles="item.style">
<s-block-item :type="item.type" :data="item.data" :styles="item.style" />
</s-block>
@ -18,15 +12,35 @@
</template>
<script setup>
import { computed } from 'vue';
import { onLoad, onPageScroll, onPullDownRefresh } from '@dcloudio/uni-app';
import {
computed
} from 'vue';
import {
onLoad,
onPageScroll,
onPullDownRefresh
} from '@dcloudio/uni-app';
import sheep from '@/sheep';
import $share from '@/sheep/platform/share';
import index2Api from '@/sheep/api/index2';
// 隐藏原生tabBar
uni.hideTabBar();
const template = computed(() => sheep.$store('app').template?.home);
// 在此处拦截改变一下首页轮播图 此处先写死后期复活
(async function() {
let {
data
} = await index2Api.decorate();
template.value.data[0].data.list = JSON.parse(data[0].value).map(item => {
return {
src: item.picUrl,
url: item.url,
title: item.name,
type: "image"
}
})
}())
onLoad((options) => {
// #ifdef MP

15
sheep/api/cart.js
View File

@ -1,9 +1,10 @@
import request from '@/sheep/request';
import request2 from '@/sheep/request2';
export default {
list: (data) =>
request({
url: 'cart',
request2({
url: 'trade/cart/list',
method: 'GET',
custom: {
showLoading: false,
@ -25,14 +26,14 @@ export default {
}),
// 删除购物车
delete: (ids) =>
request({
url: 'cart/' + ids,
request2({
url: 'trade/cart/delete?ids=' + ids,
method: 'DELETE',
}),
update: (data) =>
request({
url: 'cart',
method: 'POST',
request2({
url: 'trade/cart/update-count',
method: 'PUT',
data: {
...data,
type: 'cover',

6
sheep/api/category.js
View File

@ -1,9 +1,9 @@
import request from '@/sheep/request';
import request2 from '@/sheep/request2';
export default {
list: (params) =>
request({
url: 'category',
request2({
url: 'product/category/list',
method: 'GET',
params,
}),

14
sheep/api/goods.js
View File

@ -16,8 +16,8 @@ export default {
// 商品列表
list: (params) =>
request({
url: 'goods/goods',
request2({
url: 'product/spu/page',
method: 'GET',
params,
custom: {
@ -49,6 +49,16 @@ export default {
showError: false,
},
}),
comment2: (id, params = {pageNo:1,pageSize:10,type:0}) =>
request2({
url: 'product/comment/page?spuId='+id,
method: 'GET',
params,
custom: {
showLoading: false,
showError: false,
},
}),
// 商品评价类型
getType: (id) =>
request({

9
sheep/api/index2.js Normal file
View File

@ -0,0 +1,9 @@
import request2 from '@/sheep/request2';
export default {
decorate: () =>
request2({
url: 'promotion/decorate/list?page=1',
method: 'GET',
}),
};

4
sheep/request2/index.js
View File

@ -68,7 +68,7 @@ const http = new Request({
*/
http.interceptors.request.use(
(config) => {
console.log(config);
// console.log(config);
if (config.custom.auth && !$store('user').isLogin) {
showAuthModal();
return Promise.reject();
@ -110,7 +110,7 @@ http.interceptors.response.use(
}
response.config.custom.showLoading && closeLoading();
if (response.data.error !== 0) {
if (response.data.code !== 0) {
if (response.config.custom.showError)
uni.showToast({
title: response.data.msg || '服务器开小差啦,请稍后再试~',

16
sheep/store/cart.js
View File

@ -15,7 +15,7 @@ const cart = defineStore({
if (!state.selectedIds.length) return price.toFixed(2);
state.list.forEach((item) => {
price += state.selectedIds.includes(item.id)
? Number(item.sku_price.price) * item.goods_num
? Number(item.sku.price/100) * item.count
: 0;
});
return price.toFixed(2);
@ -24,9 +24,9 @@ const cart = defineStore({
actions: {
// 获取购物车列表
async getList() {
const { data, error } = await cartApi.list();
if (error === 0) {
this.list = data;
const { data, code } = await cartApi.list();
if (code === 0) {
this.list = data.validList;
}
},
// 添加购物车
@ -44,8 +44,8 @@ const cart = defineStore({
// 更新购物车
async update(goodsInfo) {
const { error } = await cartApi.update({
goods_id: goodsInfo.goods_id,
goods_num: goodsInfo.goods_num,
id: goodsInfo.goods_id,
count: goodsInfo.goods_num,
goods_sku_price_id: goodsInfo.goods_sku_price_id,
});
if (error === 0) {
@ -58,8 +58,8 @@ const cart = defineStore({
if (typeof ids === 'array') {
ids = ids.join(',');
}
const { error } = await cartApi.delete(ids);
if (error === 0) {
const { code } = await cartApi.delete(ids);
if (code === 0) {
this.selectAll(false);
this.getList();
}