Sales Screen

<ul class="nav nav-pills mb-3 border-bottom border-secondary" id="pills-tab"
role="tablist">
<li class="nav-item">
<a class="nav-link nav-link-1 active" id="" data-toggle="pill" href="#pills-
new" role="tab" aria-controls="pills-home"
(click)="tab='sales'" aria-selected="true">Sales Billing</a>
</li>
<li class="nav-item">
<a class="nav-link" id="" data-toggle="pill" href="#pills-history" role="tab"
(click)="tab='history'"
aria-selected="false">Sales
History</a>
</li>
<li class="ml-auto">
<span class="badge badge-info text-white px-3 py-
2">{{selectedPaymentStatus['name']}}</span>
</li>
</ul>
<div class="tab-content" id="pills-tabContent" *ngIf="tab=='sales'">
<div class="tab-pane fade show active" id="pills-new" role="tabpanel" aria-
labelledby="pills-home-tab">
<form class="" #salesbillingform="ngForm" [formGroup]="salesBillingForm"
(keydown.enter)="$event.preventDefault()"
(ngSubmit)="onSubmit()">
<h6 class="border border-primary p-2 mt-3 mb-4 bg-light text-white">
Sale Transaction
</h6>
<div class="form-group row">

<div class="col-sm-8 d-flex">
<div class="d-inline mr-3">
<label class="mb-0">Payment Type</label>
</div>
<div class="custom-control d-inline custom-checkbox mr-3">
<input name="payment-type" type="checkbox" value="cash"
(click)="cashSelected($event)"
class="custom-control-input" id="cash" />
<label class="custom-control-label text-success"
for="cash">Cash</label>
</div>
<input name="payment-type" type="checkbox" value="credit"
(click)="creditSelected($event)"
class="custom-control-input" id="credit" />
<label class="custom-control-label text-danger"
for="credit">Credit</label>
</div>
<input name="payment-type" type="checkbox" value="insurence"
(click)="insurenceSelected($event)"
class="custom-control-input" id="insurance" />
<label class="custom-control-label text-light"
for="insurance">Insurance</label>
</div>
<input name="payment-type" type="checkbox" value="Membership"
(click)="membershipSelected($event)"
class="custom-control-input" id="membership" />
<label class="custom-control-label text-light"
for="membership">Membership</label>
</div>
<input name="payment-type" type="checkbox" value="m-pesa"
(click)="mPesaSelected($event)"
class="custom-control-input" id="m-pesa" />
<label class="custom-control-label text-warning" for="m-pesa">M-
Pesa</label>
</div>
<input name="payment-type" type="checkbox" value="card"
(click)="cardSelected($event)"
class="custom-control-input" id="card" />
<label class="custom-control-label text-dark" for="card">Card</label>
</div>
<div class="custom-control d-inline custom-checkbox">
<input name="payment-type" type="checkbox" value="cheque"
(click)="chequeSelected($event)"
class="custom-control-input" id="cheque" />
<label class="custom-control-label text-info"
for="cheque">Cheque</label>
</div>
</div>
<div class="col-lg-4 mb-0">
<div class="custom-control d-inline custom-checkbox">
<input name="payment-type" type="checkbox" value="dummyBill"
(click)="dummyBillSelected($event)"
class="custom-control-input" id="dummyBill" />
<label class="custom-control-label text-light" for="dummyBill">Dummy
Bill</label>
</div>
<a [routerLink]="['/master/customer']" class="ml-2">Customer</a> |
<a [routerLink]="['/master/provider']">Doctor</a>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<label for="" class="col-sm-4 col-form-label px-0 text-right">Bill
Number</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="" placeholder="Bill
Number" [(ngModel)]="billNumber"
[ngModelOptions]="{standalone:true}" disabled />
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Bill
Date</label>
<input type="date" class="form-control" id="" placeholder=""
formControlName="billDate" disabled />
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Prev Bill
No</label>
<ng-select [items]="prevBillCodeArray" placeholder="-- Select --"
(keyup.enter)="searchPreviousBillCode($event)"
(click)="getPreviousBillCodes()" formControlName="previousBillCode"
[(ngModel)]="selectedPrevBillNo">
</ng-select>
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-
right">Customer</label>
<ng-select [items]="customersArray" bindLabel="customerName"
(change)="customerSelected($event)"
formControlName="customerModel" placeholder="-- Select --"
[(ngModel)]="selectedCustomer"
(search)="searchCustomer($event)"
(change)="customerInsurenceCheck()">
</ng-select>
<div *ngIf="salesBillingForm.get('customerModel')?.touched"
class="error-msg-common text-danger">
<div
*ngIf="salesBillingForm.get('customerModel').errors?.required">
* required field
</div>
</div>
</div>
</div>
right">Phone</label>
<input type="text" class="form-control" id="" placeholder="Phone"
[(ngModel)]="customerPhoneNumber"
[ngModelOptions]="{standalone:true}" />
</div>
</div>

