@opentiny/vue-renderless 3.1.0-alpha.0

package/fullscreen/index.js

@@ -0,0 +1,138 @@
+import { on, off } from '@opentiny/vue-renderless/common/deps/dom';
+export var toggle = function toggle(_ref) {
+  var state = _ref.state,
+    api = _ref.api;
+  return function (value) {
+    if (value === undefined) {
+      if (state.isFullscreen) {
+        api.exit();
+      } else {
+        api.request();
+      }
+    } else {
+      value ? api.request() : api.exit();
+    }
+  };
+};
+export var request = function request(_ref2) {
+  var props = _ref2.props,
+    state = _ref2.state,
+    vm = _ref2.vm,
+    sf = _ref2.sf,
+    api = _ref2.api;
+  return function () {
+    if (state.isPageOnly) {
+      state.isFullscreen = true;
+      api.onChangeFullScreen();
+      off(document, 'keyup', api.keypressCallback);
+      on(document, 'keyup', api.keypressCallback);
+    } else {
+      sf.off('change', api.fullScreenCallback);
+      sf.on('change', api.fullScreenCallback);
+      sf.request(props.teleport ? document.body : vm.$el);
+    }
+    if (props.teleport) {
+      if (vm.$el.parentNode === document.body) {
+        return;
+      }
+      state.__parentNode = vm.$el.parentNode;
+      state.__token = document.createComment('fullscreen-token');
+      state.__parentNode.insertBefore(state.__token, vm.$el);
+      document.body.appendChild(vm.$el);
+    }
+  };
+};
+export var exit = function exit(_ref3) {
+  var state = _ref3.state,
+    api = _ref3.api,
+    sf = _ref3.sf;
+  return function () {
+    if (!state.isFullscreen) {
+      return;
+    }
+    if (state.isPageOnly) {
+      state.isFullscreen = false;
+      api.onChangeFullScreen();
+      off(document, 'keyup', api.keypressCallback);
+    } else {
+      sf.exit();
+    }
+  };
+};
+export var shadeClick = function shadeClick(_ref4) {
+  var props = _ref4.props,
+    vm = _ref4.vm,
+    api = _ref4.api;
+  return function (e) {
+    if (e.target === vm.$el) {
+      if (props.exitOnClickWrapper) {
+        api.exit();
+      }
+    }
+  };
+};
+export var fullScreenCallback = function fullScreenCallback(_ref5) {
+  var state = _ref5.state,
+    sf = _ref5.sf,
+    api = _ref5.api;
+  return function () {
+    if (!sf.isFullscreen) {
+      sf.off('change', api.fullScreenCallback);
+    }
+    state.isFullscreen = sf.isFullscreen;
+    api.onChangeFullScreen();
+  };
+};
+export var keypressCallback = function keypressCallback(api) {
+  return function (e) {
+    if (e.key === 'Escape') {
+      api.exit();
+    }
+  };
+};
+export var onChangeFullScreen = function onChangeFullScreen(_ref6) {
+  var props = _ref6.props,
+    state = _ref6.state,
+    vm = _ref6.vm,
+    emit = _ref6.emit;
+  return function () {
+    if (!state.isFullscreen) {
+      if (props.teleport && state.__parentNode) {
+        state.__parentNode.insertBefore(vm.$el, state.__token);
+        state.__parentNode.removeChild(state.__token);
+      }
+    }
+    emit('change', state.isFullscreen);
+    emit('update:fullscreen', state.isFullscreen);
+  };
+};
+export var enter = function enter(api) {
+  return function () {
+    api.request();
+  };
+};
+export var getState = function getState(state) {
+  return function () {
+    return state.isFullscreen;
+  };
+};
+export var computeWrapperStyle = function computeWrapperStyle(_ref7) {
+  var props = _ref7.props,
+    state = _ref7.state;
+  return function () {
+    var style = {};
+    if ((state.isPageOnly || props.teleport) && state.isFullscreen) {
+      Object.assign(style, {
+        position: 'fixed',
+        left: '0',
+        top: '0',
+        width: '100%',
+        height: '100%'
+      });
+    }
+    if (style && props.zIndex) {
+      style.zIndex = props.zIndex;
+    }
+    return style;
+  };
+};

package/fullscreen/vue.js

