diff --git a/src/api/common.js b/src/api/common.js
index e5b6355f..2e8954f6 100644
--- a/src/api/common.js
+++ b/src/api/common.js
@@ -39,4 +39,27 @@ export const uploadFile = (file, data) => {
 			}  
 		});  
 	});
-};
\ No newline at end of file
+};
+
+
+// 对象存储预览 /traoss/tras3/show/{文件ID}
+export function previewFile(id,responseType = 'blob') {
+    const token = getToken();  
+    const header = {};  
+    if (token) 
+        header['summary'] = token
+	
+	return new Promise((resolve, reject) => {  
+		uni.request({  
+			url: `/traoss/tras3/show/${id}`,  
+			header,  
+			responseType,
+			success(result) {  
+				resolve(result.data)
+			},  
+			fail(error) {    
+				reject(new Error('Upload failed'));  
+			}  
+		});  
+	});
+}
\ No newline at end of file
diff --git a/src/components/image-preview/image-preview.vue b/src/components/image-preview/image-preview.vue
new file mode 100644
index 00000000..44965b37
--- /dev/null
+++ b/src/components/image-preview/image-preview.vue
@@ -0,0 +1,66 @@
+<template>
+	<image :src="imgUrl"></image>
+</template>
+
+<script>
+	import previewFile from'@/api/common.js'
+	export default {
+		name:"image-preview",
+		props:{
+			modelValue:{
+				default:'',
+				type:String
+			}
+		},
+		data() {
+			return {
+				imgUrl
+			};
+		},
+		watch: {
+			modelValue: {
+				handler(newval, oldval) {
+					if (newval) {
+					this.getPreviewUrlBlob(newval);
+					}
+				},
+				immediate: true,
+				deep: true,
+			},
+			imgUrlShow: {
+				handler(newval, oldval) {
+					if (oldval) {
+						URL.revokeObjectURL(oldval);
+					}
+				},
+				immediate: true,
+				deep: true,
+			}
+		},
+		methods: {
+			getPreviewUrlBlob(id) {
+				previewFile(id).then((res) => {
+					this.imgUrlShow = URL.createObjectURL(res);
+					
+					// const reader = new FileReader();
+					// reader.readAsDataURL(res)
+					// reader.onloadend = () => {
+					// 	this.imgUrlShow = reader.result;
+					// }
+				});
+			},
+		},
+		mounted() {
+			if (this.modelValue) {
+				this.getPreviewUrlBlob(this.modelValue);
+			}
+		},
+		beforeDestroy() {
+			URL.revokeObjectURL(this.imgUrlShow);
+		},
+	}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/src/pages.json b/src/pages.json
index c0d51724..2b1c986b 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -18,6 +18,15 @@
 				}
 			}
 		},
