Skip to content

D
dataease
Unverified 提交 381789bb authored 作者: 王嘉豪's avatar 王嘉豪 提交者： GitHub
浏览文件
操作

Merge pull request #1266 from dataease/pr@dev@feat_authmodel-view

feat: 增加授权模型统一查询功能，视图使授权模型查询
上级 9e87a08a c15c58f6
显示空白字符变更
内嵌 并排
正在显示 包含 877 行增加 和 396 行删除
backend/src/main/java/io/dataease/base/domain/VAuthModel.java
浏览文件 @ 381789bb
......@@ -19,5 +19,7 @@ public class VAuthModel implements Serializable {
private String createBy;
private Long level;
private static final long serialVersionUID = 1L;
}
\ No newline at end of file
backend/src/main/java/io/dataease/base/domain/VAuthModelExample.java
浏览文件 @ 381789bb
......@@ -593,6 +593,66 @@ public class VAuthModelExample {
addCriterion("create_by not between", value1, value2, "createBy");
return (Criteria) this;
}
public Criteria andLevelIsNull() {
addCriterion("`level` is null");
return (Criteria) this;
}
public Criteria andLevelIsNotNull() {
addCriterion("`level` is not null");
return (Criteria) this;
}
public Criteria andLevelEqualTo(Long value) {
addCriterion("`level` =", value, "level");
return (Criteria) this;
}
public Criteria andLevelNotEqualTo(Long value) {
addCriterion("`level` <>", value, "level");
return (Criteria) this;
}
public Criteria andLevelGreaterThan(Long value) {
addCriterion("`level` >", value, "level");
return (Criteria) this;
}
public Criteria andLevelGreaterThanOrEqualTo(Long value) {
addCriterion("`level` >=", value, "level");
return (Criteria) this;
}
public Criteria andLevelLessThan(Long value) {
addCriterion("`level` <", value, "level");
return (Criteria) this;
}
public Criteria andLevelLessThanOrEqualTo(Long value) {
addCriterion("`level` <=", value, "level");
return (Criteria) this;
}
public Criteria andLevelIn(List<Long> values) {
addCriterion("`level` in", values, "level");
return (Criteria) this;
}
public Criteria andLevelNotIn(List<Long> values) {
addCriterion("`level` not in", values, "level");
return (Criteria) this;
}
public Criteria andLevelBetween(Long value1, Long value2) {
addCriterion("`level` between", value1, value2, "level");
return (Criteria) this;
}
public Criteria andLevelNotBetween(Long value1, Long value2) {
addCriterion("`level` not between", value1, value2, "level");
return (Criteria) this;
}
}
public static class Criteria extends GeneratedCriteria {
......
backend/src/main/java/io/dataease/base/mapper/VAuthModelMapper.xml
浏览文件 @ 381789bb
......@@ -9,6 +9,7 @@
<result column="model_inner_type" jdbcType="VARCHAR" property="modelInnerType" />
<result column="auth_type" jdbcType="VARCHAR" property="authType" />
<result column="create_by" jdbcType="VARCHAR" property="createBy" />
<result column="level" jdbcType="BIGINT" property="level" />
</resultMap>
<resultMap extends="BaseResultMap" id="ResultMapWithBLOBs" type="io.dataease.base.domain.VAuthModelWithBLOBs">
<result column="name" jdbcType="LONGVARCHAR" property="name" />
......@@ -73,7 +74,7 @@
</where>
</sql>
<sql id="Base_Column_List">
id, pid, node_type, model_type, model_inner_type, auth_type, create_by
id, pid, node_type, model_type, model_inner_type, auth_type, create_by, `level`
</sql>
<sql id="Blob_Column_List">
`name`, `label`
......@@ -117,12 +118,12 @@
<insert id="insert" parameterType="io.dataease.base.domain.VAuthModelWithBLOBs">
insert into v_auth_model (id, pid, node_type,
model_type, model_inner_type, auth_type,
create_by, `name`, `label`
)
create_by, `level`, `name`,
`label`)
values (#{id,jdbcType=VARCHAR}, #{pid,jdbcType=VARCHAR}, #{nodeType,jdbcType=VARCHAR},
#{modelType,jdbcType=VARCHAR}, #{modelInnerType,jdbcType=VARCHAR}, #{authType,jdbcType=VARCHAR},
#{createBy,jdbcType=VARCHAR}, #{name,jdbcType=LONGVARCHAR}, #{label,jdbcType=LONGVARCHAR}
)
#{createBy,jdbcType=VARCHAR}, #{level,jdbcType=BIGINT}, #{name,jdbcType=LONGVARCHAR},
#{label,jdbcType=LONGVARCHAR})
</insert>
<insert id="insertSelective" parameterType="io.dataease.base.domain.VAuthModelWithBLOBs">
insert into v_auth_model
......@@ -148,6 +149,9 @@
<if test="createBy != null">
create_by,
</if>
<if test="level != null">
`level`,
</if>
<if test="name != null">
`name`,
</if>
......@@ -177,6 +181,9 @@
<if test="createBy != null">
#{createBy,jdbcType=VARCHAR},
</if>
<if test="level != null">
#{level,jdbcType=BIGINT},
</if>
<if test="name != null">
#{name,jdbcType=LONGVARCHAR},
</if>
......@@ -215,6 +222,9 @@
<if test="record.createBy != null">
create_by = #{record.createBy,jdbcType=VARCHAR},
</if>
<if test="record.level != null">
`level` = #{record.level,jdbcType=BIGINT},
</if>
<if test="record.name != null">
`name` = #{record.name,jdbcType=LONGVARCHAR},
</if>
......@@ -235,6 +245,7 @@
model_inner_type = #{record.modelInnerType,jdbcType=VARCHAR},
auth_type = #{record.authType,jdbcType=VARCHAR},
create_by = #{record.createBy,jdbcType=VARCHAR},
`level` = #{record.level,jdbcType=BIGINT},
`name` = #{record.name,jdbcType=LONGVARCHAR},
`label` = #{record.label,jdbcType=LONGVARCHAR}
<if test="_parameter != null">
......@@ -249,7 +260,8 @@
model_type = #{record.modelType,jdbcType=VARCHAR},
model_inner_type = #{record.modelInnerType,jdbcType=VARCHAR},
auth_type = #{record.authType,jdbcType=VARCHAR},
create_by = #{record.createBy,jdbcType=VARCHAR}
create_by = #{record.createBy,jdbcType=VARCHAR},
`level` = #{record.level,jdbcType=BIGINT}
<if test="_parameter != null">
<include refid="Update_By_Example_Where_Clause" />
</if>
......
backend/src/main/java/io/dataease/base/mapper/ext/ExtPanelGroupMapper.java
浏览文件 @ 381789bb
......@@ -12,14 +12,11 @@ public interface ExtPanelGroupMapper {
List<PanelGroupDTO> panelGroupListDefault(PanelGroupRequest request);
//会级联删除pid 下的所有数据
int deleteCircle(@Param("pid") String pid);
PanelGroupDTO panelGroup(String id);
void copyPanelView(@Param("pid") String panelId);
......
backend/src/main/java/io/dataease/base/mapper/ext/ExtVAuthModelMapper.java 0 → 100644
浏览文件 @ 381789bb
package io.dataease.base.mapper.ext;
import io.dataease.controller.request.authModel.VAuthModelRequest;
import io.dataease.dto.authModel.VAuthModelDTO;
import org.apache.ibatis.annotations.Param;
import java.util.List;
public interface ExtVAuthModelMapper {
List<VAuthModelDTO> queryAuthModel (@Param("request") VAuthModelRequest request);
}
backend/src/main/java/io/dataease/base/mapper/ext/ExtVAuthModelMapper.xml 0 → 100644
浏览文件 @ 381789bb
<?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.ExtVAuthModelMapper">
<resultMap extends="io.dataease.base.mapper.VAuthModelMapper.ResultMapWithBLOBs" id="ExtResultMap"
type="io.dataease.dto.authModel.VAuthModelDTO">
<result column="privileges" jdbcType="VARCHAR" property="privileges"/>
</resultMap>
<select id="queryAuthModel" resultMap="ExtResultMap">
SELECT
v_auth_model.id,
v_auth_model.name,
v_auth_model.label,
v_auth_model.pid,
v_auth_model.node_type,
v_auth_model.model_type,
v_auth_model.model_inner_type,
v_auth_model.auth_type,
v_auth_model.create_by,
v_auth_model.level,
authInfo.PRIVILEGES AS `privileges`
FROM
( SELECT GET_V_AUTH_MODEL_ID_P_USE ( #{request.userId}, #{request.modelType} ) cids ) t,
v_auth_model
LEFT JOIN (
SELECT
auth_source,
group_concat( DISTINCT sys_auth_detail.privilege_extend ) AS `privileges`
FROM
(
`sys_auth`
LEFT JOIN `sys_auth_detail` ON ((
`sys_auth`.`id` = `sys_auth_detail`.`auth_id`
)))
WHERE
sys_auth_detail.privilege_value = #{request.userId}
AND sys_auth.auth_source_type = #{request.modelType}
AND (
(
sys_auth.auth_target_type = 'dept'
AND sys_auth.auth_target IN ( SELECT dept_id FROM sys_user WHERE user_id = #{request.userId} )
)
OR (
sys_auth.auth_target_type = 'user'
AND sys_auth.auth_target = #{request.userId}
)
OR (
sys_auth.auth_target_type = 'role'
AND sys_auth.auth_target IN ( SELECT role_id FROM sys_users_roles WHERE user_id = #{request.userId} )
)
)
GROUP BY
`sys_auth`.`auth_source`
) authInfo ON v_auth_model.id = authInfo.auth_source
WHERE
FIND_IN_SET( v_auth_model.id, cids )
</select>
</mapper>
backend/src/main/java/io/dataease/controller/authModel/VAuthModelController.java
浏览文件 @ 381789bb
package io.dataease.controller.authModel;
import com.github.xiaoymin.knife4j.annotations.ApiSupport;
import io.dataease.controller.request.authModel.VAuthModelRequest;
import io.dataease.dto.authModel.VAuthModelDTO;
import io.dataease.service.authModel.VAuthModelService;
import io.swagger.annotations.Api;
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;
import javax.annotation.Resource;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021/11/5
......@@ -16,4 +24,12 @@ import org.springframework.web.bind.annotation.RestController;
@RequestMapping("authModel")
public class VAuthModelController {
@Resource
private VAuthModelService vAuthModelService;
@PostMapping("/queryAuthModel")
public List<VAuthModelDTO> queryAuthModel(@RequestBody VAuthModelRequest request){
return vAuthModelService.queryAuthModel(request);
}
}
backend/src/main/java/io/dataease/controller/request/authModel/VAuthModelRequest.java 0 → 100644
浏览文件 @ 381789bb
package io.dataease.controller.request.authModel;
import io.dataease.dto.authModel.VAuthModelDTO;
import lombok.Data;
/**
* Author: wangjiahao
* Date: 2021/11/24
* Description:
*/
@Data
public class VAuthModelRequest extends VAuthModelDTO {
private String userId;
}
backend/src/main/java/io/dataease/dto/authModel/VAuthModelDTO.java
浏览文件 @ 381789bb
package io.dataease.dto.authModel;
import io.dataease.base.domain.VAuthModel;
import io.dataease.base.domain.VAuthModelWithBLOBs;
import io.dataease.commons.model.ITreeBase;
import lombok.Data;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021/11/5
* Description:
*/
public class VAuthModelDTO extends VAuthModel {
@Data
public class VAuthModelDTO extends VAuthModelWithBLOBs implements ITreeBase<VAuthModelDTO> {
private String privileges;
private List<VAuthModelDTO> children;
}
backend/src/main/java/io/dataease/service/authModel/VAuthModelService.java 0 → 100644
浏览文件 @ 381789bb
package io.dataease.service.authModel;
import io.dataease.base.mapper.ext.ExtVAuthModelMapper;
import io.dataease.commons.utils.AuthUtils;
import io.dataease.commons.utils.TreeUtils;
import io.dataease.controller.request.authModel.VAuthModelRequest;
import io.dataease.dto.authModel.VAuthModelDTO;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
import java.util.List;
/**
* Author: wangjiahao
* Date: 2021/11/24
* Description:
*/
@Service
public class VAuthModelService {
@Resource
private ExtVAuthModelMapper extVAuthModelMapper;
public List<VAuthModelDTO> queryAuthModel(VAuthModelRequest request){
request.setUserId(String.valueOf(AuthUtils.getUser().getUserId()));
List<VAuthModelDTO> result = extVAuthModelMapper.queryAuthModel(request);
return TreeUtils.mergeTree(result );
}
}
backend/src/main/resources/generatorConfig.xml
浏览文件 @ 381789bb
......@@ -65,7 +65,7 @@
<!--要生成的数据库表 -->
<table tableName="sys_msg_channel"/>
<table tableName="v_auth_model"/>
</context>
......
frontend/src/api/authModel/authModel.js 0 → 100644
浏览文件 @ 381789bb
import request from '@/utils/request'
export function queryAuthModel(data) {
return request({
url: 'authModel/queryAuthModel',
method: 'post',
loading: true,
data
})
}
frontend/src/api/chart/chart.js
浏览文件 @ 381789bb
......@@ -60,3 +60,14 @@ export function checkSameDataSet(viewIdSource, viewIdTarget) {
loading: false
})
}
export function ajaxGetDataOnly(id, data) {
return request({
url: '/chart/view/getData/' + id,
method: 'post',
loading: true,
hideMsg: true,
timeout: 30000,
data
})
}
frontend/src/views/chart/group/Group.vue
浏览文件 @ 381789bb
<template xmlns:el-col="http://www.w3.org/1999/html">
<el-col class="tree-style">
<!-- group -->
<el-col v-if="!sceneMode">
<el-col>
<el-row class="title-css">
<span class="title-text">
{{ $t('chart.datalist') }}
......@@ -9,44 +8,55 @@
<el-button icon="el-icon-plus" type="text" size="mini" style="float: right;" @click="add('group')" />
</el-row>
<el-divider />
<el-row>
<el-form>
<el-form-item class="form-item">
<el-row style="margin-bottom: 10px">
<el-col :span="16">
<el-input
v-model="search"
v-model="filterText"
size="mini"
:placeholder="$t('chart.search')"
:placeholder="$t('commons.search')"
prefix-icon="el-icon-search"
clearable
class="main-area-input"
/>
</el-form-item>
</el-form>
</el-col>
<el-col :span="8">
<el-dropdown>
<el-button size="mini" type="primary">
{{ searchMap[searchType] }}<i class="el-icon-arrow-down el-icon--right" />
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="searchTypeClick('all')">{{ $t('commons.all') }}</el-dropdown-item>
<el-dropdown-item @click.native="searchTypeClick('folder')">{{ this.$t('commons.folder') }}
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-col>
</el-row>
<el-col class="custom-tree-container">
<div class="block">
<el-tree
ref="asyncTree"
ref="chartTreeRef"
:default-expanded-keys="expandedArray"
:data="tData"
node-key="id"
:expand-on-click-node="true"
:load="loadNode"
lazy
:props="treeProps"
highlight-current
:expand-on-click-node="true"
:filter-node-method="filterNode"
@node-click="nodeClick"
>
<span v-if="data.type ==='group'" slot-scope="{ node, data }" class="custom-tree-node father">
<span v-if="data.modelInnerType ==='group'" slot-scope="{ node, data }" class="custom-tree-node father">
<span style="display: flex;flex: 1;width: 0;">
<span>
<i class="el-icon-folder" />
</span>
<span style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" :title="data.name">{{ data.name }}</span>
<span
style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"
:title="data.name"
>{{ data.name }}</span>
</span>
<span v-if="hasDataPermission('manage',data.privileges)" class="child">
<span v-if="data.type ==='group'" @click.stop>
<span v-if="data.modelInnerType ==='group'" @click.stop>
<el-dropdown trigger="click" size="small" @command="clickAdd">
<span class="el-dropdown-link">
<el-button
......@@ -91,8 +101,11 @@
</span>
<span v-else slot-scope="{ node, data }" class="custom-tree-node-list father">
<span style="display: flex;flex: 1;width: 0;">
<span><svg-icon :icon-class="data.type" /></span>
<span style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" :title="data.name">{{ data.name }}</span>
<span><svg-icon :icon-class="data.modelInnerType" /></span>
<span
style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"
:title="data.name"
>{{ data.name }}</span>
</span>
<span v-if="hasDataPermission('manage',data.privileges)" class="child">
<span style="margin-left: 12px;" @click.stop>
......@@ -125,7 +138,12 @@
<!--group add/edit-->
<el-dialog v-dialogDrag :title="dialogTitle" :visible="editGroup" :show-close="false" width="30%">
<el-form ref="groupForm" :model="groupForm" :rules="groupFormRules" @keypress.enter.native="saveGroup(groupForm)">
<el-form
ref="groupForm"
:model="groupForm"
:rules="groupFormRules"
@keypress.enter.native="saveGroup(groupForm)"
>
<el-form-item :label="$t('commons.name')" prop="name">
<el-input v-model="groupForm.name" />
</el-form-item>
......@@ -219,28 +237,60 @@
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeCreateChart">{{ $t('chart.cancel') }}</el-button>
<el-button v-if="createActive === 2" type="primary" size="mini" @click="createPreview">{{ $t('chart.preview') }}</el-button>
<el-button v-if="createActive === 1" type="primary" size="mini" :disabled="!table.id || !currGroup.id" @click="createNext">{{ $t('chart.next') }}</el-button>
<el-button v-if="createActive === 2" type="primary" size="mini" :disabled="!table.id || !currGroup.id || !view.type" @click="createChart">{{ $t('chart.confirm') }}</el-button>
<el-button v-if="createActive === 2" type="primary" size="mini" @click="createPreview">{{ $t('chart.preview')
}}
</el-button>
<el-button
v-if="createActive === 1"
type="primary"
size="mini"
:disabled="!table.id || !currGroup.id"
@click="createNext"
>{{ $t('chart.next') }}
</el-button>
<el-button
v-if="createActive === 2"
type="primary"
size="mini"
:disabled="!table.id || !currGroup.id || !view.type"
@click="createChart"
>{{ $t('chart.confirm') }}
</el-button>
</div>
</el-dialog>
<!--移动分组-->
<el-dialog v-dialogDrag :title="moveDialogTitle" :visible="moveGroup" :show-close="false" width="30%" class="dialog-css">
<el-dialog
v-dialogDrag
:title="moveDialogTitle"
:visible="moveGroup"
:show-close="false"
width="30%"
class="dialog-css"
>
<group-move-selector :item="groupForm" @targetGroup="targetGroup" />
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeMoveGroup()">{{ $t('dataset.cancel') }}</el-button>
<el-button :disabled="groupMoveConfirmDisabled" type="primary" size="mini" @click="saveMoveGroup(tGroup)">{{ $t('dataset.confirm') }}
<el-button :disabled="groupMoveConfirmDisabled" type="primary" size="mini" @click="saveMoveGroup(tGroup)">{{
$t('dataset.confirm') }}
</el-button>
</div>
</el-dialog>
<!--移动视图-->
<el-dialog v-dialogDrag :title="moveDialogTitle" :visible="moveDs" :show-close="false" width="30%" class="dialog-css">
<el-dialog
v-dialogDrag
:title="moveDialogTitle"
:visible="moveDs"
:show-close="false"
width="30%"
class="dialog-css"
>
<chart-move-selector :item="dsForm" @targetDs="targetDs" />
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeMoveDs()">{{ $t('dataset.cancel') }}</el-button>
<el-button :disabled="dsMoveConfirmDisabled" type="primary" size="mini" @click="saveMoveDs(tDs)">{{ $t('dataset.confirm') }}
<el-button :disabled="dsMoveConfirmDisabled" type="primary" size="mini" @click="saveMoveDs(tDs)">{{
$t('dataset.confirm') }}
</el-button>
</div>
</el-dialog>
......@@ -249,6 +299,7 @@
<script>
import { post, chartGroupTree } from '@/api/chart/chart'
import { queryAuthModel } from '@/api/authModel/authModel'
import TableSelector from '../view/TableSelector'
import GroupMoveSelector from '../components/TreeSelector/GroupMoveSelector'
import ChartMoveSelector from '../components/TreeSelector/ChartMoveSelector'
......@@ -359,41 +410,34 @@ export default {
renderOptions: [
{ name: 'AntV', value: 'antv' },
{ name: 'ECharts', value: 'echarts' }
]
],
searchPids: [], // 查询命中的pid
filterText: '',
searchType: 'all',
searchMap: {
all: this.$t('commons.all'),
folder: this.$t('commons.folder')
}
}
},
computed: {
// sceneData: function() {
// this.reviewChartList()
// return this.$store.state.chart.chartSceneData
// }
},
watch: {
search(val) {
// if (val && val !== '') {
// this.chartData = JSON.parse(JSON.stringify(this.tables.filter(ele => { return ele.name.includes(val) })))
// } else {
// this.chartData = JSON.parse(JSON.stringify(this.tables))
// }
this.$emit('switchComponent', { name: '' })
this.tData = []
this.expandedArray = []
if (this.timer) {
clearTimeout(this.timer)
}
this.timer = setTimeout(() => {
this.getTreeData(val)
}, (val && val !== '') ? 500 : 0)
},
saveStatus() {
this.refreshNodeBy(this.saveStatus.sceneId)
},
adviceGroupId() {
// 仪表板新建视图建议的存放路径
if (this.optFrom === 'panel') {
this.currGroup['id'] = this.adviceGroupId
}
},
filterText(val) {
this.searchPids = []
this.$refs.chartTreeRef.filter(val)
},
searchType(val) {
this.searchPids = []
this.$refs.chartTreeRef.filter(this.filterText)
}
},
mounted() {
this.treeNode(this.groupForm)
......@@ -424,7 +468,7 @@ export default {
clickMore(param) {
switch (param.type) {
case 'rename':
this.add(param.data.type)
this.add(param.data.modelInnerType)
this.groupForm = JSON.parse(JSON.stringify(param.data))
break
case 'move':
......@@ -479,15 +523,9 @@ export default {
type: 'success',
showClose: true
})
// this.treeNode(this.groupForm)
this.refreshNodeBy(group.pid)
this.treeNode()
})
} else {
// this.$message({
// message: this.$t('commons.input_content'),
// type: 'error',
// showClose: true
// })
return false
}
})
......@@ -504,10 +542,7 @@ export default {
type: 'success',
showClose: true
})
// this.chartTree()
this.refreshNodeBy(view.sceneId)
// this.$router.push('/chart/home')
// this.$emit('switchComponent', { name: '' })
this.treeNode()
this.$store.dispatch('chart/setTable', null)
})
} else {
......@@ -533,8 +568,7 @@ export default {
message: this.$t('chart.delete_success'),
showClose: true
})
// this.treeNode(this.groupForm)
this.refreshNodeBy(data.pid)
this.treeNode()
})
}).catch(() => {
})
......@@ -552,9 +586,7 @@ export default {
message: this.$t('chart.delete_success'),
showClose: true
})
// this.chartTree()
this.refreshNodeBy(data.sceneId)
// this.$router.push('/chart/home')
this.treeNode()
this.$emit('switchComponent', { name: '' })
this.$store.dispatch('chart/setTable', null)
})
......@@ -589,7 +621,7 @@ export default {
},
treeNode(group) {
post('/chart/group/treeNode', group).then(res => {
queryAuthModel({ modelType: 'chart' }).then(res => {
this.tData = res.data
})
},
......@@ -609,9 +641,17 @@ export default {
},
nodeClick(data, node) {
if (data.type !== 'group') {
if (data.modelInnerType !== 'group') {
this.$emit('switchComponent', { name: 'ChartEdit', param: data })
}
if (node.expanded) {
this.expandedArray.push(data.id)
} else {
const index = this.expandedArray.indexOf(data.id)
if (index > -1) {
this.expandedArray.splice(index, 1)
}
}
},
back() {
......@@ -704,18 +744,18 @@ export default {
view.customFilter = JSON.stringify([])
view.drillFields = JSON.stringify([])
view.extBubble = JSON.stringify([])
const _this = this
post('/chart/view/save', view).then(response => {
this.closeCreateChart()
this.$store.dispatch('chart/setTableId', null)
this.$store.dispatch('chart/setTableId', this.table.id)
// this.$router.push('/chart/chart-edit')
if (this.optFrom === 'panel') {
this.$emit('newViewInfo', { 'id': response.data.id })
} else {
this.$emit('switchComponent', { name: 'ChartEdit', param: response.data })
// this.$store.dispatch('chart/setViewId', response.data.id)
// this.chartTree()
this.refreshNodeBy(view.sceneId)
_this.expandedArray.push(response.data.sceneId)
_this.$refs.chartTreeRef.setCurrentKey(response.data.id)
_this.$emit('switchComponent', { name: 'ChartEdit', param: response.data })
_this.treeNode()
}
})
},
......@@ -767,22 +807,6 @@ export default {
}
},
refreshNodeBy(id) {
if (this.isTreeSearch) {
this.tData = []
this.expandedArray = []
this.searchTree(this.search)
} else {
if (!id || id === '0') {
this.treeNode(this.groupForm)
} else {
const node = this.$refs.asyncTree.getNode(id) // 通过节点id找到对应树节点对象
node.loaded = false
node.expand() // 主动调用展开节点方法，重新查询该节点下的所有子节点
}
}
},
moveTo(data) {
this.moveGroup = true
this.moveDialogTitle = this.$t('dataset.m1') + (data.name.length > 10 ? (data.name.substr(0, 10) + '...') : data.name) + this.$t('dataset.m2')
......@@ -802,8 +826,7 @@ export default {
this.groupForm.pid = this.tGroup.id
post('/chart/group/save', this.groupForm).then(res => {
this.closeMoveGroup()
// this.tree(this.groupForm)
this.refreshNodeBy(this.groupForm.pid)
this.treeNode()
})
},
targetGroup(val) {
......@@ -827,17 +850,12 @@ export default {
}
},
saveMoveDs() {
// if (this.tDs && this.tDs.type === 'group') {
// return
// }
const oldSceneId = this.dsForm.sceneId
const newSceneId = this.tDs.id
this.dsForm.sceneId = newSceneId
post('/chart/view/save', this.dsForm).then(res => {
this.closeMoveDs()
// this.tableTree()
this.refreshNodeBy(oldSceneId)
this.refreshNodeBy(newSceneId)
this.expandedArray.push(newSceneId)
this.treeNode()
})
},
targetDs(val) {
......@@ -849,72 +867,6 @@ export default {
}
},
searchTree(val) {
const queryCondition = {
// withExtend: 'parent',
// modelType: 'chart',
name: val
}
// authModel(queryCondition).then(res => {
// // this.highlights(res.data)
// this.tData = this.buildTree(res.data)
// // console.log(this.tData)
// })
post('/chart/view/search', queryCondition).then(res => {
this.tData = this.buildTree(res.data)
})
},
buildTree(arrs) {
const idMapping = arrs.reduce((acc, el, i) => {
acc[el[this.treeProps.id]] = i
return acc
}, {})
const roots = []
arrs.forEach(el => {
// 判断根节点 ###
// el.type = el.modelInnerType
// el.isLeaf = el.leaf
if (el[this.treeProps.parentId] === null || el[this.treeProps.parentId] === 0 || el[this.treeProps.parentId] === '0') {
roots.push(el)
return
}
// 用映射表找到父元素
const parentEl = arrs[idMapping[el[this.treeProps.parentId]]]
// 把当前元素添加到父元素的`children`数组中
parentEl.children = [...(parentEl.children || []), el]
// 设置展开节点 如果没有子节点则不进行展开
if (parentEl.children.length > 0) {
this.expandedArray.push(parentEl[this.treeProps.id])
}
})
return roots
},
// 高亮显示搜索内容
highlights(data) {
if (data && this.search && this.search.length > 0) {
const replaceReg = new RegExp(this.search, 'g')// 匹配关键字正则
const replaceString = '<span style="color: #0a7be0">' + this.search + '</span>' // 高亮替换v-html值
data.forEach(item => {
item.name = item.name.replace(replaceReg, replaceString) // 开始替换
item.label = item.label.replace(replaceReg, replaceString) // 开始替换
})
}
},
getTreeData(val) {
if (val) {
this.isTreeSearch = true
this.searchTree(val)
} else {
this.isTreeSearch = false
this.treeNode(this.groupForm)
}
},
getChartGroupTree() {
chartGroupTree({}).then(res => {
this.chartGroupTreeAvailable = res.data
......@@ -936,6 +888,27 @@ export default {
if (this.createActive < 2) {
this.createActive++
}
},
filterNode(value, data) {
if (!value) return true
if (this.searchType === 'folder') {
if (data.modelInnerType === 'group' && data.label.indexOf(value) !== -1) {
this.searchPids.push(data.id)
return true
}
if (this.searchPids.indexOf(data.pid) !== -1) {
if (data.modelInnerType === 'group') {
this.searchPids.push(data.id)
}
return true
}
} else {
return data.label.indexOf(value) !== -1
}
return false
},
searchTypeClick(searchTypeInfo) {
this.searchType = searchTypeInfo
}
}
}
......@@ -950,7 +923,7 @@ export default {
padding: 12px 0;
}
.custom-tree-container{
.custom-tree-container {
margin-top: 10px;
}
......@@ -960,7 +933,7 @@ export default {
align-items: center;
justify-content: space-between;
font-size: 14px;
padding-right:8px;
padding-right: 8px;
}
.custom-tree-node-list {
......@@ -969,10 +942,10 @@ export default {
align-items: center;
justify-content: space-between;
font-size: 14px;
padding:0 8px;
padding: 0 8px;
}
.tree-list>>>.el-tree-node__expand-icon.is-leaf{
.tree-list >>> .el-tree-node__expand-icon.is-leaf {
display: none;
}
......@@ -1004,63 +977,73 @@ export default {
padding: 10px 20px 20px;
}
.form-item>>>.el-form-item__label{
.form-item >>> .el-form-item__label {
font-size: 12px;
}
.scene-title{
.scene-title {
width: 100%;
display: flex;
}
.scene-title-name{
.scene-title-name {
width: 100%;
overflow: hidden;
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
}
.father .child {
/*display: none;*/
visibility: hidden;
}
.father:hover .child {
/*display: inline;*/
visibility: visible;
}
.tree-style {
padding: 10px 15px;
height: 100%;
overflow-y: auto;
}
/deep/ .vue-treeselect__control{
/deep/ .vue-treeselect__control {
height: 28px;
}
/deep/ .vue-treeselect__single-value{
color:#606266;
line-height: 28px!important;
/deep/ .vue-treeselect__single-value {
color: #606266;
line-height: 28px !important;
}
.render-select>>>.el-input__suffix{
.render-select >>> .el-input__suffix {
width: 20px;
}
.render-select>>>.el-input__inner{
.render-select >>> .el-input__inner {
padding-right: 10px;
padding-left: 6px;
}
.dialog-css>>>.el-step__title{
.dialog-css >>> .el-step__title {
font-weight: 400;
font-size: 12px;
}
.chart-icon{
.chart-icon {
width: 200px;
height: 200px;
}
.chart-box{
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
width:50%;
float:left;
.chart-box {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
width: 50%;
float: left;
height: 380px;
}
</style>
frontend/src/views/chart/view/ChartEdit.vue
浏览文件 @ 381789bb
<template>
<el-row v-loading="loading" style="height: 100%;overflow-y: hidden;width: 100%;">
<!-- <span v-show="false">{{ vId }}</span>-->
<!-- <el-row style="height: 40px;background-color: white" class="padding-lr"> -->
<el-row style="height: 40px;" class="padding-lr">
<span class="title-text" style="line-height: 40px;">{{ view.name }}</span>
<el-popover
......@@ -12,7 +10,6 @@
@hide="hideTab"
>
<dataset-chart-detail type="chart" :data="view" :tab-status="tabStatus" />
<!-- <svg-icon slot="reference" class="title-text" icon-class="more_v" style="cursor: pointer;" />-->
<i slot="reference" class="el-icon-warning icon-class" style="margin-left: 4px;cursor: pointer;" />
</el-popover>
<span style="float: right;line-height: 40px;">
......@@ -22,19 +19,13 @@
<el-button size="mini" type="primary" @click="closeEdit">
{{ $t('commons.save') }}
</el-button>
<!-- <el-button type="primary" size="mini" @click="save">-->
<!-- {{ $t('chart.confirm') }}-->
<!-- </el-button>-->
</span>
</el-row>
<el-row class="view-panel">
<el-tabs type="card" :stretch="true" class="tab-header">
<el-tab-pane :label="$t('chart.chart_data')" class="padding-tab" style="width: 360px">
<el-row class="view-panel">
<!-- <el-col style="width: 180px;border-right: 1px solid #E6E6E6;" > -->
<el-col class="theme-border-class" style="width: 180px;border-right: 1px solid #E6E6E6;">
<div style="display: flex;align-items: center;justify-content: center;padding: 6px;">
<el-input
v-model="searchField"
......@@ -44,8 +35,24 @@
clearable
class="main-area-input"
/>
<el-button :title="$t('dataset.edit_field')" :disabled="!table || !hasDataPermission('manage',table.privileges)" icon="el-icon-setting" type="text" size="mini" style="float: right;width: 20px;margin-left: 4px;" @click="editField" />
<el-button :title="$t('chart.change_ds')" :disabled="!hasDataPermission('manage',param.privileges)" icon="el-icon-refresh" type="text" size="mini" style="float: right;width: 20px;margin-left: 4px;" @click="changeDs" />
<el-button
:title="$t('dataset.edit_field')"
:disabled="!table || !hasDataPermission('manage',table.privileges)"
icon="el-icon-setting"
type="text"
size="mini"
style="float: right;width: 20px;margin-left: 4px;"
@click="editField"
/>
<el-button
:title="$t('chart.change_ds')"
:disabled="!hasDataPermission('manage',param.privileges)"
icon="el-icon-refresh"
type="text"
size="mini"
style="float: right;width: 20px;margin-left: 4px;"
@click="changeDs"
/>
</div>
<div class="padding-lr field-height">
<span>{{ $t('chart.dimension') }}</span>
......@@ -62,7 +69,11 @@
<span v-for="item in dimensionData" :key="item.id" class="item-dimension" :title="item.name">
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
<svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
<svg-icon
v-if="item.deType === 2 || item.deType === 3"
icon-class="field_value"
class="field-icon-value"
/>
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
{{ item.name }}
</span>
......@@ -81,10 +92,20 @@
@add="moveToQuota"
>
<transition-group>
<span v-for="item in quotaData" v-show="chart.type && (chart.type !== 'table-info' || (chart.type === 'table-info' && item.id !=='count'))" :key="item.id" class="item-quota" :title="item.name">
<span
v-for="item in quotaData"
v-show="chart.type && (chart.type !== 'table-info' || (chart.type === 'table-info' && item.id !=='count'))"
:key="item.id"
class="item-quota"
:title="item.name"
>
<svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
<svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
<svg-icon
v-if="item.deType === 2 || item.deType === 3"
icon-class="field_value"
class="field-icon-value"
/>
<svg-icon v-if="item.deType === 5" icon-class="field_location" class="field-icon-location" />
<span>{{ item.name }}</span>
</span>
......@@ -114,7 +135,13 @@
<span>
<span class="theme-border-class">{{ $t('chart.chart_type') }}</span>
<span style="float: right;">
<el-select v-model="view.render" class="render-select" style="width: 100px" size="mini" @change="calcData(true,'chart',true,true)">
<el-select
v-model="view.render"
class="render-select"
style="width: 100px"
size="mini"
@change="calcData(true,'chart',true,true)"
>
<el-option
v-for="item in renderOptions"
:key="item.value"
......@@ -150,7 +177,12 @@
<!-- </span>-->
<!-- </el-row>-->
</div>
<el-button slot="reference" size="mini" style="padding: 6px;" :disabled="!hasDataPermission('manage',param.privileges)">
<el-button
slot="reference"
size="mini"
style="padding: 6px;"
:disabled="!hasDataPermission('manage',param.privileges)"
>
{{ $t('chart.change_chart_type') }}
<i class="el-icon-caret-bottom" />
</el-button>
......@@ -159,47 +191,6 @@
</el-row>
</span>
</div>
<!-- <div style="height: 25vh;overflow:auto" class="padding-lr">-->
<!-- <span>-->
<!-- <span class="theme-border-class">{{ $t('chart.chart_type') }}</span>-->
<!-- <span style="float: right;">-->
<!-- <el-select v-model="view.render" class="render-select" style="width: 70px" size="mini" @change="save(true,'chart',true,true)">-->
<!-- <el-option-->
<!-- v-for="item in renderOptions"-->
<!-- :key="item.value"-->
<!-- :value="item.value"-->
<!-- :label="item.name"-->
<!-- />-->
<!-- </el-select>-->
<!-- </span>-->
<!-- </span>-->
<!-- <el-row>-->
<!-- <div>-->
<!-- <el-radio-group-->
<!-- v-model="view.type"-->
<!-- style="width: 100%"-->
<!-- :disabled="!hasDataPermission('manage',param.privileges)"-->
<!-- @change="save(true,'chart',true,true)"-->
<!-- >-->
<!-- <chart-type :chart="view" />-->
<!-- </el-radio-group>-->
<!-- </div>-->
<!-- </el-row>-->
<!-- <el-row class="title-text" style="color: #909399;">-->
<!-- <span>-->
<!-- <span v-show="chart.type && (chart.type.includes('pie') || chart.type.includes('funnel') || chart.type.includes('text') || chart.type.includes('gauge') || chart.type.includes('treemap'))">-->
<!-- Tips: {{ $t('chart.only_one_quota') }}-->
<!-- </span>-->
<!-- &lt;!&ndash; <span v-show="chart.type && (chart.type.includes('text'))">&ndash;&gt;-->
<!-- &lt;!&ndash; Tips: {{ $t('chart.only_one_result') }}&ndash;&gt;-->
<!-- &lt;!&ndash; </span>&ndash;&gt;-->
<!-- &lt;!&ndash; <span v-show="chart.type && chart.type.includes('gauge')">&ndash;&gt;-->
<!-- &lt;!&ndash; Tips: {{ $t('chart.only_one_quota') }},{{ $t('chart.only_one_result') }}&ndash;&gt;-->
<!-- &lt;!&ndash; </span>&ndash;&gt;-->
<!-- </span>-->
<!-- </el-row>-->
<!-- </div>-->
<div style="overflow:auto;border-top: 1px solid #e6e6e6" class="attr-style theme-border-class">
<el-row style="height: 100%;">
<el-row class="padding-lr">
......@@ -207,10 +198,22 @@
{{ $t('chart.result_count') }}
</span>
<el-row>
<el-radio-group v-model="view.resultMode" class="radio-span" :disabled="!hasDataPermission('manage',param.privileges)" size="mini" @change="calcData">
<el-radio-group
v-model="view.resultMode"
class="radio-span"
:disabled="!hasDataPermission('manage',param.privileges)"
size="mini"
@change="calcData"
>
<el-radio label="all"><span>{{ $t('chart.result_mode_all') }}</span></el-radio>
<el-radio label="custom">
<el-input v-model="view.resultCount" class="result-count" size="mini" :disabled="!hasDataPermission('manage',param.privileges)" @change="calcData" />
<el-input
v-model="view.resultCount"
class="result-count"
size="mini"
:disabled="!hasDataPermission('manage',param.privileges)"
@change="calcData"
/>
</el-radio>
</el-radio-group>
</el-row>
......@@ -231,11 +234,18 @@
/>
</span>
</el-row>
<el-row v-if="view.type !=='text' && view.type !== 'gauge' && view.type !== 'liquid'" class="padding-lr">
<el-row
v-if="view.type !=='text' && view.type !== 'gauge' && view.type !== 'liquid'"
class="padding-lr"
>
<span style="width: 80px;text-align: right;">
<span v-if="view.type && view.type.includes('table')">{{ $t('chart.drag_block_table_data_column') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')">{{ $t('chart.drag_block_type_axis') }}</span>
<span v-else-if="view.type && view.type.includes('pie')">{{ $t('chart.drag_block_pie_label') }}</span>
<span
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')"
>{{ $t('chart.drag_block_type_axis') }}</span>
<span
v-else-if="view.type && view.type.includes('pie')"
>{{ $t('chart.drag_block_pie_label') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ $t('chart.drag_block_funnel_split') }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ $t('chart.drag_block_radar_label') }}</span>
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.area') }}</span>
......@@ -243,7 +253,9 @@
<span v-else-if="view.type && view.type === 'word-cloud'">{{ $t('chart.drag_block_word_cloud_label') }}</span>
/
<span v-if="view.type && view.type !== 'table-info'">{{ $t('chart.dimension') }}</span>
<span v-else-if="view.type && view.type === 'table-info'">{{ $t('chart.dimension_or_quota') }}</span>
<span
v-else-if="view.type && view.type === 'table-info'"
>{{ $t('chart.dimension_or_quota') }}</span>
</span>
<draggable
v-model="view.xaxis"
......@@ -256,7 +268,17 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<dimension-item v-for="(item,index) in view.xaxis" :key="item.id" :param="param" :index="index" :item="item" @onDimensionItemChange="dimensionItemChange" @onDimensionItemRemove="dimensionItemRemove" @editItemFilter="showDimensionEditFilter" @onNameEdit="showRename" />
<dimension-item
v-for="(item,index) in view.xaxis"
:key="item.id"
:param="param"
:index="index"
:item="item"
@onDimensionItemChange="dimensionItemChange"
@onDimensionItemRemove="dimensionItemRemove"
@editItemFilter="showDimensionEditFilter"
@onNameEdit="showRename"
/>
</transition-group>
</draggable>
<div v-if="!view.xaxis || view.xaxis.length === 0" class="drag-placeholder-style">
......@@ -266,12 +288,18 @@
<el-row v-if="view.type !=='table-info'" class="padding-lr" style="margin-top: 6px;">
<span style="width: 80px;text-align: right;">
<span v-if="view.type && view.type.includes('table')">{{ $t('chart.drag_block_table_data_column') }}</span>
<span v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'waterfall')">{{ $t('chart.drag_block_value_axis') }}</span>
<span v-else-if="view.type && view.type.includes('pie')">{{ $t('chart.drag_block_pie_angel') }}</span>
<span
v-else-if="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'waterfall')"
>{{ $t('chart.drag_block_value_axis') }}</span>
<span
v-else-if="view.type && view.type.includes('pie')"
>{{ $t('chart.drag_block_pie_angel') }}</span>
<span v-else-if="view.type && view.type.includes('funnel')">{{ $t('chart.drag_block_funnel_width') }}</span>
<span v-else-if="view.type && view.type.includes('radar')">{{ $t('chart.drag_block_radar_length') }}</span>
<span v-else-if="view.type && view.type.includes('gauge')">{{ $t('chart.drag_block_gauge_angel') }}</span>
<span v-else-if="view.type && view.type.includes('text')">{{ $t('chart.drag_block_label_value') }}</span>
<span
v-else-if="view.type && view.type.includes('text')"
>{{ $t('chart.drag_block_label_value') }}</span>
<span v-else-if="view.type && view.type === 'map'">{{ $t('chart.chart_data') }}</span>
<span v-else-if="view.type && view.type.includes('tree')">{{ $t('chart.drag_block_treemap_size') }}</span>
<span v-else-if="view.type && view.type === 'chart-mix'">{{ $t('chart.drag_block_value_axis_main') }}</span>
......@@ -291,7 +319,18 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<quota-item v-for="(item,index) in view.yaxis" :key="item.id" :param="param" :index="index" :item="item" :chart="chart" @onQuotaItemChange="quotaItemChange" @onQuotaItemRemove="quotaItemRemove" @editItemFilter="showQuotaEditFilter" @onNameEdit="showRename" />
<quota-item
v-for="(item,index) in view.yaxis"
:key="item.id"
:param="param"
:index="index"
:item="item"
:chart="chart"
@onQuotaItemChange="quotaItemChange"
@onQuotaItemRemove="quotaItemRemove"
@editItemFilter="showQuotaEditFilter"
@onNameEdit="showRename"
/>
</transition-group>
</draggable>
<div v-if="!view.yaxis || view.yaxis.length === 0" class="drag-placeholder-style">
......@@ -315,7 +354,18 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<quota-ext-item v-for="(item,index) in view.yaxisExt" :key="item.id" :param="param" :index="index" :item="item" :chart="chart" @onQuotaItemChange="quotaItemChange" @onQuotaItemRemove="quotaItemRemove" @editItemFilter="showQuotaEditFilter" @onNameEdit="showRename" />
<quota-ext-item
v-for="(item,index) in view.yaxisExt"
:key="item.id"
:param="param"
:index="index"
:item="item"
:chart="chart"
@onQuotaItemChange="quotaItemChange"
@onQuotaItemRemove="quotaItemRemove"
@editItemFilter="showQuotaEditFilter"
@onNameEdit="showRename"
/>
</transition-group>
</draggable>
<div v-if="!view.yaxisExt || view.yaxisExt.length === 0" class="drag-placeholder-style">
......@@ -339,7 +389,16 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<chart-drag-item v-for="(item,index) in view.extStack" :key="item.id" :conf="'sort'" :param="param" :index="index" :item="item" @onItemChange="stackItemChange" @onItemRemove="stackItemRemove" />
<chart-drag-item
v-for="(item,index) in view.extStack"
:key="item.id"
:conf="'sort'"
:param="param"
:index="index"
:item="item"
@onItemChange="stackItemChange"
@onItemRemove="stackItemRemove"
/>
</transition-group>
</draggable>
<div v-if="!view.extStack || view.extStack.length === 0" class="drag-placeholder-style">
......@@ -369,7 +428,16 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<chart-drag-item v-for="(item,index) in view.extBubble" :key="item.id" :conf="'summary'" :param="param" :index="index" :item="item" @onItemChange="bubbleItemChange" @onItemRemove="bubbleItemRemove" />
<chart-drag-item
v-for="(item,index) in view.extBubble"
:key="item.id"
:conf="'summary'"
:param="param"
:index="index"
:item="item"
@onItemChange="bubbleItemChange"
@onItemRemove="bubbleItemRemove"
/>
</transition-group>
</draggable>
<div v-if="!view.extBubble || view.extBubble.length === 0" class="drag-placeholder-style">
......@@ -393,14 +461,26 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<filter-item v-for="(item,index) in view.customFilter" :key="item.id" :param="param" :index="index" :item="item" @onFilterItemRemove="filterItemRemove" @editItemFilter="showEditFilter" />
<filter-item
v-for="(item,index) in view.customFilter"
:key="item.id"
:param="param"
:index="index"
:item="item"
@onFilterItemRemove="filterItemRemove"
@editItemFilter="showEditFilter"
/>
</transition-group>
</draggable>
<div v-if="!view.customFilter || view.customFilter.length === 0" class="drag-placeholder-style">
<span class="drag-placeholder-style-span">{{ $t('chart.placeholder_field') }}</span>
</div>
</el-row>
<el-row v-if="view.type && !view.type.includes('table') && !view.type.includes('text') && !view.type.includes('gauge') && view.type !== 'liquid' && view.type !== 'word-cloud'" class="padding-lr" style="margin-top: 6px;">
<el-row
v-if="view.type && !view.type.includes('table') && !view.type.includes('text') && !view.type.includes('gauge') && view.type !== 'liquid' && view.type !== 'word-cloud'"
class="padding-lr"
style="margin-top: 6px;"
>
<span style="width: 80px;text-align: right;">
<span>{{ $t('chart.drill') }}</span>
/
......@@ -417,7 +497,15 @@
@update="calcData(true)"
>
<transition-group class="draggable-group">
<drill-item v-for="(item,index) in view.drillFields" :key="item.id" :param="param" :index="index" :item="item" @onDimensionItemChange="drillItemChange" @onDimensionItemRemove="drillItemRemove" />
<drill-item
v-for="(item,index) in view.drillFields"
:key="item.id"
:param="param"
:index="index"
:item="item"
@onDimensionItemChange="drillItemChange"
@onDimensionItemRemove="drillItemRemove"
/>
</transition-group>
</draggable>
<div v-if="!view.drillFields || view.drillFields.length === 0" class="drag-placeholder-style">
......@@ -431,11 +519,20 @@
</el-tab-pane>
<el-tab-pane :label="$t('chart.chart_style')" class="padding-tab" style="width: 360px;">
<el-row class="view-panel">
<div style="overflow:auto;border-right: 1px solid #e6e6e6;height: 100%;width: 100%;" class="attr-style theme-border-class">
<div
style="overflow:auto;border-right: 1px solid #e6e6e6;height: 100%;width: 100%;"
class="attr-style theme-border-class"
>
<el-row class="padding-lr">
<span class="title-text">{{ $t('chart.style_priority') }}</span>
<el-row>
<el-radio-group v-model="view.stylePriority" class="radio-span" :disabled="!hasDataPermission('manage',param.privileges)" size="mini" @change="calcStyle">
<el-radio-group
v-model="view.stylePriority"
class="radio-span"
:disabled="!hasDataPermission('manage',param.privileges)"
size="mini"
@change="calcStyle"
>
<el-radio label="view"><span>{{ $t('chart.chart') }}</span></el-radio>
<el-radio label="panel"><span>{{ $t('chart.dashboard') }}</span></el-radio>
</el-radio-group>
......@@ -447,49 +544,194 @@
<el-collapse-item name="color" :title="$t('chart.color')">
<color-selector :param="param" class="attr-selector" :chart="chart" @onColorChange="onColorChange" />
</el-collapse-item>
<el-collapse-item v-show="chart.type !== 'map' && chart.type !== 'waterfall' && chart.type !== 'word-cloud'" name="size" :title="$t('chart.size')">
<size-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onSizeChange="onSizeChange" />
<size-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onSizeChange="onSizeChange" />
<el-collapse-item
v-show="chart.type !== 'map' && chart.type !== 'waterfall' && chart.type !== 'word-cloud'"
name="size"
:title="$t('chart.size')"
>
<size-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onSizeChange="onSizeChange"
/>
<size-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onSizeChange="onSizeChange"
/>
</el-collapse-item>
<el-collapse-item v-show="!view.type.includes('table') && !view.type.includes('text') && view.type !== 'word-cloud'" name="label" :title="$t('chart.label')">
<label-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onLabelChange="onLabelChange" />
<label-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onLabelChange="onLabelChange" />
<el-collapse-item
v-show="!view.type.includes('table') && !view.type.includes('text') && view.type !== 'word-cloud'"
name="label"
:title="$t('chart.label')"
>
<label-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onLabelChange="onLabelChange"
/>
<label-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onLabelChange="onLabelChange"
/>
</el-collapse-item>
<el-collapse-item v-show="!view.type.includes('table') && !view.type.includes('text') && view.type !== 'liquid' && view.type !== 'gauge'" name="tooltip" :title="$t('chart.tooltip')">
<tooltip-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onTooltipChange="onTooltipChange" />
<tooltip-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onTooltipChange="onTooltipChange" />
<el-collapse-item
v-show="!view.type.includes('table') && !view.type.includes('text') && view.type !== 'liquid' && view.type !== 'gauge'"
name="tooltip"
:title="$t('chart.tooltip')"
>
<tooltip-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onTooltipChange="onTooltipChange"
/>
<tooltip-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onTooltipChange="onTooltipChange"
/>
</el-collapse-item>
</el-collapse>
</el-row>
<el-row>
<span class="padding-lr">{{ $t('chart.module_style') }}</span>
<el-collapse v-model="styleActiveNames" class="style-collapse">
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')" name="xAxis" :title="$t('chart.xAxis')">
<x-axis-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onChangeXAxisForm="onChangeXAxisForm" />
<x-axis-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onChangeXAxisForm="onChangeXAxisForm" />
<el-collapse-item
v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')"
name="xAxis"
:title="$t('chart.xAxis')"
>
<x-axis-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeXAxisForm="onChangeXAxisForm"
/>
<x-axis-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeXAxisForm="onChangeXAxisForm"
/>
</el-collapse-item>
<el-collapse-item v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')" name="yAxis" :title="view.type === 'chart-mix' ? $t('chart.yAxis_main') : $t('chart.yAxis')">
<y-axis-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onChangeYAxisForm="onChangeYAxisForm" />
<y-axis-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onChangeYAxisForm="onChangeYAxisForm" />
<el-collapse-item
v-show="view.type && (view.type.includes('bar') || view.type.includes('line') || view.type.includes('scatter') || view.type === 'chart-mix' || view.type === 'waterfall')"
name="yAxis"
:title="view.type === 'chart-mix' ? $t('chart.yAxis_main') : $t('chart.yAxis')"
>
<y-axis-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeYAxisForm="onChangeYAxisForm"
/>
<y-axis-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeYAxisForm="onChangeYAxisForm"
/>
</el-collapse-item>
<el-collapse-item v-show="view.type && view.type === 'chart-mix'" name="yAxisExt" :title="$t('chart.yAxis_ext')">
<y-axis-ext-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onChangeYAxisForm="onChangeYAxisExtForm" />
<y-axis-ext-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onChangeYAxisForm="onChangeYAxisExtForm" />
<el-collapse-item
v-show="view.type && view.type === 'chart-mix'"
name="yAxisExt"
:title="$t('chart.yAxis_ext')"
>
<y-axis-ext-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeYAxisForm="onChangeYAxisExtForm"
/>
<y-axis-ext-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeYAxisForm="onChangeYAxisExtForm"
/>
</el-collapse-item>
<el-collapse-item v-show="view.type && view.type.includes('radar')" name="split" :title="$t('chart.split')">
<split-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onChangeSplitForm="onChangeSplitForm" />
<split-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onChangeSplitForm="onChangeSplitForm" />
<el-collapse-item
v-show="view.type && view.type.includes('radar')"
name="split"
:title="$t('chart.split')"
>
<split-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeSplitForm="onChangeSplitForm"
/>
<split-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onChangeSplitForm="onChangeSplitForm"
/>
</el-collapse-item>
<el-collapse-item v-show="view.type" name="title" :title="$t('chart.title')">
<title-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onTextChange="onTextChange" />
<title-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onTextChange="onTextChange" />
<title-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onTextChange="onTextChange"
/>
<title-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onTextChange="onTextChange"
/>
</el-collapse-item>
<el-collapse-item v-show="view.type && view.type !== 'map' && !view.type.includes('table') && !view.type.includes('text') && (chart.type !== 'treemap' || chart.render === 'antv') && view.type !== 'liquid' && view.type !== 'waterfall' && chart.type !== 'gauge' && chart.type !== 'word-cloud'" name="legend" :title="$t('chart.legend')">
<legend-selector v-if="view.render && view.render === 'echarts'" :param="param" class="attr-selector" :chart="chart" @onLegendChange="onLegendChange" />
<legend-selector-ant-v v-else-if="view.render && view.render === 'antv'" :param="param" class="attr-selector" :chart="chart" @onLegendChange="onLegendChange" />
<el-collapse-item
v-show="view.type && view.type !== 'map' && !view.type.includes('table') && !view.type.includes('text') && (chart.type !== 'treemap' || chart.render === 'antv') && view.type !== 'liquid' && view.type !== 'waterfall' && chart.type !== 'gauge' && chart.type !== 'word-cloud'"
name="legend"
:title="$t('chart.legend')"
>
<legend-selector
v-if="view.render && view.render === 'echarts'"
:param="param"
class="attr-selector"
:chart="chart"
@onLegendChange="onLegendChange"
/>
<legend-selector-ant-v
v-else-if="view.render && view.render === 'antv'"
:param="param"
class="attr-selector"
:chart="chart"
@onLegendChange="onLegendChange"
/>
</el-collapse-item>
<el-collapse-item name="background" :title="$t('chart.background')">
<background-color-selector :param="param" class="attr-selector" :chart="chart" @onChangeBackgroundForm="onChangeBackgroundForm" />
<background-color-selector
:param="param"
class="attr-selector"
:chart="chart"
@onChangeBackgroundForm="onChangeBackgroundForm"
/>
</el-collapse-item>
</el-collapse>
</el-row>
......@@ -501,12 +743,37 @@
<el-col style="height: 100%;min-width: 500px;border-top: 1px solid #E6E6E6;">
<el-row style="width: 100%;height: 100%;" class="padding-lr">
<div ref="imageWrapper" style="height: 100%">
<chart-component v-if="httpRequest.status && chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'echarts'" ref="dynamicChart" :chart-id="chart.id" :chart="chart" class="chart-class" @onChartClick="chartClick" />
<chart-component-g2 v-if="httpRequest.status && chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'antv'" ref="dynamicChart" :chart-id="chart.id" :chart="chart" class="chart-class" @onChartClick="chartClick" />
<table-normal v-if="httpRequest.status && chart.type && chart.type.includes('table')" :show-summary="chart.type === 'table-normal'" :chart="chart" class="table-class" />
<label-normal v-if="httpRequest.status && chart.type && chart.type.includes('text')" :chart="chart" class="table-class" />
<chart-component
v-if="httpRequest.status && chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'echarts'"
ref="dynamicChart"
:chart-id="chart.id"
:chart="chart"
class="chart-class"
@onChartClick="chartClick"
/>
<chart-component-g2
v-if="httpRequest.status && chart.type && !chart.type.includes('table') && !chart.type.includes('text') && renderComponent() === 'antv'"
ref="dynamicChart"
:chart-id="chart.id"
:chart="chart"
class="chart-class"
@onChartClick="chartClick"
/>
<table-normal
v-if="httpRequest.status && chart.type && chart.type.includes('table')"
:show-summary="chart.type === 'table-normal'"
:chart="chart"
class="table-class"
/>
<label-normal
v-if="httpRequest.status && chart.type && chart.type.includes('text')"
:chart="chart"
class="table-class"
/>
<div v-if="!httpRequest.status" class="chart-error-class">
<div style="font-size: 12px; color: #9ea6b2;height: 100%;display: flex;align-items: center;justify-content: center;">
<div
style="font-size: 12px; color: #9ea6b2;height: 100%;display: flex;align-items: center;justify-content: center;"
>
{{ httpRequest.msg }},{{ $t('chart.chart_show_error') }}
<br>
{{ $t('chart.chart_error_tips') }}
......@@ -591,7 +858,9 @@
<p style="margin-top: 10px;color:#F56C6C;font-size: 12px;">{{ $t('chart.change_ds_tip') }}</p>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeChangeChart">{{ $t('chart.cancel') }}</el-button>
<el-button type="primary" size="mini" :disabled="!changeTable || !changeTable.id" @click="changeChart">{{ $t('chart.confirm') }}</el-button>
<el-button type="primary" size="mini" :disabled="!changeTable || !changeTable.id" @click="changeChart">{{
$t('chart.confirm') }}
</el-button>
</div>
</el-dialog>
......@@ -616,7 +885,7 @@
</template>
<script>
import { ajaxGetData, post } from '@/api/chart/chart'
import { ajaxGetData, ajaxGetDataOnly, post } from '@/api/chart/chart'
import draggable from 'vuedraggable'
import DimensionItem from '../components/drag-item/DimensionItem'
import QuotaItem from '../components/drag-item/QuotaItem'
......@@ -673,6 +942,7 @@ import YAxisSelectorAntV from '@/views/chart/components/component-style/YAxisSel
import YAxisExtSelectorAntV from '@/views/chart/components/component-style/YAxisExtSelectorAntV'
import SizeSelectorAntV from '@/views/chart/components/shape-attr/SizeSelectorAntV'
import SplitSelectorAntV from '@/views/chart/components/component-style/SplitSelectorAntV'
export default {
name: 'ChartEdit',
components: {
......@@ -1035,18 +1305,12 @@ export default {
const view = this.buildParam(getData, trigger, needRefreshGroup, switchType)
if (!view) return
post('/chart/view/save', view).then(response => {
// this.get(response.data.id);
// this.getData(response.data.id)
if (getData) {
this.resetDrill()
this.getData(response.data.id)
} else {
this.getChart(response.data.id)
}
// this.$store.dispatch('chart/setChartSceneData', null)
// this.$store.dispatch('chart/setChartSceneData', response.data)
if (needRefreshGroup) {
this.refreshGroup(view)
}
......@@ -1126,14 +1390,13 @@ export default {
if (this.$route.path.indexOf('panel') > -1) {
bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
}
// this.$emit('switchComponent', { name: '' })
this.$success(this.$t('commons.save_success'))
})
},
getData(id) {
this.hasEdit = false
if (id) {
ajaxGetData(id, {
ajaxGetDataOnly(id, {
filter: [],
drill: this.drillClickDimensionList
}).then(response => {
......@@ -1466,8 +1729,12 @@ export default {
fieldFilter(val) {
if (val && val !== '') {
this.dimensionData = JSON.parse(JSON.stringify(this.dimension.filter(ele => { return ele.name.toLocaleLowerCase().includes(val.toLocaleLowerCase()) })))
this.quotaData = JSON.parse(JSON.stringify(this.quota.filter(ele => { return ele.name.toLocaleLowerCase().includes(val.toLocaleLowerCase()) })))
this.dimensionData = JSON.parse(JSON.stringify(this.dimension.filter(ele => {
return ele.name.toLocaleLowerCase().includes(val.toLocaleLowerCase())
})))
this.quotaData = JSON.parse(JSON.stringify(this.quota.filter(ele => {
return ele.name.toLocaleLowerCase().includes(val.toLocaleLowerCase())
})))
} else {
this.dimensionData = JSON.parse(JSON.stringify(this.dimension))
this.quotaData = JSON.parse(JSON.stringify(this.quota))
......@@ -1759,13 +2026,14 @@ export default {
height: calc(100% - 40px);
background-color: #f7f8fa;
}
.blackTheme .view-panel {
background-color: var(--MainBG);
}
.drag-list {
height: calc(100% - 26px);
overflow:auto;
overflow: auto;
}
.item-dimension {
......@@ -1784,7 +2052,7 @@ export default {
}
.blackTheme .item-dimension {
border: solid 1px ;
border: solid 1px;
border-color: var(--TableBorderColor);
color: var(--TextPrimary);
background-color: var(--MainBG);
......@@ -1820,9 +2088,10 @@ export default {
white-space: nowrap;
text-overflow: ellipsis;
}
.blackTheme .item-quota {
border: solid 1px ;
border: solid 1px;
border-color: var(--TableBorderColor);
color: var(--TextPrimary);
background-color: var(--MainBG);
......@@ -1852,31 +2121,34 @@ export default {
font-size: 12px;
}
.tab-header>>>.el-tabs__item{
.tab-header > > > .el-tabs__item {
font-size: 12px;
background-color: #E8EAED;
}
.blackTheme .tab-header>>>.el-tabs__item{
.blackTheme .tab-header > > > .el-tabs__item {
background-color: var(--MainBG);
}
.tab-header>>>.is-active{
.tab-header > > > .is-active {
background-color: #f7f8fa;
border-bottom-color: #f7f8fa!important;
border-bottom-color: #f7f8fa !important;
}
.blackTheme .tab-header>>>.is-active{
.blackTheme .tab-header > > > .is-active {
background-color: var(--ContentBG);
border-bottom-color: var(--ContentBG) !important;
}
.tab-header>>>.el-tabs__nav-scroll{
padding-left: 0!important;
.tab-header > > > .el-tabs__nav-scroll {
padding-left: 0 !important;
}
.tab-header>>>.el-tabs__header{
margin: 0!important;
.tab-header > > > .el-tabs__header {
margin: 0 !important;
}
.tab-header>>>.el-tabs__content{
.tab-header > > > .el-tabs__content {
height: 100%;
}
......@@ -1886,67 +2158,70 @@ export default {
height: calc(100% - 6px);
}
.chart-icon{
.chart-icon {
width: 20px;
height: 20px;
}
.el-radio{
margin:5px;
.el-radio {
margin: 5px;
}
.el-radio>>>.el-radio__label{
.el-radio > > > .el-radio__label {
padding-left: 0;
}
.attr-style{
.attr-style {
height: calc(100vh - 56px - 60px - 40px - 40px);
}
.blackTheme .attr-style{
.blackTheme .attr-style {
border-color: var(--TableBorderColor) !important;
color: var(--TextPrimary);
}
.attr-selector{
width:100%;
.attr-selector {
width: 100%;
height: 100%;
margin:6px 0;
padding:0 4px;
margin: 6px 0;
padding: 0 4px;
display: flex;
align-items: center;
background-color: white
}
.blackTheme .attr-selector{
.blackTheme .attr-selector {
background-color: var(--MainBG)
}
.disabled-none-cursor{
.disabled-none-cursor {
cursor: not-allowed;
pointer-events:none;
pointer-events: none;
}
.chart-class{
.chart-class {
height: 100%;
padding: 10px;
}
.table-class{
.table-class {
height: calc(100% - 20px);
}
.dialog-css>>>.el-dialog__title {
.dialog-css > > > .el-dialog__title {
font-size: 14px;
}
.dialog-css >>> .el-dialog__header {
.dialog-css > > > .el-dialog__header {
padding: 20px 20px 0;
}
.dialog-css >>> .el-dialog__body {
.dialog-css > > > .el-dialog__body {
padding: 10px 20px 20px;
}
.filter-btn-class{
.filter-btn-class {
padding: 6px;
border: none;
width: 100%;
......@@ -1955,7 +2230,7 @@ export default {
align-items: center;
}
.chart-error-class{
.chart-error-class {
text-align: center;
height: 100%;
display: flex;
......@@ -1963,34 +2238,38 @@ export default {
justify-content: center;
background-color: #ece7e7;
}
.blackTheme .chart-error-class{
.blackTheme .chart-error-class {
background-color: var(--MainBG)
}
.field-height{
.field-height {
height: calc(50% - 20px);
border-top: 1px solid #E6E6E6;
}
.blackTheme .field-height{
border-top: 1px solid ;
.blackTheme .field-height {
border-top: 1px solid;
border-color: var(--TableBorderColor) !important;
}
.padding-tab{
.padding-tab {
padding: 0;
height: 100%;
}
.tree-select-span {
>>>div.vue-treeselect__control {
> > > div.vue-treeselect__control {
height: 32px !important;
font-weight: normal !important;
}
}
.drag-block-style{
padding:2px 0 0 0;
width:100%;
.drag-block-style {
padding: 2px 0 0 0;
width: 100%;
min-height: 32px;
border-radius: 4px;
border: 1px solid #DCDFE6;
......@@ -1999,23 +2278,26 @@ export default {
align-items: center;
background-color: white;
}
.blackTheme .drag-block-style{
border: 1px solid ;
.blackTheme .drag-block-style {
border: 1px solid;
border-color: var(--TableBorderColor);
background-color: var(--ContentBG);
}
.drag-placeholder-style{
.drag-placeholder-style {
position: absolute;
top: calc(50% - 2px);
left: 0;
width: 100%;
color: #CCCCCC;
}
.blackTheme .drag-placeholder-style{
.blackTheme .drag-placeholder-style {
color: var(--TextPrimary);
}
.drag-placeholder-style-span{
.drag-placeholder-style-span {
padding-left: 16px;
}
......@@ -2024,23 +2306,29 @@ export default {
color: var(--TextPrimary) !important;
background-color: var(--ContentBG);
}
.blackTheme .padding-lr {
border-color: var(--TableBorderColor) !important;
}
.blackTheme .theme-item-class {
background-color: var(--MainBG) !important;
border-color: var(--TableBorderColor) !important;
}
.icon-class{
color:#6c6c6c;
.icon-class {
color: #6c6c6c;
}
.blackTheme .icon-class{
.blackTheme .icon-class {
color: #cccccc;
}
.result-count{
width:80px;
.result-count {
width: 80px;
}
.radio-span>>>.el-radio__label{
.radio-span > > > .el-radio__label {
margin-left: 4px;
}
......
frontend/src/views/panel/index.vue
浏览文件 @ 381789bb
......@@ -4,7 +4,6 @@
<panel-main v-show="componentName==='PanelMain'" ref="panel_main" />
<chart-edit v-if="componentName==='ChartEdit'" :param="param" />
<panel-edit v-if="componentName==='PanelEdit'" />
<!-- <component :is="component" :param="param" />-->
</de-main-container>
</de-container>
</template>
......@@ -47,34 +46,11 @@ export default {
this.param = c.param
this.componentName = c.name
this.$store.dispatch('panel/setMainActiveName', c.name)
// switch (c.name) {
// case 'PanelEdit':
// this.component = PanelEdit
// this.componentName = 'PanelEdit'
// break
// case 'ChartEdit':
// this.component = ChartEdit
// this.componentName = 'ChartEdit'
// break
// default:
// this.component = PanelMain
// this.componentName = 'PanelMain'
// break
// }
})
},
created() {
this.$store.dispatch('app/toggleSideBarHide', true)
const routerParam = this.$router.currentRoute.params
// if ((routerParam = this.$router.currentRoute.params) !== null && routerParam.msgNotification) {
// // 说明是从消息通知跳转过来的
// if (routerParam.msgType === 0) { // 是仪表板分享
// this.componentName = 'PanelMain'
// this.$nextTick(() => {
// this.$refs.panel_main.msg2Current(routerParam.sourceParam)
// })
// }
// }
this.toMsgShare(routerParam)
},
methods: {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论