Editing request works

A "mark prayed" update uses the same fields, so we only have one "update
request" action now
This commit is contained in:
Daniel J. Summers 2017-09-22 23:30:23 -05:00
parent 181dc5ea63
commit 396e53b1a6
6 changed files with 93 additions and 20 deletions

View File

@ -32,14 +32,18 @@ export default {
addRequest: requestText => http.post('request/', { requestText }),
/**
* Mark a prayer request as having been prayed
* @param {string} requestId The Id of the request
* Update a prayer request
* @param request The request (should have requestId, status, and updateText properties)
*/
markPrayed: requestId => http.post(`request/${requestId}/history`, { status: 'Prayed', updateText: '' }),
updateRequest: request => http.post(`request/${request.requestId}/history`, {
status: request.status,
updateText: request.updateText
}),
/**
* Get a prayer request
* Get a prayer request (journal-style; only latest update)
* @param {string} requestId The Id of the request to retrieve
*/
getPrayerRequest: requestId => http.get(`request/${requestId}`)
getRequest: requestId => http.get(`request/${requestId}`)
}

View File

@ -0,0 +1,56 @@
<template lang="pug">
span
el-button(icon='edit' @click='openDialog()' title='Edit')
el-dialog(title='Edit Prayer Request' :visible.sync='editVisible')
el-form(:model='form' :label-position='top')
el-form-item(label='Prayer Request')
el-input(type='textarea' v-model.trim='form.requestText' :rows='10')
el-form-item(label='Also Mark As')
el-radio-group(v-model='form.status')
el-radio-button(label='Updated') Updated
el-radio-button(label='Prayed') Prayed
el-radio-button(label='Answered') Answered
span.dialog-footer(slot='footer')
el-button(@click='closeDialog()') Cancel
el-button(type='primary' @click='saveRequest()') Save
</template>
<script>
'use strict'
import actions from '@/store/action-types'
export default {
name: 'edit-request',
props: [ 'request' ],
data () {
return {
editVisible: false,
form: {
requestText: this.request.text,
status: 'Updated'
},
formLabelWidth: '120px'
}
},
methods: {
closeDialog () {
this.form.requestText = ''
this.form.status = 'Updated'
this.editVisible = false
},
openDialog () {
this.editVisible = true
},
async saveRequest () {
await this.$store.dispatch(actions.UPDATE_REQUEST, {
progress: this.$Progress,
requestId: this.request.requestId,
updateText: this.form.requestText,
status: this.form.status
})
this.editVisible = false
}
}
}
</script>

View File

@ -1,12 +1,12 @@
<template lang="pug">
div
el-button(@click='showNewVisible = true') Add a New Request
el-button(@click='openDialog()') Add a New Request
el-dialog(title='Add a New Prayer Request' :visible.sync='showNewVisible')
el-form(:model='form' :label-position='top')
el-form-item(label='Prayer Request')
el-input(type='textarea' v-model.trim='form.requestText' :rows='10')
span.dialog-footer(slot='footer')
el-button(@click='showNewVisible = false') Cancel
el-button(@click='closeDialog()') Cancel
el-button(type='primary' @click='saveRequest()') Save
</template>
@ -27,7 +27,14 @@ export default {
}
},
methods: {
saveRequest: async function () {
closeDialog () {
this.form.requestText = ''
this.showNewVisible = false
},
openDialog () {
this.showNewVisible = true
},
async saveRequest () {
await this.$store.dispatch(actions.ADD_REQUEST, {
progress: this.$Progress,
requestText: this.form.requestText

View File

@ -3,7 +3,7 @@
el-col(:span='4')
p
el-button(icon='check' @click='markPrayed()' title='Pray')
el-button(icon='edit' @click='editRequest()' title='Edit')
edit-request(:request='request')
el-button(icon='document' @click='viewHistory()' title='Show History')
el-col(:span='16'): p {{ request.text }}
el-col(:span='4'): p {{ asOf }}
@ -14,26 +14,32 @@
import moment from 'moment'
import EditRequest from './EditRequest'
import actions from '@/store/action-types'
export default {
name: 'request-list-item',
props: ['request'],
props: [ 'request' ],
data () {
return {}
},
components: {
EditRequest
},
methods: {
markPrayed () {
this.$store.dispatch(actions.MARK_PRAYED, {
this.$store.dispatch(actions.UPDATE_REQUEST, {
progress: this.$Progress,
requestId: this.request.requestId
requestId: this.request.requestId,
status: 'Prayed',
updateText: ''
})
}
},
computed: {
asOf () {
// FIXME: why isn't this already a number?
return moment(parseInt(this.request.asOf)).fromNow()
return moment(this.request.asOf).fromNow()
}
}
}

View File

@ -5,6 +5,6 @@ export default {
ADD_REQUEST: 'add-request',
/** Action to load the user's prayer journal */
LOAD_JOURNAL: 'load-journal',
/** Action to mark a request as prayed */
MARK_PRAYED: 'mark-prayed'
/** Action to update a request */
UPDATE_REQUEST: 'update-request'
}

View File

@ -92,11 +92,11 @@ export default new Vuex.Store({
commit(mutations.LOADING_JOURNAL, false)
}
},
async [actions.MARK_PRAYED] ({ commit }, { progress, requestId }) {
async [actions.UPDATE_REQUEST] ({ commit }, { progress, requestId, status, updateText }) {
progress.start()
try {
progress.start()
await api.markPrayed(requestId)
const request = await api.getPrayerRequest(requestId)
await api.updateRequest({ requestId, status, updateText })
const request = await api.getRequest(requestId)
commit(mutations.REQUEST_UPDATED, request.data)
progress.finish()
} catch (err) {