user-20070921.js

anewssystem新闻发布系统集成使用了spring hibernate freemarker EXTJS等开源框架 可以作为学习参考

    // 默认需要id, name, theSort, parent, children
    // 其他随意定制
    var metaData = [
        {id : 'id',       qtip : "ID",   vType : "integer",   allowBlank : true,  defValue : -1, w:30},
        {id : 'dept',     qtip : '部门', vType : 'treeField', url : "../dept/getChildren.htm", mapping : "dept.name", w:60},
        {id : 'username', qtip : "帐号", vType : "chn",       allowBlank : false, w:60},
        {id : 'password', qtip : '密码', vType : "password",  allowBlank : false, w:60},
        {id : 'truename', qtip : '姓名', vType : "chn", w:60},
        {id : 'sex',      qtip : '性别', vType : "radio", values : [{id : '0', name : '男'}, {id : '1', name : '女'}], defValue : '0', renderer : Ext.lingo.FormUtils.renderSex, w:30},
        {id : 'birthday', qtip : '生日', vType : "date", w:60},
        {id : 'tel',      qtip : '电话', vType : "alphanum", w:60},
        {id : 'mobile',   qtip : '手机', vType : "alphanum", w:60},
        {id : 'email',    qtip : '邮箱', vType : "email"},
        {id : 'duty',     qtip : '职务', vType : "chn", w:50},
        {id : 'status',   qtip : '状态', vType : "integer", renderer : renderStatus, w:40},
        {id : 'descn',    qtip : "备注", vType : "chn"}
    ];

    // 创建表格
    var lightGrid = new UserGridPanel("lightgrid", {
        metaData      : metaData,
        dialogContent : "content"
    });

    // 渲染表格
    lightGrid.render();

    // ========================================================================
    // ========================================================================
    // 在工具栏上添两个按钮，开通和关闭用户
    lightGrid.toolbar.insertButton(3, {
        icon    : "../widgets/lingo/list-items.gif",
        id      : 'openUser',
        text    : '开通',
        cls     : 'add',
        tooltip : '开通',
        handler : openUser
    });
    lightGrid.toolbar.insertButton(4, {
        icon    : "../widgets/lingo/list-items.gif",
        id      : 'closeUser',
        text    : '关闭',
        cls     : 'add',
        tooltip : '关闭',
        handler : closeUser
    });
    // 在工具栏上添一个按钮，选择角色
    lightGrid.toolbar.insertButton(5, {
        icon    : "../widgets/lingo/list-items.gif",
        id      : 'config',
        text    : '选择角色',
        cls     : 'add',
        tooltip : '选择角色',
        handler : selectRole
    });

    // 开通和关闭
    function openUser() {
        var selections = lightGrid.grid.getSelections();
        if (selections.length == 0) {
            Ext.MessageBox.alert("提示", "请选择希望开通的用户！");
            return;
        } else {
            var ids = new Array();
            for(var i = 0, len = selections.length; i < len; i++){
                selections[i].get("id");
                ids[i] = selections[i].get("id");
            }
            Ext.Ajax.request({
                url     : 'openUser.htm?ids=' + ids,
                success : function() {
                    lightGrid.refresh();
                },
                failure : function(){Ext.MessageBox.alert('提示', '操作失败！');}
            });
        }
    }
    function closeUser() {
        var selections = lightGrid.grid.getSelections();
        if (selections.length == 0) {
            Ext.MessageBox.alert("提示", "请选择希望关闭的用户！");
            return;
        } else {
            var ids = new Array();
            for(var i = 0, len = selections.length; i < len; i++){
                selections[i].get("id");
                ids[i] = selections[i].get("id");
            }
            Ext.Ajax.request({
                url     : 'closeUser.htm?ids=' + ids,
                success : function() {
                    lightGrid.refresh();
                },
                failure : function(){Ext.MessageBox.alert('提示', '操作失败！');}
            });
        }
    }

    // ========================================================================
    // ========================================================================
    // 渲染表格的方法
    function renderRole(value, p, record){
        if(record.data['authorized']==true){
            return String.format("<b><font color=green>已分配</font></b>");
        }else{
            return String.format("<b><font color=red>未分配</font></b>");
        }
    }
    function renderNamePlain(value){
        return String.format('{0}', value);
    }
    function renderStatus(value) {
        if(value == 1){
            return String.format("<b><font color=green>开通</font></b>");
        }else{
            return String.format("<b><font color=red>关闭</font></b>");
        }
    }

    // 建一个资源数据映射数组
    var roleRecord = Ext.data.Record.create([
        {name: "id",         mapping:"id",         type: "int"},
        {name: "name",       mapping:"name",       type: "string"},
        {name: "descn",      mapping:"descn",      type: "string"},
        {name: "authorized", mapping:"authorized", type: "boolean"}
    ]);
    // 配置资源
    var roleStore = new Ext.data.Store({
        proxy      : new Ext.data.HttpProxy({url:'getRoles.htm'}),
        reader     : new Ext.data.JsonReader({},roleRecord),
        remoteSort : false
    });
    var roleColumnModel = new Ext.grid.ColumnModel([{
        // 设置了id值，我们就可以应用自定义样式 (比如 .x-grid-col-topic b { color:#333 })
        id        : 'id',
        header    : "编号",
        dataIndex : "id",
        width     : 80,
        sortable  : true,
        renderer  : renderNamePlain,
        css       : 'white-space:normal;'
    }, {
        id        : 'name',
        header    : "角色名称",
        dataIndex : "name",
        sortable  : true,
        width     : 150 ,
        css       : 'white-space:normal;'
    }, {
        id        : 'descn',
        header    : "资源描述",
        dataIndex : "descn",
        sortable  : true,
        width     : 80
    }, {
        id        : 'authorized',
        header    : "是否授权",
        dataIndex : "authorized",
        sortable  : true,
        width     : 80,
        renderer  : renderRole
    }]);
    var roleGrid = new Ext.grid.EditorGrid('role-grid', {
        ds            : roleStore,
        cm            : roleColumnModel,
        selModel      : new Ext.grid.RowSelectionModel({singleSelect:false}),
        enableColLock : false,
        loadMask      : false
    });
    // 渲染表格
    roleGrid.render();
    var roleFooter = roleGrid.getView().getFooterPanel(true);
    var rolePagging = new Ext.PagingToolbar(roleFooter, roleStore, {
        pageSize    : 10,
        displayInfo : true,
        displayMsg  : '显示: {0} - {1} 共 {2}',
        emptyMsg    : "没有找到相关数据"
    });
    rolePagging.add('-', {
        pressed       : true,
        enableToggle  : true,
        text          : '授权',
        cls           : '',
        toggleHandler : roleAuth
    }, '-', {
        pressed      : true,
        enableToggle : true,
        text         : '取消',
        cls          : '',
        toggleHandler: roleCancel
    });

    function roleAuth() {
        roleAuthDo(true);
    }

    function roleCancel() {
        roleAuthDo(false);
    }

    function roleAuthDo(isAuth) {
        //授权事件
        var mRole = lightGrid.grid.getSelections();
        var mResc = roleGrid.getSelections();
        if(mResc.length <= 0) {
            Ext.MessageBox.alert('提示', '请选择至少一行纪录进行操作！');
            return;
        } else {
            var ids = new Array();
            for (var i = 0; i < mResc.length; i++) {
                var rescId = mResc[i].get('id');
                ids[ids.length] = rescId;
            }
            var roleId = mRole[0].get('id');
            Ext.lib.Ajax.request(
                'POST',
                'auth.htm',
                {success:end,failure:end},
                'ids=' + ids.join(",") + "&userId=" + roleId + "&isAuth=" + isAuth
            );
        }
        roleStore.reload();
    }

    function end() {
        Ext.Msg.alert("提示", "操作成功");
        roleStore.reload();
    }

    function selectRole() {
        var m = lightGrid.grid.getSelections();
        if(m.length <= 0) {
            Ext.MessageBox.alert('提示', '请选择需要配置的用户！');
            return;
        }
        // 读取数据需要的参数
        roleStore.on('beforeload', function() {
            roleStore.baseParams = {
                id : lightGrid.grid.getSelections()[0].get('id')
            };
        });
        roleStore.load({params:{
            start : 0,
            limit : 10
        }});
        var roleDialog = Ext.lingo.FormUtils.createLayoutDialog("role-dlg");
        var layout = roleDialog.getLayout();
        layout.beginUpdate();
          layout.add('center', new Ext.ContentPanel('role-inner', {title: '选择角色'}));
        layout.endUpdate();
        roleDialog.show(Ext.get("config"));
    }

});