WrenchBoard/WrenchBoardIonic2023
2
0
Fork 0
Code Issues Pull Requests Releases Activity

Style for work worker

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2024-02-11 13:29:22 -05:00
parent c2abc5e7c8
commit eddaa760fd
4 changed files with 157 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/workers-dash/workers-dash.component.html
+78 -71
View File
@@ -1,53 +1,60 @@
<div style="height: 280px;" *ngIf="BANNER_MODE == 3; ">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to active task(s)</div>
<div class="small-text">You have {{active_job_count}} active task(s)</div>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{pastdue_job_count}} Past Due Task(s) </div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{review_job_count}} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 260px" *ngIf="BANNER_MODE == 3">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to Active Task(s)</div>
<div class="small-text">
You have {{ active_job_count }} active task(s)
</div>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{ pastdue_job_count }} Past Due Task(s)</div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{ review_job_count }} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<div style="height: 160px;" *ngIf="BANNER_MODE == 1 && active_job_count > 0 ;" >
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ban-text">You have {{active_job_count}} active task(s)</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 130px" *ngIf="BANNER_MODE == 1 && active_job_count > 0">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="activeTasks()">
<div class="ext-in bg">
<div class="ban-text">Go to Active Task(s)</div>
<div class="small-text">
You have {{ active_job_count }} active task(s)
</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<div style="height: 160px;" *ngIf="BANNER_MODE == 2 && active_job_count == 0 ;" >
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{pastdue_job_count}} Past Due Task(s) </div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{review_job_count}} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
<div style="height: 130px" *ngIf="BANNER_MODE == 2 && active_job_count == 0">
<ion-grid class="extra-grid">
<ion-row>
<ion-col class="ext-col" (click)="pastDue()">
<div class="ext-in l past-due">
<div class="ban-text">{{ pastdue_job_count }} Past Due Task(s)</div>
</div>
</ion-col>
<ion-col class="ext-col" (click)="reView()">
<div class="ext-in r review">
<div class="ban-text">{{ review_job_count }} Task(s) in Review</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<!--<ion-grid class="extra-grid">-->
@@ -66,31 +73,31 @@
<!--</ion-grid>-->
<div
*ngFor="let item of bannerData; let i = index"
class="bg_white {{item.short_style}} {{item.card_type}} "
(click)="onDetails(item)"
*ngFor="let item of bannerData; let i = index"
class="bg_white {{ item.short_style }} {{ item.card_type }} "
(click)="onDetails(item)"
>
<div class="list">
<div *ngIf="item.banner_location === 'URL' ">
<!-- code to render a large video block-->
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url('+item.banner+')'"
></div>
</div>
<div *ngIf="item.banner_location === 'LOCAL' ">
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(assets/images/'+item.banner+')'"
></div>
</div>
<div class="detail">
<ion-label class="name">{{item.short_title}}</ion-label>
<ion-label class="bg_text ovf" style="background-color: white"
>{{item.short_description}}</ion-label
>
</div>
<div class="list">
<div *ngIf="item.banner_location === 'URL'">
<!-- code to render a large video block-->
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(' + item.banner + ')'"
></div>
</div>
<!-- <ion-icon slot="end" name="bookmark-outline" class="save" color="primary"></ion-icon>-->
<div *ngIf="item.banner_location === 'LOCAL'">
<div
class="bg_image back_image banner_image"
[style.backgroundImage]="'url(assets/images/' + item.banner + ')'"
></div>
</div>
<div class="detail">
<ion-label class="name">{{ item.short_title }}</ion-label>
<ion-label class="bg_text ovf" style="background-color: white">{{
item.short_description
}}</ion-label>
</div>
</div>
<!-- <ion-icon slot="end" name="bookmark-outline" class="save" color="primary"></ion-icon>-->
</div>
src/app/components/workers-dash/workers-dash.component.scss
+9 -7
View File
@@ -1,5 +1,5 @@
.p-w{
height:180px;
height:170px;
background-color: rgba(46, 9, 52, 0.47);
border-radius: 10px;
box-shadow: 1px 1px lightgray;
@@ -8,12 +8,12 @@
.extra-grid{
margin: 10px 0px 10px 0px;
padding: 0px;
height: 140px;
height: 130px;
.ext-col{
padding: 5px;
//background-color: #2dd36f;
height: 140px;
height: 130px;
.ext-in{
&.bg{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/task.png");
@@ -26,7 +26,8 @@
color: white;
&.past-due{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/pastdue.png");
background-color: darkred;
background-color: #d510106b;
color:black;
}
}
&.r{
@@ -37,18 +38,19 @@
color: white;
&.review{
background-image: url("https://www.wrenchboard.com/assets/images/apps/xt/review.png");
background-color: #866508;
background-color: #08860f8f;
color: black;
}
}
background-color: antiquewhite;
height: 130px;
height: 120px;
border-radius: 10px;
box-shadow: 1px 1px lightgray;
text-align: center;
.ban-text{
font-size: 24px;
font-size: 22px;
font-weight: bolder;
padding-top: 40px;
padding-left: 20px;
src/app/components/workers-dash/workers-dash.component.ts
+7
View File
@@ -85,12 +85,14 @@ export class WorkersDashComponent implements OnInit {
let item: {
'tab': 'PASTDUE'
};
dispatchEvent(new Event("mytask_tab_pastdue"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
reView(){
let item: {
'tab': 'REVIEW'
};
dispatchEvent(new Event("mytask_tab_review"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
@@ -98,6 +100,7 @@ export class WorkersDashComponent implements OnInit {
let item: {
'tab': 'ACTIVE'
};
dispatchEvent(new Event("mytask_tab_active"));
this.router.navigate(['tabs/mytasks'],{state: item});
}
onDetails(item) {
@@ -149,3 +152,7 @@ export class WorkersDashComponent implements OnInit {
}
}