mirror of
https://github.com/nocodb/nocodb.git
synced 2026-05-02 19:17:01 +00:00
575ff920ef
* fix(nc-gui): update shared grid view * fix(nc-gui): shared gallery view padding issue * fix(nc-gui): Shared kanban view padding issue * fix(nc-gui): reduce calender shared view padding * fix(nc-gui): reduce shared form view padding * fix(nc-gui): update shared view password modal * fix(nc-gui): shared view password input error handling * fix(nc-gui): reduce expanded form modal width if comment section is not present * fix(nc-gui): small changes * fix(nc-gui): add export download view in topbar of shared view * fix(nc-gui): small changes * fix(nc-gui): add blur bg image for shared view password modal * fix(nc-gui): download shared view dropdown ui changes * fix(nc-gui): expanded form scroll issue * fix(nc-gui): click anywhere in card should open expanded form * fix(nc-gui): hide action icon on gallery/kanban card hover * fix(nc-gui): expanded form cell hover effect * fix(nc-gui): add sign up for free btn in shared view * test: update shared view test cases * test: update calendar test cases * fix(nc-gui): remove readonly prefix from attachment modal * fix(nc-gui): remove focus border effect if field is readonly * fix(nc-gui): shared view groupby pagination size should be 10 * fix(nc-gui): remove field modal input shadow if field is disabled * fix(nc-gui): add shadow on expanded form fields * fix(nc-gui): calendar shared view background color update * fix(nc-gui): shared view download btn text color * fix(nc-gui): update url, link, email grid text color if cell is active and remove hover effect * fix(nc-gui): pr review changes
76 lines
2.4 KiB
Vue
76 lines
2.4 KiB
Vue
<script setup lang="ts">
|
|
import type { ColumnType } from 'nocodb-sdk'
|
|
import { isCreatedOrLastModifiedByCol, isCreatedOrLastModifiedTimeCol } from 'nocodb-sdk'
|
|
|
|
const props = defineProps<{
|
|
column: ColumnType
|
|
modelValue: any
|
|
row?: Row
|
|
active?: boolean
|
|
readOnly?: boolean
|
|
}>()
|
|
|
|
const emit = defineEmits(['update:modelValue', 'navigate', 'save'])
|
|
|
|
const column = toRef(props, 'column')
|
|
const active = toRef(props, 'active', false)
|
|
const row = toRef(props, 'row')
|
|
const readOnly = toRef(props, 'readOnly', false)
|
|
|
|
provide(ColumnInj, column)
|
|
provide(ActiveCellInj, active)
|
|
provide(RowInj, row)
|
|
provide(CellValueInj, toRef(props, 'modelValue'))
|
|
provide(SaveRowInj, () => emit('save'))
|
|
provide(ReadonlyInj, readOnly)
|
|
|
|
const isGrid = inject(IsGridInj, ref(false))
|
|
|
|
const isForm = inject(IsFormInj, ref(false))
|
|
|
|
const isExpandedForm = inject(IsExpandedFormOpenInj, ref(false))
|
|
|
|
function onNavigate(dir: NavigateDir, e: KeyboardEvent) {
|
|
emit('navigate', dir)
|
|
|
|
if (!isForm.value) e.stopImmediatePropagation()
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
class="nc-virtual-cell w-full flex items-center"
|
|
:class="[
|
|
`nc-virtual-cell-${(column.uidt || 'default').toLowerCase()}`,
|
|
{
|
|
'text-right justify-end': isGrid && !isForm && isRollup(column) && !isExpandedForm,
|
|
'nc-display-value-cell': isPrimary(column) && !isForm,
|
|
},
|
|
]"
|
|
@keydown.enter.exact="onNavigate(NavigateDir.NEXT, $event)"
|
|
@keydown.shift.enter.exact="onNavigate(NavigateDir.PREV, $event)"
|
|
>
|
|
<LazyVirtualCellLinks v-if="isLink(column)" />
|
|
<LazyVirtualCellHasMany v-else-if="isHm(column)" />
|
|
<LazyVirtualCellManyToMany v-else-if="isMm(column)" />
|
|
<LazyVirtualCellBelongsTo v-else-if="isBt(column)" />
|
|
<LazyVirtualCellOneToOne v-else-if="isOo(column)" />
|
|
<LazyVirtualCellRollup v-else-if="isRollup(column)" />
|
|
<LazyVirtualCellFormula v-else-if="isFormula(column)" />
|
|
<LazyVirtualCellQrCode v-else-if="isQrCode(column)" />
|
|
<LazyVirtualCellBarcode v-else-if="isBarcode(column)" />
|
|
<LazyVirtualCellCount v-else-if="isCount(column)" />
|
|
<LazyVirtualCellLookup v-else-if="isLookup(column)" />
|
|
<LazyCellReadOnlyDateTimePicker v-else-if="isCreatedOrLastModifiedTimeCol(column)" :model-value="modelValue" />
|
|
<LazyCellReadOnlyUser v-else-if="isCreatedOrLastModifiedByCol(column)" :model-value="modelValue" />
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.nc-virtual-cell {
|
|
&.nc-display-value-cell {
|
|
@apply !text-brand-500;
|
|
}
|
|
}
|
|
</style>
|