vue2-client 1.15.86 → 1.15.88

package/src/components/TableSetting/TableSetting.vue

@@ -1,143 +1,143 @@
-<template>
-  <a-popover placement="bottomRight" trigger="click">
-    <template slot="content">
-      <a-tree
-        class="draggable-tree"
-        :show-icon="true"
-        v-model="checkedKeys"
-        checkable
-        :replaceFields="replaceFields"
-        draggable
-        :tree-data="currentValue"
-        @drop="onDrop"
-      />
-    </template>
-    <template slot="title">
-      <a-checkbox :indeterminate="indeterminate" :checked="checkAll" @change="onCheckAllChange">
-        列展示/排序
-        <a-tooltip>
-          <template slot="title">
-            列排序需拖动名称
-          </template>
-          <a-icon type="question-circle" />
-        </a-tooltip>
-      </a-checkbox>
-    </template>
-    <a-button>
-      <a-icon :style="iconStyle" type="setting" />
-    </a-button>
-  </a-popover>
-</template>
-
-<script>
-import Ellipsis from '@vue2-client/components/Ellipsis'
-
-export default {
-  name: 'TableSetting',
-  props: {
-    value: {
-      type: Array,
-      required: true
-    }
-  },
-  components: {
-    Ellipsis
-  },
-  data () {
-    return {
-      // 图标样式
-      iconStyle: {
-        position: 'relative',
-        top: '1px'
-      },
-      allKey: [],
-      indeterminate: true,
-      checkAll: false,
-      currentValue: [],
-      checkedKeys: [],
-      replaceFields: { children: 'children', title: 'currentTitle', key: 'dataIndex', slot: 'tsSlots' }
-    }
-  },
-  mounted () {
-    this.currentValue = this.value
-    this.currentValue.forEach(column => {
-      this.allKey.push(column.dataIndex)
-      column.currentTitle = <ellipsis length={16} tooltip>{column.title}</ellipsis>
-      column.width2 = column.width
-      column.ellipsis2 = column.ellipsis
-      if (column.width !== 0 || !column.ellipsis) {
-        this.checkedKeys.push(column.dataIndex)
-      }
-      column.switcherIcon = <a-icon type="pic-left" />
-    })
-  },
-  watch: {
-    checkedKeys (cur, last) {
-      const checked = cur.filter(function (v) { return last.indexOf(v) === -1 })
-      const canceled = last.filter(function (v) { return cur.indexOf(v) === -1 })
-      this.currentValue.forEach(column => {
-        if (checked.length > 0) {
-          if (checked.indexOf(column.dataIndex) > -1) {
-            this.$set(column, 'width', column.width2)
-            this.$set(column, 'ellipsis', column.ellipsis2)
-          }
-        } else if (canceled.length > 0) {
-          if (canceled.indexOf(column.dataIndex) > -1) {
-            this.$set(column, 'width', 0)
-            this.$set(column, 'ellipsis', true)
-          }
-        }
-      })
-      this.indeterminate = !!cur.length && cur.length < this.allKey.length
-      this.checkAll = cur.length === this.allKey.length
-      this.$emit('input', this.currentValue)
-    }
-  },
-  methods: {
-    onCheckAllChange (e) {
-      Object.assign(this, {
-        checkedKeys: e.target.checked ? this.allKey : [],
-        indeterminate: false,
-        checkAll: e.target.checked
-      })
-    },
-    onDrop (info) {
-      const dropKey = info.node.eventKey
-      const dragKey = info.dragNode.eventKey
-      const dropPos = info.node.pos.split('-')
-      const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1])
-      const loop = (data, key, callback) => {
-        data.forEach((item, index, arr) => {
-          if (item.dataIndex === key) {
-            return callback(item, index, arr)
-          }
-          if (item.children) {
-            return loop(item.children, key, callback)
-          }
-        })
-      }
-      const data = [...this.value]
-
-      // Find dragObject
-      let dragObj
-      loop(data, dragKey, (item, index, arr) => {
-        arr.splice(index, 1)
-        dragObj = item
-      })
-      let ar
-      let i
-      loop(data, dropKey, (item, index, arr) => {
-        ar = arr
-        i = index
-      })
-      if (dropPosition === -1) {
-        ar.splice(i, 0, dragObj)
-      } else {
-        ar.splice(i + 1, 0, dragObj)
-      }
-      this.$emit('input', data)
-      this.currentValue = data
-    }
-  }
-}
-</script>
+<template>
+  <a-popover placement="bottomRight" trigger="click">
+    <template slot="content">
+      <a-tree
+        class="draggable-tree"
+        :show-icon="true"
+        v-model="checkedKeys"
+        checkable
+        :replaceFields="replaceFields"
+        draggable
+        :tree-data="currentValue"
+        @drop="onDrop"
+      />
+    </template>
+    <template slot="title">
+      <a-checkbox :indeterminate="indeterminate" :checked="checkAll" @change="onCheckAllChange">
+        列展示/排序
+        <a-tooltip>
+          <template slot="title">
+            列排序需拖动名称
+          </template>
+          <a-icon type="question-circle" />
+        </a-tooltip>
+      </a-checkbox>
+    </template>
+    <a-button>
+      <a-icon :style="iconStyle" type="setting" />
+    </a-button>
+  </a-popover>
+</template>
+
+<script>
+import Ellipsis from '@vue2-client/components/Ellipsis'
+
+export default {
+  name: 'TableSetting',
+  props: {
+    value: {
+      type: Array,
+      required: true
+    }
+  },
+  components: {
+    Ellipsis
+  },
+  data () {
+    return {
+      // 图标样式
+      iconStyle: {
+        position: 'relative',
+        top: '1px'
+      },
+      allKey: [],
+      indeterminate: true,
+      checkAll: false,
+      currentValue: [],
+      checkedKeys: [],
+      replaceFields: { children: 'children', title: 'currentTitle', key: 'dataIndex', slot: 'tsSlots' }
+    }
+  },
+  mounted () {
+    this.currentValue = this.value
+    this.currentValue.forEach(column => {
+      this.allKey.push(column.dataIndex)
+      column.currentTitle = <ellipsis length={16} tooltip>{column.title}</ellipsis>
+      column.width2 = column.width
+      column.ellipsis2 = column.ellipsis
+      if (column.width !== 0 || !column.ellipsis) {
+        this.checkedKeys.push(column.dataIndex)
+      }
+      column.switcherIcon = <a-icon type="pic-left" />
+    })
+  },
+  watch: {
+    checkedKeys (cur, last) {
+      const checked = cur.filter(function (v) { return last.indexOf(v) === -1 })
+      const canceled = last.filter(function (v) { return cur.indexOf(v) === -1 })
+      this.currentValue.forEach(column => {
+        if (checked.length > 0) {
+          if (checked.indexOf(column.dataIndex) > -1) {
+            this.$set(column, 'width', column.width2)
+            this.$set(column, 'ellipsis', column.ellipsis2)
+          }
+        } else if (canceled.length > 0) {
+          if (canceled.indexOf(column.dataIndex) > -1) {
+            this.$set(column, 'width', 0)
+            this.$set(column, 'ellipsis', true)
+          }
+        }
+      })
+      this.indeterminate = !!cur.length && cur.length < this.allKey.length
+      this.checkAll = cur.length === this.allKey.length
+      this.$emit('input', this.currentValue)
+    }
+  },
+  methods: {
+    onCheckAllChange (e) {
+      Object.assign(this, {
+        checkedKeys: e.target.checked ? this.allKey : [],
+        indeterminate: false,
+        checkAll: e.target.checked
+      })
+    },
+    onDrop (info) {
+      const dropKey = info.node.eventKey
+      const dragKey = info.dragNode.eventKey
+      const dropPos = info.node.pos.split('-')
+      const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1])
+      const loop = (data, key, callback) => {
+        data.forEach((item, index, arr) => {
+          if (item.dataIndex === key) {
+            return callback(item, index, arr)
+          }
+          if (item.children) {
+            return loop(item.children, key, callback)
+          }
+        })
+      }
+      const data = [...this.value]
+
+      // Find dragObject
+      let dragObj
+      loop(data, dragKey, (item, index, arr) => {
+        arr.splice(index, 1)
+        dragObj = item
+      })
+      let ar
+      let i
+      loop(data, dropKey, (item, index, arr) => {
+        ar = arr
+        i = index
+      })
+      if (dropPosition === -1) {
+        ar.splice(i, 0, dragObj)
+      } else {
+        ar.splice(i + 1, 0, dragObj)
+      }
+      this.$emit('input', data)
+      this.currentValue = data
+    }
+  }
+}
+</script>

