From a660db06773007b1be690e0674829c00a57aeb7b Mon Sep 17 00:00:00 2001
From: 廖井涛 <2265517004@qq.com>
Date: 星期三, 24 十二月 2025 16:21:23 +0800
Subject: [PATCH] 订单首页流程卡新增楼层编号显示
---
north-glass-erp/northglass-erp/src/hook/mouseMove.ts | 139 +++++++++++++++++++++++++++++++++++++++++----
1 files changed, 125 insertions(+), 14 deletions(-)
diff --git a/north-glass-erp/northglass-erp/src/hook/mouseMove.ts b/north-glass-erp/northglass-erp/src/hook/mouseMove.ts
index c681de7..e3a88e8 100644
--- a/north-glass-erp/northglass-erp/src/hook/mouseMove.ts
+++ b/north-glass-erp/northglass-erp/src/hook/mouseMove.ts
@@ -1,6 +1,7 @@
//榧犳爣婊戝姩閫変腑
import {nextTick, ref,reactive} from "vue";
import {ElMessage} from "element-plus";
+import {add} from "../utils/decimal"
let isSelecting = ref(false) // 鏄惁姝ｅ湪杩涜閫夋嫨鎿嶄綔,榛樿涓篺alse
let selectionStart = reactive({ rowIndex: -1, cellIndex: -1 }) // 閫夋嫨鎿嶄綔璧峰鍗曞厓鏍间綅缃�
@@ -12,8 +13,10 @@
//鑾峰彇vxetable琛ㄦ牸鑺傜偣
let xGrid = ref()
let cellarea = ref(`
- <div class="vxe-table--cell-area" >
- <span class="vxe-table--cell-main-area" ></span>
+ <div class="vxe-table--cell-area" style="font-size: 10px;text-align: left" >
+ <span class="vxe-table--cell-main-area" >
+ <p style="bottom: 0;color: blue;background-color: #5cadfe; margin-top: auto;font-size: 14px"></p>
+ </span>
<span class="vxe-table--cell-active-area" ></span>
</div>
`)
@@ -28,12 +31,17 @@
xGrid.value = xGrids
gridOptions = gridOption
let newElement = document.createElement('div')
+ let leftElement = document.createElement('div')
const parser = new DOMParser();
const htmlDoc = parser.parseFromString(cellarea.value, 'text/html')
newElement.innerHTML = htmlDoc.body.innerHTML
+ leftElement.innerHTML = htmlDoc.body.innerHTML
//cellarea.value = newElement
//娣诲姞澶氶�夊垪
nextTick(() => {
+ window.addEventListener("keydown", ()=>{
+ destroyAreaBox()
+ })
window.addEventListener("mousedown", tableOutDestroyAreaBox)//缁檞indow娣诲姞榧犳爣鎸変笅浜嬩欢,鍒ゆ柇鏄惁鍦ㄨ〃鏍煎,鏄攢姣�
window.addEventListener("mouseup", tbodymouseup)//缁檞indow娣诲姞榧犳爣鏉惧紑浜嬩欢
let tbody = getTablexGrid().$el.querySelector(".vxe-table--main-wrapper table tbody")//鑾峰彇tbody鍖哄煙
@@ -55,7 +63,7 @@
// })
}
- /*setTimeout(() => {
+ setTimeout(() => {
//#region 宸︿晶鍥哄畾鍒�
let leftfixedtbody = getTablexGrid().$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-left-wrapper .vxe-table--body-wrapper table tbody")//鑾峰彇fixedtbody鍖哄煙
@@ -64,18 +72,18 @@
leftfixedtbody.addEventListener("mousemove", tbodymousemove)//缁欒〃鏍间腑鐨刲eftfixedtbody娣诲姞榧犳爣绉诲姩浜嬩欢
leftfixedtbody.addEventListener("mouseout", throttle(tbodymouseout, 50))//缁欒〃鏍间腑鐨刲eftfixedtbody娣诲姞榧犳爣绉诲嚭浜嬩欢
leftfixedtbody.addEventListener("click", tableCellClick)//娣诲姞鍗曞嚮浜嬩欢
- leftfixedtbody.oncontextmenu = tableCellMenuClick//娣诲姞鍙抽敭鑿滃崟浜嬩欢
+ //leftfixedtbody.oncontextmenu = tableCellMenuClick//娣诲姞鍙抽敭鑿滃崟浜嬩欢
}
let leftFixedBodyWrapper = getTablexGrid().$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-left-wrapper .vxe-table--body-wrapper")
if (leftFixedBodyWrapper) {
//娉ㄦ剰杩欓噷鐨剅ef鍚嶇О锛岃繖閲屾槸fixed鍖哄煙鐨勬鐨勫悕绉�
- leftFixedBodyWrapper.appendChild(leftfixedcellarea.value)
+ leftFixedBodyWrapper.appendChild(leftElement)
}
//#endregion
//#region 鍙充晶鍥哄畾鍒�
- let rightfixedtbody = getTablexGrid().$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-right-wrapper .vxe-table--body-wrapper table tbody")//鑾峰彇fixedtbody鍖哄煙
+ /* let rightfixedtbody = getTablexGrid().$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-right-wrapper .vxe-table--body-wrapper table tbody")//鑾峰彇fixedtbody鍖哄煙
if (rightfixedtbody) {
rightfixedtbody.addEventListener("mousedown", tbodymousedown)//缁欒〃鏍间腑鐨剅ightfixedtbody娣诲姞榧犳爣鎸変笅浜嬩欢
@@ -89,10 +97,10 @@
if (rightFixedBodyWrapper) {
//娉ㄦ剰杩欓噷鐨剅ef鍚嶇О锛岃繖閲屾槸fixed鍖哄煙鐨勬鐨勫悕绉�
rightFixedBodyWrapper.appendChild(rightfixedcellarea.value)
- }
+ }*/
//#endregion
- }, 100)*/
+ }, 100)
})
}
@@ -105,6 +113,14 @@
if (event.button === 0) {//宸﹂敭鎸変笅
// 璁板綍閫夋嫨鎿嶄綔璧峰浣嶇疆
selectionStart = getCellPosition(event.target)//璁剧疆閫夋嫨鎿嶄綔璧峰鍗曞厓鏍间綅缃�
+ selectionEnd = selectionStart
+ const activeElement = getTablexGrid().$el.querySelector(".vxe-table--main-wrapper .vxe-table--body-wrapper .vxe-table--cell-main-area p")
+ const element = xGrid.value.$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-left-wrapper .vxe-table--body-wrapper .vxe-table--cell-main-area p")
+ activeElement.innerHTML =''
+ if(element){
+ element.innerHTML =''
+ }
+
isSelecting.value = true//鏍囪涓烘鍦ㄩ�夋嫨鎿嶄綔
}
@@ -129,6 +145,40 @@
if (event.button === 0) {//宸﹂敭鏉惧紑
isSelecting.value = false//鏍囪涓哄仠姝㈤�夋嫨鎿嶄綔
}
+ const result = exportData()
+ if(!result){
+ return
+ }
+ const activeElement = getTablexGrid().$el.querySelector(".vxe-table--main-wrapper .vxe-table--body-wrapper .vxe-table--cell-main-area p")
+ const element = xGrid.value.$el.querySelector(".vxe-table--fixed-wrapper .vxe-table--fixed-left-wrapper .vxe-table--body-wrapper .vxe-table--cell-main-area p")
+
+
+ if(result.length<=2 && result[0].length===1){
+ activeElement.innerHTML =''
+ if(element){
+ element.innerHTML =''
+ }
+
+ return
+ }
+ let sum = 0
+
+ result.forEach((item,index) => {
+ if(index>0){
+ const val = isNaN(item[0])?0:item[0]
+ sum = Number(add(sum, (val || 0)))
+ }
+ })
+
+ sum=isNaN(sum)?0:sum
+ setTimeout(()=>{
+ activeElement.innerHTML ="SUM:"+sum
+ if(element){
+ element.innerHTML ="SUM:"+sum
+ }
+
+ },200)
+
}
let outevent = ref()//绉诲姩浜嬩欢,涓嶄繚瀛�,寰幆瀹氭椂鍣ㄥ唴鏃犳硶鐩戝惉鍒版柊鐨勪簨浠�
@@ -224,6 +274,11 @@
element.style.height = `${height}px`
element.style.top = `${top}px`
element.style.display = "block"
+ if(index%2==1){
+ element.style.display = "flex"
+ element.style.flexDirection = 'column'
+ }
+
if (index <= elements.length - 1 - 2) {//濡傛灉涓嶆槸rightFixedActiveElement鎴杛ightFixedMainElement
element.style.left = `${left}px`
} else {
@@ -308,6 +363,7 @@
}
}
+
//琛ㄦ牸澶栭攢姣佽寖鍥存
const tableOutDestroyAreaBox = (event: MouseEvent) => {
var element = getTablexGrid().$el.querySelector(".vxe-table--render-wrapper")
@@ -318,6 +374,7 @@
destroyAreaBox()
}
}
+
}
@@ -447,18 +504,72 @@
}
+const exportData = () => {
+ let data = []
+ let title = []
+ try{
+ // //杩欓噷闇�瑕佹槸visibleData
+ if(getTablexGrid().getTableData()?.visibleData===undefined){
+ return null
+ }
+ let tableData = getTablexGrid().getTableData().visibleData//鑾峰彇澶勭悊鏉′欢涔嬪悗鐨勫叏閲忚〃浣撴暟鎹�
+ let rowStart = selectionStart.rowIndex//鑾峰彇閫変腑璧峰琛岀储寮�
+ let rowEnd = selectionEnd.rowIndex//鑾峰彇閫変腑缁撴潫琛岀储寮�
+ let selectRows = tableData.filter((col, index: number) => {//col鍙傛暟涓嶈兘鏀瑰惁鍒欎細鑾峰彇涓嶅埌鏁版嵁
+ //杩欓噷淇敼浠庡彸涓嬪線宸︿笂鎷栧姩鐨勬暟鎹樉绀�
+ if (rowStart <= rowEnd) {
+ return rowStart <= index && rowEnd >= index
+ } else {
+ return rowStart >= index && rowEnd <= index
+ }
+ })
+ //杩欓噷闇�瑕佹槸visibleColumn
+ let colStart = selectionStart.cellIndex//鑾峰彇閫変腑璧峰鍒楃储寮�
+ let colEnd = selectionEnd.cellIndex//鑾峰彇閫変腑缁撴潫鍒楃储寮�
+ let tableColumn = getTablexGrid().getTableColumn().visibleColumn//鑾峰彇澶勭悊鏉′欢涔嬪悗鐨勫叏閲忚〃澶村垪
+ let selectCols = tableColumn.filter((col, index: number) => {//col鍙傛暟涓嶈兘鏀瑰惁鍒欎細鑾峰彇涓嶅埌鏁版嵁
+ //杩欓噷淇敼浠庡彸涓嬪線宸︿笂鎷栧姩鐨勬暟鎹樉绀�
+ if (colStart <= colEnd) {
+ return colStart <= index && colEnd >= index
+ } else {
+ return colStart >= index && colEnd <= index
+ }
+ })
+ selectCols.forEach((col, index) => {
+ title.push(col['title'])
+ })
+ data.push(title)
+ selectRows.forEach((row, index) => {
+ let rowData = []
+ selectCols.forEach((col, index) => {
+ const parts = col['property'].split('.')
+ let result = row
+ for (const part of parts) {
+ if (result && result[part] !== undefined) {
+ result = result[part];
+ } else {
+ return null;
+ }
+ }
+ rowData.push(result)
+ })
+ data.push(rowData)
+ })
+ }catch (e) {
+ // selectionStart = { rowIndex: -1, cellIndex: -1 } // 閫夋嫨鎿嶄綔璧峰鍗曞厓鏍间綅缃�
+ // selectionEnd = { rowIndex: -1, cellIndex: -1 }
+ }
+ return data
-
-
-
-
-
+}
export {
addListener,
- toolbarButtonClickEvent
+ toolbarButtonClickEvent,
+ exportData,
+ destroyAreaBox
}
\ No newline at end of file
--
Gitblit v1.8.0