uview-pro 0.0.1

package/index.scss

@@ -0,0 +1,23 @@
+// 引入公共基础类
+@import "./libs/css/common.scss";
+@import "./libs/css/color.scss";
+
+// 非nvue的样式
+/* #ifndef APP-NVUE */
+@import "./libs/css/style.vue.scss";
+/* #endif */
+
+// nvue的特有样式
+/* #ifdef APP-NVUE */
+@import "./libs/css/style.nvue.scss";
+/* #endif */
+
+// 小程序特有的样式
+/* #ifdef MP */
+@import "./libs/css/style.mp.scss";
+/* #endif */
+
+// H5特有的样式
+/* #ifdef H5 */
+@import "./libs/css/style.h5.scss";
+/* #endif */

package/index.ts

@@ -0,0 +1,166 @@
+// 全局挂载引入http相关请求拦截插件
+import http from './libs/request/index';
+// post类型对象参数转为get类型url参数
+import queryParams from './libs/function/queryParams';
+// 路由封装
+import route from './libs/function/route';
+// 时间格式化
+import timeFormat from './libs/function/timeFormat';
+// 时间戳格式化,返回多久之前
+import timeFrom from './libs/function/timeFrom';
+// 颜色渐变相关,colorGradient-颜色渐变,hexToRgb-十六进制颜色转rgb颜色,rgbToHex-rgb转十六进制
+import colorGradient from './libs/function/colorGradient';
+// 生成全局唯一guid字符串
+import guid from './libs/function/guid';
+// 主题相关颜色,info|success|warning|primary|default|error,此颜色已在uview.scss中定义,但是为js中也能使用,故也定义一份
+import color from './libs/function/color';
+// 根据type获取图标名称
+import type2icon from './libs/function/type2icon';
+// 打乱数组的顺序
+import randomArray from './libs/function/randomArray';
+// 对象和数组的深度克隆
+import deepClone from './libs/function/deepClone';
+// 对象深度拷贝
+import deepMerge from './libs/function/deepMerge';
+// 添加单位
+import addUnit from './libs/function/addUnit';
+// 规则检验
+import test from './libs/function/test';
+// 随机数
+import random from './libs/function/random';
+// 去除空格
+import trim from './libs/function/trim';
+// toast提示，对uni.showToast的封装
+import toast from './libs/function/toast';
+// 获取父组件参数
+import getParent from './libs/function/getParent';
+// 获取整个父组件
+import $parent from './libs/function/$parent';
+// 获取sys()和os()工具方法
+// 获取设备信息，挂载到$u的sys()(system的缩写)属性中，
+// 同时把安卓和ios平台的名称"ios"和"android"挂到$u.os()中，方便取用
+import { sys, os } from './libs/function/sys';
+// 防抖方法
+import debounce from './libs/function/debounce';
+// 节流方法
+import throttle from './libs/function/throttle';
+// 获取元素的位置信息
+import getRect from './libs/function/getRect';
+// 获取父组件
+import { parentData, parent } from './libs/function/parent';
+
+// 配置信息
+import config from './libs/config/config';
+// 各个需要fixed的地方的z-index配置文件
+import zIndex from './libs/config/zIndex';
+import { dispatch, broadcast } from './libs/util/emitter';
+import { mitt } from './libs/util/mitt';
+import { type RequestOptions } from './libs/request/index';
+
+declare const uni: {
+    [key: string]: any;
+    $u?: typeof $u;
+    createSelectorQuery: () => any;
+    hideLoading: () => void;
+    showLoading: (options: any) => void;
+    request: (options: RequestOptions) => any;
+};
+
+/**
+ * $u 工具库类型声明
+ */
+export interface UViewUtils {
+    queryParams: typeof queryParams;
+    route: typeof route;
+    timeFormat: typeof timeFormat;
+    date: typeof timeFormat;
+    timeFrom: typeof timeFrom;
+    colorGradient: typeof colorGradient.colorGradient;
+    colorToRgba: typeof colorGradient.colorToRgba;
+    guid: typeof guid;
+    color: typeof color;
+    sys: typeof sys;
+    os: typeof os;
+    type2icon: typeof type2icon;
+    randomArray: typeof randomArray;
+    dispatch: typeof dispatch;
+    broadcast: typeof broadcast;
+    get: typeof http.get;
+    post: typeof http.post;
+    put: typeof http.put;
+    delete: typeof http.delete;
+    hexToRgb: typeof colorGradient.hexToRgb;
+    rgbToHex: typeof colorGradient.rgbToHex;
+    test: typeof test;
+    random: typeof random;
+    deepClone: typeof deepClone;
+    deepMerge: typeof deepMerge;
+    getParent: typeof getParent;
+    $parent: typeof $parent;
+    parent: typeof parent;
+    parentData: typeof parentData;
+    addUnit: typeof addUnit;
+    trim: typeof trim;
+    type: string[];
+    http: typeof http;
+    toast: typeof toast;
+    config: typeof config;
+    zIndex: typeof zIndex;
+    debounce: typeof debounce;
+    throttle: typeof throttle;
+    mitt: ReturnType<typeof mitt>;
+    getRect: typeof getRect;
+}
+
+export const $u: UViewUtils = {
+    queryParams: queryParams,
+    route: route,
+    timeFormat: timeFormat,
+    date: timeFormat, // 另名date
+    timeFrom,
+    colorGradient: colorGradient.colorGradient,
+    colorToRgba: colorGradient.colorToRgba,
+    guid,
+    color,
+    sys,
+    os,
+    type2icon,
+    randomArray,
+    dispatch,
+    broadcast,
+    get: http.get,
+    post: http.post,
+    put: http.put,
+    delete: http.delete,
+    hexToRgb: colorGradient.hexToRgb,
+    rgbToHex: colorGradient.rgbToHex,
+    test,
+    random,
+    deepClone,
+    deepMerge,
+    getParent,
+    $parent,
+    parent,
+    parentData,
+    addUnit,
+    trim,
+    type: ['primary', 'success', 'error', 'warning', 'info'],
+    http,
+    toast,
+    config, // uView配置信息相关，比如版本号
+    zIndex,
+    debounce,
+    throttle,
+    mitt: mitt(),
+    getRect
+};
+
+// $u挂载到uni对象上
+
+const install = (): void => {
+    uni.$u = $u;
+};
+
+export default {
+    install
+};

