n20-common-lib 1.2.43 → 1.3.0

package/src/components/Upload/index.vue

@@ -1,242 +1,246 @@
-<template>
-  <el-upload
-    ref="upload"
-    :action="action"
-    :headers="headers"
-    :accept="accept"
-    :multiple="false"
-    :file-list="fileList"
-    :show-file-list="false"
-    v-bind="$attrs"
-    :on-success="successFn"
-    :on-error="errorFn"
-    :on-progress="progressFn"
-    :before-upload="beforeUploadFn"
-    v-on="$listeners"
-  >
-    <template slot="trigger">
-      <slot name="trigger">
-        <el-input
-          :value="fileNameC"
-          :placeholder="placeholder"
-          readonly
-          :disabled="$attrs.disabled"
-        >
-          <template slot="suffix">
-            <i
-              v-if="fileNameC && showClear"
-              class="el-input__icon upload-clear el-icon-close"
-              style="pointer-events: all"
-              @click.stop="clearFile"
-            ></i>
-            <i v-else class="el-input__icon n20-icon-shangchuan"></i>
-          </template>
-        </el-input>
-      </slot>
-    </template>
-    <template slot="tip">
-      <slot name="tip"></slot>
-    </template>
-    <el-dialog :visible.sync="progressV" title="提示" append-to-body>
-      <p v-if="!percentType">系统处理中，请稍等......</p>
-      <p v-else>{{ percentMsg }}</p>
-      <el-progress class="m-b" :percentage="percent" :status="percentType" />
-    </el-dialog>
-  </el-upload>
-</template>
-
-<script>
-export default {
-  name: 'Upload',
-  props: {
-    fileName: {
-      type: String,
-      default: ''
-    },
-    fileUrl: {
-      type: String,
-      default: ''
-    },
-    placeholder: {
-      type: String,
-      default: '请选择文件'
-    },
-    msgType: {
-      type: String,
-      default: 'dialog'
-    },
-    action: {
-      type: String,
-      default: '/bems/1.0/attach'
-    },
-    headers: {
-      type: Object,
-      default: () => ({
-        token: window.sessionStorage.getItem('token') || 'main-token'
-      })
-    },
-    size: {
-      type: [String, Number],
-      default: undefined
-    },
-    accept: {
-      type: String,
-      default: undefined
-    },
-    onRemove: {
-      type: Function,
-      default: undefined
-    },
-    onProgress: {
-      type: Function,
-      default: undefined
-    },
-    onSuccess: {
-      type: Function,
-      default: undefined
-    },
-    onError: {
-      type: Function,
-      default: undefined
-    },
-    beforeUpload: {
-      type: Function,
-      default: undefined
-    },
-    showClear: {
-      type: Boolean,
-      default: true
-    }
-  },
-  data() {
-    return {
-      fileList: [],
-      percent: 0,
-      percentMsg: '',
-      progressV: false,
-      percentType: undefined
-    }
-  },
-  computed: {
-    fileNameC: {
-      get() {
-        return this.fileName
-      },
-      set(v) {
-        this.$emit('update:fileName', v)
-      }
-    },
-    fileUrlC: {
-      get() {
-        return this.fileUrl
-      },
-      set(v) {
-        this.$emit('update:fileUrl', v)
-      }
-    }
-  },
-  methods: {
-    clearFile() {
-      if (this.onRemove) {
-        this.onRemove(this.fileList[0], this.fileList)
-      } else {
-        this.fileNameC = ''
-        this.fileUrlC = ''
-        this.fileList.pop()
-        console.log('删除上传')
-      }
-    },
-    beforeUploadFn(file) {
-      let size = this.size
-      let sizeNum
-
-      if (size) {
-        if (/kb/i.test(size)) {
-          sizeNum = parseFloat(size) * 1024
-        } else if (/mb/i.test(size)) {
-          sizeNum = parseFloat(size) * 1024 * 1024
-        } else {
-          sizeNum = parseFloat(size)
-        }
-        if (file.size > sizeNum) {
-          this.$message.error('文件大小不能超过 ' + size + ' ！')
-          return false
-        }
-      }
-
-      let accept = this.accept
-      if (accept) {
-        let [ftB = '', ftA = ''] = file.type.split('/')
-        ftB = ftB + '/*'
-        ftA = file.name.match(/\.[^.]+$/)?.[0] || '.' + ftA
-        if (!(accept.includes(ftB) || accept.includes(ftA))) {
-          this.$message.error('文件格式错误 ！')
-          return false
-        }
-      }
-
-      if (this.msgType === 'dialog') {
-        this.percent = 0
-        this.percentType = undefined
-        this.progressV = true
-      }
-
-      if (this.beforeUpload) {
-        return this.beforeUpload(file)
-      } else {
-        return
-      }
-    },
-    progressFn(event, file, fileList) {
-      if (this.onProgress) {
-        this.onProgress(event, file, fileList)
-      }
-
-      if (this.msgType === 'dialog') {
-        this.percent = event.percent <= 99 ? Math.round(event.percent) : 99
-      }
-    },
-    successFn(response, file, fileList) {
-      if (this.onSuccess) {
-        this.onSuccess(response, file, fileList)
-      } else {
-        this.fileNameC = file.name
-        this.fileUrlC = response.data
-        this.fileList = [file]
-      }
-
-      if (this.msgType === 'dialog') {
-        this.percent = 100
-        this.percentType = 'success'
-        this.percentMsg = response.msg || '上传成功！'
-      } else if (this.msgType === 'message') {
-        if (!this.onSuccess) {
-          this.$message({
-            type: 'success',
-            message: response.msg,
-            showClose: true
-          })
-        }
-      }
-    },
-    errorFn(err, file, fileList) {
-      if (this.onError) {
-        this.onError(err, file, fileList)
-      }
-
-      if (this.msgType === 'dialog') {
-        this.percentType = 'exception'
-        this.percentMsg = err?.msg || '上传失败！'
-      } else if (this.msgType === 'message') {
-        if (!this.onError) {
-          this.$message({
-            type: 'error',
-            message: err?.msg || '上传失败',
-            showClose: true
-          })
-        }
-      }
-    }
-  }
-}
-</script>
+<template>
+  <el-upload
+    ref="upload"
+    :action="action"
+    :headers="headers"
+    :accept="accept"
+    :multiple="multiple"
+    :file-list="fileList"
+    :show-file-list="false"
+    v-bind="$attrs"
+    :on-success="successFn"
+    :on-error="errorFn"
+    :on-progress="progressFn"
+    :before-upload="beforeUploadFn"
+    v-on="$listeners"
+  >
+    <template slot="trigger">
+      <slot name="trigger">
+        <el-input
+          :value="fileNameC"
+          :placeholder="placeholder"
+          readonly
+          :disabled="$attrs.disabled"
+        >
+          <template slot="suffix">
+            <i
+              v-if="fileNameC && showClear"
+              class="el-input__icon upload-clear el-icon-close"
+              style="pointer-events: all"
+              @click.stop="clearFile"
+            ></i>
+            <i v-else class="el-input__icon n20-icon-shangchuan"></i>
+          </template>
+        </el-input>
+      </slot>
+    </template>
+    <template slot="tip">
+      <slot name="tip"></slot>
+    </template>
+    <el-dialog :visible.sync="progressV" title="提示" append-to-body>
+      <p v-if="!percentType">系统处理中，请稍等......</p>
+      <p v-else>{{ percentMsg }}</p>
+      <el-progress class="m-b" :percentage="percent" :status="percentType" />
+    </el-dialog>
+  </el-upload>
+</template>
+
+<script>
+export default {
+  name: 'Upload',
+  props: {
+    fileName: {
+      type: String,
+      default: ''
+    },
+    fileUrl: {
+      type: String,
+      default: ''
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    placeholder: {
+      type: String,
+      default: '请选择'
+    },
+    msgType: {
+      type: String,
+      default: 'dialog'
+    },
+    action: {
+      type: String,
+      default: '/bems/1.0/attach'
+    },
+    headers: {
+      type: Object,
+      default: () => ({
+        token: window.sessionStorage.getItem('token') || 'main-token'
+      })
+    },
+    size: {
+      type: [String, Number],
+      default: undefined
+    },
+    accept: {
+      type: String,
+      default: undefined
+    },
+    onRemove: {
+      type: Function,
+      default: undefined
+    },
+    onProgress: {
+      type: Function,
+      default: undefined
+    },
+    onSuccess: {
+      type: Function,
+      default: undefined
+    },
+    onError: {
+      type: Function,
+      default: undefined
+    },
+    beforeUpload: {
+      type: Function,
+      default: undefined
+    },
+    showClear: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data() {
+    return {
+      fileList: [],
+      percent: 0,
+      percentMsg: '',
+      progressV: false,
+      percentType: undefined
+    }
+  },
+  computed: {
+    fileNameC: {
+      get() {
+        return this.fileName
+      },
+      set(v) {
+        this.$emit('update:fileName', v)
+      }
+    },
+    fileUrlC: {
+      get() {
+        return this.fileUrl
+      },
+      set(v) {
+        this.$emit('update:fileUrl', v)
+      }
+    }
+  },
+  methods: {
+    clearFile() {
+      if (this.onRemove) {
+        this.onRemove(this.fileList[0], this.fileList)
+      } else {
+        this.fileNameC = ''
+        this.fileUrlC = ''
+        this.fileList.pop()
+        console.log('删除上传')
+      }
+    },
+    beforeUploadFn(file) {
+      let size = this.size
+      let sizeNum
+
+      if (size) {
+        if (/kb/i.test(size)) {
+          sizeNum = parseFloat(size) * 1024
+        } else if (/mb/i.test(size)) {
+          sizeNum = parseFloat(size) * 1024 * 1024
+        } else {
+          sizeNum = parseFloat(size)
+        }
+        if (file.size > sizeNum) {
+          this.$message.error('文件大小不能超过 ' + size + ' ！')
+          return false
+        }
+      }
+
+      let accept = this.accept
+      if (accept) {
+        let [ftB = '', ftA = ''] = file.type.split('/')
+        ftB = ftB + '/*'
+        ftA = file.name.match(/\.[^.]+$/)?.[0] || '.' + ftA
+        if (!(accept.includes(ftB) || accept.includes(ftA))) {
+          this.$message.error('文件格式错误 ！')
+          return false
+        }
+      }
+
+      if (this.msgType === 'dialog') {
+        this.percent = 0
+        this.percentType = undefined
+        this.progressV = true
+      }
+
+      if (this.beforeUpload) {
+        return this.beforeUpload(file)
+      } else {
+        return
+      }
+    },
+    progressFn(event, file, fileList) {
+      if (this.onProgress) {
+        this.onProgress(event, file, fileList)
+      }
+
+      if (this.msgType === 'dialog') {
+        this.percent = event.percent <= 99 ? Math.round(event.percent) : 99
+      }
+    },
+    successFn(response, file, fileList) {
+      if (this.onSuccess) {
+        this.onSuccess(response, file, fileList)
+      } else {
+        this.fileNameC = file.name
+        this.fileUrlC = response.data
+        this.fileList = [file]
+      }
+
+      if (this.msgType === 'dialog') {
+        this.percent = 100
+        this.percentType = 'success'
+        this.percentMsg = response.msg || '上传成功！'
+      } else if (this.msgType === 'message') {
+        if (!this.onSuccess) {
+          this.$message({
+            type: 'success',
+            message: response.msg,
+            showClose: true
+          })
+        }
+      }
+    },
+    errorFn(err, file, fileList) {
+      if (this.onError) {
+        this.onError(err, file, fileList)
+      }
+
+      if (this.msgType === 'dialog') {
+        this.percentType = 'exception'
+        this.percentMsg = err?.msg || '上传失败！'
+      } else if (this.msgType === 'message') {
+        if (!this.onError) {
+          this.$message({
+            type: 'error',
+            message: err?.msg || '上传失败',
+            showClose: true
+          })
+        }
+      }
+    }
+  }
+}
+</script>

package/src/components/WornPagination/index.vue

@@ -1,73 +1,73 @@
-<template>
-  <div class="flex-box flex-r">
-    <Pagination :page-obj="pageObj" @change="pageChange" />
-  </div>
-</template>
-
-<script>
-import Pagination from '../Pagination/index.vue'
-export default {
-  name: 'WornPagination',
-  components: {
-    Pagination
-  },
-  props: {
-    page: {
-      type: Number,
-      default: 1
-    },
-    pageSize: {
-      type: Number,
-      default: 20
-    },
-    total: {
-      type: Number,
-      default: 0
-    }
-  },
-  data() {
-    return {
-      pageObj: {
-        no: 1,
-        size: 20,
-        total: 0
-      }
-    }
-  },
-  watch: {
-    page(v) {
-      this.pageObj.no = v
-    },
-    pageSize(v) {
-      this.pageObj.size = v
-    },
-    total(v) {
-      this.pageObj.total = v
-    }
-  },
-  created() {
-    this.pageObj = {
-      no: this.page,
-      size: this.pageSize,
-      total: this.total
-    }
-  },
-  mounted() {
-    console.warn('WornPagination组件已废弃,未来版本将剔除,请使用Pagination组件')
-  },
-  methods: {
-    pageChange(v) {
-      if (v.no !== this.page) {
-        this.$emit('update:page', v.no)
-      }
-      if (v.size !== this.pageSize) {
-        this.$emit('update:pageSize', v.size)
-        // 为修复bug而写的bug
-        this.$nextTick(() => {
-          this.$emit('update:page', v.no)
-        })
-      }
-    }
-  }
-}
-</script>
+<template>
+  <div class="flex-box flex-r">
+    <Pagination :page-obj="pageObj" @change="pageChange" />
+  </div>
+</template>
+
+<script>
+import Pagination from '../Pagination/index.vue'
+export default {
+  name: 'WornPagination',
+  components: {
+    Pagination
+  },
+  props: {
+    page: {
+      type: Number,
+      default: 1
+    },
+    pageSize: {
+      type: Number,
+      default: 20
+    },
+    total: {
+      type: Number,
+      default: 0
+    }
+  },
+  data() {
+    return {
+      pageObj: {
+        no: 1,
+        size: 20,
+        total: 0
+      }
+    }
+  },
+  watch: {
+    page(v) {
+      this.pageObj.no = v
+    },
+    pageSize(v) {
+      this.pageObj.size = v
+    },
+    total(v) {
+      this.pageObj.total = v
+    }
+  },
+  created() {
+    this.pageObj = {
+      no: this.page,
+      size: this.pageSize,
+      total: this.total
+    }
+  },
+  mounted() {
+    console.warn('WornPagination组件已废弃,未来版本将剔除,请使用Pagination组件')
+  },
+  methods: {
+    pageChange(v) {
+      if (v.no !== this.page) {
+        this.$emit('update:page', v.no)
+      }
+      if (v.size !== this.pageSize) {
+        this.$emit('update:pageSize', v.size)
+        // 为修复bug而写的bug
+        this.$nextTick(() => {
+          this.$emit('update:page', v.no)
+        })
+      }
+    }
+  }
+}
+</script>

package/src/directives/VClickOutside/index.js

@@ -1,19 +1,19 @@
-const directive = {}
-
-directive.install = (Vue) => {
-  Vue.directive('click-outside', {
-    bind: function (el, binding, node) {
-      el.clickOutsideEvent = function (event) {
-        if (!(el === event.target || el.contains(event.target))) {
-          node.context[binding.expression](event)
-        }
-      }
-      document.body.addEventListener('click', el.clickOutsideEvent)
-    },
-    unbind: function (el) {
-      document.body.removeEventListener('click', el.clickOutsideEvent)
-    }
-  })
-}
-
-export default directive
+const directive = {}
+
+directive.install = (Vue) => {
+  Vue.directive('click-outside', {
+    bind: function (el, binding, node) {
+      el.clickOutsideEvent = function (event) {
+        if (!(el === event.target || el.contains(event.target))) {
+          node.context[binding.expression](event)
+        }
+      }
+      document.body.addEventListener('click', el.clickOutsideEvent)
+    },
+    unbind: function (el) {
+      document.body.removeEventListener('click', el.clickOutsideEvent)
+    }
+  })
+}
+
+export default directive