right">Hospital Name</label>
<ng-select [items]="hospitalsArray" placeholder="-- Select --"
bindLabel="hospitalName"
(search)="searchHospital($event)" formControlName="hospitalModel"
[(ngModel)]="selectedHospital">
</ng-select>
<div *ngIf="salesBillingForm.get('customerModel')?.touched"
class="error-msg-common text-danger">
<div
*ngIf="salesBillingForm.get('customerModel').errors?.required">
* required field
</div>
</div>
</div>
</div>
</div>
right">Provider</label>
<ng-select [items]="doctorsArray" placeholder="-- Select --"
bindLabel="firstName"
(change)="doctorSelected($event)" formControlName="providerModel"
[(ngModel)]="selectedDoctor"
(search)="searchProviders($event)">
</ng-select>

<div *ngIf="salesBillingForm.get('customerModel').errors?.required">
* required field
</div>

</div>
</div>
right">Speciality</label>
<input type="text" class="form-control" id=""
placeholder="Speciality" value="{{speciality}}" disabled />
</div>
</div>
</div>
</div>
Prescription Details
</h6>
<form class="" #prescriptionform="ngForm" [formGroup]="prescriptionForm"
(keydown.enter)="$event.preventDefault()">
right">Prescription Date</label>
formControlName="prescriptionDate"
(change)="getPresciption()" />
</div>
</div>
</div>
right">Prescription Image</label>
<div class="col-sm-8 pt-1">
<input type="file" class="form-control-file" id="" accept="image/*"
(change)="selectPrescriptionImage($event)" />
</div>
</div>
</div>
<img [src]="'data:image/JPEG;base64,' + url" alt="Place image title"
*ngIf="isImageLoading"
style="width: 50px;height: 50px;border:1px solid green" data-
toggle="modal"
data-target="#prescriptionImageModel">
</div>
</div>
</div>
</form>
<h6 *ngIf="insurenceCheckbox" class="border border-primary p-2 mt-3 mb-4 bg-
light text-white">
Insurance
</h6>
<div *ngIf="insurenceCheckbox" class="row">

right">Number</label>
<input type="text" class="form-control" id="" placeholder="Number"
(keyup.enter)="getInsurenceByPolicyCode($event)"
[(ngModel)]="insuranceModel.policyCode"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Customer
Contribution %</label>
<input type="text" class="form-control" id="" placeholder="Customer
Contribution %"
[(ngModel)]="insuranceModel.contributionPercentage"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Customer
Amount</label>
Amount"
[(ngModel)]="insuranceModel.customerConributionAmount"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Insurance
Contribution %</label>
<input type="text" class="form-control" id="" placeholder="Insurance
Contribution %"
[(ngModel)]="insuranceModel.insurenceContributionPercentage"
</div>
</div>
</div>
Contribution Amount</label>
Contribution Amount"
[(ngModel)]="insuranceModel.insurenceContributionAmount"
</div>
</div>
</div>
Person Phone</label>
Person Phone"
[(ngModel)]="insuranceModel.contactNumber"
</div>
</div>
</div>
</div>

<h6 *ngIf="membershipCheckbox" class="border border-primary p-2 mt-3 mb-4 bg-

