大屏组件开发

This commit is contained in:
yanran200730
2023-03-10 10:05:02 +08:00
parent 84689f602b
commit 7c6a898bf0
6 changed files with 125 additions and 65 deletions

View File

@@ -3,11 +3,6 @@
<div ref="AiEchart" class="chart" :style="{minWidth:grid.width,minHeight:grid.height}"/>
<slot v-if="$slots.default"/>
<render-component v-else-if="ops.render" :render="ops.render" :options="chartOptions" :data="data"/>
<div class="AiEchart-legend" v-if="legend === '1'">
<div class="AiEchart-legend__item">居民好友5230</div>
<div class="AiEchart-legend__item">居民好友5230</div>
<div class="AiEchart-legend__item">居民好友5230</div>
</div>
</section>
</template>
@@ -23,10 +18,6 @@ export default {
series: Object,
theme: {
default: '0'
},
legend: {
type: String,
default: '0'
}
},
components: {
@@ -124,8 +115,6 @@ export default {
let oldDims = Object.keys(old?.[0] || {})?.toString(),
current = Object.keys(v?.[0] || {})?.toString()
this.getChartData(oldDims != current)
console.log(data)
}
},
@@ -234,53 +223,5 @@ export default {
height: 100%;
min-height: 100px;
}
.AiEchart-legend {
width: 140px;
margin-left: 20px;
padding-top: 20px;
div {
display: flex;
position: relative;
align-items: center;
justify-content: center;
height: 40px;
margin-bottom: 8px;
text-align: center;
color: #fff;
font-size: 14px;
border: 1px solid #717171;
box-sizing: border-box;
&:last-child {
margin-bottom: 0;
}
&::after {
position: absolute;
left: -1px;
top: 50%;
z-index: 11;
width: 1px;
height: 10px;
transform: translateY(-50%);
background: #0c0c0c;
content: ' ';
}
&::before {
position: absolute;
right: - 1px;
top: 50%;
z-index: 11;
width: 1px;
height: 10px;
transform: translateY(-50%);
background: #0c0c0c;
content: ' ';
}
}
}
}
</style>