API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Nov 20th, 2018
92
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.83 KB | None | 0 0
raw download clone embed print report
  1. <div class="px-5">
  2. <ngx-datatable class="material archival pt-5" #taskDefinitionTable
  3. *ngIf="page.totalElements !==undefined"
  4. [rows]="rows"
  5. [columns]="columns"
  6. [columnMode]="'flex'"
  7. [headerHeight]="60"
  8. [footerHeight]="50"
  9. [rowHeight]="'auto'"
  10. [selected]="selected"
  11. [selectionType]="'checkbox'"
  12. [selectAllRowsOnPage]="false"
  13. [cssClasses]="datatableCssClasses"
  14. [rowClass]="getClassForRow"
  15. [externalSorting]="true"
  16. [externalPaging]="true"
  17. [count]="page.totalElements"
  18. [offset]="page.pageNumber"
  19. [limit]="page.size"
  20. (select)='onSelect($event)'
  21. (page)='setPage($event)'
  22. (sort)="sort($event)">
  23. <ngx-datatable-footer>
  24. <ng-template ngx-datatable-footer-template
  25. let-rowCount="rowCount"
  26. let-pageSize="pageSize"
  27. let-selectedCount="selectedCount"
  28. let-curPage="curPage"
  29. let-offset="offset"
  30. let-isVisible="isVisible">
  31. <ppl-365-datatable-footer [pageSize]="pageSize" [curPage]="curPage" [rowCount]="rowCount" [offset]="offset" (onPagerChange)="taskDefinitionTable.onFooterPage($event)"
  32. class="col-12">
  33. </ppl-365-datatable-footer>
  34. <ppl365-plug [allCount]="page.totalElements"
  35. [activeTab]="taskTypeLabel"
  36. [paddingTop]=false
  37. [searchedWord]="searchedWord"
  38. [searchBoxVisible]="searchBoxVisible"
  39. [plugs]="plugs"
  40. [listCriteria]="listCriteria">
  41. </ppl365-plug>
  42. </ng-template>
  43. </ngx-datatable-footer>
  44. </ngx-datatable>
  45. </div>
  46. <ng-template #actionHeaderTemplate let-column="column">
  47. <div class="container-fluid">
  48. <div class="row">
  49. <div class="col-12 text-right search">
  50. <img [src]="searchIcon" alt="search-icon" (click)="toggleSearchBox(true)" *ngIf="!searchBoxVisible">
  51. </div>
  52. </div>
  53. </div>
  54. </ng-template>
  55. <ng-template #categoriesHeaderTemplate let-column="column">
  56. <div class="align-items-center table-header container-fluid d-flex h-100 filter-column">
  57. <div class="row">
  58. <div class="col-12 text-uppercase">
  59. <span>{{column.name | translate}}</span>
  60. </div>
  61. <div class="col-12 custom-dropdown cursor-pointer">
  62. <column-filter-dropdown [filterItems]="categories"
  63. [columnName]="'category'"
  64. (onFilter)="handleColumnFilter($event)">
  65. </column-filter-dropdown>
  66. </div>
  67. </div>
  68. </div>
  69. </ng-template>
  70. <ng-template #categoryCellTemplate let-row="row" let-value="value">
  71. <div class="row">
  72. <div class="col-12">
  73. <img class="icon category" [src]="getCategoryIcon(value.name)" alt="safety-icon">
  74. <span class="pl-1">{{ value.name | translate}}</span>
  75. </div>
  76. </div>
  77. </ng-template>
  78. <ng-template #periodicityHeaderTemplate let-column="column">
  79. <div class="align-items-center table-header container-fluid d-flex h-100 filter-column">
  80. <div class="row">
  81. <div class="col-12 text-uppercase">
  82. <span>{{column.name | translate}}</span>
  83. </div>
  84. <div class="col-12 custom-dropdown cursor-pointer">
  85. <column-filter-dropdown [filterItems]="periodicityTypes"
  86. [columnName]="'periodicity'"
  87. [isUsingTranslationByTechName]="true"
  88. (onFilter)="handleColumnFilter($event)">
  89. </column-filter-dropdown>
  90. </div>
  91. </div>
  92. </div>
  93. </ng-template>
  94. <ng-template #employeeHeaderTemplate let-column="column">
  95. <div class="align-items-center table-header container-fluid d-flex h-100 filter-column">
  96. <div class="row">
  97. <div class="col-12 text-uppercase">
  98. <span>{{column.name | translate}}</span>
  99. </div>
  100. <div class="col-12 custom-dropdown cursor-pointer">
  101. <column-filter-dropdown [filterItems]="responsibleUsers"
  102. [columnName]="'responsibleUser'"
  103. [isUsingTranslationByTechName]="true"
  104. (onFilter)="handleColumnFilter($event)">
  105. </column-filter-dropdown>
  106. </div>
  107. </div>
  108. </div>
  109. </ng-template>
  110. <ng-template #employeeCellTemplate let-row="row">
  111. <div class="row">
  112. <div class="col-12">
  113. <span>{{row.taskAssignmentUser.roleName | translate}}</span>
  114. </div>
  115. </div>
  116. </ng-template>
  117. <ng-template #taskFromHeaderTemplate let-column="column">
  118. <div class="align-items-center table-header container-fluid d-flex h-100 filter-column">
  119. <div class="row">
  120. <div class="col-12 text-uppercase">
  121. <span>{{column.name | translate}}</span>
  122. </div>
  123. <div class="col-12 custom-dropdown cursor-pointer">
  124. <column-filter-dropdown [filterItems]="authors"
  125. [columnName]="'author'"
  126. [isUsingTranslationByTechName]="true"
  127. (onFilter)="handleColumnFilter($event)">
  128. </column-filter-dropdown>
  129. </div>
  130. </div>
  131. </div>
  132. </ng-template>
  133. <ng-template #taskDescriptionHeaderTemplate let-column="column" let-sort="sortFn" let-sortDir="sortDir">
  134. <div class="align-items-center table-header d-flex h-100" (click)="sort($event, sortDir, sortFn)">
  135. <div class="row">
  136. <div class="col-12 text-uppercase column-header">
  137. <span>{{column.name | translate}}</span>
  138. </div>
  139. <div class="col-12">
  140. <span class="task-description-label">{{taskDescriptionLabel | translate}}</span>
  141. <span class="sorting" *ngIf="sortDir === sortDirection.asc">
  142. <i class="fas fa-caret-up"></i>
  143. </span>
  144. <span class="sorting" *ngIf="sortDir === sortDirection.desc">
  145. <i class="fas fa-caret-down"></i>
  146. </span>
  147. <div class="d-inline sorting-asc-desc" *ngIf="!sortDir">
  148. <span class="sorting">
  149. <i class="fas fa-caret-up"></i>
  150. <i class="fas fa-caret-down"></i>
  151. </span>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. </ng-template>
  157. <ng-template #taskIdLabelHeaderTemplate let-column="column" let-sort="sortFn" let-sortDir="sortDir">
  158. <div class="align-items-center container-fluid d-flex h-100">
  159. <div class="row">
  160. <div class="col-12">
  161. <span>{{taskIdLabel | translate}}</span>
  162. </div>
  163. </div>
  164. </div>
  165. </ng-template>
  166. <ng-template #taskDescriptionCellTemplate let-row="row" let-value="value">
  167. <div class="row">
  168. <div class="col-12 d-flex flex-column">
  169. <span class="task-title" [innerHTML]="highlight(value)"></span>
  170. <span class="task-description" [innerHTML]="highlight(row.description)"></span>
  171. </div>
  172. </div>
  173. </ng-template>
  174. <ng-template #startDateHeaderTemplate let-column="column" let-sort="sortFn" let-sortDir="sortDir">
  175. <ppl-365-datatable-sortable-header-with-dynamic-note [cellValue]="column.name" [noteAscValue]="taskstartDateAscLabel" [noteDescValue]="taskstartDateDescLabel" [sortDir]="sortDir" [sortFn]="sortFn" (onSortClick)="sort($event, sortDir, sortFn)"></ppl-365-datatable-sortable-header-with-dynamic-note>
  176. </ng-template>
  177. <ng-template #startCellTemplate let-row="row">
  178. <div class="row">
  179. <div class="col-12 pl-0">
  180. <span>{{row.scheduleDefinition.startDate | localizedDate: 'shortDate'}}</span>
  181. </div>
  182. </div>
  183. </ng-template>
  184. <ng-template #todoCheckboxCellTemplate let-row="row" let-value="value">
  185. <div class="row">
  186. <div class="col-12 text-center">
  187. <img [src]="getClockIcon(row)" alt="clock-icon">
  188. </div>
  189. <div class="col-12 pt-2 text-center time-description">
  190. <span *ngIf="!value">-:-</span>
  191. <span *ngIf="value">
  192. {{value | localizedDate : 'shortTime'}}
  193. </span>
  194. </div>
  195. </div>
  196. </ng-template>
  197. <ng-template #todoActionCellTemplate let-row="row" let-value="value">
  198. <div class="row">
  199. <div class="col-12 text-center answer-type-label">
  200. <span>{{'ANSWER_TYPE' | translate | uppercase}}</span>
  201. </div>
  202. <div class="col-12 text-center asnwer-type">
  203. <span>{{'YES_NO_OTHER' | translate}}</span>
  204.  
  205. </div>
  206. </div>
  207. </ng-template>
  208. <ng-template #doneStatusCellTemplate let-row="row" let-value="value">
  209. <div class="comment-container" *ngIf="row.status.techName === taskStatuses.REJECTED">
  210. <img class="comment-icon grey" [src]="commentGreyIcon" alt="comment-icon">
  211. <img class="comment-icon red" [src]="commentRedIcon" alt="comment-icon">
  212. </div>
  213. <div class="row h-100 pl-2 status-container align-items-center" *ngIf="value.techName === taskStatuses.DONE">
  214. <div class="col-12 d-flex align-items-center">
  215. <img class="pr-2" [src]="realizedIcon" alt="status-icon">
  216. <span class="status-green">
  217. {{'REALIZED' | translate}}
  218. </span>
  219. </div>
  220. </div>
  221. <div class="row h-100 pl-2 status-container align-items-center"
  222. *ngIf="value.techName === taskStatuses.REJECTED"
  223. [ngbTooltip]="taskComment"
  224. placement="left">
  225. <div class="col-12 d-flex align-items-center">
  226. <img class="pr-2" [src]="rejectedIcon" alt="status-icon">
  227. <span class="status-red">
  228. {{'REJECTED' | translate}}
  229. </span>
  230. </div>
  231. </div>
  232. <div class="row h-100 pl-2 status-container align-items-center" *ngIf="value.techName === taskStatuses.TRANSFERRED" [ngbTooltip]="taskTransferredComment"
  233. placement="left">
  234. <div class="comment-container">
  235. <img class="comment-icon grey" [src]="commentGreyIcon" alt="comment-icon">
  236. <img class="comment-icon red" [src]="commentRedIcon" alt="comment-icon">
  237. </div>
  238. <div class="col-12 d-flex align-items-center">
  239. <img class="pr-2" [src]="transferredIcon" alt="status-icon">
  240. <span class="status-blue">
  241. {{'TRANSFERRED' | translate}}
  242. </span>
  243. </div>
  244. <div class="col-12 d-flex align-items-center">
  245. <span class="transferred-to">
  246. {{'TRASFERRED_TO' | translate}}
  247.  
  248. </span>
  249. </div>
  250. <div class="col-12 d-flex align-items-center responsible-user">
  251. {{row.responsibleUser | translate}}
  252. </div>
  253. </div>
  254. <div class="row h-100 pl-2 status-container align-items-center" *ngIf="value.techName === taskStatuses.YES">
  255. <div class="col-12 d-flex align-items-center">
  256. <img class="pr-2" [src]="yesIcon" alt="status-icon">
  257. <span class="status-green">
  258. {{'YES' | translate}}
  259. </span>
  260. </div>
  261. </div>
  262. <div class="row h-100 pl-2 status-container align-items-center" *ngIf="value.techName === taskStatuses.NO">
  263. <div class="col-12 d-flex align-items-center">
  264. <img class="pr-2" [src]="noIcon" alt="status-icon">
  265. <span class="status-green">
  266. {{'NO' | translate}}
  267. </span>
  268. </div>
  269. </div>
  270. <div class="row h-100 pl-2 status-container align-items-center" *ngIf="value.techName === taskStatuses.OTHER">
  271.  
  272. <div class="col-12 d-flex align-items-center">
  273. <img class="pr-2" [src]="otherIcon" alt="status-icon">
  274. <span class="status-green">
  275. {{'OTHER' | translate}}
  276. </span>
  277. </div>
  278. </div>
  279.  
  280. <ng-template #taskComment>
  281. <div class="py-1 px-2 tooltip-template">
  282. <div class="row">
  283. <div class="col-12 text-left">
  284. <span class="task-comment-header">
  285. {{'TASK_COMMENT' | translate}}
  286. </span>
  287. </div>
  288. </div>
  289. <div class="row text-left pt-1">
  290. <div class="col-5">
  291. <span class="task-comment-label">
  292. {{'WHO' | translate}}:
  293. </span>
  294. <span class="task-comment-content">{{row.actionInformation.from.name}}</span>
  295. </div>
  296. <div class="col-7">
  297. <span class="task-comment-label">
  298. {{'BY' | translate}}:
  299. </span>
  300. <span class="task-comment-content" [innerText]="getApplicationType(row.actionInformation.to.role.isAnonymous)"></span>
  301. </div>
  302. </div>
  303. <div class="row text-left">
  304. <div class="col-12 pt-2">
  305. <span>
  306. {{row.actionInformation.message}}
  307. </span>
  308. </div>
  309. </div>
  310. <div class="row">
  311. <div class="col-12 text-left task-comment-label pt-2">
  312. <span>{{getDate(row.lastActionTime) | localizedDate : 'shortDate'}}</span>
  313. <span> | </span>
  314. <span>{{getDate(row.lastActionTime) | localizedDate : 'shortTime'}}</span>
  315. </div>
  316. </div>
  317. </div>
  318. </ng-template>
  319.  
  320. <ng-template #taskTransferredComment>
  321. <div class="py-1 px-2 tooltip-template">
  322. <div class="row">
  323. <div class="col-12 text-left">
  324. <span class="task-comment-header">
  325. {{' TRANSFER_TASK' | translate}}
  326. </span>
  327. </div>
  328. </div>
  329.  
  330. <div class="row text-left">
  331. <div class="col-12 pt-2">
  332. <span class="task-comment-label">
  333. {{'TRANSFER_INFO_FROM' | translate}}:
  334. </span>
  335. <span class="task-comment-content">
  336. {{row.actionInformation.from.name}}
  337. </span>
  338. <span class="task-comment-label">
  339. ({{row.actionInformation.from.role.techName | translate}})
  340. </span>
  341. </div>
  342. </div>
  343. <div class="row text-left">
  344. <div class="col-12">
  345. <span class="task-comment-label">
  346. {{' TO' | translate}}:
  347. </span>
  348. <span class="task-comment-content">
  349. {{row.actionInformation.to.name}}
  350. </span>
  351. <span class="task-comment-label">
  352. ({{row.actionInformation.to.role.techName | translate}})
  353. </span>
  354. </div>
  355. </div>
  356. <div class="row">
  357. <div class="col-12 text-left task-comment-label pt-2">
  358. <span>{{getDate(row.lastActionTime) | localizedDate : 'shortDate'}}</span>
  359. <span> | </span>
  360. <span>{{getDate(row.lastActionTime) | localizedDate : 'shortTime'}}</span>
  361. </div>
  362. </div>
  363. </div>
  364. </ng-template>
  365.  
  366. </ng-template>
  367. <ng-template #taskFromCellTemplate let-row="row" let-value="value">
  368. <div class="row">
  369. <div class="col-12">
  370. <span>{{value.role.techName | translate}}</span>
  371. </div>
  372. </div>
  373. </ng-template>
  374. <ng-template #periodicityCellTemplate let-row="row" let-value="value">
  375. <div class="row">
  376. <div class="col-12">
  377. <span>{{row.scheduleDefinition.taskScheduleDefinitionType | enumString:ScheduleDefinitionType | translate}}</span>
  378. </div>
  379. </div>
  380. </ng-template>
  381. <ng-template #highPriorityCellTemplate let-row="row" let-value="value">
  382. <div class="row high-priority-container">
  383. <div class="col-12 d-flex flex-column">
  384. <img [src]="highPriorityIcon" alt="high-priority-icon">
  385. </div>
  386. </div>
  387. </ng-template>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!