Commit 67c72eeabed3495f455e0701db6aeceeae4b782e

Authored by trainee
1 parent a791c0bd
Exists in master

no message

src/app/dashboard/dashboard.component.html
... ... @@ -3,7 +3,7 @@
3 3 <div class="portlet-body">
4 4 <div class="tabbable-custom nav-justified">
5 5 <ul class="nav nav-tabs">
6   - <li class="active sbold font">
  6 + <li class="sbold font">
7 7 <a href="#tab1" data-toggle="tab" aria-expanded="false">ติดตั้ง
8 8 <span class="badge"> {{resultNum}} </span>
9 9 </a>
... ... @@ -38,9 +38,9 @@
38 38 <span class="badge"> {{resultNum6}} </span>
39 39 </a>
40 40 </li>
41   - <li class="sbold">
  41 + <li class="active sbold">
42 42 <a href="#tab8" data-toggle="tab" aria-expanded="true">Smart IT
43   - <span class="badge"> </span>
  43 + <span class="badge"> {{resultNum}} </span>
44 44 </a>
45 45 </li>
46 46 </ul>
... ... @@ -66,7 +66,7 @@
66 66 <div class="panel-body">
67 67 <div class="row">
68 68 <div class="col-lg-4 col-md-3 col-sm-6 col-xs-12" *ngFor="let item of resultData | filter:FilterSearch: ''">
69   - <p *ngIf="showSecret" style="text-align: center;">0 Tricket</p>
  69 + <!-- <p *ngIf="showSecret" style="text-align: center;">0 Tricket</p> -->
