feat: 仪表板预览添加创建人

This commit is contained in:
dataeaseShu 2022-12-15 15:09:30 +08:00
parent a61933e62c
commit 0700ca7c69
5 changed files with 87 additions and 43 deletions

View File

@ -66,24 +66,36 @@
@mousedown.stop.prevent="handleDown(handlei, $event)" @mousedown.stop.prevent="handleDown(handlei, $event)"
@touchstart.stop.prevent="handleTouchDown(handlei, $event)" @touchstart.stop.prevent="handleTouchDown(handlei, $event)"
> >
<slot :name="handlei"/> <slot :name="handlei" />
</div> </div>
<div <div
:id="componentCanvasId" :id="componentCanvasId"
:style="mainSlotStyleInner" :style="mainSlotStyleInner"
class="main-background" class="main-background"
> >
<div @mousedown="elementMouseDown" class="de-drag-area de-drag-top"></div> <div
<div @mousedown="elementMouseDown" class="de-drag-area de-drag-right"></div> class="de-drag-area de-drag-top"
<div @mousedown="elementMouseDown" class="de-drag-area de-drag-bottom"></div> @mousedown="elementMouseDown"
<div @mousedown="elementMouseDown" class="de-drag-area de-drag-left"></div> />
<div
class="de-drag-area de-drag-right"
@mousedown="elementMouseDown"
/>
<div
class="de-drag-area de-drag-bottom"
@mousedown="elementMouseDown"
/>
<div
class="de-drag-area de-drag-left"
@mousedown="elementMouseDown"
/>
<svg-icon <svg-icon
v-if="svgInnerEnable" v-if="svgInnerEnable"
:style="{'color':element.commonBackground.innerImageColor}" :style="{'color':element.commonBackground.innerImageColor}"
class="svg-background" class="svg-background"
:icon-class="mainSlotSvgInner" :icon-class="mainSlotSvgInner"
/> />
<slot/> <slot />
</div> </div>
</div> </div>
</div> </div>

View File

@ -165,12 +165,12 @@
v-show=" show &&showIndex===1" v-show=" show &&showIndex===1"
:canvas-id="canvasId" :canvas-id="canvasId"
/> />
<subject-setting v-show=" show &&showIndex===2"/> <subject-setting v-show=" show &&showIndex===2" />
<assist-component v-show=" show &&showIndex===3"/> <assist-component v-show=" show &&showIndex===3" />
</div> </div>
</el-drawer> </el-drawer>
<!--PC端画布区域--> <!--PC端画布区域-->
<canvas-opt-bar v-if="!previewVisible&&!mobileLayoutStatus"/> <canvas-opt-bar v-if="!previewVisible&&!mobileLayoutStatus" />
<de-canvas <de-canvas
v-if="!previewVisible&&!mobileLayoutStatus" v-if="!previewVisible&&!mobileLayoutStatus"
ref="canvasMainRef" ref="canvasMainRef"
@ -196,7 +196,7 @@
:style="customCanvasMobileStyle" :style="customCanvasMobileStyle"
class="this_mobile_canvas" class="this_mobile_canvas"
> >
<el-row class="this_mobile_canvas_top"/> <el-row class="this_mobile_canvas_top" />
<el-row class="this_mobile_canvas_inner_top"> <el-row class="this_mobile_canvas_inner_top">
{{ panelInfo.name }} {{ panelInfo.name }}
</el-row> </el-row>
@ -205,7 +205,7 @@
class="this_mobile_canvas_main" class="this_mobile_canvas_main"
:style="mobileCanvasStyle" :style="mobileCanvasStyle"
> >
<canvas-opt-bar v-if="!previewVisible&&mobileLayoutStatus"/> <canvas-opt-bar v-if="!previewVisible&&mobileLayoutStatus" />
<de-canvas <de-canvas
v-if="!previewVisible&&mobileLayoutStatus" v-if="!previewVisible&&mobileLayoutStatus"
ref="canvasMainRef" ref="canvasMainRef"
@ -243,14 +243,14 @@
/> />
</el-col> </el-col>
</el-row> </el-row>
<el-row class="this_mobile_canvas_bottom"/> <el-row class="this_mobile_canvas_bottom" />
</div> </div>
</el-col> </el-col>
<el-col <el-col
:span="16" :span="16"
class="this_mobile_canvas_cell this_mobile_canvas_wait_cell" class="this_mobile_canvas_cell this_mobile_canvas_wait_cell"
> >
<component-wait/> <component-wait />
</el-col> </el-col>
</el-row> </el-row>
</de-main-container> </de-main-container>
@ -268,7 +268,7 @@
/> />
</div> </div>
<div v-if="showBatchViewToolsAside"> <div v-if="showBatchViewToolsAside">
<chart-style-batch-set/> <chart-style-batch-set />
</div> </div>
<div v-if="!showViewToolsAside&&!showBatchViewToolsAside"> <div v-if="!showViewToolsAside&&!showBatchViewToolsAside">
<el-row style="height: 40px"> <el-row style="height: 40px">
@ -287,7 +287,7 @@
>{{ $t('panel.position_adjust') }}</span> >{{ $t('panel.position_adjust') }}</span>
</el-row> </el-row>
<el-row> <el-row>
<position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix"/> <position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix" />
<div <div
v-else v-else
class="view-selected-message-class" class="view-selected-message-class"

