Finish the Install UI.

src/pages/install/widget/FinishPanel.tsx

@@ -31,6 +31,19 @@ export default class FinishPanel extends TankComponent<IProps, IState> {
     that.updateUI();
   }
 
+  finish() {
+
+    let that = this
+    let install: Install = this.props.install
+
+    install.httpFinish(function () {
+
+
+      window.location.href = "/"
+
+    })
+
+  }
 
   render() {
 
@@ -43,7 +56,7 @@ export default class FinishPanel extends TankComponent<IProps, IState> {
           title="安装信息配置完毕!"
           subTitle="点击下方按钮来完成安装过程并进入首页。"
           extra={[
-            <Button icon={<HomeOutlined/>} type="primary" key="home">
+            <Button icon={<HomeOutlined/>} type="primary" key="home" onClick={this.finish.bind(this)}>
               完成，并进入首页
             </Button>
           ]}

src/pages/install/widget/SetAdminPanel.tsx

@@ -56,12 +56,12 @@ export default class SetAdminPanel extends TankComponent<IProps, IState> {
     let that = this
     let install: Install = this.props.install
 
-    if (install.tableCreated()) {
+    if (install.adminConfigured) {
 
       this.props.onNextStep()
 
     } else {
-      MessageBoxUtil.error("请首先完成建表")
+      MessageBoxUtil.error("请首先完成管理员设置")
     }
 
   }
@@ -89,7 +89,7 @@ export default class SetAdminPanel extends TankComponent<IProps, IState> {
                                  that.phase = Phase.VERIFY
                                  that.updateUI()
                                }} onSelectCreate={() => {
-            that.phase = Phase.VERIFY
+            that.phase = Phase.CREATE
             that.updateUI()
           }} onPreStep={this.goToPrevious.bind(this)} onNextStep={this.goToNext.bind(this)}
           />
@@ -98,7 +98,6 @@ export default class SetAdminPanel extends TankComponent<IProps, IState> {
 
         {phase === Phase.VERIFY && (
           <PhaseVerifyPanel install={install} onSuccess={() => {
-            that.phase = Phase.SELECTING
 
             that.props.onNextStep()
 
@@ -110,7 +109,15 @@ export default class SetAdminPanel extends TankComponent<IProps, IState> {
         )}
 
         {phase === Phase.CREATE && (
-          <PhaseCreatePanel install={install}/>
+          <PhaseCreatePanel install={install} onSuccess={() => {
+
+            that.props.onNextStep()
+
+          }} onPreStep={() => {
+            that.phase = Phase.SELECTING
+            that.updateUI()
+
+          }}/>
         )}
 
       </div>

src/pages/install/widget/inner/PhaseCreatePanel.tsx

@@ -2,10 +2,17 @@ import React from 'react';
 import './PhaseCreatePanel.less';
 import TankComponent from "../../../../common/component/TankComponent";
 import Install from "../../../../common/model/install/Install";
+import MessageBoxUtil from "../../../../common/util/MessageBoxUtil";
+import {Button, Form, Input} from "antd";
+import {ArrowLeftOutlined, SendOutlined} from "@ant-design/icons/lib";
 
 interface IProps {
 
   install: Install
+
+  onSuccess: () => void
+  onPreStep: () => void
+
 }
 
 interface IState {
@@ -27,14 +34,110 @@ export default class PhaseCreatePanel extends TankComponent<IProps, IState> {
 
   }
 
+  onFinish(values: any) {
+    console.log('Success:', values);
+
+    let that = this;
+    let install: Install = this.props.install
+
+    install.adminUsername = values["adminUsername"]
+    install.adminPassword = values["adminPassword"]
+    install.adminRepassword = values["adminRepassword"]
+
+    install.httpCreateAdmin(function () {
+      MessageBoxUtil.success("管理员创建成功!")
+      that.props.onSuccess()
+    })
+  };
+
+  onFinishFailed(errorInfo: any) {
+    console.log('Failed:', errorInfo);
+  };
 
   render() {
 
     let that = this;
+    let install: Install = this.props.install
+
+    const layout = {
+      labelCol: {span: 6},
+      wrapperCol: {span: 18},
+    };
+
 
     return (
-      <div className="widget-phase-create-panel">
-        Phase 1
+      <div className="widget-phase-verify-panel">
+
+        <div className="text-center">
+          <h2>创建新管理员账户</h2>
+        </div>
+
+        <Form
+          {...layout}
+          name="basic"
+          onFinish={this.onFinish.bind(this)}
+          onFinishFailed={this.onFinishFailed.bind(this)}
+          onValuesChange={() => {
+            that.updateUI()
+          }}
+        >
+          <Form.Item
+            label="管理员用户名"
+            name="adminUsername"
+            rules={[{required: true, message: '请输入管理员用户名!'}]}
+          >
+            <Input/>
+          </Form.Item>
+
+          <Form.Item
+            label="管理员密码"
+            name="adminPassword"
+            rules={[{required: true, message: '请输入管理员密码!'}]}
+          >
+            <Input.Password/>
+          </Form.Item>
+
+
+          <Form.Item
+            name="adminRepassword"
+            label="确认密码"
+            dependencies={['adminPassword']}
+            hasFeedback
+            rules={[
+              {
+                required: true,
+                message: '请输入确认密码!',
+              },
+              ({getFieldValue}) => ({
+                validator(rule, value) {
+                  if (!value || getFieldValue('adminPassword') === value) {
+                    return Promise.resolve();
+                  }
+                  return Promise.reject('两次输入密码不匹配!');
+                },
+              }),
+            ]}
+          >
+            <Input.Password/>
+          </Form.Item>
+
+          <div className="text-right mt15">
+
+            <Button className={'ml10'} ghost={true} type="primary" icon={<ArrowLeftOutlined/>}
+                    onClick={this.props.onPreStep.bind(this)}>
+              上一步
+            </Button>
+
+            <Button className={'ml10'} type={"primary"}
+                    icon={<SendOutlined/>}
+                    htmlType="submit"
+            >
+              提交
+            </Button>
+
+          </div>
+        </Form>
+
       </div>
     );
   }

src/pages/install/widget/inner/PhaseVerifyPanel.tsx

@@ -71,6 +71,10 @@ export default class PhaseVerifyPanel extends TankComponent<IProps, IState> {
     return (
       <div className="widget-phase-verify-panel">
 
+        <div className="text-center">
+          <h2>验证管理员账户</h2>
+        </div>
+
         <Form
           {...layout}
           name="basic"
@@ -96,7 +100,6 @@ export default class PhaseVerifyPanel extends TankComponent<IProps, IState> {
             <Input.Password/>
           </Form.Item>
 
-
           <div className="text-right mt15">
 
             <Button className={'ml10'} ghost={true} type="primary" icon={<ArrowLeftOutlined/>}