JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-09-24 17:20:21 +08:00
Code Issues Projects Releases Wiki Activity

fix(editor): icon使用editor封装的icon组件

Browse Source
This commit is contained in:
parisma 2022-09-13 20:26:17 +08:00 committed by jia000
parent fc749b7375
commit 441a412817
2 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/editor/src/layouts/sidebar/code-block/CodeBlockList.vue
View File

@ -13,11 +13,11 @@
<div class="list-item"> <div class="list-item">
<div class="code-name">{{ value.name }}（{{ key }}）</div> <div class="code-name">{{ value.name }}（{{ key }}）</div>
<div class="right-tool"> <div class="right-tool">
<el-tooltip effect="dark" content="编辑" placement="top"> <el-tooltip effect="dark" :content="editable ? '编辑' : '查看'" placement="top">
<el-icon class="edit-icon" @click="editCode(key)"><Edit /></el-icon> <Icon :icon="editable ? Edit : View" class="edit-icon" @click="editCode(key)"></Icon>
</el-tooltip> </el-tooltip>
<el-tooltip effect="dark" content="删除" placement="top"> <el-tooltip effect="dark" content="删除" placement="top" v-if="editable">
<el-icon class="edit-icon" @click="deleteCode(key)"><Close /></el-icon> <Icon :icon="Close" class="edit-icon" @click="deleteCode(key)"></Icon>
</el-tooltip> </el-tooltip>
<slot name="code-block-panel-tool" :id="key"></slot> <slot name="code-block-panel-tool" :id="key"></slot>
</div> </div>
@ -36,10 +36,11 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, inject, ref, watchEffect } from 'vue'; import { computed, inject, ref, watchEffect } from 'vue';
import { Close, Edit } from '@element-plus/icons-vue'; import { Close, Edit, View } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus'; import { ElMessage } from 'element-plus';
import { flattenDeep, isEmpty, values } from 'lodash-es'; import { flattenDeep, isEmpty, values } from 'lodash-es';
import Icon from '../../../components/Icon.vue';
import type { CodeBlockContent, Services } from '../../../type'; import type { CodeBlockContent, Services } from '../../../type';
import { CodeBlockDSL, EditorMode } from '../../../type'; import { CodeBlockDSL, EditorMode } from '../../../type';

2
packages/editor/src/theme/code-block.scss
View File

@ -24,7 +24,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
.edit-icon { .edit-icon {
padding: 0 5px; margin: 0 5px;
} }
} }
.code-name { .code-name {