zcloud-ui/lib/utils/handleData.js

A Component Library for Vue.js.

'use strict';

exports.__esModule = true;

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

exports.default = handleData;

var _axios = require('zcloud-ui/lib/utils/axios');

var _axios2 = _interopRequireDefault(_axios);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

/**
 * @description: 用法
 * @return {*}
 */
// this.$template.handleTemplateData({
// 	dataName: 'formData',
// 	modelName: 'model',
// 	watchName: "xxxx",
// 	vue: this,
// })

/**
 * 处理数据 用处：需要远程请求数据  配置paramsUrl：“。。。。”
 *
 * @param {Object} dataName 数据源名字
 * @param {Object} modelName 组件中v-model数据 名字
 * @param {Object} watchName 保证监听属性得唯一性（组件复用得时候用到）
 * @param {Object} initData 给模板一个原始data 里面包含模板得所有属性已经默认值得处理 （这里用于 表格数据切换 需要重置form）
 * @param {Object} vue vue指针
 */
var watchsBox = {};

function handleData(options) {
  watchsBox = {};
  var vue = options.vue || {};
  var templetList = vue[options.dataName] || [];
  //   初始化数据 赋值
  var model = vue[options.modelName];
  templetList.forEach(function (it) {
    // 部门的下拉 treeSelect 特殊处理
    if (it.type === 'treeSelect') {
      vue.$set(vue[options.modelName], it.value, model[it.value] !== undefined && model[it.value] !== null && model[it.value] !== '' ? model[it.value] : null);
    } else {
      vue.$set(vue[options.modelName], it.value, model[it.value] !== undefined && model[it.value] !== null && model[it.value] !== '' ? model[it.value] : it.type === 'checkbox' || it.multiple || it.props && it.props.multiple ? [] : '');
    }
  });
  // 处理下watch
  var watchName = options.watchName || 'commond';

  if (!watchsBox[watchName]) {
    watchsBox[watchName] = new Map();
  }

  for (var _iterator = templetList, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
    var _ref;

    if (_isArray) {
      if (_i >= _iterator.length) break;
      _ref = _iterator[_i++];
    } else {
      _i = _iterator.next();
      if (_i.done) break;
      _ref = _i.value;
    }

    var templet = _ref;

    doTemplateAjax(templet, options);
  }
}

/**
 * 处理单个模板 templet
 *
 * @param {Object} dataName 数据源名字
 * @param {Object} modelName 组件中v-model数据 名字
 * @param {Object} watchName 保证监听属性得唯一性（组件复用得时候用到）
 * @param {Object} vue vue指针
 * @param {Object} isNoFirst 监听触发的时候为true
 */
