查询列表界面逻辑调整

frontend/saas-web/app/view/core/query/QueryFormPanel.js

@@ -33,7 +33,15 @@ Ext.define('saas.view.core.query.QueryFormPanel', {
             xtype: 'button',
             text: '查询',
             handler: 'onQuery'
-        }, '->']
+        }, '->', {
+            xtype: 'button',
+            text: 'Debugger',
+            handler: function(btn) {
+                var queryFormPanel = btn.up('form'),
+                queryPanel = queryFormPanel.up('panel');
+                debugger;
+            }
+        }]
     }]
 
     // controller: 'core-query-formpanel',

frontend/saas-web/app/view/core/query/QueryGridPanel.js

@@ -1,11 +1,11 @@
 Ext.define('saas.view.core.query.QueryGridPanel', {
     extend: 'Ext.grid.Panel',
     xtype: 'core-query-querygridpanel',
-    
+
     //工具类
     QueryUtil: Ext.create('saas.util.QueryUtil'),
     GridUtil: Ext.create('saas.util.GridUtil'),
-    
+
     //字段属性
     _codeField: '',
     _statusField: '',
@@ -13,109 +13,121 @@ Ext.define('saas.view.core.query.QueryGridPanel', {
     _BaseColumn: '',
     _RelativeColumn: '',
     //数据属性
-    listUrl:'http://192.168.0.181:8560/api/purchase/purchase/list',
+    listUrl: 'http://192.168.0.181:8560/api/purchase/purchase/list',
 
     //基础属性
     border: 1,
     anchor: '100% 70%',
     loadMask: true,
-    frame:true,
+    frame: true,
     showIndex: true,
-    columnWidth:1.0,
-    showRowNum:true,
-	autoQuery: true,
-    selModel:'checkboxmodel',
-    store: {
-        data: []
-    },
-   
-    initComponent: function() {
+    columnWidth: 1.0,
+    showRowNum: true,
+    autoQuery: true,
+    selModel: 'checkboxmodel',
+
+    initComponent: function () {
         var me = this;
         Ext.apply(me, {
+            store: Ext.create('Ext.data.Store', {
+                fields: me.getFields(),
+                autoLoad: true,
+                pageSize: 5,
+                data: [],
+                proxy: {
+                    type: 'ajax',
+                    url: me.listUrl,
+                    actionMethods: {
+                        read: 'GET'
+                    },
+                    reader: {
+                        type: 'json',
+                        rootProperty: 'data.list',
+                        totalProperty: 'data.total',
+                    }
+                },
+                listeners: {
+                    beforeload: function (store, op) {
+                        var condition = '';
+                        if (Ext.isEmpty(condition)) {
+                            condition = " 1=1 ";
+                        }
+                        console.log("condition:" + condition);
+                        Ext.apply(store.proxy.extraParams, {
+                            number: op._start + 1,
+                            size: store.pageSize,
+                            keyword: condition
+                        });
+
+                    }
+                }
+            }),
             dockedItems: [{
                 xtype: 'toolbar',
                 dock: 'top',
-                items: ['->',{
-                    text:'新增',
-                    handler:me.onAddMore
+                items: ['->', {
+                    text: '新增',
+                    handler: me.onAddMore
                 }, {
-                    text:'审核',
+                    text: '审核',
                     handler: me.onAudit
                 }, {
-                    text:'打印',
+                    text: '打印',
                     handler: me.onPrint
                 }, {
-                    text:'导出',
+                    text: '导出',
                     handler: me.onExport
                 }, {
-                    text:'删除',
+                    text: '删除',
                     handler: me.onDelete
                 }]
-            }],
-            bbar: {
+            }, {
                 xtype: 'pagingtoolbar',
+                dock: 'bottom',
+                id: 'query-bbar',
                 displayInfo: true,
-                displayMsg: 'Displaying topics {0} - {1} of {2}',
                 emptyMsg: "暂无数据",
-            },
-            store: me.setStore()
+                store: me.store,
+                displayMsg: '当前显示第{0}到{1}条数据,一共有{2}条',
+                beforePageText: "当前第",
+                afterPageText: "页,共{0}页"
+            }],
         });
-        me.listUrl && me.QueryUtil.queryData(me);
         me.callParent(arguments);
     },
 
     listeners: {
-        afterrender: function(grid) {
-            //没数据先暂时这样处理下
-            if(grid.store.count()==0){
-                grid.add10EmptyRow();
-            }
-        },
-        itemClick: function(tableView, record, item, index, e, eOpts) {
+        itemClick: function (tableView, record, item, index, e, eOpts) {
             var grid = tableView.up('grid'),
                 store = grid.store,
                 count = store.getCount();
-                console.log("store");
-                console.log(store);
+            console.log("store");
+            console.log(store);
         }
     },
-    add10EmptyRow: function() {
-        var me = this,
-            store = me.getStore(),
-            selectedRecord = me.selModel.lastSelected,
-            datas = [];
-        Ext.Array.each(new Array(10), function() {
-            datas.push({});
-        })
-        store.insert(store.indexOf(selectedRecord) + 1, datas);
-    },
-    setStore:function(){
-        var me=this;
-        var store =  {
-                data: []
-            };
-        if(me.fields){
-            var store=Ext.create('Ext.data.Store',{
-                fields:me.fields,
-                autoLoad: true,
-                data :[]
-            });
-        }
-        return store;
+
+    getFields: function() {
+        var me = this;
+
+        return me.columns.filter(function(c) {
+            return !!c.dataIndex;
+        }).map(function(c) {
+            return c.dataIndex;
+        });
     },
-    onAddMore: function(btn) {
+    onAddMore: function (btn) {
         console.log("跳转到主从表");
     },
-    onAudit: function(){
+    onAudit: function () {
         console.log("审核");
     },
-    onPrint: function(){
+    onPrint: function () {
         console.log("打印");
     },
-    onExport: function(){
+    onExport: function () {
         console.log("导出");
     },
-    onDelete: function() {
+    onDelete: function () {
         console.log("删除该行");
     }
 });

frontend/saas-web/app/view/core/query/QueryPanel.js

@@ -22,6 +22,7 @@ Ext.define('saas.view.core.query.QueryPanel', {
     initComponent: function () {
         var me = this;
         me.setQueryItems(me.queryFormItems);
+        me.setQuertGridColumns(me.queryGridConfig);
         me.callParent(arguments);
     },
 
@@ -41,9 +42,16 @@ Ext.define('saas.view.core.query.QueryPanel', {
 
     setQueryItems: function (items) {
         var me = this,
-            queryForm = me.items[0];
+        queryForm = me.items[0];
 
         queryForm.items = items;
     },
 
+    setQuertGridColumns: function(config) {
+        var me = this,
+        queryGrid = me.items[1];
+
+        Ext.apply(queryGrid, config);
+    }
+
 });

frontend/saas-web/app/view/core/query/QueryPanelController.js

@@ -28,8 +28,9 @@ Ext.define('saas.view.core.query.QueryPanelController', {
         win.show();
     },
     onQuery: function (btn) {
-        console.log("查询");
         var me = this,
-        panel = me.getView();
+        panel = me.getView(),
+        model = me.getViewModel();
+        console.log("查询: ", model.getData());
     }
 });

frontend/saas-web/app/view/main/MainModel.js

@@ -56,7 +56,7 @@ Ext.define('saas.view.main.MainModel', {
                                     {
                                         id: 'myquerytest',
                                         text: '测试-采购单查询界面',
-                                        viewType: 'test-query-formpanel',
+                                        viewType: 'test-query-querypanel',
                                         leaf: true
                                     },
                                     {

frontend/saas-web/app/view/test/query/QueryFormPanel.js

@@ -1,82 +0,0 @@
-Ext.define('saas.view.test.query.QueryFormPanel', {
-    extend: 'Ext.form.Panel',
-    xtype: 'test-query-queryformpanel',
-
-    QueryUtil: Ext.create('saas.util.QueryUtil'),
-
-    viewModel: 'test-query-queryformpanel',
-    viewName:'',
-    layout: 'column',
-    autoScroll: true,
-    anchor: '100% 30%',
-    buttonAlign : 'center',
-    bodyPadding: 5,
-    labelSeparator : ':',
-    defaults:{
-		xtype:'textfield',
-		columnWidth:0.33,
-		margin:'5 5 5 5'
-	},
-    fieldDefaults: {
-        margin: '0 5 5 0',
-        labelAlign: 'right',
-        labelWidth: 90,
-        columnWidth: 0.25,
-        blankText: '该字段不能为空'
-    },
-
-    remoteConfig: false, // 是否需要从远端读取form配置
-    bindFields: [], // 已绑定字段（需要保存到数据库）
-    initComponent: function() {
-        var me = this;
-        Ext.apply(me, {
-            dockedItems: [{
-                xtype: 'toolbar',
-                dock: 'bottom',
-                style: {
-                    'border-bottom': '1px solid #35baf6 !important'
-                },
-                items: ['->',{
-                    xtype: 'button',
-                    text: '更多查询',
-                    handler: me.moreQuery
-                }, {
-                    xtype: 'button',
-                    text: '查询',
-                    handler: me.onQuery
-                },'->']
-            }]
-        });
-        me.callParent(arguments);
-    },
-    moreQuery: function(btn){
-        var win = Ext.getCmp('queryMoreWin');
-        if(!win){
-            win = Ext.create('Ext.window.Window', {
-            id:'queryMoreWin', 
-            modal:true,
-            height: '50%',
-            width: '50%',
-            title: '更多查询',
-            scrollable: true,
-            bodyPadding: 10,
-            constrain: true,
-            closable: true,
-            layout:'fit',
-            renderTo:Ext.getCmp('main-tab-panel').getActiveTab().getEl(),
-            items:[{
-                xtype:'core-query-querymoreformpanel',
-                viewName:btn.ownerCt.ownerCt.ownerCt.viewName+"-moreQuery",
-                items:[]
-            }]
-        });
-    };
-        win.show();
-    },
-    onQuery: function(btn){
-        console.log("查询");
-        var me = this,
-            parentForm = btn.ownerCt.ownerCt.ownerCt;
-        me.QueryUtil.onQuery(parentForm);
-    }
-});

frontend/saas-web/app/view/test/query/QueryPanel.js

@@ -1,6 +1,6 @@
 Ext.define('saas.view.test.query.QueryPanel', {
     extend: 'saas.view.core.query.QueryPanel',
-    xtype: 'test-query-formpanel',
+    xtype: 'test-query-querypanel',
 
     // controller: 'test-query-formcontroller',
     // viewModel: 'test-query-formmodel',
@@ -120,22 +120,24 @@ Ext.define('saas.view.test.query.QueryPanel', {
         allowBlank: true,
         columnWidth: 1
     }],
-    queryGridColumns: [{
-        text: '序号',
-        width: 80,
-        xtype: 'rownumberer'
-    }, {
-        text: 'id',
-        dataIndex: 'pu_id',
-        width: 100,
-        xtype: 'numbercolumn'
-    }, {
-        text: '单据编号',
-        dataIndex: 'pu_code',
-        width: 120
-    }, {
-        text: '单据状态',
-        dataIndex: 'pu_status',
-        width: 120
-    }]
+    queryGridConfig: {
+        columns: [{
+            text: '序号',
+            width: 80,
+            xtype: 'rownumberer'
+        }, {
+            text: 'id',
+            dataIndex: 'pu_id',
+            width: 100,
+            xtype: 'numbercolumn'
+        }, {
+            text: '单据编号',
+            dataIndex: 'pu_code',
+            width: 120
+        }, {
+            text: '单据状态',
+            dataIndex: 'pu_status',
+            width: 120
+        }]
+    }
 });

frontend/saas-web/app/view/test/query/QueryPanelController.js

@@ -0,0 +1,5 @@
+Ext.define('saas.view.test.query.QueryPanelController', {
+    extend: 'saas.view.core.query.QueryPanelController',
+    alias: 'controller.test-query-querypanel',
+
+});

frontend/saas-web/app/view/test/query/QueryPanelModel.js

@@ -0,0 +1,4 @@
+Ext.define('saas.view.test.query.QueryPanelModel', {
+    extend: 'saas.view.core.query.QueryPanelModel',
+    alias: 'viewmodel.test-query-querypanel',
+});