fix: monaco editor

fix: apex charts
This commit is contained in:
Andras Bacsai
2024-06-24 11:21:39 +02:00
parent f2c8a6bac5
commit 5201818f52
12 changed files with 492 additions and 582 deletions

View File

@@ -73,7 +73,7 @@
<option value="www">Redirect to www.</option>
<option value="non-www">Redirect to non-www.</option>
</x-forms.select>
<x-modal-confirmation action="set_redirect" >
<x-modal-confirmation action="set_redirect">
<x-slot:customButton>
<div class="w-[7.2rem]">Set Direction</div>
</x-slot:customButton>
@@ -231,10 +231,12 @@
@if ($application->settings->is_raw_compose_deployment_enabled)
<x-forms.textarea rows="10" readonly id="application.docker_compose_raw"
label="Docker Compose Content (applicationId: {{ $application->id }})"
helper="You need to modify the docker compose file." />
helper="You need to modify the docker compose file." monacoEditorLanguage="yaml"
useMonacoEditor />
@else
<x-forms.textarea rows="10" readonly id="application.docker_compose"
label="Docker Compose Content" helper="You need to modify the docker compose file." />
label="Docker Compose Content" helper="You need to modify the docker compose file."
monacoEditorLanguage="yaml" useMonacoEditor />
@endif
<div class="w-72">
<x-forms.checkbox label="Escape special characters in labels?"
@@ -246,7 +248,8 @@
@endif
@if ($application->dockerfile)
<x-forms.textarea label="Dockerfile" id="application.dockerfile" monacoEditorLanguage="dockerfile" useMonacoEditor="{{true}}" rows="6"> </x-forms.textarea>
<x-forms.textarea label="Dockerfile" id="application.dockerfile" monacoEditorLanguage="dockerfile"
useMonacoEditor rows="6"> </x-forms.textarea>
@endif
@if ($application->build_pack !== 'dockercompose')
<h3 class="pt-8">Network</h3>
@@ -263,7 +266,9 @@
helper="A comma separated list of ports you would like to map to the host system. Useful when you do not want to use domains.<br><br><span class='inline-block font-bold dark:text-warning'>Example:</span><br>3000:3000,3002:3002<br><br>Rolling update is not supported if you have a port mapped to the host." />
@endif
</div>
<x-forms.textarea label="Container Labels" rows="15" id="customLabels"></x-forms.textarea>
<x-forms.textarea label="Container Labels" rows="15" id="customLabels"
monacoEditorLanguage="ini" useMonacoEditor></x-forms.textarea>
<div class="w-72">
<x-forms.checkbox label="Escape special characters in labels?"
helper="By default, $ (and other chars) is escaped. So if you write $ in the labels, it will be saved as $$.<br><br>If you want to use env variables inside the labels, turn this off."

View File

@@ -6,7 +6,8 @@
<h2>Docker Compose</h2>
<x-forms.button type="submit">Save</x-forms.button>
</div>
<x-forms.textarea useMonacoEditor="{{true}}" monacoEditorLanguage="yaml" label="Docker Compose file" rows="20" id="dockerComposeRaw"
<x-forms.textarea useMonacoEditor monacoEditorLanguage="yaml" label="Docker Compose file" rows="20"
id="dockerComposeRaw"
placeholder='services:
ghost:
documentation: https://ghost.org/docs/config

View File

@@ -60,78 +60,4 @@
@endforelse
</div>
@endif
{{-- <section x-data="apex_app" class="container p-5 mx-auto my-20 bg-white drop-shadow-xl rounded-xl">
<div class="w-full" x-ref="chart"></div>
</section>
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<script>
document.addEventListener("alpine:init", () => {
Alpine.data("apex_app", () => ({
data: @js($cpu),
init() {
let chart = new ApexCharts(this.$refs.chart, this.options);
chart.render();
this.$watch("data", () => {
chart.updateOptions(this.options);
});
},
get options() {
return {
colors: [function({
value,
seriesIndex,
w
}) {
if (value < 55) {
return '#7E36AF'
} else {
return '#D9534F'
}
}, function({
value,
seriesIndex,
w
}) {
if (value < 111) {
return '#7E36AF'
} else {
return '#D9534F'
}
}],
xaxis: {
type: 'datetime'
},
dataLabels: {
enabled: false
},
series: [{
name: "Series name",
data: this.data
}],
tooltip: {
enabled: true
},
chart: {
stroke: {
curve: 'smooth',
},
height: 500,
width: "100%",
type: "line",
toolbar: {
show: true
},
animations: {
initialAnimation: {
enabled: false
}
}
},
};
}
}));
});
</script> --}}
</div>

View File

@@ -40,15 +40,15 @@
id: '{!! $chartId !!}-cpu',
type: 'area',
toolbar: {
show: false,
show: true,
tools: {
download: true,
download: false,
selection: false,
zoom: false,
zoom: true,
zoomin: false,
zoomout: false,
pan: false,
reset: false
reset: true
},
},
animations: {
@@ -77,6 +77,7 @@
type: 'datetime',
},
series: [{
name: "CPU %",
data: []
}],
noData: {
@@ -86,7 +87,10 @@
}
},
tooltip: {
enabled: false,
enabled: true,
marker: {
show: false,
}
},
legend: {
show: false
@@ -145,15 +149,15 @@
id: '{!! $chartId !!}-memory',
type: 'area',
toolbar: {
show: false,
show: true,
tools: {
download: true,
download: false,
selection: false,
zoom: false,
zoom: true,
zoomin: false,
zoomout: false,
pan: false,
reset: false
reset: true
},
},
animations: {
@@ -188,6 +192,7 @@
}
},
series: [{
name: "Memory (MB)",
data: []
}],
noData: {
@@ -197,7 +202,10 @@
}
},
tooltip: {
enabled: false,
enabled: true,
marker: {
show: false,
}
},
legend: {
show: false