jcloud/dashboard/src2/views/server/EditServerTitleDialog.vue

64 lines
1.2 KiB
Vue

<template>
<Dialog
:options="{
title: 'Edit Title',
actions: [
{
label: 'Update',
variant: 'solid',
loading: $resources.editTitle.loading,
onClick: () => $resources.editTitle.submit()
}
]
}"
v-model="show"
>
<template v-slot:body-content>
<FormControl label="Title" type="text" v-model="serverTitle" />
<ErrorMessage class="mt-4" :message="$resources.editTitle.error" />
</template>
</Dialog>
</template>
<script>
export default {
name: 'EditServerTitleDialog',
props: ['modelValue', 'server'],
emits: ['update:modelValue'],
data() {
return {
serverTitle: this.server.title
};
},
resources: {
editTitle() {
return {
url: 'jcloud.api.server.rename',
params: {
name: this.server?.name,
title: this.serverTitle
},
validate() {
if (this.serverTitle === this.server?.title) {
return 'No changes in server title';
}
},
onSuccess() {
this.show = false;
this.server.title = this.serverTitle;
}
};
}
},
computed: {
show: {
get() {
return this.modelValue;
},
set(value) {
this.$emit('update:modelValue', value);
}
}
}
};
</script>