Pear-Trading/FoodLoop-Web
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Started trader data form entry

Browse source
This commit is contained in:
piratefinn 2017-06-26 18:36:48 +01:00
parent 750774ec5c
commit 0e6529db85
5 changed files with 233 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

199
src/app/components/add-data.component.html Normal file
View file

@ -0,0 +1,199 @@
<div class="animated fadeIn">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<strong>Basic Form</strong> Elements
</div>
<div class="card-block">
<form action="" method="post" enctype="multipart/form-data" class="form-horizontal">
<div class="form-group row">
<label class="col-md-3 form-control-label">Static</label>
<div class="col-md-9">
<p class="form-control-static">Username</p>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="text-input">Text Input</label>
<div class="col-md-9">
<input type="text" id="text-input" name="text-input" class="form-control" placeholder="Text">
<span class="help-block">This is a help text</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="email-input">Email Input</label>
<div class="col-md-9">
<input type="email" id="email-input" name="email-input" class="form-control" placeholder="Enter Email">
<span class="help-block">Please enter your email</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="password-input">Password</label>
<div class="col-md-9">
<input type="password" id="password-input" name="password-input" class="form-control" placeholder="Password">
<span class="help-block">Please enter a complex password</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="disabled-input">Disabled Input</label>
<div class="col-md-9">
<input type="text" id="disabled-input" name="disabled-input" class="form-control" placeholder="Disabled" disabled>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="textarea-input">Textarea</label>
<div class="col-md-9">
<textarea id="textarea-input" name="textarea-input" rows="9" class="form-control" placeholder="Content.."></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="select">Select</label>
<div class="col-md-9">
<select id="select" name="select" class="form-control">
<option value="0">Please select</option>
<option value="1">Option #1</option>
<option value="2">Option #2</option>
<option value="3">Option #3</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="select">Select Large</label>
<div class="col-md-9">
<select id="select" name="select" class="form-control form-control-lg">
<option value="0">Please select</option>
<option value="1">Option #1</option>
<option value="2">Option #2</option>
<option value="3">Option #3</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="select">Select Small</label>
<div class="col-md-9">
<select id="select" name="select" class="form-control form-control-sm">
<option value="0">Please select</option>
<option value="1">Option #1</option>
<option value="2">Option #2</option>
<option value="3">Option #3</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="select">Disabled Select</label>
<div class="col-md-9">
<select id="disabledSelect" class="form-control" disabled>
<option value="0">Please select</option>
<option value="1">Option #1</option>
<option value="2">Option #2</option>
<option value="3">Option #3</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="multiple-select">Multiple select</label>
<div class="col-md-9">
<select id="multiple-select" name="multiple-select" class="form-control" size="5" multiple>
<option value="1">Option #1</option>
<option value="2">Option #2</option>
<option value="3">Option #3</option>
<option value="4">Option #4</option>
<option value="5">Option #5</option>
<option value="6">Option #6</option>
<option value="7">Option #7</option>
<option value="8">Option #8</option>
<option value="9">Option #9</option>
<option value="10">Option #10</option>
</select>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label">Radios</label>
<div class="col-md-9">
<div class="radio">
<label for="radio1">
<input type="radio" id="radio1" name="radios" value="option1"> Option 1
</label>
</div>
<div class="radio">
<label for="radio2">
<input type="radio" id="radio2" name="radios" value="option2"> Option 2
</label>
</div>
<div class="radio">
<label for="radio3">
<input type="radio" id="radio3" name="radios" value="option3"> Option 3
</label>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label">Inline Radios</label>
<div class="col-md-9">
<label class="radio-inline" for="inline-radio1">
<input type="radio" id="inline-radio1" name="inline-radios" value="option1"> One
</label>
<label class="radio-inline" for="inline-radio2">
<input type="radio" id="inline-radio2" name="inline-radios" value="option2"> Two
</label>
<label class="radio-inline" for="inline-radio3">
<input type="radio" id="inline-radio3" name="inline-radios" value="option3"> Three
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label">Checkboxes</label>
<div class="col-md-9">
<div class="checkbox">
<label for="checkbox1">
<input type="checkbox" id="checkbox1" name="checkbox1" value="option1"> Option 1
</label>
</div>
<div class="checkbox">
<label for="checkbox2">
<input type="checkbox" id="checkbox2" name="checkbox2" value="option2"> Option 2
</label>
</div>
<div class="checkbox">
<label for="checkbox3">
<input type="checkbox" id="checkbox3" name="checkbox3" value="option3"> Option 3
</label>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label">Inline Checkboxes</label>
<div class="col-md-9">
<label class="checkbox-inline" for="inline-checkbox1">
<input type="checkbox" id="inline-checkbox1" name="inline-checkbox1" value="option1">One
</label>
<label class="checkbox-inline" for="inline-checkbox2">
<input type="checkbox" id="inline-checkbox2" name="inline-checkbox2" value="option2">Two
</label>
<label class="checkbox-inline" for="inline-checkbox3">
<input type="checkbox" id="inline-checkbox3" name="inline-checkbox3" value="option3">Three
</label>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="file-input">File input</label>
<div class="col-md-9">
<input type="file" id="file-input" name="file-input">
</div>
</div>
<div class="form-group row">
<label class="col-md-3 form-control-label" for="file-multiple-input">Multiple File input</label>
<div class="col-md-9">
<input type="file" id="file-multiple-input" name="file-multiple-input" multiple>
</div>
</div>
</form>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-sm btn-primary"><i class="fa fa-dot-circle-o"></i> Submit</button>
<button type="reset" class="btn btn-sm btn-danger"><i class="fa fa-ban"></i> Reset</button>
</div>
</div>
</div>
</div><!--/.row-->
</div>