package/libs/config/config.ts

@@ -0,0 +1,26 @@
+// 此版本发布于2023-03-27
+/**
+ * 组件库配置项类型定义
+ */
+
+import { version } from '../../package.json';
+
+export interface AppConfig {
+    /** 版本号 */
+    v: string;
+    /** 版本号（冗余字段） */
+    version: string;
+    /** 主题名称列表 */
+    type: string[];
+}
+
+// const version: string = '1.8.8';
+
+const config: AppConfig = {
+    v: version,
+    version: version,
+    // 主题名称
+    type: ['primary', 'success', 'info', 'error', 'warning']
+};
+
+export default config;

package/libs/config/zIndex.ts

@@ -0,0 +1,37 @@
+// uniapp在H5中各API的z-index值如下：
+/**
+ * actionsheet: 999
+ * modal: 999
+ * navigate: 998
+ * tabbar: 998
+ * toast: 999
+ */
+
+/**
+ * 组件库 z-index 配置项类型定义
+ */
+export interface ZIndexConfig {
+    toast: number;
+    noNetwork: number;
+    /** popup包含popup，actionsheet，keyboard，picker的值 */
+    popup: number;
+    mask: number;
+    navbar: number;
+    topTips: number;
+    sticky: number;
+    indexListSticky: number;
+}
+
+const zIndex: ZIndexConfig = {
+    toast: 10090,
+    noNetwork: 10080,
+    // popup包含popup，actionsheet，keyboard，picker的值
+    popup: 10075,
+    mask: 10070,
+    navbar: 980,
+    topTips: 975,
+    sticky: 970,
+    indexListSticky: 965
+};
+
+export default zIndex;

package/libs/css/color.scss

