fastui 0.1.2

data/app/assets/javascripts/fastui/app/view/VTab.js

@@ -0,0 +1,293 @@
+Ext.define('FastUI.view.VTab', {
+    extend: 'Ext.Panel',
+    requires: ['FastUI.view.FormFactory'],
+    alias: 'widget.vtab',
+    valueObject: {},
+    winId: 0,
+    winCtx: {},
+    layout: "card",
+    border: false,
+    initComponent: function () {
+        this.id = 'tab-' + this.getValue('name');
+        this.grid_kind = this.getValue('grid_kind');
+        this.title = this.getValue('title');
+        this.form_kind = this.getValue('form_kind');
+        this.rest = Ext.create('FastUI.view.Rest', this.getMEntity());
+        this.tbar = Ext.create('Ext.toolbar.Toolbar', {
+            id: this.id + 'tbar',
+            defaults: {
+                scale: 'small' //scale: 'large'
+            },
+            items: [
+                {
+                    id: this.id + 'new',
+                    text: '新建',
+                    iconCls: 'fastui-btn-new',
+                    handler: function () {
+//                        this.cmdCreate();
+                        this.getForm();
+                        this.vform.cmdCreate();
+                        this.getLayout().setActiveItem(this.vform.id);
+
+                        this.getBtn('save').enable();
+                        this.getBtn('edit').disable();
+                    },
+                    scope: this
+                },
+                {
+                    id: this.id + 'edit',
+                    text: '编辑',
+                    disabled: true,
+                    iconCls: 'fastui-btn-edit',
+                    handler: function () {
+                        this.getForm();
+                        this.vform.cmdEdit();
+                        this.getLayout().setActiveItem(this.vform.id);
+
+//                        this.cmdEdit();
+                        this.getBtn('save').enable();
+                    },
+                    scope: this
+                },
+                {
+                    id: this.id + 'list',
+                    text: '列表',
+                    iconCls: 'fastui-btn-list',
+                    handler: function () {
+                        this.cmdList();
+                        this.getBtn('save').disable();
+                        this.getBtn('new').enable();
+                        this.getBtn('edit').enable();
+                    },
+                    scope: this
+                },
+                {
+                    id: this.id + 'save',
+                    text: '保存',
+                    disabled: true,
+                    iconCls: 'fastui-btn-save',
+                    handler: function () {
+//                        this.cmdSave();
+                        this.getForm();
+                        this.vform.cmdSave();
+                        this.vgrid.store.reload();
+                        this.getLayout().setActiveItem(this.vgrid.id);
+                        this.getBtn('save').disable();
+                    },
+                    scope: this
+                },
+                {
+                    id: this.id + 'del',
+                    text: '删除',
+                    disabled: true,
+                    iconCls: 'fastui-btn-del',
+                    handler: function () {
+                        this.cmdDelete();
+                        this.getBtn('edit').disable();
+                    },
+                    scope: this
+                },
+                {
+                    id: this.id + 'help',
+                    text: '帮助',
+                    iconCls: 'fastui-btn-help',
+                    handler: function () {
+                        this.cmdHelp();
+                    },
+                    scope: this
+                }
+            ]
+        });
+        //FastUI.Env.setTabCtx(FastUI.Env.getWinCtx('winNo','win_id'),'tabNo','tab_id',this.id);
+        this.callParent();
+    },
+    getBtn: function (name) {
+        return this.getDockedComponent(this.id + 'tbar').items.get(this.id + name);
+    },
+    getValue: function (key) {
+        return this.valueObject[key] || '';
+    },
+    getMEntity: function () {
+        return this.valueObject.entity;
+    },
+    listeners: {
+        activate: function (tab, opts) {
+            this.cmdList();
+        }
+    },
+    getParams: function () {
+        var p = {};
+        var tab = Ext.getCmp('tab-' + this.getValue('included_tab'));
+        if (tab) {
+            //p[tab.rest.getKey()] = tab.getSelectedId();
+            //alert( tab.rest.getKey());
+            p[tab.rest.getKey()] = this.winCtx.getWinCtx(this.winId, tab.rest.getKey());
+        }
+        return p;
+    },
+    getVGrid: function () {
+        if (!this.vgrid) {
+            if (this.grid_kind == 'VTreeGrid') {
+                this.vgrid = Ext.create('FastUI.view.VTreeGrid', {tab: this});
+            } else {
+                this.vgrid = Ext.create('FastUI.view.VGrid', {tab: this});
+            }
+            this.add(this.vgrid);
+        } else {
+            if (this.grid_kind != 'VTreeGrid') {
+                var params1 = this.vgrid.store.getProxy().extraParams;
+                var params2 = this.getParams();
+                if (!Ext.Object.equals(params1, params2)) {
+                    this.vgrid.store.getProxy().extraParams = params2;
+                    this.vgrid.store.reload();
+                }
+            }
+        }
+        return this.vgrid;
+    },
+    getSelectedId: function () {
+        return this.getVGrid().selectedId();
+    },
+    cmdList: function () {
+        var grid = this.getVGrid();
+        this.getLayout().setActiveItem(grid.id);
+    },
+    getForm: function () {
+        if (!this.vform) {
+            this.vform = FastUI.view.FormFactory.createForm(this.form_kind, this);
+            this.add(this.vform);
+        }
+        return this.vform.getForm();
+//            if (this.form_kind == '') {
+//                if (!this.vform) {
+//                    this.vform = Ext.create('FastUI.view.VForm', {tab: this});
+//                    this.add(this.vform);
+//                }
+//            } else {
+//                this.vform = Ext.create('FastUI.view.' + this.form_kind, {tab: arguments.length == 0 ? this : arguments[0]});
+//            }
+
+
+    },
+//    cmdCreate: function () {
+//        var form = this.getForm();
+//        form.url = this.rest.createPath();
+//        form.method = 'POST';
+//        form.reset();
+////        if (this.form_kind == '') {
+//        this.setAutoFields(form);
+////        }
+//        this.getLayout().setActiveItem(this.vform.id);
+//    },
+//    setAutoFields: function (form) {
+//        var temp = {};
+//        var logic = "";
+//        Ext.each(this.getValue('m_fields'), function (mfield) {
+//            if (mfield.default_logic && mfield.default_logic.length > 0) {
+//                logic = this.winCtx.parseCtx(this.winId, mfield.default_logic);
+//                temp[this.rest.getTableName() + '[' + mfield.m_property.name + ']'] = Ext.decode(logic);
+//            }
+//        }, this);
+//        form.setValues(temp);
+//    },
+//    cmdEdit: function () {
+//        var id = this.getVGrid().selectedId();
+////        if (this.form_kind == '') {
+//        var form = this.getForm();
+//        form.url = this.rest.updatePath(id);
+//        form.method = 'PUT';
+//        this.setEditValues(id, form);
+//        this.getLayout().setActiveItem(this.vform.id);
+////        } else {
+////            Ext.Ajax.request({
+////                url: this.rest.editPath(id),
+////                success: function (response) {
+////                    this.getForm(Ext.decode(response.responseText));
+////                    this.getLayout().setActiveItem(this.vform.id);
+////                }.bind(this)
+////            });
+////        }
+////        this.getLayout().setActiveItem(this.vform.id);
+//    },
+//    setEditValues: function (id, form) {
+//        Ext.Ajax.request({
+//            url: this.rest.editPath(id),
+//            success: function (response) {
+//                var data = Ext.decode(response.responseText);
+//                var k, o = {};
+//                for (k in data) {
+//                    if (k.match(/_id$/)) {
+//                        var attr = data[k.replace('_id', '')];
+//                        var title = data[k];
+//                        if (attr && attr.title) {
+//                            title = attr.title
+//                        }
+//                        o[this.rest.getTableName() + '[' + k + ']'] = {id: data[k], title: title};
+//                    } else if (k.match(/_ids$/)) {
+//                        o[this.rest.getTableName() + '[' + k + '][]'] = data[k];
+//                    }
+//                    else {
+//                        o[this.rest.getTableName() + '[' + k + ']'] = data[k];
+//                    }
+//                }
+////                alert(Ext.encode(o));
+//                form.setValues(o);
+//            }, scope: this
+//        });
+//    },
+    cmdDelete: function () {
+        var id = this.getVGrid().selectedId();
+        Ext.MessageBox.confirm('提示', '确定要删除此记录吗?', function (btn) {
+            if (btn == 'yes') {
+                this.constructAjaxRequest({
+                    url: this.rest.deletePath(id),
+                    method: 'DELETE',
+                    success: function () {
+                        this.vgrid.store.reload();
+                        this.getLayout().setActiveItem(this.vgrid.id);
+                        Ext.MessageBox.alert("提示", "操作成功！")
+                    },
+                    failure: function () {
+                        Ext.MessageBox.alert("提示", "操作失败！")
+                    },
+                    scope: this
+                });
+            }
+        }, this);
+    },
+    cmdHelp: function () {
+        var helpWindow = Ext.create('FastUI.view.VHelpWindow', {html: this.getValue('help')});
+        helpWindow.show();
+    },
+//    cmdSave: function () {
+//        if (this.vform) {
+//            var form = this.getForm();
+//            if (form.isValid()) {
+//                this.constructAjaxRequest({
+//                    url: form.url,
+//                    method: form.method,
+//                    params: form.getValues(false, false, false),
+//                    success: function () {
+//                        this.vgrid.store.reload();
+//                        this.getLayout().setActiveItem(this.vgrid.id);
+//                        Ext.MessageBox.alert("提示", "操作成功！")
+//                    },
+//                    failure: function () {
+//                        Ext.MessageBox.alert("提示", "操作失败！")
+//                    },
+//                    scope: this
+//                });
+//            }
+//        }
+//    },
+    constructAjaxRequest: function (options) {
+        return Ext.Ajax.request({
+            url: options.url,
+            method: options.method,
+            params: options.params,
+            success: options.success,
+            failure: options.failure,
+            scope: options.scope
+        });
+    }
+});

data/app/assets/javascripts/fastui/app/view/VToolbar.js

@@ -0,0 +1,23 @@
+Ext.define('FastUI.view.VToolbar', {
+    extend:'Ext.toolbar.Toolbar',
+    valueObject:{},
+    winId:0,
+    winCtx:{},
+    initComponent:function () {
+        this.items = [
+            {
+                text: 'Button'
+            },
+            {
+                xtype: 'splitbutton',
+                text : 'Split Button'
+            },
+            '->',
+            {
+                xtype    : 'textfield',
+                name     : 'field1',
+                emptyText: 'enter search term'
+            }
+        ]
+    }
+});

data/app/assets/javascripts/fastui/app/view/VTreeGrid.js

@@ -0,0 +1,158 @@
+Ext.define('FastUI.view.VTreeGrid', {
+    extend: 'Ext.tree.Panel',
+    requires: ['FastUI.store.MListMgr'],
+    collapsible: true,
+    useArrows: true,
+    rootVisible: false,
+    multiSelect: false,
+    singleExpand: true,
+    border: false,
+    initComponent: function () {
+        this.title = this.getValue('title');
+        this.columns = this.getTreeGColumns();
+        this.store = this.getTreeGStore();
+        this.callParent();
+    },
+    listeners:{
+        itemclick:function (view, record, item, index, e, eOpts) {
+            this.tab.winCtx.setWinCtx(this.tab.winId, this.tab.rest.getKey(), record.get('id'));
+            this.tab.winCtx.setWinCtx(this.tab.winId, this.tab.rest.getTitle(), record.get('title'));
+            if (record.get('m_entity_id')) {
+                this.tab.winCtx.setWinCtx(this.tab.winId, 'm_entity_id', record.get('m_entity_id'));
+            }
+            this.tab.getBtn('edit').enable();
+            this.tab.getBtn('del').enable();
+        }
+    },
+    selectedId: function () {
+        var id = 0;
+        var records = this.getSelectionModel().getSelection();
+        if (!Ext.isEmpty(records)) {
+            id = records[0].get('id');
+        }
+        return id;
+    },
+    getValue: function (key) {
+        return this.tab.valueObject[key] || '';
+    },
+
+    getTreeGStore: function () {
+        return new Ext.data.TreeStore({
+            autoLoad: true,
+            proxy:{
+                type: 'ajax',
+                url: this.tab.rest.indexPath(),
+                reader:{
+                    type:'json',
+                    root:'',
+                    record:''
+                    //successProperty:''
+                }
+            },
+            root: {
+                name:'Root',
+                expanded: true
+            },
+            fields: this.getTreeGFields()
+        })
+    },
+    getMColumns: function () {
+        return this.tab.valueObject.members || [];
+    },
+    getTreeGFields: function () {
+        var fields = [];
+        Ext.each(this.getMColumns(), function (column) {
+            var field = {
+                name: column.name,
+                type: 'auto'
+            };
+            switch (column.datatype) {
+                case 'VLookup':
+                    var entity = {
+                        name: column.name.replace('_id', ''),
+                        type: 'auto'
+                    };
+                    fields.push(entity);
+            }
+            fields.push(field);
+        }, this);
+        return fields;
+    },
+    getTreeGColumns: function () {
+        var columns = [];
+        Ext.each(this.getMColumns(), function (column) {
+            switch (column.datatype) {
+                case 'VTree':
+                    columns.push({
+                        text: column.title,
+                        xtype: 'treecolumn',
+                        flex: 2.5,
+                        dataIndex: column.name
+                    });
+                    break;
+
+                case 'VLookup':
+                    var entity = column.name.replace('_id', '');
+                    columns.push({
+                        text: column.title,
+                        xtype: 'templatecolumn',
+                        dataIndex: column.name,
+                        tpl: new Ext.XTemplate(
+                        '<tpl for="' + entity + '">',
+                        '{title}',
+                        '</tpl>'
+                        )
+                    });
+                    break;
+
+                case 'VSingleChoice':
+                    var list_store = FastUI.store.MListMgr.getStore(column.name);
+                    columns.push({
+                        text: column.title,
+                        dataIndex: column.name,
+                        renderer: function (val) {
+                        var index = list_store.findExact('name', val);
+                        if (index > -1) {
+                            var rs = list_store.getAt(index).data;
+                            return rs.title;
+                        }
+                        return "";
+                        }
+                    });
+                    break;
+
+                case 'VSexSelect':
+                    columns.push({
+                        text: column.title,
+                        dataIndex: column.name,
+                        renderer: function (val) {
+                        return val ? '男' : '女'
+                        }
+                    });
+                    break;
+
+                case 'VYesOrNo':
+                    columns.push({
+                        text: column.title,
+                        dataIndex: column.name,
+                        renderer: function (val) {
+                        return val ? '是' : '否';
+                        }
+                    });
+                    break;
+
+                default:
+                    columns.push({
+                        text: column.title,
+                        dataIndex: column.name
+                    });
+                    break;
+            }
+
+        }, this);
+        return columns;
+    }
+});
+
+
+

