'add'

src/css/main.css

@@ -48,6 +48,7 @@
   width: 100%;
   box-sizing: border-box;
   margin: 0;
+  position: absolute;
 }
 .page-selection .page-selection-body .border-selection .border-main .question-selection .question-selection-title .sort, .page-selection .page-selection-body .border-selection .border-main .question-selection .question-selection-title .edit-title, .page-selection .page-selection-body .border-selection .border-main .question-selection .question-selection-title .score {
   display: inline-block;

src/css/style.css

@@ -54,9 +54,6 @@
   transform: translate3d(0px, 0px, 0px) rotateZ(0deg);
   opacity: 1;
 }
-.element-box {
-  overflow: hidden;
-}
 .element-box-contents.unedite{
   pointer-events: none;
 }
@@ -73,10 +70,6 @@
   writing-mode: horizontal-tb;
   min-height: 50px;
 }
- .element {
-  min-width: 1px;
-  min-height: 1px;
-}
 .eqc-select {
   z-index: 103;
   position: absolute;

src/js/box/boxContent.js

@@ -3,8 +3,27 @@
  * date 2018-04-11
  * Description:
  */
-const boxContent = function() {
-
+var boxContent = function(style) {
+  this.top =  style.top || '10px';
+  this.left = style.left || '10px';
+  this.width = style.width || '310px';
+  this.height = style.height || '50px';
+  this.isEditor = style.isEditor || false;
 };
 
-boxContent.prototype.boxTpl = '<div class="line-n line resizable"><div class="circle"></div></div><div class="line-e line resizable"><div class="circle"></div></div><div class="line-s line resizable"><div class="circle"></div></div><div class="line-w line resizable"><div class="circle"></div></div><div class="circle-nw circle resizable"></div><div class="circle-ne circle resizable"></div><div class="circle-se circle resizable"></div><div class="circle-sw circle resizable"></div>';
+boxContent.prototype.boxTpl = '<div class="line-n line resizable"><div class="circle"></div></div><div class="line-e line resizable"><div class="circle"></div></div><div class="line-s line resizable"><div class="circle"></div></div><div class="line-w line resizable"><div class="circle"></div></div><div class="circle-nw circle resizable"></div><div class="circle-ne circle resizable"></div><div class="circle-se circle resizable"></div><div class="circle-sw circle resizable"></div>';
+
+boxContent.prototype.addContent = function () {
+  // 实例化主件
+  let outDom = $('<div class="outer-box"></div>');
+  let elementBoxDom = $('<div class="element-box-contents"></div>');
+  let editorDom = $('<div class="element comp_paragraph editable-text"></div>');
+  let circleDom = $('<div class="eqc-select"></div>');
+  editorDom.text('双击此处进行编辑');
+  editorDom.css({ width: this.width, height: this.height, 'pointer-events': this.isEditor ? 'all' : 'none' });
+  elementBoxDom.append(editorDom.context());
+  outDom.css({ width: this.width, height: this.height,top: this.top, left: this.left }).append(elementBoxDom.context());
+  circleDom.append(this.boxTpl);
+  outDom.append(circleDom.context());
+  return outDom.context();
+};

src/js/main2.js

@@ -311,11 +311,15 @@ pageManager.prototype.renderToDom = function () {
     pages[index].renderToDom();
     this.domBody.append(pages[index].vDom);
   }
+  console.log(this.pages);
   $("#pages-box").replaceWith(this.domBody);
-  this.domBody.append(this.toolBar.toolbarContent());
   $('body').on('refreshPage', () => {
     this._refreshPage();
   });
+  this.refreshToolBar();
+  $('body').on('getNum', (e,data) => {
+    this.refreshToolBar(data);
+  });
 };
 
 /**
@@ -357,4 +361,16 @@ pageManager.prototype._refreshPage = function () {
   $('body').off('refreshPage');
   this.renderToDom();
 };
+
+/*
+* function 刷新顶部菜单栏
+*/
+pageManager.prototype.refreshToolBar = function(num) {
+  // 如果有参数说明要编辑题目
+  if(num){
+    this.toolBar.setSubjectTitle(num);
+    $('#toolbar').remove();
+  }
+  this.domBody.append(this.toolBar.toolbarContent());
+};
 export default pageManager

src/js/yzDom.js

@@ -96,7 +96,6 @@ yzDom.prototype.renderToDom = function () {
   this.border === 1 && (cssOption.border = '1px solid #bfbfbf');
   this.vDom.css(cssOption)
 
-
   //监听事件
   this._addLsiteners();
 }
@@ -128,6 +127,5 @@ yzDom.prototype._addLsiteners = function () {
       }
     });
   }
-  console.log(_this.vDom);
 };
 export default yzDom;

src/js/yzQuestion.js

@@ -44,7 +44,7 @@ yzQuestion.prototype._renderObjectiveDom = function () {
 
 
 /** 
- * function 生成客观题的dom
+ * function 生成主观题的dom
  * @TODO 生成content
 */
 yzQuestion.prototype._renderCommonDom = function () {
@@ -58,7 +58,11 @@ yzQuestion.prototype._renderCommonDom = function () {
     //content.append(cm.vdom);
   }
   this.vdom.append(content);
-}
+  // 冒泡监听事件
+  this.vdom.on('click', ()=>{
+    this.vdom.trigger('getNum',this.pNum);
+  });
+};
 
 /** 
  * function 生成title的dom
@@ -103,5 +107,5 @@ yzQuestion.prototype.renderToDom = function () {
   } else {
     this._renderCommonDom();
   }
-}
+};
 export default yzQuestion;

src/js/yzToolbar.js

@@ -21,6 +21,10 @@ var yzToolbar = function(){
     name: 'component',
     title: '组件框',
     icon: 'fa-square'
+  },{
+    name: 'subject',
+    title: '无',
+    icon: 'fa-list-alt'
   }];
 };
 
@@ -40,7 +44,20 @@ yzToolbar.prototype.toolbarContent = function () {
   });
   toolDom.className = 'toolbar';
   toolDom.appendChild(ulDom);
+  toolDom.setAttribute('id','toolbar');
   return toolDom;
 };
 
+yzToolbar.prototype.setSubjectTitle = function(subjectNum) {
+  this.menu.forEach( (item) => {
+    if( item.name == 'subject' ){
+      item.title = '正在编辑' + subjectNum;
+    }
+  });
+};
+
+yzToolbar.prototype.addComponet = function() {
+
+};
+
 export default yzToolbar;