需求:1、echarts图表的类型是动态的,合同类型用柱状图展示,合计用折现图展示。2、下面表格对应的月份跟合同类型是动态的,从后台数据库获取,当查询条件只展示7个月的数据时,下面图表以及表格相应只展示7个月的数据。3、表格头加斜线。4、监听左侧菜单栏是否展开,解决左侧菜单展开关闭时图表自适应
2、话不多说贴代码
<el-form :inline="true" ref="searchForm" :model="searchForm" class="search-form">
<el-form-item >
<el-date-picker
v-model="searchForm.startMonth"
type="month"
format="yyyy-MM"
value-format="yyyy-MM"
placeholder="开始月份" @change="changeMonth">
</el-date-picker>
</el-form-item>
<el-form-item >
<el-date-picker
v-model="searchForm.endMonth"
type="month"
format="yyyy-MM"
value-format="yyyy-MM"
placeholder="结束月份">
</el-date-picker>
</el-form-item>
<el-form-item prop="custType">
<el-select v-model="searchForm.templateId" placeholder="合同类型" clearable>
<el-option
v-for="item in contractTypeList"
:key="item.templateId"
:label="item.templateName"
:value="item.templateId"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" value='ht:zq-look' @click="getList" v-has>查询</el-button>
</el-form-item>
</el-form>
<div class="content-box">
<el-row :gutter="15">
<el-col :span="18&#