clone/nocodb
1
0
Fork 0
mirror of https://github.com/nocodb/nocodb.git synced 2026-05-05 07:46:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/develop' into fix/i18n

Browse Source
This commit is contained in:
Muhammed Mustafa
2023-10-20 17:45:00 +05:30
parent 6cbeeab8dc 9ad7c89b08
commit a856d4bb18
829 changed files with 29623 additions and 15819 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/nc-gui/components/cell/attachment/Carousel.vue
View File

@@ -55,7 +55,7 @@ useEventListener(container, 'click', (e) => {
<template>
<GeneralOverlay v-model="selectedImage" :z-index="1001" class="bg-gray-500 bg-opacity-50">
<template v-if="selectedImage">
<div ref="container" class="overflow-hidden p-12 text-center relative">
<div ref="container" class="overflow-hidden p-12 text-center relative xs:h-screen">
<div class="text-white group absolute top-5 right-5">
<component
:is="iconMap.closeCircle"

42
packages/nc-gui/components/cell/attachment/index.vue
View File

@@ -152,14 +152,18 @@ useSelectedCellKeyupListener(inject(ActiveCellInj, ref(false)), (e) => {
const rowHeight = inject(RowHeightInj, ref())
const open = () => {
if (isMobileMode.value) return (isExpandedForm.value = true)
const open = (e: Event) => {
e.stopPropagation()
_open()
}
const openAttachment = (item: any) => {
if (isMobileMode.value) return
if (isMobileMode.value && !isExpandedForm.value) {
isExpandedForm.value = true
return
}
_openAttachment(item)
}
@@ -169,6 +173,14 @@ const onExpand = () => {
modalVisible.value = true
}
const onImageClick = (item: any) => {
if (isMobileMode.value && !isExpandedForm.value) return
if (!isMobileMode.value && (isGallery.value || (isKanban.value && !isExpandedForm.value))) return
selectedImage.value = item
}
</script>
<template>
@@ -178,7 +190,7 @@ const onExpand = () => {
:style="{
height: isForm || isExpandedForm ? undefined : `max(${(rowHeight || 1) * 1.8}rem, 41px)`,
}"
class="nc-attachment-cell relative flex color-transition flex items-center w-full"
class="nc-attachment-cell relative flex color-transition flex items-center w-full xs:(min-h-12 max-h-32)"
:class="{ 'justify-center': !active, 'justify-between': active }"
>
<LazyCellAttachmentCarousel />
@@ -198,26 +210,29 @@ const onExpand = () => {
<div
v-if="!isReadonly"
:class="{ 'mx-auto px-4': !visibleItems.length }"
:class="{ 'sm:(mx-auto px-4) xs:(w-full min-w-8)': !visibleItems.length }"
class="group cursor-pointer py-1 flex gap-1 items-center active:(ring ring-accent ring-opacity-100) rounded border-none shadow-sm hover:(bg-primary bg-opacity-10) dark:(!bg-slate-500)"
data-testid="attachment-cell-file-picker-button"
@click.stop="open"
@click="open"
>
<component :is="iconMap.reload" v-if="isLoading" :class="{ 'animate-infinite animate-spin': isLoading }" />
<NcTooltip placement="bottom">
<NcTooltip placement="bottom" class="xs:w-full">
<template #title
><span data-rec="true">{{ $t('activity.attachmentDrop') }} </span></template
>
<div v-if="active || !visibleItems.length || (isForm && visibleItems.length)" class="flex items-center gap-1">
<div
v-if="active || !visibleItems.length || (isForm && visibleItems.length)"
class="flex items-center gap-1 xs:(w-full min-w-12 h-8 justify-center)"
>
<MaterialSymbolsAttachFile
class="transform dark:(!text-white) group-hover:(!text-accent scale-120) text-gray-500 text-[0.75rem]"
/>
<div
v-if="!visibleItems.length"
data-rec="true"
class="group-hover:text-primary text-gray-500 dark:text-gray-200 dark:group-hover:!text-white text-xs"
class="group-hover:text-primary text-gray-500 dark:text-gray-200 dark:group-hover:!text-white text-xs xs:(justify-center rounded-lg text-sm)"
>
{{ $t('activity.addFiles') }}
</div>
@@ -245,12 +260,7 @@ const onExpand = () => {
<div
class="nc-attachment flex items-center flex-col flex-wrap justify-center"
:class="{ 'ml-2': active }"
@click="
() => {
if (isGallery || isMobileMode || (isKanban && !isExpandedForm)) return
selectedImage = item
}
"
@click="() => onImageClick(item)"
>
<LazyCellAttachmentImage
:alt="item.title || `#${i}`"
@@ -281,7 +291,7 @@ const onExpand = () => {
<div
v-if="active || (isForm && visibleItems.length)"
class="h-6 w-5 group cursor-pointer flex gap-1 items-center active:(ring ring-accent ring-opacity-100) rounded border-none p-1 hover:(bg-primary bg-opacity-10) dark:(!bg-slate-500)"
class="xs:hidden h-6 w-5 group cursor-pointer flex gap-1 items-center active:(ring ring-accent ring-opacity-100) rounded border-none p-1 hover:(bg-primary bg-opacity-10) dark:(!bg-slate-500)"
>
<component :is="iconMap.reload" v-if="isLoading" :class="{ 'animate-infinite animate-spin': isLoading }" />