@@ -0,0 +1,77 @@
+import sf from '@opentiny/vue-renderless/common/deps/fullscreen/screenfull';
+import { exit, enter, toggle, request, getState, shadeClick, keypressCallback, fullScreenCallback, onChangeFullScreen, computeWrapperStyle } from './index';
+export var api = ['state', 'exit', 'enter', 'toggle', 'request', 'getState', 'shadeClick', 'keypressCallback', 'fullScreenCallback', 'onChangeFullScreen'];
+export var renderless = function renderless(props, _ref, _ref2) {
+  var reactive = _ref.reactive,
+    computed = _ref.computed,
+    watch = _ref.watch;
+  var vm = _ref2.vm,
+    emit = _ref2.emit;
+  var api = {};
+  var state = reactive({
+    isFullscreen: false,
+    isEnabled: false,
+    support: computed(function () {
+      return state.isEnabled;
+    }),
+    isPageOnly: computed(function () {
+      return props.pageOnly || !sf.isEnabled;
+    }),
+    wrapperStyle: computed(function () {
+      return api.computeWrapperStyle();
+    })
+  });
+  Object.assign(api, {
+    state: state,
+    getState: getState(state),
+    enter: enter(api),
+    exit: exit({
+      state: state,
+      api: api,
+      sf: sf
+    }),
+    toggle: toggle({
+      state: state,
+      api: api
+    }),
+    keypressCallback: keypressCallback(api),
+    shadeClick: shadeClick({
+      props: props,
+      vm: vm,
+      api: api
+    }),
+    request: request({
+      props: props,
+      state: state,
+      vm: vm,
+      sf: sf,
+      api: api
+    }),
+    fullScreenCallback: fullScreenCallback({
+      state: state,
+      sf: sf,
+      api: api
+    }),
+    computeWrapperStyle: computeWrapperStyle({
+      props: props,
+      state: state
+    }),
+    onChangeFullScreen: onChangeFullScreen({
+      props: props,
+      state: state,
+      vm: vm,
+      emit: emit
+    })
+  });
+  watch(function () {
+    return props.fullscreen;
+  }, function (value) {
+    if (value !== state.isFullscreen) {
+      value ? api.request() : api.exit();
+    }
+  }, {
+    lazy: true
+  });
+  state.isEnabled = sf.isEnabled;
+  return api;
+};

package/grid/core/index.js

@@ -0,0 +1,3 @@
+import StoreMap from './storeMap';
+import Interceptor from './interceptor';
+export { StoreMap, Interceptor };

package/grid/core/interceptor.js

@@ -0,0 +1,38 @@
+import { toString, each, remove } from '../static';
+var toType = function toType(type) {
+  return toString(type).replace('_', '').toLowerCase();
+};
+var eventTypes = ['created', 'mounted', 'activated', 'beforeDestroy', 'destroyed', 'event.clearActived', 'event.clearFilter', 'event.showMenu', 'event.keydown'].map(toType);
+var _storeMap = {};
+var Interceptor = {
+  mixin: function mixin(map) {
+    each(map, function (callback, type) {
+      return Interceptor.add(type, callback);
+    });
+    return Interceptor;
+  },
+  get: function get(type) {
+    return _storeMap[toType(type)] || [];
+  },
+  add: function add(type, callback) {
+    type = toType(type);
+    if (callback && ~eventTypes.indexOf(type)) {
+      var eList = _storeMap[type];
+      if (!eList) {
+        eList = _storeMap[type] = [];
+      }
+      eList.push(callback);
+    }
+    return Interceptor;
+  },
+  "delete": function _delete(type, callback) {
+    var eList = _storeMap[toType(type)];
+    if (eList) {
+      remove(eList, function (cb) {
+        return cb === callback;
+      });
+    }
+    return Interceptor;
+  }
+};
+export default Interceptor;

package/grid/core/storeMap.js

@@ -0,0 +1,19 @@
+var _storeMap = {};
+var storeMap = {
+  mixin: function mixin(map) {
+    Object.assign(_storeMap, map);
+    return storeMap;
+  },
+  get: function get(type) {
+    return _storeMap[type];
+  },
+  add: function add(type, callback) {
+    _storeMap[type] = callback;
+    return storeMap;
+  },
+  "delete": function _delete(type) {
+    delete _storeMap[type];
+    return storeMap;
+  }
+};
+export default storeMap;

package/grid/plugins/export.js