@@ -0,0 +1,155 @@
+.u-type-primary-light {
+	color: $u-type-primary-light;
+}
+
+.u-type-warning-light {
+	color: $u-type-warning-light;
+}
+
+.u-type-success-light {
+	color: $u-type-success-light;
+}
+
+.u-type-error-light {
+	color: $u-type-error-light;
+}
+
+.u-type-info-light {
+	color: $u-type-info-light;
+}
+
+.u-type-primary-light-bg {
+	background-color: $u-type-primary-light;
+}
+
+.u-type-warning-light-bg {
+	background-color: $u-type-warning-light;
+}
+
+.u-type-success-light-bg {
+	background-color: $u-type-success-light;
+}
+
+.u-type-error-light-bg {
+	background-color: $u-type-error-light;
+}
+
+.u-type-info-light-bg {
+	background-color: $u-type-info-light;
+}
+
+.u-type-primary-dark {
+	color: $u-type-primary-dark;
+}
+
+.u-type-warning-dark {
+	color: $u-type-warning-dark;
+}
+
+.u-type-success-dark {
+	color: $u-type-success-dark;
+}
+
+.u-type-error-dark {
+	color: $u-type-error-dark;
+}
+
+.u-type-info-dark {
+	color: $u-type-info-dark;
+}
+
+.u-type-primary-dark-bg {
+	background-color: $u-type-primary-dark;
+}
+
+.u-type-warning-dark-bg {
+	background-color: $u-type-warning-dark;
+}
+
+.u-type-success-dark-bg {
+	background-color: $u-type-success-dark;
+}
+
+.u-type-error-dark-bg {
+	background-color: $u-type-error-dark;
+}
+
+.u-type-info-dark-bg {
+	background-color: $u-type-info-dark;
+}
+
+.u-type-primary-disabled {
+	color: $u-type-primary-disabled;
+}
+
+.u-type-warning-disabled {
+	color: $u-type-warning-disabled;
+}
+
+.u-type-success-disabled {
+	color: $u-type-success-disabled;
+}
+
+.u-type-error-disabled {
+	color: $u-type-error-disabled;
+}
+
+.u-type-info-disabled {
+	color: $u-type-info-disabled;
+}
+
+.u-type-primary {
+	color: $u-type-primary;
+}
+
+.u-type-warning {
+	color: $u-type-warning;
+}
+
+.u-type-success {
+	color: $u-type-success;
+}
+
+.u-type-error {
+	color: $u-type-error;
+}
+
+.u-type-info {
+	color: $u-type-info;
+}
+
+.u-type-primary-bg {
+	background-color: $u-type-primary;
+}
+
+.u-type-warning-bg {
+	background-color: $u-type-warning;
+}
+
+.u-type-success-bg {
+	background-color: $u-type-success;
+}
+
+.u-type-error-bg {
+	background-color: $u-type-error;
+}
+
+.u-type-info-bg {
+	background-color: $u-type-info;
+}
+
+.u-main-color {
+	color: $u-main-color;
+}
+
+.u-content-color {
+	color: $u-content-color;
+}
+
+.u-tips-color {
+	color: $u-tips-color;
+}
+
+.u-light-color {
+	color: $u-light-color;
+}

package/libs/css/common.scss

@@ -0,0 +1,176 @@
+.u-relative,
+.u-rela {
+	position: relative;
+}
+
+.u-absolute,
+.u-abso {
+	position: absolute;
+}
+
+// nvue不能用标签命名样式，不能放在微信组件中，否则微信开发工具会报警告，无法使用标签名当做选择器
+/* #ifndef APP-NVUE */
+image {
+	display: inline-block;
+}
+
+// 在weex，也即nvue中，所有元素默认为border-box
+view,
+text {
+	box-sizing: border-box;
+}
+/* #endif */
+
+.u-font-xs {
+	font-size: 22rpx;
+}
+
+.u-font-sm {
+	font-size: 26rpx;
+}
+
+.u-font-md {
+	font-size: 28rpx;
+}
+
+.u-font-lg {
+	font-size: 30rpx;
+}
+
+.u-font-xl {
+	font-size: 34rpx;
+}
+
+.u-flex {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: row;
+	align-items: center;
+}
+
+.u-flex-wrap {
+	flex-wrap: wrap;
+}
+
+.u-flex-nowrap {
+	flex-wrap: nowrap;
+}
+
+.u-col-center {
+	align-items: center;
+}
+
+.u-col-top {
+	align-items: flex-start;
+}
+
+.u-col-bottom {
+	align-items: flex-end;
+}
+
+.u-row-center {
+	justify-content: center;
+}
+
+.u-row-left {
+	justify-content: flex-start;
+}
+
+.u-row-right {
+	justify-content: flex-end;
+}
+
+.u-row-between {
+	justify-content: space-between;
+}
+
+.u-row-around {
+	justify-content: space-around;
+}
+
+.u-text-left {
+	text-align: left;
+}
+
+.u-text-center {
+	text-align: center;
+}
+
+.u-text-right {
+	text-align: right;
+}
+
+.u-flex-col {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex-direction: column;
+}
+
+// 定义flex等分
+@for $i from 0 through 12 {
+	.u-flex-#{$i} {
+		flex: $i;
+	}
+}
+
+// 定义字体(px)单位，小于20都为px单位字体
+@for $i from 9 to 20 {
+	.u-font-#{$i} {
+		font-size: $i + px;
+	}
+}
+
+// 定义字体(rpx)单位，大于或等于20的都为rpx单位字体
+@for $i from 20 through 40 {
+	.u-font-#{$i} {
+		font-size: $i + rpx;
+	}
+}
+
+// 定义内外边距，历遍1-80
+@for $i from 0 through 80 {
+	// 只要双数和能被5除尽的数
+	@if $i % 2 == 0 or $i % 5 == 0 {
+		// 得出：u-margin-30或者u-m-30
+		.u-margin-#{$i}, .u-m-#{$i} {
+			margin: $i + rpx!important;
+		}
+		
+		// 得出：u-padding-30或者u-p-30
+		.u-padding-#{$i}, .u-p-#{$i} {
+			padding: $i + rpx!important;
+		}
+		
+		@each $short, $long in l left, t top, r right, b bottom {
+			// 缩写版，结果如： u-m-l-30
+			// 定义外边距
+			.u-m-#{$short}-#{$i} {
+				margin-#{$long}: $i + rpx!important;
+			}
+			
+			// 定义内边距
+			.u-p-#{$short}-#{$i} {
+				padding-#{$long}: $i + rpx!important;
+			}
+			
+			// 完整版，结果如：u-margin-left-30
+			// 定义外边距
+			.u-margin-#{$long}-#{$i} {
+				margin-#{$long}: $i + rpx!important;
+			}
+			
+			// 定义内边距
+			.u-padding-#{$long}-#{$i} {
+				padding-#{$long}: $i + rpx!important;
+			}
+		}
+	}
+}
+
+// 重置nvue的默认关于flex的样式
+.u-reset-nvue {
+	flex-direction: row;
+	align-items: center;
+}

