Открытие кастомной страницы

advertisement
Открытие кастомной страницы
Рассмотрим открытие своей страницы на следующем примере:


в разделе "Контакты" в навигационную панель добавляем кнопку "Поиск"
при нажатии на эту кнопку должна открываться наша страница со списком контактов, но
работать страница должна в online-режиме, чтобы пользователь мог в любой момент, имея
интернет-соединение, найти контакта, даже если его нет в его приложении
1. Создаем свою страницу грида "Контактов", если этой страницы еще нет.
Expand source
Terrasoft.Router.add("search_online", {
handlers: {
load: "loadSearchPage",
unload: "unloadSearchPage"
}
});
Terrasoft.OnlinePageData = {
controllerName: "ContactGridPageOnline.Controller",
pageSchemaName: "ContactGridPageOnline.View",
viewXType: "contactgridpageonlineview"
};
Terrasoft.PageCache.addItem("ContactGridPageOnline.View",
Terrasoft.OnlinePageData);
Terrasoft.LastLoadedPageData = {
controllerName: "ContactGridPage.Controller",
viewXType: "contactgridpageview"
};
Ext.define("ContactGridPage.View", {
extend: "Terrasoft.view.BaseGridPage.View",
xtype: "contactgridpageview",
config: {
id: "ContactGridPage",
grid: {
store: "ContactGridPage.Store"
}
}
});
Ext.define("ContactGridPage.Controller", {
extend: "Terrasoft.controller.BaseGridPage",
statics: {
Model: Contact
},
config: {
refs: {
view: "#ContactGridPage"
}
},
initializeFilterPanel: function(view) {
this.callParent(arguments);
this.initializeSearchButton();
},
initializeSearchButton: function() {
var view = this.getView();
var navigationPanel = view.getNavigationPanel();
navigationPanel.addButton({
text: "Поиск",
listeners: {
tap: this.onSearchButtonTap,
scope: this
}
}, 0);
},
onSearchButtonTap: function() {
Terrasoft.Router.route("search_online", this,
[Terrasoft.OnlinePageData]);
},
loadSearchPage: function(config) {
Terrasoft.PageNavigator.forward(config);
},
unloadSearchPage: function() {
Terrasoft.PageNavigator.backward();
}
});
Ext.define("ContactGridPage.Store", {
extend: "Terrasoft.store.BaseStore",
config: {
model: "Contact",
controller: "ContactGridPage.Controller"
}
});
Суть изменений в этой странице следующая:






Добавляем "маршрут" навигации:
Terrasoft.Router.add("search_online", {
handlers: {
load: "loadSearchPage",
unload: "unloadSearchPage"
}
});
В этом маршруте указываются обработчики, срабатывающие в текущем scope при загрузке
кастомной страницы и при ее выгрузке.






Указывается информация, необходимая PageCache, а именно связт между view и controller
Terrasoft.OnlinePageData = {
controllerName: "ContactGridPageOnline.Controller",
pageSchemaName: "ContactGridPageOnline.View",
viewXType: "contactgridpageonlineview"
};
Terrasoft.PageCache.addItem("ContactGridPageOnline.View",
Terrasoft.OnlinePageData);

И в контроллере текущей страницы реализовываются методы загрузки\выгрузки кастомной
страницы loadSearchPage() и unloadSearchPage().
При этом для загрузки\выгрузки страницы используются методы Terrasoft.PageNavigator:
Открытие страницы:
Terrasoft.PageNavigator.forward(config);
И выгрузка страницы (возвращение в предыдущую страницу):
Terrasoft.PageNavigator.backward();
2. Создаем свою страницу online-поиска контактов:
Expand source
Terrasoft.LastLoadedPageData = {
controllerName: "ContactGridPageOnline.Controller",
viewXType: "contactgridpageonlineview"
};
Ext.define("ContactGridPageOnline.View", {
extend: "Terrasoft.view.BaseGridPage.View",
xtype: "contactgridpageonlineview",
config: {
id: "ContactGridPageOnline",
grid: {
store: "ContactGridPageOnline.Store"
}
}
});
Ext.define("ContactGridPageOnline.Controller", {
extend: "Terrasoft.controller.BaseGridPage",
statics: {
Model: Contact
},
config: {
refs: {
view: "#ContactGridPageOnline"
}
},
onBeforeLoadStore: function(store, operation) {
store.setProxy("odata");
this.callParent(arguments);
}
});
Ext.define("ContactGridPageOnline.Store", {
extend: "Terrasoft.store.BaseStore",
config: {
model: "Contact",
controller: "ContactGridPageOnline.Controller"
}
});
Ключевое изменение - использование обработчика onBeforeLoadStore():
onBeforeLoadStore: function(store, operation) {
store.setProxy("odata");
this.callParent(arguments);
}
В этом обработчике мы меняем прокси у store, указывая, что при загрузке данных мы будем
использовать "odata", т.е. будем работать в online-режиме.
Download