From 2a8221d08382bf6edabbce14049ec8ac96961447 Mon Sep 17 00:00:00 2001 From: liuxi <357439530@qq.com> Date: Tue, 7 Jan 2025 14:58:19 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BC=B9=E5=87=BA=E6=A1=86=E6=8B=96=E6=8B=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/js/directive.js | 119 ++++++++++++++++++ src/main.js | 2 + .../components/LayoutContentNew.vue | 5 +- .../components/MediationRecordDialog.vue | 107 ++++++++++++++++ .../mediation-page/components/cassWrit.vue | 7 +- 5 files changed, 235 insertions(+), 5 deletions(-) create mode 100644 src/assets/js/directive.js create mode 100644 src/pages/mediation-page/components/MediationRecordDialog.vue diff --git a/src/assets/js/directive.js b/src/assets/js/directive.js new file mode 100644 index 0000000..83fbbc0 --- /dev/null +++ b/src/assets/js/directive.js @@ -0,0 +1,119 @@ +import Vue from 'vue' + +/** + * 新增弹框拖拽功能 + */ +Vue.directive('drag', { + bind: (el) => { + // 获取弹框标题区域dom节点 + const headerDom = el.querySelector('.el-dialog__header'); + // 修改鼠标图标样式 + headerDom.style.cursor = "move"; + // 禁止拖拽时选中标题中文本内容 + headerDom.style.userSelect = "none"; + + // 获取弹框区域的dom节点 + const dialogDom = el.querySelector('.el-dialog__wrapper .el-dialog'); + console.log(dialogDom,'dialogDom') + // 弹窗距离边界的距离 + const boundingPadding = 1; + + // 是否正在拖动 + let isDrag = false; + + // 鼠标按下时位置坐标 + let clientX = 0, clientY = 0; + + // 按下时弹框位置坐标 + let dialogLeft = 0, dialogTop = 0; + let newLeft = 0, newTop = 0; + let dialogWidth = 0, dialogHeight = 0; + let distLeft = 0, distTop = 0; + + // 监听鼠标按下事件 + headerDom.onmousedown = function(e) { + isDrag = true; + + // 获取当前鼠标位置坐标 + clientX = e.clientX; + clientY = e.clientY; + + if(dialogDom.style.left == '') + { + // 未获取到 直接取50% + dialogLeft = document.documentElement.clientWidth / 2; + } + else + { + // 获取当前弹窗位置坐标 + dialogLeft = parseFloat(dialogDom.style.left); + } + if(isNaN(dialogLeft)){ + dialogLeft = 0; + } + newLeft = dialogLeft; + + if(dialogDom.style.top == '') + { + // 未获取到 直接取50% + dialogTop = document.documentElement.clientHeight / 2; + } + else + { + // 获取当前弹窗位置坐标 + dialogTop = parseFloat(dialogDom.style.top); + } + if(isNaN(dialogTop)){ + dialogTop = 0; + } + newTop = dialogTop; + + const dialogBounding = dialogDom.getBoundingClientRect(); + dialogWidth = dialogBounding.width; + dialogHeight = dialogBounding.height; + distLeft = dialogLeft - dialogBounding.left; + distTop = dialogTop - dialogBounding.top; + + // 绑定鼠标移动事件 + document.addEventListener('mousemove', el.mousemove); + } + + // 监听鼠标移动事件 + el.mousemove = function(e) { + // 按下的时候，执行移动操作 + if(isDrag){ + // 设置弹窗位置以及边界处理 + newLeft = dialogLeft + e.clientX - clientX; + if(newLeft-distLeftwindow.innerWidth-boundingPadding-dialogWidth){ + newLeft = distLeft + window.innerWidth - boundingPadding - dialogWidth; + } + dialogDom.style.left = newLeft + 'px'; + + newTop = dialogTop + e.clientY - clientY; + if(newTop-distTop<=boundingPadding){ + newTop = boundingPadding + distTop; + }else if(newTop-distTop>=window.innerHeight-boundingPadding-dialogHeight){ + newTop = distTop + window.innerHeight - boundingPadding - dialogHeight; + } + dialogDom.style.top = newTop + 'px'; + } + } + + // 监听鼠标抬起事件 + el.mouseup = function(e) { + isDrag = false; + + // 解绑鼠标移动事件 + document.removeEventListener('mousemove', el.mousemove); + } + + // 绑定鼠标抬起事件 + document.addEventListener('mouseup', el.mouseup); + }, + unbind: (el) => { + // 解绑鼠标抬起事件 + document.removeEventListener('mouseup', el.mouseup); + } +}) \ No newline at end of file diff --git a/src/main.js b/src/main.js index b5ab6ff..b750933 100644 --- a/src/main.js +++ b/src/main.js @@ -16,6 +16,8 @@ import './assets/style/element-ui-variable.scss' // import 'element-ui/lib/theme-chalk/index.css'; import 'element-ui/lib/theme-chalk/icon.css' import {TrydoFiles} from "@trydo/files-utils" +// 引入全局通用自定义指令 +import '@/assets/js/directive'; Vue.use(ElementUI); diff --git a/src/pages/mediation-page/components/LayoutContentNew.vue b/src/pages/mediation-page/components/LayoutContentNew.vue index beb4376..587b734 100644 --- a/src/pages/mediation-page/components/LayoutContentNew.vue +++ b/src/pages/mediation-page/components/LayoutContentNew.vue @@ -453,7 +453,7 @@ - 新增沟通记录 + 新增沟通记录 @@ -634,6 +634,7 @@ + @@ -655,9 +656,11 @@ export default { singleofficeWritPopover: () => import('./singleofficeWritPopover.vue'),//发起签字 singleofficeSealPopover: () => import('./singleofficeSealPopover.vue'),//发起签章 singleofficeDeliveryPopover: () => import('./singleofficeDeliveryPopover.vue'),//发起送达 + MediationRecordDialog: () => import('./MediationRecordDialog.vue'),//调解记录 }, data() { return { + visiblemediatRecord:false, singledeliveryvisible:false, singlesealvisible:false, singleofficevisible:false, diff --git a/src/pages/mediation-page/components/MediationRecordDialog.vue b/src/pages/mediation-page/components/MediationRecordDialog.vue new file mode 100644 index 0000000..66356f9 --- /dev/null +++ b/src/pages/mediation-page/components/MediationRecordDialog.vue @@ -0,0 +1,107 @@ + + + + \ No newline at end of file diff --git a/src/pages/mediation-page/components/cassWrit.vue b/src/pages/mediation-page/components/cassWrit.vue index 05d5962..cafb3d4 100644 --- a/src/pages/mediation-page/components/cassWrit.vue +++ b/src/pages/mediation-page/components/cassWrit.vue @@ -179,7 +179,7 @@ export default { type: "warning", }).then(() => { if(!this.$clickThrottle()) { return }//防止重复点击 - let data = {id: item.id} + let data = {id: item.generateLogId} caseManagement.traceGenerateDelete(data).then((res) => { this.$message.success("文书删除成功"); this.getWritCaseList() @@ -187,9 +187,8 @@ export default { }).catch(() => {}); }, async handlePreview(item) { - let previewUrl = `/mediate/minio/preview/${item.previewUrl}` - if(item.previewUrl.includes('http')){previewUrl = item.previewUrl} - // console.log(previewUrl,'previewUrl') + let previewUrl = `/mediate/minio/preview/${item.fullUrl}` + if(item.fullUrl.includes('http')){previewUrl = item.fullUrl} this.previewPath = previewUrl this.editPdfFlag = true; },