vue-ant-patterns/biz-lib/b-vm/mixinRender.js

vue-ant-patterns

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray');

var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2);

var _slicedToArray2 = require('babel-runtime/helpers/slicedToArray');

var _slicedToArray3 = _interopRequireDefault(_slicedToArray2);

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _utils = require('../../lib/_utils');

var _defaultProps = require('./defaultProps');

var _defaultProps2 = _interopRequireDefault(_defaultProps);

var _mixinBase = require('./mixinBase');

var _mixinBase2 = _interopRequireDefault(_mixinBase);

var _utils2 = require('./utils');

var _extend = require('extend');

var _extend2 = _interopRequireDefault(_extend);

var _Section = require('./Section');

var _Section2 = _interopRequireDefault(_Section);

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

/*
 * @Author: w.pengfei
 * @Date: 2020-06-22 13:29:49
 * @LastEditTime: 2021-04-22 10:21:34
 * @Description: ''
 * @LastEditors: w.pengfei
 */
var cardStatusToStr = ['view', 'edit'];

exports['default'] = {
  name: 'RenderMixin',
  mixins: [_mixinBase2['default']],
  props: (0, _extends3['default'])({}, _defaultProps2['default']),
  data: function data() {
    // 获取到 区段插槽
    var sectionSlot = this.getSectionSlots();
    // 获取到字段插槽
    var fieldSlot = this.getFieldSlots();
    return {
      sectionSlot: sectionSlot,
      fieldSlot: fieldSlot,
      singleEditStatus: {}
    };
  },
  mounted: function mounted() {
    this.sectionSlot = this.getSectionSlots();
    this.fieldSlot = this.getFieldSlots();
  },


  methods: {
    /**
     * 渲染区段
     */
    renderSection: function renderSection(panel) {
      var _panel$sectionList = panel.sectionList,
          sectionList = _panel$sectionList === undefined ? [] : _panel$sectionList;

      var _getSlots = this.getSlots('section'),
          firstSlot = _getSlots.firstSlot,
          lastSlot = _getSlots.lastSlot;
      /**
       * 新需求实现
       * 在没有区段的情况下, 需要能正常渲染区段插槽
       * 在判断是否有区段信息时, 同时也需要判断下是否有 首尾插槽
       * 在没有区段信息时, 需支持首尾插槽
       */


      var isSlot = !firstSlot && !lastSlot;
      if ((!sectionList || !sectionList.length) && isSlot) {
        return this.renderEmpty();
      }

      return this.renderSectionItem(panel);
    },

    /**
     * 渲染区段
     */
    renderSectionItem: function renderSectionItem(panel) {
      var _this = this;

      var h = this.$createElement;
      var $listeners = this.$listeners,
          isEdit = this.isEdit,
          langType = this.langType,
          $scopedSlots = this.$scopedSlots;
      var _panel$sectionList2 = panel.sectionList,
          sectionList = _panel$sectionList2 === undefined ? [] : _panel$sectionList2;
      var _$props = this.$props,
          vmStatus = _$props.vmStatus,
          sectionInfo = _$props.sectionInfo,
          sectionOptions = _$props.sectionOptions,
          sectionDefaultEdit = _$props.sectionDefaultEdit,
          sectionSingleEdit = _$props.sectionSingleEdit,
          hideKeys = _$props.forceHideSection,
          showKeys = _$props.forceShowSection;

      var _sectionInfo = (0, _slicedToArray3['default'])(sectionInfo, 3),
          sectionKey = _sectionInfo[0],
          sectionCode = _sectionInfo[1],
          sectionName = _sectionInfo[2];

      var _getSlots2 = this.getSlots('section'),
          firstSlot = _getSlots2.firstSlot,
          lastSlot = _getSlots2.lastSlot,
          afterSlot = _getSlots2.afterSlot,
          customSlot = _getSlots2.customSlot;

      /**
       * 排序
       */

      var cloneList = [].concat((0, _toConsumableArray3['default'])(sectionList));

      cloneList = cloneList.map(function (item) {
        if ((0, _utils.isVnode)(item)) return item;

        var isDisplay = item.isDisplay,
            code = item[sectionCode];


        if (hideKeys.includes(code)) {
          isDisplay = false;
        }
        if (!isDisplay && showKeys.includes(code)) {
          isDisplay = true;
        }

        if (isDisplay) {
          return item;
        }
        return null;
      }).filter(function (T) {
        return T;
      });

      /**
       * 排序, 根据后台返回的数据排序, 排序属性, displayNum
       */
      (0, _utils.sortList)(cloneList);

      var clonePanel = (0, _extend2['default'])({}, panel);
      var firstSlotRes = firstSlot ? (0, _utils2.filterSlot)(firstSlot({ panel: clonePanel })) : null;
      var lastSlotRes = lastSlot ? (0, _utils2.filterSlot)(lastSlot({ panel: clonePanel })) : null;

      if (firstSlotRes) {
        cloneList = [].concat((0, _toConsumableArray3['default'])(firstSlotRes), (0, _toConsumableArray3['default'])(cloneList));
      }
      if (lastSlotRes) {
        cloneList = [].concat((0, _toConsumableArray3['default'])(cloneList), (0, _toConsumableArray3['default'])(lastSlotRes));
      }

      return cloneList.map(function (item) {
        if ((0, _utils.isVnode)(item)) return item;
        var sCode = item[sectionCode];
        var vStatus = cardStatusToStr[Number(isEdit)];
        var vSingleEdit = sectionSingleEdit;
        var isConfig = item.isConfig;
        /**
         * 默认开启编辑的区段
         * 单区段编辑, 是否有默认编辑的区段
         * 默认开启编辑的区段, 优先级高于数据返回的配置项
         */

        if (sectionSingleEdit) {
          vStatus = cardStatusToStr[0];
          if (sectionDefaultEdit && sectionDefaultEdit.length) {
            vStatus = cardStatusToStr[Number(sectionDefaultEdit.includes(sCode))];
          }
        }
        /**
         * vm 模板数据返回的区段编辑, 优先级高于 vm.props.sectionSingleEdit
         * 同时需要 vm.props.sectionSingleEdit 为 true
         */
        if (isConfig !== 'undefined' && sectionSingleEdit) {
          vSingleEdit = isConfig;
        }
        var sectionProps = {
          props: (0, _extends3['default'])({}, _this.$props, {
            sectionSingleEdit: vSingleEdit,
            section: item,
            vmStatus: vStatus,
            // 单区段编辑, 控制编辑状态
            cardStatus: vStatus,
            panel: panel
          }),
          scopedSlots: (0, _extends3['default'])({}, $scopedSlots),
          on: (0, _extends3['default'])({}, $listeners),
          ref: sCode,
          key: sCode + '-section'
        };
        var card = h(_Section2['default'], sectionProps);

        var sectionNodes = [card];

        var afterSlotRes = afterSlot ? (0, _utils2.filterSlot)(afterSlot({ panel: clonePanel, section: item })) : null;
        var customSlotRes = customSlot ? (0, _utils2.filterSlot)(customSlot({ panel: clonePanel, section: item })) : null;

        if (customSlotRes && customSlotRes.length) {
          sectionNodes = [customSlotRes];
        }

        if (afterSlotRes && afterSlotRes.length) {
          sectionNodes = [].concat((0, _toConsumableArray3['default'])(sectionNodes), (0, _toConsumableArray3['default'])(afterSlotRes));
        }

        return sectionNodes;
      });
    }
  }
};