light text-white">
Membership Details
</h6>
<div *ngIf="membershipCheckbox" class="row">

<label for="" class="col-sm-4 col-form-label px-0 text-right">Card
Number</label>
<input type="text" class="form-control" id="" placeholder="Card
Number"
(keyup.enter)="getMembershipDataByMembershipCardNumber($event)"
[(ngModel)]="membershipModel.membershipCardNumber"
</div>
</div>

</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Discount
%</label>
<input type="text" class="form-control" id="" placeholder="Discount
%"
[(ngModel)]="membershipModel.membershipDiscountPercentage"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Discount
Amount</label>
<input type="text" class="form-control" id="" placeholder="Discount
Amount" />
</div>
</div>
</div>
right">Validity</label>
[(ngModel)]="membershipModel.membershipEndDate"
</div>
</div>
</div>
</div>

Item Details
</h6>
<div class="row">
<div class="col text-right pb-2">

<input type="button" value="Add Row" class="btn btn-primary"
(click)="addSearchRowToEditScreen()"
*ngIf="editScreen">
</div>
</div>
<div class="row">
<div class="col-12 pb-4">
<ag-grid-angular style="width: 100%; height: 200px;" class="ag-theme-
balham" [gridOptions]="itemGridOptions"
(cellKeyDown)="onCellKeyDown($event)">

</ag-grid-angular>
</div>
</div>

Total Charges
</h6>
<div class="row">
<label for="" class="col-sm-4 col-form-label px-0 text-right">Total
Items</label>
<input type="text" class="form-control" id="" placeholder="Total
Items" [(ngModel)]="totalItemsCount"
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Qty <span
<input type="date" class="form-control" id="" placeholder="Total
Quantity" />
</div>
</div> -->
<label for="" class="col-sm-4 col-form-label px-0 text-right">VAT <span
<input type="text" class="form-control" id="" placeholder="Total VAT"
[(ngModel)]="totalVATAmount"
</div>
</div>
</div>
right">Gross</label>
<input type="text" class="form-control" id="" placeholder="Gross
Amount" />
</div>
</div> -->
Discount <span class="text-danger">*</span></label>
<input type="text" class="form-control"
[(ngModel)]="totalDiscPercentageAmount"
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Net
Amount</label>
<input type="text" class="form-control" id="" placeholder="Net
Amount" [(ngModel)]="netAmount"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Adjusted
Amount</label>
<input type="text" (keyup.enter)="adjustItems($event)" class="form-
control" id=""
placeholder="Adjustment Amount"/>
</div>
</div>
<div class="col-sm-12 text-right">
<button class="btn btn-secondary">Adjust Quantity</button>
</div>
</div> -->
<label for="" class="col-sm-4 col-form-label px-0 text-right">Round
off</label>
<input type="text" class="form-control" id="" placeholder="Round off"
(keyup.enter)="roundOffCalc($event)" [(ngModel)]="roundOff"/>
</div>
</div>
</div>
Qty</label>
<input type="text" class="form-control" id="" placeholder="Total
Quantity" [(ngModel)]="totalQty"
</div>
</div>
</div>
right">Balance</label>
<input type="text" class="form-control" id="" placeholder="Balance"
[(ngModel)]="balence"
</div>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Amount
Paid</label>
<input type="text" class="form-control" id="" placeholder="Amount
Paid" [(ngModel)]="paidAmount"
(keyup.enter)="paidCalc()" [ngModelOptions]="{standalone:true}"
(keyup)="paidCalc()"/>
</div>
</div>
<label for="" class="col-sm-4 col-form-label px-0 text-right">Mem.
Disc.</label>
<input type="text" class="form-control" id="" placeholder="Membership
Discount" value=0 />
</div>
</div> -->
</div>
</div>
<div class="row py-4">

