uview-pro 0.4.2 → 0.4.4

package/changelog.md

@@ -1,19 +1,51 @@
-## 0.4.2（2025-12-01）
+## 0.4.4（2025-12-08）
 
-### 📝 Documentation | 文档
+### ✨ Features | 新功能
 
-- **scripts:** 更新发布指定版本说明文档 ([db6bfe8](https://github.com/anyup/uView-Pro/commit/db6bfe8a7ec2812f34738b5b707240cdfe57e8b3))
+- **u-card:** u-card 组件的默认插槽同 body 插槽 ([ffa13ed](https://github.com/anyup/uView-Pro/commit/ffa13edcf17ff1559e8bdf2260f6b146680f9d07))
+- **u-tag:** 优化自定义样式 custom-style 应用，支持 text 插槽内容 ([5bdb733](https://github.com/anyup/uView-Pro/commit/5bdb73346252850d74165cda0bb00766e5f6f59f))
+- **u-line-progress:** 优化u-line-progress进度条百分比显示方式 ([1c1d979](https://github.com/anyup/uView-Pro/commit/1c1d97958f3c7e5a28943b46ea25d38b50449364))
+- **switch:** 增强开关组件支持自定义值类型 ([2bcb136](https://github.com/anyup/uView-Pro/commit/2bcb1368aa1f3c7fe83799e909b89fc4349b30c3))
 
-### 🐛 Bug Fixes | Bug 修复
+### 📝 Documentation | 文档
 
-- **theme:** 修复npm方式加载主题包失效的问题 ([7b9c947](https://github.com/anyup/uView-Pro/commit/7b9c947581697ddbd36632919652689ca8595503))
-- **dark-mode:** 修复 App 平台暗黑模式跟随系统下，切换系统暗黑模式后不即时生效问题 ([880b181](https://github.com/anyup/uView-Pro/commit/880b18153d186f6f5c5f9c81bf12307bd8f00c22))
-- **initTheme:** 优化组件库 install 方法中的主题初始化默认逻辑 ([39e273b](https://github.com/anyup/uView-Pro/commit/39e273b98cd53ec2891c7e68419dd6dfbbeb30c0))
+- 优化 Markdown 文档样式和格式 ([c80ff6d](https://github.com/anyup/uView-Pro/commit/c80ff6df269eb92a88001373aa96344ff4cafb79))
 
 ### 👥 Contributors
 
-<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
+<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> <a href="https://github.com/liujiayii"><img src="https://github.com/liujiayii.png?size=40" width="40" height="40" alt="liujiayii" title="liujiayii"/></a> 
 
+## 0.4.3（2025-12-03）
+
+### 📝 Documentation | 文档
+
+- 更新项目描述和移除冗余信息 ([3d5c105](https://github.com/anyup/uView-Pro/commit/3d5c1053873a1a1dc592e02caf62b5e5f9aba3ad))
+- **readme:** 更新交流反馈和捐赠链接 ([266e788](https://github.com/anyup/uView-Pro/commit/266e7883a4e2f3ea8058e0bba0b7ce07a972bad8))
+
+### 🐛 Bug Fixes | Bug 修复
+
+- **theme:** 修复不使用 u-config-privider 全局注入时，部分颜色变量不存在的问题 ([cd82d9d](https://github.com/anyup/uView-Pro/commit/cd82d9da3e8fd6066177e3b78b855583e2756a5f))
+
+### 👥 Contributors
+
+<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
+
+## 0.4.2（2025-12-01）
+
+### 📝 Documentation | 文档
+
+- **scripts:** 更新发布指定版本说明文档 ([db6bfe8](https://github.com/anyup/uView-Pro/commit/db6bfe8a7ec2812f34738b5b707240cdfe57e8b3))
+
+### 🐛 Bug Fixes | Bug 修复
+
+- **theme:** 修复npm方式加载主题包失效的问题 ([7b9c947](https://github.com/anyup/uView-Pro/commit/7b9c947581697ddbd36632919652689ca8595503))
+- **dark-mode:** 修复 App 平台暗黑模式跟随系统下，切换系统暗黑模式后不即时生效问题 ([880b181](https://github.com/anyup/uView-Pro/commit/880b18153d186f6f5c5f9c81bf12307bd8f00c22))
+- **initTheme:** 优化组件库 install 方法中的主题初始化默认逻辑 ([39e273b](https://github.com/anyup/uView-Pro/commit/39e273b98cd53ec2891c7e68419dd6dfbbeb30c0))
+
+### 👥 Contributors
+
+<a href="https://github.com/anyup"><img src="https://github.com/anyup.png?size=40" width="40" height="40" alt="anyup" title="anyup"/></a> 
+
 ## 0.4.1（2025-11-30）
 
 ### ✨ Features | 新功能

package/components/u-card/u-card.vue

@@ -61,6 +61,7 @@
             <slot name="head" v-else />
         </view>
         <view @tap="onBodyClick" class="u-card__body" :style="[{ padding: padding + 'rpx' }, bodyStyle]">
+            <slot />
             <slot name="body" />
         </view>
         <view

package/components/u-line-progress/u-line-progress.vue

@@ -17,9 +17,9 @@
             :style="progressStyle"
         >
             <slot v-if="slots.default" />
-            <template v-else-if="showPercent">
+            <text class="u-progress-text" v-else-if="showPercent">
                 {{ percent + '%' }}
-            </template>
+            </text>
         </view>
     </view>
 </template>
@@ -114,6 +114,11 @@ const progressStyle = computed(() => {
     animation: progress-stripes 2s linear infinite;
 }
 
+.u-progress-text {
+    color: var(--u-light-color);
+    padding: 0 10rpx;
+}
+
 @keyframes progress-stripes {
     0% {
         background-position: 0 0;

package/components/u-switch/types.ts

@@ -18,8 +18,8 @@ export const SwitchProps = {
     activeColor: { type: String, default: () => getColor('primary') },
     /** 关闭时的颜色 */
     inactiveColor: { type: String, default: 'var(--u-white-color)' },
-    /** v-model 绑定值，是否选中 */
-    modelValue: { type: Boolean, default: false },
+    /** v-model 绑定值，开关状态值 */
+    modelValue: { type: [Number, String, Boolean] as PropType<number | string | boolean>, default: false },
     /** 是否开启轻微震动反馈 */
     vibrateShort: { type: Boolean, default: false },
     /** 打开时的值 */

package/components/u-switch/u-switch.vue

@@ -1,7 +1,7 @@
 <template>
     <view
         class="u-switch"
-        :class="[modelValue == true ? 'u-switch--on' : '', disabled ? 'u-switch--disabled' : '', customClass]"
+        :class="[isChecked ? 'u-switch--on' : '', disabled ? 'u-switch--disabled' : '', customClass]"
         @tap="onClick"
         :style="$u.toStyle(switchStyle, customStyle)"
     >
@@ -53,20 +53,28 @@ const props = defineProps(SwitchProps);
 
 const emit = defineEmits(['update:modelValue', 'change']);
 
+/**
+ * 计算属性：是否处于激活状态
+ * 通过比较modelValue和activeValue来确定开关的真实状态
+ */
+const isChecked = computed(() => {
+    return props.modelValue === props.activeValue;
+});
+
 /**
  * 计算开关样式
  */
 const switchStyle = computed(() => {
     let style: Record<string, string> = {};
     style.fontSize = props.size + 'rpx';
-    style.backgroundColor = props.modelValue ? props.activeColor : props.inactiveColor;
+    style.backgroundColor = isChecked.value ? props.activeColor : props.inactiveColor;
     return style;
 });
 /**
  * 计算加载动画颜色
  */
 const loadingColor = computed(() => {
-    return props.modelValue ? props.activeColor : null;
+    return isChecked.value ? props.activeColor : null;
 });
 
 /**
@@ -76,10 +84,13 @@ function onClick() {
     if (!props.disabled && !props.loading) {
         // 使手机产生短促震动，微信小程序有效，APP(HX 2.6.8)和H5无效
         if (props.vibrateShort) uni.vibrateShort();
-        emit('update:modelValue', !props.modelValue);
+
+        // 根据当前状态切换到另一个值
+        const newValue = isChecked.value ? props.inactiveValue : props.activeValue;
+        emit('update:modelValue', newValue);
         // 放到下一个生命周期，因为双向绑定的value修改父组件状态需要时间，且是异步的
         nextTick(() => {
-            emit('change', props.modelValue ? props.activeValue : props.inactiveValue);
+            emit('change', newValue);
         });
     }
 }
@@ -113,11 +124,6 @@ function onClick() {
     border-radius: 100%;
     z-index: 1;
     background-color: var(--u-bg-white);
-    background-color: var(--u-bg-white);
-    box-shadow:
-        0 3px 1px 0 rgba(0, 0, 0, 0.05),
-        0 2px 2px 0 rgba(0, 0, 0, 0.1),
-        0 3px 3px 0 rgba(0, 0, 0, 0.05);
     box-shadow:
         0 3px 1px 0 rgba(0, 0, 0, 0.05),
         0 2px 2px 0 rgba(0, 0, 0, 0.1),

package/components/u-tag/u-tag.vue

@@ -9,10 +9,12 @@
             customClass
         ]"
         class="u-tag"
-        :style="$u.toStyle(customStyle)"
+        :style="$u.toStyle(tagStyle, customStyle)"
         @tap="clickTag"
     >
-        {{ text }}
+        <slot>
+            {{ text }}
+        </slot>
         <view class="u-icon-wrap" @tap.stop>
             <u-icon
                 @click="close"
@@ -75,7 +77,7 @@ const props = defineProps(TagProps);
 /**
  * 计算 tag 的自定义样式
  */
-const customStyle = computed(() => {
+const tagStyle = computed(() => {
     let style: Record<string, any> = {};
     // 文字颜色（如果有此值，会覆盖type值的颜色）
     if (props.color) style.color = props.color;

package/package.json

@@ -2,8 +2,8 @@
     "id": "uview-pro",
     "name": "uview-pro",
     "displayName": "【支持鸿蒙】uView Pro｜基于Vue3+TS的80+精选UI组件库，支持多主题，暗黑模式",
-    "version": "0.4.2",
-    "description": "uView Pro，是全面支持Vue3的uni-app生态框架，80+精选组件已全面使用TypeScript重构，智能多主题配置，一键暗黑模式",
+    "version": "0.4.4",
+    "description": "uView Pro，是全面支持Vue3+TS的uni-app生态框架，80+精选组件，支持安卓，iOS，鸿蒙，各小程序平台，支持多主题，一键暗黑模式",
     "main": "index.ts",
     "module": "index.ts",
     "browser": "index.ts",

package/readme.md

@@ -67,20 +67,15 @@ pnpm dev
 
 ## 交流反馈
 
-`uView Pro` 微信交流群： [点击进入](https://uviewpro.cn/zh/resource/about.html)
+欢迎通过各种方式来交流反馈，让 uView Pro 更好的为大家服务：
 
-`uView Pro` QQ 交流群： [点击进入](http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=98nSVDldWEbDdq4lxiP4aL7uATfMSlI6&authKey=G2yQJ5MQiKzMldaxBsIfKt17NuJuUw8Fr6zdKLggc6NZXgw4BVbqkU2U3EE994yd&noverify=0&group_code=811732166)
+[欢迎交流反馈](https://uviewpro.cn/zh/resource/about.html)
 
-<table class="table">
-    <tr>
-        <td><img src="https://ik.imagekit.io/anyup/images/social/weixin-chat-cl.png" width="250" height="345" ></td>
-        <td><img src="https://ik.imagekit.io/anyup/images/social/qq-chat.png" width="250" height="345" ></td>
-    </tr>
-    <tr>
-        <td align="center"><strong>微信群</strong><br></td>
-        <td align="center"><strong>QQ群</strong><br></td>
-    </tr>
-</table>
+## 捐赠 uView Pro
+
+开源不易，如果您认为 `uView Pro` 帮到了您的开发工作，您可以捐赠 `uView Pro`：
+
+[欢迎捐赠留名](https://uviewpro.cn/zh/resource/donation.html)
 
 ## 关于 PR
 
@@ -206,21 +201,6 @@ export function createApp() {
 
 请通过[快速上手](https://uviewpro.cn/zh/components/quickstart.html)了解更详细的内容
 
-## 捐赠 uView Pro
-
-`uView Pro` 文档内容和框架源码基于 `uView UI` 二次开发，因此全部开源免费，如果您认为 `uView Pro` 帮到了您的开发工作，您可以捐赠 `uView Pro` 的研发工作，捐赠无门槛，哪怕是一杯可乐也好(相信这比打赏主播更有意义)。
-
-<table class="table">
-    <tr>
-        <td><img src="https://ik.imagekit.io/anyup/images/social/wechat-pay.png" width="250" height="345" ></td>
-        <td><img src="https://ik.imagekit.io/anyup/images/social/ali-pay.png" width="250" height="345" ></td>
-    </tr>
-    <tr>
-        <td align="center"><strong>微信</strong><br></td>
-        <td align="center"><strong>支付宝</strong><br></td>
-    </tr>
-</table>
-
 ## 贡献者
 
 <a href="https://github.com/anyup/uView-Pro/graphs/contributors">

package/theme.scss

@@ -2,53 +2,115 @@
 // uni.scss中引入的样式会同时混入到全局样式文件和单独每一个页面的样式中，造成微信程序包太大，
 // 故uni.scss只建议放scss变量名相关样式，其他的样式可以通过main.js或者App.vue引入
 
-// 常用色
-$u-main-color: var(--u-main-color, #303133);
-$u-content-color: var(--u-content-color, #606266);
-$u-tips-color: var(--u-tips-color, #909399);
-$u-light-color: var(--u-light-color, #c0c4cc);
-$u-border-color: var(--u-border-color, #e4e7ed);
-$u-divider-color: var(--u-divider-color, #e4e7ed);
-$u-mask-color: var(--u-mask-color, rgba(0, 0, 0, 0.4));
-$u-shadow-color: var(--u-shadow-color, rgba(0, 0, 0, 0.1));
+:root,
+page {
+    /* 纯色 */
+    --u-white-color: #ffffff;
+    --u-black-color: #000000;
+
+    // 字体色
+    --u-main-color: #303133;
+    --u-content-color: #606266;
+    --u-tips-color: #909399;
+    --u-light-color: #c0c4cc;
+
+    // 边框色
+    --u-border-color: #e4e7ed;
+    --u-divider-color: #e4e7ed;
+
+    // 遮罩色
+    --u-mask-color: rgba(0, 0, 0, 0.4);
+    --u-shadow-color: rgba(0, 0, 0, 0.1);
+
+    /* 背景色 */
+    --u-bg-color: #f3f4f6;
+    --u-bg-white: #ffffff;
+    --u-bg-gray-light: #f5f7fa;
+    --u-bg-gray-dark: #2f343c;
+    --u-bg-black: #000000;
+
+    /* 主色 */
+    --u-type-primary: #2979ff;
+    --u-type-primary-light: #ecf5ff;
+    --u-type-primary-disabled: #a0cfff;
+    --u-type-primary-dark: #2b85e4;
+
+    /* 警告色 */
+    --u-type-warning: #ff9900;
+    --u-type-warning-disabled: #fcbd71;
+    --u-type-warning-dark: #f29100;
+    --u-type-warning-light: #fdf6ec;
+
+    /* 成功色 */
+    --u-type-success: #19be6b;
+    --u-type-success-disabled: #71d5a1;
+    --u-type-success-dark: #18b566;
+    --u-type-success-light: #dbf1e1;
+
+    /* 错误色 */
+    --u-type-error: #fa3534;
+    --u-type-error-disabled: #fab6b6;
+    --u-type-error-dark: #dd6161;
+    --u-type-error-light: #fef0f0;
+
+    /* 信息色 */
+    --u-type-info: #909399;
+    --u-type-info-disabled: #c8c9cc;
+    --u-type-info-dark: #82848a;
+    --u-type-info-light: #f4f4f5;
+}
 
 // 纯色
-$u-white-color: var(--u-white-color, #ffffff);
-$u-black-color: var(--u-black-color, #000000);
+$u-white-color: var(--u-white-color);
+$u-black-color: var(--u-black-color);
+
+// 字体色
+$u-main-color: var(--u-main-color);
+$u-content-color: var(--u-content-color);
+$u-tips-color: var(--u-tips-color);
+$u-light-color: var(--u-light-color);
+
+// 边框色
+$u-border-color: var(--u-border-color);
+$u-divider-color: var(--u-divider-color);
+
+// 遮罩色
+$u-mask-color: var(--u-mask-color);
+$u-shadow-color: var(--u-shadow-color);
 
 // 背景色
-$u-bg-color: var(--u-bg-color, #f3f4f6);
-$u-bg-white: var(--u-bg-white, #ffffff);
-$u-bg-gray-light: var(--u-bg-gray-light, #f5f7fa);
-$u-bg-gray-dark: var(--u-bg-gray-dark, #2f343c);
-$u-bg-black: var(--u-bg-black, #000000);
+$u-bg-color: var(--u-bg-color);
+$u-bg-white: var(--u-bg-white);
+$u-bg-gray-light: var(--u-bg-gray-light);
+$u-bg-gray-dark: var(--u-bg-gray-dark);
+$u-bg-black: var(--u-bg-black);
 
 // 主色
-$u-type-primary: var(--u-type-primary, #2979ff);
-$u-type-primary-light: var(--u-type-primary-light, #ecf5ff);
-$u-type-primary-disabled: var(--u-type-primary-disabled, #a0cfff);
-$u-type-primary-dark: var(--u-type-primary-dark, #2b85e4);
+$u-type-primary: var(--u-type-primary);
+$u-type-primary-light: var(--u-type-primary-light);
+$u-type-primary-disabled: var(--u-type-primary-disabled);
+$u-type-primary-dark: var(--u-type-primary-dark);
 
 // 警告色
-$u-type-warning: var(--u-type-warning, #ff9900);
-$u-type-warning-disabled: var(--u-type-warning-disabled, #fcbd71);
-$u-type-warning-dark: var(--u-type-warning-dark, #f29100);
-$u-type-warning-light: var(--u-type-warning-light, #fdf6ec);
+$u-type-warning: var(--u-type-warning);
+$u-type-warning-disabled: var(--u-type-warning-disabled);
+$u-type-warning-dark: var(--u-type-warning-dark);
+$u-type-warning-light: var(--u-type-warning-light);
 
 // 成功色
-$u-type-success: var(--u-type-success, #19be6b);
-$u-type-success-disabled: var(--u-type-success-disabled, #71d5a1);
-$u-type-success-dark: var(--u-type-success-dark, #18b566);
-$u-type-success-light: var(--u-type-success-light, #dbf1e1);
+$u-type-success: var(--u-type-success);
+$u-type-success-disabled: var(--u-type-success-disabled);
+$u-type-success-dark: var(--u-type-success-dark);
+$u-type-success-light: var(--u-type-success-light);
 
 // 错误色
-$u-type-error: var(--u-type-error, #fa3534);
-$u-type-error-disabled: var(--u-type-error-disabled, #fab6b6);
-$u-type-error-dark: var(--u-type-error-dark, #dd6161);
-$u-type-error-light: var(--u-type-error-light, #fef0f0);
+$u-type-error: var(--u-type-error);
+$u-type-error-disabled: var(--u-type-error-disabled);
+$u-type-error-dark: var(--u-type-error-dark);
+$u-type-error-light: var(--u-type-error-light);
 
 // 信息色
-$u-type-info: var(--u-type-info, #909399);
-$u-type-info-disabled: var(--u-type-info-disabled, #c8c9cc);
-$u-type-info-dark: var(--u-type-info-dark, #82848a);
-$u-type-info-light: var(--u-type-info-light, #f4f4f5);
+$u-type-info: var(--u-type-info);
+$u-type-info-disabled: var(--u-type-info-disabled);
+$u-type-info-dark: var(--u-type-info-dark);
+$u-type-info-light: var(--u-type-info-light);