132 lines
4.5 KiB
HTML
132 lines
4.5 KiB
HTML
<div class="video" style="background-color: #fbfdfd;" *ngFor="let item of familyPendingData" (click)="processFamilyPending(item)">
|
|
<div class="left">
|
|
<div class="bg_image men_image" [style.backgroundImage]="'url(assets/images/taskbanners/'+item.banner+')'"></div>
|
|
|
|
<div class="text">
|
|
<ion-label class="bold_text name_bg_text">{{item.firstname}} </ion-label>
|
|
<ion-label class="bold_text">{{item.title}}</ion-label>
|
|
<ion-label class="grey_text">{{item.description}}</ion-label>
|
|
<ion-label class="extra_text"><span class="title">Added:</span> {{item.added}}</ion-label>
|
|
<ion-label class="extra_text"><span class="title">Status:</span> {{item.status_text}}</ion-label>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
|
</div>
|
|
</div>
|
|
|
|
<div *ngIf="isModalOpenBackdrop==true">
|
|
<ion-backdrop [visible]="isModalOpenBackdrop"></ion-backdrop>
|
|
<ion-modal class="common_modal" [isOpen]="isModalOpen"><ng-template>
|
|
<ion-header class="modal-head">
|
|
<ion-toolbar>
|
|
<ion-title>{{modalTile}}</ion-title>
|
|
<ion-buttons slot="end">
|
|
<ion-button (click)="setCloseModal()">Close</ion-button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
<ion-content class="ion-padding">
|
|
<div>
|
|
<div class="t_label">Title</div>
|
|
<div class="t_item">{{selectedItem.title}}</div>
|
|
|
|
<div class="t_label">Description</div>
|
|
<div class="t_item">{{selectedItem.description}}</div>
|
|
|
|
<ion-grid style="background-color: #ecf0f4;
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
border-radius: 10px;">
|
|
<ion-row>
|
|
<ion-col>
|
|
<div class="t_label">Reward</div>
|
|
<div class="t_item" style="display: flex;">
|
|
<ion-input style="background-color: #dff8df; border-radius: 10px 0px 0px 10px;"></ion-input>
|
|
<div style="max-width:2px; background-color: white; "></div>
|
|
<ion-select style="max-width: 100px;
|
|
background-color: #f5f8f5;
|
|
border-radius: 0px 10px 10px 0px;"
|
|
[(ngModel)]='country'
|
|
(ionChange)="testInputs()"
|
|
aria-label="Favorite Fruit" value="Naira">
|
|
<ion-select-option value="NG">NGN</ion-select-option>
|
|
<ion-select-option value="US">USD</ion-select-option>
|
|
</ion-select>
|
|
</div>
|
|
</ion-col>
|
|
<ion-col>
|
|
<div class="t_label">Timeline</div>
|
|
<div class="t_item">
|
|
<ion-select
|
|
[(ngModel)]='timeline_days'
|
|
(ionChange)="testInputs()"
|
|
aria-label="Time Line" value="0"
|
|
style="background-color: #dff8df;
|
|
border-radius: 10px 10px 10px 10px;">
|
|
<ion-select-option *ngFor="let item of timelineOptions" value="{{item.val}}">{{item.tx}}</ion-select-option>
|
|
</ion-select>
|
|
</div>
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
|
|
|
|
|
|
<!-- <div class="t_label">Title</div>-->
|
|
<!-- <div class="t_item">The_real_data_hrere</div>-->
|
|
|
|
<div class="t_label">Delivery Details</div>
|
|
<div class="t_item">
|
|
<ion-textarea
|
|
style="height: 120px; background-color: #dff8df;"
|
|
[(ngModel)]='job_detail'
|
|
(ionChange)="testInputs()"
|
|
label="Delivery Details"
|
|
labelPlacement="fixed"
|
|
placeholder="Enter text"></ion-textarea>
|
|
|
|
<!-- <ion-list>-->
|
|
<!-- -->
|
|
<!-- <ion-item>-->
|
|
<!-- <ion-textarea label="Fixed label" labelPlacement="fixed" placeholder="Enter text"></ion-textarea>-->
|
|
<!-- </ion-item>-->
|
|
<!-- <ion-item>-->
|
|
<!-- <ion-textarea label="Stacked label" labelPlacement="stacked" placeholder="Enter text"></ion-textarea>-->
|
|
<!-- </ion-item>-->
|
|
<!-- </ion-list>-->
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</ion-content>
|
|
<ion-footer>
|
|
<ion-grid style="background-color: lightgray;">
|
|
<ion-row>
|
|
<ion-col>
|
|
<ion-button
|
|
(click)="setCloseModal()"
|
|
shape="round"
|
|
size="small"
|
|
color="danger">
|
|
Close
|
|
</ion-button>
|
|
</ion-col>
|
|
<ion-col></ion-col>
|
|
<ion-col>
|
|
<ion-button
|
|
shape="round"
|
|
size="small"
|
|
[disabled]="isDisabled"
|
|
(click)="processTask()">Assign Task </ion-button>
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
|
|
|
|
</ion-footer>
|
|
</ng-template>
|
|
</ion-modal>
|
|
</div> |