Merge pull request #27 from shuaijinchao/release/040/dashboard

release: version 0.4.0 dashboard.
apioak · Apr 3, 2020 · ec0f7b7 · ec0f7b7
2 parents 0d2853e + c021304
commit ec0f7b7
Show file tree

Hide file tree

Showing 51 changed files with 10,291 additions and 5,132 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "apioak-dashboard",
-  "version": "0.1.0",
+  "name": "dashboard",
+  "version": "0.4.0",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
@@ -10,10 +10,14 @@
   },
   "dependencies": {
     "axios": "^0.19.0",
-    "codemirror": "^5.50.2",
+    "codemirror": "^5.52.0",
     "core-js": "^3.4.3",
     "element-ui": "^2.4.5",
+    "generate-schema": "^2.6.0",
+    "jsonlint": "^1.6.3",
+    "nprogress": "^0.2.0",
     "vue": "^2.6.10",
+    "vue-cookies": "^1.7.0",
     "vue-router": "^3.1.3",
     "vuex": "^3.1.2"
   },
@@ -33,6 +37,7 @@
     "node-sass": "^4.12.0",
     "prettier": "^1.19.1",
     "sass-loader": "^8.0.0",
+    "script-loader": "^0.7.2",
     "vue-cli-plugin-element": "^1.0.1",
     "vue-template-compiler": "^2.6.10"
   }

diff --git a/src/App.vue b/src/App.vue
@@ -1,130 +1,19 @@
 <template>
   <div id="app">
-    <el-container class="main">
-      <el-header class="main-header">
-        <img class="logo" src="./assets/logo.png" alt="logo">
-      </el-header>
-      <el-container>
-        <el-aside
-          class="main-aside"
-          :style="{ width:isCollapse ? 'auto' : '200px' }"
-        >
-          <h3 v-if="!isCollapse">APIOAK</h3>
-          <h3 v-else class="collapse">OAK</h3>
-          <el-menu
-            class="main-menu"
-            text-color="#bbb"
-            active-text-color="#fff"
-            background-color="#333"
-            :collapse="isCollapse"
-            :default-active="curActive"
-            router
-          >
-            <el-menu-item index="dashboard">
-              <i class="el-icon-menu"></i>
-              <span slot="title">概览</span>
-            </el-menu-item>
-            <el-menu-item index="service">
-              <i class="el-icon-help"></i>
-              <span slot="title">服务</span>
-            </el-menu-item>
-          </el-menu>
-          <div class="main-aside_close">
-            <i :class="isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'" @click="collapseMenu"></i>
-          </div>
-        </el-aside>
-        <el-main class="main-content">
-          <router-view></router-view>
-        </el-main>
-      </el-container>
-    </el-container>
+    <router-view></router-view>
   </div>
 </template>
+
 <script>
