部门人员筛选优化

app.json

@@ -143,6 +143,7 @@
   "usingComponents": {
     "Yl_Empty": "/components/Yl_Empty/index",
     "Yl_Filtrate": "/components/Yl_Filtrate/index",
+    "organization": "/components/organization/index",
     "Yl_FloatingButton": "/components/Yl_FloatingButton/index",
     "Yl_FunTabs": "/components/Yl_FunTabs/index",
     "Yl_HeadNav": "/components/Yl_HeadNav/index",

components/Yl_Filtrate/index.js

@@ -2,6 +2,9 @@ import {
     getHeight
 } from "../../utils/GetRheRemainingHeight";
 Component({
+    options: {
+        multipleSlots: true
+    },
     properties: {
         list: {
             type: {
@@ -173,6 +176,7 @@ Component({
                 obj.periodstart = this.data.periodstart;
                 obj.periodend = this.data.periodend;
             };
+            obj.name = name;
             this.triggerEvent("handle", obj);
             this.onClose();
         },

components/Yl_Filtrate/index.wxml

@@ -1,7 +1,7 @@
 <van-popup show="{{ show }}" position="right" custom-style="width: 660rpx; height:100vh;" z-index="{{zIndex}}" bind:close="onClose">
     <view class="head" />
     <Yl_ListBox height="{{listHeight}}" pullDown='{{false}}'>
-
+        <slot name='head' />
 
         <block wx:for="{{list}}" wx:key="label">
             <MultilevelClass id="MultilevelClass" item='{{item}}' wx:if="{{item.type=='multilevelClass'}}" />

components/organization/index.js

@@ -0,0 +1,141 @@
+const _Http = getApp().globalData.http;
+Component({
+    properties: {
+        isdep: {
+            type: Boolean,
+            value: true
+        },
+        isusers: {
+            type: Boolean,
+            value: true
+        },
+        defaultMy: {
+            type: Boolean,
+            value: true
+        },
+        exclution: {
+            type: Boolean,
+            value: true
+        },
+        dimissionF: {
+            type: Boolean
+        }
+    },
+    data: {
+        takeEffect: "", //生效筛选项
+        result: {},
+        isleave: 0,
+        tabs: [{
+            value: 0,
+            name: "全部"
+        }, {
+            value: 1,
+            name: "在职"
+        }, {
+            value: 2,
+            name: "离职"
+        }],
+        searchValue: ""
+    },
+    methods: {
+        searchChange({
+            detail
+        }) {
+            if (detail.length == 0) return this.searchClear()
+            let list = JSON.parse(JSON.stringify(this.data.users.copyList));
+            this.setData({
+                'users.list': list.filter(v => v.name.includes(detail) || v.accountno.includes(detail))
+            })
+        },
+        searchClear() {
+            this.setData({
+                'users.list': JSON.parse(JSON.stringify(this.data.users.copyList))
+            })
+        },
+        changLeave(e) {
+            this.setData({
+                isleave: e.currentTarget.dataset.value,
+                'result.isleave': e.currentTarget.dataset.value
+            })
+        },
+        initDepAndUser() {
+            this.setData({
+                result: {},
+                takeEffect: ""
+            })
+            return new Promise((resolve) => {
+                _Http.basic({
+                    "id": 20230620102004,
+                    "content": {}
+                }).then(res => {
+                    console.log("获取部门", res)
+                    if (this.data.isdep) this.setData({
+                        depGroud: [{
+                            label: "部门",
+                            list: res.data.dep,
+                            active: ""
+                        }]
+                    })
+                    if (this.data.isusers) {
+                        let active = ''
+                        if (this.data.defaultMy) {
+                            let user = res.data.hr.find(v => v.userid == wx.getStorageSync('userMsg').userid)
+                            if (user) {
+                                active = user.userid;
+                                resolve(user)
+                                this.setData({
+                                    takeEffect: "user",
+                                    result: user
+                                })
+                            }
+                        }
+                        this.setData({
+                            users: {
+                                label: "人员",
+                                list: res.data.hr,
+                                copyList: res.data.hr,
+                                active
+                            }
+                        })
+                    }
+                    resolve({})
+                })
+            })
+        },
+        selectDep(e) {
+            const {
+                item,
+                index
+            } = e.currentTarget.dataset;
+            let depGroud = this.data.depGroud.slice(0, index + 1);
+            depGroud[index].active = item.departmentid;
+            if (item.subdep.length) {
+                item.subdep.unshift(JSON.parse(JSON.stringify(item)))
+                item.subdep[0].depname = '全部';
+                item.subdep[0].subdep = [];
+                depGroud.push({
+                    label: item.depname + '下级部门',
+                    list: item.subdep,
+                    active: item.departmentid
+                })
+            }
+            item.name = item.depname
+            item.isleave = this.data.isleave;
+            this.setData({
+                depGroud,
+                takeEffect: "dep",
+                result: item
+            })
+        },
+        selectUser(e) {
+            const {
+                item
+            } = e.currentTarget.dataset;
+            this.setData({
+                'users.active': item.userid,
+                takeEffect: "user",
+                result: item
+            })
+        },
+    }
+})

components/organization/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/organization/index.scss

@@ -0,0 +1,147 @@
+.groud {
+    width: 100%;
+    padding: 30rpx;
+    border-bottom: 1px solid #DDDDDD;
+    overflow: hidden;
+
+    .title {
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+
+        .label {
+            height: 40rpx;
+            font-size: 28rpx;
+            font-family: PingFang SC-Regular, PingFang SC;
+            color: #333333;
+        }
+
+        .tabs-box {
+            display: flex;
+            align-items: center;
+            height: 50rpx;
+            background: #F5F5F5;
+            border-radius: 30rpx;
+            padding: 4rpx;
+            background-color: #F5F5F5;
+            box-sizing: content-box;
+            margin-right: 50rpx;
+
+            .item {
+                font-size: 24rpx;
+                font-family: PingFang SC-Regular, PingFang SC;
+                color: #FFFFFF;
+                height: 42rpx;
+                line-height: 42rpx;
+                padding: 0 16rpx;
+                background-color: #F5F5F5;
+                color: #999999;
+                border-radius: 26rpx;
+                box-sizing: border-box;
+            }
+
+            .active {
+                background-color: #3874F6;
+                color: #FFFFFF;
+                transition: color 0.3s;
+            }
+        }
+    }
+
+
+
+
+    .content {
+        display: flex;
+        flex-wrap: wrap;
+        width: 100%;
+
+        .but {
+            min-width: 188rpx;
+            height: 72rpx;
+            background: #F5F5F5;
+            border-radius: 8rpx;
+            font-size: 28rpx;
+            font-family: PingFang SC-Regular, PingFang SC;
+            color: #333333;
+            margin-right: 20rpx;
+            margin-top: 20rpx;
+            padding: 0 20rpx;
+            box-sizing: border-box;
+        }
+
+        .active {
+            border: 1px solid #3874F6;
+            color: #3874F6;
+            font-weight: bold;
+            background-color: #F5F5F5;
+        }
+    }
+
+
+    .time {
+        .partition {
+            margin-right: 20rpx;
+            display: flex;
+            align-items: center;
+        }
+
+        .tbox {
+            width: 220rpx;
+            height: 72rpx;
+            text-align: center;
+            line-height: 72rpx;
+            background: #F5F5F5;
+            border-radius: 8rpx;
+            font-size: 28rpx;
+            font-family: PingFang SC-Regular, PingFang SC;
+            color: #333333;
+            box-sizing: border-box;
+            margin-right: 20rpx;
+            margin-top: 20rpx;
+        }
+    }
+}
+
+.exclution {
+    opacity: .7;
+
+    .content {
+        .active {
+            border: 0px solid #3874F6;
+            color: #333333;
+            font-weight: bold;
+            background-color: #F5F5F5;
+        }
+    }
+
+}
+
+.footer {
+    display: flex;
+    justify-content: space-around;
+    width: 100%;
+    box-sizing: border-box;
+    padding: 10rpx;
+    box-shadow: rgba(0, 0, 0, 0.1) 0px -2px 8rpx;
+
+    .v-but {
+        width: 190rpx;
+        height: 90rpx;
+        background: #FFFFFF;
+        border-radius: 8rpx;
+        border: 1px solid #CCCCCC;
+        font-size: 28rpx;
+        font-family: PingFang SC-Regular, PingFang SC;
+        color: #666666;
+    }
+
+    .confirm {
+        border: none;
+        background: #3874F6;
+        font-size: 28rpx;
+        font-family: PingFang SC-Bold, PingFang SC;
+        font-weight: bold;
+        color: #FFFFFF;
+    }
+}

components/organization/index.wxml

@@ -0,0 +1,31 @@
+<!-- 部门筛选 -->
+<view wx:if="{{isdep}}" class="groud {{exclution && takeEffect !='dep' ? 'exclution' : '' }}" wx:for="{{depGroud}}" wx:key="label">
+    <view class="title">
+        <view class="label">
+            {{item.label}}
+        </view>
+        <view class="tabs-box" wx:if="{{dimissionF && index==0}}">
+            <view class="item {{isleave == item.value?'active':''}}" wx:for="{{tabs}}" wx:key="{{item.value}}" data-value="{{item.value}}" bind:tap="changLeave">{{item.name}}</view>
+        </view>
+    </view>
+    <view class="content">
+        <van-button custom-class='but {{data.departmentid == item.active?" active":""}}' wx:for="{{item.list}}" wx:for-item="data" wx:for-index="i" wx:key="i" data-item="{{data}}" data-index="{{index}}" data-i="{{i}}" bindtap="selectDep">{{data.depname}}</van-button>
+    </view>
+</view>
+<!-- 人员筛选 -->
+<view wx:if="{{isusers}}" class="groud {{exclution && takeEffect != 'user'? 'exclution' : ''}}" wx:key="label">
+    <view class="title" style="align-items: center;">
+        <view class="label">
+            {{users.label}}
+        </view>
+        <view class="tabs-box" style="margin-right: 20rpx;">
+            <van-search value="{{ searchValue }}" shape='round' bind:change='searchChange' bind:clear='searchClear' placeholder="搜索姓名/账号" />
+        </view>
+    </view>
+    <view class="content">
+        <van-button custom-class='but {{item.userid == users.active?" active":""}}' wx:for="{{users.list}}" wx:key="userid" data-item="{{item}}" bindtap="selectUser">{{item.name}} {{item.accountno}}</van-button>
+    </view>
+</view>
+
+
+<wxs src='../../utils/wxmlQueryPer.wxs' module="per" />

packageA/receivables/index.js

@@ -13,7 +13,7 @@ Page({
       "pageNumber": 1,
       "pageSize": 40,
       "type": "0", //1按部门 0按人员
-      "dataid": "0", //部门人员id
+      "dataid": wx.getStorageSync('userMsg').userid, //部门人员id
       "querytype": "1", //0按业务员 1按客户
       "point": "全部", // 入账节点
       "where": {
@@ -64,57 +64,7 @@ Page({
         return prev.width ? prev.width + cur.width : prev + cur.width
       })
     })
-    _Http.basic({
-      "id": 20230620102004,
-      "content": {}
-    }).then(res => {
-      console.log("获取下级部门和下级人员", res)
-      if (res.msg != '成功') return wx.showToast({
-        title: res.data,
-        icon: "none"
-      })
-      let data = {
-        label: "查询范围",
-        index: 0,
-        showName: "name", //显示字段
-        valueKey: "active", //返回Key
-        value: "id", //选中值
-        list: res.data.hr.map(v => {
-          v.id = v.userid;
-          // v.key = v.name + v.userid;
-          v.type = '人员'
-          delete(v.rowindex)
-          delete(v.userid)
-          return v
-        })
-      };
-      const mflat = (v, prefix) => {
-        v.subdep.forEach(s => mflat(s, v.depname));
-        v.name = v.depname; //prefix ? prefix + '/' + v.depname : v.depname
-        v.type = '部门';
-        v.id = v.departmentid;
-        // v.key = v.name + v.id;
-        delete(v.depname)
-        delete(v.departmentid)
-        delete(v.parentid)
-        delete(v.rowindex)
-        delete(v.subdep)
-        data.list.unshift(v)
-      };
-      res.data.dep.forEach(v => mflat(v))
-      data.list.map((v, i) => {
-        v.index = i;
-        if (v.type == '人员' && v.id == wx.getStorageSync('userMsg').userid) {
-          data.index = i;
-          this.data.content.dataid = v.id;
-        };
-        return v
-      })
-      this.setData({
-        "filtratelist[0]": data
-      });
-      this.getList()
-    });
+    this.getList()
   },
   getList(init = false) {
     if (init.detail != undefined) init = init.detail;
@@ -201,6 +151,7 @@ Page({
   },
   onReady() {
     this.setListHeight()
+    this.selectComponent("#organization").initDepAndUser();
   },
   /* 设置页面高度 */
   setListHeight() {
@@ -214,14 +165,23 @@ Page({
   handleFilter({
     detail
   }) {
-    if (typeof detail == 'object') {
-      if (detail.active == 'id') return this.getList(true)
-      this.data.content.type = detail.active.type == '人员' ? 0 : 1;
-      this.data.content.dataid = detail.active.id;
+
+    if (detail.name == 'reset') {
+      this.selectComponent("#organization").initDepAndUser()
+      this.setData({
+        'content.dataid': wx.getStorageSync('userMsg').userid,
+        'content.type': 0,
+      })
     } else {
-      this.data.content.type = 0;
-      this.data.content.dataid = 0;
+      let active = this.selectComponent("#organization").data.result;
+      let type = active.userid ? 0 : 1,
+        dataid = type == 0 ? active.userid : active.departmentid
+      this.setData({
+        'content.dataid': dataid,
+        'content.type': type
+      })
     }
+
     this.getList(true)
   },
   startSearch({

packageA/receivables/index.wxml

@@ -50,4 +50,6 @@
 	</Yl_ListBox>
 </view>
 
-<Yl_Filtrate show='{{showFiltrate}}' isReset='{{false}}' list="{{filtratelist}}" bindhandle="handleFilter" />
+<Yl_Filtrate show='{{showFiltrate}}' isReset='{{false}}' list="{{[]}}" bindhandle="handleFilter">
+	<organization slot='head' defaultMy id='organization' />
+</Yl_Filtrate>