@opentiny/vue-renderless 3.1.0-alpha.0 → 3.5.0

package/user/index.js

@@ -0,0 +1,634 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import debounce from '@opentiny/vue-renderless/common/deps/debounce';
+import { toDateStr } from '@opentiny/vue-renderless/common/date';
+import { toJsonStr } from '@opentiny/vue-renderless/common/object';
+import { toJson } from '@opentiny/vue-renderless/common/string';
+import { log } from '@opentiny/vue-renderless/common';
+var request = {
+  timmer: null,
+  group: {},
+  requests: [],
+  cache: {},
+  batch: 0,
+  addRequest: function addRequest(_ref) {
+    var _this = this;
+    var param = _ref.param,
+      cb = _ref.cb;
+    this.requests.push({
+      param: param,
+      cb: cb,
+      result: []
+    });
+    var valueField = param.valueField,
+      queryIds = param.queryIds;
+    if (!this.group[valueField]) {
+      this.group[valueField] = [];
+    }
+    queryIds.forEach(function (id) {
+      if (!~_this.group[valueField].indexOf(id)) {
+        !_this.group[valueField].push(id);
+      }
+    });
+  },
+  removeRequest: function removeRequest(item) {
+    var idx = this.requests.indexOf(item);
+    this.requests.splice(idx, 1);
+  },
+  clearRequest: function clearRequest() {
+    this.timmer = null;
+    this.group = {};
+    this.requests = [];
+    this.cache = {};
+    this.batch = 0;
+  },
+  getParams: function getParams() {
+    var _this2 = this;
+    var args = [];
+    var _loop = function _loop(key) {
+      if (Object.prototype.hasOwnProperty.call(_this2.group, key)) {
+        var all = _this2.group[key];
+        var items = _this2.splitArr(all, _this2.batch);
+        if (key === 'userId') {
+          args.push.apply(args, _toConsumableArray(items.map(function (item) {
+            return item.join(',');
+          })));
+        } else {
+          args.push.apply(args, _toConsumableArray(items.map(function (item) {
+            return _defineProperty({
+              valueField: key,
+              valueSplit: item.valueSplit
+            }, key, item.join(','));
+          })));
+        }
+      }
+    };
+    for (var key in this.group) {
+      _loop(key);
+    }
+    return args;
+  },
+  setCache: function setCache(data, valueField) {
+    var _this3 = this;
+    var me = this;
+    if (valueField && !this.group[valueField]) {
+      this.group[valueField] = [];
+    }
+    data.forEach(function (item) {
+      for (var key in _this3.group) {
+        if (Object.prototype.hasOwnProperty.call(_this3.group, key)) {
+          if (!me.cache[key]) {
+            me.cache[key] = {};
+          }
+          me.cache[key][item[key]] = item;
+        }
+      }
+    });
+  },
+  singleRequest: function singleRequest(param, api, cb) {
+    var queryIds = param.queryIds,
+      valueField = param.valueField,
+      valueSplit = param.valueSplit;
+    var queryStr = queryIds.join(',');
+    var params = valueField === 'userId' ? queryStr : _defineProperty({
+      valueField: valueField,
+      valueSplit: valueSplit
+    }, valueField, queryStr);
+    api.fetchW3Accounts(params).then(function (data) {
+      cb(data);
+    })["catch"](function (e) {
+      cb({
+        error: e
+      });
+    });
+  },
+  batchRequest: function batchRequest(api) {
+    var _this4 = this;
+    var me = this;
+    var reqParamsSeq = me.getParams();
+    var reqLen = reqParamsSeq.length;
+    reqParamsSeq.forEach(function (params) {
+      api.fetchW3Accounts(params).then(function (data) {
+        me.setCache(data);
+        me.requests.slice().forEach(function (reqItem) {
+          var param = reqItem.param,
+            cb = reqItem.cb;
+          var queryIds = param.queryIds,
+            valueField = param.valueField;
+          queryIds.forEach(function (id) {
+            var user = me.cache[valueField] && me.cache[valueField][id];
+            user && reqItem.result.indexOf(user) === -1 && reqItem.result.push(user);
+          });
+          if (reqItem.result.length === queryIds.length) {
+            me.removeRequest(reqItem);
+            cb(reqItem.result);
+          }
+        });
+      })["finally"](function () {
+        reqLen--;
+        var errors = [];
+        if (!reqLen) {
+          _this4.requests.forEach(function (_ref4) {
+            var cb = _ref4.cb,
+              result = _ref4.result,
+              param = _ref4.param;
+            var queryIds = param.queryIds,
+              valueField = param.valueField;
+            cb(result);
+            queryIds.forEach(function (id) {
+              if (!_this4.cache[valueField] || !_this4.cache[valueField][id]) {
+                errors.push(id);
+              }
+            });
+          });
+          errors.length && log("user [".concat(errors.join(','), "] not found"), 'warn');
+          _this4.clearRequest();
+        }
+      });
+    });
+  },
+  setBatch: function setBatch(batch) {
+    if (typeof batch !== 'number' || batch <= 0) {
+      batch = 50;
+    }
+    if (batch <= 500 && this.batch < batch) {
+      this.batch = batch;
+    }
+  },
+  getusers: function getusers(_ref5) {
+    var _this5 = this;
+    var param = _ref5.param,
+      api = _ref5.api,
+      batch = _ref5.batch,
+      cb = _ref5.cb;
+    if (batch !== false) {
+      this.setBatch(batch);
+      clearTimeout(this.timmer);
+      this.addRequest({
+        param: param,
+        cb: cb
+      });
+      this.timmer = setTimeout(function () {
+        return _this5.batchRequest(api);
+      }, 100);
+    } else {
+      this.singleRequest(param, api, cb);
+    }
+  },
+  splitArr: function splitArr(arr, num) {
+    var result = [];
+    if (arr.length && num > 0) {
+      var just = arr.length % num === 0;
+      var part = Math.floor(arr.length / num);
+      var len = just ? part : part + 1;
+      for (var i = 0; i < len; i++) {
+        result.push(arr.slice(i * num, (i + 1) * num));
+      }
+    }
+    return result;
+  }
+};
+export var suggestUser = function suggestUser(api) {
+  return function (query) {
+    return new Promise(function (resolve, reject) {
+      api.fetchSuggestUser(query).then(function (users) {
+        if (users.length) {
+          resolve(users);
+        } else {
+          resolve({
+            invalid: query
+          });
+        }
+      })["catch"](reject);
+    });
+  };
+};
+export var updateOptions = function updateOptions(_ref6) {
+  var props = _ref6.props,
+    state = _ref6.state,
+    nextTick = _ref6.nextTick;
+  return function (usersList) {
+    var valueField = props.valueField,
+      textField = props.textField,
+      noDataText = props.noDataText;
+    var values = [].concat(state.user || []);
+    var options = [].concat(state.selected);
+    var hides = [];
+    var count = 0;
+    usersList.forEach(function (users) {
+      users.forEach(function (user) {
+        var u = user[valueField];
+        user._show = true;
+        count++;
+        if (!~values.indexOf(u)) {
+          values.push(u);
+          options.push(user);
+        } else {
+          hides.push(u);
+        }
+      });
+    });
+    state.selected.forEach(function (us) {
+      us._show = !!~hides.indexOf(us[valueField]);
+    });
+    !count && !noDataText && (state.visible = false);
+    if (!props.sortByFetchData) {
+      options.sort(function (a, b) {
+        return a[textField] > b[textField] ? 1 : -1;
+      });
+    }
+    state.options = options;
+    return nextTick();
+  };
+};
+export var autoSelect = function autoSelect(_ref7) {
+  var props = _ref7.props,
+    state = _ref7.state,
+    nextTick = _ref7.nextTick;
+  return function (usersList) {
+    if (!usersList.length) {
+      return nextTick();
+    }
+    var values = props.multiple ? [].concat(state.user) : [];
+    usersList.forEach(function (list) {
+      if (list.length === 1) {
+        var value = list[0][props.valueField];
+        !~values.indexOf(value) && values.push(value);
+        if (props.autoClose) {
+          state.visible = false;
+        }
+      }
+    });
+    if (!values.length) {
+      return nextTick();
+    }
+    if (props.multiple) {
+      state.user.length !== values.length && (state.user = values);
+    } else {
+      state.user = values[0];
+    }
+    return nextTick();
+  };
+};
+export var searchMethod = function searchMethod(_ref8) {
+  var api = _ref8.api,
+    props = _ref8.props,
+    state = _ref8.state,
+    emit = _ref8.emit;
+  return debounce(props.delay, function (query) {
+    if (query && query.length >= props.suggestLength) {
+      state.loading = true;
+      state.visible = true;
+      var multiple = props.multiple;
+      var suggests;
+      if (multiple) {
+        suggests = query.split(new RegExp("[".concat(props.textSplit.split('').join('\\'), "]"))).filter(function (q) {
+          return q && q.length >= props.suggestLength;
+        }).map(function (q) {
+          return api.suggestUser(q.trim());
+        });
+      } else {
+        suggests = [api.suggestUser(query.trim())];
+      }
+      Promise.all(suggests).then(function (users) {
+        var failList = [];
+        var usersList = [];
+        users.forEach(function (item) {
+          if (item.invalid) {
+            failList.push(item.invalid);
+          } else {
+            usersList.push(item);
+          }
+        });
+        if (failList.length) {
+          emit('error', failList);
+        }
+        api.updateOptions(usersList).then(function () {
+          api.autoSelect(usersList).then(function () {
+            api.userChange(state.user);
+            state.loading = false;
+          });
+        });
+      });
+    }
+  });
+};
+export var setSelected = function setSelected(_ref9) {
+  var api = _ref9.api,
+    props = _ref9.props,
+    state = _ref9.state;
+  return function (value) {
+    var values = Array.isArray(value) ? value.map(function (v) {
+      return String(v).toLocaleLowerCase();
+    }) : String(value).toLocaleLowerCase().split(props.valueSplit);
+    state.selected = state.options.filter(function (user) {
+      return ~values.indexOf(String(user[props.valueField]).toLocaleLowerCase());
+    });
+    props.cache && api.cacheUser(state.selected);
+  };
+};
+export var userChange = function userChange(_ref10) {
+  var api = _ref10.api,
+    emit = _ref10.emit,
+    props = _ref10.props,
+    state = _ref10.state;
+  return function (value) {
+    var multiple = props.multiple;
+    var newVal = multiple && Array.isArray(value) ? value.join(props.valueSplit) : String(value || '');
+    api.setSelected(newVal);
+    if (typeof state.lastValue === 'string' && state.lastValue !== null && state.lastValue.toLocaleLowerCase() !== newVal.toLocaleLowerCase()) {
+      emit('update:modelValue', newVal);
+      emit('change', newVal, state.selected);
+    }
+    state.lastValue = newVal;
+  };
+};
+var syncCacheIds = function syncCacheIds(ids, props, queryIds, cacheData) {
+  var valueField = props.valueField,
+    cacheFields = props.cacheFields,
+    cacheKey = props.cacheKey;
+  var cacheUsers = toJson(window.localStorage.getItem(cacheKey)) || {};
+  ids.forEach(function (id) {
+    if (cacheUsers[id]) {
+      var _cacheUser = cacheUsers[id];
+      var textField = props.textField === 'userCN' || props.textField === 'userId' || props.textField === 'dept' ? '' : props.textField;
+      if (textField !== '' && !_cacheUser.a) {
+        window.localStorage.removeItem(cacheKey);
+        queryIds.push(id);
+      }
+      var user = _defineProperty({
+        userId: _cacheUser.i,
+        userCN: _cacheUser.u,
+        dept: _cacheUser.d,
+        employeeNumber: _cacheUser.e
+      }, textField, _cacheUser.a);
+      cacheFields.forEach(function (field) {
+        user[field] = _cacheUser[field];
+      });
+      cacheData.push(Object.assign(user, _defineProperty({}, valueField, cacheUsers[id].p || cacheUsers[id].i)));
+    } else {
+      queryIds.push(id);
+    }
+  });
+};
+export var getUsers = function getUsers(_ref11) {
+  var api = _ref11.api,
+    props = _ref11.props,
+    state = _ref11.state;
+  return function (value) {
+    var valueField = props.valueField,
+      cache = props.cache;
+    var ids = Array.isArray(value) ? value : value.split(props.valueSplit);
+    var cacheData = [];
+    var queryIds = cache ? [] : ids;
+    if (cache) {
+      syncCacheIds(ids, props, queryIds, cacheData);
+      request.setCache(cacheData, valueField);
+      if (!queryIds.length) {
+        return Promise.resolve(cacheData);
+      }
+    }
+    var param = {
+      valueSplit: props.valueSplit,
+      valueField: valueField,
+      queryIds: queryIds
+    };
+    return new Promise(function (resolve, reject) {
+      var cb = function cb(data) {
+        if (data.error) {
+          reject(data.error);
+        } else {
+          resolve(data.concat(cacheData));
+        }
+      };
+      request.getusers({
+        param: param,
+        api: api,
+        batch: state.batch,
+        cb: cb
+      });
+    });
+  };
+};
+export var updateCache = function updateCache(_ref12) {
+  var props = _ref12.props,
+    state = _ref12.state;
+  return function () {
+    var users = toJson(window.localStorage.getItem(props.cacheKey)) || {};
+    var currDate = toDateStr(new Date(), 'yyyyMMdd');
+    if (currDate !== users.t) {
+      users.t = currDate;
+      for (var u in users) {
+        if (u !== 't') {
+          var user = users[u];
+          if (user.r > 0) {
+            user.r = 0;
+          } else {
+            user.r--;
+          }
+        }
+      }
+    }
+    state.cache = users;
+  };
+};
+export var saveCache = function saveCache(_ref13) {
+  var props = _ref13.props;
+  return function (cache) {
+    window.localStorage.setItem(props.cacheKey, toJsonStr(cache));
+  };
+};
+export var cacheUser = function cacheUser(_ref14) {
+  var api = _ref14.api,
+    props = _ref14.props,
+    service = _ref14.service;
+  return function (users) {
+    var valueField = props.valueField,
+      cacheKey = props.cacheKey;
+    var cacheUser = toJson(window.localStorage.getItem(cacheKey)) || {};
+    var cacheFields = service.userCache;
+    var user;
+    var _loop2 = function _loop2() {
+      var u = users[i];
+      var key = u[valueField];
+      user = cacheUser[key];
+      if (user) {
+        user.r++;
+      } else {
+        var us = {
+          p: u[valueField],
+          i: u[cacheFields.userId],
+          u: u[cacheFields.userCN],
+          d: u[cacheFields.dept],
+          e: u[cacheFields.eno],
+          a: ~['userCN', 'userId', 'dept'].indexOf(props.textField) ? null : u[props.textField],
+          r: 0
+        };
+        props.cacheFields.forEach(function (field) {
+          us[field] = u[field];
+        });
+        cacheUser[key] = us;
+      }
+    };
+    for (var i = 0; i < users.length; i++) {
+      _loop2();
+    }
+    try {
+      api.saveCache(cacheUser);
+    } catch (e) {
+      var sortUsers = Object.keys(cacheUser).sort(function (a, b) {
+        return cacheUser[a].r < cacheUser[b].r ? 1 : -1;
+      });
+      var cutUser = sortUsers.splice(0, sortUsers.length / 2);
+      var newCache = {};
+      for (var _i in cutUser) {
+        if (Object.prototype.hasOwnProperty.call(cutUser, _i)) {
+          newCache[cutUser[_i]] = cacheUser[cutUser[_i]];
+        }
+      }
+      api.saveCache(newCache);
+    }
+  };
+};
+export var useSortable = function useSortable(_ref15) {
+  var api = _ref15.api,
+    props = _ref15.props,
+    state = _ref15.state,
+    refs = _ref15.refs;
+  return function () {
+    var selectDom = refs.select.$el;
+    if (props.sortable && props.multiple && !state.sortable) {
+      var tagsDom = selectDom.querySelector('.aui-select__tags>span');
+      state.sortable = props.sortable.create(tagsDom, {
+        handle: '.aui-tag',
+        ghostClass: 'aui-user__ghost',
+        onEnd: function onEnd(_ref16) {
+          var newIndex = _ref16.newIndex,
+            oldIndex = _ref16.oldIndex;
+          var currUser = state.user.splice(oldIndex, 1)[0];
+          state.user.splice(newIndex, 0, currUser);
+          api.userChange(state.user);
+        }
+      });
+    }
+  };
+};
+export var visibleChange = function visibleChange(_ref17) {
+  var state = _ref17.state,
+    emit = _ref17.emit;
+  return function (show) {
+    if (!show) {
+      state.visible = show;
+      state.options = state.selected.map(function (user) {
+        return Object.assign(user, {
+          _show: true
+        });
+      });
+    }
+    emit('visible-change', show);
+  };
+};
+export var initUser = function initUser(_ref18) {
+  var api = _ref18.api,
+    props = _ref18.props,
+    state = _ref18.state;
+  return function (value) {
+    if (value === state.lastValue) {
+      return;
+    }
+    state.user = !props.multiple ? '' : [];
+    if (typeof value === 'number') {
+      value = String(value);
+    }
+    if (!value) {
+      state.options = [];
+      state.selected = [];
+      api.userChange(value);
+      return;
+    }
+    value && api.getUsers(value).then(function (info) {
+      info.sort(function (a, b) {
+        return value.indexOf(String(a[props.valueField])) > value.indexOf(String(b[props.valueField])) ? 1 : -1;
+      });
+      var list = info.map(function (user) {
+        user._show = true;
+        return user[props.valueField];
+      });
+      state.options = info;
+      state.user = props.multiple ? list : list[0];
+      api.userChange(value);
+    });
+  };
+};
+export var handleBlur = function handleBlur(_ref19) {
+  var constants = _ref19.constants,
+    dispatch = _ref19.dispatch,
+    state = _ref19.state;
+  return function () {
+    dispatch(constants.COMPONENT_NAME.FormItem, constants.EVENT_NAME.FormBlur, state.user);
+  };
+};
+export var initService = function initService(_ref20) {
+  var props = _ref20.props,
+    service = _ref20.service;
+  var noopFnCreator = function noopFnCreator(propName) {
+    return function () {
+      if (propName) {
+        return Promise.reject(new Error("[TINY Error][User]] Prop ".concat(propName, " is not configured")));
+      } else {
+        return Promise.reject(new Error('[TINY Error][User]] This component depends on @opentiny/vue-service'));
+      }
+    };
+  };
+  var $service = service || {};
+  var _$service$common = $service.common,
+    common = _$service$common === void 0 ? {} : _$service$common,
+    _$service$setting = $service.setting,
+    setting = _$service$setting === void 0 ? {} : _$service$setting,
+    _$service$base = $service.base,
+    base = _$service$base === void 0 ? {} : _$service$base;
+  var fetchUser = $service.fetchUser,
+    fetchW3Accounts = $service.fetchW3Accounts,
+    fetchSuggestUser = $service.fetchSuggestUser,
+    fetchUserByUserId = $service.fetchUserByUserId;
+  var _setting$options = setting.options,
+    options = _setting$options === void 0 ? {} : _setting$options;
+  var _options$UserCache = options.UserCache,
+    UserCache = _options$UserCache === void 0 ? {
+      uuid: 'uuid',
+      userId: 'userId',
+      userCN: 'userCN',
+      dept: 'dept',
+      eno: 'employeeNumber'
+    } : _options$UserCache,
+    _options$User = options.User,
+    User = _options$User === void 0 ? {
+      batch: 50
+    } : _options$User;
+  return {
+    fetchUser: props.fetchUser || fetchUser || noopFnCreator('fetchUser'),
+    fetchW3Accounts: props.fetchW3Accounts || fetchW3Accounts || noopFnCreator('fetchW3Accounts'),
+    fetchSuggestUser: props.fetchSuggestUser || fetchSuggestUser || noopFnCreator('fetchSuggestUser'),
+    fetchUserByUserId: props.fetchUserByUserId || fetchUserByUserId || noopFnCreator('fetchUserByUserId'),
+    getUserImageUrl: props.getUserImageUrl || common.getUserImageUrl || noopFnCreator('getUserImageUrl'),
+    getLangData: props.getLangData || base.getLangData || noopFnCreator('getLangData'),
+    getUserInfo: props.getUserInfo || base.getUserInfo || noopFnCreator('getUserInfo'),
+    userCache: props.UserCache || UserCache,
+    batch: User.batch
+  };
+};
+export var filter = function filter(_ref21) {
+  var props = _ref21.props,
+    state = _ref21.state;
+  return function () {
+    if (props.multiple && props.hideSelected) {
+      var selectedUsers = state.user.map(function (value) {
+        return typeof value === 'string' ? value.toLocaleLowerCase() : value;
+      });
+      return state.options.filter(function (user) {
+        return !~selectedUsers.indexOf(typeof user[props.valueField] === 'string' ? user[props.valueField].toLocaleLowerCase() : user[props.valueField]);
+      });
+    }
+    return state.options;
+  };
+};