From d1448cb0ef10f358bb7bddb4e1ec268515e0b787 Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期二, 15 七月 2025 11:46:57 +0800 Subject: [PATCH] 项目初始化 --- uni_modules/uview-ui/components/u-text/u-text.vue | 223 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 223 insertions(+), 0 deletions(-) diff --git a/uni_modules/uview-ui/components/u-text/u-text.vue b/uni_modules/uview-ui/components/u-text/u-text.vue new file mode 100644 index 0000000..99d0809 --- /dev/null +++ b/uni_modules/uview-ui/components/u-text/u-text.vue @@ -0,0 +1,223 @@ +<template> + <view + class="u-text" + :class="[]" + v-if="show" + :style="{ + margin: margin, + justifyContent: align === 'left' ? 'flex-start' : align === 'center' ? 'center' : 'flex-end' + }" + @tap="clickHandler" + > + <text + :class="['u-text__price', type && `u-text__value--${type}`]" + v-if="mode === 'price'" + :style="[valueStyle]" + >锟�</text + > + <view class="u-text__prefix-icon" v-if="prefixIcon"> + <u-icon + :name="prefixIcon" + :customStyle="$u.addStyle(iconStyle)" + ></u-icon> + </view> + <u-link + v-if="mode === 'link'" + :text="value" + :href="href" + underLine + ></u-link> + <template v-else-if="openType && isMp"> + <button + class="u-reset-button u-text__value" + :style="[valueStyle]" + :data-index="index" + :openType="openType" + @getuserinfo="onGetUserInfo" + @contact="onContact" + @getphonenumber="onGetPhoneNumber" + @error="onError" + @launchapp="onLaunchApp" + @opensetting="onOpenSetting" + :lang="lang" + :session-from="sessionFrom" + :send-message-title="sendMessageTitle" + :send-message-path="sendMessagePath" + :send-message-img="sendMessageImg" + :show-message-card="showMessageCard" + :app-parameter="appParameter" + > + {{ value }} + </button> + </template> + <text + v-else + class="u-text__value" + :style="[valueStyle]" + :class="[ + type && `u-text__value--${type}`, + lines && `u-line-${lines}` + ]" + >{{ value }}</text + > + <view class="u-text__suffix-icon" v-if="suffixIcon"> + <u-icon + :name="suffixIcon" + :customStyle="$u.addStyle(iconStyle)" + ></u-icon> + </view> + </view> +</template> + +<script> +import value from './value.js' +import button from '../../libs/mixin/button.js' +import openType from '../../libs/mixin/openType.js' +import props from './props.js' +/** + * Text 鏂囨湰 + * @description 姝ょ粍浠堕泦鎴愪簡鏂囨湰绫诲湪椤圭洰涓殑甯哥敤鍔熻兘锛屽寘鎷姸鎬侊紝鎷ㄦ墦鐢佃瘽锛屾牸寮忓寲鏃ユ湡锛�*鏇挎崲锛岃秴閾炬帴...绛夊姛鑳姐�� 鎮ㄥぇ鍙笉蹇呭湪浣跨敤鐗规畩鏂囨湰鏃惰嚜宸卞畾涔夛紝text缁勪欢鍑犱箮娑电洊鎮ㄨ兘浣跨敤鐨勫ぇ閮ㄥ垎鍦烘櫙銆� + * @tutorial https://www.uviewui.com/components/loading.html + * @property {String} type 涓婚棰滆壊 + * @property {Boolean} show 鏄惁鏄剧ず锛堥粯璁� true 锛� + * @property {String | Number} text 鏄剧ず鐨勫�� + * @property {String} prefixIcon 鍓嶇疆鍥炬爣 + * @property {String} suffixIcon 鍚庣疆鍥炬爣 + * @property {String} mode 鏂囨湰澶勭悊鐨勫尮閰嶆ā寮� text-鏅�氭枃鏈紝price-浠锋牸锛宲hone-鎵嬫満鍙凤紝name-濮撳悕锛宒ate-鏃ユ湡锛宭ink-瓒呴摼鎺� + * @property {String} href mode=link涓嬶紝閰嶇疆鐨勯摼鎺� + * @property {String | Function} format 鏍煎紡鍖栬鍒� + * @property {Boolean} call mode=phone鏃讹紝鐐瑰嚮鏂囨湰鏄惁鎷ㄦ墦鐢佃瘽锛堥粯璁� false 锛� + * @property {String} openType 灏忕▼搴忕殑鎵撳紑鏂瑰紡 + * @property {Boolean} bold 鏄惁绮椾綋锛岄粯璁ormal锛堥粯璁� false 锛� + * @property {Boolean} block 鏄惁鍧楃姸锛堥粯璁� false 锛� + * @property {String | Number} lines 鏂囨湰鏄剧ず鐨勮鏁帮紝濡傛灉璁剧疆锛岃秴鍑烘琛屾暟锛屽皢浼氭樉绀虹渷鐣ュ彿 + * @property {String} color 鏂囨湰棰滆壊锛堥粯璁� '#303133' 锛� + * @property {String | Number} size 瀛椾綋澶у皬锛堥粯璁� 15 锛� + * @property {Object | String} iconStyle 鍥炬爣鐨勬牱寮� 锛堥粯璁� {fontSize: '15px'} 锛� + * @property {String} decoration 鏂囧瓧瑁呴グ锛屼笅鍒掔嚎锛屼腑鍒掔嚎绛夛紝鍙�夊�� none|underline|line-through锛堥粯璁� 'none' 锛� + * @property {Object | String | Number} margin 澶栬竟璺濓紝瀵硅薄銆佸瓧绗︿覆锛屾暟鍊煎舰寮忓潎鍙紙榛樿 0 锛� + * @property {String | Number} lineHeight 鏂囨湰琛岄珮 + * @property {String} align 鏂囨湰瀵归綈鏂瑰紡锛屽彲閫夊�糽eft|center|right锛堥粯璁� 'left' 锛� + * @property {String} wordWrap 鏂囧瓧鎹㈣锛屽彲閫夊�糱reak-word|normal|anywhere锛堥粯璁� 'normal' 锛� + * @event {Function} click 鐐瑰嚮瑙﹀彂浜嬩欢 + * @example <u--text text="鎴戠敤鍗佸勾闈掓槬,璧翠綘鏈�鍚庝箣绾�"></u--text> + */ +export default { + name: 'u--text', + // #ifdef MP + mixins: [uni.$u.mpMixin, uni.$u.mixin, value, button, openType, props], + // #endif + // #ifndef MP + mixins: [uni.$u.mpMixin, uni.$u.mixin, value, props], + // #endif + computed: { + valueStyle() { + const style = { + textDecoration: this.decoration, + fontWeight: this.bold ? 'bold' : 'normal', + wordWrap: this.wordWrap, + fontSize: uni.$u.addUnit(this.size) + } + !this.type && (style.color = this.color) + this.isNvue && this.lines && (style.lines = this.lines) + this.lineHeight && + (style.lineHeight = uni.$u.addUnit(this.lineHeight)) + !this.isNvue && this.block && (style.display = 'block') + return uni.$u.deepMerge(style, uni.$u.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 + } + }, + data() { + return {} + }, + methods: { + clickHandler() { + // 濡傛灉涓烘墜鏈哄彿妯″紡锛屾嫧鎵撶數璇� + if (this.call && this.mode === 'phone') { + uni.makePhoneCall({ + phoneNumber: this.text + }) + } + this.$emit('click') + } + } +} +</script> + +<style lang="scss" scoped> +@import '../../libs/css/components.scss'; + +.u-text { + @include flex(row); + align-items: center; + flex-wrap: nowrap; + flex: 1; + /* #ifndef APP-NVUE */ + width: 100%; + /* #endif */ + + &__price { + font-size: 14px; + color: $u-content-color; + } + + &__value { + font-size: 14px; + @include flex; + color: $u-content-color; + flex-wrap: wrap; + // flex: 1; + text-overflow: ellipsis; + align-items: center; + + &--primary { + color: $u-primary; + } + + &--warning { + color: $u-warning; + } + + &--success { + color: $u-success; + } + + &--info { + color: $u-info; + } + + &--error { + color: $u-error; + } + + &--main { + color: $u-main-color; + } + + &--content { + color: $u-content-color; + } + + &--tips { + color: $u-tips-color; + } + + &--light { + color: $u-light-color; + } + } +} +</style> -- Gitblit v1.9.3