根据角色筛选效果实现

src/components/DesignForm/formControlPropertiNew.vue

@@ -4114,6 +4114,7 @@ function queryAllRole(){
 
 }
 const expandPageNum = ref(1)
+const expandPageSize = ref(10)
 function getPersonByRoleId(id:string){
   return request({
     url: "/javasys/lowCode/manCont/getPersonByRoleId",
@@ -4121,7 +4122,7 @@ function getPersonByRoleId(id:string){
     data: {
       id: id,
       pageNum: expandPageNum.value,
-      pageSize: '10',
+      pageSize: expandPageSize.value+"",
       number:expandQueryParamNumber.value,
       name:expandQueryParamName.value
     },
@@ -4254,6 +4255,11 @@ function delAllClick(){
   controlData.value.control.roleRange = []
 }
 
+
+function handleSizeChange(){
+  handleLeftTabChange(activeTab.value)
+}
+
 //选择用户数据范围  end 
 
 /**
@@ -5957,7 +5963,7 @@ const aiAgentList = ref([
             </el-col>
             
             <div style="width:100%;display: flex;margin-top: 18px;justify-content: center;">
-              <el-pagination v-model:current-page="expandPageNum" background layout="prev, pager, next, jumper"  :pager-count="3" :page-size="10" :total = "total" @current-change="handleCurrentChange"/>
+              <el-pagination v-model:current-page="expandPageNum" v-model:page-size="expandPageSize" background layout="prev, pager, next, jumper,sizes"  :pager-count="3" :page-sizes="[10, 20, 100, 500, 1000]" :total = "total" @current-change="handleCurrentChange" @size-change="handleSizeChange"/>
             </div>
           </el-row>
           

src/components/DesignForm/public/expand/rangedUser.vue

@@ -0,0 +1,152 @@
+<script lang='ts' setup>
+import { computed, onMounted, nextTick } from 'vue'
+import { criteriaForPeopleList } from '@/api/hr/org/type'
+import request from '@/utils/request';
+import { useAttrs } from 'vue'
+const attrs = useAttrs()
+const props = withDefaults(
+	defineProps<{
+		modelValue?: string
+		disabled?: boolean
+	}>(),
+	{}
+)
+interface User {
+  id: number
+  name: string
+  number: string
+  key: string
+  icon: string
+  department: string
+  role: string
+}
+const emits = defineEmits<{
+	(e: 'update:modelValue', value: string): void
+}>()
+const userDialogEl = ref()
+// const value:any = computed({
+//     get() {
+//       	return props.modelValue
+//     },
+//     set(newVal: string) {
+//       	emits('update:modelValue', newVal)
+//     }
+// })
+// const userlist = ref<any>("")
+const value = ref([])
+
+
+watch(value,(newValue)=>{
+	if(newValue.length > 0){
+		let str = ""
+		
+		let userAry = new Array
+		
+		newValue.forEach(item =>{
+			console.log(item)
+			userAry.push(item)
+			
+		})
+		str = userAry.join(',')
+		console.log(str)
+		emits('update:modelValue', str)
+		// userlist.value = userAry.join(',')
+		// 
+	}else{
+		let str = ""
+		console.log(str)
+		emits('update:modelValue', str)
+	}
+},{ deep: true })
+
+const openDialog = () => {
+	// console.log("value-----》",value.value)
+	userDialogEl.value.open()
+}
+
+function parseStringToArray(str:string) {
+    try {
+        // 尝试解析JSON格式字符串
+        const result = JSON.parse(str);
+        // 验证解析结果是否为数组
+        if (Array.isArray(result)) {
+            return result;
+        } else {
+            //console.error("解析结果不是数组");
+            return [];
+        }
+    } catch (error) {
+        //console.error("字符串格式错误，无法解析为数组：", error.message);
+        return [];
+    }
+}
+onMounted(() => {
+	getManConts()
+	setTimeout(()=>{
+		value.value = parseStringToArray(props.modelValue)
+	},500 )
+})
+const url = "/javasys/lowCode/manCont/getManContsByKeys"
+//console.log(attrs.value)
+const keys = computed(()=>{
+	if(attrs.queryBy == 'role'){
+		return attrs.roleRange
+	}else{
+		return attrs.orgRange
+	}
+})
+function getManContsByKeys() {
+    //console.log(11111)
+    
+        return request({
+            url: url,
+            method: "post",
+			data: {
+				keys: keys.value,
+			},
+        });
+    
+}
+const options = ref([])
+
+function getManConts(){
+	getManContsByKeys().then(({data})=>{
+		data.forEach((element: any) => {
+			element.icon = element.name+"("+element.number+")"
+			element.deparment = "["+element.deparment+"] - "+element.icon
+		});
+		options.value = data
+		//console.log(options.value)
+		
+	})
+}
+
+
+</script>
+<template>
+	
+	<!-- <el-input placeholder="请选择用户" v-bind="$props" v-model="value" @click="openDialog" clearable>
+		<template #append>
+			<i class="icon-user" @click.stop="openDialog"></i>
+		</template>
+	</el-input>
+	<user-dialog ref="userDialogEl" v-model="value" /> -->
+	<el-select-v2
+		placeholder="请选择用户"
+		v-model="value"
+		node-key="key"
+		:props="{ label: 'deparment', value: 'icon' }"
+		:options="options"
+		filterable
+		:render-after-expand="false"
+		
+		
+		multiple
+		clearable
+		collapse-tags
+		collapse-tags-tooltip
+		:max-collapse-tags="4"
+	/>
+	
+</template>
+<style lang='scss' scoped></style>

src/components/DesignForm/public/form/formItem.vue

@@ -20,7 +20,7 @@ import {
   constGetControlByName,
 } from "@/api/DesignForm/utils";
 import validate from "@/api/DesignForm/validate";
-import ExpandUser from "@/components/DesignForm/public/expand/user.vue";
+import ExpandUser from "@/components/DesignForm/public/expand/rangedUser.vue";
 import OrgCentent from "@/components/DesignForm/public/expand/org.vue";
 import LokOrgCentent from "@/widget/org/cont.vue";
 
@@ -1451,7 +1451,6 @@ const diGuiJilian = (val: any, options: any[]) => {
             'slider',
             'colorPicker',
             'component',
-            'expand-user',
             'orgCentent',
             'digitpage',
             'pickpost',
@@ -1471,6 +1470,20 @@ const diGuiJilian = (val: any, options: any[]) => {
         :rowIndex="rowIndex"
         v-model="value"
       />
+      <component
+        v-if="
+          [
+            'expand-user',
+          ].includes(data.type)
+        "
+        :is="currentComponent"
+        v-bind="control"
+        :disabled="judgeIsDisabled(data.name)"
+        :data="data"
+        :type="type"
+        :rowIndex="rowIndex"
+        v-model="value"
+      />
       <component
         v-if="['lowcodeImage'].includes(data.type)"
         :is="currentComponent"