70 70 <a class="dashboard-stat dashboard-stat-v2 red " href="{{item.link}}" target="_blank" [ngStyle]="{'background-color': getColorDay(item.days.toFixed(0))}">
71 71 <!-- <div [ngStyle]="{'background-color':item.days === '366.0098' ? 'green' : 'red' }"></<div> -->
72 72 <!-- <div class="avater">{{(item.days).toFixed(0)}} D</div> -->
... ... @@ -118,7 +118,7 @@
118 118 </div>
119 119 <br>
120 120 <br>
121   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton1Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  121 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton1Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
122 122 <hr>
123 123 <br>
124 124 </div>
... ... @@ -173,7 +173,7 @@
173 173 </div>
174 174 <br>
175 175 <br>
176   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton2(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  176 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton2(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
177 177 <hr>
178 178 <br>
179 179 </div>
... ... @@ -230,7 +230,7 @@
230 230 </div>
231 231 <br>
232 232 <br>
233   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton2Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  233 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton2Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
234 234 <hr>
235 235 <br>
236 236 </div>
... ... @@ -284,7 +284,7 @@
284 284 </div>
285 285 <br>
286 286 <br>
287   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton3(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  287 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton3(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
288 288 <hr>
289 289 <br>
290 290 </div>
... ... @@ -341,7 +341,7 @@
341 341 </div>
342 342 <br>
343 343 <br>
344   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton3Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  344 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton3Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
345 345 <hr>
346 346 <br>
347 347 </div>
... ... @@ -395,7 +395,7 @@
395 395 </div>
396 396 <br>
397 397 <br>
398   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton4(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  398 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton4(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
399 399 <hr>
400 400 <br>
401 401 </div>
... ... @@ -452,7 +452,7 @@
452 452 </div>
453 453 <br>
454 454 <br>
455   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton4Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  455 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton4Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
456 456 <hr>
457 457 <br>
458 458 </div>
... ... @@ -506,7 +506,7 @@
506 506 </div>
507 507 <br>
508 508 <br>
509   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton5(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  509 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton5(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
510 510 <hr>
511 511 <br>
512 512 </div>
... ... @@ -563,7 +563,7 @@
563 563 </div>
564 564 <br>
565 565 <br>
566   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton5Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  566 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton5Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
567 567 <hr>
568 568 <br>
569 569 </div>
... ... @@ -617,7 +617,7 @@
617 617 </div>
618 618 <br>
619 619 <br>
620   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton6(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  620 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton6(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
621 621 <hr>
622 622 <br>
623 623 </div>
... ... @@ -674,7 +674,7 @@
674 674 </div>
675 675 <br>
676 676 <br>
677   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton6Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  677 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton6Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
678 678 <hr>
679 679 <br>
680 680 </div>
... ... @@ -713,8 +713,6 @@
713 713 </div>
714 714 </div>
715 715 </div>
716   -
717   - <!--แท้บใหม่ 7 afterservice-->
718 716 <div class="panel tab-pane" id="tab7">
719 717 <div class="caption">
720 718 <h1 class="icon-bubble font-green-sharp">
... ... @@ -730,7 +728,7 @@
730 728 </div>
731 729 <br>
732 730 <br>
733   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton7(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  731 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton7(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
734 732 <hr>
735 733  
736 734 <br>
... ... @@ -789,7 +787,7 @@
789 787 </div>
790 788 <br>
791 789 <br>
792   - <button class="btn btn-default " *ngFor="let name of ButtonValue" (click)="getButton7Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
  790 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton7Onhold(name.valueN)" style="margin-left: 5px; margin-top: 2px;">{{ name.name }}</button>
793 791 <!-- <br><br>
794 792 <button *ngFor="let name of ButtonValue" (click)="getButton(name.valueN)">{{ name.name }}</button> -->
795 793 <hr>
... ... @@ -831,73 +829,67 @@
831 829 </div>
832 830 </div>
833 831 </div>
834   -
835 832 <div class="panel tab-pane active" id="tab8">
836   - <div class="container">
  833 + <div class="caption">
  834 + <h1 class="icon-bubble font-green-sharp">
  835 + <span class="caption-subject font-green-sharp sbold font"> Active</span>
  836 + </h1>
  837 + <div class="input-group" style="float: right; margin-top: 11px;">
  838 + <div class="input-icon right">
  839 + <i class="icon-magnifier">
  840 + </i>
  841 + <input type="text" placeholder="Search.." class="form-control sbold font" [(ngModel)]="FilterSearch">
  842 + </div>
  843 + </div>
  844 + <br>
  845 + <br>
  846 + <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton1(name.valueN)" style="margin-left: 5px; margin-top: 3px;">{{ name.name }}</button>
  847 + <hr>
  848 + <br>
  849 + </div>
  850 + <div class="panel-body">
837 851 <div class="row">
838   - <div class="col-xs-12">
839   - <!-- <button class="btn" (click)="onToggleDetails()">
840   - Display Details</button>
841   - <p *ngIf="showSecret">Sercet Password = tuna</p> -->
842   - <hr>
843   - <div class="input-group" style="float: right; margin-top: 11px;">
844   - <div class="input-icon right">
845   - <i class="icon-magnifier">
846   - </i>
847   - <input type="text" placeholder="Search.." class="form-control sbold font" [(ngModel)]="FilterSearch">
  852 + <div class="col-lg-4 col-md-3 col-sm-6 col-xs-12" *ngFor="let item of resultData | filter:FilterSearch: ''">
  853 + <!-- <p *ngIf="showSecret" style="text-align: center;">0 Tricket</p> -->
  854 + <a class="dashboard-stat dashboard-stat-v2 red " href="{{item.link}}" target="_blank" [ngStyle]="{'background-color': getColorDay(item.days.toFixed(0))}">
  855 + <!-- <div [ngStyle]="{'background-color':item.days === '366.0098' ? 'green' : 'red' }"></<div> -->
  856 + <!-- <div class="avater">{{(item.days).toFixed(0)}} D</div> -->
  857 + <div class="avater" [ngStyle]="{'background-color': getColorDay(item.days.toFixed(0))}" style="font-size: 26px; text-align: center; font-weight: bold;">{{item.days.toFixed(0)}}D</div>
  858 + <div class="visual">
  859 + <i class="fa fa-comments"></i>
848 860 </div>
849   - </div>
850   - <br>
851   - <br>
852   - <button type="button" class="btn btn-circle button " *ngFor="let name of ButtonValue" (click)="getButton1(name.valueN)" style="margin-left: 5px; margin-top: 3px;">{{ name.name }}</button>
853   - <p *ngIf="showSecret" style="text-align: center;">0 Tricket</p>
854   - <hr>
855   - <br>
856   - </div>
857   - <div class="panel-body">
858   - <div class="row">
859   - <div class="col-lg-4 col-md-3 col-sm-6 col-xs-12" *ngFor="let item of resultData | filter:FilterSearch: ''">
860   -
861   -
862   -
863   -
864   -
865   -
866   - <a class="dashboard-stat dashboard-stat-v2 red " href="{{item.link}}" target="_blank" [ngStyle]="{'background-color': getColorDay(item.days.toFixed(0))}">
867   - <!-- <div [ngStyle]="{'background-color':item.days === '366.0098' ? 'green' : 'red' }"></<div> -->
868   - <!-- <div class="avater">{{(item.days).toFixed(0)}} D</div> -->
869   - <div class="avater" [ngStyle]="{'background-color': getColorDay(item.days.toFixed(0))}" style="font-size: 26px; text-align: center; font-weight: bold;">{{item.days.toFixed(0)}}D</div>
870   - <div class="visual">
871   - <i class="fa fa-comments"></i>
  861 + <table>
  862 + <tr>
  863 + <div class="details" style="width: calc(100% - 50px);">
  864 + <div style="text-align: right; margin-top: -60px; color: black;">{{item.type | textshort}}</div>
  865 + <div style="text-align: right; color: black;">{{item.STATUS}}</div>
  866 + <div class="number" style=" color: black; display: block; text-align: right; margin-top: -7px;">
  867 + <span data-counter="counterup" data-value="">{{item.custgroupName}}</span>
  868 + </div>
  869 + <div class="desc" style=" color: black;">{{item.team}}</div>
  870 + <br>
  871 + <!-- <div class="desc" style="text-align: left; text-align: bottom; color: black;">{{(item.COMMENT > 20)? | (item.COMMENT | slice:0:20) + '....':(item.COMMENT)}}</div> -->
872 872 </div>
873   - <table>
874   - <tr>
875   - <div class="details" style="width: calc(100% - 50px);">
876   - <div style="text-align: right; margin-top: -60px; color: black;">{{item.type | textshort}}</div>
877   - <div style="text-align: right; color: black;">{{item.STATUS}}</div>
878   - <div class="number" style=" color: black; display: block; text-align: right; margin-top: -7px;">
879   - <span data-counter="counterup" data-value="">{{item.custgroupName}}</span>
880   - </div>
881   - <div class="desc" style=" color: black;">{{item.team}}</div>
882   - <br>
883   - <!-- <div class="desc" style="text-align: left; text-align: bottom; color: black;">{{(item.COMMENT > 20)? | (item.COMMENT | slice:0:20) + '....':(item.COMMENT)}}</div> -->
884   - </div>
885   - </tr>
886   - <tr>
887   - <div class="details" style="width: calc(100% - 50px);">
888   - <div class="desc" style="text-align: left; color: black; margin-top: 120px;">{{item.COMMENT | short}}</div>
889   - <!-- <div class="a desc" style="text-align: left; color: black;">{{item.COMMENT | font}}</div> -->
890   - <div class="a desc" style="text-align: left; color: black;">{{item.COMMENT | font}}</div>
891   - </div>
892   - </tr>
893   - </table>
894   - </a>
895   - </div>
896   - </div>
  873 + </tr>
  874 + <tr>
  875 + <div class="details" style="width: calc(100% - 50px);">
  876 + <div class="desc" style="text-align: left; color: black; margin-top: 120px;">{{item.COMMENT | short}}</div>
  877 + <!-- <div class="a desc" style="text-align: left; color: black;">{{item.COMMENT | font}}</div> -->
  878 + <div class="a desc" style="text-align: left; color: black;">{{item.COMMENT | font}}</div>
  879 + </div>
  880 + </tr>
  881 + </table>
  882 + </a>
897 883 </div>
898 884 </div>
899 885 </div>
  886 + <br>
  887 + <br>
  888 + <br>
  889 + <br>
  890 + <!-- On Hold -->
900 891 </div>
  892 +
901 893 </div>
902 894  
903 895 <!-- งานเก่า
... ...
src/app/dashboard/dashboard.component.scss
... ... @@ -61,11 +61,6 @@ btn.active {
61 61 top: 4px;
62 62 right: 0px;
63 63 }
64   -.btn:focus {
65   - color: white;
66   - background: #32c5d2;
67   - border-color: #32c5d2;
68   -}
69 64  
70 65 .button {
71 66 background-color: white;
... ... @@ -74,3 +69,9 @@ btn.active {
74 69 display: inline-block;
75 70 cursor: pointer;
76 71 }
  72 +
  73 +.btn:focus {
  74 + color: white;
  75 + background: #32c5d2;
  76 + border-color: #32c5d2;
  77 +}
... ...
src/app/dashboard/dashboard.component.ts
... ... @@ -87,134 +87,167 @@ export class DashboardComponent implements OnInit {
87 87  
88 88 ButtonValue = [
89 89 {
  90 + id: 1,
90 91 name: 'ACC',
91 92 valueN: 'acc'
92 93 },
93 94 {
  95 + id: 2,
94 96 name: 'ADE',
95 97 valueN: 'ade'
96 98 },
97 99 {
  100 + id: 3,
98 101 name: 'ADM',
99 102 valueN: 'adm'
100 103 },
101 104 {
  105 + id: 4,
102 106 name: 'APD',
103 107 valueN: 'apd'
104 108 },
105 109 {
  110 + id: 5,
106 111 name: 'BNW',
107 112 valueN: 'bnw'
108 113 },
109 114 {
  115 + id: 6,
110 116 name: 'CRS',
111 117 valueN: 'crs'
112 118 },
113 119 {
  120 + id: 7,
114 121 name: 'CUS',
115 122 valueN: 'cus'
116 123 },
117 124 {
  125 + id: 8,
118 126 name: 'DVR',
119 127 valueN: 'dvr'
120 128 },
121 129 {
  130 + id: 9,
122 131 name: 'ETC',
123 132 valueN: 'etc'
124 133 },
125 134 {
  135 + id: 10,
126 136 name: 'HWE',
127 137 valueN: 'hwe'
128 138 },
129 139 {
  140 + id: 11,
130 141 name: 'ITS',
131 142 valueN: 'its'
132 143 },
133 144 {
  145 + id: 12,
134 146 name: 'LWS',
135 147 valueN: 'lws'
136 148 },
137 149 {
  150 + id: 13,
138 151 name: 'NDS',
139 152 valueN: 'nds'
140 153 },
141 154 {
  155 + id: 14,
142 156 name: 'NED',
143 157 valueN: 'ned'
144 158 },
145 159 {
  160 + id: 15,
146 161 name: 'NES',
147 162 valueN: 'nes'
148 163 },
149 164 {
  165 + id: 16,
150 166 name: 'NET',
151 167 valueN: 'net'
152 168 },
153 169 {
  170 + id: 17,
154 171 name: 'NEW',
155 172 valueN: 'new'
156 173 },
157 174 {
  175 + id: 18,
158 176 name: 'OSC',
159 177 valueN: 'osc'
160 178 },
161 179 {
  180 + id: 19,
162 181 name: 'PM',
163 182 valueN: 'pm'
164 183 },
165 184 {
  185 + id: 20,
166 186 name: 'PRS',
167 187 valueN: 'prs'
168 188 },
169 189 {
  190 + id: 21,
170 191 name: 'RND',
171 192 valueN: 'rnd'
172 193 },
173 194 {
  195 + id: 22,
174 196 name: 'SDE',
175 197 valueN: 'sde'
176 198 },
177 199 {
  200 + id: 23,
178 201 name: 'SDN',
179 202 valueN: 'sdn'
180 203 },
181 204 {
  205 + id: 24,
182 206 name: 'SET',
183 207 valueN: 'set'
184 208 },
185 209 {
  210 + id: 25,
186 211 name: 'SEV',
187 212 valueN: 'sev'
188 213 },
189 214 {
  215 + id: 26,
190 216 name: 'SID',
191 217 valueN: 'sid'
192 218 },
193 219 {
  220 + id: 27,
194 221 name: 'SSH',
195 222 valueN: 'ssh'
196 223 },
197 224 {
  225 + id: 28,
198 226 name: 'SUV',
199 227 valueN: 'suv'
200 228 },
201 229 {
  230 + id: 29,
202 231 name: 'SYS',
203 232 valueN: 'sys'
204 233 },
205 234 {
  235 + id: 30,
206 236 name: 'TST',
207 237 valueN: 'tst'
208 238 },
209 239 {
  240 + id: 31,
210 241 name: 'UDI',
211 242 valueN: 'udi'
212 243 },
213 244 {
  245 + id: 32,
214 246 name: 'WEB',
215 247 valueN: 'web'
216 248 },
217 249 {
  250 + id: 33,
218 251 name: 'All',
219 252 valueN: ''
220 253 },
... ... @@ -664,7 +697,7 @@ export class DashboardComponent implements OnInit {
664 697 if (this.Show1.length === 0) {
665 698 return this.Show1;
666 699 }
667   -
  700 +
668 701 const resultArray = [];
669 702 for (const item of this.Show1) {
670 703 console.log('item: ', item);
... ...