|
|
|
@ -8,6 +8,7 @@ import {
|
|
|
|
|
IsExpandedFormOpenInj, |
|
|
|
|
IsFormInj, |
|
|
|
|
IsSurveyFormInj, |
|
|
|
|
ReadonlyInj, |
|
|
|
|
computed, |
|
|
|
|
inject, |
|
|
|
|
isValidURL, |
|
|
|
@ -39,13 +40,15 @@ const isEditColumn = inject(EditColumnInj, ref(false))
|
|
|
|
|
|
|
|
|
|
const disableOverlay = inject(CellUrlDisableOverlayInj, ref(false)) |
|
|
|
|
|
|
|
|
|
// Used in the logic of when to display error since we are not storing the url if it's not valid |
|
|
|
|
const localState = ref(value) |
|
|
|
|
|
|
|
|
|
const rowHeight = inject(RowHeightInj, ref(undefined)) |
|
|
|
|
|
|
|
|
|
const isSurveyForm = inject(IsSurveyFormInj, ref(false)) |
|
|
|
|
|
|
|
|
|
const readOnly = inject(ReadonlyInj, ref(false)) |
|
|
|
|
|
|
|
|
|
// Used in the logic of when to display error since we are not storing the url if it's not valid |
|
|
|
|
const localState = ref(value) |
|
|
|
|
|
|
|
|
|
const vModel = computed({ |
|
|
|
|
get: () => value, |
|
|
|
|
set: (val) => { |
|
|
|
@ -92,12 +95,11 @@ watch(
|
|
|
|
|
<template> |
|
|
|
|
<div class="flex flex-row items-center justify-between w-full h-full"> |
|
|
|
|
<input |
|
|
|
|
v-if="editEnabled" |
|
|
|
|
v-if="!readOnly && editEnabled" |
|
|
|
|
:ref="focus" |
|
|
|
|
v-model="vModel" |
|
|
|
|
:placeholder="isEditColumn ? $t('labels.enterDefaultUrlOptional') : ''" |
|
|
|
|
class="outline-none text-sm w-full py-1 bg-transparent h-full" |
|
|
|
|
:class="isExpandedFormOpen ? 'px-2' : 'px-0'" |
|
|
|
|
class="nc-cell-field outline-none text-sm w-full py-1 bg-transparent h-full" |
|
|
|
|
@blur="editEnabled = false" |
|
|
|
|
@keydown.down.stop |
|
|
|
|
@keydown.left.stop |
|
|
|
@ -108,31 +110,35 @@ watch(
|
|
|
|
|
@mousedown.stop |
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|
<span v-else-if="vModel === null && showNull" class="nc-null uppercase"> {{ $t('general.null') }}</span> |
|
|
|
|
<span v-else-if="vModel === null && showNull" class="nc-cell-field nc-null uppercase"> {{ $t('general.null') }}</span> |
|
|
|
|
|
|
|
|
|
<nuxt-link |
|
|
|
|
v-else-if="isValid && !cellUrlOptions?.overlay" |
|
|
|
|
no-prefetch |
|
|
|
|
no-rel |
|
|
|
|
class="z-3 text-sm underline hover:opacity-75" |
|
|
|
|
class="py-1 z-3 text-sm underline hover:opacity-75" |
|
|
|
|
:to="url" |
|
|
|
|
:target="cellUrlOptions?.behavior === 'replace' ? undefined : '_blank'" |
|
|
|
|
:tabindex="readOnly ? -1 : 0" |
|
|
|
|
> |
|
|
|
|
<LazyCellClampedText :value="value" :lines="rowHeight" /> |
|
|
|
|
<LazyCellClampedText :value="value" :lines="rowHeight" class="nc-cell-field" /> |
|
|
|
|
</nuxt-link> |
|
|
|
|
|
|
|
|
|
<nuxt-link |
|
|
|
|
v-else-if="isValid && !disableOverlay && cellUrlOptions?.overlay" |
|
|
|
|
no-prefetch |
|
|
|
|
no-rel |
|
|
|
|
class="z-3 w-full h-full text-center !no-underline hover:opacity-75" |
|
|
|
|
class="py-1 z-3 w-full h-full text-center !no-underline hover:opacity-75" |
|
|
|
|
:to="url" |
|
|
|
|
:target="cellUrlOptions?.behavior === 'replace' ? undefined : '_blank'" |
|
|
|
|
:tabindex="readOnly ? -1 : 0" |
|
|
|
|
> |
|
|
|
|
<LazyCellClampedText :value="cellUrlOptions.overlay" :lines="rowHeight" /> |
|
|
|
|
<LazyCellClampedText :value="cellUrlOptions.overlay" :lines="rowHeight" class="nc-cell-field" /> |
|
|
|
|
</nuxt-link> |
|
|
|
|
|
|
|
|
|
<span v-else class="w-9/10 overflow-ellipsis overflow-hidden"><LazyCellClampedText :value="value" :lines="rowHeight" /></span> |
|
|
|
|
<span v-else class="w-9/10 overflow-ellipsis overflow-hidden" |
|
|
|
|
><LazyCellClampedText :value="value" :lines="rowHeight" class="nc-cell-field" |
|
|
|
|
/></span> |
|
|
|
|
|
|
|
|
|
<div v-if="column.meta?.validate && !isValid && value?.length && !editEnabled" class="mr-1 w-1/10"> |
|
|
|
|
<a-tooltip placement="top"> |
|
|
|
|