main.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. const Mn = require('backbone.marionette');
  2. const App = require('../main');
  3. const UserModel = require('../../models/user');
  4. const ListView = require('./list/main');
  5. const ErrorView = require('../error/main');
  6. const template = require('./main.ejs');
  7. module.exports = Mn.View.extend({
  8. id: 'users',
  9. template: template,
  10. ui: {
  11. list_region: '.list-region',
  12. add: '.add-item',
  13. dimmer: '.dimmer',
  14. search: '.search-form',
  15. query: 'input[name="source-query"]'
  16. },
  17. fetch: App.Api.Users.getAll,
  18. showData: function(response) {
  19. this.showChildView('list_region', new ListView({
  20. collection: new UserModel.Collection(response)
  21. }));
  22. },
  23. showError: function(err) {
  24. this.showChildView('list_region', new ErrorView({
  25. code: err.code,
  26. message: err.message,
  27. retry: function () {
  28. App.Controller.showUsers();
  29. }
  30. }));
  31. console.error(err);
  32. },
  33. regions: {
  34. list_region: '@ui.list_region'
  35. },
  36. events: {
  37. 'click @ui.add': function (e) {
  38. e.preventDefault();
  39. App.Controller.showUserForm(new UserModel.Model());
  40. },
  41. 'submit @ui.search': function (e) {
  42. e.preventDefault();
  43. let query = this.ui.query.val();
  44. this.fetch(['permissions'], query)
  45. .then(response => this.showData(response))
  46. .catch(err => {
  47. this.showError(err);
  48. });
  49. }
  50. },
  51. onRender: function () {
  52. let view = this;
  53. view.fetch(['permissions'])
  54. .then(response => {
  55. if (!view.isDestroyed() && response && response.length) {
  56. view.showData(response);
  57. }
  58. })
  59. .catch(err => {
  60. view.showError(err);
  61. })
  62. .then(() => {
  63. view.ui.dimmer.removeClass('active');
  64. });
  65. }
  66. });