qianlishi 3 years ago
commit 87ac9151d1

@ -38,23 +38,6 @@
<artifactId>spring-cloud-context</artifactId> <artifactId>spring-cloud-context</artifactId>
</dependency> </dependency>
<!--模板引擎-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<!-- <dependency>-->
<!-- <groupId>com.anjiplus.template.gaea</groupId>-->
<!-- <artifactId>template-gaea-generator</artifactId>-->
<!-- <exclusions>-->
<!-- <exclusion>-->
<!-- <groupId>org.springframework.boot</groupId>-->
<!-- <artifactId>spring-boot-starter-data-redis</artifactId>-->
<!-- </exclusion>-->
<!-- </exclusions>-->
<!-- </dependency>-->
<dependency> <dependency>
<groupId>com.baomidou</groupId> <groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId> <artifactId>mybatis-plus-boot-starter</artifactId>
@ -98,31 +81,16 @@
</dependency> </dependency>
<dependency> <dependency>
<groupId>com.alibaba</groupId> <groupId>org.apache.httpcomponents</groupId>
<artifactId>druid</artifactId> <artifactId>httpclient</artifactId>
<version>1.1.22</version> <version>4.5.2</version>
</dependency> </dependency>
<!--kudu impala驱动-->
<dependency> <dependency>
<groupId>owinfo</groupId> <groupId>org.apache.httpcomponents</groupId>
<artifactId>impalajdbc41</artifactId> <artifactId>httpcore</artifactId>
<version>1.0.0</version> <version>4.4.5</version>
<scope>system</scope>
<systemPath>${project.basedir}/src/main/resources/lib/ImpalaJDBC41.jar</systemPath>
</dependency>
<dependency>
<groupId>org.apache.hive</groupId>
<artifactId>hive-jdbc</artifactId>
<version>1.2.1</version>
<exclusions>
<exclusion>
<groupId>org.eclipse.jetty.aggregate</groupId>
<artifactId>jetty-all</artifactId>
</exclusion>
</exclusions>
</dependency> </dependency>
</dependencies> </dependencies>

