@@ -137,13 +140,37 @@ export default {
{
title: '操作',
key: 'a',
- width: 200,
+ width: 120,
render: (h, p) =>
- h('div', [
- h('Button', { props: { size: 'small' }, on: { click: () => this.openRenew(p.row) } }, '续费'),
- h('Button', { props: { size: 'small' }, class: { ml8: true }, on: { click: () => this.openUpgrade(p.row) } }, '编辑'),
- h('Button', { props: { type: 'error', size: 'small' }, class: { ml8: true }, on: { click: () => this.doCancel(p.row) } }, '取消'),
- ]),
+ h(
+ 'Dropdown',
+ {
+ props: { trigger: 'click', transfer: true },
+ on: {
+ 'on-click': (name) => {
+ if (name === 'renew') this.openRenew(p.row)
+ else if (name === 'edit') this.openUpgrade(p.row)
+ else if (name === 'cancel') this.doCancel(p.row)
+ },
+ },
+ },
+ [
+ h(
+ 'Button',
+ { props: { type: 'primary', size: 'small' } },
+ ['操作 ', h('Icon', { props: { type: 'ios-arrow-down' } })]
+ ),
+ h(
+ 'DropdownMenu',
+ { slot: 'list' },
+ [
+ h('DropdownItem', { props: { name: 'renew' } }, '续费'),
+ h('DropdownItem', { props: { name: 'edit' } }, '编辑订阅'),
+ h('DropdownItem', { props: { name: 'cancel' } }, '取消订阅'),
+ ]
+ ),
+ ]
+ ),
},
]
},
@@ -314,6 +341,9 @@ export default {
},
})
},
+ on_toolbar_more(name) {
+ if (name === 'export') this.doExport()
+ },
async doExport() {
const res = await subscriptionsServer.exportRows({ param: this.param })
if (res && res.code === 0 && res.data && res.data.rows) {
@@ -323,10 +353,6 @@ export default {
this.$Message.error((res && res.message) || '导出失败')
}
},
- resetQuery() {
- this.param.seachOption = { key: 'user_id', value: '' }
- this.load(1)
- },
},
}
@@ -344,13 +370,6 @@ export default {
margin-bottom: 16px;
}
-.table-title-row {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- margin-bottom: 12px;
-}
-
.ml10 {
margin-left: 10px;
}
diff --git a/admin/src/views/subscription/tokens.vue b/admin/src/views/subscription/tokens.vue
index 320bd32..550df83 100644
--- a/admin/src/views/subscription/tokens.vue
+++ b/admin/src/views/subscription/tokens.vue
@@ -1,11 +1,10 @@
@@ -205,6 +208,9 @@ export default {
},
})
},
+ on_toolbar_more(name) {
+ if (name === 'export') this.doExport()
+ },
async doExport() {
const res = await tokenServer.exportRows({ param: this.param })
if (res && res.code === 0 && res.data && res.data.rows) {
@@ -214,10 +220,6 @@ export default {
this.$Message.error((res && res.message) || '导出失败')
}
},
- resetQuery() {
- this.param.seachOption = { key: 'user_id', value: '' }
- this.load(1)
- },
},
}
@@ -235,13 +237,6 @@ export default {
margin-bottom: 16px;
}
-.table-title-row {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- margin-bottom: 12px;
-}
-
.ml10 {
margin-left: 10px;
}
diff --git a/admin/src/views/subscription/usage.vue b/admin/src/views/subscription/usage.vue
index ab6bda9..b15adbf 100644
--- a/admin/src/views/subscription/usage.vue
+++ b/admin/src/views/subscription/usage.vue
@@ -1,11 +1,10 @@
@@ -224,6 +227,9 @@ export default {
},
})
},
+ on_toolbar_more(name) {
+ if (name === 'export') this.doExport()
+ },
async doExport() {
const res = await usageServer.exportRows({ param: this.param })
if (res && res.code === 0 && res.data && res.data.rows) {
@@ -233,10 +239,6 @@ export default {
this.$Message.error((res && res.message) || '导出失败')
}
},
- resetQuery() {
- this.param.seachOption = { key: 'stat_month', value: '' }
- this.load(1)
- },
},
}
@@ -281,13 +283,6 @@ export default {
margin-bottom: 16px;
}
-.table-title-row {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- margin-bottom: 14px;
-}
-
.ml10 {
margin-left: 10px;
}
diff --git a/admin/src/views/subscription/users.vue b/admin/src/views/subscription/users.vue
index 512fc45..e798ae3 100644
--- a/admin/src/views/subscription/users.vue
+++ b/admin/src/views/subscription/users.vue
@@ -1,11 +1,10 @@
@@ -57,16 +62,8 @@
Token 数量:{{ detail.tokenCount }}
API Token
-
+
订阅记录
@@ -74,15 +71,8 @@
点击表格某一行查看该 Token 详情(明文不可查,需重新创建)
-
+
暂无 Token
@@ -148,26 +138,29 @@ export default {
{
title: 'API Token',
key: 'token_count',
- width: 130,
+ width: 100,
render: (h, p) => {
const n = p.row.token_count != null ? Number(p.row.token_count) : 0
- return h('div', [
- h('span', { class: { mr8: true } }, String(n)),
- h(
- 'Button',
- {
- props: { type: 'primary', size: 'small', ghost: true },
- on: { click: () => this.openTokenList(p.row) },
+ return h(
+ 'a',
+ {
+ class: 'table-action-link',
+ attrs: { href: 'javascript:void(0)' },
+ on: {
+ click: (e) => {
+ e.preventDefault()
+ this.openTokenList(p.row)
+ },
},
- '查看'
- ),
- ])
+ },
+ n > 0 ? `${n} · 列表` : String(n)
+ )
},
},
{
title: '操作',
key: 'a',
- width: 380,
+ width: 240,
render: (h, p) => {
return h('div', [
h(
@@ -187,42 +180,32 @@ export default {
},
'详情'
),
- p.row.status === 'disabled'
- ? h(
- 'Button',
- {
- props: { type: 'success', size: 'small' },
- class: { ml8: true },
- on: { click: () => this.doEnable(p.row) },
+ h(
+ 'Dropdown',
+ {
+ props: { trigger: 'click', transfer: true },
+ on: {
+ 'on-click': (name) => {
+ if (name === 'revoke_all') this.revokeAllTokens(p.row)
+ else if (name === 'del') this.doDel(p.row)
},
- '启用'
- )
- : h(
+ },
+ },
+ [
+ h(
'Button',
- {
- props: { type: 'warning', size: 'small' },
- class: { ml8: true },
- on: { click: () => this.doDisable(p.row) },
- },
- '禁用'
+ { props: { size: 'small' }, class: { ml8: true } },
+ ['更多 ', h('Icon', { props: { type: 'ios-arrow-down' } })]
),
- h(
- 'Button',
- {
- props: { type: 'default', size: 'small' },
- class: { ml8: true },
- on: { click: () => this.revokeAllTokens(p.row) },
- },
- '吊销全部Token'
- ),
- h(
- 'Button',
- {
- props: { type: 'error', size: 'small' },
- class: { ml8: true },
- on: { click: () => this.doDel(p.row) },
- },
- '删除'
+ h(
+ 'DropdownMenu',
+ { slot: 'list' },
+ [
+ h('DropdownItem', { props: { name: 'revoke_all' } }, '吊销全部 Token'),
+ h('DropdownItem', { props: { name: 'del' } }, '删除'),
+ ]
+ ),
+ ]
),
])
},
@@ -320,36 +303,6 @@ export default {
this.selectedToken = row
this.tokenDetailVisible = true
},
- doDisable(row) {
- this.$Modal.confirm({
- title: '禁用用户',
- content: '确认禁用该用户?',
- onOk: async () => {
- const res = await userServer.disable({ id: row.id })
- if (res && res.code === 0) {
- this.$Message.success('已禁用')
- this.load(1)
- } else {
- this.$Message.error((res && res.message) || '操作失败')
- }
- },
- })
- },
- doEnable(row) {
- this.$Modal.confirm({
- title: '启用用户',
- content: '确认重新启用该用户?',
- onOk: async () => {
- const res = await userServer.enable({ id: row.id })
- if (res && res.code === 0) {
- this.$Message.success('已启用')
- this.load(1)
- } else {
- this.$Message.error((res && res.message) || '操作失败')
- }
- },
- })
- },
doDel(row) {
this.$Modal.confirm({
title: '删除用户',
@@ -374,6 +327,9 @@ export default {
this.$Message.error((res && res.message) || '导出失败')
}
},
+ on_toolbar_more(name) {
+ if (name === 'export') this.doExport()
+ },
revokeAllTokens(row) {
this.$Modal.confirm({
title: '吊销全部 Token',
@@ -390,10 +346,6 @@ export default {
},
})
},
- resetQuery() {
- this.param.seachOption = { key: 'mobile', value: '' }
- this.load(1)
- },
},
}
@@ -411,13 +363,6 @@ export default {
margin-bottom: 16px;
}
-.table-title-row {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- margin-bottom: 12px;
-}
-
.ml10 {
margin-left: 10px;
}
@@ -448,8 +393,13 @@ export default {
color: #808695;
}
-.mr8 {
- margin-right: 8px;
+.table-action-link {
+ color: #2d8cf0;
+ cursor: pointer;
+}
+
+.table-action-link:hover {
+ text-decoration: underline;
}
.token-detail .label {