feat(admin): 添加数据格式选项自定义功能

- 在TokenManageView中增加自定义数据格式选项功能
- 实现添加数据格式按钮和输入框界面
- 添加确认和取消操作按钮
- 支持动态添加新的数据格式选项到下拉列表
- 整理数据格式选项顺序保持一致性
- 添加输入验证确保选项名称不为空

web/src/views/admin/TokenManageView.vue

@@ -20,6 +20,28 @@ const rowOut = ref<any>(null)
 const addDataDialogVisible = ref(false)
 const dataDialogVisible = ref(false)
 
+const isAdding = ref(false)
+const optionName = ref('')
+
+const onAddOption = () => {
+  isAdding.value = true
+}
+
+const onConfirm = () => {
+  if (optionName.value) {
+    dataFormatOptions.push({
+      label: optionName.value,
+      value: optionName.value,
+    })
+    clear()
+  }
+}
+
+const clear = () => {
+  optionName.value = ''
+  isAdding.value = false
+}
+
 const options = [
   {value: 'uid', label: 'uid'},
   {value: 'secid', label: 'secid'},
@@ -31,8 +53,8 @@ const options = [
 
 const dataFormatOptions = [
   {value: 'uid----secid----pid----comment_id', label: 'uid----secid----pid----comment_id'},
-  {value: 'uid----secid', label: 'uid----secid'},
   {value: "uid----pid----弹幕ID", label: "uid----pid----弹幕ID"},
+  {value: 'uid----secid', label: 'uid----secid'},
   {value: 'dyid', label: 'dyid'}
 ]
 
@@ -154,8 +176,23 @@ onMounted(() => {
           </el-select>
 
           <el-select v-model="inputDataFormat" placeholder="数据格式" clearable class="w-70 max-md:w-full">
+            <template #footer>
+              <el-button v-if="!isAdding" text bg size="small" @click="onAddOption">
+                添加数据格式
+              </el-button>
+              <template v-else>
+                <el-input
+                    v-model="optionName"
+                    placeholder="输入数据格式（以----分割）"
+                    size="small"
+                />
+                <el-button type="primary" size="small" @click="onConfirm">添加</el-button>
+                <el-button size="small" @click="clear">取消</el-button>
+              </template>
+            </template>
             <el-option v-for="item in dataFormatOptions" :key="item.value" :value="item.value"
-                       :label="item.label"/>
+                       :label="item.label"
+            />
           </el-select>
 
           <el-input v-model="inputNotes" placeholder="备注（可选）" clearable class="w-55 max-md:w-full">