Browse Source

feat: 框架

2912631854@qq.com 1 year ago
parent
commit
b520b537c0
6 changed files with 96 additions and 18 deletions
  1. 63 0
      components/Tabbares/index.vue
  2. 9 1
      main.js
  3. 5 2
      pages.json
  4. 5 4
      pagesHouse/Mine/index.vue
  5. 4 4
      pagesHouse/Verification/index.vue
  6. 10 7
      pagesHouse/home/index.vue

+ 63 - 0
components/Tabbares/index.vue

@@ -0,0 +1,63 @@
+<template>
+	<view>
+		<u-tabbar :value="tabbarValues" @change="name => tabbarValues = name" :fixed="true" :placeholder="true"
+			:safeAreaInsetBottom="true" :border="false">
+			<u-tabbar-item :text="item.text" v-for="(item,index) in list" :key="index" @click="changeTabbars">
+				<image class="u-page__item__slot-icon" slot="active-icon" :src="item.activeImg"></image>
+				<image class="u-page__item__slot-icon" slot="inactive-icon" :src="item.inactiveImg"></image>
+			</u-tabbar-item>
+		</u-tabbar>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			tabbarid: 0
+		},
+		data() {
+			return {
+				tabbarValues: 0,
+				list: [{
+						activeImg: 'https://i.ringzle.com/file/20240106/57895bbc5414416ea5de2a537ed23dc3.png',
+						inactiveImg: 'https://i.ringzle.com/file/20240106/29bd09ef7eb748f1820c335f86f74c61.png',
+						text: '首页',
+						paths: '/pagesHouse/home/index'
+					},
+					{
+						activeImg: 'https://i.ringzle.com/file/20240106/584d0a4108c44fa5bc566d0d0082e07d.png',
+						inactiveImg: 'https://i.ringzle.com/file/20240106/9561cd3843694891998a34ed41be0ec8.png',
+						text: '扫码核验',
+						paths: '/pagesHouse/Verification/index'
+					},
+					{
+						activeImg: 'https://i.ringzle.com/file/20240106/daf6362d4d6745c29501cf30a4d99bc2.png',
+						inactiveImg: 'https://i.ringzle.com/file/20240106/8c1f9fc0b5604ef7b966d98f2ffb1d2e.png',
+						text: '我的',
+						paths: '/pagesHouse/Mine/index'
+					}
+				]
+			}
+		},
+		mounted() {
+			this.tabbarValues = this.tabbarid;
+		},
+		methods: {
+			changeTabbars(e) {
+				console.log(this.list[e].paths, '000');
+				this.tabbarValues = e;
+				uni.reLaunch({
+					url: this.list[e].paths
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="less">
+	/deep/.u-page__item__slot-icon {
+		width: 40rpx;
+		height: 40rpx;
+		margin: 8rpx 0 4rpx;
+	}
+</style>

+ 9 - 1
main.js

@@ -23,7 +23,11 @@ Vue.use(uView)
 
 //重载uni.showToast,简化调用
 Vue.prototype.$showToast = function(title, duration = 2000, icon = "none") {
-	return uni.showToast({ title, duration, icon })
+	return uni.showToast({
+		title,
+		duration,
+		icon
+	})
 }
 
 //全局apis
@@ -42,6 +46,10 @@ Vue.component('NoData', NoData);
 // 全局注册tabbar组件
 import Tabbar from './components/Tabbar'
 Vue.component('Tabbar', Tabbar);
+// 全局注册tabbar组件
+import Tabbares from './components/Tabbares'
+Vue.component('Tabbares', Tabbares);
+
 //全局分享当前页(带参数)
 import wxShare from '@/utils/wxShare.js'
 Vue.mixin(wxShare);

+ 5 - 2
pages.json

@@ -121,6 +121,7 @@
 	],
 	"subPackages": [{
 			"root": "pagesHouse",
+
 			"pages": [{
 					"path": "home/index",
 					"style": {
@@ -148,14 +149,16 @@
 					"path": "Verification/index",
 					"style": {
 						"navigationBarTitleText": "核销",
-						"enablePullDownRefresh": false
+						"enablePullDownRefresh": false,
+						"navigationStyle": "custom"
 					}
 				},
 				{
 					"path": "Mine/index",
 					"style": {
 						"navigationBarTitleText": "我的",
-						"enablePullDownRefresh": false
+						"enablePullDownRefresh": false,
+						"navigationStyle": "custom"
 					}
 				}
 			]

+ 5 - 4
pagesHouse/Mine/index.vue

@@ -1,22 +1,23 @@
 <template>
 	<view>
-		
+		<Tabbares :tabbarid="2"></Tabbares>
 	</view>
 </template>
 
 <script>
 	export default {
+
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
 
 <style>
 
-</style>
+</style>

+ 4 - 4
pagesHouse/Verification/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-		
+		<Tabbares :tabbarid="1"></Tabbares>
 	</view>
 </template>
 
@@ -8,15 +8,15 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
 
 <style>
 
-</style>
+</style>

+ 10 - 7
pagesHouse/home/index.vue

@@ -74,7 +74,8 @@
 			<view class="tit">
 				<text>订单列表</text>
 				<text>{{new Date().Format('yyyy-MM-dd')}}</text>
-				<u-icon @click="more()" name="arrow-right" label="查看全部" labelPos="left" labelSize="13px" labelColor="#808080" color="#AAA"></u-icon>
+				<u-icon @click="more()" name="arrow-right" label="查看全部" labelPos="left" labelSize="13px"
+					labelColor="#808080" color="#AAA"></u-icon>
 			</view>
 			<view class="li first">
 				<text>订单信息</text>
@@ -90,6 +91,7 @@
 				<text>¥765</text>
 			</view>
 		</view>
+		<Tabbares :tabbarid="0"></Tabbares>
 	</view>
 </template>
 
@@ -106,15 +108,15 @@
 				]
 			}
 		},
-		methods:{
-			toHref(url){
+		methods: {
+			toHref(url) {
 				uni.redirectTo({
-					url:url
+					url: url
 				})
 			},
-			more(){
+			more() {
 				uni.navigateTo({
-					url:"/pagesHouse/home/orderList"
+					url: "/pagesHouse/home/orderList"
 				})
 			}
 		}
@@ -161,7 +163,7 @@
 				grid-template-columns: 60% 20% 20%;
 				align-items: center;
 				margin-bottom: 24rpx;
-				
+
 
 				text {
 					color: #333;
@@ -171,6 +173,7 @@
 				.avatar {
 					display: flex;
 					align-items: center;
+
 					image {
 						width: 90rpx;
 						min-width: 90rpx;