yx lin
2 years ago
committed by
GitHub
GitHub
40 changed files with 999 additions and 270 deletions
@ -1,65 +1,99 @@ |
|||
import { defAbpHttp } from '/@/utils/http/abp'; |
|||
import { OpenIddictApplicationDto,OpenIddictApplicationGetListInput, OpenIddictApplicationCreateDto, OpenIddictApplicationUpdateDto, } from './model'; |
|||
import { |
|||
OpenIddictApplicationDto, |
|||
OpenIddictApplicationGetListInput, |
|||
OpenIddictApplicationCreateDto, |
|||
OpenIddictApplicationUpdateDto, |
|||
} from './model'; |
|||
|
|||
const remoteServiceName = 'AbpOpenIddict'; |
|||
const controllerName = 'OpenIddictApplication'; |
|||
// export const GetAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<OpenIddictApplicationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetAsync',
|
|||
// uniqueName: 'GetAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetAsyncById = (id: string) => { |
|||
return defAbpHttp.request<OpenIddictApplicationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetAsync', |
|||
uniqueName: 'GetAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.get<OpenIddictApplicationDto>({ |
|||
url: `/api/openiddict/applications/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
// export const GetListAsyncByInput = (input: OpenIddictApplicationGetListInput) => {
|
|||
// return defAbpHttp.pagedRequest<OpenIddictApplicationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetListAsync',
|
|||
// uniqueName: 'GetListAsyncByInput',
|
|||
// params: {
|
|||
// input: input,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetListAsyncByInput = (input: OpenIddictApplicationGetListInput) => { |
|||
return defAbpHttp.pagedRequest<OpenIddictApplicationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetListAsync', |
|||
uniqueName: 'GetListAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
return defAbpHttp.get<PagedResultDto<OpenIddictApplicationDto>>({ |
|||
url: '/api/openiddict/applications', |
|||
params: input, |
|||
}); |
|||
}; |
|||
|
|||
// export const CreateAsyncByInput = (input: OpenIddictApplicationCreateDto) => {
|
|||
// return defAbpHttp.request<OpenIddictApplicationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'CreateAsync',
|
|||
// uniqueName: 'CreateAsyncByInput',
|
|||
// data: input,
|
|||
// });
|
|||
// };
|
|||
|
|||
export const CreateAsyncByInput = (input: OpenIddictApplicationCreateDto) => { |
|||
return defAbpHttp.request<OpenIddictApplicationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'CreateAsync', |
|||
uniqueName: 'CreateAsyncByInput', |
|||
return defAbpHttp.post<OpenIddictApplicationDto>({ |
|||
url: '/api/openiddict/applications', |
|||
data: input, |
|||
}); |
|||
}; |
|||
|
|||
// export const UpdateAsyncByIdAndInput = (id: string, input: OpenIddictApplicationUpdateDto) => {
|
|||
// return defAbpHttp.request<OpenIddictApplicationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'UpdateAsync',
|
|||
// uniqueName: 'UpdateAsyncByIdAndInput',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// data: input,
|
|||
// });
|
|||
// };
|
|||
|
|||
export const UpdateAsyncByIdAndInput = (id: string, input: OpenIddictApplicationUpdateDto) => { |
|||
return defAbpHttp.request<OpenIddictApplicationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'UpdateAsync', |
|||
uniqueName: 'UpdateAsyncByIdAndInput', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.put<OpenIddictApplicationDto>({ |
|||
url: `/api/openiddict/applications/${id}`, |
|||
data: input, |
|||
}); |
|||
}; |
|||
|
|||
// export const DeleteAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<void>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'DeleteAsync',
|
|||
// uniqueName: 'DeleteAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const DeleteAsyncById = (id: string) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DeleteAsync', |
|||
uniqueName: 'DeleteAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.delete<void>({ |
|||
url: `/api/openiddict/applications/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
}; |
|||
@ -1,42 +1,57 @@ |
|||
import { defAbpHttp } from '/@/utils/http/abp'; |
|||
import { OpenIddictAuthorizationDto,OpenIddictAuthorizationGetListInput, } from './model'; |
|||
import { OpenIddictAuthorizationDto, OpenIddictAuthorizationGetListInput, } from './model'; |
|||
|
|||
const remoteServiceName = 'AbpOpenIddict'; |
|||
const controllerName = 'OpenIddictAuthorization'; |
|||
// export const DeleteAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<void>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'DeleteAsync',
|
|||
// uniqueName: 'DeleteAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const DeleteAsyncById = (id: string) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DeleteAsync', |
|||
uniqueName: 'DeleteAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.delete<void>({ |
|||
url: `/api/openiddict/authorizations/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
// export const GetAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<OpenIddictAuthorizationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetAsync',
|
|||
// uniqueName: 'GetAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetAsyncById = (id: string) => { |
|||
return defAbpHttp.request<OpenIddictAuthorizationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetAsync', |
|||
uniqueName: 'GetAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.get<OpenIddictAuthorizationDto>({ |
|||
url: `/api/openiddict/authorizations/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
// export const GetListAsyncByInput = (input: OpenIddictAuthorizationGetListInput) => {
|
|||
// return defAbpHttp.pagedRequest<OpenIddictAuthorizationDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetListAsync',
|
|||
// uniqueName: 'GetListAsyncByInput',
|
|||
// params: {
|
|||
// input: input,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetListAsyncByInput = (input: OpenIddictAuthorizationGetListInput) => { |
|||
return defAbpHttp.pagedRequest<OpenIddictAuthorizationDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetListAsync', |
|||
uniqueName: 'GetListAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
return defAbpHttp.get<PagedResultDto<OpenIddictAuthorizationDto>>({ |
|||
url: '/api/openiddict/authorizations', |
|||
params: input, |
|||
}); |
|||
}; |
|||
|
|||
}; |
|||
@ -1,65 +1,99 @@ |
|||
import { defAbpHttp } from '/@/utils/http/abp'; |
|||
import { OpenIddictScopeCreateDto, OpenIddictScopeDto,OpenIddictScopeGetListInput, OpenIddictScopeUpdateDto, } from './model'; |
|||
import { |
|||
OpenIddictScopeCreateDto, |
|||
OpenIddictScopeDto, |
|||
OpenIddictScopeGetListInput, |
|||
OpenIddictScopeUpdateDto, |
|||
} from './model'; |
|||
|
|||
const remoteServiceName = 'AbpOpenIddict'; |
|||
const controllerName = 'OpenIddictScope'; |
|||
// export const CreateAsyncByInput = (input: OpenIddictScopeCreateDto) => {
|
|||
// return defAbpHttp.request<OpenIddictScopeDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'CreateAsync',
|
|||
// uniqueName: 'CreateAsyncByInput',
|
|||
// data: input,
|
|||
// });
|
|||
// };
|
|||
|
|||
export const CreateAsyncByInput = (input: OpenIddictScopeCreateDto) => { |
|||
return defAbpHttp.request<OpenIddictScopeDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'CreateAsync', |
|||
uniqueName: 'CreateAsyncByInput', |
|||
return defAbpHttp.post<OpenIddictScopeDto>({ |
|||
url: '/api/openiddict/scopes', |
|||
data: input, |
|||
}); |
|||
}; |
|||
|
|||
// export const DeleteAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<void>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'DeleteAsync',
|
|||
// uniqueName: 'DeleteAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const DeleteAsyncById = (id: string) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DeleteAsync', |
|||
uniqueName: 'DeleteAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.delete<void>({ |
|||
url: `/api/openiddict/scopes/${id}` |
|||
}); |
|||
}; |
|||
|
|||
// export const GetAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<OpenIddictScopeDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetAsync',
|
|||
// uniqueName: 'GetAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetAsyncById = (id: string) => { |
|||
return defAbpHttp.request<OpenIddictScopeDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetAsync', |
|||
uniqueName: 'GetAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.get<OpenIddictScopeDto>({ |
|||
url: `/api/openiddict/scopes/${id}` |
|||
}); |
|||
}; |
|||
|
|||
// export const GetListAsyncByInput = (input: OpenIddictScopeGetListInput) => {
|
|||
// return defAbpHttp.pagedRequest<OpenIddictScopeDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetListAsync',
|
|||
// uniqueName: 'GetListAsyncByInput',
|
|||
// params: {
|
|||
// input: input,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetListAsyncByInput = (input: OpenIddictScopeGetListInput) => { |
|||
return defAbpHttp.pagedRequest<OpenIddictScopeDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetListAsync', |
|||
uniqueName: 'GetListAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
return defAbpHttp.get<PagedResultDto<OpenIddictScopeDto>>({ |
|||
url: '/api/openiddict/scopes', |
|||
params: input, |
|||
}); |
|||
}; |
|||
|
|||
// export const UpdateAsyncByIdAndInput = (id: string, input: OpenIddictScopeUpdateDto) => {
|
|||
// return defAbpHttp.request<OpenIddictScopeDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'UpdateAsync',
|
|||
// uniqueName: 'UpdateAsyncByIdAndInput',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// data: input,
|
|||
// });
|
|||
// };
|
|||
|
|||
export const UpdateAsyncByIdAndInput = (id: string, input: OpenIddictScopeUpdateDto) => { |
|||
return defAbpHttp.request<OpenIddictScopeDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'UpdateAsync', |
|||
uniqueName: 'UpdateAsyncByIdAndInput', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.put<OpenIddictScopeDto>({ |
|||
url: `/api/openiddict/scopes/${id}`, |
|||
data: input, |
|||
}); |
|||
}; |
|||
|
|||
}; |
|||
@ -1,42 +1,57 @@ |
|||
import { defAbpHttp } from '/@/utils/http/abp'; |
|||
import { OpenIddictTokenDto,OpenIddictTokenGetListInput, } from './model'; |
|||
import { OpenIddictTokenDto, OpenIddictTokenGetListInput, } from './model'; |
|||
|
|||
const remoteServiceName = 'AbpOpenIddict'; |
|||
const controllerName = 'OpenIddictToken'; |
|||
// export const DeleteAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<void>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'DeleteAsync',
|
|||
// uniqueName: 'DeleteAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const DeleteAsyncById = (id: string) => { |
|||
return defAbpHttp.request<void>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'DeleteAsync', |
|||
uniqueName: 'DeleteAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.delete<void>({ |
|||
url: `/api/openiddict/tokens/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
// export const GetAsyncById = (id: string) => {
|
|||
// return defAbpHttp.request<OpenIddictTokenDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetAsync',
|
|||
// uniqueName: 'GetAsyncById',
|
|||
// params: {
|
|||
// id: id,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetAsyncById = (id: string) => { |
|||
return defAbpHttp.request<OpenIddictTokenDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetAsync', |
|||
uniqueName: 'GetAsyncById', |
|||
params: { |
|||
id: id, |
|||
}, |
|||
return defAbpHttp.get<OpenIddictTokenDto>({ |
|||
url: `/api/openiddict/tokens/${id}`, |
|||
}); |
|||
}; |
|||
|
|||
// export const GetListAsyncByInput = (input: OpenIddictTokenGetListInput) => {
|
|||
// return defAbpHttp.pagedRequest<OpenIddictTokenDto>({
|
|||
// service: remoteServiceName,
|
|||
// controller: controllerName,
|
|||
// action: 'GetListAsync',
|
|||
// uniqueName: 'GetListAsyncByInput',
|
|||
// params: {
|
|||
// input: input,
|
|||
// },
|
|||
// });
|
|||
// };
|
|||
|
|||
export const GetListAsyncByInput = (input: OpenIddictTokenGetListInput) => { |
|||
return defAbpHttp.pagedRequest<OpenIddictTokenDto>({ |
|||
service: remoteServiceName, |
|||
controller: controllerName, |
|||
action: 'GetListAsync', |
|||
uniqueName: 'GetListAsyncByInput', |
|||
params: { |
|||
input: input, |
|||
}, |
|||
return defAbpHttp.get<PagedResultDto<OpenIddictTokenDto>>({ |
|||
url: '/api/openiddict/tokens', |
|||
params: input, |
|||
}); |
|||
}; |
|||
|
|||
}; |
|||
@ -0,0 +1,67 @@ |
|||
<template> |
|||
<BasicModal |
|||
:title="L('ManageSecret')" |
|||
@register="registerModal" |
|||
@ok="handleSubmit" |
|||
> |
|||
<BasicForm @register="registerForm" /> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { reactive } from 'vue'; |
|||
import { BasicForm, useForm } from '/@/components/Form'; |
|||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { useMessage } from '/@/hooks/web/useMessage'; |
|||
import { UpdateAsyncByIdAndInput } from '/@/api/openiddict/open-iddict-application'; |
|||
import { OpenIddictApplicationUpdateDto } from '/@/api/openiddict/open-iddict-application/model'; |
|||
|
|||
const state = reactive<{ |
|||
application: Recordable |
|||
}>({ |
|||
application: {}, |
|||
}); |
|||
const emits = defineEmits(['change', 'register']); |
|||
const { createMessage } = useMessage(); |
|||
const { L } = useLocalization(['AbpOpenIddict', 'AbpUi']); |
|||
const [registerForm, { validate, resetFields }] = useForm({ |
|||
layout: 'vertical', |
|||
showActionButtonGroup: false, |
|||
schemas: [ |
|||
{ |
|||
field: 'clientSecret', |
|||
component: 'Input', |
|||
label: L('DisplayName:ClientSecret'), |
|||
colProps: { span: 24 }, |
|||
required: true, |
|||
}, |
|||
], |
|||
}); |
|||
const [registerModal, { changeOkLoading, closeModal }] = useModalInner((data) => { |
|||
state.application = data; |
|||
}); |
|||
|
|||
function handleSubmit() { |
|||
validate().then((input) => { |
|||
changeOkLoading(true); |
|||
UpdateAsyncByIdAndInput( |
|||
state.application.id, |
|||
{ |
|||
...state.application as OpenIddictApplicationUpdateDto, |
|||
clientSecret: input.clientSecret |
|||
}).then((dto) => { |
|||
createMessage.success(L('Successful')); |
|||
resetFields(); |
|||
emits('change', dto); |
|||
closeModal(); |
|||
}).finally(() => { |
|||
changeOkLoading(false); |
|||
}); |
|||
}); |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
@ -1,10 +1,272 @@ |
|||
<template> |
|||
<div> |
|||
</div> |
|||
<BasicModal |
|||
@register="registerModal" |
|||
:title="L('Scopes')" |
|||
:can-fullscreen="false" |
|||
:width="800" |
|||
:height="500" |
|||
:close-func="handleBeforeClose" |
|||
@ok="handleSubmit" |
|||
> |
|||
<Form |
|||
ref="formRef" |
|||
:model="state.formModel" |
|||
:rules="state.formRules" |
|||
:label-col="{ span: 6 }" |
|||
:wrapper-col="{ span: 16 }" |
|||
> |
|||
<Tabs v-model:active-key="state.activeTab"> |
|||
<!-- Basic --> |
|||
<TabPane key="basic" :tab="L('BasicInfo')"> |
|||
<FormItem name="name" :label="L('DisplayName:Name')"> |
|||
<Input v-model:value="state.formModel.name" /> |
|||
</FormItem> |
|||
</TabPane> |
|||
<!-- DisplayName --> |
|||
<TabPane key="description" :tab="L('Descriptions')"> |
|||
<FormItem name="description" :label="L('DisplayName:DefaultDescription')"> |
|||
<Input v-model:value="state.formModel.description" /> |
|||
</FormItem> |
|||
<DisplayNameForm |
|||
:displayNames="state.formModel.descriptions" |
|||
@create="handleNewDescription" |
|||
@delete="handleDelDescription" |
|||
/> |
|||
</TabPane> |
|||
<!-- DisplayName --> |
|||
<TabPane key="displayName" :tab="L('DisplayNames')"> |
|||
<FormItem name="displayName" :label="L('DisplayName:DefaultDisplayName')"> |
|||
<Input v-model:value="state.formModel.displayName" /> |
|||
</FormItem> |
|||
<DisplayNameForm |
|||
:displayNames="state.formModel.displayNames" |
|||
@create="handleNewDisplayName" |
|||
@delete="handleDelDisplayName" |
|||
/> |
|||
</TabPane> |
|||
<!-- Resources --> |
|||
<TabPane key="resources" :tab="L('Resources')"> |
|||
<PermissionForm |
|||
:resources="getSupportResources" |
|||
:targetResources="targetResources" |
|||
@change="handleResourceChange" |
|||
/> |
|||
</TabPane> |
|||
<!-- Propertites --> |
|||
<TabPane key="propertites" :tab="L('Propertites')"> |
|||
<PropertyForm |
|||
:properties="state.formModel.properties" |
|||
@create="handleNewProperty" |
|||
@delete="handleDelProperty" |
|||
/> |
|||
</TabPane> |
|||
</Tabs> |
|||
</Form> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
</script> |
|||
import type { FormInstance } from 'ant-design-vue/lib/form'; |
|||
import { cloneDeep } from 'lodash-es'; |
|||
import { computed, nextTick, ref, unref, reactive, watch, onMounted } from 'vue'; |
|||
import { Form, Input, Tabs } from 'ant-design-vue'; |
|||
import { BasicModal, useModalInner } from '/@/components/Modal'; |
|||
import { useMessage } from '/@/hooks/web/useMessage'; |
|||
import { useValidation } from '/@/hooks/abp/useValidation'; |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { ScopeState } from '../types/props'; |
|||
import { GetAsyncById, CreateAsyncByInput, UpdateAsyncByIdAndInput } from '/@/api/openiddict/open-iddict-scope'; |
|||
import { OpenIddictScopeDto } from '/@/api/openiddict/open-iddict-scope/model'; |
|||
import { discovery } from '/@/api/identity-server/identityServer'; |
|||
import DisplayNameForm from '../../components/DisplayNames/DisplayNameForm.vue'; |
|||
import PropertyForm from '../../components/Properties/PropertyForm.vue'; |
|||
import PermissionForm from '../../components/Permissions/PermissionForm.vue'; |
|||
|
|||
const FormItem = Form.Item; |
|||
const TabPane = Tabs.TabPane; |
|||
|
|||
const emits = defineEmits(['register', 'change']); |
|||
const { L } = useLocalization(['AbpOpenIddict', 'AbpUi']); |
|||
const { ruleCreator } = useValidation(); |
|||
const { createMessage, createConfirm } = useMessage(); |
|||
const formRef = ref<FormInstance>(); |
|||
const state = reactive<ScopeState>({ |
|||
activeTab: 'basic', |
|||
isEdit: false, |
|||
entityChanged: false, |
|||
formModel: {} as OpenIddictScopeDto, |
|||
formRules: { |
|||
name: ruleCreator.fieldRequired({ |
|||
name: 'Name', |
|||
prefix: 'DisplayName', |
|||
resourceName: 'AbpOpenIddict', |
|||
trigger: 'blur', |
|||
}), |
|||
}, |
|||
}); |
|||
watch( |
|||
() => state.formModel, |
|||
() => { |
|||
state.entityChanged = true; |
|||
}, |
|||
{ |
|||
deep: true, |
|||
}, |
|||
); |
|||
const targetResources = computed(() => { |
|||
if (!state.formModel.resources) return []; |
|||
const targetScopes = getSupportResources.value.filter((item) => |
|||
state.formModel.resources?.some((scope) => scope === item.key), |
|||
); |
|||
return targetScopes.map((item) => item.key); |
|||
}); |
|||
const getSupportResources = computed(() => { |
|||
if (state.openIdConfiguration?.claims_supported) { |
|||
const supportResources = state.openIdConfiguration?.claims_supported.map(claim => { |
|||
return { |
|||
key: claim, |
|||
title: claim, |
|||
} |
|||
}); |
|||
return supportResources; |
|||
} |
|||
return []; |
|||
}); |
|||
|
|||
const [registerModal, { changeLoading, changeOkLoading, closeModal }] = useModalInner((data) => { |
|||
nextTick(() => { |
|||
fetch(data?.id); |
|||
}); |
|||
}); |
|||
|
|||
onMounted(initOpenidDiscovery); |
|||
|
|||
function initOpenidDiscovery() { |
|||
discovery().then((openIdConfiuration) => { |
|||
state.openIdConfiguration = openIdConfiuration; |
|||
}); |
|||
} |
|||
|
|||
function fetch(id?: string) { |
|||
state.activeTab = 'basic'; |
|||
state.isEdit = false; |
|||
state.entityChanged = false; |
|||
state.formModel = {} as OpenIddictScopeDto; |
|||
const form = unref(formRef); |
|||
form?.resetFields(); |
|||
if (!id) { |
|||
nextTick(() => { |
|||
state.isEdit = false; |
|||
state.entityChanged = false; |
|||
}); |
|||
return; |
|||
} |
|||
changeLoading(true); |
|||
GetAsyncById(id).then((scope) => { |
|||
state.formModel = scope; |
|||
nextTick(() => { |
|||
state.isEdit = true; |
|||
state.entityChanged = false; |
|||
}); |
|||
}).finally(() => { |
|||
changeLoading(false); |
|||
}); |
|||
} |
|||
|
|||
function handleResourceChange(_, direction, moveKeys: string[]) { |
|||
switch (direction) { |
|||
case 'left': |
|||
moveKeys.forEach((key) => { |
|||
const index = state.formModel.resources?.findIndex(r => r === key); |
|||
index && state.formModel.resources?.splice(index); |
|||
}); |
|||
break; |
|||
case 'right': |
|||
state.formModel.resources ??= []; |
|||
state.formModel.resources.push(...moveKeys); |
|||
break; |
|||
} |
|||
} |
|||
|
|||
<style lang="less" scoped> |
|||
</style> |
|||
function handleNewDisplayName(record) { |
|||
if (!state.formModel) { |
|||
return; |
|||
} |
|||
state.formModel.displayNames ??= {}; |
|||
state.formModel.displayNames[record.culture] = record.displayName; |
|||
} |
|||
|
|||
function handleDelDisplayName(record) { |
|||
if (!state.formModel || !state.formModel.displayNames) { |
|||
return; |
|||
} |
|||
delete state.formModel.displayNames[record.culture]; |
|||
} |
|||
|
|||
function handleNewDescription(record) { |
|||
if (!state.formModel) { |
|||
return; |
|||
} |
|||
state.formModel.descriptions ??= {}; |
|||
state.formModel.descriptions[record.culture] = record.displayName; |
|||
} |
|||
|
|||
function handleDelDescription(record) { |
|||
if (!state.formModel || !state.formModel.descriptions) { |
|||
return; |
|||
} |
|||
delete state.formModel.descriptions[record.culture]; |
|||
} |
|||
|
|||
function handleNewProperty(record) { |
|||
if (!state.formModel) { |
|||
return; |
|||
} |
|||
state.formModel.properties ??= {}; |
|||
state.formModel.properties[record.key] = record.value; |
|||
} |
|||
|
|||
function handleDelProperty(record) { |
|||
if (!state.formModel || !state.formModel.properties) { |
|||
return; |
|||
} |
|||
delete state.formModel.properties[record.key]; |
|||
} |
|||
|
|||
function handleBeforeClose(): Promise<boolean> { |
|||
return new Promise((resolve) => { |
|||
if (!state.entityChanged) { |
|||
return resolve(true); |
|||
} |
|||
createConfirm({ |
|||
iconType: 'warning', |
|||
title: L('AreYouSure'), |
|||
content: L('AreYouSureYouWantToCancelEditingWarningMessage'), |
|||
onOk: () => { |
|||
resolve(true); |
|||
}, |
|||
onCancel: () => { |
|||
resolve(false); |
|||
} |
|||
}); |
|||
}); |
|||
} |
|||
|
|||
function handleSubmit() { |
|||
const form = unref(formRef); |
|||
form?.validate().then(() => { |
|||
changeOkLoading(true); |
|||
console.log(state.formModel); |
|||
const api = state.formModel.id |
|||
? UpdateAsyncByIdAndInput(state.formModel.id, cloneDeep(state.formModel)) |
|||
: CreateAsyncByInput(cloneDeep(state.formModel)); |
|||
api.then((res) => { |
|||
createMessage.success(L('Successful')); |
|||
emits('change', res); |
|||
closeModal(); |
|||
}).finally(() => { |
|||
changeOkLoading(false); |
|||
}) |
|||
}); |
|||
} |
|||
</script> |
|||
|
|||
@ -1,10 +1,107 @@ |
|||
<template> |
|||
<div> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<Button |
|||
v-auth="['AbpOpenIddict.Scopes.Create']" |
|||
type="primary" |
|||
@click="handleAddNew" |
|||
> |
|||
{{ L('Scopes:AddNew') }} |
|||
</Button> |
|||
</template> |
|||
<template #bodyCell="{ column, record }"> |
|||
<template v-if="column.key === 'action'"> |
|||
<TableAction |
|||
:stop-button-propagation="true" |
|||
:actions="[ |
|||
{ |
|||
auth: 'AbpOpenIddict.Scopes.Update', |
|||
label: L('Edit'), |
|||
icon: 'ant-design:edit-outlined', |
|||
onClick: handleEdit.bind(null, record), |
|||
}, |
|||
{ |
|||
auth: 'AbpOpenIddict.Scopes.Delete', |
|||
label: L('Delete'), |
|||
color: 'error', |
|||
icon: 'ant-design:delete-outlined', |
|||
onClick: handleDelete.bind(null, record), |
|||
}, |
|||
]" |
|||
/> |
|||
</template> |
|||
</template> |
|||
</BasicTable> |
|||
<ScopeModal @register="registerModal" @change="reload" /> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
</script> |
|||
import { Button } from 'ant-design-vue'; |
|||
import { BasicTable, TableAction, useTable } from '/@/components/Table'; |
|||
import { getDataColumns } from '../datas/TableData'; |
|||
import { useModal } from '/@/components/Modal'; |
|||
import { useMessage } from '/@/hooks/web/useMessage'; |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { GetListAsyncByInput, DeleteAsyncById } from '/@/api/openiddict/open-iddict-scope'; |
|||
import { formatPagedRequest } from '/@/utils/http/abp/helper'; |
|||
import ScopeModal from './ScopeModal.vue'; |
|||
|
|||
const { L } = useLocalization(['AbpOpenIddict', 'AbpUi']); |
|||
const { createConfirm, createMessage } = useMessage(); |
|||
const [registerModal, { openModal }] = useModal(); |
|||
const [registerTable, { reload }] = useTable({ |
|||
rowKey: 'id', |
|||
title: L('Scopes'), |
|||
api: GetListAsyncByInput, |
|||
columns: getDataColumns(), |
|||
beforeFetch: formatPagedRequest, |
|||
pagination: true, |
|||
striped: false, |
|||
useSearchForm: true, |
|||
showIndexColumn: false, |
|||
showTableSetting: true, |
|||
formConfig: { |
|||
labelWidth: 100, |
|||
schemas: [ |
|||
{ |
|||
field: 'filter', |
|||
component: 'Input', |
|||
label: L('Search'), |
|||
colProps: { span: 24 }, |
|||
}, |
|||
], |
|||
}, |
|||
bordered: true, |
|||
canResize: true, |
|||
immediate: true, |
|||
actionColumn: { |
|||
width: 150, |
|||
title: L('Actions'), |
|||
dataIndex: 'action', |
|||
}, |
|||
}); |
|||
|
|||
function handleAddNew() { |
|||
openModal(true, {}); |
|||
} |
|||
|
|||
<style lang="less" scoped> |
|||
</style> |
|||
function handleEdit(record) { |
|||
openModal(true, record); |
|||
} |
|||
|
|||
function handleDelete(record) { |
|||
createConfirm({ |
|||
iconType: 'warning', |
|||
title: L('AreYouSure'), |
|||
content: L('ItemWillBeDeletedMessage'), |
|||
onOk: () => { |
|||
return DeleteAsyncById(record.id).then(() => { |
|||
createMessage.success(L('SuccessfullyDeleted')); |
|||
reload(); |
|||
}); |
|||
}, |
|||
}); |
|||
} |
|||
</script> |
|||
|
|||
@ -0,0 +1,18 @@ |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { FormProps } from '/@/components/Form'; |
|||
|
|||
const { L } = useLocalization(['AbpOpenIddict', 'AbpUi']); |
|||
|
|||
export function getSearchFormProps(): Partial<FormProps> { |
|||
return { |
|||
labelWidth: 100, |
|||
schemas: [ |
|||
{ |
|||
field: 'filter', |
|||
component: 'Input', |
|||
label: L('Search'), |
|||
colProps: { span: 24 }, |
|||
}, |
|||
], |
|||
}; |
|||
} |
|||
@ -0,0 +1,51 @@ |
|||
import { useLocalization } from '/@/hooks/abp/useLocalization'; |
|||
import { BasicColumn } from '/@/components/Table'; |
|||
import { formatToDateTime } from '/@/utils/dateUtil'; |
|||
|
|||
const { L } = useLocalization(['AbpOpenIddict', 'AbpUi']); |
|||
|
|||
export function getDataColumns(): BasicColumn[] { |
|||
return [ |
|||
{ |
|||
title: L('DisplayName:ConcurrencyStamp'), |
|||
dataIndex: 'concurrencyStamp', |
|||
align: 'left', |
|||
width: 1, |
|||
ifShow: false, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Name'), |
|||
dataIndex: 'name', |
|||
align: 'left', |
|||
width: 150, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:DisplayName'), |
|||
dataIndex: 'displayName', |
|||
align: 'left', |
|||
width: 180, |
|||
sorter: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:Description'), |
|||
dataIndex: 'description', |
|||
align: 'left', |
|||
width: 200, |
|||
sorter: true, |
|||
resizable: true, |
|||
}, |
|||
{ |
|||
title: L('DisplayName:CreationDate'), |
|||
dataIndex: 'creationTime', |
|||
align: 'left', |
|||
width: 200, |
|||
sorter: true, |
|||
resizable: true, |
|||
format: (text?: string) => { |
|||
return text ? formatToDateTime(text) : ''; |
|||
}, |
|||
}, |
|||
]; |
|||
} |
|||
@ -0,0 +1,12 @@ |
|||
import { Rule } from 'ant-design-vue/lib/form'; |
|||
import { OpenIdConfiguration } from '/@/api/identity-server/model/basicModel'; |
|||
import { OpenIddictScopeDto } from '/@/api/openiddict/open-iddict-scope/model'; |
|||
|
|||
export interface ScopeState { |
|||
activeTab: string; |
|||
formRules?: Dictionary<string, Rule>, |
|||
formModel: OpenIddictScopeDto; |
|||
openIdConfiguration?: OpenIdConfiguration, |
|||
entityChanged: boolean; |
|||
isEdit: boolean; |
|||
} |
|||
Loading…
Reference in new issue