@ -1,15 +1,12 @@
package com.anjiplus.template.gaea.business.modules.report.service.impl; package com.anjiplus.template.gaea.business.modules.report.service.impl;
import com.anji.plus.gaea.constant.BaseOperationEnum;
import com.anji.plus.gaea.curd.mapper.GaeaBaseMapper; import com.anji.plus.gaea.curd.mapper.GaeaBaseMapper;
import com.anji.plus.gaea.exception.BusinessException;
import com.anjiplus.template.gaea.business.modules.report.controller.dto.ReportDto; import com.anjiplus.template.gaea.business.modules.report.controller.dto.ReportDto;
import com.anjiplus.template.gaea.business.modules.report.dao.ReportMapper; import com.anjiplus.template.gaea.business.modules.report.dao.ReportMapper;
import com.anjiplus.template.gaea.business.modules.report.dao.entity.Report; import com.anjiplus.template.gaea.business.modules.report.dao.entity.Report;
import com.anjiplus.template.gaea.business.modules.report.service.ReportService; import com.anjiplus.template.gaea.business.modules.report.service.ReportService;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.ReportExcelMapper;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service; import org.springframework.stereotype.Service;
@ -22,13 +19,9 @@ import org.springframework.stereotype.Service;
@Service @Service
public class ReportServiceImpl implements ReportService { public class ReportServiceImpl implements ReportService {
private Logger logger = LoggerFactory.getLogger(this.getClass());
@Autowired @Autowired
private ReportMapper reportMapper; private ReportMapper reportMapper;
@Autowired
private ReportExcelMapper reportExcelMapper;
@Override @Override
public GaeaBaseMapper<Report> getMapper() { public GaeaBaseMapper<Report> getMapper() {
return reportMapper; return reportMapper;
@ -38,8 +31,11 @@ public class ReportServiceImpl implements ReportService {
@Override @Override
public void delReport(ReportDto reportDto) { public void delReport(ReportDto reportDto) {
deleteById(reportDto.getId()); deleteById(reportDto.getId());
QueryWrapper<ReportExcel> queryWrapper = new QueryWrapper<>(); }
queryWrapper.eq("report_code" , reportDto.getReportCode());
reportExcelMapper.delete(queryWrapper); @Override
public void processBeforeOperation(Report entity, BaseOperationEnum operationEnum) throws BusinessException {
//目前只有大屏一种类型
entity.setReportType("report_screen");
} }
} }

@ -1,97 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.controller;
import com.anji.plus.gaea.annotation.Permission;
import com.anji.plus.gaea.annotation.log.GaeaAuditLog;
import com.anji.plus.gaea.bean.ResponseBean;
import com.anji.plus.gaea.code.ResponseCode;
import com.anji.plus.gaea.curd.controller.GaeaBaseController;
import com.anji.plus.gaea.curd.service.GaeaBaseService;
import com.anjiplus.template.gaea.business.modules.reportexcel.controller.dto.ReportExcelDto;
import com.anjiplus.template.gaea.business.modules.reportexcel.controller.param.ReportExcelParam;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel;
import com.anjiplus.template.gaea.business.modules.reportexcel.service.ReportExcelService;
import io.swagger.annotations.Api;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
/**
* @author chenkening
* @date 2021/4/13 15:12
*/
@RestController
@Api(tags = "报表表格管理")
@RequestMapping("/reportExcel")
public class ReportExcelController extends GaeaBaseController<ReportExcelParam, ReportExcel, ReportExcelDto> {
@Autowired
private ReportExcelService reportExcelService;
@Override
public GaeaBaseService<ReportExcelParam, ReportExcel> getService() {
return reportExcelService;
}
@Override
public ReportExcel getEntity() {
return new ReportExcel();
}
@Override
public ReportExcelDto getDTO() {
return new ReportExcelDto();
}
@GetMapping("/detailByReportCode/{reportCode}")
@Permission(
code = "DETAIL",
name = "详情"
)
@GaeaAuditLog(
pageTitle = "详情"
)
public ResponseBean detailByReportCode(@PathVariable String reportCode) {
ReportExcelDto reportExcelDto = reportExcelService.detailByReportCode(reportCode);
return ResponseBean.builder().data(reportExcelDto).build();
}
@PostMapping("/preview")
@Permission(
code = "DETAIL",
name = "预览"
)
@GaeaAuditLog(
pageTitle = "预览"
)
public ResponseBean preview(@RequestBody ReportExcelDto reportExcelDto) {
ReportExcelDto result = reportExcelService.preview(reportExcelDto);
return ResponseBean.builder().data(result).build();
}
@PostMapping("/exportExcel")
@Permission(
code = "IMPORT",
name = "导出"
)
@GaeaAuditLog(
pageTitle = "报表导出"
)
public ResponseBean exportExcel(@RequestBody ReportExcelDto reportExcelDto) {
return ResponseBean.builder().code(ResponseCode.SUCCESS_CODE)
.data(reportExcelService.exportExcel(reportExcelDto))
.message("导出成功,请稍后在下载中心查看").build();
}
// @PostMapping("/exportPdf")
// public ResponseBean exportPdf(@RequestBody ReportExcelDto reportExcelDto) {
// reportExcelService.exportPdf(reportExcelDto);
// return ResponseBean.builder().code(ResponseCode.SUCCESS_CODE)
// .build();
// }
}

@ -1,43 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.controller.dto;
import com.anji.plus.gaea.curd.dto.GaeaBaseDTO;
import lombok.Data;
import java.io.Serializable;
/**
* @author chenkening
* @date 2021/4/13 15:12
*/
@Data
public class ReportExcelDto extends GaeaBaseDTO implements Serializable {
/** 报表名称 */
private String reportName;
/** 报表编码 */
private String reportCode;
/**数据集编码,以|分割*/
private String setCodes;
/** 分组 */
private String reportGroup;
/** 数据集查询参数 */
private String setParam;
/** 报表json字符串 */
private String jsonStr;
/** 报表类型 */
private String reportType;
/** 数据总计 */
private long total;
/**导出类型*/
private String exportType;
}

@ -1,18 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.controller.param;
import com.anji.plus.gaea.curd.params.PageParam;
import lombok.Data;
import java.io.Serializable;
/**
* @author chenkening
* @date 2021/4/13 15:12
*/
@Data
public class ReportExcelParam extends PageParam implements Serializable{
}

@ -1,11 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.dao;
import com.anji.plus.gaea.curd.mapper.GaeaBaseMapper;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel;
/**
* @author chenkening
* @date 2021/4/13 15:11
*/
public interface ReportExcelMapper extends GaeaBaseMapper<ReportExcel> {
}

@ -1,33 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity;
import com.anji.plus.gaea.curd.entity.GaeaBaseEntity;
import com.baomidou.mybatisplus.annotation.TableName;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;
/**
* @author chenkening
* @date 2021/4/13 15:11
*/
@TableName(value="gaea_report_excel")
@Data
public class ReportExcel extends GaeaBaseEntity {
@ApiModelProperty(value = "报表编码")
private String reportCode;
@ApiModelProperty(value = "数据集编码,以|分割")
private String setCodes;
@ApiModelProperty(value = "数据集查询参数")
private String setParam;
@ApiModelProperty(value = "报表json字符串")
private String jsonStr;
@ApiModelProperty(value = "0--已禁用 1--已启用 DIC_NAME=ENABLE_FLAG")
private Integer enableFlag;
@ApiModelProperty(value = "0--未删除 1--已删除 DIC_NAME=DELETE_FLAG")
private Integer deleteFlag;
}

@ -1,39 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.service;
import com.anji.plus.gaea.curd.service.GaeaBaseService;
import com.anjiplus.template.gaea.business.modules.reportexcel.controller.dto.ReportExcelDto;
import com.anjiplus.template.gaea.business.modules.reportexcel.controller.param.ReportExcelParam;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel;
/**
* TODO
*
* @author chenkening
* @date 2021/4/13 15:14
*/
public interface ReportExcelService extends GaeaBaseService<ReportExcelParam, ReportExcel> {
/**
*
* @param reportCode
* @return
*/
ReportExcelDto detailByReportCode(String reportCode);
/**
*
* @param reportExcelDto
* @return
*/
ReportExcelDto preview(ReportExcelDto reportExcelDto);
/**
* excel
* @param reportExcelDto
* @return
*/
Boolean exportExcel(ReportExcelDto reportExcelDto);
// Boolean exportPdf(ReportExcelDto reportExcelDto);
}

@ -1,146 +0,0 @@
package com.anjiplus.template.gaea.business.modules.reportexcel.service.impl;
import com.alibaba.fastjson.JSONObject;
import com.anji.plus.gaea.constant.BaseOperationEnum;
import com.anji.plus.gaea.curd.mapper.GaeaBaseMapper;
import com.anji.plus.gaea.exception.BusinessException;
import com.anji.plus.gaea.export.enums.ExportTypeEnum;
import com.anji.plus.gaea.export.utils.ExportUtil;
import com.anji.plus.gaea.export.vo.ExportOperation;
import com.anji.plus.gaea.holder.UserContentHolder;
import com.anji.plus.gaea.utils.GaeaAssert;
import com.anji.plus.gaea.utils.GaeaBeanUtils;
import com.anjiplus.template.gaea.business.code.ResponseCode;
import com.anjiplus.template.gaea.business.modules.report.dao.ReportMapper;
import com.anjiplus.template.gaea.business.modules.report.dao.entity.Report;
import com.anjiplus.template.gaea.business.modules.reportexcel.controller.dto.ReportExcelDto;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.ReportExcelMapper;
import com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel;
import com.anjiplus.template.gaea.business.modules.reportexcel.service.ReportExcelService;
import com.anjiplus.template.gaea.business.modules.reportexcel.util.ReportUtil;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import org.apache.commons.lang3.StringUtils;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.scheduling.concurrent.ThreadPoolTaskExecutor;
import org.springframework.stereotype.Service;
import java.time.LocalDateTime;
/**
* TODO
*
* @author chenkening
* @date 2021/4/13 15:14
*/
@Service
public class ReportExcelServiceImpl implements ReportExcelService {
private Logger logger = LoggerFactory.getLogger(this.getClass());
@Autowired
private ReportExcelMapper reportExcelMapper;
@Autowired
private ThreadPoolTaskExecutor threadPoolExportExecutor;
@Autowired
private ReportMapper reportMapper;
@Value("${file.dist-path:''}")
private String dictPath;
@Autowired
private ReportUtil reportUtil;
@Override
public GaeaBaseMapper<ReportExcel> getMapper() {
return reportExcelMapper;
}
@Override
public ReportExcelDto detailByReportCode(String reportCode) {
QueryWrapper<ReportExcel> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("report_code" , reportCode);
ReportExcel reportExcel = reportExcelMapper.selectOne(queryWrapper);
if(reportExcel != null){
ReportExcelDto dto = new ReportExcelDto();
BeanUtils.copyProperties(reportExcel , dto);
return dto;
}
return null;
}
/**
*
*
* @param entity
* @param operationEnum
* @throws BusinessException
*/
@Override
public void processBeforeOperation(ReportExcel entity, BaseOperationEnum operationEnum) throws BusinessException {
if (operationEnum.equals(BaseOperationEnum.INSERT)) {
String reportCode = entity.getReportCode();
ReportExcel report = this.selectOne("report_code", reportCode);
if (null != report) {
this.deleteById(report.getId());
}
}
}
/**
*
*/
@Override
public ReportExcelDto preview(ReportExcelDto reportExcelDto) {
// 根据id查询 报表详情
ReportExcel reportExcel = selectOne("report_code", reportExcelDto.getReportCode());
QueryWrapper<Report> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("report_code" , reportExcelDto.getReportCode());
Report report = reportMapper.selectOne(queryWrapper);
GaeaAssert.notNull(reportExcel, ResponseCode.RULE_CONTENT_NOT_EXIST, "reportExcel");
String setParam = reportExcelDto.getSetParam();
GaeaBeanUtils.copyAndFormatter(reportExcel , reportExcelDto);
if(StringUtils.isNotBlank(setParam)){
reportExcelDto.setSetParam(setParam);
}
reportExcelDto.setReportName(report.getReportName());
JSONObject jsonObject = reportUtil.reportParse(reportExcelDto);
reportExcelDto.setJsonStr(JSONObject.toJSONString(jsonObject));
reportExcelDto.setTotal(jsonObject.getJSONObject("rows").size());
return reportExcelDto;
}
@Override
public Boolean exportExcel(ReportExcelDto reportExcelDto) {
ExportOperation exportOperation = new ExportOperation();
//指明导出数据查询到结果开始时间
exportOperation.setResultStartTime(LocalDateTime.now());
ReportExcelDto result = preview(reportExcelDto);
//指明导出数据查询到结果结束时间
exportOperation.setResultEndTime(LocalDateTime.now());
//指明导出数据查询到结果条数
exportOperation.setResultSize(result.getTotal());
//指明采用什么模式导出
exportOperation.setExportType(StringUtils.isBlank(reportExcelDto.getExportType())
? ExportTypeEnum.GAEA_TEMPLATE_EXCEL.getCodeValue() : reportExcelDto.getExportType());
//设置导出的文件名
exportOperation.setFileTitle(result.getReportName());
//设置导出的文件存放目录
exportOperation.setFilePath(dictPath);
//设置导出的数据jsonStr
exportOperation.setJsonStr(result.getJsonStr());
//保存当前操作人
exportOperation.setCreaterUsername(UserContentHolder.getContext().getUsername());
//调用盖亚组件实现导出文件
threadPoolExportExecutor.execute(() -> {
ExportUtil.getInstance().exportByFilePathSimple(exportOperation, null);
});
return true;
}
}

@ -1,22 +0,0 @@
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.anjiplus.template.gaea.business.modules.reportexcel.dao.ReportExcelMapper">
<resultMap type="com.anjiplus.template.gaea.business.modules.reportexcel.dao.entity.ReportExcel" id="ReportMap">
<!--jdbcType="{column.columnType}"-->
<result property="id" column="id" />
<result property="reportCode" column="report_code" />
<result property="setCods" column="set_codes" />
<result property="setParam" column="set_param" />
<result property="jsonStr" column="json_str" />
<result property="enableFlag" column="enable_flag" />
<result property="deleteFlag" column="delete_flag" />
<result property="createBy" column="create_by" />
<result property="createTime" column="create_time" />
<result property="updateBy" column="update_by" />
<result property="updateTime" column="update_time" />
<result property="version" column="version" />
</resultMap>
</mapper>

@ -4,6 +4,6 @@ const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, { module.exports = merge(prodEnv, {
NODE_ENV: '"development"', NODE_ENV: '"development"',
// BASE_API: '"http://127.0.0.1:9095"' BASE_API: '"http://127.0.0.1:9095"'
BASE_API: '"http://10.108.26.197:9095"' // BASE_API: '"http://10.108.26.197:9095"'
}) })

@ -17,13 +17,10 @@ service.interceptors.request.use(
config => { config => {
// 在发送请求之前做些什么 // 在发送请求之前做些什么
var token = getItem('token'); var token = getItem('token');
// config = signUtil.sign(token, deepClone(config));
console.log(config, 'config')
return config return config
}, },
error => { error => {
// Do something with request error // Do something with request error
console.log(error) // for debug
Promise.reject(error) Promise.reject(error)
} }
) )
@ -35,6 +32,7 @@ service.interceptors.response.use(
if (res.code == 200) { if (res.code == 200) {
return res return res
} }
else if (res.code == '50014') { else if (res.code == '50014') {
//登录超时或被登出,弹确认框,用户确认后,跳转到登录页面 //登录超时或被登出,弹确认框,用户确认后,跳转到登录页面
MessageBox({ MessageBox({
@ -45,7 +43,6 @@ service.interceptors.response.use(
sessionStorage.clear(); sessionStorage.clear();
localStorage.clear(); localStorage.clear();
delItem('token') delItem('token')
// location.reload();
window.location.href = "/"; window.location.href = "/";
}).catch(err => { }).catch(err => {
}) })

@ -98,7 +98,7 @@ export const constantRouterMap = [
// ] // ]
// }, // },
{ path: '/404', component: () => import('@/views/404'), hidden: true }, { path: '/404', component: () => import('@/views/404'), hidden: true },
{ path: '*', redirect: '/index', hidden: true }, { path: '*', redirect: '/login', hidden: true },
] ]
export default new Router({ export default new Router({

@ -2,7 +2,6 @@ import axios from 'axios'
import { Message, MessageBox } from 'element-ui' import { Message, MessageBox } from 'element-ui'
import store from '../store' import store from '../store'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
// 创建axios实例 // 创建axios实例
const service = axios.create({ const service = axios.create({
baseURL: process.env.BASE_API, // api 的 base_url baseURL: process.env.BASE_API, // api 的 base_url
@ -17,7 +16,6 @@ service.interceptors.request.use(
}, },
error => { error => {
// Do something with request error // Do something with request error
console.log(error) // for debug
Promise.reject(error) Promise.reject(error)
} }
) )
@ -29,36 +27,37 @@ service.interceptors.response.use(
* code为非20000是抛错 可结合自己业务进行修改 * code为非20000是抛错 可结合自己业务进行修改
*/ */
const res = response.data const res = response.data
if (res.code !== '200') { // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
if (res.code == '50008' || res.code == '50012' || res.code == '50014') {
MessageBox.confirm(
'你已被登出,可以取消继续留在该页面,或者重新登录',
'重新登录',
{
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// store.dispatch('FedLogOut').then(() => {
// // location.reload() // 为了重新实例化vue-router对象 避免bug
// window.location.href = "/";
// })
location.reload();
window.location.href = "/";
})
}
else if (res.code !== '200') {
Message({ Message({
message: res.message, message: res.message,
type: 'error', type: 'error',
duration: 5 * 1000 duration: 5 * 1000
}) })
// 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
MessageBox.confirm(
'你已被登出,可以取消继续留在该页面,或者重新登录',
'确定登出',
{
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
store.dispatch('FedLogOut').then(() => {
location.reload() // 为了重新实例化vue-router对象 避免bug
})
})
}
return Promise.reject('error') return Promise.reject('error')
} else { } else {
return response.data return response.data
} }
}, },
error => { error => {
console.log('err' + error) // for debug
Message({ Message({
message: error.message, message: error.message,
type: 'error', type: 'error',

@ -1506,14 +1506,6 @@ const widgetTools = [
placeholder: '', placeholder: '',
value: '柱状图', value: '柱状图',
}, },
{
type: 'el-switch',
label: '竖展示',
name: 'verticalShow',
required: false,
placeholder: '',
value: false,
},
{ {
type: 'vue-color', type: 'vue-color',
label: '背景颜色', label: '背景颜色',
@ -1523,35 +1515,6 @@ const widgetTools = [
value: '' value: ''
}, },
[ [
// {
// name: '柱体设置',
// list: [
// {
// type: 'el-slider',
// label: '最大宽度',
// name: 'maxWidth',
// required: false,
// placeholder: '',
// value: 10,
// },
// {
// type: 'el-slider',
// label: '圆角',
// name: 'radius',
// require: false,
// placeholder: '',
// value: 5,
// },
// {
// type: 'el-slider',
// label: '最小高度',
// name: 'minHeight',
// require: false,
// placeholder: '',
// value: 0,
// },
// ],
// },
{ {
name: '标题设置', name: '标题设置',
list: [ list: [
@ -1654,325 +1617,200 @@ const widgetTools = [
}, },
], ],
}, },
// { {
// name: 'X轴设置', name: 'X轴设置',
// list: [ list: [
// { {
// type: 'el-input-text', type: 'el-input-text',
// label: '名称', label: '名称',
// name: 'xName', name: 'xName',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '' value: ''
// }, },
// { {
// type: 'el-switch', type: 'el-switch',
// label: '显示', label: '显示',
// name: 'hideX', name: 'hideX',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: true, value: true,
// }, },
// { {
// type: 'vue-color', type: 'vue-color',
// label: '坐标名颜色', label: '坐标名颜色',
// name: 'xNameColor', name: 'xNameColor',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '#fff' value: '#fff'
// }, },
// { {
// type: 'el-input-number', type: 'el-input-number',
// label: '字体大小', label: '字体大小',
// name: 'xNameFontSize', name: 'xNameFontSize',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: 12 value: 12
// }, },
// { {
// type: 'el-slider', type: 'el-slider',
// label: '文字角度', label: '文字角度',
// name: 'textAngle', name: 'textAngle',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: 0 value: 0
// }, },
// { {
// type: 'el-input-number', type: 'el-input-number',
// label: '文字间隔', label: '文字间隔',
// name: 'textInterval', name: 'textInterval',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '' value: ''
// }, },
// { {
// type: 'el-switch', type: 'el-switch',
// label: '轴反转', label: '轴反转',
// name: 'reversalX', name: 'reversalX',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '' value: ''
// }, },
// { {
// type: 'vue-color', type: 'vue-color',
// label: '颜色', label: '颜色',
// name: 'Xcolor', name: 'Xcolor',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '#fff', value: '#fff',
// }, },
// { {
// type: 'el-input-number', type: 'el-input-number',
// label: '字号', label: '字号',
// name: 'fontSizeX', name: 'fontSizeX',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: 12, value: 12,
// }, },
// ], ],
// }, },
// { {
// name: 'Y轴设置', name: 'Y轴设置',
// list: [ list: [
// { {
// type: 'el-input-text', type: 'el-input-text',
// label: '名称', label: '名称',
// name: 'textNameY', name: 'textNameY',
// require: false, require: false,
// placeholder: '', placeholder: '',
// value: '' value: ''
// }, },
// { {
// type: 'el-switch', type: 'el-switch',
// label: '显示', label: '显示',
// name: 'isShowY', name: 'isShowY',
// require: false, require: false,
// placeholder: '', placeholder: '',
// value: true, value: true,
// }, },
// { {
// type: 'vue-color', type: 'vue-color',
// label: '坐标名颜色', label: '坐标名颜色',
// name: 'NameColorY', name: 'NameColorY',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '#fff', value: '#fff',
// }, },
// { {
// type: 'el-input-number', type: 'el-input-number',
// label: '字体大小', label: '字体大小',
// name: 'NameFontSizeY', name: 'NameFontSizeY',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: 12, value: 12,
// }, },
// { {
// type: 'el-switch', type: 'el-switch',
// label: '轴反转', label: '轴反转',
// name: 'reversalY', name: 'reversalY',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: false value: false
// }, },
// { {
// type: 'vue-color', type: 'vue-color',
// label: '颜色', label: '颜色',
// name: 'colorY', name: 'colorY',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: '#fff', value: '#fff',
// }, },
// { {
// type: 'el-input-number', type: 'el-input-number',
// label: '字号', label: '字号',
// name: 'fontSizeY', name: 'fontSizeY',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: 12, value: 12,
// }, },
// ], ],
// }, },
// { {
// name: '数值设定', name: '坐标轴边距设置',
// list: [ list: [
// { {
// type: 'el-switch', type: 'el-slider',
// label: '显示', label: '左边距(像素)',
// name: 'isShow', name: 'marginLeft',
// required: false, required: false,
// placeholder: '', placeholder: '',
// value: false value: 10,
// }, }, {
// { type: 'el-slider',
// type: 'el-input-number', label: '顶边距(像素)',
// label: '字体大小', name: 'marginTop',
// name: 'fontSize', required: false,
// required: false, placeholder: '',
// placeholder: '', value: 50,
// value: 14 }, {
// }, type: 'el-slider',
// { label: '右边距(像素)',
// type: 'vue-color', name: 'marginRight',
// label: '字体颜色', required: false,
// name: 'subTextColor', placeholder: '',
// required: false, value: 40,
// placeholder: '', }, {
// value: '#fff' type: 'el-slider',
// }, label: '底边距(像素)',
// { name: 'marginBottom',
// type: 'el-select', required: false,
// label: '字体粗细', placeholder: '',
// name: 'fontWeight', value: 10,
// required: false, },
// placeholder: '', ],
// selectOptions: [ },
// { code: 'normal', name: '正常' }, {
// { code: 'bold', name: '粗体' }, name: '渐变色',
// { code: 'bolder', name: '特粗体' }, list: [
// { code: 'lighter', name: '细体' } {
// ], type: 'vue-color',
// value: 'normal' label: '0%处',
// }, name: 'barStart',
// ], required: false,
// }, placeholder: '',
// { value: '#00F4FFFF'
// name: '提示语设置', },
// list: [ {
// { type: 'vue-color',
// type: 'el-input-number', label: '100%处',
// label: '字体大小', name: 'barEnd',
// name: 'fontSize', required: false,
// required: false, placeholder: '',
// placeholder: '', value: '#004DA7FF'
// }, },
// {
// type: 'vue-color', ],
// label: '字体颜色', },
// name: 'lineColor',
// required: false,
// placeholder: '',
// },
// ],
// },
// {
// name: '坐标轴边距设置',
// list: [
// {
// type: 'el-slider',
// label: '左边距(像素)',
// name: 'marginLeft',
// required: false,
// placeholder: '',
// value: 10,
// }, {
// type: 'el-slider',
// label: '顶边距(像素)',
// name: 'marginTop',
// required: false,
// placeholder: '',
// value: 50,
// }, {
// type: 'el-slider',
// label: '右边距(像素)',
// name: 'marginRight',
// required: false,
// placeholder: '',
// value: 40,
// }, {
// type: 'el-slider',
// label: '底边距(像素)',
// name: 'marginBottom',
// required: false,
// placeholder: '',
// value: 10,
// },
// ],
// },
// {
// name: '图例操作',
// list: [
// {
// type: 'el-switch',
// label: '图例',
// name: 'isShowLegend',
// required: false,
// placeholder: '',
// value: true,
// },
// {
// type: 'vue-color',
// label: '字体颜色',
// name: 'lengedColor',
// required: false,
// placeholder: '',
// value: '#fff',
// },
// {
// type: 'el-input-number',
// label: '字体大小',
// name: 'lengedFontSize',
// required: false,
// placeholder: '',
// value: 16,
// },
// {
// type: 'el-input-number',
// label: '图例宽度',
// name: 'lengedWidth',
// required: false,
// placeholder: '',
// value: 15,
// },
// {
// type: 'el-select',
// label: '横向位置',
// name: 'lateralPosition',
// required: false,
// placeholder: '',
// selectOptions: [
// { code: 'left', name: '左对齐' },
// { code: 'right', name: '右对齐' },
// ],
// value: ''
// },
// {
// type: 'el-select',
// label: '纵向位置',
// name: 'longitudinalPosition',
// required: false,
// placeholder: '',
// selectOptions: [
// { code: 'top', name: '顶部' },
// { code: 'bottom', name: '底部' },
// ],
// value: ''
// },
// {
// type: 'el-select',
// label: '布局前置',
// name: 'layoutFront',
// required: false,
// placeholder: '',
// selectOptions: [
// { code: 'vertical', name: '竖排' },
// { code: 'horizontal', name: '横排' },
// ],
// value: ''
// },
// ],
// },
// {
// name: '自定义配色',
// list: [
// {
// type: 'customColor',
// label: '',
// name: 'customColor',
// required: false,
// value: [{ color: '#ff7f50' }, { color: '#87cefa' }, { color: '#da70d6' }, { color: '#32cd32' }, { color: '#6495ed' }],
// },
// ],
// },
], ],
], ],
// 数据 // 数据
@ -4466,6 +4304,380 @@ const widgetTools = [
// label: '中国地图', // label: '中国地图',
// icon: 'chinaMapChart', // icon: 'chinaMapChart',
// }, // },
{
code: 'WidgetPieNightingaleRoseArea',
type: 'chart',
label: '饼图-南丁格尔-面积',
icon: 'iconicon_tubiao_bingtu',
options: {
// 配置
setup: [
{
type: 'el-input-text',
label: '图层名称',
name: 'layerName',
required: false,
placeholder: '',
value: '饼图',
},
{
type: 'vue-color',
label: '背景颜色',
name: 'background',
required: false,
placeholder: '',
value: ''
},
[
{
name: '标题设置',
list: [
{
type: 'el-switch',
label: '标题',
name: 'isNoTitle',
required: false,
placeholder: '',
value: true
},
{
type: 'el-input-text',
label: '标题',
name: 'titleText',
required: false,
placeholder: '',
value: ''
},
{
type: 'vue-color',
label: '字体颜色',
name: 'textColor',
required: false,
placeholder: '',
value: '#fff'
},
{
type: 'el-select',
label: '字体粗细',
name: 'textFontWeight',
required: false,
placeholder: '',
selectOptions: [
{ code: 'normal', name: '正常' },
{ code: 'bold', name: '粗体' },
{ code: 'bolder', name: '特粗体' },
{ code: 'lighter', name: '细体' }
],
value: 'normal'
},
{
type: 'el-input-number',
label: '字体大小',
name: 'textFontSize',
required: false,
placeholder: '',
value: 20
},
{
type: 'el-select',
label: '字体位置',
name: 'textAlign',
required: false,
placeholder: '',
selectOptions: [
{ code: 'center', name: '居中' },
{ code: 'left', name: '左对齐' },
{ code: 'right', name: '右对齐' },
],
value: 'left'
},
{
type: 'el-input-text',
label: '副标题',
name: 'subText',
required: false,
placeholder: '',
value: ''
},
{
type: 'vue-color',
label: '字体颜色',
name: 'subTextColor',
required: false,
placeholder: '',
value: ''
},
{
type: 'el-select',
label: '字体粗细',
name: 'subTextFontWeight',
required: false,
placeholder: '',
selectOptions: [
{ code: 'normal', name: '正常' },
{ code: 'bold', name: '粗体' },
{ code: 'bolder', name: '特粗体' },
{ code: 'lighter', name: '细体' }
],
value: 'normal'
},
{
type: 'el-input-number',
label: '字体大小',
name: 'subTextFontSize',
required: false,
placeholder: '',
value: 12
},
],
},
{
name: '数值设定',
list: [
{
type: 'el-switch',
label: '显示',
name: 'isShow',
required: false,
placeholder: '',
value: true,
},
{
type: 'el-switch',
label: '数值',
name: 'numberValue',
require: false,
placeholder: '',
value: true,
},
{
type: 'el-switch',
label: '百分比',
name: 'percentage',
require: false,
placeholder: '',
value: false,
},
{
type: 'el-input-number',
label: '字体大小',
name: 'fontSize',
required: false,
placeholder: '',
value: 14,
},
{
type: 'vue-color',
label: '字体颜色',
name: 'subTextColor',
required: false,
placeholder: '',
value: ''
},
{
type: 'el-select',
label: '字体粗细',
name: 'fontWeight',
required: false,
placeholder: '',
selectOptions: [
{ code: 'normal', name: '正常' },
{ code: 'bold', name: '粗体' },
{ code: 'bolder', name: '特粗体' },
{ code: 'lighter', name: '细体' }
],
value: 'normal'
},
],
},
{
name: '提示语设置',
list: [
{
type: 'el-input-number',
label: '字体大小',
name: 'fontSize',
required: false,
placeholder: '',
value: 12
},
{
type: 'vue-color',
label: '网格线颜色',
name: 'lineColor',
required: false,
placeholder: '',
value: ''
},
],
},
{
name: '图例操作',
list: [
{
type: 'el-switch',
label: '图例',
name: 'isShowLegend',
required: false,
placeholder: '',
value: true,
},
{
type: 'vue-color',
label: '字体颜色',
name: 'lengedColor',
required: false,
placeholder: '',
value: '#fff',
},
{
type: 'el-input-text',
label: '字体大小',
name: 'lengedFontSize',
required: false,
placeholder: '',
value: 16,
},
{
type: 'el-input-number',
label: '图例宽度',
name: 'lengedWidth',
required: false,
placeholder: '',
value: 15,
},
{
type: 'el-select',
label: '横向位置',
name: 'lateralPosition',
required: false,
placeholder: '',
selectOptions: [
{ code: 'left', name: '左对齐' },
{ code: 'right', name: '右对齐' },
],
value: ''
},
{
type: 'el-select',
label: '纵向位置',
name: 'longitudinalPosition',
required: false,
placeholder: '',
selectOptions: [
{ code: 'top', name: '顶部' },
{ code: 'bottom', name: '底部' },
],
value: ''
},
{
type: 'el-select',
label: '布局前置',
name: 'layoutFront',
required: false,
placeholder: '',
selectOptions: [
{ code: 'vertical', name: '竖排' },
{ code: 'horizontal', name: '横排' },
],
value: ''
},
],
},
{
name: '自定义配色',
list: [
{
type: 'customColor',
label: '',
name: 'customColor',
required: false,
value: [{ color: '#ED0E0E' }, { color: '#6CCD17' }, { color: '#172CCD' }, { color: '#B817CD' }, { color: '#AFCD17' }],
},
],
},
],
],
// 数据
data: [
{
type: 'el-radio-group',
label: '数据类型',
name: 'dataType',
require: false,
placeholder: '',
selectValue: true,
selectOptions: [
{
code: 'staticData',
name: '静态数据',
},
{
code: 'dynamicData',
name: '动态数据',
},
],
value: 'staticData',
},
{
type: 'el-button',
label: '静态数据',
name: 'staticData',
required: false,
placeholder: 'px',
relactiveDom: 'dataType',
relactiveDomValue: 'staticData',
value: '[{"value": 1048,"name": "搜索引擎"},{"value": 735, "name": "直接访问"},{"value": 580, "name": "邮件营销"},{"value": 484,"name":"联盟广告"},{"value":300,"name":"视频广告"}]',
},
{
type: 'dycustComponents',
label: '',
name: 'dynamicData',
required: false,
placeholder: 'px',
relactiveDom: 'dataType',
chartType: 'widget-piechart',
relactiveDomValue: 'dynamicData',
value: '',
},
],
// 坐标
position: [
{
type: 'el-input-number',
label: '左边距',
name: 'left',
required: false,
placeholder: 'px',
value: 0,
},
{
type: 'el-input-number',
label: '上边距',
name: 'top',
required: false,
placeholder: 'px',
value: 0,
},
{
type: 'el-input-number',
label: '宽度',
name: 'width',
required: false,
placeholder: '该容器在1920px大屏中的宽度',
value: 400,
},
{
type: 'el-input-number',
label: '高度',
name: 'height',
required: false,
placeholder: '该容器在1080px大屏中的高度',
value: 200,
},
],
},
},
] ]
const getToolByCode = function (code) { const getToolByCode = function (code) {

@ -16,7 +16,7 @@
data() { data() {
return { return {
options: { options: {
backgroundColor: '#00265f', // backgroundColor: '#00265f',
"title": { "title": {
"text": "政策补贴额度", "text": "政策补贴额度",
x: "center", x: "center",
@ -176,13 +176,13 @@
// options // options
editorOptions() { editorOptions() {
this.setOptionsTitle() this.setOptionsTitle()
// this.setOptionsX() this.setOptionsX()
// this.setOptionsY() this.setOptionsY()
// this.setOptionsTop() // this.setOptionsTop()
// this.setOptionsTooltip() // this.setOptionsTooltip()
// this.setOptionsMargin() this.setOptionsMargin()
// this.setOptionsLegend() // this.setOptionsLegend()
// this.setOptionsColor() this.setOptionsColor()
this.setOptionsData() this.setOptionsData()
}, },
// //
@ -331,29 +331,17 @@
} }
legend.itemWidth = optionsCollapse.lengedWidth legend.itemWidth = optionsCollapse.lengedWidth
}, },
// //
setOptionsColor() { setOptionsColor() {
const optionsCollapse = this.optionsSetup const optionsCollapse = this.optionsSetup
const customColor = optionsCollapse.customColor const barStart = {}
if (!customColor) return barStart['offset'] = 0
const arrColor = [] barStart['color'] = optionsCollapse.barStart
for (let i = 0; i < customColor.length; i++) { const barEnd = {}
arrColor.push(customColor[i].color) barStart['offset'] = 1
} barStart['color'] = optionsCollapse.barEnd
const itemStyle = { // this.options.series[0].itemStyle.normal.color = new echarts.graphic.LinearGradient(0, 0, 0, 1,[ barStart, barEnd], false)
normal: {
color: (params) => {
return arrColor[params.dataIndex]
},
barBorderRadius: optionsCollapse.radius,
},
}
for (const key in this.options.series) {
if (this.options.series[key].type == 'bar') {
this.options.series[key].itemStyle = itemStyle
}
}
this.options = Object.assign({}, this.options)
}, },
// //
setOptionsData() { setOptionsData() {
@ -419,8 +407,6 @@
.echarts { .echarts {
width: 100%; width: 100%;
height: 100%; height: 100%;
min-width: 200px;
min-height: 200px;
overflow: hidden; overflow: hidden;
} }
</style> </style>

@ -0,0 +1,342 @@
<template>
<div :style="styleObj">
<v-chart :options="options" autoresize/>
</div>
</template>
<script>
import echarts from 'echarts';
export default {
name: 'WidgetPieNightingaleRoseArea', // https://echarts.apache.org/examples/zh/editor.html?c=pie-roseType-simple
components: {},
props: {
value: Object,
ispreview: Boolean,
},
data() {
return {
options: {
legend: {
top: 'bottom'
},
toolbox: {
show: true,
feature: {
mark: {show: true},
dataView: {show: true, readOnly: false},
restore: {show: true},
saveAsImage: {show: true}
}
},
series: [
{
name: '面积模式',
type: 'pie',
radius: [50, 250],
center: ['50%', '50%'],
roseType: 'area',
itemStyle: {
borderRadius: 8
},
data: [
{value: 40, name: 'rose 1'},
{value: 38, name: 'rose 2'},
{value: 32, name: 'rose 3'},
{value: 30, name: 'rose 4'},
{value: 28, name: 'rose 5'},
{value: 26, name: 'rose 6'},
{value: 22, name: 'rose 7'},
{value: 18, name: 'rose 8'}
]
}
]
},
optionsStyle: {}, //
optionsData: {}, //
optionsSetup: {},
}
},
computed: {
styleObj() {
return {
position: this.ispreview ? 'absolute' : 'static',
width: this.optionsStyle.width + 'px',
height: this.optionsStyle.height + 'px',
left: this.optionsStyle.left + 'px',
top: this.optionsStyle.top + 'px',
background: this.optionsSetup.background,
}
},
},
watch: {
value: {
handler(val) {
console.log(val)
this.optionsStyle = val.position
this.optionsData = val.data
this.optionsCollapse = val.setup
this.optionsSetup = val.setup
this.editorOptions()
},
deep: true,
},
},
mounted() {
this.optionsStyle = this.value.position
this.optionsData = this.value.data
this.optionsCollapse = this.value.setup
this.optionsSetup = this.value.setup
this.editorOptions()
},
methods: {
// options
editorOptions() {
this.setOptionsTitle()
// this.setOptionsX()
// this.setOptionsY()
// this.setOptionsTop()
// this.setOptionsTooltip()
// this.setOptionsMargin()
// this.setOptionsLegend()
// this.setOptionsColor()
this.setOptionsData()
},
//
setOptionsTitle() {
const optionsCollapse = this.optionsSetup
const title = {}
title.text = optionsCollapse.titleText
title.show = optionsCollapse.isNoTitle
title.left = optionsCollapse.textAlign
title.textStyle = {
color: optionsCollapse.textColor,
fontSize: optionsCollapse.textFontSize,
fontWeight: optionsCollapse.textFontWeight,
}
title.subtext = optionsCollapse.subText
title.subtextStyle = {
color: optionsCollapse.subTextColor,
fontWeight: optionsCollapse.subTextFontWeight,
fontSize: optionsCollapse.subTextFontSize,
}
this.options.title = title
},
// X
setOptionsX() {
const optionsCollapse = this.optionsSetup
const xAxis = {
type: 'category',
show: optionsCollapse.hideX, //
name: optionsCollapse.xName, //
nameTextStyle: {
color: optionsCollapse.xNameColor,
fontSize: optionsCollapse.xNameFontSize,
},
nameRotate: optionsCollapse.textAngle, //
inverse: optionsCollapse.reversalX, //
axisLabel: {
show: true,
interval: optionsCollapse.textInterval, //
rotate: optionsCollapse.textAngle, //
textStyle: {
color: optionsCollapse.Xcolor, // x
fontSize: optionsCollapse.fontSizeX,
},
},
axisLine: {
show: true,
lineStyle: {
color: '#fff',
},
},
}
this.options.xAxis = xAxis
},
// Y
setOptionsY() {
const optionsCollapse = this.optionsSetup
const yAxis = {
type: 'value',
show: optionsCollapse.isShowY, //
name: optionsCollapse.textNameY, //
nameTextStyle: {
color: optionsCollapse.NameColorY,
fontSize: optionsCollapse.NameFontSizeY,
},
inverse: optionsCollapse.reversalY, //
axisLabel: {
show: true,
textStyle: {
color: optionsCollapse.colorY, // x
fontSize: optionsCollapse.fontSizeY,
},
},
splitLine: {
show: false,
},
axisLine: {
show: true,
lineStyle: {
color: '#fff',
},
},
}
this.options.yAxis = yAxis
},
// or
setOptionsTop() {
const optionsCollapse = this.optionsSetup
const series = this.options.series
for (const key in series) {
if (series[key].type == 'bar') {
series[key].label = {
show: optionsCollapse.isShow,
position: 'top',
distance: 10,
fontSize: optionsCollapse.fontSize,
color: optionsCollapse.subTextColor,
fontWeight: optionsCollapse.fontWeight,
}
series[key].barWidth = optionsCollapse.maxWidth
series[key].barMinHeight = optionsCollapse.minHeight
}
}
this.options.series = series
},
// tooltip
setOptionsTooltip() {
const optionsCollapse = this.optionsSetup
const tooltip = {
trigger: 'item',
show: true,
textStyle: {
color: optionsCollapse.lineColor,
fontSize: optionsCollapse.fontSize,
},
}
this.options.tooltip = tooltip
},
//
setOptionsMargin() {
const optionsCollapse = this.optionsSetup
const grid = {
left: optionsCollapse.marginLeft,
right: optionsCollapse.marginRight,
bottom: optionsCollapse.marginBottom,
top: optionsCollapse.marginTop,
containLabel: true,
}
this.options.grid = grid
},
// legend
setOptionsLegend() {
const optionsCollapse = this.optionsSetup
const legend = this.options.legend
legend.show = optionsCollapse.isShowLegend
legend.left = optionsCollapse.lateralPosition == 'left' ? 0 : 'auto'
legend.right = optionsCollapse.lateralPosition == 'right' ? 0 : 'auto'
legend.top = optionsCollapse.longitudinalPosition == 'top' ? 0 : 'auto'
legend.bottom = optionsCollapse.longitudinalPosition == 'bottom' ? 0 : 'auto'
legend.orient = optionsCollapse.layoutFront
legend.textStyle = {
color: optionsCollapse.lengedColor,
fontSize: optionsCollapse.fontSize,
}
legend.itemWidth = optionsCollapse.lengedWidth
},
//
setOptionsColor() {
const optionsCollapse = this.optionsSetup
const customColor = optionsCollapse.customColor
if (!customColor) return
const arrColor = []
for (let i = 0; i < customColor.length; i++) {
arrColor.push(customColor[i].color)
}
const itemStyle = {
normal: {
color: (params) => {
return arrColor[params.dataIndex]
},
barBorderRadius: optionsCollapse.radius,
},
}
for (const key in this.options.series) {
if (this.options.series[key].type == 'bar') {
this.options.series[key].itemStyle = itemStyle
}
}
this.options = Object.assign({}, this.options)
},
//
setOptionsData() {
const optionsSetup = this.optionsSetup
console.log(optionsSetup)
const optionsData = this.optionsData // or
console.log(optionsData)
optionsData.dataType == 'staticData' ? this.staticDataFn(optionsData.staticData, optionsSetup) : this.dynamicDataFn(optionsData.dynamicData, optionsSetup)
},
//
staticDataFn(val, optionsSetup) {
const staticData = JSON.parse(val)
// x
if (optionsSetup.verticalShow) {
this.options.xAxis.data = []
this.options.yAxis.data = staticData.categories
this.options.xAxis.type = 'value'
this.options.yAxis.type = 'category'
} else {
this.options.xAxis.data = staticData.categories
this.options.yAxis.data = []
this.options.xAxis.type = 'category'
this.options.yAxis.type = 'value'
}
// series
const series = this.options.series
for (const i in series) {
if (series[i].type == 'bar') {
series[i].data = staticData.series[0].data
}
}
},
//
dynamicDataFn(val, optionsSetup) {
console.log(val)
if (!val) return
// x
if (optionsSetup.verticalShow) {
this.options.xAxis.data = []
this.options.yAxis.data = val.xAxis
this.options.xAxis.type = 'value'
this.options.yAxis.type = 'category'
} else {
this.options.xAxis.data = val.xAxis
this.options.yAxis.data = []
this.options.xAxis.type = 'category'
this.options.yAxis.type = 'value'
}
// series
const series = this.options.series
for (const i in series) {
if (series[i].type == 'bar') {
series[i].data = val.series[i].data
}
}
},
},
}
</script>
<style scoped lang="scss">
.echarts {
width: 100%;
height: 100%;
min-width: 200px;
min-height: 200px;
overflow: hidden;
}
</style>

@ -36,6 +36,7 @@ import WidgetPiechart from "./widgetPiechart.vue";
import WidgetHollowPiechart from "./widgetHollowPiechart.vue"; import WidgetHollowPiechart from "./widgetHollowPiechart.vue";
import WidgetFunnel from "./widgetFunnel.vue"; import WidgetFunnel from "./widgetFunnel.vue";
import WidgetGauge from "./widgetGauge.vue"; import WidgetGauge from "./widgetGauge.vue";
import WidgetPieNightingaleRoseArea from "./pie/widgetPieNightingaleRoseArea";
export default { export default {
name: "Widget", name: "Widget",
components: { components: {
@ -54,7 +55,8 @@ export default {
WidgetPiechart, WidgetPiechart,
WidgetHollowPiechart, WidgetHollowPiechart,
WidgetFunnel, WidgetFunnel,
WidgetGauge WidgetGauge,
WidgetPieNightingaleRoseArea
}, },
model: { model: {
prop: "value", prop: "value",

@ -88,13 +88,13 @@
label="数据源名称[编码]" /> label="数据源名称[编码]" />
<el-table-column prop="sourceDesc" <el-table-column prop="sourceDesc"
label="数据源描述" /> label="数据源描述" />
<el-table-column prop="createByView" <el-table-column prop="createBy"
label="创建人" label="创建人"
width="100" /> width="100" />
<el-table-column prop="createTime" <el-table-column prop="createTime"
label="创建时间" label="创建时间"
width="140" /> width="140" />
<el-table-column prop="updateByView" <el-table-column prop="updateBy"
label="修改人" label="修改人"
width="100" /> width="100" />
<el-table-column prop="updateTime" <el-table-column prop="updateTime"

@ -43,7 +43,7 @@
:md="12" :md="12"
:lg="6" :lg="6"
:xl="4"> :xl="4">
<el-form-item label="报表类型" <el-form-item label="报表类型"
size="mini"> size="mini">
<Dictionary v-model="params.reportType" <Dictionary v-model="params.reportType"
:updata-dict="params.reportType" :updata-dict="params.reportType"
@ -97,11 +97,11 @@
</el-table-column> --> </el-table-column> -->
<el-table-column prop="reportDesc" <el-table-column prop="reportDesc"
label="备注" /> label="备注" />
<el-table-column prop="createByView" <el-table-column prop="createBy"
label="创建人" /> label="创建人" />
<el-table-column prop="createTime" <el-table-column prop="createTime"
label="创建时间" /> label="创建时间" />
<el-table-column prop="updateByView" <el-table-column prop="updateBy"
label="更新人" /> label="更新人" />
<el-table-column prop="updateTime" <el-table-column prop="updateTime"
label="更新时间" /> label="更新时间" />
@ -408,4 +408,4 @@ export default {
}, },
}, },
} }
</script> </script>

@ -78,13 +78,13 @@
<el-button @click="isShowCaseResult(scope.row)"></el-button> <el-button @click="isShowCaseResult(scope.row)"></el-button>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="createByView" <el-table-column prop="createBy"
width="100" width="100"
label="创建人" /> label="创建人" />
<el-table-column prop="createTime" <el-table-column prop="createTime"
width="140" width="140"
label="创建人" /> label="创建人" />
<el-table-column prop="updateByView" <el-table-column prop="updateBy"
width="100" width="100"
label="更新人" /> label="更新人" />
<el-table-column prop="updateTime" <el-table-column prop="updateTime"
@ -390,7 +390,7 @@
</div> </div>
</template> </template>
<script> <script>
import { queryAllDataSourceSet, verificationSet, testTransformSet, dataSetPreview, addDataSet, editDataSet, deleteDataSet, dataSetPageList } from '@/api/report' import { queryAllDataSourceSet, verificationSet, testTransformSet, dataSetPreview, addDataSet, editDataSet, deleteDataSet, dataSetPageList } from '@/api/report'
import Dictionary from '@/components/Dictionary/index' import Dictionary from '@/components/Dictionary/index'
import { codemirror } from 'vue-codemirror' // codeMirror import { codemirror } from 'vue-codemirror' // codeMirror

Loading…
Cancel
Save