Skip to content

Commit

Permalink
submitするときにポップアップでる問題を修正
Browse files Browse the repository at this point in the history
  • Loading branch information
mathsuky committed Oct 18, 2023
1 parent f34c306 commit 253efb0
Show file tree
Hide file tree
Showing 3 changed files with 185 additions and 58 deletions.
119 changes: 85 additions & 34 deletions src/components/event/EventFormBase.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@ import FormBackButton from '@/components/shared/FormBackButton.vue'
import { useDraftConfirmer } from '@/workers/draftConfirmer'
import { removeDraftConfirmer } from '@/workers/draftConfirmer'
import router from '@/router'
import { Route } from 'vue-router'
export type EventInput = EventInputContent &
(
Expand Down Expand Up @@ -118,6 +119,10 @@ export default class EventFormBase extends Vue {
instant: boolean = null!
originalSummary: EventSummary = null!
beforeEachControl: (() => void) | null = null
created() {
this.content = {
name: this.event?.name ?? '',
Expand Down Expand Up @@ -200,19 +205,15 @@ export default class EventFormBase extends Vue {
}
}
hasContent(): boolean {
return (
this.summary.name !== '' ||
this.summary.description !== '' ||
this.summary.tags.length > 0 ||
this.summary.groupName !== '' ||
this.summary.place !== '' ||
this.summary.timeStart !== '' ||
this.summary.timeEnd !== '' ||
this.summary.open ||
!this.summary.sharedRoom
)
isChanged(): boolean {
if (this.summary && this.originalSummary) {
return (
JSON.stringify(this.summary) !== JSON.stringify(this.originalSummary)
)
}
return false
}
cleanupContent(): void {
this.summary.name = ''
this.summary.description = ''
Expand All @@ -225,39 +226,89 @@ export default class EventFormBase extends Vue {
this.summary.sharedRoom = true
}
mounted() {
this.$watch('summary', () => {
if (this.hasContent()) {
useDraftConfirmer()
isEventNewOrEdit(): boolean {
const currentRoute: Route = this.$route
return currentRoute.name === 'EventNew'
}
beforLeaveGuardinEventEdit = (to, from, next) => {
if (from.name === 'EventEdit') {
if (this.isChanged()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
removeDraftConfirmer()
next()
}
})
router.beforeEach((to, from, next) => {
if (from.name === 'EventNew') {
if (this.hasContent()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
} else {
next()
}
}
beforLeaveGuardinEventNew = (to, from, next) => {
if (from.name === 'EventNew') {
if (this.isChanged()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
next()
}
})
} else {
next()
}
}
mounted() {
this.$watch(
'summary',
() => {
if (this.isChanged()) {
useDraftConfirmer()
} else {
removeDraftConfirmer()
}
},
{ deep: true }
)
if (this.isEventNewOrEdit()) {
this.beforeEachControl = router.beforeEach(this.beforLeaveGuardinEventNew)
} else {
this.beforeEachControl = router.beforeEach(
this.beforLeaveGuardinEventEdit
)
}
this.originalSummary = JSON.parse(JSON.stringify(this.summary))
}
beforeDestroy() {
if (this.beforeEachControl) {
this.beforeEachControl()
}
}
@Emit()
submit(): EventOutput {
removeDraftConfirmer()
this.cleanupContent()
if (this.beforeEachControl) {
this.beforeEachControl()
}
return {
...this.content,
group: this.content.group!,
Expand Down
70 changes: 67 additions & 3 deletions src/pages/GroupEdit.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,9 @@ import FormBackButton from '@/components/shared/FormBackButton.vue'
import ProgressCircular from '@/components/shared/ProgressCircular.vue'
import LoadFailedText from '@/components/shared/LoadFailedText.vue'
import api, { RequestGroup } from '@/api'
import router from '@/router'
import { useDraftConfirmer } from '@/workers/draftConfirmer'
import { removeDraftConfirmer } from '@/workers/draftConfirmer'
@Component({
components: {
Expand All @@ -74,6 +77,8 @@ export default class GroupEdit extends Vue {
step = 1
group: RequestGroup | null = null
originalGroup: RequestGroup | null = null
beforeEachControl: (() => void) | null = null
get groupId() {
return this.$route.params.id
Expand All @@ -84,6 +89,7 @@ export default class GroupEdit extends Vue {
try {
const group = await api.groups.getGroup({ groupID: this.groupId })
this.group = group
this.originalGroup = JSON.parse(JSON.stringify(group))
this.canEdit =
!group.isTraQGroup && !!this.me && group.admins.includes(this.me)
this.status = 'loaded'
Expand All @@ -92,13 +98,48 @@ export default class GroupEdit extends Vue {
}
}
isChanged(): boolean {
if (this.group && this.originalGroup) {
return JSON.stringify(this.group) !== JSON.stringify(this.originalGroup)
}
return false
}
cleanupContent(): void {
this.group = this.originalGroup
}
beforeLeaveGuard = (to, from, next) => {
if (from.path === `/groups/edit/${this.groupId}`) {
if (this.isChanged()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
next()
}
} else {
next()
}
}
async submitGroup() {
if (!this.group) return
try {
await api.groups.updateGroup({
groupID: this.groupId,
requestGroup: this.group,
})
removeDraftConfirmer()
this.cleanupContent()
this.$router.push(`/groups/${this.groupId}`)
} catch (__) {
alert('Failed to submit...')
Expand All @@ -125,9 +166,32 @@ export default class GroupEdit extends Vue {
if (!confirmed) return
try {
await api.groups.deleteGroup({ groupID: this.groupId })
this.$router.push('/')
} catch (__) {
alert('Failed to submit...')
removeDraftConfirmer()
this.cleanupContent()
this.$router.push('/groups')
} catch (error) {
alert('Failed to delete...')
}
}
mounted() {
this.$watch(
'group',
() => {
if (this.isChanged()) {
useDraftConfirmer()
} else {
removeDraftConfirmer()
}
},
{ deep: true }
)
this.beforeEachControl = router.beforeEach(this.beforeLeaveGuard)
}
beforeDestroy() {
if (this.beforeEachControl) {
this.beforeEachControl()
}
}
Expand Down
54 changes: 33 additions & 21 deletions src/pages/GroupNew.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,8 @@ export default class GroupNew extends Vue {
valid = false
step = 1
beforeEachControl: (() => void) | null = null
group: RequestGroup = {
name: '',
description: '',
Expand All @@ -75,6 +77,28 @@ export default class GroupNew extends Vue {
this.group.open = false
}
beforeLeaveGuard = (to, from, next) => {
if (from.name === 'GroupNew') {
if (this.hasContent()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
next()
}
} else {
next()
}
}
mounted() {
this.$watch(
'group',
Expand All @@ -87,27 +111,13 @@ export default class GroupNew extends Vue {
},
{ deep: true }
)
router.beforeEach((to, from, next) => {
if (from.name === 'GroupNew') {
if (this.hasContent()) {
if (
confirm(
'入力されたデータは送信されないまま破棄されますが，よろしいですか。'
)
) {
removeDraftConfirmer()
this.cleanupContent()
next()
} else {
next(false)
}
} else {
next()
}
} else {
next()
}
})
this.beforeEachControl = router.beforeEach(this.beforeLeaveGuard)
}
beforeDestroy() {
if (this.beforeEachControl) {
this.beforeEachControl()
}
}
async submitGroup() {
Expand All @@ -117,6 +127,8 @@ export default class GroupNew extends Vue {
alert('Failed to submit...')
return
}
removeDraftConfirmer()
this.cleanupContent()
this.$router.push('/events/new')
}
}
Expand Down

0 comments on commit 253efb0

Please sign in to comment.