-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat & refactor: migrate to cordis version and add code of request ca…
…pture
- Loading branch information
1 parent
fe1c446
commit a0aebde
Showing
17 changed files
with
442 additions
and
40 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| <script setup lang="ts"> | ||
| import {inject} from "vue" | ||
| import Button from "primevue/button"; | ||
| import {send, useRpc} from "@cordisjs/client"; | ||
| import type {HttpSummary} from "../../src/data"; | ||
| const model = useRpc<HttpSummary>(); | ||
| const toast : (severity:string, summary:string, detail:string)=>void = inject("toast"); | ||
| async function startCapture(){ | ||
| if(!await send('http/capture.start')) | ||
| return; | ||
| toast("success","操作成功","HTTP 请求捕获已开始"); | ||
| } | ||
| async function stopCapture(){ | ||
| if(!await send('http/capture.stop')) | ||
| return; | ||
| toast("success","操作成功","HTTP 请求捕获已停止"); | ||
| } | ||
| </script> | ||
| <template> | ||
| <Button icon="pi pi-camera" class="mr-2" severity="secondary" size="small" text v-tooltip.bottom="'捕获 HTTP 请求'" | ||
| v-if="!model.captureEnabled" @click="startCapture()"/> | ||
| <Button icon="pi pi-stop" class="mr-2" severity="secondary" size="small" text v-tooltip.bottom="'捕获 HTTP 请求'" | ||
| v-else @click="stopCapture()"/> | ||
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| <script setup lang="ts"> | ||
| import Button from "primevue/button"; | ||
| import CaptureButton from "./CaptureButton.vue"; | ||
| import {send} from "@cordisjs/client"; | ||
| async function clearCapture(){ | ||
| if(!await send('http/capture.clear')) | ||
| return; | ||
| } | ||
| </script> | ||
|
|
||
| <template> | ||
| <CaptureButton/> | ||
| <Button icon="pi pi-trash" class="mr-2" severity="secondary" size="small" text v-tooltip.bottom="'清空捕获的请求'" @click="clearCapture"/> | ||
| </template> | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| <script setup lang="ts"> | ||
| import {ref,watch,nextTick} from 'vue' | ||
| import ProgressSpinner from "primevue/progressspinner"; | ||
| import Skeleton from "primevue/skeleton"; | ||
| import HttpEditor from "./HttpEditor.vue"; | ||
| import {send} from '@cordisjs/client' | ||
| const props = defineProps<{ | ||
| id: number, | ||
| type: string | ||
| }>() | ||
| const int = ref(false); | ||
| setInterval(()=>int.value = !int.value,1000); | ||
| const data = ref(); | ||
| const changed = ref(false); | ||
| async function fetchData(type:string, id:number){ | ||
| const response = await send('http/request',{type, id}); | ||
| if(response){ | ||
| data.value = response; | ||
| nextTick(()=>{ | ||
| changed.value = false; | ||
| }); | ||
| } | ||
| } | ||
| watch(props,(val)=>{ | ||
| data.value = null; | ||
| fetchData(val.type, val.id); | ||
| },{immediate:true}) | ||
| watch(data,()=>{ | ||
| console.info("Updated") | ||
| changed.value = true; | ||
| },{deep:true}) | ||
| let savingTimeout : NodeJS.Timeout | number | false = false; | ||
| watch(changed,(value)=>{ | ||
| if(value && savingTimeout === false){ | ||
| savingTimeout = setTimeout(()=>{ | ||
| console.info("Save"); | ||
| savingTimeout = false; | ||
| changed.value = false; | ||
| }, 3000); | ||
| }else if(!value && savingTimeout !== false){ | ||
| clearTimeout(savingTimeout); | ||
| savingTimeout = false; | ||
| } | ||
| }) | ||
| </script> | ||
|
|
||
| <template> | ||
| <HttpEditor v-if="data" v-model="data"/> | ||
| <div style="height:100%;width: 100%;display: flex;flex-direction: column" v-else> | ||
| <div style="display: flex;flex-direction: column;gap: 5px"> | ||
| <div style="padding: 8px 20px;"> | ||
| <Skeleton height="2.5rem" width="100%"></Skeleton> | ||
| </div> | ||
| </div> | ||
| <div style="padding-left: 20px;padding-top:0.4rem"> | ||
| <Skeleton height="1rem" width="24rem" borderRadius="16px"></Skeleton> | ||
| </div> | ||
| <Skeleton height="2.5rem" width="16rem" style="margin-top:1rem;margin-left:1.4rem"></Skeleton> | ||
| <div style="margin: 1.4rem;flex:1"> | ||
| <Skeleton height="100%" width="100%"/> | ||
| </div> | ||
| </div> | ||
| </template> | ||
|
|
||
| <style scoped> | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.