style(接口测试): 接口编辑页面样式优化,紧凑布局,禁用多余滚动条
This commit is contained in:
parent
4203cac5a1
commit
b60efa3f59
|
@ -998,7 +998,8 @@ export default {
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
||||||
.ms-api-div {
|
.ms-api-div {
|
||||||
overflow-y: auto;
|
overflow-y: hidden;
|
||||||
|
height: calc(100vh - 100px)
|
||||||
}
|
}
|
||||||
|
|
||||||
/deep/ .el-main {
|
/deep/ .el-main {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<el-card class="card-content" v-if="isShow && !loading">
|
<el-card v-if="isShow && !loading" class="ms-api-card">
|
||||||
<ms-container v-loading="loading" style="overflow: auto">
|
<ms-container v-loading="loading">
|
||||||
<ms-aside-container>
|
<ms-aside-container :height="leftHeight">
|
||||||
<api-base-info
|
<api-base-info
|
||||||
ref="apiBaseInfo"
|
ref="apiBaseInfo"
|
||||||
:api-template="apiTemplate"
|
:api-template="apiTemplate"
|
||||||
|
@ -15,7 +15,7 @@
|
||||||
:module-options="moduleOptions"
|
:module-options="moduleOptions"
|
||||||
/>
|
/>
|
||||||
</ms-aside-container>
|
</ms-aside-container>
|
||||||
<ms-main-container class="ms-scenario-main-container">
|
<ms-main-container class="ms-api-main-container">
|
||||||
<el-button-group v-if="currentApi.id" style="z-index: 10; position: fixed;">
|
<el-button-group v-if="currentApi.id" style="z-index: 10; position: fixed;">
|
||||||
<el-button :class="{active: showApiList}" class="item" plain size="small" @click="changeTab('api')">
|
<el-button :class="{active: showApiList}" class="item" plain size="small" @click="changeTab('api')">
|
||||||
API
|
API
|
||||||
|
@ -201,7 +201,13 @@ export default {
|
||||||
default: false,
|
default: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
leftHeight() {
|
||||||
|
return 'calc(100vh - 100px)';
|
||||||
|
}
|
||||||
|
},
|
||||||
created() {
|
created() {
|
||||||
|
console.log(this.leftHeight)
|
||||||
this.refreshButtonActiveClass(this.activeDom);
|
this.refreshButtonActiveClass(this.activeDom);
|
||||||
getApiFieldTemplate(this)
|
getApiFieldTemplate(this)
|
||||||
.then((template) => {
|
.then((template) => {
|
||||||
|
@ -493,4 +499,11 @@ export default {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ms-api-main-container {
|
||||||
|
height: calc(100vh - 100px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ms-api-card >>> .el-card__body {
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div v-loading="isloading">
|
<div v-loading="isloading" class="ms-base-div">
|
||||||
<el-form ref="apiForm" :model="basicForm" :rules="rules" class="case-form" label-position="right"
|
<el-form ref="apiForm" :model="basicForm" :rules="rules" class="case-form" label-position="right"
|
||||||
label-width="80px"
|
label-width="80px"
|
||||||
size="small"
|
size="small"
|
||||||
|
@ -242,5 +242,8 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.ms-base-div {
|
||||||
|
height: calc(100vh - 100px) !important;
|
||||||
|
overflow: auto !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue