From d233132f6bef953ae9beb223035b546da1575d9c Mon Sep 17 00:00:00 2001
From: wangxia <779219182@qq.com>
Date: Tue, 19 Aug 2025 14:21:22 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=AA=E5=88=AB=E4=BD=BF=E7=94=A8=E5=88=86?=
 =?UTF-8?q?=E6=94=AF=E7=9A=84=E5=86=85=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../vk-uview-ui/components/u-icon/u-icon.vue       | 142 +++++++++++----------
 .../vk-uview-ui/components/u-tabbar/u-tabbar.vue   |  36 +++---
 2 files changed, 94 insertions(+), 84 deletions(-)

diff --git a/uni_modules/vk-uview-ui/components/u-icon/u-icon.vue b/uni_modules/vk-uview-ui/components/u-icon/u-icon.vue
index 07fd8e6..50acd96 100644
--- a/uni_modules/vk-uview-ui/components/u-icon/u-icon.vue
+++ b/uni_modules/vk-uview-ui/components/u-icon/u-icon.vue
@@ -1,22 +1,13 @@
 <template>
 	<view :style="[customStyle]" class="u-icon" @tap="click" :class="['u-icon--' + labelPos]">
-		<image class="u-icon__img" v-if="isImg" :src="name" :mode="imgMode" :style="[imgStyle]"
-		></image>
-		<view
-			v-else
-			class="u-icon__icon"
-			:class="customClass"
-			:style="[iconStyle]"
-			:hover-class="hoverClass"
-			@touchstart="touchstart"
-		>
-			<text
-				v-if="showDecimalIcon"
-				:style="[decimalIconStyle]"
-				:class="decimalIconClass"
-				:hover-class="hoverClass"
-				class="u-icon__decimal"
-			></text>
+		<view class="" v-if="imgType == 'custom'">
+			<i class="tabImg iconfont" :class="name" />
+		</view>
+		<view class="" v-else>
+			<image class="u-icon__img" v-if="isImg" :src="name" :mode="imgMode" :style="[imgStyle]"></image>
+			<view v-else class="u-icon__icon" :class="customClass" :style="[iconStyle]" :hover-class="hoverClass" @touchstart="touchstart">
+				<text v-if="showDecimalIcon" :style="[decimalIconStyle]" :class="decimalIconClass" :hover-class="hoverClass" class="u-icon__decimal"></text>
+			</view>
 		</view>
 		<!-- 这里进行空字符串判断，如果仅仅是v-if="label"，可能会出现传递0的时候，结果也无法显示，微信小程序不传值默认为null，故需要增加null的判断 -->
 		<text
@@ -28,7 +19,7 @@
 				marginLeft: labelPos == 'right' ? $u.addUnit(marginLeft) : 0,
 				marginTop: labelPos == 'bottom' ? $u.addUnit(marginTop) : 0,
 				marginRight: labelPos == 'left' ? $u.addUnit(marginRight) : 0,
-				marginBottom: labelPos == 'top' ? $u.addUnit(marginBottom) : 0
+				marginBottom: labelPos == 'top' ? $u.addUnit(marginBottom) : 0,
 			}"
 		>
 			{{ label }}
