70 lines
1.4 KiB
Vue
70 lines
1.4 KiB
Vue
<template>
|
|
<ai-list class="list">
|
|
<ai-title
|
|
slot="title"
|
|
title="数据统计"
|
|
isShowBottomBorder>
|
|
</ai-title>
|
|
<template slot="content">
|
|
<ai-card title="数据统计">
|
|
<div id="chart1"></div>
|
|
</ai-card>
|
|
</template>
|
|
</ai-list>
|
|
</template>
|
|
|
|
<script>
|
|
import { Line } from '@antv/g2plot'
|
|
import {sendChromeAPIMessage} from '@/api/chromeApi'
|
|
|
|
export default {
|
|
name: 'ExportSaleData',
|
|
|
|
data () {
|
|
return {
|
|
}
|
|
},
|
|
|
|
mounted () {
|
|
this.$nextTick(() => {
|
|
this.initChart1()
|
|
})
|
|
},
|
|
|
|
methods: {
|
|
initChart1 () {
|
|
const data = [
|
|
{ year: '1991', value: 3 },
|
|
{ year: '1992', value: 4 },
|
|
{ year: '1993', value: 3.5 },
|
|
{ year: '1994', value: 5 },
|
|
{ year: '1995', value: 4.9 },
|
|
{ year: '1996', value: 6 },
|
|
{ year: '1997', value: 7 },
|
|
{ year: '1998', value: 9 },
|
|
{ year: '1999', value: 13 }
|
|
]
|
|
|
|
const line = new Line('chart1', {
|
|
data,
|
|
xField: 'year',
|
|
yField: 'value',
|
|
});
|
|
|
|
line.render();
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.list {
|
|
::v-deep .ai-list__content .ai-list__content--right-wrapper {
|
|
border-radius: 0;
|
|
padding: 0!important;
|
|
box-shadow: none;
|
|
background: transparent;
|
|
}
|
|
}
|
|
</style>
|