Merge pull request '商品详情页跳转首页和购物车页面并新建user.js' (#45) from Brunch_DBK into main

order-app/src/api/category.js

@@ -0,0 +1,5 @@
+import http from '../common/http.js'
+//分类数据
+export const getCategoryListApi = () => {
+	return http.get("/wxapi/category/getCategoryList")
+}

order-app/src/api/home.js

@@ -3,7 +3,6 @@ import http from '../common/http.js'
 export const getSwipperListApi = ()=>{
 	return http.get("/api/home/getSwipperList")
 }
-
 //首页热推
 export const getHotListApi = ()=>{
 	return http.get("/api/home/getHotList")

order-app/src/api/user.js

@@ -0,0 +1,48 @@
+import http from '../common/http.js'
+//获取code
+export const getCode = () => {
+	const promise = new Promise((resolve, reject) => {
+		uni.login({
+			provider: 'weixin', //使用微信登录
+			success: function(loginRes) {
+				console.log('8888888888')
+				console.log(loginRes.code);
+				//如果返回数据
+				if (loginRes && loginRes.code) {
+					//数据返回
+					resolve(loginRes.code)
+				} else {
+					reject(loginRes)
+				}
+			}
+		})
+	}).catch(res => {
+		uni.showToast({
+			icon: 'none',
+			title: res.errMsg || '获取code失败!'
+		})
+	})
+	return promise;
+}
+//小程序登录
+export const wxLoginApi = (code) => {
+	return http.post('/wxapi/user/wxLogin', {
+		code: code
+	})
+}
+//封装登录
+export const userLogin = async () => {
+	//获取code
+	let res = await getCode()
+	//登录: 调用我们自己的后端接口
+	const {
+		data
+	} = await wxLoginApi(res)
+	console.log('登录')
+	console.log(data)
+	if (data) {
+		//存储
+		uni.setStorageSync('openid', data.openid)
+		uni.setStorageSync('sessionkey', data.sessionKey)
+	}
+}

order-app/src/common/http.js

@@ -1,4 +1,5 @@
-const baseUrl = 'http://localhost:8089'
+ const baseUrl = 'http://localhost:8089'
+//const baseUrl = 'http://192.168.31.70:8089'  
 const http = (options = {}) => {
     return new Promise((resolve, reject) => {
         uni.request({

order-app/src/pages.json

@@ -1,5 +1,11 @@
 {
 	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		/* 		{
+					"path": "pages/address/address",
+					"style": {
+						"navigationBarTitleText": ""
+					}
+				}, */
 		{
 			"path": "pages/index/index",
 			"style": {
@@ -11,33 +17,35 @@
 				"navigationBarTitleText": "分类",
 				"enablePullDownRefresh": false
 			}
-
 		}, {
 			"path": "pages/car/car",
 			"style": {
 				"navigationBarTitleText": "购物车",
 				"enablePullDownRefresh": false
 			}
-
 		}, {
 			"path": "pages/mine/mine",
 			"style": {
 				"navigationBarTitleText": "我的",
 				"enablePullDownRefresh": false
 			}
-
-		},
-		{
+		}, {
 			"path": "pages/detail/detail",
 			"style": {
 				"navigationBarTitleText": ""
 			}
-		},{
+		}, {
 			"path": "pages/address/address",
 			"style": {
 				"navigationBarTitleText": ""
 			}
-		}
+		},
+		{
+			"path" : "common/common",
+			"style" : 
+			{
+				"navigationBarTitleText" : ""
+			}		}
 	],
 	"globalStyle": {
 		// 导航字体颜色，仅支持 black/white

order-app/src/pages/car/car.vue

@@ -57,9 +57,9 @@
 	const checked = ref(true);
 	//获取购物车数据
 	const goods = computed(() => {
-		if(store.carList.length == 0){
+		if (store.carList.length == 0) {
 			allchecked.value = false;
-		}else{
+		} else {
 			allchecked.value = true;
 		}
 		return store.carList
@@ -101,18 +101,19 @@
 	}
 
 	const reduce = (item) => {
+		console.log(item)
 		let num = item.num
 		if (num > 1) {
 			num -= 1
 		} else if (num = 1) {
-			store.carList.map((dom, i) => {
+			goods.map((dom, i) => {
 				if (dom.goodsID == item.goodsID) {
-					store.carList.splice(i, 1)
+					goods.splice(i, 1)
 				}
 			})
 		}
 		item.num = num;
-		if (store.carList.length == 0) {
+		if (goods.length == 0) {
 			allchecked.value = false;
 		}
 	}

order-app/src/pages/category/category.vue

@@ -5,7 +5,8 @@
 				<view v-for="(item,index) in tabbar" :key="index" class="u-tab-item"
 					:class="[current==index ? 'u-tab-item-active' : '']" :data-current="index"
 					@tap.stop="swichMenu(index)">
-					<text class="u-line-1">{{item.name}}</text>
+
+					<text class="u-line-1">{{item.categoryName}}</text>
 				</view>
 			</scroll-view>
 			<block v-for="(item,index) in tabbar" :key="index">
@@ -16,9 +17,10 @@
 								<text>{{item.name}}</text>
 							</view> -->
 							<view class="item-container">
-								<view class="thumb-box" v-for="(item1, index1) in item.foods" :key="index1">
-									<image class="item-menu-image" :src="item1.icon" mode=""></image>
-									<view class="item-menu-name">{{item1.name}}</view>
+								<view class="thumb-box" v-for="(item1, index1) in item.goods" :key="index1">
+									<image @click="toDetails(item1)" class="item-menu-image"
+										:src="item1.goodsImage.split(',')[0]" mode=""></image>
+									<view class="item-menu-name">{{item1.goodsName}}</view>
 								</view>
 							</view>
 						</view>
@@ -30,84 +32,76 @@
 </template>
 
 <script setup>
+	import {
+		getCategoryListApi
+	} from "../../api/category";
 	import {
 		ref,
 		getCurrentInstance
 	} from "vue"
 	// 获取组件实例
 	const instance = getCurrentInstance();
-	const tabbar = ref([{
-		"name": "早点",
-		"foods": [{
-				"name": "豆浆",
-				"key": "豆浆",
-				"icon": "/static/test-5.png",
-				"cat": 6
-			},
-			{
-				"name": "油条",
-				"key": "糕点饼干",
-				"icon": "/static/test-8.png",
-				"cat": 6
-			},
-			{
-				"name": "油条",
-				"key": "糕点饼干",
-				"icon": "/static/test-8.png",
-				"cat": 6
-			}
-		]
-	},
-	{
-		"name": "米线",
-		"foods": [{
-				"name": "小锅米线",
-				"key": "豆浆",
-				"icon": "/static/test-5.png",
-				"cat": 6
-			},
-			{
-				"name": "豆花米线",
-				"key": "糕点饼干",
-				"icon": "/static/test-5.png",
-				"cat": 6
-			}
-		]
-	}
-	])
+
+	const tabbar = ref([])
 	const scrollTop = ref(0)
 	const current = ref(0)
 	const menuHeight = ref(0)
-	const menuItemHeight = ref(0)
-	const getImg = ()=>{
+	const menuItemHeight = ref(0)	const getImg = ()=>{
+	const getImg = () => {
 		return Math.floor(Math.random() * 35)
 	}
-	const swichMenu = async(index)=>{
-		if(index == current.value) return ;
+
+	const swichMenu = async (index) => {
+		if (index == current.value) return;
 		current.value = index;
 		// 如果为0，意味着尚未初始化
-		if(menuHeight.value == 0 || menuItemHeight.value == 0) {
+
+		if (menuHeight.value == 0 || menuItemHeight.value == 0) {
 			await getElRect('menu-scroll-view', 'menuHeight');
 			await getElRect('u-tab-item', 'menuItemHeight');
 		}
 		// 将菜单菜单活动item垂直居中
 		scrollTop.value = index * menuItemHeight.value + menuItemHeight.value / 2 - menuHeight.value / 2;
 	}
-	const getElRect = (elClass, dataVal)=>{
+{
+	const getElRect = (elClass, dataVal) => {
 		new Promise((resolve, reject) => {
 			const query = uni.createSelectorQuery().in(instance);
-			query.select('.' + elClass).fields({size: true},res => {
+
+			query.select('.' + elClass).fields({
+				size: true
+			}, res => {
 				// 如果节点尚未生成，res值为null，循环调用执行
-				if(!res) {
+
+				if (!res) {
 					setTimeout(() => {
 						getElRect(elClass);
 					}, 10);
-					return ;
+
+					return;
 				}
 				instance[dataVal] = res.height;
 			}).exec();
 		})
 	}
+	//获取分类数据
+	const getCategoryList = async () => {
+		let res = await getCategoryListApi()
+		if (res && res.code == 200) {
+			tabbar.value = res.data;
+		}
+	}
+	//跳转详情
+	const toDetails = (item) => {
+		console.log(item)
+		//在起始页面跳转到details.vue页面并传递参数
+		uni.navigateTo({
+			url: '../detail/detail?goods=' + JSON.stringify(item)
+		});
+	}
+	onLoad(() => {
+		getCategoryList()
+	})
 </script>
 
 
@@ -229,5 +223,5 @@
 		width: 120rpx;
 		height: 120rpx;
 	}
-</style>
 
+</style>

order-app/src/pages/detail/detail.vue

@@ -32,22 +32,7 @@
 		<swiper-item class="swiper-item">
 			<scroll-view scroll-y style="height: 100%;width: 100%;">
 				<view class="page-box">
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
-					我是内容一
+					<u-parse :html="content"></u-parse>
 				</view>
 			</scroll-view>
 		</swiper-item>
@@ -79,11 +64,11 @@
 	</swiper>
 	<view class="navigation">
 		<view class="left">
-			<view class="item">
+			<view class="item" @click="toHome">
 				<u-icon name="home" :size="40" :color="$u.color['contentColor']"></u-icon>
 				<view class="text u-line-1">首页</view>
 			</view>
-			<view class="item car">
+			<view class="item car" @click="toCar">
 				<u-badge class="car-num" :count="carCount" type="error" :offset="[-3, -6]"></u-badge>
 				<u-icon name="shopping-cart" :size="40" :color="$u.color['contentColor']"></u-icon>
 				<view class="text u-line-1">购物车</view>
@@ -97,6 +82,9 @@
 </template>
 
 <script setup>
+	import {
+		userLogin
+	} from '../../api/user';
 	import {
 		onLoad
 	} from '@dcloudio/uni-app';
@@ -107,12 +95,16 @@
 	import {
 		carStore
 	} from '../../store/car';
+	//菜品详情
+	const content = ref('')
 	//获取store
 	const store = carStore()
 	//购物车数量动态变化
-	const carCount = computed(()=>{
+	const carCount = computed(() => {
 		return store.carList.length
 	})
+	//菜品详情
+	const content = ref('')
 	const current = ref(0)
 	//轮播图高度
 	const height = ref('400')
@@ -177,7 +169,20 @@
 		swiperCurrent.value = current;
 		tabIndex.value = current;
 	}
+	//跳转首页
+	const toHome = () => {
+		uni.switchTab({
+			url: '../index/index'
+		});
+	}
+	//跳转购物车
+	const toCar = () => {
+		uni.switchTab({
+			url: '../car/car'
+		});
+	}
 	onLoad((options) => {
+		userLogin()
 		const goods = JSON.parse(options.goods)
 		swipperList.value = goods.goodsImage.split(',')
 		console.log(goods)

order-app/src/pages/index/index.vue

@@ -1,4 +1,5 @@
 <template>
+
 	<u-swiper name='images' border-radius='1' :duration='duration' :interval='interval' :height="height"
 		:list="swiperList">
 	</u-swiper>
@@ -8,12 +9,15 @@
 			<template v-slot:left="{leftList}">
 				<view class="demo-warter" v-for="(item, index) in leftList" :key="index">
 					<!-- 警告：微信小程序中需要hx2.8.11版本才支持在template中结合其他组件，比如下方的lazy-load组件 -->
+
 					<u-lazy-load threshold="-450" border-radius="10" :image="item.goodsImage.split(',')[0]" :index="index"></u-lazy-load>
 					<view class="demo-title">
+
 						{{item.goodsName}}
 					</view>
 					<view class="price-item">
 						<view class="demo-price">
+
 							{{item.specs[0].goodsPrice}}元
 						</view>
 						<view class="demo-title">
@@ -25,12 +29,15 @@
 			</template>
 			<template v-slot:right="{rightList}">
 				<view class="demo-warter" v-for="(item, index) in rightList" :key="index">
+
 					<u-lazy-load threshold="-450" border-radius="10" :image="item.goodsImage.split(',')[0]" :index="index"></u-lazy-load>
 					<view class="demo-title">
+
 						{{item.goodsName}}
 					</view>
 					<view class="price-item">
 						<view class="demo-price">
+
 							{{item.specs[0].goodsPrice}}元
 						</view>
 						<view class="demo-title">
@@ -45,6 +52,10 @@
 </template>
 
 <script setup>
+	import {
+		getSwipperListApi,
+		getHotListApi
+	} from '../../api/home';
 	import {
 		ref
 	} from 'vue';
@@ -66,11 +77,11 @@
 	const interval = ref(2000)
 	//滑动动画时长
 	const duration = ref(500)
+
 	//定义轮播图的数据,创建一个空数组
 	const swiperList = ref([])
 	//列表数据,默认空数组
-	const flowList = ref([])
-	//跳转详情
+	const flowList = ref([])	//跳转详情
 	const toDetails = (item) => {
 		//在起始页面跳转到details.vue页面并传递参数
 		uni.navigateTo({