eoss-ui 0.7.76 → 0.7.77

package/packages/label/src/main.vue

@@ -1,457 +1,457 @@
-<script>
-export default {
-  name: 'EsLabel',
-  componentsName: 'EsLabel',
-  inheritAttrs: false,
-  props: {
-    contents: {
-      type: [Object, String],
-      default() {
-        return '';
-      }
-    },
-    text: String,
-    rules: {
-      type: [Array, Object],
-      default() {
-        return {};
-      }
-    },
-    icon: {
-      type: String,
-      default: ''
-    },
-    img: {
-      type: String,
-      default: ''
-    },
-    image: {
-      type: String,
-      default: ''
-    },
-    hide: {
-      type: Boolean,
-      default: false
-    },
-    tips: {
-      type: [String, Object],
-      default: ''
-    },
-    before: {
-      type: Boolean,
-      default: true
-    },
-    labelWidth: {
-      type: String,
-      default: '120px'
-    },
-    plain: Boolean,
-    events: Object,
-    event: Function
-  },
-  computed: {
-    isRequired() {
-      let flag = false;
-      if (Array.isArray(this.rules)) {
-        this.rules.forEach((item) => {
-          if (Object.prototype.hasOwnProperty.call(item, 'required')) {
-            flag = item.required;
-            return flag;
-          }
-        });
-      } else {
-        if (Object.prototype.hasOwnProperty.call(this.rules, 'required')) {
-          flag = this.rules.required;
-        }
-      }
-      return flag;
-    }
-  },
-  data() {
-    return {
-      placeholders: this.placeholder
-    };
-  },
-  mounted() {},
-  methods: {
-    handleClick(e, type, obj) {
-      e.stopPropagation();
-      e.preventDefault();
-      if (type) {
-        if (this.events && this.events[type]) {
-          let params = obj ? [obj, e, this] : [e, this];
-          if (typeof this.events[type] === 'function') {
-            this.events[type]('click', ...params);
-          } else if (
-            this.events[type]['click'] &&
-            typeof this.events[type]['click'] === 'function'
-          ) {
-            this.events[type]['click'](...params);
-          }
-        }
-      } else {
-        this.event && this.event(this, e);
-        this.$emit('click', this, e);
-      }
-    },
-    handleMouseenter(e, type, obj) {
-      e.stopPropagation();
-      e.preventDefault();
-      if (type && this.events && this.events[type]) {
-        let params = obj ? [obj, e, this] : [e, this];
-        if (typeof this.events[type] === 'function') {
-          this.events[type]('mouseenter', ...params);
-        } else if (
-          this.events[type]['mouseenter'] &&
-          typeof this.events[type]['mouseenter'] === 'function'
-        ) {
-          this.events[type]['mouseenter'](...params);
-        }
-      }
-    },
-    handleMouseleave(e, type, obj) {
-      e.stopPropagation();
-      e.preventDefault();
-      if (type && this.events && this.events[type]) {
-        let params = obj ? [obj, e, this] : [e, this];
-        if (typeof this.events[type] === 'function') {
-          this.events[type]('mouseleave', ...params);
-        } else if (
-          this.events[type]['mouseleave'] &&
-          typeof this.events[type]['mouseleave'] === 'function'
-        ) {
-          this.events[type]['mouseleave'](...params);
-        }
-      }
-    }
-  },
-  render(h) {
-    let i = 0;
-    let doms = [];
-    if (!this.hide) {
-      if (this.$slots.prepend) {
-        doms.push(this.$slots.prepend);
-      }
-      if (typeof this.contents === 'string') {
-        if (this.contents || this.text) {
-          doms.push(this.contents || this.text);
-        }
-        if (this.icon) {
-          if (
-            this.icon.indexOf('es-icon-') > -1 ||
-            this.icon.indexOf('el-icon-') > -1
-          ) {
-            doms.push(
-              h('i', {
-                class: [
-                  this.icon,
-                  this.events && this.events['icon'] ? 'es-pointer' : ''
-                ],
-                on: {
-                  click: (e) => {
-                    this.handleClick(e, 'icon');
-                  },
-                  mouseenter: (e) => {
-                    this.handleMouseenter(e, 'icon');
-                  },
-                  mouseleave: (e) => {
-                    this.handleMouseleave(e, 'icon');
-                  }
-                }
-              })
-            );
-          } else if (this.icon.indexOf('&#') > -1) {
-            doms.push(
-              h(
-                'i',
-                {
-                  class: [
-                    'es-label-icon',
-                    'es-icon',
-                    this.events && this.events['icon'] ? 'es-pointer' : ''
-                  ],
-                  on: {
-                    click: (e) => {
-                      this.handleClick(e, 'icon');
-                    },
-                    mouseenter: (e) => {
-                      this.handleMouseenter(e, 'icon');
-                    },
-                    mouseleave: (e) => {
-                      this.handleMouseleave(e, 'icon');
-                    }
-                  }
-                },
-                [this.icon]
-              )
-            );
-          } else {
-            let icon =
-              this.icon.indexOf('es-') > -1
-                ? 'es-icon-' + this.icon.replace('es-', '')
-                : 'el-icon-' + this.icon.replace('el-', '');
-            doms.push(
-              h('i', {
-                class: [
-                  icon,
-                  'es-label-icon',
-                  this.events && this.events['icon'] ? 'es-pointer' : ''
-                ],
-                on: {
-                  click: (e) => {
-                    this.handleClick(e, 'icon');
-                  },
-                  mouseenter: (e) => {
-                    this.handleMouseenter(e, 'icon');
-                  },
-                  mouseleave: (e) => {
-                    this.handleMouseleave(e, 'icon');
-                  }
-                }
-              })
-            );
-          }
-        }
-        if (this.image || this.img) {
-          doms.push(
-            h('img', {
-              class: [
-                'es-label-img',
-                this.events && (this.events['image'] || this.events['img'])
-                  ? 'es-pointer'
-                  : ''
-              ],
-              attrs: { src: this.image || this.img },
-              on: {
-                click: (e) => {
-                  this.handleClick(e, this.image ? 'image' : 'img');
-                },
-                mouseenter: (e) => {
-                  this.handleMouseenter(e, this.image ? 'image' : 'img');
-                },
-                mouseleave: (e) => {
-                  this.handleMouseleave(e, this.image ? 'image' : 'img');
-                }
-              }
-            })
-          );
-        }
-        if (this.tips) {
-          if (typeof this.tips === 'string') {
-            if (this.before) {
-              doms.unshift(
-                h('es-tips', {
-                  props: { contents: this.tips }
-                })
-              );
-            } else {
-              i = doms.length;
-              doms.push(
-                h('es-tips', {
-                  props: { contents: this.tips }
-                })
-              );
-            }
-          } else {
-            if (this.before) {
-              doms.unshift(
-                h('es-tips', {
-                  props: { ...this.tips }
-                })
-              );
-            } else {
-              i = doms.length;
-              doms.push(
-                h('es-tips', {
-                  props: { ...this.tips }
-                })
-              );
-            }
-          }
-        }
-      } else {
-        for (let i in this.contents) {
-          switch (i) {
-            case 'text':
-              doms.push(this.contents[i]);
-              break;
-            case 'icon':
-              if (
-                this.contents[i].indexOf('es-icon-') > -1 ||
-                this.contents[i].indexOf('el-icon-') > -1
-              ) {
-                doms.push(
-                  h('i', {
-                    class: [
-                      this.contents[i],
-                      this.events && this.events['icon'] ? 'es-pointer' : ''
-                    ],
-                    on: {
-                      click: (e) => {
-                        this.handleClick(e, 'icon');
-                      },
-                      mouseenter: (e) => {
-                        this.handleMouseenter(e, 'icon');
-                      },
-                      mouseleave: (e) => {
-                        this.handleMouseleave(e, 'icon');
-                      }
-                    }
-                  })
-                );
-              } else if (this.contents[i].indexOf('&#') > -1) {
-                doms.push(
-                  h(
-                    'i',
-                    {
-                      class: [
-                        'es-label-icon',
-                        'es-icon',
-                        this.events && this.events['icon'] ? 'es-pointer' : ''
-                      ],
-                      on: {
-                        click: (e) => {
-                          this.handleClick(e, 'icon');
-                        },
-                        mouseenter: (e) => {
-                          this.handleMouseenter(e, 'icon');
-                        },
-                        mouseleave: (e) => {
-                          this.handleMouseleave(e, 'icon');
-                        }
-                      }
-                    },
-                    [this.contents[i]]
-                  )
-                );
-              } else {
-                let icon =
-                  this.contents[i].indexOf('es-') > -1
-                    ? 'es-icon-' + this.contents[i].replace('es-', '')
-                    : 'el-icon-' + this.contents[i].replace('el-', '');
-                doms.push(
-                  h('i', {
-                    class: [
-                      icon,
-                      'es-label-icon',
-                      this.events && this.events['icon'] ? 'es-pointer' : ''
-                    ],
-                    on: {
-                      click: (e) => {
-                        this.handleClick(e, 'icon');
-                      },
-                      mouseenter: (e) => {
-                        this.handleMouseenter(e, 'icon');
-                      },
-                      mouseleave: (e) => {
-                        this.handleMouseleave(e, 'icon');
-                      }
-                    }
-                  })
-                );
-              }
-              break;
-            case 'img':
-              doms.push(
-                h('img', {
-                  class: [
-                    'es-label-img',
-                    this.events && this.events['img'] ? 'es-pointer' : ''
-                  ],
-                  attrs: { src: this.contents[i] },
-                  on: {
-                    click: (e) => {
-                      this.handleClick(e, 'img');
-                    },
-                    mouseenter: (e) => {
-                      this.handleMouseenter(e, 'img');
-                    },
-                    mouseleave: (e) => {
-                      this.handleMouseleave(e, 'img');
-                    }
-                  }
-                })
-              );
-              break;
-            case 'image':
-              doms.push(
-                h('img', {
-                  class: [
-                    'es-label-img',
-                    this.events && this.events['image'] ? 'es-pointer' : ''
-                  ],
-                  attrs: { src: this.contents[i] },
-                  on: {
-                    click: (e) => {
-                      this.handleClick(e, 'image');
-                    },
-                    mouseenter: (e) => {
-                      this.handleMouseenter(e, 'image');
-                    },
-                    mouseleave: (e) => {
-                      this.handleMouseleave(e, 'image');
-                    }
-                  }
-                })
-              );
-              break;
-            case 'tips':
-              if (typeof this.contents[i] === 'string') {
-                if (this.before) {
-                  doms.unshift(
-                    h('es-tips', {
-                      props: { contents: this.contents[i] }
-                    })
-                  );
-                } else {
-                  i = doms.length;
-                  doms.push(
-                    h('es-tips', {
-                      props: { contents: this.contents[i] }
-                    })
-                  );
-                }
-              } else {
-                if (this.before) {
-                  doms.unshift(
-                    h('es-tips', {
-                      props: { ...this.contents[i] }
-                    })
-                  );
-                } else {
-                  i = doms.length;
-                  doms.push(
-                    h('es-tips', {
-                      props: { ...this.contents[i] }
-                    })
-                  );
-                }
-              }
-              break;
-          }
-        }
-      }
-      if (this.$slots.append) {
-        if (i > 0) {
-          doms.splice(i, 0, this.$slots.append);
-        } else {
-          doms.push(this.$slots.append);
-        }
-      }
-      if (this.plain) {
-        doms.push('：');
-      }
-      return h(
-        'span',
-        {
-          class: { 'es-label': true, 'es-is-required': this.isRequired },
-          on: { click: this.handleClick }
-        },
-        doms
-      );
-    } else {
-      return '';
-    }
-  }
-};
-</script>
+<script>
+export default {
+  name: 'EsLabel',
+  componentsName: 'EsLabel',
+  inheritAttrs: false,
+  props: {
+    contents: {
+      type: [Object, String],
+      default() {
+        return '';
+      }
+    },
+    text: String,
+    rules: {
+      type: [Array, Object],
+      default() {
+        return {};
+      }
+    },
+    icon: {
+      type: String,
+      default: ''
+    },
+    img: {
+      type: String,
+      default: ''
+    },
+    image: {
+      type: String,
+      default: ''
+    },
+    hide: {
+      type: Boolean,
+      default: false
+    },
+    tips: {
+      type: [String, Object],
+      default: ''
+    },
+    before: {
+      type: Boolean,
+      default: true
+    },
+    labelWidth: {
+      type: String,
+      default: '120px'
+    },
+    plain: Boolean,
+    events: Object,
+    event: Function
+  },
+  computed: {
+    isRequired() {
+      let flag = false;
+      if (Array.isArray(this.rules)) {
+        this.rules.forEach((item) => {
+          if (Object.prototype.hasOwnProperty.call(item, 'required')) {
+            flag = item.required;
+            return flag;
+          }
+        });
+      } else {
+        if (Object.prototype.hasOwnProperty.call(this.rules, 'required')) {
+          flag = this.rules.required;
+        }
+      }
+      return flag;
+    }
+  },
+  data() {
+    return {
+      placeholders: this.placeholder
+    };
+  },
+  mounted() {},
+  methods: {
+    handleClick(e, type, obj) {
+      e.stopPropagation();
+      e.preventDefault();
+      if (type) {
+        if (this.events && this.events[type]) {
+          let params = obj ? [obj, e, this] : [e, this];
+          if (typeof this.events[type] === 'function') {
+            this.events[type]('click', ...params);
+          } else if (
+            this.events[type]['click'] &&
+            typeof this.events[type]['click'] === 'function'
+          ) {
+            this.events[type]['click'](...params);
+          }
+        }
+      } else {
+        this.event && this.event(this, e);
+        this.$emit('click', this, e);
+      }
+    },
+    handleMouseenter(e, type, obj) {
+      e.stopPropagation();
+      e.preventDefault();
+      if (type && this.events && this.events[type]) {
+        let params = obj ? [obj, e, this] : [e, this];
+        if (typeof this.events[type] === 'function') {
+          this.events[type]('mouseenter', ...params);
+        } else if (
+          this.events[type]['mouseenter'] &&
+          typeof this.events[type]['mouseenter'] === 'function'
+        ) {
+          this.events[type]['mouseenter'](...params);
+        }
+      }
+    },
+    handleMouseleave(e, type, obj) {
+      e.stopPropagation();
+      e.preventDefault();
+      if (type && this.events && this.events[type]) {
+        let params = obj ? [obj, e, this] : [e, this];
+        if (typeof this.events[type] === 'function') {
+          this.events[type]('mouseleave', ...params);
+        } else if (
+          this.events[type]['mouseleave'] &&
+          typeof this.events[type]['mouseleave'] === 'function'
+        ) {
+          this.events[type]['mouseleave'](...params);
+        }
+      }
+    }
+  },
+  render(h) {
+    let i = 0;
+    let doms = [];
+    if (!this.hide) {
+      if (this.$slots.prepend) {
+        doms.push(this.$slots.prepend);
+      }
+      if (typeof this.contents === 'string') {
+        if (this.contents || this.text) {
+          doms.push(this.contents || this.text);
+        }
+        if (this.icon) {
+          if (
+            this.icon.indexOf('es-icon-') > -1 ||
+            this.icon.indexOf('el-icon-') > -1
+          ) {
+            doms.push(
+              h('i', {
+                class: [
+                  this.icon,
+                  this.events && this.events['icon'] ? 'es-pointer' : ''
+                ],
+                on: {
+                  click: (e) => {
+                    this.handleClick(e, 'icon');
+                  },
+                  mouseenter: (e) => {
+                    this.handleMouseenter(e, 'icon');
+                  },
+                  mouseleave: (e) => {
+                    this.handleMouseleave(e, 'icon');
+                  }
+                }
+              })
+            );
+          } else if (this.icon.indexOf('&#') > -1) {
+            doms.push(
+              h(
+                'i',
+                {
+                  class: [
+                    'es-label-icon',
+                    'es-icon',
+                    this.events && this.events['icon'] ? 'es-pointer' : ''
+                  ],
+                  on: {
+                    click: (e) => {
+                      this.handleClick(e, 'icon');
+                    },
+                    mouseenter: (e) => {
+                      this.handleMouseenter(e, 'icon');
+                    },
+                    mouseleave: (e) => {
+                      this.handleMouseleave(e, 'icon');
+                    }
+                  }
+                },
+                [this.icon]
+              )
+            );
+          } else {
+            let icon =
+              this.icon.indexOf('es-') > -1
+                ? 'es-icon-' + this.icon.replace('es-', '')
+                : 'el-icon-' + this.icon.replace('el-', '');
+            doms.push(
+              h('i', {
+                class: [
+                  icon,
+                  'es-label-icon',
+                  this.events && this.events['icon'] ? 'es-pointer' : ''
+                ],
+                on: {
+                  click: (e) => {
+                    this.handleClick(e, 'icon');
+                  },
+                  mouseenter: (e) => {
+                    this.handleMouseenter(e, 'icon');
+                  },
+                  mouseleave: (e) => {
+                    this.handleMouseleave(e, 'icon');
+                  }
+                }
+              })
+            );
+          }
+        }
+        if (this.image || this.img) {
+          doms.push(
+            h('img', {
+              class: [
+                'es-label-img',
+                this.events && (this.events['image'] || this.events['img'])
+                  ? 'es-pointer'
+                  : ''
+              ],
+              attrs: { src: this.image || this.img },
+              on: {
+                click: (e) => {
+                  this.handleClick(e, this.image ? 'image' : 'img');
+                },
+                mouseenter: (e) => {
+                  this.handleMouseenter(e, this.image ? 'image' : 'img');
+                },
+                mouseleave: (e) => {
+                  this.handleMouseleave(e, this.image ? 'image' : 'img');
+                }
+              }
+            })
+          );
+        }
+        if (this.tips) {
+          if (typeof this.tips === 'string') {
+            if (this.before) {
+              doms.unshift(
+                h('es-tips', {
+                  props: { contents: this.tips }
+                })
+              );
+            } else {
+              i = doms.length;
+              doms.push(
+                h('es-tips', {
+                  props: { contents: this.tips }
+                })
+              );
+            }
+          } else {
+            if (this.before) {
+              doms.unshift(
+                h('es-tips', {
+                  props: { ...this.tips }
+                })
+              );
+            } else {
+              i = doms.length;
+              doms.push(
+                h('es-tips', {
+                  props: { ...this.tips }
+                })
+              );
+            }
+          }
+        }
+      } else {
+        for (let i in this.contents) {
+          switch (i) {
+            case 'text':
+              doms.push(this.contents[i]);
+              break;
+            case 'icon':
+              if (
+                this.contents[i].indexOf('es-icon-') > -1 ||
+                this.contents[i].indexOf('el-icon-') > -1
+              ) {
+                doms.push(
+                  h('i', {
+                    class: [
+                      this.contents[i],
+                      this.events && this.events['icon'] ? 'es-pointer' : ''
+                    ],
+                    on: {
+                      click: (e) => {
+                        this.handleClick(e, 'icon');
+                      },
+                      mouseenter: (e) => {
+                        this.handleMouseenter(e, 'icon');
+                      },
+                      mouseleave: (e) => {
+                        this.handleMouseleave(e, 'icon');
+                      }
+                    }
+                  })
+                );
+              } else if (this.contents[i].indexOf('&#') > -1) {
+                doms.push(
+                  h(
+                    'i',
+                    {
+                      class: [
+                        'es-label-icon',
+                        'es-icon',
+                        this.events && this.events['icon'] ? 'es-pointer' : ''
+                      ],
+                      on: {
+                        click: (e) => {
+                          this.handleClick(e, 'icon');
+                        },
+                        mouseenter: (e) => {
+                          this.handleMouseenter(e, 'icon');
+                        },
+                        mouseleave: (e) => {
+                          this.handleMouseleave(e, 'icon');
+                        }
+                      }
+                    },
+                    [this.contents[i]]
+                  )
+                );
+              } else {
+                let icon =
+                  this.contents[i].indexOf('es-') > -1
+                    ? 'es-icon-' + this.contents[i].replace('es-', '')
+                    : 'el-icon-' + this.contents[i].replace('el-', '');
+                doms.push(
+                  h('i', {
+                    class: [
+                      icon,
+                      'es-label-icon',
+                      this.events && this.events['icon'] ? 'es-pointer' : ''
+                    ],
+                    on: {
+                      click: (e) => {
+                        this.handleClick(e, 'icon');
+                      },
+                      mouseenter: (e) => {
+                        this.handleMouseenter(e, 'icon');
+                      },
+                      mouseleave: (e) => {
+                        this.handleMouseleave(e, 'icon');
+                      }
+                    }
+                  })
+                );
+              }
+              break;
+            case 'img':
+              doms.push(
+                h('img', {
+                  class: [
+                    'es-label-img',
+                    this.events && this.events['img'] ? 'es-pointer' : ''
+                  ],
+                  attrs: { src: this.contents[i] },
+                  on: {
+                    click: (e) => {
+                      this.handleClick(e, 'img');
+                    },
+                    mouseenter: (e) => {
+                      this.handleMouseenter(e, 'img');
+                    },
+                    mouseleave: (e) => {
+                      this.handleMouseleave(e, 'img');
+                    }
+                  }
+                })
+              );
+              break;
+            case 'image':
+              doms.push(
+                h('img', {
+                  class: [
+                    'es-label-img',
+                    this.events && this.events['image'] ? 'es-pointer' : ''
+                  ],
+                  attrs: { src: this.contents[i] },
+                  on: {
+                    click: (e) => {
+                      this.handleClick(e, 'image');
+                    },
+                    mouseenter: (e) => {
+                      this.handleMouseenter(e, 'image');
+                    },
+                    mouseleave: (e) => {
+                      this.handleMouseleave(e, 'image');
+                    }
+                  }
+                })
+              );
+              break;
+            case 'tips':
+              if (typeof this.contents[i] === 'string') {
+                if (this.before) {
+                  doms.unshift(
+                    h('es-tips', {
+                      props: { contents: this.contents[i] }
+                    })
+                  );
+                } else {
+                  i = doms.length;
+                  doms.push(
+                    h('es-tips', {
+                      props: { contents: this.contents[i] }
+                    })
+                  );
+                }
+              } else {
+                if (this.before) {
+                  doms.unshift(
+                    h('es-tips', {
+                      props: { ...this.contents[i] }
+                    })
+                  );
+                } else {
+                  i = doms.length;
+                  doms.push(
+                    h('es-tips', {
+                      props: { ...this.contents[i] }
+                    })
+                  );
+                }
+              }
+              break;
+          }
+        }
+      }
+      if (this.$slots.append) {
+        if (i > 0) {
+          doms.splice(i, 0, this.$slots.append);
+        } else {
+          doms.push(this.$slots.append);
+        }
+      }
+      if (this.plain) {
+        doms.push('：');
+      }
+      return h(
+        'span',
+        {
+          class: { 'es-label': true, 'es-is-required': this.isRequired },
+          on: { click: this.handleClick }
+        },
+        doms
+      );
+    } else {
+      return '';
+    }
+  }
+};
+</script>