@@ -72,126 +63,129 @@ export default {
 	name: "u-icon",
 	emits: ["click", "touchstart"],
 	props: {
-		imgradius:{
-			default: '0'
+		imgradius: {
+			default: "0",
+		},
+		imgType: {
+			default: "",
 		},
 		// 图标类名
 		name: {
 			type: String,
-			default: ""
+			default: "",
 		},
 		// 图标颜色，可接受主题色
 		color: {
 			type: [String, null],
-			default: ""
+			default: "",
 		},
 		// 字体大小，单位rpx
 		size: {
 			type: [Number, String],
-			default: "inherit"
+			default: "inherit",
 		},
 		// 是否显示粗体
 		bold: {
 			type: Boolean,
-			default: false
+			default: false,
 		},
 		// 点击图标的时候传递事件出去的index（用于区分点击了哪一个）
 		index: {
 			type: [Number, String],
-			default: ""
+			default: "",
 		},
 		// 触摸图标时的类名
 		hoverClass: {
 			type: String,
-			default: ""
+			default: "",
 		},
 		// 自定义扩展前缀，方便用户扩展自己的图标库
 		customPrefix: {
 			type: String,
-			default: "uicon"
+			default: "uicon",
 		},
 		// 图标右边或者下面的文字
 		label: {
 			type: [String, Number],
-			default: ""
+			default: "",
 		},
 		// label的位置，只能右边或者下边
 		labelPos: {
 			type: String,
-			default: "right"
+			default: "right",
 		},
 		// label的大小
 		labelSize: {
 			type: [String, Number],
-			default: "28"
+			default: "28",
 		},
 		// label的颜色
 		labelColor: {
 			type: String,
-			default: "#606266"
+			default: "#606266",
 		},
 		// label与图标的距离(横向排列)
 		marginLeft: {
 			type: [String, Number],
-			default: "6"
+			default: "6",
 		},
 		// label与图标的距离(竖向排列)
 		marginTop: {
 			type: [String, Number],
-			default: "6"
+			default: "6",
 		},
 		// label与图标的距离(竖向排列)
 		marginRight: {
 			type: [String, Number],
-			default: "6"
+			default: "6",
 		},
 		// label与图标的距离(竖向排列)
 		marginBottom: {
 			type: [String, Number],
-			default: "6"
+			default: "6",
 		},
 		// 图片的mode
 		imgMode: {
 			type: String,
-			default: "widthFix"
+			default: "widthFix",
 		},
 		// 自定义样式
 		customStyle: {
 			type: Object,
 			default() {
 				return {};
-			}
+			},
 		},
 		// 用于显示图片小图标时，图片的宽度
 		width: {
 			type: [String, Number],
-			default: ""
+			default: "",
 		},
 		// 用于显示图片小图标时，图片的高度
 		height: {
 			type: [String, Number],
-			default: ""
+			default: "",
 		},
 		// 用于解决某些情况下，让图标垂直居中的用途
 		top: {
 			type: [String, Number],
-			default: 0
+			default: 0,
 		},
 		// 是否为DecimalIcon
 		showDecimalIcon: {
 			type: Boolean,
-			default: false
+			default: false,
 		},
 		// 背景颜色，可接受主题色，仅Decimal时有效
 		inactiveColor: {
 			type: String,
-			default: "#ececec"
+			default: "#ececec",
 		},
 		// 显示的百分比，仅Decimal时有效
 		percent: {
 			type: [Number, String],
-			default: "50"
-		}
+			default: "50",
+		},
 	},
 	computed: {
 		customClass() {
@@ -211,14 +205,9 @@ export default {
 				classes.push(customPrefix);
 			}
 			// 主题色，通过类配置
-			if (
-				this.showDecimalIcon &&
-				this.inactiveColor &&
-				this.$u.config.type.includes(this.inactiveColor)
-			) {
+			if (this.showDecimalIcon && this.inactiveColor && this.$u.config.type.includes(this.inactiveColor)) {
 				classes.push("u-icon__icon--" + this.inactiveColor);
-			} else if (this.color && this.$u.config.type.includes(this.color))
-				classes.push("u-icon__icon--" + this.color);
+			} else if (this.color && this.$u.config.type.includes(this.color)) classes.push("u-icon__icon--" + this.color);
 			// 阿里，头条，百度小程序通过数组绑定类名时，无法直接使用[a, b, c]的形式，否则无法识别
 			// 故需将其拆成一个字符串的形式，通过空格隔开各个类名
 			//#ifdef MP-ALIPAY || MP-TOUTIAO || MP-BAIDU
@@ -232,14 +221,10 @@ export default {
 				fontSize: this.size == "inherit" ? "inherit" : this.$u.addUnit(this.size),
 				fontWeight: this.bold ? "bold" : "normal",
 				// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
-				top: this.$u.addUnit(this.top)
+				top: this.$u.addUnit(this.top),
 			};
 			// 非主题色值时，才当作颜色值
-			if (
-				this.showDecimalIcon &&
-				this.inactiveColor &&
-				!this.$u.config.type.includes(this.inactiveColor)
-			) {
+			if (this.showDecimalIcon && this.inactiveColor && !this.$u.config.type.includes(this.inactiveColor)) {
 				style.color = this.inactiveColor;
 			} else if (this.color && !this.$u.config.type.includes(this.color)) style.color = this.color;
 
@@ -264,7 +249,7 @@ export default {
 				fontWeight: this.bold ? "bold" : "normal",
 				// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
 				top: this.$u.addUnit(this.top),
-				width: this.percent + "%"
+				width: this.percent + "%",
 			};
 			// 非主题色值时，才当作颜色值
 			if (this.color && !this.$u.config.type.includes(this.color)) style.color = this.color;
@@ -280,8 +265,7 @@ export default {
 				classes.push(this.customPrefix);
 			}
 			// 主题色，通过类配置
-			if (this.color && this.$u.config.type.includes(this.color))
-				classes.push("u-icon__icon--" + this.color);
+			if (this.color && this.$u.config.type.includes(this.color)) classes.push("u-icon__icon--" + this.color);
 			else classes.push("u-icon__icon--primary");
 			// 阿里，头条，百度小程序通过数组绑定类名时，无法直接使用[a, b, c]的形式，否则无法识别
 			// 故需将其拆成一个字符串的形式，通过空格隔开各个类名
@@ -289,7 +273,7 @@ export default {
 			classes = classes.join(" ");
 			//#endif
 			return classes;
-		}
+		},
 	},
 	methods: {
 		click() {
@@ -297,15 +281,45 @@ export default {
 		},
 		touchstart() {
 			this.$emit("touchstart", this.index);
-		}
-	}
+		},
+	},
 };
 </script>
 
 <style scoped lang="scss">
 @import "../../libs/css/style.components.scss";
 @import "../../iconfont.css";
