cKey
5 years ago
10 changed files with 475 additions and 20 deletions
Binary file not shown.
@ -0,0 +1,20 @@ |
|||
import { ExtensibleEntity, PagedAndSortedResultRequestDto } from './types' |
|||
|
|||
export class PersistedGrant extends ExtensibleEntity<string> { |
|||
key!: string |
|||
type!: string |
|||
subjectId?: string |
|||
sessionId!: string |
|||
description?: string |
|||
consumedTime?: Date |
|||
clientId!: string |
|||
creationTime!: Date |
|||
expiration?: Date |
|||
data!: string |
|||
} |
|||
|
|||
export class GetGrantByPaged extends PagedAndSortedResultRequestDto { |
|||
filter = '' |
|||
subjectId = '' |
|||
} |
|||
|
|||
@ -0,0 +1,165 @@ |
|||
<template> |
|||
<el-dialog |
|||
width="800px" |
|||
:title="$t('AbpIdentityServer.DisplayName:PersistedGrants')" |
|||
:visible="showDialog" |
|||
custom-class="modal-form" |
|||
@close="onFormClosed" |
|||
> |
|||
<div class="app-container"> |
|||
<el-form |
|||
ref="formPersistedGrant" |
|||
label-width="130px" |
|||
> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:Key')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.key" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:Type')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.type" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:SubjectId')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.subjectId" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:SessionId')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.sessionId" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Description')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.description" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.CreationTime')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.creationTime | dateTimeFilter" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:ConsumedTime')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.consumedTime | dateTimeFilter" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Expiration')" |
|||
> |
|||
<el-input |
|||
:value="persistedGrant.expiration | dateTimeFilter" |
|||
readonly |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
:label="$t('AbpIdentityServer.Grants:Data')" |
|||
> |
|||
<json-editor |
|||
:value="formatData(persistedGrant.data)" |
|||
/> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import { PersistedGrant } from '@/api/grants' |
|||
import { Component, Prop, Watch } from 'vue-property-decorator' |
|||
import { mixins } from 'vue-class-component' |
|||
import { dateFormat } from '@/utils/index' |
|||
import HttpProxyMiXin from '@/mixins/HttpProxyMiXin' |
|||
import JsonEditor from '@/components/JsonEditor/index.vue' |
|||
|
|||
@Component({ |
|||
name: 'PersistedGrantProfile', |
|||
components: { |
|||
JsonEditor |
|||
}, |
|||
filters: { |
|||
dateTimeFilter(datetime: string) { |
|||
if (datetime) { |
|||
const date = new Date(datetime) |
|||
return dateFormat(date, 'YYYY-mm-dd HH:MM:SS') |
|||
} |
|||
return '' |
|||
} |
|||
} |
|||
}) |
|||
export default class extends mixins(HttpProxyMiXin) { |
|||
@Prop({ default: false }) |
|||
private showDialog!: boolean |
|||
|
|||
@Prop({ default: '' }) |
|||
private id!: string |
|||
|
|||
private persistedGrant = new PersistedGrant() |
|||
|
|||
get formatData() { |
|||
return (data: string) => { |
|||
if (data) { |
|||
return JSON.parse(data) |
|||
} |
|||
return {} |
|||
} |
|||
} |
|||
|
|||
@Watch('showDialog', { immediate: true }) |
|||
private onShowDialogChanged() { |
|||
this.handleGetPersistedGrant() |
|||
} |
|||
|
|||
private handleGetPersistedGrant() { |
|||
if (this.id && this.showDialog) { |
|||
this.request<PersistedGrant>({ |
|||
service: 'IdentityServer', |
|||
controller: 'PersistedGrant', |
|||
action: 'GetAsync', |
|||
data: { |
|||
id: this.id |
|||
} |
|||
}).then(res => { |
|||
this.persistedGrant = res |
|||
}) |
|||
} |
|||
} |
|||
|
|||
private onFormClosed() { |
|||
this.resetFields() |
|||
this.$emit('closed') |
|||
} |
|||
|
|||
private onCancel() { |
|||
this.onFormClosed() |
|||
} |
|||
|
|||
public resetFields() { |
|||
const formPersistedGrant = this.$refs.formPersistedGrant as any |
|||
formPersistedGrant.resetFields() |
|||
} |
|||
} |
|||
</script> |
|||
@ -0,0 +1,230 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="filter-container"> |
|||
<label |
|||
class="radio-label" |
|||
style="padding-left:10px;" |
|||
>{{ $t('queryFilter') }}</label> |
|||
<el-input |
|||
v-model="dataFilter.filter" |
|||
:placeholder="$t('filterString')" |
|||
style="width: 250px;margin-left: 10px;" |
|||
class="filter-item" |
|||
/> |
|||
<el-button |
|||
class="filter-item" |
|||
style="margin-left: 10px; text-alignt" |
|||
type="primary" |
|||
@click="refreshPagedData" |
|||
> |
|||
{{ $t('AbpIdentityServer.Search') }} |
|||
</el-button> |
|||
</div> |
|||
|
|||
<el-table |
|||
v-loading="dataLoading" |
|||
row-key="id" |
|||
:data="dataList" |
|||
border |
|||
fit |
|||
highlight-current-row |
|||
style="width: 100%;" |
|||
@sort-change="handleSortChange" |
|||
> |
|||
<el-table-column |
|||
:label="$t('AbpIdentityServer.Client:Id')" |
|||
prop="clientId" |
|||
sortable |
|||
width="150px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.clientId }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('AbpIdentityServer.Grants:Key')" |
|||
prop="key" |
|||
sortable |
|||
width="150px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.key }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('AbpIdentityServer.Grants:Type')" |
|||
prop="type" |
|||
sortable |
|||
width="150px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.type }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('AbpIdentityServer.Grants:SessionId')" |
|||
prop="sessionId" |
|||
sortable |
|||
width="140px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.sessionId }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('AbpIdentityServer.Description')" |
|||
prop="description" |
|||
sortable |
|||
width="140px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.description }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('global.operaActions')" |
|||
align="center" |
|||
width="250px" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<el-button |
|||
size="mini" |
|||
type="success" |
|||
icon="el-icon-tickets" |
|||
@click="onShowProfile(row.id)" |
|||
> |
|||
{{ $t('AbpIdentityServer.Grants:Profile') }} |
|||
</el-button> |
|||
<el-button |
|||
:disabled="!checkPermission(['AbpIdentityServer.Grants.Delete'])" |
|||
size="mini" |
|||
type="danger" |
|||
icon="el-icon-delete" |
|||
@click="onDeleted(row.id, row.key)" |
|||
> |
|||
{{ $t('AbpIdentityServer.Grants:Delete') }} |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<Pagination |
|||
v-show="dataTotal>0" |
|||
:total="dataTotal" |
|||
:page.sync="currentPage" |
|||
:limit.sync="pageSize" |
|||
@pagination="refreshPagedData" |
|||
@sort-change="handleSortChange" |
|||
/> |
|||
|
|||
<PersistedGrantProfile |
|||
:id="selectId" |
|||
:show-dialog="showProfileDialog" |
|||
@closed="showProfileDialog=false" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import { dateFormat, abpPagerFormat } from '@/utils/index' |
|||
import { checkPermission } from '@/utils/permission' |
|||
import DataListMiXin from '@/mixins/DataListMiXin' |
|||
import HttpProxyMiXin from '@/mixins/HttpProxyMiXin' |
|||
import Component, { mixins } from 'vue-class-component' |
|||
import Pagination from '@/components/Pagination/index.vue' |
|||
import PersistedGrantProfile from './components/PersistedGrantProfile.vue' |
|||
|
|||
import { GetGrantByPaged, PersistedGrant } from '@/api/grants' |
|||
|
|||
@Component({ |
|||
name: 'IdentityServerGrant', |
|||
components: { |
|||
Pagination, |
|||
PersistedGrantProfile |
|||
}, |
|||
methods: { |
|||
checkPermission, |
|||
local(name: string) { |
|||
return this.$t(name) |
|||
} |
|||
}, |
|||
filters: { |
|||
statusFilter(status: boolean) { |
|||
if (status) { |
|||
return 'success' |
|||
} |
|||
return 'warning' |
|||
}, |
|||
datetimeFilter(val: string) { |
|||
const date = new Date(val) |
|||
return dateFormat(date, 'YYYY-mm-dd HH:MM') |
|||
} |
|||
} |
|||
}) |
|||
export default class extends mixins(DataListMiXin, HttpProxyMiXin) { |
|||
public dataFilter = new GetGrantByPaged() |
|||
private selectId = '' |
|||
private showProfileDialog = false |
|||
|
|||
mounted() { |
|||
this.refreshPagedData() |
|||
} |
|||
|
|||
protected processDataFilter() { |
|||
this.dataFilter.skipCount = abpPagerFormat(this.currentPage, this.pageSize) |
|||
} |
|||
|
|||
protected getPagedList(filter: any) { |
|||
return this.pagedRequest<PersistedGrant>({ |
|||
service: 'IdentityServer', |
|||
controller: 'PersistedGrant', |
|||
action: 'GetListAsync', |
|||
data: { |
|||
input: filter |
|||
} |
|||
}) |
|||
} |
|||
|
|||
private onShowProfile(id: string) { |
|||
this.selectId = id |
|||
this.showProfileDialog = true |
|||
} |
|||
|
|||
private onDeleted(id: string, key: string) { |
|||
this.$confirm(this.l('AbpIdentityServer.Grants:DeleteByKey', { Key: key }), |
|||
this.l('AbpUi.AreYouSure'), { |
|||
callback: (action) => { |
|||
if (action === 'confirm') { |
|||
this.request<void>({ |
|||
service: 'IdentityServer', |
|||
controller: 'PersistedGrant', |
|||
action: 'DeleteAsync', |
|||
data: { |
|||
id: id |
|||
} |
|||
}).then(() => { |
|||
this.$message.success(this.l('global.successful')) |
|||
this.refreshPagedData() |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.roleItem { |
|||
width: 40px; |
|||
} |
|||
.options { |
|||
vertical-align: top; |
|||
margin-left: 20px; |
|||
} |
|||
.el-dropdown + .el-dropdown { |
|||
margin-left: 15px; |
|||
} |
|||
.el-icon-arrow-down { |
|||
font-size: 12px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue