[Update] 修改echarts

This commit is contained in:
ibuler
2020-05-20 14:30:39 +08:00
parent 8c46abbd64
commit b8825f10f1
4 changed files with 12 additions and 20 deletions

View File

@@ -45,6 +45,9 @@ import VueLogger from 'vuejs-logger'
import loggerOptions from './utils/logger'
Vue.use(VueLogger, loggerOptions)
import ECharts from 'vue-echarts'
Vue.component('echarts', ECharts)
import service from '@/utils/request'
// lodash

View File

@@ -3,22 +3,20 @@
<small>活跃用户资产占比</small>
<el-row :gutter="10">
<el-col :md="12" :sm="24">
<echarts :options="option" />
<echarts :options="option" :autoresize="true" />
</el-col>
<el-col :md="12" :sm="24">
<echarts :options="option" />
<echarts :options="option" :autoresize="true" />
</el-col>
</el-row>
</div>
</template>
<script>
import ECharts from 'vue-echarts'
import 'echarts/lib/chart/pie'
import 'echarts/lib/component/tooltip'
export default {
name: 'LoginActivePin',
components: { 'echarts': ECharts },
data() {
return {
option: {
@@ -65,7 +63,7 @@ export default {
<style scoped>
.echarts {
width: 150px;
width: 100%;
height: 250px;
}
</style>

View File

@@ -3,12 +3,10 @@
</template>
<script>
import ECharts from 'vue-echarts'
import 'echarts/lib/chart/line'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/legend'
export default {
name: 'LoginMetric',
components: { 'echarts': ECharts },
data: function() {
return {
options: {
@@ -25,11 +23,7 @@ export default {
}
},
legend: {
data: ['LoginCount', 'ActiveUser', 'ActiveAsset'],
formatter: function(name) {
const map = { LoginCount: '登录数量', ActiveUser: '用户', ActiveAsset: '资产' }
return map[name]
}
data: ['LoginCount', 'ActiveUser', 'ActiveAsset']
},
grid: {
left: '3%',
@@ -70,6 +64,7 @@ export default {
type: 'value'
}
],
animationDuration: 1000,
series: [
{
name: 'LoginCount',

View File

@@ -12,13 +12,10 @@
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :md="6" :sm="24">
<LoginTop class="card-item" />
</el-col>
<el-col :md="12" :sm="24">
<el-col :lg="18" :sm="24">
<LoginMetric class="card-item" style="margin-top: -30px" heigth="300px" />
</el-col>
<el-col :md="6" :sm="24">
<el-col :lg="6" :sm="24">
<LoginActivePin class="card-item" />
</el-col>
</el-row>
@@ -26,13 +23,12 @@
</template>
<script>
import LoginTop from './LoginTop'
import LoginMetric from './LoginMetric'
import LoginActivePin from './LoginActivePin'
export default {
name: 'DatesLoginSummary',
components: { LoginTop, LoginMetric, LoginActivePin },
components: { LoginMetric, LoginActivePin },
data() {
return {
active: 'weekly'