页面

app/app-detail.component.css

 .example-full-width {
     width: 100%;
 }
+md-select {
+    margin: 16px 0;
+}
\ No newline at end of file

app/app-detail.component.html

 <div *ngIf="app">
     <!--<h3 md-subheader>基本信息</h3>-->
     <form class="example-form">
+
+        <md-select placeholder="类别" [(ngModel)]="app.category" name="category" class="example-full-width">
+            <md-option *ngFor="let l of ['game','runtime','emulator','module']" [value]="l">{{l}}</md-option>
+        </md-select>
+
         <md-input-container class="example-full-width">
-            <input md-input name="id" placeholder="ID" disabled [(ngModel)]="app.id">
+            <input md-input name="tags" placeholder="标签" [(ngModel)]="tags">
+            <md-hint align="end">JSON string[]，不会写请联系 zh99998@gmail.com</md-hint>
         </md-input-container>
 
         <md-input-container class="example-full-width">
-            <input md-input name="name" placeholder="First name" [(ngModel)]="app.name['zh-CN']">
+            <input md-input name="tags" placeholder="开发者" [(ngModel)]="app.author">
         </md-input-container>
 
-        <p>
-            <md-input-container class="example-full-width">
-                <textarea md-input placeholder="Address">1600 Amphitheatre Pkwy</textarea>
-            </md-input-container>
-            <md-input-container class="example-full-width">
-                <textarea md-input placeholder="Address 2"></textarea>
-            </md-input-container>
-        </p>
+        <md-input-container class="example-full-width">
+            <input md-input name="tags" placeholder="网站" [(ngModel)]="app.homepage">
+            <md-hint align="end">以 http:// 或 https:// 开头，没有可留空</md-hint>
+        </md-input-container>
 
-        <table class="example-full-width" cellspacing="0">
-            <tr>
-                <td>
-                    <md-input-container class="example-full-width">
-                        <input md-input placeholder="City">
-                    </md-input-container>
-                </td>
-                <td>
-                    <md-input-container class="example-full-width">
-                        <input md-input placeholder="State">
-                    </md-input-container>
-                </td>
-                <td>
-                    <md-input-container class="example-full-width">
-                        <input md-input #postalCode maxlength="5" placeholder="Postal Code" value="94043">
-                        <md-hint align="end">{{postalCode.value.length}} / 5</md-hint>
-                    </md-input-container>
-                </td>
-            </tr>
-        </table>
+        <md-input-container class="example-full-width">
+            <input md-input name="tags" placeholder="聊天室" [(ngModel)]="app.conference">
+            <md-hint align="end">游戏类应用通常与 ID 相同，其他类型的应用留空</md-hint>
+        </md-input-container>
+
+        <md-input-container class="example-full-width">
+            <input md-input name="tags" placeholder="应用支持的语言" [(ngModel)]="locales">
+            <md-hint align="end">JSON string[]，不会写请联系 zh99998@gmail.com</md-hint>
+        </md-input-container>
 
         <button md-raised-button color="primary">提交</button>
     </form>

app/app-locales.component.html

 <!--<h3 md-subheader>语言</h3>-->
 
-<md-tab-group>
+<md-tab-group *ngIf="app">
     <md-tab *ngFor="let locale of locales" [label]="locale">
         <form class="example-form" style="margin-top:16px;">
             <md-input-container class="example-full-width">
@@ -8,7 +8,16 @@
             </md-input-container>
 
             <md-input-container class="example-full-width">
-                <textarea md-input name="description" placeholder="应用介绍" [(ngModel)]="app.description">1600 Amphitheatre Pkwy</textarea>
+                <textarea md-input name="description" placeholder="应用介绍"
+                          [(ngModel)]="app.description[locale]"></textarea>
+                <md-hint align="end">支持 Markdown 语法</md-hint>
+            </md-input-container>
+
+            <md-input-container class="example-full-width">
+                <textarea md-input name="news" placeholder="新闻" [(ngModel)]="news[locale]"></textarea>
+                <md-hint align="end">JSON &#123;title: string, url: string, image: string&#125;[]，不会写请联系
+                    zh99998@gmail.com
+                </md-hint>
             </md-input-container>
 
             <button md-raised-button color="primary">提交</button>

app/app-locales.component.ts

 import {Component, OnInit} from '@angular/core';
