Skip to content

Commit

Permalink
Merge pull request #89 from grycap/master
Browse files Browse the repository at this point in the history 
Changes in exposed services form
  • Loading branch information
@catttam
catttam authored Aug 3, 2023
2 parents 603a64d + e379086 commit 67108ef
Show file tree
Hide file tree
Showing 2 changed files with 94 additions and 44 deletions.
134 changes: 92 additions & 42 deletions src/components/forms/FunctionForm.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -179,6 +179,7 @@

<v-flex xs12 id="panel">
<v-container>
<div class="separator" style="margin-top: 0;">Docker</div>
<v-layout row wrap>
<div class="form-group" style="width:100%">
<div class="input-group">
Expand Down Expand Up @@ -210,7 +211,7 @@
</div>
</div>

<v-flex xs12 sm5 style="padding-top:10px; ">
<v-flex xs12 sm12 style="padding-top:10px; ">
<div>
<span class="v-label theme--light" aria-hidden="true"
style="left: 0px; right: auto; margin-right: 10px;" >
Expand All @@ -219,7 +220,27 @@
<v-switch v-model="form.image_prefetch" style="display:inline-block;"></v-switch>
</div>
</v-flex>
<v-flex xs12 sm5 style="padding-top:10px;">
<v-select
:items="form.log_level"
label="LOG LEVEL"
v-model="select_logLevel"
></v-select>
</v-flex>


<v-flex class="text-center" xs12 sm5 style="padding-top:10px; margin-left: 10px;">
<div>
<span class="v-label theme--light" aria-hidden="true"
style="left: 0px; right: auto; margin-right: 10px;" >
Is your image based on Alpine?
</span>
<v-switch v-model="form.alpine" style="display:inline-block;"></v-switch>
</div>
</v-flex>
</v-layout>
<div class="separator">Enviroment, Annotation, Label</div>
<v-layout row wrap>
<div class="form-group" style="width:100%">
<div class="input-group">
<v-flex xs12 sm5>
Expand Down Expand Up @@ -378,7 +399,7 @@
</v-list-tile>
</v-list>
</v-flex>

<div class="separator">CPU, Memory</div>
<v-layout row wrap>
<v-flex xs12 sm5>
<v-text-field
Expand All @@ -403,8 +424,10 @@
<option value="2">Gi</option>
</select>
</v-flex>
</v-layout>


<div v-show=" getYunikorn_option == 'true'" class="separator">Yunikorn</div>
<v-layout row wrap v-show=" getYunikorn_option == 'true'" >
<v-flex v-show=" getYunikorn_option == 'true'" xs10 sm5>
<v-text-field
v-model="form.total_cpu"
Expand All @@ -430,26 +453,9 @@
</v-flex>

</v-layout>
<v-layout row wrap>
<v-flex xs12 sm5 style="padding-top:10px;">
<v-select
:items="form.log_level"
label="LOG LEVEL"
v-model="select_logLevel"
></v-select>
</v-flex>


<v-flex class="text-center" xs12 sm5 style="padding-top:10px; margin-left: 10px;">
<div>
<span class="v-label theme--light" aria-hidden="true"
style="left: 0px; right: auto; margin-right: 10px;" >
Is your image based on Alpine?
</span>
<v-switch v-model="form.alpine" style="display:inline-block;"></v-switch>
</div>
</v-flex>


<div v-show=" getGpu_available == 'true'" class="separator">GPU</div>
<v-layout row wrap v-show=" getGpu_available == 'true'" >
<v-flex v-show="getGpu_available== 'true'" class="text-left" xs12 sm5 style="padding-top:10px; margin-left: 0px;">
<div>
<span class="v-label theme--light" aria-hidden="true"
Expand All @@ -460,22 +466,32 @@
</div>
</v-flex>
</v-layout>

<div class="separator">Expose</div>
<v-layout row wrap>

<v-flex xs12 sm5>
<v-text-field
type="number"
v-model="form.expose_options.max_replicas"
label="Number of Replicas"
v-model="form.expose.min_scale"
label="Min Scale"
min="0"
style="padding-right: 5px;"
></v-text-field>
</v-flex>

