diff --git a/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectInput.vue b/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectInput.vue index e910c70ae..d4911b8d7 100644 --- a/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectInput.vue +++ b/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectInput.vue @@ -3,7 +3,7 @@
请选择 @@ -26,7 +26,7 @@ import { Form } from 'ant-design-vue'; import { useUserStore } from '/@/store/modules/user'; - const maxCount = 2; + const maxCount = 3; export default defineComponent({ name: 'RoleSelectInput', @@ -39,6 +39,12 @@ type: Boolean, default: false, }, + // update-begin--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 + maxSelectCount: { + type: Number, + default: 2, + }, + // update-end--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 store: { type: String, default: 'id', @@ -77,7 +83,7 @@ } const ellipsisInfo = computed(() => { - let max = maxCount; + let max = props.maxSelectCount; let len = selectedList.value.length; if (len > max) { return { status: true, count: len - max }; @@ -205,7 +211,6 @@ return { selectedList, ellipsisInfo, - maxCount, registerRoleModal, closeRoleModal, showModal, diff --git a/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectModal.vue b/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectModal.vue index e81c3c395..f49b6d724 100644 --- a/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectModal.vue +++ b/jeecgboot-vue3/src/components/Form/src/jeecg/components/roleSelect/RoleSelectModal.vue @@ -156,8 +156,11 @@ if(!list || list.length ==0 ){ return; } - let arr = list.filter(item=>item.id == id); - arr[0].checked = false; + // update-begin--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 + let findItem = list.find((item) => item.id == id); + findItem.checked = false; + selectedKeys.value = selectedKeys.value.filter((key) => key != id); + // update-end--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 } async function loadDataList() { @@ -190,23 +193,30 @@ console.log('loadDataList', data); } - function onSelect(e, item) { prevent(e); - console.log('onselect'); - // 单选判断 只能选中一条数据 其余数据置false - if(props.multi === false){ - let list = dataList.value; - for(let item of list){ - item.checked = false; - } + // update-begin--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 + // 单选模式下,先清除所有选中状态 + if (!props.multi) { + dataList.value.forEach(dataItem => { + if (dataItem.id != item.id) { + dataItem.checked = false; + } + }); + // 清空已选择的keys + selectedKeys.value = []; } + + // 切换当前项的选中状态 item.checked = !item.checked; + + // 更新selectedKeys数组 if (item.checked) { selectedKeys.value.push(item.id); } else { - selectedKeys.value = selectedKeys.value.filter((k) => k != item.id); + selectedKeys.value = selectedKeys.value.filter(key => key !== item.id); } + // update-end--author:liaozhiyang---date:20250414--for:【issues/8078】角色选择组件点击文字部分会一直选中 } function prevent(e) { diff --git a/jeecgboot-vue3/src/views/demo/document/form/exampleCustom.data.ts b/jeecgboot-vue3/src/views/demo/document/form/exampleCustom.data.ts index e4afd9ccd..54fef0f20 100644 --- a/jeecgboot-vue3/src/views/demo/document/form/exampleCustom.data.ts +++ b/jeecgboot-vue3/src/views/demo/document/form/exampleCustom.data.ts @@ -420,9 +420,9 @@ export const schemas: FormSchema[] = [ component: 'RoleSelect', componentProps: { //最大选择数量 - maxSelectCount: 3, + maxSelectCount: 4, //是否单选 - isRadioSelection: false + multi: true }, }, {