提交 11e7eb2a authored 作者: wangjiahao's avatar wangjiahao

feat:仪表盘模板导入导出

上级 230ff9e5
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
@Data
public class PanelTemplate implements Serializable {
private String id;
private String name;
private String pid;
private Integer level;
private String nodeType;
private String createBy;
private Long createTime;
private String templateType;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.ToString;
@Data
@EqualsAndHashCode(callSuper = true)
@ToString(callSuper = true)
public class PanelTemplateWithBLOBs extends PanelTemplate implements Serializable {
private String snapshot;
private String templateStyle;
private String templateData;
private String dynamicData;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
@Data
public class SysDict implements Serializable {
private String id;
private String dictName;
private String dictCode;
private String description;
private Boolean delFlag;
private String createBy;
private Long createTime;
private String updateBy;
private Long updateTime;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.domain;
import java.io.Serializable;
import lombok.Data;
@Data
public class SysDictItem implements Serializable {
private String id;
private String dictId;
private String itemText;
private String itemValue;
private String description;
private Integer sortOrder;
private String status;
private String createBy;
private Long createTime;
private String updateBy;
private Long updateTime;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
package io.dataease.base.mapper;
import io.dataease.base.domain.PanelTemplate;
import io.dataease.base.domain.PanelTemplateExample;
import io.dataease.base.domain.PanelTemplateWithBLOBs;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface PanelTemplateMapper {
long countByExample(PanelTemplateExample example);
int deleteByExample(PanelTemplateExample example);
int deleteByPrimaryKey(String id);
int insert(PanelTemplateWithBLOBs record);
int insertSelective(PanelTemplateWithBLOBs record);
List<PanelTemplateWithBLOBs> selectByExampleWithBLOBs(PanelTemplateExample example);
List<PanelTemplate> selectByExample(PanelTemplateExample example);
PanelTemplateWithBLOBs selectByPrimaryKey(String id);
int updateByExampleSelective(@Param("record") PanelTemplateWithBLOBs record, @Param("example") PanelTemplateExample example);
int updateByExampleWithBLOBs(@Param("record") PanelTemplateWithBLOBs record, @Param("example") PanelTemplateExample example);
int updateByExample(@Param("record") PanelTemplate record, @Param("example") PanelTemplateExample example);
int updateByPrimaryKeySelective(PanelTemplateWithBLOBs record);
int updateByPrimaryKeyWithBLOBs(PanelTemplateWithBLOBs record);
int updateByPrimaryKey(PanelTemplate record);
}
\ No newline at end of file
package io.dataease.base.mapper;
import io.dataease.base.domain.SysDictItem;
import io.dataease.base.domain.SysDictItemExample;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface SysDictItemMapper {
long countByExample(SysDictItemExample example);
int deleteByExample(SysDictItemExample example);
int deleteByPrimaryKey(String id);
int insert(SysDictItem record);
int insertSelective(SysDictItem record);
List<SysDictItem> selectByExample(SysDictItemExample example);
SysDictItem selectByPrimaryKey(String id);
int updateByExampleSelective(@Param("record") SysDictItem record, @Param("example") SysDictItemExample example);
int updateByExample(@Param("record") SysDictItem record, @Param("example") SysDictItemExample example);
int updateByPrimaryKeySelective(SysDictItem record);
int updateByPrimaryKey(SysDictItem record);
}
\ No newline at end of file
package io.dataease.base.mapper;
import io.dataease.base.domain.SysDict;
import io.dataease.base.domain.SysDictExample;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface SysDictMapper {
long countByExample(SysDictExample example);
int deleteByExample(SysDictExample example);
int deleteByPrimaryKey(String id);
int insert(SysDict record);
int insertSelective(SysDict record);
List<SysDict> selectByExample(SysDictExample example);
SysDict selectByPrimaryKey(String id);
int updateByExampleSelective(@Param("record") SysDict record, @Param("example") SysDictExample example);
int updateByExample(@Param("record") SysDict record, @Param("example") SysDictExample example);
int updateByPrimaryKeySelective(SysDict record);
int updateByPrimaryKey(SysDict record);
}
\ No newline at end of file
package io.dataease.base.mapper.ext;
import io.dataease.controller.request.panel.PanelTemplateRequest;
import io.dataease.dto.panel.PanelGroupDTO;
import io.dataease.dto.panel.PanelTemplateDTO;
import org.apache.ibatis.annotations.Param;
import java.util.List;
public interface ExtPanelTemplateMapper {
List<PanelTemplateDTO> panelTemplateList(PanelTemplateRequest request);
List<PanelTemplateDTO> panelSystemTemplateType(PanelTemplateRequest request);
//会级联删除pid 下的所有数据
int deleteCircle(@Param("pid") String pid);
PanelTemplateDTO panelTemplate(String id);
}
<?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.ExtPanelTemplateMapper">
<resultMap id="BaseResultMapDTO" type="io.dataease.dto.panel.PanelTemplateDTO"
extends="io.dataease.base.mapper.PanelTemplateMapper.BaseResultMap">
<result column="label" jdbcType="VARCHAR" property="label"/>
<result column="childrenCount" jdbcType="VARCHAR" property="childrenCount"/>
</resultMap>
<select id="panelTemplate" resultMap="BaseResultMapDTO">
SELECT
panel_template.*,
panel_template.NAME AS label,
ifnull(tempCountInfo.childrenCount,0) as childrenCount
FROM
panel_template
LEFT JOIN (
SELECT
pid,
count( 1 ) AS childrenCount
FROM
panel_template
WHERE
pid IS NOT NULL
GROUP BY
pid
) tempCountInfo ON panel_template.id = tempCountInfo.pid
WHERE
id = #{id}
</select>
<select id="panelTemplateList" resultMap="BaseResultMapDTO">
SELECT
panel_template.*,
panel_template.NAME AS label,
ifnull(tempCountInfo.childrenCount,0) as childrenCount
FROM
panel_template
LEFT JOIN (
SELECT
pid,
count( 1 ) AS childrenCount
FROM
panel_template
WHERE
pid IS NOT NULL
GROUP BY
pid
) tempCountInfo ON panel_template.id = tempCountInfo.pid
<where>
<if test="name != null">
and panel_template.name like CONCAT('%', #{name},'%')
</if>
<if test="nodeType != null">
and panel_template.node_type = #{nodeType}
</if>
<if test="templateType != null">
and panel_template.template_type = #{templateType}
</if>
<if test="id != null">
and panel_template.id = #{id}
</if>
<if test="pid != null">
and panel_template.pid = #{pid}
</if>
<if test="level != null">
and panel_template.level = #{level}
</if>
</where>
<if test="sort != null">
order by ${sort}
</if>
</select>
<delete id="deleteCircle">
delete from panel_template where FIND_IN_SET(panel_template.id,GET_PANEL_TEMPLATE_WITH_CHILDREN(#{pid}))
</delete>
</mapper>
...@@ -12,4 +12,9 @@ public class PanelConstants { ...@@ -12,4 +12,9 @@ public class PanelConstants {
public final static String COMPONENT_TYPE_PUBLIC = "public"; public final static String COMPONENT_TYPE_PUBLIC = "public";
public final static String TEMPLATE_TYPE_SYSTEM = "system";
public final static String TEMPLATE_TYPE_SELF = "self";
} }
package io.dataease.controller.panel;
import io.dataease.base.domain.PanelTemplateWithBLOBs;
import io.dataease.controller.request.panel.PanelTemplateRequest;
import io.dataease.dto.panel.PanelTemplateDTO;
import io.dataease.service.panel.PanelTemplateService;
import org.springframework.web.bind.annotation.*;
import javax.annotation.Resource;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021-03-05
* Description:
*/
@RestController
@RequestMapping("template")
public class PanelTemplateController {
@Resource
private PanelTemplateService panelTemplateService;
@PostMapping("/templateList")
public List<PanelTemplateDTO> templateList(@RequestBody PanelTemplateRequest request) {
return panelTemplateService.templateList(request);
}
@PostMapping("/save")
public PanelTemplateDTO save(@RequestBody PanelTemplateRequest request) {
return panelTemplateService.save(request);
}
@PostMapping("/deleteCircle/{id}")
public void deleteCircle(@PathVariable String id) {
panelTemplateService.deleteCircle(id);
}
@GetMapping("/findOne/{id}")
public PanelTemplateWithBLOBs findOne(@PathVariable String id) throws Exception {
return panelTemplateService.findOne(id);
}
@PostMapping("/find")
public List<PanelTemplateDTO> find(@RequestBody PanelTemplateRequest request) {
return panelTemplateService.find(request);
}
}
package io.dataease.controller.request.panel;
import io.dataease.base.domain.PanelTemplateWithBLOBs;
import lombok.Data;
/**
* Author: wangjiahao
* Date: 2021-03-05
* Description:
*/
@Data
public class PanelTemplateRequest extends PanelTemplateWithBLOBs {
private String sort;
private Boolean withChildren = false;
public PanelTemplateRequest() {
}
public PanelTemplateRequest(String pid) {
super.setPid(pid);
}
}
package io.dataease.dto.panel;
import io.dataease.base.domain.PanelTemplateWithBLOBs;
import lombok.Data;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021-03-05
* Description:
*/
@Data
public class PanelTemplateDTO extends PanelTemplateWithBLOBs {
private String label;
private Integer childrenCount;
private List<PanelTemplateDTO> children;
}
package io.dataease.service.panel;
import io.dataease.base.domain.*;
import io.dataease.base.mapper.PanelTemplateMapper;
import io.dataease.base.mapper.ext.ExtPanelTemplateMapper;
import io.dataease.commons.constants.PanelConstants;
import io.dataease.commons.utils.BeanUtils;
import io.dataease.controller.request.panel.PanelTemplateRequest;
import io.dataease.dto.panel.PanelTemplateDTO;
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.List;
import java.util.Optional;
import java.util.UUID;
/**
* Author: wangjiahao
* Date: 2021-03-05
* Description:
*/
@Service
public class PanelTemplateService {
private Logger LOGGER = LoggerFactory.getLogger(this.getClass());
@Resource
private PanelTemplateMapper panelTemplateMapper;
@Resource
private ExtPanelTemplateMapper extPanelTemplateMapper;
public List<PanelTemplateDTO> templateList(PanelTemplateRequest panelTemplateRequest) {
List<PanelTemplateDTO> panelTemplateList = extPanelTemplateMapper.panelTemplateList(panelTemplateRequest);
if(panelTemplateRequest.getWithChildren()){
getTreeChildren(panelTemplateList);
}
return panelTemplateList;
}
public void getTreeChildren(List<PanelTemplateDTO> parentPanelTemplateDTO){
Optional.ofNullable(parentPanelTemplateDTO).ifPresent(parent -> parent.forEach(panelTemplateDTO -> {
List<PanelTemplateDTO> panelTemplateDTOChildren = extPanelTemplateMapper.panelTemplateList(new PanelTemplateRequest(panelTemplateDTO.getId()));
panelTemplateDTO.setChildren(panelTemplateDTOChildren);
getTreeChildren(panelTemplateDTOChildren);
}));
}
public List<PanelTemplateDTO> getSystemTemplateType(PanelTemplateRequest panelTemplateRequest){
return extPanelTemplateMapper.panelTemplateList(panelTemplateRequest);
}
public PanelTemplateDTO save(PanelTemplateRequest request) {
if (StringUtils.isEmpty(request.getId())) {
request.setId(UUID.randomUUID().toString());
request.setCreateTime(System.currentTimeMillis());
panelTemplateMapper.insert(request);
} else {
panelTemplateMapper.updateByPrimaryKeySelective(request);
}
PanelTemplateDTO panelTemplateDTO = new PanelTemplateDTO();
BeanUtils.copyBean(panelTemplateDTO, request);
panelTemplateDTO.setLabel(request.getName());
return panelTemplateDTO;
}
public void deleteCircle(String id){
Assert.notNull(id, "id cannot be null");
extPanelTemplateMapper.deleteCircle(id);
}
public PanelTemplateWithBLOBs findOne(String panelId){
return panelTemplateMapper.selectByPrimaryKey(panelId);
}
public List<PanelTemplateDTO> find(PanelTemplateRequest panelTemplateRequest){
List<PanelTemplateDTO> panelTemplateList = extPanelTemplateMapper.panelTemplateList(panelTemplateRequest);
return panelTemplateList;
}
}
...@@ -65,7 +65,9 @@ ...@@ -65,7 +65,9 @@
<!--要生成的数据库表 --> <!--要生成的数据库表 -->
<!-- <table tableName="datasource"/>--> <!-- <table tableName="datasource"/>-->
<table tableName="panel_group"/> <!-- <table tableName="sys_dict"/>-->
<!-- <table tableName="sys_dict_item"/>-->
<table tableName="panel_template"/>
<!-- <table tableName="panel_design"/>--> <!-- <table tableName="panel_design"/>-->
......
...@@ -4,9 +4,14 @@ ...@@ -4,9 +4,14 @@
<el-row class="panel-design-head"> <el-row class="panel-design-head">
<!--TODO 仪表盘头部区域--> <!--TODO 仪表盘头部区域-->
<span>{{ panelInfo.name || '测试仪表板' }}</span> <span>{{ panelInfo.name || '测试仪表板' }}</span>
<span style="float: right;margin-right: 10px">
<el-tooltip content="保存为模板">
<el-button class="el-icon-folder-checked" size="mini" circle @click="saveToTemplate" />
</el-tooltip>
</span>
<span style="float: right;margin-right: 10px"> <span style="float: right;margin-right: 10px">
<el-tooltip content="导出为模板"> <el-tooltip content="导出为模板">
<el-button class="el-icon-download" size="mini" circle @click="saveToTemplate" /> <el-button class="el-icon-download" size="mini" circle @click="downloadToTemplate" />
</el-tooltip> </el-tooltip>
</span> </span>
<span style="float: right;margin-right: 10px"> <span style="float: right;margin-right: 10px">
...@@ -27,21 +32,32 @@ ...@@ -27,21 +32,32 @@
请从左侧选择仪表盘 请从左侧选择仪表盘
</el-row> </el-row>
</el-col> </el-col>
<el-dialog
:title="templateSaveTitle"
:visible.sync="templateSaveShow"
custom-class="de-dialog"
>
<save-to-template />
</el-dialog>
</el-row> </el-row>
</template> </template>
<script> <script>
import Preview from '@/components/canvas/components/Editor/Preview' import Preview from '@/components/canvas/components/Editor/Preview'
import SaveToTemplate from '@/views/panel/list/SaveToTemplate'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import html2canvas from 'html2canvas' import html2canvas from 'html2canvas'
import FileSaver from 'file-saver' import FileSaver from 'file-saver'
export default { export default {
name: 'PanelViewShow', name: 'PanelViewShow',
components: { Preview }, components: { Preview, SaveToTemplate },
data() { data() {
return { return {
showMain: true showMain: true,
templateInfo: '',
templateSaveTitle: '保存为模板',
templateSaveShow: false
} }
}, },
computed: { computed: {
...@@ -68,20 +84,50 @@ export default { ...@@ -68,20 +84,50 @@ export default {
window.open(url, '_blank') window.open(url, '_blank')
}, },
saveToTemplate() { saveToTemplate() {
this.templateSaveShow = true
html2canvas(this.$refs.imageWrapper).then(canvas => { html2canvas(this.$refs.imageWrapper).then(canvas => {
debugger debugger
const snapShot = canvas.toDataURL('image/jpeg', 0.5) // 0.5是图片质量 const snapShot = canvas.toDataURL('image/jpeg', 0.2) // 0.2是图片质量
if (snapShot !== '') { if (snapShot !== '') {
const templateInfo = { this.templateInfo = {
snapShot: snapShot, snapShot: snapShot,
panelStyle: JSON.stringify(this.canvasStyleData), panelStyle: JSON.stringify(this.canvasStyleData),
panelData: JSON.stringify(this.componentData), panelData: JSON.stringify(this.componentData),
dynamicData: '' dynamicData: ''
} }
const blob = new Blob([JSON.stringify(templateInfo)], { type: '' }) }
})
},
downloadToTemplate() {
html2canvas(this.$refs.imageWrapper).then(canvas => {
debugger
const snapShot = canvas.toDataURL('image/jpeg', 0.2) // 0.2是图片质量
if (snapShot !== '') {
this.templateInfo = {
snapShot: snapShot,
panelStyle: JSON.stringify(this.canvasStyleData),
panelData: JSON.stringify(this.componentData),
dynamicData: ''
}
const blob = new Blob([JSON.stringify(this.templateInfo)], { type: '' })
FileSaver.saveAs(blob, this.$store.state.panel.panelInfo.name + '-TEMPLATE.DE') FileSaver.saveAs(blob, this.$store.state.panel.panelInfo.name + '-TEMPLATE.DE')
} }
}) })
},
refreshTemplateInfo() {
this.templateInfo = ''
html2canvas(this.$refs.imageWrapper).then(canvas => {
debugger
const snapShot = canvas.toDataURL('image/jpeg', 0.2) // 0.2是图片质量
if (snapShot !== '') {
this.templateInfo = {
snapShot: snapShot,
panelStyle: JSON.stringify(this.canvasStyleData),
panelData: JSON.stringify(this.componentData),
dynamicData: ''
}
}
})
} }
} }
......
<template>
<el-row>
<el-row>
<el-input v-model="name" placeholder="名称" />
</el-row>
<el-row class="de-tab">
<div class="my_table">
<el-table
ref="table"
:data="data.filter(node => !keyWordSearch || node[fieldName].toLowerCase().includes(keyWordSearch.toLowerCase()))"
style="width: 100%"
:row-style="{height: '35px'}"
highlight-current-row
@current-change="clickChange"
>
<el-table-column :label="columnLabel" :column-key="fieldName" :prop="fieldName" />
<el-table-column align="right">
<template slot="header">
<el-input v-model="keyWordSearch" size="mini" placeholder="输入关键字搜索" />
</template>
<template slot-scope="scope">
<el-radio v-model="tableRadio" :label="scope.row"><i /></el-radio>
</template>
</el-table-column>
</el-table>
</div>
</el-row>
<el-row class="root-class">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</el-row>
</el-row>
</template>
<script>
import { post } from '@/api/panel/panel'
export default {
name: 'SaveToTemplate',
data() {
return {
data: [],
name: '',
fieldName: 'name',
tableRadio: null,
keyWordSearch: '',
columnLabel: '所属类别'
}
},
created() {
this.search()
},
methods: {
search() {
const param = {
template_type: 'self',
level: '0'
}
post('/template/templateList', param).then(response => {
this.data = response.data
})
},
setCheckNodes() {
this.data.forEach(node => {
const nodeId = node.userId
this.shares.includes(nodeId) && this.$refs.table.toggleRowSelection(node, true)
})
},
clickChange(item) {
this.tableRadio = item
},
cancel() {
this.$refs[this.activeName].cancel()
this.$emit('close-grant', 0)
}
}
}
</script>
<style scoped>
.de-tab {
border:1px solid #E6E6E6;
min-height:200px !important;
max-height:300px !important;
overflow:auto;
margin-top: 10px;
}
.my_table >>> .el-table__row>td{
/* 去除表格线 */
border: none;
padding: 0 0;
}
.my_table >>> .el-table th.is-leaf {
/* 去除上边框 */
border: none;
}
.my_table >>> .el-table::before{
/* 去除下边框 */
height: 0;
}
.root-class {
margin: 15px 0px 5px;
text-align: center;
}
</style>
<template xmlns:el-col="http://www.w3.org/1999/html">
<el-col>
<el-row>
<div class="block">
<el-form>
<el-form-item class="form-item">
<el-input
v-model="systemTemplateFilterText"
placeholder="输入关键字进行过滤"
size="mini"
clearable
prefix-icon="el-icon-search"
/>
</el-form-item>
</el-form>
<el-tree
ref="systemTemplateTree"
:default-expanded-keys="defaultExpandedKeys"
:data="systemTemplateList"
node-key="id"
:expand-on-click-node="true"
:filter-node-method="filterNode"
highlight-current
@node-click="nodeClick"
>
<span slot-scope="{ data }" class="custom-tree-node">
<span>
<span>
<el-button
icon="el-icon-picture-outline"
type="text"
/>
</span>
<span style="margin-left: 6px">{{ data.name }}</span>
</span>
</span>
</el-tree>
</div>
</el-row>
</el-col>
</template>
<script>
import { get, post } from '@/api/panel/panel'
export default {
name: 'SystemTemplateList',
components: { },
data() {
return {
systemTemplateFilterText: '',
defaultExpandedKeys: [],
systemTemplateList: [],
currentTemplateShowList: []
}
},
computed: {
},
watch: {
systemTemplateFilterText(val) {
this.$refs.systemTemplateTree.filter(val)
}
},
mounted() {
this.getTree()
},
methods: {
filterNode(value, data) {
if (!value) return true
return data.label.indexOf(value) !== -1
},
getTree() {
const request = {
templateType: 'system',
level: '0'
}
post('/template/templateList', request).then(res => {
this.systemTemplateList = res.data
if (this.systemTemplateList && this.systemTemplateList.length > 0) {
const id = this.systemTemplateList[0].id
// this.currentNodeKey = id
// this.$refs['systemTemplateTree'].setCurrentKey(id)
this.$emit('showCurrentTemplate', id)
}
})
},
nodeClick(data, node) {
console.log('nodeClick')
debugger
this.$emit('showCurrentTemplate', data.id)
}
}
}
</script>
<style scoped>
.custom-tree-node {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
padding-right: 8px;
}
</style>
<template>
<div class="testcase-template">
<div :style="classBackground" class="template-img">
<i class="el-icon-error" @click.stop="templateDelete" />
</div>
<span class="demonstration">{{ template.name }}</span>
</div>
</template>
<script>
import { get, post } from '@/api/panel/panel'
export default {
name: 'TemplateItem',
props: {
template: {
type: Object,
default() {
return {}
}
}
},
computed: {
classBackground() {
return {
background: `url(${this.template.snapshot}) no-repeat`,
'background-size': '100%,100%'
}
}
},
methods: {
templateDelete() {
console.log('templateDelete')
},
handleDelete() {
console.log('handleDelete')
}
}
}
</script>
<style scoped>
.testcase-template {
display: inline-block;
margin: 10px 30px;
width: 150px;
}
.demonstration {
display: block;
text-align: center;
margin: 10px auto;
width: 150px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.template-img {
height: 150px;
width: 200px;
margin: 0 auto;
box-shadow: 0 0 2px 0 rgba(31,31,31,0.15), 0 1px 2px 0 rgba(31,31,31,0.15);
border: solid 2px #fff;
box-sizing: border-box;
border-radius: 3px;
background-size: 100%,100%;
}
.template-img:hover {
border: solid 1px #4b8fdf;
border-radius: 3px;
color: deepskyblue;
cursor: pointer;
}
.template-img > i{
display:none;
float: right;
color: gray;
margin: 2px;
}
.template-img > i:hover {
color: red;
}
.template-img:hover > .el-icon-error {
display: inline;
}
</style>
<template>
<de-container>
<de-aside-container>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane name="SystemTemplate">
<span slot="label"><i class="el-icon-document" />系统模板</span>
<system-template-list @showCurrentTemplate="showCurrentTemplate" />
</el-tab-pane>
<el-tab-pane name="UserTemplate">
<span slot="label"><i class="el-icon-star-off" />用户模板</span>
开发中...
</el-tab-pane>
</el-tabs>
</de-aside-container>
<de-main-container>
<!-- <el-card class="el-card-template">-->
<template-item
v-for="item in currentTemplateShowList"
:key="item.id"
:template="item"
/>
<!-- </el-card>-->
</de-main-container>
</de-container>
</template>
<script>
import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer'
import DeAsideContainer from '@/components/dataease/DeAsideContainer'
import SystemTemplateList from './component/SystemTemplateList'
import TemplateItem from './component/TemplateItem'
import { get, post } from '@/api/panel/panel'
export default {
name: 'PanelMain',
components: { DeMainContainer, DeContainer, DeAsideContainer, SystemTemplateList, TemplateItem },
data() {
return {
activeName: 'SystemTemplate',
showShare: false,
currentTemplateShowList: []
}
},
methods: {
handleClick(tab, event) {
// 点击分析面板需要刷新分享内容
if (tab.name === 'panels_share') {
this.refreshShare()
}
},
refreshShare() {
this.showShare = false
this.$nextTick(() => (this.showShare = true))
},
get() {
this.showShare = false
this.$nextTick(() => (this.showShare = true))
},
showCurrentTemplate(currentPid) {
if (currentPid) {
post('/template/templateList', { pid: currentPid }).then(response => {
this.currentTemplateShowList = response.data
})
}
}
}
}
</script>
<style scoped>
.el-card-template {
min-width: 260px;
min-width: 460px;
width: 100%;
height: 100%;
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论