nocodb/packages/nc-gui/components/virtual-cell/Rollup.vue

<script setup lang="ts">
import { CellValueInj, inject } from '#imports'

const value = inject(CellValueInj)

const showEditWarning = ref(false)

const showClearWarning = ref(false)

const showEditWarningMessage = () => {
  showEditWarning.value = true

  setTimeout(() => {
    showEditWarning.value = false
  }, 3000)
}

const showClearWarningMessage = () => {
  showClearWarning.value = true

  setTimeout(() => {
    showClearWarning.value = false
  }, 3000)
}

useSelectedCellKeyupListener(inject(ActiveCellInj, ref(false)), (e: KeyboardEvent) => {
  switch (e.key) {
    case 'Enter':
      showEditWarningMessage()
      break
    case 'Delete':
      showClearWarningMessage()
      break
  }
})
</script>

<template>
  <div>
    <span class="text-center pl-3">
      {{ value }}
    </span>

    <div>
      <div v-if="showEditWarning" class="text-left text-wrap mt-2 text-[#e65100] text-xs">
        <!-- TODO: i18n -->
        Warning: Computed field - unable to edit content.
      </div>
      <div v-if="showClearWarning" class="text-left text-wrap mt-2 text-[#e65100] text-xs">
        <!-- TODO: i18n -->
        Warning: Computed field - unable to clear content.
      </div>
    </div>
  </div>
</template>