-import App from '../models/browserapp';
+import App, {I18n} from '../models/browserapp';
 import {AppService} from './app.service';
 import {ActivatedRoute, Params} from '@angular/router';
 import 'rxjs/Rx';
@@ -14,6 +14,7 @@ import {DomSanitizer} from '@angular/platform-browser';
 export class AppLocalesComponent implements OnInit {
     app: App;
     locales: string[];
+    news: I18n<string> = {};
 
     constructor(private appService: AppService, private route: ActivatedRoute, iconRegistry: MdIconRegistry, sanitizer: DomSanitizer) {
     }
@@ -23,7 +24,10 @@ export class AppLocalesComponent implements OnInit {
             .switchMap((params: Params) => this.appService.getApp(params['id']))
             .subscribe(app => {
                 this.app = app;
-                this.locales = Object.keys(this.app.name);
+                this.locales = Object.keys(app.name);
+                for (let [locale, news] of Object.entries(app.news)) {
+                    this.news[locale] = JSON.stringify(news);
+                }
             });
     }
 }

app/app-packages.component.html

-<h3 md-subheader>语言</h3>
+<md-tab-group *ngIf="app">
+    <md-tab *ngFor="let package of packages" [label]="package_description(package)">
+        <form class="example-form" style="margin-top:16px;">
+            <md-input-container class="example-full-width">
+                <input md-input name="name" placeholder="应用名称" [(ngModel)]="app.name[locale]">
+            </md-input-container>
+
+            <md-input-container class="example-full-width">
+                <textarea md-input name="description" placeholder="应用介绍"
+                          [(ngModel)]="app.description[locale]"></textarea>
+                <md-hint align="end">支持 Markdown 语法</md-hint>
+            </md-input-container>
+
+            <md-input-container class="example-full-width">
+                <textarea md-input name="news" placeholder="新闻" [(ngModel)]="news[locale]"></textarea>
+                <md-hint align="end">JSON &#123;title: string, url: string, image: string&#125;[]，不会写请联系
+                    zh99998@gmail.com
+                </md-hint>
+            </md-input-container>
+
+            <button md-raised-button color="primary">提交</button>
+        </form>
+    </md-tab>
+</md-tab-group>
+
 
 <md-tab-group>
     <md-tab *ngFor="let locale of locales" [label]="locale">

app/app-packages.component.ts

@@ -24,4 +24,8 @@ export class AppPackagesComponent implements OnInit {
                 this.app = app;
             });
     }
+
+    package_description(_package) {
+        _package.platform
+    }
 }

app/app.component.html

@@ -6,9 +6,9 @@
         </ul>
         <h3>编辑应用</h3>
         <ul>
-            <li><a md-list-item routerLink="detail">详情</a></li>
+            <li><a md-list-item routerLink="detail">基本信息</a></li>
             <li><a md-list-item routerLink="locales">语言</a></li>
-            <li><a md-list-item routerLink="packages">文件</a></li>
+            <li><a md-list-item routerLink="packages">文件包</a></li>
         </ul>
     </md-sidenav>
 

app/apps.component.html

 <md-nav-list>
     <h3 md-subheader>所有应用</h3>
     <md-list-item *ngFor="let app of apps" [routerLink]="app.id">
-        <img md-list-avatar src="https://mycard.moe/logo.png" alt="...">
+        <img md-list-avatar [src]="app.icon" alt="...">
         <h3 md-line> {{app.id}} </h3>
         <p md-line>
             <span> {{app.id}} </span>

app/apps.component.ts

@@ -17,7 +17,7 @@ export class AppsComponent implements OnInit {
     }
 
     async ngOnInit() {
-        console.log(await this.getApps());
+        await this.getApps();
     }
 
     async getApps() {
@@ -30,6 +30,5 @@ export class AppsComponent implements OnInit {
         if (!app) {
             return;
         }
-        console.log(app);
     }
 }

models/browserapp.ts

 /**
  * Created by zh99998 on 2017/1/4.
  */
-interface I18n<T> {
+export interface I18n<T> {
     [locale: string]: T;
 }
 class App {
     id: string;
     name: I18n<string>;
+    description: I18n<string> = {};
     parent?: string;
-    locales: string[];
-    news: I18n<{title: string, url: string, image: string}[]>;
+    locales: string[] = [];
+    news: I18n<{title: string, url: string, image: string}[]> = {};
     conference?: string;
     data: any;
     icon = 'http://www.immersion-3d.com/wp-content/uploads/2015/12/image-placeholder-500x500.jpg';