dongjunchuan/de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:增加仪表盘设计组件及设计 自适应view 组件

Browse Source
This commit is contained in:
wangjiahao 2021-03-19 15:54:35 +08:00
parent 464d42a4ec
commit 592f08ac7b
27 changed files with 2065 additions and 303 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
backend/src/main/java/io/dataease/base/domain/PanelDesign.java Normal file
View File

@ -0,0 +1,29 @@
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
@Data
public class PanelDesign implements Serializable {
private String id;
private String panelId;
private String componentId;
private String componentStyle;
private String componentType;
private String componentDetails;
private Long createTime;
private Long updateTime;
private String createPersion;
private String updatePersion;
private static final long serialVersionUID = 1L;
}

880
backend/src/main/java/io/dataease/base/domain/PanelDesignExample.java Normal file
View File

@ -0,0 +1,880 @@
package io.dataease.base.domain;
import java.util.ArrayList;
import java.util.List;
public class PanelDesignExample {
protected String orderByClause;
protected boolean distinct;
protected List<Criteria> oredCriteria;
public PanelDesignExample() {
oredCriteria = new ArrayList<Criteria>();
}
public void setOrderByClause(String orderByClause) {
this.orderByClause = orderByClause;
}
public String getOrderByClause() {
return orderByClause;
}
public void setDistinct(boolean distinct) {
this.distinct = distinct;
}
public boolean isDistinct() {
return distinct;
}
public List<Criteria> getOredCriteria() {
return oredCriteria;
}
public void or(Criteria criteria) {
oredCriteria.add(criteria);
}
public Criteria or() {
Criteria criteria = createCriteriaInternal();
oredCriteria.add(criteria);
return criteria;
}
public Criteria createCriteria() {
Criteria criteria = createCriteriaInternal();
if (oredCriteria.size() == 0) {
oredCriteria.add(criteria);
}
return criteria;
}
protected Criteria createCriteriaInternal() {
Criteria criteria = new Criteria();
return criteria;
}
public void clear() {
oredCriteria.clear();
orderByClause = null;
distinct = false;
}
protected abstract static class GeneratedCriteria {
protected List<Criterion> criteria;
protected GeneratedCriteria() {
super();
criteria = new ArrayList<Criterion>();
}
public boolean isValid() {
return criteria.size() > 0;
}
public List<Criterion> getAllCriteria() {
return criteria;
}
public List<Criterion> getCriteria() {
return criteria;
}
protected void addCriterion(String condition) {
if (condition == null) {
throw new RuntimeException("Value for condition cannot be null");
}
criteria.add(new Criterion(condition));
}
protected void addCriterion(String condition, Object value, String property) {
if (value == null) {
throw new RuntimeException("Value for " + property + " cannot be null");
}
criteria.add(new Criterion(condition, value));
}
protected void addCriterion(String condition, Object value1, Object value2, String property) {
if (value1 == null || value2 == null) {
throw new RuntimeException("Between values for " + property + " cannot be null");
}
criteria.add(new Criterion(condition, value1, value2));
}
public Criteria andIdIsNull() {
addCriterion("id is null");
return (Criteria) this;
}
public Criteria andIdIsNotNull() {
addCriterion("id is not null");
return (Criteria) this;
}
public Criteria andIdEqualTo(String value) {
addCriterion("id =", value, "id");
return (Criteria) this;
}
public Criteria andIdNotEqualTo(String value) {
addCriterion("id <>", value, "id");
return (Criteria) this;
}
public Criteria andIdGreaterThan(String value) {
addCriterion("id >", value, "id");
return (Criteria) this;
}
public Criteria andIdGreaterThanOrEqualTo(String value) {
addCriterion("id >=", value, "id");
return (Criteria) this;
}
public Criteria andIdLessThan(String value) {
addCriterion("id <", value, "id");
return (Criteria) this;
}
public Criteria andIdLessThanOrEqualTo(String value) {
addCriterion("id <=", value, "id");
return (Criteria) this;
}
public Criteria andIdLike(String value) {
addCriterion("id like", value, "id");
return (Criteria) this;
}
public Criteria andIdNotLike(String value) {
addCriterion("id not like", value, "id");
return (Criteria) this;
}
public Criteria andIdIn(List<String> values) {
addCriterion("id in", values, "id");
return (Criteria) this;
}
public Criteria andIdNotIn(List<String> values) {
addCriterion("id not in", values, "id");
return (Criteria) this;
}
public Criteria andIdBetween(String value1, String value2) {
addCriterion("id between", value1, value2, "id");
return (Criteria) this;
}
public Criteria andIdNotBetween(String value1, String value2) {
addCriterion("id not between", value1, value2, "id");
return (Criteria) this;
}
public Criteria andPanelIdIsNull() {
addCriterion("panel_id is null");
return (Criteria) this;
}
public Criteria andPanelIdIsNotNull() {
addCriterion("panel_id is not null");
return (Criteria) this;
}
public Criteria andPanelIdEqualTo(String value) {
addCriterion("panel_id =", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdNotEqualTo(String value) {
addCriterion("panel_id <>", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdGreaterThan(String value) {
addCriterion("panel_id >", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdGreaterThanOrEqualTo(String value) {
addCriterion("panel_id >=", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdLessThan(String value) {
addCriterion("panel_id <", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdLessThanOrEqualTo(String value) {
addCriterion("panel_id <=", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdLike(String value) {
addCriterion("panel_id like", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdNotLike(String value) {
addCriterion("panel_id not like", value, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdIn(List<String> values) {
addCriterion("panel_id in", values, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdNotIn(List<String> values) {
addCriterion("panel_id not in", values, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdBetween(String value1, String value2) {
addCriterion("panel_id between", value1, value2, "panelId");
return (Criteria) this;
}
public Criteria andPanelIdNotBetween(String value1, String value2) {
addCriterion("panel_id not between", value1, value2, "panelId");
return (Criteria) this;
}
public Criteria andComponentIdIsNull() {
addCriterion("component_id is null");
return (Criteria) this;
}
public Criteria andComponentIdIsNotNull() {
addCriterion("component_id is not null");
return (Criteria) this;
}
public Criteria andComponentIdEqualTo(String value) {
addCriterion("component_id =", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdNotEqualTo(String value) {
addCriterion("component_id <>", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdGreaterThan(String value) {
addCriterion("component_id >", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdGreaterThanOrEqualTo(String value) {
addCriterion("component_id >=", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdLessThan(String value) {
addCriterion("component_id <", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdLessThanOrEqualTo(String value) {
addCriterion("component_id <=", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdLike(String value) {
addCriterion("component_id like", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdNotLike(String value) {
addCriterion("component_id not like", value, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdIn(List<String> values) {
addCriterion("component_id in", values, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdNotIn(List<String> values) {
addCriterion("component_id not in", values, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdBetween(String value1, String value2) {
addCriterion("component_id between", value1, value2, "componentId");
return (Criteria) this;
}
public Criteria andComponentIdNotBetween(String value1, String value2) {
addCriterion("component_id not between", value1, value2, "componentId");
return (Criteria) this;
}
public Criteria andComponentStyleIsNull() {
addCriterion("component_style is null");
return (Criteria) this;
}
public Criteria andComponentStyleIsNotNull() {
addCriterion("component_style is not null");
return (Criteria) this;
}
public Criteria andComponentStyleEqualTo(String value) {
addCriterion("component_style =", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleNotEqualTo(String value) {
addCriterion("component_style <>", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleGreaterThan(String value) {
addCriterion("component_style >", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleGreaterThanOrEqualTo(String value) {
addCriterion("component_style >=", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleLessThan(String value) {
addCriterion("component_style <", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleLessThanOrEqualTo(String value) {
addCriterion("component_style <=", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleLike(String value) {
addCriterion("component_style like", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleNotLike(String value) {
addCriterion("component_style not like", value, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleIn(List<String> values) {
addCriterion("component_style in", values, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleNotIn(List<String> values) {
addCriterion("component_style not in", values, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleBetween(String value1, String value2) {
addCriterion("component_style between", value1, value2, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentStyleNotBetween(String value1, String value2) {
addCriterion("component_style not between", value1, value2, "componentStyle");
return (Criteria) this;
}
public Criteria andComponentTypeIsNull() {
addCriterion("component_type is null");
return (Criteria) this;
}
public Criteria andComponentTypeIsNotNull() {
addCriterion("component_type is not null");
return (Criteria) this;
}
public Criteria andComponentTypeEqualTo(String value) {
addCriterion("component_type =", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeNotEqualTo(String value) {
addCriterion("component_type <>", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeGreaterThan(String value) {
addCriterion("component_type >", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeGreaterThanOrEqualTo(String value) {
addCriterion("component_type >=", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeLessThan(String value) {
addCriterion("component_type <", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeLessThanOrEqualTo(String value) {
addCriterion("component_type <=", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeLike(String value) {
addCriterion("component_type like", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeNotLike(String value) {
addCriterion("component_type not like", value, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeIn(List<String> values) {
addCriterion("component_type in", values, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeNotIn(List<String> values) {
addCriterion("component_type not in", values, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeBetween(String value1, String value2) {
addCriterion("component_type between", value1, value2, "componentType");
return (Criteria) this;
}
public Criteria andComponentTypeNotBetween(String value1, String value2) {
addCriterion("component_type not between", value1, value2, "componentType");
return (Criteria) this;
}
public Criteria andComponentDetailsIsNull() {
addCriterion("component_details is null");
return (Criteria) this;
}
public Criteria andComponentDetailsIsNotNull() {
addCriterion("component_details is not null");
return (Criteria) this;
}
public Criteria andComponentDetailsEqualTo(String value) {
addCriterion("component_details =", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsNotEqualTo(String value) {
addCriterion("component_details <>", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsGreaterThan(String value) {
addCriterion("component_details >", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsGreaterThanOrEqualTo(String value) {
addCriterion("component_details >=", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsLessThan(String value) {
addCriterion("component_details <", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsLessThanOrEqualTo(String value) {
addCriterion("component_details <=", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsLike(String value) {
addCriterion("component_details like", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsNotLike(String value) {
addCriterion("component_details not like", value, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsIn(List<String> values) {
addCriterion("component_details in", values, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsNotIn(List<String> values) {
addCriterion("component_details not in", values, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsBetween(String value1, String value2) {
addCriterion("component_details between", value1, value2, "componentDetails");
return (Criteria) this;
}
public Criteria andComponentDetailsNotBetween(String value1, String value2) {
addCriterion("component_details not between", value1, value2, "componentDetails");
return (Criteria) this;
}
public Criteria andCreateTimeIsNull() {
addCriterion("create_time is null");
return (Criteria) this;
}
public Criteria andCreateTimeIsNotNull() {
addCriterion("create_time is not null");
return (Criteria) this;
}
public Criteria andCreateTimeEqualTo(Long value) {
addCriterion("create_time =", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeNotEqualTo(Long value) {
addCriterion("create_time <>", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeGreaterThan(Long value) {
addCriterion("create_time >", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeGreaterThanOrEqualTo(Long value) {
addCriterion("create_time >=", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeLessThan(Long value) {
addCriterion("create_time <", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeLessThanOrEqualTo(Long value) {
addCriterion("create_time <=", value, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeIn(List<Long> values) {
addCriterion("create_time in", values, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeNotIn(List<Long> values) {
addCriterion("create_time not in", values, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeBetween(Long value1, Long value2) {
addCriterion("create_time between", value1, value2, "createTime");
return (Criteria) this;
}
public Criteria andCreateTimeNotBetween(Long value1, Long value2) {
addCriterion("create_time not between", value1, value2, "createTime");
return (Criteria) this;
}
public Criteria andUpdateTimeIsNull() {
addCriterion("update_time is null");
return (Criteria) this;
}
public Criteria andUpdateTimeIsNotNull() {
addCriterion("update_time is not null");
return (Criteria) this;
}
public Criteria andUpdateTimeEqualTo(Long value) {
addCriterion("update_time =", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeNotEqualTo(Long value) {
addCriterion("update_time <>", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeGreaterThan(Long value) {
addCriterion("update_time >", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeGreaterThanOrEqualTo(Long value) {
addCriterion("update_time >=", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeLessThan(Long value) {
addCriterion("update_time <", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeLessThanOrEqualTo(Long value) {
addCriterion("update_time <=", value, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeIn(List<Long> values) {
addCriterion("update_time in", values, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeNotIn(List<Long> values) {
addCriterion("update_time not in", values, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeBetween(Long value1, Long value2) {
addCriterion("update_time between", value1, value2, "updateTime");
return (Criteria) this;
}
public Criteria andUpdateTimeNotBetween(Long value1, Long value2) {
addCriterion("update_time not between", value1, value2, "updateTime");
return (Criteria) this;
}
public Criteria andCreatePersionIsNull() {
addCriterion("create_persion is null");
return (Criteria) this;
}
public Criteria andCreatePersionIsNotNull() {
addCriterion("create_persion is not null");
return (Criteria) this;
}
public Criteria andCreatePersionEqualTo(String value) {
addCriterion("create_persion =", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionNotEqualTo(String value) {
addCriterion("create_persion <>", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionGreaterThan(String value) {
addCriterion("create_persion >", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionGreaterThanOrEqualTo(String value) {
addCriterion("create_persion >=", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionLessThan(String value) {
addCriterion("create_persion <", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionLessThanOrEqualTo(String value) {
addCriterion("create_persion <=", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionLike(String value) {
addCriterion("create_persion like", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionNotLike(String value) {
addCriterion("create_persion not like", value, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionIn(List<String> values) {
addCriterion("create_persion in", values, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionNotIn(List<String> values) {
addCriterion("create_persion not in", values, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionBetween(String value1, String value2) {
addCriterion("create_persion between", value1, value2, "createPersion");
return (Criteria) this;
}
public Criteria andCreatePersionNotBetween(String value1, String value2) {
addCriterion("create_persion not between", value1, value2, "createPersion");
return (Criteria) this;
}
public Criteria andUpdatePersionIsNull() {
addCriterion("update_persion is null");
return (Criteria) this;
}
public Criteria andUpdatePersionIsNotNull() {
addCriterion("update_persion is not null");
return (Criteria) this;
}
public Criteria andUpdatePersionEqualTo(String value) {
addCriterion("update_persion =", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionNotEqualTo(String value) {
addCriterion("update_persion <>", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionGreaterThan(String value) {
addCriterion("update_persion >", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionGreaterThanOrEqualTo(String value) {
addCriterion("update_persion >=", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionLessThan(String value) {
addCriterion("update_persion <", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionLessThanOrEqualTo(String value) {
addCriterion("update_persion <=", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionLike(String value) {
addCriterion("update_persion like", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionNotLike(String value) {
addCriterion("update_persion not like", value, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionIn(List<String> values) {
addCriterion("update_persion in", values, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionNotIn(List<String> values) {
addCriterion("update_persion not in", values, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionBetween(String value1, String value2) {
addCriterion("update_persion between", value1, value2, "updatePersion");
return (Criteria) this;
}
public Criteria andUpdatePersionNotBetween(String value1, String value2) {
addCriterion("update_persion not between", value1, value2, "updatePersion");
return (Criteria) this;
}
}
public static class Criteria extends GeneratedCriteria {
protected Criteria() {
super();
}
}
public static class Criterion {
private String condition;
private Object value;
private Object secondValue;
private boolean noValue;
private boolean singleValue;
private boolean betweenValue;
private boolean listValue;
private String typeHandler;
public String getCondition() {
return condition;
}
public Object getValue() {
return value;
}
public Object getSecondValue() {
return secondValue;
}
public boolean isNoValue() {
return noValue;
}
public boolean isSingleValue() {
return singleValue;
}
public boolean isBetweenValue() {
return betweenValue;
}
public boolean isListValue() {
return listValue;
}
public String getTypeHandler() {
return typeHandler;
}
protected Criterion(String condition) {
super();
this.condition = condition;
this.typeHandler = null;
this.noValue = true;
}
protected Criterion(String condition, Object value, String typeHandler) {
super();
this.condition = condition;
this.value = value;
this.typeHandler = typeHandler;
if (value instanceof List<?>) {
this.listValue = true;
} else {
this.singleValue = true;
}
}
protected Criterion(String condition, Object value) {
this(condition, value, null);
}
protected Criterion(String condition, Object value, Object secondValue, String typeHandler) {
super();
this.condition = condition;
this.value = value;
this.secondValue = secondValue;
this.typeHandler = typeHandler;
this.betweenValue = true;
}
protected Criterion(String condition, Object value, Object secondValue) {
this(condition, value, secondValue, null);
}
}
}

30
backend/src/main/java/io/dataease/base/mapper/PanelDesignMapper.java Normal file
View File

@ -0,0 +1,30 @@
package io.dataease.base.mapper;
import io.dataease.base.domain.PanelDesign;
import io.dataease.base.domain.PanelDesignExample;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface PanelDesignMapper {
long countByExample(PanelDesignExample example);
int deleteByExample(PanelDesignExample example);
int deleteByPrimaryKey(String id);
int insert(PanelDesign record);
int insertSelective(PanelDesign record);
List<PanelDesign> selectByExample(PanelDesignExample example);
PanelDesign selectByPrimaryKey(String id);
int updateByExampleSelective(@Param("record") PanelDesign record, @Param("example") PanelDesignExample example);
int updateByExample(@Param("record") PanelDesign record, @Param("example") PanelDesignExample example);
int updateByPrimaryKeySelective(PanelDesign record);
int updateByPrimaryKey(PanelDesign record);
}

291
backend/src/main/java/io/dataease/base/mapper/PanelDesignMapper.xml Normal file
View File

@ -0,0 +1,291 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="io.dataease.base.mapper.PanelDesignMapper">
<resultMap id="BaseResultMap" type="io.dataease.base.domain.PanelDesign">
<id column="id" jdbcType="VARCHAR" property="id" />
<result column="panel_id" jdbcType="VARCHAR" property="panelId" />
<result column="component_id" jdbcType="VARCHAR" property="componentId" />
<result column="component_style" jdbcType="VARCHAR" property="componentStyle" />
<result column="component_type" jdbcType="VARCHAR" property="componentType" />
<result column="component_details" jdbcType="VARCHAR" property="componentDetails" />
<result column="create_time" jdbcType="BIGINT" property="createTime" />
<result column="update_time" jdbcType="BIGINT" property="updateTime" />
<result column="create_persion" jdbcType="VARCHAR" property="createPersion" />
<result column="update_persion" jdbcType="VARCHAR" property="updatePersion" />
</resultMap>
<sql id="Example_Where_Clause">
<where>
<foreach collection="oredCriteria" item="criteria" separator="or">
<if test="criteria.valid">
<trim prefix="(" prefixOverrides="and" suffix=")">
<foreach collection="criteria.criteria" item="criterion">
<choose>
<when test="criterion.noValue">
and ${criterion.condition}
</when>
<when test="criterion.singleValue">
and ${criterion.condition} #{criterion.value}
</when>
<when test="criterion.betweenValue">
and ${criterion.condition} #{criterion.value} and #{criterion.secondValue}
</when>
<when test="criterion.listValue">
and ${criterion.condition}
<foreach close=")" collection="criterion.value" item="listItem" open="(" separator=",">
#{listItem}
</foreach>
</when>
</choose>
</foreach>
</trim>
</if>
</foreach>
</where>
</sql>
<sql id="Update_By_Example_Where_Clause">
<where>
<foreach collection="example.oredCriteria" item="criteria" separator="or">
<if test="criteria.valid">
<trim prefix="(" prefixOverrides="and" suffix=")">
<foreach collection="criteria.criteria" item="criterion">
<choose>
<when test="criterion.noValue">
and ${criterion.condition}
</when>
<when test="criterion.singleValue">
and ${criterion.condition} #{criterion.value}
</when>
<when test="criterion.betweenValue">
and ${criterion.condition} #{criterion.value} and #{criterion.secondValue}
</when>
<when test="criterion.listValue">
and ${criterion.condition}
<foreach close=")" collection="criterion.value" item="listItem" open="(" separator=",">
#{listItem}
</foreach>
</when>
</choose>
</foreach>
</trim>
</if>
</foreach>
</where>
</sql>
<sql id="Base_Column_List">
id, panel_id, component_id, component_style, component_type, component_details, create_time,
update_time, create_persion, update_persion
</sql>
<select id="selectByExample" parameterType="io.dataease.base.domain.PanelDesignExample" resultMap="BaseResultMap">
select
<if test="distinct">
distinct
</if>
<include refid="Base_Column_List" />
from panel_design
<if test="_parameter != null">
<include refid="Example_Where_Clause" />
</if>
<if test="orderByClause != null">
order by ${orderByClause}
</if>
</select>
<select id="selectByPrimaryKey" parameterType="java.lang.String" resultMap="BaseResultMap">
select
<include refid="Base_Column_List" />
from panel_design
where id = #{id,jdbcType=VARCHAR}
</select>
<delete id="deleteByPrimaryKey" parameterType="java.lang.String">
delete from panel_design
where id = #{id,jdbcType=VARCHAR}
</delete>
<delete id="deleteByExample" parameterType="io.dataease.base.domain.PanelDesignExample">
delete from panel_design
<if test="_parameter != null">
<include refid="Example_Where_Clause" />
</if>
</delete>
<insert id="insert" parameterType="io.dataease.base.domain.PanelDesign">
insert into panel_design (id, panel_id, component_id,
component_style, component_type, component_details,
create_time, update_time, create_persion,
update_persion)
values (#{id,jdbcType=VARCHAR}, #{panelId,jdbcType=VARCHAR}, #{componentId,jdbcType=VARCHAR},
#{componentStyle,jdbcType=VARCHAR}, #{componentType,jdbcType=VARCHAR}, #{componentDetails,jdbcType=VARCHAR},
#{createTime,jdbcType=BIGINT}, #{updateTime,jdbcType=BIGINT}, #{createPersion,jdbcType=VARCHAR},
#{updatePersion,jdbcType=VARCHAR})
</insert>
<insert id="insertSelective" parameterType="io.dataease.base.domain.PanelDesign">
insert into panel_design
<trim prefix="(" suffix=")" suffixOverrides=",">
<if test="id != null">
id,
</if>
<if test="panelId != null">
panel_id,
</if>
<if test="componentId != null">
component_id,
</if>
<if test="componentStyle != null">
component_style,
</if>
<if test="componentType != null">
component_type,
</if>
<if test="componentDetails != null">
component_details,
</if>
<if test="createTime != null">
create_time,
</if>
<if test="updateTime != null">
update_time,
</if>
<if test="createPersion != null">
create_persion,
</if>
<if test="updatePersion != null">
update_persion,
</if>
</trim>
<trim prefix="values (" suffix=")" suffixOverrides=",">
<if test="id != null">
#{id,jdbcType=VARCHAR},
</if>
<if test="panelId != null">
#{panelId,jdbcType=VARCHAR},
</if>
<if test="componentId != null">
#{componentId,jdbcType=VARCHAR},
</if>
<if test="componentStyle != null">
#{componentStyle,jdbcType=VARCHAR},
</if>
<if test="componentType != null">
#{componentType,jdbcType=VARCHAR},
</if>
<if test="componentDetails != null">
#{componentDetails,jdbcType=VARCHAR},
</if>
<if test="createTime != null">
#{createTime,jdbcType=BIGINT},
</if>
<if test="updateTime != null">
#{updateTime,jdbcType=BIGINT},
</if>
<if test="createPersion != null">
#{createPersion,jdbcType=VARCHAR},
</if>
<if test="updatePersion != null">
#{updatePersion,jdbcType=VARCHAR},
</if>
</trim>
</insert>
<select id="countByExample" parameterType="io.dataease.base.domain.PanelDesignExample" resultType="java.lang.Long">
select count(*) from panel_design
<if test="_parameter != null">
<include refid="Example_Where_Clause" />
</if>
</select>
<update id="updateByExampleSelective" parameterType="map">
update panel_design
<set>
<if test="record.id != null">
id = #{record.id,jdbcType=VARCHAR},
</if>
<if test="record.panelId != null">
panel_id = #{record.panelId,jdbcType=VARCHAR},
</if>
<if test="record.componentId != null">
component_id = #{record.componentId,jdbcType=VARCHAR},
</if>
<if test="record.componentStyle != null">
component_style = #{record.componentStyle,jdbcType=VARCHAR},
</if>
<if test="record.componentType != null">
component_type = #{record.componentType,jdbcType=VARCHAR},
</if>
<if test="record.componentDetails != null">
component_details = #{record.componentDetails,jdbcType=VARCHAR},
</if>
<if test="record.createTime != null">
create_time = #{record.createTime,jdbcType=BIGINT},
</if>
<if test="record.updateTime != null">
update_time = #{record.updateTime,jdbcType=BIGINT},
</if>
<if test="record.createPersion != null">
create_persion = #{record.createPersion,jdbcType=VARCHAR},
</if>
<if test="record.updatePersion != null">
update_persion = #{record.updatePersion,jdbcType=VARCHAR},
</if>
</set>
<if test="_parameter != null">
<include refid="Update_By_Example_Where_Clause" />
</if>
</update>
<update id="updateByExample" parameterType="map">
update panel_design
set id = #{record.id,jdbcType=VARCHAR},
panel_id = #{record.panelId,jdbcType=VARCHAR},
component_id = #{record.componentId,jdbcType=VARCHAR},
component_style = #{record.componentStyle,jdbcType=VARCHAR},
component_type = #{record.componentType,jdbcType=VARCHAR},
component_details = #{record.componentDetails,jdbcType=VARCHAR},
create_time = #{record.createTime,jdbcType=BIGINT},
update_time = #{record.updateTime,jdbcType=BIGINT},
create_persion = #{record.createPersion,jdbcType=VARCHAR},
update_persion = #{record.updatePersion,jdbcType=VARCHAR}
<if test="_parameter != null">
<include refid="Update_By_Example_Where_Clause" />
</if>
</update>
<update id="updateByPrimaryKeySelective" parameterType="io.dataease.base.domain.PanelDesign">
update panel_design
<set>
<if test="panelId != null">
panel_id = #{panelId,jdbcType=VARCHAR},
</if>
<if test="componentId != null">
component_id = #{componentId,jdbcType=VARCHAR},
</if>
<if test="componentStyle != null">
component_style = #{componentStyle,jdbcType=VARCHAR},
</if>
<if test="componentType != null">
component_type = #{componentType,jdbcType=VARCHAR},
</if>
<if test="componentDetails != null">
component_details = #{componentDetails,jdbcType=VARCHAR},
</if>
<if test="createTime != null">
create_time = #{createTime,jdbcType=BIGINT},
</if>
<if test="updateTime != null">
update_time = #{updateTime,jdbcType=BIGINT},
</if>
<if test="createPersion != null">
create_persion = #{createPersion,jdbcType=VARCHAR},
</if>
<if test="updatePersion != null">
update_persion = #{updatePersion,jdbcType=VARCHAR},
</if>
</set>
where id = #{id,jdbcType=VARCHAR}
</update>
<update id="updateByPrimaryKey" parameterType="io.dataease.base.domain.PanelDesign">
update panel_design
set panel_id = #{panelId,jdbcType=VARCHAR},
component_id = #{componentId,jdbcType=VARCHAR},
component_style = #{componentStyle,jdbcType=VARCHAR},
component_type = #{componentType,jdbcType=VARCHAR},
component_details = #{componentDetails,jdbcType=VARCHAR},
create_time = #{createTime,jdbcType=BIGINT},
update_time = #{updateTime,jdbcType=BIGINT},
create_persion = #{createPersion,jdbcType=VARCHAR},
update_persion = #{updatePersion,jdbcType=VARCHAR}
where id = #{id,jdbcType=VARCHAR}
</update>
</mapper>

6
backend/src/main/java/io/dataease/base/mapper/ext/ExtPanelDesignMapper.java Normal file
View File

@ -0,0 +1,6 @@
package io.dataease.base.mapper.ext;
public interface ExtPanelDesignMapper {
}

9
backend/src/main/java/io/dataease/base/mapper/ext/ExtPanelDesignMapper.xml Normal file
View File

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="io.dataease.base.mapper.ext.ExtPanelDesignMapper">
<resultMap id="BaseResultMapDTO" type="io.dataease.dto.panel.PanelDesignDTO" extends="io.dataease.base.mapper.PanelDesignMapper.BaseResultMap">
</resultMap>
</mapper>

4
backend/src/main/java/io/dataease/base/mapper/ext/ExtPanelGroupMapper.java
View File

@ -13,5 +13,7 @@ public interface ExtPanelGroupMapper {
//会级联删除pid 下的所有数据
int deleteCircle(@Param("pid") String pid);
PanelGroupDTO panelGroup(String id);
}
}

65
backend/src/main/java/io/dataease/base/mapper/ext/ExtPanelGroupMapper.xml
View File

@ -2,38 +2,43 @@
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="io.dataease.base.mapper.ext.ExtPanelGroupMapper">
<resultMap id="BaseResultMapDTO" type="io.dataease.dto.panel.PanelGroupDTO" extends="io.dataease.base.mapper.PanelGroupMapper.BaseResultMap">
<result column="label" jdbcType="VARCHAR" property="label"/>
</resultMap>
<resultMap id="BaseResultMapDTO" type="io.dataease.dto.panel.PanelGroupDTO"
extends="io.dataease.base.mapper.PanelGroupMapper.BaseResultMap">
<result column="label" jdbcType="VARCHAR" property="label"/>
</resultMap>
<select id="panelGroupList" resultMap="BaseResultMapDTO">
select panel_group.*,panel_group.name as label from panel_group
<where>
<if test="name != null">
and panel_group.name like CONCAT('%', #{name},'%')
</if>
<if test="nodeType != null">
and panel_group.node_type = #{nodeType}
</if>
<if test="panelType != null">
and panel_group.panel_type = #{panelType}
</if>
<if test="id != null">
and panel_group.id = #{id}
</if>
<if test="pid != null">
and panel_group.pid = #{pid}
</if>
<if test="level != null">
and panel_group.level = #{level}
</if>
</where>
<if test="sort != null">
order by ${sort}
</if>
<select id="panelGroup" resultMap="BaseResultMapDTO">
select panel_group.*,panel_group.name as label from panel_group where id =#{id}
</select>
<delete id="deleteCircle">
<select id="panelGroupList" resultMap="BaseResultMapDTO">
select panel_group.*,panel_group.name as label from panel_group
<where>
<if test="name != null">
and panel_group.name like CONCAT('%', #{name},'%')
</if>
<if test="nodeType != null">
and panel_group.node_type = #{nodeType}
</if>
<if test="panelType != null">
and panel_group.panel_type = #{panelType}
</if>
<if test="id != null">
and panel_group.id = #{id}
</if>
<if test="pid != null">
and panel_group.pid = #{pid}
</if>
<if test="level != null">
and panel_group.level = #{level}
</if>
</where>
<if test="sort != null">
order by ${sort}
</if>
</select>
<delete id="deleteCircle">
delete from panel_group where FIND_IN_SET(panel_group.id,GET_PANEL_GROUP_WITH_CHILDREN(#{pid}))
</delete>
</mapper>
</mapper>

7
backend/src/main/java/io/dataease/controller/CommonFilesController.java
View File

@ -17,6 +17,11 @@ public class CommonFilesController {
@GetMapping("/images/{imageId}")
public ResponseEntity<byte[]> image(@PathVariable("imageId") String imageId) {
return commonFilesService.getImageById(imageId);
return commonFilesService.getImageById(imageId,null);
}
@GetMapping("/images/{imageId}/{defaultImage}")
public ResponseEntity<byte[]> image(@PathVariable("imageId") String imageId,@PathVariable("defaultImage") String defaultImage) {
return commonFilesService.getImageById(imageId,defaultImage);
}
}

28
backend/src/main/java/io/dataease/controller/panel/PanelDesignController.java Normal file
View File

@ -0,0 +1,28 @@
package io.dataease.controller.panel;
import io.dataease.controller.request.panel.PanelGroupRequest;
import io.dataease.dto.panel.PanelGroupDTO;
import io.dataease.service.panel.PanelGroupService;
import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021-03-05
* Description:
*/
@RestController
@RequestMapping("panel/design")
public class PanelDesignController {
@Resource
private PanelGroupService panelGroupService;
// @GetMapping("/find/{id}")
// public void deleteCircle(@PathVariable String id) {
// panelGroupService.deleteCircle(id);
// }
}

6
backend/src/main/java/io/dataease/controller/panel/PanelGroupController.java
View File

@ -45,4 +45,10 @@ public class PanelGroupController {
public void deleteCircle(@PathVariable String id) {
panelGroupService.deleteCircle(id);
}
@GetMapping("/findOne/{id}")
public PanelGroupDTO findOne(@PathVariable String id) throws Exception {
return panelGroupService.findOne(id);
}
}

29
backend/src/main/java/io/dataease/dto/panel/PanelDesignDTO.java Normal file
View File

@ -0,0 +1,29 @@
package io.dataease.dto.panel;
import io.dataease.base.domain.PanelDesign;
import io.dataease.dto.chart.ChartViewDTO;
import lombok.Data;
/**
* Author: wangjiahao
* Date: 2021-03-17
* Description:
*/
@Data
public class PanelDesignDTO extends PanelDesign {
//当前视图是否在仪表盘中显示
private boolean keepFlag = false;
private ChartViewDTO chartView;
private Object systemComponent;
public PanelDesignDTO() {
}
public PanelDesignDTO(ChartViewDTO chartView) {
this.chartView=chartView;
}
}

9
backend/src/main/java/io/dataease/dto/panel/PanelGroupDTO.java
View File

@ -1,9 +1,10 @@
package io.dataease.dto.panel;
import io.dataease.base.domain.PanelGroup;
import io.dataease.dto.dataset.DataSetGroupDTO;
import io.dataease.dto.chart.ChartViewDTO;
import lombok.Data;
import java.util.ArrayList;
import java.util.List;
/**
@ -17,4 +18,10 @@ public class PanelGroupDTO extends PanelGroup {
private String label;
private List<PanelGroupDTO> children;
//仪表盘组件样式设计
private List<PanelDesignDTO> panelDesigns = new ArrayList<>();
private List<ChartViewDTO> viewsUsable = new ArrayList<>();
}

10
backend/src/main/java/io/dataease/service/CommonFilesService.java
View File

@ -1,6 +1,7 @@
package io.dataease.service;
import io.dataease.base.domain.FileMetadata;
import org.apache.commons.lang.StringUtils;
import org.springframework.http.HttpHeaders;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
@ -10,24 +11,27 @@ import javax.annotation.Resource;
@Service
public class CommonFilesService {
public final static String VIEW_DEFAULT_IMAGE="VIEW_DEFAULT_IMAGE";
@Resource
private FileService fileService;
public ResponseEntity<byte[]> getImageById(String imageId) {
public ResponseEntity<byte[]> getImageById(String imageId,String defaultImage) {
byte[] bytes = null;
MediaType contentType = MediaType.parseMediaType("application/octet-stream");
FileMetadata fileMetadata = fileService.copyFile(imageId);
if (fileMetadata == null&& StringUtils.isNotEmpty(defaultImage)) {
imageId = defaultImage;
fileMetadata = fileService.copyFile(imageId);
}
if (fileMetadata == null) {
return null;
}
bytes = fileService.loadFileAsBytes(imageId);
return ResponseEntity.ok()
.contentType(contentType)
.header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + fileMetadata.getName() + "\"")
.body(bytes);
}
}

59
backend/src/main/java/io/dataease/service/panel/PanelGroupService.java
View File

@ -1,17 +1,26 @@
package io.dataease.service.panel;
import io.dataease.base.domain.DatasetGroup;
import io.dataease.base.domain.*;
import io.dataease.base.mapper.ChartViewMapper;
import io.dataease.base.mapper.PanelDesignMapper;
import io.dataease.base.mapper.PanelGroupMapper;
import io.dataease.base.mapper.ext.ExtPanelGroupMapper;
import io.dataease.commons.utils.BeanUtils;
import io.dataease.controller.request.panel.PanelGroupRequest;
import io.dataease.dto.chart.ChartViewDTO;
import io.dataease.dto.dataset.DataSetGroupDTO;
import io.dataease.dto.panel.PanelDesignDTO;
import io.dataease.dto.panel.PanelGroupDTO;
import io.dataease.service.chart.ChartViewService;
import org.apache.commons.collections4.CollectionUtils;
import org.apache.commons.lang3.StringUtils;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Service;
import org.springframework.util.Assert;
import javax.annotation.Resource;
import java.util.ArrayList;
import java.util.List;
import java.util.Optional;
import java.util.UUID;
@ -24,10 +33,18 @@ import java.util.UUID;
@Service
public class PanelGroupService {
private Logger LOGGER = LoggerFactory.getLogger(this.getClass());
@Resource
private PanelGroupMapper panelGroupMapper;
@Resource
private ExtPanelGroupMapper extPanelGroupMapper;
@Resource
private PanelDesignMapper panelDesignMapper;
@Resource
private ChartViewService chartViewService;
@Resource
private ChartViewMapper chartViewMapper;
public List<PanelGroupDTO> tree(PanelGroupRequest panelGroupRequest) {
List<PanelGroupDTO> panelGroupDTOList = extPanelGroupMapper.panelGroupList(panelGroupRequest);
@ -69,4 +86,44 @@ public class PanelGroupService {
}
public PanelGroupDTO findOne(String panelId) throws Exception{
PanelGroupDTO panelGroupDTO = extPanelGroupMapper.panelGroup(panelId);
Assert.notNull(panelGroupDTO, "未查询到仪表盘信息");
PanelDesignExample panelDesignExample = new PanelDesignExample();
panelDesignExample.createCriteria().andPanelIdEqualTo(panelId);
List<PanelDesign> panelDesignList = panelDesignMapper.selectByExample(panelDesignExample);
if(CollectionUtils.isNotEmpty(panelDesignList)){
List<PanelDesignDTO> panelDesignDTOList = new ArrayList<>();
//TODO 加载所有视图和组件的数据
for(PanelDesign panelDesign:panelDesignList){
//TODO 获取view 视图数据
ChartViewDTO chartViewDTO = chartViewService.getData(panelDesign.getComponentId());
//TODO 获取systemComponent 系统组件数据（待开发）
PanelDesignDTO panelDesignDTO = new PanelDesignDTO(chartViewDTO);
BeanUtils.copyBean(panelDesignDTO,panelDesign);
panelDesignDTO.setKeepFlag(true);
panelDesignDTOList.add(panelDesignDTO);
}
panelGroupDTO.setPanelDesigns(panelDesignDTOList);
}
//获取所有可用的视图
panelGroupDTO.setViewsUsable(getUsableViews(panelId));
return panelGroupDTO;
}
public List<ChartViewDTO> getUsableViews(String panelId) throws Exception{
List<ChartViewDTO> chartViewDTOList = new ArrayList<>();
List<ChartView> allChartView = chartViewMapper.selectByExample(null);
Optional.ofNullable(allChartView).orElse(new ArrayList<>()).stream().forEach(chartView -> {
try {
chartViewDTOList.add(chartViewService.getData(chartView.getId()));
}catch (Exception e){
LOGGER.error("获取view详情出错："+chartView.getId(),e);
}
});
return chartViewDTOList;
}
}

3
frontend/package.json
View File

@ -34,7 +34,8 @@
"vue-router": "3.0.6",
"vuedraggable": "^2.24.3",
"vuex": "3.1.0",
"webpack": "^4.46.0"
"webpack": "^4.46.0",
"vue-uuid": "2.0.2"
},
"devDependencies": {
"@babel/core": "^7.4.0-0",

9
frontend/src/api/panel/panel.js
View File

@ -108,4 +108,11 @@ export function post(url, data) {
})
}
export default { loadTable, getScene, addGroup, delGroup, addTable, delTable, groupTree, defaultTree }
export function get(url) {
return request({
url: url,
method: 'get'
})
}
export default {post,get,groupTree, defaultTree }

41
frontend/src/components/vue-drag-resize-rotate/index.vue
View File

@ -69,7 +69,11 @@ export default {
replace: true,
name: 'VueDragResizeRotate',
props: {
viewId: {
preStyle: {
type: Object,
default: null
},
panelDesignId: {
type: String,
default: ''
},
@ -308,6 +312,8 @@ export default {
data: function() {
return {
styleInit:true,
styleCatch:{},
left: this.x,
top: this.y,
right: null,
@ -408,13 +414,21 @@ export default {
}
},
style() {
return {
transform: `translate(${this.left}px, ${this.top}px) rotate(${this.rotate}deg)`,
width: this.computedWidth,
height: this.computedHeight,
zIndex: this.zIndex,
...(this.dragging && this.disableUserSelect ? userSelectNone : userSelectAuto)
let newStyle ={};
if(this.styleInit && this.preStyle){
newStyle = this.preStyle;
}else{
newStyle ={
transform: `translate(${this.left}px, ${this.top}px) rotate(${this.rotate}deg)`,
width: this.computedWidth,
height: this.computedHeight,
zIndex: this.zIndex,
...(this.dragging && this.disableUserSelect ? userSelectNone : userSelectAuto)
};
}
this.styleInit = false;
this.$emit('newStyle', this.panelDesignId,newStyle);
return newStyle;
},
// 控制柄显示与否
actualHandles() {
@ -566,6 +580,14 @@ export default {
this.resetBoundsAndMouseState()
},
mounted: function() {
//f2c 页面初始化后对样式重新赋值
if(this.preStyle){
}
if (!this.enableNativeDrag) {
this.$el.ondragstart = () => false
}
@ -601,9 +623,8 @@ export default {
methods: {
removeView(){
debugger
console.log(this.viewId);
this.$emit('removeView',this.viewId)
// console.log(this.panelDesignId);
this.$emit('removeView',this.panelDesignId)
},
// 重置边界和鼠标状态
resetBoundsAndMouseState() {

4
frontend/src/main.js
View File

@ -30,6 +30,10 @@ import UmyUi from 'umy-ui'
import 'umy-ui/lib/theme-chalk/index.css'// 引入样式
Vue.use(UmyUi)
// 引入vue-UUID组件
import UUID from 'vue-uuid'
Vue.use(UUID)
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api

3
frontend/src/store/modules/panel.js
View File

@ -3,6 +3,7 @@ const getDefaultState = () => {
return {
panelName: '',
panelInfo:{
id:null,
name:''
}
}
@ -15,7 +16,6 @@ const mutations = {
state.panelName = panelName
},
setPanelInfo: (state, panelInfo) => {
debugger
state.panelInfo = panelInfo
}
}
@ -25,7 +25,6 @@ const actions = {
commit('setPanelName', panelName)
},
setPanelInfo({ commit }, panelInfo) {
debugger
commit('setPanelInfo', panelInfo)
}
}

19
frontend/src/views/chart/components/ChartComponent.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="Echarts" style="height: 100%;display: flex;margin-top: 10px;">
<div id="echart" style="width: 100%;height: 80vh;" />
<div :id="chartId" style="width: 100%;height: 100%;" />
</div>
</template>
@ -13,6 +13,10 @@ export default {
chart: {
type: Object,
required: true
},
chartId: {
type: String,
required: false
}
},
data() {
@ -22,15 +26,21 @@ export default {
},
watch: {
chart() {
debugger
this.drawEcharts()
},
resize() {
this.drawEcharts()
}
},
mounted() {
// 基于准备好的dom，初始化echarts实例
this.myChart = this.$echarts.init(document.getElementById('echart'))
this.myChart = this.$echarts.init(document.getElementById(this.chartId))
this.drawEcharts()
},
methods: {
drawEcharts() {
debugger
const chart = this.chart
let chart_option = {}
// todo type
@ -65,6 +75,11 @@ export default {
window.onresize = function() {
chart.resize()
}
},
chartResize() {
// 指定图表的配置项和数据
const chart = this.myChart
chart.resize()
}
}
}

25
frontend/src/views/panel/chart/chart.js
View File

@ -1,3 +1,7 @@
export const DEFAULT_COLOR_CASE = {
value: 'default',
colors: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
}
export const BASE_BAR = {
title: {
text: ''
@ -15,6 +19,23 @@ export const BASE_BAR = {
series: []
}
export default {
BASE_BAR
export const BASE_LINE = {
title: {
text: ''
},
tooltip: {},
legend: {
data: []
},
xAxis: {
data: []
},
yAxis: {
type: 'value'
},
series: []
}
export default {
BASE_BAR, BASE_LINE, DEFAULT_COLOR_CASE
}

77
frontend/src/views/panel/components/ChartComponent.vue Normal file
View File

@ -0,0 +1,77 @@
<template>
<div class="Echarts" style="height: 100%;display: flex;margin-top: 10px;">
<div id="echart" style="width: 100%;height: 80vh;" />
</div>
</template>
<script>
import { BASE_BAR, BASE_LINE } from '../chart/chart'
export default {
name: 'ChartComponent',
props: {
chart: {
type: Object,
required: true
}
},
data() {
return {
myChart: {}
}
},
watch: {
chart() {
debugger
this.drawEcharts()
}
},
mounted() {
// 基于准备好的dom，初始化echarts实例
this.myChart = this.$echarts.init(document.getElementById('echart'))
},
methods: {
drawEcharts() {
debugger
const chart = this.chart
let chart_option = {}
// todo type
if (chart.type === 'bar') {
chart_option = JSON.parse(JSON.stringify(BASE_BAR))
} else if (chart.type === 'line') {
chart_option = JSON.parse(JSON.stringify(BASE_LINE))
}
// console.log(chart_option);
// 处理data
if (chart.data) {
chart_option.title.text = chart.title
chart_option.xAxis.data = chart.data.x
chart.data.series.forEach(function(y) {
chart_option.legend.data.push(y.name)
chart_option.series.push(y)
})
}
// console.log(chart_option);
// 处理shape attr
if (chart.customAttr) {
if (chart.customAttr.color) {
chart_option.color = chart.customAttr.color.colors
}
}
this.myEcharts(chart_option)
},
myEcharts(option) {
// 指定图表的配置项和数据
const chart = this.myChart
setTimeout(chart.setOption(option, true), 500)
window.onresize = function() {
chart.resize()
}
}
}
}
</script>
<style scoped>
</style>

130
frontend/src/views/panel/components/ColorSelector.vue Normal file
View File

@ -0,0 +1,130 @@
<template>
<div>
<div style="width:100%;height: 32px;margin:0;padding:0 4px;border-radius: 4px;border: 1px solid #DCDFE6;display: flex;align-items: center;">
<el-popover
placement="right"
width="400"
trigger="click"
>
<el-col>
<el-form ref="colorForm" :model="colorForm" label-width="80px" size="mini">
<el-form-item :label="$t('chart.color_case')" class="form-item">
<el-select v-model="colorForm.colorCase" :placeholder="$t('chart.pls_slc_color_case')" size="mini" @change="changeColorCase">
<el-option v-for="option in colorCases" :key="option.value" :label="option.name" :value="option.value" style="display: flex;align-items: center;">
<div style="float: left">
<span v-for="(c,index) in option.colors" :key="index" :style="{width: '20px',height: '20px',float: 'left',backgroundColor: c}" />
</div>
<span style="margin-left: 4px;">{{ option.name }}</span>
</el-option>
</el-select>
</el-form-item>
</el-form>
</el-col>
<el-button slot="reference" size="mini" class="shape-item">{{ $t('chart.color') }}<i class="el-icon-setting el-icon--right" /></el-button>
</el-popover>
<!--todo other color attr-->
</div>
</div>
</template>
<script>
export default {
name: 'ColorSelector',
props: {
chart: {
type: Object,
required: true
}
},
data() {
return {
colorCases: [
{
name: this.$t('chart.color_default'),
value: 'default',
colors: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
},
{
name: this.$t('chart.color_retro'),
value: 'retro',
colors: ['#0780cf', '#765005', '#fa6d1d', '#0e2c82', '#b6b51f', '#da1f18', '#701866', '#f47a75', '#009db2']
},
{
name: this.$t('chart.color_elegant'),
value: 'elegant',
colors: ['#95a2ff', '#fa8080', '#ffc076', '#fae768', '#87e885', '#3cb9fc', '#73abf5', '#cb9bff', '#434348']
},
{
name: this.$t('chart.color_future'),
value: 'future',
colors: ['#63b2ee', '#76da91', '#f8cb7f', '#f89588', '#7cd6cf', '#9192ab', '#7898e1', '#efa666', '#eddd86']
},
{
name: this.$t('chart.color_gradual'),
value: 'gradual',
colors: ['#71ae46', '#96b744', '#c4cc38', '#ebe12a', '#eab026', '#e3852b', '#d85d2a', '#ce2626', '#ac2026']
},
{
name: this.$t('chart.color_simple'),
value: 'simple',
colors: ['#929fff', '#9de0ff', '#ffa897', '#af87fe', '#7dc3fe', '#bb60b2', '#433e7c', '#f47a75', '#009db2']
},
{
name: this.$t('chart.color_business'),
value: 'business',
colors: ['#194f97', '#555555', '#bd6b08', '#00686b', '#c82d31', '#625ba1', '#898989', '#9c9800', '#007f54']
},
{
name: this.$t('chart.color_gentle'),
value: 'gentle',
colors: ['#5b9bd5', '#ed7d31', '#70ad47', '#ffc000', '#4472c4', '#91d024', '#b235e6', '#02ae75', '#5b9bd5']
},
{
name: this.$t('chart.color_technology'),
value: 'technology',
colors: ['#05f8d6', '#0082fc', '#fdd845', '#22ed7c', '#09b0d3', '#1d27c9', '#f9e264', '#f47a75', '#009db2']
}
],
colorForm: {
colorCase: 'default'
}
}
},
watch: {
'chart': {
handler: function() {
const chart = JSON.parse(JSON.stringify(this.chart))
this.colorForm.colorCase = chart.customAttr.color.value
}
}
},
mounted() {
},
methods: {
changeColorCase() {
const that = this
const items = this.colorCases.filter(ele => {
return ele.value === that.colorForm.colorCase
})
this.$emit('onColorChange', {
value: items[0].value,
colors: items[0].colors
})
}
}
}
</script>
<style scoped lang="scss">
.shape-item{
padding: 6px;
border: none;
}
.form-item>>>.el-form-item__label{
font-size: 12px;
}
.el-select-dropdown__item{
padding: 0 20px;
}
span{font-size: 12px}
</style>

60
frontend/src/views/panel/components/DimensionItem.vue Normal file
View File

@ -0,0 +1,60 @@
<template>
<span>
<el-dropdown trigger="click" size="mini">
<span class="el-dropdown-link">
<el-tag size="small" class="item-axis">
{{ item.name }}<i class="el-icon-arrow-down el-icon--right" />
</el-tag>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-edit-outline">
item1
</el-dropdown-item>
<el-dropdown-item icon="el-icon-delete">
item2
</el-dropdown-item>
</el-dropdown-menu>
</span>
</el-dropdown>
</span>
</template>
<script>
export default {
name: 'DimensionItem',
props: {
item: {
type: Object,
required: true
}
},
data() {
return {}
},
mounted() {
},
methods: {}
}
</script>
<style scoped>
.item-axis {
padding: 1px 6px;
margin: 0 3px 2px 3px;
text-align: left;
height: 24px;
line-height: 22px;
display: inline-block;
border-radius: 4px;
box-sizing: border-box;
white-space: nowrap;
}
.item-axis:hover {
background-color: #fdfdfd;
cursor: pointer;
}
span {
font-size: 12px;
}
</style>

164
frontend/src/views/panel/components/QuotaItem.vue Normal file
View File

@ -0,0 +1,164 @@
<template>
<span>
<el-dropdown trigger="click" size="mini" @command="clickItem">
<span class="el-dropdown-link">
<el-tag size="small" class="item-axis">
{{ item.name }}<span v-if="item.summary" class="summary-span">{{ $t('chart.'+item.summary) }}</span><i class="el-icon-arrow-down el-icon--right" />
</el-tag>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-notebook-2">
<el-dropdown placement="right-start" size="mini" @command="summary">
<span class="el-dropdown-link">
{{ $t('chart.summary') }}<span class="summary-span">({{ $t('chart.'+item.summary) }})</span><i class="el-icon-arrow-right el-icon--right" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="beforeSummary('sum')">{{ $t('chart.sum') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSummary('avg')">{{ $t('chart.avg') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSummary('max')">{{ $t('chart.max') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSummary('min')">{{ $t('chart.min') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSummary('std')">{{ $t('chart.std') }}</el-dropdown-item>
<el-dropdown-item :command="beforeSummary('var_samp')">{{ $t('chart.var_samp') }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-s-grid">
<el-dropdown placement="right-start" size="mini" @command="quickCalc">
<span class="el-dropdown-link">
{{ $t('chart.quick_calc') }}<span class="summary-span">(test)</span><i class="el-icon-arrow-right el-icon--right" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="beforeQuickCalc('none')">test</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-edit-outline" divided :command="beforeClickItem('rename')">
<span>{{ $t('chart.show_name_set') }}</span>
</el-dropdown-item>
</el-dropdown-menu>
</span>
</el-dropdown>
<el-dialog :title="$t('chart.show_name_set')" :visible="renameItem" :show-close="false" width="30%">
<el-form ref="itemForm" :model="itemForm" :rules="itemFormRules">
<el-form-item :label="$t('commons.name')" prop="name">
<el-input v-model="itemForm.name" size="mini"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeRename()">{{ $t('chart.cancel') }}</el-button>
<el-button type="primary" size="mini" @click="saveRename(itemForm)">{{ $t('chart.confirm') }}</el-button>
</div>
</el-dialog>
</span>
</template>
<script>
export default {
name: 'QuotaItem',
props: {
item: {
type: Object,
required: true
}
},
data() {
return {
renameItem: false,
itemForm: {
name: ''
},
itemFormRules: {
name: [
{ required: true, message: this.$t('commons.input_content'), trigger: 'change' }
]
}
}
},
mounted() {
},
methods: {
summary(param) {
// console.log(param)
this.item.summary = param.type
this.$emit('onQuotaItemChange', this.item)
},
beforeSummary(type) {
return {
type: type
}
},
quickCalc(param) {
},
beforeQuickCalc(type) {
return {
type: type
}
},
clickItem(param) {
if (!param) {
return
}
switch (param.type) {
case 'rename':
this.showRename()
break
default:
break
}
},
beforeClickItem(type) {
return {
type: type
}
},
showRename() {
this.itemForm.name = this.item.name
this.renameItem = true
},
closeRename() {
this.renameItem = false
this.resetRename()
},
saveRename(param) {
this.item.name = param.name
this.$emit('onQuotaItemChange', this.item)
this.closeRename()
},
resetRename() {
this.itemForm = {
name: ''
}
}
}
}
</script>
<style scoped>
.item-axis {
padding: 1px 6px;
margin: 0 3px 2px 3px;
text-align: left;
height: 24px;
line-height: 22px;
display: inline-block;
border-radius: 4px;
box-sizing: border-box;
white-space: nowrap;
}
.item-axis:hover {
background-color: #fdfdfd;
cursor: pointer;
}
span {
font-size: 12px;
}
.summary-span{
margin-left: 4px;
color: #878d9f;;
}
</style>

371
frontend/src/views/panel/list/PanelViewShow.vue
View File

@ -5,9 +5,9 @@
<el-tabs v-model="ViewActiveName">
<!--视图展示操作-->
<el-tab-pane name="Views" class="view-list-thumbnails-outline">
<span slot="label"><i class="el-icon-s-data" />视图</span>
<span slot="label"><i class="el-icon-s-data"/>视图</span>
<draggable
v-model="thumbnails"
v-model="panelDetails.viewsUsable"
:options="{group:{name: 'itxst',pull:'clone'},sort: true}"
animation="300"
:move="onMove"
@ -15,9 +15,9 @@
@end="end1"
>
<transition-group>
<div v-for="item in thumbnails" :key="item.name" @dblclick="panelViewAdd(item)">
<div v-for="item in panelDetails.viewsUsable" :key="item.name" @dblclick="panelViewAdd(item)">
<span style="color: gray">{{ item.name }}</span>
<img class="view-list-thumbnails" :src="'/common-files/images/'+item.id" alt="">
<img class="view-list-thumbnails" :src="'/common-files/images/'+item.id+'/VIEW_DEFAULT_IMAGE'" alt="">
</div>
</transition-group>
</draggable>
@ -25,7 +25,7 @@
<!--通用组件操作-->
<el-tab-pane name="PublicTools">
<span slot="label"><i class="el-icon-s-grid" />组件</span>
<span slot="label"><i class="el-icon-s-grid"/>组件</span>
开发中...
</el-tab-pane>
</el-tabs>
@ -39,34 +39,24 @@
<el-button size="mini">
背景图
</el-button>
<el-button type="primary" size="mini" @click="save">
<el-button type="primary" size="mini" @click="preViewShow">
预览
</el-button>
</span>
</el-row>
<el-row class="panel-design-show">
<div class="container" style="overflow-y: auto">
<div class="container" :style="panelDetails.gridStyle">
<vue-drag-resize-rotate v-for="panelDesign in panelDetails.panelDesigns" v-show="panelDesign.keepFlag"
:key="panelDesign.id"
:panel-design-id="panelDesign.id" :parent="true" @newStyle="newStyle"
@removeView="removeView">
<!--视图显示 panelDesign.componentType==='view'-->
<chart-component v-if="panelDesign.componentType==='view'" :ref="panelDesign.id" :chart-id="panelDesign.id" :chart="panelDesign.chartView"/>
<div :style="gridStyle">
<!-- <draggable-->
<!-- v-model="thumbnailsTmp"-->
<!-- :options="{group:{name: 'itxst',pull:'clone'},sort: true}"-->
<!-- animation="300"-->
<!-- :move="onMove"-->
<!-- style="height: 100%;overflow:auto"-->
<!-- @end="end1"-->
<!-- >-->
<vdrr v-for="item in thumbnailsTmp" v-show="item.keepFlag" :key="item.name" :view-id="item.id" :parent="true" @newStyle="newStyle" @removeView="removeView">
<img class="view-list-thumbnails" :src="'/common-files/images/'+item.id" alt="">
</vdrr>
<!-- </draggable>-->
<!--组件显示（待开发）-->
</div>
</vue-drag-resize-rotate>
</div>
<!-- <div class="Echarts" style="height: 100%;display: flex;margin-top: 10px;">-->
<!-- <div id="echart" style="width: 100%;height: 80vh;"/>-->
<!-- </div>-->
</el-row>
</el-col>
@ -75,239 +65,124 @@
</template>
<script>
import { post } from '@/api/dataset/dataset'
import draggable from 'vuedraggable'
import { BASE_BAR } from '../chart/chart'
import {post, get} from '@/api/panel/panel'
import draggable from 'vuedraggable'
import ChartComponent from '../../chart/components/ChartComponent'
import VueDragResizeRotate from '@/components/vue-drag-resize-rotate'
import { uuid } from 'vue-uuid';
export default {
name: 'PanelViewShow',
components: { draggable },
data() {
return {
gridStyle: {
position: 'relative',
height: '2000px',
width: '2000px',
backgroundColor: '#808080',
background: 'linear-gradient(-90deg, rgba(0, 0, 0, .1) 1px, transparent 1px), linear-gradient(rgba(0, 0, 0, .1) 1px, transparent 1px)',
backgroundSize: '20px 20px, 20px 20px'
},
ViewActiveName: 'Views',
table: {},
thumbnailsTmp: [
{ id: 'b4e3fd39-1424-4f22-bbac-07885829fb59', name: 'TEST1', keepFlag: true, style: '' },
{ id: 'bf91a1dc-10c1-4383-87ae-9ab1d6e57918', name: 'TEST2', keepFlag: true, style: '' }
],
thumbnails: [
{ id: 'e70d7955-44dc-4158-9002-7b48ed0d5d80', name: 'TEST1' },
{ id: 'bf91a1dc-10c1-4383-87ae-9ab1d6e57918', name: 'TEST2' },
{ id: 'aebc8346-c3f2-44ad-97d3-1e36a10dd0fa', name: 'TEST3' },
{ id: 'b4e3fd39-1424-4f22-bbac-07885829fb59', name: 'TEST4' }
],
quota: [],
view: {
xaxis: [],
yaxis: [],
show: true,
type: 'bar',
title: ''
},
// 定义要被拖拽对象的数组
arr1: [
{ id: 1, name: 'id' },
{ id: 2, name: '名称' },
{ id: 3, name: '类型' },
{ id: 5, name: '状态' },
{ id: 4, name: '指标指标指标' }
],
arr2: [
{ id: 11, name: '容量' }
],
moveId: -1
}
},
computed: {
panelInfo() {
return this.$store.state.panel.panelInfo
}
export default {
name: 'PanelViewShow',
components: {draggable, ChartComponent, VueDragResizeRotate},
data() {
return {
panelDetails: {
viewsUsable: [],
panelDesigns: [],
gridStyle: null
},
gridStyleDefault: {
position: 'relative',
height: '100%',
width: '100%',
backgroundColor: '#808080',
background: 'linear-gradient(-90deg, rgba(0, 0, 0, .1) 1px, transparent 1px), linear-gradient(rgba(0, 0, 0, .1) 1px, transparent 1px)',
backgroundSize: '20px 20px, 20px 20px'
},
ViewActiveName: 'Views'
}
},
computed: {
panelInfo() {
return this.$store.state.panel.panelInfo
}
},
watch: {
panelInfo(newVal, oldVal) {
this.panelDesign(newVal.id);
}
},
created() {
// this.get(this.$store.state.chart.viewId);
},
mounted() {
let panelId = this.$store.state.panel.panelInfo.id;
if (panelId) {
this.panelDesign(panelId);
}
},
activated() {
},
methods: {
//加载公共组件
},
watch: {},
created() {
// this.get(this.$store.state.chart.viewId);
},
mounted() {
// this.get(this.$store.state.chart.viewId);
this.getData(this.$store.state.chart.viewId)
// this.myEcharts();
},
activated() {
},
methods: {
panelViewAdd(item) {
const pushItem = {
id: item.id,
name: item.name,
keepFlag: true
}
debugger
this.thumbnailsTmp.push(pushItem)
console.log(this.thumbnailsTmp)
},
removeView(viewId) {
this.thumbnailsTmp.forEach(function(item, index) {
if (item.id === viewId) {
item.keepFlag = false
}
})
},
newStyle(viewId, newStyleInfo) {
console.log(viewId)
console.log(JSON.stringify(newStyleInfo))
},
initTableData(id) {
if (id != null) {
post('/dataset/table/get/' + id, null).then(response => {
this.table = response.data
this.initTableField(id)
})
}
},
initTableField(id) {
post('/dataset/table/getFieldsFromDE', this.table).then(response => {
this.thumbnails = response.data.thumbnails
this.quota = response.data.quota
})
},
click1(item) {
// console.log(item);
const c = this.view.xaxis.filter(function(ele) {
return ele.id === item.id
})
// console.log(c);
if (c && c.length === 0) {
this.view.xaxis.push(item)
}
},
click2(item) {
// console.log(item);
const c = this.view.yaxis.filter(function(ele) {
return ele.id === item.id
})
// console.log(c);
if (c && c.length === 0) {
this.view.yaxis.push(item)
}
},
clear1(index) {
this.view.xaxis.splice(index, 1)
},
clear2(index) {
this.view.yaxis.splice(index, 1)
},
get(id) {
if (id) {
post('/chart/view/get/' + id, null).then(response => {
this.view = response.data
this.view.xaxis = this.view.xaxis ? JSON.parse(this.view.xaxis) : []
this.view.yaxis = this.view.yaxis ? JSON.parse(this.view.yaxis) : []
})
} else {
this.view = {}
}
},
save() {
const view = JSON.parse(JSON.stringify(this.view))
view.id = this.view.id
view.sceneId = this.sceneId
view.name = this.table.name
view.tableId = this.$store.state.chart.tableId
view.xaxis = JSON.stringify(view.xaxis)
view.yaxis = JSON.stringify(view.yaxis)
post('/chart/view/save', view).then(response => {
// this.get(response.data.id);
this.getData(response.data.id)
this.$store.dispatch('chart/setChartSceneData', null)
this.$store.dispatch('chart/setChartSceneData', this.sceneId)
})
},
getData(id) {
if (id) {
post('/chart/view/getData/' + id, null).then(response => {
this.view = response.data
this.view.xaxis = this.view.xaxis ? JSON.parse(this.view.xaxis) : []
this.view.yaxis = this.view.yaxis ? JSON.parse(this.view.yaxis) : []
const chart = response.data
const chart_option = JSON.parse(JSON.stringify(BASE_BAR))
// console.log(chart_option);
if (chart.data) {
chart_option.title.text = chart.title
chart_option.xAxis.data = chart.data.x
chart.data.series.forEach(function(y) {
chart_option.legend.data.push(y.name)
chart_option.series.push(y)
})
//加载panel design
panelDesign(panelId) {
get('panel/group/findOne/' + panelId).then(res => {
let panelDetailsInfo = res.data;
if (panelDetailsInfo) {
this.panelDetails = panelDetailsInfo;
}
if (!panelDetailsInfo.gridStyle) {
this.panelDetails.gridStyle = this.gridStyleDefault;
}
});
},
panelViewAdd(view) {
let panelDesigns = this.panelDetails.panelDesigns;
this.panelDetails.viewsUsable.forEach(function (item, index) {
if (item.id === view.id) {
let newComponent = {
id: uuid.v1(),
keepFlag : true,
chartView: item,
componentType: 'view'
}
panelDesigns.push(newComponent)
}
});
},
removeView(panelDesignId) {
this.panelDetails.panelDesigns.forEach(function (panelDesign, index) {
if (panelDesign.id === panelDesignId) {
panelDesign.keepFlag = false
}
// console.log(chart_option);
this.myEcharts(chart_option)
})
} else {
this.view = {}
}
},
},
newStyle(viewId, newStyleInfo) {
this.$nextTick(() => {
this.$refs[viewId][0].chartResize()
})
// 左边往右边拖动时的事件
end1(e) {
// console.log(e)
// var that = this;
// var items = this.arr2.filter(function (m) {
// return m.id == that.moveId
// })
// //如果左边
// if (items.length < 2) return;
// this.arr2.splice(e.newDraggableIndex, 1)
},
// 右边往左边拖动时的事件
end2(e) {
// console.log(e)
// var that = this;
// var items = this.yAxisData.filter(function (m) {
// return m.id == that.moveId
// })
// //如果左边
// if (items.length < 2) return;
// this.yAxisData.splice(e.newDraggableIndex, 1)
},
end3(e) {
console.log(viewId)
console.log(JSON.stringify(newStyleInfo))
},
},
end4(e) {
// 左边往右边拖动时的事件
start1(e) {
console.log(e)
},
end1(e) {
console.log(e)
},
// 右边往左边拖动时的事件
start2(e) {
console.log(e)
},
end2(e) {
console.log(e)
},
// move回调方法
onMove(e, originalEvent) {
console.log(e)
return true
},
preViewShow(){
},
// move回调方法
onMove(e, originalEvent) {
console.log(e)
// this.moveId = e.relatedContext.element.id;
// //不允许停靠
// if (e.relatedContext.element.id == 1) return false;
// //不允许拖拽
// if (e.draggedContext.element.id == 4) return false;
// if (e.draggedContext.element.id == 11) return false;
return true
},
myEcharts(option) {
// 基于准备好的dom，初始化echarts实例
var myChart = this.$echarts.init(document.getElementById('echart'))
// 指定图表的配置项和数据
setTimeout(myChart.setOption(option, true), 500)
window.onresize = function() {
myChart.resize()
}
}
}
}
</script>
<style scoped>