package/src/components/TableSetting/index.js

@@ -1,3 +1,3 @@
-import TableSetting from './TableSetting'
-
-export default TableSetting
+import TableSetting from './TableSetting'
+
+export default TableSetting

package/src/components/Trend/Trend.vue

@@ -1,41 +1,41 @@
-<template>
-  <div :class="[prefixCls, reverseColor && 'reverse-color' ]">
-    <span>
-      <slot name="term"></slot>
-      <span class="item-text">
-        <slot></slot>
-      </span>
-    </span>
-    <span :class="[flag]"><a-icon :type="`caret-${flag}`"/></span>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Trend',
-  props: {
-    prefixCls: {
-      type: String,
-      default: 'ant-pro-trend'
-    },
-    /**
-       * 上升下降标识：up|down
-       */
-    flag: {
-      type: String,
-      required: true
-    },
-    /**
-       * 颜色反转
-       */
-    reverseColor: {
-      type: Boolean,
-      default: false
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  @import "index";
-</style>
+<template>
+  <div :class="[prefixCls, reverseColor && 'reverse-color' ]">
+    <span>
+      <slot name="term"></slot>
+      <span class="item-text">
+        <slot></slot>
+      </span>
+    </span>
+    <span :class="[flag]"><a-icon :type="`caret-${flag}`"/></span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Trend',
+  props: {
+    prefixCls: {
+      type: String,
+      default: 'ant-pro-trend'
+    },
+    /**
+       * 上升下降标识：up|down
+       */
+    flag: {
+      type: String,
+      required: true
+    },
+    /**
+       * 颜色反转
+       */
+    reverseColor: {
+      type: Boolean,
+      default: false
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  @import "index";
+</style>

package/src/components/Trend/index.js

@@ -1,3 +1,3 @@
-import Trend from './Trend.vue'
-
-export default Trend
+import Trend from './Trend.vue'
+
+export default Trend

package/src/components/Trend/index.less

@@ -1,42 +1,42 @@
-@import "../index";
-
-@trend-prefix-cls: ~"@{ant-pro-prefix}-trend";
-
-.@{trend-prefix-cls} {
-  display: inline-block;
-  font-size: @font-size-base;
-  line-height: 22px;
-
-  .up,
-  .down {
-    margin-left: 4px;
-    position: relative;
-    top: 1px;
-
-    i {
-      font-size: 12px;
-      transform: scale(0.83);
-    }
-  }
-
-  .item-text {
-    display: inline-block;
-    margin-left: 8px;
-    color: rgba(0,0,0,.85);
-  }
-
-  .up {
-    color: @red-6;
-  }
-  .down {
-    color: @green-6;
-    top: -1px;
-  }
-
-  &.reverse-color .up {
-    color: @green-6;
-  }
-  &.reverse-color .down {
-    color: @red-6;
-  }
+@import "../index";
+
+@trend-prefix-cls: ~"@{ant-pro-prefix}-trend";
+
+.@{trend-prefix-cls} {
+  display: inline-block;
+  font-size: @font-size-base;
+  line-height: 22px;
+
+  .up,
+  .down {
+    margin-left: 4px;
+    position: relative;
+    top: 1px;
+
+    i {
+      font-size: 12px;
+      transform: scale(0.83);
+    }
+  }
+
+  .item-text {
+    display: inline-block;
+    margin-left: 8px;
+    color: rgba(0,0,0,.85);
+  }
+
+  .up {
+    color: @red-6;
+  }
+  .down {
+    color: @green-6;
+    top: -1px;
+  }
+
+  &.reverse-color .up {
+    color: @green-6;
+  }
+  &.reverse-color .down {
+    color: @red-6;
+  }
 }

package/src/components/Trend/index.md

@@ -1,45 +1,45 @@
-# Trend 趋势标记
-
-趋势符号，标记上升和下降趋势。通常用绿色代表“好”，红色代表“不好”，股票涨跌场景除外。
-
-
-
-引用方式：
-
-```javascript
-import Trend from '@vue2-client/components/Trend'
-
-export default {
-    components: {
-        Trend
-    }
-}
-```
-
-
-
-## 代码演示  [demo](https://pro.loacg.com/test/home)
-
-```html
-<trend flag="up">5%</trend>
-```
-或
-```html
-<trend flag="up">
-    <span slot="term">工资</span>
-    5%
-</trend>
-```
-或
-```html
-<trend flag="up" term="工资">5%</trend>
-```
-
-
-## API
-
-| 参数           | 说明         | 类型      | 默认值    |
-|--------------|------------|---------|--------|
-| flag         | 上升下降标识：`up | down`   | string | - |
-| reverseColor | 颜色反转       | Boolean | false  |
-
+# Trend 趋势标记
+
+趋势符号，标记上升和下降趋势。通常用绿色代表“好”，红色代表“不好”，股票涨跌场景除外。
+
+
+
+引用方式：
+
+```javascript
+import Trend from '@vue2-client/components/Trend'
+
+export default {
+    components: {
+        Trend
+    }
+}
+```
+
+
+
+## 代码演示  [demo](https://pro.loacg.com/test/home)
+
+```html
+<trend flag="up">5%</trend>
+```
+或
+```html
+<trend flag="up">
+    <span slot="term">工资</span>
+    5%
+</trend>
+```
+或
+```html
+<trend flag="up" term="工资">5%</trend>
+```
+
+
+## API
+
+| 参数           | 说明         | 类型      | 默认值    |
+|--------------|------------|---------|--------|
+| flag         | 上升下降标识：`up | down`   | string | - |
+| reverseColor | 颜色反转       | Boolean | false  |
+

package/src/components/_util/util.js

@@ -1,46 +1,46 @@
-/**
- * components util
- */
-
-/**
- * 清理空值，对象
- * @param children
- * @returns {*[]}
- */
-export function filterEmpty (children = []) {
-  return children.filter(c => c.tag || (c.text && c.text.trim() !== ''))
-}
-
-/**
- * 获取字符串长度，英文字符 长度1，中文字符长度2
- * @param {*} str
- */
-export const getStrFullLength = (str = '') =>
-  str.split('').reduce((pre, cur) => {
-    const charCode = cur.charCodeAt(0)
-    if (charCode >= 0 && charCode <= 128) {
-      return pre + 1
-    }
-    return pre + 2
-  }, 0)
-
-/**
- * 截取字符串，根据 maxLength 截取后返回
- * @param {*} str
- * @param {*} maxLength
- */
-export const cutStrByFullLength = (str = '', maxLength) => {
-  let showLength = 0
-  return str.split('').reduce((pre, cur) => {
-    const charCode = cur.charCodeAt(0)
-    if (charCode >= 0 && charCode <= 128) {
-      showLength += 1
-    } else {
-      showLength += 2
-    }
-    if (showLength <= maxLength) {
-      return pre + cur
-    }
-    return pre
-  }, '')
-}
+/**
+ * components util
+ */
+
+/**
+ * 清理空值，对象
+ * @param children
+ * @returns {*[]}
+ */
+export function filterEmpty (children = []) {
+  return children.filter(c => c.tag || (c.text && c.text.trim() !== ''))
+}
+
+/**
+ * 获取字符串长度，英文字符 长度1，中文字符长度2
+ * @param {*} str
+ */
+export const getStrFullLength = (str = '') =>
+  str.split('').reduce((pre, cur) => {
+    const charCode = cur.charCodeAt(0)
+    if (charCode >= 0 && charCode <= 128) {
+      return pre + 1
+    }
+    return pre + 2
+  }, 0)
+
+/**
+ * 截取字符串，根据 maxLength 截取后返回
+ * @param {*} str
+ * @param {*} maxLength
+ */
+export const cutStrByFullLength = (str = '', maxLength) => {
+  let showLength = 0
+  return str.split('').reduce((pre, cur) => {
+    const charCode = cur.charCodeAt(0)
+    if (charCode >= 0 && charCode <= 128) {
+      showLength += 1
+    } else {
+      showLength += 2
+    }
+    if (showLength <= maxLength) {
+      return pre + cur
+    }
+    return pre
+  }, '')
+}