vdesign-ui 0.1.24-beta → 0.1.25

package/dist/components/input/index.vue

@@ -11,7 +11,6 @@
         :type="passwordIcon ? (passwordVisible ? 'text' : 'password') : type"
         :class="inputClasses"
         :disabled="disabled"
-        :readonly="readonly"
         :placeholder="placeholder"
         :value="currentValue"
         @input="handleInput"
@@ -29,7 +28,6 @@
         :rows="rows"
         :class="inputClasses"
         :disabled="disabled"
-        :readonly="readonly"
         :placeholder="placeholder"
         :value="currentValue"
         @focus="handleFocus"
@@ -39,12 +37,12 @@
       >
       </textarea>
       <div
-        v-if="suffix || clearable || $slots.suffix || append || $slots.append || isWordLimitVisible"
+        v-if="suffix || $slots.suffix || append || $slots.append || isWordLimitVisible"
         class="vd-input-form__right"
       >
-        <span v-if="(suffix || $slots.suffix) || showClear" class="vd-input-form__suffix">
+        <span v-if="suffix || $slots.suffix" class="vd-input-form__suffix">
           <slot name="suffix">
-            <vd-icon name="icon_btn_clean" @mousedown.prevent.native="handleClear"></vd-icon>
+            <vd-icon name="icon_btn_clean" @click="handleClear"></vd-icon>
           </slot>
         </span>
         <span v-if="append || $slots.append" class="vd-input-form__append">
@@ -66,7 +64,7 @@
         class="vd-input-form__password"
       >
         <span v-if="passwordClose" class="vd-input-form__password--close">
-            <vd-icon name="icon_btn_close" @mousedown.prevent.native="handleClear"></vd-icon>
+            <vd-icon name="icon_btn_close" @click="handleClear"></vd-icon>
         </span>
         <span v-if="passwordIcon" class="vd-input-form__password--password">
             <vd-icon
@@ -84,14 +82,11 @@
         :wrap="wrap"
         :class="inputClasses"
         :disabled="disabled"
-        :readonly="readonly"
         :placeholder="placeholder"
         :value="currentValue"
         :rows="rows"
         :name="name"
         @input="handleInput"
-        @focus="handleFocus"
-        @blur="handleBlur"
         :style="textareaStyles"
       >
       </textarea>
