main-list.component.ts 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
  1. import { MainMenuService } from './../../../shared/main-menu.service';
  2. import { Component, OnInit } from '@angular/core';
  3. import { HttpClient } from '@angular/common/http';
  4. import { AuthServiceService } from './../../../shared/auth-service.service';
  5. import { ActivatedRoute, Router, Params } from '@angular/router';
  6. import { UserService } from '../../../shared/user.service';
  7. import { NgxSpinnerService } from 'ngx-spinner';
  8. import { ToastrService } from 'ngx-toastr';
  9. import { Overlay } from 'ngx-modialog';
  10. import { Modal } from 'ngx-modialog/plugins/bootstrap';
  11. @Component({
  12. selector: 'app-main-list',
  13. templateUrl: './main-list.component.html',
  14. styleUrls: ['./main-list.component.css']
  15. })
  16. export class MainListComponent implements OnInit {
  17. menuId: number;
  18. menuList = [];
  19. menuListIds = [];
  20. count: number;
  21. perPagePagenation: number;
  22. p: number[] = [];
  23. currentPage:number = 1;
  24. filtterStatus = '';
  25. selectedAll: any;
  26. userLoginId:number;
  27. serviceId:number;
  28. dataTableNumber: number = 5;
  29. pages = [];
  30. constructor(private route: ActivatedRoute,
  31. private router: Router,
  32. private userSer: UserService,
  33. private http: HttpClient,
  34. private toastr: ToastrService,
  35. private mainService: MainMenuService,
  36. private spinner: NgxSpinnerService,
  37. private modal: Modal,
  38. private authSer: AuthServiceService) { }
  39. ngOnInit() {
  40. this.spinner.show();
  41. //init the values of permision boolean
  42. this.authSer.showAddBtn = false;
  43. this.authSer.showDeleteBtn = false;
  44. this.authSer.showEditBtn = false;
  45. //show / hide notification search in header
  46. this.authSer.notificationLogin = true;
  47. this.authSer.showSearchHeader = false;
  48. this.authSer.showHeaderLogin = false;
  49. this.authSer.showHeaderDashBoard = true;
  50. this.authSer.showDashboardHeader = true;
  51. this.authSer.internalHeader = false;
  52. this.route.params.subscribe(
  53. (params: Params) => {
  54. this.menuId = params['menuPageId'];
  55. }
  56. );
  57. //to show / hide permissions
  58. this.route.parent.params.subscribe(
  59. (params:Params) => {
  60. this.userLoginId = params['userID'];
  61. this.serviceId = params['serviceID'];
  62. this.userSer.getPagesPermetiotns(this.userLoginId, this.serviceId).subscribe(
  63. (responce) => {
  64. console.log(responce);
  65. this.pages = responce['pages'];
  66. for(let i = 0; i< this.pages.length; i++) {
  67. if(this.pages[i].id == 17) {
  68. for(let j = 0; j < this.pages[i].permissions.length; j++) {
  69. if(this.pages[i].permissions[j].name == 'add_menu'){
  70. this.authSer.showAddBtn = true;
  71. }
  72. if(this.pages[i].permissions[j].name == 'edit_menu'){
  73. this.authSer.showEditBtn = true;
  74. }
  75. if(this.pages[i].permissions[j].name == 'delete_menus'){
  76. this.authSer.showDeleteBtn = true;
  77. }
  78. }
  79. }else {
  80. console.log('no events');
  81. }
  82. }
  83. this.spinner.hide();
  84. },
  85. (error) => {console.log(error)}
  86. );
  87. }
  88. );
  89. //get list data
  90. this.mainService.getMainList(this.menuId, this.currentPage ,this.dataTableNumber).subscribe(
  91. (responce) => {
  92. console.log(responce);
  93. this.menuList = responce['menus'];
  94. this.count = responce['count'];
  95. this.perPagePagenation = responce['per_page'];
  96. console.log('evennnnts', this.menuList);
  97. this.spinner.hide();
  98. },
  99. (error) => {
  100. console.log(error);
  101. this.spinner.hide();
  102. }
  103. );
  104. }
  105. //make all checkbox of user checked
  106. selectAll() {
  107. for (var i = 0; i < this.menuList.length; i++) {
  108. this.menuList[i].selected = this.selectedAll;
  109. }
  110. }
  111. checkIfAllSelected() {
  112. this.selectedAll = this.menuList.every(function(item:any) {
  113. return item.selected == true;
  114. });
  115. }
  116. //filtter function
  117. filtterFunc(data) {
  118. this.menuList = [];
  119. console.log(data.target.value);
  120. const dataSearch = data.target.value;
  121. this.currentPage = 1;
  122. console.log('search curent page', this.currentPage);
  123. console.log('search page id', this.menuId);
  124. this.mainService.getDataUSerSearchBar(dataSearch, this.menuId, this.currentPage, this.dataTableNumber).subscribe(
  125. (responce) => {
  126. console.log(responce);
  127. this.menuList = responce['menus'];
  128. this.count = responce['count'];
  129. this.perPagePagenation = responce['per_page'];
  130. console.log('filtter count', this.count);
  131. console.log('filtter perPagePAgenation', this.perPagePagenation);
  132. },
  133. (error) => {
  134. console.log(error)
  135. }
  136. );
  137. };
  138. //change page
  139. onPageChange(pagenationNumber) {
  140. this.spinner.show();
  141. this.currentPage = pagenationNumber;
  142. this.menuList = [];
  143. //console.log(pagenationNumber);
  144. //console.log(this.pageId);
  145. this.mainService.getMainList(this.menuId, pagenationNumber, this.dataTableNumber).subscribe(
  146. (responce) => {
  147. console.log(responce);
  148. this.menuList = responce['menus'];
  149. this.count = responce['count'];
  150. this.perPagePagenation = responce['per_page'];
  151. console.log(this.menuList);
  152. this.spinner.hide();
  153. },
  154. (error) => {
  155. console.log(error);
  156. this.spinner.hide();
  157. }
  158. );
  159. }
  160. changeRanking(event, id) {
  161. const data = {
  162. id: id,
  163. ranking: event.target.value,
  164. };
  165. console.log(data);
  166. this.http.post(this.authSer.pathApi + '/rank_menu', data).subscribe(
  167. (responce) => {
  168. console.log(responce);
  169. this.mainService.getMainList(this.menuId, this.currentPage, this.dataTableNumber).subscribe(
  170. (responce) => {
  171. console.log(responce);
  172. this.count = responce['count'];
  173. this.perPagePagenation = responce['per_page'];
  174. this.menuList = responce['menus'];
  175. console.log(this.menuList);
  176. this.spinner.hide();
  177. },
  178. (error) => {
  179. console.log(error);
  180. }
  181. )
  182. },
  183. (error) => {console.log(error)},
  184. );
  185. };
  186. //determine the list count from select element
  187. onGetValue(event) {
  188. this.spinner.show();
  189. this.menuList = [];
  190. this.dataTableNumber = event.target.value;
  191. this.mainService.getMainList(this.menuId, this.currentPage, this.dataTableNumber).subscribe(
  192. (responce) => {
  193. console.log(responce);
  194. this.menuList = responce['menus'];
  195. this.count = responce['count'];
  196. this.perPagePagenation = responce['per_page'];
  197. this.spinner.hide();
  198. },
  199. (error) => {
  200. console.log(error);
  201. this.spinner.hide();
  202. }
  203. );
  204. };
  205. onDelete() {
  206. this.menuListIds = [];
  207. for(let i = 0; i < this.menuList.length; i++) {
  208. if(this.menuList[i].selected == true) {
  209. this.menuListIds.push(this.menuList[i].id);
  210. }
  211. }
  212. console.log(this.menuListIds);
  213. if(this.menuListIds.length > 0) {
  214. const dialogRef = this.modal.alert()
  215. .size('sm')
  216. .showClose(true)
  217. .title('تأكيد الحذف')
  218. .body(`
  219. <h4>هل ترغب في حذف العناصر المحدده ؟ </h4>
  220. `)
  221. .open();
  222. dialogRef.result
  223. .then( result =>
  224. this.mainService.deleteMain(this.menuListIds).subscribe(
  225. (responce) => {
  226. console.log(responce);
  227. this.toastr.success('تم الحذف');
  228. window.location.reload();
  229. },
  230. (error) => {
  231. console.log(error);
  232. this.toastr.error('حدث خطأ رجاء الانتظار وحاول ثانيه');
  233. this.spinner.hide();
  234. }
  235. )
  236. );
  237. } else {
  238. this.toastr.warning('لم يتم أختيار أي عنصر للحذف !');
  239. }
  240. // this.mainService.deleteMain(this.menuListIds).subscribe(
  241. // (responce) => {
  242. // console.log(responce);
  243. // this.toastr.success('تم الحذف');
  244. // window.location.reload();
  245. // },
  246. // (error) => {
  247. // console.log(error);
  248. // this.spinner.hide();
  249. // },
  250. // );
  251. };
  252. //add function
  253. onAdd() {
  254. console.log('service/' + this.userLoginId + '/' + this.serviceId + '/addMenu');
  255. this.router.navigate(['service/' + this.userLoginId + '/' + this.serviceId + '/addMenu']);
  256. }
  257. //edit function
  258. onEdit(editMenuID) {
  259. this.router.navigate(['service/' + this.userLoginId + '/' + this.serviceId + '/' + 'menu/edit/' + editMenuID]);
  260. }
  261. }