ui/settings: show version info

Author: rkonfj

ui/src/i18n.js

@@ -23,7 +23,10 @@ export default {
       tips: 'Recorded for {days} days, averaging {daygib} GiB per day. Expected to record for another {days1} days.',
     },
     settings: {
-      camerasHideAdd: 'Hide the add button on the cameras page'
+      camerasHideAdd: 'Hide the add button on the cameras page',
+      go_version: "GoVersion",
+      version: "ProgramVersion",
+      build_info: "BuildInfo"
     }
   },
   zh: {
@@ -47,7 +50,10 @@ export default {
       tips: '已录制 {days} 天，平均每天使用 {daygib} GiB。预计还可以录制 {days1} 天。',
     },
     settings: {
-      camerasHideAdd: '隐藏添加摄像机按钮'
+      camerasHideAdd: '隐藏添加摄像机按钮',
+      go_version: "Go版本",
+      version: "程序版本",
+      build_info: "构建信息"
     }
   },
 }

ui/src/views/Settings.vue

@@ -1,12 +1,15 @@
 <script setup>
 import { onMounted, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
+import http from '@/http'
 
 const { locale } = useI18n()
 const camerasHideAdd = ref()
+const settings = ref({})
 
 onMounted(() => {
   camerasHideAdd.value = window.localStorage.getItem('camerasHideAdd')
+  loadSettings()
 })
 
 watch(locale, lang => {
@@ -16,6 +19,17 @@ watch(locale, lang => {
 watch(camerasHideAdd, val => {
   window.localStorage.setItem('camerasHideAdd', val)
 })
+
+const loadSettings = async () => {
+  let session = JSON.parse(window.localStorage.getItem('session'))
+  let r = await http.get(`/v1/api/settings`, {
+    session: session,
+  })
+  if (r.code != 0) {
+    return
+  }
+  settings.value = r.data
+}
 </script>
 <template>
   <div class="language">
@@ -32,6 +46,20 @@ watch(camerasHideAdd, val => {
       <input v-model="camerasHideAdd" type="checkbox" id="checkbox" />
       <label for="checkbox">{{ $t('settings.camerasHideAdd') }}</label>
     </div>
+    <div class="line">
+      <div class="key">{{ $t('settings.go_version') }}</div>
+      <div class="value">{{ settings.go_version }}</div>
+    </div>
+    <div class="line">
+      <div class="key">{{ $t('settings.version') }}</div>
+      <div class="value">{{ settings.version }}</div>
+    </div>
+    <div class="line">
+      <div class="key">{{ $t('settings.build_info') }}</div>
+      <div class="value">
+        {{ settings.vcs_revision }} {{ settings.vcs_time }}
+      </div>
+    </div>
   </div>
 </template>
 <style scoped>