feat(tf): ui for state

This commit is contained in:
Denis Gukov 2024-12-09 17:21:26 +05:00
parent 76a892573d
commit 79f71f8e8a
4 changed files with 67 additions and 6 deletions

View File

@ -28,7 +28,7 @@ func SetTerraformInventoryAliasAccessKey(w http.ResponseWriter, r *http.Request)
} }
func GetTerraformInventoryStates(w http.ResponseWriter, r *http.Request) { func GetTerraformInventoryStates(w http.ResponseWriter, r *http.Request) {
w.WriteHeader(http.StatusNotFound) helpers.WriteJSON(w, http.StatusOK, []string{})
} }
func AddTerraformInventoryState(w http.ResponseWriter, r *http.Request) { func AddTerraformInventoryState(w http.ResponseWriter, r *http.Request) {

View File

@ -0,0 +1,12 @@
<template>
<div></div>
</template>
<script>
export default {
data() {
return {
};
},
};
</script>

View File

@ -189,6 +189,7 @@ export default {
sortable: false, sortable: false,
}]; }];
}, },
getItemsUrl() { getItemsUrl() {
return `/api/project/${this.projectId}/inventory`; return `/api/project/${this.projectId}/inventory`;
}, },

View File

@ -12,17 +12,23 @@
class="ml-2" class="ml-2"
color="hsl(348deg, 86%, 61%)" color="hsl(348deg, 86%, 61%)"
href="https://semaphoreui.com/pro" href="https://semaphoreui.com/pro"
>Upgrade</v-btn> >Upgrade
</v-btn>
</v-alert> </v-alert>
<div class="px-4 py-3"> <div class="px-4 py-3">
<div v-for="alias of (aliases || [])" :key="alias.id"> <div v-for="alias of (aliases || [])" :key="alias.id">
<code class="mr-2">{{ alias.url }}</code> <code class="mr-2">{{ alias.url }}</code>
<v-btn icon <v-btn
@click="copyToClipboard(alias.url, $t('aliasUrlCopied'))"> icon
@click="copyToClipboard(alias.url, $t('aliasUrlCopied'))"
>
<v-icon>mdi-content-copy</v-icon> <v-icon>mdi-content-copy</v-icon>
</v-btn> </v-btn>
<v-btn icon @click="deleteAlias(alias.id)" :disabled="!premiumFeatures.terraform_backend"> <v-btn icon @click="editAlias(alias.id)">
<v-icon>mdi-pencil</v-icon>
</v-btn>
<v-btn icon @click="deleteAlias(alias.id)">
<v-icon>mdi-delete</v-icon> <v-icon>mdi-delete</v-icon>
</v-btn> </v-btn>
</div> </div>
@ -32,6 +38,26 @@
</v-btn> </v-btn>
</div> </div>
<v-data-table
:headers="headers"
:items="states"
:footer-props="{ itemsPerPageOptions: [20] }"
class="mt-0"
>
<template v-slot:item.id="{ item }">
<router-link
to="`/project/${item.project_id}/templates/${item.id}/terraform/state/${item.id}`"
>
{{ item.id }}
</router-link>
</template>
<template v-slot:item.actions="{ item }">
<v-btn icon class="pl-1 pr-2" @click="deleteState(item)">
<v-icon class="pr-1">mdi-trash</v-icon>
</v-btn>
</template>
</v-data-table>
</div> </div>
</template> </template>
<script> <script>
@ -46,11 +72,25 @@ export default {
inventory: Array, inventory: Array,
environment: Array, environment: Array,
premiumFeatures: Object, premiumFeatures: Object,
states: Array,
}, },
data() { data() {
return { return {
aliases: null, headers: [{
text: 'ID',
value: 'id',
sortable: false,
}, {
text: 'Task',
value: 'task_id',
sortable: false,
}, {
text: 'Actions',
value: '',
sortable: false,
}],
aliases: [],
}; };
}, },
@ -59,6 +99,10 @@ export default {
}, },
methods: { methods: {
deleteState(id) {
console.log(id);
},
async loadAliases() { async loadAliases() {
this.aliases = (await axios({ this.aliases = (await axios({
method: 'get', method: 'get',
@ -67,6 +111,10 @@ export default {
})).data; })).data;
}, },
editAlias(alias) {
console.log(alias);
},
async deleteAlias(alias) { async deleteAlias(alias) {
await axios({ await axios({
method: 'delete', method: 'delete',