scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 20:18:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Update buttons in canned response page (#11121)

Browse Source
This commit is contained in:
Sivin Varghese
2025-03-20 19:03:53 +05:30
committed by GitHub
parent 46297ce85e
commit b2debdc912
3 changed files with 42 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/javascript/dashboard/routes/dashboard/settings/canned/AddCanned.vue
View File

@@ -3,14 +3,14 @@ import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators'; import { required, minLength } from '@vuelidate/validators';
import { useAlert } from 'dashboard/composables'; import { useAlert } from 'dashboard/composables';
import WootSubmitButton from '../../../../components/buttons/FormSubmitButton.vue'; import NextButton from 'dashboard/components-next/button/Button.vue';
import Modal from '../../../../components/Modal.vue'; import Modal from '../../../../components/Modal.vue';
import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue'; import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
export default { export default {
name: 'AddCanned', name: 'AddCanned',
components: { components: {
WootSubmitButton, NextButton,
Modal, Modal,
WootMessageEditor, WootMessageEditor,
}, },
@@ -118,18 +118,23 @@ export default {
</div> </div>
</div> </div>
<div class="flex flex-row justify-end w-full gap-2 px-0 py-2"> <div class="flex flex-row justify-end w-full gap-2 px-0 py-2">
<WootSubmitButton <NextButton
faded
slate
type="reset"
:label="$t('CANNED_MGMT.ADD.CANCEL_BUTTON_TEXT')"
@click.prevent="onClose"
/>
<NextButton
type="submit"
:label="$t('CANNED_MGMT.ADD.FORM.SUBMIT')"
:disabled=" :disabled="
v$.content.$invalid || v$.content.$invalid ||
v$.shortCode.$invalid || v$.shortCode.$invalid ||
addCanned.showLoading addCanned.showLoading
" "
:button-text="$t('CANNED_MGMT.ADD.FORM.SUBMIT')" :is-loading="addCanned.showLoading"
:loading="addCanned.showLoading"
/> />
<button class="button clear" @click.prevent="onClose">
{{ $t('CANNED_MGMT.ADD.CANCEL_BUTTON_TEXT') }}
</button>
</div> </div>
</form> </form>
</div> </div>

21
app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue
View File

@@ -4,12 +4,12 @@ import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators'; import { required, minLength } from '@vuelidate/validators';
import { useAlert } from 'dashboard/composables'; import { useAlert } from 'dashboard/composables';
import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue'; import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
import WootSubmitButton from '../../../../components/buttons/FormSubmitButton.vue'; import NextButton from 'dashboard/components-next/button/Button.vue';
import Modal from '../../../../components/Modal.vue'; import Modal from '../../../../components/Modal.vue';
export default { export default {
components: { components: {
WootSubmitButton, NextButton,
Modal, Modal,
WootMessageEditor, WootMessageEditor,
}, },
@@ -122,18 +122,23 @@ export default {
</div> </div>
</div> </div>
<div class="flex flex-row justify-end w-full gap-2 px-0 py-2"> <div class="flex flex-row justify-end w-full gap-2 px-0 py-2">
<WootSubmitButton <NextButton
faded
slate
type="reset"
:label="$t('CANNED_MGMT.EDIT.CANCEL_BUTTON_TEXT')"
@click.prevent="onClose"
/>
<NextButton
type="submit"
:label="$t('CANNED_MGMT.EDIT.FORM.SUBMIT')"
:disabled=" :disabled="
v$.content.$invalid || v$.content.$invalid ||
v$.shortCode.$invalid || v$.shortCode.$invalid ||
editCanned.showLoading editCanned.showLoading
" "
:button-text="$t('CANNED_MGMT.EDIT.FORM.SUBMIT')" :is-loading="editCanned.showLoading"
:loading="editCanned.showLoading"
/> />
<button class="button clear" @click.prevent="onClose">
{{ $t('CANNED_MGMT.EDIT.CANCEL_BUTTON_TEXT') }}
</button>
</div> </div>
</form> </form>
</div> </div>

33
app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
View File

@@ -7,6 +7,8 @@ import { computed, onMounted, ref, defineOptions } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStoreGetters, useStore } from 'dashboard/composables/store'; import { useStoreGetters, useStore } from 'dashboard/composables/store';
import Button from 'dashboard/components-next/button/Button.vue';
defineOptions({ defineOptions({
name: 'CannedResponseSettings', name: 'CannedResponseSettings',
}); });
@@ -124,13 +126,11 @@ const tableHeaders = computed(() => {
feature-name="canned_responses" feature-name="canned_responses"
> >
<template #actions> <template #actions>
<woot-button <Button
class="button nice rounded-md" icon="i-lucide-circle-plus"
icon="add-circle" :label="$t('CANNED_MGMT.HEADER_BTN_TXT')"
@click="openAddPopup" @click="openAddPopup"
> />
{{ $t('CANNED_MGMT.HEADER_BTN_TXT') }}
</woot-button>
</template> </template>
</BaseSettingsHeader> </BaseSettingsHeader>
@@ -188,21 +188,20 @@ const tableHeaders = computed(() => {
{{ cannedItem.content }} {{ cannedItem.content }}
</td> </td>
<td class="py-4 flex justify-end gap-1"> <td class="py-4 flex justify-end gap-1">
<woot-button <Button
v-tooltip.top="$t('CANNED_MGMT.EDIT.BUTTON_TEXT')" v-tooltip.top="$t('CANNED_MGMT.EDIT.BUTTON_TEXT')"
variant="smooth" icon="i-lucide-pen"
size="tiny" slate
color-scheme="secondary" xs
icon="edit" faded
@click="openEditPopup(cannedItem)" @click="openEditPopup(cannedItem)"
/> />
<woot-button <Button
v-tooltip.top="$t('CANNED_MGMT.DELETE.BUTTON_TEXT')" v-tooltip.top="$t('CANNED_MGMT.DELETE.BUTTON_TEXT')"
variant="smooth" icon="i-lucide-trash-2"
color-scheme="alert" xs
size="tiny" ruby
icon="dismiss-circle" faded
class-names="grey-btn"
:is-loading="loading[cannedItem.id]" :is-loading="loading[cannedItem.id]"
@click="openDeletePopup(cannedItem, index)" @click="openDeletePopup(cannedItem, index)"
/> />