no message
Former-commit-id: b4dd123d834815349356acc0b17a796c72ba2fd9 Former-commit-id: ff63f07702c96155e8b69d8b7f3fb5fafc3b922d Former-commit-id: 1d48f05f40c3e89bd3861115a5f3fd1e76e4e8a9
This commit is contained in:
@@ -1,42 +0,0 @@
|
||||
<template>
|
||||
<Container type="ghost" :responsive="true">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6">
|
||||
<ChartDemoControl
|
||||
@sync="syncData"
|
||||
:height.sync="height">
|
||||
</ChartDemoControl>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<el-card>
|
||||
<div :style="style">
|
||||
<G2AreaBase ref="chart" v-bind="chart"></G2AreaBase>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</Container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import publicMixin from './mixins/public'
|
||||
export default {
|
||||
mixins: [
|
||||
publicMixin
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
api: {
|
||||
url: '/api/chart/G2Area',
|
||||
data: {
|
||||
type: 'base'
|
||||
}
|
||||
},
|
||||
chart: {
|
||||
data: []
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
<template>
|
||||
<el-card>
|
||||
<el-button @click="$emit('sync')">
|
||||
<Icon name="refresh"></Icon>
|
||||
重新载入数据
|
||||
</el-button>
|
||||
<p>改变容器高度</p>
|
||||
<el-radio-group v-model="currentHeight" size="small">
|
||||
<el-radio-button v-for="(item, index) in heightOptions" :key="index" :label="item">{{item}}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
heightOptions: [300, 400, 500, 600],
|
||||
currentHeight: 0
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.currentHeight = this.height
|
||||
},
|
||||
watch: {
|
||||
currentHeight (value) {
|
||||
if (value !== this.height) {
|
||||
this.$emit('update:height', value)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
import ChartDemoControl from '../components/ChartDemoControl.vue'
|
||||
export default {
|
||||
components: {
|
||||
ChartDemoControl
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
height: 300
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.syncData()
|
||||
},
|
||||
computed: {
|
||||
style () {
|
||||
return {
|
||||
height: this.height + 'px'
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
style () {
|
||||
this.$nextTick(() => {
|
||||
this.resize()
|
||||
})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 请求数据
|
||||
syncData () {
|
||||
this.$axios.post(this.api.url, this.api.data)
|
||||
.then(res => {
|
||||
this.chart.data = res
|
||||
})
|
||||
},
|
||||
// 重新适应大小
|
||||
resize () {
|
||||
this.$refs.chart.resize()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,10 @@
|
||||
<template>
|
||||
<el-card>
|
||||
<div slot="header">
|
||||
<el-button size="mini" @click="syncData">加载数据</el-button>
|
||||
<el-button size="mini" @click="syncData">
|
||||
<Icon name="refresh"></Icon>
|
||||
加载数据
|
||||
</el-button>
|
||||
<el-radio-group v-model="height" size="mini">
|
||||
<el-radio-button v-for="(item, index) in heightOptions" :key="index" :label="item">{{item}}px</el-radio-button>
|
||||
</el-radio-group>
|
||||
@@ -24,7 +27,7 @@ export default {
|
||||
data () {
|
||||
return {
|
||||
data: [],
|
||||
height: 300,
|
||||
height: 500,
|
||||
heightOptions: [300, 400, 500, 600]
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user