cyberes
/
geoserver
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

improve upload flow

This commit is contained in:
Cyberes 2024-06-14 12:19:38 -06:00
parent 45c86eb6d7
commit 93e2ef61fc
2 changed files with 21 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/geo-frontend/src/components/import/ImportHome.vue
View File

@ -10,6 +10,7 @@
<table>
<thead>
<tr>
<th>ID</th>
<th>File Name</th>
<th>Features</th>
<th></th>
@ -17,6 +18,9 @@
</thead>
<tbody>
<tr v-for="(item, index) in processQueue" :key="`item-${index}`">
<td>
<a :href="`/#/import/process/${item.id}`">{{ item.id }}</a>
</td>
<td>
<a :href="`/#/import/process/${item.id}`">{{ item.original_filename }}</a>
</td>
@ -24,7 +28,7 @@
{{ item.processing === true ? "processing" : item.feature_count }}
</td>
<td>
<button @click="deleteItem(item.id)">Delete</button>
<button @click="deleteItem(item, index)">Delete</button>
</td>
</tr>
</tbody>
@ -54,16 +58,20 @@ export default {
const response = await axios.get('/api/data/item/import/get/mine')
this.processQueue = response.data.data
},
async deleteItem(id) {
async deleteItem(item, index) {
if (window.confirm(`Delete "${item.original_filename}" (#${item.id})`))
try {
const response = await axios.delete('/api/data/item/import/delete/' + id, {
this.processQueue.splice(index, 1)
// TODO: add a message popup when delete is completed
const response = await axios.delete('/api/data/item/import/delete/' + item.id, {
headers: {
'X-CSRFToken': this.userInfo.csrftoken
}
})
await this.fetchQueueList()
} catch (error) {
alert(`Failed to delete ${id}: ${error.message}`)
alert(`Failed to delete ${item.id}: ${error.message}`)
this.processQueue.splice(index, 0, item)
}
}
},

14
src/geo-frontend/src/components/import/Upload.vue
View File

@ -56,6 +56,7 @@ export default {
let formData = new FormData()
formData.append('file', this.file)
try {
this.disableUpload = true
const response = await axios.post('/api/data/item/import/upload/', formData, {
headers: {
'Content-Type': 'multipart/form-data',
@ -63,7 +64,6 @@ export default {
}
})
this.uploadMsg = `<p>${capitalizeFirstLetter(response.data.msg).trim(".")}.</p><p><a href="/#/import/process/${response.data.id}">Continue to Import</a>`
this.disableUpload = true
await this.fetchQueueList()
this.file = null
document.getElementById("uploadInput").value = ""
@ -82,18 +82,6 @@ export default {
const response = await axios.get('/api/data/item/import/get/mine')
this.processQueue = response.data.data
},
async deleteItem(id) {
try {
const response = await axios.delete('/api/data/item/import/delete/' + id, {
headers: {
'X-CSRFToken': this.userInfo.csrftoken
}
})
await this.fetchQueueList()
} catch (error) {
alert(`Failed to delete ${id}: ${error.message}`)
}
}
},
async created() {
},