jemin_new_test.git

LogicNode = Object.subClass({
    
    init: function(config) {
        this.level = config.level || 0;
        this.type = config.type;
        this.expression = config.expression;
        this.condition = config.condition;
        this.valuation = config.valuation;
        this.parent = config.parent;
        this.children = [];
    },
    
    toString: function(content) {
        var result = "";
        
        if (!this.condition) {
            this.expression = this.valuation.expression = this.valuation.editor.val();
        }
        else {
            this.condition.expression = this.condition.editor.val();
            this.valuation.expression = this.valuation.editor.val();
            
            this.expression = this.condition.expression + "?" + this.valuation.expression;
        }
        
        result = result + this.expression;
        var flag = this.level == 0 ? ";" : ",";
        
        var max = this.children.length;
        for (var i = 0; i < max; i++) {
            var child = this.children[i];
            result = result + flag + child.toString();
        }
    },
    
    show: function() {
        if (!this.condition) {
            this.valuation.editor.val(this.valuation.expression);
        }
        else {
            this.condition.editor.val(this.condition.expression);
            this.valuation.editor.val(this.valuation.expression);
        }
    },
    
    clear: function() {
        if (!this.condition) {
            if (this.valuation.el) {
                this.valuation.el.remove();
            }
        }
        else {
            if (this.condition.el) {
                this.condition.el.remove();
            }
            if (this.valuation.el) {
                this.valuation.el.remove();
            }            
        }    
            
        if (this.el) {
            this.el.remove();
        }
    }
});
 
LogicTree = Object.subClass({
    
    init: function(config) {
        this.type;
        this.condition = null;
        this.valuation = null;
        this.eidtor = null;
        this.children = [];
    },
    
    parse: function(content, flag) {
        this.clear();
        
        if (!content) {
            return;
        }
        
        flag = flag || ";";
        
        if (content.indexOf(";") < 0) {
            this.parseMathValue(this, content, 0);
            return;
        }
        
        var sequences = content.split(";");
        var max = sequences.length;
            
        for (var i = 0; i < max; i++) {
            sequence = sequences[i];
            var node = this.parseIFValue(this, sequence, 0);
        }
    },
        
    parseMathValue: function(parent, value, level) {
        var node = new LogicNode({
            parent: parent,
            level: level,
            type: "Math",
            valuation: {
                expression: value,
                el: null
            }
        });
        
        parent.children.push(node);
        return node;
    },
        
    parseIFValue: function(parent, content, level) {
        var pos = content.indexOf("?");
        
        //1. else if 
        if (pos < 0) {
            var node = new LogicNode({
                parent: parent,
                level: level,
                type: "ELSE",
                expression: content,
                valuation: {
                    expression: content,
                    el: null
                }
            });    
                    
            parent.children.push(node);        
            return;
        }
        
        //2. if condition
        var node = new LogicNode({
            parent: parent,
            level: level,
            type: "IF",
            condition: {
                expression: content.substring(0, pos),
                el: null
            }
        });
        node.expression = content;
        parent.children.push(node);
 
        //3. if valuation
        var pos_subflag = content.indexOf(",");
        if (pos_subflag < 0) {
            var math = content.substring(pos + 1);
            
            node.valuation = {
                expression: math,
                el: null
            }            
            return;
        }
        
        //4. children
        this.parse(node, ",", 1);
    },
    
    getString: function() {
        var result = "";
        
        var max = this.children.length;
        for (var i = 0; i < max; i++) {
            var child = this.children[i];
            result = result + child.toString();
        }
        
        return result;
    },
    
    show: function() {
        var max = this.children.length;
        for (var i = 0; i < max; i++) {
            var child = this.children[i];
            child.show();
        }
    },
    
    clear: function() {
        var max = this.children.length;
        for (var i = 0; i < max; i++) {
            var child = this.children[i];
            child.clear();
        }
        
        this.children = [];
    }
});
 
