wuye / webui

Commit 5480f93a5b847788b93d029a4283728e8241109e

Authored by wuxw
1 parent 47b8eddb

支持 房屋收费页面点击缴费后返回还是那个房屋信息

Inline Side-by-side
Showing 4 changed files with 500 additions and 35 deletions
src/components/room/roomTreeDiv.vue
  View file @5480f93
... ... @@ -25,7 +25,9 @@ export default {
25 25 children: 'children',
26 26 label: 'text'
27 27 },
28   - communityId: ''
  28 + communityId: '',
  29 + lastSelected: {},
  30 + isInitialized: false // 添加初始化标志
29 31 }
30 32 },
31 33 created() {
... ... @@ -34,6 +36,17 @@ export default {
34 36 },
35 37 methods: {
36 38 async loadTreeData() {
  39 + // 加载上次选择的房屋信息
  40 + let lastSelected = localStorage.getItem('lastSelectedRoom');
  41 + if (lastSelected) {
  42 + try {
  43 + this.lastSelected = JSON.parse(lastSelected);
  44 + } catch (error) {
  45 + console.error('解析lastSelected失败:', error);
  46 + localStorage.removeItem('lastSelectedRoom');
  47 + }
  48 + }
  49 +
37 50 try {
38 51 const units = await queryUnits({
39 52 communityId: this.communityId
... ... @@ -73,11 +86,94 @@ export default {
73 86  
74 87 this.treeData = Object.values(floorMap)
75 88 this.$nextTick(() => {
76   - this.expandAndSelectFirstRoom()
  89 + // 如果有上次选择的房屋，则展开并选择；否则选择第一个房屋
  90 + if (this.lastSelected && this.lastSelected.floorId && this.lastSelected.unitId) {
  91 + this.expandAndSelectLastRoom()
  92 + } else {
  93 + this.expandAndSelectFirstRoom()
  94 + }
77 95 })
78 96 },
  97 + // 新增：展开并选择上次选择的房屋
  98 + async expandAndSelectLastRoom() {
  99 + if (!this.lastSelected || !this.lastSelected.floorId || !this.lastSelected.unitId) {
  100 + this.expandAndSelectFirstRoom()
  101 + return
  102 + }
  103 +
  104 + const treeRef = this.$refs.tree
  105 + if (!treeRef || !treeRef.store) {
  106 + // 如果树还没有完全初始化，延迟执行
  107 + setTimeout(() => this.expandAndSelectLastRoom(), 100)
  108 + return
  109 + }
  110 +
  111 + try {
  112 + // 查找对应的楼栋和单元
  113 + const floorNode = this.treeData.find(floor => floor.floorId === this.lastSelected.floorId)
  114 + if (!floorNode) {
  115 + console.warn('未找到对应的楼栋:', this.lastSelected.floorId)
  116 + this.expandAndSelectFirstRoom()
  117 + return
  118 + }
  119 +
  120 + const unitNode = floorNode.children.find(unit => unit.unitId === this.lastSelected.unitId)
  121 + if (!unitNode) {
  122 + console.warn('未找到对应的单元:', this.lastSelected.unitId)
  123 + this.expandAndSelectFirstRoom()
  124 + return
  125 + }
  126 +
  127 + // 展开楼栋和单元
  128 + const floorTreeNode = treeRef.store.nodesMap[floorNode.id]
  129 + const unitTreeNode = treeRef.store.nodesMap[unitNode.id]
  130 +
  131 + if (floorTreeNode) {
  132 + floorTreeNode.expanded = true
  133 + }
  134 + if (unitTreeNode) {
  135 + unitTreeNode.expanded = true
  136 + }
  137 +
  138 + // 加载房屋数据
  139 + await this.loadRooms(unitNode, { data: unitNode })
  140 +
  141 + // 选择上次选择的房屋
  142 + if (this.lastSelected.roomId) {
  143 + this.selectSpecificRoom(this.lastSelected.roomId)
  144 + }
  145 +
  146 + this.isInitialized = true
  147 + } catch (error) {
  148 + console.error('展开上次选择的房屋失败:', error)
  149 + this.expandAndSelectFirstRoom()
  150 + }
  151 + },
  152 + // 新增：选择特定的房屋
  153 + selectSpecificRoom(roomId) {
  154 + const treeRef = this.$refs.tree
  155 + if (!treeRef) return
  156 +
  157 + const roomNodeId = `r_${roomId}`
  158 + const roomTreeNode = treeRef.store.nodesMap[roomNodeId]
  159 +
  160 + if (roomTreeNode) {
  161 + // 设置当前选中节点
  162 + treeRef.setCurrentKey(roomNodeId)
  163 +
  164 + // 触发选择事件
  165 + this.$emit('selectRoom', {
  166 + roomId: roomId,
  167 + roomName: this.lastSelected.roomName || ''
  168 + })
  169 + } else {
  170 + // 如果房屋节点还没有加载，等待加载完成后再选择
  171 + setTimeout(() => this.selectSpecificRoom(roomId), 200)
  172 + }
  173 + },
79 174 async expandAndSelectFirstRoom() {
80 175 if (!this.treeData.length) return
  176 +
81 177 const firstFloor = this.treeData[0]
82 178 if (!firstFloor.children || !firstFloor.children.length) return
83 179 const firstUnit = firstFloor.children[0]
... ... @@ -87,6 +183,7 @@ export default {
87 183 treeRef.store.nodesMap[firstUnit.id] && (treeRef.store.nodesMap[firstUnit.id].expanded = true)
88 184 }
89 185 await this.loadRooms(firstUnit, { data: firstUnit })
  186 + this.isInitialized = true
90 187 },
91 188 async handleNodeClick(data, node) {
92 189 if (data.id.startsWith('u_')) {
... ... @@ -95,12 +192,41 @@ export default {
95 192 node.expanded = true
96 193 }
97 194 } else if (data.id.startsWith('r_')) {
  195 + // 获取父节点信息
  196 + const parentNodes = this.getParentNodes(data)
  197 + let selectedData = {
  198 + floorId: parentNodes.floorId,
  199 + unitId: parentNodes.unitId,
  200 + roomId: data.roomId,
  201 + roomName: data.roomName
  202 + };
  203 +
  204 + // 保存到localStorage
  205 + localStorage.setItem('lastSelectedRoom', JSON.stringify(selectedData));
  206 + this.lastSelected = selectedData;
  207 +
98 208 this.$emit('selectRoom', {
99 209 roomId: data.roomId,
100 210 roomName: data.roomName
101 211 })
102 212 }
103 213 },
  214 + // 新增：获取父节点信息
  215 + getParentNodes(data) {
  216 + const treeRef = this.$refs.tree
  217 + if (!treeRef || !treeRef.store) return { floorId: '', unitId: '' }
  218 +
  219 + const node = treeRef.store.nodesMap[data.id]
  220 + if (!node || !node.parent) return { floorId: '', unitId: '' }
  221 +
  222 + const unitNode = node.parent
  223 + const floorNode = unitNode.parent
  224 +
  225 + return {
  226 + floorId: floorNode ? floorNode.data.floorId : '',
  227 + unitId: unitNode ? unitNode.data.unitId : ''
  228 + }
  229 + },
104 230 async loadRooms(unitData, node) {
105 231 try {
106 232 const { rooms } = await queryRoomsTree({
... ... @@ -123,15 +249,24 @@ export default {
123 249  
124 250 // Update the node's children
125 251 this.$set(node.data, 'children', roomNodes)
126   - this.$emit('selectRoom', {
127   - roomId: roomNodes[0].roomId,
128   - roomName: roomNodes[0].roomName
129   - })
  252 +
  253 + // 只有在初始化时才自动选择第一个房屋
  254 + if (!this.isInitialized) {
  255 + this.$emit('selectRoom', {
  256 + roomId: roomNodes[0].roomId,
  257 + roomName: roomNodes[0].roomName
  258 + })
  259 + }
130 260 }
131 261 } catch (error) {
132 262 console.error('Failed to load rooms:', error)
133 263 this.$message.error(this.$t('roomTree.loadRoomError'))
134 264 }
  265 + },
  266 + // 新增：清除保存的选择记录
  267 + clearLastSelected() {
  268 + localStorage.removeItem('lastSelectedRoom')
  269 + this.lastSelected = {}
135 270 }
136 271 }
137 272 }
... ...
src/views/fee/roomCreateFeeList.vue
  View file @5480f93
1 1 <template>
2 2 <div class="app-container">
3   - <el-row :gutter="20">
4   - <el-col :span="4" class="tree-container">
  3 + <div class="resizable-layout">
  4 + <!-- 左侧树形组件 -->
  5 + <div class="tree-panel" :style="{ width: treeWidth + 'px' }">
5 6 <room-tree-div ref="roomTreeDiv" @selectRoom="handleSelectRoom"></room-tree-div>
6   - </el-col>
7   - <el-col :span="20">
  7 + </div>
  8 +
  9 + <!-- 拖拽分隔线 -->
  10 + <div class="resize-handle" @mousedown="startResize" @mouseover="showResizeCursor" @mouseleave="hideResizeCursor">
  11 + <div class="resize-line"></div>
  12 + </div>
  13 +
  14 + <!-- 右侧内容区域 -->
  15 + <div class="content-panel" :style="{ width: 'calc(100% - ' + (treeWidth + 10) + 'px)' }">
8 16 <el-card class="box-card">
9 17 <div slot="header" class="flex justify-between">
10 18 <span>{{ roomCreateFeeInfo.roomName }}</span>
... ... @@ -58,7 +66,8 @@
58 66 <simplify-room-fee v-if="roomCreateFeeInfo._currentTab === 'simplifyRoomFee'" ref="simplifyRoomFee"
59 67 :key="'simplifyRoomFee' + roomCreateFeeInfo.roomId"></simplify-room-fee>
60 68 </el-tab-pane>
61   - <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.paymentHistory')" name="simplifyHisFee">
  69 + <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.paymentHistory')"
  70 + name="simplifyHisFee">
62 71 <simplify-his-fee v-if="roomCreateFeeInfo._currentTab === 'simplifyHisFee'" ref="simplifyHisFee"
63 72 :key="'simplifyHisFee' + roomCreateFeeInfo.roomId"></simplify-his-fee>
64 73 </el-tab-pane>
... ... @@ -74,7 +83,8 @@
74 83 <simplify-callable v-if="roomCreateFeeInfo._currentTab === 'simplifyCallable'" ref="simplifyCallable"
75 84 :key="'simplifyCallable' + roomCreateFeeInfo.roomId"></simplify-callable>
76 85 </el-tab-pane>
77   - <el-tab-pane :label="$t('roomCreateFee.receiptReprint')" v-if="hasPrivilege('502020092373407363')" name="simplifyFeeReceipt">
  86 + <el-tab-pane :label="$t('roomCreateFee.receiptReprint')" v-if="hasPrivilege('502020092373407363')"
  87 + name="simplifyFeeReceipt">
78 88 <simplify-fee-receipt v-if="roomCreateFeeInfo._currentTab === 'simplifyFeeReceipt'"
79 89 ref="simplifyFeeReceipt" :key="'simplifyFeeReceipt' + roomCreateFeeInfo.roomId"></simplify-fee-receipt>
80 90 </el-tab-pane>
... ... @@ -83,11 +93,13 @@
83 93 ref="simplifyMeterWaterLog"
84 94 :key="'simplifyMeterWaterLog' + roomCreateFeeInfo.roomId"></simplify-meter-water-log>
85 95 </el-tab-pane>
86   - <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.prepaidAccount')" name="ownerDetailAccount">
  96 + <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.prepaidAccount')"
  97 + name="ownerDetailAccount">
87 98 <owner-detail-account v-if="roomCreateFeeInfo._currentTab === 'ownerDetailAccount'"
88 99 ref="ownerDetailAccount" :key="'ownerDetailAccount' + roomCreateFeeInfo.roomId"></owner-detail-account>
89 100 </el-tab-pane>
90   - <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.prepaidReprint')" name="ownerDetailAccountReceipt">
  101 + <el-tab-pane v-if="roomCreateFeeInfo.ownerId" :label="$t('roomCreateFee.prepaidReprint')"
  102 + name="ownerDetailAccountReceipt">
91 103 <owner-detail-account-receipt v-if="roomCreateFeeInfo._currentTab === 'ownerDetailAccountReceipt'"
92 104 ref="ownerDetailAccountReceipt"
93 105 :key="'ownerDetailAccountReceipt' + roomCreateFeeInfo.roomId"></owner-detail-account-receipt>
... ... @@ -107,8 +119,8 @@
107 119 </el-tab-pane>
108 120 </el-tabs>
109 121 </el-card>
110   - </el-col>
111   - </el-row>
  122 + </div>
  123 + </div>
112 124  
113 125 <export-fee-import-excel ref="exportFeeImportExcel"></export-fee-import-excel>
114 126 <do-import-create-fee ref="doImportCreateFee"></do-import-create-fee>
... ... @@ -177,12 +189,31 @@ export default {
177 189 },
178 190 timer: null
179 191 },
180   - communityId: ''
  192 + communityId: '',
  193 + // 新增：拖拽相关数据
  194 + treeWidth: 250, // 默认树形组件宽度
  195 + minTreeWidth: 200, // 最小宽度
  196 + maxTreeWidth: 600, // 最大宽度
  197 + isResizing: false,
  198 + startX: 0,
  199 + startWidth: 0
181 200 }
182 201 },
183 202 created() {
184 203 this.communityId = getCommunityId()
185 204 this.initRoomTree()
  205 + // 恢复保存的宽度
  206 + this.restoreTreeWidth()
  207 + },
  208 + mounted() {
  209 + // 添加全局鼠标事件监听
  210 + document.addEventListener('mousemove', this.onMouseMove)
  211 + document.addEventListener('mouseup', this.onMouseUp)
  212 + },
  213 + beforeDestroy() {
  214 + // 移除全局事件监听
  215 + document.removeEventListener('mousemove', this.onMouseMove)
  216 + document.removeEventListener('mouseup', this.onMouseUp)
186 217 },
187 218 methods: {
188 219 initRoomTree() {
... ... @@ -306,23 +337,131 @@ export default {
306 337 `/pages/property/createFeeByCombo?payerObjId=${this.roomCreateFeeInfo.roomId}&payerObjName=${this.roomCreateFeeInfo.roomName}&payerObjType=3333`
307 338 )
308 339 },
  340 + restoreTreeWidth() {
  341 + const savedWidth = localStorage.getItem('roomCreateFeeTreeWidth')
  342 + if (savedWidth) {
  343 + const width = parseInt(savedWidth)
  344 + if (width >= this.minTreeWidth && width <= this.maxTreeWidth) {
  345 + this.treeWidth = width
  346 + }
  347 + }
  348 + },
  349 + // 新增：保存树形组件宽度
  350 + saveTreeWidth() {
  351 + localStorage.setItem('roomCreateFeeTreeWidth', this.treeWidth.toString())
  352 + },
  353 + // 新增：开始拖拽调整大小
  354 + startResize(event) {
  355 + event.preventDefault()
  356 + this.isResizing = true
  357 + this.startX = event.clientX
  358 + this.startWidth = this.treeWidth
  359 +
  360 + // 添加拖拽时的样式
  361 + document.body.style.cursor = 'col-resize'
  362 + document.body.style.userSelect = 'none'
  363 + },
  364 + // 新增：鼠标移动处理
  365 + onMouseMove(event) {
  366 + if (!this.isResizing) return
  367 +
  368 + const deltaX = event.clientX - this.startX
  369 + const newWidth = this.startWidth + deltaX
  370 +
  371 + // 限制宽度范围
  372 + if (newWidth >= this.minTreeWidth && newWidth <= this.maxTreeWidth) {
  373 + this.treeWidth = newWidth
  374 + }
  375 + },
  376 + // 新增：鼠标释放处理
  377 + onMouseUp() {
  378 + if (this.isResizing) {
  379 + this.isResizing = false
  380 + this.saveTreeWidth()
  381 +
  382 + // 恢复鼠标样式
  383 + document.body.style.cursor = ''
  384 + document.body.style.userSelect = ''
  385 + }
  386 + },
  387 + // 新增：显示调整大小光标
  388 + showResizeCursor() {
  389 + if (!this.isResizing) {
  390 + document.body.style.cursor = 'col-resize'
  391 + }
  392 + },
  393 + // 新增：隐藏调整大小光标
  394 + hideResizeCursor() {
  395 + if (!this.isResizing) {
  396 + document.body.style.cursor = ''
  397 + }
  398 + },
309 399 }
310 400 }
311 401 </script>
312   -
313 402 <style scoped>
314 403 .app-container {
315 404 padding: 20px;
  405 + height: calc(100vh - 120px);
  406 + overflow: hidden;
316 407 }
317 408  
318   -.tree-container {
319   - min-height: 450px;
320   - overflow-y: auto;
  409 +/* 新增：可调整大小的布局样式 */
  410 +.resizable-layout {
  411 + display: flex;
  412 + flex-direction: row;
  413 + height: 100%;
  414 +}
  415 +
  416 +.tree-panel {
321 417 background: #fff;
322   - padding: 10px;
323 418 border-radius: 4px;
  419 + padding: 10px;
  420 + border: 1px solid #e4e7ed;
  421 +
  422 +}
  423 +
  424 +.content-panel {
  425 + overflow-y: auto;
  426 +}
  427 +
  428 +/* 新增：拖拽分隔线样式 */
  429 +.resize-handle {
  430 + width: 10px;
  431 + cursor: col-resize;
  432 + z-index: 10;
  433 + display: flex;
  434 + align-items: center;
  435 + justify-content: center;
  436 +}
  437 +
  438 +.resize-handle:hover .resize-line {
  439 + background-color: #409eff;
  440 +}
  441 +
  442 +.resize-line {
  443 + width: 2px;
  444 + height: 30px;
  445 + background-color: #dcdfe6;
  446 + border-radius: 1px;
  447 + transition: background-color 0.2s;
324 448 }
325 449  
  450 +/* 拖拽时的样式 */
  451 +.resizable-layout.resizing {
  452 + cursor: col-resize;
  453 +}
  454 +
  455 +.resizable-layout.resizing .tree-panel,
  456 +.resizable-layout.resizing .content-panel {
  457 + pointer-events: none;
  458 +}
  459 +
  460 +.resizable-layout.resizing .resize-handle {
  461 + pointer-events: auto;
  462 +}
  463 +
  464 +/* 原有样式保持不变 */
326 465 .header-tools {
327 466 float: right;
328 467 }
... ... @@ -330,4 +469,14 @@ export default {
330 469 .filter-container {
331 470 margin-bottom: 20px;
332 471 }
  472 +
  473 +/* 确保树形组件在拖拽时不被选中 */
  474 +.tree-panel * {
  475 + user-select: none;
  476 +}
  477 +
  478 +/* 拖拽时禁用文本选择 */
  479 +.resizable-layout.resizing * {
  480 + user-select: none !important;
  481 +}
333 482 </style>
334 483 \ No newline at end of file
... ...
src/views/room/roomList.vue
  View file @5480f93
... ... @@ -37,11 +37,20 @@
37 37 </el-button>
38 38 </div>
39 39  
40   - <el-row class="flex justify-start">
41   - <el-col :span="4" class="room-floor-unit-tree">
  40 + <!-- 替换原有的 el-row 布局为可拖拽布局 -->
  41 + <div class="resizable-layout margin-top-sm">
  42 + <!-- 左侧树形组件 -->
  43 + <div class="tree-panel" :style="{ width: treeWidth + 'px' }">
42 44 <floor-unit-tree ref="floorUnitTree" @switchFloorUnit="switchFloorUnit" />
43   - </el-col>
44   - <el-col :span="20" class="margin-top-xs margin-left-sm">
  45 + </div>
  46 +
  47 + <!-- 拖拽分隔线 -->
  48 + <div class="resize-handle" @mousedown="startResize" @mouseover="showResizeCursor" @mouseleave="hideResizeCursor">
  49 + <div class="resize-line"></div>
  50 + </div>
  51 +
  52 + <!-- 右侧内容区域 -->
  53 + <div class="content-panel" :style="{ width: 'calc(100% - ' + (treeWidth + 10) + 'px)' }">
45 54 <el-card class="ibox">
46 55 <div slot="header" class="clearfix flex justify-between">
47 56 <span>{{ $t('roomList.queryCondition') }}</span>
... ... @@ -264,8 +273,8 @@
264 273 </el-row>
265 274 </div>
266 275 </el-card>
267   - </el-col>
268   - </el-row>
  276 + </div>
  277 + </div>
269 278  
270 279 <!-- 子组件 -->
271 280 <add-floor ref="addFloor" @handleRefreshTree="floorUnitTree" />
... ... @@ -279,7 +288,6 @@
279 288 <delete-room ref="deleteRoom" @handleRefreshRoom="handleRefreshRoom" />
280 289 <import-owner-room ref="importOwnerRoom" />
281 290  
282   -
283 291 <owner-rooms ref="ownerRooms" />
284 292 <owner-members ref="ownerMembers" />
285 293 <owner-cars ref="ownerCars" />
... ... @@ -373,15 +381,28 @@ export default {
373 381 currentPage: DEFAULT_PAGE,
374 382 listColumns: [],
375 383 roomSubTypes: []
376   - }
  384 + },
  385 + // 新增：拖拽相关数据
  386 + treeWidth: 300, // 默认树形组件宽度
  387 + minTreeWidth: 200, // 最小宽度
  388 + maxTreeWidth: 600, // 最大宽度
  389 + isResizing: false,
  390 + startX: 0,
  391 + startWidth: 0
377 392 }
378 393 },
379 394 mounted() {
380 395 this.initData()
381   - // window.addEventListener('resize', this.handleResize)
  396 + // 恢复保存的宽度
  397 + this.restoreTreeWidth()
  398 + // 添加全局鼠标事件监听
  399 + document.addEventListener('mousemove', this.onMouseMove)
  400 + document.addEventListener('mouseup', this.onMouseUp)
382 401 },
383 402 beforeDestroy() {
384   - // window.removeEventListener('resize', this.handleResize)
  403 + // 移除全局事件监听
  404 + document.removeEventListener('mousemove', this.onMouseMove)
  405 + document.removeEventListener('mouseup', this.onMouseUp)
385 406 },
386 407 methods: {
387 408 async initData() {
... ... @@ -683,16 +704,135 @@ export default {
683 704 }
684 705 const res = await getUnits(params)
685 706 return res[0]
686   - }
  707 + },
  708 + // 新增：恢复保存的树形组件宽度
  709 + restoreTreeWidth() {
  710 + const savedWidth = localStorage.getItem('roomListTreeWidth')
  711 + if (savedWidth) {
  712 + const width = parseInt(savedWidth)
  713 + if (width >= this.minTreeWidth && width <= this.maxTreeWidth) {
  714 + this.treeWidth = width
  715 + }
  716 + }
  717 + },
  718 + // 新增：保存树形组件宽度
  719 + saveTreeWidth() {
  720 + localStorage.setItem('roomListTreeWidth', this.treeWidth.toString())
  721 + },
  722 + // 新增：开始拖拽调整大小
  723 + startResize(event) {
  724 + event.preventDefault()
  725 + this.isResizing = true
  726 + this.startX = event.clientX
  727 + this.startWidth = this.treeWidth
  728 +
  729 + // 添加拖拽时的样式
  730 + document.body.style.cursor = 'col-resize'
  731 + document.body.style.userSelect = 'none'
  732 + },
  733 + // 新增：鼠标移动处理
  734 + onMouseMove(event) {
  735 + if (!this.isResizing) return
  736 +
  737 + const deltaX = event.clientX - this.startX
  738 + const newWidth = this.startWidth + deltaX
  739 +
  740 + // 限制宽度范围
  741 + if (newWidth >= this.minTreeWidth && newWidth <= this.maxTreeWidth) {
  742 + this.treeWidth = newWidth
  743 + }
  744 + },
  745 + // 新增：鼠标释放处理
  746 + onMouseUp() {
  747 + if (this.isResizing) {
  748 + this.isResizing = false
  749 + this.saveTreeWidth()
  750 +
  751 + // 恢复鼠标样式
  752 + document.body.style.cursor = ''
  753 + document.body.style.userSelect = ''
  754 + }
  755 + },
  756 + // 新增：显示调整大小光标
  757 + showResizeCursor() {
  758 + if (!this.isResizing) {
  759 + document.body.style.cursor = 'col-resize'
  760 + }
  761 + },
  762 + // 新增：隐藏调整大小光标
  763 + hideResizeCursor() {
  764 + if (!this.isResizing) {
  765 + document.body.style.cursor = ''
  766 + }
  767 + },
687 768 }
688 769 }
689 770 </script>
690   -
691 771 <style scoped>
692 772 .room-container {
693 773 padding: 15px;
  774 + height: calc(100vh - 120px);
  775 + overflow: hidden;
  776 +}
  777 +
  778 +/* 新增：可调整大小的布局样式 */
  779 +.resizable-layout {
  780 + display: flex;
  781 + height: 100%;
  782 + position: relative;
  783 +}
  784 +
  785 +.tree-panel {
  786 + background: #fff;
  787 + border-radius: 4px;
  788 + padding: 10px;
  789 + overflow-y: auto;
  790 + border: 1px solid #e4e7ed;
  791 + min-height: 450px;
  792 +}
  793 +
  794 +.content-panel {
  795 + overflow-y: auto;
  796 +}
  797 +
  798 +/* 新增：拖拽分隔线样式 */
  799 +.resize-handle {
  800 +
  801 + width: 10px;
  802 + cursor: col-resize;
  803 + z-index: 10;
  804 + display: flex;
  805 + align-items: center;
  806 + justify-content: center;
  807 +}
  808 +
  809 +.resize-handle:hover .resize-line {
  810 + background-color: #409eff;
  811 +}
  812 +
  813 +.resize-line {
  814 + width: 2px;
  815 + height: 30px;
  816 + background-color: #dcdfe6;
  817 + border-radius: 1px;
  818 + transition: background-color 0.2s;
694 819 }
695 820  
  821 +/* 拖拽时的样式 */
  822 +.resizable-layout.resizing {
  823 + cursor: col-resize;
  824 +}
  825 +
  826 +.resizable-layout.resizing .tree-panel,
  827 +.resizable-layout.resizing .content-panel {
  828 + pointer-events: none;
  829 +}
  830 +
  831 +.resizable-layout.resizing .resize-handle {
  832 + pointer-events: auto;
  833 +}
  834 +
  835 +/* 原有样式保持不变 */
