fusions-ui 1.2.7 → 1.2.9

package/global.d.ts

@@ -0,0 +1,103 @@
+import type { App } from 'vue';
+import type { Common } from './utils/common';
+import type { Config } from './config/config';
+import type { Check } from './utils/check';
+import type { ApplyEven } from './utils/applyEven'
+import type { Toast } from './utils/toast';
+
+/**
+ * $fu 工具类型声明
+ * @description 封装了常用的方法函数，可直接通过`uni.$fu`形式调用
+ */
+
+interface Utils extends Common, Check, Toast, ApplyEven {
+	config: Config;
+	[key: string]: any;
+}
+
+declare global {
+	interface Uni {
+		$fu: Utils;
+	}
+}
+
+// 声明全局组件类型
+declare module 'vue' {
+	interface ComponentCustomProperties {
+		$fu: Utils;
+	}
+	
+	interface GlobalComponents {
+		FuAvatar: typeof import('./components/avatar/src/avatar.vue')['default'];
+		FuAvatarGroup: typeof import('./components/avatar-group/src/avatar-group.vue')['default'];
+		FuBadge: typeof import('./components/badge/src/badge.vue')['default'];
+		FuBannerArc: typeof import('./components/banner-arc/src/banner-arc.vue')['default'];
+		FuButton: typeof import('./components/button/src/button.vue')['default'];
+		FuCell: typeof import('./components/cell/src/cell.vue')['default'];
+		FuCellGroup: typeof import('./components/cell-group/src/cell-group.vue')['default'];
+		FuCheckbox: typeof import('./components/checkbox/src/checkbox.vue')['default'];
+		FuCodeInput: typeof import('./components/code-input/src/code-input.vue')['default'];
+		FuCodeVerify: typeof import('./components/code-verify/src/code-verify.vue')['default'];
+		FuCollapse: typeof import('./components/collapse/src/collapse.vue')['default'];
+		FuCollapseItem: typeof import('./components/collapse-item/src/collapse-item.vue')['default'];
+		FuCountdown: typeof import('./components/countdown/src/countdown.vue')['default'];
+		FuDatetimePicker: typeof import('./components/datetime-picker/src/datetime-picker.vue')['default'];
+		FuForm: typeof import('./components/form/src/form.vue')['default'];
+		FuFormItem: typeof import('./components/form-item/src/form-item.vue')['default'];
+		FuGrid: typeof import('./components/grid/src/grid.vue')['default'];
+		FuGridItem: typeof import('./components/grid-item/src/grid-item.vue')['default'];
+		FuIcon: typeof import('./components/icon/src/icon.vue')['default'];
+		FuImage: typeof import('./components/image/src/image.vue')['default'];
+		FuIndexAnchor: typeof import('./components/index-anchor/src/index-anchor.vue')['default'];
+		FuIndexItem: typeof import('./components/index-item/src/index-item.vue')['default'];
+		FuIndexList: typeof import('./components/index-list/src/index-list.vue')['default'];
+		FuInput: typeof import('./components/input/src/input.vue')['default'];
+		FuKeyboard: typeof import('./components/keyboard/src/keyboard.vue')['default'];
+		FuLine: typeof import('./components/line/src/line.vue')['default'];
+		FuLink: typeof import('./components/link/src/link.vue')['default'];
+		FuLoading: typeof import('./components/loading/src/loading.vue')['default'];
+		FuLoadingMore: typeof import('./components/loading-more/src/loading-more.vue')['default'];
+		FuModal: typeof import('./components/modal/src/modal.vue')['default'];
+		FuNavbar: typeof import('./components/navbar/src/navbar.vue')['default'];
+		FuNoticeBar: typeof import('./components/notice-bar/src/notice-bar.vue')['default'];
+		FuNumberBox: typeof import('./components/number-box/src/number-box.vue')['default'];
+		FuParse: typeof import('./components/parse/src/parse.vue')['default'];
+		FuPicker: typeof import('./components/picker/src/picker.vue')['default'];
+		FuPopup: typeof import('./components/popup/src/popup.vue')['default'];
+		FuProgress: typeof import('./components/progress/src/progress.vue')['default'];
+		FuRate: typeof import('./components/rate/src/rate.vue')['default'];
+		FuReadMore: typeof import('./components/read-more/src/read-more.vue')['default'];
+		FuSafeBottom: typeof import('./components/safe-bottom/src/safe-bottom.vue')['default'];
+		FuScrollList: typeof import('./components/scroll-list/src/scroll-list.vue')['default'];
+		FuSearch: typeof import('./components/search/src/search.vue')['default'];
+		FuSection: typeof import('./components/section/src/section.vue')['default'];
+		FuSignBoard: typeof import('./components/sign-board/src/sign-board.vue')['default'];
+		FuSkeleton: typeof import('./components/skeleton/src/skeleton.vue')['default'];
+		FuStatusBar: typeof import('./components/status-bar/src/status-bar.vue')['default'];
+		FuSteps: typeof import('./components/steps/src/steps.vue')['default'];
+		FuStepsItem: typeof import('./components/steps-item/src/steps-item.vue')['default'];
+		FuSticky: typeof import('./components/sticky/src/sticky.vue')['default'];
+		FuSubsection: typeof import('./components/subsection/src/subsection.vue')['default'];
+		FuSwipeAction: typeof import('./components/swipe-action/src/swipe-action.vue')['default'];
+		FuSwipeActionItem: typeof import('./components/swipe-action-item/src/swipe-action-item.vue')['default'];
+		FuSwiper: typeof import('./components/swiper/src/swiper.vue')['default'];
+		FuSwitch: typeof import('./components/switch/src/switch.vue')['default'];
+		FuTabs: typeof import('./components/tabs/src/tabs.vue')['default'];
+		FuTag: typeof import('./components/tag/src/tag.vue')['default'];
+		FuText: typeof import('./components/text/src/text.vue')['default'];
+		FuTextarea: typeof import('./components/textarea/src/textarea.vue')['default'];
+		FuTimeaxis: typeof import('./components/timeaxis/src/timeaxis.vue')['default'];
+		FuTimeaxisItem: typeof import('./components/timeaxis-item/src/timeaxis-item.vue')['default'];
+		FuTransition: typeof import('./components/transition/src/transition.vue')['default'];
+		FuUpload: typeof import('./components/upload/src/upload.vue')['default'];
+		FuVtabs: typeof import('./components/vtabs/src/vtabs.vue')['default'];
+		FuVtabsItem: typeof import('./components/vtabs-item/src/vtabs-item.vue')['default'];
+		FuWaterfall: typeof import('./components/waterfall/src/waterfall.vue')['default'];
+	}
+}
+
+declare const fusionsui: {
+   install: (app: App) => void;
+};
+
+export default fusionsui;