FormulaDesigner = Control.subClass({
    
    items: true,
    
    init: function(config) {
        config.css = util.combine(config.css, {
            container: null
        });
        
        this.logicTree = new LogicTree({});
        this.mathLine = {};
        this.selected = null;
        
        Control.call(this, config);
    },
    
    getContainerTemplate: function() {
        return $(Formula_Template.container.join(""));
    },
    
    createContent: function() {
        this.logicTree.el = this.container;
        
        //1. body
        this.logicTree.el.body = $("#formula_body", this.container);
        
        //2. header
        this.header = $("#formula_header", this.container);
        this.header.nameEditor = $("#editor_name", this.header);
        this.header.alignEditor = $("#editor_align", this.header);
        this.header.formaterEditor = $("#editor_formatter", this.header);
        this.header.widthEditor = $("#width_editor", this.header);
    },
    
    loadSetting: function(setting) {
        this.setVariantName(setting.name);
        this.setVariantAlign(setting.align);
        this.setVariantFormatter(setting.formatter);
        this.setVariantWidth(setting.width);
    },
    
    loadExpression: function(expression) {
        this.logicTree.parse(expression);
        this.createLines();
        this.logicTree.show();
    },
    
    createLines: function() {
        var lines = this.logicTree.children;
        var max = lines.length;
        
        for (var i = 0; i < max; i++) {
            this.createOneLine(lines[i]);
        }
    },
    
    createOneLine: function(logic) {
        if ("Math" == logic.type) {
            this.createMathLine(logic);
        }
        else if ("IF" == logic.type) {
            this.createIFLine(logic);
        }
        else if ("ELSE" == logic.type) {
            this.createElseLine(logic);
        }
    },
    
    createMathLine: function(logic) {
        //1. element
        var el = logic.valuation.el = $(Formula_Template.mathLine.join(""));
        logic.valuation.editor = $("#mathEditor", el);
        
        //2. append to parent
        logic.parent.el.body.append(el);
        return result;        
    },
    
    createIFLogic: function(parentLogic) {
        //1. clear math line
        if (this.mathLine.el) {
            this.mathLine.el.remove();
            this.mathLine = {};
        }
        
        //2. login tree
        this.createIFLine(parentLogic);
        this.createElseLine(parentLogic);
    },
    
    createIFLine: function(logic) {
        this.createLogicLine(logic, "IF");
    },
    
    createElseIFLine: function(logic, priorLogic) {
        this.createLogicLine(logic, "ELSE-IF", priorLogic);
    },
    
    createElseLine: function(logic) {
        this.createLogicLine(logic, "ELSE");
    },
    
    createLogicLine: function(logic, type, priorLogic) {
        //1. create element
        var el; var existsButtons;
        
        if ("IF" == type || "ELSE-IF" == type) {
            el = $(Formula_Template.logicIF.join(""));
            logic.condition.editor = $("#conditionEditor", el);
            logic.valuation.editor = $("#valuationEditor", el);
            existsButtons = true;
        }
        else {
            el = logic.valuation.el = $(Formula_Template.logicELSE.join(""));
            logic.valuation.editor = $("#valuationEditor", el);
            existsButtons = false;
        }
        
        logic.el = el;
        el.body = $("#logic_body", el);
        
        //2. caption 
        var caption = $("#conditionCaption", el);
        caption.html(this.getLogicLabel(type));
        
        //4. event
        if (existsButtons) {
            var me = this;
            el.bntAddOne = $("#btn_addOne", el);
            el.bntAddOne.click(function() {
                me.createElseIFLine(parentLogic, result);
            });
            
            el.bntAddChild = $("#btn_addChild", el);
            el.bntAddChild.click(function() {
                me.createIFLogic(result);
            });
            
            el.bntDeleteOne = $("#btn_deleteOne", el); 
            el.bntDeleteOne.click(function() {
                me.deleteLogic(result);
            });            
        }
        
        //5. append to parent
        var parentLogic = logic.parent;
        
        if (priorLogic) {
            result.el.insertBefore(priorLogic.el);
        }
        else {
            var parentEl = parentLogic.el.body;
            parentEl.append(el);
        }
        
        //6. animate
        return result;
    },
    
    deleteLogic: function(logic) {
        var parent = logic.parent;
        var logicList = parent.children;
        
        //1. 只有if和else
        if (logicList.length <= 2) {
            this.initLogicBody(parent);
        }
        else {
            //1. delete from parent
            var index = logicList.indexOf(logic);
            logicList.splice(index, 1);    
            
            //2. delete el
            logic.el.remove();
        }
    },
    
    initLogicBody: function(logic) {
        //1. empty parent children
        logic.children = [];
        
        //2. empty body
        logic.el.body.empty();
        
        //3. append valuation
        var valuation = $(Formula_Template.valuation.join(""));
        logic.el.body.append(valuation);
    },
    
    removeLogicValuation: function(logic) {
        if (!logic.el.valuation) {
            return;
        }
        
        logic.el.valuation.remove();
        logic.el.valuation = null;
    },
    
    getExpressionString: function() {
        if (logicLine) {
            var result = logicLine.expression.getString();
            return result;
        }
        
        var result = "";
        var logicTree = this.logicTree;
        var max = logicTree.length;
        
        for (var i = 0; i < max; i++) {
            var logicLine = logicTree[i];
            result = result + logicLine.expression.getString();
        }
        
        return result;
    },
    
    getLogicLabel: function(type) {
        if ("IF" == type) {
            return "如果：";
        }
        else if ("ELSE-IF" == type) {
            return "如果：";
        }
        else if ("ELSE" == type) {
            return "否则：";
        }
    },
    
    clear: function() {
        //1. math
        if (this.mathLine.el)  {
            this.mathLine.el.remove();
        }
        this.mathLine = {};
        
        //2. 
        var children = this.logicTree.children;
        var max = children.length;
        
        for (var i = 0; i < max; i++) {
            var logic = children[i];
            logic.el.remove();
        }
        
        this.logicTree.children = [];
    },
    
    setVariantName: function(name) {
        this.header.nameEditor.val(name);
    },
    
    setVariantAlign: function(align) {
        var filter = "[value='" + align + "']";
        var option = $(filter, this.header.alignEditor);
        if (option) {
            option.attr("selected", "selected");
        }
    },
    
    setVariantFormatter: function(formatter) {
        var filter = "[value='" + formatter + "']";
        var option = $(filter, this.header.formaterEditor);
        if (option) {
            option.attr("selected", "selected");
        }
    },
    
    setVariantWidth: function(width) {
        width = width || 1;
        var filter = "[value='" + width + "']";
        var option = $(filter, this.header.widthEditor);
        if (option) {
            option.attr("selected", "selected");
        }
    }
    
});
 
 
//*************************************
Formula_Template = {};
 