<div class="col-sm-5 mx-auto text-center pb-4">
<h5>Payment Status </h5>
<ng-select [items]="paymentStatusArray" bindLabel="name" placeholder="--
Select --" [(ngModel)]="selectedPaymentStatus"
[ngModelOptions]="{standalone:true}">
</ng-select>
</div>
<div class="col-sm-12 text-center">
<h5>Total Amount: {{finalAmount}}.00</h5>
<input type="button" [disabled]="selectedPaymentStatus['name'] != 'Paid'"
(click)="saveGenerateBill()"
class="btn btn-primary btn-lg px-4" value="Generate Bill">
</div>
</div>
<div class="row" *ngIf="cashCheckbox || creditCheckbox || card || cheque ||

mPesaCheckbox ">
<div class="col-sm-2"></div>
<table class="table table-bordered border-primary">
<thead>
<tr>
<th>Payment Type</th>
<th>Amount</th>
<th>Cheque/Card/Phone No/Credit Amt</th>
<th>Card Bank/Tranx No</th>
</tr>
</thead>
<tbody>
<tr *ngIf="cashCheckbox">
<td>Cash</td>
<td><input type="text" class="form-control form-height"
formControlName="cashAmount" /></td>
<td colspan="2"></td>
</tr>
<tr *ngIf="creditCheckbox">
<td>Credit Days</td>
<td> <input type="text" class="form-control" id="" placeholder="0"
formControlName="creditDays" /></td>
<td> <input type="text" class="form-control" id="" placeholder="0"
formControlName="creditAmount" /></td>
<td colspan="2"></td>
</tr>
<tr *ngIf="card">
<td>Card</td>
formControlName="creditCardAmount" /></td>
formControlName="creditCardNo" /></td>
<td>
<ng-select [items]="testing" bindLabel="test"
[loading]="Loading">
</ng-select>
</td>
</tr>
<tr *ngIf="mPesaCheckbox">
<td>M-Pesa</td>
formControlName="upiPhoneNo" /></td>
formControlName="upiAmount" /></td>
formControlName="upiTransactionId" /></td>
</tr>
<tr *ngIf="cheque">
<td>Cheque</td>
formControlName="chequeNumber" /></td>
formControlName="chequeAmount" /></td>
<td>
<ng-select [items]="testing" bindLabel="test"
[loading]="Loading">
</ng-select>
</td>
</tr>
</tbody>
</table>
</div>
<div class="col-sm-2"></div>
</div>
<div class="row">
<div class="col mb-3 pt-2 text-center">
<button class="btn btn-primary px-4" *ngIf="!editScreen">Save</button>
<button class="btn btn-primary px-4" *ngIf="editScreen">Update</button>
<input type="button" class="btn btn-secondary px-4 ml-3"
(click)="resetSave()" value="Cancel"
*ngIf="!editScreen" />
<input type="button" class="btn btn-secondary px-4 ml-3"
(click)="resetEdit()" value="Cancel"
*ngIf="editScreen" />
</div>
</div>
</form>
</div>
</div>
<div class="tab-content" id="pills-tabContent" *ngIf="tab=='history'">
<div class="tab-pane fade show" id="pills-history" role="tabpanel">

<h6 class="border border-primary p-2 mt-3 mb-4 bg-light text-white">Sales
History Details</h6>
<div class="row">
<label for="" class="col-sm-2 col-form-label px-0 text-right"
id="newStockLabelItemCd">Date</label>
<input type="date" class="form-control" id="" [(ngModel)]="startDate">
</div>
<input type="date" class="form-control" id="" [(ngModel)]="endDate">
</div>
</div>
</div>
id="newStockLabelItemCd">Status</label>
<ng-select [items]="paymentStatusArr" bindLabel="name" placeholder="--
Select --" [loading]="Loading" id="newStockBatch#"
[(ngModel)]="paymentStatus">
</ng-select>
</div>
</div>
</div>
</div>
<div class="row">
id="newStockLabelItemCd">Search By</label>
<ng-select [items]="searchCodeArr" placeholder="-- Select --"
[loading]="Loading" id="newStockBatch#"
[(ngModel)]="searchCode">
</ng-select>
</div>
</div>
</div>
<input type="text" class="form-control" id="" placeholder="Bill # /
Customer Name"
[(ngModel)]="searchCodeValue">
</div>
</div>
</div>
<div class="col-sm-12 text-right">
<button class="btn btn-primary"
(click)="getSalesBySearch()">Search</button>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col text-right pb-2">
<input type="button" class="btn btn-primary" id="Editclickbtn"
(click)="getSelectedSalesRecord()" value="Edit"
[disabled]="saleEditGridOptions?.api?.getSelectedRows()?.length === 0">
</div>
</div>
<div class="row">
<div class="col-12 py-3">
balham"
[gridOptions]='saleEditGridOptions'
[pagination]="true" [cacheOverflowSize]="salesEditCacheOverflowSize"
[maxConcurrentDatasourceRequests]="salesEditMaxConcurrentDatasourceRequests"
[paginationPageSize]="salesEditPaginationSize">
</ag-grid-angular>
</div>
</div>
</div>
</div>

