fix: show read only content in notes in grid view

changed tab action buttons
This commit is contained in:
Shariq Ansari 2023-08-26 20:35:32 +05:30
parent 80abbf9ed7
commit c54e1d527b
3 changed files with 20 additions and 16 deletions

View File

@ -1,18 +1,16 @@
<template> <template>
<div class="p-5 flex items-center justify-between font-medium text-lg"> <div class="p-5 flex items-center justify-between font-medium text-lg">
<div>{{ title }}</div> <div>{{ title }}</div>
<Button <Button v-if="title == 'Calls'" variant="solid" @click="emit('makeCall')">
v-if="title == 'Calls'" <PhoneIcon class="w-4 h-4" />
variant="solid" </Button>
label="Make a call"
@click="emit('makeCall')"
/>
<Button <Button
v-else-if="title == 'Notes'" v-else-if="title == 'Notes'"
variant="solid" variant="solid"
label="Create note"
@click="emit('makeNote')" @click="emit('makeNote')"
/> >
<FeatherIcon name="plus" class="w-4 h-4" />
</Button>
</div> </div>
<div v-if="activities.length"> <div v-if="activities.length">
<div v-if="title == 'Notes'" class="grid grid-cols-2 gap-4 p-5 pt-0"> <div v-if="title == 'Notes'" class="grid grid-cols-2 gap-4 p-5 pt-0">
@ -42,9 +40,12 @@
/> />
</Dropdown> </Dropdown>
</div> </div>
<div <TextEditor
class="flex-1 text-base leading-5 text-gray-700 overflow-hidden" v-if="note.content"
v-html="note.content" :content="note.content"
:options="{ readOnly: true }"
editor-class="!prose-sm max-w-none !text-sm focus:outline-none"
class="flex-1 overflow-hidden"
/> />
<div class="flex items-center justify-between gap-2"> <div class="flex items-center justify-between gap-2">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
@ -178,7 +179,7 @@ import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
import NoteIcon from '@/components/Icons/NoteIcon.vue' import NoteIcon from '@/components/Icons/NoteIcon.vue'
import { timeAgo, dateFormat, dateTooltipFormat } from '@/utils' import { timeAgo, dateFormat, dateTooltipFormat } from '@/utils'
import { usersStore } from '@/stores/users' import { usersStore } from '@/stores/users'
import { Button, FeatherIcon, Tooltip, Dropdown } from 'frappe-ui' import { Button, FeatherIcon, Tooltip, Dropdown, TextEditor } from 'frappe-ui'
import { computed, h } from 'vue' import { computed, h } from 'vue'
const { getUser } = usersStore() const { getUser } = usersStore()

View File

@ -14,7 +14,7 @@
/> />
<TextEditor <TextEditor
ref="content" ref="content"
editor-class="!prose-sm max-w-none p-2 overflow-auto focus:outline-none" editor-class="!prose-sm !leading-5 max-w-none p-2 overflow-auto focus:outline-none"
:bubbleMenu="true" :bubbleMenu="true"
:content="updatedNote.content" :content="updatedNote.content"
@change="(val) => (updatedNote.content = val)" @change="(val) => (updatedNote.content = val)"

View File

@ -37,9 +37,12 @@
/> />
</Dropdown> </Dropdown>
</div> </div>
<div <TextEditor
class="flex-1 text-base leading-5 text-gray-700 overflow-hidden" v-if="note.content"
v-html="note.content" :content="note.content"
:options="{ readOnly: true }"
editor-class="!prose-sm max-w-none !text-sm focus:outline-none"
class="flex-1 overflow-hidden"
/> />
<div class="flex items-center justify-between gap-2"> <div class="flex items-center justify-between gap-2">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">