@opentiny/vue-renderless 3.1.0-alpha.0

package/upload/index.js

@@ -0,0 +1,324 @@
+import { KEY_CODE } from '@opentiny/vue-renderless/common';
+export var isImage = function isImage(str) {
+  return str.indexOf('image') !== -1;
+};
+export var handleChange = function handleChange(api) {
+  return function (event) {
+    var files = event.target.files;
+    if (!files) {
+      return;
+    }
+    api.uploadFiles(files);
+  };
+};
+export var getFormData = function getFormData(_ref) {
+  var constants = _ref.constants,
+    state = _ref.state,
+    parent = _ref.parent,
+    props = _ref.props;
+  return function (_ref2) {
+    var formData = _ref2.formData,
+      file = _ref2.file,
+      type = _ref2.type;
+    formData.append(constants.EDM.FILENAME, file.name);
+    if (parent.edm.isCheckCode === true) {
+      formData.append(constants.EDM.ISCHECKCODE, 'Y');
+      formData.append(constants.EDM.CHECKCODE, file.hash);
+    } else {
+      formData.append(constants.EDM.ISCHECKCODE, 'N');
+    }
+    if (props.isFolder) {
+      formData.append('filePath', file.path);
+    }
+    var updateId = state.updateId || parent.edm.updateId;
+    if (type === constants.EDM.SINGLEUPLOAD) {
+      formData.append(constants.EDM.MULTIPART, file, props.isFolder ? file.path + file.name : file.name);
+      updateId && formData.append(constants.EDM.DOCID, updateId);
+    } else {
+      var docId = updateId || file.docId;
+      formData.append(constants.EDM.DOCID, docId);
+      formData.append(constants.EDM.FILESIZE, file.size);
+    }
+    if (updateId) {
+      formData.append('updateFile', true);
+      state.updateId = '';
+    }
+  };
+};
+export var uploadFiles = function uploadFiles(_ref3) {
+  var api = _ref3.api,
+    state = _ref3.state,
+    constants = _ref3.constants,
+    Modal = _ref3.Modal,
+    props = _ref3.props,
+    t = _ref3.t;
+  return function (files) {
+    if (props.limit && props.fileList.length + files.length > props.limit) {
+      props.onExceed && props.onExceed(files, props.fileList);
+      return;
+    }
+    var postFiles = Array.prototype.slice.call(files);
+    if (props.isFolder) {
+      postFiles = postFiles.filter(function (item) {
+        var folderAry = item.webkitRelativePath.split('/');
+        item.path = folderAry.slice(0, folderAry.length - 1).join('/') + '/';
+        if (folderAry.length >= 7) {
+          Modal.message({
+            message: "".concat(item.name).concat(t(constants.EDM.FOLDERKEY)),
+            status: 'warning'
+          });
+        }
+        return folderAry.length < 7;
+      });
+    }
+    if (!props.isFolder) {
+      if (!props.multiple) {
+        postFiles = postFiles.slice(0, 1);
+      }
+    }
+    if (postFiles.length === 0) {
+      return;
+    }
+    props.onStart(postFiles, state.updateId);
+  };
+};
+export var upload = function upload(_ref4) {
+  var api = _ref4.api,
+    props = _ref4.props,
+    refs = _ref4.refs;
+  return function (rawFile) {
+    refs.input.value = null;
+    if (!props.beforeUpload) {
+      return api.post(rawFile);
+    }
+    var previous = props.beforeUpload(rawFile);
+    if (previous && previous.then) {
+      previous.then(function (fileProcessed) {
+        var typeOfFile = Object.prototype.toString.call(fileProcessed);
+        if (typeOfFile === '[object File]' || typeOfFile === '[object Blob]') {
+          if (typeOfFile === '[object Blob]') {
+            fileProcessed = new File([fileProcessed], rawFile.name, {
+              type: rawFile.type
+            });
+          }
+          Object.keys(rawFile).forEach(function (p) {
+            fileProcessed[p] = rawFile[p];
+          });
+          api.post(fileProcessed);
+        } else {
+          api.post(rawFile);
+        }
+      }, function () {
+        props.onRemove(null, rawFile);
+      });
+    } else if (previous !== false) {
+      api.post(rawFile);
+    } else {
+      props.onRemove(null, rawFile);
+    }
+  };
+};
+export var abort = function abort(_ref5) {
+  var state = _ref5.state,
+    props = _ref5.props;
+  return function (file) {
+    var reqs = state.reqs;
+    var cancel = function cancel(uid) {
+      var fn = reqs[uid] && reqs[uid].abort || state.cancelToken[uid];
+      fn && fn();
+      delete reqs[uid];
+      delete state.cancelToken[uid];
+    };
+    if (file && file.isLargeFile && file.cancelToken) {
+      file.cancelToken && file.cancelToken.forEach(function (cancel) {
+        return cancel();
+      });
+      delete file.cancelToken;
+    } else if (file) {
+      var uid = file;
+      if (file.uid) {
+        uid = file.uid;
+      }
+      cancel(uid);
+    } else {
+      Object.keys(reqs).forEach(function (uid) {
+        return cancel(uid);
+      });
+      props.fileList.forEach(function (file) {
+        file.cancelToken && file.cancelToken.forEach(function (cancel) {
+          return cancel();
+        });
+        file.status = 'fail';
+      });
+    }
+  };
+};
+var getOptionsOfPost = function getOptionsOfPost(_ref6) {
+  var props = _ref6.props,
+    state = _ref6.state,
+    rawFile = _ref6.rawFile,
+    parent = _ref6.parent,
+    uid = _ref6.uid;
+  return {
+    headers: Object.assign(props.headers, state.headers),
+    withCredentials: props.withCredentials,
+    file: rawFile,
+    data: props.data,
+    filename: props.name,
+    action: parent.action || props.action,
+    onProgress: function onProgress(event) {
+      props.onProgress(event, rawFile);
+    },
+    onSuccess: function onSuccess(res) {
+      props.onSuccess(res, rawFile);
+      delete state.reqs[uid];
+    },
+    onError: function onError(error) {
+      props.onError(error, rawFile);
+      delete state.reqs[uid];
+    }
+  };
+};
+var modifyOptionsOfPost = function modifyOptionsOfPost(_ref7) {
+  var service = _ref7.service,
+    props = _ref7.props,
+    options = _ref7.options,
+    rawFile = _ref7.rawFile,
+    state = _ref7.state,
+    uid = _ref7.uid,
+    parent = _ref7.parent,
+    api = _ref7.api,
+    constants = _ref7.constants;
+  if (service && service.network && props.httpRequest === service.network.request) {
+    options.method = 'post';
+    options.url = options.action;
+    options.onUploadProgress = function (event) {
+      props.onProgress(event, rawFile);
+    };
+    delete options.action;
+    delete options.onProgress;
+    var formData = new FormData();
+    var source = service.network.CancelToken.source();
+    options.cancelToken = source.token;
+    state.cancelToken[uid] = source.cancel;
+    if (parent.edm.upload) {
+      !rawFile.isLargeFile && (options.method = 'put');
+      options.data = options.data || {};
+    }
+    if (options.data) {
+      Object.keys(options.data).forEach(function (key) {
+        formData.append(key, options.data[key]);
+      });
+    }
+    if (Array.isArray(rawFile)) {
+      rawFile.forEach(function (file) {
+        return formData.append(file.name, file.raw || file);
+      });
+    } else {
+      if (state.isEdm) {
+        api.getFormData({
+          formData: formData,
+          file: rawFile,
+          type: !rawFile.isLargeFile ? constants.EDM.SINGLEUPLOAD : ''
+        });
+      } else {
+        formData.append(options.filename, rawFile, rawFile.name);
+      }
+    }
+    options.data = formData;
+  }
+};
+export var post = function post(_ref8) {
+  var api = _ref8.api,
+    constants = _ref8.constants,
+    parent = _ref8.parent,
+    props = _ref8.props,
+    state = _ref8.state,
+    service = _ref8.service;
+  return function (rawFile) {
+    var uid = rawFile.uid;
+    var options = getOptionsOfPost({
+      props: props,
+      state: state,
+      rawFile: rawFile,
+      parent: parent,
+      uid: uid
+    });
+    modifyOptionsOfPost({
+      service: service,
+      props: props,
+      options: options,
+      rawFile: rawFile,
+      state: state,
+      uid: uid,
+      parent: parent,
+      api: api,
+      constants: constants
+    });
+    var excuteReq = function excuteReq(options) {
+      var req = props.httpRequest(options);
+      state.reqs[uid] = req;
+      if (req && req.then) {
+        req.then(options.onSuccess, options.onError);
+      }
+    };
+    if (rawFile.isLargeFile) {
+      service.common.getChunkMergeUrl().then(function (url) {
+        options.url = url;
+        excuteReq(options);
+      });
+    } else {
+      excuteReq(options);
+    }
+  };
+};
+export var handleClick = function handleClick(_ref9) {
+  var props = _ref9.props,
+    refs = _ref9.refs;
+  return function () {
+    if (!props.disabled) {
+      refs.input.value = null;
+      refs.input.click();
+    }
+  };
+};
+export var handleKeydown = function handleKeydown(api) {
+  return function (event) {
+    if (event.target !== event.currentTarget) {
+      return;
+    }
+    if (event.keyCode === KEY_CODE.Enter || event.keyCode === KEY_CODE.Space) {
+      api.handleClick();
+    }
+  };
+};
+export var handleUpdate = function handleUpdate(_ref10) {
+  var props = _ref10.props,
+    state = _ref10.state;
+  return function (file) {
+    if (!props.disabled) {
+      state.updateInput.value = null;
+      state.updateId = file.docId;
+      state.updateInput.click();
+    }
+  };
+};
+export var mounted = function mounted(_ref11) {
+  var state = _ref11.state,
+    props = _ref11.props,
+    api = _ref11.api;
+  return function () {
+    var updateInput = document.createElement('input');
+    updateInput.type = 'file';
+    updateInput.name = props.name;
+    updateInput.accept = props.accept;
+    updateInput.onchange = api.handleChange;
+    state.updateInput = Object.freeze(updateInput);
+  };
+};
+export var onBeforeDestroy = function onBeforeDestroy(state) {
+  return function () {
+    state.updateInput.onchange = null;
+    state.updateInput = null;
+  };
+};

