appFormLowcode/src/components/lowCode/assistant/user.vue

<!--
@ 作者: 秦东
@ 时间: 2024-11-14 13:16:43
@ 备注: 选择用户
-->
<script lang='ts' setup>
import { criteriaForPeopleList } from '@/api/hr/org/type'
import SvgIcon from '@/components/svgIcon/index.vue'
const props = withDefaults(
    defineProps<{
		modelValue?: string
		disabled?: boolean
		types?:number
        control?:any
    }>(),
    {}
)
const emits = defineEmits<{
    (e: 'update:modelValue', value: string): void
}>()
const userDialogEl = ref()
const value = computed({
	get: () => {
		console.log("value-get",props.modelValue)
		// userlist.value = props.modelValue
		return props.modelValue
	},
	set: (newVal: any) => {
		// console.log("value-set",newVal,newVal.length)
		// emits('update:modelValue', newVal)
		
			let newValJson:criteriaForPeopleList[] = JSON.parse(newVal)
			// console.log("value-newValJson",newValJson)
	
			if(newValJson.length > 0){
				let userAry = new Array
				let userKeyAry = new Array
				newValJson.forEach(item =>{
					userAry.push(item.name+"("+item.number+")")
					userKeyAry.push(item.userkey.toString())
				})
				emits('update:modelValue', userAry.join(','))
				// userlist.value = userAry.join(',')
				// 
			}else{
				emits('update:modelValue', "")
			}
		
		
	},
});

const openDialog = () => {
	// console.log("value-----》",value.value)
    userDialogEl.value.openUserDawer()
}
onMounted(() => {
	// console.log("value---1--》",value.value,props.modelValue)
    nextTick(() => {})
})

/**
@ 作者: 秦东
@ 时间: 2025-06-10 11:13:06
@ 功能: 输出结果
*/
const valPrint = (val:string) => {
	if(val != "" && val != undefined){
		let pickVal = JSON.parse(val)
		if(Array.isArray(pickVal)){
			return pickVal.join("、")
		}
	}
}

</script>
<template>
    <el-input
		v-if="props.types!=3"
		placeholder="请选择用户"
		v-bind="$props"
		v-model="value"
		@click="openDialog"
	>
		<template #append>
            <SvgIcon icon-class="user" :size="20"  @click.stop="openDialog" />
		</template>
  	</el-input>
    <UserDrawer v-if="props.types!=3" ref="userDialogEl" v-model="value" />
	<el-text v-else class="wordColor">{{valPrint(value)}}</el-text>
</template>
<style  lang='scss' scoped>
.wordColor{
	color:#000000;
}  
</style>