move the button to retry on the list
This commit is contained in:
parent
c1fdabeb2c
commit
957e3ed211
|
@ -1,6 +1,5 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html ng-app="app">
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
|
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
|
||||||
|
@ -113,7 +112,7 @@
|
||||||
|
|
||||||
.list-item {
|
.list-item {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: auto 1fr auto auto;
|
grid-template-columns: auto 1fr auto auto auto;
|
||||||
gap: .5rem;
|
gap: .5rem;
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
|
@ -239,6 +238,20 @@
|
||||||
background: var(--btn-hover);
|
background: var(--btn-hover);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.retry {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.retry svg {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
stroke: #9a9996;
|
||||||
|
}
|
||||||
|
|
||||||
|
.retry:hover svg * {
|
||||||
|
stroke: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
.welcome {
|
.welcome {
|
||||||
display: grid;
|
display: grid;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -309,9 +322,7 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<div class="dashboard" id="app" v-cloak>
|
<div class="dashboard" id="app" v-cloak>
|
||||||
|
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
<button :disabled="items.length == 0" @click="clearDashboard">clear</button>
|
<button :disabled="items.length == 0" @click="clearDashboard">clear</button>
|
||||||
|
@ -322,8 +333,12 @@
|
||||||
<span class="method" :class="item.method">{{item.method}}</span>
|
<span class="method" :class="item.method">{{item.method}}</span>
|
||||||
<span class="path">‎{{item.path}}‎</span>
|
<span class="path">‎{{item.path}}‎</span>
|
||||||
<span class="time">{{item.elapsed}}ms</span>
|
<span class="time">{{item.elapsed}}ms</span>
|
||||||
<span class="status" :class="statusColor(item)">{{item.status == 999 ? 'failed' :
|
<span class="status" :class="statusColor(item)">
|
||||||
item.status}}</span>
|
{{item.status == 999 ? 'failed' : item.status}}
|
||||||
|
</span>
|
||||||
|
<button class="retry" @click="retry(item.id)">
|
||||||
|
<svg stroke-width="3" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M21.888 13.5C21.164 18.311 17.013 22 12 22 6.477 22 2 17.523 2 12S6.477 2 12 2c4.1 0 7.625 2.468 9.168 6" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path><path d="M17 8h4.4a.6.6 0 00.6-.6V3" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"></path></svg>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -332,7 +347,6 @@
|
||||||
<div class="controls">
|
<div class="controls">
|
||||||
<button :disabled="!canPrettifyBody('request')" @click="prettifyBody('request')">prettify</button>
|
<button :disabled="!canPrettifyBody('request')" @click="prettifyBody('request')">prettify</button>
|
||||||
<button :disabled="selectedItem.id == null" @click="copyCurl($event)" data-text="curl">curl</button>
|
<button :disabled="selectedItem.id == null" @click="copyCurl($event)" data-text="curl">curl</button>
|
||||||
<button :disabled="selectedItem.id == null" @click="retry">retry</button>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="req-inner">
|
<div class="req-inner">
|
||||||
<div class="corner">req</div>
|
<div class="corner">req</div>
|
||||||
|
@ -351,7 +365,8 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="welcome" v-show="items.length == 0">
|
<div class="welcome" v-show="items.length == 0">
|
||||||
<p>Waiting for requests on http://localhost:{{proxyPort}}/<br>
|
<p>
|
||||||
|
Waiting for requests on http://localhost:{{proxyPort}}/<br>
|
||||||
<span>Proxying {{targetURL}}</span>
|
<span>Proxying {{targetURL}}</span>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
@ -422,9 +437,12 @@
|
||||||
document.execCommand('copy');
|
document.execCommand('copy');
|
||||||
document.body.removeChild(e);
|
document.body.removeChild(e);
|
||||||
},
|
},
|
||||||
async retry() {
|
async retry(id) {
|
||||||
await fetch('/retry/' + this.selectedItem.id,
|
await fetch(`/retry/${id}`, {
|
||||||
{ headers: { 'Cache-Control': 'no-cache' } });
|
headers: {
|
||||||
|
'Cache-Control': 'no-cache'
|
||||||
|
}
|
||||||
|
});
|
||||||
this.show(this.items[0]);
|
this.show(this.items[0]);
|
||||||
},
|
},
|
||||||
changeText(event) {
|
changeText(event) {
|
||||||
|
@ -437,5 +455,4 @@
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
Loading…
Reference in a new issue