@@ -1355,7 +1338,15 @@ useEventListener(
{{ field.label }}
- {{ field.label?.trim() }}
+
+
@@ -1551,7 +1542,7 @@ useEventListener(
.nc-input {
@apply appearance-none w-full;
&:not(.layout-list) {
- @apply !bg-white rounded-lg border-solid border-1 border-gray-200 focus-within:border-brand-500;
+ @apply !bg-white rounded-lg border-solid border-1 border-gray-200 !focus-within:border-brand-500;
}
&.layout-list {
@apply h-auto !pl-0 !py-1;
@@ -1584,19 +1575,11 @@ useEventListener(
}
.form-meta-input {
- @apply !rounded-lg !text-sm;
&::placeholder {
@apply !text-gray-500;
}
}
-.nc-form-input-label {
- @apply !px-4 !py-2 font-semibold text-gray-800;
-}
-.nc-form-input-help-text {
- @apply !px-4 !py-1 text-gray-700;
-}
-
.nc-form-help-text,
.nc-input-required-error {
max-width: 100%;
@@ -1679,3 +1662,18 @@ useEventListener(
}
}
+
+
From 6344238dcf1b309de6adb50526c05f4aa37f94f1 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 03/41] fix(nc-gui): form rich text sync value issue
---
packages/nc-gui/components/smartsheet/Form.vue | 7 +++++++
1 file changed, 7 insertions(+)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index c204563ab5..47813540ea 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -938,16 +938,20 @@ useEventListener(
v-model:value="element.label"
is-form-field
read-only
+ sync-value-change
class="nc-form-help-text text-gray-500 text-sm mt-2"
data-testid="nc-form-help-text"
+ @update:value="updateColMeta(element)"
/>
+
@@ -223,7 +246,11 @@ watch(editorDom, () => {
.nc-rich-text-embed {
.ProseMirror {
@apply !border-transparent max-h-full;
- min-height: 8rem;
+ }
+ &:not(.nc-form-rich-text-field) {
+ .ProseMirror {
+ min-height: 8rem;
+ }
}
&.readonly {
.nc-textarea-rich-editor {
diff --git a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
index 51b939b264..b2f001b033 100644
--- a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
+++ b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
@@ -14,6 +14,7 @@ import MsFormatQuote from '~icons/material-symbols/format-quote'
interface Props {
editor: Editor
embedMode?: boolean
+ isFormField?: boolean
}
const props = defineProps
@@ -105,7 +107,7 @@ const onToggleLink = () => {
-
+
@@ -124,7 +126,7 @@ const onToggleLink = () => {
+
@@ -144,7 +146,7 @@ const onToggleLink = () => {
+
-
+
+
+
+
@@ -163,141 +165,143 @@ const onToggleLink = () => {
- {{ $t('general.code') }}
-
-
-
-
- {{ $t('general.quote') }}
-
-
-
-
+
+
+ {{ $t('general.code') }}
+
+
+
+
+ {{ $t('general.quote') }}
+
+
+
+
-
-
-
-
@@ -935,7 +940,7 @@ useEventListener(
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ $t('labels.blockQuote') }}
-
+
-
-
-
+
-
-
-
+
+
+
+ {{ $t('labels.taskList') }}
+
+
-
- {{ $t('labels.blockQuote') }}
-
-
-
-
-
- {{ $t('labels.bulletList') }}
-
-
-
-
-
- {{ $t('labels.numberedList') }}
-
-
-
-
-
- {{ $t('labels.taskList') }}
-
-
-
-
-
-
-
+
{{ $t('general.link') }}
{
:disabled="editor.isActive('codeBlock')"
@click="onToggleLink"
>
-
- {{ $t('labels.heading1') }}
+
+
+
+
-
+
+
+
-
+ {{ $t('labels.heading1') }}
+
+ {{ cmdOrCtrlKey }} {{ altKey }} 1
{{ cmdOrCtrlKey }} {{ altKey }} 1
-
+
+
+
+ {{ $t('labels.heading2') }}
+
+ {{ cmdOrCtrlKey }} {{ altKey }} 2
+
+
+
+
+ {{ $t('labels.heading3') }}
+
+ {{ cmdOrCtrlKey }} {{ altKey }} 3
+
-
-
+ {{ $t('labels.bulletList') }}
- {{ $t('labels.heading2') }}
-
- {{ cmdOrCtrlKey }} {{ altKey }} 2
-
-
-
+ {{ $t('labels.numberedList') }}
- {{ $t('labels.heading3') }}
-
- {{ cmdOrCtrlKey }} {{ altKey }} 3
-
+ = {}) => {
onClickOutside(draggableRef, (e) => {
if (
(e.target as HTMLElement)?.closest(
- '.nc-dropdown-single-select-cell, .nc-dropdown-multi-select-cell, .nc-dropdown-user-select-cell',
+ '.nc-dropdown-single-select-cell, .nc-dropdown-multi-select-cell, .nc-dropdown-user-select-cell, .nc-form-rich-text-field',
)
) {
return
@@ -824,7 +824,7 @@ useEventListener(
]"
@click.stop="onFormItemClick({ title: 'nc-form-heading' })"
>
-
+
+
+
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index 6832a054a4..4571430a69 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -326,6 +326,7 @@ export const iconMap = {
translate: h('span', { class: 'material-symbols' }, 'translate'),
preview: h('span', { class: 'material-symbols' }, 'visibility'),
link: h('span', { class: 'material-symbols' }, 'link'),
+ link2: NcLink,
returnKey: h('span', { class: 'material-symbols' }, 'keyboard_return'),
keyboard: h('span', { class: 'material-symbols' }, 'keyboard'),
accountPlus: h('span', { class: 'material-symbols' }, 'person_add'),
From 03e56ca620dead5ded85cfbaaa32592747ac5008 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:37 +0000
Subject: [PATCH 02/41] feat(nc-gui): add rich text support in form
---
packages/nc-gui/components/cell/RichText.vue | 43 +++--
.../cell/RichText/SelectedBubbleMenu.vue | 21 +-
.../nc-gui/components/smartsheet/Form.vue | 180 +++++++++---------
3 files changed, 135 insertions(+), 109 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 097d43189e..ba890dcdfb 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -8,7 +8,7 @@ import { generateJSON } from '@tiptap/html'
import Underline from '@tiptap/extension-underline'
import { TaskItem } from '@/helpers/dbTiptapExtensions/task-item'
import { Link } from '@/helpers/dbTiptapExtensions/links'
-import { IsExpandedFormOpenInj, IsFormInj, ReadonlyInj, RowHeightInj } from '#imports'
+import { IsExpandedFormOpenInj, IsFormInj, ReadonlyInj, RowHeightInj, onClickOutside } from '#imports'
const props = defineProps<{
value?: string | null
@@ -17,6 +17,8 @@ const props = defineProps<{
showMenu?: boolean
fullMode?: boolean
isFormField?: boolean
+ autofocus?: boolean
+ isTabPressed?: boolean
}>()
const emits = defineEmits(['update:value'])
@@ -29,6 +31,8 @@ const readOnlyCell = inject(ReadonlyInj, ref(false))
const isForm = inject(IsFormInj, ref(false))
+const isFocused = ref(false)
+
const turndownService = new TurndownService({})
turndownService.addRule('lineBreak', {
@@ -122,29 +126,30 @@ const editor = useEditor({
.turndown(editor.getHTML().replaceAll(/{{ $t('general.link') }}
<\/p>/g, '
'))
.replaceAll(/\n\n
\n\n/g, '
\n\n')
- vModel.value = markdown
+ vModel.value = props.isFormField && markdown === '
' ? '' : markdown
},
editable: !props.readOnly,
+ autofocus: props.autofocus,
+ onFocus: () => {
+ isFocused.value = true
+ },
+ onBlur: () => {
+ if (props.isTabPressed) {
+ isFocused.value = false
+ }
+ },
})
watch(props, () => {
- console.log('readonly node')
if (props.isFormField) {
if (props.readOnly) {
editor.value?.setEditable(false)
} else {
editor.value?.setEditable(true)
- setTimeout(() => {
- editor.value?.chain().focus().run()
- }, 50)
}
}
})
-watchEffect(() => {
- console.log('read only ', props.readOnly)
-})
-
const setEditorContent = (contentMd: any, focusEndOfDoc?: boolean) => {
if (!editor.value) return
@@ -182,11 +187,20 @@ watch(editorDom, () => {
setEditorContent(vModel.value, true)
+ if (props.isFormField) return
// Focus editor after editor is mounted
setTimeout(() => {
editor.value?.chain().focus().run()
}, 50)
})
+
+onClickOutside(editorDom, (e) => {
+ if ((e.target as HTMLElement)?.closest('.bubble-menu')) {
+ return
+ }
+
+ isFocused.value = false
+})
@@ -198,7 +212,7 @@ watch(editorDom, () => {
'readonly': readOnly,
'nc-form-rich-text-field !p-0': isFormField,
}"
- :tabindex="readOnlyCell ? -1 : 0"
+ :tabindex="readOnlyCell || isFormField ? -1 : 0"
>
{
!fullMode && readOnly && rowHeight && !isExpandedFormOpen && !isForm,
}"
/>
-
@@ -869,6 +872,7 @@ useEventListener(
+
@@ -252,6 +266,11 @@ watch(editorDom, () => {
min-height: 8rem;
}
}
+ &.nc-form-rich-text-field {
+ .ProseMirror {
+ padding: 0;
+ }
+ }
&.readonly {
.nc-textarea-rich-editor {
.ProseMirror {
diff --git a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
index b2f001b033..a7bf78f6d4 100644
--- a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
+++ b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
@@ -80,12 +80,16 @@ const onToggleLink = () => {
@@ -961,16 +933,36 @@ useEventListener(
@@ -1021,34 +1013,25 @@ useEventListener(
- {{ element.label || element.title }}
+
-
- {{ element.description }}
-
+
-
@@ -1343,6 +1349,7 @@ useEventListener(
v-model:value="field.label"
is-form-field
read-only
+ sync-value-change
class="text-xs font-normal text-gray-700"
data-testid="nc-form-help-text"
/>
From 779319abeeaf7bed8dc8c91cb869f44c0e5da905 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 04/41] fix(nc-gui): form rich text placeholder and render as
text issue
---
packages/nc-gui/components/cell/RichText.vue | 95 +++++++++++--------
.../nc-gui/components/smartsheet/Form.vue | 61 +++++++-----
packages/nc-gui/lang/en.json | 1 +
3 files changed, 94 insertions(+), 63 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index ba890dcdfb..4038611637 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -6,6 +6,7 @@ import TurndownService from 'turndown'
import { marked } from 'marked'
import { generateJSON } from '@tiptap/html'
import Underline from '@tiptap/extension-underline'
+import Placeholder from '@tiptap/extension-placeholder'
import { TaskItem } from '@/helpers/dbTiptapExtensions/task-item'
import { Link } from '@/helpers/dbTiptapExtensions/links'
import { IsExpandedFormOpenInj, IsFormInj, ReadonlyInj, RowHeightInj, onClickOutside } from '#imports'
@@ -19,6 +20,8 @@ const props = defineProps<{
isFormField?: boolean
autofocus?: boolean
isTabPressed?: boolean
+ placeholder?: string
+ renderAsText?: boolean
}>()
const emits = defineEmits(['update:value'])
@@ -117,6 +120,10 @@ const tiptapExtensions = [
}),
Underline,
Link,
+ Placeholder.configure({
+ emptyEditorClass: 'is-editor-empty',
+ placeholder: props.placeholder,
+ }),
]
const editor = useEditor({
@@ -140,16 +147,6 @@ const editor = useEditor({
},
})
-watch(props, () => {
- if (props.isFormField) {
- if (props.readOnly) {
- editor.value?.setEditable(false)
- } else {
- editor.value?.setEditable(true)
- }
- }
-})
-
const setEditorContent = (contentMd: any, focusEndOfDoc?: boolean) => {
if (!editor.value) return
@@ -176,8 +173,18 @@ const setEditorContent = (contentMd: any, focusEndOfDoc?: boolean) => {
}, 100)
}
+watch([props, editor], () => {
+ if (props.isFormField) {
+ if (props.readOnly && editor.value?.isEditable) {
+ editor.value?.setEditable(false)
+ } else if (!editor.value?.isEditable) {
+ editor.value?.setEditable(true)
+ }
+ }
+})
+
if (props.syncValueChange) {
- watch(vModel, () => {
+ watch([vModel, editor], () => {
setEditorContent(vModel.value)
})
}
@@ -214,34 +221,39 @@ onClickOutside(editorDom, (e) => {
}"
:tabindex="readOnlyCell || isFormField ? -1 : 0"
>
-
-
-
-
-
@@ -302,6 +314,13 @@ onClickOutside(editorDom, (e) => {
}
.nc-textarea-rich-editor {
+ .tiptap p.is-editor-empty:first-child::before {
+ color: #6a7184;
+ content: attr(data-placeholder);
+ float: left;
+ height: 0;
+ pointer-events: none;
+ }
.ProseMirror {
@apply flex-grow pt-1 border-1 border-gray-200 rounded-lg;
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 47813540ea..cdd0b8fafd 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -827,6 +827,7 @@ useEventListener(
+ {{ editor?.getText() ?? '' }}
+
+
+
+
+
+
+
-
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index cdd0b8fafd..131daf02df 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -928,9 +928,6 @@ useEventListener(
'!hover:bg-white !ring-0 !cursor-auto': isLocked,
},
]"
- :style="{
- transition: 'height 1s ease-in',
- }"
:data-title="element.title"
data-testid="nc-form-fields"
@click.stop="onFormItemClick(element)"
From 852016885de3094f001019d743b02a5cc8328b50 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 06/41] fix(nc-gui): prevent ctrl+s keypress in formview
---
.../nc-gui/components/smartsheet/Form.vue | 24 +++++++++++++++++++
1 file changed, 24 insertions(+)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 131daf02df..d8022bcbfc 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -612,6 +612,30 @@ useEventListener(
},
true,
)
+
+useEventListener(
+ document,
+ 'keydown',
+ (e: KeyboardEvent) => {
+ const cmdOrCtrl = isMac() ? e.metaKey : e.ctrlKey
+
+ switch (e.key.toLowerCase()) {
+ case 's':
+ if (
+ cmdOrCtrl &&
+ !(
+ ['input', 'textarea'].includes((e.target as any).nodeName.toLowerCase()) ||
+ (e.target as any)?.getAttribute('contenteditable')
+ )
+ ) {
+ e.preventDefault()
+ updateView()
+ }
+ break
+ }
+ },
+ true,
+)
From b8f79a76bc9bb92c1d4ecb6360da5322363f4fca Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 07/41] fix(nc-gui): remove border from form banner
---
packages/nc-gui/components/general/FormBanner.vue | 14 +++++---------
1 file changed, 5 insertions(+), 9 deletions(-)
diff --git a/packages/nc-gui/components/general/FormBanner.vue b/packages/nc-gui/components/general/FormBanner.vue
index 96803bda59..76cd18e983 100644
--- a/packages/nc-gui/components/general/FormBanner.vue
+++ b/packages/nc-gui/components/general/FormBanner.vue
@@ -8,25 +8,21 @@ const { getPossibleAttachmentSrc } = useAttachment()
-
+
+
+
-
+
+
- 
+
-
+
+
From 3d516a48762614d9167b36caa3e361748978fe17 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 08/41] fix(nc-gui): add rich text in shared form
---
packages/nc-gui/components/cell/RichText.vue | 12 ++---
.../index/[typeOrId]/form/[viewId]/index.vue | 2 +-
.../[typeOrId]/form/[viewId]/index/index.vue | 47 ++++++++++++++-----
.../[typeOrId]/form/[viewId]/index/survey.vue | 45 +++++++++++-------
4 files changed, 70 insertions(+), 36 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 62947a87ff..81887c786f 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -173,15 +173,15 @@ const setEditorContent = (contentMd: any, focusEndOfDoc?: boolean) => {
}, 100)
}
-watch([props, editor], () => {
- if (props.isFormField) {
- if (props.readOnly && editor.value?.isEditable) {
+if (props.isFormField) {
+ watch([props, editor], () => {
+ if (props.readOnly) {
editor.value?.setEditable(false)
- } else if (!editor.value?.isEditable) {
+ } else {
editor.value?.setEditable(true)
}
- }
-})
+ })
+}
if (props.syncValueChange) {
watch([vModel, editor], () => {
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index.vue
index 32f8ba8ba7..0eb912d2ea 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index.vue
@@ -100,7 +100,7 @@ p {
@apply w-full;
&:not(.layout-list) {
- @apply rounded-lg border-solid border-1 border-gray-200 focus-within:border-brand-500;
+ @apply rounded-lg border-solid border-1 border-gray-200 focus-within:border-brand-500 overflow-hidden;
& > div {
@apply !bg-transparent;
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
index 6b36f969d1..6ca3c88512 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
@@ -79,7 +79,7 @@ const onDecode = async (scannedCodeValue: string) => {
-
+
{
/>
+ {{ $t('msg.info.preventHideAllOptions') }}
+
+
Date: Sat, 2 Mar 2024 07:32:39 +0000
Subject: [PATCH 11/41] fix(nc-gui): disable banner & logo upload in oss
---
.../nc-gui/components/smartsheet/Form.vue | 81 +++++++++++--------
packages/nc-gui/lang/en.json | 1 +
2 files changed, 48 insertions(+), 34 deletions(-)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index bc3c2d17f2..4db5fe568a 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -463,7 +463,7 @@ const handleChangeBackground = (color: string) => {
}
const openUploadImage = (isUploadBanner: boolean) => {
- if (!isEditable) return
+ if (!isEditable || !isEeUI) return
imageCropperData.value.uploadConfig = {
path: [NOCO, base.value.id, meta.value?.id, formViewData.value?.id].join('/'),
@@ -723,22 +723,29 @@ useEventListener(
()
-
const emit = defineEmits(['update:showCropper', 'submit'])
const showCropper = useVModel(props, 'showCropper', emit)
@@ -103,7 +106,9 @@ watch(showCropper, () => {
class="nc-cropper relative"
:src="imageConfig.src"
:auto-zoom="true"
- :stencil-props="cropperConfig?.aspectRatio ? { aspectRatio: cropperConfig.aspectRatio } : {}"
+ :stencil-props="cropperConfig?.stencilProps || {}"
+ :min-height="cropperConfig?.minHeight"
+ :min-width="cropperConfig?.minWidth"
/>
![Preview Image]()
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 4db5fe568a..32342d326d 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -140,7 +140,11 @@ const imageCropperData = ref<{
name: string
}
cropperConfig: {
- aspectRatio?: number
+ stencilProps: {
+ aspectRatio?: number
+ }
+ minHeight: number
+ minWidth: number
}
uploadConfig?: {
path?: string
@@ -152,7 +156,11 @@ const imageCropperData = ref<{
type: '',
name: '',
},
- cropperConfig: {},
+ cropperConfig: {
+ stencilProps: {},
+ minHeight: 0,
+ minWidth: 0,
+ },
uploadConfig: {
path: '',
},
@@ -470,12 +478,22 @@ const openUploadImage = (isUploadBanner: boolean) => {
}
if (isUploadBanner) {
imageCropperData.value.cropperConfig = {
- aspectRatio: 4 / 1,
+ ...imageCropperData.value.cropperConfig,
+ stencilProps: {
+ aspectRatio: 4 / 1,
+ },
+ minHeight: 0,
+ minWidth: 0,
}
imageCropperData.value.cropFor = 'banner'
} else {
imageCropperData.value.cropperConfig = {
- aspectRatio: undefined,
+ ...imageCropperData.value.cropperConfig,
+ stencilProps: {
+ aspectRatio: undefined,
+ },
+ minHeight: 150,
+ minWidth: 150,
}
imageCropperData.value.cropFor = 'logo'
}
From 42d935f8610f59f9697e2923a4c2591848fa4700 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:39 +0000
Subject: [PATCH 13/41] fix(nc-gui): remove rich text from form title and field
label
---
.../nc-gui/components/smartsheet/Form.vue | 142 +++++++++---------
.../[typeOrId]/form/[viewId]/index/index.vue | 45 +++---
.../[typeOrId]/form/[viewId]/index/survey.vue | 48 +++---
3 files changed, 119 insertions(+), 116 deletions(-)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 32342d326d..9d54ab4b9b 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -879,27 +879,32 @@ useEventListener(
]"
@click.stop="onFormItemClick({ title: 'nc-form-heading' })"
>
-
+
+
+
@@ -990,26 +995,7 @@ useEventListener(
+
@@ -1645,10 +1635,8 @@ useEventListener(
}
}
-.form-meta-input {
- &::placeholder {
- @apply !text-gray-500;
- }
+.nc-form-input-label {
+ @apply !px-4 !py-2 font-semibold text-gray-800 !rounded-lg !text-sm;
}
.nc-form-help-text,
@@ -1747,4 +1735,12 @@ useEventListener(
@apply pt-1 text-gray-700;
}
}
+.nc-form-after-submit-msg {
+ .nc-textarea-rich-editor {
+ @apply pl-1 pr-2 pt-2 pb-1 !rounded-lg !text-sm border-1 border-gray-200 focus-within:border-brand-500;
+ .ProseMirror {
+ min-height: 5rem;
+ }
+ }
+}
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
index 6ca3c88512..9cc5c7be7b 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
@@ -91,13 +91,10 @@ const onDecode = async (scannedCodeValue: string) => {
>
-
- {{ sharedFormView.heading }} -
- -- {{ sharedFormView.subheading }} -
+
+
-
- {{ field.label || field.title }}
-
+
+
*
- {{ field?.description }}
+
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
index f749801aa9..e19c007636 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
@@ -239,20 +239,27 @@ onMounted(() => {
@@ -265,9 +272,15 @@ onMounted(() => {
>
From 6a64daf22c65a4ecdcd8919b6f56d62dee2e187d Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:38 +0000
Subject: [PATCH 09/41] chore(nc-gui): small changes
---
packages/nc-gui/components/cell/RichText.vue | 13 ++-----------
.../components/cell/RichText/SelectedBubbleMenu.vue | 4 +---
2 files changed, 3 insertions(+), 14 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 81887c786f..980e83a669 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -140,9 +140,10 @@ const editor = useEditor({
onFocus: () => {
isFocused.value = true
},
- onBlur: () => {
+ onBlur: (e) => {
if (props.isTabPressed) {
isFocused.value = false
+ e?.editor?.setEditable(false)
}
},
})
@@ -173,16 +174,6 @@ const setEditorContent = (contentMd: any, focusEndOfDoc?: boolean) => {
}, 100)
}
-if (props.isFormField) {
- watch([props, editor], () => {
- if (props.readOnly) {
- editor.value?.setEditable(false)
- } else {
- editor.value?.setEditable(true)
- }
- })
-}
-
if (props.syncValueChange) {
watch([vModel, editor], () => {
setEditorContent(vModel.value)
diff --git a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
index a7bf78f6d4..5b922f5f5c 100644
--- a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
+++ b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
@@ -19,9 +19,7 @@ interface Props {
const props = defineProps()
-const editor = computed(() => props.editor)
-
-const embedMode = computed(() => props.embedMode)
+const { editor, embedMode } = toRefs(props)
const cmdOrCtrlKey = computed(() => {
return isMac() ? '⌘' : 'CTRL'
From f209f54d343c140efe63a5b35a1fc8c46e0f1e9e Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:39 +0000
Subject: [PATCH 10/41] feat(nc-gui): add show or hide all options for limit
options
---
packages/nc-gui/components/cell/RichText.vue | 10 +++
.../nc-gui/components/smartsheet/Form.vue | 1 +
.../smartsheet/form/LimitOptions.vue | 78 +++++++++++++++----
packages/nc-gui/lang/en.json | 3 +-
4 files changed, 77 insertions(+), 15 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 980e83a669..6a314d9036 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -180,6 +180,16 @@ if (props.syncValueChange) {
})
}
+if (props.isFormField) {
+ watch([props, editor], () => {
+ if (props.readOnly) {
+ editor.value?.setEditable(false)
+ } else {
+ editor.value?.setEditable(true)
+ }
+ })
+}
+
watch(editorDom, () => {
if (!editorDom.value) return
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index d8022bcbfc..bc3c2d17f2 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -1188,6 +1188,7 @@ useEventListener(
diff --git a/packages/nc-gui/components/smartsheet/form/LimitOptions.vue b/packages/nc-gui/components/smartsheet/form/LimitOptions.vue
index c20d226413..b7b4e194ac 100644
--- a/packages/nc-gui/components/smartsheet/form/LimitOptions.vue
+++ b/packages/nc-gui/components/smartsheet/form/LimitOptions.vue
@@ -9,6 +9,7 @@ import { MetaInj, iconMap } from '#imports'
const props = defineProps<{
modelValue: FormFieldsLimitOptionsType[]
column: ColumnType
+ isRequired?: boolean
}>()
const emit = defineEmits(['update:modelValue'])
@@ -121,6 +122,20 @@ async function onMove(_event: { moved: { newIndex: number; oldIndex: number; ele
vModel.value = [...vModel.value]
}
+
+const showOrHideAll = (showAll: boolean) => {
+ if (props.isRequired && !showAll) {
+ return
+ }
+ vModel.value = [
+ ...vModel.value.map((o) => {
+ return {
+ ...o,
+ show: showAll,
+ }
+ }),
+ ]
+}
@@ -147,13 +162,42 @@ async function onMove(_event: { moved: { newIndex: number; oldIndex: number; ele
+
+
-
- {{ sharedFormView.heading }} -
- -- {{ sharedFormView?.subheading }} -
+
+
-
- {{ field.label || field.title }}
-
+
+
*
{
class="nc-form-column-description text-gray-500 text-sm"
data-testid="nc-survey-form__field-description"
>
- {{ field?.description }}
+
+
+ {{ $t('msg.info.preventHideAllOptions') }}
+
+
+ Hide all
+
+
+
+
+
+
+ Show all
+
+
+
-
+
+
+
+ {{ formViewData.heading }}
+
-
-
@@ -1184,9 +1172,14 @@ useEventListener(
{{ $t('general.dropdown') }}
{{ $t('general.list') }}
@@ -1407,17 +1400,7 @@ useEventListener(
{{ field.label }}
-
-
@@ -1519,15 +1502,22 @@ useEventListener(
Layout
{{ $t('msg.info.formDisplayMessage') }}
-
- {
- {{ $t('activity.submitAnotherForm') }}
+ {{ $t('activity.submitAnotherForm') }}
+
@@ -160,15 +169,9 @@ const onDecode = async (scannedCodeValue: string) => {
+ {{ sharedFormView.heading }} +
+{{ $t('msg.newFormWillBeLoaded', { seconds: secondsRemain }) }} @@ -127,8 +136,8 @@ const onDecode = async (scannedCodeValue: string) => {
-
-
+
+ {{ field.label || field.title }}
+
*
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
index e19c007636..f0e7ceeee1 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
@@ -242,15 +242,10 @@ onMounted(() => {
class="w-full max-w-[max(33%,600px)] mx-auto flex flex-col justify-end"
>
-
+
{
>
+ {{ sharedFormView.heading }} +
+
-
-
+
+ {{ field.label || field.title }}
+
*
{
From bb6a1ac5123fb04227ce1d3ef732173d7970925c Mon Sep 17 00:00:00 2001 From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com> Date: Sat, 2 Mar 2024 07:32:39 +0000 Subject: [PATCH 14/41] fix(nc-gui): add outline for switch and radio on focus --- packages/nc-gui/components/smartsheet/Form.vue | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue index 9d54ab4b9b..83afe0e829 100644 --- a/packages/nc-gui/components/smartsheet/Form.vue +++ b/packages/nc-gui/components/smartsheet/Form.vue @@ -1188,7 +1188,7 @@ useEventListener(
-
{{ $t('labels.showOnConditions') }}
{{ $t('labels.showFieldOnConditionsMet') }}
@@ -1202,6 +1202,7 @@ useEventListener(
v-model:checked="element.meta.isLimitOption"
v-e="['a:form-view:field:limit-options']"
size="small"
+ class="nc-form-switch-focus"
@change="updateColMeta(element)"
/>
{{ $t('labels.limitOptions') }}
@@ -1710,6 +1711,9 @@ useEventListener(
:deep(.nc-form-input-required + button):focus {
box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3366ff;
}
+:deep(.nc-form-switch-focus):focus {
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3366ff;
+}
.nc-form-field-layout {
@apply !flex !items-center w-full space-x-3;
@@ -1717,6 +1721,10 @@ useEventListener(
@apply border-1 border-gray-200 rounded-lg !py-2 !px-3 basis-full !mr-0 !items-center;
.ant-radio {
@apply !top-0;
+
+ &:focus-within .ant-radio-inner {
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3366ff;
+ }
}
}
}
From fdaeb5f1ec917e674c6dfde8c0a9313b0d1d82f1 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:40 +0000
Subject: [PATCH 15/41] fix(nc-gui): color picker buttons focus css
---
packages/nc-gui/components/general/ColorPicker.vue | 4 ++++
1 file changed, 4 insertions(+)
diff --git a/packages/nc-gui/components/general/ColorPicker.vue b/packages/nc-gui/components/general/ColorPicker.vue
index 04013f0323..dffd7c9bc5 100644
--- a/packages/nc-gui/components/general/ColorPicker.vue
+++ b/packages/nc-gui/components/general/ColorPicker.vue
@@ -117,6 +117,10 @@ watch(picked, (n, _o) => {
filter: brightness(90%);
-webkit-filter: brightness(90%);
}
+.color-selector:focus.new-design {
+ outline: none;
+ box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 4px #3069fe;
+}
.color-selector.selected.new-design {
box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 4px #3069fe;
}
From 15d06885d15aaf5828eab9f55265e8106a0051e2 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:40 +0000
Subject: [PATCH 16/41] chore(nc-gui): lint
---
.../components/cell/RichText/SelectedBubbleMenu.vue | 10 +++++-----
packages/nc-gui/components/smartsheet/Form.vue | 1 -
.../index/[typeOrId]/form/[viewId]/index/survey.vue | 2 +-
3 files changed, 6 insertions(+), 7 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
index 5b922f5f5c..6132520f14 100644
--- a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
+++ b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
@@ -103,8 +103,8 @@ const onToggleLink = () => {
type="text"
:class="{ 'is-active': editor.isActive('bold') }"
:disabled="editor.isActive('codeBlock')"
- @click="editor!.chain().focus().toggleBold().run()"
:tabindex="isFormField ? -1 : 0"
+ @click="editor!.chain().focus().toggleBold().run()"
>
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 83afe0e829..67455c5557 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -311,7 +311,6 @@ async function showOrHideColumn(column: Record, show: boolean, isSi
const fieldIndex = fields.value?.findIndex((f) => f?.fk_column_id === column.fk_column_id)
if (fieldIndex !== -1 && fieldIndex !== undefined && fields.value?.[fieldIndex]) {
- console.log('column', column)
column.show = show
await $api.dbView.formColumnUpdate(column.id, column)
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
index f0e7ceeee1..7b1e8f6554 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue
@@ -394,7 +394,7 @@ onMounted(() => {
{{ $t('msg.info.thankYou') }}
-
+
{{ $t('msg.info.submittedFormData') }}
From 7a206b1704611933b5f7bff710e91d17e47ac230 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:40 +0000
Subject: [PATCH 17/41] fix(nc-gui): small changes
---
packages/nc-gui/components/cell/RichText.vue | 12 ++++++++++++
packages/nc-gui/components/smartsheet/Form.vue | 3 ++-
.../index/[typeOrId]/form/[viewId]/index/index.vue | 2 +-
.../index/[typeOrId]/form/[viewId]/index/survey.vue | 4 ++--
4 files changed, 17 insertions(+), 4 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 6a314d9036..40c52c4d71 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -291,6 +291,18 @@ onClickOutside(editorDom, (e) => {
.ProseMirror {
padding: 0;
}
+ &.readonly {
+ ul[data-type='taskList'] li input[type='checkbox'] {
+ background-color: #d5d5d9 !important;
+ &:not(:checked) {
+ @apply !border-gray-400;
+ }
+ &:focus {
+ box-shadow: none !important;
+ background-color: #d5d5d9 !important;
+ }
+ }
+ }
}
&.readonly {
.nc-textarea-rich-editor {
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 67455c5557..72f4d244a7 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -605,7 +605,8 @@ useEventListener(
(e: FocusEvent) => {
const nextActiveFieldTitle =
(e?.relatedTarget as HTMLElement)?.getAttribute('data-title') ||
- (e?.relatedTarget as HTMLElement)?.offsetParent?.closest('.nc-form-focus-element')?.getAttribute('data-title')
+ (e?.relatedTarget as HTMLElement)?.offsetParent?.closest('.nc-form-focus-element')?.getAttribute('data-title') ||
+ (e?.relatedTarget as HTMLElement)?.closest('.nc-form-focus-element')?.getAttribute('data-title')
if (activeRow.value && nextActiveFieldTitle && activeRow.value !== nextActiveFieldTitle) {
if (isTabPressed.value) {
diff --git a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
index 9cc5c7be7b..70a3e08f76 100644
--- a/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
+++ b/packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue
@@ -112,7 +112,7 @@ const onDecode = async (scannedCodeValue: string) => {
{
@@ -1726,6 +1735,16 @@ useEventListener(
}
}
}
+
+.nc-form-wrapper {
+ .ant-switch:focus,
+ .ant-switch-checked:focus {
+ box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3366ff;
+ &:hover {
+ box-shadow: none;
+ }
+ }
+}
{{ sharedFormView.heading }}
-
+
{
Date: Sat, 2 Mar 2024 07:32:40 +0000
Subject: [PATCH 18/41] fix(nc-gui): rich text on blur remove menu option
---
packages/nc-gui/components/cell/RichText.vue | 21 +++++++++++--------
.../nc-gui/components/smartsheet/Form.vue | 2 --
2 files changed, 12 insertions(+), 11 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index 40c52c4d71..d18b9c5268 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -19,7 +19,6 @@ const props = defineProps<{
fullMode?: boolean
isFormField?: boolean
autofocus?: boolean
- isTabPressed?: boolean
placeholder?: string
renderAsText?: boolean
}>()
@@ -141,7 +140,7 @@ const editor = useEditor({
isFocused.value = true
},
onBlur: (e) => {
- if (props.isTabPressed) {
+ if (!(e?.event?.relatedTarget as HTMLElement)?.closest('.bubble-menu, .nc-textarea-rich-editor')) {
isFocused.value = false
e?.editor?.setEditable(false)
}
@@ -202,13 +201,17 @@ watch(editorDom, () => {
}, 50)
})
-onClickOutside(editorDom, (e) => {
- if ((e.target as HTMLElement)?.closest('.bubble-menu')) {
- return
- }
-
- isFocused.value = false
-})
+useEventListener(
+ editorDom,
+ 'focusout',
+ (e: FocusEvent) => {
+ if (!(e?.relatedTarget as HTMLElement)?.closest('.bubble-menu, .nc-textarea-rich-editor')) {
+ isFocused.value = false
+ editor.value?.setEditable(false)
+ }
+ },
+ true,
+)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 72f4d244a7..90ba55bbec 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -936,7 +936,6 @@ useEventListener(
class="nc-form-focus-element font-medium text-base !text-gray-500"
is-form-field
:autofocus="activeRow === 'nc-form-sub-heading'"
- :is-tab-pressed="isTabPressed"
data-testid="nc-form-sub-heading"
data-title="nc-form-sub-heading"
@update:value="updateView"
@@ -1083,7 +1082,6 @@ useEventListener(
:placeholder="$t('msg.info.formHelpText')"
class="form-meta-input nc-form-input-help-text"
is-form-field
- :is-tab-pressed="isTabPressed"
data-testid="nc-form-input-help-text"
@update:value="updateColMeta(element)"
/>
From 93d65f910be5065be33fcb9e66e91ef632aa2291 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:40 +0000
Subject: [PATCH 19/41] fix(nc-gui): disable heading in form element rich text
---
packages/nc-gui/components/cell/RichText.vue | 6 ++++--
1 file changed, 4 insertions(+), 2 deletions(-)
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index d18b9c5268..f30e9bcb45 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -9,7 +9,7 @@ import Underline from '@tiptap/extension-underline'
import Placeholder from '@tiptap/extension-placeholder'
import { TaskItem } from '@/helpers/dbTiptapExtensions/task-item'
import { Link } from '@/helpers/dbTiptapExtensions/links'
-import { IsExpandedFormOpenInj, IsFormInj, ReadonlyInj, RowHeightInj, onClickOutside } from '#imports'
+import { IsExpandedFormOpenInj, IsFormInj, ReadonlyInj, RowHeightInj } from '#imports'
const props = defineProps<{
value?: string | null
@@ -112,7 +112,9 @@ const editorDom = ref(null)
const vModel = useVModel(props, 'value', emits, { defaultValue: '' })
const tiptapExtensions = [
- StarterKit,
+ StarterKit.configure({
+ heading: props.isFormField ? false : undefined,
+ }),
TaskList,
TaskItem.configure({
nested: true,
From c37e441ed4912d6e4dcff2c9a5ac28c8f6134cba Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:41 +0000
Subject: [PATCH 20/41] chore(nc-gui): lint
---
packages/nc-gui/utils/iconUtils.ts | 1 +
1 file changed, 1 insertion(+)
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index 4571430a69..41a6cafcdb 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -128,6 +128,7 @@ import NcItalic from '~icons/nc-icons/italic'
import NcBold from '~icons/nc-icons/bold'
import NcUnderline from '~icons/nc-icons/underline'
import NcCrop from '~icons/nc-icons/crop'
+import NcLink from '~icons/nc-icons/link'
// keep it for reference
// todo: remove it after all icons are migrated
From 6ddf2a18ea77075cfb80e6a9bb6f7095026db562 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:41 +0000
Subject: [PATCH 21/41] fix(nc-gui): duplicate table message typo mistake
---
packages/nc-gui/components/dlg/TableDuplicate.vue | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/packages/nc-gui/components/dlg/TableDuplicate.vue b/packages/nc-gui/components/dlg/TableDuplicate.vue
index e3837271d6..6bc32ab60e 100644
--- a/packages/nc-gui/components/dlg/TableDuplicate.vue
+++ b/packages/nc-gui/components/dlg/TableDuplicate.vue
@@ -144,7 +144,7 @@ const isEaster = ref(false)
{{ $t('general.duplicate') }} {{ $t('objects.table') }}
- ) {
)
}
-async function handleAddOrRemoveAllColumns(value: boolean) {
+async function handleAddOrRemoveAllColumns(value: T) {
if (isLocked.value || !isEditable) return
if (value) {
@@ -607,8 +612,11 @@ useEventListener(
(e?.relatedTarget as HTMLElement)?.getAttribute('data-title') ||
(e?.relatedTarget as HTMLElement)?.offsetParent?.closest('.nc-form-focus-element')?.getAttribute('data-title') ||
(e?.relatedTarget as HTMLElement)?.closest('.nc-form-focus-element')?.getAttribute('data-title')
-
- if (activeRow.value && nextActiveFieldTitle && activeRow.value !== nextActiveFieldTitle) {
+ if (
+ (activeRow.value || [NcForm.heading, NcForm.subheading].includes(nextActiveFieldTitle as NcForm)) &&
+ nextActiveFieldTitle &&
+ activeRow.value !== nextActiveFieldTitle
+ ) {
if (isTabPressed.value) {
activeRow.value = nextActiveFieldTitle
}
@@ -720,7 +728,7 @@ useEventListener(
- {{ $t('msg.warning.duplicateProject') }}
+ {{ $t('msg.warning.duplicateTable') }}
{{ $t('title.advancedSettings') }}
From 4f8d187d075942fffb2c6d6d0a95025cf0dcd1f5 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Sat, 2 Mar 2024 07:32:41 +0000
Subject: [PATCH 22/41] fix(nc-gui): add focus box shadow for switch btn in
form view
---
.../nc-gui/components/smartsheet/Form.vue | 53 +++++++++++++------
1 file changed, 36 insertions(+), 17 deletions(-)
diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 90ba55bbec..f6474bf6c0 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -63,6 +63,11 @@ const hiddenColTypes = [
UITypes.LastModifiedBy,
]
+const enum NcForm {
+ heading = 'nc-form-heading',
+ subheading = 'nc-form-sub-heading',
+}
+
const { isMobileMode, user } = useGlobal()
const formRef = ref()
@@ -339,7 +344,7 @@ function shouldSkipColumn(col: Record
+
-
{{ $t('activity.selectAllFields') }}
-
@@ -1406,7 +1415,7 @@ useEventListener(
*