page/src/js/yzToolbar.js

/**
 * Create by sxd
 * date 2018-04-11
 * Description:
 */
import $ from 'jquery';
import boxContent from './box/boxContent';

var yzToolbar = function(){
  this.menu = [{
    name: 'table',
    title: '表格',
    icon: 'fa-table'
  },{
    name: 'underline',
    title: '下划线',
    icon: 'fa-minus'
  },{
    name: 'picture',
    title: '图片',
    icon: 'fa-file-image-o',
  },{
    name: 'component',
    title: '组件框',
    icon: 'fa-square'
  },{
    name: 'subject',
    title: '无',
    icon: 'fa-list-alt'
  }];

  // 问题编号
  this.subjectNum = null;
  // 获取当前需要插入的Dom
  this.currentContent = null;

};

yzToolbar.prototype.toolbarContent = function () {
  // 形成toolbar 结构
  let toolDom = document.createElement('div');
  let ulDom = document.createElement('ul');
  this.menu.forEach( (item) => {
    let liDom = document.createElement('li');
    let spanDom = document.createElement('span');
    let liText = document.createTextNode(item.title);
    spanDom.className = `icon fa ${item.icon}`;
    liDom.setAttribute('title',item.title);
    liDom.appendChild(spanDom);
    liDom.appendChild(liText);
    ulDom.appendChild(liDom);
    if( item.name == 'component' ){
      liDom.addEventListener('click', () => {
        this.addComponent(liDom);
      },!0);
    }
  });
  toolDom.className = 'toolbar';
  toolDom.appendChild(ulDom);
  toolDom.setAttribute('id','toolbar');
  return toolDom;
};

yzToolbar.prototype.setSubjectTitle = function(pNum,content) {
  this.subjectNum = pNum;
  this.currentContent = content;
  this.menu.forEach( (item) => {
    if( item.name == 'subject' ){
      item.title = '正在编辑' + pNum;
      if( pNum == 'none' ){
        item.title = '无';
      }
    }
  });
};

yzToolbar.prototype.addComponent = function(dom) {
  if(this.subjectNum == 'none' || !this.subjectNum){
    alert('请选择主观题');return;
  }
  console.log(this.currentContent);
  this.currentContent.addComponent(1);
};

export default yzToolbar;