696 836 .bg-white {
697 837 background-color: #fff;
698 838 }
... ... @@ -762,9 +902,20 @@ export default {
762 902 .el-button-group .el-button:last-child {
763 903 margin-right: 0;
764 904 }
  905 +
765 906 .room-detail-desc {
766 907 text-align: left;
767 908 font-size: 13px;
768 909 color: #606266;
769 910 }
  911 +
  912 +/* 确保树形组件在拖拽时不被选中 */
  913 +.tree-panel * {
  914 + user-select: none;
  915 +}
  916 +
  917 +/* 拖拽时禁用文本选择 */
  918 +.resizable-layout.resizing * {
  919 + user-select: none !important;
  920 +}
770 921 </style>
771 922 \ No newline at end of file
... ...
src/views/simplify/simplifyAcceptanceList.vue
  View file @5480f93
... ... @@ -377,7 +377,8 @@ export default {
377 377 created() {
378 378 this.communityId = getCommunityId()
379 379 this._initMethod()
380   -
  380 + // 添加恢复搜索参数的逻辑
  381 + this._restoreSearchData()
381 382 },
382 383 methods: {
383 384 _initMethod() {
... ... @@ -490,6 +491,34 @@ export default {
490 491 searchPlaceholder: _searchPlaceholder
491 492 }))
492 493 },
  494 + // 新增：恢复搜索参数的方法
  495 + _restoreSearchData() {
  496 + try {
  497 + const savedData = localStorage.getItem(this.TEMP_SEARCH)
  498 + if (savedData) {
  499 + const parsedData = JSON.parse(savedData)
  500 + // 只有在没有路由参数时才恢复本地存储的数据
  501 + if (!this.$route.query.searchValue) {
  502 + this.simplifyAcceptanceInfo.searchType = parsedData.searchType || '1'
  503 + this.simplifyAcceptanceInfo.searchValue = parsedData.searchValue || ''
  504 + this.simplifyAcceptanceInfo.searchPlaceholder = parsedData.searchPlaceholder || 'simplifyAcceptance.houseNumberPlaceholder'
  505 +
  506 + // 如果有搜索值，自动执行搜索
  507 + if (this.simplifyAcceptanceInfo.searchValue) {
  508 + this._doSearch()
  509 + }
  510 + }
  511 + }
  512 + } catch (error) {
  513 + console.error('恢复搜索参数失败:', error)
  514 + // 清除可能损坏的数据
  515 + localStorage.removeItem(this.TEMP_SEARCH)
  516 + }
  517 + },
  518 + // 新增：清除保存的搜索数据
  519 + _clearSavedSearchData() {
  520 + localStorage.removeItem(this.TEMP_SEARCH)
  521 + },
493 522 changeTab(tab) {
494 523 this.simplifyAcceptanceInfo._currentTab = tab
495 524 setTimeout(() => {
... ... @@ -525,6 +554,7 @@ export default {
525 554 this.simplifyAcceptanceInfo.ownerPhoto = "/img/noPhoto.jpg"
526 555 },
527 556 _clearData() {
  557 + this._clearSavedSearchData()
528 558 const _searchType = this.simplifyAcceptanceInfo.searchType
529 559 const _searchValue = this.simplifyAcceptanceInfo.searchValue
530 560 const _searchPlaceholder = this.simplifyAcceptanceInfo.searchPlaceholder
... ...