123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658 |
- MWF.xApplication.process.FormDesigner.Module = MWF.xApplication.process.FormDesigner.Module || {};
- MWF.xDesktop.requireApp("process.FormDesigner", "Module.$Component", null, false);
- MWF.xDesktop.requireApp("process.FormDesigner", "Module.Table$Td", null, false);
- MWF.xApplication.process.FormDesigner.Module.Table = MWF.FCTable = new Class({
- Extends: MWF.FC$Component,
- Implements: [Options, Events],
- options: {
- "style": "default",
- "propertyPath": "../x_component_process_FormDesigner/Module/Table/table.html",
- "propertyMultiPath": "../x_component_process_FormDesigner/Module/Table$Td/table$tdMulti.html",
- "multiActions": [
- {
- "name": "mergerCell",
- "icon": "mergerCell.png",
- "event": "click",
- "action": "mergerCell",
- "title": MWF.APPFD.LP.formAction.mergerCell
- }
- ]
- },
-
- initialize: function(form, options){
- this.setOptions(options);
-
- this.path = "../x_component_process_FormDesigner/Module/Table/";
- this.cssPath = "../x_component_process_FormDesigner/Module/Table/"+this.options.style+"/css.wcss";
- this._loadCss();
- this.moduleType = "component";
- this.moduleName = "table";
- this.form = form;
- this.container = null;
- this.containerNode = null;
- this.containers = [];
- this.elements = [];
- this.selectedMultiTds = [];
- },
- clearTemplateStyles: function(styles){
- if (styles){
- if (styles.styles) this.removeStyles(styles.styles, "styles");
- if (styles.tableStyles) this.removeStyles(styles.tableStyles, "tableStyles");
- if (styles.properties) this.removeStyles(styles.properties, "properties");
- if (styles.titleStyles) this.removeStyles(styles.titleStyles, "titleTdStyles");
- if (styles.contentStyles) this.removeStyles(styles.contentStyles, "contentTdStyles");
- if (styles.layoutStyles) this.removeStyles(styles.layoutStyles, "layoutTdStyles");
- }
- },
- setTemplateStyles: function(styles){
- if (styles.styles) this.copyStyles(styles.styles, "styles");
- if (styles.tableStyles) this.copyStyles(styles.tableStyles, "tableStyles");
- if (styles.properties) this.copyStyles(styles.properties, "properties");
- if (styles.titleStyles) this.copyStyles(styles.titleStyles, "titleTdStyles");
- if (styles.contentStyles) this.copyStyles(styles.contentStyles, "contentTdStyles");
- if (styles.layoutStyles) this.copyStyles(styles.layoutStyles, "layoutTdStyles");
- },
- _createMoveNode: function(){
- var tableHTML = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"2\" width=\"100%\" align=\"center\">";
- tableHTML += "<tr><td></td><td></td><td></td></tr>";
- tableHTML += "<tr><td></td><td></td><td></td></tr>";
- tableHTML += "<tr><td></td><td></td><td></td></tr>";
- tableHTML += "</table>";
- this.moveNode = new Element("div", {
- "html": tableHTML
- }).inject(this.form.container);
- // this.moveNode = divNode.getFirst();
- // this.moveNode.inject(divNode, "after");
- // divNode.destroy();
-
- this.moveNode.setStyles(this.css.moduleNodeMove);
-
- this._setTableStyle();
- },
- _setTableStyle: function(){
- var tds = this.moveNode.getElements("td");
- //var tds = this._getTds(this.moveNode);
- tds.setStyles({
- "border": "1px dashed #999",
- "height": "20px"
- });
- var ths = this.moveNode.getElements("th");
- //var tds = this._getTds(this.moveNode);
- ths.setStyles({
- "border": "1px dashed #999",
- "height": "20px"
- });
- },
- _getTds: function(node){
- tds = [];
- var table = (node || this.node).getElement("table");
- var rows = table.rows;
- for (var i=0; i<rows.length; i++){
- var row = rows[i];
- for (var j=0; j<row.cells.length; j++){
- tds.push(row.cells[j]);
- }
- }
- return tds;
- },
- _checkSelectedTds: function(sp, ep){
- this.selectedMultiTds = [];
- //var tds = this.node.getElements("td");
- var tds = this._getTds();
- // var tmpSelectedTds = [];
- // var startXList = [];
- // var startYList = [];
- // var endXList = [];
- // var endYList = [];
-
- var sx = sp.x, sy = sp.y, ex = ep.x, ey = ep.y;
-
- while (true){
- var tmpsx = sp.x, tmpsy = sp.y, tmpex = ep.x, tmpey = ep.y;
- tds.each(function(td){
- if (td.isInPointInRect(sx, sy, ex, ey)){
- var position = td.getPosition();
- var size = td.getSize();
- if (!tmpsx || position.x<tmpsx) tmpsx = position.x;
- if (!tmpsy || position.y<tmpsy) tmpsy = position.y;
-
- if (!tmpex || position.x+size.x>tmpex) tmpex = position.x+size.x;
- if (!tmpey || position.y+size.y>tmpey) tmpey = position.y+size.y;
- }
- }.bind(this));
- if (sx==tmpsx && sy==tmpsy && ex==tmpex && ey==tmpey) break;
-
- sx = tmpsx, sy = tmpsy, ex = tmpex, ey = tmpey;
- }
-
- tds.each(function(td){
- var module = td.retrieve("module");
- if (td.isInPointInRect(sx, sy, ex, ey)){
- module.selectedMulti();
- }else{
- module.unSelectedMulti();
- }
- }.bind(this));
-
- },
-
- _setOtherNodeEvent: function(){
- this.dragInfor = {};
- var table = this.node.getElement("table");
- this.tdDragSelect = new Drag(this.node, {
- "stopPropagation": true,
- "preventDefault": true,
- "onStart": function(el, e){
- var cellspacing = table.get("cellspacing");
- if( !cellspacing || cellspacing.toInt() === 0 ){
- this.tmpCellspacing = cellspacing || "0";
- table.set("cellspacing", "1");
- }
- this.form._beginSelectMulti();
-
- var position = e.event.target.getPosition();
- this.dragInfor.start = {"x": e.event.offsetX+position.x, "y": e.event.offsetY+position.y};
- }.bind(this),
- "onDrag": function(el, e){
- var position = e.event.target.getPosition();
- var p = {"x": e.event.offsetX+position.x, "y": e.event.offsetY+position.y};
- this._checkSelectedTds(this.dragInfor.start, p);
-
- e.stopPropagation();
- }.bind(this),
- "onComplete": function(el, e){
- var position = e.event.target.getPosition();
- var p = {"x": e.event.offsetX+position.x, "y": e.event.offsetY+position.y};
- this._checkSelectedTds(this.dragInfor.start, p);
-
- this.form._completeSelectMulti();
- this._createMultiSelectedActions();
- this.showMultiProperty();
- if( this.hasOwnProperty("tmpCellspacing") ){
- table.set("cellspacing", this.tmpCellspacing );
- this.tmpCellspacing = null;
- }
-
- e.stopPropagation();
- e.preventDefault();
- }.bind(this)
- });
- },
- showMultiProperty: function(){
- if (this.form.propertyMultiTd){
- this.form.propertyMultiTd.hide();
- this.form.propertyMultiTd = null;
- }
- this.form.propertyMultiTd = new MWF.xApplication.process.FormDesigner.PropertyMulti(this.form, this.form.selectedModules, this.form.designer.propertyContentArea, this.form.designer, {
- "path": this.options.propertyMultiPath,
- "onPostLoad": function(){
- this.show();
- }
- });
- this.form.propertyMultiTd.load();
- },
- _createMultiSelectedActions: function(){
- if (this.form.selectedModules.length>1){
- if (this.form.multimoduleActionsArea){
- this.form.multimoduleActionsArea.empty();
- this.options.multiActions.each(function(action){
- var actionNode = new Element("div", {
- "styles": this.options.actionNodeStyles,
- "title": action.title
- }).inject(this.form.multimoduleActionsArea);
- actionNode.setStyle("background", "url("+this.path+this.options.style+"/icon/"+action.icon+") no-repeat left center");
- actionNode.addEvent(action.event, function(e){
- this[action.action](e);
- }.bind(this));
- }.bind(this));
- this.form.multimoduleActionsArea.setStyle("width", 18*this.options.multiActions.length);
- }
- }else if(this.form.multimoduleActionsArea){
- this.form.multimoduleActionsArea.setStyle("display", "none");
- }
- },
- mergerCell: function(){
- if (this.form.selectedModules.length>1){
- debugger;
- var fromLogList;
- if(this.form.history)fromLogList = this.createHistoryLogList(this.form.selectedModules);
- var firstModuleObj = this.form._getFirstMultiSelectedModule();
- var firstModule = firstModuleObj.module;
-
- // var n=0;
- var td = firstModule.node;
-
- var colspan = 0;
- while (td && this.form.selectedModules.indexOf(td.retrieve("module"))!=-1 ){
- var tmpColspan = td.get("colspan").toInt() || 1;
- colspan = colspan+tmpColspan;
- td = td.getNext("td");
- }
- var maxRowIndex = Number.NEGATIVE_INFINITY;
- var minRowIndex = Number.POSITIVE_INFINITY;
- this.form.selectedModules.each(function(module, idx){
- var rIdx = module.node.getParent("tr").rowIndex;
- var tmpRowspan = module.node.get("rowspan").toInt() || 1;
- var rows = rIdx+tmpRowspan-1;
-
- maxRowIndex = Math.max(maxRowIndex, rows);
- minRowIndex = Math.min(minRowIndex, rows);
- }.bind(this));
-
- var rowspan = maxRowIndex-minRowIndex+1;
-
- if (colspan>1){
- firstModule.node.set("colspan", colspan);
- firstModule.json.properties.colspan = colspan;
- }else{
- firstModule.node.set("colspan", 1);
- delete firstModule.node.colspan;
- delete firstModule.json.properties.colspan;
- }
- if (rowspan>1){
- firstModule.node.set("rowspan", rowspan);
- firstModule.json.properties.rowspan = rowspan;
- }else{
- firstModule.node.set("rowspan", 1);
- delete firstModule.node.rowspan;
- delete firstModule.json.properties.rowspan;
- }
-
- while (this.form.selectedModules.length){
- var module = this.form.selectedModules[0];
- this.form.selectedModules.erase(module);
- if (module!==firstModule){
- var modules = module._getSubModule();
- modules.each(function(module){
- module._moveTo(firstModule);
- });
-
- this.containers.erase(module);
- module.destroy();
- }
- }
- firstModule.selected();
- this.addHistoryLog("mergeCell", firstModule, fromLogList, firstModule.json.id, firstModule.json.type );
- }
- },
-
- _getContainers: function(){
- //var tds = this.node.getElements("td");
- var tds = this._getTds();
- this.form.getTemplateData("Table$Td", function(data){
- tds.each(function(td){
- var json = this.form.getDomjson(td);
- var tdContainer = null;
- if (!json){
- var moduleData = Object.clone(data);
- tdContainer = new MWF.FCTable$Td(this.form);
- tdContainer.table = this;
- tdContainer.load(moduleData, td, this);
- }else{
- var moduleData = Object.clone(data);
- Object.merge(moduleData, json);
- Object.merge(json, moduleData);
- tdContainer = new MWF.FCTable$Td(this.form);
- tdContainer.table = this;
- tdContainer.load(json, td, this);
- }
- this.containers.push(tdContainer);
- }.bind(this));
- }.bind(this));
- },
- _getElements: function(){
- // this.elements.push(this);
- var captions = this.node.getElements("caption");
- captions.each(function(caption){
- var json = this.form.getDomjson(caption);
- var el = null;
- if (!json){
- this.form.getTemplateData("Common", function(data){
- var moduleData = Object.clone(data);
- el = new MWF.FCCommon(this.form);
- el.table = this;
- el.load(moduleData, caption, this);
- }.bind(this));
- }else{
- el = new MWF.FCCommon(this.form);
- el.table = this;
- el.load(json, caption, this);
- }
- this.elements.push(el);
- }.bind(this));
- },
-
- _createNode: function(callback){
- var module = this;
- var url = this.path+"tableCreate.html";
- MWF.require("MWF.widget.Dialog", function(){
- var size = $(document.body).getSize();
- var x = size.x/2-180;
- var y = size.y/2-130;
- var dlg = new MWF.DL({
- "title": "Create Table",
- "style": "property",
- "top": y,
- "left": x-40,
- "fromTop":size.y/2-65,
- "fromLeft": size.x/2,
- "width": 360,
- "height": 260,
- "url": url,
- "lp": MWF.xApplication.process.FormDesigner.LP.propertyTemplate,
- "buttonList": [
- {
- "text": MWF.APPFD.LP.button.ok,
- "action": function(){
- module._createTableNode();
- callback();
- this.close();
- }
- }
- ]
- });
-
- dlg.show();
- }.bind(this));
- },
- _createTableNode: function(){
- var rows = $("MWFNewTableLine").get("value");
- var cols = $("MWFNewTableColumn").get("value");
-
- var width = $("MWFNewTableWidth").get("value");
- var widthUnitNode = $("MWFNewTableWidthUnit");
- var widthUnit = widthUnitNode.options[widthUnitNode.selectedIndex].value;
-
- var border = $("MWFNewTableBorder").get("value");
- var cellpadding = $("MWFNewTableCellpadding").get("value");
- var cellspacing = $("MWFNewTableCellspacing").get("value");
-
- var w = "";
- if (widthUnit=="percent"){
- w = width+"%";
- }else{
- w = width+"px";
- }
-
- this.json.properties.width = w;
- this.json.properties.border = border;
- this.json.properties.cellpadding = cellpadding;
- this.json.properties.cellspacing = cellspacing;
-
- var tableHTML = "<table border=\""+border+"\" cellpadding=\""+cellpadding+"\" cellspacing=\""+cellspacing+"\" width=\""+w+"\" align=\"center\">";
- for (var i=0; i<rows.toInt(); i++){
- tableHTML += "<tr>";
- for (var j=0; j<cols.toInt(); j++){
- tableHTML += "<td></td>";
- }
- tableHTML += "</tr>";
- }
- tableHTML += "</table>";
- this.node = this.node = new Element("div", {
- "id": this.json.id,
- "MWFType": "table",
- "html": tableHTML,
- "styles": this.css.moduleNode,
- "events": {
- "selectstart": function(e){
- e.preventDefault();
- }
- }
- }).inject(this.form.node);
- //if (w!="100%"){
- // this.node.setStyle("width", w);
- //}
- },
-
- _dragComplete: function(){
- if (!this.node){
- this._createNode(function(){
- this._dragMoveComplete();
- }.bind(this));
- }else{
- this._dragMoveComplete();
- }
- },
- _dragMoveComplete: function(){
- this._resetTreeNode();
- this.node.inject(this.copyNode, "before");
-
- this._initModule();
-
- var thisDisplay = this.node.retrieve("thisDisplay");
- if (thisDisplay){
- this.node.setStyle("display", thisDisplay);
- }
-
- if (this.copyNode) this.copyNode.destroy();
- if (this.moveNode) this.moveNode.destroy();
- this.moveNode = null;
- this.copyNode = null;
- this.nextModule = null;
- this.form.moveModule = null;
- this.form.json.moduleList[this.json.id] = this.json;
- this.selected();
- if( this.operation && !this.historyAddDelay ){
- this.addHistoryLog( this.operation, null, this.fromLog );
- }
- if( !this.historyAddDelay ){
- this.operation = null;
- this.fromLog = null;
- }
- },
-
- setPropertiesOrStyles: function(name){
- if (name=="styles"){
- try{
- this.setCustomStyles();
- }catch(e){}
- // var border = this.node.getStyle("border");
- // this.node.clearStyles();
- // this.node.setStyles(this.css.moduleNode);
- // this.node.setStyle("border", border);
- // Object.each(this.json.styles, function(value, key){
- // var reg = /^border\w*/ig;
- // if (!key.test(reg)){
- // this.node.setStyle(key, value);
- // }
- // }.bind(this));
- }else if(name=="tableStyles"){
- this.parseStyles( this.table, this.json.tableStyles );
- }
- if (name=="properties"){
- this.node.getFirst().setProperties(this.json.properties);
- if (this.json.properties.cellspacing==="0"){
- this.node.getFirst().setProperties({"cellspacing": "1"});
- }
- //if (this.json.properties.width){
- // if (this.json.properties.width!="100%"){
- // this.node.setStyle("width", this.json.properties.width);
- // }
- //}
- }
- },
- _setEditStyle_custom: function(name, obj, oldValue){
- if (name=="id"){
- if (oldValue && this.json.id!=oldValue){
- var reg = new RegExp("^"+oldValue, "i");
- this.containers.each(function(container){
- var id = container.json.id;
- var newId = id.replace(reg, this.json.id);
- container.json.id = newId;
-
- delete this.form.json.moduleList[id];
- this.form.json.moduleList[newId] = container.json;
- container._setEditStyle("id");
- }.bind(this));
- }
- }
- if (name=="titleTdStyles") this.setTabStyles();
- if (name=="contentTdStyles") this.setTabStyles();
- if (name=="layoutTdStyles") this.setTabStyles();
- },
- setTabStyles: function(){
- this.containers.each(function(module){
- //if (module.json.cellType=="title"){
- //
- //}
- //if (module.json.cellType=="content"){
- //
- //}
- //if (module.json.cellType=="layout"){
- //
- //}
- module.setCustomStyles();
- }.bind(this));
- },
- setAllStyles: function(){
- this.setPropertiesOrStyles("styles");
- this.setPropertiesOrStyles("tableStyles");
- this.setPropertiesOrStyles("properties");
- this.setTabStyles();
- this.reloadMaplist();
- },
- copyComponentJsonData: function(newNode, pid){
- //var tds = newNode.getElements("td");
- var tds = this._getTds(newNode);
- // this.form.getTemplateData("Table$Td", function(data){
- tds.each(function(td, idx){
- var newContainerJson = Object.clone(this.containers[idx].json);
- var oid = this.containers[idx]._getNewId(pid);
- var id = oid;
- var index = 1;
- while (this.form.json.moduleList[id]) {
- id = oid + "_" + index;
- index++;
- }
- newContainerJson.id = id;
- // newContainerJson.id = this.containers[idx]._getNewId(pid);
- this.form.json.moduleList[newContainerJson.id] = newContainerJson;
- td.set("id", newContainerJson.id);
- }.bind(this));
- // }.bind(this));
- },
- // setOtherNodeEvent: function(){
- //// var tds = this.node.getElements("td");
- //// tds.addEvent("click", function(e){
- //// this.selectedTd(e.target);
- //// }.bind(this));
- // },
- //
- // selectedTd: function(td){
- // if (this.currentSelectedTd){
- // if (this.currentSelectedTd==td){
- // return true;
- // }else{
- // this.unSelectedTd(this.currentSelectedTd);
- // }
- // }
- //
- // var top = td.getStyle("border-top");
- // var left = td.getStyle("border-left");
- // var bottom = td.getStyle("border-bottom");
- // var right = td.getStyle("border-right");
- // td.store("thisborder", {"top": top, "left": left, "bottom": bottom, "right": right});
- //
- // td.setStyles({
- // "border": "1px dashed #ff6b49"
- // });
- // this.currentSelectedTd = td;
- // },
- // unSelectedTd: function(td){
- // var border = td.retrieve("thisborder");
- // if (border) {
- // td.setStyles({
- // "border-top": border.top,
- // "border-left": border.left,
- // "border-bottom": border.bottom,
- // "border-right": border.right
- // });
- // }
- // this.currentSelectedTd = null;
- // },
-
- getContainerNodes: function(){
- //return this.node.getElements("td");
- return this._getTds();
- },
- _preprocessingModuleData: function(){
- this.node.clearStyles();
- this.json.recoveryStyles = Object.clone(this.json.styles);
- if (this.json.recoveryStyles) Object.each(this.json.recoveryStyles, function(value, key){
- if ((value.indexOf("x_processplatform_assemble_surface")!=-1 || value.indexOf("x_portal_assemble_surface")!=-1)){
- //需要运行时处理
- }else{
- var reg = /^border\w*/ig;
- if (!key.test(reg)){
- if (key){
- this.node.setStyle(key, value);
- delete this.json.styles[key];
- }
- }
- }
- }.bind(this));
- if (this.json.styles && this.json.styles.border){
- if (!this.table) this.table = this.node.getElement("table");
- if( this.json.styles["table-layout"] ){
- this.table.setStyle("table-layout",this.json.styles["table-layout"]);
- }
- //this.table.setStyle("border-collapse","collapse");
- if (!this.json.styles["border-collapse"]) this.table.setStyle("border-collapse","separate");
- }
- this.json.preprocessing = "y";
- },
- _recoveryModuleData: function(){
- if (this.json.recoveryStyles) this.json.styles = this.json.recoveryStyles;
- this.json.recoveryStyles = null;
- if (!this.table) this.table = this.node.getElement("table");
- //this.table.setStyle("border-collapse","separate");
- },
- loadExistedNodeTd: function (cell, moduleData) {
- var tdContainer = new MWF.FCTable$Td(this.form);
- tdContainer.table = this;
- tdContainer.load(moduleData, cell, this);
- this.containers.push(tdContainer);
- },
- deleteTdWithNode: function (cell) {
- var module = cell.retrieve("module");
- if (module){
- this.containers.erase(module);
- module.destroy();
- }
- }
-
- });
|