Browse Source

geodata: pass default geo position (based on map click) through to GeoData column component

pull/4723/head
flisowna 2 years ago
parent
commit
c63c343a48
  1. 7
      packages/nc-gui/components/cell/GeoData.vue
  2. 9
      packages/nc-gui/components/smartsheet/Cell.vue
  3. 40
      packages/nc-gui/components/smartsheet/expanded-form/index.vue

7
packages/nc-gui/components/cell/GeoData.vue

@ -4,6 +4,10 @@ import { useVModel } from '#imports'
interface Props { interface Props {
modelValue?: string | null modelValue?: string | null
defaultGeoPosition?: {
lat: number
long: number
}
} }
interface Emits { interface Emits {
@ -16,6 +20,8 @@ const emits = defineEmits<Emits>()
const vModel = useVModel(props, 'modelValue', emits) const vModel = useVModel(props, 'modelValue', emits)
const defaultGeoPosition = useVModel(props, 'defaultGeoPosition')
let error = $ref<string | undefined>() let error = $ref<string | undefined>()
let isExpanded = $ref(false) let isExpanded = $ref(false)
@ -93,6 +99,7 @@ const onGetCurrentLocation = () => {
@mousedown.stop @mousedown.stop
/> />
</a-form-item> </a-form-item>
defaultGeoPosition: {{ JSON.stringify(defaultGeoPosition) }}
<a-form-item class="inputLng" label="Lng"> <a-form-item class="inputLng" label="Lng">
<a-input <a-input
v-model:value="formState.longitude" v-model:value="formState.longitude"

9
packages/nc-gui/components/smartsheet/Cell.vue

@ -19,9 +19,9 @@ import {
isDateTime, isDateTime,
isDecimal, isDecimal,
isDuration, isDuration,
isGeoData,
isEmail, isEmail,
isFloat, isFloat,
isGeoData,
isInt, isInt,
isJSON, isJSON,
isManualSaved, isManualSaved,
@ -46,6 +46,7 @@ import {
useVModel, useVModel,
} from '#imports' } from '#imports'
import { NavigateDir } from '~/lib' import { NavigateDir } from '~/lib'
import { InitialGeoPositionData } from './expanded-form/index.vue';
interface Props { interface Props {
column: ColumnType column: ColumnType
@ -55,6 +56,10 @@ interface Props {
rowIndex?: number rowIndex?: number
active?: boolean active?: boolean
virtual?: boolean virtual?: boolean
// TODO: check whether
// a) this is in general the right approach to pass in default values
// b) if yes: probably we want to make it generic (column type independent)
defaultGeoPosition?: InitialGeoPositionData
} }
const props = defineProps<Props>() const props = defineProps<Props>()
@ -139,7 +144,7 @@ const syncAndNavigate = (dir: NavigateDir, e: KeyboardEvent) => {
> >
<template v-if="column"> <template v-if="column">
<LazyCellTextArea v-if="isTextArea(column)" v-model="vModel" /> <LazyCellTextArea v-if="isTextArea(column)" v-model="vModel" />
<LazyCellGeoData v-else-if="isGeoData(column)" v-model="vModel" /> <LazyCellGeoData v-else-if="isGeoData(column)" v-model="vModel" :default-geo-position="props.defaultGeoPosition" />
<LazyCellCheckbox v-else-if="isBoolean(column, abstractType)" v-model="vModel" /> <LazyCellCheckbox v-else-if="isBoolean(column, abstractType)" v-model="vModel" />
<LazyCellAttachment v-else-if="isAttachment(column)" v-model="vModel" :row-index="props.rowIndex" /> <LazyCellAttachment v-else-if="isAttachment(column)" v-model="vModel" :row-index="props.rowIndex" />
<LazyCellSingleSelect v-else-if="isSingleSelect(column)" v-model="vModel" :row-index="props.rowIndex" /> <LazyCellSingleSelect v-else-if="isSingleSelect(column)" v-model="vModel" :row-index="props.rowIndex" />

40
packages/nc-gui/components/smartsheet/expanded-form/index.vue

@ -6,6 +6,7 @@ import {
FieldsInj, FieldsInj,
IsFormInj, IsFormInj,
IsKanbanInj, IsKanbanInj,
IsMapInj,
MetaInj, MetaInj,
ReloadRowDataHookInj, ReloadRowDataHookInj,
computedInject, computedInject,
@ -23,7 +24,7 @@ import {
} from '#imports' } from '#imports'
import type { Row } from '~/lib' import type { Row } from '~/lib'
interface InitialGeoPositionData { export interface InitialGeoPositionData {
lat?: number lat?: number
long?: number long?: number
geoColId?: string geoColId?: string
@ -51,6 +52,8 @@ const state = toRef(props, 'state')
const meta = toRef(props, 'meta') const meta = toRef(props, 'meta')
const newRow = row.value.row.geoColId
// const initialGeoPositionData = toRef(props, 'initialGeoPositionData') // const initialGeoPositionData = toRef(props, 'initialGeoPositionData')
const initialGeoPositionData = ref(props.initialGeoPositionData) const initialGeoPositionData = ref(props.initialGeoPositionData)
@ -65,6 +68,8 @@ const fields = computedInject(FieldsInj, (_fields) => {
const isKanban = inject(IsKanbanInj, ref(false)) const isKanban = inject(IsKanbanInj, ref(false))
const isMap = inject(IsMapInj, ref(false))
provide(MetaInj, meta) provide(MetaInj, meta)
const { commentsDrawer, changedColumns, state: rowState, isNew, loadRow } = useProvideExpandedFormStore(meta, row) const { commentsDrawer, changedColumns, state: rowState, isNew, loadRow } = useProvideExpandedFormStore(meta, row)
@ -120,7 +125,6 @@ reloadHook.on(() => {
if (isNew.value) return if (isNew.value) return
loadRow() loadRow()
}) })
provide(ReloadRowDataHookInj, reloadHook) provide(ReloadRowDataHookInj, reloadHook)
if (isKanban.value) { if (isKanban.value) {
@ -132,10 +136,37 @@ if (isKanban.value) {
} }
} }
// if (isMap.value) {
// console.log('fields', fields.value)
// for (const [k, v] of Object.entries(row.value.row)) {
// if (v) {
// console.log('value', v, 'key', k)
// }
// }
// if (initialGeoPositionData?.value?.lat) {
// // Filter the columns by their id
// const filteredColumns = meta?.value?.columns.filter((col) => col.id === initialGeoPositionData?.value?.geoColId)
// // If there are any columns that match the geoColId
// if (filteredColumns.length > 0) {
// // Get the first (and possibly only) column that matches the geoColId
// const geoColumn = filteredColumns[0]
// console.log('geoColumn', geoColumn.id )
// // Load the lat and long values for the geoColumn
// if (geoColumn.title) {
// const lat = initialGeoPositionData.value.lat
// const long = initialGeoPositionData.value.long
// row.value.row[geoColumn.title] = lat
// console.log('lat', lat)
// console.log('long', long)
// }
// }
// }
// }
const cellWrapperEl = ref<HTMLElement>() const cellWrapperEl = ref<HTMLElement>()
onMounted(() => { onMounted(() => {
setTimeout(() => { setTimeout(() => {
;(cellWrapperEl.value?.querySelector('input,select,textarea') as HTMLInputElement)?.focus() ;(cellWrapperEl.value?.querySelector('input,select,textarea') as HTMLInputElement)?.focus()
}) })
@ -161,7 +192,7 @@ export default {
<SmartsheetExpandedFormHeader :view="props.view" @cancel="onClose" /> <SmartsheetExpandedFormHeader :view="props.view" @cancel="onClose" />
<div class="!bg-gray-100 rounded flex-1"> <div class="!bg-gray-100 rounded flex-1">
FOO geodata: {{ JSON.stringify(initialGeoPositionData) }} BAR FOO geodata: {{ JSON.stringify(initialGeoPositionData?.geoColId) }} BAR
<div class="flex h-full nc-form-wrapper items-stretch min-h-[max(70vh,100%)]"> <div class="flex h-full nc-form-wrapper items-stretch min-h-[max(70vh,100%)]">
<div class="flex-1 overflow-auto scrollbar-thin-dull nc-form-fields-container"> <div class="flex-1 overflow-auto scrollbar-thin-dull nc-form-fields-container">
@ -190,6 +221,7 @@ export default {
:column="col" :column="col"
:edit-enabled="true" :edit-enabled="true"
:active="true" :active="true"
:default-geo-position="initialGeoPositionData"
@update:model-value="changedColumns.add(col.title)" @update:model-value="changedColumns.add(col.title)"
/> />
</div> </div>

Loading…
Cancel
Save