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-alert/u-alert.vue | 243 ------------------------------------------------
1 files changed, 0 insertions(+), 243 deletions(-)
diff --git a/minipro_standard/uni_modules/uview-ui/components/u-alert/u-alert.vue b/minipro_standard/uni_modules/uview-ui/components/u-alert/u-alert.vue
index 81f7d43..e69de29 100644
--- a/minipro_standard/uni_modules/uview-ui/components/u-alert/u-alert.vue
+++ b/minipro_standard/uni_modules/uview-ui/components/u-alert/u-alert.vue
@@ -1,243 +0,0 @@
-<template>
- <u-transition
- mode="fade"
- :show="show"
- >
- <view
- class="u-alert"
- :class="[`u-alert--${type}--${effect}`]"
- @tap.stop="clickHandler"
- :style="[$u.addStyle(customStyle)]"
- >
- <view
- class="u-alert__icon"
- v-if="showIcon"
- >
- <u-icon
- :name="iconName"
- size="18"
- :color="iconColor"
- ></u-icon>
- </view>
- <view
- class="u-alert__content"
- :style="[{
- paddingRight: closable ? '20px' : 0
- }]"
- >
- <text
- class="u-alert__content__title"
- v-if="title"
- :style="[{
- fontSize: $u.addUnit(fontSize),
- textAlign: center ? 'center' : 'left'
- }]"
- :class="[effect === 'dark' ? 'u-alert__text--dark' : `u-alert__text--${type}--light`]"
- >{{ title }}</text>
- <text
- class="u-alert__content__desc"
- v-if="description"
- :style="[{
- fontSize: $u.addUnit(fontSize),
- textAlign: center ? 'center' : 'left'
- }]"
- :class="[effect === 'dark' ? 'u-alert__text--dark' : `u-alert__text--${type}--light`]"
- >{{ description }}</text>
- </view>
- <view
- class="u-alert__close"
- v-if="closable"
- @tap.stop="closeHandler"
- >
- <u-icon
- name="close"
- :color="iconColor"
- size="15"
- ></u-icon>
- </view>
- </view>
- </u-transition>
-</template>
-
-<script>
- import props from './props.js';
- /**
- * Alert 璀﹀憡鎻愮ず
- * @description 璀﹀憡鎻愮ず锛屽睍鐜伴渶瑕佸叧娉ㄧ殑淇℃伅銆�
- * @tutorial https://www.uviewui.com/components/alertTips.html
- *
- * @property {String} title 鏄剧ず鐨勬枃瀛�
- * @property {String} type 浣跨敤棰勮鐨勯鑹� 锛堥粯璁� 'warning' 锛�
- * @property {String} description 杈呭姪鎬ф枃瀛楋紝棰滆壊姣攖itle娴呬竴鐐癸紝瀛楀彿涔熷皬涓�鐐癸紝鍙��
- * @property {Boolean} closable 鍏抽棴鎸夐挳(榛樿涓哄弶鍙穒con鍥炬爣) 锛堥粯璁� false 锛�
- * @property {Boolean} showIcon 鏄惁鏄剧ず宸﹁竟鐨勮緟鍔╁浘鏍� 锛� 榛樿 false 锛�
- * @property {String} effect 澶氬浘鏃讹紝鍥剧墖缂╂斁瑁佸壀鐨勬ā寮� 锛堥粯璁� 'light' 锛�
- * @property {Boolean} center 鏂囧瓧鏄惁灞呬腑 锛堥粯璁� false 锛�
- * @property {String | Number} fontSize 瀛椾綋澶у皬 锛堥粯璁� 14 锛�
- * @property {Object} customStyle 瀹氫箟闇�瑕佺敤鍒扮殑澶栭儴鏍峰紡
- * @event {Function} click 鐐瑰嚮缁勪欢鏃惰Е鍙�
- * @example <u-alert :title="title" type = "warning" :closable="closable" :description = "description"></u-alert>
- */
- export default {
- name: 'u-alert',
- mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
- data() {
- return {
- show: true
- }
- },
- computed: {
- iconColor() {
- return this.effect === 'light' ? this.type : '#fff'
- },
- // 涓嶅悓涓婚瀵瑰簲涓嶅悓鐨勫浘鏍�
- iconName() {
- switch (this.type) {
- case 'success':
- return 'checkmark-circle-fill';
- break;
- case 'error':
- return 'close-circle-fill';
- break;
- case 'warning':
- return 'error-circle-fill';
- break;
- case 'info':
- return 'info-circle-fill';
- break;
- case 'primary':
- return 'more-circle-fill';
- break;
- default:
- return 'error-circle-fill';
- }
- }
- },
- methods: {
- // 鐐瑰嚮鍐呭
- clickHandler() {
- this.$emit('click')
- },
- // 鐐瑰嚮鍏抽棴鎸夐挳
- closeHandler() {
- this.show = false
- }
- }
- }
-</script>
-
-<style lang="scss" scoped>
- @import "../../libs/css/components.scss";
-
- .u-alert {
- position: relative;
- background-color: $u-primary;
- padding: 8px 10px;
- @include flex(row);
- align-items: center;
- border-top-left-radius: 4px;
- border-top-right-radius: 4px;
- border-bottom-left-radius: 4px;
- border-bottom-right-radius: 4px;
-
- &--primary--dark {
- background-color: $u-primary;
- }
-
- &--primary--light {
- background-color: #ecf5ff;
- }
-
- &--error--dark {
- background-color: $u-error;
- }
-
- &--error--light {
- background-color: #FEF0F0;
- }
-
- &--success--dark {
- background-color: $u-success;
- }
-
- &--success--light {
- background-color: #f5fff0;
- }
-
- &--warning--dark {
- background-color: $u-warning;
- }
-
- &--warning--light {
- background-color: #FDF6EC;
- }
-
- &--info--dark {
- background-color: $u-info;
- }
-
- &--info--light {
- background-color: #f4f4f5;
- }
-
- &__icon {
- margin-right: 5px;
- }
-
- &__content {
- @include flex(column);
- flex: 1;
-
- &__title {
- color: $u-main-color;
- font-size: 14px;
- font-weight: bold;
- color: #fff;
- margin-bottom: 2px;
- }
-
- &__desc {
- color: $u-main-color;
- font-size: 14px;
- flex-wrap: wrap;
- color: #fff;
- }
- }
-
- &__title--dark,
- &__desc--dark {
- color: #FFFFFF;
- }
-
- &__text--primary--light,
- &__text--primary--light {
- color: $u-primary;
- }
-
- &__text--success--light,
- &__text--success--light {
- color: $u-success;
- }
-
- &__text--warning--light,
- &__text--warning--light {
- color: $u-warning;
- }
-
- &__text--error--light,
- &__text--error--light {
- color: $u-error;
- }
-
- &__text--info--light,
- &__text--info--light {
- color: $u-info;
- }
-
- &__close {
- position: absolute;
- top: 11px;
- right: 10px;
- }
- }
-</style>
--
Gitblit v1.9.3