package/upload/vue.js

@@ -0,0 +1,93 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { getFormData, isImage, handleChange, uploadFiles, upload, abort, post, handleClick, handleKeydown, handleUpdate, mounted, onBeforeDestroy } from './index';
+export var api = ['state', 'isImage', 'handleChange', 'uploadFiles', 'upload', 'abort', 'post', 'handleClick', 'handleKeydown', 'handleUpdate'];
+export var renderless = function renderless(props, _ref, _ref2, _ref3) {
+  var computed = _ref.computed,
+    inject = _ref.inject,
+    reactive = _ref.reactive,
+    onMounted = _ref.onMounted,
+    onBeforeUnmount = _ref.onBeforeUnmount;
+  var refs = _ref2.refs,
+    service = _ref2.service,
+    parent = _ref2.parent,
+    t = _ref2.t;
+  var Modal = _ref3.Modal;
+  var api = {};
+  var constants = parent.$parent.$constants;
+  var state = reactive({
+    mouseover: false,
+    reqs: {},
+    uploader: inject('uploader'),
+    accecpt: '',
+    isEdm: computed(function () {
+      return parent.state.isEdm;
+    }),
+    openEdmDownload: computed(function () {
+      return parent.edm.download;
+    }),
+    headers: computed(function () {
+      if (state.isEdm) {
+        var _ref4;
+        return _ref4 = {}, _defineProperty(_ref4, constants.EDM.EDMTOKEN, props.edmToken.edmToken || ''), _defineProperty(_ref4, constants.EDM.TRACEID, props.edmToken.traceId || ''), _ref4;
+      }
+    }),
+    formData: {},
+    cancelToken: {},
+    updateId: '',
+    updateInput: null
+  });
+  Object.assign(api, {
+    state: state,
+    isImage: isImage,
+    abort: abort({
+      state: state,
+      props: props
+    }),
+    getFormData: getFormData({
+      state: state,
+      constants: constants,
+      parent: parent,
+      props: props
+    }),
+    handleClick: handleClick({
+      props: props,
+      refs: refs
+    }),
+    onBeforeDestroy: onBeforeDestroy(state),
+    handleUpdate: handleUpdate({
+      state: state,
+      props: props
+    }),
+    uploadFiles: uploadFiles({
+      api: api,
+      constants: constants,
+      Modal: Modal,
+      props: props,
+      state: state,
+      t: t
+    }),
+    post: post({
+      api: api,
+      constants: constants,
+      parent: parent,
+      props: props,
+      state: state,
+      service: service
+    }),
+    handleChange: handleChange(api),
+    handleKeydown: handleKeydown(api),
+    upload: upload({
+      api: api,
+      props: props,
+      refs: refs
+    }),
+    mounted: mounted({
+      state: state,
+      props: props,
+      api: api
+    })
+  });
+  onMounted(api.mounted);
+  onBeforeUnmount(api.onBeforeDestroy);
+  return api;
+};