Formula_Template.container = [
    '<div class="formula">',
        '<div id="formula_header" class="formula-header">',
            '<span>列名：</span>',
            '<input id="editor_name" type="text" value="达成率"/>',
            '<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>',
            '<span>显示格式：</span>',
            '<select id="editor_formatter">',
                '<option value="text">文本</option>',
                '<option value="percent">百分比</option>',
                '<option value="money">金额</option>',
                '<option value="decimal">数值</option>',
            '</select>',
            '<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>',
            '<span>对齐方式：</span>',
            '<select id="editor_align">',
                '<option value="left">左对齐</option>',
                '<option value="center">居中对齐</option>',
                '<option value="right">右对齐</option>',
            '</select>',
            '<span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>',
            '<span>列宽度：</span>',
            '<select id="width_editor">',
                '<option value="0.6">0.6</option>',
                '<option value="1">1</option>',
                '<option value="1.5">1.5</option>',
                '<option value="2.5">2.5</option>',
            '</select>',                        
        '</div>',
        '<div class="formula-body">',
            '<div id="formula_body" class="formula-body-inner">',
            '</div>',
        '</div>',
    '</div>'
];
 
Formula_Template.mathLine = [
    '<div id="math_body" class="math-body">',
        '<span id="mathCaption" class="math-caption">=</span>',
        '<input id="mathEditor" class="math-input" type="text" placeholder="请编辑公式"/>',
    '</div>'   
];
 
Formula_Template.logicIF = [
    '<div class="logic">',
        '<div class="logic-condition">',
            '<div class="indicator-line"></div>',
            '<div class="indicator-if"></div>',
            '<span id="conditionCaption" class="condition-caption"></span>',
            '<input id="conditionEditor" class="logic-input-condition" type="text"/>',
            '<div class="logic-btn-group">',
                '<div id="btn_addOne" class="logic-btn">+&nbsp;同级</div>',
                '<div id="btn_addChild" class="logic-btn">+&nbsp;下级</div>',
                '<div id="btn_deleteOne" class="logic-btn">-&nbsp;删除</div>',                
            '</div>',
        '</div>',                
        '<div id="logic_body" class="logic-body">',
            '<div class="indicator-line"></div>',
            '<div id="valuation_body" class="valuation-body">',
                '<input id="valuationEditor" class="logic-input-valuation" type="text"/>',
            '</div>', 
        '</div>',
    '</div>'   
];
 
Formula_Template.logicELSE = [
    '<div class="logic">',
        '<div id="logic_body" class="logic-condition">',
            '<div class="indicator-else"></div>',
            '<span id="conditionCaption" class="condition-caption"></span>',
            '<input id="valuationEditor" class="logic-input-valuation" type="text"/>',
        '</div>',
    '</div>'   
];
 
Formula_Template.valuation = [
    '<div class="indicator-line"></div>',
    '<div id="valuation_body" class="valuation-body">',
        '<input id="valuationEditor" type="text"/>',
    '</div>', 
];