center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

refactor: 视图插件自定义icon

Browse Source
This commit is contained in:
fit2cloud-chenyw 2022-03-31 17:52:22 +08:00
parent 58f68ea544
commit fd8e98f44c
6 changed files with 124 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
backend/src/main/java/io/dataease/auth/service/impl/ShiroServiceImpl.java
View File

@ -68,6 +68,8 @@ public class ShiroServiceImpl implements ShiroService {
filterChainDefinitionMap.put("/**/*.js", ANON);
filterChainDefinitionMap.put("/**/*.css", ANON);
filterChainDefinitionMap.put("/**/*.map", ANON);
filterChainDefinitionMap.put("/**/*.svg", ANON);
filterChainDefinitionMap.put("/api/auth/login", ANON);
filterChainDefinitionMap.put("/api/auth/isPluginLoaded", ANON);
@ -77,6 +79,7 @@ public class ShiroServiceImpl implements ShiroService {
filterChainDefinitionMap.put("/api/auth/isOpenOidc", ANON);
filterChainDefinitionMap.put("/api/auth/getPublicKey", ANON);
filterChainDefinitionMap.put("/api/pluginCommon/component/*", ANON);
filterChainDefinitionMap.put("/api/pluginCommon/staticInfo/**", ANON);
filterChainDefinitionMap.put("/plugin/oidc/authInfo", ANON);
filterChainDefinitionMap.put("/sso/callBack*", ANON);

41
backend/src/main/java/io/dataease/plugins/server/PluginCommonServer.java
View File

@ -2,9 +2,11 @@ package io.dataease.plugins.server;
import io.dataease.commons.utils.ServletUtils;
import io.dataease.plugins.common.dto.PluginSysMenu;
import io.dataease.plugins.common.dto.StaticResource;
import io.dataease.plugins.common.service.PluginComponentService;
import io.dataease.plugins.common.service.PluginMenuService;
import io.dataease.plugins.config.SpringContextUtil;
import org.apache.commons.lang3.StringUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
@ -102,4 +104,43 @@ public class PluginCommonServer {
}
});
}
@GetMapping("/staticInfo/{name}/{suffix}")
public void staticInfo(@PathVariable("name") String name, @PathVariable("suffix") String suffix) {
Map<String, PluginComponentService> beansOfType = SpringContextUtil.getApplicationContext().getBeansOfType(PluginComponentService.class);
beansOfType.values().stream().forEach(service -> {
List<StaticResource> staticResources = service.staticResources();
if (staticResources.stream().anyMatch(resource -> resource.match(name, suffix))) {
HttpServletResponse response = ServletUtils.response();
BufferedInputStream bis = null;
InputStream inputStream = null;
OutputStream os = null; //输出流
try{
inputStream = service.vueResource(name, suffix);
byte[] buffer = new byte[1024];
os = response.getOutputStream();
bis = new BufferedInputStream(inputStream);
int i = bis.read(buffer);
while(i != -1){
os.write(buffer, 0, i);
i = bis.read(buffer);
}
response.setContentType("image/svg+xml");
os.flush();
}catch (Exception e) {
e.printStackTrace();
}finally {
try {
bis.close();
inputStream.close();
os.close();
} catch (IOException e) {
e.printStackTrace();
}
}
return;
}
});
}
}

2
frontend/src/utils/validate.js
View File

