@opentiny/vue-renderless 3.1.0-alpha.0

package/file-upload/vue.js

@@ -0,0 +1,458 @@
+import { downloadFile as ordinaryDownload } from '@opentiny/vue-renderless/upload-list';
+import { initService, getNewTabPreviewUrl, previewFile, getToken, downloadFile, batchSegmentUpload, segmentUpload, sliceChunk, segmentUploadInit, largeDocumentUpload, getFormData, abort, clearFiles, computedUploadDisabled, getFile, handleStart, handleProgress, handleSuccess, handleError, handleRemove, onBeforeDestroy, submit, watchListType, watchFileList, handleClick, getFileUploadUrl, updateUrl, previewImage, startUpload, getDialogConfigObj, computeDocChunkSize, updateFile, getPreviewUrlSync, beforeUpload, computedUploadingSize, clearUploadingFiles, calcUploadingFilesInfo, properFileSize, addFileToList, getDownloadFileInfo, largeDocumentDownload, sliceDownloadChunk, batchSegmentDownload, downloadFileInner, setWriterFile, afterDownload } from './index';
+import { isEmptyObject } from '@opentiny/vue-renderless/common/type';
+export var api = ['state', 'getNewTabPreviewUrl', 'previewFile', 'downloadFile', 'abort', 'clearFiles', 'getFile', 'handleStart', 'handleProgress', 'handleSuccess', 'handleError', 'handleRemove', 'submit', 'handleClick', 'getFileUploadUrl', 'updateUrl', 'previewImage', 'updateFile'];
+var initState = function initState(_ref) {
+  var api = _ref.api,
+    reactive = _ref.reactive,
+    computed = _ref.computed,
+    inject = _ref.inject,
+    ref = _ref.ref,
+    vm = _ref.vm,
+    props = _ref.props,
+    httpRequest = _ref.httpRequest;
+  var state = reactive({
+    url: '',
+    tempIndex: 1,
+    draging: false,
+    uploadFiles: [],
+    dragOver: false,
+    httpRequest: httpRequest,
+    form: inject('form', ref({
+      "default": ''
+    })),
+    listeners: vm.$listeners,
+    docSize: 0,
+    chunkSize: 0,
+    chunkBatchLimit: 20,
+    downloadChunkLimit: 5,
+    batchQueue: {},
+    batchQueueListen: {},
+    batchCancelToken: {},
+    replayAtoms: {},
+    chunkUploadUrl: '',
+    largeFileInfo: {},
+    headers: {},
+    accept: '',
+    edmToken: {},
+    isSuccess: false,
+    singleMaxSize: 200,
+    formData: {},
+    showPreview: false,
+    iframeUrl: '',
+    fileWater: false,
+    tabUrl: '',
+    cacheDocuments: {},
+    isEdm: computed(function () {
+      return !isEmptyObject(props.edm);
+    }),
+    uploadDisabled: computed(function () {
+      return api.computedUploadDisabled();
+    }),
+    dialogConfigObj: computed(function () {
+      return api.getDialogConfigObj();
+    }),
+    uploadingFiles: [],
+    currentUploadingFileUids: [],
+    uploadingSize: computed(function () {
+      return api.computedUploadingSize();
+    }),
+    isEntireCheckCode: computed(function () {
+      return !('isEntireCheckCode' in props.edm && props.edm.isEntireCheckCode !== true);
+    }),
+    downloadBatchQueue: {},
+    downloadBatchQueueListen: {},
+    dowuloadChunkFile: new Map(),
+    downloadReplayAtoms: {}
+  });
+  return state;
+};
+var initApi = function initApi(_ref2) {
+  var api = _ref2.api,
+    state = _ref2.state,
+    props = _ref2.props,
+    constants = _ref2.constants,
+    refs = _ref2.refs,
+    $service = _ref2.$service,
+    t = _ref2.t,
+    Modal = _ref2.Modal;
+  var _constants$EDM = constants.EDM,
+    SIZE_2G = _constants$EDM.SIZE_2G,
+    SIZE_20M = _constants$EDM.SIZE_20M,
+    SIZE_8M = _constants$EDM.SIZE_8M;
+  Object.assign(api, {
+    state: state,
+    sliceChunk: sliceChunk({
+      state: state,
+      props: props
+    }),
+    getFormData: getFormData({
+      constants: constants,
+      props: props,
+      state: state
+    }),
+    abort: abort({
+      constants: constants,
+      refs: refs
+    }),
+    handleClick: handleClick({
+      constants: constants,
+      refs: refs
+    }),
+    getFile: getFile(state),
+    clearFiles: clearFiles(state),
+    watchFileList: watchFileList({
+      constants: constants,
+      state: state
+    }),
+    watchListType: watchListType({
+      constants: constants,
+      state: state
+    }),
+    onBeforeDestroy: onBeforeDestroy(state),
+    computedUploadDisabled: computedUploadDisabled({
+      props: props,
+      state: state
+    }),
+    computedUploadingSize: computedUploadingSize(state),
+    getFileUploadUrl: getFileUploadUrl($service),
+    getToken: getToken({
+      constants: constants,
+      props: props,
+      state: state,
+      t: t,
+      Modal: Modal
+    }),
+    getDialogConfigObj: getDialogConfigObj({
+      props: props,
+      state: state
+    }),
+    computeDocChunkSize: computeDocChunkSize({
+      props: props,
+      state: state,
+      SIZE_2G: SIZE_2G,
+      SIZE_20M: SIZE_20M,
+      SIZE_8M: SIZE_8M
+    }),
+    updateFile: updateFile({
+      constants: constants,
+      refs: refs
+    }),
+    getPreviewUrlSync: getPreviewUrlSync({
+      constants: constants,
+      props: props,
+      state: state
+    }),
+    ordinaryDownload: ordinaryDownload($service),
+    clearUploadingFiles: clearUploadingFiles({
+      constants: constants,
+      state: state
+    }),
+    calcUploadingFilesInfo: calcUploadingFilesInfo({
+      state: state
+    }),
+    properFileSize: properFileSize({
+      props: props,
+      state: state,
+      constants: constants,
+      Modal: Modal,
+      t: t
+    })
+  });
+};
+var mergeApi = function mergeApi(_ref3) {
+  var api = _ref3.api,
+    props = _ref3.props,
+    $service = _ref3.$service,
+    state = _ref3.state,
+    constants = _ref3.constants,
+    emit = _ref3.emit,
+    mode = _ref3.mode,
+    Modal = _ref3.Modal,
+    t = _ref3.t,
+    refs = _ref3.refs;
+  Object.assign(api, {
+    segmentUploadInit: segmentUploadInit({
+      api: api,
+      props: props,
+      service: $service,
+      state: state,
+      constants: constants
+    }),
+    segmentUpload: segmentUpload({
+      api: api,
+      props: props,
+      service: $service,
+      state: state,
+      emit: emit,
+      constants: constants
+    }),
+    addFileToList: addFileToList({
+      api: api,
+      constants: constants,
+      emit: emit,
+      props: props,
+      state: state,
+      mode: mode
+    }),
+    downloadFile: downloadFile({
+      api: api,
+      state: state,
+      props: props
+    }),
+    previewImage: previewImage({
+      api: api,
+      props: props,
+      service: $service,
+      state: state
+    }),
+    previewFile: previewFile({
+      api: api,
+      constants: constants,
+      Modal: Modal,
+      props: props,
+      service: $service,
+      state: state,
+      t: t
+    }),
+    getNewTabPreviewUrl: getNewTabPreviewUrl({
+      api: api,
+      props: props
+    }),
+    submit: submit({
+      api: api,
+      constants: constants,
+      Modal: Modal,
+      refs: refs,
+      props: props,
+      state: state,
+      t: t
+    }),
+    handleStart: handleStart({
+      api: api,
+      constants: constants,
+      props: props,
+      state: state,
+      refs: refs
+    }),
+    batchSegmentUpload: batchSegmentUpload({
+      api: api,
+      constants: constants,
+      props: props,
+      refs: refs,
+      state: state
+    }),
+    largeDocumentUpload: largeDocumentUpload({
+      api: api,
+      Modal: Modal,
+      state: state,
+      emit: emit,
+      constants: constants,
+      t: t
+    }),
+    handleProgress: handleProgress({
+      api: api,
+      constants: constants,
+      emit: emit,
+      state: state
+    }),
+    handleSuccess: handleSuccess({
+      api: api,
+      constants: constants,
+      emit: emit,
+      Modal: Modal,
+      props: props,
+      state: state
+    }),
+    handleError: handleError({
+      api: api,
+      constants: constants,
+      emit: emit,
+      state: state
+    }),
+    handleRemove: handleRemove({
+      api: api,
+      emit: emit,
+      props: props,
+      state: state
+    }),
+    updateUrl: updateUrl({
+      api: api,
+      props: props,
+      service: $service,
+      state: state
+    }),
+    startUpload: startUpload({
+      api: api,
+      state: state,
+      constants: constants,
+      refs: refs,
+      Modal: Modal,
+      t: t
+    }),
+    beforeUpload: beforeUpload({
+      api: api,
+      props: props,
+      Modal: Modal,
+      constants: constants,
+      t: t,
+      state: state
+    }),
+    getDownloadFileInfo: getDownloadFileInfo({
+      api: api,
+      props: props,
+      state: state,
+      service: $service
+    }),
+    largeDocumentDownload: largeDocumentDownload({
+      api: api,
+      state: state
+    }),
+    sliceDownloadChunk: sliceDownloadChunk({
+      api: api,
+      state: state
+    }),
+    batchSegmentDownload: batchSegmentDownload({
+      state: state,
+      api: api
+    }),
+    downloadFileInner: downloadFileInner({
+      api: api,
+      props: props,
+      service: $service,
+      state: state,
+      emit: emit,
+      constants: constants,
+      t: t,
+      Modal: Modal
+    }),
+    setWriterFile: setWriterFile({
+      state: state,
+      emit: emit,
+      props: props
+    }),
+    afterDownload: afterDownload({
+      api: api,
+      state: state
+    })
+  });
+};
+var initWatch = function initWatch(_ref4) {
+  var watch = _ref4.watch,
+    state = _ref4.state,
+    api = _ref4.api,
+    props = _ref4.props,
+    $service = _ref4.$service;
+  watch(function () {
+    return props.edm.upload;
+  }, function (value) {
+    return value && api.getToken({
+      token: value.token,
+      isinit: true
+    });
+  }, {
+    immediate: true,
+    deep: true
+  });
+  watch(function () {
+    return props.listType;
+  }, api.watchListType);
+  watch(function () {
+    return props.fileList;
+  }, function (value) {
+    return api.watchFileList(value);
+  }, {
+    immediate: true,
+    deep: true
+  });
+  watch(function () {
+    return props.action;
+  }, function () {
+    if (!props.httpRequest && !state.isEdm) {
+      api.updateUrl();
+    }
+  }, {
+    immediate: true
+  });
+  watch(function () {
+    return state.isSuccess;
+  }, function (value) {
+    return value && $service.getSingleUploadUrl().then(function (url) {
+      return state.url = url;
+    });
+  }, {
+    immediate: true
+  });
+  watch(function () {
+    return props.edm;
+  }, api.computeDocChunkSize, {
+    deep: true,
+    immediate: true
+  });
+};
+export var renderless = function renderless(props, _ref5, _ref6, _ref7) {
+  var computed = _ref5.computed,
+    inject = _ref5.inject,
+    onBeforeUnmount = _ref5.onBeforeUnmount,
+    provide = _ref5.provide,
+    reactive = _ref5.reactive,
+    ref = _ref5.ref,
+    watch = _ref5.watch;
+  var t = _ref6.t,
+    vm = _ref6.vm,
+    refs = _ref6.refs,
+    parent = _ref6.parent,
+    emit = _ref6.emit,
+    service = _ref6.service,
+    mode = _ref6.mode,
+    constants = _ref6.constants;
+  var Modal = _ref7.Modal;
+  var api = {};
+  var $service = initService({
+    props: props,
+    service: service
+  });
+  var httpRequest = $service.httpRequest;
+  var state = initState({
+    reactive: reactive,
+    computed: computed,
+    api: api,
+    inject: inject,
+    ref: ref,
+    vm: vm,
+    props: props,
+    httpRequest: httpRequest
+  });
+  initApi({
+    api: api,
+    state: state,
+    props: props,
+    constants: constants,
+    refs: refs,
+    $service: $service,
+    t: t,
+    Modal: Modal
+  });
+  mergeApi({
+    api: api,
+    props: props,
+    $service: $service,
+    state: state,
+    constants: constants,
+    emit: emit,
+    mode: mode,
+    Modal: Modal,
+    t: t,
+    refs: refs
+  });
+  provide('uploader', parent);
+  onBeforeUnmount(api.onBeforeDestroy);
+  initWatch({
+    watch: watch,
+    state: state,
+    api: api,
+    props: props,
+    $service: $service
+  });
+  return api;
+};

