rsbi 4 lat temu
rodzic
commit
0186c46265

+ 105 - 0
src/view/portal/ChartSeriesColor.vue

@@ -0,0 +1,105 @@
+<!-- 表格对话框都放这里面 -->
+<template>
+  	<el-dialog :title="title" :visible.sync="show" :close-on-click-modal="false" custom-class="nopadding">
+		
+		<div align="left">
+			
+			<template v-for="(item, index) in colors">
+				<span :key="item" :class="index===cidx - 1 ?'selcolor':''">
+					<span :style="'background-color:'+item+';'" class="seriesColor" @click="select(index + 1)"></span>
+				</span>
+			</template>
+			<br/>
+					<button class="btn btn-info btn-sm" @click="usedef()">使用默认色</button>
+
+		</div>
+		<div slot="footer" class="dialog-footer">
+			<el-button @click="show = false">关 闭</el-button>
+		</div>
+  </el-dialog>
+</template>
+
+<script>
+	import {ajax, newGuid} from '@/common/biConfig'
+	import $ from 'jquery'
+
+	export default {
+	    data(){
+			return {
+				show:false,
+				comp:null,
+				title:null,
+				colors:[],
+				chartParams:null,
+				cidx:1
+			}
+		},
+		mounted(){
+			this.loadColors();
+		},
+		computed: {
+		},
+		methods: {	
+			showDailog(comp, chartParams){
+				this.comp = comp;
+				if(comp.chartJson.type == "pie" || comp.chartJson.type == "map"){
+					return;
+				}
+				this.chartParams = chartParams;
+				this.show = true;
+				this.title = chartParams.seriesName + " - 设置系列颜色";
+				let t = comp.colors[chartParams.seriesName];
+				if(t){
+					this.cidx = t;
+				}
+			},
+			loadColors(){
+				ajax({
+					url:"portal/chartColors.action",
+					data:{},
+					type:"GET",
+					success:(resp)=>{
+						this.colors = resp.rows;
+					}
+				});
+			},
+			select(colorIdx){
+				let comp = this.comp;
+				if(!comp.colors){
+					comp.colors = {};
+				}
+				comp.colors[this.chartParams.seriesName] = colorIdx;
+				this.show = false;
+				this.$parent.setUpdate();
+				this.$parent.$refs['mv_'+comp.id].chartView();
+			},
+			usedef(){
+				let comp = this.comp;
+				if(comp.colors){
+					delete comp.colors[this.chartParams.seriesName];
+					this.show = false;
+				}
+				this.$parent.setUpdate();
+				this.$parent.$refs['mv_'+comp.id].chartView();
+			}
+		},
+		watch: {
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+.seriesColor {
+	width: 16px;
+	height: 16px;
+	padding: 5px;
+	display:inline-block;
+	cursor:pointer;
+	margin:5px;
+}
+.selcolor {
+	border:1px solid #990000;
+	height:30px;
+	display:inline-block;
+}
+</style>

+ 4 - 1
src/view/portal/LayoutOptarea.vue

@@ -3,6 +3,7 @@
 import { baseUrl, newGuid } from "@/common/biConfig";
 import PortalText from "./PortalText.vue"
 import ChartDailog from './ChartDailog.vue'
+import ChartSeriesColor from './ChartSeriesColor.vue'
 import CompFilter from './CompFilter.vue'
 import $ from "jquery";
 import * as utils from './Utils'
@@ -19,7 +20,8 @@ export default {
     GridView,
     TableView,
     ChartDailog,
-    CompFilter
+    CompFilter,
+    ChartSeriesColor
   },
   props: {
     pageInfo: {
@@ -81,6 +83,7 @@ export default {
         h('div', {class:"indicator"}, '==>'),
         h('PortalText',{ref:"portalTextForm"},''),
         h('ChartDailog', {ref:"chartDailogForm"}),
+        h('ChartSeriesColor', {ref:"ChartSeriesColorForm"}),
         h('CompFilter', {ref:"compFilterForm", props:{pageInfo:this.pageInfo}})
       ]
     );

+ 4 - 1
src/view/portal/LayoutView.vue

@@ -104,6 +104,9 @@ export default {
       if(comp.height){
         style['height'] =  comp.height + "px";
       }
+      if(comp.showtitle === false){
+        style['border'] = 'none';
+      }
       let bodys = {class:"ccctx", style:{}};
       if(comp.type ==='text'){
         bodys.domProps = {innerHTML:comp.desc.replace(/\n/g,"<br>")};
@@ -132,7 +135,7 @@ export default {
         }
       }
       let ctx = h('div', {class:"cctx ibox-content", style:style}, [h('div', bodys, comp.type=='text'?"":compctx)]);
-      return h('div', {attrs:{class:"ibox", id:"c_" + comp.id}}, [title, ctx]);
+      return h('div', {attrs:{class:"ibox", id:"c_" + comp.id}}, comp.showtitle===false?[ctx]:[title, ctx]);
     },
     /**
      * 调整图形大小,comp存在表示子调整当前组件,不存在表示调整所有组件

+ 6 - 0
src/view/portal/view/Chart.vue

@@ -89,6 +89,7 @@ export default {
      * 调用echarts渲染图形
      */
     showChart(){
+      let ts = this;
       let comp = this.comp;
       let option = loopChartJson(this.data);
       let myChart = echarts.getInstanceByDom(document.getElementById('ct_'+comp.id));
@@ -96,6 +97,11 @@ export default {
         myChart = echarts.init(document.getElementById('ct_'+comp.id), "default");
       }
       myChart.setOption(option, true);
+      if(this.editor === true){  //编辑模式,设置图形显示颜色
+          myChart.off("click").on('click', function(params){
+            ts.$parent.$refs['ChartSeriesColorForm'].showDailog(comp, params);
+          });
+      }
     }
   },
   watch: {