data/app/assets/javascripts/fastui/app/view/VVWindow.js

@@ -0,0 +1,72 @@
+Ext.define('FastUI.view.VVWindow', {
+    extend:'Ext.ux.tab.VerticalPanel',
+    alias:'widget.vvwindow',
+    valueObject: {},
+    closable: true,
+    activeTab:0,
+    plain:true,
+    border:false,
+    //bodyStyle: 'padding-left: 2px',
+    defaults:{autoScroll:true, border: false},
+    tabsConfig:{
+        width:130,
+        textAlign:'left',
+        marginTop:50    /* Push the tab strip down 30px from top. If not set, defaults to 0.*/
+    },
+
+    initComponent:function () {
+        this.winCtx = FastUI.Env.getCtx();
+        this.title = this.getValue('title');
+        this.subs = [];
+        this.callParent();
+    },
+    getValue:function(key){
+        return this.valueObject[key];
+    },
+    getTabValues:function(){
+        return this.valueObject.m_tabs;
+    },
+    listeners:{
+        beforerender:function (vwindow, opts) {
+            this.loadTabs(vwindow, opts);
+        }
+    },
+    loadTabs:function (vwindow, opts) {
+        vwindow.getSubTabs(0,'');
+        Ext.each(vwindow.subs, function (mtab) {
+           // var vTab ;
+//            switch(vwindow.getValue('window_kind')){
+//                case 'maintain':
+//                     vTab = Ext.create('FastUI.view.VTab', {
+//                        valueObject: mtab,
+//                        winId:vwindow.id,
+//                        winCtx: vwindow.winCtx
+//                    });
+//                    break;
+//                case 'custom':
+//                    vTab = Ext.create('FastUI.view.VCustomTab', {
+//                        valueObject: mtab,
+//                        winId:vwindow.id,
+//                        winCtx: vwindow.winCtx
+//                    });
+//                    break;
+//            }
+            var vTab = Ext.create('FastUI.view.VTab', {
+                valueObject: mtab,
+                winId:vwindow.id,
+                winCtx: vwindow.winCtx
+            });
+            vwindow.add(vTab);
+        });
+    },
+    getSubTabs:function(pid,level){
+        Ext.each(this.getTabValues(),function(tab){
+            if(tab.included_tab_id == pid){
+                tab.level =  level;
+                this.subs.push(tab);
+                this.getSubTabs(tab.id,level + '　');
+            }
+        },this);
+    }
+
+});

