vue-ant-patterns/biz-es/b-query-panel/ViewItem.js

vue-ant-patterns

import _mergeJSXProps from 'babel-helper-vue-jsx-merge-props';
import _defineProperty from 'babel-runtime/helpers/defineProperty';
import PropTypes from 'ant-design-vue/es/_util/vue-types';
import cx from 'classnames';
var ViewItem = {
  props: {
    prefixCls: PropTypes.string.def('depot-dquerypanel-viewItem'),
    selected: PropTypes.bool.def(false),
    conditionItem: PropTypes.object.def({}),
    editConViewVisible: PropTypes.bool
  },
  data: function data() {
    return {
      selState: this.selected
    };
  },

  watch: {
    selected: function selected(val, oval) {
      this.selState = val;
    }
  },
  methods: {
    switchState: function switchState() {
      this.$emit('selectview', this.conditionItem.id);
      // this.selState = !this.selState;
    },
    delView: function delView() {
      this.$emit('delView', this.conditionItem);
    }
  },
  render: function render() {
    var _cx, _cx2;

    var h = arguments[0];
    var prefixCls = this.prefixCls,
        conditionItem = this.conditionItem;

    var itemProps = {
      'class': cx((_cx = {}, _defineProperty(_cx, '' + prefixCls, true), _defineProperty(_cx, prefixCls + '-select', this.selState), _cx))
    };
    var selectIcon = {
      'class': cx((_cx2 = {}, _defineProperty(_cx2, prefixCls + '-selectIcon', true), _defineProperty(_cx2, prefixCls + '-selectIcon-hidden', !this.selState), _cx2))
    };
    return h('a-badge', [this.editConViewVisible ? h(
      'div',
      { slot: 'count', 'class': 'bquerypanel-badgeDiv', on: {
          'click': this.delView
        }
      },
      ['x']
    ) : '', h(
      'div',
      _mergeJSXProps([itemProps, {
        on: {
          'click': this.switchState
        }
      }]),
      [h(
        'div',
        selectIcon,
        [h('a-icon', {
          attrs: {
            type: 'check'
          },
          style: { color: '#FFFFFF', transform: 'rotate(-45deg) scale(0.8)', margin: '-6px', fontSize: '12px' }
        })]
      ), conditionItem.name]
    )]);
  }
};

export default ViewItem;