对比pc版控件 by kill

wangtengyu

2018-11-07 8ddfd9aee1406cc2cbe0b3962cc5b7301c7280f8

对比pc版控件 by kill

 ionic.config.json

@@ -1,6 +1,5 @@
{
  "name": "ionic-seed3",
  "app_id": "",
  "type": "ionic-angular",
  "integrations": {}
  "integrations": {},
  "type": "ionic-angular"
}

 src/assets/img/loginuser.jpg

 src/kl/core/services/auth.service.ts

@@ -1,17 +1,10 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Storage } from '@ionic/storage';
import { HttpClient } from './httpclient';
import { User } from 'kl/model';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class AuthService {

  // TODO 路由守卫

  private _user: User;

  constructor(private http: HttpClient, private storage: Storage) { }
  constructor() { }

}

 src/kl/core/services/httpclient.ts

@@ -1,7 +1,6 @@
import { Injectable } from '@angular/core';
import { Http, Headers, Response, Request, RequestMethod, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import * as moment from 'moment';
import { LoadingService } from './loading.service';
import { ApiResult } from 'kl/model';

@@ -53,23 +52,6 @@
        if (showLoading !== false) this.loading.hide();
      }).map(r => r.json() as T)
      .catch(x => this.handleError(x));
  }

  /**
   * 将字典转为QueryString
   */
  private _formatUrl(params?: { [key: string]: string }): string {
    if (!params) return '';

    let fegment = [];
    for (let k in params) {
      let v: any = params[k];
      if (v instanceof Date) {
        v = moment(v).format('YYYY-MM-DD HH:mm:SS');
      }
      fegment.push(`${k}=${v}`);
    }
    return '?' + fegment.join('&');
  }

  /**

 src/pages/access/components/input/input.html

New file
@@ -0,0 +1,14 @@
<!-- Generated template for the InputComponent component -->

<ion-header>

  <ion-navbar>
    <ion-title>input</ion-title>
  </ion-navbar>

</ion-header>
<ion-content padding>
  <ion-list col text-center>

  </ion-list>
</ion-content>

 src/pages/access/components/input/input.module.ts

New file
@@ -0,0 +1,15 @@
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { InputPage } from './input';
import { AccessModule } from '../../access.module';

@NgModule({
  declarations: [
    InputPage,
  ],
  imports: [
    AccessModule,
    IonicPageModule.forChild(InputPage),
  ],
})
export class LoginPageModule { }

 src/pages/access/components/input/input.scss

New file
@@ -0,0 +1,3 @@
input {

}

 src/pages/access/components/input/input.ts

New file
@@ -0,0 +1,25 @@
import { Component } from '@angular/core';
import { IonicPage } from 'ionic-angular';

/**
 * Generated class for the InputComponent component.
 *
 * See https://angular.io/docs/ts/latest/api/core/index/ComponentMetadata-class.html
 * for more info on Angular Components.
 */


@IonicPage({
  name: 'access-input'
})
@Component({
  selector: 'page-input',
  templateUrl: 'input.html',
})
export class InputPage {

  text: string;

  constructor() {}

}

 src/pages/access/components/login/login.html

@@ -8,5 +8,24 @@


<ion-content padding>
  <button ion-button (click)="register()">Register</button>
    <ion-grid>
      <ion-row>
        <ion-col col text-center >
            <img  src='../../../assets/img/loginuser.jpg'/>
        </ion-col>
      </ion-row>
      <ion-row>
        <ion-list col text-center>
          <ion-item>
            <ion-input type="text" placeholder="Username"></ion-input>
          </ion-item>
          <ion-item col text-center>
            <ion-input type="password" placeholder="Password"></ion-input>
          </ion-item>
        </ion-list>
      </ion-row>
      <ion-row>
          <button ion-button class="button-block" (click)="register()">login</button>
      </ion-row>
    </ion-grid>
</ion-content>

 src/pages/tabs/home/home.html

@@ -1,12 +1,73 @@
<ion-header>

  <ion-navbar>
    <ion-title>home</ion-title>
    <ion-title>login</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
  <button ion-button (click)="go()">Login</button>
  <ion-grid>
    <ion-row>
      <ion-item>
        <ion-input type="number" max="1" placeholder="单行文本1"></ion-input>
      </ion-item>
    </ion-row>
    <ion-row>
      <ion-item>
        <ion-label fixed>单行文本2:</ion-label>
        <ion-input type="text" value=""></ion-input>
      </ion-item>
    </ion-row>
    <ion-row>
      <ion-label fixed>搜索:</ion-label>
      <ion-searchbar ></ion-searchbar>
    </ion-row>
    <ion-row>
      <ion-item>
        <ion-label>多选1</ion-label>
        <ion-checkbox color="dark" checked="true"></ion-checkbox>
      </ion-item>
      <ion-item>
        <ion-label>多选2</ion-label>
        <ion-checkbox ></ion-checkbox>
      </ion-item>
    </ion-row>
    <ion-row>
      <ion-item>
        <ion-label>时间</ion-label>
        <ion-datetime displayFormat="YYYY/MM/DD" ></ion-datetime>
      </ion-item>
    </ion-row>
    <ion-list>
    <button ion-item  (click)="go()">
      row1
    </button>
  </ion-list>



    <ion-item>
      <ion-label>下拉(多选)1</ion-label>
      <ion-select multiple="true" cancelText="Nah" okText="Okay!">
        <ion-option value="bacon" selected="true">Bacon</ion-option>
        <ion-option value="olives">Black Olives</ion-option>
        <ion-option value="xcheese" selected="true">Extra Cheese</ion-option>
        <ion-option value="peppers">Green Peppers</ion-option>
        <ion-option value="mushrooms">Mushrooms</ion-option>
        <ion-option value="onions">Onions</ion-option>
        <ion-option value="pepperoni">Pepperoni</ion-option>
        <ion-option value="pineapple">Pineapple</ion-option>
        <ion-option value="sausage">Sausage</ion-option>
        <ion-option value="Spinach">Spinach</ion-option>
      </ion-select>
    </ion-item>
    <ion-row>
      <ion-item>
        <ion-label>多行文本</ion-label>
        <ion-textarea autoresize="100"></ion-textarea>
      </ion-item>
    </ion-row>
  </ion-grid>
</ion-content>

 src/pages/tabs/home/home.ts

@@ -1,5 +1,6 @@
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
declare function eval(s: string): any;

@IonicPage({
  name: 'home'
@@ -13,6 +14,11 @@
  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }

  test() {
    let fun = "() => console.log('test');";
    eval(fun);
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad HomePage');
  }
@@ -20,4 +26,9 @@
  go() {
    this.navCtrl.push('access-login');
  }

  gotoInput() {
    this.navCtrl.push('access-input');
  }

}

 typings/cordova-typings.d.ts

New file
@@ -0,0 +1,3 @@

/// <reference path="..\.vscode\typings\cordova-ionic\plugins\keyboard.d.ts"/>
/// <reference path="..\.vscode\typings\jquery\jquery.d.ts"/>

 yarn.lock

New file
Diff too large