From a1b27e510c4bdfe14b479b284ddbe090ac20cc5b Mon Sep 17 00:00:00 2001
From: xzyaoi <xiaozhe.yaoi@qq.com>
Date: Thu, 6 Dec 2018 14:21:47 +0800
Subject: [PATCH 1/8] [WIP] optimize for dashboard

---
 cli/daemon.go     | 34 ++++++++++++++++++++++++++++++++++
 cli/handler.go    | 15 ++++++++++-----
 cli/query.go      |  3 ++-
 cli/repository.go | 10 +++++++++-
 cli/utils.go      |  2 +-
 5 files changed, 56 insertions(+), 8 deletions(-)

diff --git a/cli/daemon.go b/cli/daemon.go
index 68d043605..5539354ee 100644
--- a/cli/daemon.go
+++ b/cli/daemon.go
@@ -20,6 +20,7 @@ const DaemonPort = "10590"
 
 // Definition of Running Repos
 var RunningRepos []Repository
+var RunningSolvers []RepoSolver
 var socketServer *socketio.Server
 
 // Struct of a Request to Run Repo
@@ -34,6 +35,10 @@ type RunRepoRequest struct {
 func PostRunningRepoHandler(c *gin.Context) {
 	var runRepoRequest RunRepoRequest
 	c.BindJSON(&runRepoRequest)
+	log.Println(runRepoRequest.Port)
+	if runRepoRequest.Port == "" {
+		runRepoRequest.Port = findNextOpenPort(8080)
+	}
 	go runRepo(runRepoRequest.Vendor, runRepoRequest.Name, runRepoRequest.Solver, runRepoRequest.Port)
 	c.JSON(http.StatusOK, gin.H{
 		"code": "success",
@@ -46,6 +51,23 @@ func GetRunningReposHandler(c *gin.Context) {
 	c.JSON(http.StatusOK, RunningRepos)
 }
 
+//
+func GetRunningSolversHandler(c *gin.Context) {
+	c.JSON(http.StatusOK, RunningSolvers)
+}
+
+func GetRunningSolversByPackageHandler(c *gin.Context) {
+	vendor := c.Param("vendor")
+	packageName := c.Param("package")
+	var runningSolversInPackage []RepoSolver
+	for _, runningSolver := range RunningSolvers {
+		if runningSolver.Vendor == vendor && runningSolver.Package == packageName {
+			runningSolversInPackage = append(runningSolversInPackage, runningSolver)
+		}
+	}
+	c.JSON(http.StatusOK, runningSolversInPackage)
+}
+
 // Handle Get Request -> Get All Repos
 func GetReposHandler(c *gin.Context) {
 	config := readConfig()
@@ -94,6 +116,11 @@ func BeforeResponse() gin.HandlerFunc {
 		c.Writer.Header().Set("cvpm-version", "0.0.3@alpha")
 		c.Writer.Header().Set("Access-Control-Allow-Origin", origin)
 		c.Writer.Header().Set("Access-Control-Allow-Credentials", "true")
+		c.Writer.Header().Set("Access-Control-Allow-Methods", "GET,POST,PUT,PATCH,DELETE,OPTIONS")
+		c.Writer.Header().Set("Access-Control-Allow-Headers", "authorization, origin, content-type, accept")
+		if c.Request.Method == "OPTIONS" {
+			c.Writer.WriteHeader(http.StatusOK)
+		}
 	}
 }
 
@@ -117,9 +144,16 @@ func runServer(port string) {
 			"daemon": "running",
 		})
 	})
+	// Repo Related Routes
 	r.GET("/repo/meta/:vendor/:name", GetRepoMetaHandler)
 	r.POST("/repo/running", PostRunningRepoHandler)
 	r.GET("/repos", GetReposHandler)
+	r.GET("/repos/running", GetRunningReposHandler)
+
+	// Solver Related Routers
+	r.GET("/solvers/running", GetRunningSolversHandler)
+	r.GET("/solvers/running/:vendor/:package", GetRunningSolversByPackageHandler)
+	// Socket Related Routes
 	r.GET("/socket.io/", socketHandler)
 	r.POST("/socket.io/", socketHandler)
 	r.Handle("WS", "/socket.io/", socketHandler)
diff --git a/cli/handler.go b/cli/handler.go
index 28c5b2698..8744b5a78 100644
--- a/cli/handler.go
+++ b/cli/handler.go
@@ -25,6 +25,12 @@ import (
 	"syscall"
 )
 
+// Run Repo Response Struct
+type RunRepoResponse struct {
+	Code string `json:code`
+	Port string `json:port`
+}
+
 // Handle User Login
 func LoginHandler(c *cli.Context) User {
 	reader := bufio.NewReader(os.Stdin)
@@ -100,10 +106,6 @@ func RepoHandler(c *cli.Context) {
 	case "run":
 		solverstring := c.Args().Get(1)
 		runningPort := c.Args().Get(2)
-		if (runningPort == "") {
-			runningPort = findNextOpenPort(8080)
-			color.Red("No Running Port specified! Server will listen on: " + runningPort)
-		}
 		runParams := strings.Split(solverstring, "/")
 		color.Cyan("Running " + runParams[0] + "/" + runParams[1] + "/" + runParams[2])
 		requestParams := map[string]string{
@@ -112,7 +114,10 @@ func RepoHandler(c *cli.Context) {
 			"solver": runParams[2],
 			"port":   runningPort,
 		}
-		ClientPost("repo/running", requestParams)
+		resp := ClientPost("repo/running", requestParams)
+		var respJson RunRepoResponse
+		log.Println(resp.JSON(respJson))
+		color.Red("No port is specified, solver will running on" + respJson.Port)
 	case "ps":
 		requestParams := map[string]string{}
 		ClientGet("repos", requestParams)
diff --git a/cli/query.go b/cli/query.go
index cc72a5155..656993c96 100644
--- a/cli/query.go
+++ b/cli/query.go
@@ -7,7 +7,7 @@ import (
 	"os/user"
 )
 
-func ClientPost(endpoint string, params map[string]string) {
+func ClientPost(endpoint string, params map[string]string) *grequests.Response {
 	url := "http://127.0.0.1:10590/" + endpoint
 	currentUser, err := user.Current()
 	if err != nil {
@@ -24,6 +24,7 @@ func ClientPost(endpoint string, params map[string]string) {
 	if resp.Ok != true {
 		log.Fatal("Bad Response from Daemon")
 	}
+	return resp
 }
 
 func ClientGet(endpoint string, params map[string]string) {
diff --git a/cli/repository.go b/cli/repository.go
index 679dc6fba..e56ad92f4 100644
--- a/cli/repository.go
+++ b/cli/repository.go
@@ -36,6 +36,13 @@ type solvers struct {
 	Solvers []solver
 }
 
+type RepoSolver struct {
+	Vendor     string
+	Package    string
+	SolverName string
+	Port       string
+}
+
 func readRepos() []Repository {
 	configs := readConfig()
 	repos := configs.Repositories
@@ -80,7 +87,8 @@ func runRepo(Vendor string, Name string, Solver string, Port string) {
 			for _, file := range files {
 				if file.Name() == "runner_"+Solver+".py" {
 					existed = true
-					RunningRepos = append(RunningRepos, existed_repo)
+					RunningRepos = append(RunningRepos, Repository{Vendor, Name, Solver, Port})
+					RunningSolvers = append(RunningSolvers, RepoSolver{Vendor: Vendor, Package: Name, SolverName: Solver, Port: Port})
 					runfileFullPath := filepath.Join(existed_repo.LocalFolder, file.Name())
 					python([]string{runfileFullPath, Port})
 				}
diff --git a/cli/utils.go b/cli/utils.go
index 090cf1389..0603deb4c 100644
--- a/cli/utils.go
+++ b/cli/utils.go
@@ -1,11 +1,11 @@
 package main
 
 import (
-	"strconv"
 	"net"
 	"os"
 	"os/user"
 	"path/filepath"
+	"strconv"
 	"time"
 )
 

From bba8a69e069c8b80b785c428aef4d1eaece4354b Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Thu, 6 Dec 2018 14:22:54 +0800
Subject: [PATCH 2/8] [WIP] optimze for dashboard

---
 dashboard/src/components/CVPM-Repo-Solver.vue | 158 ++++++++++++++++++
 dashboard/src/main.js                         |   2 +-
 dashboard/src/pages/Detail.vue                |  21 ++-
 dashboard/src/services/system.js              |  22 ++-
 4 files changed, 198 insertions(+), 5 deletions(-)
 create mode 100644 dashboard/src/components/CVPM-Repo-Solver.vue

diff --git a/dashboard/src/components/CVPM-Repo-Solver.vue b/dashboard/src/components/CVPM-Repo-Solver.vue
new file mode 100644
index 000000000..58e0c0402
--- /dev/null
+++ b/dashboard/src/components/CVPM-Repo-Solver.vue
@@ -0,0 +1,158 @@
+<template>
+  <v-card>
+    <v-card-title>
+      <h2>Solvers</h2>
+    </v-card-title>
+    <v-layout class="cvpm-solver-runner-selection">
+      <v-select v-model="selectedVendor" :items="vendor" label="Vendor"></v-select>
+      <v-select v-model="selectedPackage" :items="packageName" label="Package"></v-select>
+      <v-flex xs6>
+        <v-select
+          v-model="selectedSolver"
+          :items="configObject.solvers"
+          item-text="name"
+          label="Solver"
+        ></v-select>
+      </v-flex>
+    </v-layout>
+    <v-flex class="cvpm-solver-run-btn">
+      <v-btn @click="run()" color="indigo" outline>Run</v-btn>
+    </v-flex>
+    <v-expansion-panel>
+      <v-expansion-panel-content>
+        <div slot="header">Running</div>
+        <v-list>
+          <v-list-tile v-for="(solver, index) in runningSolvers" :key="index">
+            <v-list-tile-content>
+                {{solver.SolverName}}
+            </v-list-tile-content>
+            <v-list-tile-avatar>
+                {{solver.Port}}
+            </v-list-tile-avatar>
+          </v-list-tile>
+        </v-list>
+      </v-expansion-panel-content>
+    </v-expansion-panel>
+    <v-dialog persistent v-model="runningConfirmDialog" width="60%">
+      <v-card>
+        <v-card-title>
+          <span
+            class="headline"
+          >Running Solver {{selectedVendor}}/{{selectedPackage}}/{{selectedSolver}}</span>
+        </v-card-title>
+        <v-card-text>
+          <v-text-field
+            label="Running Port"
+            v-model="runningPort"
+            :rules="[rules.validPort]"
+            hint="Keep it empty if you want to run it on any one of open ports"
+          ></v-text-field>
+          <p v-if="responseRunningPort">This solver is running on {{responseRunningPort}}</p>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="indigo darken-1" flat @click="triggerDialog()" outline>Close</v-btn>
+          <v-btn
+            color="indigo darken-1"
+            @loading="isRequesting"
+            flat
+            @click="confirmedRun()"
+            outline
+          >Run!</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </v-card>
+</template>
+
+<script>
+import { systemService } from '@/services/system'
+import toml from 'toml'
+export default {
+  data () {
+    return {
+      selectedSolver: '',
+      selectedVendor: this.vendor[0],
+      selectedPackage: this.packageName[0],
+      runningConfirmDialog: false,
+      runningPort: '',
+      runningSolvers: [],
+      responseRunningPort: '',
+      isRequesting: false,
+      rules: {
+        validPort: value => {
+          if (value === '') {
+            return true
+          }
+          const pattern = /^\+?(0|[1-9]\d*)$/
+          if (pattern.test(value)) {
+            if (parseInt(value) > 1024 && parseInt(value) < 65535) {
+              return true
+            } else {
+              return 'Not a Valid Port Number (Must be a postive integer larger than 1024 and less than 65535)'
+            }
+          } else {
+            return 'Not a Valid Port Number (Only numeric value is accepted)'
+          }
+        }
+      }
+    }
+  },
+  props: ['config', 'vendor', 'packageName'],
+  computed: {
+    configObject () {
+      return toml.parse(this.config)
+    }
+  },
+  methods: {
+    fetchRunningSolver () {
+      let self = this
+      systemService
+        .getRunningSolver(this.vendor, this.packageName)
+        .then(function (res) {
+          self.runningSolvers = res.data
+          console.log(self.runningSolvers)
+        })
+    },
+    triggerDialog () {
+      this.runningConfirmDialog = !this.runningConfirmDialog
+    },
+    run () {
+      if (this.selectedSolver === '') {
+        alert('no solver specified')
+      } else {
+        this.triggerDialog()
+      }
+    },
+    confirmedRun () {
+      this.isRequesting = true
+      let self = this
+      systemService
+        .runRepoSolver(
+          this.selectedVendor,
+          this.selectedPackage,
+          this.selectedSolver,
+          this.runningPort
+        )
+        .then(function (res) {
+          self.isRequesting = false
+          self.responseRunningPort = res.data.port
+        })
+    }
+  },
+  created () {
+    this.fetchRunningSolver()
+  }
+}
+</script>
+
+<style scoped>
+.cvpm-solver-runner-selection {
+  margin-left: auto;
+  margin-right: auto;
+  width: 95%;
+}
+.cvpm-solver-run-btn {
+  margin-right: 10%;
+}
+</style>
diff --git a/dashboard/src/main.js b/dashboard/src/main.js
index bbc304051..6f82d015d 100644
--- a/dashboard/src/main.js
+++ b/dashboard/src/main.js
@@ -5,7 +5,7 @@ import App from './App'
 import router from './router'
 import Vuetify from 'vuetify'
 import VueSocketIO from 'vue-socket.io'
-import TreeView from "vue-json-tree-view"
+import TreeView from 'vue-json-tree-view'
 
 import 'vuetify/dist/vuetify.min.css'
 import '@/assets/styles/main.css'
diff --git a/dashboard/src/pages/Detail.vue b/dashboard/src/pages/Detail.vue
index 5a253c60d..65e04a683 100644
--- a/dashboard/src/pages/Detail.vue
+++ b/dashboard/src/pages/Detail.vue
@@ -12,14 +12,22 @@
       <v-flex xs5 class="cvpm-package-detail-card">
         <cvpm-log :title="'Package Log'" :messageList="messageList"></cvpm-log>
       </v-flex>
+      <v-flex xs6 class="cvpm-package-detail-card">
+          <cvpm-repo-solver
+            :config="config"
+            :vendor="toSelectVendor"
+            :packageName="toSelectPackage"
+          ></cvpm-repo-solver>
+      </v-flex>
     </v-layout>
   </v-container>
 </template>
 
 <script>
 import cvpmRepoMeta from '@/components/CVPM-Repo-Meta'
-import { systemService } from '@/services/system'
 import Log from '@/components/CVPM-Log'
+import cvpmRepoSolver from '@/components/CVPM-Repo-Solver'
+import { systemService } from '@/services/system'
 
 export default {
   data () {
@@ -33,7 +41,8 @@ export default {
   },
   components: {
     'cvpm-repo-meta': cvpmRepoMeta,
-    'cvpm-log': Log
+    'cvpm-log': Log,
+    'cvpm-repo-solver': cvpmRepoSolver
   },
   methods: {
     fetchMeta () {
@@ -55,6 +64,14 @@ export default {
     package: function (data) {
       this.messageList.push(data)
     }
+  },
+  computed: {
+    toSelectVendor () {
+      return [this.$route.params.vendor]
+    },
+    toSelectPackage () {
+      return [this.$route.params.name]
+    }
   }
 }
 </script>
diff --git a/dashboard/src/services/system.js b/dashboard/src/services/system.js
index d00cb353c..7d661a6ef 100644
--- a/dashboard/src/services/system.js
+++ b/dashboard/src/services/system.js
@@ -35,9 +35,27 @@ class SystemService {
       })
     })
   }
-  runRepoSolver (vendor, name, solver) {
+  getRunningSolver (vendor, name) {
     return new Promise((resolve, reject) => {
-      axios.post(this.endpoint + '/repo/running')
+      axios.get(this.endpoint + '/solvers/running/' + vendor + '/' + name).then(function (res) {
+        resolve(res)
+      }).catch(function (err) {
+        reject(err)
+      })
+    })
+  }
+  runRepoSolver (vendor, name, solver, port) {
+    return new Promise((resolve, reject) => {
+      axios.post(this.endpoint + '/repo/running', {
+        'vendor': vendor,
+        'name': name,
+        'solver': solver,
+        'port': port
+      }).then(function (res) {
+        resolve(res)
+      }).catch(function (err) {
+        reject(err)
+      })
     })
   }
 }

From e1fc541f473600b6fe73956c47504046464172ea Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Fri, 7 Dec 2018 21:50:16 +0800
Subject: [PATCH 3/8] [WIP] Dashboard

---
 Pipfile                                       |  3 +-
 cvpm/server.py                                |  5 +
 dashboard/package.json                        |  2 +-
 dashboard/src/components/CVPM-Actions.vue     | 45 +++++++++
 dashboard/src/components/CVPM-Git-Import.vue  |  6 +-
 dashboard/src/components/CVPM-Repo-Solver.vue | 35 ++++---
 dashboard/src/components/CVPM-Request.vue     | 93 ++++++++++++++++++-
 dashboard/src/components/CVPM-Status.vue      |  1 -
 dashboard/src/components/CVPM-Table.vue       |  1 -
 .../components/basic/CVPM-Image-Upload.vue    | 44 +++++++++
 .../src/components/basic/CVPM-JSON-View.vue   | 18 ++++
 .../components/basic/CVPM-Parameter-Input.vue | 93 +++++++++++++++++++
 .../basic/CVPM-Solver-Selection.vue           | 60 ++++++++++++
 dashboard/src/i18n/config.js                  |  1 -
 dashboard/src/main.js                         |  2 +-
 dashboard/src/pages/Demo.vue                  |  0
 dashboard/src/pages/Detail.vue                | 17 +++-
 dashboard/src/services/config.js              |  1 -
 dashboard/src/services/system.js              | 17 ++++
 dashboard/yarn.lock                           |  7 +-
 setup.py                                      | 15 ++-
 21 files changed, 423 insertions(+), 43 deletions(-)
 create mode 100644 dashboard/src/components/CVPM-Actions.vue
 create mode 100644 dashboard/src/components/basic/CVPM-Image-Upload.vue
 create mode 100644 dashboard/src/components/basic/CVPM-JSON-View.vue
 create mode 100644 dashboard/src/components/basic/CVPM-Parameter-Input.vue
 create mode 100644 dashboard/src/components/basic/CVPM-Solver-Selection.vue
 delete mode 100644 dashboard/src/pages/Demo.vue

diff --git a/Pipfile b/Pipfile
index 08d9331da..669afe215 100644
--- a/Pipfile
+++ b/Pipfile
@@ -13,11 +13,10 @@ toml = "*"
 requests = "*"
 pillow = "*"
 numpy = "*"
-autoflake = "*"
 isort = "*"
 yapf = "*"
 gevent = "*"
-
+flask-cors="*"
 
 [requires]
 
diff --git a/cvpm/server.py b/cvpm/server.py
index 7c4d979f8..a68c55c50 100644
--- a/cvpm/server.py
+++ b/cvpm/server.py
@@ -8,9 +8,14 @@
 from werkzeug.datastructures import ImmutableMultiDict
 from werkzeug.utils import secure_filename
 
+# extensions
+from flask_cors import CORS
+
 logger = logging.getLogger()
 logger.setLevel("INFO")
+
 server = Flask(__name__)
+CORS(server)
 
 ALLOWED_EXTENSIONS_TRAIN = set(['zip'])
 ALLOWED_EXTENSIONS_INFER = set(['jpg', 'jpeg', 'png'])
diff --git a/dashboard/package.json b/dashboard/package.json
index 3d6e59d1f..a3e8918b0 100644
--- a/dashboard/package.json
+++ b/dashboard/package.json
@@ -23,7 +23,7 @@
     "vue-markdown": "2.2.4",
     "vue-router": "3.0.2",
     "vue-socket.io": "3.0.4",
-    "vuetify": "1.3.11"
+    "vuetify": "^1.3.12"
   },
   "devDependencies": {
     "autoprefixer": "7.2.6",
diff --git a/dashboard/src/components/CVPM-Actions.vue b/dashboard/src/components/CVPM-Actions.vue
new file mode 100644
index 000000000..6936ccf35
--- /dev/null
+++ b/dashboard/src/components/CVPM-Actions.vue
@@ -0,0 +1,45 @@
+<template>
+  <v-card>
+    <v-card-title>
+      <h2>Actions</h2>
+    </v-card-title>
+    <v-card-actions>
+      <v-btn color="indigo darken-1" outline @click="triggerDialog('test')">Test</v-btn>
+    </v-card-actions>
+    <v-dialog v-model="enableTest">
+      <cvpm-request 
+        v-if="enableTest" 
+        v-on:closeDialog="triggerDialog('test')"
+        :config="config"
+        :vendor="vendor"
+        :packageName="packageName"
+        ></cvpm-request>
+    </v-dialog>
+  </v-card>
+</template>
+
+<script>
+import cvpmRequest from '@/components/CVPM-Request'
+export default {
+  data () {
+    return {
+      enableTest: false
+    }
+  },
+  methods: {
+    triggerDialog (name) {
+      if (name === 'test') {
+        this.enableTest = !this.enableTest
+      } else {
+      }
+    }
+  },
+  components: {
+    'cvpm-request': cvpmRequest
+  },
+  props: ['config', 'vendor', 'packageName']
+}
+</script>
+
+<style>
+</style>
diff --git a/dashboard/src/components/CVPM-Git-Import.vue b/dashboard/src/components/CVPM-Git-Import.vue
index 851f44286..db3e46db0 100644
--- a/dashboard/src/components/CVPM-Git-Import.vue
+++ b/dashboard/src/components/CVPM-Git-Import.vue
@@ -42,9 +42,9 @@
     </v-expansion-panel>
     <v-card-actions>
       <v-spacer></v-spacer>
-      <v-btn color="indigo darken-1" flat @click="closeDialog()">Close</v-btn>
-      <v-btn color="indigo darken-1" flat @click="fetchMeta()">Fetch Meta</v-btn>
-      <v-btn color="indigo darken-1" flat @click="save()">Install</v-btn>
+      <v-btn color="indigo darken-1" outline @click="closeDialog()">Close</v-btn>
+      <v-btn color="indigo darken-1" outline @click="fetchMeta()">Fetch Meta</v-btn>
+      <v-btn color="indigo darken-1" outline @click="save()">Install</v-btn>
     </v-card-actions>
   </v-card>
 </template>
diff --git a/dashboard/src/components/CVPM-Repo-Solver.vue b/dashboard/src/components/CVPM-Repo-Solver.vue
index 58e0c0402..27a43e431 100644
--- a/dashboard/src/components/CVPM-Repo-Solver.vue
+++ b/dashboard/src/components/CVPM-Repo-Solver.vue
@@ -3,18 +3,13 @@
     <v-card-title>
       <h2>Solvers</h2>
     </v-card-title>
-    <v-layout class="cvpm-solver-runner-selection">
-      <v-select v-model="selectedVendor" :items="vendor" label="Vendor"></v-select>
-      <v-select v-model="selectedPackage" :items="packageName" label="Package"></v-select>
-      <v-flex xs6>
-        <v-select
-          v-model="selectedSolver"
-          :items="configObject.solvers"
-          item-text="name"
-          label="Solver"
-        ></v-select>
-      </v-flex>
-    </v-layout>
+    <cvpm-solver-selection 
+        :config=config
+        :vendor=vendor
+        :packageName=packageName
+        v-on:finishSelection="onFinishSelection"
+    >
+    </cvpm-solver-selection>
     <v-flex class="cvpm-solver-run-btn">
       <v-btn @click="run()" color="indigo" outline>Run</v-btn>
     </v-flex>
@@ -67,7 +62,7 @@
 
 <script>
 import { systemService } from '@/services/system'
-import toml from 'toml'
+import cvpmSolverSelection from '@/components/basic/CVPM-Solver-Selection'
 export default {
   data () {
     return {
@@ -98,12 +93,10 @@ export default {
       }
     }
   },
-  props: ['config', 'vendor', 'packageName'],
-  computed: {
-    configObject () {
-      return toml.parse(this.config)
-    }
+  components: {
+    'cvpm-solver-selection': cvpmSolverSelection
   },
+  props: ['config', 'vendor', 'packageName'],
   methods: {
     fetchRunningSolver () {
       let self = this
@@ -111,9 +104,13 @@ export default {
         .getRunningSolver(this.vendor, this.packageName)
         .then(function (res) {
           self.runningSolvers = res.data
-          console.log(self.runningSolvers)
         })
     },
+    onFinishSelection (value) {
+      this.selectedSolver = value.selectedSolver
+      this.selectedVendor = value.selectedVendor
+      this.selectedPackage = value.selectedPackage
+    },
     triggerDialog () {
       this.runningConfirmDialog = !this.runningConfirmDialog
     },
diff --git a/dashboard/src/components/CVPM-Request.vue b/dashboard/src/components/CVPM-Request.vue
index 6123db2c6..bffcf1621 100644
--- a/dashboard/src/components/CVPM-Request.vue
+++ b/dashboard/src/components/CVPM-Request.vue
@@ -1,13 +1,98 @@
 <template>
-    
+  <v-card>
+    <v-card-title>
+      <h2>Test</h2>
+    </v-card-title>
+    <cvpm-solver-selection
+      :config="config"
+      :vendor="vendor"
+      :packageName="packageName"
+      v-on:finishSelection="onFinishSelection"
+    ></cvpm-solver-selection>
+    <v-card class="cvpm-test-steps">
+      <v-stepper v-model="step">
+        <v-stepper-header>
+          <v-stepper-step :complete="step > 1" step="1">Choose Image</v-stepper-step>
+          <v-divider></v-divider>
+          <v-stepper-step :complete="step > 2" step="2">Complete Parameters</v-stepper-step>
+          <v-divider></v-divider>
+          <v-stepper-step step="3">Check Results</v-stepper-step>
+        </v-stepper-header>
+
+        <v-stepper-items class="cvpm-test-content">
+          <v-stepper-content step="1">
+            <cvpm-image-upload v-on:fileSelected="onFileSelected"></cvpm-image-upload>
+          </v-stepper-content>
+          <v-stepper-content step="2">
+            <cvpm-parameter-input :file=file v-on:finishInfer="onFinishInfer"></cvpm-parameter-input>
+          </v-stepper-content>
+          <v-stepper-content step="3">
+            <cvpm-json-view :jsonObject="inferResponse"></cvpm-json-view>
+          </v-stepper-content>
+        </v-stepper-items>
+
+      </v-stepper>
+    </v-card>
+    <v-card-actions>
+      <v-spacer></v-spacer>
+      <v-btn color="indigo darken-1" outline @click="closeDialog()">Close</v-btn>
+    </v-card-actions>
+  </v-card>
 </template>
 
 <script>
+import cvpmSolverSelection from '@/components/basic/CVPM-Solver-Selection'
+import cvpmImageUpload from '@/components/basic/CVPM-Image-Upload'
+import cvpmParameterInput from '@/components/basic/CVPM-Parameter-Input'
+import cvpmJSONView from '@/components/basic/CVPM-JSON-View'
 export default {
-
+  data () {
+    return {
+      selectedPackage: '',
+      selectedVendor: '',
+      selectedSolver: '',
+      step: 1,
+      file: null,
+      inferResponse: {}
+    }
+  },
+  methods: {
+    closeDialog () {
+      this.$emit('closeDialog', true)
+    },
+    onFinishSelection (value) {
+      this.selectedSolver = value.selectedSolver
+      this.selectedVendor = value.selectedVendor
+      this.selectedPackage = value.selectedPackage
+    },
+    onFileSelected (value) {
+      this.step = 2
+      this.file = value
+    },
+    onFinishInfer (value) {
+      this.inferResponse = value.data
+      this.step = 3
+    }
+  },
+  components: {
+    'cvpm-solver-selection': cvpmSolverSelection,
+    'cvpm-image-upload': cvpmImageUpload,
+    'cvpm-parameter-input': cvpmParameterInput,
+    'cvpm-json-view': cvpmJSONView
+  },
+  props: ['config', 'vendor', 'packageName']
 }
 </script>
 
-<style>
-
+<style scoped>
+.cvpm-test-content {
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+}
+.cvpm-test-steps {
+  width: 95%;
+  margin-left: auto;
+  margin-right: auto;
+}
 </style>
diff --git a/dashboard/src/components/CVPM-Status.vue b/dashboard/src/components/CVPM-Status.vue
index 8eed4826c..82e30f8d5 100644
--- a/dashboard/src/components/CVPM-Status.vue
+++ b/dashboard/src/components/CVPM-Status.vue
@@ -20,7 +20,6 @@ export default {
   methods: {
     getStatus () {
       this.status = systemService.getStatus()
-      console.log(this.status)
     }
   },
   created () {
diff --git a/dashboard/src/components/CVPM-Table.vue b/dashboard/src/components/CVPM-Table.vue
index 2b00bda77..7576c797d 100644
--- a/dashboard/src/components/CVPM-Table.vue
+++ b/dashboard/src/components/CVPM-Table.vue
@@ -38,7 +38,6 @@ export default {
     }
   },
   created () {
-    console.log(this.items)
   }
 }
 </script>
diff --git a/dashboard/src/components/basic/CVPM-Image-Upload.vue b/dashboard/src/components/basic/CVPM-Image-Upload.vue
new file mode 100644
index 000000000..975fd0708
--- /dev/null
+++ b/dashboard/src/components/basic/CVPM-Image-Upload.vue
@@ -0,0 +1,44 @@
+<template>
+  <div>
+    <v-btn color="indigo darken-1" outline @click="selectFile()">
+      <v-icon>camera_alt</v-icon>Upload
+    </v-btn>
+    <input
+      id="files"
+      type="file"
+      name="file"
+      ref="uploadInput"
+      accept="image/*"
+      :multiple="false"
+      @change="uploadFile($event)"
+    >
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    data () {
+      return {
+      }
+    },
+    selectFile () {
+      this.$refs.uploadInput.click()
+    },
+    uploadFile (e) {
+      let files = e.target.files
+      if (files.length) {
+        this.$emit('fileSelected', files[0])
+      } else {
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+input[type="file"] {
+  position: absolute;
+  clip: rect(0, 0, 0, 0);
+}
+</style>
diff --git a/dashboard/src/components/basic/CVPM-JSON-View.vue b/dashboard/src/components/basic/CVPM-JSON-View.vue
new file mode 100644
index 000000000..2e26463c1
--- /dev/null
+++ b/dashboard/src/components/basic/CVPM-JSON-View.vue
@@ -0,0 +1,18 @@
+<template>
+    <div>
+        <tree-view :data="jsonObject"></tree-view>
+    </div>
+</template>
+
+<script>
+export default {
+  props: ['jsonObject'],
+  created () {
+    console.log(this.jsonObject)
+  }
+}
+</script>
+
+<style>
+
+</style>
diff --git a/dashboard/src/components/basic/CVPM-Parameter-Input.vue b/dashboard/src/components/basic/CVPM-Parameter-Input.vue
new file mode 100644
index 000000000..1e28ad5ce
--- /dev/null
+++ b/dashboard/src/components/basic/CVPM-Parameter-Input.vue
@@ -0,0 +1,93 @@
+<template>
+  <div>
+    <h4>Paramters required by CVPM</h4>
+    <v-text-field
+      v-if="typeof(item.value) === 'string'"
+      v-for="(item, index) in systemRequiredParams"
+      :key="index"
+      :label="item.key"
+      required
+      v-model="item.value"
+      :hint="item.hint"
+    ></v-text-field>
+    <v-checkbox
+      v-for="(item, index) in systemRequiredParams"
+      :key="index"
+      v-if="typeof(item.value) === 'boolean'"
+      :label="item.key"
+      v-model="item.value"
+      :hint="item.hint"
+    ></v-checkbox>
+    <v-divider></v-divider>
+    <h4>Parameters required by Solver</h4>
+    <v-btn color="indigo darken-1" outline @click="addParams()">
+      <v-icon>add</v-icon>
+    </v-btn>
+    <v-layout>
+      <v-flex xs6>
+        <v-text-field
+          v-for="(item, index) in solverDefinedParams"
+          :key="index"
+          label="Key"
+          v-model="item.key"
+          hint
+        ></v-text-field>
+      </v-flex>
+      <v-flex xs6>
+        <v-text-field
+          v-for="(item, index) in solverDefinedParams"
+          :key="index"
+          label="Value"
+          v-model="item.value"
+          hint
+        ></v-text-field>
+      </v-flex>
+    </v-layout>
+    <v-btn color="indigo darken-1" outline @click="startTest()" :loading="loading">Start!</v-btn>
+  </div>
+</template>
+
+<script>
+import { systemService } from '@/services/system'
+export default {
+  data () {
+    return {
+      loading: false,
+      systemRequiredParams: [
+        {
+          key: 'delete_after_process',
+          value: true,
+          hint: 'Should the service delete the image after process?'
+        }
+      ],
+      solverDefinedParams: []
+    }
+  },
+  props: ['file'],
+  methods: {
+    addParams () {
+      this.solverDefinedParams.push({
+        key: '',
+        value: ''
+      })
+    },
+    startTest () {
+      let self = this
+      self.loading = true
+      const requestParams = this.systemRequiredParams.concat(this.solverDefinedParams)
+      systemService
+        .testRepoSolver('8080', requestParams, this.file)
+        .then(function (res) {
+          self.loading = false
+          self.$emit('finishInfer', res)
+        })
+        .catch(function (err) {
+          alert('an error occured' + err)
+        })
+    }
+  }
+}
+</script>
+
+<style>
+</style>
diff --git a/dashboard/src/components/basic/CVPM-Solver-Selection.vue b/dashboard/src/components/basic/CVPM-Solver-Selection.vue
new file mode 100644
index 000000000..711ebc277
--- /dev/null
+++ b/dashboard/src/components/basic/CVPM-Solver-Selection.vue
@@ -0,0 +1,60 @@
+<template>
+  <v-layout class="cvpm-solver-runner-selection">
+    <v-select v-model="selectedVendor" :items="vendor" label="Vendor"></v-select>
+    <v-select v-model="selectedPackage" :items="packageName" label="Package"></v-select>
+    <v-flex xs6>
+      <v-select
+        v-model="selectedSolver"
+        :items="config.solvers"
+        item-text="name"
+        label="Solver"
+      ></v-select>
+    </v-flex>
+  </v-layout>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      selectedVendor: this.vendor[0],
+      selectedPackage: this.packageName[0],
+      selectedSolver: ''
+    }
+  },
+  props: ['config', 'vendor', 'packageName'],
+  watch: {
+    hasFinishSelection: function (val) {
+      if (val) {
+        this.finishSelection()
+      }
+    }
+  },
+  computed: {
+    hasFinishSelection () {
+      if (this.selectedVendor && this.selectedPackage && this.selectedSolver) {
+        return true
+      } else {
+        return false
+      }
+    }
+  },
+  methods: {
+    finishSelection () {
+      this.$emit('finishSelection', {
+        selectedVendor: this.selectedVendor,
+        selectedPackage: this.selectedPackage,
+        selectedSolver: this.selectedSolver
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.cvpm-solver-runner-selection {
+  margin-left: auto;
+  margin-right: auto;
+  width: 95%;
+}
+</style>
diff --git a/dashboard/src/i18n/config.js b/dashboard/src/i18n/config.js
index 7ae3894fa..23201f1d4 100644
--- a/dashboard/src/i18n/config.js
+++ b/dashboard/src/i18n/config.js
@@ -3,7 +3,6 @@ import map from '@/i18n/map'
 
 function setLang (lang) {
   localStorage.setItem('lang', lang)
-  console.log(map[lang])
   i18n.locale = map[lang]
 }
 
diff --git a/dashboard/src/main.js b/dashboard/src/main.js
index 6f82d015d..9459202fe 100644
--- a/dashboard/src/main.js
+++ b/dashboard/src/main.js
@@ -13,7 +13,7 @@ import '@/assets/styles/main.css'
 import i18n from '@/i18n'
 
 Vue.use(new VueSocketIO({
-  debug: true,
+  debug: false,
   connection: 'http://192.168.1.11:10590'
 }))
 Vue.use(Vuetify)
diff --git a/dashboard/src/pages/Demo.vue b/dashboard/src/pages/Demo.vue
deleted file mode 100644
index e69de29bb..000000000
diff --git a/dashboard/src/pages/Detail.vue b/dashboard/src/pages/Detail.vue
index 65e04a683..07ffa9acd 100644
--- a/dashboard/src/pages/Detail.vue
+++ b/dashboard/src/pages/Detail.vue
@@ -14,11 +14,18 @@
       </v-flex>
       <v-flex xs6 class="cvpm-package-detail-card">
           <cvpm-repo-solver
-            :config="config"
+            :config="parsedConfig"
             :vendor="toSelectVendor"
             :packageName="toSelectPackage"
           ></cvpm-repo-solver>
       </v-flex>
+      <v-flex xs6 class="cvpm-package-detail-card">
+          <cvpm-actions 
+            :config="parsedConfig"
+            :vendor="toSelectVendor"
+            :packageName="toSelectPackage"
+          ></cvpm-actions>
+      </v-flex>
     </v-layout>
   </v-container>
 </template>
@@ -27,13 +34,15 @@
 import cvpmRepoMeta from '@/components/CVPM-Repo-Meta'
 import Log from '@/components/CVPM-Log'
 import cvpmRepoSolver from '@/components/CVPM-Repo-Solver'
+import cvpmActions from '@/components/CVPM-Actions'
 import { systemService } from '@/services/system'
-
+import toml from 'toml'
 export default {
   data () {
     return {
       readme: '',
       config: '',
+      parsedConfig: '',
       diskSize: '',
       dependency: '',
       messageList: []
@@ -42,7 +51,8 @@ export default {
   components: {
     'cvpm-repo-meta': cvpmRepoMeta,
     'cvpm-log': Log,
-    'cvpm-repo-solver': cvpmRepoSolver
+    'cvpm-repo-solver': cvpmRepoSolver,
+    'cvpmActions': cvpmActions
   },
   methods: {
     fetchMeta () {
@@ -52,6 +62,7 @@ export default {
         .then(function (res) {
           self.readme = res.data.Readme
           self.config = res.data.Config
+          self.parsedConfig = toml.parse(res.data.Config)
           self.diskSize = res.data.DiskSize.toFixed(2)
           self.dependency = res.data.Dependency
         })
diff --git a/dashboard/src/services/config.js b/dashboard/src/services/config.js
index 6ef595dd3..374d3703a 100644
--- a/dashboard/src/services/config.js
+++ b/dashboard/src/services/config.js
@@ -10,7 +10,6 @@ class ConfigService {
       this.endpoint = persistConfig['endpoint']
       this.developerMode = persistConfig['developerMode']
     }
-    console.log(this.endpoint)
   }
   loadDefault () {
     this.endpoint = 'http://127.0.0.1:10590'
diff --git a/dashboard/src/services/system.js b/dashboard/src/services/system.js
index 7d661a6ef..239231440 100644
--- a/dashboard/src/services/system.js
+++ b/dashboard/src/services/system.js
@@ -58,6 +58,23 @@ class SystemService {
       })
     })
   }
+  testRepoSolver (port, parameters, file) {
+    return new Promise((resolve, reject) => {
+      let payload = new FormData()
+      payload.append('file', file)
+      for (let i = 0; i < parameters.length; i++) {
+        payload.append(parameters[i].key, parameters[i].value)
+      }
+      var parser = document.createElement('a')
+      parser.href = this.endpoint
+      parser.port = port
+      axios.post(parser.href + '/infer', payload).then(function (res) {
+        resolve(res)
+      }).catch(function (err) {
+        reject(err)
+      })
+    })
+  }
 }
 
 const configService = new ConfigService()
diff --git a/dashboard/yarn.lock b/dashboard/yarn.lock
index 1bd960547..e3e44ba55 100644
--- a/dashboard/yarn.lock
+++ b/dashboard/yarn.lock
@@ -7766,9 +7766,10 @@ vue@2.5.17, vue@^2.5.16:
   version "2.5.17"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.5.17.tgz#0f8789ad718be68ca1872629832ed533589c6ada"
 
-vuetify@1.3.11:
-  version "1.3.11"
-  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-1.3.11.tgz#8be51f752a821704bb7fe0b7ac1f9324b902e52a"
+vuetify@^1.3.12:
+  version "1.3.12"
+  resolved "http://registry.npm.taobao.org/vuetify/download/vuetify-1.3.12.tgz#a605a978e88385ace60301fc50502fe53ae940fb"
+  integrity sha1-pgWpeOiDhazmAwH8UFAv5TrpQPs=
 
 walker@~1.0.5:
   version "1.0.7"
diff --git a/setup.py b/setup.py
index 8002c55c9..44805053e 100644
--- a/setup.py
+++ b/setup.py
@@ -1,11 +1,11 @@
 import setuptools
 
-with open("docs/README.md", "r") as fh:
+with open("README.md", "r") as fh:
     long_description = fh.read()
 
 setuptools.setup(
     name="cvpm",
-    version="0.0.2",
+    version="0.0.3.1",
     author="Xiaozhe Yao",
     author_email="xiaozhe.yaoi@gmail.com",
     description="Computer Vision Package Manager",
@@ -23,7 +23,16 @@
         "Intended Audience :: Science/Research",
         "Topic :: Scientific/Engineering",
         "Topic :: Scientific/Engineering :: Image Recognition",
-        "Topic :: Scientific/Engineering :: Computer Vision",
         "Topic :: Software Development",
     ],
+    install_requires=[
+        "flask",
+        "tqdm",
+        "toml",
+        "requests",
+        "pillow",
+        "numpy",
+        "gevent",
+        "flask-cors",
+    ],
 )
\ No newline at end of file

From d84e4179273590964a1c3591c6d53e414e344e94 Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Fri, 7 Dec 2018 21:56:04 +0800
Subject: [PATCH 4/8] add a 'coming soon' in import from hub

---
 dashboard/src/pages/Package.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/dashboard/src/pages/Package.vue b/dashboard/src/pages/Package.vue
index a5e0875c4..82d56b009 100644
--- a/dashboard/src/pages/Package.vue
+++ b/dashboard/src/pages/Package.vue
@@ -5,7 +5,7 @@
       <v-btn outline color="indigo" @click="trigger_git_import">
         <v-icon left dark>add</v-icon>Import from Git
       </v-btn>
-      <v-btn outline color="indigo">
+      <v-btn outline color="indigo" @click="trigger_hub_import">
         <v-icon left dark>device_hub</v-icon>Import fron Hub
       </v-btn>
       </v-flex>
@@ -60,6 +60,9 @@ export default {
     trigger_git_import () {
       this.gitImport = !this.gitImport
     },
+    trigger_hub_import () {
+      alert('coming soon')
+    },
     fetch_packages () {
       let self = this
       systemService.getPackages().then(function (res) {

From f947aeb4e7ef4522586fbc74f461894ff72e87ba Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Sat, 8 Dec 2018 19:22:34 +0800
Subject: [PATCH 5/8] add publish prod command in Makefile

---
 Makefile | 3 +++
 setup.py | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/Makefile b/Makefile
index 162c5aa6c..2a9632f06 100644
--- a/Makefile
+++ b/Makefile
@@ -32,4 +32,7 @@ clean:
 publish-test:
 	twine upload --repository-url https://test.pypi.org/legacy/ dist/*
 
+publish-prod:
+	twine upload dist/*
+
 .PHONY: docs
\ No newline at end of file
diff --git a/setup.py b/setup.py
index 44805053e..fd9437735 100644
--- a/setup.py
+++ b/setup.py
@@ -5,7 +5,7 @@
 
 setuptools.setup(
     name="cvpm",
-    version="0.0.3.1",
+    version="0.0.1",
     author="Xiaozhe Yao",
     author_email="xiaozhe.yaoi@gmail.com",
     description="Computer Vision Package Manager",

From 9e907a6027e97882ce2ac535ed0f4cc6933937ec Mon Sep 17 00:00:00 2001
From: xzyaoi <xiaozhe.yaoi@qq.com>
Date: Sun, 9 Dec 2018 17:55:15 +0800
Subject: [PATCH 6/8] add system info query system

---
 cli/daemon.go     | 24 ++++++++++++++++++++++++
 cli/handler.go    | 13 +------------
 cli/repository.go | 12 ++++++++++++
 cli/system.go     | 30 ++++++++++++++++++++++++++++++
 4 files changed, 67 insertions(+), 12 deletions(-)
 create mode 100644 cli/system.go

diff --git a/cli/daemon.go b/cli/daemon.go
index 5539354ee..010c3aced 100644
--- a/cli/daemon.go
+++ b/cli/daemon.go
@@ -68,6 +68,23 @@ func GetRunningSolversByPackageHandler(c *gin.Context) {
 	c.JSON(http.StatusOK, runningSolversInPackage)
 }
 
+// Handle Post Repos Request -> Install Package
+type addRepoRequest struct {
+	RepoType string `json:type`
+	URL string `json:url`
+}
+func PostReposHandler(c *gin.Context) {
+	config := readConfig()
+	var _addRepoRequest addRepoRequest
+	c.BindJSON(&_addRepoRequest)
+	if (_addRepoRequest.RepoType == "git") {
+		InstallFromGit(_addRepoRequest.URL)
+		c.JSON(http.StatusOK, config.Repositories)
+	} else {
+		c.JSON(http.StatusBadRequest, config.Repositories)
+	}
+}
+
 // Handle Get Request -> Get All Repos
 func GetReposHandler(c *gin.Context) {
 	config := readConfig()
@@ -81,6 +98,11 @@ func GetRepoMetaHandler(c *gin.Context) {
 	c.JSON(http.StatusOK, GetMetaInfo(vendor, name))
 }
 
+// Handle Get System Information
+func GetSystemHandler(c *gin.Context) {
+	c.JSON(http.StatusOK, getSystemInfo())
+}
+
 // Handle Socket Request
 func socketHandler(c *gin.Context) {
 	socketServer.On("connection", func(so socketio.Socket) {
@@ -144,6 +166,8 @@ func runServer(port string) {
 			"daemon": "running",
 		})
 	})
+	// System Related Handlers
+	r.GET("/system", GetSystemHandler)
 	// Repo Related Routes
 	r.GET("/repo/meta/:vendor/:name", GetRepoMetaHandler)
 	r.POST("/repo/running", PostRunningRepoHandler)
diff --git a/cli/handler.go b/cli/handler.go
index 8744b5a78..95726ecb4 100644
--- a/cli/handler.go
+++ b/cli/handler.go
@@ -57,21 +57,10 @@ func InstallHandler(c *cli.Context) {
 	} else {
 		color.Cyan("Installing to " + localFolder)
 	}
-	var repoFolder string
-	var repo Repository
 	// Download Codebase
 	if strings.HasPrefix(remoteURL, "https://github.com") {
-		repo = CloneFromGit(remoteURL, localFolder)
+		InstallFromGit(remoteURL)
 	}
-	repoFolder = repo.LocalFolder
-	// Install Dependencies
-	color.Cyan("Installing Dependencies... please wait patiently")
-	InstallDependencies(repoFolder)
-	color.Blue("Generating Runners")
-	GeneratingRunners(repoFolder)
-	color.Cyan("Adding to Local Configuration")
-	config.Repositories = addRepo(config.Repositories, repo)
-	writeConfig(config)
 }
 
 // Handle List
diff --git a/cli/repository.go b/cli/repository.go
index e56ad92f4..69d9ef8e7 100644
--- a/cli/repository.go
+++ b/cli/repository.go
@@ -165,3 +165,15 @@ func GetMetaInfo(Vendor string, Name string) RepositoryMetaInfo {
 	}
 	return repositoryMeta
 }
+
+// Install Repository from Git
+func InstallFromGit(remoteURL string) {
+	config := readConfig()
+	var repo Repository
+  repo = CloneFromGit(remoteURL, config.Local.LocalFolder)
+	repoFolder := repo.LocalFolder
+	InstallDependencies(repoFolder)
+	GeneratingRunners(repoFolder)
+	config.Repositories = addRepo(config.Repositories, repo)
+	writeConfig(config)
+}
diff --git a/cli/system.go b/cli/system.go
new file mode 100644
index 000000000..09a9bba31
--- /dev/null
+++ b/cli/system.go
@@ -0,0 +1,30 @@
+package main
+
+import (
+	"github.com/shirou/gopsutil/cpu"
+	"github.com/shirou/gopsutil/host"
+	"github.com/shirou/gopsutil/mem"
+)
+
+type SystemInfo struct {
+	CpuName         string `json:"cpu"`
+	Memory          uint64 `json:"memory"`
+	Platform        string `json:"platform"`
+	Os              string `json:"os"`
+	PlatformVersion string `json:"platformVersion"`
+}
+
+func getSystemInfo() SystemInfo {
+	var systemInfo SystemInfo
+	v, _ := mem.VirtualMemory()
+	systemInfo.Memory = v.Total
+	platform, _ := host.Info()
+	systemInfo.Platform = platform.Platform
+	systemInfo.PlatformVersion = platform.PlatformVersion
+	systemInfo.Os = platform.OS
+
+	// Handle CPU
+	cpuInfo, _ := cpu.Info()
+	systemInfo.CpuName = cpuInfo[0].ModelName
+	return systemInfo
+}

From e30758d57bedc26a51d19aecb8dc800bb72edf04 Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Mon, 10 Dec 2018 11:58:37 +0800
Subject: [PATCH 7/8] fix didi logo problem

---
 Makefile                                 |  8 +++++++-
 dashboard/src/components/CVPM-Status.vue | 14 ++++++++++----
 dashboard/src/services/system.js         |  8 +++++++-
 discovery/src/controller/recaptcha.ts    |  0
 docs/en-US/guide/credits.md              |  2 +-
 docs/zh-CN/guide/credits.md              |  3 ++-
 6 files changed, 27 insertions(+), 8 deletions(-)
 create mode 100644 discovery/src/controller/recaptcha.ts

diff --git a/Makefile b/Makefile
index 2a9632f06..f586b330b 100644
--- a/Makefile
+++ b/Makefile
@@ -8,7 +8,10 @@ default:
 	@echo "\tmake publish"
 test:
 
-format:
+build-arm:
+	cd cli && env GOOS=linux GOARCH=arm go build cli/
+
+format-py:
 	autoflake -i cvpm/*.py
 	# autoflake -i cvpm/**/*.py
 
@@ -18,6 +21,9 @@ format:
 	yapf -i cvpm/*.py
 	# yapf -i cvpm/**/*.py
 
+format-go:
+	gofmt -l -s -w *.go
+
 docs:
 	cd docs && npm run docs:build
 
diff --git a/dashboard/src/components/CVPM-Status.vue b/dashboard/src/components/CVPM-Status.vue
index 82e30f8d5..0a0df60e8 100644
--- a/dashboard/src/components/CVPM-Status.vue
+++ b/dashboard/src/components/CVPM-Status.vue
@@ -4,9 +4,12 @@
       <h2>Status</h2>
     </v-card-title>
     <v-card-text >
-        <p class="cvpm-status-content">Installed: {{status.installed}}</p>
-        <p class="cvpm-status-content">Running: {{status.running}} </p>
-        <p class="cvpm-status-content">System Status: {{status.status}}</p>
+        <p class="cvpm-status-content" v-if="status.cpu">CPU: {{status.cpu}}</p>
+        <p class="cvpm-status-content" v-if="status.memory">Memory: {{(status.memory / 1024 / 1024).toFixed(2) }} MB</p>
+        <p class="cvpm-status-content" v-if="status.platformVersion">Operating System: {{status.platform}} {{status.platformVersion}} on {{status.os}}</p>
+        <p class="cvpm-status-content" v-if="status.installed">Installed: {{status.installed}}</p>
+        <p class="cvpm-status-content" v-if="status.running">Running: {{status.running}} </p>
+        <p class="cvpm-status-content" v-if="status.status">System Status: {{status.status}}</p>
     </v-card-text>
   </v-card>
 </template>
@@ -19,7 +22,10 @@ export default {
   }),
   methods: {
     getStatus () {
-      this.status = systemService.getStatus()
+      let self = this
+      systemService.getStatus().then(function (res) {
+        self.status = res.data
+      })
     }
   },
   created () {
diff --git a/dashboard/src/services/system.js b/dashboard/src/services/system.js
index 239231440..993ba20c7 100644
--- a/dashboard/src/services/system.js
+++ b/dashboard/src/services/system.js
@@ -15,7 +15,13 @@ class SystemService {
     this.endpoint = endpoint
   }
   getStatus () {
-    return getStatus()
+    return new Promise((resolve, reject) => {
+      axios.get(this.endpoint + '/system').then(function (res) {
+        resolve(res)
+      }).catch(function (err) {
+        reject(err)
+      })
+    })
   }
   getPackages () {
     return new Promise((resolve, reject) => {
diff --git a/discovery/src/controller/recaptcha.ts b/discovery/src/controller/recaptcha.ts
new file mode 100644
index 000000000..e69de29bb
diff --git a/docs/en-US/guide/credits.md b/docs/en-US/guide/credits.md
index 5b35c55db..03efd453d 100644
--- a/docs/en-US/guide/credits.md
+++ b/docs/en-US/guide/credits.md
@@ -14,4 +14,4 @@ We would like to extend our sincere appreciate for the following organizations a
 * [Amazon Web Services](https://aws.amazon.com) for providing general web services.
 * [DiDi Cloud](https://www.didiyun.com/?channel=14204) for providing cloud services for free.
 
-During the development, we are standing on the shoulders of many open source software listed below but not limited to.
\ No newline at end of file
+[![didi_logo.png](https://i.loli.net/2018/12/10/5c0de4006eac3.png)](https://www.didiyun.com/?channel=14204)
\ No newline at end of file
diff --git a/docs/zh-CN/guide/credits.md b/docs/zh-CN/guide/credits.md
index 561343254..355fbadf3 100644
--- a/docs/zh-CN/guide/credits.md
+++ b/docs/zh-CN/guide/credits.md
@@ -16,4 +16,5 @@ We would like to extend our sincere appreciate for the following organizations a
 * [Amazon Web Services](https://aws.amazon.com)提供的部分云计算服务。
 * [DiDi Cloud](https://www.didiyun.com/?channel=14204)免费提供云计算服务。
 
-![DiDi Cloud](/public/sponsors/didi_logo.png)
\ No newline at end of file
+[![didi_logo.png](https://i.loli.net/2018/12/10/5c0de4006eac3.png)](https://www.didiyun.com/?channel=14204)
+

From b586e7d9a81b8cdf6bb6d65031b2a583c699275d Mon Sep 17 00:00:00 2001
From: Xiaozhe Yao <xiaozhe.yaoi@gmail.com>
Date: Mon, 10 Dec 2018 11:59:05 +0800
Subject: [PATCH 8/8] fix a typo

---
 docs/zh-CN/guide/credits.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/zh-CN/guide/credits.md b/docs/zh-CN/guide/credits.md
index 355fbadf3..4afdca747 100644
--- a/docs/zh-CN/guide/credits.md
+++ b/docs/zh-CN/guide/credits.md
@@ -14,7 +14,7 @@ We would like to extend our sincere appreciate for the following organizations a
 * [Netlify](https://www.netlify.com/)
 * [Clarifai](https://clarifai.com/)
 * [Amazon Web Services](https://aws.amazon.com)提供的部分云计算服务。
-* [DiDi Cloud](https://www.didiyun.com/?channel=14204)免费提供云计算服务。
+* [滴滴云](https://www.didiyun.com/?channel=14204)免费提供云计算服务。
 
 [![didi_logo.png](https://i.loli.net/2018/12/10/5c0de4006eac3.png)](https://www.didiyun.com/?channel=14204)