Merge pull request 'fix : 修复人员选择框' (#221) from dj into master

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/221

src/api/workflow/process-user.js

@@ -22,3 +22,10 @@ export function getDepartmentTree() {
         method: 'get'
     })
 }
+export function getMosrDept(params) {
+    return request({
+        url: '/admin/mosr/user/choose',
+        method: 'get',
+        params:params
+    })
+}

src/views/workflow/process/common/UserPicker.vue

@@ -5,19 +5,15 @@
     <div>
       <div class="picker">
         <div class="candidate" v-loading="loading">
-          <div style="padding: 5px 8px;">
+          <el-input v-model="filterText" @change="getList(1)"
-            <el-input v-model="filterText" style="width: 100%;" size="small"
+                    clearable placeholder="输入部门/昵称进行搜索">
-                      clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
+            <template #append>
-            <div style="margin-top: 5px">
+              <el-button @click="getList(1)">搜索</el-button>
-              <el-radio-group v-model="radio" size="mini" @change="radioChange">
+            </template>
-                <el-radio-button :label="0">角色</el-radio-button>
+          </el-input>
-                <el-radio-button :label="1">部门</el-radio-button>
-              </el-radio-group>
-            </div>
-          </div>
           <!-- 人员选择 -->
           <el-empty :image-size="100" description="似乎没有数据" v-show="dataList.length === 0"/>
-          <el-scrollbar style="height:317px">
+          <el-scrollbar style="height:340px">
             <div class="tree">
               <el-tree :data="dataList" ref="tree" :props="defaultProps" empty-text="" node-key="value"
                        :default-expanded-keys="expandedKeys" lazy accordion
@@ -26,7 +22,9 @@
                 <template #default="{ node, data }">
                   <div class="tree-node">
                     <div v-if="data.type === 0" style="display: flex;align-items: center;padding: 3px 0">
-<!--                      <el-avatar :src="data.avatar"></el-avatar>-->
+                      <el-icon>
+                        <UserFilled/>
+                      </el-icon>
                       {{ node.label }}
                     </div>
                     <div v-else-if="data.type ===1">
@@ -55,8 +53,8 @@
           <div class="org-items" style="height: 350px;">
             <el-empty :image-size="100" description="请点击左侧列表选择数据" v-show="selectList.length === 0"/>
             <div v-for="(selectItem, selectIndex) in selectList" :key="selectIndex" class="org-item">
-<!--              <el-avatar :src="selectItem.avatar" style="margin-right: 5px;"></el-avatar>-->
+              <!--              <el-avatar :src="selectItem.avatar" style="margin-right: 5px;"></el-avatar>-->
-              {{ selectItem.name}}
+              {{ selectItem.name }}
               <i class="el-icon-close" @click="noSelected(selectItem)"></i>
             </div>
           </div>
@@ -71,9 +69,9 @@
 </template>
 
 <script setup>
-import {getUserTree} from "@/api/workflow/process-user";
 import {computed, defineProps, defineExpose} from "vue";
 import {ElMessageBox} from "element-plus";
+import {getMosrDept} from "@/api/workflow/process-user";
 
 const props = defineProps({
   value: {
@@ -105,16 +103,19 @@ const selectList = ref([]);
 const filterText = ref("");
 const dataList = ref([]);
 const tree = ref([]);
+const isSearch = ref(false);
 const expandedKeys = ref([]);
 const defaultProps = {
   value: "value",
   label: "name",
   children: "children",
-  isLeaf:(data, node) => {
+  // isLeaf:(data, node) =>
-    if (node.level === 2) {
+  // {
-      return true
+  // console.log('data, node',data, node)
-    }
+  // if (node.level === 2) {
-  }
+  //   return true
+  // }
+  // }
 
 };
 const emit = defineEmits();
@@ -128,30 +129,41 @@ const _value = computed({
   }
 });
 
-watch(() => filterText, (newVal, oldVal) => {
+watch(() => filterText.value, (newVal) => {
-  tree.value.filter(newVal);
+  console.log('filterText.value', newVal)
+  filterText.value = newVal
 });
 
+const getList = (flag) => {
+  let params = {}
+  if (flag === 1) {
+    isSearch.value = true;
+    params = {
+      chooseId: 0,
+      chooseName: filterText.value
+    }
+    selectItem = {
+      type: -1,
+      value: "0"
+    };
+  } else {
 
-const radioChange = (e) => {
+    params = {
-  selectItem.type = -2;
+      chooseId: radio.value,
-  chooseId.value = 0;
+      chooseName: filterText.value
-  radio.value = e;
+    }
-  expandedKeys.value = [];
+  }
-  getList();
+  getMosrDept(params).then(res => {
-};
+    console.log('selectItem.type', selectItem.type)
-
-const getList = () => {
-  getUserTree(radio.value, chooseId.value).then(res => {
     // if (res.data) {
-    if (selectItem.type === -1 || selectItem.type === -2) {//角色/部门
+    if (selectItem.type === -1) {
       dataList.value = res.data;
     } else if (selectItem.type === 1) {
       selectItem.children = res.data;
-      if(chooseId.value!==0&&res.data.length===0){
+      if (res.data.length === 0) {
-        selectItem.children=[{
+        selectItem.children = [{
-          type:1,
+          type: 1,
-          name:'暂无数据'
+          name: '暂无数据'
         }]
       }
     } else if (selectItem.type === 2) {
@@ -187,16 +199,24 @@ const showUserPicker = () => {
   expandedKeys.value = [];
   getList();
 };
-const handleChange = (item, data, node) => {
+const handleChange = (item, data) => {
-  //渲染子节点用户或部门及用户数据
+  console.log('item', item, data)
   selectItem = item;
-  if (data.expanded) {
+  if (isSearch.value && item.type !== 0) {
-    if(expandedKeys.value.indexOf(item.value)===-1){
+    filterText.value = ""
-      expandedKeys.value.push(item.value);
+    radio.value = item.id;
-      if (item.type !== 0) {
+    getList();
-        chooseId.value = item.id;
+    return;
-        getList();
+  } else if (!isSearch.value) {
-        return;
+    //渲染子节点用户或部门及用户数据
+    if (data.expanded) {
+      if (expandedKeys.value.indexOf(item.value) === -1) {
+        expandedKeys.value.push(item.value);
+        if (item.type !== 0) {
+          radio.value = item.id;
+          getList();
+          return;
+        }
       }
     }
   }
@@ -271,7 +291,6 @@ $containWidth: 264px;
         .el-tree-node {
           .el-tree-node__content {
             //height: 45px !important;
-
             .tree-node {
             }
           }