+		{
+			"path": "pages/course/index",
+			"style": {
+				"navigationBarTitleText": "课程中心",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
 		{
 			"path": "pages/intelligent_answering/index",
 			"style": {
diff --git a/src/pages/course/index.vue b/src/pages/course/index.vue
new file mode 100644
index 00000000..e0a4cc8b
--- /dev/null
+++ b/src/pages/course/index.vue
@@ -0,0 +1,91 @@
+<template>
+	<view class="course-center max_page">
+		<view class="top-bg"></view>
+		<view class="bot-bg"></view>
+		<view class="course-center-body">
+			<view class="body-title">
+				<uv-icon class="arrow-icon" name="arrow-left" @click="common.navigateBack()"/>
+				课程中心
+			</view>
+			<uv-input shape="circle"
+				placeholderStyle='color:#999999;font-size:28rpx' 
+				placeholder="请输入课程名" 
+				suffixIcon="search"
+				:customStyle="customStyle"
+				:suffixIconStyle="suffixIconStyle" 
+				:readonly="true">
+			</uv-input>
+			<uv-tabs :list="tabList" @click="changeTab"></uv-tabs>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import common from '@/common/common'
+	const customStyle = {
+		backgroundColor: "#ffffff",
+		paddingLeft: "40rpx",
+		height:'60rpx',
+		paddingTop: "5px",
+		paddingBottom: "5px",
+		border: "none"
+	} 
+	const suffixIconStyle = {
+		color: "#2c8ef2",
+		fontSize: "40rpx"
+	}
+	const tabList = [
+			{ name:'全部'},
+			{ name:'热门'},
+			{ name:'最新'},
+			{ name:'推荐'},
+			{ name:'生产线'},
+		]
+	const changeTab = (item) => {
+		console.log(item)
+		
+	}
+</script>
+
+<style lang="scss" scoped>
+	.course-center{
+		position: relative;
+		display: flex;
+		flex-direction: column;
+		.top-bg{
+			background: linear-gradient(16deg,rgba(234,246,255,0) 0%,#c3e6ff 100%);
+			height: 419rpx;
+			width: 750rpx;
+		}
+		.bot-bg{
+			// background-color: #F6F8FF;
+			background: linear-gradient(136deg,rgba(234,246,255,0) 0%,#c3e6ff 100%);
+			width: 750rpx;
+			flex: 1;
+		}
+		.course-center-body{
+			position: absolute;
+			left:0;
+			top: 0;
+			height: 100%;
+			width: 100%;
+			padding:0 15rpx;
+			box-sizing: border-box;
+			.body-title{
+				height: 150rpx;
+				text-align: center;
+				font-size: 33rpx;
+				padding-top: 70rpx;
+				line-height: 46rpx;
+				box-sizing: border-box;
+				position: relative;
+				.arrow-icon{
+					position: absolute;
+					left:36rpx;
+					top:80rpx;
+					color: #000;
+				}
+			}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index 274abc18..93264ae0 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -73,7 +73,7 @@
 			<!-- 8个导航 -->
 			<view class="navigation_div">
 				<view class="group">
-					<view class="item">
+					<view class="item" @click="common.navigateTo('/pages/course/index')">
 						<image class="icon" src="@/static/images/index/navigation_course.png"></image>
 						<view class="title">课程中心</view>
 					</view>
diff --git a/src/uni_modules/uv-badge/changelog.md b/src/uni_modules/uv-badge/changelog.md
new file mode 100644
index 00000000..b0ba104c
--- /dev/null
+++ b/src/uni_modules/uv-badge/changelog.md
@@ -0,0 +1,7 @@
+## 1.0.2（2023-06-04）
+1. 修复type等属性为null的时候不显示徽标的BUG
+## 1.0.1（2023-05-16）
+1. 优化组件依赖，修改后无需全局引入，组件导入即可使用
+2. 优化部分功能
+## 1.0.0（2023-05-10）
+uv-badge 徽标数，数字角标
diff --git a/src/uni_modules/uv-badge/components/uv-badge/props.js b/src/uni_modules/uv-badge/components/uv-badge/props.js
new file mode 100644
index 00000000..c6369c39
--- /dev/null
+++ b/src/uni_modules/uv-badge/components/uv-badge/props.js
@@ -0,0 +1,73 @@
+export default {
+	props: {
+		// 是否显示圆点
+		isDot: {
+			type: Boolean,
+			default: false
+		},
+		// 显示的内容
+		value: {
+			type: [Number, String],
+			default: ''
+		},
+		// 是否显示
+		show: {
+			type: Boolean,
+			default: true
+		},
+		// 最大值，超过最大值会显示 '{max}+'
+		max: {
+			type: [Number, String],
+			default: 999
+		},
+		// 主题类型，error|warning|success|primary
+		type: {
+			type: [String,undefined,null],
+			default: 'error'
+		},
+		// 当数值为 0 时，是否展示 Badge
+		showZero: {
+			type: Boolean,
+			default: false
+		},
+		// 背景颜色，优先级比type高，如设置，type参数会失效
+		bgColor: {
+			type: [String, null],
+			default: null
+		},
+		// 字体颜色
+		color: {
+			type: [String, null],
+			default: null
+		},
+		// 徽标形状，circle-四角均为圆角，horn-左下角为直角
+		shape: {
+			type: [String,undefined,null],
+			default: 'circle'
+		},
+		// 设置数字的显示方式，overflow|ellipsis|limit
+		// overflow会根据max字段判断，超出显示`${max}+`
+		// ellipsis会根据max判断，超出显示`${max}...`
+		// limit会依据1000作为判断条件，超出1000，显示`${value/1000}K`，比如2.2k、3.34w，最多保留2位小数
+		numberType: {
+			type: [String,undefined,null],
+			default: 'overflow'
+		},
+		// 设置badge的位置偏移，格式为 [x, y]，也即设置的为top和right的值，absolute为true时有效
+		offset: {
+			type: Array,
+			default: () => []
+		},
+		// 是否反转背景和字体颜色
+		inverted: {
+			type: Boolean,
+			default: false
+		},
+		// 是否绝对定位
+		absolute: {
+			type: Boolean,
+			default: false
+		},
+		...uni.$uv?.props?.badge
+	}
+}
\ No newline at end of file
diff --git a/src/uni_modules/uv-badge/components/uv-badge/uv-badge.vue b/src/uni_modules/uv-badge/components/uv-badge/uv-badge.vue
new file mode 100644
index 00000000..f7d3911a
--- /dev/null
+++ b/src/uni_modules/uv-badge/components/uv-badge/uv-badge.vue
@@ -0,0 +1,176 @@
+<template>
+	<text
+		v-if="show && ((Number(value) === 0 ? showZero : true) || isDot)"
+		:class="[isDot ? 'uv-badge--dot' : 'uv-badge--not-dot', inverted && 'uv-badge--inverted', shape === 'horn' && 'uv-badge--horn', `uv-badge--${propsType}${inverted ? '--inverted' : ''}`]"
+		:style="[$uv.addStyle(customStyle), badgeStyle]"
+		class="uv-badge"
+	>{{ isDot ? '' :showValue }}</text>
+</template>
+
+<script>
+	import mpMixin from '@/uni_modules/uv-ui-tools/libs/mixin/mpMixin.js'
+	import mixin from '@/uni_modules/uv-ui-tools/libs/mixin/mixin.js'
+	import props from './props.js';
+	/**
+	 * badge 徽标数
+	 * @description 该组件一般用于图标右上角显示未读的消息数量，提示用户点击，有圆点和圆包含文字两种形式。
+	 * @tutorial https://www.uvui.cn/components/badge.html
+	 * 
+	 * @property {Boolean} 			isDot 		是否显示圆点 （默认 false ）
+	 * @property {String | Number} 	value 		显示的内容
+	 * @property {Boolean} 			show 		是否显示 （默认 true ）
+	 * @property {String | Number} 	max 		最大值，超过最大值会显示 '{max}+'  （默认999）
+	 * @property {String} 			type 		主题类型，error|warning|success|primary （默认 'error' ）
+	 * @property {Boolean} 			showZero	当数值为 0 时，是否展示 Badge （默认 false ）
+	 * @property {String} 			bgColor 	背景颜色，优先级比type高，如设置，type参数会失效
+	 * @property {String} 			color 		字体颜色 （默认 '#ffffff' ）
+	 * @property {String} 			shape 		徽标形状，circle-四角均为圆角，horn-左下角为直角 （默认 'circle' ）
+	 * @property {String} 			numberType	设置数字的显示方式，overflow|ellipsis|limit  （默认 'overflow' ）
+	 * @property {Array}} 			offset		设置badge的位置偏移，格式为 [x, y]，也即设置的为top和right的值，absolute为true时有效
+	 * @property {Boolean} 			inverted	是否反转背景和字体颜色（默认 false ）
+	 * @property {Boolean} 			absolute	是否绝对定位（默认 false ）
+	 * @property {Object}			customStyle	定义需要用到的外部样式
+	 * @example <uv-badge :type="type" :count="count"></uv-badge>
+	 */
+	export default {
+		name: 'uv-badge',
+		mixins: [mpMixin, mixin, props],
+		computed: {
+			// 是否将badge中心与父组件右上角重合
+			boxStyle() {
+				let style = {};
+				return style;
+			},
+			// 整个组件的样式
+			badgeStyle() {
+				const style = {}
+				if(this.color) {
+					style.color = this.color
+				}
+				if (this.bgColor && !this.inverted) {
+					style.backgroundColor = this.bgColor
+				}
+				if (this.absolute) {
+					style.position = 'absolute'
+					// 如果有设置offset参数
+					if(this.offset.length) {
+						// top和right分为为offset的第一个和第二个值，如果没有第二个值，则right等于top
+						const top = this.offset[0]
+						const right = this.offset[1] || top
+						style.top = this.$uv.addUnit(top)
+						style.right = this.$uv.addUnit(right)
+					}
+				}
+				return style
+			},
+			showValue() {
+				switch (this.numberType) {
+					case "overflow":
+						return Number(this.value) > Number(this.max) ? this.max + "+" : this.value
+						break;
+					case "ellipsis":
+						return Number(this.value) > Number(this.max) ? "..." : this.value
+						break;
+					case "limit":
+						return Number(this.value) > 999 ? Number(this.value) >= 9999 ?
+							Math.floor(this.value / 1e4 * 100) / 100 + "w" : Math.floor(this.value /
+								1e3 * 100) / 100 + "k" : this.value
+						break;
+					default:
+						return Number(this.value)
+				}
+			},
+			propsType(){
+				return this.type || 'error'
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	@import '@/uni_modules/uv-ui-tools/libs/css/components.scss';
+	@import '@/uni_modules/uv-ui-tools/libs/css/color.scss';
+	$uv-badge-primary: $uv-primary !default;
+	$uv-badge-error: $uv-error !default;
+	$uv-badge-success: $uv-success !default;
+	$uv-badge-info: $uv-info !default;
+	$uv-badge-warning: $uv-warning !default;
+	$uv-badge-dot-radius: 100px !default;
+	$uv-badge-dot-size: 8px !default;
+	$uv-badge-dot-right: 4px !default;
+	$uv-badge-dot-top: 0 !default;
+	$uv-badge-text-font-size: 11px !default;
+	$uv-badge-text-right: 10px !default;
+	$uv-badge-text-padding: 2px 5px !default;
+	$uv-badge-text-align: center !default;
+	$uv-badge-text-color: #FFFFFF !default;
+
+	.uv-badge {
+		border-top-right-radius: $uv-badge-dot-radius;
+		border-top-left-radius: $uv-badge-dot-radius;
+		border-bottom-left-radius: $uv-badge-dot-radius;
+		border-bottom-right-radius: $uv-badge-dot-radius;
+		@include flex;
+		line-height: $uv-badge-text-font-size;
+		text-align: $uv-badge-text-align;
+		font-size: $uv-badge-text-font-size;
+		color: $uv-badge-text-color;
+
+		&--dot {
+			height: $uv-badge-dot-size;
+			width: $uv-badge-dot-size;
+		}
+		
+		&--inverted {
+			font-size: 13px;
+		}
+		
+		&--not-dot {
+			padding: $uv-badge-text-padding;
+		}
+
+		&--horn {
+			border-bottom-left-radius: 0;
+		}
+
+		&--primary {
+			background-color: $uv-badge-primary;
+		}
+		
+		&--primary--inverted {
+			color: $uv-badge-primary;
+		}
+
+		&--error {
+			background-color: $uv-badge-error;
+		}
+		
+		&--error--inverted {
+			color: $uv-badge-error;
+		}
+
+		&--success {
+			background-color: $uv-badge-success;
+		}
+		
+		&--success--inverted {
+			color: $uv-badge-success;
+		}
+
+		&--info {
+			background-color: $uv-badge-info;
+		}
+		
+		&--info--inverted {
+			color: $uv-badge-info;
+		}
+
+		&--warning {
+			background-color: $uv-badge-warning;
+		}
+		
+		&--warning--inverted {
+			color: $uv-badge-warning;
+		}
+	}
+</style>
diff --git a/src/uni_modules/uv-badge/package.json b/src/uni_modules/uv-badge/package.json
new file mode 100644
index 00000000..5a813864
--- /dev/null
+++ b/src/uni_modules/uv-badge/package.json
@@ -0,0 +1,87 @@
+{
+	"id": "uv-badge",
+	"displayName": "uv-badge 徽标数，数字角标 全面兼容小程序、nvue、vue2、vue3等多端",
+	"version": "1.0.2",
+	"description": "徽标数一般用于图标右上角显示未读的消息数量，提示用户点击，有圆点和圆包含文字两种形式。",
+	"keywords": [
+        "uv-badge",
+        "uvui",
+        "uv-ui",
+        "徽标数",
+        "数字角标"
+    ],
+	"repository": "",
+	"engines": {
+		"HBuilderX": "^3.1.0"
+	},
+	"dcloudext": {
+		"type": "component-vue",
+		"sale": {
+			"regular": {
+				"price": "0.00"
+			},
+			"sourcecode": {
+				"price": "0.00"
+			}
+		},
+		"contact": {
+			"qq": ""
+		},
+		"declaration": {
+			"ads": "无",
+			"data": "插件不采集任何数据",
+			"permissions": "无"
+		},
+		"npmurl": ""
+	},
+	"uni_modules": {
+		"dependencies": [
+			"uv-ui-tools"
+		],
+		"encrypt": [],
+		"platforms": {
+			"cloud": {
+				"tcb": "y",
+				"aliyun": "y"
+			},
+			"client": {
+				"Vue": {
+					"vue2": "y",
+					"vue3": "y"
+				},
+				"App": {
+					"app-vue": "y",
+					"app-nvue": "y"
+				},
+				"H5-mobile": {
+					"Safari": "y",
+					"Android Browser": "y",
+					"微信浏览器(Android)": "y",
+					"QQ浏览器(Android)": "y"
+				},
+				"H5-pc": {
+					"Chrome": "y",
+					"IE": "y",
+					"Edge": "y",
+					"Firefox": "y",
+					"Safari": "y"
+				},
+				"小程序": {
+					"微信": "y",
+					"阿里": "y",
+					"百度": "y",
+					"字节跳动": "y",
+					"QQ": "y",
+					"钉钉": "u",
+					"快手": "u",
+					"飞书": "u",
+					"京东": "u"
+				},
+				"快应用": {
+					"华为": "u",
+					"联盟": "u"
+				}
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/src/uni_modules/uv-badge/readme.md b/src/uni_modules/uv-badge/readme.md
new file mode 100644
index 00000000..cf597ebe
--- /dev/null
+++ b/src/uni_modules/uv-badge/readme.md
@@ -0,0 +1,11 @@
+## Badge 徽标数
+
+> **组件名：uv-badge**
+
+该组件一般用于图标右上角显示未读的消息数量，提示用户点击，有圆点和圆包含文字两种形式。
+
+### <a href="https://www.uvui.cn/components/badge.html" target="_blank">查看文档</a>
+
+### [完整示例项目下载 | 关注更多组件](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+#### 如使用过程中有任何问题，或者您对uv-ui有一些好的建议，欢迎加入 uv-ui 交流群：<a href="https://ext.dcloud.net.cn/plugin?id=12287" target="_blank">uv-ui</a>、<a href="https://www.uvui.cn/components/addQQGroup.html" target="_blank">官方QQ群</a>
diff --git a/src/uni_modules/uv-tabs/changelog.md b/src/uni_modules/uv-tabs/changelog.md
new file mode 100644
index 00000000..a0924ba2
--- /dev/null
+++ b/src/uni_modules/uv-tabs/changelog.md
@@ -0,0 +1,22 @@
+## 1.0.9（2023-12-01）
+1. 修复current为字符串activeStyle不生效的BUG
+2. 优化文档
+## 1.0.8（2023-10-13）
+1. 优化点击一个选项，change事件重复派发的问题
+## 1.0.7（2023-09-14）
+1. 优化首次加载时，处理下划线会有左到右的过渡效果
+## 1.0.6（2023-09-13）
+1. 修复设置lineWidth未带单位产生的误差BUG
+## 1.0.5（2023-06-23）
+添加uv-icon依赖
+## 1.0.4（2023-06-16）
+1. 增加customStyle参数
+## 1.0.3（2023-06-12）
+1. activeStyle设置字体大小，导致下划线位置不对的BUG，增加this.$nextTick机制
+## 1.0.2（2023-05-23）
+1. 修复nvue中不滚动的BUG
+## 1.0.1（2023-05-16）
+1. 优化组件依赖，修改后无需全局引入，组件导入即可使用
+2. 优化部分功能
+## 1.0.0（2023-05-10）
+uv-tabs 标签选项卡
diff --git a/src/uni_modules/uv-tabs/components/uv-tabs/props.js b/src/uni_modules/uv-tabs/components/uv-tabs/props.js
new file mode 100644
index 00000000..acab29e2
--- /dev/null
+++ b/src/uni_modules/uv-tabs/components/uv-tabs/props.js
@@ -0,0 +1,71 @@
+export default {
+	props: {
+		// 滑块的移动过渡时间，单位ms
+		duration: {
+			type: Number,
+			default: 300
+		},
+		// tabs标签数组
+		list: {
+			type: Array,
+			default: () => []
+		},
+		// 滑块颜色
+		lineColor: {
+			type: String,
+			default: '#3c9cff'
+		},
+		// 菜单选择中时的样式
+		activeStyle: {
+			type: [String, Object],
+			default: () => ({
+				color: '#303133'
+			})
+		},
+		// 菜单非选中时的样式
+		inactiveStyle: {
+			type: [String, Object],
+			default: () => ({
+				color: '#606266'
+			})
+		},
+		// 滑块长度
+		lineWidth: {
+			type: [String, Number],
+			default: 20
+		},
+		// 滑块高度
+		lineHeight: {
+			type: [String, Number],
+			default: 3
+		},
+		// 滑块背景显示大小，当滑块背景设置为图片时使用
+		lineBgSize: {
+			type: String,
+			default: 'cover'
+		},
+		// 菜单item的样式
+		itemStyle: {
+			type: [String, Object],
+			default: () => ({
+				height: '44px'
+			})
+		},
+		// 菜单是否可滚动
+		scrollable: {
+			type: Boolean,
+			default: true
+		},
+		// 当前选中标签的索引
+		current: {
+			type: [Number, String],
+			default: 0
+		},
+		// 默认读取的键名
+		keyName: {
+			type: String,
+			default: 'name'
+		},
+		...uni.$uv?.props?.tabs
+	}
+}
\ No newline at end of file
diff --git a/src/uni_modules/uv-tabs/components/uv-tabs/uv-tabs.vue b/src/uni_modules/uv-tabs/components/uv-tabs/uv-tabs.vue
new file mode 100644
index 00000000..cfbc3b70
--- /dev/null
+++ b/src/uni_modules/uv-tabs/components/uv-tabs/uv-tabs.vue
@@ -0,0 +1,390 @@
+<template>
+	<view class="uv-tabs" :style="[$uv.addStyle(customStyle)]">
+		<view class="uv-tabs__wrapper">
+			<slot name="left" />
+			<view class="uv-tabs__wrapper__scroll-view-wrapper">
+				<scroll-view
+					:scroll-x="scrollable"
+					:scroll-left="scrollLeft"
+					scroll-with-animation
+					class="uv-tabs__wrapper__scroll-view"
+					:show-scrollbar="false"
+					ref="uv-tabs__wrapper__scroll-view"
+				>
+					<view
+						class="uv-tabs__wrapper__nav"
+						ref="uv-tabs__wrapper__nav"
+						:style="{
+							flex: scrollable ? '' : 1
+						}"
+					>
+						<view
+							class="uv-tabs__wrapper__nav__item"
+							v-for="(item, index) in list"
+							:key="index"
+							@tap="clickHandler(item, index)"
+							:ref="`uv-tabs__wrapper__nav__item-${index}`"
+							:style="[{flex: scrollable ? '' : 1},$uv.addStyle(itemStyle)]"
+							:class="[`uv-tabs__wrapper__nav__item-${index}`, item.disabled && 'uv-tabs__wrapper__nav__item--disabled']"
+						>
+							<text
+								:class="[item.disabled && 'uv-tabs__wrapper__nav__item__text--disabled']"
+								class="uv-tabs__wrapper__nav__item__text"
+								:style="[textStyle(index)]"
+							>{{ item[keyName] }}</text>
+							<uv-badge
+								:show="!!(item.badge && (item.badge.show || item.badge.isDot || item.badge.value))"
+								:isDot="item.badge && item.badge.isDot || propsBadge.isDot"
+								:value="item.badge && item.badge.value || propsBadge.value"
+								:max="item.badge && item.badge.max || propsBadge.max"
+								:type="item.badge && item.badge.type || propsBadge.type"
+								:showZero="item.badge && item.badge.showZero || propsBadge.showZero"
+								:bgColor="item.badge && item.badge.bgColor || propsBadge.bgColor"
+								:color="item.badge && item.badge.color || propsBadge.color"
+								:shape="item.badge && item.badge.shape || propsBadge.shape"
+								:numberType="item.badge && item.badge.numberType || propsBadge.numberType"
+								:inverted="item.badge && item.badge.inverted || propsBadge.inverted"
+								customStyle="margin-left: 4px;"
+							></uv-badge>
+						</view>
+						<!-- #ifdef APP-NVUE -->
+						<view
+							class="uv-tabs__wrapper__nav__line"
+							ref="uv-tabs__wrapper__nav__line"
+							:style="[{
+								width: $uv.addUnit(lineWidth),
+								height: firstTime?0:$uv.addUnit(lineHeight),
+								background: lineColor,
+								backgroundSize: lineBgSize
+							}]"
+						>
+						<!-- #endif -->
+						<!-- #ifndef APP-NVUE -->
+						<view
+							class="uv-tabs__wrapper__nav__line"
+							ref="uv-tabs__wrapper__nav__line"
+							:style="[{
+									width: $uv.addUnit(lineWidth),
+									transform: `translate(${lineOffsetLeft}px)`,
+									transitionDuration: `${firstTime ? 0 : duration}ms`,
+									height: firstTime?0:$uv.addUnit(lineHeight),
+									background: lineColor,
+									backgroundSize: lineBgSize,
+								}]"
+						>
+						<!-- #endif -->
+						</view>
+					</view>
+				</scroll-view>
+			</view>
+			<slot name="right" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import mpMixin from '@/uni_modules/uv-ui-tools/libs/mixin/mpMixin.js'
+	import mixin from '@/uni_modules/uv-ui-tools/libs/mixin/mixin.js'
+	import uvBadgeProps from '@/uni_modules/uv-badge/components/uv-badge/props.js'
+	// #ifdef APP-NVUE
+	const animation = uni.requireNativePlugin('animation')
+	const dom = uni.requireNativePlugin('dom')
+	// #endif
+	import props from './props.js';
+	/**
+	 * Tabs 标签
+	 * @description tabs标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。 该组件的一个特点是配置为滚动模式时，激活的tab会自动移动到组件的中间位置。
+	 * @tutorial https://www.uvui.cn/components/tabs.html
+	 * @property {Array}	list	标签数组，元素为对象，如[{name: '推荐'}]
+	 * @property {String | Number}	duration			滑块移动一次所需的时间，单位秒（默认 200 ）
+	 * @property {String | Object} activeStyle	菜单选择中时的样式（默认{ color: '#303133' }）
+	 * @property {String | Object} inactiveStyle	菜单非选择中时的样式（默认{ color: '#606266' }）
+	 * @property {String | Number} lineWidth	滑块长度（默认 20）
+	 * @property {String | Number} lineHeight	滑块高度（默认 3）
+	 * @property {String}	lineColor	滑块颜色（默认：'#3c9cff'）
+	 * @property {String} lineBgSize	滑块背景显示大小，当滑块背景设置为图片时使用（默认 cover）
+	 * @property {String | Number} itemStyle	菜单item的样式（默认 { height: '44px' }）
+	 * @property {String}	scrollable	菜单是否可滚动，选项很少的时候设置为false整个tabs自动居中显示（默认：true）
+	 * @property {String | Number}	current	当前选中标签的索引（默认 0 ）
+	 * @property {String}	keyName	从list元素对象中读取的键名（默认 'name' ）
+	 * @property {String | Number}	swierWidth			swiper的宽度（默认 '750rpx' ）
+	 * @property {String | Object}	customStyle	 自定义外部样式
+	 * 
+	 * @event {Function(index)} change 标签改变时触发 index: 点击了第几个tab，索引从0开始
+	 * @event {Function(index)} click 点击标签时触发 index: 点击了第几个tab，索引从0开始
+	 * @example <uv-tabs :list="list" :is-scroll="false" :current="current" @change="change"></uv-tabs>
+	 */
+	export default {
+		name: 'uv-tabs',
+		emits: ['click','change'],
+		mixins: [mpMixin, mixin, props],
+		data() {
+			return {
+				firstTime: true,
+				scrollLeft: 0,
+				scrollViewWidth: 0,
+				lineOffsetLeft: 0,
+				tabsRect: {
+					left: 0
+				},
+				innerCurrent: 0,
+				moving: false,
+			}
+		},
+		watch: {
+			current: {
+				immediate: true,
+				handler (newValue, oldValue) {
+					// 内外部值不相等时，才尝试移动滑块
+					if (newValue !== this.innerCurrent) {
+						this.innerCurrent = newValue
+						this.$nextTick(() => {
+							this.resize()
+						})
+					}
+				}
+			},
+			// list变化时，重新渲染list各项信息
+			list() {
+				this.$nextTick(() => {
+					this.resize()
+				})
+			}
+		},
+		computed: {
+			textStyle() {
+				return index => {
+					const style = {}
+					// 取当期是否激活的样式
+					const customeStyle = index == this.innerCurrent ? this.$uv.addStyle(this.activeStyle) : this.$uv
+						.addStyle(
+							this.inactiveStyle)
+					// 如果当前菜单被禁用，则加上对应颜色，需要在此做处理，是因为nvue下，无法在style样式中通过!import覆盖标签的内联样式
+					if (this.list[index].disabled) {
+						style.color = '#c8c9cc'
+					}
+					return this.$uv.deepMerge(customeStyle, style)
+				}
+			},
+			propsBadge() {
+				return uvBadgeProps
+			}
+		},
+		async mounted() {
+			this.init()
+		},
+		methods: {
+			setLineLeft() {
+				const tabItem = this.list[this.innerCurrent];
+				if (!tabItem) {
+					return;
+				}
+				// 获取滑块该移动的位置
+				let lineOffsetLeft = this.list
+					.slice(0, this.innerCurrent)
+					.reduce((total, curr) => total + curr.rect.width, 0);
+        // 获取下划线的数值px表示法
+				let lineWidth = this.$uv.getPx(this.lineWidth);
+				// 如果传的值未带单位+设置了全局单位，则带上单位计算，这样才没有误差
+				if (this.$uv.test.number(this.lineWidth) && this.$uv.unit) {
+					lineWidth = this.$uv.getPx(`${this.lineWidth}${this.$uv.unit}`);
+				}
+				this.lineOffsetLeft = lineOffsetLeft + (tabItem.rect.width - lineWidth) / 2
+				// #ifdef APP-NVUE
+				// 第一次移动滑块，无需过渡时间
+				this.animation(this.lineOffsetLeft, this.firstTime ? 0 : parseInt(this.duration))
+				// #endif
+
+				// 如果是第一次执行此方法，让滑块在初始化时，瞬间滑动到第一个tab item的中间
+				// 这里需要一个定时器，因为在非nvue下，是直接通过style绑定过渡时间，需要等其过渡完成后，再设置为false(非第一次移动滑块)
+				if (this.firstTime) {
+					setTimeout(() => {
+						this.firstTime = false
+					}, 20);
+				}
+			},
+			// nvue下设置滑块的位置
+			animation(x, duration = 0) {
+				// #ifdef APP-NVUE
+				const ref = this.$refs['uv-tabs__wrapper__nav__line']
+				animation.transition(ref, {
+					styles: {
+						transform: `translateX(${x}px)`
+					},
+					duration
+				})
+				// #endif
+			},
+			// 点击某一个标签
+			clickHandler(item, index) {
+				// 因为标签可能为disabled状态，所以click是一定会发出的，但是change事件是需要可用的状态才发出
+				this.$emit('click', {
+					...item,
+					index
+				})
+				// 如果disabled状态，返回
+				if (item.disabled) return
+				if(this.innerCurrent != index) {
+					this.$emit('change', {
+						...item,
+						index
+					})
+				}
+				this.innerCurrent = index
+				// #ifndef APP-NVUE
+				this.$nextTick(()=>{
+					this.resize()
+				})
+				// #endif
+				// #ifdef APP-NVUE
+				this.$nextTick(()=>{
+					// nvue模式下再给点延时，确保万无一失
+					this.$uv.sleep(30).then(res=>{
+						this.resize()
+					});
+				})
+				// #endif
+			},
+			init() {
+				this.$uv.sleep().then(() => {
+					this.resize()
+				})
+			},
+			setScrollLeft() {
+				// 当前活动tab的布局信息，有tab菜单的width和left(为元素左边界到父元素左边界的距离)等信息
+				const tabRect = this.list[this.innerCurrent]
+				// 累加得到当前item到左边的距离
+				const offsetLeft = this.list
+					.slice(0, this.innerCurrent)
+					.reduce((total, curr) => {
+						return total + curr.rect.width
+					}, 0)
+				// 此处为屏幕宽度
+				const windowWidth = this.$uv.sys().windowWidth
+				// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
+				let scrollLeft = offsetLeft - (this.tabsRect.width - tabRect.rect.width) / 2 - (windowWidth - this.tabsRect
+					.right) / 2 + this.tabsRect.left / 2
+				// 这里做一个限制，限制scrollLeft的最大值为整个scroll-view宽度减去tabs组件的宽度
+				scrollLeft = Math.min(scrollLeft, this.scrollViewWidth - this.tabsRect.width)
+				this.scrollLeft = Math.max(0, scrollLeft)
+			},
+			// 获取所有标签的尺寸
+			resize() {
+				// 如果不存在list，则不处理
+				if(this.list.length === 0) {
+					return
+				}
+				Promise.all([this.getTabsRect(), this.getAllItemRect()]).then(([tabsRect, itemRect = []]) => {
+					this.tabsRect = tabsRect
+					this.scrollViewWidth = 0
+					itemRect.map((item, index) => {
+						// 计算scroll-view的宽度，这里
+						this.scrollViewWidth += item.width
+						// 另外计算每一个item的中心点X轴坐标
+						this.list[index].rect = item
+					})
+					// 获取了tabs的尺寸之后，设置滑块的位置
+					this.setLineLeft()
+					this.setScrollLeft()
+				})
+			},
+			// 获取导航菜单的尺寸
+			getTabsRect() {
+				return new Promise(resolve => {
+					this.queryRect('uv-tabs__wrapper__scroll-view').then(size => resolve(size))
+				})
+			},
+			// 获取所有标签的尺寸
+			getAllItemRect() {
+				return new Promise(resolve => {
+					const promiseAllArr = this.list.map((item, index) => this.queryRect(
+						`uv-tabs__wrapper__nav__item-${index}`, true))
+					Promise.all(promiseAllArr).then(sizes => resolve(sizes))
+				})
+			},
+			// 获取各个标签的尺寸
+			queryRect(el, item) {
+				// #ifndef APP-NVUE
+				// $uvGetRect为uni-ui自带的节点查询简化方法，详见文档介绍：https://www.uvui.cn/js/getRect.html
+				// 组件内部一般用this.$uvGetRect，对外的为getRect，二者功能一致，名称不同
+				return new Promise(resolve => {
+					this.$uvGetRect(`.${el}`).then(size => {
+						resolve(size)
+					})
+				})
+				// #endif
+
+				// #ifdef APP-NVUE
+				// nvue下，使用dom模块查询元素高度
+				// 返回一个promise，让调用此方法的主体能使用then回调
+				return new Promise(resolve => {
+					dom.getComponentRect(item ? this.$refs[el][0] : this.$refs[el], res => {
+						resolve(res.size)
+					})
+				})
+				// #endif
+			},
+		},
+	}
+</script>
+<style lang="scss" scoped>
+	@import '@/uni_modules/uv-ui-tools/libs/css/components.scss';
+	@import '@/uni_modules/uv-ui-tools/libs/css/color.scss';
+	.uv-tabs {
+
+		&__wrapper {
+			@include flex;
+			align-items: center;
+
+			&__scroll-view-wrapper {
+				flex: 1;
+				/* #ifndef APP-NVUE */
+				overflow: auto hidden;
+				/* #endif */
+			}
+
+			&__scroll-view {
+				@include flex;
+				flex: 1;
+			}
+
+			&__nav {
+				@include flex;
+				position: relative;
+
+				&__item {
+					padding: 0 11px;
+					@include flex;
+					align-items: center;
+					justify-content: center;
+
+					&--disabled {
+						/* #ifndef APP-NVUE */
+						cursor: not-allowed;
+						/* #endif */
+					}
+
+					&__text {
+						font-size: 15px;
+						color: $uv-content-color;
+
+						&--disabled {
+							color: $uv-disabled-color !important;
+						}
+					}
+				}
+
+				&__line {
+					height: 3px;
+					background: $uv-primary;
+					width: 30px;
+					position: absolute;
+					bottom: 2px;
+					border-radius: 100px;
+					transition-property: transform;
+					transition-duration: 300ms;
+				}
+			}
+		}
+	}
+</style>
diff --git a/src/uni_modules/uv-tabs/package.json b/src/uni_modules/uv-tabs/package.json
new file mode 100644
index 00000000..b56f1080
--- /dev/null
+++ b/src/uni_modules/uv-tabs/package.json
@@ -0,0 +1,90 @@
+{
+  "id": "uv-tabs",
+  "displayName": "uv-tabs 标签选项卡 全面兼容vue3+2、app、h5、小程序等多端",
+  "version": "1.0.9",
+  "description": "标签选项卡组件，是一个tabs标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。 该组件的一个特点是配置为滚动模式时，激活的tab会自动移动到组件的中间位置。",
+  "keywords": [
+    "选项卡",
+    "uvui",
+    "uv-ui",
+    "tab",
+    "标签"
+],
+  "repository": "",
+  "engines": {
+    "HBuilderX": "^3.1.0"
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+    	"ads": "无",
+    	"data": "插件不采集任何数据",
+    	"permissions": "无"
+    },
+    "npmurl": ""
+  },
+  "uni_modules": {
+    "dependencies": [
+			"uv-ui-tools",
+			"uv-badge",
+			"uv-sticky",
+			"uv-icon"
+		],
+    "encrypt": [],
+    "platforms": {
+			"cloud": {
+				"tcb": "y",
+				"aliyun": "y"
+			},
+			"client": {
+				"Vue": {
+					"vue2": "y",
+					"vue3": "y"
+				},
+				"App": {
+					"app-vue": "y",
+					"app-nvue": "y"
+				},
+				"H5-mobile": {
+					"Safari": "y",
+					"Android Browser": "y",
+					"微信浏览器(Android)": "y",
+					"QQ浏览器(Android)": "y"
+				},
+				"H5-pc": {
+					"Chrome": "y",
+					"IE": "y",
+					"Edge": "y",
+					"Firefox": "y",
+					"Safari": "y"
+				},
+				"小程序": {
+					"微信": "y",
+					"阿里": "y",
+					"百度": "y",
+					"字节跳动": "y",
+					"QQ": "y",
+					"钉钉": "u",
+					"快手": "u",
+					"飞书": "u",
+					"京东": "u"
+				},
+				"快应用": {
+					"华为": "u",
+					"联盟": "u"
+				}
+			}
+		}
+  }
+}
\ No newline at end of file
diff --git a/src/uni_modules/uv-tabs/readme.md b/src/uni_modules/uv-tabs/readme.md
new file mode 100644
index 00000000..88b74aa0
--- /dev/null
+++ b/src/uni_modules/uv-tabs/readme.md
@@ -0,0 +1,19 @@
+## Tabs 标签选项卡
+
+> **组件名：uv-tabs**
+
+标签选项卡组件，是一个`tabs`标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。 该组件的一个特点是配置为滚动模式时，激活的`tab`会自动移动到组件的中间位置。
+
+# <a href="https://www.uvui.cn/components/tabs.html" target="_blank">查看文档</a>
+
+## [下载完整示例项目](https://ext.dcloud.net.cn/plugin?name=uv-ui) <small>（请不要 下载插件ZIP）</small>
+
+### [更多插件，请关注uv-ui组件库](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+<a href="https://ext.dcloud.net.cn/plugin?name=uv-ui" target="_blank">
+
+![image](https://mp-a667b617-c5f1-4a2d-9a54-683a67cff588.cdn.bspapp.com/uv-ui/banner.png)
+
+</a>
+
+#### 如使用过程中有任何问题反馈，或者您对uv-ui有一些好的建议，欢迎加入uv-ui官方交流群：<a href="https://www.uvui.cn/components/addQQGroup.html" target="_blank">官方QQ群</a>
\ No newline at end of file
diff --git a/uni_modules.rar b/uni_modules.rar
deleted file mode 100644
index 5fc0b848..00000000
Binary files a/uni_modules.rar and /dev/null differ