var doTemplateAjax = function doTemplateAjax(templet, options) {
  var isNoFirst = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;

  var modelName = options.modelName;
  var vue = options.vue;
  // let watchName = options.watchName
  // 后续这里加类型 判断是否有接口请求
  if (templet.type === 'select' || templet.type === 'cascader') {
    if (templet.urlBox && templet.urlBox.baseUrl) {
      var _getParams = getParams(templet, options),
          url = _getParams.url,
          params = _getParams.params,
          initParams = _getParams.initParams;
      // // 判断接口是否需要model中得其他参数


      var isPost = true;
      for (var item in initParams) {
        if (initParams[item] === '' || initParams[item] === null || initParams[item] === undefined || Array.isArray(initParams[item]) && initParams[item].length === 0) {
          isPost = false;
          break;
        }
      }
      if (isPost) {
        (0, _axios2.default)(url, _extends({
          apiNum: templet.urlBox.apiNum || 0,
          returnAll: 1,
          ignoreRepeat: true,
          authCode: templet.urlBox.authCode
        }, params)).then(function (res) {
          // 支持两者 1.res.result 为list  2.res.result.list 3.res.result.row
          if (res.result && (Array.isArray(res.result) || res.result.list && Array.isArray(res.result.list) || res.datresulta.row && Array.isArray(res.result.row))) {
            var isHas = false;
            var list = res.result;
            if (res.result.list && Array.isArray(res.result.list)) {
              list = res.result.list;
            }
            if (res.result.row && Array.isArray(res.result.row)) {
              list = res.result.row;
            }
            list.forEach(function (item) {
              // 设置自定义的key value
              if (templet.urlBox.dataUrlDes) {
                item.typename = item[templet.urlBox.dataUrlDes.key];
                if (templet.urlBox.dataUrlDes.key1) {
                  item.typename = item.typename + '(' + item[templet.urlBox.dataUrlDes.key1] + ')';
                }
                item.typecode = item[templet.urlBox.dataUrlDes.value];
              }
              if (Array.isArray(vue[modelName][templet.value]) && vue[modelName][templet.value].indexOf(item.typecode) !== -1) {
                // 多选数组 说明原有得值 能匹配到数据
                isHas = true;
              } else if (vue[modelName][templet.value] === item.typecode) {
                // 说明原有得值 能匹配到数据
                isHas = true;
              }
            });

            // 未匹配到数组 重置值
            if (!isHas && isNoFirst) {
              doEmpty(vue, templet, modelName);
            }

            // 增加全部选项
            if (templet.urlBox.isAll && list.length > 0) {
              list.unshift({
                typename: '全部',
                typecode: '全部'
              });
              if (vue[modelName][templet.value].length === list.length - 1) {
                vue.$set(vue[modelName], [templet.value], ['全部']);
              }
            }

            options.vue.$set(templet, 'options', list);
          }
        }).catch(function (err) {
          console.log(err);
          options.vue.$set(templet, 'options', [{ typename: '接口请求数据错误1', typecode: 0, code: '1111' }, { typename: '接口请求数据错误2', typecode: 1, code: '1111' }]);
        });
      } else {
        // 这里应该不用重新赋值
        if (isNoFirst) {
          doEmpty(vue, templet, modelName);
        }
      }
    }
  }
};

/**
 * @description: 清空关联值
 * @param {*} vue
 * @param {*} templet
 * @param {*} modelName
 * @return {*}
 */
var doEmpty = function doEmpty(vue, templet, modelName) {
  if (templet.type === 'checkbox' || templet.multiple || templet.props && templet.props.multiple) {
    vue.$set(vue[modelName], [templet.value], []);
  } else {
    vue.$set(vue[modelName], [templet.value], '');
  }
};

/**
 * 处理url参数
 *
 * @param {Object} dataName 数据源名字
 * @param {Object} modelName 组件中v-model数据 名字
 * @param {Object} watchName 保证监听属性得唯一性（组件复用得时候用到）
 * @param {Object} vue vue指针
 */
var getParams = function getParams(templet, options) {
  var modelName = options.modelName;
  var vue = options.vue;
  var watchName = options.watchName;
  // 判断url 有没有参数
  var url = templet.urlBox.baseUrl;

  var initParams = {};
  // let headers = templet.headers || {}
  var paramsList = [];
  if (templet.urlBox.paramsUrl) {
    paramsList = templet.urlBox.paramsUrl.split('&');
  }
  // 处理参数 建立监听
  paramsList.forEach(function (element) {
    if (element.indexOf('=') >= 0) {
      var tempParams = element.split('=');
      initParams[tempParams[0]] = tempParams[1];
    } else {
      // 解析联动参数  xxx{aaa}
      var arr = element.split('$');
      initParams[arr[0]] = vue[modelName][arr[1]];
      if (!watchsBox[watchName].get(modelName + '.' + arr[1])) {
        // 因为这里有联动得参数，自身需要 建立监听
        vue.$watch(modelName + '.' + arr[1], function () {
          console.log('\u76D1\u542C\u6210\u529F\uFF0C\u518D\u6B21\u6267\u884C\u5BF9\u5E94\u5F97\u5355\u4E2A\u6A21\u677F\u6570\u636E' + modelName + '.' + arr[1], templet);
          // 监听变化之后，将相关联需要它作为参数得模板对应得字段设置为“”
          doTemplateAjax(templet, options, true);
        });
      }
      watchsBox[watchName].set(modelName + '.' + arr[1], true);
    }
  });

  var params = {};
  if (templet.urlBox.paramName) {
    params[templet.urlBox.paramName] = JSON.parse(JSON.stringify(initParams));
  } else {
    params = JSON.parse(JSON.stringify(initParams));
  }

  return { url: url, params: params, initParams: initParams };
};