data/app/assets/javascripts/fastui/app/view/VWindow.js

@@ -0,0 +1,52 @@
+Ext.define('FastUI.view.VWindow', {
+    extend:'Ext.TabPanel',
+    requires:['FastUI.Env'],
+    alias:'widget.vwindow',
+    valueObject: {},
+    activeTab: 0,
+    closable: true,
+    tabPosition : "left",
+    border:true,
+    initComponent:function(){
+        this.winCtx = FastUI.Env.getCtx();
+        this.title = this.getValue('title');
+        this.subs = [];
+        this.callParent();
+    },
+    getValue:function(key){
+        return this.valueObject[key];
+    },
+    getTabValues:function(){
+        return this.valueObject.tabs;
+    },
+    listeners:{
+        afterrender: function(vwindow, opts) {
+
+        },
+        beforerender:function (vwindow, opts) {
+            this.loadTabs(vwindow, opts);
+        }
+    },
+    loadTabs:function (vwindow, opts) {
+        //vwindow.getSubTabs(0,'');
+        Ext.each(vwindow.getTabValues(), function (mtab) {
+            var vTab = Ext.create('FastUI.view.VTab', {
+                valueObject: mtab,
+                winId:vwindow.id,
+                winCtx: vwindow.winCtx
+            });
+            vwindow.add(vTab);
+        });
+        vwindow.setActiveTab(0);
+    },
+    getSubTabs:function(pid,level){
+        Ext.each(this.getTabValues(),function(tab){
+            if(tab.included_tab == pid){
+                tab.level =  level;
+                this.subs.push(tab);
+                this.getSubTabs(tab.id,level + '　');
+            }
+        },this);
+    }
+});
+

