Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(ui): agent portal editor: bottom section: modify icons and button #1203

Merged
merged 1 commit into from
May 19, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions desk/src/assets/icons/attachment.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions desk/src/assets/icons/chat.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
67 changes: 37 additions & 30 deletions desk/src/pages/desk/ticket/editor/BottomSection.vue
Original file line number Diff line number Diff line change
Expand Up @@ -19,39 +19,43 @@
<TextEditorFixedMenu :buttons="menuButtons" />
</div>
<div class="flex justify-between px-3.5 py-2">
<div class="flex flex-row items-center space-x-2">
<CustomIcons
<div class="flex items-center gap-1">
<div
class="flex h-7 w-7 cursor-pointer items-center justify-center rounded-lg"
:class="{
'bg-gray-200': isTextFormattingVisible,
}"
name="text-formatting"
class="h-7 w-7 rounded p-1"
role="button"
@click="isTextFormattingVisible = !isTextFormattingVisible"
/>
>
<IconTextT
class="h-5 w-5 text-gray-900"
@click="isTextFormattingVisible = !isTextFormattingVisible"
/>
</div>
<div class="flex h-7 w-7 items-center justify-center">
<IconChat
class="h-5 w-5 cursor-pointer text-gray-900"
@click="showCannedResponses = true"
/>
</div>
<div class="flex h-7 w-7 items-center justify-center">
<IconKnowledgeBase
class="h-5 w-5 cursor-pointer text-gray-900"
@click="showArticleResponse = true"
/>
</div>
<FileUploader @success="(file) => editor.attachments.push(file)">
<template #default="{ uploading, openFileSelector }">
<FeatherIcon
name="paperclip"
class="h-5 w-5"
role="button"
:disabled="uploading"
@click="openFileSelector"
/>
<div class="flex h-7 w-7 items-center justify-center">
<IconAttachment
class="h-5 w-5 cursor-pointer text-gray-900"
:class="{
'text-gray-600': uploading,
}"
@click="!uploading && openFileSelector()"
/>
</div>
</template>
</FileUploader>
<CustomIcons
name="add-response"
class="h-7 w-7 rounded p-1"
role="button"
@click="showCannedResponses = true"
/>
<CustomIcons
name="article-reply"
class="h-7 w-7 rounded p-1"
role="button"
@click="showArticleResponse = true"
/>
</div>
<div class="flex items-center gap-4">
<IconDelete
Expand All @@ -62,15 +66,16 @@
<Button
label="Reply"
appearance="primary"
class="rounded-r-none"
class="rounded-r-none bg-gray-900 text-white hover:bg-gray-800"
@click="newCommunication"
/>
<Dropdown
:options="dropdownOptions"
:button="{
icon: 'chevron-down',
appearance: 'primary',
class: 'rounded-l-none',
class:
'rounded-l-none bg-gray-900 text-white hover:bg-gray-800',
}"
/>
</div>
Expand All @@ -95,7 +100,6 @@ import {
createResource,
Button,
Dropdown,
FeatherIcon,
FileUploader,
TextEditorFixedMenu,
} from "frappe-ui";
Expand All @@ -105,9 +109,12 @@ import { TextEditorMenuButtons as menuButtons } from "../../consts";
import CannedResponses from "./CannedResponses.vue";
import ArticleResponses from "./ArticleResponses.vue";
import AttachmentItem from "@/components/AttachmentItem.vue";
import CustomIcons from "@/components/desk/global/CustomIcons.vue";
import IconDelete from "~icons/espresso/delete";
import IconKnowledgeBase from "~icons/espresso/knowledge-base";
import IconX from "~icons/ph/x";
import IconTextT from "~icons/ph/text-t";
import IconAttachment from "~icons/espresso/attachment";
import IconChat from "~icons/espresso/chat";

const authStore = useAuthStore();
const showArticleResponse = ref(false);
Expand Down
Loading