package/upload-dragger/index.js

@@ -0,0 +1,50 @@
+export var onDragOver = function onDragOver(_ref) {
+  var props = _ref.props,
+    state = _ref.state;
+  return function () {
+    return !props.disabled && (state.dragover = true);
+  };
+};
+export var onDrop = function onDrop(_ref2) {
+  var emit = _ref2.emit,
+    props = _ref2.props,
+    state = _ref2.state;
+  return function (event) {
+    if (props.disabled || !state.uploader) {
+      return;
+    }
+    var accept = state.uploader.accept;
+    state.dragover = false;
+    if (!accept) {
+      emit('file', event.dataTransfer.files);
+      return;
+    }
+    var notAcceptedFiles = [];
+    var filteredFile = [].slice.call(event.dataTransfer.files).filter(function (file) {
+      var type = file.type,
+        name = file.name;
+      var extension = name.indexOf('.') > -1 ? ".".concat(name.split('.').pop()) : '';
+      var baseType = type.replace(/\/.*$/, '');
+      var isValid = accept.split(',').map(function (type) {
+        return type.trim();
+      }).filter(function (type) {
+        return type;
+      }).some(function (type) {
+        if (/\..+$/.test(type)) {
+          return extension === type;
+        }
+        if (/\/\*$/.test(type)) {
+          return baseType === type.replace(/\/\*$/, '');
+        }
+        if (/^[^/]+\/[^/]+$/.test(type)) {
+          return true;
+        }
+        return false;
+      });
+      !isValid && notAcceptedFiles.push(file);
+      return isValid;
+    });
+    notAcceptedFiles.length && state.uploader.$emit('drop-error', notAcceptedFiles);
+    emit('file', filteredFile);
+  };
+};

