@ecolovo/uniapp-components 1.0.6 → 1.0.9

package/components/page/page-header.vue

@@ -57,9 +57,10 @@
 import componentName from '../../mixins/componentName';
 import windowInfoMixin from '../../mixins/windowInfo';
 import IconCpn from '../icon/icon.vue';
+import { homePath } from '../../configs';
 
 export default {
-	name: 'AppPageHeader',
+	name: 'PageHeader',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',
@@ -84,27 +85,42 @@ export default {
 		},
 		/** 导航按钮类型: 0 = 不显示，1 = 返回，2 = 首页，3 = 返回|首页 */
 		navType: {
-			type: Number,
-			default: 1,
+			type: [Number, null],
+			default: null,
 		},
 	},
 	computed: {
 		/** 首页路径 */
 		homePageUrl() {
-			// TODO HOME_PATH
-			return process.env.VUE_APP_HOME_PATH;
+			return homePath;
 		},
 		/** 是否显示返回按钮 */
 		hasBack() {
-			return this.navType & 1;
+			// 如果指定了导航按钮类型，则根据类型判断
+			if (this.navType !== null) return !!(this.navType & 1);
+			const pages = getCurrentPages();
+			// 在首页不显示返回按钮
+			if (this.homePageUrl === '/' + pages[0].route) return false;
+			// 页面栈只有一个时不显示返回按钮
+			if (pages.length === 1) return false;
+			// 其他情况均显示返回按钮
+			return true;
 		},
 		/** 是否显示首页按钮 */
 		hasHome() {
-			return this.navType & 2;
+			// 如果指定了导航按钮类型，则根据类型判断
+			if (this.navType !== null) return !!(this.navType & 2);
+			const pages = getCurrentPages();
+			// 在首页不显示返回首页按钮
+			if (this.homePageUrl === '/' + pages[0].route) return false;
+			// 页面栈只有一个时显示返回按钮
+			if (pages.length === 1) return true;
+			// 其他情况均不显示返回按钮
+			return false;
 		},
 		/** 导航按钮个数 */
 		iconCount() {
-			return Math.ceil(this.navType / 2);
+			return (this.hasBack ? 1 : 0) + (this.hasHome ? 1 : 0);
 		},
 		styleStr() {
 			return [

package/components/page/page.vue

@@ -11,7 +11,7 @@
 			:has-custom-nav="custom"
 			:has-footer="hasFooter && $slots.footer"
 			:use-scroll="useScroll"
-			:is-tab-page="isTabPage"
+			:is-tab-page="tabbar"
 			:enable-refresh="enableRefresh"
 			:refreshing="refreshing"
 			@scroll="$emit('scroll', $event)"
@@ -21,7 +21,7 @@
 			<slot></slot>
 		</page-body-cpn>
 
-		<page-footer-cpn v-if="hasFooter && $slots.footer" :is-tab-page="isTabPage">
+		<page-footer-cpn v-if="hasFooter && $slots.footer" :is-tab-page="tabbar">
 			<slot name="footer"></slot>
 		</page-footer-cpn>
 
@@ -37,7 +37,7 @@ import PageFooterCpn from './page-footer.vue';
 import PageHeaderCpn from './page-header.vue';
 
 export default {
-	name: 'AppPage',
+	name: 'Page',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',
@@ -95,10 +95,10 @@ export default {
 			type: String,
 			default: 'light',
 		},
-	},
-	computed: {
-		isTabPage() {
-			return false;
+		/** 是否是 tabbar 页面，且 tabbar 未隐藏 */
+		tabbar: {
+			type: Boolean,
+			default: false,
 		},
 	},
 };

package/components/picker/picker-popup.vue

@@ -74,7 +74,7 @@ import PopupContentCpn from '../popup/popup-content.vue';
 import SearchCpn from '../search/search.vue';
 
 export default {
-	name: 'AppPickerPopup',
+	name: 'PickerPopup',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/picker/picker.vue

@@ -32,7 +32,7 @@ import SelectorCpn from '../selector/selector.vue';
 import PickerPopupCpn from './picker-popup.vue';
 
 export default {
-	name: 'AppPicker',
+	name: 'Picker',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/popover/popover-content.vue

@@ -41,7 +41,7 @@ import windowInfoMixin from '../../mixins/windowInfo';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppPopoverContent',
+	name: 'PopoverContent',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/popover/popover-mask.vue

@@ -20,7 +20,7 @@
 import componentName from '../../mixins/componentName';
 
 export default {
-	name: 'AppPopoverMask',
+	name: 'PopoverMask',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/popover/popover.vue

@@ -36,7 +36,7 @@ import popoverContentCpn from './popover-content.vue';
 import popoverMaskCpn from './popover-mask.vue';
 
 export default {
-	name: 'AppPopover',
+	name: 'Popover',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/popup/popup-content.vue

@@ -51,7 +51,7 @@ import IconCpn from '../icon/icon.vue';
 import PopoverContentCpn from '../popover/popover-content.vue';
 
 export default {
-	name: 'AppPopupContent',
+	name: 'PopupContent',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/popup/popup.vue

@@ -33,7 +33,7 @@ import PopoverMaskCpn from '../popover/popover-mask.vue';
 import PopupContentCpn from './popup-content.vue';
 
 export default {
-	name: 'AppPopup',
+	name: 'Popup',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/price/price.vue

@@ -25,7 +25,7 @@ import componentName from '../../mixins/componentName';
 import { formatPrice } from '../../utils/price';
 
 export default {
-	name: 'AppPrice',
+	name: 'Price',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/search/search.vue

@@ -49,7 +49,7 @@ import ButtonCpn from '../button/button.vue';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppSearch',
+	name: 'Search',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/searching/searching.vue

@@ -15,7 +15,7 @@ import componentName from '../../mixins/componentName';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppSearching',
+	name: 'Searching',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/selector/selector.vue

@@ -19,7 +19,7 @@ import { isFormReadonly } from '../form/mixin';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppSelector',
+	name: 'Selector',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/switch/switch.vue

@@ -21,7 +21,7 @@ import { isFormReadonly } from '../form/mixin';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppSwitch',
+	name: 'Switch',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/tab/tab.vue

@@ -24,7 +24,7 @@
 import componentName from '../../mixins/componentName';
 
 export default {
-	name: 'AppTab',
+	name: 'Tab',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/table/table.vue

@@ -27,7 +27,7 @@ import componentName from '../../mixins/componentName';
 import { floor2 } from '../../utils/floor';
 
 export default {
-	name: 'AppTable',
+	name: 'Table',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/textarea/textarea.vue

@@ -40,7 +40,7 @@ import { isFormReadonly } from '../form/mixin';
 import IconCpn from '../icon/icon.vue';
 
 export default {
-	name: 'AppTextarea',
+	name: 'Textarea',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/time-picker/time-picker-view.vue

@@ -27,7 +27,7 @@ import { formatDate } from '../../utils/date';
 const hourOptions = range(0, 24).map((item) => ('' + item).padStart(2, '0'));
 
 export default {
-	name: 'AppTimePickerView',
+	name: 'TimePickerView',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/time-picker/time-picker.vue

@@ -37,7 +37,7 @@ import SelectorCpn from '../selector/selector.vue';
 import TimePickerViewCpn from './time-picker-view.vue';
 
 export default {
-	name: 'AppTimePicker',
+	name: 'TimePicker',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/uploader/file-uploader.vue

@@ -17,7 +17,7 @@ import ButtonCpn from '../button/button.vue';
 import UploadMixin from './mixin';
 
 export default {
-	name: 'AppUploader',
+	name: 'Uploader',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/uploader/media-uploader.vue

@@ -66,7 +66,7 @@ import LoadingCpn from '../loading/animations/loading-animation4.vue';
 import UploadMixin from './mixin';
 
 export default {
-	name: 'AppUploader',
+	name: 'Uploader',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/uploader/upload-button.vue

@@ -9,7 +9,7 @@ import componentName from '../../mixins/componentName';
 import ButtonCpn from '../button/button.vue';
 
 export default {
-	name: 'AppUploadButton',
+	name: 'UploadButton',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/components/uploader/uploader.vue

@@ -40,7 +40,7 @@ import ButtonCpn from '../button/button.vue';
 import ImageCpn from '../image/image.vue';
 
 export default {
-	name: 'AppUploader',
+	name: 'Uploader',
 	options: {
 		virtualHost: true,
 		styleIsolation: 'shared',

package/configs/index.d.ts

@@ -0,0 +1,22 @@
+/** 组件前缀 */
+declare let componentPrefix: string;
+/** 首页路径 */
+declare let homePath: string;
+/** 设置组件前缀 */
+declare const setComponentPrefix: (prefix: string) => void;
+/** 设置首页路径 */
+declare const setHomePath: (path: string) => void;
+/** iconfont 图标 map */
+declare let iconMap: Map<string, { fontFamily: string; prefix: string; name: string }>;
+interface IconFontJson {
+	font_family: string;
+	css_prefix_text: string;
+	glyphs: { font_class: string }[];
+}
+/**
+ * 添加一组图标，传入 iconfont.json 文件内容
+ * @param iconJson iconfont.json 文件内容
+ */
+declare const addIcons: (iconJson: IconFontJson) => void;
+
+export { componentPrefix, homePath, IconFontJson, setComponentPrefix, setHomePath, iconMap, addIcons };

package/configs/index.js

@@ -1,17 +1,36 @@
 /** 组件前缀 */
 let componentPrefix = 'app';
+/** 首页路径 */
+let homePath = '/pages/index/index';
 
-/** 设置组件前缀 */
+/**
+ * 设置组件前缀
+ * @param {string} prefix 组件前缀
+ */
 function setComponentPrefix(prefix) {
 	componentPrefix = prefix;
 }
 
+/**
+ * 设置首页路径
+ * @param {string} path 首页路径
+ */
+function setHomePath(path) {
+	homePath = path;
+}
+
 /** iconfont 图标 map */
 const iconMap = new Map();
 
-/** 添加单个图标 */
+/**
+ * 添加单个图标
+ * @param {string} fontFamily 字体文件名
+ * @param {string} prefix 图标前缀
+ * @param {string} name 图标名称
+ */
 function addIconToMap(fontFamily, prefix, name) {
 	if (iconMap.has(name)) {
+		// eslint-disable-next-line no-console
 		console.error(
 			`图标库 "${fontFamily}" 中的图标 "${name}" 在图标库 "${
 				iconMap.get(name).fontFamily
@@ -26,7 +45,14 @@ function addIconToMap(fontFamily, prefix, name) {
 	});
 }
 
-/** 添加一组图标，传入 iconfont.json 文件内容 */
+/**
+ * 添加一组图标，传入 iconfont.json 文件内容
+ * @param {object} iconJson iconfont.json 文件内容
+ * @param {string} iconJson.font_family
+ * @param {string} iconJson.css_prefix_text
+ * @param {object[]} iconJson.glyphs
+ * @param {string} iconJson.glyphs.font_class
+ */
 function addIcons(iconJson) {
 	const fontFamily = iconJson.font_family;
 	const prefix = iconJson.css_prefix_text;
@@ -36,6 +62,7 @@ function addIcons(iconJson) {
 	});
 }
 
+// 添加内部图标库
 addIcons(require('../resources/iconfont/uniapp_ui_icon/iconfont.json'));
 
-export { componentPrefix, setComponentPrefix, iconMap, addIcons };
+export { componentPrefix, homePath, setComponentPrefix, setHomePath, iconMap, addIcons };

package/init.d.ts

@@ -0,0 +1,19 @@
+import { IconFontJson } from './configs';
+
+/** 组件库初始化配置 */
+interface InitOptions {
+	/** 组件前缀 */
+	componentPrefix?: string;
+	/** 首页路径 */
+	homePath?: string;
+	/** iconfont 图标 json 文件 */
+	iconfont?: IconFontJson | IconFontJson[];
+}
+
+/**
+ * 初始化组件库
+ * @param {InitOptions} options 组件库初始化配置
+ */
+declare const init: (options: InitOptions) => void;
+
+export default init;

package/init.js

@@ -1,10 +1,13 @@
-const { setComponentPrefix, addIcons } = require('./configs');
+const { setComponentPrefix, setHomePath, addIcons } = require('./configs');
 
 /** 组件库初始化方法，在 main.js 中调用 */
 function init(options = {}) {
 	if (options.componentPrefix) {
 		setComponentPrefix(options.componentPrefix);
 	}
+	if (options.homePath) {
+		setHomePath(options.homePath);
+	}
 	if (options.iconfont) {
 		if (Array.isArray(options.iconfont)) {
 			options.iconfont.forEach(addIcons);

package/mixins/componentName.js

@@ -17,7 +17,7 @@ export default {
 		},
 		/** 添加前缀后的组件名-大驼峰模式 */
 		componentClass() {
-			return this.componentPrefix + this.$options.name.replace(/^App/, '');
+			return this.componentPrefix + this.$options.name;
 		},
 		/** 添加前缀后的组件名-短横线模式 */
 		componentKebabClass() {
@@ -25,7 +25,7 @@ export default {
 		},
 		/** 合并后的组件类名 */
 		componentClassNames() {
-			const baseClass = this.$style?.[this.$options.name.replace(/^App/, '')];
+			const baseClass = this.$style?.[this.$options.name];
 			return [...(baseClass ? [baseClass] : []), this.componentClass, this.componentKebabClass];
 		},
 	},

package/package.json

@@ -1,7 +1,10 @@
 {
 	"name": "@ecolovo/uniapp-components",
-	"version": "1.0.6",
+	"version": "1.0.9",
 	"description": "Ecolovo UniApp 组件库",
+	"scripts": {
+		"lint": "eslint . --fix"
+	},
 	"keywords": [
 		"uniapp",
 		"components"
@@ -11,5 +14,16 @@
 	"dependencies": {
 		"case-anything": "3.1.2",
 		"lodash-es": "4.17.21"
+	},
+	"devDependencies": {
+		"@dcloudio/types": "^3.4.30",
+		"@eslint/js": "^10.0.1",
+		"eslint": "^10.0.3",
+		"eslint-config-prettier": "^10.1.8",
+		"eslint-plugin-prettier": "^5.5.5",
+		"eslint-plugin-vue": "^10.8.0",
+		"globals": "^17.4.0",
+		"prettier": "^2.8.8",
+		"vue-eslint-parser": "^10.4.0"
 	}
 }

package/styles/global.scss

@@ -3,7 +3,7 @@
 @use './utils' as *;
 
 page {
-	@each $name, $value in $component-themes {
+	@each $name, $value in $themes {
 		@for $i from 9 through 1 {
 			#{DO_NOT_USE__global-var-name(theme, $name + '-dark' + $i)}: #{color.scale($value, $blackness: $i * 10%)};
 		}
@@ -12,13 +12,13 @@ page {
 			#{DO_NOT_USE__global-var-name(theme, $name + '-light' + $i)}: #{color.scale($value, $whiteness: $i * 10%)};
 		}
 	}
-	@each $name, $value in $component-colors {
+	@each $name, $value in $colors {
 		#{DO_NOT_USE__global-var-name(color, $name)}: #{$value};
 	}
-	@each $name, $value in $component-font-sizes {
+	@each $name, $value in $font-sizes {
 		#{DO_NOT_USE__global-var-name(font-size, $name)}: #{$value};
 	}
-	@each $name, $value in $component-vars {
+	@each $name, $value in $others {
 		#{DO_NOT_USE__global-var-name(other, $name)}: #{$value};
 	}
 }

package/styles/utils/css-var.scss

@@ -12,8 +12,13 @@ $component-vars: null !default;
 	@return string.unquote('--#{$component-prefix}-#{$component}--#{$name}');
 }
 
-// 设置组件外部变量值
-@mixin UTILS__SET_VAR($component, $values) {
+// 设置组件单个外部变量值
+@mixin UTILS__SET_VAR($component, $name, $value) {
+	#{UTILS__VAR_NAME($name, $component)}: $value;
+}
+
+// 设置组件一组外部变量值
+@mixin UTILS__SET_VAR_LIST($component, $values) {
 	@each $name, $value in $values {
 		#{UTILS__VAR_NAME($name, $component)}: $value;
 	}

package/styles/utils/z-index.scss

@@ -6,5 +6,5 @@
 @use './css-var' as *;
 
 @function UTILS__z-index($key: $component-name) {
-	@return map.get($component-z-index-maps, $key);
+	@return map.get($z-index-maps, $key);
 }

package/styles/var/component.scss

@@ -39,8 +39,11 @@ $page-body: () !default;
 $page-body-default: (
 	// 可视区域背景
 	background: transparent,
-	padding-x: 20rpx,
-	padding-y: 20rpx
+	padding: 20rpx,
+	padding-top: null,
+	padding-right: null,
+	padding-bottom: null,
+	padding-left: null
 );
 $page-body: map.merge($page-body-default, $page-body);
 

package/styles/var/theme.scss

@@ -2,39 +2,49 @@
 
 $component-prefix: 'app' !default;
 
-$component-z-index-maps: (
+$z-index-maps: () !default;
+$z-index-maps-default: (
 	loading: 9999,
 	dialog: 4000,
 	dropdown: 3000,
 	popover: 3000,
 	page-header: 2000,
 	page-footer: 2000,
-) !default;
+);
+$z-index-maps: map.merge($z-index-maps-default, $z-index-maps);
 
-$component-themes: (
+$themes: () !default;
+$themes-default: (
 	primary: #f26f24,
 	secondary: #1e87e9,
 	success: #6fe633,
 	warning: #f3bb2d,
 	danger: #ff0000,
 	info: #9a9a99,
-) !default;
+);
+$themes: map.merge($themes-default, $themes);
 
-$component-colors: (
+$colors: () !default;
+$colors-default: (
 	foreground: #333,
 	background: #f4f5f6,
 	placeholder: #9a9a99,
 	disabled: c3c4c5,
-) !default;
+);
+$colors: map.merge($colors-default, $colors);
 
-$component-font-sizes: (
+$font-sizes: () !default;
+$font-sizes-default: (
 	small: 24rpx,
 	normal: 28rpx,
 	large: 32rpx,
-) !default;
+);
+$font-sizes: map.merge($font-sizes-default, $font-sizes);
 
-$component-vars: (
+$others: () !default;
+$others-default: (
 	font-size-small: 24rpx,
 	font-size-normal: 28rpx,
 	font-size-large: 32rpx,
-) !default;
+);
+$others: map.merge($others-default, $others);

package/utils/windowInfo.js

@@ -62,10 +62,6 @@ const windowInfoMixin = {
 	},
 };
 
-/**
- * @typedef {ComponentDefinition<{}, {}, ComputedDefinition<typeof windowInfoMixin['computed']>>['$vm']} WindowInfoMixin
- */
-
 export {
 	menuButton,
 	windowInfo,