n20-common-lib 1.3.3 → 1.3.6

package/src/components/NstcG6Components/Form/UploadCustom/index.vue

@@ -1,506 +0,0 @@
-<template>
-  <div
-    :key="key"
-    :class="['upload-custom',{ 'is-multiple': multiple || valueClassification.img.length }]"
-    :style="{ width: `${_width}px` }"
-  >
-    <input
-      v-if="isChoosing"
-      ref="fileInput"
-      type="file"
-      :multiple="multiple"
-      @change="handleFileChange"
-    >
-    <el-button
-      v-if="!isView"
-      :loading="loading"
-      :icon="_icon"
-      :disabled="_disabled"
-      class="button-cancel"
-      @click="chooseFile"
-    >
-      <span>{{ text }}</span>
-    </el-button>
-
-    <template v-if="showFile">
-      <template v-if="!multiple && valueClassification.other.length">
-        <div
-          v-if="fileName"
-          class="upload-file-name"
-          :title="fileName"
-        >
-          {{ fileName }}
-        </div>
-        <el-button
-          v-if="fileName"
-          class="upload-file-delete"
-          type="text"
-          @click="handleClickFileBtn"
-        >
-          {{ fileBtnName }}
-        </el-button>
-      </template>
-      <template v-else>
-        <div class="upload-file-other">
-          <div
-            v-for="(item,index) in valueClassification.other"
-            :key="index"
-            class="upload-file-other-item"
-          >
-            <div
-              class="upload-file-name"
-              :title="item.fileName"
-            >
-              {{ item.fileName }}
-            </div>
-            <el-button
-              class="upload-file-other-delete"
-              type="text"
-              @click="handleClickFileBtn(item) "
-            >
-              {{ fileBtnName }}
-            </el-button>
-          </div>
-        </div>
-        <div class="upload-file-img">
-          <div
-            v-for="(item,index) in valueClassification.img"
-            :key="index"
-            class="upload-file-img-item"
-          >
-            <el-image
-              :src="item.fileUrl"
-              :preview-src-list="getPreviewSrcList(index)"
-            />
-            <img
-              v-if="!isView"
-              :src="closeImg"
-              alt="#"
-              @click="handleDelete(item)"
-            >
-          </div>
-        </div>
-      </template>
-    </template>
-  </div>
-</template>
-
-<script>
-import closeImg from './iconxitongshezhi-yichu.png'
-
-import request from '@/utils/request'
-// import OSS from 'ali-oss'
-
-export default {
-  name: 'UploadCustom',
-
-  inheritAttrs: false,
-
-  props: {
-    text: {
-      type: String,
-      default: function () {
-        return '请选择附件'
-      }
-    },
-
-    icon: {
-      type: String,
-      default: undefined
-    },
-
-    value: { // 值格式为单选{ fileName,fileUrl }/{ fileName,file },或者多选[{ fileName,fileUrl }]/[{ fileName,file }]
-      type: [Object, Array],
-      default: null
-    },
-
-    valueIsFileUrl: { // true时，值返回格式为{ fileName,fileUrl }；false时，值返回格式为{ fileName,file }（file为文件类型）
-      type: Boolean,
-      default: false
-    },
-
-    url: { // 上传到自定义服务器的url
-      type: String,
-      default: null
-    },
-
-    disabled: { // 是否禁用
-      type: Boolean,
-      default: false
-    },
-
-    showFile: { // 是否展示长传结果
-      type: Boolean,
-      default: true
-    },
-
-    validator: { // 上传前的验证，参数为typeCode（文件头前8位，用于检测文件真实格式）, raw（文件buffer对象）
-      type: Function,
-      default: null
-    },
-
-    beforeChooseFile: { // 选择文件前的前置函数
-      type: Function,
-      default: null
-    },
-
-    width: {
-      type: [String, Number],
-      default: undefined
-    },
-
-    max: { // 多选时，最大上传文件个数
-      type: Number,
-      default: 5
-    },
-
-    multiple: { // 是否支持多选
-      type: Boolean,
-      default: false
-    },
-
-    isView: { // 是否仅查看
-      type: Boolean,
-      default: false
-    },
-
-    storeAsPrefix: { // ali-oss上传路径前缀
-      type: String,
-      default: ''
-    }
-  },
-
-  data() {
-    return {
-      key: `UploadCustomID-${Math.random()
-        .toString(36)
-        .slice(2)}`,
-
-      loading: false,
-      isChoosing: false,
-      revokeObjectURL: [],
-      closeImg
-    }
-  },
-
-  computed: {
-    _value: {
-      get() {
-        return this.value
-      },
-      set(val) {
-        this.$emit('input', val)
-        this.$emit('change', val)
-      }
-    },
-
-    fileName() {
-      return !this.multiple && this._value && this._value.fileName
-        ? this._value.fileName
-        : ''
-    },
-
-    _width() {
-      return this.width ? (this.width + '').replace(/px/, '') : undefined
-    },
-
-    _icon() {
-      return this.icon ? this.icon : undefined
-    },
-
-    _disabled() {
-      return this.disabled || (Array.isArray(this._value) && this._value.length >= this.max)
-    },
-
-    valueClassification() {
-      const _value = this.multiple ? this._value : this._value ? [this._value] : []
-      const reg = /\.(png|jpg|gif|jpeg)$/
-
-      return _value.reduce((prev, file, index) => {
-        if (reg.test(file.fileName)) {
-          let fileUrl = ''
-
-          if (file.fileUrl) {
-            fileUrl = file.fileUrl
-          } else {
-            fileUrl = window.URL.createObjectURL(file.file)
-            this.revokeObjectURL.push(fileUrl)
-          }
-
-          prev.img.push({
-            fileUrl,
-            index,
-            ...file
-          })
-        } else {
-          prev.other.push({
-            ...file,
-            index
-          })
-        }
-
-        return prev
-      }, { img: [], other: [] })
-    },
-
-    getPreviewSrcList() {
-      return index => {
-        const imgUrls = this.valueClassification.img.map(item => item.fileUrl)
-
-        return imgUrls.slice(index).concat(imgUrls.slice(0, index))
-      }
-    },
-
-    fileBtnName() {
-      return this.isView ? '下载' : '删除'
-    }
-  },
-
-  beforeDestroy() {
-    this.revokeObjectURL.forEach(fileUrl => window.URL.revokeObjectURL(fileUrl))
-  },
-
-  methods: {
-    async chooseFile() {
-      try {
-        this.isChoosing = true
-        this.beforeChooseFile && await this.beforeChooseFile()
-
-        await this.$nextTick()
-
-        this.$refs.fileInput.click()
-      } catch (err) {
-        console.error(err)
-        // this.$$message(err)
-      }
-    },
-
-    async handleFileChange(e) {
-      this.loading = true
-      this.isChoosing = false
-
-      try {
-        const files = Array.from(e.target.files)
-
-        await this.fileMaxCheck(files)
-        await Promise.all(files.map(file => this.fileTypeCheck(file)))
-
-        const value = await Promise.all(files.map(file => this.singleFileUpload(file)))
-
-        this._value = this.multiple
-          ? [...this._value, ...value]
-          : value[0]
-      } catch (err) {
-        // this.$$message(err.reason || '上传失败')
-      }
-
-      this.loading = false
-    },
-
-    async singleFileUpload(file) {
-      try {
-        const fileName = file.name
-
-        if (this.valueIsFileUrl) {
-          let fileUrl = ''
-
-          if (this.url) {
-            const fd = new FormData()
-
-            fd.append('file', file)
-
-            fileUrl = await request.post(this.url, fd, {
-              headers: {
-                'Content-Type': 'multipart/form-data'
-              }
-            })
-          } else {
-            // const data = await request.post('/api/upload/auth') // 授权
-            // const client = new OSS({
-            //   endpoint: data.region,
-            //   accessKeyId: data.accessKeyId,
-            //   accessKeySecret: data.accessKeySecret,
-            //   stsToken: data.securityToken,
-            //   bucket: data.bucket
-            // })
-            //
-            // const _name = data.fileName + fileName.substring(fileName.lastIndexOf('.'), fileName.length)
-            //
-            // const storeAs = this.storeAsPrefix + new Date().getTime() + '/' + _name
-            // const { res } = await client.multipartUpload(storeAs, file, {
-            //   mime: 'application/octet-stream',
-            //   secure: true
-            // })
-            //
-            // fileUrl = res.requestUrls[0]
-            //
-            // if (fileUrl.indexOf('?') > 0) {
-            //   fileUrl = fileUrl.substring(0, fileUrl.indexOf('?'))
-            // }
-          }
-
-          return {
-            fileUrl,
-            fileName
-          }
-        }
-
-        return {
-          file,
-          fileName
-        }
-      } catch (err) {
-        return Promise.reject(err)
-      }
-    },
-
-    handleClickFileBtn(item) {
-      if (this.isView) {
-        window.open(item.fileUrl)
-      } else {
-        this.handleDelete(item)
-      }
-    },
-
-    handleDelete(item) {
-      if (this.multiple) {
-        this._value.splice(item.index, 1)
-      } else {
-        this._value = null
-      }
-    },
-
-    fileTypeCheck(raw) {
-      const _this = this
-
-      return new Promise((resolve, reject) => {
-        const reader = new FileReader()
-
-        reader.onload = async function(r) {
-          try {
-            const buffer = r.target.result
-            const dataview = new DataView(buffer)
-            const ints = new Uint16Array(buffer.byteLength)
-
-            for (let i = 0; i < 4; i++) {
-              ints[i] = dataview.getUint8(i)
-            }
-
-            const typeCode = ints
-              .reduce((acc, val) => acc + val.toString(16), '')
-              .slice(0, 8)
-              .toLowerCase()
-
-            if (typeof _this.validator === 'function') {
-              await _this.validator(typeCode, raw)
-            }
-
-            resolve()
-          } catch (err) {
-            reject(err)
-          }
-        }
-
-        reader.readAsArrayBuffer(raw)
-      })
-    },
-
-    fileMaxCheck(files) {
-      return new Promise((resolve, reject) => {
-        if (this.multiple && (files.length + this._value.length > this.max)) {
-          reject({ reason: `最多上传文件数：${this.max}` })
-        }
-
-        resolve()
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-    .upload-custom {
-        display: inline-flex;
-        align-items: center;
-        position: relative;
-        padding-right: 32px;
-        &.is-multiple {
-            display: inline-block;
-        }
-
-        .button-cancel {
-            flex: none;
-            padding: 0 15px 0 12px;
-            width: auto;
-            display: inline-flex;
-            align-items: center;
-            i {
-                margin-right: 6px;
-                font-size: 9px;
-            }
-        }
-
-        input {
-            display: none;
-        }
-
-        .upload-file {
-            &-name {
-                font-size: 14px;
-                padding-left: 10px;
-                flex: auto;
-                overflow: hidden;
-                white-space: nowrap;
-                text-overflow: ellipsis;
-            }
-
-            &-delete {
-                position: absolute;
-                top: 9px;
-                right: 0;
-            }
-
-            &-other {
-                display: flex;
-                flex-wrap: wrap;
-                margin-top: 5px;
-                &-item {
-                    flex: none;
-                    display: flex;
-                    align-items: center;
-                    margin-right: 40px;
-                    .upload-file-name {
-                        padding-left: 0;
-                        padding-right: 10px;
-                    }
-                }
-            }
-
-            &-img {
-                display: flex;
-                margin-top: 5px;
-                flex-wrap: wrap;
-                &-item {
-                    flex: none;
-                    margin-right: 10px;
-                    position: relative;
-                    .el-image {
-                        width: 72px;
-                        height: 72px;
-                        background-color: #fff;
-                        border-radius: 2px;
-                        border: #CFD8E6;
-                    }
-                    & > img {
-                        position: absolute;
-                        right: 0;
-                        top: 0;
-                        width: 16px;
-                        height: 16px;
-                        cursor: pointer;
-                    }
-                }
-            }
-        }
-    }
-</style>

package/src/components/NstcG6Components/Form/configs.js

@@ -1,191 +0,0 @@
-/**
- * [important] 请添加支持组件的类型的同时， 指定组件引入 和 对应组件默认状态值
- */
-
-// const DatepickerCustom = () => import('./DatepickerCustom')
-// const InputCustom = () => import('./InputCustom')
-// const IntervalinputCustom = () => import('./IntervalinputCustom')
-// const AutocompleteCustom = () => import('./AutocompleteCustom')
-// const SelectCustom = () => import('./SelectCustom')
-// const SelectindialogCustom = () => import('./SelectindialogCustom')
-// const UploadCustom = () => import('./UploadCustom')
-// const RadioCustom = () => import('./RadioCustom')
-// const CheckboxCustom = () => import('./CheckboxCustom')
-// const CascaderCustom = () => import('./CascaderCustom')
-// const TextCustom = () => import('./TextCustom')
-// const nstcuploadCustom = () => import('../Upload/src/main')
-// const FormItemTips = () => ('../FormCreate/component/FormItemTips')
-// const FormTooltips = () => ('../FormCreate/component/FormTooltips')
-// const nstcselecttreeCustom = () => import('../SelectTree/src/main')
-
-
-import DatepickerCustom from './DatepickerCustom'
-import InputCustom from './InputCustom'
-import IntervalinputCustom from './IntervalinputCustom'
-import AutocompleteCustom from './AutocompleteCustom'
-import SelectCustom from './SelectCustom'
-import SelectindialogCustom from './SelectindialogCustom'
-import UploadCustom from './UploadCustom'
-import RadioCustom from './RadioCustom'
-import CheckboxCustom from './CheckboxCustom'
-import CascaderCustom from './CascaderCustom'
-import TextCustom from './TextCustom'
-import nstcuploadCustom from '^/Upload/src/main'
-import nstcselecttreeCustom from '^/SelectTree/src/main'
-import nstcselecttreelistCustom from '^/SelectTreeList/src/main'
-import nstcfileuploadCustom from '^/FileUpload/src/main'
-
-// 特殊的业务组件
-import inputwithunitCustom from '^/Form/BusinessSpecific/InputWithUnit'
-import inputmultipleCustom from '^/Form/BusinessSpecific/InputMultiple'
-import selecttreedialogCustom from '^/Form/BusinessSpecific/SelectTreeDialog'
-import selectaccountCustom from '^/Form/SelectAccount'
-import selectcashflowCustom from '^/Form/SelectCashFlow'
-import selectsubjectCustom from '^/Form/SelectSubject'
-import payeePersonSelect from '^/Form/payeePersonSelect'
-import inputAndDialog from '^/Form/InputAndDialog'
-
-
-// 定义支持的类型
-export const SUPPORT_TYPE = [
-  'datepicker',
-  'input',
-  'intervalinput',
-  'autocomplete',
-  'select',
-  'selectindialog',
-  'upload',
-  'radio',
-  'checkbox',
-  'cascader',
-  'text',
-  'nstcupload',
-  'nstcselecttree',
-  'nstcselecttreelist',
-  'nstcfileupload',
-  'inputwithunit',
-  'inputmultiple',
-  'selecttreedialog',
-  'selectaccount',
-  'selectcashflow',
-  'selectsubject'
-]
-
-// 支持的类型对应的组件
-export const components = {
-  SelectindialogCustom, // loop
-  SelectCustom,
-  DatepickerCustom,
-  InputCustom,
-  IntervalinputCustom,
-  AutocompleteCustom,
-  UploadCustom,
-  RadioCustom,
-  CheckboxCustom,
-  CascaderCustom,
-  TextCustom,
-  nstcuploadCustom,
-  nstcselecttreeCustom,
-  nstcselecttreelistCustom,
-  nstcfileuploadCustom,
-  inputwithunitCustom,
-  inputmultipleCustom,
-  selecttreedialogCustom,
-  selectaccountCustom,
-  selectcashflowCustom,
-  selectsubjectCustom,
-  payeePersonSelect,
-  inputAndDialog
-}
-
-// 支持的类型对应的默认值
-export function getDefaultValue({ mold, multiple, type, default: def }) {
-  let _def
-  mold = mold.replace(/ /g, '')
-  switch (mold) {
-    case 'select':
-    case 'selectindialog':
-    case 'nstcBankBanchTree':
-    case 'selecttreedialog':
-      _def = {
-        value: isEmpty(def) ? multiple ? [] : null : def
-      }
-      break
-
-    case 'input':
-    case 'autocomplete':
-    case 'text':
-    case 'nstcselecttree':
-    case 'nstcselecttreelist':
-    case 'selectaccount':
-    case 'selectcashflow':
-    case 'selectsubject':
-      _def = {
-        value: isEmpty(def) ? '' : def
-      }
-      break
-
-    case 'upload':
-      _def = {
-        value: isEmpty(def)
-          ? multiple
-            ? []
-            : null
-          : multiple
-            ? [...def]
-            : def
-      }
-      break
-
-    case 'checkbox':
-    case 'cascader':
-    case 'intervalinput':
-    case 'nstcupload':
-    case 'nstcfileupload':
-    case 'inputwithunit':
-    case 'inputmultiple':
-      _def = {
-        value: isEmpty(def) ? [] : [...def]
-      }
-      break
-
-    case 'radio':
-      _def = {
-        value: isEmpty(def) ? null : def
-      }
-      break
-
-    case 'datewmqy':
-    case 'datepicker':
-      _def = {
-        value: type && type.includes('range')
-          ? isEmpty(def) ? [] : [...def]
-          : isEmpty(def) ? null : def
-      }
-      break
-
-    case 'switch':
-      _def = {
-        value: isEmpty(def) ? false : def
-      }
-      break
-
-    case 'querybutton':
-    case 'addbutton':
-    case 'otherbutton':
-      _def = null
-      break
-
-    default:
-      alert(`未匹配到符合该类型${mold}的功能,请联系开发人员`)
-      _def = null
-      break
-  }
-
-  return _def
-}
-
-export function isEmpty(def) {
-  return def === null || def === undefined
-}
-