parent
ac6ae19650
commit
e490aa8510
|
|
@ -9,7 +9,7 @@
|
|||
:md="12" :lg="12" :xl="8" :xxl="8">
|
||||
<!-- 使用卡片组件替代原来的行布局 -->
|
||||
<a-card :class="{
|
||||
'selected-card': selectedEmployee?.id === item.id,
|
||||
'selected-card': isEmployeeSelected(item.id),
|
||||
'employee-card': true
|
||||
}" style="width: 100%; border-radius: 8px;" :bodyStyle="{ padding: '16px' }" @click="handleCardClick(item)">
|
||||
<div style="position: relative;">
|
||||
|
|
@ -108,8 +108,8 @@ const current = ref(1);
|
|||
const pageSize = ref(12);
|
||||
const total = ref(0);
|
||||
const elderInfo = ref(null);
|
||||
// 新增:选中的员工
|
||||
const selectedEmployee = ref<any>(null);
|
||||
// 修改:选中的员工改为数组形式,支持多选
|
||||
const selectedEmployees = ref<any[]>([]);
|
||||
const emit = defineEmits(['success']);
|
||||
|
||||
const labelCol = reactive({
|
||||
|
|
@ -123,14 +123,21 @@ const wrapperCol = reactive({
|
|||
sm: 20,
|
||||
});
|
||||
|
||||
// 新增:处理卡片点击事件(单选功能)
|
||||
// 新增:判断员工是否被选中
|
||||
const isEmployeeSelected = (employeeId: string) => {
|
||||
return selectedEmployees.value.some(emp => emp.id === employeeId);
|
||||
};
|
||||
|
||||
// 修改:处理卡片点击事件(多选功能)
|
||||
const handleCardClick = (employee: any) => {
|
||||
if (selectedEmployee.value?.id === employee.id) {
|
||||
// 如果点击已选中的卡片,则取消选中
|
||||
selectedEmployee.value = null;
|
||||
const index = selectedEmployees.value.findIndex(emp => emp.id === employee.id);
|
||||
|
||||
if (index > -1) {
|
||||
// 如果已选中,则取消选中
|
||||
selectedEmployees.value.splice(index, 1);
|
||||
} else {
|
||||
// 选中新卡片
|
||||
selectedEmployee.value = employee;
|
||||
// 如果未选中,则添加到选中列表
|
||||
selectedEmployees.value.push(employee);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -180,7 +187,7 @@ function searchQuery() {
|
|||
function searchReset() {
|
||||
formRef.value.resetFields();
|
||||
// 重置时清空选中状态
|
||||
selectedEmployee.value = null;
|
||||
selectedEmployees.value = [];
|
||||
reload();
|
||||
}
|
||||
|
||||
|
|
@ -191,7 +198,7 @@ function onPageChange(page, newPageSize) {
|
|||
pageSize.value = newPageSize;
|
||||
}
|
||||
// 切换页面时清空选中状态
|
||||
selectedEmployee.value = null;
|
||||
selectedEmployees.value = [];
|
||||
reload();
|
||||
}
|
||||
|
||||
|
|
@ -212,29 +219,44 @@ onMounted(() => {
|
|||
});
|
||||
|
||||
function show(elderInfo_) {
|
||||
elderInfo.value = elderInfo_
|
||||
selectedEmployee.value = { id: elderInfo_.orderly }
|
||||
elderInfo.value = elderInfo_;
|
||||
selectedEmployees.value = [];
|
||||
|
||||
// 修改:解析逗号分隔的orderly字段
|
||||
if (elderInfo_.orderly) {
|
||||
const orderlyIds = elderInfo_.orderly.split(',').map(id => id.trim()).filter(id => id);
|
||||
|
||||
// 在数据加载完成后设置选中状态
|
||||
setTimeout(() => {
|
||||
orderlyIds.forEach(id => {
|
||||
const employee = dataList.value.find(item => item.id === id);
|
||||
if (employee) {
|
||||
selectedEmployees.value.push(employee);
|
||||
}
|
||||
});
|
||||
}, 100);
|
||||
}
|
||||
}
|
||||
|
||||
// 暴露选中员工的方法
|
||||
function getSelectedEmployee() {
|
||||
return selectedEmployee.value;
|
||||
function getSelectedEmployees() {
|
||||
return selectedEmployees.value;
|
||||
}
|
||||
|
||||
// 清空选中状态的方法
|
||||
function clearSelection() {
|
||||
selectedEmployee.value = null;
|
||||
selectedEmployees.value = [];
|
||||
}
|
||||
|
||||
function handleCleanHlry() {
|
||||
selectedEmployee.value = null;
|
||||
selectedEmployees.value = [];
|
||||
}
|
||||
|
||||
function hlryConfirm() {
|
||||
let params = { id: elderInfo.value.id, orderly: null }
|
||||
if (selectedEmployee.value && selectedEmployee.value.id) {
|
||||
params.orderly = selectedEmployee.value.id
|
||||
}
|
||||
// 修改:将选中的员工ID用逗号拼接
|
||||
const orderlyIds = selectedEmployees.value.map(emp => emp.id).join(',');
|
||||
let params = { id: elderInfo.value.id, orderly: orderlyIds }
|
||||
|
||||
changeOrderly(params).then(res => {
|
||||
emit('success')
|
||||
})
|
||||
|
|
@ -242,7 +264,7 @@ function hlryConfirm() {
|
|||
|
||||
defineExpose({
|
||||
show,
|
||||
getSelectedEmployee,
|
||||
getSelectedEmployees,
|
||||
clearSelection,
|
||||
hlryConfirm,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -33,12 +33,12 @@
|
|||
<div>
|
||||
{{ directive.directiveName }}
|
||||
</div>
|
||||
<div>
|
||||
<!-- <div>
|
||||
体型标签:{{ handleBodyTags('', directive, '') }}
|
||||
</div>
|
||||
<div>
|
||||
情绪标签:{{ handleEmotionTags('', directive, '') }}
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</a-card>
|
||||
</a-badge-ribbon>
|
||||
|
|
@ -56,8 +56,8 @@
|
|||
<div class="directiveInfoClass">周期类型:{{ filterDictTextByCache('period_type', derectiveInfo.cycleType) }}</div>
|
||||
<div class="directiveInfoClass">服务时长(分钟):{{ derectiveInfo.serviceDuration }}</div>
|
||||
<div class="directiveInfoClass">服务说明:{{ derectiveInfo.serviceContent }}</div>
|
||||
<div class="directiveInfoClass">体型标签:{{ handleBodyTags('', derectiveInfo, '') }}</div>
|
||||
<div class="directiveInfoClass">情绪标签:{{ handleEmotionTags('', derectiveInfo, '') }}</div>
|
||||
<!-- <div class="directiveInfoClass">体型标签:{{ handleBodyTags('', derectiveInfo, '') }}</div>
|
||||
<div class="directiveInfoClass">情绪标签:{{ handleEmotionTags('', derectiveInfo, '') }}</div> -->
|
||||
<div class="directiveInfoClass">语音文件:
|
||||
<span v-if="!derectiveInfo.mp3FileMedia">暂无文件</span>
|
||||
<audio controls disabled="false" v-else>
|
||||
|
|
|
|||
Loading…
Reference in New Issue