chore: Update buttons in labels page (#11126)
This commit is contained in:
@@ -5,7 +5,12 @@ import validations, { getLabelTitleErrorMessage } from './validations';
|
||||
import { getRandomColor } from 'dashboard/helper/labelColor';
|
||||
import { useVuelidate } from '@vuelidate/core';
|
||||
|
||||
import NextButton from 'dashboard/components-next/button/Button.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
NextButton,
|
||||
},
|
||||
props: {
|
||||
prefillTitle: {
|
||||
type: String,
|
||||
@@ -105,16 +110,20 @@ export default {
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex items-center justify-end w-full gap-2 px-0 py-2">
|
||||
<woot-button
|
||||
:is-disabled="v$.title.$invalid || uiFlags.isCreating"
|
||||
:is-loading="uiFlags.isCreating"
|
||||
<NextButton
|
||||
faded
|
||||
slate
|
||||
type="reset"
|
||||
:label="$t('LABEL_MGMT.FORM.CANCEL')"
|
||||
@click.prevent="onClose"
|
||||
/>
|
||||
<NextButton
|
||||
type="submit"
|
||||
data-testid="label-submit"
|
||||
>
|
||||
{{ $t('LABEL_MGMT.FORM.CREATE') }}
|
||||
</woot-button>
|
||||
<woot-button class="button clear" @click.prevent="onClose">
|
||||
{{ $t('LABEL_MGMT.FORM.CANCEL') }}
|
||||
</woot-button>
|
||||
:label="$t('LABEL_MGMT.FORM.CREATE')"
|
||||
:disabled="v$.title.$invalid || uiFlags.isCreating"
|
||||
:is-loading="uiFlags.isCreating"
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@@ -4,7 +4,12 @@ import { useAlert } from 'dashboard/composables';
|
||||
import validations, { getLabelTitleErrorMessage } from './validations';
|
||||
import { useVuelidate } from '@vuelidate/core';
|
||||
|
||||
import NextButton from 'dashboard/components-next/button/Button.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
NextButton,
|
||||
},
|
||||
props: {
|
||||
selectedResponse: {
|
||||
type: Object,
|
||||
@@ -109,15 +114,19 @@ export default {
|
||||
</label>
|
||||
</div>
|
||||
<div class="flex items-center justify-end w-full gap-2 px-0 py-2">
|
||||
<woot-button
|
||||
:is-disabled="v$.title.$invalid || uiFlags.isUpdating"
|
||||
<NextButton
|
||||
faded
|
||||
slate
|
||||
type="reset"
|
||||
:label="$t('LABEL_MGMT.FORM.CANCEL')"
|
||||
@click.prevent="onClose"
|
||||
/>
|
||||
<NextButton
|
||||
type="submit"
|
||||
:label="$t('LABEL_MGMT.FORM.EDIT')"
|
||||
:disabled="v$.title.$invalid || uiFlags.isUpdating"
|
||||
:is-loading="uiFlags.isUpdating"
|
||||
>
|
||||
{{ $t('LABEL_MGMT.FORM.EDIT') }}
|
||||
</woot-button>
|
||||
<woot-button class="button clear" @click.prevent="onClose">
|
||||
{{ $t('LABEL_MGMT.FORM.CANCEL') }}
|
||||
</woot-button>
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@@ -8,6 +8,7 @@ import AddLabel from './AddLabel.vue';
|
||||
import EditLabel from './EditLabel.vue';
|
||||
import BaseSettingsHeader from '../components/BaseSettingsHeader.vue';
|
||||
import SettingsLayout from '../SettingsLayout.vue';
|
||||
import Button from 'dashboard/components-next/button/Button.vue';
|
||||
|
||||
const getters = useStoreGetters();
|
||||
const store = useStore();
|
||||
@@ -94,13 +95,11 @@ onBeforeMount(() => {
|
||||
feature-name="labels"
|
||||
>
|
||||
<template #actions>
|
||||
<woot-button
|
||||
class="rounded-md button nice"
|
||||
icon="add-circle"
|
||||
<Button
|
||||
icon="i-lucide-circle-plus"
|
||||
:label="$t('LABEL_MGMT.HEADER_BTN_TXT')"
|
||||
@click="openAddPopup"
|
||||
>
|
||||
{{ $t('LABEL_MGMT.HEADER_BTN_TXT') }}
|
||||
</woot-button>
|
||||
/>
|
||||
</template>
|
||||
</BaseSettingsHeader>
|
||||
</template>
|
||||
@@ -140,23 +139,21 @@ onBeforeMount(() => {
|
||||
</td>
|
||||
<td class="py-4 min-w-xs">
|
||||
<div class="flex gap-1 justify-end">
|
||||
<woot-button
|
||||
<Button
|
||||
v-tooltip.top="$t('LABEL_MGMT.FORM.EDIT')"
|
||||
variant="smooth"
|
||||
size="tiny"
|
||||
color-scheme="secondary"
|
||||
class-names="grey-btn"
|
||||
icon="i-lucide-pen"
|
||||
slate
|
||||
xs
|
||||
faded
|
||||
:is-loading="loading[label.id]"
|
||||
icon="edit"
|
||||
@click="openEditPopup(label)"
|
||||
/>
|
||||
<woot-button
|
||||
<Button
|
||||
v-tooltip.top="$t('LABEL_MGMT.FORM.DELETE')"
|
||||
variant="smooth"
|
||||
color-scheme="alert"
|
||||
size="tiny"
|
||||
icon="dismiss-circle"
|
||||
class-names="grey-btn"
|
||||
icon="i-lucide-trash-2"
|
||||
xs
|
||||
ruby
|
||||
faded
|
||||
:is-loading="loading[label.id]"
|
||||
@click="openDeletePopup(label, index)"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user