-
+@font-face {
+	font-family: "iconfont"; /* Project id 4374774 */
+	src: url("//at.alicdn.com/t/c/font_4374774_pt88dt6fxcj.woff2?t=1741923897019") format("woff2"), url("//at.alicdn.com/t/c/font_4374774_pt88dt6fxcj.woff?t=1741923897019") format("woff"), url("//at.alicdn.com/t/c/font_4374774_pt88dt6fxcj.ttf?t=1741923897019") format("truetype");
+}
+.iconfont {
+	font-family: "iconfont" !important;
+	font-size: 24px;
+	font-style: normal;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+// 首页
+.icon-home:before {
+	content: "\e7e1";
+}
+// 工单
+.icon-order_active:before {
+	content: "\e617";
+}
+// 消息
+.icon-message:before {
+	content: "\e78a";
+}
+// 我的
+.icon-user:before {
+	content: "\e7ae";
+}
+// 发单号
+.icon-fadanhao-31:before {
+	content: "\e65c";
+}
 .u-icon {
 	display: inline-flex;
 	align-items: center;
diff --git a/uni_modules/vk-uview-ui/components/u-tabbar/u-tabbar.vue b/uni_modules/vk-uview-ui/components/u-tabbar/u-tabbar.vue
index 59ca812..d1997c3 100644
--- a/uni_modules/vk-uview-ui/components/u-tabbar/u-tabbar.vue
+++ b/uni_modules/vk-uview-ui/components/u-tabbar/u-tabbar.vue
@@ -22,23 +22,14 @@
 					backgroundColor: bgColor,
 				}"
 			>
-				<view :class="[midButton && item.midButton ? 'u-tabbar__content__circle__button' : 'u-tabbar__content__item__button']" 
-					:style="{ 
-						top: item.text ? '7px' : '7px' ,
-					}">
-					<u-icon 
-					:size="midButton && item.midButton ? midButtonSize : (item.iconSize ? item.iconSize : 24)" 
-					:name="elIconPath(index)" 
-					img-mode="scaleToFill" 
-					:color="elColor(index)" 
-					:custom-prefix="item.customIcon ? 'custom-icon' : 'uicon'"
-					:imgradius="item.iconType == 'custom' ? '50%' : '0'"
-					></u-icon>
-					<u-badge :count="item.count" 
-										:is-dot="item.isDot" 
-										v-if="item.count" 
-										:offset="[-2, getOffsetRight(item.count, item.isDot)]"
-					></u-badge>
+				<view
+					:class="[midButton && item.midButton ? 'u-tabbar__content__circle__button' : 'u-tabbar__content__item__button']"
+					:style="{
+						top: item.text ? '7px' : '7px',
+					}"
+				>
+					<u-icon :size="midButton && item.midButton ? midButtonSize : item.iconSize ? item.iconSize : 24" :name="elIconPath(index)" img-mode="scaleToFill" :color="elColor(index)" :imgType="imgType" :custom-prefix="item.customIcon ? 'custom-icon' : 'uicon'" :imgradius="item.iconType == 'custom' ? '50%' : '0'"></u-icon>
+					<u-badge :count="item.count" :is-dot="item.isDot" v-if="item.count" :offset="[-2, getOffsetRight(item.count, item.isDot)]"></u-badge>
 				</view>
 				<view
 					class="u-tabbar__content__item__text"
@@ -83,6 +74,10 @@ export default {
 			type: [String, Number],
 			default: 0,
 		},
+		imgType: {
+			type: [String],
+			default: '',
+		},
 		modelValue: {
 			type: [String, Number],
 			default: 0,
@@ -357,7 +352,7 @@ export default {
 			flex: 1;
 			justify-content: center;
 			height: 100%;
-			padding: 6px 0;
+			padding: 0;
 			@include vue-flex;
 			flex-direction: column;
 			align-items: center;
@@ -411,8 +406,9 @@ export default {
 		}
 	}
 }
-.mround{
-	image,img{
+.mround {
+	image,
+	img {
 		border-radius: 50%;
 	}
 }