Files
ipms-sjy/yudao-ui-admin-vue3/src/views/system/oauth2/token/index.vue
2023-01-03 11:21:27 +08:00

70 lines
2.1 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<ContentWrap>
<!-- 列表 -->
<XTable @register="registerTable">
<template #actionbtns_default="{ row }">
<!-- 操作详情 -->
<XTextButton preIcon="ep:view" :title="t('action.detail')" @click="handleDetail(row)" />
<!-- 操作删除 -->
<XTextButton
preIcon="ep:delete"
:title="t('action.logout')"
v-hasPermi="['system:oauth2-token:delete']"
@click="handleForceLogout(row.id)"
/>
</template>
</XTable>
</ContentWrap>
<XModal v-model="dialogVisible" :title="dialogTitle">
<!-- 对话框(详情) -->
<Descriptions :schema="allSchemas.detailSchema" :data="detailData" />
<!-- 操作按钮 -->
<template #footer>
<XButton :title="t('dialog.close')" @click="dialogVisible = false" />
</template>
</XModal>
</template>
<script setup lang="ts" name="Token">
import { ref } from 'vue'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import { useXTable } from '@/hooks/web/useXTable'
import { allSchemas } from './token.data'
import * as TokenApi from '@/api/system/oauth2/token'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
// 列表相关的变量
const [registerTable, { reload }] = useXTable({
allSchemas: allSchemas,
topActionSlots: false,
getListApi: TokenApi.getAccessTokenPageApi
})
// ========== 详情相关 ==========
const detailData = ref() // 详情 Ref
const dialogVisible = ref(false) // 是否显示弹出层
const dialogTitle = ref(t('action.detail')) // 弹出层标题
// 详情
const handleDetail = async (row: TokenApi.OAuth2TokenVO) => {
// 设置数据
detailData.value = row
dialogVisible.value = true
}
// 强退操作
const handleForceLogout = (rowId: number) => {
message
.confirm('是否要强制退出用户')
.then(async () => {
await TokenApi.deleteAccessTokenApi(rowId)
message.success(t('common.success'))
})
.finally(async () => {
// 刷新列表
await reload()
})
}
</script>