Tweak UI
This commit is contained in:
parent
a88e486468
commit
d06517265f
4 changed files with 33 additions and 23 deletions
|
@ -10,7 +10,9 @@
|
||||||
<button class="_button" @click="$refs.modal.close()"><Fa :icon="faTimes"/></button>
|
<button class="_button" @click="$refs.modal.close()"><Fa :icon="faTimes"/></button>
|
||||||
</div>
|
</div>
|
||||||
<div class="body _flat_">
|
<div class="body _flat_">
|
||||||
<component :is="component" v-bind="props" :ref="changePage"/>
|
<keep-alive>
|
||||||
|
<component :is="component" v-bind="props" :ref="changePage"/>
|
||||||
|
</keep-alive>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</MkModal>
|
</MkModal>
|
||||||
|
|
|
@ -395,7 +395,7 @@ export default defineComponent({
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 5000;
|
z-index: 10000; // mk-modalのと同じでなければならない
|
||||||
|
|
||||||
&.front {
|
&.front {
|
||||||
z-index: 11000; // front指定の時は、mk-modalのよりも大きくなければならない
|
z-index: 11000; // front指定の時は、mk-modalのよりも大きくなければならない
|
||||||
|
|
|
@ -1,25 +1,29 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<section class="_section">
|
<div class="_root">
|
||||||
<MkInput v-model:value="endpoint" :datalist="endpoints" @update:value="onEndpointChange()">
|
<div class="_block" style="padding: 24px;">
|
||||||
<span>Endpoint</span>
|
<MkInput v-model:value="endpoint" :datalist="endpoints" @update:value="onEndpointChange()">
|
||||||
</MkInput>
|
<span>Endpoint</span>
|
||||||
<MkTextarea v-model:value="body" code>
|
</MkInput>
|
||||||
<span>Params (JSON or JSON5)</span>
|
<MkTextarea v-model:value="body" code>
|
||||||
</MkTextarea>
|
<span>Params (JSON or JSON5)</span>
|
||||||
<MkSwitch v-model:value="withCredential">
|
</MkTextarea>
|
||||||
With credential
|
<MkSwitch v-model:value="withCredential">
|
||||||
</MkSwitch>
|
With credential
|
||||||
<MkButton primary full @click="send" :disabled="sending">
|
</MkSwitch>
|
||||||
<template v-if="sending"><MkEllipsis/></template>
|
<MkButton primary full @click="send" :disabled="sending">
|
||||||
<template v-else><Fa :icon="faPaperPlane"/> Send</template>
|
<template v-if="sending"><MkEllipsis/></template>
|
||||||
</MkButton>
|
<template v-else><Fa :icon="faPaperPlane"/> Send</template>
|
||||||
</section>
|
</MkButton>
|
||||||
<section class="_section" v-if="res">
|
</div>
|
||||||
<MkTextarea v-model:value="res" code readonly tall>
|
</div>
|
||||||
<span>Response</span>
|
<div class="_root" v-if="res">
|
||||||
</MkTextarea>
|
<div class="_block" style="padding: 24px;">
|
||||||
</section>
|
<MkTextarea v-model:value="res" code readonly tall>
|
||||||
|
<span>Response</span>
|
||||||
|
</MkTextarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -148,7 +148,11 @@ export default defineComponent({
|
||||||
}, { immediate: true });
|
}, { immediate: true });
|
||||||
|
|
||||||
watch(() => props.initialPage, () => {
|
watch(() => props.initialPage, () => {
|
||||||
page.value = props.initialPage;
|
if (props.initialPage == null && !narrow.value) {
|
||||||
|
page.value = 'profile';
|
||||||
|
} else {
|
||||||
|
page.value = props.initialPage;
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
|
Loading…
Reference in a new issue