重构图形

src/view/bireport/ChgChartDailog.vue

@@ -18,7 +18,7 @@
 			</ul>
 			</div>
 			<div class="selright col-sm-9">
-			<div class="one" id="schart1" align="center" style="display: none;" tp="line">
+			<div class="one" id="schart1" align="center" style="display: block;" tp="line">
 			<img src="../../assets/chart/c1.gif">
 			</div>
 			<div class="one" id="schart2" align="center" tp="column" style="display: none;">
@@ -27,7 +27,7 @@
 			<div class="one" id="schart3" align="center" tp="pie" style="display: none;">
 			<img src="../../assets/chart/c3.gif">
 			</div>
-			<div class="one" id="schart10" align="center" tp="bar" style="display: block;">
+			<div class="one" id="schart10" align="center" tp="bar" style="display: none;">
 			<img src="../../assets/chart/bar.gif">
 			</div>
 			<div class="one" id="schart9" align="center" tp="area" style="display: none;">

src/view/bireport/ParamFilter.vue

@@ -90,7 +90,8 @@
 				dimValus:[],
 				st:null,  //日期/月份的开始日期
 				end:null,	//日期/月份的结束日期,
-				search:null
+				search:null,
+				useType: null
 			}
 		},
 		mounted(){
@@ -98,7 +99,7 @@
 		computed: {
 		},
 		methods: {	
-			createDimFilter(dim, comp){
+			createDimFilter(dim, comp, useType){   //用在维度
 				this.show = true;
 				this.title = dim.dimdesc+" - 维度筛选";
 				this.param = dim;
@@ -110,6 +111,7 @@
 				this.st = dim.st?dim.st: null;
 				this.end = dim.end?dim.end:null;
 				let load = Loading.service({ fullscreen: true });
+				this.useType = useType;
 				ajax({
 					url:"bireport/paramFilter.action",
 					data:{id:dim.id, cubeId:comp.cubeId, dsid:comp.dsid},
@@ -118,7 +120,7 @@
 					}
 				}, this, load);
 			},
-			create(paramId){
+			create(paramId){	//用在参数筛选
 				this.show = true;
 				let p = findParamById(paramId, this.pageInfo.params);
 				this.title = p.name + " - 参数筛选";
@@ -130,6 +132,7 @@
 				this.checkList = p.vals || [];
 				this.st = p.st?p.st: null;
 				this.end = p.end?p.end:null;
+				this.useType = 'param';
 				let load = Loading.service({ fullscreen: true });
 				ajax({
 					url:"bireport/paramFilter.action",
@@ -169,7 +172,14 @@
 				this.show = false;
 				//刷新组件
 				this.$parent.$refs['paramForm'].$forceUpdate();
-				this.$parent.$refs['tableForm'].tableView();
+				if(this.useType === 'param'){
+					this.$parent.$refs['tableForm'].tableView();
+					this.$parent.$refs['chartForm'].chartView();
+				}else if(this.useType === 'chart'){
+					this.$parent.$refs['chartForm'].chartView();
+				}else if(this.useType === 'table'){
+					this.$parent.$refs['tableForm'].tableView();
+				}
 			},
 			searchme(){
 				let load = Loading.service({ fullscreen: true });

src/view/bireport/ReportChart.vue

@@ -7,6 +7,7 @@
 	import * as chartUtils from '@/view/bireport/chartUtils'
 	import * as echartsUtils from '@/common/echartsUtils'
 	import chgChartDailog from '@/view/bireport/ChgChartDailog'
+	import reportChartDailog from '@/view/bireport/ReportChartDailog'
 
 	export default {
 	    data(){
@@ -22,7 +23,7 @@
 			},
 		},
 		components:{
-			chgChartDailog
+			chgChartDailog, reportChartDailog
 		},
 		render(h){
 			const comp = tools.findCompById(this.chartId, this.pageInfo);
@@ -68,7 +69,7 @@
 				h("img", {attrs:{src:require("../../assets/image/exchangexs2.gif")}})
 			];
 			let r = h('div', {attrs:{class:"ctx", id:"T"+this.chartId}}, [h('div', {class:"tsbd"}, [cgbtn, xcolobj, ycolobj, scolobj]), h('div', {class:"exchangexs"}, exchange), h("div", {attrs:{class:"chartctx", id:"chart"+this.chartId}}, "图表预览区域")]);
-			return h('div', [r, h('chgChartDailog', {ref:"chgChartForm"}, '')]);
+			return h('div', [r, h('chgChartDailog', {ref:"chgChartForm"}, ''), h('reportChartDailog', {ref:"reportChartForm"}, '')]);
 		},
 		mounted(){
 			this.initChartKpiDrop(2);
@@ -242,7 +243,10 @@
 							}
 							return v;
 						});
-						const myChart = echarts.init(document.getElementById('chart'+this.chartId));
+						let myChart = echarts.getInstanceByDom(document.getElementById('chart'+this.chartId));
+						if(!myChart){
+							myChart = echarts.init(document.getElementById('chart'+this.chartId));
+						}
 						myChart.setOption(option, true);
 					}
 				}, this, load);
