@lx-frontend/wrap-element-ui 1.0.1-beta.2 → 1.0.1-beta.4

package/src/components/Ellipsis/index.vue

@@ -1,119 +1,119 @@
-<template>
-  <div class="ellipsis-popover">
-    <ElPopover
-      :disabled="showPopover === 'off' || (showPopover !== 'always' && !isOverflow)"
-      :popper-class="popoverName"
-      placement="top-start"
-      trigger="hover"
-    >
-      <div class="popover-content">
-        <slot name="popover">
-          <div v-for="(item, index) in contentArr" :key="getKey(item, index)">{{ item }}</div>
-        </slot>
-      </div>
-      <div slot="reference">
-        <div v-for="(item, index) in contentArr" :key="getKey(item, index)">
-          <MultilineEllipsis
-            :content="item"
-            :fontSize="fontSize"
-            :color="color"
-            :lineCount="lineCount"
-            :iconName="iconName"
-            :showIconObj="{
-              isShowIcon: showIconObj.isShowIcon,
-              length: showIconObj.length,
-            }"
-            :overCountTip="{
-              index: index + 1,
-              length: contentArr.length,
-            }"
-            :isOverflow.sync="overflowArr[index]">
-          </MultilineEllipsis>
-        </div>
-      </div>
-    </ElPopover>
-  </div>
-</template>
-
-<script>
-import MultilineEllipsis from './MultilineEllipsis.vue'
-
-export default {
-  name: 'Ellipsis',
-  components: {
-    MultilineEllipsis
-  },
-  props: {
-    fontSize: {
-      type: Number,
-      default: 12
-    },
-    color: {
-      type: String,
-      default: '#000000'
-    },
-    lineCount: {
-      type: Number,
-      default: 1
-    },
-    iconName: {
-      type: String,
-      default: 'el-icon-arrow-down'
-    },
-    overCountTip: {
-      type: Object
-    },
-    showIconObj: {
-      type: Object,
-      default: () => {
-        return {
-          isShowIcon: false,
-          length: 0
-        }
-      },
-    },
-    content: {
-      type: [String, Array],
-      default: ''
-    },
-    popoverName: String,
-    showPopover: {
-      type: String,
-      default: 'auto' // 可选值 auto, always, off
-    }
-  },
-  data () {
-    return {
-      overflowArr: []
-    }
-  },
-  computed: {
-    contentArr () {
-      return typeof (this.content) === 'string' ? [this.content] : [...this.content]
-    },
-    isOverflow () {
-      return this.overflowArr.includes(true)
-    }
-  },
-  watch: {
-    contentArr (val) {
-      this.overflowArr.length = val.length
-    }
-  },
-  methods: {
-    getKey (item, index) {
-      return btoa(escape(`${item}_${index}`))
-    }
-  }
-}
-</script>
-
-<style lang="less">
-  .ellipsis-popover {
-    width: 100%;
-  }
-
-  .popover-content {
-    padding: 18px 20px;
-  }
-</style>
+<template>
+  <div class="ellipsis-popover">
+    <ElPopover
+      :disabled="showPopover === 'off' || (showPopover !== 'always' && !isOverflow)"
+      :popper-class="popoverName"
+      placement="top-start"
+      trigger="hover"
+    >
+      <div class="popover-content">
+        <slot name="popover">
+          <div v-for="(item, index) in contentArr" :key="getKey(item, index)">{{ item }}</div>
+        </slot>
+      </div>
+      <div slot="reference">
+        <div v-for="(item, index) in contentArr" :key="getKey(item, index)">
+          <MultilineEllipsis
+            :content="item"
+            :fontSize="fontSize"
+            :color="color"
+            :lineCount="lineCount"
+            :iconName="iconName"
+            :showIconObj="{
+              isShowIcon: showIconObj.isShowIcon,
+              length: showIconObj.length,
+            }"
+            :overCountTip="{
+              index: index + 1,
+              length: contentArr.length,
+            }"
+            :isOverflow.sync="overflowArr[index]">
+          </MultilineEllipsis>
+        </div>
+      </div>
+    </ElPopover>
+  </div>
+</template>
+
+<script>
+import MultilineEllipsis from './MultilineEllipsis.vue'
+
+export default {
+  name: 'Ellipsis',
+  components: {
+    MultilineEllipsis
+  },
+  props: {
+    fontSize: {
+      type: Number,
+      default: 12
+    },
+    color: {
+      type: String,
+      default: '#000000'
+    },
+    lineCount: {
+      type: Number,
+      default: 1
+    },
+    iconName: {
+      type: String,
+      default: 'el-icon-arrow-down'
+    },
+    overCountTip: {
+      type: Object
+    },
+    showIconObj: {
+      type: Object,
+      default: () => {
+        return {
+          isShowIcon: false,
+          length: 0
+        }
+      },
+    },
+    content: {
+      type: [String, Array],
+      default: ''
+    },
+    popoverName: String,
+    showPopover: {
+      type: String,
+      default: 'auto' // 可选值 auto, always, off
+    }
+  },
+  data () {
+    return {
+      overflowArr: []
+    }
+  },
+  computed: {
+    contentArr () {
+      return typeof (this.content) === 'string' ? [this.content] : [...this.content]
+    },
+    isOverflow () {
+      return this.overflowArr.includes(true)
+    }
+  },
+  watch: {
+    contentArr (val) {
+      this.overflowArr.length = val.length
+    }
+  },
+  methods: {
+    getKey (item, index) {
+      return btoa(escape(`${item}_${index}`))
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .ellipsis-popover {
+    width: 100%;
+  }
+
+  .popover-content {
+    padding: 18px 20px;
+  }
+</style>