-export default {
-  name: "app",
-  data() {
-    return {
-      isCollapse: false,
-      curActive:"",
-    };
-  },
-  watch:{
-    "$route"(val){
-      this.curActive = val.name
-    }
-  },
-  methods: {
-    collapseMenu() {
-      this.isCollapse = !this.isCollapse;
-    }
+  export default {
+    name: 'App'
   }
-};
 </script>
+
 <style>
-@import "~@/styles/css/reset.css";
+  @import "~@/styles/css/reset.css";
 </style>
+
 <style lang="scss">
-.el {
-  &-header {
-    background: #262626;
-  }
-}
-.main {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  color: #fff;
-  &-header{
-    .logo{
-      width: 40px;
-      height: 40px;
-      margin-top: 10px;
-    }
-  }
-  &-aside {
-    position: relative;
-    height: 100%;
-    background: #333;
-    overflow: hidden;
-    h3 {
-      padding: 20px;
-      font-size: 16px;
-      font-weight: bold;
-      &.collapse {
-        padding: 20px 0;
-        text-align: center;
-      }
-    }
-    &_close {
-      font-size: 24px;
-      position: absolute;
-      width: 100%;
-      height: 56px;
-      bottom: 0;
-      border-top: 1px solid #000;
-      box-sizing: border-box;
-      line-height: 56px;
-      background: #333;
-      i {
-        cursor: pointer;
-        margin-left: 20px;
-      }
-    }
-  }
-  &-menu {
-    border-right: 0 !important;
-    li {
-      font-weight: 700;
-    }
-    &:not(.el-menu--collapse) {
-      width: 200px;
-    }
-  }
-  &-content {
-    height: 100%;
-    color: #333;
-    padding: 0 !important;
-  }
-}
+  @import "~@/styles/scss/element-variables.scss";
 </style>
diff --git a/src/api/index.js b/src/api/index.js
diff --git a/src/apioak/backend.js b/src/apioak/backend.js
@@ -0,0 +1,97 @@
+import Vue from "vue";
+
+let ApioakBackend = {};
+
+ApioakBackend.install = function (Vue) {
+    let apis = {
+        common: {
+            projects: '/apioak/admin/projects',
+
+            routers: '/apioak/admin/routers',
+
+            plugins: '/apioak/admin/plugins',
+
+            users: '/apioak/admin/users',
+
+            members: '/apioak/admin/members',
+        },
+
+        // Account Apis
+        account: {
+            login: '/apioak/admin/account/login',
+
+            logout: '/apioak/admin/account/logout',
+
+            register: '/apioak/admin/account/register',
+
+            status: '/apioak/admin/account/status',
+        },
+
+        user: {
+            created: '/apioak/admin/user',
+
+            deleted: (user_id) => `/apioak/admin/user/${user_id}`,
+
+            enable: (user_id) => `/apioak/admin/user/${user_id}/enable`,
+
+            disable: (user_id) => `/apioak/admin/user/${user_id}/disable`,
+
+            password: (user_id) => `/apioak/admin/user/${user_id}/password`,
+        },
+
+        project: {
+            query: (project_id) => `/apioak/admin/project/${project_id}`,
+
+            created: `/apioak/admin/project`,
+
+            updated: (project_id) => `/apioak/admin/project/${project_id}`,
+
+            deleted: (project_id) => `/apioak/admin/project/${project_id}`,
+
+            members: (project_id) => `/apioak/admin/project/${project_id}/members`,
+
+            createdMember: (project_id) => `/apioak/admin/project/${project_id}/member`,
+
+            updatedMember: (project_id, user_id) => `/apioak/admin/project/${project_id}/member/${user_id}`,
+
+            deletedMember: (project_id, user_id) => `/apioak/admin/project/${project_id}/member/${user_id}`,
+
+            routers: (project_id) => `/apioak/admin/project/${project_id}/routers`,
+
+            plugins: (project_id) => `/apioak/admin/project/${project_id}/plugins`,
+
+            createdPlugin: (project_id) => `/apioak/admin/project/${project_id}/plugin`,
+
+            deletedPlugin: (project_id, plugin_id) => `/apioak/admin/project/${project_id}/plugin/${plugin_id}`,
+
+            updatedPlugin: (project_id, plugin_id) => `/apioak/admin/project/${project_id}/plugin/${plugin_id}`,
+        },
+
+        router: {
+            query: (router_id) => `/apioak/admin/router/${router_id}`,
+
+            created: `/apioak/admin/router`,
+
+            updated: (router_id) => `/apioak/admin/router/${router_id}`,
+
+            deleted: (router_id) => `/apioak/admin/router/${router_id}`,
+
+            push: (router_id, env) => `/apioak/admin/router/${router_id}/env/${env}`,
+
+            pull: (router_id, env) => `/apioak/admin/router/${router_id}/env/${env}`,
+
+            plugins: (router_id) => `/apioak/admin/router/${router_id}/plugins`,
+
+            createdPlugin: (router_id) => `/apioak/admin/router/${router_id}/plugin`,
+
+            deletedPlugin: (router_id, plugin_id) => `/apioak/admin/router/${router_id}/plugin/${plugin_id}`,
+
+            updatedPlugin: (router_id, plugin_id) => `/apioak/admin/router/${router_id}/plugin/${plugin_id}`,
+        }
+    };
+
+    Vue.prototype.$oakBackendApis = apis;
+    Vue.$oakBackendApis = apis;
+};
+
+export default ApioakBackend;
diff --git a/src/apioak/const.js b/src/apioak/const.js
@@ -0,0 +1,16 @@
+let ApioakConst = {};
+
+ApioakConst.install = function (Vue) {
+    let constants = {
+        cookies: {
+            APIOAK_ADMIN_TOKEN: 'APIOAK-ADMIN-TOKEN',
+            APIOAK_ADMIN_ID: 'APIOAK-ADMIN-ID',
+            APIOAK_ADMIN_NAME: 'APIOAK-ADMIN-NAME',
+            APIOAK_ADMIN_OWNER: 'APIOAK-ADMIN-OWNER',
+        }
+    };
+    Vue.prototype.$oakConst = constants;
+    Vue.$oakConst = constants;
+};
+
+export default ApioakConst;