data/app/assets/javascripts/fastui/app/view/Viewport.js

@@ -0,0 +1,54 @@
+Ext.define('FastUI.view.Viewport', {
+    extend:'Ext.container.Viewport',
+    id:'port',
+    layout:'border',
+    items:[
+        {
+            height:43,
+            html:"<div class=\'fastui-header\'><span class=\'caption\'>"+ app_project +"</span><span class=\'version\'>("+ app_version +")</span></div>",
+            region:"north",
+            split:true,
+            xtype:"component"
+        },
+        {
+            region:"west",
+            activeTab:0,
+            collapseMode:"mini",
+            collapsible:true,
+            split:true,
+            width:295,
+            defaults:{border:false},
+            items:[Ext.create('FastUI.view.VMenu'),{title:'帮助',iconCls:'fastui-btn-help'}],
+            xtype:"tabpanel"
+        },
+        {
+            region:"south",
+            border:false,
+            height:28,
+            items:[{xtype:"tbfill"},{style:"font-weight:bold",text:app_copyright ,xtype:"tbtext"}],
+            xtype:"toolbar"
+        },
+        {
+            id:'mycenter',
+               region: 'center',
+               xtype: 'tabpanel', // TabPanel itself has no title
+               activeTab: 0,      // First tab active by default
+            //maskOnDisable: false,
+
+               items: [{
+                   title: '首页',
+                   iconCls:'fastui-home',
+                   border:false,
+
+                   html: 'The first tab\'s content. Others may be added dynamically'
+               }]
+        }
+    ],
+    listeners: {
+        afterrender: function() {
+            var mask = Ext.get('fastui-loading');
+            mask.fadeOut({callback: function(){ mask.destroy(); }});
+        }
+    }
+});
+

data/app/assets/javascripts/fastui/app/view/vfield/VCheckBox.js

@@ -0,0 +1,19 @@
+Ext.define('FastUI.view.vfield.VCheckBox',{
+    extend: 'Ext.form.field.CheckBox',
+
+    valueObject: {},
+    winCtx:{},
+    winId:0,
+    rest:{},
+
+    initComponent:function(){
+        this.fieldLabel = this.getFValue('title');
+        this.name =  this.rest.getTableName() + '[' + this.getFValue('m_property').name + ']';
+        this.disabled = this.getFValue('is_readonly');
+        this.allowBlank = true;
+        this.callParent();
+    },
+    getFValue:function (key) {
+        return this.valueObject[key];
+    }
+});

data/app/assets/javascripts/fastui/app/view/vfield/VCheckboxGroup.js

@@ -0,0 +1,19 @@
+Ext.define('FastUI.view.vfield.VCheckboxGroup',{
+    extend: 'Ext.form.VCheckboxGroup',
+
+    valueObject: {},
+    winCtx:{},
+    winId:0,
+    rest:{},
+
+    initComponent:function(){
+        this.fieldLabel = this.getFValue('title');
+        this.name =  this.rest.getTableName() + '[' + this.getFValue('m_property').name + ']';
+        this.disabled = this.getFValue('is_readonly');
+        this.allowBlank = true;
+        this.callParent();
+    },
+    getFValue:function (key) {
+        return this.valueObject[key];
+    }
+});