Neues Initialrelease mit IonicMaterial
This commit is contained in:
Carsten Hilmer
@@ -0,0 +1,87 @@
|
||||
<!--View Information-->
|
||||
<!--View name : Contract Detail-->
|
||||
<!--Controller name : contractDetailCtrl-->
|
||||
<!--Controller path : www/templates/application-storage/sqLite/js/controllers.js-->
|
||||
<!--State name : app.contractdetail-->
|
||||
<!--URL : #app/contractdetail-->
|
||||
|
||||
<ion-view title="Contract">
|
||||
<!--left button on navigation bar-->
|
||||
<ion-nav-buttons side="left">
|
||||
<a ng-click="$ionicGoBack()" class="button back-button buttons button-clear header-item nav-back-btn">
|
||||
<i class="ion-android-arrow-back"></i>
|
||||
</a>
|
||||
</ion-nav-buttons> <!--end left button on navigation bar-->
|
||||
|
||||
<!--contract detail section-->
|
||||
<form name="contractForm">
|
||||
<ion-content id="contract-details-content">
|
||||
<!--contract detail input section-->
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-person"></i>
|
||||
<input ng-model="contract.firstName" name="firstName" required placeholder="* First Name (required)">
|
||||
</md-input-container>
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-people"></i>
|
||||
<input ng-model="contract.lastName" name="lastName" required placeholder="* Last Name (required)">
|
||||
</md-input-container>
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-phone-portrait"></i>
|
||||
<input ng-model="contract.telephone" name="telephone" required placeholder="* Telephone (required)"
|
||||
type="tel">
|
||||
</md-input-container>
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-mail"></i>
|
||||
<input ng-model="contract.email" name="email" placeholder="Email">
|
||||
</md-input-container>
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-calendar"></i>
|
||||
<input ng-model="contract.createDate" disabled name="dateTime" placeholder="Date Time">
|
||||
</md-input-container>
|
||||
<md-input-container md-no-float>
|
||||
<i class="ion-android-favorite"></i>
|
||||
<input ng-model="contract.age" numbers-only name="age" placeholder="Age" type="tel">
|
||||
</md-input-container><!--end contract detail input section-->
|
||||
|
||||
<!--contract switch section-->
|
||||
<md-switch ng-model="contract.isEnable" ng-disabled="actionDelete">
|
||||
{{(contract.isEnable == true ? 'Enable' : 'Disabled' ) }} Contract
|
||||
</md-switch><!--end contract switch section-->
|
||||
|
||||
</ion-content>
|
||||
<div class="footer-fab-bar">
|
||||
<a class="md-button md-accent md-fab fab-footer" ng-click="showListBottomSheet($event,contractForm)"
|
||||
aria-label="Contract Form Actions">
|
||||
<i class="ion-android-star"></i>
|
||||
</a>
|
||||
</div>
|
||||
</form><!--end contract detail section-->
|
||||
|
||||
<!--angular template section-->
|
||||
<script type="text/ng-template" id="contract-actions-template">
|
||||
<md-bottom-sheet class="md-list md-has-header">
|
||||
<h1 class="md-bottom-sheet-header">Contract Actions</h1>
|
||||
<md-list>
|
||||
<!--md bottom sheet list item-->
|
||||
<md-list-item>
|
||||
<a class="md-default-theme md-bottom-sheet-list-item"
|
||||
ng-class="{ 'disabled-link': disableSaveBtn}"
|
||||
ng-click="saveContract(contract,$event)">
|
||||
<i class="ion-android-list"></i>
|
||||
<span>Save Contract</span>
|
||||
</a>
|
||||
</md-list-item>
|
||||
|
||||
<md-list-item ng-show="actionDelete">
|
||||
<a class="md-default-theme md-bottom-sheet-list-item"
|
||||
ng-click="deleteContract(contract,$event)">
|
||||
<i class="ion-android-delete"></i>
|
||||
<span>Remove Contract</span>
|
||||
</a>
|
||||
</md-list-item>
|
||||
<!--end md bottom sheet list item-->
|
||||
</md-list>
|
||||
</md-bottom-sheet>
|
||||
</script><!--end angular template section-->
|
||||
|
||||
</ion-view>
|
||||
105
www/templates/application-storage/sqLite/html/contract-list.html
Normal file
105
www/templates/application-storage/sqLite/html/contract-list.html
Normal file
@@ -0,0 +1,105 @@
|
||||
<!--View Information-->
|
||||
<!--View name : Contract List-->
|
||||
<!--Controller name : contractListCtrl-->
|
||||
<!--Controller path : www/templates/application-storage/sqLite/js/controllers.js-->
|
||||
<!--State name : app.contractlist-->
|
||||
<!--URL : #app/contractlist-->
|
||||
|
||||
<ion-view view-title="">
|
||||
<!--right button on navigation bar-->
|
||||
<ion-nav-buttons side="right">
|
||||
<md-button ng-disabled="isLoading" class="md-icon-button ion-nav-button-right" ng-click="navigateTo('app.contractsetting')"
|
||||
aria-label="Setting">
|
||||
<i class="ion-android-more-vertical"></i>
|
||||
</md-button>
|
||||
</ion-nav-buttons> <!--end right button on navigation bar-->
|
||||
|
||||
<!--toolbar section-->
|
||||
<md-toolbar class="bar-subheader md-tall md-primary toolbar-medium">
|
||||
<div>
|
||||
<h1>Pokedex Helper</h1>
|
||||
|
||||
<h2>Dein Trainertool deluxe</h2>
|
||||
</div>
|
||||
<a class="md-button md-accent md-fab fab-toolbar-medium"
|
||||
ng-click="navigateTo('app.contractdetail',contract)"
|
||||
aria-label="Add">
|
||||
<i class="icon ion-plus"></i>
|
||||
</a>
|
||||
</md-toolbar><!--end toolbar section-->
|
||||
|
||||
<!--contract list section-->
|
||||
<ion-content id="contract-list-content" class="fade-in">
|
||||
<!--list section-->
|
||||
<md-list>
|
||||
|
||||
<md-list-item>
|
||||
<md-input-container md-no-float="" class="md-list-item-full-width">
|
||||
<input ng-model="filterText" placeholder="Finde Pokemon...">
|
||||
</md-input-container>
|
||||
</md-list-item>
|
||||
|
||||
<!--Below code it will disable animation to better performance-->
|
||||
<div ng-if="!isAnimated" class="row contract-list-item"
|
||||
ng-repeat="pokemon in pokemons | filter: filterText | orderBy: 'pokemonname'">
|
||||
<div class="col-25 icon-user">
|
||||
<img ng-src="{{ pokemon.pokemonimage }}" class="image-list-thumb"/>
|
||||
</div>
|
||||
<div class="col-50">
|
||||
<h3>{{ pokemon.pokemonname }}</h3>
|
||||
<div ng-if="pokemon.pokemontypa > 0" class="chip">
|
||||
<img src="{{ pokemon.pokemonimage }}" alt="PokemonTyp" width="96" height="96">
|
||||
{{ pokemon.pokemontypaString }}
|
||||
</div>
|
||||
<div ng-if="pokemon.pokemontypb > 0" class="chip">
|
||||
<img src="{{ pokemon.pokemonimage }}" alt="PokemonTyp" width="96" height="96">
|
||||
{{ pokemon.pokemontypbString }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-25 status-button">
|
||||
<md-menu md-position-mode="target-right target" class="md-list-item-md-menu-right">
|
||||
<p ng-click="$mdOpenMenu()">
|
||||
<md-icon md-menu-origin md-svg-icon="more"></md-icon>
|
||||
</p>
|
||||
<md-menu-content width="1">
|
||||
<md-menu-item>
|
||||
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
|
||||
<span class="menu-item-button">Edit</span>
|
||||
</a>
|
||||
</md-menu-item>
|
||||
<md-menu-item>
|
||||
<a class="md-button md-default-theme" ng-click="callTo(contract.telephone)">
|
||||
<span class="menu-item-button" >Call {{pokemon.telephone}}</span>
|
||||
</a>
|
||||
</md-menu-item>
|
||||
</md-menu-content>
|
||||
</md-menu>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--Below code it will show animation when selecting row.-->
|
||||
<md-list-item ng-if="isAnimated" class="md-list-item-default"
|
||||
ng-click="navigateTo('app.contractdetail',pokemon)"
|
||||
ng-repeat="pokemon in pokemons | filter: filterText | orderBy: 'pokemonname'">
|
||||
|
||||
<img ng-src="{{ pokemon.pokemonimage }}" class="image-list-thumb"/>
|
||||
|
||||
<p>{{ pokemon.pokemonname }} {{ pokemon.pokemonimage }}</p>
|
||||
<md-switch class="md-secondary"
|
||||
ng-model="pokemon.isEnable"
|
||||
ng-change="updateContract(pokemon)">
|
||||
</md-switch>
|
||||
</md-list-item>
|
||||
|
||||
</md-list>
|
||||
<!--end list section-->
|
||||
|
||||
</ion-content><!--end contract list section-->
|
||||
|
||||
<!--loading progress-->
|
||||
<div id="contract-list-loading-progress" class="loading-progress fade-in">
|
||||
<ion-spinner ng-if="!isAndroid" class="progress-circular"></ion-spinner>
|
||||
<md-progress-circular ng-if="isAndroid" md-mode="indeterminate"></md-progress-circular>
|
||||
</div><!--end loading progress-->
|
||||
|
||||
</ion-view>
|
||||
@@ -0,0 +1,54 @@
|
||||
<!--View Information-->
|
||||
<!--View name : Contract Setting-->
|
||||
<!--Controller name : contractSettingCtrl-->
|
||||
<!--Controller path : www/templates/application-storage/sqLite/js/controllers.js-->
|
||||
<!--State name : app.contractsetting-->
|
||||
<!--URL : #app/contractsetting-->
|
||||
|
||||
<ion-view title="SQLite Setting">
|
||||
<!--left button on navigation bar-->
|
||||
<ion-nav-buttons side="left">
|
||||
<a ng-click="$ionicGoBack()" class="button back-button buttons button-clear header-item nav-back-btn">
|
||||
<i class="ion-android-arrow-back "></i>
|
||||
</a>
|
||||
</ion-nav-buttons><!--end left button on navigation bar-->
|
||||
|
||||
<ion-content scroll="false">
|
||||
<!--list section-->
|
||||
<md-list>
|
||||
<md-subheader class="md-warn">The setting will change SQLite data</md-subheader>
|
||||
|
||||
<md-list-item class="md-list-item-default" ng-click="navigateTo('app.contractlist',true)">
|
||||
<i class="fa fa-play"></i>
|
||||
|
||||
<p>Enable Row Animation</p>
|
||||
</md-list-item>
|
||||
|
||||
<md-list-item class="md-list-item-default" ng-click="navigateTo('app.contractlist',false)">
|
||||
<i class="fa fa-stop"></i>
|
||||
|
||||
<p>Disable Row Animation</p>
|
||||
</md-list-item>
|
||||
|
||||
<md-list-item class="md-list-item-default" ng-click="clearAllData($event)">
|
||||
<i class="ion-android-delete"></i>
|
||||
|
||||
<p> Clear All Data</p>
|
||||
</md-list-item>
|
||||
<md-list-item class="md-list-item-default" ng-click="$ionicGoBack()">
|
||||
<i class="ion-android-refresh"></i>
|
||||
|
||||
<p>Refresh Data</p>
|
||||
</md-list-item>
|
||||
<md-list-item class="md-list-item-default">
|
||||
<i class="fa fa-user"></i>
|
||||
|
||||
<p>Contract Count</p>
|
||||
<span ng-show="loading">...</span>
|
||||
<span ng-show="!loading">{{contractsCount.length}}</span>
|
||||
|
||||
</md-list-item>
|
||||
|
||||
</md-list><!--end list section-->
|
||||
</ion-content>
|
||||
</ion-view>
|
||||
Reference in New Issue
Block a user