15
src/app/components/add-data.component.ts Normal file
View file

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
import { Validators, FormBuilder, FormGroup } from '@angular/forms';
import { Http, Response } from '@angular/http';
import { ApiService } from '../providers/api-service';
import 'rxjs/add/operator/map';
@Component({
templateUrl: 'add-data.component.html',
providers: [ApiService]
})
export class AddDataComponent {
constructor() { }
}

9
src/app/components/components-routing.module.ts
View file

@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LeaderboardsComponent } from './leaderboards.component';
import { AddDataComponent } from './add-data.component';
import { ButtonsComponent } from './buttons.component';
import { CardsComponent } from './cards.component';
import { FormsComponent } from './forms.component';
@ -25,6 +26,14 @@ const routes: Routes = [
title: 'Leaderboards'
}
},
{
path: 'add-data',
component: AddDataComponent,
data: {
title: 'Add Data'
}
},
// Template example pages
{
path: 'buttons',
component: ButtonsComponent,

2
src/app/components/components.module.ts
View file

@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
// Pagesto be used in Production
import { LeaderboardsComponent } from './leaderboards.component';
import { AddDataComponent } from './add-data.component';
// Buttons Component
import { ButtonsComponent } from './buttons.component';
@ -35,6 +36,7 @@ import { ComponentsRoutingModule } from './components-routing.module';
],
declarations: [
LeaderboardsComponent,
AddDataComponent,
ButtonsComponent,
CardsComponent,
FormsComponent,

12
src/app/layouts/full-layout.component.html
View file

@ -64,6 +64,9 @@
<li class="nav-item">
<a class="nav-link" routerLinkActive="active" [routerLink]="['/components/leaderboards']"><i class="icon-puzzle"></i> Leaderboards</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLinkActive="active" [routerLink]="['/components/add-data']"><i class="icon-puzzle"></i> Add Data</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLinkActive="active" [routerLink]="['/components/buttons']"><i class="icon-puzzle"></i> Buttons</a>
</li>
@ -141,12 +144,13 @@
<!-- Breadcrumb Menu-->
<li class="breadcrumb-menu d-md-down-none">
<!-- Currently taking up too much space being here -->
<!-- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
<a class="btn btn-secondary" href="#"> &nbsp;Customers This Month: {{customersThisMonth}}</a>
<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
<a class="btn btn-secondary" routerLinkActive="active" [routerLink]="['/components/add-data']">< &nbsp;Add Transaction</a>
<!-- <a class="btn btn-secondary" href="#"> &nbsp;Customers This Month: {{customersThisMonth}}</a>
<a class="btn btn-secondary" [routerLink]="['/dashboard']">&nbsp;Money Spent this Month: {{moneySpentThisMonth | currency:'GBP':true:'1.2-2'}}</a>
<a class="btn btn-secondary" href="#"> &nbsp;Points Total: {{pointsTotal}}</a>
<a class="btn btn-secondary" [routerLink]="['/dashboard']">&nbsp;Average Transaction Today: {{averageTransactionToday | currency:'GBP':true:'1.2-2'}}</a>
</div> -->
<a class="btn btn-secondary" [routerLink]="['/dashboard']">&nbsp;Average Transaction Today: {{averageTransactionToday | currency:'GBP':true:'1.2-2'}}</a> -->
</div>
</li>
</ol>