Merge pull request #1 from vidar-team/dev

update: pack for backend
vidar-team · Apr 8, 2020 · 89ca4c2 · 89ca4c2
2 parents 213ca0e + 6fdfba3
commit 89ca4c2
Show file tree

Hide file tree

Showing 20 changed files with 190,043 additions and 49 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,6 @@
 .DS_Store
 node_modules
-/dist
+/dist/files/*
 
 # local env files
 .env.local

diff --git a/dist/dist.go b/dist/dist.go
@@ -0,0 +1,3 @@
+package dist
+
+//go:generate togo http -package dist -output dist_gen.go
diff --git a/dist/dist_gen.go b/dist/dist_gen.go
diff --git a/package.json b/package.json
@@ -12,6 +12,7 @@
     "axios": "^0.19.1",
     "core-js": "^3.4.4",
     "vue": "^2.6.10",
+    "vue-i18n": "^8.16.0",
     "vue-router": "^3.1.3",
     "vuetify": "^2.2.3",
     "vuetify-loader": "^1.4.3"

diff --git a/public/index.html b/public/index.html
@@ -5,13 +5,13 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title>cardinal_frontend</title>
+    <title>Cardinal</title>
     <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
     <link href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but cardinal_frontend doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong>We're sorry but Cardinal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->

diff --git a/src/App.vue b/src/App.vue
@@ -4,11 +4,27 @@
             <v-app-bar app clipped-left color="transparent" v-if="this.$route.name !== 'Login'">
                 <v-toolbar-title>{{ base.Title }}</v-toolbar-title>
                 <v-toolbar-items class="ml-5">
-                    <v-btn text to="/">靶机状态</v-btn>
-                    <v-btn text to="/rank">排名</v-btn>
-                    <v-btn text to="/bulletin">公告</v-btn>
-                    <v-btn text @click="onLogout">登出</v-btn>
+                    <v-btn text to="/">{{$t('header.status')}}</v-btn>
+                    <v-btn text to="/rank">{{$t('header.rank')}}</v-btn>
+                    <v-btn text to="/bulletin">{{$t('header.bulletin')}}</v-btn>
+                    <v-btn text @click="onLogout">{{$t('header.logout')}}</v-btn>
+
                 </v-toolbar-items>
+                <v-spacer></v-spacer>
+                <!-- switch language -->
+                <v-menu bottom left>
+                    <template v-slot:activator="{ on }">
+                        <v-btn icon v-on="on">
+                            <v-icon>mdi-translate</v-icon>
+                        </v-btn>
+                    </template>
+                    <v-list>
+                        <v-list-item v-for="(lang, index) in $i18n.availableLocales"
+                                     v-bind:key="index"
+                                     @click="$i18n.locale = lang"
+                        >{{lang}}</v-list-item>
+                    </v-list>
+                </v-menu>
             </v-app-bar>
 
             <v-content>

diff --git a/src/assets/languages/en-US.json b/src/assets/languages/en-US.json
@@ -0,0 +1,44 @@
+{
+  "general": {
+    "score": "",
+    "close": "Close",
+    "minute": "Minute",
+    "second": "Second"
+  },
+  "login": {
+    "title": "Login",
+    "account": "Account",
+    "password": "Password",
+    "login": "Login",
+    "reset": "Reset",
+    "loading": "Loading...",
+    "account_empty": "Please input your account",
+    "password_empty": "Please input your password"
+  },
+  "gamebox": {
+    "empty": "No Challenge for Now"
+  },
+  "flag": {
+    "submit": "Submit Flag"
+  },
+  "timer": {
+    "not_begin": "The Game is not ready",
+    "pause": "The Game is pause",
+    "end": "The Game is over",
+    "til_round_end": "To Round {round}:"
+  },
+  "bulletin": {
+    "empty": "No Bulletin"
+  },
+  "rank": {
+    "rank": "#",
+    "team": "Team",
+    "score": "Score"
+  },
+  "header": {
+    "status": "Gamebox Status",
+    "rank": "Rank",
+    "bulletin": "Bulletin",
+    "logout": "Logout"
+  }
+}
diff --git a/src/assets/languages/zh-CN.json b/src/assets/languages/zh-CN.json
@@ -0,0 +1,44 @@
+{
+  "general": {
+    "score": "分",
+    "close": "关闭",
+    "minute": "分",
+    "second": "秒"
+  },
+  "login": {
+    "title": "登录",
+    "account": "账号",
+    "password": "密码",
+    "login": "登录",
+    "reset": "重置",
+    "loading": "登录中...",
+    "account_empty": "请输入账号",
+    "password_empty": "请输入密码"
+  },
+  "gamebox": {
+    "empty": "暂时还没有题目哟~"
+  },
+  "flag": {
+    "submit": "提交 Flag"
+  },
+  "timer": {
+    "not_begin": "比赛未开始",
+    "pause": "比赛已暂停",
+    "end": "比赛已结束",
+    "til_round_end": "距离第 {round} 轮结束还有"
+  },
+  "bulletin": {
+    "empty": "暂无公告"
+  },
+  "rank": {
+    "rank": "排名",
+    "team": "队伍",
+    "score": "分数"
+  },
+  "header": {
+    "status": "靶机状态",
+    "rank": "排名",
+    "bulletin": "公告",
+    "logout": "登出"
+  }
+}
diff --git a/src/assets/logo.png b/src/assets/logo.png
diff --git a/src/components/GameBox.vue b/src/components/GameBox.vue
@@ -7,24 +7,24 @@
                 <v-list-item-content>
                     <v-list-item-title v-text="gameBox.Title"/>
                     <v-list-item-subtitle>{{gameBox.IP}}:{{gameBox.Port}}</v-list-item-subtitle>
-                    <v-list-item-subtitle>{{utils.FormatFloat(gameBox.Score)}} 分</v-list-item-subtitle>
+                    <v-list-item-subtitle>{{utils.FormatFloat(gameBox.Score)}} {{$t('general.score')}}</v-list-item-subtitle>
                 </v-list-item-content>
 
                 <v-list-item-action>
                     <div v-if="!gameBox.IsAttacked && !gameBox.IsDown">
                         <v-chip class="ma-2" color="green" text-color="green" outlined>Online</v-chip>
                     </div>
-                    <div v-else-if="gameBox.IsDown">
+                    <div v-if="gameBox.IsDown">
                         <v-chip class="ma-2" color="orange" text-color="orange" outlined>Down</v-chip>
                     </div>
-                    <div v-else-if="gameBox.IsAttacked">
+                    <div v-if="gameBox.IsAttacked">
                         <v-chip class="ma-2" color="red" text-color="red" outlined>Attacked</v-chip>
                     </div>
                 </v-list-item-action>
             </v-list-item>
         </div>
-        <v-list-item v-else>
-            <p>暂时还没有题目哟~</p>
+        <v-list-item v-if="gameBoxes === null || gameBoxes.length === 0">
+            <p>{{$t('gamebox.empty')}}</p>
         </v-list-item>
 
         <!-- 靶机详细信息 -->
@@ -41,7 +41,7 @@
                 <v-divider/>
                 <v-card-actions>
                     <v-spacer/>
-                    <v-btn color="primary" text @click="showDetail = false">关闭</v-btn>
+                    <v-btn color="primary" text @click="showDetail = false">{{$t('general.close')}}</v-btn>
                 </v-card-actions>
             </v-card>
         </v-dialog>
@@ -62,13 +62,26 @@
                     TargetPort: '',
                     Describe: ''
                 },
+
+                timer: null,
             }
         },
 
         mounted() {
-            this.utils.GET("/team/gameboxes").then(res => {
-                this.gameBoxes = res
-            })
+            this.getGameboxes()
+            this.timer = setInterval(this.getGameboxes, 5000)
+        },
+
+        beforeDestroy() {
+            clearInterval(this.timer)
+        },
+
+        methods: {
+            getGameboxes() {
+                this.utils.GET("/team/gameboxes").then(res => {
+                    this.gameBoxes = res
+                })
+            }
         }
     }
 </script>

diff --git a/src/components/Info.vue b/src/components/Info.vue
@@ -1,9 +1,14 @@
 <template>
-    <v-card  v-if="info !== null">
+    <v-card v-if="info !== null">
         <v-list-item two-line>
             <v-list-item-content>
-                <v-list-item-title class="headline">{{info.Name}}</v-list-item-title>
-                <v-list-item-subtitle>Token: {{info.Token}}</v-list-item-subtitle>
+                <div>
+                    <v-img v-if="info.Logo !== ''" class="logo" :src="`${utils.baseURL}/uploads/${info.Logo}`"></v-img>
+                    <v-list-item-title class="headline">{{info.Name}}</v-list-item-title>
+                    <v-list-item-subtitle>
+                        Token {{ info.Token }}
+                    </v-list-item-subtitle>
+                </div>
             </v-list-item-content>
         </v-list-item>
 
@@ -13,7 +18,7 @@
         <v-divider/>
         <v-card-actions>
             <v-list-item>
-                #{{ info.Rank }} / {{ utils.FormatFloat(info.Score) }} 分
+                #{{ info.Rank }} / {{ utils.FormatFloat(info.Score) }} {{$t('general.score')}}
             </v-list-item>
             <v-btn text/>
         </v-card-actions>
@@ -40,5 +45,10 @@
 </script>
 
 <style scoped>
-
+    .logo {
+        float: left;
+        width: 50px;
+        height: 50px;
+        margin-right: 5px;
+    }
 </style>
diff --git a/src/components/SubmitFlag.vue b/src/components/SubmitFlag.vue
@@ -1,6 +1,6 @@
 <template>
-    <v-card class="mx-auto">
-        <v-card-title>提交 Flag</v-card-title>
+    <v-card class="mx-auto" v-if="info !== null">
+        <v-card-title>{{$t('flag.submit')}}</v-card-title>
         <v-card-text>
             <h2>POST <code style="background-color: #1c1c1c">/flag</code></h2><br>
             <p>Content-Type: application/json</p>

diff --git a/src/components/Timer.vue b/src/components/Timer.vue
@@ -1,24 +1,24 @@
 <template>
     <v-card-text class="text-center" v-if="time !== null">
         <div v-if="time.Status === 'on'">
-            <div>距离第 {{time.NowRound}} 轮结束还有</div>
+            <div>{{$t('timer.til_round_end',{round: time.NowRound})}}</div>
             <p class="display-1 text--primary">
-                {{minute}} 分 {{second}} 秒
+                {{minute}} {{$t('general.minute')}} {{second}} {{$t('general.second')}}
             </p>
         </div>
         <div v-else-if="time.Status === 'wait'">
             <p class="display-1 text--primary">
-                比赛未开始
+                {{$t('timer.not_begin')}}
             </p>
         </div>
         <div v-else-if="time.Status === 'pause'">
             <p class="display-1 text--primary">
-                比赛已暂停
+                {{$t('timer.pause')}}
             </p>
         </div>
         <div v-else-if="time.Status === 'end'">
             <p class="display-1 text--primary">
-                比赛已结束
+                {{$t('timer.end')}}
             </p>
         </div>
     </v-card-text>

diff --git a/src/main.js b/src/main.js
@@ -1,4 +1,5 @@
 import Vue from 'vue'
+import VueI18n from 'vue-i18n'
 import App from './App.vue'
 import router from './router'
 import vuetify from '@/plugins/vuetify'
@@ -7,8 +8,19 @@ import utils from './utils'
 Vue.config.productionTip = false
 Vue.prototype.utils = utils
 
+Vue.use(VueI18n)
+
+const i18n = new VueI18n({
+    locale: 'zh-CN',
+    messages: {
+        'zh-CN': require('@/assets/languages/zh-CN.json'),
+        'en-US': require('@/assets/languages/en-US.json')
+    }
+});
+
 new Vue({
-  render: h => h(App),
-  router: router,
-  vuetify,
+    render: h => h(App),
+    router: router,
+    i18n,
+    vuetify,
 }).$mount('#app')
diff --git a/src/utils.js b/src/utils.js
@@ -1,6 +1,6 @@
 import axios from 'axios'
 
-let baseURL = 'http://localhost:19999'
+let baseURL = '/api'
 
 export default {
     baseURL: baseURL,

diff --git a/src/views/Bulletin.vue b/src/views/Bulletin.vue
@@ -3,7 +3,7 @@
         <v-container>
             <div>
                 <h2 v-if="bulletinList !== null && bulletinList.length === 0" class="text-center font-weight-thin mt-5">
-                    暂无公告
+                    {{$t('bulletin.empty')}}
                 </h2>
                 <v-timeline align-top dense v-else>
                     <v-timeline-item v-for="(item, index) in bulletinList" :key="index" color="dark" icon="mdi-bullhorn" fill-dot>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		package dist

		//go:generate togo http -package dist -output dist_gen.go