From cda8d0518e22c22c182f1e8c78308f32939bea28 Mon Sep 17 00:00:00 2001
From: Lightling <contact@lightling.xyz>
Date: Sun, 23 Mar 2025 15:45:01 -0400
Subject: [PATCH] refactor inputimage to use src only
---
src/components/InputImage.vue | 21 +++++++--------------
src/views/Editor/DataEditor.vue | 7 ++++++-
2 files changed, 13 insertions(+), 15 deletions(-)
diff --git a/src/components/InputImage.vue b/src/components/InputImage.vue
index 1747888..b60b223 100644
--- a/src/components/InputImage.vue
+++ b/src/components/InputImage.vue
@@ -17,19 +17,19 @@ import type { EditingRow } from 'src/types/editing'
const store = useAppStore()
+const props = defineProps<{
+ src: string
+}>()
const emit = defineEmits<{
(e: 'saved', val: string): void
(e: 'canceled'): void
}>()
-const row = defineModel<EditingRow | null>('row')
const filePath = ref(store.currentInventory.filePath.replace('.json', '/'))
const currentSrc = ref('')
const renderedSrc = computed(() => {
return currentSrc.value
? currentSrc.value
- : !!row.value && !!row.value.data[row.value.field] && !!(row.value.data[row.value.field]).src
- ? (row.value.data[row.value.field]).src
- : ''
+ : props.src
})
const currentBlob = ref<Blob>()
@@ -54,12 +54,6 @@ const onBrowseForImage = async (e: Event) => {
}
}
-const onCancel = (e: Event) => {
- e.preventDefault()
- emit('canceled')
- reset()
-}
-
function convertToDataUrlViaCanvas(url: string, callback: (val: string) => void, outputFormat: string) {
const image = new Image()
image.onload = function() {
@@ -76,16 +70,15 @@ function convertToDataUrlViaCanvas(url: string, callback: (val: string) => void,
image.src = url
}
-const reset = () => {
- row.value = null
- currentSrc.value = ''
+const onCancel = (e: Event) => {
+ e.preventDefault()
+ emit('canceled')
}
const onSave = async (e: Event) => {
e.preventDefault()
convertToDataUrlViaCanvas(currentSrc.value, (val) => {
emit('saved', val)
- reset()
}, currentBlob.value!.type)
}
</script>
diff --git a/src/views/Editor/DataEditor.vue b/src/views/Editor/DataEditor.vue
index 98775c3..7b13e0d 100644
--- a/src/views/Editor/DataEditor.vue
+++ b/src/views/Editor/DataEditor.vue
@@ -39,6 +39,11 @@ const editingRows = ref<DataRow[]>([])
const expandedRows = ref<DataRow[]>([])
const editingImage = ref(false)
const editingImageRow = ref(null as EditingRow | null)
+const editingImageSrc = computed(() => (
+ editingImageRow.value && !!editingImageRow.value.data[editingImageRow.value.field] && !!(editingImageRow.value.data[editingImageRow.value.field]).src
+ ? (editingImageRow.value.data[editingImageRow.value.field]).src
+ : ''
+))
const editingRow = ref(false)
const editingRowData = ref(null as EditingRow | null)
const columnsByKey = computed(() => Object.assign({}, ...props.columns.map(c => ({[c.name]: c}))))
@@ -145,7 +150,7 @@ Dialog(
header='Edit Image'
)
InputImage(
- v-model:row='editingImageRow'
+ :src='editingImageSrc'
@saved='onSaveImage'
@canceled='onCancelImage'
)