Skip to content

D
dcarfixers_angular
Commit f14e4817 by amalk
Options

30-04-2019|15:52

parent 76bd408a
Showing with 459 additions and 10 deletions
src/app/purchase/addaddress/addaddress.component.html 0 → 100644
<div class="purchase_wrapper">
<div class="container-fluid">
<app-searchbar>
</app-searchbar>
<div class="add_address_wrapper">
<h4>Add New Address</h4>
<div class="row">
<div class="col-md-12">
<p>Name*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>Phone Number*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>House number or Building number*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>Area, Road or Colony*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>State*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>City*</p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<p>Land mark <span>(Optional)</span></p>
<input class="" type="text">
</div>
</div>
<div class="row">
<div class="col-md-12">
<button class="add_btn" (click)="goToPage('address')">Add Address</button>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/purchase/addaddress/addaddress.component.scss 0 → 100644
.purchase_wrapper{
.add_address_wrapper{
width:calc(100% - 50%);
padding-top:30px;
margin:0 auto;
h4{
font-size: 20px;
padding-bottom: 40px;
}
p{
margin: 0px;
padding-bottom: 15px;
font-weight: 600;
span{
color: #99a7b6;
}
}
input{
width:100%;
background: #fff;
border:none;
border-radius:5px;
height:45px;
padding-left:10px;
padding-right: 10px;
-webkit-box-shadow: 0px 1px 21px -10px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 1px 21px -10px rgba(0,0,0,0.2);
box-shadow: 0px 1px 21px -10px rgba(0,0,0,0.2);
&:focus{
outline: none;
}
}
.row{
padding-bottom: 20px;
}
.add_btn{
width:100%;
background: #2655bf;
color: #fff;
text-align: center;
height: 45px;
border:none;
}
}
}
\ No newline at end of file
src/app/purchase/addaddress/addaddress.component.spec.ts 0 → 100644
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AddaddressComponent } from './addaddress.component';
describe('AddaddressComponent', () => {
let component: AddaddressComponent;
let fixture: ComponentFixture<AddaddressComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AddaddressComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AddaddressComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/purchase/addaddress/addaddress.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { Router,ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-addaddress',
templateUrl: './addaddress.component.html',
styleUrls: ['./addaddress.component.scss']
})
export class AddaddressComponent implements OnInit {
constructor(
private router : Router,
private route : ActivatedRoute
) { }
ngOnInit() {
}
goToPage(path,data=null){
this.router.navigateByUrl(path,{queryParams:data});
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
}
src/app/purchase/address/address.component.html
......@@ -27,7 +27,7 @@
Edit
</div>
</li>
<div class="add_new">
<div class="add_new" (click)="goToPage('addaddress')">
Add new Address
</div>
</ul>
......
src/app/purchase/ordersuccess/ordersuccess.component.html 0 → 100644
<div class="purchase_wrapper">
<!-- <div class="order_success_banner">
<h4>Order Success!</h4>
<p>Total item 1, Payment Successfull</p>
<button class="order">Go to my orders</button>
</div>
<div class="container-fluid">
<div class="summary_wrapper">
<div class="summary_wrapper_inner">
<h4>Product Details</h4>
<div class="row">
<div class="col-md-6">
<div class="image_div"></div>
<div class="image_detail">
<h5>Appolo Amazer Tubeless 4 Wheeler</h5>
<p>Audi Q7</p>
</div>
<div class="clear"></div>
</div>
<div class="col-md-6">
<h6>
<span class="head">Color</span>
<span>Black</span>
</h6>
</div>
</div>
<hr>
<h4>Delivery Address</h4>
<div class="row">
<div class="col-md-6">
<h2>Loius Morgan <span class="address">(Home)</span><span class="number">+91 996548752</span></h2>
<p> Ground Floor, Carnival Infopark, Phase- 2 Kusumagiri PO, Kakkanad, Kochi, Kerala <strong>Pin 682030</strong> </p>
</div>
<div class="col-md-6">
<p>Delivery Expected by Thursday 29 April, 2019</p>
</div>
</div>
<hr>
<h4>Payment Details</h4>
<div class="row">
<div class="col-md-6">
<p class="p0">Quantity </p>
</div>
<div class="col-md-6">
<p><strong>1</strong></p>
</div>
</div>
<div class="row">
<div class="col-md-6">
<p>Total Amount</p>
</div>
<div class="col-md-6">
<p><strong style="font-size: 18px;">$ 399</strong></p>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-6">
<p>Order Confirmation mail will be sent to your mail ID <a>dummy@gmail.com</a> </p>
</div>
<div class="col-md-6">
<button class="continue_btn">Continue</button>
<span tooltip="Tooltip" placement="top" show-delay="500">Tooltip on top</span>
<div class="clear"></div>
</div>
</div>
<hr>
</div>
</div>
</div> -->
<!-- <div class="order_failed">
<div class="container-fluid">
<div class="order_failed">
<img src="assets/images/order_failed.png">
<h4>Order Failed!</h4>
<p>Something went wrong</p>
<button class="go_home">Go home</button>
<button class="order_again">Order again</button>
</div>
</div>
</div> -->
<div class="order_failed">
<div class="container-fluid">
<div class="order_failed">
<img src="assets/images/no_result.png">
<h4>Oops !</h4>
<p>We could find your search results</p>
<button class="go_home">Go home</button>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/purchase/ordersuccess/ordersuccess.component.scss 0 → 100644
.purchase_wrapper{
.order_success_banner{
background: url("/assets/images/order_banner.png");
margin-bottom: 30px;
background-position: center;
background-size:cover;
background-repeat: no-repeat;
text-align: center;
padding-top: 50px;
padding-bottom: 50px;
.order{
background: #2655bf;
color: #fff;
border:none;
height: 40px;
padding-left:2%;
padding-right:2%;
}
}
.summary_wrapper{
h3{
font-size: 20px;
padding-bottom: 20px;
}
.summary_wrapper_inner{
background: #fff;
padding:25px;
hr{
margin-top: 25px;
margin-bottom: 25px;
}
h4{
color: #92a1b1;
padding-bottom: 10px;
font-size: 16px;
font-weight: 600;
}
h6{
span{
}
.head{
color: #92a1b1;
padding-right: 20px;
}
}
.image_div{
width:100px;
height:100px;
float: left;
border:1px solid #eee;
img{
width:100%;
height:100%;
object-fit: cover;
object-position: center;
}
}
.image_detail{
float: left;
padding: 15px;
}
h2{
font-size: 18px;
margin:0px;
font-weight: 700;
padding-bottom: 10px;
.address{
color: #92a1b1;
margin-left: 10px;
margin-right: 10px;
font-weight: 600;
}
.number{
margin-left:30px;
font-weight:400;
}
}
p{
padding-top: 10px;
margin: 0px;
a{
color: #92a1b1;
text-decoration: none;
}
}
.continue_btn{
background: #2655bf;
color: #fff;
height: 45px;
padding: 8px;
padding-left: 8%;
padding-right: 8%;
border:none;
text-align: center;
cursor: pointer;
}
}
}
}
.order_failed{
text-align: center;
padding-top:8%;
padding-bottom:8%;
img{
margin-bottom: 20px;
}
h4{
margin:0px;
padding:0px;
font-weight: 600;
font-size: 35px;
}
p{
margin:0px;
padding:0px;
padding-bottom: 30px;
font-size:15px;
}
.go_home{
background: #eaeff4;
color: #000;
height: 45px;
padding: 8px;
padding-left:3%;
padding-right:3%;
border:none;
text-align: center;
cursor: pointer;
-webkit-box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
margin:5px;
}
.order_again{
background: #2655bf;
color: #fff;
height: 45px;
padding: 8px;
padding-left:3%;
padding-right:3%;
border:none;
text-align: center;
cursor: pointer;
-webkit-box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
box-shadow: 1px -1px 3px -1px rgba(0,0,0,0.75);
margin:5px;
}
}
\ No newline at end of file
src/app/purchase/ordersuccess/ordersuccess.component.spec.ts 0 → 100644
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { OrdersuccessComponent } from './ordersuccess.component';
describe('OrdersuccessComponent', () => {
let component: OrdersuccessComponent;
let fixture: ComponentFixture<OrdersuccessComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ OrdersuccessComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(OrdersuccessComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/purchase/ordersuccess/ordersuccess.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-ordersuccess',
templateUrl: './ordersuccess.component.html',
styleUrls: ['./ordersuccess.component.scss']
})
export class OrdersuccessComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
src/app/purchase/purchase.module.ts
......@@ -14,10 +14,12 @@ import { TrackComponent } from './track/track.component';
import { AddressComponent } from './address/address.component';
import { SummaryComponent } from './summary/summary.component';
import { TooltipModule } from 'ng2-tooltip-directive';
import { AddaddressComponent } from './addaddress/addaddress.component';
import { OrdersuccessComponent } from './ordersuccess/ordersuccess.component';
@NgModule({
declarations: [ProductlistComponent, ProductdetailsComponent, SearchbarComponent, CartComponent, OrdersComponent, RatingComponent, TrackComponent, AddressComponent, SummaryComponent],
declarations: [ProductlistComponent, ProductdetailsComponent, SearchbarComponent, CartComponent, OrdersComponent, RatingComponent, TrackComponent, AddressComponent, SummaryComponent, AddaddressComponent, OrdersuccessComponent],
imports: [
CommonModule,
moduleRouting,
......
src/app/purchase/purchase.routing.ts
......@@ -8,16 +8,20 @@ import { RatingComponent } from './rating/rating.component';
import { TrackComponent } from './track/track.component';
import { AddressComponent } from './address/address.component';
import { SummaryComponent } from './summary/summary.component';
import { AddaddressComponent } from './addaddress/addaddress.component';
import { OrdersuccessComponent } from './ordersuccess/ordersuccess.component';
const ModuleRoutes: Routes = [
{ path: 'productlist', component: ProductlistComponent},
{ path: 'productdetails', component: ProductdetailsComponent},
{ path: 'cart', component: CartComponent },
{ path: 'orders', component: OrdersComponent },
{ path: 'rating', component: RatingComponent },
{ path: 'track', component: TrackComponent },
{ path: 'address', component: AddressComponent },
{ path: 'summary', component: SummaryComponent }
{ path: 'orders', component: OrdersComponent},
{ path: 'rating', component: RatingComponent},
{ path: 'track', component: TrackComponent},
{ path: 'address', component: AddressComponent},
{ path: 'summary', component: SummaryComponent},
{ path: 'addaddress', component: AddaddressComponent},
{ path: 'ordersuccess', component: OrdersuccessComponent}
];
......
src/app/purchase/summary/summary.component.html
......@@ -37,7 +37,7 @@
<h4>Payment Details</h4>
<div class="row">
<div class="col-md-6">
<p>Quantity </p>
<p class="p0">Quantity </p>
</div>
<div class="col-md-6">
<p><strong>1</strong></p>
......
src/app/purchase/summary/summary.component.scss
......@@ -14,8 +14,8 @@
h4{
color: #92a1b1;
padding-bottom: 10px;
font-size: 18px;
font-weight: 500;
font-size: 16px;
font-weight: 600;
}
h6{
span{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment