zm/tougao_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tijiao

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist.zip
View File

Binary file not shown.

4
src/api/index.js
View File

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

2
src/assets/css/main.css
View File

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

8
src/components/common/Header.vue
View File

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

2
src/components/common/Sidebar.vue
View File

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

146
src/components/page/components/table/word.vue
View File

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