<div class="modal fade" id="itemSearchModal" tabindex="-1" role="dialog" aria-
labelledby="itemSearchModalLabel">
<div class="modal-dialog model-dialog-newwidth" role="document">
<div class="modal-content">
<div class="modal-body p-4" style="border: 1px solid #10847e;">

<div class="row">
<input type="text" class="form-control form-height"
[(ngModel)]="itemSearchKey"
</div>
<ng-select [items]="searchTermsArray" placeholder="-- Select --"
[(ngModel)]="selectedSearchTerms"
</ng-select>
</div>
<input type="button" class="btn btn-secondary px-4" value="Search"
(click)="searchStock()" [disabled]="checkSearchTermDisability()"
[disabled]="stockSearchDisable">
</div>
</div>
</div>
</div>
balham" id="grid-wrapper"
[gridOptions]="stockGridOptions"
[pagination]="true" [cacheOverflowSize]="cacheOverflowSize"
[maxConcurrentDatasourceRequests]="maxConcurrentDatasourceRequests"
[paginationPageSize]="paginationSize" >
</ag-grid-angular>

</div>
<ul class="tabs" id="menu">
<li style="list-style-type: square;color: red;">Expired</li>
<li style="list-style-type: square;color: blue;">Out of stock</li>
<li style="list-style-type: square;color: rgb(150, 255, 140);">Low
items Stock</li>
<li style="list-style-type: square;color: orange;">Expired soon </li>
<li style="list-style-type: square;color: green;">Alternative
Medicine</li>
</ul>
<div class="col-sm-12 text-center pt-3">
<button type="button" data-dismiss="modal"
[disabled]="stockGridOptions?.api?.getSelectedRows()?.length === 0"
class="btn btn-primary px-4 mr-2"
(click)="getSelectedStockItems()">OK</button>
<button type="button" class="btn btn-secondary px-4" data-
dismiss="modal" (click)="close()">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>

<div class="modal fade" id="prescriptionImageModel" tabindex="-1" role="dialog"
aria-labelledby="prescriptionImageModel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
<img [src]="'data:image/JPEG;base64,' + url" alt="Place image title"
*ngIf="isImageLoading"
style="width: 500px;height: 400px;border:1px solid green">
</div>
</div>
</div>
</div>
</div>
</div>
<ng4-loading-spinner [loadingText]="'Please wait...'" [timeout]="400000000">
</ng4-loading-spinner>

Sales Screen

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Sales Screen

Hochgeladen von

Copyright:

Verfügbare Formate

<ul class="nav nav-pills mb-3 border-bottom border-secondary" id="pills-tab"

<div class="form-group row">

<div class="form-group row">

<div *ngIf="insurenceCheckbox" class="row">

<!-- <h6 class="border border-primary p-2 mt-3 mb-4 bg-light text-white">

<h6 *ngIf="membershipCheckbox" class="border border-primary p-2 mt-3 mb-4 bg-

<div *ngIf="membershipCheckbox" class="row">

<h6 class="border border-primary p-2 mt-3 mb-4 bg-light text-white">

<h6 class="border border-primary p-2 mt-3 mb-4 bg-light text-white">

<div class="row py-4">

<div class="row" *ngIf="cashCheckbox || creditCheckbox || card || cheque ||

Das könnte Ihnen auch gefallen