mirror of
https://github.com/web3privacy/explorer-app.git
synced 2024-10-15 16:46:26 +02:00
Merge pull request #51 from web3privacy/dw/bug-fixes
Project publish fix
This commit is contained in:
commit
a03c04816d
5 changed files with 37 additions and 36 deletions
|
@ -78,20 +78,20 @@ const days = computed(() => {
|
||||||
>
|
>
|
||||||
<ProjectCreateComponentsSelect
|
<ProjectCreateComponentsSelect
|
||||||
v-model="day"
|
v-model="day"
|
||||||
class="lg:w-full!"
|
class="w-full!"
|
||||||
:options="days.map(day => ({ label: day.toString(), value: day }))"
|
:options="days.map(day => ({ label: day.toString(), value: day }))"
|
||||||
placeholder="Day"
|
placeholder="Day"
|
||||||
/>
|
/>
|
||||||
<ProjectCreateComponentsSelect
|
<ProjectCreateComponentsSelect
|
||||||
v-model="month"
|
v-model="month"
|
||||||
class="lg:w-full!"
|
class="w-full!"
|
||||||
ml--2px
|
ml--2px
|
||||||
:options="months.map(month => ({ label: month.label, value: month.value }))"
|
:options="months.map(month => ({ label: month.label, value: month.value }))"
|
||||||
placeholder="Month"
|
placeholder="Month"
|
||||||
/>
|
/>
|
||||||
<ProjectCreateComponentsSelect
|
<ProjectCreateComponentsSelect
|
||||||
v-model="year"
|
v-model="year"
|
||||||
class="lg:w-full!"
|
class="w-full!"
|
||||||
ml--2px
|
ml--2px
|
||||||
:options="years.map(year => ({ label: year.toString(), value: year }))"
|
:options="years.map(year => ({ label: year.toString(), value: year }))"
|
||||||
placeholder="Year"
|
placeholder="Year"
|
||||||
|
|
|
@ -4,12 +4,10 @@ import type { Project } from '~/types'
|
||||||
export const useProject = defineStore('project', () => {
|
export const useProject = defineStore('project', () => {
|
||||||
const project = ref<Partial<Project>>()
|
const project = ref<Partial<Project>>()
|
||||||
const projectImage = ref<File>()
|
const projectImage = ref<File>()
|
||||||
const isPublishing = ref(false)
|
|
||||||
|
|
||||||
const { getProjectById } = useData()
|
const { getProjectById } = useData()
|
||||||
|
|
||||||
function setProject(id: string) {
|
function setProject(id: string) {
|
||||||
clearProject()
|
|
||||||
project.value = getProjectById(id, { shallow: false }) as Project
|
project.value = getProjectById(id, { shallow: false }) as Project
|
||||||
delete project.value.ratings
|
delete project.value.ratings
|
||||||
}
|
}
|
||||||
|
@ -30,7 +28,6 @@ export const useProject = defineStore('project', () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
async function publishProject() {
|
async function publishProject() {
|
||||||
isPublishing.value = true
|
|
||||||
try {
|
try {
|
||||||
let imageBuffer: Buffer | undefined
|
let imageBuffer: Buffer | undefined
|
||||||
let base64Image: string | undefined
|
let base64Image: string | undefined
|
||||||
|
@ -58,14 +55,10 @@ export const useProject = defineStore('project', () => {
|
||||||
catch (e) {
|
catch (e) {
|
||||||
console.error(e)
|
console.error(e)
|
||||||
}
|
}
|
||||||
finally {
|
|
||||||
isPublishing.value = false
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
project,
|
project,
|
||||||
isPublishing,
|
|
||||||
setProject,
|
setProject,
|
||||||
clearProject,
|
clearProject,
|
||||||
saveProject,
|
saveProject,
|
||||||
|
|
|
@ -11,11 +11,10 @@ import ProjectCreateCategoriesHistory from '~/components/Project/Create/Categori
|
||||||
|
|
||||||
export const useProjectForm = defineStore('useProjectForm', () => {
|
export const useProjectForm = defineStore('useProjectForm', () => {
|
||||||
const { saveProject, publishProject } = useProject()
|
const { saveProject, publishProject } = useProject()
|
||||||
const { project, isPublishing } = storeToRefs(useProject())
|
const { project } = storeToRefs(useProject())
|
||||||
|
|
||||||
const isEditingName = ref(false)
|
const isEditingName = ref(false)
|
||||||
const { value: name, errorMessage: nameError } = useField<string>('name', yup.string().required().notOneOf(['Untitled', 'Undefined', 'Create', 'create']))
|
const { value: name, errorMessage: nameError } = useField<string>('name', yup.string().required().notOneOf(['Untitled', 'Undefined', 'Create', 'create']))
|
||||||
name.value = project.value?.name || 'Untitled'
|
|
||||||
|
|
||||||
function toggleEditName() {
|
function toggleEditName() {
|
||||||
isEditingName.value = !isEditingName.value
|
isEditingName.value = !isEditingName.value
|
||||||
|
@ -45,10 +44,9 @@ export const useProjectForm = defineStore('useProjectForm', () => {
|
||||||
const currentComponent = ref()
|
const currentComponent = ref()
|
||||||
|
|
||||||
async function next() {
|
async function next() {
|
||||||
if (selectedTab.value === 0) {
|
const isFormValid = selectedTab.value === 0 ? await currentComponent.value.isFormValid() : true
|
||||||
if (!(await currentComponent.value.isFormValid()) || nameError.value)
|
if (!isFormValid || nameError.value)
|
||||||
return
|
return
|
||||||
}
|
|
||||||
|
|
||||||
saveName()
|
saveName()
|
||||||
currentComponent.value.save()
|
currentComponent.value.save()
|
||||||
|
@ -59,12 +57,9 @@ export const useProjectForm = defineStore('useProjectForm', () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
async function jumpTo(index: number) {
|
async function jumpTo(index: number) {
|
||||||
if (selectedTab.value === 0) {
|
const isFormValid = selectedTab.value === 0 ? await currentComponent.value.isFormValid() : true
|
||||||
if (!(await currentComponent.value.isFormValid()) || nameError.value)
|
if (!isFormValid || nameError.value) {
|
||||||
return
|
return
|
||||||
if (nameError.value)
|
|
||||||
return
|
|
||||||
else saveName()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
saveName()
|
saveName()
|
||||||
|
@ -73,25 +68,29 @@ export const useProjectForm = defineStore('useProjectForm', () => {
|
||||||
selectedTab.value = index
|
selectedTab.value = index
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isPublishing = ref(false)
|
||||||
async function publish(isNew?: boolean) {
|
async function publish(isNew?: boolean) {
|
||||||
if (selectedTab.value === 0) {
|
isPublishing.value = true
|
||||||
if (!(await currentComponent.value.isFormValid()) || nameError.value)
|
const isFormValid = selectedTab.value === 0 ? await currentComponent.value.isFormValid() : true
|
||||||
|
if (!isFormValid || nameError.value)
|
||||||
return
|
return
|
||||||
}
|
|
||||||
else if (isPublishing) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
saveName()
|
saveName()
|
||||||
currentComponent.value?.save()
|
currentComponent.value?.save()
|
||||||
|
|
||||||
await publishProject()
|
await publishProject()
|
||||||
|
isPublishing.value = false
|
||||||
if (isNew)
|
if (isNew)
|
||||||
navigateTo('/')
|
navigateTo('/')
|
||||||
else
|
else
|
||||||
navigateTo(`/project/${project.value?.id || project.value?.name?.toLowerCase().replace(/\s+/g, '-')}`)
|
navigateTo(`/project/${project.value?.id || project.value?.name?.toLowerCase().replace(/\s+/g, '-')}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function initForm() {
|
||||||
|
selectedTab.value = 0
|
||||||
|
name.value = 'Untitled'
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
isEditingName,
|
isEditingName,
|
||||||
name,
|
name,
|
||||||
|
@ -104,5 +103,7 @@ export const useProjectForm = defineStore('useProjectForm', () => {
|
||||||
next,
|
next,
|
||||||
publish,
|
publish,
|
||||||
jumpTo,
|
jumpTo,
|
||||||
|
isPublishing,
|
||||||
|
initForm,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -5,10 +5,12 @@ definePageMeta({
|
||||||
|
|
||||||
const { projects } = useData()
|
const { projects } = useData()
|
||||||
const { setProject, saveProjectImage } = useProject()
|
const { setProject, saveProjectImage } = useProject()
|
||||||
const { project, isPublishing } = storeToRefs(useProject())
|
const { project } = storeToRefs(useProject())
|
||||||
|
const { initForm } = useProjectForm()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
await until(projects).toMatch(p => p?.length > 0)
|
await until(projects).toMatch(p => p?.length > 0)
|
||||||
|
initForm()
|
||||||
setProject(route.params.id as string)
|
setProject(route.params.id as string)
|
||||||
|
|
||||||
if (!project.value) {
|
if (!project.value) {
|
||||||
|
@ -38,7 +40,7 @@ onChange((files) => {
|
||||||
})
|
})
|
||||||
|
|
||||||
const { next, jumpTo, publish, toggleEditName } = useProjectForm()
|
const { next, jumpTo, publish, toggleEditName } = useProjectForm()
|
||||||
const { currentComponent, selectedTab, tabsArray, isEditingName, name, nameError } = storeToRefs(useProjectForm())
|
const { currentComponent, selectedTab, tabsArray, isEditingName, name, nameError, isPublishing } = storeToRefs(useProjectForm())
|
||||||
name.value = project.value?.name || 'Untitled'
|
name.value = project.value?.name || 'Untitled'
|
||||||
|
|
||||||
const projectNameInput = ref<HTMLInputElement | null>(null)
|
const projectNameInput = ref<HTMLInputElement | null>(null)
|
||||||
|
@ -299,7 +301,7 @@ const transitionDone = ref(false)
|
||||||
w-full
|
w-full
|
||||||
lg="w-fit"
|
lg="w-fit"
|
||||||
inverted-color
|
inverted-color
|
||||||
@click="publish()"
|
@click="isPublishing ? null : publish()"
|
||||||
>
|
>
|
||||||
<UnoIcon
|
<UnoIcon
|
||||||
v-if="isPublishing"
|
v-if="isPublishing"
|
||||||
|
|
|
@ -3,8 +3,8 @@ definePageMeta({
|
||||||
layout: 'create',
|
layout: 'create',
|
||||||
})
|
})
|
||||||
|
|
||||||
const { saveProjectImage } = useProject()
|
const { saveProjectImage, clearProject } = useProject()
|
||||||
const { project, isPublishing } = storeToRefs(useProject())
|
const { project } = storeToRefs(useProject())
|
||||||
|
|
||||||
const { open, onChange } = useFileDialog({
|
const { open, onChange } = useFileDialog({
|
||||||
accept: 'image/*', // Set to accept only image files
|
accept: 'image/*', // Set to accept only image files
|
||||||
|
@ -24,8 +24,8 @@ onChange((files) => {
|
||||||
saveProjectImage(file)
|
saveProjectImage(file)
|
||||||
})
|
})
|
||||||
|
|
||||||
const { next, jumpTo, publish, toggleEditName } = useProjectForm()
|
const { next, jumpTo, publish, toggleEditName, initForm } = useProjectForm()
|
||||||
const { currentComponent, selectedTab, tabsArray, isEditingName, name, nameError } = storeToRefs(useProjectForm())
|
const { currentComponent, selectedTab, tabsArray, isEditingName, name, nameError, isPublishing } = storeToRefs(useProjectForm())
|
||||||
|
|
||||||
const projectNameInput = ref<HTMLInputElement | null>(null)
|
const projectNameInput = ref<HTMLInputElement | null>(null)
|
||||||
watch(isEditingName, () => {
|
watch(isEditingName, () => {
|
||||||
|
@ -37,6 +37,11 @@ watch(isEditingName, () => {
|
||||||
})
|
})
|
||||||
|
|
||||||
const transitionDone = ref(false)
|
const transitionDone = ref(false)
|
||||||
|
|
||||||
|
onBeforeMount(() => {
|
||||||
|
clearProject()
|
||||||
|
initForm()
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@ -284,7 +289,7 @@ const transitionDone = ref(false)
|
||||||
w-full
|
w-full
|
||||||
lg="w-fit"
|
lg="w-fit"
|
||||||
inverted-color
|
inverted-color
|
||||||
@click="publish(true)"
|
@click="isPublishing ? null : publish(true)"
|
||||||
>
|
>
|
||||||
<UnoIcon
|
<UnoIcon
|
||||||
v-if="isPublishing"
|
v-if="isPublishing"
|
||||||
|
|
Loading…
Reference in a new issue