Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcjg-web
Showing
9 changed files
with
41 additions
and
16 deletions
| ... | @@ -59,6 +59,9 @@ export default { | ... | @@ -59,6 +59,9 @@ export default { |
| 59 | initChart () { | 59 | initChart () { |
| 60 | // 初始化echart | 60 | // 初始化echart |
| 61 | this.chart = this.$echarts.init(this.$el, 'tdTheme') | 61 | this.chart = this.$echarts.init(this.$el, 'tdTheme') |
| 62 | function nowSize(val,initWidth=1920){ | ||
| 63 | return val * (nowClientWidth/initWidth); | ||
| 64 | } | ||
| 62 | this.chart.setOption(this.options, true) | 65 | this.chart.setOption(this.options, true) |
| 63 | 66 | ||
| 64 | 67 | ... | ... |
| ... | @@ -35,6 +35,16 @@ export default { | ... | @@ -35,6 +35,16 @@ export default { |
| 35 | } | 35 | } |
| 36 | return rgbaColor; | 36 | return rgbaColor; |
| 37 | }, | 37 | }, |
| 38 | fontSize(res) { | ||
| 39 | let docEl = document.documentElement, | ||
| 40 | clientWidth = | ||
| 41 | window.innerWidth || | ||
| 42 | document.documentElement.clientWidth || | ||
| 43 | document.body.clientWidth; | ||
| 44 | if (!clientWidth) return; | ||
| 45 | let fontSize = clientWidth / 1920; | ||
| 46 | return res * fontSize; | ||
| 47 | } | ||
| 38 | }, | 48 | }, |
| 39 | watch: { | 49 | watch: { |
| 40 | cdata: { | 50 | cdata: { |
| ... | @@ -51,6 +61,7 @@ export default { | ... | @@ -51,6 +61,7 @@ export default { |
| 51 | data: newData.legendItem, | 61 | data: newData.legendItem, |
| 52 | textStyle: { | 62 | textStyle: { |
| 53 | color: "#00DEFF", | 63 | color: "#00DEFF", |
| 64 | fontSize:this.fontSize(12), | ||
| 54 | }, | 65 | }, |
| 55 | }, | 66 | }, |
| 56 | // calculable: true, | 67 | // calculable: true, |
| ... | @@ -97,8 +108,8 @@ export default { | ... | @@ -97,8 +108,8 @@ export default { |
| 97 | textStyle: { | 108 | textStyle: { |
| 98 | color: "rgba(255, 255, 255,0.7)", // x轴颜色 | 109 | color: "rgba(255, 255, 255,0.7)", // x轴颜色 |
| 99 | fontWeight: "normal", | 110 | fontWeight: "normal", |
| 100 | fontSize: "12", | 111 | fontSize: this.fontSize(12), |
| 101 | lineHeight: 22, | 112 | lineHeight: this.fontSize(22), |
| 102 | }, | 113 | }, |
| 103 | }, | 114 | }, |
| 104 | data: this.xAxisData, | 115 | data: this.xAxisData, |
| ... | @@ -136,7 +147,7 @@ export default { | ... | @@ -136,7 +147,7 @@ export default { |
| 136 | smooth: false, //是否平滑 | 147 | smooth: false, //是否平滑 |
| 137 | showSymbol: true, | 148 | showSymbol: true, |
| 138 | symbol: "circle", | 149 | symbol: "circle", |
| 139 | symbolSize: 6, | 150 | symbolSize: this.fontSize(6), |
| 140 | zlevel: 3, | 151 | zlevel: 3, |
| 141 | lineStyle: { | 152 | lineStyle: { |
| 142 | normal: { | 153 | normal: { |
| ... | @@ -154,7 +165,7 @@ export default { | ... | @@ -154,7 +165,7 @@ export default { |
| 154 | smooth: false, | 165 | smooth: false, |
| 155 | showSymbol: true, | 166 | showSymbol: true, |
| 156 | symbol: "circle", | 167 | symbol: "circle", |
| 157 | symbolSize: 8, | 168 | symbolSize: this.fontSize(8), |
| 158 | zlevel: 3, | 169 | zlevel: 3, |
| 159 | lineStyle: { | 170 | lineStyle: { |
| 160 | normal: { | 171 | normal: { |
| ... | @@ -172,7 +183,7 @@ export default { | ... | @@ -172,7 +183,7 @@ export default { |
| 172 | smooth: false, | 183 | smooth: false, |
| 173 | showSymbol: true, | 184 | showSymbol: true, |
| 174 | symbol: "circle", | 185 | symbol: "circle", |
| 175 | symbolSize: 8, | 186 | symbolSize: this.fontSize(8), |
| 176 | zlevel: 3, | 187 | zlevel: 3, |
| 177 | lineStyle: { | 188 | lineStyle: { |
| 178 | normal: { | 189 | normal: { | ... | ... |
| 1 | <template> | 1 | <template> |
| 2 | <Echart :options="options" id="centreLeft1Chart" :key="key" height="225px" width="80%"></Echart> | 2 | <Echart :options="options" id="centreLeft1Chart" :key="key" height="1.0417rem" width="80%"></Echart> |
| 3 | </template> | 3 | </template> |
| 4 | <script> | 4 | <script> |
| 5 | import Echart from '@/common/echart' | 5 | import Echart from '@/common/echart' |
| ... | @@ -23,7 +23,7 @@ export default { | ... | @@ -23,7 +23,7 @@ export default { |
| 23 | handler (newData) { | 23 | handler (newData) { |
| 24 | console.log("newData",newData); | 24 | console.log("newData",newData); |
| 25 | this.options = { | 25 | this.options = { |
| 26 | grid: { | 26 | grid: { |
| 27 | right:"1%", | 27 | right:"1%", |
| 28 | bottom:"4%" | 28 | bottom:"4%" |
| 29 | }, | 29 | }, |
| ... | @@ -49,7 +49,7 @@ export default { | ... | @@ -49,7 +49,7 @@ export default { |
| 49 | { | 49 | { |
| 50 | name: "业务量", | 50 | name: "业务量", |
| 51 | type: "pie", | 51 | type: "pie", |
| 52 | radius: [0,100], | 52 | radius: [20,100], |
| 53 | roseType: "area", | 53 | roseType: "area", |
| 54 | data: newData.seriesData | 54 | data: newData.seriesData |
| 55 | } | 55 | } |
| ... | @@ -67,7 +67,7 @@ export default { | ... | @@ -67,7 +67,7 @@ export default { |
| 67 | 67 | ||
| 68 | <style lang="scss" scoped> | 68 | <style lang="scss" scoped> |
| 69 | #centreLeft1Chart { | 69 | #centreLeft1Chart { |
| 70 | margin-bottom: 10px; | 70 | margin-bottom: .0521rem; |
| 71 | margin-left: 60px; | 71 | margin-left:60px; |
| 72 | } | 72 | } |
| 73 | </style> | 73 | </style> | ... | ... |
| ... | @@ -20,10 +20,14 @@ export default { | ... | @@ -20,10 +20,14 @@ export default { |
| 20 | }, | 20 | }, |
| 21 | mounted () { | 21 | mounted () { |
| 22 | this.getdjywltotal(); | 22 | this.getdjywltotal(); |
| 23 | window.addEventListener("resize", () => { | ||
| 24 | this.getdjywltotal(); | ||
| 25 | }); | ||
| 23 | }, | 26 | }, |
| 24 | methods: { | 27 | methods: { |
| 25 | // 获取登记业务量玫瑰图数据 | 28 | // 获取登记业务量玫瑰图数据 |
| 26 | async getdjywltotal () { | 29 | async getdjywltotal () { |
| 30 | this.cdata.seriesData=[] | ||
| 27 | try { | 31 | try { |
| 28 | let p = { | 32 | let p = { |
| 29 | DJLX: "", | 33 | DJLX: "", | ... | ... |
| ... | @@ -103,7 +103,7 @@ export default { | ... | @@ -103,7 +103,7 @@ export default { |
| 103 | height: 33%; | 103 | height: 33%; |
| 104 | background: url("~@/image/djywl.png") no-repeat; | 104 | background: url("~@/image/djywl.png") no-repeat; |
| 105 | background-size: 100% 100%; | 105 | background-size: 100% 100%; |
| 106 | padding: .2825rem 0 0 0; | 106 | padding: .3825rem 0 0 0; |
| 107 | } | 107 | } |
| 108 | 108 | ||
| 109 | .card3 { | 109 | .card3 { | ... | ... |
| ... | @@ -12,6 +12,7 @@ | ... | @@ -12,6 +12,7 @@ |
| 12 | <el-form-item label="开始日期" prop="startTime"> | 12 | <el-form-item label="开始日期" prop="startTime"> |
| 13 | <el-date-picker | 13 | <el-date-picker |
| 14 | type="datetime" | 14 | type="datetime" |
| 15 | class="width100" | ||
| 15 | placeholder="开始日期" | 16 | placeholder="开始日期" |
| 16 | :picker-options="pickerOptionsStart" | 17 | :picker-options="pickerOptionsStart" |
| 17 | v-model="form.startTime" | 18 | v-model="form.startTime" |
| ... | @@ -22,6 +23,7 @@ | ... | @@ -22,6 +23,7 @@ |
| 22 | <el-col :span="4"> | 23 | <el-col :span="4"> |
| 23 | <el-form-item label="结束日期" prop="endTime"> | 24 | <el-form-item label="结束日期" prop="endTime"> |
| 24 | <el-date-picker | 25 | <el-date-picker |
| 26 | class="width100" | ||
| 25 | type="datetime" | 27 | type="datetime" |
| 26 | placeholder="结束日期" | 28 | placeholder="结束日期" |
| 27 | :picker-options="pickerOptionsEnd" | 29 | :picker-options="pickerOptionsEnd" |
| ... | @@ -31,7 +33,7 @@ | ... | @@ -31,7 +33,7 @@ |
| 31 | </el-form-item> | 33 | </el-form-item> |
| 32 | </el-col> | 34 | </el-col> |
| 33 | <!-- 操作按钮 --> | 35 | <!-- 操作按钮 --> |
| 34 | <el-col :span="3" class="btnColRight"> | 36 | <el-col :span="4" class="btnColRight"> |
| 35 | <btn nativeType="cz" @click="resetForm">重置</btn> | 37 | <btn nativeType="cz" @click="resetForm">重置</btn> |
| 36 | <btn nativeType="cx" @click="getProcessCounts">查询</btn> | 38 | <btn nativeType="cx" @click="getProcessCounts">查询</btn> |
| 37 | </el-col> | 39 | </el-col> | ... | ... |
| ... | @@ -30,6 +30,7 @@ | ... | @@ -30,6 +30,7 @@ |
| 30 | <el-form-item label="开始日期" prop="startTime"> | 30 | <el-form-item label="开始日期" prop="startTime"> |
| 31 | <el-date-picker | 31 | <el-date-picker |
| 32 | type="datetime" | 32 | type="datetime" |
| 33 | class="width100" | ||
| 33 | placeholder="开始日期" | 34 | placeholder="开始日期" |
| 34 | :picker-options="pickerOptionsStart" | 35 | :picker-options="pickerOptionsStart" |
| 35 | v-model="form.startTime" | 36 | v-model="form.startTime" |
| ... | @@ -41,6 +42,7 @@ | ... | @@ -41,6 +42,7 @@ |
| 41 | <el-form-item label="结束日期" prop="endTime"> | 42 | <el-form-item label="结束日期" prop="endTime"> |
| 42 | <el-date-picker | 43 | <el-date-picker |
| 43 | type="datetime" | 44 | type="datetime" |
| 45 | class="width100" | ||
| 44 | placeholder="结束日期" | 46 | placeholder="结束日期" |
| 45 | :picker-options="pickerOptionsEnd" | 47 | :picker-options="pickerOptionsEnd" |
| 46 | v-model="form.endTime" | 48 | v-model="form.endTime" |
| ... | @@ -49,7 +51,7 @@ | ... | @@ -49,7 +51,7 @@ |
| 49 | </el-form-item> | 51 | </el-form-item> |
| 50 | </el-col> | 52 | </el-col> |
| 51 | <!-- 操作按钮 --> | 53 | <!-- 操作按钮 --> |
| 52 | <el-col :span="3" class="btnColRight"> | 54 | <el-col :span="4" class="btnColRight"> |
| 53 | <btn nativeType="cz" @click="resetForm">重置</btn> | 55 | <btn nativeType="cz" @click="resetForm">重置</btn> |
| 54 | <btn nativeType="cx" @click="getSuucessRate">查询</btn> | 56 | <btn nativeType="cx" @click="getSuucessRate">查询</btn> |
| 55 | </el-col> | 57 | </el-col> | ... | ... |
| ... | @@ -27,8 +27,9 @@ | ... | @@ -27,8 +27,9 @@ |
| 27 | </el-form-item> | 27 | </el-form-item> |
| 28 | </el-col> | 28 | </el-col> |
| 29 | <el-col :span="4"> | 29 | <el-col :span="4"> |
| 30 | <el-form-item label="开始日期" prop="startTime"> | 30 | <el-form-item label="开始日期"> |
| 31 | <el-date-picker | 31 | <el-date-picker |
| 32 | class="width100" | ||
| 32 | type="datetime" | 33 | type="datetime" |
| 33 | placeholder="开始日期" | 34 | placeholder="开始日期" |
| 34 | :picker-options="pickerOptionsStart" | 35 | :picker-options="pickerOptionsStart" |
| ... | @@ -38,8 +39,9 @@ | ... | @@ -38,8 +39,9 @@ |
| 38 | </el-form-item> | 39 | </el-form-item> |
| 39 | </el-col> | 40 | </el-col> |
| 40 | <el-col :span="4"> | 41 | <el-col :span="4"> |
| 41 | <el-form-item label="结束日期" prop="endTime"> | 42 | <el-form-item label="结束日期"> |
| 42 | <el-date-picker | 43 | <el-date-picker |
| 44 | class="width100" | ||
| 43 | type="datetime" | 45 | type="datetime" |
| 44 | placeholder="结束日期" | 46 | placeholder="结束日期" |
| 45 | :picker-options="pickerOptionsEnd" | 47 | :picker-options="pickerOptionsEnd" |
| ... | @@ -49,7 +51,7 @@ | ... | @@ -49,7 +51,7 @@ |
| 49 | </el-form-item> | 51 | </el-form-item> |
| 50 | </el-col> | 52 | </el-col> |
| 51 | <!-- 操作按钮 --> | 53 | <!-- 操作按钮 --> |
| 52 | <el-col :span="3" class="btnColRight"> | 54 | <el-col :span="4" class="btnColRight"> |
| 53 | <btn nativeType="cz" @click="resetForm">重置</btn> | 55 | <btn nativeType="cz" @click="resetForm">重置</btn> |
| 54 | <btn nativeType="cx" @click="getProcessCounts">查询</btn> | 56 | <btn nativeType="cx" @click="getProcessCounts">查询</btn> |
| 55 | </el-col> | 57 | </el-col> | ... | ... |
-
Please register or sign in to post a comment