52 lines
1.4 KiB
Vue
52 lines
1.4 KiB
Vue
<template>
|
|
<AppPaneLayout layout-id="rest-primary">
|
|
<template #primary>
|
|
<HttpRequest v-model="tab" />
|
|
<HttpRequestOptions
|
|
v-model="tab.document.request"
|
|
v-model:option-tab="tab.document.optionTabPreference"
|
|
v-model:inherited-properties="tab.document.inheritedProperties"
|
|
/>
|
|
</template>
|
|
<template #secondary>
|
|
<HttpResponse v-model:document="tab.document" :is-embed="false" />
|
|
</template>
|
|
</AppPaneLayout>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { watch } from "vue"
|
|
import { useVModel } from "@vueuse/core"
|
|
import { cloneDeep } from "lodash-es"
|
|
import { isEqualHoppRESTRequest } from "@hoppscotch/data"
|
|
import { HoppTab } from "~/services/tab"
|
|
import { HoppRESTDocument } from "~/helpers/rest/document"
|
|
|
|
// TODO: Move Response and Request execution code to over here
|
|
|
|
const props = defineProps<{ modelValue: HoppTab<HoppRESTDocument> }>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: "update:modelValue", val: HoppTab<HoppRESTDocument>): void
|
|
}>()
|
|
|
|
const tab = useVModel(props, "modelValue", emit)
|
|
|
|
// TODO: Come up with a better dirty check
|
|
let oldRequest = cloneDeep(tab.value.document.request)
|
|
watch(
|
|
() => tab.value.document.request,
|
|
(updatedValue) => {
|
|
if (
|
|
!tab.value.document.isDirty &&
|
|
!isEqualHoppRESTRequest(oldRequest, updatedValue)
|
|
) {
|
|
tab.value.document.isDirty = true
|
|
}
|
|
|
|
oldRequest = cloneDeep(updatedValue)
|
|
},
|
|
{ deep: true }
|
|
)
|
|
</script>
|