From 64fb01245ae8a309bd3cbda6e7aba10d8dd9fb5e Mon Sep 17 00:00:00 2001
From: whycq <10027870+whycq@user.noreply.gitee.com>
Date: 星期三, 11 十月 2023 09:54:55 +0800
Subject: [PATCH] # ucharts
---
pages/index/index.vue | 29 ++++++++++++++++++++++++++---
1 files changed, 26 insertions(+), 3 deletions(-)
diff --git a/pages/index/index.vue b/pages/index/index.vue
index f6898ec..1c397f5 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -25,13 +25,19 @@
</view>
</view>
</view>
+
+ <view class="charts-box">
+ <qiun-data-charts type="column" canvasId="scrollcolumnid" :opts="{enableScroll:true,xAxis:{scrollShow:true,itemCount:4,disableGrid:true}}" :ontouch="true" :canvas2d="true" :chartData="chartsDataColumn4" :background="red"/>
+ </view>
</view>
</template>
<script>
+ import demodata from '@/mockdata/demodata.json';
export default {
data() {
return {
+ chartsDataColumn4:{},
title: 'Hello',
mainItem: [
{
@@ -64,14 +70,26 @@
{name: '鏉庝笘璞�3绾�',performance:'200涓囧厓'},
{name: '鏉庝笘璞�1绾�',performance:'112涓囧厓'}
],
- bgs: ['bg-blue','bg-red']
+ bgs: ['bg-blue','bg-red'],
+ red: '#aaffff'
}
},
onLoad() {
this.backGroundRepeat()
},
+ onReady() {
+ //妯℃嫙浠庢湇鍔″櫒鑾峰彇鏁版嵁
+ this.getServerData()
+ },
methods: {
+ getServerData() {
+ setTimeout(() => {
+ //鍥犻儴鍒嗘暟鎹牸寮忎竴鏍凤紝杩欓噷涓嶅悓鍥捐〃寮曠敤鍚屼竴鏁版嵁婧愮殑璇濓紝闇�瑕佹繁鎷疯礉涓�涓嬫瀯閫犱笉鍚岀殑瀵硅薄
+ //寮�鍙戣�呴渶瑕佽嚜琛屽鐞嗘湇鍔″櫒杩斿洖鐨勬暟鎹紝搴斾笌鏍囧噯鏁版嵁鏍煎紡涓�鑷达紝娉ㄦ剰series鐨刣ata鏁板�煎簲涓烘暟瀛楁牸寮�
+ this.chartsDataColumn4=JSON.parse(JSON.stringify(demodata.Column))
+ }, 1500);
+ },
backGroundRepeat() {
let len = this.bgs.length
let i = 0
@@ -89,6 +107,10 @@
</script>
<style scoped>
+ .charts-box {
+ height: 300px;
+ margin: 8px;
+ }
.content {
display: flex;
flex-direction: column;
@@ -150,8 +172,9 @@
font-size: 30rpx;
}
.top-border {
- background-color: #29EAC4;
- padding: 2px 5px;
+ background-color: #3f624d;
+ font-weight: 900;
+ padding: 0 5px;
border-radius: 2px;
}
--
Gitblit v1.9.1