From 9ab4955166b7b1370fc2a49b152353241ca9e64a Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期一, 16 十月 2023 09:22:23 +0800
Subject: [PATCH] 小程序
---
minipro_standard/uni_modules/uview-ui/components/u-notify/u-notify.vue | 211 ----------------------------------------------------
1 files changed, 0 insertions(+), 211 deletions(-)
diff --git a/minipro_standard/uni_modules/uview-ui/components/u-notify/u-notify.vue b/minipro_standard/uni_modules/uview-ui/components/u-notify/u-notify.vue
index 30adb72..e69de29 100644
--- a/minipro_standard/uni_modules/uview-ui/components/u-notify/u-notify.vue
+++ b/minipro_standard/uni_modules/uview-ui/components/u-notify/u-notify.vue
@@ -1,211 +0,0 @@
-<template>
- <u-transition
- mode="slide-down"
- :customStyle="containerStyle"
- :show="open"
- >
- <view
- class="u-notify"
- :class="[`u-notify--${tmpConfig.type}`]"
- :style="[backgroundColor, $u.addStyle(customStyle)]"
- >
- <u-status-bar v-if="tmpConfig.safeAreaInsetTop"></u-status-bar>
- <view class="u-notify__warpper">
- <slot name="icon">
- <u-icon
- v-if="['success', 'warning', 'error'].includes(tmpConfig.type)"
- :name="tmpConfig.icon"
- :color="tmpConfig.color"
- :size="1.3 * tmpConfig.fontSize"
- :customStyle="{marginRight: '4px'}"
- ></u-icon>
- </slot>
- <text
- class="u-notify__warpper__text"
- :style="{
- fontSize: $u.addUnit(tmpConfig.fontSize),
- color: tmpConfig.color
- }"
- >{{ tmpConfig.message }}</text>
- </view>
- </view>
- </u-transition>
-</template>
-
-<script>
- import props from './props.js';
- /**
- * notify 椤堕儴鎻愮ず
- * @description 璇ョ粍浠朵竴鑸敤浜庨〉闈㈤《閮ㄥ悜涓嬫粦鍑轰竴涓彁绀猴紝灏斿悗鑷姩鏀惰捣鐨勫満鏅�
- * @tutorial
- * @property {String | Number} top 鍒伴《閮ㄧ殑璺濈 ( 榛樿 0 )
- * @property {String} type 涓婚锛宲rimary锛宻uccess锛寃arning锛宔rror ( 榛樿 'primary' )
- * @property {String} color 瀛椾綋棰滆壊 ( 榛樿 '#ffffff' )
- * @property {String} bgColor 鑳屾櫙棰滆壊
- * @property {String} message 灞曠ず鐨勬枃瀛楀唴瀹�
- * @property {String | Number} duration 灞曠ず鏃堕暱锛屼负0鏃朵笉娑堝け锛屽崟浣峬s ( 榛樿 3000 )
- * @property {String | Number} fontSize 瀛椾綋澶у皬 ( 榛樿 15 )
- * @property {Boolean} safeAreaInsetTop 鏄惁鐣欏嚭椤堕儴瀹夊叏璺濈锛堢姸鎬佹爮楂樺害锛� ( 榛樿 false )
- * @property {Object} customStyle 缁勪欢鐨勬牱寮忥紝瀵硅薄褰㈠紡
- * @event {Function} open 寮�鍚粍浠舵椂璋冪敤鐨勫嚱鏁�
- * @event {Function} close 鍏抽棴缁勪欢寮忚皟鐢ㄧ殑鍑芥暟
- * @example <u-notify message="Hi uView"></u-notify>
- */
- export default {
- name: 'u-notify',
- mixins: [uni.$u.mpMixin, uni.$u.mixin,props],
- data() {
- return {
- // 鏄惁灞曠ず缁勪欢
- open: false,
- timer: null,
- config: {
- // 鍒伴《閮ㄧ殑璺濈
- top: uni.$u.props.notify.top,
- // type涓婚锛宲rimary锛宻uccess锛寃arning锛宔rror
- type: uni.$u.props.notify.type,
- // 瀛椾綋棰滆壊
- color: uni.$u.props.notify.color,
- // 鑳屾櫙棰滆壊
- bgColor: uni.$u.props.notify.bgColor,
- // 灞曠ず鐨勬枃瀛楀唴瀹�
- message: uni.$u.props.notify.message,
- // 灞曠ず鏃堕暱锛屼负0鏃朵笉娑堝け锛屽崟浣峬s
- duration: uni.$u.props.notify.duration,
- // 瀛椾綋澶у皬
- fontSize: uni.$u.props.notify.fontSize,
- // 鏄惁鐣欏嚭椤堕儴瀹夊叏璺濈锛堢姸鎬佹爮楂樺害锛�
- safeAreaInsetTop: uni.$u.props.notify.safeAreaInsetTop
- },
- // 鍚堝苟鍚庣殑閰嶇疆锛岄伩鍏嶅娆¤皟鐢ㄧ粍浠跺悗锛屽彲鑳戒細澶嶇敤涔嬪墠浣跨敤鐨勯厤缃弬鏁�
- tmpConfig: {}
- }
- },
- computed: {
- containerStyle() {
- let top = 0
- if (this.tmpConfig.top === 0) {
- // #ifdef H5
- // H5绔紝瀵艰埅鏍忎负鏅�氬厓绱狅紝闇�瑕佸皢缁勪欢绉诲姩鍒板鑸爮鐨勪笅杈规部
- // H5鐨勫鑸爮楂樺害涓�44px
- top = 44
- // #endif
- }
- const style = {
- top: uni.$u.addUnit(this.tmpConfig.top === 0 ? top : this.tmpConfig.top),
- // 鍥犱负缁勪欢搴曞眰涓簎-transition缁勪欢锛屽繀椤诲皢鍏惰缃负fixed瀹氫綅
- // 璁╁叾鍑虹幇鍦ㄥ鑸爮搴曢儴
- position: 'fixed',
- left: 0,
- right: 0,
- zIndex: 10076
- }
- return style
- },
- // 缁勪欢鑳屾櫙棰滆壊
- backgroundColor() {
- const style = {}
- if (this.tmpConfig.bgColor) {
- style.backgroundColor = this.tmpConfig.bgColor
- }
- return style
- },
- // 榛樿涓婚涓嬬殑鍥炬爣
- icon() {
- let icon
- if (this.tmpConfig.type === 'success') {
- icon = 'checkmark-circle'
- } else if (this.tmpConfig.type === 'error') {
- icon = 'close-circle'
- } else if (this.tmpConfig.type === 'warning') {
- icon = 'error-circle'
- }
- return icon
- }
- },
- created() {
- // 閫氳繃涓婚鐨勫舰寮忚皟鐢╰oast锛屾壒閲忕敓鎴愭柟娉曞嚱鏁�
- ['primary', 'success', 'error', 'warning'].map(item => {
- this[item] = message => this.show({
- type: item,
- message
- })
- })
- },
- methods: {
- show(options) {
- // 涓嶅皢缁撴灉鍚堝苟鍒皌his.config鍙橀噺锛岄伩鍏嶅娆¤皟鐢╱-toast锛屽墠鍚庣殑閰嶇疆閫犳垚娣蜂贡
- this.tmpConfig = uni.$u.deepMerge(this.config, options)
- // 浠讳綍瀹氭椂鍣ㄥ垵濮嬪寲涔嬪墠锛岄兘瑕佹墽琛屾竻闄ゆ搷浣滐紝鍚﹀垯鍙兘浼氶�犳垚娣蜂贡
- this.clearTimer()
- this.open = true
- if (this.tmpConfig.duration > 0) {
- this.timer = setTimeout(() => {
- this.open = false
- // 鍊掕鏃剁粨鏉燂紝娓呴櫎瀹氭椂鍣紝闅愯棌toast缁勪欢
- this.clearTimer()
- // 鍒ゆ柇鏄惁瀛樺湪callback鏂规硶锛屽鏋滃瓨鍦ㄥ氨鎵ц
- typeof(this.tmpConfig.complete) === 'function' && this.tmpConfig.complete()
- }, this.tmpConfig.duration)
- }
- },
- // 鍏抽棴notify
- close() {
- this.clearTimer()
- },
- clearTimer() {
- this.open = false
- // 娓呴櫎瀹氭椂鍣�
- clearTimeout(this.timer)
- this.timer = null
- }
- },
- beforeDestroy() {
- this.clearTimer()
- }
- }
-</script>
-
-<style lang="scss" scoped>
- @import "../../libs/css/components.scss";
-
- $u-notify-padding: 8px 10px !default;
- $u-notify-text-font-size: 15px !default;
- $u-notify-primary-bgColor: $u-primary !default;
- $u-notify-success-bgColor: $u-success !default;
- $u-notify-error-bgColor: $u-error !default;
- $u-notify-warning-bgColor: $u-warning !default;
-
-
- .u-notify {
- padding: $u-notify-padding;
-
- &__warpper {
- @include flex;
- align-items: center;
- text-align: center;
- justify-content: center;
-
- &__text {
- font-size: $u-notify-text-font-size;
- text-align: center;
- }
- }
-
- &--primary {
- background-color: $u-notify-primary-bgColor;
- }
-
- &--success {
- background-color: $u-notify-success-bgColor;
- }
-
- &--error {
- background-color: $u-notify-error-bgColor;
- }
-
- &--warning {
- background-color: $u-notify-warning-bgColor;
- }
- }
-</style>
--
Gitblit v1.9.3