@@ -0,0 +1,169 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import { xss } from '@opentiny/vue-renderless/common/xss.js';
+import browser from '@opentiny/vue-renderless/common/browser';
+import { toTreeArray } from '../static';
+import { getCellValue, getFuncText } from '../utils';
+import { exportExcel } from './exportExcel';
+var getCsvLabelData = function getCsvLabelData(columns, oData, tableElem) {
+  var trElemList = tableElem.querySelectorAll('.tiny-grid__body-wrapper.body__wrapper .tiny-grid-body__row');
+  var trData = [];
+  var _loop = function _loop(i, len) {
+    var item = {};
+    var trElem = trElemList[i];
+    columns.forEach(function (column) {
+      var cell = trElem.querySelector(".".concat(column.id));
+      item[column.id] = cell ? cell.innerText.trim() : '';
+    });
+    trData.push(item);
+  };
+  for (var i = 0, len = trElemList.length; i < len; i++) {
+    _loop(i, len);
+  }
+  return trData;
+};
+var getCsvData = function getCsvData(opts, oData, oColumns, tableElem) {
+  var isOriginal = opts.original;
+  var columns = opts.columns ? opts.columns : oColumns;
+  if (opts.columnFilterMethod) {
+    columns = columns.filter(opts.columnFilterMethod);
+  }
+  var datas = opts.data ? opts.data : isOriginal ? oData : getCsvLabelData(columns, oData, tableElem);
+  if (opts.dataFilterMethod) {
+    datas = datas.filter(opts.dataFilterMethod);
+  }
+  return {
+    columns: columns,
+    datas: datas
+  };
+};
+var getCsvContent = function getCsvContent($table, opts, oColumns, oData) {
+  var isOriginal = opts.original;
+  var tableEl = $table.$el;
+  var tab = opts.useTabs === false ? '' : '\t';
+  var _getCsvData = getCsvData(opts, oData, oColumns, tableEl),
+    columns = _getCsvData.columns,
+    datas = _getCsvData.datas;
+  var content = datas.length ? "\uFEFF" : '';
+  var transfrom = function transfrom(str) {
+    if (typeof str === 'string' && str.replace(/ /g, '').match(/[\s,"]/)) {
+      str = '"' + str.replace(/"/g, '""') + '"';
+    }
+    return str + tab;
+  };
+  if (opts.isHeader) {
+    content += columns.map(function (_ref) {
+      var own = _ref.own;
+      return transfrom(getFuncText(own.title || own.label));
+    }).join(',') + '\n';
+  }
+  datas.forEach(function (row, rowIndex) {
+    if (isOriginal) {
+      content += columns.map(function (column) {
+        if (column.type === 'index') {
+          return column.indexMethod ? column.indexMethod(rowIndex) : rowIndex + 1;
+        }
+        return transfrom(getCellValue(row, column));
+      }).join(',') + '\n';
+    } else {
+      content += columns.map(function (column) {
+        return transfrom(row[column.id]);
+      }).join(',') + '\n';
+    }
+  });
+  if (opts.isFooter) {
+    var footerData = $table.footerData;
+    var footers = opts.footerFilterMethod ? footerData.filter(opts.footerFilterMethod) : footerData;
+    var filterMaps = $table.tableColumn.map(function (column) {
+      return ~columns.indexOf(column);
+    });
+    footers.forEach(function (rows) {
+      content += rows.filter(function (val, colIndex) {
+        return filterMaps[colIndex];
+      }).join(',') + '\n';
+    });
+  }
+  return content;
+};
+var getCsvUrl = function getCsvUrl(opts, content) {
+  if (window.Blob && window.URL && window.URL.createObjectURL && browser.name !== 'safari') {
+    return URL.createObjectURL(new Blob([content], {
+      type: 'text/csv'
+    }));
+  }
+  return "data:attachment/csv;charset=utf-8,".concat(encodeURIComponent(content));
+};
+var downloadCsc = function downloadCsc(options, content) {
+  if (!options.download) {
+    return Promise.resolve(content);
+  }
+  if (navigator.msSaveBlob && window.Blob) {
+    navigator.msSaveBlob(new Blob([content], {
+      type: 'text/csv;charset=utf-8'
+    }), options.filename);
+  } else if (browser.name === 'ie') {
+    var win = window.top.open('about:blank', '_blank');
+    win.opener = null;
+    win.document.charset = 'utf-8';
+    win.document.write(content);
+    win.document.close();
+    win.document.execCommand('SaveAs', options.filename);
+    win.close();
+  } else {
+    var linkElem = document.createElement('a');
+    linkElem.target = '_blank';
+    linkElem.rel = 'noopener noreferrer';
+    linkElem.download = options.filename;
+    linkElem.href = xss.filterUrl(getCsvUrl(options, content));
+    document.body.appendChild(linkElem);
+    linkElem.click();
+    document.body.removeChild(linkElem);
+  }
+};
+export default {
+  _exportCsv: function _exportCsv(options) {
+    var visibleColumn = this.visibleColumn,
+      scrollXLoad = this.scrollXLoad,
+      scrollYLoad = this.scrollYLoad,
+      treeConfig = this.treeConfig;
+    var mergedOpts = _objectSpread({
+      columns: null,
+      columnFilterMethod: function columnFilterMethod(column) {
+        return column.property && ['index', 'selection', 'radio'].indexOf(column.type) === -1;
+      },
+      download: true,
+      data: null,
+      dataFilterMethod: null,
+      filename: 'table.csv',
+      footerFilterMethod: null,
+      isHeader: true,
+      isFooter: true,
+      original: !!treeConfig
+    }, options);
+    if (mergedOpts.filename.indexOf('.csv') === -1) {
+      mergedOpts.filename += '.csv';
+    }
+    if (!mergedOpts.original) {
+      if (scrollXLoad || scrollYLoad) {
+        mergedOpts.original = true;
+      }
+    }
+    var columns = visibleColumn;
+    var oData = this.tableFullData;
+    if (treeConfig) {
+      oData = toTreeArray(oData, treeConfig);
+    }
+    oData.forEach(function (value) {
+      Object.keys(value).forEach(function (key) {
+        if (value[key] === 0) {
+          value[key] = '0';
+        }
+      });
+    });
+    return downloadCsc(mergedOpts, getCsvContent(this, mergedOpts, columns, oData));
+  },
+  _exportExcel: function _exportExcel(options) {
+    exportExcel(this, options);
+  }
+};