<template>
|
<el-col>
|
<el-row justify="end" class="fixed-div">
|
<div class="btn-group">
|
<el-button @click="genDialog = true" type="primary"
|
>产品生成配置</el-button
|
>
|
<el-button type="primary" @click="chartDialog = true"
|
>图表展示</el-button
|
>
|
<el-button type="primary" @click="previewProduct">导出</el-button>
|
</div>
|
</el-row>
|
</el-col>
|
</template>
|
<script>
|
|
</script>
|
<style scoped>
|
.options {
|
display: flex;
|
padding: 5px;
|
}
|
.title-input {
|
margin-top: -20px;
|
border-radius: 6px;
|
color: #000;
|
width: 80%;
|
font-size: 1.5rem;
|
line-height: 5rem;
|
text-align: center;
|
border: none;
|
}
|
.center-div {
|
display: flex;
|
justify-content: center;
|
}
|
.btn-group {
|
/* background-color: rgb(32, 127, 211); */
|
white-space: nowrap;
|
}
|
.chart {
|
margin-top: 5px;
|
margin-bottom: 2px;
|
width: 100%;
|
height: 500px;
|
}
|
/* 固定定位的 div */
|
.fixed-div {
|
position: fixed;
|
top: 7%;
|
right: 20px; /* 距离右侧 20px */
|
width: 'auto'; /* div 的宽度 */
|
background-color: #f2f2f200; /* 背景颜色 */
|
padding: 5px;
|
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.11); /* 阴影效果 */
|
z-index: 1000; /* 确保 div 在页面其他内容之上 */
|
}
|
.charts {
|
display: flex;
|
flex-wrap: wrap;
|
}
|
.chart-item {
|
text-align: center;
|
width: 30%;
|
}
|
.product-item-margin {
|
margin-bottom: 5px;
|
}
|
.second-title {
|
color: var(--el-text-color-primary);
|
font-size: 16px;
|
font-weight: bold;
|
margin-bottom: 16px;
|
}
|
.main {
|
text-align: center;
|
width: 95%;
|
}
|
</style>
|