<v-flex xs12 sm5>
<v-text-field
type="number"
v-model="form.expose_options.port"
v-model="form.expose.max_scale"
label="Max Scale"
min="0"
style="padding-right: 5px;"
></v-text-field>
</v-flex>
<v-flex xs12 sm5>
<v-text-field
type="number"
v-model="form.expose.port"
label="Port"
min="0"
max="65535"
Expand All @@ -485,7 +501,7 @@
<v-flex xs12 sm5>
<v-text-field
type="number"
v-model="form.expose_options.top_cpu"
v-model="form.expose.cpu_threshold"
min="1"
max="100"
label="CPU Limit %"
Expand Down Expand Up @@ -1453,10 +1469,11 @@ export default {
alpine:false,
image_prefetch:false,
enable_gpu:false,
expose_options:{
max_replicas:'',
expose:{
min_scale:'',
max_scale:'',
port:'',
top_cpu:'',
cpu_threshold:'',
},
Expand Down Expand Up @@ -2026,7 +2043,7 @@ export default {
this.files = []
this.url = ""
this.$refs.files.value = null
this.showUploading = false
this.showUploading = falseform
this.showselectEnv = false
this.envVars = {}
this.expand = "expand_more"
Expand All @@ -2043,9 +2060,10 @@ export default {
this.form.limits_memory=''
this.form.image=''
this.form.name=''
this.form.expose_options.max_replicas=""
this.form.expose_options.port=''
this.form.expose_options.top_cpu=''
this.form.expose.min_scale=""
this.form.expose.max_scale=""
this.form.expose.port=''
this.form.expose.cpu_threshold=''
},
clear () {
this.files = []
Expand Down Expand Up @@ -2169,9 +2187,10 @@ export default {
'alpine':this.form.alpine,
'image_prefetch':this.form.image_prefetch,
'enable_gpu':this.form.enable_gpu,
'expose_options':{'max_replicas':parseInt(this.form.expose_options.max_replicas),
'port':parseInt(this.form.expose_options.port),
'top_cpu':parseInt(this.form.expose_options.top_cpu)}
'expose':{ 'min_scale':parseInt(this.form.expose.min_scale),
'max_scale':parseInt(this.form.expose.max_scale),
'port':parseInt(this.form.expose.port),
'cpu_threshold':parseInt(this.form.expose.cpu_threshold)}
}
if(localStorage.getItem('yunikorn_enable') == "true"){
Expand Down Expand Up @@ -2292,9 +2311,18 @@ export default {
}
this.form.alpine=data.alpine
this.form.image_prefetch=data.image_prefetch
this.form.expose_options.max_replicas=data.expose_options.max_replicas
this.form.expose_options.port=data.expose_options.port
this.form.expose_options.top_cpu=data.expose_options.top_cpu
if( data.expose.min_scale == 0 && data.expose.max_scale==0 &&
data.expose.port==0 && data.expose.cpu_threshold ==0){
this.form.expose.min_scale=''
this.form.expose.max_scale=''
this.form.expose.port=''
this.form.expose.cpu_threshold=''
}else{
this.form.expose.min_scale=data.expose.min_scale
this.form.expose.max_scale=data.expose.max_scale
this.form.expose.port=data.expose.port
this.form.expose.cpu_threshold=data.expose.cpu_threshold
}
if(localStorage.getItem('gpu_available')== "true" && data.enable_gpu != undefined ){
this.form.enable_gpu=data.enable_gpu
}
Expand Down Expand Up @@ -2476,7 +2504,7 @@ export default {
height: calc(2.25rem + 3px);
width: 100%
}
}
}5
/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
Expand All @@ -2488,4 +2516,26 @@ export default {
padding-bottom:20px;
}
}
.separator {
margin-top: 6%;
display: flex;
align-items: center;
text-align: center;
}
.separator::before,
.separator::after {
content: '';
flex: 1;
border-bottom: 1px solid #000;
}
.separator:not(:empty)::before {
margin-right: .25em;
}
.separator:not(:empty)::after {
margin-left: .25em;
}
</style>
4 changes: 2 additions & 2 deletions src/views/Functions.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -353,7 +353,7 @@ export default {
total_memory:this.services[index].total_memory,
total_cpu:this.services[index].total_cpu,
alpine:this.services[index].alpine,
expose_options:this.services[index].expose_options,
expose:this.services[index].expose,
image_prefetch:this.services[index].image_prefetch,
enable_gpu:this.services[index].enable_gpu
}
Expand Down Expand Up @@ -401,7 +401,7 @@ export default {
total_memory: serv.total_memory,
alpine: serv.alpine,
image_prefetch: serv.image_prefetch,
expose_options:serv.expose_options,
expose:serv.expose,
enable_gpu: serv.enable_gpu
}
})
Expand Down

0 comments on commit 67108ef

Please sign in to comment.