校长信箱页面基础功能实现

frontend/pc-web/app/view/Interaction/mailbox/MailboxController.js

@@ -0,0 +1,85 @@
+Ext.define('school.view.Interaction.mailbox.MailboxController', {
+    extend: 'Ext.app.ViewController',
+    alias: 'controller.interaction-mailbox-mailbox',
+    // 回复
+    ReplyClick: function () {
+        Ext.MessageBox.show({
+            title: '回复处理',
+            msg: '回复对象：'+rec.data.code,
+            width:500,
+            height:600,
+            buttons: Ext.MessageBox.OKCANCEL,
+            multiline: true,
+            scope: this,
+            fn: this.showResultText,//处理输入的文字
+        });
+    },
+    // 导出
+    exportClick: function () {
+        Ext.Msg.alert('导出', '我是导出');
+    },
+    //删除
+    deleteClick: function (o) {
+        let gird = o.ownerCt.ownerCt;
+        let data = gird.getSelectionModel().getSelection();
+        if(data.length == 0){
+            Ext.Msg.alert("提示","您最少要选择一条数据");
+        }else{
+            //1.先得到ID的数据(name)
+            let st = gird.getStore();
+            let ids = [];
+            Ext.Array.each(data,function(record){
+                ids.push(record.get('name'));
+            })
+            Ext.MessageBox.confirm('删除邮件','你确定要删除吗?',function(btn){
+                if (btn == 'yes') {
+                    //2.后台操作(delet)
+                    // Ext.Ajax.request({
+                    //     url:'/extjs/extjs!deleteData.action',
+                    //     params:{ids:ids.join(",")},
+                    //     method:'POST',
+                    //     timeout:2000,
+                    //     success:function(response,opts){
+                    //         Ext.Array.each(data,function(record){
+                    //             st.remove(record);
+                    //         })
+                    //     }
+                    // })
+                    //3.前端操作DOM进行删除(ExtJs)
+                    Ext.Array.each(data,function(record){
+                        st.remove(record);
+                    })
+                }
+            });
+        }
+    },
+    // 批量回复
+    batchClick: function (o) {
+        let gird = o.ownerCt.ownerCt;
+        let items = gird.getStore().data.items;//所有的内容
+        let batch = [];
+        for (let i = 0; i < items.length; i++) {
+            if (items[i].data.Handle) {
+                batch.push(items[i].data.code)
+                Ext.MessageBox.show({
+                    title: '回复处理',
+                    msg: '回复对象：'+batch.join(','),
+                    width:500,
+                    height:600,
+                    buttons: Ext.MessageBox.OKCANCEL,
+                    multiline: true,
+                    scope: this,
+                    fn: this.showResultText,//回调函数
+                });
+            }
+        }
+    },
+    // 回调函数
+    showResultText: function (btn,text) {
+        if (btn == 'ok') {
+            alert('点击的按钮是：'+btn+'内容是：'+text);
+        } else {
+            return
+        }
+    },
+});

frontend/pc-web/app/view/Interaction/mailbox/mailbox.js

@@ -1,11 +1,13 @@
 /**
  * 校长信箱
  */
-Ext.define('school.view.interaction.mailbox.mailbox', {
-    // extend: 'school.view.core.base.BasePanel',
+Ext.define('school.view.interaction.mailbox.Mailbox', {
     extend: 'Ext.grid.Panel',
     xtype: 'interaction-mailbox-mailbox',
     // dataUrl: '/api/interact/timetable/list',
+
+    controller: 'interaction-mailbox-mailbox',
+
     //字段属性
     _title: '校长信箱',
     _idField: 'id',
@@ -28,9 +30,9 @@ Ext.define('school.view.interaction.mailbox.mailbox', {
             store: Ext.create('Ext.data.Store', {
                 fields:['code', 'content', 'Enclosure', 'time', 'name', 'Handle'],
                 data:[
-                    {code:"U001", content:"孩子作业太少了，回家每天玩王者荣耀，希望学校老师布置作业多一点，让我孩子忙起来", Enclosure:'无', time:"01/10/2004 16:00", name:'张三', Handle:'true'},
-                    {code:"U001", content:"学校课本费收入明细未公开，希望课本费明细能够向我们家长公开", Enclosure:'有', time:"01/10/2004 16:00", name:'张三', Handle:'false'},
-                    {code:"U001", content:"觉得十分激烈的交锋了", Enclosure:'无', time:"01/10/2004 16:00", name:'张三', Handle:'true'},
+                    {code:"U001", content:"孩子作业太少了，回家每天玩王者荣耀，希望学校老师布置作业多一点，让我孩子忙起来", Enclosure:'无', time:"01/10/2004 16:00", name:'张三', Handle:true},
+                    {code:"U002", content:"学校课本费收入明细未公开，希望课本费明细能够向我们家长公开", Enclosure:'有', time:"01/10/2004 16:00", name:'张三', Handle:false},
+                    {code:"U003", content:"觉得十分激烈的交锋了", Enclosure:'无', time:"01/10/2004 16:00", name:'张三', Handle:true},
                 ]
             }),
             columns : [
@@ -43,42 +45,65 @@ Ext.define('school.view.interaction.mailbox.mailbox', {
                     renderer: function(val,meta,rec) {
                         // 为元素生成唯一id
                         var id = Ext.id();
-                        if (rec.data.Handle == 'false') {
+                        if (!rec.data.Handle) {
                             return Ext.String.format('<div>已回复</div>');
-                        } else if(rec.data.Handle == 'true'){
+                        } else {
                             Ext.defer(function() {
                                 Ext.widget('button', {
                                     renderTo: id,
                                     text: '回复',
-                                    handler: function() {//点击回复事件
+                                    // handler: 'ReplyClick'//点击回复事件
+                                    handler: function () {//点击回复事件
                                         Ext.MessageBox.show({
                                             title: '回复处理',
                                             msg: '回复对象：'+rec.data.code,
                                             width:500,
                                             height:600,
-                                            bbar: Ext.MessageBox.OKCANCEL,
+                                            buttons: Ext.MessageBox.OKCANCEL,
                                             multiline: true,
                                             scope: this,
-                                            fn: this.showResultText,
+                                            fn: function (btn,text) {//回调函数
+                                                if (btn == 'ok') {
+                                                    alert('点击的按钮是：'+btn+'内容是：'+text);
+                                                } else {
+                                                    return
+                                                }
+                                            },
                                         });
-                                    }
+                                    } 
                                 });
                             }, 50);
                             return Ext.String.format('<div id="{0}"></div>', id);
                         }
                     }
-                }
+                },
             ],
+            listeners: {// 每一行添加点击事件
+                'rowclick': function(grid, rowIndex, e) {
+                    let data = rowIndex.data//获取点击行的数据
+                    // console.log(data);
+                },
+            },
             tbar: ['->',{
                 xtype: 'button',
-                text: '导出'
+                text: '导出',
+                handler: 'exportClick'
             }, {
                 xtype: 'button',
-                text: '删除'
+                text: '删除',
+                handler: 'deleteClick'
             }, {
                 xtype: 'button',
-                text: '批量回复'
+                text: '批量回复',
+                handler: 'batchClick'
             }],
+            multiSelect:true,//运行多选，默认是单选
+            dockedItems :[{//分页组件
+				xtype:'pagingtoolbar',//分页组件 
+				store:Ext.data.StoreManager.lookup('s_user'),//分页组件也需要获取到数据
+				dock:'bottom',//定位到底部
+				displayInfo:true//是否展示信息
+			}],
         });
         this.callParent();
     },