增加部分公共样式

修改部分公共组件代码
修改台桌，代课下单逻辑代码
增加支付页面
修改用户列表页面

jeepay-ui-uapp-merchant/components/my-components/my-tabs.vue

@@ -1,11 +1,27 @@
 <template>
-	<view class="u-flex tabs">
-		<view class="u-flex-1 u-text-center item"
-		 :class="{active:index===current}"
-		 @tap="changeCurrent(index)" v-for="(item,index) in props.list" :key="index">
-			{{item}}
+	<view class="u-relative bg border-r-16">
+		
+		<view class="u-flex tabs zhanwei u-relative">
+			<view class="active-block" :style="computedBlockStyle">
+			</view>
+			<view class="u-flex-1 u-text-center item"
+			 :class="{active:index===current}"
+			 @tap="changeCurrent(index)" v-for="(item,index) in props.list" :key="index">
+				{{item}}
+			</view>
+			
+		</view>
+		<view class="u-flex tabs u-absolute position-all">
+			
+			<view class="u-flex-1 u-text-center item"
+			 :class="{active:index===current}"
+			 @tap="changeCurrent(index)" v-for="(item,index) in props.list" :key="index">
+				{{item}}
+			</view>
+			
 		</view>
 	</view>
+	
 </template>
 
 <script setup>
@@ -28,6 +44,14 @@ import { computed, ref, watch } from 'vue';
 		current.value=index
 		emit('update:modelValue',index)
 	}
+	const computedBlockStyle=computed(()=>{
+		const oneWidth= 100/props.list.length
+		const left= current.value*oneWidth
+		return{
+			width:oneWidth+'%',
+			left:left+'%'
+		}
+	})
 	watch(()=>current.value,()=>{
 		emit('change',current.value)
 	})
@@ -35,20 +59,57 @@ import { computed, ref, watch } from 'vue';
 </script>
 
 <style lang="scss" scoped>
-	.tabs{
-		padding: 4rpx 10rpx;
+	.zhanwei{
+		.item{
+			opacity: 0;
+		}
+	}
+	.bg{
 		background: #E6F0FF;
-		border-radius: 16rpx 16rpx 16rpx 16rpx;
-		font-family: Source Han Sans CN, Source Han Sans CN;
+		padding: 4rpx 10rpx;
+	}
+	.border-r-16{
+		border-radius: 16rpx;
+	}
+	.active-block{
+		background-color: $my-main-color;
+		color: #fff;
+		top: 4rpx;
+		bottom: 4rpx;
+		left: 10rpx;
+		position: absolute;
+		border-radius: 8rpx;
+		transition: all .2s ease-in-out;
+		overflow: hidden;
+		z-index: 1;
+	}
+	.tabs{
+		border-radius: 16rpx;
 		font-size: 28rpx;
 		color: #318AFE;
+		z-index: 2;
+		.active-block{
+			background-color: $my-main-color;
+			color: #fff;
+			top: 4rpx;
+			bottom: 4rpx;
+			left: 0;
+			position: absolute;
+			border-radius: 8rpx;
+			transition: all .2s ease-in-out;
+			overflow: hidden;
+			z-index: 1;
+		}
 		.item{
 			padding: 8rpx 0;
-			transition: all .3s ease-in-out;
+			transition: all .2s ease-in-out;
+			position: relative;
+			background-color: transparent;
+			z-index: 2;
 		}
 		.item.active{
-			border-radius: 8rpx 8rpx 8rpx 8rpx;
-			background-color: $my-main-color;
+			border-radius: 8rpx;
+			// background-color: $my-main-color;
 			color: #fff;
 		}
 	}