样式调整

This commit is contained in:
zhujiyan
2024-08-27 18:37:46 +08:00
parent f8995d043b
commit e9a0347b0e
8 changed files with 466 additions and 166 deletions

View File

@@ -105,28 +105,6 @@
</el-form-item>
</el-form>
</div>
<!-- 功能选择 -->
<div class="container_function">
<div class="function_title"><p>功能选择</p></div>
<div class="function_main">
<div
class="function_item"
:class="
item.checked ? 'function_item checked_function' : 'function_item'
"
v-for="(item, index) in tabsList"
:key="index"
@click="handleCheckFunction(index)"
>
<div class="item_img">
<img :src="item.img" alt="" />
</div>
<div class="item_text">
<p>{{ item.label }}</p>
</div>
</div>
</div>
</div>
<!-- 饼图 -->
<div class="container_charts">
<div class="charts_info">
@@ -171,6 +149,28 @@
ref="pieRef3"
></pie>
</div>
</div>
<!-- 功能选择 -->
<div class="container_function">
<!-- <div class="function_title"><p>功能选择</p></div> -->
<div class="function_main">
<div
class="function_item"
:class="
item.checked ? 'function_item checked_function' : 'function_item'
"
v-for="(item, index) in tabsList"
:key="index"
@click="handleCheckFunction(index)"
>
<div class="item_img">
<img :src="item.img" alt="" />
</div>
<div class="item_text">
<p>{{ item.label }}</p>
</div>
</div>
</div>
</div>
<!-- 列表数据 -->
<div class="container_table">
@@ -187,10 +187,7 @@ import { useRouter } from "vue-router";
import tree from "../components/tree.vue";
import Table from "../components/table.vue";
import { data } from "@/api/plan/static.json";
import {
Refresh,
Search,
} from "@element-plus/icons-vue";
import { Refresh, Search } from "@element-plus/icons-vue";
const treeRef = ref();
const form: any = ref({
activeTabs: 0, //功能选择
@@ -471,7 +468,7 @@ onMounted(() => {
box-sizing: border-box;
.function_title {
height: 100%;
height: 20px;
width: 100px;
// line-height: 70px;
display: flex;
@@ -541,7 +538,7 @@ onMounted(() => {
}
.container_charts {
width: 100%;
height: 200px;
min-height: 200px !important;
// border: 2px solid green;
background-color: #eee;
display: flex;
@@ -559,6 +556,7 @@ onMounted(() => {
.container_table {
width: 100%;
flex: 1;
// height: 400px;
border-radius: 4px;
}
}