yanzili 3 years ago
commit 813f36619c

@ -38,23 +38,6 @@
<artifactId>spring-cloud-context</artifactId>
</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>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId>
@ -98,31 +81,16 @@
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.22</version>
<groupId>org.apache.httpcomponents</groupId>
<artifactId>httpclient</artifactId>
<version>4.5.2</version>
</dependency>
<!--kudu impala驱动-->
<dependency>
<groupId>owinfo</groupId>
<artifactId>impalajdbc41</artifactId>
<version>1.0.0</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>
<groupId>org.apache.httpcomponents</groupId>
<artifactId>httpcore</artifactId>
<version>4.4.5</version>
</dependency>
</dependencies>

@ -1,15 +1,12 @@
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.exception.BusinessException;
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.entity.Report;
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.stereotype.Service;
@ -22,13 +19,9 @@ import org.springframework.stereotype.Service;
@Service
public class ReportServiceImpl implements ReportService {
private Logger logger = LoggerFactory.getLogger(this.getClass());
@Autowired
private ReportMapper reportMapper;
@Autowired
private ReportExcelMapper reportExcelMapper;
@Override
public GaeaBaseMapper<Report> getMapper() {
return reportMapper;
@ -38,8 +31,11 @@ public class ReportServiceImpl implements ReportService {
@Override
public void delReport(ReportDto reportDto) {
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, {
NODE_ENV: '"development"',
// BASE_API: '"http://127.0.0.1:9095"'
BASE_API: '"http://10.108.26.197:9095"'
BASE_API: '"http://127.0.0.1:9095"'
// BASE_API: '"http://10.108.26.197:9095"'
})

@ -1,60 +1,61 @@
<template>
<div>
<el-button type="primary"
icon="el-icon-plus"
plain
@click="handleAddClick">新增</el-button>
<el-table :data="formData"
style="width: 100%">
<el-table-column prop="color"
label="颜色"
align="center">
<el-button type="primary" icon="el-icon-plus" plain @click="handleAddClick"
>新增</el-button
>
<el-table :data="formData" style="width: 100%">
<el-table-column prop="color" label="颜色" align="center">
<template slot-scope="scope">
<span class="color-box"
:style="{ background: scope.row.color }" />
<span class="color-box" :style="{ background: scope.row.color }" />
</template>
</el-table-column>
<el-table-column label="位置"
align="center">
<el-table-column label="位置" align="center">
<template slot-scope="scope">
<span class="editor"
@click="handleEditorClick(scope.$index, scope.row)">
<span
class="editor"
@click="handleEditorClick(scope.$index, scope.row)"
>
<i class="el-icon-edit" /> 编辑
</span>
</template>
</el-table-column>
<el-table-column label="操作"
align="center">
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<span class="editor"
@click="handleDeleteClick(scope.$index, scope.row)">
<span
class="editor"
@click="handleDeleteClick(scope.$index, scope.row)"
>
<i class="el-icon-delete" /> 删除
</span>
</template>
</el-table-column>
</el-table>
<el-dialog title="新增"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose">
<el-dialog
title="新增"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose"
>
<el-form>
<el-form-item label="颜色">
<el-input v-model="colorValue"
style="width: 200px"
placeholder="请输入颜色">
<el-input
v-model="colorValue"
style="width: 200px"
placeholder="请输入颜色"
>
<template slot="append">
<el-color-picker v-model="colorValue"
:predefine="predefineColors" />
<el-color-picker
v-model="colorValue"
:predefine="predefineColors"
/>
</template>
</el-input>
</el-form-item>
</el-form>
<span slot="footer"
class="dialog-footer">
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary"
@click="handleSaveClick"> </el-button>
<el-button type="primary" @click="handleSaveClick"> </el-button>
</span>
</el-dialog>
</div>
@ -69,7 +70,7 @@ export default {
props: {
formData: Array
},
data () {
data() {
return {
predefineColors: [
"#ff4500",
@ -86,21 +87,21 @@ export default {
indexEditor: -1 //
};
},
mounted () { },
mounted() {},
methods: {
//
handleClose () {
handleClose() {
this.dialogVisible = false;
this.colorValue = "";
},
//
handleAddClick () {
handleAddClick() {
this.colorValue = "";
this.flag = true;
this.dialogVisible = true;
},
//
handleSaveClick () {
handleSaveClick() {
if (this.flag) {
//
const obj = {
@ -114,17 +115,20 @@ export default {
this.dialogVisible = false;
}
this.$emit("input", this.formData);
this.$emit("change", this.formData);
},
//
handleEditorClick (index, row) {
handleEditorClick(index, row) {
this.flag = false;
this.colorValue = row.color;
this.dialogVisible = true;
this.indexEditor = index;
},
//
handleDeleteClick (index) {
handleDeleteClick(index) {
this.formData.splice(index, 1);
this.$emit("input", this.formData);
this.$emit("change", this.formData);
}
}
};

@ -1,4 +1,3 @@
/* eslint-disable vue/valid-v-for */
<!--
* @Author: lide1202@hotmail.com
* @Date: 2021-4-6 11:04:24
@ -242,6 +241,7 @@
v-if="itemChildList.type == 'customColor'"
:key="'b-' + idx"
v-model="formData[itemChildList.name]"
@change="changed($event, itemChildList.name)"
/>
</template>
</el-collapse-item>

@ -4466,6 +4466,380 @@ const widgetTools = [
// label: '中国地图',
// 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) {

@ -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 WidgetFunnel from "./widgetFunnel.vue";
import WidgetGauge from "./widgetGauge.vue";
import WidgetPieNightingaleRoseArea from "./pie/widgetPieNightingaleRoseArea";
export default {
name: "Widget",
components: {
@ -54,7 +55,8 @@ export default {
WidgetPiechart,
WidgetHollowPiechart,
WidgetFunnel,
WidgetGauge
WidgetGauge,
WidgetPieNightingaleRoseArea
},
model: {
prop: "value",
@ -101,11 +103,9 @@ export default {
},
mounted() {},
methods: {
//
handleFocus({ index, left, top, width, height }) {
// console.log(index, left, top, width, height);
},
//
handleBlur({ index, left, top, width, height }) {
this.$emit("onActivated", { index, left, top, width, height });
this.$refs.draggable.setActive(true);

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

@ -97,11 +97,11 @@
</el-table-column> -->
<el-table-column prop="reportDesc"
label="备注" />
<el-table-column prop="createByView"
<el-table-column prop="createBy"
label="创建人" />
<el-table-column prop="createTime"
label="创建时间" />
<el-table-column prop="updateByView"
<el-table-column prop="updateBy"
label="更新人" />
<el-table-column prop="updateTime"
label="更新时间" />

@ -78,13 +78,13 @@
<el-button @click="isShowCaseResult(scope.row)"></el-button>
</template>
</el-table-column>
<el-table-column prop="createByView"
<el-table-column prop="createBy"
width="100"
label="创建人" />
<el-table-column prop="createTime"
width="140"
label="创建人" />
<el-table-column prop="updateByView"
<el-table-column prop="updateBy"
width="100"
label="更新人" />
<el-table-column prop="updateTime"

Loading…
Cancel
Save