fix: BUG修改

This commit is contained in:
kun 2023-07-12 11:53:33 +08:00
parent a658fd67af
commit ee935746fc
2 changed files with 14 additions and 10 deletions

View File

@ -34,8 +34,6 @@
} }
.content-main { .content-main {
// min-height: 400px; // min-height: 400px;
overflow: hidden;
transition: 1s;
margin-top: 10px; margin-top: 10px;
background: linear-gradient(90deg, rgba(50, 98, 179, 0.2) 0%, rgba(50, 98, 179, 0) 47%, rgba(50, 98, 179, 0.2) 100%); background: linear-gradient(90deg, rgba(50, 98, 179, 0.2) 0%, rgba(50, 98, 179, 0) 47%, rgba(50, 98, 179, 0.2) 100%);
} }
@ -44,7 +42,13 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.rank-content { .rank-content {
flex: 1; overflow: hidden;
transition: 1s;
// flex: 1;
min-height: 36px;
.content-main {
height: calc(100% - 46px);
}
} }
.rank-content:not(:last-child) { .rank-content:not(:last-child) {
margin-bottom: 20px; margin-bottom: 20px;

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="rank-page"> <div class="rank-page">
<div class="left"> <div class="left">
<div class="rank-content"> <div class="rank-content" style="flex: 1">
<div class="content-title" @click="changeHeight(0)"> <div class="content-title" @click="changeHeight(0)">
<img src="@/assets/images/hzImg/assessmentImg/textImg1.png" alt="" /> <img src="@/assets/images/hzImg/assessmentImg/textImg1.png" alt="" />
</div> </div>
@ -20,7 +20,7 @@
</leftMenu2> </leftMenu2>
</div> </div>
</div> </div>
<div class="rank-content"> <div class="rank-content" style="flex: 1">
<div class="content-title" @click="changeHeight(1)"> <div class="content-title" @click="changeHeight(1)">
<img src="@/assets/images/hzImg/assessmentImg/textImg2.png" alt="" /> <img src="@/assets/images/hzImg/assessmentImg/textImg2.png" alt="" />
</div> </div>
@ -198,12 +198,12 @@ const records = ref([{ name: "123" }, { name: "234" }]);
const inputVal = ref(""); const inputVal = ref("");
const changeHeight = index => { const changeHeight = index => {
// //
const domList = document.querySelectorAll(".content-main") as NodeListOf<HTMLElement>; const domList = document.querySelectorAll(".rank-content") as NodeListOf<HTMLElement>;
console.log(domList[index].style.height); console.log(domList[index].style.flex);
if (domList[index].style["min-height"] == "" || domList[index].style["min-height"] == "400px") { if (domList[index].style.flex == "" || domList[index].style.flex == "1 1 0%") {
domList[index].style = "min-height:0px;"; domList[index].style.flex = "0 1 0%";
} else { } else {
domList[index].style = "min-height: 400px;"; domList[index].style.flex = "1 1 0%";
} }
console.log(domList); console.log(domList);
}; };