30 changed files with 1150 additions and 32 deletions
@ -0,0 +1,20 @@ |
|||
using System.ComponentModel.DataAnnotations; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
public class AggregateReRouteConfigCreateDto |
|||
{ |
|||
[Required] |
|||
public string RouteId { get; set; } |
|||
|
|||
[Required] |
|||
[StringLength(256)] |
|||
public string ReRouteKey { get; set; } |
|||
|
|||
[StringLength(1000)] |
|||
public string Parameter { get; set; } |
|||
|
|||
[StringLength(256)] |
|||
public string JsonPath { get; set; } |
|||
} |
|||
} |
|||
@ -0,0 +1,14 @@ |
|||
using System.ComponentModel.DataAnnotations; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
public class AggregateReRouteConfigGetByKeyInputDto |
|||
{ |
|||
[Required] |
|||
public string RouteId { get; set; } |
|||
|
|||
[Required] |
|||
[StringLength(256)] |
|||
public string ReRouteKey { get; set; } |
|||
} |
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
using System.ComponentModel.DataAnnotations; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
public class AggregateReRouteCreateDto : AggregateReRouteDtoBase |
|||
{ |
|||
[Required] |
|||
[StringLength(50)] |
|||
public string AppId { get; set; } |
|||
|
|||
[Required] |
|||
[StringLength(50)] |
|||
public string Name { get; set; } |
|||
} |
|||
} |
|||
@ -0,0 +1,13 @@ |
|||
using System.ComponentModel.DataAnnotations; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
public class AggregateReRouteUpdateDto : AggregateReRouteDtoBase |
|||
{ |
|||
[Required] |
|||
public string RouteId { get; set; } |
|||
|
|||
[Required] |
|||
public string ConcurrencyStamp { get; set; } |
|||
} |
|||
} |
|||
@ -0,0 +1,10 @@ |
|||
using System.ComponentModel.DataAnnotations; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
public class AggregateRouteGetByRouteIdInputDto |
|||
{ |
|||
[Required] |
|||
public string RouteId { get; set; } |
|||
} |
|||
} |
|||
@ -1,16 +1,26 @@ |
|||
using Newtonsoft.Json; |
|||
using System; |
|||
using System.Collections.Generic; |
|||
|
|||
namespace LINGYUN.ApiGateway.Ocelot |
|||
{ |
|||
[Serializable] |
|||
public class AggregateReRouteDto : AggregateReRouteDtoBase |
|||
{ |
|||
public string AppId { get; set; } |
|||
|
|||
[JsonConverter(typeof(HexLongConverter))] |
|||
public long ReRouteId { get; set; } |
|||
|
|||
public string Name { get; set; } |
|||
|
|||
public string ConcurrencyStamp { get; set; } |
|||
|
|||
public List<AggregateReRouteConfigDto> ReRouteKeysConfig { get; set; } |
|||
|
|||
public AggregateReRouteDto() |
|||
{ |
|||
ReRouteKeysConfig = new List<AggregateReRouteConfigDto>(); |
|||
} |
|||
} |
|||
} |
|||
|
|||
Binary file not shown.
@ -0,0 +1,152 @@ |
|||
using Newtonsoft.Json; |
|||
using Newtonsoft.Json.Linq; |
|||
using System.Collections.Generic; |
|||
using System.Linq; |
|||
using System.Net; |
|||
using System.Net.Http; |
|||
using System.Net.Http.Headers; |
|||
using System.Text; |
|||
using System.Threading.Tasks; |
|||
|
|||
namespace Ocelot.Middleware.Multiplexer |
|||
{ |
|||
public class AbpApiDefinitionAggregator : IDefinedAggregator |
|||
{ |
|||
public async Task<DownstreamResponse> Aggregate(List<DownstreamContext> responses) |
|||
{ |
|||
var isAbpResponse = responses.Any(response => response.DownstreamResponse.Headers.Any(h => h.Key.Equals("_abperrorformat"))); |
|||
return await MapAbpApiDefinitionAggregateContentAsync(responses); |
|||
//if (isAbpResponse)
|
|||
//{
|
|||
// return await MapAbpApiDefinitionAggregateContentAsync(responses);
|
|||
//}
|
|||
//else
|
|||
//{
|
|||
// return await MapSimpleJsonAggregateContentAsync(responses);
|
|||
//}
|
|||
} |
|||
|
|||
protected virtual async Task<DownstreamResponse> MapAbpApiDefinitionAggregateContentAsync(List<DownstreamContext> downstreamContexts) |
|||
{ |
|||
var responseKeys = downstreamContexts.Select(s => s.DownstreamReRoute.Key).Distinct().ToList(); |
|||
JObject responseObject = null; |
|||
for (var k = 0; k < responseKeys.Count; k++) |
|||
{ |
|||
var contexts = downstreamContexts.Where(w => w.DownstreamReRoute.Key == responseKeys[k]).ToList(); |
|||
if (contexts.Count == 1) |
|||
{ |
|||
if (contexts[0].IsError) |
|||
{ |
|||
return contexts[0].DownstreamResponse; |
|||
} |
|||
|
|||
var content = await contexts[0].DownstreamResponse.Content.ReadAsStringAsync(); |
|||
var contentObject = JsonConvert.DeserializeObject(content); |
|||
if (responseObject == null) |
|||
{ |
|||
responseObject = JObject.FromObject(contentObject); |
|||
} |
|||
else |
|||
{ |
|||
responseObject.Merge(contentObject); |
|||
} |
|||
} |
|||
else |
|||
{ |
|||
for (var i = 0; i < contexts.Count; i++) |
|||
{ |
|||
if (contexts[i].IsError) |
|||
{ |
|||
return contexts[i].DownstreamResponse; |
|||
} |
|||
|
|||
var content = await contexts[i].DownstreamResponse.Content.ReadAsStringAsync(); |
|||
var contentObject = JsonConvert.DeserializeObject(content); |
|||
if (responseObject == null) |
|||
{ |
|||
responseObject = JObject.FromObject(contentObject); |
|||
} |
|||
else |
|||
{ |
|||
responseObject.Merge(contentObject); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
var stringContent = new StringContent(responseObject.ToString()) |
|||
{ |
|||
Headers = { ContentType = new MediaTypeHeaderValue("application/json") } |
|||
}; |
|||
stringContent.Headers.Add("_abperrorformat", "true"); |
|||
return new DownstreamResponse(stringContent, HttpStatusCode.OK, new List<KeyValuePair<string, IEnumerable<string>>>(), "cannot return from aggregate..which reason phrase would you use?"); |
|||
} |
|||
|
|||
protected virtual async Task<DownstreamResponse> MapSimpleJsonAggregateContentAsync(List<DownstreamContext> downstreamContexts) |
|||
{ |
|||
var contentBuilder = new StringBuilder(); |
|||
|
|||
contentBuilder.Append("{"); |
|||
|
|||
var responseKeys = downstreamContexts.Select(s => s.DownstreamReRoute.Key).Distinct().ToList(); |
|||
|
|||
for (var k = 0; k < responseKeys.Count; k++) |
|||
{ |
|||
var contexts = downstreamContexts.Where(w => w.DownstreamReRoute.Key == responseKeys[k]).ToList(); |
|||
if (contexts.Count == 1) |
|||
{ |
|||
if (contexts[0].IsError) |
|||
{ |
|||
return contexts[0].DownstreamResponse; |
|||
} |
|||
|
|||
var content = await contexts[0].DownstreamResponse.Content.ReadAsStringAsync(); |
|||
contentBuilder.Append($"\"{responseKeys[k]}\":{content}"); |
|||
} |
|||
else |
|||
{ |
|||
contentBuilder.Append($"\"{responseKeys[k]}\":"); |
|||
contentBuilder.Append("["); |
|||
|
|||
for (var i = 0; i < contexts.Count; i++) |
|||
{ |
|||
if (contexts[i].IsError) |
|||
{ |
|||
return contexts[i].DownstreamResponse; |
|||
} |
|||
|
|||
var content = await contexts[i].DownstreamResponse.Content.ReadAsStringAsync(); |
|||
if (string.IsNullOrWhiteSpace(content)) |
|||
{ |
|||
continue; |
|||
} |
|||
|
|||
contentBuilder.Append($"{content}"); |
|||
|
|||
if (i + 1 < contexts.Count) |
|||
{ |
|||
contentBuilder.Append(","); |
|||
} |
|||
} |
|||
|
|||
contentBuilder.Append("]"); |
|||
} |
|||
|
|||
if (k + 1 < responseKeys.Count) |
|||
{ |
|||
contentBuilder.Append(","); |
|||
} |
|||
} |
|||
|
|||
contentBuilder.Append("}"); |
|||
|
|||
var stringContent = new StringContent(contentBuilder.ToString()) |
|||
{ |
|||
Headers = { ContentType = new MediaTypeHeaderValue("application/json") } |
|||
}; |
|||
|
|||
return new DownstreamResponse(stringContent, HttpStatusCode.OK, new List<KeyValuePair<string, IEnumerable<string>>>(), "cannot return from aggregate..which reason phrase would you use?"); |
|||
} |
|||
|
|||
} |
|||
} |
|||
@ -0,0 +1,295 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="filter-container"> |
|||
<label |
|||
class="radio-label" |
|||
style="padding-left:10px;" |
|||
>{{ $t('apiGateWay.appId') }}</label> |
|||
<el-select |
|||
v-model="aggregateRouteGetPagedFilter.appId" |
|||
style="width: 250px;margin-left: 10px;" |
|||
class="filter-item" |
|||
:placeholder="$t('pleaseSelectBy', {name: $t('apiGateWay.appId')})" |
|||
> |
|||
<el-option |
|||
v-for="item in routeGroupAppIdOptions" |
|||
:key="item.appId" |
|||
:label="item.appName" |
|||
:value="item.appId" |
|||
/> |
|||
</el-select> |
|||
<label |
|||
class="radio-label" |
|||
style="padding-left:10px;" |
|||
>{{ $t('queryFilter') }}</label> |
|||
<el-input |
|||
v-model="aggregateRouteGetPagedFilter.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="handleGetAggregateRoutes" |
|||
> |
|||
{{ $t('searchList') }} |
|||
</el-button> |
|||
<el-button |
|||
class="filter-item" |
|||
type="primary" |
|||
:disabled="!checkPermission(['ApiGateway.AggregateRoute.Create'])" |
|||
@click="handleCreateOrEditAggregateRoute()" |
|||
> |
|||
{{ $t('apiGateWay.createAggregateRoute') }} |
|||
</el-button> |
|||
</div> |
|||
|
|||
<el-table |
|||
v-loading="aggregateRouteListLoading" |
|||
row-key="reRouteId" |
|||
:data="aggregateRouteList" |
|||
border |
|||
fit |
|||
highlight-current-row |
|||
style="width: 100%;" |
|||
@sort-change="handleSortChange" |
|||
> |
|||
<el-table-column |
|||
:label="$t('apiGateWay.aggregateRouteName')" |
|||
prop="name" |
|||
sortable |
|||
width="200px" |
|||
align="center" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.name }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('apiGateWay.upstreamPathTemplate')" |
|||
prop="upstreamPathTemplate" |
|||
width="250px" |
|||
align="center" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.upstreamPathTemplate }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('apiGateWay.upstreamHost')" |
|||
prop="upstreamHost" |
|||
width="250px" |
|||
align="center" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span>{{ row.upstreamHost }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('apiGateWay.upstreamHttpMethod')" |
|||
prop="upstreamHttpMethod" |
|||
sortable |
|||
min-width="180" |
|||
align="center" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span> |
|||
<el-tag |
|||
v-for="(method, index) in row.upstreamHttpMethod" |
|||
:key="index" |
|||
:type="method | httpMethodsFilter" |
|||
style="margin-right: 4px;margin-top: 4px;" |
|||
> |
|||
{{ method }} |
|||
</el-tag> |
|||
</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('apiGateWay.reRouteKeys')" |
|||
prop="reRouteKeys" |
|||
width="140px" |
|||
align="center" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<span> |
|||
<el-tag |
|||
v-for="(routeKey) in row.reRouteKeys" |
|||
:key="routeKey" |
|||
style="margin-right: 4px;margin-top: 4px;" |
|||
> |
|||
{{ routeKey }} |
|||
</el-tag> |
|||
</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
:label="$t('operaActions')" |
|||
align="center" |
|||
width="250px" |
|||
fixed="right" |
|||
> |
|||
<template slot-scope="{row}"> |
|||
<el-button |
|||
:disabled="!checkPermission(['ApiGateway.AggregateRoute.Update'])" |
|||
size="mini" |
|||
type="primary" |
|||
@click="handleCreateOrEditAggregateRoute(row.reRouteId, row.name)" |
|||
> |
|||
{{ $t('apiGateWay.updateAggregateRoute') }} |
|||
</el-button> |
|||
<el-button |
|||
:disabled="!checkPermission(['ApiGateway.AggregateRoute.Delete'])" |
|||
size="mini" |
|||
type="warning" |
|||
@click="handleDeleteAggregateRoute(row.reRouteId, row.name)" |
|||
> |
|||
{{ $t('apiGateWay.deleteAggregateRoute') }} |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<Pagination |
|||
v-show="routesCount>0" |
|||
:total="routesCount" |
|||
:page.sync="aggregateRouteGetPagedFilter.skipCount" |
|||
:limit.sync="aggregateRouteGetPagedFilter.maxResultCount" |
|||
@pagination="handleGetAggregateRoutes" |
|||
@sort-change="handleSortChange" |
|||
/> |
|||
|
|||
<el-dialog |
|||
v-el-draggable-dialog |
|||
width="800px" |
|||
:visible.sync="showEditAggregateRouteDialog" |
|||
:title="editRouteTitle" |
|||
custom-class="modal-form" |
|||
:show-close="false" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
> |
|||
<AggregateRouteCreateOrEditForm |
|||
:aggregate-route-id="editAggregateRouteId" |
|||
:app-id-options="routeGroupAppIdOptions" |
|||
@closed="handleAggregateRouteEditFormClosed" |
|||
/> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import { checkPermission } from '@/utils/permission' |
|||
import { Component, Vue } from 'vue-property-decorator' |
|||
import Pagination from '@/components/Pagination/index.vue' |
|||
import AggregateRouteCreateOrEditForm from './components/AggregateRouteCreateOrEditForm.vue' |
|||
import ApiGatewayService, { RouteGroupAppIdDto, AggregateReRoute, AggregateReRouteGetByPaged } from '@/api/apigateway' |
|||
|
|||
@Component({ |
|||
name: 'AggregateRoute', |
|||
components: { |
|||
Pagination, |
|||
AggregateRouteCreateOrEditForm |
|||
}, |
|||
methods: { |
|||
checkPermission |
|||
}, |
|||
filters: { |
|||
httpMethodsFilter(httpMethod: string) { |
|||
const statusMap: { [key: string]: string } = { |
|||
GET: '', |
|||
POST: 'success', |
|||
PUT: 'warning', |
|||
PATCH: 'warning', |
|||
DELETE: 'danger' |
|||
} |
|||
return statusMap[httpMethod.toUpperCase()] |
|||
} |
|||
} |
|||
}) |
|||
export default class extends Vue { |
|||
private editAggregateRouteId: string |
|||
private routesCount: number |
|||
private editRouteTitle: any |
|||
private aggregateRouteList: AggregateReRoute[] |
|||
private aggregateRouteListLoading: boolean |
|||
private showEditAggregateRouteDialog: boolean |
|||
private aggregateRouteGetPagedFilter: AggregateReRouteGetByPaged |
|||
private routeGroupAppIdOptions: RouteGroupAppIdDto[] |
|||
|
|||
constructor() { |
|||
super() |
|||
this.editAggregateRouteId = '' |
|||
this.routesCount = 0 |
|||
this.editRouteTitle = '' |
|||
this.aggregateRouteListLoading = false |
|||
this.showEditAggregateRouteDialog = false |
|||
this.aggregateRouteList = new Array<AggregateReRoute>() |
|||
this.aggregateRouteGetPagedFilter = new AggregateReRouteGetByPaged() |
|||
this.routeGroupAppIdOptions = new Array<RouteGroupAppIdDto>() |
|||
} |
|||
|
|||
mounted() { |
|||
ApiGatewayService.getRouteGroupAppIds().then(appKeys => { |
|||
this.routeGroupAppIdOptions = appKeys.items |
|||
}) |
|||
} |
|||
|
|||
private handleGetAggregateRoutes() { |
|||
if (this.aggregateRouteGetPagedFilter.appId) { |
|||
this.aggregateRouteListLoading = true |
|||
ApiGatewayService.getAggregateReRoutes(this.aggregateRouteGetPagedFilter).then(routes => { |
|||
this.aggregateRouteList = routes.items |
|||
this.routesCount = routes.totalCount |
|||
}).finally(() => { |
|||
this.aggregateRouteListLoading = false |
|||
}) |
|||
} else { |
|||
const errorMessage = this.$t('apiGateWay.appIdHasRequired').toString() |
|||
this.$message.warning(errorMessage) |
|||
} |
|||
} |
|||
|
|||
private handleSortChange(column: any) { |
|||
this.aggregateRouteGetPagedFilter.sorting = column.prop |
|||
} |
|||
|
|||
private handleDeleteAggregateRoute(reRouteId: string, name: string) { |
|||
this.$confirm(this.l('apiGateWay.deleteAggregateRouteByName', { name: name }), |
|||
this.l('apiGateWay.deleteAggregateRoute'), { |
|||
callback: (action) => { |
|||
if (action === 'confirm') { |
|||
ApiGatewayService.deleteAggregateReRoute(reRouteId).then(() => { |
|||
this.$message.success(this.l('apiGateWay.deleteAggregateRouteSuccess', { name: name })) |
|||
this.handleGetAggregateRoutes() |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
} |
|||
|
|||
private handleCreateOrEditAggregateRoute(reRouteId: string, name: string) { |
|||
this.editAggregateRouteId = reRouteId |
|||
this.editRouteTitle = this.$t('apiGateWay.createAggregateRoute') |
|||
if (reRouteId) { |
|||
this.editRouteTitle = this.$t('apiGateWay.updateAggregateRouteByName', { name: name }) |
|||
} |
|||
this.showEditAggregateRouteDialog = true |
|||
} |
|||
|
|||
private handleAggregateRouteEditFormClosed(changed: boolean) { |
|||
this.editAggregateRouteId = '' |
|||
this.editRouteTitle = '' |
|||
this.showEditAggregateRouteDialog = false |
|||
if (changed && this.aggregateRouteGetPagedFilter.appId) { |
|||
this.handleGetAggregateRoutes() |
|||
} |
|||
} |
|||
|
|||
private l(name: string, values?: any[] | { [key: string]: any }) { |
|||
return this.$t(name, values).toString() |
|||
} |
|||
} |
|||
</script> |
|||
@ -0,0 +1,197 @@ |
|||
<template> |
|||
<el-form |
|||
ref="formAggregateRoute" |
|||
label-width="100px" |
|||
:model="aggregateRoute" |
|||
> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<el-form-item |
|||
v-if="!isEditRoute" |
|||
prop="appId" |
|||
:label="$t('apiGateWay.appId')" |
|||
> |
|||
<el-select |
|||
v-model="aggregateRoute.appId" |
|||
style="width: 100%" |
|||
:placeholder="$t('pleaseSelectBy', {name: $t('apiGateWay.appId')})" |
|||
> |
|||
<el-option |
|||
v-for="item in appIdOptions" |
|||
:key="item.appId" |
|||
:label="item.appName" |
|||
:value="item.appId" |
|||
/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<el-form-item |
|||
prop="name" |
|||
:label="$t('apiGateWay.aggregateRouteName')" |
|||
> |
|||
<el-input |
|||
v-model="aggregateRoute.name" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.aggregateRouteName')})" |
|||
/> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item |
|||
prop="priority" |
|||
:label="$t('apiGateWay.priority')" |
|||
> |
|||
<el-input |
|||
v-model="aggregateRoute.priority" |
|||
type="number" |
|||
/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="16"> |
|||
<el-form-item |
|||
prop="upstreamHost" |
|||
:label="$t('apiGateWay.upstreamHost')" |
|||
> |
|||
<el-input |
|||
v-model="aggregateRoute.upstreamHost" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.upstreamHost')})" |
|||
/> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item |
|||
prop="reRouteIsCaseSensitive" |
|||
:label="$t('apiGateWay.reRouteIsCaseSensitive')" |
|||
> |
|||
<el-switch |
|||
v-model="aggregateRoute.reRouteIsCaseSensitive" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.reRouteIsCaseSensitive')})" |
|||
/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-form-item |
|||
prop="upstreamPathTemplate" |
|||
:label="$t('apiGateWay.upstreamPathTemplate')" |
|||
> |
|||
<el-input |
|||
v-model="aggregateRoute.upstreamPathTemplate" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.upstreamPathTemplate')})" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
prop="upstreamHttpMethod" |
|||
:label="$t('apiGateWay.upstreamHttpMethod')" |
|||
> |
|||
<el-input-tag |
|||
v-model="aggregateRoute.upstreamHttpMethod" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.upstreamHttpMethod')})" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item |
|||
prop="reRouteKeys" |
|||
:label="$t('apiGateWay.reRouteKeys')" |
|||
> |
|||
<el-input-tag |
|||
v-model="aggregateRoute.reRouteKeys" |
|||
:placeholder="$t('pleaseInputBy', {key: $t('apiGateWay.reRouteKeys')})" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button |
|||
class="cancel" |
|||
style="width:100px;right: 120px;position: absolute;" |
|||
@click="onCancel" |
|||
> |
|||
{{ $t('global.cancel') }} |
|||
</el-button> |
|||
<el-button |
|||
class="confirm" |
|||
type="primary" |
|||
style="width:100px;right: 10px;position: absolute;" |
|||
@click="onSaveAggregateRoute" |
|||
> |
|||
{{ $t('global.confirm') }} |
|||
</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import ElInputTag from '@/components/InputTag/index.vue' |
|||
import { Component, Prop, Vue, Watch } from 'vue-property-decorator' |
|||
import ApiGatewayService, { RouteGroupAppIdDto, AggregateReRoute, AggregateReRouteCreate, AggregateReRouteUpdate } from '@/api/apigateway' |
|||
|
|||
@Component({ |
|||
name: 'AggregateRouteCreateOrEditForm', |
|||
components: { |
|||
ElInputTag |
|||
} |
|||
}) |
|||
export default class extends Vue { |
|||
@Prop({ default: '' }) |
|||
private aggregateRouteId!: string |
|||
|
|||
@Prop({ default: () => new Array<RouteGroupAppIdDto>() }) |
|||
private appIdOptions!: RouteGroupAppIdDto[] |
|||
|
|||
private aggregateRoute: AggregateReRoute |
|||
|
|||
get isEditRoute() { |
|||
if (this.aggregateRouteId) { |
|||
return true |
|||
} |
|||
return false |
|||
} |
|||
|
|||
constructor() { |
|||
super() |
|||
this.aggregateRoute = AggregateReRoute.empty() |
|||
} |
|||
|
|||
@Watch('aggregateRouteId', { immediate: true }) |
|||
private onAggregateRouteIdChanged() { |
|||
if (this.aggregateRouteId) { |
|||
ApiGatewayService.getAggregateReRouteByRouteId(this.aggregateRouteId).then(aggregateRoute => { |
|||
this.aggregateRoute = aggregateRoute |
|||
}) |
|||
} else { |
|||
this.aggregateRoute = AggregateReRoute.empty() |
|||
} |
|||
} |
|||
|
|||
private onSaveAggregateRoute() { |
|||
if (this.isEditRoute) { |
|||
const updateAggregateRoute = AggregateReRouteUpdate.create(this.aggregateRoute) |
|||
ApiGatewayService.updateAggregateReRoute(updateAggregateRoute).then(route => { |
|||
this.aggregateRoute = route |
|||
this.reset() |
|||
this.$emit('closed', true) |
|||
}) |
|||
} else { |
|||
const createAggregateRoute = AggregateReRouteCreate.create(this.aggregateRoute) |
|||
ApiGatewayService.createAggregateReRoute(createAggregateRoute).then(route => { |
|||
this.aggregateRoute = route |
|||
this.reset() |
|||
this.$emit('closed', true) |
|||
}) |
|||
} |
|||
} |
|||
|
|||
private onCancel() { |
|||
this.reset() |
|||
this.$emit('closed', false) |
|||
} |
|||
|
|||
private reset() { |
|||
this.aggregateRoute = AggregateReRoute.empty() |
|||
const formAggregateRoute = this.$refs.formAggregateRoute as any |
|||
formAggregateRoute.resetFields() |
|||
} |
|||
} |
|||
</script> |
|||
Loading…
Reference in new issue