Fix loading on status page
It was infinite looping in the computed value for report
This commit is contained in:
parent
ace2557a60
commit
8757f1cda3
3 changed files with 12 additions and 12 deletions
|
|
@ -192,7 +192,6 @@ const formatId = (id: string): string => {
|
|||
* Handle row click event
|
||||
*/
|
||||
const handleRowClick = (report_id: string): void => {
|
||||
console.log("row clicked", report_id);
|
||||
emit("rowClicked", report_id);
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -11,20 +11,20 @@ import {
|
|||
|
||||
export const useStorePublicReport = defineStore("publicreport", () => {
|
||||
// State
|
||||
const _byID = ref<Map<string, PublicReport>>(new Map());
|
||||
const _byURI = ref<Map<string, PublicReport>>(new Map());
|
||||
const loading = ref(false);
|
||||
const ongoingFetches = ref<Map<string, Promise<PublicReport> | null>>(
|
||||
new Map(),
|
||||
);
|
||||
|
||||
function add(pr: PublicReport) {
|
||||
_byID.value.set(pr.public_id, pr);
|
||||
}
|
||||
function add(pr: PublicReport) {}
|
||||
async function byID(id: string): Promise<PublicReport> {
|
||||
const uri = "/api/rmo/publicreport/" + id;
|
||||
return byURI(uri);
|
||||
}
|
||||
async function byURI(uri: string): Promise<PublicReport> {
|
||||
let result = _byURI.value.get(uri);
|
||||
if (result) return result;
|
||||
let ongoing = ongoingFetches.value.get(uri);
|
||||
if (ongoing) return ongoing;
|
||||
ongoing = fetchByURI(uri).finally(() => {
|
||||
|
|
@ -41,7 +41,7 @@ export const useStorePublicReport = defineStore("publicreport", () => {
|
|||
data,
|
||||
)) as PublicReportDTO;
|
||||
const result = PublicReport.fromJSON(resp);
|
||||
_byID.value.set(result.public_id, result);
|
||||
_byURI.value.set(result.uri, result);
|
||||
return result;
|
||||
}
|
||||
async function fetchByURI(uri: string): Promise<PublicReport> {
|
||||
|
|
@ -49,7 +49,7 @@ export const useStorePublicReport = defineStore("publicreport", () => {
|
|||
try {
|
||||
const body = (await apiClient.JSONGet(uri)) as PublicReportDTO;
|
||||
const report = PublicReport.fromJSON(body);
|
||||
_byID.value.set(report.public_id, report);
|
||||
_byURI.value.set(report.uri, report);
|
||||
return report;
|
||||
} catch (err) {
|
||||
console.error("Error loading users:", err);
|
||||
|
|
@ -65,7 +65,6 @@ export const useStorePublicReport = defineStore("publicreport", () => {
|
|||
}
|
||||
return {
|
||||
// Actions
|
||||
add,
|
||||
byID,
|
||||
byURI,
|
||||
createCompliance,
|
||||
|
|
|
|||
|
|
@ -146,7 +146,7 @@
|
|||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from "vue";
|
||||
import { computed, onMounted, ref } from "vue";
|
||||
import { computedAsync } from "@vueuse/core";
|
||||
import Header from "@/rmo/components/Header.vue";
|
||||
import HeaderDistrict from "@/components/HeaderDistrict.vue";
|
||||
|
|
@ -170,12 +170,10 @@ interface Props {
|
|||
}
|
||||
|
||||
const props = defineProps<Props>();
|
||||
const report = ref<PublicReport | null>(null);
|
||||
const storeDistrict = useStoreDistrict();
|
||||
const storePublicReport = useStorePublicReport();
|
||||
// Computed
|
||||
const report = computedAsync(async (): Promise<PublicReport | undefined> => {
|
||||
return await storePublicReport.byID(props.id);
|
||||
});
|
||||
const district = computedAsync(async (): Promise<District | undefined> => {
|
||||
if (!(report.value && report.value.district)) {
|
||||
return undefined;
|
||||
|
|
@ -200,4 +198,8 @@ const markers = computed((): Marker[] => {
|
|||
},
|
||||
];
|
||||
});
|
||||
onMounted(async () => {
|
||||
const r = await storePublicReport.byID(props.id);
|
||||
report.value = r;
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue