diff --git a/packages/frontend/src/components/grid/MkDataCell.vue b/packages/frontend/src/components/grid/MkDataCell.vue
index c6e428910b..6b90af1be3 100644
--- a/packages/frontend/src/components/grid/MkDataCell.vue
+++ b/packages/frontend/src/components/grid/MkDataCell.vue
@@ -4,8 +4,8 @@
:class="$style.cell"
:style="{ maxWidth: cellWidth, minWidth: cellWidth }"
:tabindex="-1"
- @dblclick="onCellDoubleClick"
@keydown="onCellKeyDown"
+ @dblclick="onCellDoubleClick"
>
import { computed, defineAsyncComponent, nextTick, onMounted, onUnmounted, ref, shallowRef, toRefs, watch } from 'vue';
-import { GridEventEmitter, GridSetting, Size } from '@/components/grid/grid.js';
+import { GridEventEmitter, Size } from '@/components/grid/grid.js';
import { useTooltip } from '@/scripts/use-tooltip.js';
import * as os from '@/os.js';
import { CellValue, GridCell } from '@/components/grid/cell.js';
import { equalCellAddress, getCellAddress } from '@/components/grid/grid-utils.js';
+import { GridRowSetting } from '@/components/grid/row.js';
+import { selectFile } from '@/scripts/select-file.js';
const emit = defineEmits<{
(ev: 'operation:beginEdit', sender: GridCell): void;
@@ -67,7 +69,7 @@ const emit = defineEmits<{
}>();
const props = defineProps<{
cell: GridCell,
- gridSetting: GridSetting,
+ gridSetting: GridRowSetting,
bus: GridEventEmitter,
}>();
@@ -162,7 +164,7 @@ function unregisterOutsideMouseDown() {
removeEventListener('mousedown', onOutsideMouseDown);
}
-function beginEditing() {
+async function beginEditing() {
if (editing.value || !cell.value.column.setting.editable) {
return;
}
@@ -174,7 +176,7 @@ function beginEditing() {
registerOutsideMouseDown();
emit('operation:beginEdit', cell.value);
- nextTick(() => {
+ await nextTick(() => {
// inputの展開後にフォーカスを当てたい
if (inputAreaEl.value) {
(inputAreaEl.value.querySelector('*') as HTMLElement).focus();
@@ -187,6 +189,13 @@ function beginEditing() {
emitValueChange(!cell.value.value);
break;
}
+ case 'image': {
+ const file = await selectFile(rootEl.value);
+ if (file) {
+ emitValueChange(JSON.stringify(file));
+ }
+ break;
+ }
}
}
@@ -229,7 +238,7 @@ useTooltip(rootEl, (showing) => {
os.popup(defineAsyncComponent(() => import('@/components/grid/MkCellTooltip.vue')), {
showing,
content,
- targetElement: rootEl.value,
+ targetElement: rootEl.value!,
}, {}, 'closed');
});
diff --git a/packages/frontend/src/components/grid/MkDataRow.vue b/packages/frontend/src/components/grid/MkDataRow.vue
index aaa6781a9c..6c4022205e 100644
--- a/packages/frontend/src/components/grid/MkDataRow.vue
+++ b/packages/frontend/src/components/grid/MkDataRow.vue
@@ -1,7 +1,16 @@
-
+
@@ -20,11 +29,11 @@