no message

components/search/search.vue

@@ -0,0 +1,81 @@
+<template>
+	<view :class="Fixed ? 'Fixed' : ''">
+		<view :style="{ height: statusBarHeight }"></view>
+		<view style="height: 44px"></view>
+		<view class="search">
+			<!-- 			<view class="search_left" :class="Fixed ? 'opacityLeft' : ''">
+				<image class="search_left_img" src="/static/icon/xai.png" mode="widthFix"></image>
+				<view>郑州市</view>
+			</view> -->
+			<view class="search_right p30">
+				<up-input placeholder="查找地点、电站" confirmType="search" suffixIcon="/static/icon/search.png" border="none" v-model="value" @change="change" @confirm="confirm"></up-input>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+
+import { ref } from 'vue';
+let value = ref('');
+const statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
+const emits = defineEmits(['change', 'search']);
+
+const data = defineProps({
+	Fixed: {
+		type: Boolean,
+		default: false
+	}
+});
+
+let change = (e) => {
+	emits('change', e);
+};
+
+let confirm = (e) => {
+	emits('search', e);
+};
+</script>
+
+<style lang="scss">
+.Fixed {
+	position: fixed;
+	left: 0;
+	width: 100%;
+	padding: 0 30rpx;
+	z-index: 99;
+}
+
+.search {
+	@include flex($space: space-between);
+
+	&_left {
+		@include flex;
+		font-weight: bold;
+		font-size: 40rpx;
+		color: #232323;
+		height: 86rpx;
+		&_img {
+			width: 36rpx;
+			height: 36rpx;
+			margin-right: 15rpx;
+		}
+	}
+
+	.opacityLeft {
+		background: rgba(255, 255, 255, 0.27);
+		border-radius: 10rpx 10rpx 10rpx 10rpx;
+		padding: 0 10rpx;
+	}
+
+	&_right {
+		flex: 1;
+		@include flex;
+		// max-width: 500rpx;
+		height: 86rpx;
+		background: #ffffff;
+		box-shadow: inset 0rpx 0rpx 22rpx 2rpx #f9fbff;
+		border-radius: 20rpx 20rpx 20rpx 20rpx;
+	}
+}
+</style>

components/statusBar/statusBar.vue

@@ -0,0 +1,30 @@
+<template>
+	<view style="position: relative">
+		<view :style="{ height: statusBarHeight }"></view>
+		<view style="height: 44px"></view>
+		<view class="statusBar_blur"></view>
+	</view>
+</template>
+
+<script setup>
+const statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
+</script>
+
+<style lang="scss">
+.statusBar_blur {
+	width: 100%;
+	height: 185rpx;
+	position: absolute;
+	top: 0;
+	left: 0;
+	background: #dbe6ff;
+	opacity: 0.8;
+	filter: blur(50px);
+	/* #ifdef MP-ALIPAY */
+	z-index: 0;
+	/* #endif */
+	/* #ifdef MP-WEIXIN */
+	z-index: -1;
+	/* #endif */
+}
+</style>

components/tabbar/tabbar.vue

@@ -0,0 +1,101 @@
+<template>
+	<view class="tabbar_pages p30">
+		<view class="tabbar_pages_view" v-for="(item, index) in list" :key="index" @click="toLink(item.pagePath)">
+			<view v-if="item.type == 1">
+				<view style="height: 70rpx">
+					<image mode="widthFix" style="width: 132rpx; height: 64rpx" :src="item.icon"></image>
+				</view>
+				<view :style="{ color: path == item.pagePath ? '#4879e6' : '' }">{{ item.text }}</view>
+			</view>
+			<view v-else>
+				<view style="height: 70rpx">
+					<image mode="widthFix" :src="path == item.pagePath ? item.icon : item.icon_select"></image>
+				</view>
+				<view :style="{ color: path == item.pagePath ? '#4879e6' : '' }">{{ item.text }}</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const data = defineProps({
+	path: {
+		type: String,
+		default: ''
+	}
+});
+
+let list = ref([
+	{
+		pagePath: '/pages/home/home',
+		text: '首页',
+		icon_select: '/static/tabbar/select_home.png',
+		icon: '/static/tabbar/home.png',
+		type: 0
+	},
+	{
+		pagePath: '/pages/index/index',
+		text: '地图',
+		icon_select: '/static/tabbar/select_sq.png',
+		icon: '/static/tabbar/sq.png',
+		type: 0
+	},
+	{
+		pagePath: '/pages/sweep/sweep',
+		text: '扫码充电',
+		icon_select: '/static/tabbar/find.png',
+		icon: '/static/tabbar/find.png',
+		type: 1
+	},
+	{
+		pagePath: '/pages/order/order',
+		text: '订单',
+		icon_select: '/static/tabbar/select_order.png',
+		icon: '/static/tabbar/order.png',
+		type: 0
+	},
+	{
+		pagePath: '/pages/mine/mine',
+		text: '我的',
+		icon_select: '/static/tabbar/select_my.png',
+		icon: '/static/tabbar/my.png',
+		type: 0
+	}
+]);
+
+const toLink = (e) => {
+	uni.vibrateShort();
+	if (data.path == e) return true;
+	uni.switchTab({
+		url: e
+	});
+};
+</script>
+
+<style lang="scss">
+.tabbar_pages {
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	width: 750rpx;
+	height: 140rpx;
+	@include flex($space: space-between);
+	background-color: #fff;
+	box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(88, 140, 255, 0.1);
+	border-radius: 15rpx 15rpx 0rpx 0rpx;
+	z-index: 99;
+	&_view {
+		view {
+			font-size: 24rpx;
+			color: #999999;
+			@include flex($direction: column, $space: space-between);
+			image {
+				width: 65rpx;
+				height: 65rpx;
+			}
+		}
+	}
+}
+</style>