package/hooks/index.ts

@@ -0,0 +1,25 @@
+import { getCurrentInstance } from 'vue';
+
+export const useCommon = () => {
+	const instance = getCurrentInstance();
+	
+	// 查询节点信息
+	// 目前此方法在支付宝小程序中无法获取组件跟接点的尺寸，为支付宝的bug(2020-07-21)
+	// 解决办法为在组件根部再套一个没有任何作用的view元素
+	const getRect = (selector: string, all?: boolean) => {
+		return new Promise((resolve) => {
+			uni.createSelectorQuery().in(instance?.proxy)[all? 'selectAll': 'select'](selector).boundingClientRect((res: any) => {
+				if (all && Array.isArray(res) && res.length) {
+					resolve(res)
+				}
+				if (!all && res) {
+					resolve(res)
+				}
+			}).exec()
+		})
+	};
+	
+	return {
+		getRect
+	}
+}

package/index.scss

@@ -1,14 +1,12 @@
 // 引入公共基础样式
-@import './libs/style/common.scss';
-@import './libs/style/color.scss';
-@import './libs/style/components.scss';
+@use './style/common.scss' as *;
 
 // 小程序特有样式
 /* #ifdef MP */
-@import './libs/style/style.mp.scss';
+@use './style/style.mp.scss' as *;
 /* #endif */
 
 // H5特有样式
 /* #ifdef H5 */
-@import 'libs/style/style.h5.scss';
+@use './style/style.h5.scss' as *;
 /* #endif */

package/index.ts

@@ -0,0 +1,56 @@
+import type { App } from 'vue';
+/**
+ * 示例：
+ * import FusionsUI from 'fusions-ui'
+ * Vue.use(FusionsUI)
+ */
+
+// 工具函数
+import * as common from './utils/common';
+// 配置信息
+import config from './config/config';
+// 规则校验
+import check from './utils/check';
+// 防抖方法 debounce   节流方法 throttle
+import { debounce, throttle } from './utils/applyEven'
+// 内置路由管理
+import minRouteConfig from './route/min.route.config'
+import routeConfig from './route/route.config'
+// 消息工具
+import toast from './utils/toast';
+// 选择文件
+import { chooseUploadFile, uploadCloudFiles } from './utils/chooseUploadFile';
+
+// 定义全局挂在对象
+export const $fu = {
+	config,
+	version: config.version,
+	debounce,
+	throttle,
+	chooseUploadFile, 
+	uploadCloudFiles,
+	...common,
+	...check,
+	...toast,
+};
+
+// 将$fu挂载到 uni 对象上
+uni.$fu = $fu;
+
+interface InstallOptions {
+	openRouter?: boolean;
+	[key: string]: any;
+}
+
+const install = (app: App, options: InstallOptions = {}): void => {
+	// 内置路由
+	if(options.openRouter) {
+		app.use(minRouteConfig, routeConfig)
+	}
+	
+	app.config.globalProperties.$fu = $fu;
+};
+
+export default {
+	install
+}

