diff --git a/training-front-end/src/components/AdminEditReporting.vue b/training-front-end/src/components/AdminEditReporting.vue index a3e48a6c..fc560f3c 100644 --- a/training-front-end/src/components/AdminEditReporting.vue +++ b/training-front-end/src/components/AdminEditReporting.vue @@ -5,6 +5,7 @@ import USWDSComboBox from "./USWDSComboBox.vue"; import { bureauList, agencyList, setSelectedAgencyId, selectedAgencyId} from '../stores/agencies' import { useStore } from '@nanostores/vue' + import AdminEditUserDetails from "./AdminEditUserDetails.vue"; const props = defineProps({ user: { @@ -12,11 +13,13 @@ required: true, } }) - + + const editing = ref(false) + // Copy to avoid modifying parent prop and allow cancelling edits const agencies = ref([...props.user.report_agencies]) - defineEmits(['cancel', 'save']) + const emit = defineEmits(['cancel', 'save', 'userUpdateSuccess']) const agency_options = useStore(agencyList) const bureaus = useStore(bureauList) @@ -39,96 +42,93 @@ agencies.value = agencies.value.filter(agency => agency.id != e.id) } } + + function editUser(){ + editing.value = true + } watch(() => user_input.agency_id, async() => { setSelectedAgencyId(user_input.agency_id) }) + + async function updateUser(successMessage) { + emit('userUpdateSuccess', successMessage) + editing.value = false + } + + function cancelUpdate() { + editing.value = false; + } \ No newline at end of file diff --git a/training-front-end/src/components/AdminEditUserDetails.vue b/training-front-end/src/components/AdminEditUserDetails.vue new file mode 100644 index 00000000..7013b1d8 --- /dev/null +++ b/training-front-end/src/components/AdminEditUserDetails.vue @@ -0,0 +1,227 @@ + + + diff --git a/training-front-end/src/components/AdminSearchUser.vue b/training-front-end/src/components/AdminSearchUser.vue index 5d18e418..15c0a294 100644 --- a/training-front-end/src/components/AdminSearchUser.vue +++ b/training-front-end/src/components/AdminSearchUser.vue @@ -16,15 +16,17 @@ const report_url = `${base_url}/api/v1/users/` const update_url = `${base_url}/api/v1/users/edit-user-for-reporting/` - const currentPage = ref(0) - const numberOfResults = ref(0) + let currentPage = ref(0) + let numberOfResults = ref(0) const numberOfPages = computed(() => Math.ceil(numberOfResults.value/PAGE_SIZE)) - const searchTerm = ref('') + let searchTerm = ref('') const selectedUser = ref() - const searchResults = ref([]) + let searchResults = ref([]) const noResults = ref(false) const error = ref() + const showSuccessMessage = ref(false) + const successMessage = ref() async function setPage(page) { currentPage.value = page @@ -32,6 +34,7 @@ } async function search() { + clearAlerts() noResults.value = false const url = new URL(`${report_url}`) url.search = new URLSearchParams({searchText: searchTerm.value, page_number: currentPage.value + 1}) @@ -94,6 +97,22 @@ setCurrentUser(undefined) setSelectedAgencyId(undefined) } + + async function updateUserSuccess(message) { + successMessage.value = message + showSuccessMessage.value = true + cancelEdit() + currentPage.value = 0 + numberOfResults.value = 0 + searchTerm.value = '' + searchResults.value = [] + } + + function clearAlerts() { + error.value = undefined + successMessage.value = undefined + showSuccessMessage.value = false + }