package/floatbar/index.js

@@ -0,0 +1,10 @@
+import { xss } from '@opentiny/vue-renderless/common/xss.js';
+export var computeData = function computeData(_ref) {
+  var props = _ref.props;
+  if (Array.isArray(props.data) && props.data.length) {
+    props.data.forEach(function (item) {
+      item.url = xss.filterUrl(item.url);
+    });
+  }
+  return props.data;
+};

package/floatbar/vue.js

@@ -0,0 +1,17 @@
+import { computeData } from './index';
+export var api = ['state'];
+export var renderless = function renderless(props, _ref) {
+  var computed = _ref.computed,
+    reactive = _ref.reactive;
+  var state = reactive({
+    data: computed(function () {
+      return computeData({
+        props: props
+      });
+    })
+  });
+  var api = {
+    state: state
+  };
+  return api;
+};

package/form/index.js

@@ -0,0 +1,186 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import { merge } from '@opentiny/vue-renderless/common/object';
+export var watchRules = function watchRules(_ref) {
+  var api = _ref.api,
+    props = _ref.props,
+    state = _ref.state;
+  return function () {
+    var newRules = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var oldRules = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var newValidFields = Object.keys(newRules);
+    var oldValidFields = Object.keys(oldRules);
+    var removeValidFields = oldValidFields.filter(function (item) {
+      return !newValidFields.includes(item);
+    });
+    api.clearValidate(removeValidFields);
+    state.fields.forEach(function (field) {
+      field.removeValidateEvents();
+      field.addValidateEvents();
+    });
+    if (props.validateOnRuleChange) {
+      api.validate(function () {
+        return undefined;
+      });
+    }
+  };
+};
+export var computedAutoLabelWidth = function computedAutoLabelWidth(_ref2) {
+  var state = _ref2.state;
+  return function () {
+    if (!state.potentialLabelWidthArr.length) return 0;
+    var max = Math.max.apply(Math, _toConsumableArray(state.potentialLabelWidthArr));
+    return max ? "".concat(max, "px") : '';
+  };
+};
+export var created = function created(_ref3) {
+  var parent = _ref3.parent,
+    state = _ref3.state;
+  return function () {
+    parent.$on('form:addField', function (field) {
+      if (field) {
+        state.fields.push(field);
+      }
+    });
+    parent.$on('form:removeField', function (field) {
+      if (field.prop) {
+        state.fields.splice(state.fields.indexOf(field), 1);
+      }
+    });
+  };
+};
+export var resetFields = function resetFields(_ref4) {
+  var props = _ref4.props,
+    state = _ref4.state;
+  return function () {
+    if (!props.model) {
+      return;
+    }
+    state.fields.forEach(function (field) {
+      field.resetField();
+    });
+  };
+};
+export var updateTip = function updateTip(_ref5) {
+  var props = _ref5.props,
+    state = _ref5.state;
+  return function () {
+    if (!props.model) {
+      return;
+    }
+    state.fields.forEach(function (field) {
+      field.updateTip();
+    });
+  };
+};
+export var clearValidate = function clearValidate(state) {
+  return function () {
+    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    var fields = props.length ? typeof props === 'string' ? state.fields.filter(function (field) {
+      return props === field.prop;
+    }) : state.fields.filter(function (field) {
+      return props.indexOf(field.prop) > -1;
+    }) : state.fields;
+    fields.forEach(function (field) {
+      field.clearValidate();
+    });
+  };
+};
+export var validate = function validate(_ref6) {
+  var props = _ref6.props,
+    state = _ref6.state;
+  return function (callback) {
+    if (!props.model) {
+      return;
+    }
+    var promise;
+    if (typeof callback !== 'function' && window.Promise) {
+      promise = new window.Promise(function (resolve, reject) {
+        callback = function callback(valid) {
+          valid ? resolve(valid) : reject(valid);
+        };
+      });
+    }
+    var valid = true;
+    var count = 0;
+    if (state.fields.length === 0 && callback) {
+      callback(true);
+    }
+    var invalidFields = {};
+    state.fields.forEach(function (field) {
+      field.validate('', function (message, field) {
+        if (message) {
+          valid = false;
+        }
+        invalidFields = merge({}, invalidFields, field);
+        if (typeof callback === 'function' && ++count === state.fields.length) {
+          callback(valid, invalidFields);
+        }
+      });
+    });
+    if (promise) {
+      return promise;
+    }
+  };
+};
+export var validateField = function validateField(state) {
+  return function (props, cb) {
+    props = [].concat(props);
+    var fields = state.fields.filter(function (field) {
+      return props.indexOf(field.prop) !== -1;
+    });
+    if (!fields.length) {
+      return;
+    }
+    fields.forEach(function (field) {
+      field.validate('', cb);
+    });
+  };
+};
+export var getLabelWidthIndex = function getLabelWidthIndex(state) {
+  return function (width) {
+    var index = state.potentialLabelWidthArr.indexOf(width);
+    if (index === -1) {
+      throw new Error('unpected width ', width);
+    }
+    return index;
+  };
+};
+export var registerLabelWidth = function registerLabelWidth(_ref7) {
+  var api = _ref7.api,
+    state = _ref7.state;
+  return function (val, oldVal) {
+    if (val && oldVal) {
+      var index = api.getLabelWidthIndex(oldVal);
+      state.potentialLabelWidthArr.splice(index, 1, val);
+    } else if (val) {
+      state.potentialLabelWidthArr.push(val);
+    }
+  };
+};
+export var deregisterLabelWidth = function deregisterLabelWidth(_ref8) {
+  var api = _ref8.api,
+    state = _ref8.state;
+  return function (val) {
+    var index = api.getLabelWidthIndex(val);
+    state.potentialLabelWidthArr.splice(index, 1);
+  };
+};
+export var bindDialogEvent = function bindDialogEvent(_ref9) {
+  var api = _ref9.api,
+    dialog = _ref9.dialog,
+    state = _ref9.state;
+  if (dialog) {
+    dialog.state.emitter.on('boxclose', function () {
+      var isFormReset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+      isFormReset ? api.resetFields() : api.clearValidate();
+    });
+    dialog.state.emitter.on('boxdrag', function () {
+      if (!state.timer) {
+        state.timer = setTimeout(function () {
+          state.timer = null;
+          api.updateTip();
+        }, 10);
+      }
+    });
+  }
+};