package/package.json

@@ -1,8 +1,9 @@
 {
 	"name": "fusions-ui",
-	"version": "1.2.7",
+	"version": "1.2.9",
 	"description": "FusionsUI Component library",
-	"main": "index.js",
+	"main": "index.ts",
+	"types": "global.d.ts",
 	"scripts": {
 		"test": "echo \"Error: no test specified\" && exit 1"
 	},
@@ -16,6 +17,12 @@
 		"fusions UI",
 		"fusionsUI"
 	],
-	"author": "fusionsui <fusionsui@163.com>",
-	"license": "ISC"
-}
+	"author": "fusions",
+	"license": "ISC",
+	"publishConfig": {
+		"access": "public"
+	},
+	"peerDependencies": {
+		"vue": "^3.0.0"
+	}
+}

package/{libs/route/min.route.config.js → route/min.route.config.ts}

@@ -1,9 +1,6 @@
 /**
  * min.router.config.js
  * 使用方法
- * Vue2
- * 示例：this.$openPage({name: 'my', query: {id: 123}, type: 'navigateTo'})		传参方式
- * 示例：this.$openPage('my')    不传参数可以简写
  * Vue3 setup语法糖
  * 示例：
  * import { getCurrentInstance } from 'vue';
@@ -15,31 +12,61 @@
  * @param name			字符串地址名
  * @param query			传递的参数
  * @param type			跳转的方式 ['navigateTo', 'switchTab', 'reLaunch', 'redirectTo']  不传默认navigateTo
- * this.$parseURL()		解析路由参数
- * 使用方法在接收参数页this.$parseURL(options)
+ * uni.$fu.$parseURL()		解析路由参数
+ * 使用方法在接收参数页uni.$fu.$parseURL(options)
  */
 const toString = Object.prototype.toString
 