@ -7,7 +7,7 @@
* @returns {Boolean}
*/
export function isExternal(path) {
return /^(https?:|mailto:|tel:)/.test(path)
return /^(https?:|mailto:|tel:)/.test(path) || /^(http?:|mailto:|tel:)/.test(path) || path.startsWith('/api/pluginCommon/staticInfo')
}
/**

34
frontend/src/views/chart/group/Group.vue
View File

@ -224,7 +224,7 @@
</el-row>
</el-row>
<el-row class="chart-box" style="text-align: center;">
<svg-icon :icon-class="view.type" class="chart-icon" />
<svg-icon :icon-class="view.isPlugin ? ('/api/pluginCommon/staticInfo/' + view.type + '/svg') : view.type" class="chart-icon" />
</el-row>
</el-row>
@ -297,6 +297,7 @@ import TableSelector from '../view/TableSelector'
import GroupMoveSelector from '../components/TreeSelector/GroupMoveSelector'
import ChartMoveSelector from '../components/TreeSelector/ChartMoveSelector'
import ChartType from '@/views/chart/view/ChartType'
import { pluginTypes } from '@/api/chart/chart'
import {
DEFAULT_COLOR_CASE,
DEFAULT_LABEL,
@ -420,7 +421,8 @@ export default {
folder: this.$t('commons.folder')
},
currentViewNodeData: {},
currentKey: null
currentKey: null,
pluginRenderOptions: []
}
},
computed: {
@ -429,14 +431,14 @@ export default {
},
panelInfo() {
return this.$store.state.panel.panelInfo
},
pluginRenderOptions() {
}
/* pluginRenderOptions() {
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views')) || []
const pluginOptions = plugins.filter(plugin => !this.renderOptions.some(option => option.value === plugin.render)).map(plugin => {
return { name: plugin.render, value: plugin.render }
})
return [...this.renderOptions, ...pluginOptions]
}
} */
},
watch: {
saveStatus() {
@ -460,6 +462,21 @@ export default {
}
},
created() {
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views'))
if (plugins) {
this.loadPluginType()
} else {
pluginTypes().then(res => {
const plugins = res.data
localStorage.setItem('plugin-views', JSON.stringify(plugins))
this.loadPluginType()
}).catch(e => {
localStorage.setItem('plugin-views', null)
this.loadPluginType()
})
}
},
mounted() {
if (this.mountedInit) {
this.treeNode(true)
@ -468,6 +485,13 @@ export default {
this.getChartGroupTree()
},
methods: {
loadPluginType() {
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views')) || []
const pluginOptions = plugins.filter(plugin => !this.renderOptions.some(option => option.value === plugin.render)).map(plugin => {
return { name: plugin.render, value: plugin.render }
})
this.pluginRenderOptions = [...this.renderOptions, ...pluginOptions]
},
clickAdd(param) {
this.currGroup = param.data
if (param.type === 'group') {

35
frontend/src/views/chart/view/ChartEdit.vue
View File

@ -154,7 +154,7 @@
<span>{{ $t('chart.chart_type') }}</span>
<el-row style="padding: 4px 0 4px 10px;">
<span>
<svg-icon :icon-class="view.type" class="chart-icon" />
<svg-icon :icon-class="view.isPlugin ? ('/api/pluginCommon/staticInfo/' + view.type + '/svg') : view.type" class="chart-icon" />
</span>
<span style="float: right;">
<el-popover
@ -1212,7 +1212,7 @@ import AssistLine from '@/views/chart/components/senior/AssistLine'
import Threshold from '@/views/chart/components/senior/Threshold'
import TotalCfg from '@/views/chart/components/shape-attr/TotalCfg'
import LabelNormalText from '@/views/chart/components/normal/LabelNormalText'
import { pluginTypes } from '@/api/chart/chart'
export default {
name: 'ChartEdit',
components: {
@ -1365,7 +1365,8 @@ export default {
hasEdit: false,
quotaItemCompare: {},
showEditQuotaCompare: false,
preChartId: ''
preChartId: '',
pluginRenderOptions: []
}
},
@ -1378,14 +1379,14 @@ export default {
},
...mapState([
'panelViewEditInfo'
]),
pluginRenderOptions() {
])
/* pluginRenderOptions() {
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views')) || []
const pluginOptions = plugins.filter(plugin => !this.renderOptions.some(option => option.value === plugin.render)).map(plugin => {
return { name: plugin.render, value: plugin.render }
})
return [...this.renderOptions, ...pluginOptions]
}
} */
},
watch: {
'param': function(val) {
@ -1411,8 +1412,19 @@ export default {
}
},
created() {
// this.get(this.$store.state.chart.viewId);
// this.initAreas()
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views'))
if (plugins) {
this.loadPluginType()
} else {
pluginTypes().then(res => {
const plugins = res.data
localStorage.setItem('plugin-views', JSON.stringify(plugins))
this.loadPluginType()
}).catch(e => {
localStorage.setItem('plugin-views', null)
this.loadPluginType()
})
}
},
mounted() {
this.bindPluginEvent()
@ -1424,6 +1436,13 @@ export default {
},
methods: {
loadPluginType() {
const plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views')) || []
const pluginOptions = plugins.filter(plugin => !this.renderOptions.some(option => option.value === plugin.render)).map(plugin => {
return { name: plugin.render, value: plugin.render }
})
this.pluginRenderOptions = [...this.renderOptions, ...pluginOptions]
},
emptyTableData() {
this.table = {}
this.dimension = []

26
frontend/src/views/panel/ViewSelect/index.vue
View File

@ -47,6 +47,7 @@
</span>
<span v-else>
<svg-icon :icon-class="data.modelInnerType" style="width: 14px;height: 14px" />
<svg-icon :icon-class="data.isPlugin ? ('/api/pluginCommon/staticInfo/' + data.modelInnerType + '/svg') : data.modelInnerType" style="width: 14px;height: 14px" />
</span>
<span style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" :title="data.name">{{ data.name }}</span>
</span>
@ -74,7 +75,7 @@ import eventBus from '@/components/canvas/utils/eventBus'
import { mapState } from 'vuex'
import { queryPanelViewTree } from '@/api/panel/panel'
import { deleteCircle } from '@/api/chart/chart'
import { delUser } from '@/api/system/user'
import { pluginTypes } from '@/api/chart/chart'
export default {
name: 'ViewSelect',
@ -96,7 +97,8 @@ export default {
data: [],
showdetail: false,
detailItem: null,
loading: false
loading: false,
plugins: null
}
},
computed: {
@ -110,7 +112,20 @@ export default {
}
},
created() {
this.loadData()
this.plugins = localStorage.getItem('plugin-views') && JSON.parse(localStorage.getItem('plugin-views'))
if (this.plugins) {
this.loadData()
} else {
pluginTypes().then(res => {
this.plugins = res.data
localStorage.setItem('plugin-views', JSON.stringify(res.data))
this.loadData()
}).catch(e => {
localStorage.setItem('plugin-views', null)
this.plugins = null
this.loadData()
})
}
},
methods: {
filterNode(value, data) {
@ -172,6 +187,11 @@ export default {
if (node.modelType === 'panel' || node.nodeType === 'spine') {
node.disabled = true
}
if (node.modelType === 'view' && node.modelInnerType && this.plugins && this.plugins.length) {
node.isPlugin = this.plugins.some(plugin => plugin.value === node.modelInnerType)
}
if (node.children && node.children.length > 0) {
this.setParentDisable(node.children)
}