package/upload-dragger/vue.js

@@ -0,0 +1,27 @@
+import { onDragOver, onDrop } from './index';
+export var api = ['state', 'onDragOver', 'onDrop'];
+export var renderless = function renderless(props, _ref, _ref2) {
+  var inject = _ref.inject,
+    reactive = _ref.reactive,
+    ref = _ref.ref;
+  var emit = _ref2.emit;
+  var state = reactive({
+    dragover: false,
+    uploader: inject('uploader') || ref({
+      "default": ''
+    })
+  });
+  var api = {
+    state: state,
+    onDragOver: onDragOver({
+      props: props,
+      state: state
+    }),
+    onDrop: onDrop({
+      emit: emit,
+      props: props,
+      state: state
+    })
+  };
+  return api;
+};

package/upload-list/index.js

@@ -0,0 +1,55 @@
+import _typeof from "@babel/runtime/helpers/typeof";
+export var parsePercentage = function parsePercentage() {
+  return function (val) {
+    return parseInt(val, 10);
+  };
+};
+export var handleClick = function handleClick(_ref) {
+  var props = _ref.props,
+    api = _ref.api,
+    parent = _ref.parent;
+  return function (file) {
+    if (parent.state.isEdm) {
+      props.openDownloadFile && api.edmDownloadFile(file);
+    } else {
+      props.openDownloadFile && api.downloadFile(file);
+    }
+    return props.handlePreview && props.handlePreview(file);
+  };
+};
+export var downloadFile = function downloadFile(service) {
+  return function (file) {
+    var data = file && file.response && file.response.data;
+    var responseFile;
+    if (Array.isArray(data)) {
+      responseFile = data[0];
+    } else if (data && _typeof(data) === 'object') {
+      for (var _i = 0, _Object$keys = Object.keys(data); _i < _Object$keys.length; _i++) {
+        var key = _Object$keys[_i];
+        responseFile = data[key];
+        break;
+      }
+    }
+    if (responseFile) {
+      var getFileDownloadUrl = service && service.common && service.common.getFileDownloadUrl;
+      getFileDownloadUrl && getFileDownloadUrl().then(function (url) {
+        window.open(url + '&id=' + responseFile.attachmentId + '&type=AttachmentDemo').opener = null;
+      });
+    } else if (file.url) {
+      window.open(file.url).opener = null;
+    } else {
+      throw new Error('[tiny Error][FileUpload]file.url must not be empty');
+    }
+  };
+};
+export var picturefilePreview = function picturefilePreview(state) {
+  return function (index) {
+    state.startPostion = index;
+    state.shows = true;
+  };
+};
+export var getDeleteData = function getDeleteData(emit) {
+  return function (data) {
+    emit('remove', data);
+  };
+};

package/upload-list/vue.js

