com : VUser 등록화면 오류 발생때문에 원복 소스 적용

This commit is contained in:
Yesol Choi
2025-05-29 22:35:47 +09:00
parent 70d9a9eb92
commit f6a60e672c
2 changed files with 192 additions and 33 deletions

View File

@@ -22,6 +22,7 @@ const dataUser = reactive({
// model.value = sessioinData
// })
const initiator = ref<Person | null>(null)
const approvers = ref<Person[]>([])
onBeforeMount(() => {
dataUser.userSession = userSession.user.data
@@ -35,6 +36,15 @@ onBeforeMount(() => {
}
})
// 부모에게 넘길 결재선 전체
const apprLine = computed(() => {
return initiator.value ? [initiator.value, ...approvers.value] : [...approvers.value]
})
watch(apprLine, (val) => {
model.value = val
})
const props = defineProps({
label: {
@@ -46,27 +56,11 @@ const props = defineProps({
},
disabled: {
type: Boolean
},
modelValue: {
type: Object,
default: () => ({}),
},
})
export interface VUserEmits {
(e: 'update:modelValue', value: any): void
}
const emits = defineEmits<VUserEmits>()
const tagsOptions = ref([])
const approvers = ref()
watch(() => props.modelValue, (newVal) => {
if (newVal.length > 0) {
emits('update:modelValue', approvers)
approvers.value = []
}
})
const tagsOptions = ref([])
const onKeyup = async (e: any) => {
const regex_jaeum = /[ㄱ-ㅎ]/g
if (e.key === 'Enter') {
@@ -75,6 +69,44 @@ const onKeyup = async (e: any) => {
const res = await getUserList({params:{name : e.target.value}})
if (res.length > 0) {
res.forEach(u => {
if (model.value?.length > 0) {
const ignore = model.value.reduce((a: Person, b: Person) => {
return a.sabun + '|' + b.sabun
})
if (typeof ignore !== 'object') {
if (ignore.includes(u.sabun)) {
u['disabled'] = true
}
} else {
if (ignore.sabun.includes(u.sabun)) {
u['disabled'] = true
}
}
}
})
// res.forEach(u => { 2명으로 제한 로직 풀기 25.05.29
// if (model.value?.length > 0) {
// const ignore = model.value.reduce((a: Person, b: Person) => {
// console.log("aaaaa",a.sabun)
// console.log("bbbbbb",b.sabun)
// return a.sabun + '|' + b.sabun
// })
//
// if (typeof ignore !== 'object') {
// if (ignore.includes(u.sabun)) {
// console.log("ignore 처리",u.sabun)
// u['disabled'] = true
// }
// } else {
// if (ignore.sabun.includes(u.sabun)) {
// console.log("ignore 처리222",u.sabun)
// u['disabled'] = true
// }
// }
// }
// })
tagsOptions.value = res
}
} catch (e) {
@@ -95,19 +127,16 @@ const onKeyup = async (e: any) => {
</VLabel>
<VControl icon="lucide:search">
<Multiselect
v-model="approvers"
:attrs="{ id }"
:searchable="true"
:disabled="props.disabled"
:options="tagsOptions"
mode="multiple"
noResultsText="조회된 결과가 없습니다."
noOptionsText="검색된 결과가 없습니다."
:placeholder="props.placeholder"
@keyup="onKeyup"
@update:modelValue="(val) => {
emits('update:modelValue', val)
}"
v-model="approvers"
:attrs="{ id }"
:searchable="true"
:disabled="props.disabled"
:options="tagsOptions"
mode="multiple"
noResultsText="조회된 결과가 없습니다."
noOptionsText="검색된 결과가 없습니다."
:placeholder="props.placeholder"
@keyup="onKeyup"
>
<template #multiplelabel="{ values }">
<div class="multiselect-multiple-label pl-6">
@@ -127,4 +156,4 @@ const onKeyup = async (e: any) => {
color: var(--modal-text) !important;
}
}
</style>
</style>

View File

@@ -0,0 +1,130 @@
<script setup lang="ts">
import { type Person } from '/@src/utils/types'
import { getUserList } from '/src/service/UserApi'
const model = defineModel<Person[]>()
const userSession = useUserSession()
const dataUser = reactive({
userSession: null,
})
// onBeforeMount(() => {
// dataUser.userSession = userSession.user.data
// const sessioinData = [{
// gubunCd: '0000', //구분
// gubunNm: '입안',
// deptNm: dataUser.userSession.dept.deptNm,
// sabun: dataUser.userSession.sabun,
// name: dataUser.userSession.name,
// attendCd: '', // 비고
//
// }]
// model.value = sessioinData
// })
const initiator = ref<Person | null>(null)
onBeforeMount(() => {
dataUser.userSession = userSession.user.data
initiator.value = {
gubunCd: '0000',
gubunNm: '입안',
deptNm: dataUser.userSession.dept.deptNm,
sabun: dataUser.userSession.sabun,
name: dataUser.userSession.name,
attendCd: '',
}
})
const props = defineProps({
label: {
type: String,
default: '직원검색',
},
placeholder: {
type: String,
},
disabled: {
type: Boolean
},
modelValue: {
type: Object,
default: () => ({}),
},
})
export interface VUserEmits {
(e: 'update:modelValue', value: any): void
}
const emits = defineEmits<VUserEmits>()
const tagsOptions = ref([])
const approvers = ref()
watch(() => props.modelValue, (newVal) => {
if (newVal.length > 0) {
emits('update:modelValue', approvers)
approvers.value = []
}
})
const onKeyup = async (e: any) => {
const regex_jaeum = /[ㄱ-ㅎ]/g
if (e.key === 'Enter') {
if (e.target.value.match(regex_jaeum) === null) {
try {
const res = await getUserList({params:{name : e.target.value}})
if (res.length > 0) {
tagsOptions.value = res
}
} catch (e) {
console.error('Error fetching user list:', e)
}
}
if (e.target.value === '') {
tagsOptions.value = []
}
}
}
</script>
<template>
<VField v-slot="{ id }" class="pr-2 is-autocomplete-select">
<VLabel class="has-fullwidth">
{{props.label}}
</VLabel>
<VControl icon="lucide:search">
<Multiselect
v-model="approvers"
:attrs="{ id }"
:searchable="true"
:disabled="props.disabled"
:options="tagsOptions"
mode="multiple"
noResultsText="조회된 결과가 없습니다."
noOptionsText="검색된 결과가 없습니다."
:placeholder="props.placeholder"
@keyup="onKeyup"
@update:modelValue="(val) => {
emits('update:modelValue', val)
}"
>
<template #multiplelabel="{ values }">
<div class="multiselect-multiple-label pl-6">
{{props.placeholder}}
</div>
</template>
</Multiselect>
</VControl>
</VField>
</template>
<style scoped lang="scss">
.field {
padding-bottom: 10px !important;
.label {
font-size: 1.3em;
color: var(--modal-text) !important;
}
}
</style>