cKey
6 years ago
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 Newtonsoft.Json; |
||||
using System; |
using System; |
||||
|
using System.Collections.Generic; |
||||
|
|
||||
namespace LINGYUN.ApiGateway.Ocelot |
namespace LINGYUN.ApiGateway.Ocelot |
||||
{ |
{ |
||||
[Serializable] |
[Serializable] |
||||
public class AggregateReRouteDto : AggregateReRouteDtoBase |
public class AggregateReRouteDto : AggregateReRouteDtoBase |
||||
{ |
{ |
||||
|
public string AppId { get; set; } |
||||
|
|
||||
[JsonConverter(typeof(HexLongConverter))] |
[JsonConverter(typeof(HexLongConverter))] |
||||
public long ReRouteId { get; set; } |
public long ReRouteId { get; set; } |
||||
|
|
||||
|
public string Name { get; set; } |
||||
|
|
||||
|
public string ConcurrencyStamp { get; set; } |
||||
|
|
||||
|
public List<AggregateReRouteConfigDto> ReRouteKeysConfig { get; set; } |
||||
|
|
||||
public AggregateReRouteDto() |
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