/** * v-dialogDragWidth 可拖动弹窗高度(右下角) * Copyright (c) 2019 ruoyi */ export default { bind(el) { const dragDom = el.querySelector(".el-dialog"); const lineEl = document.createElement("div"); lineEl.style = "width: 6px; background: inherit; height: 10px; position: absolute; right: 0; bottom: 0; margin: auto; z-index: 1; cursor: nwse-resize;"; lineEl.addEventListener( "mousedown", function (e) { // 鼠标按下,计算当前元素距离可视区的距离 const disX = e.clientX - el.offsetLeft; const disY = e.clientY - el.offsetTop; // 当前宽度 高度 const curWidth = dragDom.offsetWidth; const curHeight = dragDom.offsetHeight; document.onmousemove = function (e) { e.preventDefault(); // 移动时禁用默认事件 // 通过事件委托,计算移动的距离 const xl = e.clientX - disX; const yl = e.clientY - disY; dragDom.style.width = `${curWidth + xl}px`; dragDom.style.height = `${curHeight + yl}px`; }; document.onmouseup = function (e) { document.onmousemove = null; document.onmouseup = null; }; }, false ); dragDom.appendChild(lineEl); }, };