1

admin/src/api/subscription/token_server.js

@@ -7,6 +7,10 @@ class TokenServer {
     return window.framework.http.post("/biz_token/create", row);
   }
 
+  async edit(row) {
+    return window.framework.http.post("/biz_token/edit", row);
+  }
+
   async revoke(row) {
     return window.framework.http.post("/biz_token/revoke", row);
   }

admin/src/router/component-map.js

@@ -20,6 +20,8 @@ const componentMap = {
   'subscription/plan': SubscriptionPlans,
   'subscription/subscription': SubscriptionRecords,
   'subscription/token': SubscriptionTokens,
+  /** 与 biz_api_token 管理页同一视图，便于菜单 component 语义对应 */
+  'subscription/biz_api_token': SubscriptionTokens,
   'subscription/payment': SubscriptionPayment,
   'subscription/usage': SubscriptionUsage,
   'subscription/audit': SubscriptionAuditLog,

admin/src/views/subscription/tokens.vue

@@ -52,6 +52,14 @@
       </div>
     </div>
 
+    <Modal v-model="editModal" title="编辑 Token" width="560" :loading="editSaving" @on-ok="submitEdit">
+      <Form :label-width="100">
+        <FormItem label="账号 key"><Input v-model="editForm.key" placeholder="账号唯一标识（可空）" /></FormItem>
+        <FormItem label="名称"><Input v-model="editForm.token_name" placeholder="名称" /></FormItem>
+        <FormItem label="过期时间"><Input v-model="editForm.expire_at" placeholder="YYYY-MM-DD HH:mm:ss" /></FormItem>
+      </Form>
+    </Modal>
+
     <Modal v-model="createModal" title="创建 Token" width="560" :loading="saving" @on-ok="submitCreate">
       <Form :label-width="100">
         <FormItem label="用户">
@@ -91,6 +99,9 @@ export default {
         seachOption: { key: 'user_id', value: '' },
         pageOption: { page: 1, pageSize: 20, total: 0 },
       },
+      editModal: false,
+      editSaving: false,
+      editForm: {},
       createModal: false,
       plainModal: false,
       plainModalTitle: '请立即保存 Token 明文',
@@ -113,15 +124,26 @@ export default {
         {
           title: '操作',
           key: 'a',
-          width: 178,
+          width: 248,
           render: (h, p) => {
             const btns = []
+            btns.push(
+              h(
+                'Button',
+                {
+                  props: { type: 'primary', size: 'small', ghost: true },
+                  on: { click: () => this.openEdit(p.row) },
+                },
+                '编辑'
+              )
+            )
             if (p.row.status === 'active') {
               btns.push(
                 h(
                   'Button',
                   {
                     props: { type: 'warning', size: 'small' },
+                    class: { ml8: true },
                     on: { click: () => this.doRegenerate(p.row) },
                   },
                   '重新生成'
@@ -133,7 +155,7 @@ export default {
                 'Button',
                 {
                   props: { type: 'error', size: 'small' },
-                  class: { ml8: btns.length > 0 },
+                  class: { ml8: true },
                   on: { click: () => this.doRevoke(p.row) },
                 },
                 '吊销'
@@ -191,6 +213,61 @@ export default {
       this._submitCreate()
       return false
     },
+    openEdit(row) {
+      this.editForm = {
+        id: row.id,
+        key: row.key != null ? String(row.key) : '',
+        token_name: row.token_name || '',
+        expire_at: row.expire_at
+          ? typeof row.expire_at === 'string'
+            ? row.expire_at
+            : this._fmt_expire(row.expire_at)
+          : '',
+      }
+      this.editModal = true
+    },
+    _fmt_expire(d) {
+      if (!d) return ''
+      const dt = new Date(d)
+      if (Number.isNaN(dt.getTime())) return String(d)
+      const pad = (n) => String(n).padStart(2, '0')
+      return `${dt.getFullYear()}-${pad(dt.getMonth() + 1)}-${pad(dt.getDate())} ${pad(dt.getHours())}:${pad(
+        dt.getMinutes()
+      )}:${pad(dt.getSeconds())}`
+    },
+    submitEdit() {
+      if (!this.editForm.id) return false
+      if (!this.editForm.token_name || !String(this.editForm.token_name).trim()) {
+        this.$Message.warning('请填写名称')
+        return false
+      }
+      if (!this.editForm.expire_at || !String(this.editForm.expire_at).trim()) {
+        this.$Message.warning('请填写过期时间')
+        return false
+      }
+      this.editSaving = true
+      this._submitEdit()
+      return false
+    },
+    async _submitEdit() {
+      try {
+        const res = await tokenServer.edit({
+          id: this.editForm.id,
+          key: this.editForm.key === '' ? null : this.editForm.key,
+          token_name: this.editForm.token_name,
+          expire_at: this.editForm.expire_at,
+        })
+        if (res && res.code === 0) {
+          this.editModal = false
+          this.$Message.success('已保存')
+          this.load(1)
+        } else {
+          this.$Message.error((res && res.message) || '保存失败')
+        }
+      } finally {
+        this.editSaving = false
+      }
+    },
     async _submitCreate() {
       const uid = this.createForm.user_id
       try {

admin/src/views/subscription/users.vue

@@ -77,6 +77,7 @@
         · ID {{ create_token_target_user.id }}
       </p>
       <Form :label-width="100">
+        <FormItem label="账号 key"><Input v-model="create_token_form.key" placeholder="账号唯一标识（可选）" /></FormItem>
         <FormItem label="名称"><Input v-model="create_token_form.token_name" placeholder="default" /></FormItem>
         <FormItem label="过期时间"><Input v-model="create_token_form.expire_at" placeholder="YYYY-MM-DD 23:59:59" />
         </FormItem>
@@ -429,6 +430,7 @@ export default {
       }
       this.create_token_target_user = user_row
       this.create_token_form = {
+        key: '',
         token_name: 'default',
         expire_at: this.default_token_expire_input(),
       }
@@ -446,6 +448,7 @@ export default {
       try {
         const res = await tokenServer.create({
           user_id: row.id,
+          key: this.create_token_form.key || null,
           token_name: this.create_token_form.token_name || 'default',
           expire_at: this.create_token_form.expire_at,
         })