From 7c20fd15b7fbc2bd5756b39d5ab655cc849ffcc3 Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期三, 16 七月 2025 22:39:23 +0800 Subject: [PATCH] 添加时间筛选 --- src/views/operate/fivepack/threepack/components/aside/index.vue | 139 +++++++++++++++++++++++++++++----------------- 1 files changed, 87 insertions(+), 52 deletions(-) diff --git a/src/views/operate/fivepack/threepack/components/aside/index.vue b/src/views/operate/fivepack/threepack/components/aside/index.vue index f5ab6f7..d09a996 100644 --- a/src/views/operate/fivepack/threepack/components/aside/index.vue +++ b/src/views/operate/fivepack/threepack/components/aside/index.vue @@ -1,71 +1,106 @@ <template> - <div class="aside"> - <div class="title">缁勭粐鏈烘瀯</div> - <div class="input"> - <el-input placeholder="杈撳叆缁勭粐鏈烘瀯鍚嶇О" v-model="searchArea"></el-input> - </div> - <div class="menu"> - <el-tree :data="areaData" :props="defaultProps" @node-click="handleNodeClick"></el-tree> - </div> + <div class="aside"> + <div class="title">缁勭粐鏈烘瀯</div> + <div class="input"> + <el-input + placeholder="杈撳叆缁勭粐鏈烘瀯鍚嶇О, 鎸変笅enter閿悳绱�" + v-model="searchArea" + @change="filterTreeNode" + ></el-input> </div> + <div class="menu"> + <el-tree + ref="department" + :filter-node-method="filterNode" + :data="areaData" + :props="defaultProps" + @node-click="nodeClick" + ></el-tree> + </div> + </div> </template> <script> +import department from "@/api/system/department"; export default { - data() { - return { - searchArea: null, - areaData: [], - defaultProps: { - children: 'children', - label: 'label' - } - }; - }, + name: "departmentAside", + data() { + return { + searchArea: null, + areaData: [], + defaultProps: { + children: "children", + label: "regionName", + }, + }; + }, - created() { - }, + created() { + if (sessionStorage.getItem("area")) { + this.areaData = JSON.parse(sessionStorage.getItem("area")); + } else { + department + .getDepartmentList() + .then((res) => { + this.areaData = res; + sessionStorage.setItem("area", JSON.stringify(this.areaData)); + }) + .catch((err) => this.$message.error(err)); + } + }, methods: { - handleNodeClick(data) { - } - } + filterTreeNode() { + this.$refs.department.filter(this.searchArea); + }, + + filterNode(value, data) { + if (!value) return true; + return data.regionName.indexOf(value) !== -1; + }, + nodeClick(data, node, props) { + if (node.level > 1) { + this.$emit("selectedDepartment", data); + } + }, + }, }; </script> <style lang="scss" scoped> .aside { - width: 200px; - height: calc(100vh - 102px); - background-color: #09152f; - padding: 10px; - display: flex; - flex-direction: column; - .title { - line-height: 60px; - } + width: 200px; + height: calc(103vh - 102px); + background-color: #ffffff; + padding: 10px; + display: flex; + flex-direction: column; + .title { + line-height: 60px; + color: #333; + } - .input { - line-height: 30px; + .input { + line-height: 30px; - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } + &::v-deep .el-input__inner { + // background-color: #09152f; + //border: 1px solid #17324c; } + } - .menu { - margin-top: 20px; - flex: 1; - .el-tree{ - height: 100%; - background-color: #09152f; - &::v-deep .el-tree-node:focus>.el-tree-node__content{ - background-color: #092c4a; - } - &::v-deep .el-tree-node__content:hover{ - background-color: #092c4a; - } - } + .menu { + margin-top: 20px; + flex: 1; + .el-tree { + height: 100%; + // background-color: #09152f; + // &::v-deep .el-tree-node:focus>.el-tree-node__content{ + // background-color: #092c4a; + // } + // &::v-deep .el-tree-node__content:hover{ + // background-color: #092c4a; + // } } + } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0