Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <title>TITAN Manual assembly line</title>
- </head>
- <body>
- <div class="backgroundImage" *ngIf="line!==undefined && line !==null">
- <table class="firstTable">
- <tr><td style="font-size: 180%; font-weight: bold; float:left" *ngIf="line.name =='Line1'">TITAN 1</td></tr>
- <tr><td style="font-size: 180%; font-weight: bold; float:left" *ngIf="line.name =='Line2'">TITAN 2</td></tr>
- <tr><td style="font-size: 180%; font-weight: bold; float:left" *ngIf="line.name =='Line3'">TITAN 3</td></tr>
- <tr><td class="underline-text-abb">Branch 1</td></tr>
- <tr style="text-align: center">
- <table style="width: 100%; height: 100%;">
- <tr>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" style="text-align: center" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{machine.actual}}
- </td>
- <tr style="color: black; font-weight: bold">Actual</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{machine.performance | number : '1.0-0'}}%
- </td>
- <tr style="color: black; font-weight: bold">Perfm.</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{machine.target}}
- </td>
- <tr style="color: black; font-weight: bold">Target</tr>
- </td>
- </tr>
- </table>
- </tr>
- <tr><td class="underline-text-abb" style="margin-top: 10%">Branch 2</td></tr>
- <table style="width: 100%; height: 100%;">
- <tr>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" style="text-align: center" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchActuals(line.operators, 'Branch 2')}}
- </td>
- <tr style="color: black; font-weight: bold">Actual</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchActuals(line.operators, 'Branch 2') * 100 / SumBranchTargets(line.operators, 'Branch 2') | number : '1.0-0'}}%
- </td>
- <tr style="color: black; font-weight: bold">Perfm.</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchTargets(line.operators, 'Branch 2')}}
- </td>
- <tr style="color: black; font-weight: bold">Target</tr>
- </td>
- </tr>
- </table>
- <tr><td class="underline-text-abb" style="margin-top: 10%">Branch 3</td></tr>
- <tr>
- <table style="width: 100%; height: 100%;">
- <tr>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" style="text-align: center" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchActuals(line.operators, 'Branch 3')}}
- </td>
- <tr style="color: black; font-weight: bold">Actual</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchActuals(line.operators, 'Branch 3') * 100/ SumBranchTargets(line.operators, 'Branch 3') | number : '1.0-0'}}%
- </td>
- <tr style="color: black; font-weight: bold">Perfm.</tr>
- </td>
- <td class="infoTable">
- <tr *ngFor="let machine of line.machines; let i = index;" >
- <td *ngIf="machine.name == 'TI1' || machine.name == 'TI2' || machine.name == 'TI3'" style="font-size: 250%">
- {{SumBranchTargets(line.operators, 'Branch 3')}}
- </td>
- <tr style="color: black; font-weight: bold">Target</tr>
- </td>
- </tr>
- </table>
- <td>
- </td></tr>
- </table>
- <table class="secondTable" style="margin-top: 2%; justify-content: center">
- <tr style="font-weight:bold">
- <td>Station</td>
- <td>Actual</td>
- <td>Target</td>
- <td>Performance</td>
- <!-- <td>Graph</td>
- <td>Run</td> -->
- </tr>
- <tr *ngFor="let operator of line.operators" [ngStyle]="{'background': operator.actual > 50 && operator.performance < 65 ? 'red' : ''}" >
- <td *ngIf="operator.branch=='Branch 1'">{{operator.name}}</td>
- <td *ngIf="operator.branch=='Branch 1'">{{operator.actual}}</td>
- <td *ngIf="operator.branch=='Branch 1'">{{operator.target}}</td>
- <td *ngIf="operator.branch=='Branch 1'">{{operator.performance | number : '1.0-0'}}%</td>
- </tr>
- <tr style="font-weight:bold">
- <td>Station</td>
- <td>Actual</td>
- <td>Target</td>
- <td>Performance</td>
- </tr>
- <tr *ngFor="let operator of line.operators" [ngStyle]="{'background': operator.actual > 50 && operator.performance < 65 ? 'red' : ''}" >
- <ng-container *ngIf="operator.branch=='Branch 2'">
- <td>{{operator.name}}</td>
- <td>{{operator.actual}}</td>
- <td>{{operator.target}}</td>
- <td>{{operator.performance | number : '1.0-0'}}%</td>
- </ng-container>
- </tr>
- <tr style="font-weight:bold">
- <td>Station</td>
- <td>Actual</td>
- <td>Target</td>
- <td>Performance</td>
- </tr>
- <tr *ngFor="let operator of line.operators" [ngStyle]="{'background': operator.actual > 50 && operator.performance < 65 ? 'red' : ''}" >
- <ng-container *ngIf="operator.branch=='Branch 3'">
- <td>{{operator.name}}</td>
- <td>{{operator.actual}}</td>
- <td>{{operator.target}}</td>
- <td>{{operator.performance | number : '1.0-0'}}%</td>
- </ng-container>
- </table>
- <table class="thirdTable">
- <tr>
- <div style="padding:0px; background:white; color:black; font-size: 200%">{{time | date : 'shortDate'}} {{time | date : 'H:mm'}} </div>
- </tr>
- <!--
- <tr style="background: white;font: 200%">
- <td style="float:right">
- <tr>
- 555 pcs
- </tr>
- <tr>
- P 100%
- </tr>
- <table>
- <tr style="color:red; font: 95%">
- <td>B1</td><td>B2</td><td>B3</td>
- </tr>
- <tr>
- <td>80</td>
- <td style="margin-right: 30%">85</td>
- <td>90</td>
- </tr>
- </table>
- </td>
- <td style="background: gray">
- ASM1
- </td>
- </tr> -->
- </table>
- </div>
- </body>
- <router-outlet></router-outlet>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment