vdesign-ui 0.2.9 → 0.2.11

package/dist/components/list/style.less

@@ -4,7 +4,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    background-color: var(--bg-color-1);
+    // background-color: var(--bg-color-1);
 
     &--right {
         display: flex;

package/dist/components/tabs/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="vd-tabs" :class="stickyClasses">
     <div class="vd-tabs__wrap" :class="menuClasses" ref="wrap">
-      <div class="vd-tabs__nav" :class="[barType, scrollspy]" ref="nav">
+      <div class="vd-tabs__nav" :class="[barType, scrollspyClasses]" ref="nav">
         <div
           v-for="(tab, index) in tabs"
           :key="tab.name !== undefined ? tab.name : index"
@@ -39,9 +39,12 @@
 
 <script>
 import VdIcon from "../icon";
+import languageMixin from '../mixins/languageMixin.js';
+
 const prefixCls = "vd-tabs";
 export default {
   name: "vd-tabs",
+  mixins: [languageMixin],
   components: {
     VdIcon,
   },
@@ -65,6 +68,7 @@ export default {
     sticky: Boolean,
     lazyRender: Boolean,
     animated: Boolean,
+    scrollspy:Boolean
   },
   data() {
     return {
@@ -89,7 +93,11 @@ export default {
       const activeIndex = this.tabs.findIndex((tab, index) => {
         return this.isTabActive(tab, index);
       });
-      const translateX = -activeIndex * 100;
+
+      const offset = activeIndex * 100;
+        // 根据文本方向调整 translateX 值
+      const translateX = this.language === 'ar'  ? offset : -offset;
+      // const translateX = -activeIndex * 100;
       return {
         transform: `translateX(${translateX}%)`,
         transitionDuration: '0.3s',
@@ -104,8 +112,10 @@ export default {
       }
     },
     // 计算滚动监视的类名
-    scrollspy() {
-      return `${prefixCls}--complete`;
+    scrollspyClasses() {
+      return {
+        [`${prefixCls}--complete`]:this.scrollspy
+      }
     },
     // 计算标签文字是否需要省略号的类名
     ellipsisClasses() {

package/dist/components/tabs/style.less

@@ -15,6 +15,8 @@
   }
   
   &__nav{
+    display: flex;
+    align-items: center;
     &--primary {
       position: relative;
       white-space: nowrap;
@@ -50,6 +52,11 @@
             border-radius: var(--radius-tab-primary_bar);
           }
         }
+        &__none--line {
+          &::before {
+            display: none;
+          }
+        }
       }
     }
 
@@ -92,6 +99,11 @@
             border-radius: 1px;
           }
         }
+        &__none--line {
+          &::before {
+            display: none;
+          }
+        }
       }
     }
     
@@ -130,6 +142,11 @@
             border-radius: var(--radius-tab-secondary-bar_top) var(--radius-tab-secondary-bar_top) var(--radius-tab-secondary-bar_bottom) var(--radius-tab-secondary-bar_bottom);
           }
         }
+        &__none--line {
+          &::before {
+            display: none;
+          }
+        }
       }
 
     }
@@ -167,20 +184,12 @@
           font-size: var(--en-single-f-c-s-fontSize);
           font-weight: var(--en-single-f-c-s-fontWeight);
           background-color: var(--color-tab-capsule_btn-bg-active);
-      
-          // .@{tab-prefix-cls}__arrow {
-          //   color: var(--color-tab-filter_down-active);
-          //   transform: rotate(180deg);
-          // }
         }
       }
     }
     
     
-
-
-    
-      &--selector-l  {
+    &--selector-l  {
         position: relative;
         display: flex;
         background-color: var(--color-tab-selector-bg-default);
@@ -216,7 +225,7 @@
     
 
 
-      &--selector-m{
+    &--selector-m{
         position: relative;
         display: flex;
         background-color: var(--color-tab-selector-bg-default);
@@ -251,7 +260,7 @@
     }
     
     
-      &--filter {
+    &--filter {
         position: relative;
         display: flex;
         height: var(--height-tab-filter);
@@ -271,20 +280,14 @@
           color: var(--color-tab-filter-text-active);
           font-size: var(--en-single-f-c-s-fontSize);
           font-weight: var(--en-single-f-c-s-fontWeight);
-      
-          // .@{tab-prefix-cls}__arrow {
-          //   color: var(--color-tab-filter_down);
-          //   transform: rotate(180deg);
-          // }
+    
         }
       }
     
 
     }
     
-
-    
-      &--click-filter {
+    &--click-filter {
         position: relative;
         display: flex;
         height: var(--height-tab-filter);
@@ -363,6 +366,10 @@
   &__track {
     display: flex;
     transition: transform 0.3s;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    will-change: left;
   }
 
 
@@ -376,13 +383,6 @@
     justify-content: center;
   }
 
-  // &__arrow {
-  //   display: inline-block;
-  //   vertical-align: -1px;
-  //   font-size: var(--icon-small) !important;
-  //   color: var(--color-tab-filter_down);
-  // }
-
   &__text--ellipsis {
     display: -webkit-box;
     overflow: hidden;
@@ -390,11 +390,6 @@
     -webkit-box-orient: vertical;
   }
 
-  &__none--line {
-    &::before {
-      display: none;
-    }
-  }
   &__pane {
     flex-shrink: 0;
     width: 100%;

package/dist/components/toast/index.js

@@ -3,6 +3,7 @@ import ToastComponent from './index.vue';
 import { inBrowser } from '../utils/env';
 
 let queueResult = []
+let allowMultiple = false
 
 function getType(value) {
   if (value !== value) return 'NaN';
@@ -13,8 +14,8 @@ class VdToast extends Vue.extend(ToastComponent) {
   constructor(options) {
     super();
     this.vm = this.$mount();
-
     this.timer = null
+    this.allowMultiple = allowMultiple
 
     // 判断传入的 options 类型，并进行赋值
     if (typeof options === 'string' || typeof options === 'number') {
@@ -34,6 +35,12 @@ class VdToast extends Vue.extend(ToastComponent) {
   init() {
     if (inBrowser) {
       document.body.appendChild(this.vm.$el)
+      if (!this.allowMultiple) {
+        queueResult.forEach(toast => {
+          toast.clear()
+        })
+        queueResult = [];
+      }
       this.start()
     }
   }
@@ -83,4 +90,8 @@ Toast.clear = () => {
   queueResult = [];
 }
 
+Toast.allowMultiple = () => {
+  allowMultiple = true
+}
+
 export default Toast