@@ -149,6 +144,10 @@ export default {
     passwordClose: {
       type: Boolean,
     },
+    passwordType: {
+      type: String,
+      default: "icon_btn_eye_close",
+    },
     form: {
       type: String,
     },
@@ -193,8 +192,6 @@ export default {
       type: Boolean,
       default: false,
     },
-    clearable:Boolean,
-    readonly:Boolean
   },
   data() {
     return {
@@ -203,20 +200,9 @@ export default {
       isOnComposition: false,
       textareaStyles: {},
       passwordVisible: false,
-      focused: false,
     };
   },
   computed: {
-    showClear() {
-      const show = (
-        this.clearable &&
-        this.focused &&
-        this.currentValue !== '' &&
-        !this.disabled &&
-        !this.readonly
-      );
-      return show;
-    },
     wrapClasses() {
       return [
         {
@@ -271,18 +257,12 @@ export default {
   },
   methods: {
     handleFocus(event) {
-      this.focused = true;
       if (this.form) {
         this.focusClass = true;
       }
       this.$emit("focus", event);
-
-      if (this.readonly) {
-        this.blur();
-      }
     },
     handleBlur(event) {
-      this.focused = false;
       if (this.form) {
         this.focusClass = false;
       }
@@ -339,9 +319,6 @@ export default {
       this.setCurrentValue("");
       this.$emit("change", e);
       this.$emit("clear");
-      this.$nextTick(() => {
-        this.focus();
-      });
     },
     handlePasswordVisible() {
       this.passwordVisible = !this.passwordVisible;

package/dist/components/input/style.less

@@ -139,6 +139,7 @@
         &__right {
             display: inline-flex;
             align-items: center;
+
             .@{input-prefix-cls}__word-limit {
                 text-align: end;
                 color: var(--color-input-text-default);

package/dist/components/loading/index.vue

@@ -1,15 +1,14 @@
 <template>
   <div class="vd-loading-wrapper">
+
     <div class="vd-loading" v-if="loading">
       <slot>
-        <img src="./img_status_loading_white_ani.svg" alt="">
+        <img src="./loading.png" alt="">
       </slot>
       <span class="vd-loading__text" v-if="text">{{ text }}</span>
     </div>
     <div class="vd-refresh" :class="refreshClasses" v-else>
-      <slot>
-        <img src="./img_status_refresh_ani.svg" alt="">
-      </slot>
+      <img src="./refresh.png" alt="">
     </div>
   </div>
 </template> 

package/dist/components/loading/style.less

@@ -1,6 +1,6 @@
 
 .vd-loading{
-    position: fixed;
+    position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);

package/dist/components/mixins/clickoutside.js

@@ -33,7 +33,7 @@ function createDocumentHandler(el, binding, vnode) {
     if (binding.expression &&
       el[ctx].methodName &&
       vnode.context[el[ctx].methodName]) {
-      vnode.context[el[ctx].methodName](mouseup.target);
+      vnode.context[el[ctx].methodName]();
     } else {
       el[ctx].bindingFn && el[ctx].bindingFn();
     }

package/dist/components/mixins/dom.js

@@ -1,41 +1,41 @@
-/* istanbul ignore next */
-
-import Vue from 'vue';
-
-const isServer = Vue.prototype.$isServer;
-/* istanbul ignore next */
-export const on = (function () {
-  // 添加事件监听器
-  if (!isServer && document.addEventListener) {
-    return function (element, event, handler) {
-      if (element && event && handler) {
-        element.addEventListener(event, handler, false);
-      }
-    };
-  } else {
-    // IE8 及其以下版本没有 addEventListener 方法
-    return function (element, event, handler) {
-      if (element && event && handler) {
-        element.attachEvent('on' + event, handler);
-      }
-    };
-  }
-})();
-
-/* istanbul ignore next */
-export const off = (function () {
-  // 移除事件监听器
-  if (!isServer && document.removeEventListener) {
-    return function (element, event, handler) {
-      if (element && event) {
-        element.removeEventListener(event, handler, false);
-      }
-    };
-  } else {
-    return function (element, event, handler) {
-      if (element && event) {
-        element.detachEvent('on' + event, handler);
-      }
-    };
-  }
-})();
+/* istanbul ignore next */
+
+import Vue from 'vue';
+
+const isServer = Vue.prototype.$isServer;
+/* istanbul ignore next */
+export const on = (function () {
+  // 添加事件监听器
+  if (!isServer && document.addEventListener) {
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.addEventListener(event, handler, false);
+      }
+    };
+  } else {
+    // IE8 及其以下版本没有 addEventListener 方法
+    return function (element, event, handler) {
+      if (element && event && handler) {
+        element.attachEvent('on' + event, handler);
+      }
+    };
+  }
+})();
+
+/* istanbul ignore next */
+export const off = (function () {
+  // 移除事件监听器
+  if (!isServer && document.removeEventListener) {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.removeEventListener(event, handler, false);
+      }
+    };
+  } else {
+    return function (element, event, handler) {
+      if (element && event) {
+        element.detachEvent('on' + event, handler);
+      }
+    };
+  }
+})();

package/dist/components/mixins/outlineConfigPlugin.js

@@ -1,40 +1,40 @@
-// outlineConfigPlugin.js
-
-// __debug=1&__debug_vdesign_token=1
-const OutlineConfig = {
-    install(Vue,  options = {}) {
-      const outlineConfig = Vue.observable({
-        outlineEnabled:  options.outlineEnabled ||false,
-      });
-  
-      Vue.prototype.$outlineConfig = outlineConfig;
-  
-      Vue.mixin({
-        created() {
-          this.$outlineConfig.outlineEnabled = this.shouldEnableOutline()
-
-          this.$watch('$outlineConfig.outlineEnabled', (newValue) => {
-            document.documentElement.style.setProperty('--outline-visible', newValue ? '1px' : '0');
-          }, { immediate: true });
-        },
-        methods:{
-          shouldEnableOutline() {
-            // 获取URL的查询参数部分
-            const searchParams = new URLSearchParams(window.location.search);
-            // 对于哈希模式，也解析哈希中的查询字符串
-            const hashParams = window.location.hash.split('?')[1] ? new URLSearchParams(window.location.hash.split('?')[1]) : null;
-          
-            // 检查查询参数或哈希中的参数
-            const debug = searchParams.has('__debug') || (hashParams && hashParams.has('__debug')) ? searchParams.get('__debug') === '1' || (hashParams && hashParams.get('__debug') === '1') : false;
-            const vdesignToken = searchParams.has('__debug_vdesign_token') || (hashParams && hashParams.has('__debug_vdesign_token')) ? searchParams.get('__debug_vdesign_token') === '1' || (hashParams && hashParams.get('__debug_vdesign_token') === '1') : false;
-          
-            return debug && vdesignToken;
-          }
-        }
-      });
-    }
-};
-  
-
-
-export default OutlineConfig;
+// outlineConfigPlugin.js
+
+// __debug=1&__debug_vdesign_token=1
+const OutlineConfig = {
+    install(Vue,  options = {}) {
+      const outlineConfig = Vue.observable({
+        outlineEnabled:  options.outlineEnabled ||false,
+      });
+  
+      Vue.prototype.$outlineConfig = outlineConfig;
+  
+      Vue.mixin({
+        created() {
+          this.$outlineConfig.outlineEnabled = this.shouldEnableOutline()
+
+          this.$watch('$outlineConfig.outlineEnabled', (newValue) => {
+            document.documentElement.style.setProperty('--outline-visible', newValue ? '1px' : '0');
+          }, { immediate: true });
+        },
+        methods:{
+          shouldEnableOutline() {
+            // 获取URL的查询参数部分
+            const searchParams = new URLSearchParams(window.location.search);
+            // 对于哈希模式，也解析哈希中的查询字符串
+            const hashParams = window.location.hash.split('?')[1] ? new URLSearchParams(window.location.hash.split('?')[1]) : null;
+          
+            // 检查查询参数或哈希中的参数
+            const debug = searchParams.has('__debug') || (hashParams && hashParams.has('__debug')) ? searchParams.get('__debug') === '1' || (hashParams && hashParams.get('__debug') === '1') : false;
+            const vdesignToken = searchParams.has('__debug_vdesign_token') || (hashParams && hashParams.has('__debug_vdesign_token')) ? searchParams.get('__debug_vdesign_token') === '1' || (hashParams && hashParams.get('__debug_vdesign_token') === '1') : false;
+          
+            return debug && vdesignToken;
+          }
+        }
+      });
+    }
+};
+  
+
+
+export default OutlineConfig;

package/dist/components/mixins/router-link.js

@@ -1,23 +1,23 @@
-/**
- * add Vue-Router support
- */
-
-export default {
-    props: {
-      url: String,
-      replace: Boolean,
-      to: [String, Object]
-    },
-  
-    methods: {
-      routerLink() {
-        const { to, url, $router, replace } = this;
-        if (to && $router) {
-          $router[replace ? 'replace' : 'push'](to);
-        } else if (url) {
-          replace ? location.replace(url) : location.href = url;
-        }
-      }
-    }
-  };
+/**
+ * add Vue-Router support
+ */
+
+export default {
+    props: {
+      url: String,
+      replace: Boolean,
+      to: [String, Object]
+    },
+  
+    methods: {
+      routerLink() {
+        const { to, url, $router, replace } = this;
+        if (to && $router) {
+          $router[replace ? 'replace' : 'push'](to);
+        } else if (url) {
+          replace ? location.replace(url) : location.href = url;
+        }
+      }
+    }
+  };
   

package/dist/components/pagebreak/index.vue

@@ -8,7 +8,7 @@
     </template>
 
     <div class="vd-page-break__number" v-else>
-      <span class="vd-page-break__number--active" v-if="number">{{ number }}</span>
+      <span class="vd-page-break__number--active" v-html="number"></span>
       <span class="vd-page-break__number--line">/</span>
       <span class="vd-page-break__number--total">{{ total }}</span>
     </div>
@@ -34,27 +34,21 @@ export default {
     total: {
       type: Number,
       default: 9
-    },
-    activePage: {
-      type: Number,
-      default: 1 // 默认显示第一页
     }
   },
   data() {
     return {
-      currentPage: this.activePage // 从外部传入的值初始化,
+      currentPage: 1,
     }
   },
-  watch: {
-    activePage(newVal) {
-      this.currentPage = newVal; // 外部传入值变化时更新当前页
-    }
+  computed: {
+
   },
   methods: {
     changePage(pageNumber) {
       if (pageNumber >= 1 && pageNumber <= this.totalPages) {
         this.currentPage = pageNumber;
-        this.$emit('change', pageNumber);
+        this.$emit('page-changed', pageNumber);
       }
     },
   },