修改部门树组件

src/components/DepTree/index.vue

@@ -190,9 +190,10 @@ defineExpose({
 		align-items: center;
 		padding-top: 10px;
 		box-shadow: 0 -8px 8px -8px rgba(0, 0, 0, 0.1);
-		z-index: 10;
+		z-index: 999;
 		position: sticky;
 		bottom: 0;
+		overflow: hidden;
 	}
 }
 </style>

src/views/admin/system/user/index.vue

@@ -1,40 +1,48 @@
 <template>
 	<div class="layout-padding">
-		<splitpanes>
-			<pane size="30">
-				<div class="layout-padding-auto layout-padding-view">
-					<!-- <el-scrollbar> -->
-					<dep-tree
-						ref="depTreeRef"
-						:placeholder="$t('common.queryDeptTip')"
-						:query="deptData.queryList"
-						:show-expand="true"
-						@node-click="handleNodeClick"
-						@treeDeepSearch="treeDeepSearch"
-						switch-inactive-text="当前部门"
-						switch-active-text="当前部门及子部门"
-					>
-						<!-- 没有数据权限提示 -->
-						<template #default="{ node, data }">
-							<el-tooltip
-								v-if="data.isLock"
-								class="item"
-								effect="dark"
-								:content="$t('sysuser.noDataScopeTip')"
-								placement="right-start"
-							>
-								<span>
-									{{ node.label }}
-									<SvgIcon name="ele-Lock" />
-								</span>
-							</el-tooltip>
-							<span v-if="!data.isLock">{{ node.label }}</span>
-						</template>
-					</dep-tree>
-					<!-- </el-scrollbar> -->
+		<Splitpanes @resized="depTreeWidth = $event[0].size">
+			<pane :size="depTreeWidth" class="relative">
+				<dep-tree
+					class="p-2"
+					ref="depTreeRef"
+					:placeholder="$t('common.queryDeptTip')"
+					:query="deptData.queryList"
+					:show-expand="true"
+					@node-click="handleNodeClick"
+					@treeDeepSearch="treeDeepSearch"
+					switch-inactive-text="当前部门"
+					switch-active-text="当前部门及子部门"
+				>
+					<!-- 没有数据权限提示 -->
+					<template #default="{ node, data }">
+						<el-tooltip
+							v-if="data.isLock"
+							class="item"
+							effect="dark"
+							:content="$t('sysuser.noDataScopeTip')"
+							placement="right-start"
+						>
+							<span>
+								{{ node.label }}
+								<SvgIcon name="ele-Lock" />
+							</span>
+						</el-tooltip>
+						<span v-if="!data.isLock">{{ node.label }}</span>
+					</template>
+				</dep-tree>
+
+				<div
+					class="pt-7 text-center w-3 h-20 absolute right-0 top-[44vh] translate-y-[-50%] overflow-hidden bg-blue-400 transition-all cursor-pointer"
+					style="
+						clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 90%);
+						background-color: url(../../../../../public/favicon.ico);
+					"
+					@click="handleClickDepTreeDrawer(isOpen)"
+				>
+					<span class="text-white font-bold text-lg">&lt;</span>
 				</div>
 			</pane>
-			<pane class="ml8">
+			<pane :size="100 - depTreeWidth" class="ml8">
 				<div class="layout-padding-auto layout-padding-view">
 					<el-row v-show="showSearch">
 						<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
@@ -209,11 +217,13 @@
 							</template>
 						</el-table-column>
 					</el-table>
+
 					<pagination v-bind="state.pagination" @current-change="currentChangeHandle" @size-change="sizeChangeHandle">
 					</pagination>
 				</div>
 			</pane>
-		</splitpanes>
+		</Splitpanes>
+
 		<user-form ref="userDialogRef" @refresh="getDataList(false)" :deptId="state.queryForm.deptId" />
 		<face-manage ref="faceManageRef" @refresh="getDataList(false)" />
 		<upload-excel
@@ -250,6 +260,7 @@ const queryRef = ref()
 const showSearch = ref(true)
 const inputPassword = ref()
 const depTreeRef = ref() // 树组件ref引用
+const depTreeWidth = ref<number>(20)
 
 // 多选rows
 const selectObjs = ref([]) as any
@@ -360,4 +371,26 @@ const changePassword = async (row: any) => {
 	useMessage().success(t("common.optSuccessText"))
 	getDataList()
 }
+
+const isOpen = ref(true)
+const temp = ref()
+const handleClickDepTreeDrawer = (isDrawerOpen: boolean) => {
+	if (isDrawerOpen) {
+		temp.value = depTreeWidth.value
+		depTreeWidth.value = 0.5
+	} else {
+		depTreeWidth.value = temp.value
+	}
+	isOpen.value = !isOpen.value
+}
 </script>
+
+<style>
+.splitpanes--vertical > .splitpanes__splitter {
+	min-width: 4px;
+	transition: all 0.3s ease;
+}
+.splitpanes--vertical > .splitpanes__splitter:hover {
+	background: #1890ff;
+}
+</style>

src/views/hard/components/shop-car.vue

@@ -79,7 +79,22 @@ const getSummaries = (param: SummaryMethodProps) => {
 			sums[index] = "合计"
 			return
 		}
-		if (column.property === "productPrice" || column.property === "totalPrice") {
+		if (column.property === "productCount") {
+			const values = data.map((item) => Number(item[column.property]))
+			if (!values.every((value) => Number.isNaN(value))) {
+				sums[index] =
+					values.reduce((prev, curr) => {
+						const value = Number(curr)
+						if (!Number.isNaN(value)) {
+							return prev + curr
+						} else {
+							return prev
+						}
+					}, 0) + "份"
+			} else {
+				sums[index] = "N/A"
+			}
+		} else if (column.property === "totalPrice") {
 			const values = data.map((item) => Number(item[column.property]))
 			if (!values.every((value) => Number.isNaN(value))) {
 				sums[index] = displayPrice(