@@ -0,0 +1,48 @@
+import { parsePercentage, handleClick, picturefilePreview, getDeleteData, downloadFile } from './index';
+import { downloadFile as edmDownloadFile, getToken } from '@opentiny/vue-renderless/file-upload';
+export var api = ['t', 'state', 'parsePercentage', 'handleClick', 'handlePreview', 'picturefilePreview', 'getDeleteData', 'downloadFile'];
+export var renderless = function renderless(props, _ref, _ref2, _ref3) {
+  var reactive = _ref.reactive;
+  var t = _ref2.t,
+    parent = _ref2.parent,
+    tinyMode = _ref2.mode,
+    emit = _ref2.emit,
+    service = _ref2.service;
+  var Modal = _ref3.Modal;
+  var mode = props._mode || parent.$mode || (tinyMode ? tinyMode.value ? tinyMode.value : 'pc' : 'pc');
+  var state = reactive({
+    focusing: false,
+    shows: false,
+    startPostion: 0,
+    screenType: mode === 'pc' ? false : true
+  });
+  parent.getToken = getToken({
+    constants: parent.$constants,
+    props: parent,
+    state: parent.state,
+    t: t,
+    Modal: Modal
+  });
+  var api = {
+    state: state,
+    getDeleteData: getDeleteData(emit),
+    parsePercentage: parsePercentage(),
+    downloadFile: downloadFile(service),
+    picturefilePreview: picturefilePreview(state),
+    edmDownloadFile: edmDownloadFile({
+      api: parent,
+      constants: parent.$constants,
+      props: parent,
+      service: service,
+      state: parent.state
+    })
+  };
+  Object.assign(api, {
+    handleClick: handleClick({
+      props: props,
+      api: api,
+      parent: parent
+    })
+  });
+  return api;
+};

package/user-contact/index.js

@@ -0,0 +1,13 @@
+export var getUserHref = function getUserHref(_ref) {
+  var api = _ref.api,
+    props = _ref.props;
+  return function () {
+    var href = 'javascript:;';
+    if (!props.isNewImMode) {
+      var data = props.data;
+      var userDescription = data.userDescription ? data.userDescription.toLocaleLowerCase() : '';
+      href = 'javascript:;';
+    }
+    return href;
+  };
+};

package/user-contact/vue.js

@@ -0,0 +1,20 @@
+import { getUserHref } from './index';
+export var api = ['show', 'getUserHref'];
+export var renderless = function renderless(props, _ref) {
+  var reactive = _ref.reactive,
+    ref = _ref.ref;
+  var state = reactive({
+    initialized: false
+  });
+  var api = {
+    state: state,
+    show: ref(false)
+  };
+  Object.assign(api, {
+    getUserHref: getUserHref({
+      api: api,
+      props: props
+    })
+  });
+  return api;
+};

package/user-head/index.js

@@ -0,0 +1,71 @@
+export var computedStyle = function computedStyle(_ref) {
+  var state = _ref.state,
+    props = _ref.props;
+  return function () {
+    return {
+      fill: props.color,
+      color: props.color,
+      backgroundColor: props.backgroundColor,
+      backgroundImage: /^(image)$/.test(props.type) && state.internalValue ? "url(".concat(state.internalValue, ")") : 'none'
+    };
+  };
+};
+export var computedMessage = function computedMessage(_ref2) {
+  var props = _ref2.props;
+  return function () {
+    var result = '';
+    var total = Math.floor(props.messageTotal);
+    if (props.messageType === 'details' && !isNaN(total) && total > 0) {
+      result = total;
+      if (props.messageUpperLimit && total > props.messageUpperLimit) {
+        result = "".concat(props.messageUpperLimit, "+");
+      }
+    }
+    return result;
+  };
+};
+export var computedFontSize = function computedFontSize(_ref3) {
+  var props = _ref3.props,
+    state = _ref3.state;
+  return function () {
+    var fontSize = '';
+    if (props.type === 'label' && state.label && !props.min) {
+      var length = state.label.length;
+      var sizeMap = {
+        1: '40px',
+        2: '30px',
+        3: '22px',
+        4: '20px',
+        5: '18px',
+        6: '16px'
+      };
+      fontSize = sizeMap[length];
+    }
+    return {
+      fontSize: fontSize
+    };
+  };
+};
+export var computedLabel = function computedLabel(_ref4) {
+  var state = _ref4.state,
+    props = _ref4.props;
+  return function () {
+    return props.min ? state.internalValue.substr(0, 2) : state.internalValue.substr(0, 6);
+  };
+};
+export var getInternalValue = function getInternalValue(_ref5) {
+  var props = _ref5.props;
+  return function () {
+    if (props.modelValue === null) {
+      var result = '';
+      if (props.type === 'icon') {
+        result = 'icon-user';
+      } else if (props.type === 'label') {
+        result = 'U';
+      }
+      return result;
+    } else {
+      return props.modelValue;
+    }
+  };
+};