|
@@ -8,10 +8,10 @@
|
|
|
<i class="el-icon-d-arrow-left"></i>
|
|
|
</span>
|
|
|
<el-tabs v-model="activeToolTabName" stretch class="sand-toolbar-tabs">
|
|
|
- <el-tab-pane label="元素库" name="元素库" id="element">
|
|
|
+ <el-tab-pane :label="$t('SandboxManage.SandFlow.element_library')" name="元素库" id="element">
|
|
|
<div class="sand-elements-tab">
|
|
|
<div class="sand-elements sand-elements-line">
|
|
|
- <span>线条</span>
|
|
|
+ <span>{{$t('SandboxManage.SandFlow.lines')}}</span>
|
|
|
<div class="elements-row" >
|
|
|
<img src="~@/assets/img/sand_new/no-arrow-straight.png" :draggable="true" @dragstart="edgeDragStart('noArrowStraight',$event)" />
|
|
|
<img src="~@/assets/img/sand_new/single-arrow-straight.png" :draggable="true" @dragstart="edgeDragStart('singleArrowStraight',$event)" />
|
|
@@ -25,7 +25,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="sand-elements sand-elements-shape">
|
|
|
- <span>基本形状</span>
|
|
|
+ <span>{{$t('SandboxManage.SandFlow.basic_shapes')}}</span>
|
|
|
<div class="elements-row">
|
|
|
<div class="elements-shape-item" v-for="shape in myNodes" :key="shape.key">
|
|
|
<div
|
|
@@ -37,7 +37,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="sand-elements sand-elements-mind">
|
|
|
- <span>思维导图</span>
|
|
|
+ <span>{{$t('SandboxManage.SandFlow.mind_map')}}</span>
|
|
|
<div class="elements-row-mind">
|
|
|
<img src="~@/assets/img/sand_new/mindmap-right.png" :draggable="true" @dragstart="edgeDragStart('singleMindmap',$event)"/>
|
|
|
<img src="~@/assets/img/sand_new/mindmap-double.png" :draggable="true" @dragstart="edgeDragStart('doubleMindmap',$event)"/>
|
|
@@ -46,7 +46,7 @@
|
|
|
</div>
|
|
|
|
|
|
</el-tab-pane>
|
|
|
- <el-tab-pane label="风格" name="风格" id="style">
|
|
|
+ <el-tab-pane :label="$t('SandboxManage.SandFlow.style')" name="风格" id="style">
|
|
|
<div class="sand-style-tab">
|
|
|
<div class="sand-style-tab-item" :class="styleActive==1?'active':''" @click="changeStyle(1)" :draggable="false">
|
|
|
<img src="~@/assets/img/sand_new/style-blue-light.png" />
|
|
@@ -70,7 +70,7 @@
|
|
|
<el-input
|
|
|
v-model="sandSaveParams.Name"
|
|
|
style="width: 240px; margin-right: 20px"
|
|
|
- placeholder="请输入逻辑图名称">
|
|
|
+ :placeholder="$t('SandboxManage.SandFlow.logic_name_placeholder')">
|
|
|
<i slot="prefix" class="el-input__icon el-icon-search"></i>
|
|
|
</el-input>
|
|
|
<el-cascader
|
|
@@ -80,7 +80,7 @@
|
|
|
label: 'SandboxClassifyName',
|
|
|
value: 'SandboxClassifyId',emitPath:false,checkStrictly:true}"
|
|
|
v-model="sandSaveParams.SandboxClassifyId"
|
|
|
- placeholder="请选择分类">
|
|
|
+ :placeholder="$t('SandboxManage.SandFlow.select_category')">
|
|
|
</el-cascader>
|
|
|
</div>
|
|
|
<div class="sand-mainTop-option">
|
|
@@ -89,19 +89,19 @@
|
|
|
<span>链接展示</span>
|
|
|
</div> -->
|
|
|
<el-button size="large" type="primary" plain @click="backList" style="margin-right: 20px;min-width: 120px;"
|
|
|
- v-if="$route.query.SandboxId">返回</el-button>
|
|
|
+ v-if="$route.query.SandboxId">{{$t('Dialog.back_btn')}}</el-button>
|
|
|
<el-button size="large" type="primary" plain @click="copySandHandle" style="margin-right: 20px;min-width: 120px;"
|
|
|
- v-permission="permissionBtn.sandboxPermission.sandbox_addMy">复制图片</el-button>
|
|
|
- <el-button type="primary" size="large" @click="saveChart(null)" style="min-width: 120px;" v-permission="permissionBtn.sandboxPermission.sandbox_saveView">保存</el-button>
|
|
|
+ v-permission="permissionBtn.sandboxPermission.sandbox_addMy">{{$t('SandboxManage.SandFlow.copy_img')}}</el-button>
|
|
|
+ <el-button type="primary" size="large" @click="saveChart(null)" style="min-width: 120px;" v-permission="permissionBtn.sandboxPermission.sandbox_saveView">{{$t('Dialog.confirm_save_btn')}}</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="sand-mainBody-chart" id="sand-mainBody-chart">
|
|
|
<div class="sand-mainBody-tool" id="sand-mainBody-tool">
|
|
|
- <el-tooltip content="撤销(Ctrl+Z)" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.undo')+'(Ctrl+Z)'" placement="top" :open-delay="250">
|
|
|
<img :src="canUndo?require('@/assets/img/sand_new/tools/undo.png'):require('@/assets/img/sand_new/tools/undo-disabled.png')"
|
|
|
class="sand-tool-item" @click="toolClickOptions('undo',!canUndo)" :class="canUndo?'':'tool-disabled'"/>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="恢复(Ctrl+Y)" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.recover')+'(Ctrl+Y)'" placement="top" :open-delay="250">
|
|
|
<img :src="canRedo?require('@/assets/img/sand_new/tools/redo.png'):require('@/assets/img/sand_new/tools/redo-disabled.png')"
|
|
|
class="sand-tool-item" @click="toolClickOptions('redo',!canRedo)" :class="canRedo?'':'tool-disabled'"/>
|
|
|
</el-tooltip>
|
|
@@ -109,13 +109,13 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeFamily',nodeTextDisable,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="nodeTextDisable?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="字体" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.font')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<div class="dropdown-content-text" style="width:28px">{{ styleOptions.fontF }}</div>
|
|
|
<img src="~@/assets/img/sand_new/tools/select-icon.png" style="width: 8px;height: 5px;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="字体" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.font')" placement="top" :open-delay="250">
|
|
|
<span v-show="nodeTextDisable" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
@@ -131,13 +131,13 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeSize',nodeTextDisable,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="nodeTextDisable?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="字号" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.font_size')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<div class="dropdown-content-text" >{{ styleOptions.fontS }}px</div>
|
|
|
<img src="~@/assets/img/sand_new/tools/select-icon.png" style="width: 8px;height: 5px;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="字号" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.font_size')" placement="top" :open-delay="250">
|
|
|
<span v-show="nodeTextDisable" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
@@ -149,7 +149,7 @@
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
|
</div>
|
|
|
- <el-tooltip content="加粗(Ctrl+B)" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.bold')+'(Ctrl+B)'" placement="top" :open-delay="250">
|
|
|
<div class="sand-tool-item img-box" :class="styleOptions.fontW=='bold'?'style-acitve-back':''">
|
|
|
<img :class="nodeTextDisable?'tool-disabled':''" :src="nodeTextDisable?
|
|
|
require('@/assets/img/sand_new/tools/bold-disabled.png'):
|
|
@@ -157,14 +157,14 @@
|
|
|
</div>
|
|
|
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="斜体" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.italic')" placement="top" :open-delay="250">
|
|
|
<div class="sand-tool-item img-box" :class="styleOptions.fontStyle=='italic'?'style-acitve-back':''">
|
|
|
<img :class="nodeTextDisable?'tool-disabled':''" :src="nodeTextDisable?
|
|
|
require('@/assets/img/sand_new/tools/italic-disabled.png'):
|
|
|
require('@/assets/img/sand_new/tools/italic.png')" @click="toolClickOptions('changeFontStyle',nodeTextDisable)"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="下划线" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.underline')" placement="top" :open-delay="250">
|
|
|
<div class="sand-tool-item img-box" :class="styleOptions.textDecoration=='underline'?'style-acitve-back':''">
|
|
|
<img :class="nodeTextDisable?'tool-disabled':''" :src="nodeTextDisable?
|
|
|
require('@/assets/img/sand_new/tools/underline-disabled.png'):
|
|
@@ -175,7 +175,7 @@
|
|
|
<img :src="nodeTextDisable?
|
|
|
require('@/assets/img/sand_new/tools/text-color-disabled.png'):
|
|
|
require('@/assets/img/sand_new/tools/text-color.png')" />
|
|
|
- <el-tooltip content="字体颜色" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.font_color')" placement="top" :open-delay="250">
|
|
|
<el-color-picker
|
|
|
key="textColor"
|
|
|
v-model="styleOptions.color"
|
|
@@ -191,7 +191,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeTextAlign',nodeTextDisable,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="nodeTextDisable?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="文本对齐" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.text_align')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="nodeTextDisable?
|
|
|
require('@/assets/img/sand_new/tools/text-align-disabled.png'):
|
|
@@ -199,19 +199,19 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="文本对齐" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.text_align')" placement="top" :open-delay="250">
|
|
|
<span v-show="nodeTextDisable" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
<el-dropdown-item command="middle" :class="styleOptions.textAlign=='middle'?'style-acitve':''">
|
|
|
- 居中
|
|
|
+ {{$t('SandboxManage.SandFlow.center')}}
|
|
|
</el-dropdown-item>
|
|
|
<el-dropdown-item command="start" :class="styleOptions.textAlign=='start'?'style-acitve':''">
|
|
|
- 居左
|
|
|
+ {{$t('SandboxManage.SandFlow.left')}}
|
|
|
</el-dropdown-item>
|
|
|
<el-dropdown-item command="end" :class="styleOptions.textAlign=='end'?'style-acitve':''">
|
|
|
- 居右
|
|
|
+ {{$t('SandboxManage.SandFlow.right')}}
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
@@ -220,7 +220,7 @@
|
|
|
<img :src="toolStatus.nodeDisabled?
|
|
|
require('@/assets/img/sand_new/tools/background-color-disabled.png'):
|
|
|
require('@/assets/img/sand_new/tools/background-color.png')" />
|
|
|
- <el-tooltip content="颜色填充" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.fill_color')" placement="top" :open-delay="250">
|
|
|
<el-color-picker
|
|
|
key="backgroundColor"
|
|
|
v-model="styleOptions.backgroundColor"
|
|
@@ -236,7 +236,7 @@
|
|
|
<img :src="nodeEdgeDisable?
|
|
|
require('@/assets/img/sand_new/tools/line-color-disabled.png'):
|
|
|
require('@/assets/img/sand_new/tools/line-color.png')" />
|
|
|
- <el-tooltip content="线条颜色" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.Line_color')" placement="top" :open-delay="250">
|
|
|
<el-color-picker
|
|
|
key="lineColor"
|
|
|
v-model="styleOptions.lineColor"
|
|
@@ -252,7 +252,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeLineWidth',nodeEdgeDisable,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="nodeEdgeDisable?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="线条宽度" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.line_width')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="nodeEdgeDisable?
|
|
|
require('@/assets/img/sand_new/tools/line-width-disabled.png'):
|
|
@@ -260,7 +260,7 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="线条宽度" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.line_width')" placement="top" :open-delay="250">
|
|
|
<span v-show="nodeEdgeDisable" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
@@ -281,7 +281,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeStrokeDasharray',nodeEdgeDisable,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="nodeEdgeDisable?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="线条样式" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.line_style')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="nodeEdgeDisable?
|
|
|
require('@/assets/img/sand_new/tools/line-style-disabled.png'):
|
|
@@ -289,16 +289,16 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="线条样式" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.line_style')" placement="top" :open-delay="250">
|
|
|
<span v-show="nodeEdgeDisable" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
<el-dropdown-item command="4 4" :class="styleOptions.lineStyle=='4 4'?'style-acitve':''">
|
|
|
- 虚线
|
|
|
+ {{$t('SandboxManage.SandFlow.dashed_line')}}
|
|
|
</el-dropdown-item>
|
|
|
<el-dropdown-item :command="null" :class="styleOptions.lineStyle==null?'style-acitve':''">
|
|
|
- 实线
|
|
|
+ {{$t('SandboxManage.SandFlow.solid_line')}}
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
@@ -307,7 +307,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeRouter',toolStatus.edgeDisabled,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="toolStatus.edgeDisabled?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="连线类型" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.connector_tyoe')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="toolStatus.edgeDisabled?
|
|
|
require('@/assets/img/sand_new/tools/line-type-disabled.png'):
|
|
@@ -315,7 +315,7 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="连线类型" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.connector_tyoe')" placement="top" :open-delay="250">
|
|
|
<span v-show="toolStatus.edgeDisabled" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
@@ -336,7 +336,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeSourceMarker',toolStatus.edgeDisabled,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="toolStatus.edgeDisabled?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="开始箭头" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.start_arrow')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="toolStatus.edgeDisabled?
|
|
|
require('@/assets/img/sand_new/tools/arrow-start-disabled.png'):
|
|
@@ -344,16 +344,16 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="开始箭头" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.start_arrow')" placement="top" :open-delay="250">
|
|
|
<span v-show="toolStatus.edgeDisabled" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
<el-dropdown-item command="classic" :class="styleOptions.startArrow=='classic'?'style-acitve':''">
|
|
|
- 有
|
|
|
+ {{$t('SandboxManage.SandFlow.yes_tag')}}
|
|
|
</el-dropdown-item>
|
|
|
<el-dropdown-item command="" :class="styleOptions.startArrow?'':'style-acitve'">
|
|
|
- 无
|
|
|
+ {{$t('SandboxManage.SandFlow.no_tag')}}
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
@@ -362,7 +362,7 @@
|
|
|
<el-dropdown trigger="click" @command="(e)=>toolClickOptions('changeTargetMarker',toolStatus.edgeDisabled,e)"
|
|
|
placement="bottom">
|
|
|
<div :class="toolStatus.edgeDisabled?'tool-disabled':''" class="dropdown-box">
|
|
|
- <el-tooltip content="结束箭头" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.end_arrow')" placement="top" :open-delay="250">
|
|
|
<div class="dropdown-content" >
|
|
|
<img :src="toolStatus.edgeDisabled?
|
|
|
require('@/assets/img/sand_new/tools/arrow-end-disabled.png'):
|
|
@@ -370,16 +370,16 @@
|
|
|
style="vertical-align: middle;"/>
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
- <el-tooltip content="结束箭头" placement="top" :open-delay="250">
|
|
|
+ <el-tooltip :content="$t('SandboxManage.SandFlow.end_arrow')" placement="top" :open-delay="250">
|
|
|
<span v-show="toolStatus.edgeDisabled" class="disabled-item" @click.stop="()=>{}"></span>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
<el-dropdown-item command="classic" :class="styleOptions.endArrow=='classic'?'style-acitve':''">
|
|
|
- 有
|
|
|
+ {{$t('SandboxManage.SandFlow.yes_tag')}}
|
|
|
</el-dropdown-item>
|
|
|
<el-dropdown-item command="" :class="styleOptions.endArrow?'':'style-acitve'">
|
|
|
- 无
|
|
|
+ {{$t('SandboxManage.SandFlow.no_tag')}}
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|