feat: 添加管理员权限控制和状态持久化

web/src/views/TokenDetailView.vue

@@ -1,14 +1,15 @@
 <script setup lang="ts">
 import {useCounterStore} from "@/stores/counter.ts";
-import {ref} from 'vue'
+import {ref, watch} from 'vue'
 import axios from "@/axios.ts";
 
 const result = ref()
+const value = ref('')
 
 const getInfo = () => {
   axios.get('/api/token/info', {
     params: {
-      token: useCounterStore().token
+      token: value.value
     }
   }).then(res => {
     if (res.status == 200) {
@@ -20,35 +21,64 @@ const getInfo = () => {
 const deleteDedup = () => {
   axios.delete('/api/token/info', {
     params: {
-      token: useCounterStore().token,
+      token: value.value,
       dedup_bf: true
     }
+  }).then(res => {
+    getInfo()
   })
-  getInfo()
 }
 const deleteRedis = () => {
   axios.delete('/api/token/info', {
     params: {
-      token: useCounterStore().token,
+      token: value.value,
       cache_list: true
     }
+  }).then(res => {
+    getInfo()
   })
-  getInfo()
 }
 
 getInfo()
 setInterval(getInfo, 5000)
+
+watch(value, (newValue) => {
+  console.log(newValue)
+  getInfo()
+})
+
+interface optionsType {
+  value: string
+}
+
+const options = ref([] as optionsType[])
+value.value = useCounterStore().token
+
+axios.get('/api/token').then(res => {
+  if (res.status == 200) {
+    res.data.result.forEach((item: any) => {
+      options.value.push({"value": item.token})
+    })
+  }
+})
 </script>
 
 
 <template>
-  <p>当前Token：{{ useCounterStore().token }}</p>
-  <el-button type="danger" @click="deleteDedup">删除去重记录值</el-button>
-  <el-button type="danger" @click="deleteRedis">删除Redis数据</el-button>
+  <b>当前Token：</b>
+  <el-select v-model="value" placeholder="选择Token" style="width: 240px">
+    <el-option
+        v-for="item in options"
+        :key="item.value"
+        :value="item.value"
+    />
+  </el-select>
+
+
   <el-divider/>
-  <el-button type="primary" @click="getInfo">手动刷新</el-button>
+  <b>Token信息（每5秒刷新）</b>
+  <el-button type="primary" plain @click="getInfo">手动刷新</el-button>
   <el-descriptions
-      :title="'Token信息 - ' + useCounterStore().token+'(每5秒刷新)'"
       direction="vertical"
       :column="4"
       border
@@ -57,6 +87,13 @@ setInterval(getInfo, 5000)
     <el-descriptions-item label="去重记录值">{{ result?.dedup_items_number }}</el-descriptions-item>
     <el-descriptions-item label="Redis中数据条数">{{ result?.cache_list_number }}</el-descriptions-item>
   </el-descriptions>
+
+  <div v-if="useCounterStore().isAdmin">
+    <p><b>管理</b></p>
+
+    <el-button type="danger" @click="deleteDedup">删除去重记录值</el-button>
+    <el-button type="danger" @click="deleteRedis">删除Redis数据</el-button>
+  </div>
 </template>
 
 <style scoped>