-function isObject(value) {
+function isObject(value: unknown): value is Record<string, any> {
 	return toString.call(value) === '[object Object]'
 }
 
-function isString(value) {
+function isString(value: unknown): value is string {
 	return toString.call(value) === '[object String]'
 }
 
-function isDefault(value) {
+function isDefault(value: unknown): value is undefined {
 	return value === void 0
 }
 
-function openPage(args) {
-	let name, query = {}, queryStr = null, path, type, isName = false;
+// 定义导航类型
+type NavigateType = 'navigateTo' | 'switchTab' | 'reLaunch' | 'redirectTo';
+
+// 路由配置项接口
+interface RouteConfig {
+  name: string;
+  path: string;
+  type?: NavigateType;
+}
+
+// openPage函数参数对象接口
+interface OpenPageOptions {
+	name: string;
+	type?: NavigateType;
+	query?: Record<string, any>
+}
+
+// 定义合法的 API 映射
+const apiMap = {
+	navigateTo: uni.navigateTo,
+	redirectTo: uni.redirectTo,
+	reLaunch: uni.reLaunch,
+	switchTab: uni.switchTab
+};
+
+function openPage(args: string | OpenPageOptions) {
+	let name: string;
+	let query = {};
+	let queryStr: string | null = null; 
+	let path: string = '';
+	let type: NavigateType = 'navigateTo'; 
+	let isName = false;
 	switch (true) {
 		case isObject(args):
-			({ name, type, query = {} } = args)
+			({ name, type, query = {} } = args as OpenPageOptions)
 			break
 		case isString(args):
-			name = args;
+			name = args as string;
 			break
 		default:
 			throw new Error('参数必须是对象或者字符串')
@@ -49,7 +76,7 @@ function openPage(args) {
 	} else {
 		throw new Error('query数据必须是Object')
 	}
-	this.$routerConfig.forEach(item => {
+	(this.$routerConfig as RouteConfig[]).forEach(item => {
 		if (item.name === name) {
 			path = item.path;
 			type = type || (item.type || 'navigateTo');
@@ -62,9 +89,16 @@ function openPage(args) {
 	if (!['navigateTo', 'switchTab', 'reLaunch', 'redirectTo'].includes(type)) {
 		throw new Error(`name:${name}里面的type必须是以下的值['navigateTo', 'switchTab', 'reLaunch', 'redirectTo']`)
 	}
-
+	
+	const apiMap = {
+		navigateTo: uni.navigateTo,
+		switchTab: uni.switchTab,
+		reLaunch: uni.reLaunch,
+		redirectTo: uni.redirectTo
+	};
+	
 	return new Promise((resolve, reject) => {
-		uni[type]({
+		apiMap[type]({
 			url: `/${path}?query=${queryStr}`,
 			success: resolve,
 			fail: reject
@@ -72,16 +106,24 @@ function openPage(args) {
 	})
 }
 
-function parseURL(args) {
-	const query = args;
+function parseURL(query?: string): Record<string, any> {
 	if (query) {
-		return JSON.parse(decodeURIComponent(query))
+		try {
+		    return JSON.parse(decodeURIComponent(query));
+		} catch (error) {
+		    console.error('解析 URL 参数失败:', error);
+		    return {};
+		}
 	} else {
 		return {}
 	}
 }
 
-function install(Vue, routerConfig) {
+/**
+ * Vue 实例类型（兼容 Vue 2 和 Vue 3）
+ */
+
+function install(Vue: any, routerConfig: any): void {
 	if (!routerConfig || !Array.isArray(routerConfig.options.routes)) {
 	  throw new Error("routerConfig 必须是一个带有 routes 属性的对象");
 	}
@@ -122,14 +164,11 @@ function install(Vue, routerConfig) {
 		}
 	})
 	
-	if(!uni.$fu) {
-		uni.$fu = {};
-	}
 	uni.$fu.$openPage = openPage.bind(globalProperties);
 	uni.$fu.$parseURL = parseURL.bind(globalProperties)
 }
 
-function minRouteConfig(options) {
+function minRouteConfig(options: any) {
 	if (!(this instanceof minRouteConfig)) {
 		throw Error("minRouteConfig是一个构造函数，应该用`new`关键字调用")
 	}

package/route/route.config.ts

@@ -0,0 +1,93 @@
+/*
+ * 使用方法
+ * Vue3 示例：
+ * import { getCurrentInstance } from 'vue';
+ * const { $openPage } = getCurrentInstance().appContext.config.globalProperties;
+ * $openPage({name: 'my', query: {id: 123}, type: 'navigateTo'})		传参方式
+ * $openPage('my') 不传参数可以简写
+ * Vue2 和 Vue3
+ * 视图中可直接使用 $openPage('my')
+ * 配置参数项说明：
+ * name:可选配置 （路由名称）
+ * path:必填配置 （路由地址）
+ * type 跳转的方式 ['navigateTo', 'switchTab', 'reLaunch', 'redirectTo']  不传默认navigateTo
+ */
+import pagesJson from '@/pages.json';
+import minRouteConfig from './min.route.config.js';
+
+// 定义导航类型
+type NavigateType = 'navigateTo' | 'switchTab' | 'reLaunch' | 'redirectTo';
+
+// 处理 pages 数组
+interface PageConfig {
+  name?: string;
+  path: string;
+  type?: NavigateType;
+  [key: string]: any; // 允许其他属性
+}
+
+function processPages(pages: PageConfig[]) {
+	if (!Array.isArray(pages)) {
+	    console.warn('pages 必须是一个数组');
+	    return [];
+	}
+	  
+	return pages.map(page => {
+		const processedPage = {
+			name: page.name || page.path,
+			path: page.path,
+			type: page.type
+		}
+		
+		// 仅在 type 不存在时不添加默认值
+		if(page.type) {
+			processedPage.type = page.type;
+		}
+		
+		return processedPage
+	});
+}
+
+// 处理 subPackages 数组
+interface PagesJsonSubPackage {
+  root: string;
+  pages: PageConfig[];
+  name?: string;
+  [key: string]: any;
+}
+
+function processSubPackages(subPackages?: PagesJsonSubPackage[]): PageConfig[] {
+	// 如果 subPackages 不存在或不是数组，返回空数组
+	if (!subPackages || !Array.isArray(subPackages)) {
+	    return []
+	}
+
+	let routes: PageConfig[] = [];
+	subPackages.forEach(subPackage => {
+		routes = routes.concat(processPages(subPackage.pages).map(page => {
+			return {
+				...page,
+				name: page.name || subPackage.root + '/' + page.path,
+				path: subPackage.root + '/' + page.path
+			};
+		}));
+	});
+	return routes;
+}
+
+interface PagesJson {
+  pages: PageConfig[];
+  subPackages?: PagesJsonSubPackage[];
+}
+
+// 类型断言
+const pagesJsons = pagesJson as PagesJson;
+
+const route = new minRouteConfig({
+	routes: [
+		...processPages(pagesJsons.pages),
+		...processSubPackages(pagesJsons.subPackages || [])
+	]
+})
+
+export default route

package/style/color.scss

@@ -0,0 +1,26 @@
+$fu-color-main: #333333;
+
+$fu-color-primary: #2979ff;
+$fu-color-primary-dark: #1a5fd9;
+$fu-color-primary-disabled: #7ab1ff;
+$fu-color-primary-light: #d0e3ff;
+
+$fu-color-warning: #fcb03d;
+$fu-color-warning-dark: #e09a35;
+$fu-color-warning-disabled: #fdd58e;
+$fu-color-warning-light: #fef2e0;
+
+$fu-color-success: #5fd126;
+$fu-color-success-dark: #4fb020;
+$fu-color-success-disabled: #a8e88a;
+$fu-color-success-light: #e8f8e1;
+
+$fu-color-error: #f86d6d;
+$fu-color-error-dark: #e05c5c;
+$fu-color-error-disabled: #fcb3b3;
+$fu-color-error-light: #fee8e8;
+
+$fu-color-info: #9ca0a6;
+$fu-color-info-dark: #7e8288;
+$fu-color-info-disabled: #d0d2d5;
+$fu-color-info-light: #f2f3f4;

package/{libs/style → style}/common.scss

@@ -31,19 +31,6 @@ $gap: (5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55, 60, 65, 70, 75, 80, 85, 90, 95
 }
 /* #endif */
 
-/* 遮罩层 */
-.fu-mask-layer {
-	width: 100%;
-	height: 100%;
-	background: #000000;
-	opacity: 0.5;
-	position: fixed;
-	z-index: 98;
-	top: 0;
-	left: 0;
-	overflow: hidden;
-}
-
 /* flex 弹性布局 */
 .fu-flex {
 	/* #ifndef APP-NVUE */
@@ -441,7 +428,7 @@ $font-weight: (
 );
 
 @each $short, $long in $font-weight {
-	.fu-font-#{$short} {
+	.fu-font-w#{$short} {
 		font-weight: $long;
 	}
 }

package/{libs/function/applyEven.js → utils/applyEven.ts}

@@ -1,12 +1,12 @@
-let timeout = null;
+let timeout: NodeJS.Timeout | null = null;
 /**
- * 防抖原理：一定时间内，只有最后一次操作，再过wait毫秒后才执行函数
+ * @description 防抖原理：一定时间内，只有最后一次操作，再过wait毫秒后才执行函数
+ * 
  * @param {Function} func 要执行的回调函数
- * @param {Number} wait 延时的时间
- * @param {Boolean} immediate 是否立即执行
- * @return null
+ * @param {number} wait 延时的时间
+ * @param {boolean} immediate 是否立即执行
  */
-export function debounce(func, wait = 500, immediate = false) {
+export function debounce(func: () => void, wait: number = 500, immediate: boolean = false) {
 	// 清除定时器
 	if (timeout !== null) clearTimeout(timeout)
 	// 立即执行，此类情况一般用不到
@@ -24,16 +24,16 @@ export function debounce(func, wait = 500, immediate = false) {
 	}
 }
 
-let timer; let flag;
+let timer: NodeJS.Timeout | null = null; 
+let flag: boolean | undefined;
 /**
- * 节流原理：在一定时间内，只能触发一次
+ * @description 节流原理：在一定时间内，只能触发一次
  *
  * @param {Function} func 要执行的回调函数
- * @param {Number} wait 延时的时间
- * @param {Boolean} immediate 是否立即执行
- * @return null
+ * @param {number} wait 延时的时间
+ * @param {boolean} immediate 是否立即执行
  */
-export function throttle(func, wait = 500, immediate = true) {
+export function throttle(func: () => void, wait: number = 500, immediate: boolean = true) {
 	if (immediate) {
 	    if (!flag) {
 	        flag = true;
@@ -52,3 +52,12 @@ export function throttle(func, wait = 500, immediate = true) {
 	    }, wait)
 	}
 }
+
+/**
+ * 公共类型声明
+ */
+export type ApplyEven = {
+	[key: string]: any;
+	debounce: typeof debounce;
+	throttle: typeof throttle;
+}