@@ -257,17 +261,27 @@
 					delay: 500,
 					autoHide:true,
 					callback: function(key, opt) {
-						var compId =  ts.chartId;
+						var comp = tools.findCompById(ts.chartId, ts.pageInfo);
 						if(key == 'asc' || key == 'desc'){
-							chartsort(key);
+							chartUtils.chartsort(key, pos, comp, ()=>{
+								ts.setUpdate();
+								ts.chartView();
+							});
 						}else if(key == "filter"){
-							chartfilterDims();
+							if(pos === 'xcol' || pos === 'scol'){
+								ts.$parent.$parent.$parent.$refs['paramFilterForm'].createDimFilter(o, comp, 'chart');
+							}else{  //指标筛选
+
+							}
 						}else if(key == "prop"){
-							setChartKpi();
+							ts.$refs['reportChartForm'].setChartKpi(o, comp);
 						}else if(key == "top"){
-							getDimTop('chart');
+							ts.$refs['reportChartForm'].dimTop(o, comp);
 						}else if(key == "remove"){
-							delChartKpiOrDim();
+							chartUtils.delChartKpiOrDim(pos, comp, ()=>{
+								ts.setUpdate();
+								ts.chartView();
+							});
 						}
 					},
 					items: {
@@ -275,15 +289,14 @@
 						"desc": {name: "降序", icon: 'fa-sort-amount-desc'},
 						"filter": {name: "筛选",icon:"fa-filter"},
 						"top": {name: "取Top...",disabled:function(key, opt){
-							var tp = $(this).attr("cpos");
-							if(tp == "xcol"){
+							if(pos == "xcol"){
 								return false;
 							}else{
 								return true;
 							}
 						}},
 						"prop": {name: "属性...",disabled:function(key, opt){
-							var tp = $(this).attr("cpos");
+							let tp = pos;
 							if(tp == 'ycol' || tp == 'y2col' || tp=='y3col'){
 								return false;
 							}else{

src/view/bireport/ReportChartDailog.vue

@@ -0,0 +1,145 @@
+<!-- 表格对话框都放这里面 -->
+<template>
+  	<el-dialog :title="title" :visible.sync="show" :close-on-click-modal="false" custom-class="nopadding">
+		  <el-form :model="val" ref="valForm" label-position="left">
+			<template v-if="type === 'top'">
+				<el-form-item label="维度取Top" label-width="100px">
+					<el-input-number v-model="val.top" :min="1" :max="100" label="描述文字"></el-input-number>
+				</el-form-item>
+			</template>
+			<template v-if="type === 'kpiprop'">
+				<el-form-item label="度量名称" label-width="100px">
+					{{kpi.kpi_name}}
+				</el-form-item>
+				<el-form-item label="所属表" label-width="100px">
+					{{kpi.tname}}
+				</el-form-item>
+				<el-form-item label="聚合方式" label-width="100px">
+					{{kpi.aggre}}
+				</el-form-item>
+				<el-form-item label="度量单位" label-width="100px">
+					<el-select
+					v-model="val.rate"
+					placeholder="请选择"
+					>
+					<el-option
+						v-for="item in opt.unit"
+						:key="item.value"
+						:label="item.name"
+						:value="item.value"
+					>
+				</el-option>
+				</el-select>
+				</el-form-item>
+				<el-form-item label="格式化" label-width="100px">
+					<el-select
+						v-model="val.fmt"
+						placeholder="请选择"
+						>
+						<el-option
+							v-for="item in opt.fmt"
+							:key="item.value"
+							:label="item.text"
+							:value="item.value"
+						>
+					</el-option>
+					</el-select>
+				</el-form-item>
+			</template>
+		  </el-form>
+		<div slot="footer" class="dialog-footer">
+			<el-button type="primary" @click="save()">确 定</el-button>
+			<el-button @click="show = false">取 消</el-button>
+		</div>
+  </el-dialog>
+</template>
+
+<script>
+	import {ajax} from '@/common/biConfig'
+	import $ from 'jquery'
+	import {msginfo} from '@/view/bireport/bireportUtils'
+
+	export default {
+	    data(){
+			return {
+				show :false,
+				title:"",
+				type:"",
+				comp:null,
+				dim:null,
+				kpi:null,
+				val:{
+					top:null,
+					rate:null,
+					fmt:null
+				},
+				opt:{
+					unit:[{
+						name:"", value:"1"
+					},{
+						name:"千", value:"1000"
+					},{
+						name:"万", value:"10000"
+					},{
+						name:"百万", value:"1000000"
+					},{
+						name:"亿", value:"100000000"
+					}],
+					fmt:[{
+						value:"#,###", text:"整数"
+						},{
+						value:"#,##0.00", text:"小数(保留两位)"
+						},{
+						value:"#,##0.0000", text:"小数(保留四位)"
+						},{
+						value:"0.00%", text: "百分比"
+						}
+					]
+				}
+			}
+		},
+		mounted(){
+		},
+		computed: {
+		},
+		methods: {	
+			dimTop(dim, comp){
+				this.title = "维度取Top";
+				this.show = true;
+				this.type = "top";
+				this.dim = dim;
+				this.comp = comp;
+				this.val.top = dim.top;
+			},
+			setChartKpi(kpi, comp){
+				this.title = "度量属性";
+				this.show = true;
+				this.type = "kpiprop";
+				this.kpi = kpi;
+				this.comp = comp;
+				this.val.fmt = kpi.fmt;
+				this.val.rate = kpi.rate;
+			},
+			save(){
+				let dim = this.dim;
+				let kpi = this.kpi;
+				if(this.type === 'top'){
+					dim.top = this.val.top;
+				}else if(this.type === 'kpiprop'){
+					kpi.fmt = this.val.fmt;
+					kpi.rate = this.val.rate;
+				}
+				let o = this.$parent;
+				o.setUpdate();
+				o.chartView();
+				this.show = false;
+			}
+		},
+		watch: {
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/view/bireport/ReportParam.vue

@@ -122,6 +122,8 @@
 				if(this.pageInfo.params.length === 0){
 					$("#p_param").html("<div class=\"ptabhelpr\">拖拽维度到此处作为页面参数</div>");
 				}
+				this.$parent.$refs['tableForm'].tableView();
+				this.$parent.$refs['chartForm'].chartView();
 			}
 		},
 		watch: {

src/view/bireport/ReportTable.vue

@@ -384,7 +384,7 @@ export default {
 							ts.setUpdate();
 						});
 					}else if(key == "filter"){
-						ts.$parent.$parent.$parent.$refs['paramFilterForm'].createDimFilter(dim, comp);
+						ts.$parent.$parent.$parent.$refs['paramFilterForm'].createDimFilter(dim, comp, 'table');
 					}else if(key == "aggre"){
 						if(dim.issum === 'y'){
 							dim.issum = 'n';

src/view/bireport/ReportTableDailog.vue

@@ -39,7 +39,7 @@
 				<el-form-item label="所属表" label-width="100px">
 					{{kpi.tname}}
 				</el-form-item>
-				<el-form-item label="所属表" label-width="100px">
+				<el-form-item label="聚合方式" label-width="100px">
 					{{kpi.aggre}}
 				</el-form-item>
 				<el-form-item label="度量单位" label-width="100px">

src/view/bireport/chartUtils.js

@@ -16,4 +16,52 @@ export function findDimById(dimId, dims){
 		}
 	}
 	return ret;
+}
+
+export function delChartKpiOrDim(tp, json, cb){
+	if(tp == 'xcol'){
+		delete json.chartJson.xcol;
+	}
+	if(tp == 'ycol'){
+		json.chartJson.ycol = {};
+		if(json.kpiJson.length > 1){
+			json.kpiJson[0] = null;
+		}else{
+			json.kpiJson = [];
+		}
+	}
+	if(tp == 'y2col'){
+		if(json.kpiJson.length > 1){
+			json.kpiJson[1] = null;
+		}else{
+			json.kpiJson = [];
+		}
+	}
+	if(tp == 'y3col'){
+		json.kpiJson[2] = null;
+	}
+	if(tp == 'scol'){
+		delete json.chartJson.scol;
+	}
+	if(cb){
+		cb();
+	}
+}
+export function chartsort(sorttp, tp, json, cb){
+	if(tp == 'xcol'){
+		//清除度量排序,因为度量排序最优先
+		delete json.kpiJson[0].sort;
+		json.chartJson.xcol.dimord = sorttp;
+	}
+	if(tp == 'ycol'){
+		json.kpiJson[0].sort = sorttp;
+	}
+	if(tp == 'scol'){
+		//清除度量排序
+		delete json.kpiJson[0].sort;
+		json.chartJson.scol.dimord = sorttp;
+	}
+	if(cb){
+		cb();
+	}
 }