This commit is contained in:
2025-05-30 11:32:00 +08:00
parent 5f7f1d992b
commit 94ab97b501
6 changed files with 125 additions and 37 deletions

View File

@@ -19,8 +19,8 @@ const service = axios.create({
// baseURL: 'https://submission.tmrjournals.com/', //正式 记得切换
// baseURL: 'http://www.tougao.com/', //测试本地 记得切换
// baseURL: 'http://192.168.110.110/tougao/public/index.php/',
// baseURL: '/api', //本地
baseURL: '/', //正式
baseURL: '/api', //本地
// baseURL: '/', //正式
});

View File

@@ -29,7 +29,7 @@ a {
position: absolute;
left: 260px;
right: 0;
top: 70px;
top: 60px;
bottom: 0;
padding-bottom: 30px;
-webkit-transition: left .3s ease-in-out;

View File

@@ -297,7 +297,7 @@ export default {
position: relative;
box-sizing: border-box;
width: 100%;
height: 70px;
height: 60px;
font-size: 22px;
color: #fff;
}
@@ -306,12 +306,12 @@ export default {
float: left;
padding: 0 15px 0 21px;
cursor: pointer;
line-height: 70px;
line-height: 60px;
}
.header .logo {
float: left;
padding-top: 19px;
padding-top: 14px;
vertical-align: middle;
font-size: 20px;
}
@@ -341,7 +341,7 @@ export default {
.header-user-con {
display: flex;
height: 70px;
height: 60px;
align-items: center;
}

View File

@@ -763,7 +763,7 @@ export default {
display: block;
position: absolute;
left: 0;
top: 70px;
top: 60px;
bottom: 0;
overflow-y: scroll;
/* -webkit-box-shadow: 0px 0px 25px 0px rgb(45 69 95 / 10%); */

View File

@@ -5,7 +5,7 @@
ref="scrollDiv"
>
<div
class=""
class=""
style="
box-shadow: 0 2px 2px -2px rgba(34, 47, 62, 0.1), 0 8px 8px -4px rgba(34, 47, 62, 0.07);
margin: 0px 0;
@@ -27,7 +27,7 @@
display: flex;
align-items: center;
justify-content: space-between;
padding:0 10px;
padding: 0 10px;
box-sizing: border-box;
overflow: hidden;
width: calc(100% - 285px - 330px);
@@ -74,18 +74,15 @@
<ul class="operateBox">
<li
v-if="isEditComment"
style=" background-color: #fff !important; color: #f56c6c; border: 1px solid #f56c6c"
style="background-color: #fff !important; color: #f56c6c; border: 1px solid #f56c6c"
@mousedown="cacheSelection"
@click="handleSelection"
>
<i class="el-icon-document-add" style="margin-top: 2px;float: left;"></i>
<i class="el-icon-document-add" style="margin-top: 2px; float: left"></i>
Comment
</li>
<li
style=" background-color: #cbccd1 !important; color: #333; border: 1px solid #cbccd1"
@click="onAddRow"
>
<li style="background-color: #cbccd1 !important; color: #333; border: 1px solid #cbccd1" @click="onAddRow">
<i class="el-icon-document-add" style="margin-top: 2px"></i>
Row
@@ -97,7 +94,7 @@
Edit
</li>
<li style=" background-color: #fc625d !important;" @click="onDelete">
<li style="background-color: #fc625d !important" @click="onDelete">
<i class="el-icon-delete" style="margin-top: 2px"></i>
Delete
@@ -117,10 +114,9 @@
position: relative;
"
>
{{ selectedIds }}
<div v-if="selectedIds.length > 0" class="selected-to-here">
<!-- <div v-if="selectedIds.length > 0" class="selected-to-here">
Selected to here: {{ selectedIds[selectedIds.length - 1] }}
</div>
</div> -->
<!-- <common-late-x></common-late-x> -->
<template v-for="(item, index) in wordList">
<el-checkbox
@@ -141,7 +137,19 @@
<span>{{ item.am_id }}</span>
</span>
<div
:class="!isPreview ? (item.is_h1 ? 'isTitleH1' : item.is_h2 ? 'isTitleH2' : item.is_h3 ? 'isTitleH3' : '') : item.is_h1 ? 'Ptitle' :''"
:class="
!isPreview
? item.is_h1
? 'isTitleH1'
: item.is_h2
? 'isTitleH2'
: item.is_h3
? 'isTitleH3'
: ''
: item.is_h1
? 'Ptitle'
: ''
"
style="line-height: 24px"
>
<template v-if="!isPreview">
@@ -195,6 +203,7 @@
:data-id="item.ami_id"
:type="item.type"
:main-id="item.am_id"
@contextmenu.prevent="openMenu($event, 'img', item.am_id, item, index)"
:id="'editor' + item.am_id"
>
<img :src="`${mediaUrl + item.image.url}`" />
@@ -226,6 +235,7 @@
:type="item.type"
:id="'editor' + item.am_id"
:main-id="item.am_id"
@contextmenu.prevent="openMenu($event, 'table', item.am_id, item, index)"
>
<!-- 标题部分 -->
<font class="font" :style="`width: ${item.width ? `${item.width}px` : '100%'}`" style="text-align: center">
@@ -257,6 +267,7 @@
</div>
<div
@contextmenu.prevent="openMenu($event, 'content', item.am_id, item, index)"
@dblclick="dblclickEdit(item.am_id, 'text', item, index)"
v-else
id="drop-target"
@@ -472,6 +483,15 @@
<!-- </form> -->
<!-- <textarea class="tinymce-textarea" :id="tinymceId"></textarea> -->
<div v-if="isMenuVisible" class="context-menu" :style="{ top: `${menuPosition.y}px`, left: `${menuPosition.x}px` }">
<ul>
<!-- {{ menuType }} -->
<li @click="menuAction('up')"><i class="el-icon-arrow-up" style=""></i>Move Up</li>
<li @click="menuAction('down')"><i class="el-icon-arrow-down" style=""></i>Move Down</li>
<li @click="menuAction('delete')"><i class="el-icon-delete" style=""></i>Delete</li>
</ul>
</div>
</div>
</template>
<script>
@@ -666,6 +686,9 @@ export default {
},
data() {
return {
isMenuVisible: false,
menuPosition: { x: 0, y: 0 },
menuType: '', // 用来区分不同的菜单
cachedHtml: '', // 缓存选中的 HTML
cachedText: '', // 缓存选中的纯文本
cachedMainId: null, // 选中的 main-id
@@ -735,7 +758,7 @@ export default {
formLabelWidth: '120px',
hasChange: false,
hasInit: false,
selectedIds:[],
// selectedIds:[],
tinymceId: this.id || 'vue-tinymce-' + +new Date()
};
},
@@ -810,6 +833,34 @@ export default {
this.editors = {};
},
methods: {
openMenu(event, type,currentId) {
console.log('event at line 860:', event);
// 获取鼠标点击位置
this.menuPosition.x = event.clientX;
this.menuPosition.y = event.clientY;
this.menuType = type; // 设置菜单类型,根据点击区域不同显示不同菜单
this.currentId=currentId;
// this.isMenuVisible = true;
},
closeMenu() {
this.isMenuVisible = false;
},
menuAction(action) {
console.log(`执行了:${action}`);
switch(action){
case 'up':
this.changeSort('up');
break;
case 'down':
this.changeSort('down');
break;
case 'delete':
this.onDelete();
break;
}
this.closeMenu();
},
changeSort(type) {
console.log('type at line 782:', type);
if (this.currentId) {
@@ -914,8 +965,8 @@ export default {
updateUniqueIds() {
this.currentId = null;
this.currentData = {};
console.log('this.selectedIds at line 917:', this.selectedIds)
console.log('this.selectedIds at line 917:', this.selectedIds);
// this.uniqueIds = [...new Set(this.wordList.filter((item) => item.checked).map((item) => item.am_id))];
// console.log('this.uniqueIds at line 839:', this.selectedIds);
this.$forceUpdate();
@@ -930,7 +981,7 @@ export default {
},
onDelete() {
// console.log('this.uniqueIds.length at line 866:', this.selectedIds.length);
if (this.selectedIds&&this.selectedIds.length > 0) {
if (this.selectedIds && this.selectedIds.length > 0) {
this.$emit('onDeletes', this.selectedIds.toString());
this.$forceUpdate();
}
@@ -1196,7 +1247,7 @@ export default {
image_advtab: false, // 禁用图片高级选项卡(防止自动调整大小)
plugins: 'forecolor code paste table image resize ',
content_style: `${tableStyle + this.wordStyle}
`,
entity_encoding: 'raw', // 不编码 > 等字符
menubar: false,
@@ -1355,6 +1406,7 @@ export default {
},
divOnScroll() {
if (!this.isPreview) {
this.isMenuVisible = false;
this.currentId = null;
this.currentData = {};
// const scrollTop = scrollDiv.scrollTop; // 获取垂直滚动距离
@@ -2358,6 +2410,7 @@ export default {
color: #333;
font-weight: bold;
font-size: 20px;
cursor: pointer;
}
.operateBox {
width: auto;
@@ -2369,9 +2422,10 @@ export default {
/* flex-direction: column; */
justify-content: space-between;
align-items: center;
cursor: pointer;
list-style: none;
padding: 2px 10px;
margin-left:10px;
margin-left: 10px;
color: #8a8a8b;
/* font-weight: bold; */
font-size: 16px;
@@ -2386,15 +2440,49 @@ export default {
}
/* 悬浮提示的样式 */
.selected-to-here {
position: fixed;
top: 10px;
left: 50%;
transform: translateX(-50%);
background-color: rgba(0, 123, 255, 0.7);
color: white;
padding: 10px 20px;
border-radius: 5px;
font-size: 14px;
z-index: 999;
position: fixed;
top: 10px;
left: 50%;
transform: translateX(-50%);
background-color: rgba(0, 123, 255, 0.7);
color: white;
padding: 10px 20px;
border-radius: 5px;
font-size: 14px;
z-index: 999;
}
.context-menu {
position: fixed;
width: 150px;
background-color: #fff;
box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
border-radius: 4px;
z-index: 1000;
border: 1px solid #ddd;
border-radius: 4px;
line-height: 28px;
}
.context-menu ul {
list-style: none;
padding: 0;
margin: 0;
}
.context-menu li {
padding: 10px;
cursor: pointer;
font-size: 14px;
color: rgb(51, 54, 57);
border-radius: 4px;
padding: 4px 0;
}
.context-menu li i {
margin: 5px 10px 0 10px;
font-size: 18px;
}
.context-menu li:hover {
background-color: #f0f0f0;
}
</style>