fusions-ui 1.2.7 → 1.2.8

package/components/fu-text/fu-text.vue

@@ -1,254 +0,0 @@
-<template>
-	<view 
-		class="fu-text" 
-		:class="[customClass]"
-		:style="{margin: margin, justifyContent: align === 'left' ? 'flex-start' : align === 'center' ? 'center' : 'flex-end'}" 
-		@tap="handleClick" 
-		v-if="show">
-		<text :class="['fu-text__price', type && `fu-text__value--${type}`]" :style="[valueStyle]" v-if="mode === 'price'">￥</text>
-		<view class="fu-text__prefix-icon" v-if="prefixIcon">
-			<fu-icon :name="prefixIcon" :color="iconColor" :size="iconSize"></fu-icon>
-		</view>
-		<fu-link :href="href" underLine v-if="mode === 'link'">
-			<slot>{{ value }}</slot>
-		</fu-link>
-		<template v-else-if="openType && isMp">
-			<button 
-				class="fu-reset-button fu-text__value" 
-				:class="[type && `fu-text__value--${type}`, lines && `fu-line-${lines}`]" 
-				:style="[valueStyle]" 
-				:openType="openType" 
-				:lang="lang"
-				:session-from="sessionFrom" 
-				:send-message-title="sendMessageTitle" 
-				:send-message-path="sendMessagePath"
-				:send-message-img="sendMessageImg" 
-				:show-message-card="showMessageCard" 
-				:app-parameter="appParameter"
-				@getuserinfo="onGetUserInfo" 
-				@contact="onContact" 
-				@getphonenumber="onGetPhoneNumber" 
-				@error="onError"
-				@launchapp="onLaunchApp" 
-				@opensetting="onOpenSetting">
-				<slot>{{ value }}</slot>
-			</button>
-		</template>
-		<text 
-			class="fu-text__value" 
-			:style="[valueStyle]" 
-			:class="[type && `fu-text__value--${type}`, lines && `fu-line-${lines}`]" 
-			v-else>
-			<slot>{{ value }}</slot>
-		</text>
-		<view class="fu-text__suffix-icon" v-if="suffixIcon">
-			<fu-icon :name="suffixIcon" :color="iconColor" :size="iconSize"></fu-icon>
-		</view>
-	</view>
-</template>
-
-<script>
-	import mpMixin from '../../libs/mixin/mpMixin.js'
-	import mixin from '../../libs/mixin/mixin.js'
-	import value from './value.js'
-	import button from './button.js'
-	import openType from './openType.js'
-	import props from './props.js'
-	/**
-	 * Text 文本
-	 * @description 此组件集成了文本类在项目中的常用功能，包括状态，拨打电话，格式化日期，*替换，超链接...等功能。 您大可不必在使用特殊文本时自己定义，text组件几乎涵盖您能使用的大部分场景。
-	 * @property {String} type = [primary|error|success|warning|info] 主题颜色
-	 * 	@value primary 主色
-	 * 	@value error 错误
-	 * 	@value success 成功
-	 * 	@value warning 警告
-	 * 	@value info 信息
-	 * @property {Boolean} show = [true|false] 是否显示（默认 true）
-	 * @property {String,Number} text 显示的值
-	 * @property {String} prefixIcon 前置图标
-	 * @property {String} suffixIcon 后置图标
-	 * @property {String} iconColor 图标颜色
-	 * @property {String,Number} iconSize 图标大小（默认 15）
-	 * @property {String} mode = [text|price|phone|name|date|link] 文本处理的匹配模式 
-	 * 	@value text 普通文本
-	 * 	@value price 价格
-	 * 	@value phone 手机号
-	 * 	@value name 姓名
-	 * 	@value date 日期
-	 * 	@value link 超链接
-	 * @property {String} href 配置的链接（仅mode=link时生效）
-	 * @property {String,Function} format 格式化规则
-	 * @property {Boolean} call 点击文本是否拨打电话（仅mode=phone时生效）（默认 false）
-	 * @property {String} openType 小程序的打开方式
-	 * @property {String,Number} weight 控制文本粗细（默认 'normal'）
-	 * @property {Boolean} block 是否块状（默认 false）
-	 * @property {String,Number} lines 文本显示的行数，如果设置，超出此行数，将会显示省略号
-	 * @property {String} color 文本颜色
-	 * @property {String,Number} size 字体大小（默认 15）
-	 * @property {String} decoration = [none|underline|line-through] 文字装饰（默认 'none' ）
-	 * 	@value none 无装饰
-	 * 	@value underline 下划线
-	 * 	@value line-through 中划线
-	 * @property {String,Number} margin 外边距，对象、字符串，数值形式均可（默认 0）
-	 * @property {String,Number} lineHeight 文本行高
-	 * @property {String} align = [left|center|right] 文本对齐方式（默认 'left'）
-	 * 	@value left 左对齐
-	 * 	@value center 居中
-	 * 	@value right 右对齐
-	 * @property {String} wordWrap = [break-word|normal|anywhere] 文字换行（默认 'normal' ）
-	 * 	@value break-word 在长单词或URL地址内部进行换行
-	 * 	@value normal 只在允许的断字点换行（浏览器保持默认处理）
-	 * 	@value anywhere 为防止溢出，如果行中没有其他可接受的断点，则不可断的字符串（如长词或 URL）可能会在任何时候换行。
-	 * @property {String} customClass 定义需要用到的外部类
-	 * @property {Object,String} customStyle 定义需要用到的外部样式
-	 * 
-	 * @event {Function} click 点击触发事件
-	 * @example <fu-text text="愿重逢折扇青衣, 愿再见杨柳依依"></fu-text>
-	 */
-	export default {
-		name: "FuText",
-		emits: ['click'],
-		// #ifdef MP
-		mixins: [mpMixin, mixin, value, button, openType, props],
-		// #endif
-		// #ifndef MP
-		mixins: [mpMixin, mixin, value, props],
-		// #endif
-		data() {
-			return {};
-		},
-		computed: {
-			valueStyle() {
-				const style = {
-					textDecoration: this.decoration,
-					fontWeight: this.weight || 'normal',
-					wordWrap: this.wordWrap,
-					fontSize: this.$fu.addUnit(this.size)
-				};
-				
-				if(!this.type) {
-					style.color = this.color
-				}
-				
-				if(this.lineHeight) {
-					style.lineHeight = this.$fu.addUnit(this.lineHeight)
-				}
-				
-				if(this.isNvue) {
-					if(this.lines) {
-						style.lines = this.lines
-					}
-					
-					if(this.mode != 'price' && !this.prefixIcon && !this.suffixIcon) {
-						style.flex = 1;
-						style.textAlign = this.align === 'left' ? 'flex-start' : this.align === 'center' ? 'center' : 'right';
-					}
-				} else {
-					if(this.block) {
-						style.display = 'block'
-					}
-				}	
-				
-				return this.$fu.deepMerge(style, this.$fu.addStyle(this.customStyle));
-			},
-			isNvue() {
-				let nvue = false;
-				// #ifdef APP-NVUE
-				nvue = true;
-				// #endif
-				return nvue
-			},
-			isMp() {
-				let mp = false;
-				// #ifdef MP
-				mp = true;
-				// #endif
-				return mp
-			}
-		},
-		methods: {
-			handleClick() {
-				// 如果为手机号模式，拨打电话
-				if (this.call && this.mode === 'phone') {
-					uni.makePhoneCall({
-						phoneNumber: this.text
-					})
-				}
-				this.$emit('click')
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	@import '../../libs/style/components.scss';
-	@import '../../libs/style/color.scss';
-	$fu-main-color: #333333;
-	$fu-content-color: #666666;
-	$fu-tips-color: #909193;
-	$fu-light-color: #c0c4cc;
-
-	.fu-text {
-		@include flex;
-		align-items: center;
-		flex-wrap: nowrap;
-		flex: 1;
-		/* #ifndef APP-NVUE */
-		width: 100%;
-		/* #endif */
-
-		&__price {
-			font-size: 14px;
-			color: $fu-content-color;
-		}
-
-		&__value {
-			font-size: 14px;
-			@include flex;
-			flex-wrap: wrap;
-			text-overflow: ellipsis;
-			align-items: center;
-			// 兼容支付宝小程序去除默认样式
-			/* #ifdef MP-ALIPAY */
-			height: auto;
-			border: none;
-			/* #endif */
-
-			&--primary {
-				color: $fu-primary;
-			}
-
-			&--warning {
-				color: $fu-warning;
-			}
-
-			&--success {
-				color: $fu-success;
-			}
-
-			&--info {
-				color: $fu-info;
-			}
-
-			&--error {
-				color: $fu-error;
-			}
-
-			&--main {
-				color: $fu-main-color;
-			}
-
-			&--content {
-				color: $fu-content-color;
-			}
-
-			&--tips {
-				color: $fu-tips-color;
-			}
-
-			&--light {
-				color: $fu-light-color;
-			}
-		}
-	}
-</style>

package/components/fu-text/openType.js

@@ -1,47 +0,0 @@
-export default {
-    props: {
-        openType: String
-    },
-	emits: ['getphonenumber','getuserinfo','error','opensetting','launchapp','contact','chooseavatar','addgroupapp','chooseaddress','subscribe','login','im'],
-    methods: {
-        onGetPhoneNumber(event) {
-            this.$emit('getphonenumber', event.detail)
-        },
-        onGetUserInfo(event) {
-            this.$emit('getuserinfo', event.detail)
-        },
-        onError(event) {
-            this.$emit('error', event.detail)
-        },
-        onOpenSetting(event) {
-            this.$emit('opensetting', event.detail)
-        },
-        onLaunchApp(event) {
-            this.$emit('launchapp', event.detail)
-        },
-        onContact(event) {
-            this.$emit('contact', event.detail)
-        },
-        onChooseavatar(event) {
-            this.$emit('chooseavatar', event.detail)
-        },
-        onAgreeprivacyauthorization(event) {
-            this.$emit('agreeprivacyauthorization', event.detail)
-        },
-        onAddgroupapp(event) {
-            this.$emit('addgroupapp', event.detail)
-        },
-        onChooseaddress(event) {
-            this.$emit('chooseaddress', event.detail)
-        },
-        onSubscribe(event) {
-            this.$emit('subscribe', event.detail)
-        },
-        onLogin(event) {
-            this.$emit('login', event.detail)
-        },
-        onIm(event) {
-            this.$emit('im', event.detail)
-        }
-    }
-}

package/components/fu-text/props.js

@@ -1,173 +0,0 @@
-export default {
-	props: {
-		/**
-		 * @description 主题颜色
-		 * @values 'primary' - 主色， 'error' - 错误, 'success' - 成功, 'warning' - 警告, 'info' - 信息
-		 */
-		type: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 是否显示
-		 * @default true
-		 */
-		show: {
-			type: Boolean,
-			default: true
-		},
-		/**
-		 * @description 显示的值
-		 */
-		text: {
-			type: [String,Number],
-			default: ''
-		},
-		/**
-		 * @description 前置图标
-		 */
-		prefixIcon: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 后置图标
-		 */
-		suffixIcon: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 图标颜色
-		 */
-		iconColor: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 图标大小
-		 * @default 15
-		 */
-		iconSize: {
-			type: [String,Number],
-			default: 15
-		},
-		/**
-		 * @description 文本处理的匹配模式
-		 * @values 'text' - 普通文本, 'price' - 价格, 'phone' - 手机号码, 'name' - 姓名, 'date' - 日期, 'link' - 超链接
-		 * @default 'text'
-		 */
-		mode: {
-			type: String,
-			default: 'text'
-		},
-		/**
-		 * @description 配置的链接（仅mode=link时生效）
-		 */
-		href: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * 格式化规则
-		 */
-		format: {
-			type: [String,Function],
-			default: ''
-		},
-		/**
-		 * @description 点击文本是否拨打电话（仅mode=phone时生效）
-		 * @default false
-		 */
-		call: {
-			type: Boolean,
-			default: false
-		},
-		/**
-		 * @description 小程序的打开方式
-		 */
-		openType: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 是否粗体
-		 * @default 'normal'
-		 */
-		weight: {
-			type: [String,Number],
-			default: 'normal'
-		},
-		/**
-		 * @description 是否块状
-		 * @default true
-		 */
-		block: {
-			type: Boolean,
-			default: false
-		},
-		/**
-		 * @description 文本显示的行数，如果设置，超出此行数，将会显示省略号
-		 */
-		lines: {
-			type: [String,Number],
-			default: ''
-		},
-		/**
-		 * @description 文本颜色
-		 */
-		color: {
-			type: String,
-			default: ''
-		},
-		/**
-		 * @description 字体大小
-		 * @default 15
-		 */
-		size: {
-			type: [String,Number],
-			default: 15
-		},
-		/**
-		 * @description 文字装饰
-		 * @values 'none' - 无装饰, 'underline' - 下划线, 'line-through' - 中划线
-		 * @default 'none'
-		 */
-		decoration: {
-			type: String,
-			default: 'none'
-		},
-		/**
-		 * @description 外边距，对象、字符串，数值形式均可
-		 */
-		margin: {
-			type: [Object,String,Number],
-			default: 0
-		},
-		/**
-		 * @description 文本行高
-		 */
-		lineHeight: {
-			type: [String,Number],
-			default: ''
-		},
-		/**
-		 * @description 文本对齐方式
-		 * @values 'left' - 左对齐, 'center' - 居中, 'right' - 右对齐
-		 * @default 'left'
-		 */
-		align: {
-			type: String,
-			default: 'left'
-		},
-		/**
-		 * @description 文字换行
-		 * @values 'break-word' - 在长单词或URL地址内部进行换行, 'normal' - 只在允许的断字点换行（浏览器保持默认处理）, 'anywhere' - 为防止溢出，如果行中没有其他可接受的断点，则不可断的字符串（如长词或 URL）可能会在任何时候换行。
-		 * @default 'normal'
-		 */
-		wordWrap: {
-			type: String,
-			default: 'normal'
-		}
-	}
-}

package/components/fu-text/value.js

@@ -1,88 +0,0 @@
-export default {
-    computed: {
-		// 经处理后需要显示的值
-		value() {
-			const { text, mode, format, href } = this;
-			// 价格类型
-			switch(mode) {
-				case 'price':
-					// 如果text不为金额进行提示
-					if (!/^\d+(\.\d+)?$/.test(text)) {
-						this.$fu.error('金额模式下，text参数需要为金额格式');
-					}
-					// 进行格式化，判断用户传入的format参数为正则，或者函数，如果没有传入format，则使用默认的金额格式化处理
-					if (this.$fu.isFunc(format)) {
-						// 如果用户传入的是函数，使用函数格式化
-						return format(text)
-					}
-					// 如果format非正则，非函数，则使用默认的金额格式化方法进行操作
-					return this.$fu.priceFormat(text, 2)
-					break
-				case 'date':
-					// 判断是否合法的日期或者时间戳
-					!this.$fu.checkDate(text) && this.$fu.error('日期模式下，text参数需要为日期或时间戳格式')
-					// 进行格式化，判断用户传入的format参数为正则，或者函数，如果没有传入format，则使用默认的格式化处理
-					if (this.$fu.isFunc(format)) {
-						// 如果用户传入的是函数，使用函数格式化
-						return format(text)
-					} if (format) {
-						// 如果format非正则，非函数，则使用默认的时间格式化方法进行操作
-						return this.$fu.formatTime(text, format)
-					}
-					// 如果没有设置format，则设置为默认的时间格式化形式
-					return this.$fu.formatTime(text, 'Y-M-D')
-					break
-				case 'phone':
-					// 判断是否合法的手机号
-					// !mobile(text) && error('手机号模式下，text参数需要为手机号码格式')
-					if (this.$fu.isFunc(format)) {
-						// 如果用户传入的是函数，使用函数格式化
-						return format(text)
-					} if (format === 'encrypt') {
-						// 如果format为encrypt，则将手机号进行星号加密处理
-						return `${text.substr(0, 3)}****${text.substr(7)}`
-					}
-					return text
-					break
-				case 'name':
-					// 判断是否合法的字符粗
-					!(typeof (text) === 'string') && this.$fu.error('姓名模式下，text参数需要为字符串格式')
-					if (this.$fu.isFunc(format)) {
-						// 如果用户传入的是函数，使用函数格式化
-						return format(text)
-					} if (format === 'encrypt') {
-						// 如果format为encrypt，则将姓名进行星号加密处理
-						return this.formatName(text)
-					}
-					return text
-					break
-				case 'link':
-					// 判断是否合法的字符粗
-					!this.$fu.isUrl(href) && this.$fu.error('超链接模式下，href参数需要为URL格式')
-					return text
-					break
-				default:
-					return text
-					break
-			}
-		}
-    },
-    methods: {
-        // 默认的姓名脱敏规则
-        formatName(name) {
-            let value = '';
-            if (name.length === 2) {
-                value = name.substr(0, 1) + '*';
-            } else if (name.length > 2) {
-                let char = '';
-                for (let i = 0, len = name.length - 2; i < len; i++) {
-                    char += '*';
-                }
-                value = name.substr(0, 1) + char + name.substr(-1, 1);
-            } else {
-                value = name;
-            }
-            return value
-        }
-    }
-}