31 changed files with 366 additions and 238 deletions
@ -1,34 +1,88 @@ |
|||
<template> |
|||
<div> |
|||
<q-btn label="弹出" @click="click"></q-btn> |
|||
<w-drawer |
|||
ref="drawerRef" |
|||
title="xxx" |
|||
:maximized="false" |
|||
:buttons="[ |
|||
{ |
|||
label: '测试', |
|||
<div class="w-[500px] h-[300px]"> |
|||
<w-echarts |
|||
:option="{ |
|||
title: { |
|||
left: 'center', |
|||
text: '资产余额', |
|||
}, |
|||
]" |
|||
> |
|||
1111 |
|||
<template #buttons> <q-btn label="xxx"></q-btn> </template> |
|||
</w-drawer> |
|||
tooltip: { |
|||
trigger: 'axis', |
|||
axisPointer: { |
|||
type: 'shadow', |
|||
}, |
|||
}, |
|||
grid: { |
|||
left: '3%', |
|||
right: '4%', |
|||
bottom: '3%', |
|||
containLabel: true, |
|||
}, |
|||
dataZoom: [ |
|||
{ |
|||
type: 'slider', |
|||
show: true, // 是否显示滚动条 |
|||
borderColor: '#2563eb', // 边框颜色 |
|||
showDetail: false, // 是否显示detail，即拖拽时显示详细数值信息 |
|||
startValue: 0, // 开始数值 |
|||
endValue: 10, // 结束数值 |
|||
filterMode: 'empty', |
|||
width: '80%', // 滚动条宽度 |
|||
height: 8, // 滚动条高度 |
|||
left: 'center', // 居中显示 |
|||
zoomLoxk: true, // 是否锁定选择区域的大小 |
|||
handleSize: 0, // 控制手柄的尺寸 |
|||
bottom: 0, // 距离容器下侧的距离 |
|||
}, |
|||
{ |
|||
type: 'inside', |
|||
zoomOnMouseWheel: false, // 滚动不触发缩放 |
|||
moveOnMouseMove: true, // 鼠标移动触发平移 |
|||
moveOnMouseWheel: true, // 鼠标滚动触发平移 |
|||
}, |
|||
], |
|||
xAxis: [ |
|||
{ |
|||
type: 'category', |
|||
data: [ |
|||
'黄浦支行', |
|||
'徐汇支行', |
|||
'长宁支行', |
|||
'静安支行', |
|||
'普陀支行', |
|||
'虹口支行', |
|||
'杨浦支行', |
|||
'浦东支行', |
|||
'闵行支行', |
|||
'宝山支行', |
|||
'嘉定支行', |
|||
'金山支行', |
|||
'松江支行', |
|||
'青浦支行', |
|||
'奉贤支行', |
|||
'崇明支行', |
|||
], |
|||
axisTick: { |
|||
alignWithLabel: true, |
|||
}, |
|||
}, |
|||
], |
|||
yAxis: [ |
|||
{ |
|||
type: 'value', |
|||
name: '单位：万元', |
|||
}, |
|||
], |
|||
series: [ |
|||
{ |
|||
type: 'bar', |
|||
barWidth: '10%', |
|||
data: [1700, 1600, 1500, 1400, 1300, 1200, 1100, 1000, 900, 800, 600, 500, 400, 300, 200, 100], |
|||
}, |
|||
], |
|||
}" |
|||
></w-echarts> |
|||
</div> |
|||
</template> |
|||
<script setup lang="ts"> |
|||
import { ref, reactive, onMounted } from 'vue'; |
|||
import { IconEnum } from '@/platform/enums'; |
|||
|
|||
const drawerRef = ref(); |
|||
|
|||
const aa = ref(50); |
|||
const aaaaa = (e) => { |
|||
console.info('dddddddddddddd', e); |
|||
}; |
|||
const click = () => { |
|||
drawerRef.value.show(); |
|||
}; |
|||
|
|||
onMounted(() => {}); |
|||
</script> |
|||
<script setup lang="ts"></script> |
|||
|
|||
Loading…
Reference in new issue