package/libs/css/style.components.scss

@@ -0,0 +1,7 @@
+// 定义混入指令，用于在非nvue环境下的flex定义，因为nvue没有display属性，会报错
+@mixin vue-flex($direction: row) {
+	/* #ifndef APP-NVUE */
+	display: flex;
+	flex-direction: $direction;
+	/* #endif */
+}

package/libs/css/style.h5.scss

@@ -0,0 +1,8 @@
+/* H5的时候，隐藏滚动条 */
+::-webkit-scrollbar {
+	display: none;  
+	width: 0 !important;  
+	height: 0 !important;  
+	-webkit-appearance: none;  
+	background: transparent;  
+}

package/libs/css/style.mp.scss

@@ -0,0 +1,72 @@
+/* start--微信小程序编译后页面有组件名的元素，特别处理--start */
+/* #ifdef MP-WEIXIN || MP-QQ */
+u-td, u-th {
+	flex: 1;
+	align-self: stretch;
+}
+
+.u-td {
+	height: 100%;
+}
+
+u-icon {
+	display: inline-flex;
+	align-items: center;
+}
+
+// 各家小程序宫格组件外层设置为100%，避免受到父元素display: flex;的影响
+u-grid {
+	width: 100%;
+	flex: 0 0 100%;
+}
+
+// 避免小程序线条组件因为父组件display: flex;而失效
+u-line {
+	flex: 1;
+}
+
+u-switch {
+	display: inline-flex;
+	align-items: center;
+}
+
+u-dropdown {
+	flex: 1;
+}
+/* #endif */
+/* end-微信小程序编译后页面有组件名的元素，特别处理--end */
+
+
+/* #ifdef MP-QQ || MP-TOUTIAO */
+// 需要做这一切额外的兼容，都是因为TX的无能
+u-icon {
+	line-height: 0;
+}
+/* #endif */
+
+/* start--头条小程序编译后页面有组件名的元素，特别处理--start */
+// 由于头条小程序不支持直接组件名形式写样式，目前只能在写组件的时候给组件加上对应的类名
+/* #ifdef MP-TOUTIAO */
+.u-td, .u-th, .u-tr {
+	flex: 1;
+	align-self: stretch;
+}
+
+.u-row, .u-col {
+	flex: 1;
+	align-self: stretch;
+}
+
+// 避免小程序线条组件因为父组件display: flex;而失效
+.u-line {
+	flex: 1;
+}
+
+.u-dropdown {
+	flex: 1;
+}
+/* #endif */
+/* end-头条小程序编译后页面有组件名的元素，特别处理--end */
+
+
+

package/libs/css/style.nvue.scss

@@ -0,0 +1,3 @@
+.nvue {
+	font-size: 24rpx;
+}