View File

@ -17,7 +17,7 @@
style="border-bottom: 1px solid;border-bottom-color:#E6E6E6;" style="border-bottom: 1px solid;border-bottom-color:#E6E6E6;"
> >
<div style="height: 100%;"> <div style="height: 100%;">
<share-head/> <share-head />
</div> </div>
</el-row> </el-row>
<el-row <el-row
@ -31,7 +31,7 @@
:span="12" :span="12"
style="text-overflow:ellipsis;overflow: hidden;white-space: nowrap;font-size: 14px" style="text-overflow:ellipsis;overflow: hidden;white-space: nowrap;font-size: 14px"
> >
<span>{{ panelInfo.name || '测试仪表板' }}</span> <span class="panel-name">{{ panelInfo.name || '测试仪表板' }}</span>
<span <span
v-if="panelInfo.isDefault" v-if="panelInfo.isDefault"
style="color: green;font-size: 12px" style="color: green;font-size: 12px"
@ -40,15 +40,46 @@
v-if="panelInfo.sourcePanelName" v-if="panelInfo.sourcePanelName"
style="color: green;font-size: 12px" style="color: green;font-size: 12px"
>&nbsp;({{ $t('panel.source_panel_name') }}:{{ panelInfo.sourcePanelName }})</span> >&nbsp;({{ $t('panel.source_panel_name') }}:{{ panelInfo.sourcePanelName }})</span>
<span
v-if="!hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
style="margin-left: 9px"
>
<el-tooltip :content="$t('panel.store')">
<i
class="el-icon-star-off"
@click="star"
/>
</el-tooltip>
</span>
<span
v-if="hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
style="margin-left: 9px"
>
<el-tooltip :content="$t('commons.cancel') + $t('panel.store')">
<i
class="el-icon-star-on"
@click="unstar"
/>
</el-tooltip>
</span>
<template v-if="panelInfo.creatorName">
<el-divider
style="margin: 0 16px;"
direction="vertical"
/>
<span class="panel-create">
{{ $t('panel.create_by') + ':' + panelInfo.creatorName }}
</span>
</template>
<el-popover <el-popover
placement="right-start" placement="right-start"
width="400" width="400"
trigger="click" trigger="click"
> >
<panel-detail-info/> <panel-detail-info />
<i <i
slot="reference" slot="reference"
class="el-icon-warning icon-class" class="el-icon-warning-outline icon-class"
style="margin-left: 4px;cursor: pointer;font-size: 14px;" style="margin-left: 4px;cursor: pointer;font-size: 14px;"
/> />
</el-popover> </el-popover>
@ -119,22 +150,6 @@
{{ $t('panel.new_tab_preview') }} {{ $t('panel.new_tab_preview') }}
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item
v-if="!hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
icon="el-icon-star-off"
@click.native="star"
>
{{ $t('panel.store') }}
</el-dropdown-item>
<el-dropdown-item
v-if="hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
icon="el-icon-star-on"
@click.native="unstar"
>
{{ $t('commons.cancel') + $t('panel.store') }}
</el-dropdown-item>
<el-dropdown-item <el-dropdown-item
v-if="hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'" v-if="hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
icon="el-icon-refresh" icon="el-icon-refresh"
@ -374,9 +389,9 @@ import GrantAuth from '../grantAuth'
import msgCfm from '@/components/msgCfm/index' import msgCfm from '@/components/msgCfm/index'
export default { export default {
mixins: [msgCfm],
name: 'PanelViewShow', name: 'PanelViewShow',
components: { AppExportForm, PanelDetailInfo, Preview, SaveToTemplate, PDFPreExport, ShareHead, GrantAuth }, components: { AppExportForm, PanelDetailInfo, Preview, SaveToTemplate, PDFPreExport, ShareHead, GrantAuth },
mixins: [msgCfm],
props: { props: {
activeTab: { activeTab: {
type: String, type: String,
@ -767,7 +782,7 @@ export default {
} }
</script> </script>
<style> <style lang="less">
.view-list { .view-list {
height: 100%; height: 100%;
width: 20%; width: 20%;
@ -801,6 +816,23 @@ export default {
background-color: var(--SiderBG, white); background-color: var(--SiderBG, white);
padding: 0 10px; padding: 0 10px;
line-height: 40px; line-height: 40px;
.panel-name {
font-family: PingFang SC;
font-size: 16px;
font-weight: 500;
line-height: 24px;
color: var(--deTextPrimary, #1F2329);
}
.panel-create {
font-family: PingFang SC;
font-size: 14px;
font-weight: 400;
line-height: 22px;
color: var(--deTextSecondary, #646A73);
}
} }
.panel-share-head { .panel-share-head {

View File

@ -708,10 +708,10 @@ export default {
getDatasourceDetail(id, showModel) { getDatasourceDetail(id, showModel) {
this.$emit('update:formLoading', true) this.$emit('update:formLoading', true)
return getDatasourceDetail(id).then((res) => { return getDatasourceDetail(id).then((res) => {
if(res.data.configuration){ if (res.data.configuration) {
res.data.configuration = Base64.decode(res.data.configuration) res.data.configuration = Base64.decode(res.data.configuration)
} }
if(res.data.apiConfigurationStr){ if (res.data.apiConfigurationStr) {
res.data.apiConfiguration = JSON.parse(Base64.decode(res.data.apiConfigurationStr)) res.data.apiConfiguration = JSON.parse(Base64.decode(res.data.apiConfigurationStr))
} }
this.params = { ...res.data, showModel } this.params = { ...res.data, showModel }
@ -733,10 +733,10 @@ export default {
const newArr = [] const newArr = []
for (let index = 0; index < array.length; index++) { for (let index = 0; index < array.length; index++) {
const element = array[index] const element = array[index]
if(element.configuration){ if (element.configuration) {
element.configuration = Base64.decode(element.configuration) element.configuration = Base64.decode(element.configuration)
} }
if(element.apiConfigurationStr){ if (element.apiConfigurationStr) {
element.apiConfiguration = Base64.decode(element.apiConfigurationStr) element.apiConfiguration = Base64.decode(element.apiConfigurationStr)
} }
if (this.msgNodeId) { if (this.msgNodeId) {

View File

@ -538,10 +538,10 @@ export default {
const newArr = [] const newArr = []
for (let index = 0; index < array.length; index++) { for (let index = 0; index < array.length; index++) {
const element = array[index] const element = array[index]
if(element.configuration){ if (element.configuration) {
element.configuration = Base64.decode(element.configuration) element.configuration = Base64.decode(element.configuration)
} }
if(element.apiConfigurationStr){ if (element.apiConfigurationStr) {
element.apiConfiguration = JSON.parse(Base64.decode(element.apiConfigurationStr)) element.apiConfiguration = JSON.parse(Base64.decode(element.apiConfigurationStr))
} }
if (this.msgNodeId) { if (this.msgNodeId) {