dashboard/shell/edit/provisioning.cattle.io.cluster/ACE.vue

88 lines
2.0 KiB
Vue

<script>
import { RadioGroup } from '@components/Form/Radio';
import { LabeledInput } from '@components/Form/LabeledInput';
import FileSelector, { createOnSelected } from '@shell/components/form/FileSelector';
import { set } from '@shell/utils/object';
import isEmpty from 'lodash/isEmpty';
export default {
components: {
RadioGroup, LabeledInput, FileSelector
},
props: {
mode: {
type: String,
required: true,
},
value: {
type: Object,
required: true,
},
},
data() {
if ( isEmpty(this.value?.spec?.localClusterAuthEndpoint) ) {
set(this.value, 'spec.localClusterAuthEndpoint', {
enabled: false,
caCerts: '',
fqdn: '',
});
}
return {};
},
computed: {
config() {
return this.value.spec.localClusterAuthEndpoint;
},
},
methods: { onCertSelected: createOnSelected('config.caCerts') }
};
</script>
<template>
<div>
<h3 v-t="'cluster.tabs.ace'" />
<RadioGroup
v-model="config.enabled"
name="enabled"
:options="[false, true]"
:labels="[t('generic.disabled'), t('generic.enabled')]"
:mode="mode"
/>
<template v-if="config.enabled">
<div class="row mb-20">
<div class="col span-6">
<LabeledInput
v-model="config.fqdn"
:mode="mode"
label="FQDN"
:tooltip="t('cluster.rke2.address.fqdn.toolTip')"
/>
</div>
<div class="col span-6">
<LabeledInput
v-model="config.caCerts"
:mode="mode"
:label="t('cluster.rke2.address.caCerts.label')"
type="multiline"
:tooltip="t('cluster.rke2.address.caCerts.toolTip')"
/>
<FileSelector
:mode="mode"
class="btn btn-sm bg-primary mt-10"
:label="t('generic.readFromFile')"
@selected="onCertSelected"
/>
</div>
</div>
</template>
</div>
</template>