Browse Source

调诊弹框样式优化;出诊设置比较、日历显示排班、医院列表增加排除停诊医院逻辑

hosSet-fix-1212
zq 1 month ago
parent
commit
04a7e1f256
  1. 139
      src/views/HosInformation.vue
  2. 5
      src/views/conflictDialog.vue

139
src/views/HosInformation.vue

@ -363,21 +363,23 @@
</el-button-group> </el-button-group>
</div> </div>
</div> </div>
<div class="flex hosColorType" v-if="hosList.length > 1"> <div class="flex hosColorType" v-if="activeHosList.length > 1">
<div class="flex gap12" v-for="(item, index) in hosList" :key="index"> <div v-for="(item, index) in activeHosList" :key="index" >
<span class="color-tag" :style="{ backgroundColor: colorPalette[index] }"></span> <div class="flex gap12" v-if="item.status == '1'">
<span>{{ item.h_depart_name }}</span> <span class="color-tag" :style="{ backgroundColor: colorPalette[index] }"></span>
<span>{{ item.h_depart_name }}</span>
</div>
</div> </div>
</div> </div>
<div class="calendar-container"> <div class="calendar-container">
<el-calendar v-model="currentDay" :first-day-of-week="7" @update:modelValue="onCalendarMonthChange"> <el-calendar v-model="currentDay" :first-day-of-week="7" @update:modelValue="onCalendarMonthChange">
<template slot="dateCell" slot-scope="{date, data}"> <template slot="dateCell" slot-scope="{date, data}">
<el-tooltip placement="bottom" :disabled="hosList.length == 1" <el-tooltip placement="bottom" :disabled="activeHosList.length == 1"
v-if="hasScheduleData(data.day, date)" popper-class="schedule-tooltip"> v-if="hasScheduleData(data.day, date)" popper-class="schedule-tooltip">
<!-- getDateCellClass 控制单独医院 的类名--> <!-- getDateCellClass 控制单独医院 的类名-->
<div class="calendar-date" v-if="isFutureOrToday(date)" <div class="calendar-date" v-if="isFutureOrToday(date)"
@click="handleDateClick(data.day, $event, date, data)" @click="handleDateClick(data.day, $event, date, data)"
:class="[hosList.length == 1 ? getDateCellClass(data.day) : '', (isConflictDate(data.day) && !is_allow_coincide) ? 'conflict-date' : '', !isCurrentMonth(date) ? 'not-current-month' : '']"> :class="[activeHosList.length == 1 ? getDateCellClass(data.day) : '', (isConflictDate(data.day) && !is_allow_coincide) ? 'conflict-date' : '', !isCurrentMonth(date) ? 'not-current-month' : '']">
<div class="date-header flex-between"> <div class="date-header flex-between">
<div class="flex gap12"> <div class="flex gap12">
<span class="date-text">{{ getDayNumber(data.day) }}</span> <span class="date-text">{{ getDayNumber(data.day) }}</span>
@ -399,9 +401,9 @@
<div v-if="key !== '0' && getDateSchedule(data.day)[key] && getDateSchedule(data.day)[key].length > 0" <div v-if="key !== '0' && getDateSchedule(data.day)[key] && getDateSchedule(data.day)[key].length > 0"
class="schedule-item" :class="getScheduleItemClass(data.day, key)"> class="schedule-item" :class="getScheduleItemClass(data.day, key)">
<span class="shift-type" <span class="shift-type"
:style="(hosList.length == 1 && getDateCellClass(data.day) == 'shift-type-0') ? 'text-decoration:line-through' : ''">{{ :style="(activeHosList.length == 1 && getDateCellClass(data.day) == 'shift-type-0') ? 'text-decoration:line-through' : ''">{{
shiftType }}</span> shiftType }}</span>
<div class="hospital-tags" v-if="hosList.length > 1"> <div class="hospital-tags" v-if="activeHosList.length > 1">
<span v-for="hospital in getDateSchedule(data.day)[key]" <span v-for="hospital in getDateSchedule(data.day)[key]"
:key="hospital.hid" :key="hospital.hid"
:class="getColorTagConfig(data.day, hospital.hid, key).class" :class="getColorTagConfig(data.day, hospital.hid, key).class"
@ -630,8 +632,8 @@
{{ currentEditingDate }}{{ isToday(currentEditingDate) ? '(今日)' : '' }} {{ currentEditingDate }}{{ isToday(currentEditingDate) ? '(今日)' : '' }}
</p> </p>
<el-form> <el-form>
<div class="flex mb24"> <div class="flex mb24 gap12">
<span class="" style="width: 50px;margin-right: 24px;">上午班</span> <span class="" style="min-width: 50px;">上午班</span>
<div class="select-container"> <div class="select-container">
<div class="selected-hospitals-display" @click="toggleAfternoonDropdown('morn')"> <div class="selected-hospitals-display" @click="toggleAfternoonDropdown('morn')">
<div class="flex"> <div class="flex">
@ -657,8 +659,8 @@
</div> </div>
</div> </div>
<div class="flex"> <div class="flex gap12">
<span style="width: 50px;margin-right: 24px;">下午班</span> <span style="min-width: 50px;">下午班</span>
<div class="select-container"> <div class="select-container">
<div class="selected-hospitals-display" @click="toggleAfternoonDropdown('after')"> <div class="selected-hospitals-display" @click="toggleAfternoonDropdown('after')">
<div class="flex"> <div class="flex">
@ -683,7 +685,6 @@
</el-option> </el-option>
</el-select> </el-select>
</div> </div>
</div> </div>
</el-form> </el-form>
@ -1019,6 +1020,7 @@ export default {
originalAfternoonSelected: [], // originalAfternoonSelected: [], //
forceTime: Date.now(), forceTime: Date.now(),
singleCurrentPlan:null, singleCurrentPlan:null,
activeHosList:[],
} }
}, },
created() { created() {
@ -1064,12 +1066,16 @@ export default {
} }
}, },
computed: { computed: {
// //
// 使 // 使
hospitalColorMap() { hospitalColorMap() {
const colorMap = {}; const colorMap = {};
this.hosListCopy.forEach((hospital, index) => { // old
// this.hosListCopy.forEach((hospital, index) => {
// colorMap[hospital.hid] = this.colorPalette[index % this.colorPalette.length];
// });
// new 1
this.activeHosList.forEach((hospital, index) => {
colorMap[hospital.hid] = this.colorPalette[index % this.colorPalette.length]; colorMap[hospital.hid] = this.colorPalette[index % this.colorPalette.length];
}); });
return colorMap; return colorMap;
@ -1427,7 +1433,7 @@ export default {
const hospitals = this.getHospitalsByDate(dateString); const hospitals = this.getHospitalsByDate(dateString);
// //
this.hosList = this.hosListCopy.map(item => { this.hosList = this.activeHosList.map(item => {
let hospitalInfo = { let hospitalInfo = {
hid: item.hid, hid: item.hid,
name: item.h_depart_name, name: item.h_depart_name,
@ -1726,11 +1732,15 @@ export default {
getColorTagConfig(dateStr, hospitalId, shiftType) { getColorTagConfig(dateStr, hospitalId, shiftType) {
const schedule = this.getDateSchedule(dateStr); const schedule = this.getDateSchedule(dateStr);
if (!schedule || !schedule[shiftType]) return { class: 'color-tag', style: {} }; if (!schedule || !schedule[shiftType]) return { class: 'color-tag', style: {} };
const hospital = schedule[shiftType].find(h => h.hid === hospitalId); const hospital = schedule[shiftType].find(h => h.hid === hospitalId);
if (!hospital) return { class: 'color-tag', style: {} }; if (!hospital) return { class: 'color-tag', style: {} };
const hospitalColor = this.hospitalColorMap[hospitalId];
const hospitalColor = this.getHospitalColor(hospitalId);
//
if (!hospitalColor) {
return { class: 'color-tag hidden-tag', style: { backgroundColor: '#CCCCCC' } };
}
// //
if (hospital.isCancelled) { if (hospital.isCancelled) {
@ -1984,20 +1994,39 @@ export default {
this.hosList = Object.keys(list).map(item => { this.hosList = Object.keys(list).map(item => {
return { return {
hid: item, hid: item,
h_depart_name: list[item].h_depart_name h_depart_name: list[item].h_depart_name,
status: list[item].status,//
} }
}); });
// //
this.hosList[0].status = '1'
this.hosList[1].status = '0'
this.hosList[2].status = '1'
//
this.hosListCopy = JSON.parse(JSON.stringify(this.hosList)) this.hosListCopy = JSON.parse(JSON.stringify(this.hosList))
// // new add
this.rawScheduleData = JSON.parse(JSON.stringify(list)); this.activeHosList = this.hosList.filter(item => item.status == '1'); // 1
//old
// this.rawScheduleData = JSON.parse(JSON.stringify(list));
//new
// (1)
this.rawScheduleData={};
this.activeHosList.forEach(hospital => {
if (list[hospital.hid]) {
this.rawScheduleData[hospital.hid] = JSON.parse(JSON.stringify(list[hospital.hid]));
}
});
// //
this.generateMonthSchedule(this.currentDay); this.generateMonthSchedule(this.currentDay);
this.countMonthlyConflicts(); this.countMonthlyConflicts();
this.hosLength = Object.keys(list).length; this.hosLength = Object.keys(this.activeHosList).length;
} }
}).catch(error => { }).catch(error => {
@ -2040,6 +2069,19 @@ export default {
// //
this.tempAdjustments = {}; this.tempAdjustments = {};
// new
// 0
const activeHospitalIds = this.hosList.map(hospital => hospital.hid);
const filteredScheduleData = {};
Object.keys(this.rawScheduleData).forEach(hospitalId => {
if (activeHospitalIds.includes(hospitalId)) {
filteredScheduleData[hospitalId] = this.rawScheduleData[hospitalId];
}
});
// 使
while (currentDate <= endDate) { while (currentDate <= endDate) {
const dateStr = this.formatDate(currentDate); const dateStr = this.formatDate(currentDate);
const daySchedule = this.getScheduleForDate(currentDate); const daySchedule = this.getScheduleForDate(currentDate);
@ -2061,6 +2103,8 @@ export default {
console.log(this.calendarList,'===this.calendarList:'); console.log(this.calendarList,'===this.calendarList:');
}, },
addHospitalToSchedule(daySchedule, hospitalId, hospital, plan, workDesc) { addHospitalToSchedule(daySchedule, hospitalId, hospital, plan, workDesc) {
const isActiveHospital = this.activeHosList.some(h => h.hid === hospitalId);
if (!isActiveHospital) return; //
const shiftType = plan.toString(); const shiftType = plan.toString();
const dateStr = daySchedule._dateStr; const dateStr = daySchedule._dateStr;
const originalPlan = this.getOriginalPlan(dateStr, hospitalId); const originalPlan = this.getOriginalPlan(dateStr, hospitalId);
@ -2137,8 +2181,15 @@ export default {
_conflicts: [], _conflicts: [],
_dateStr: dateStr // _dateStr: dateStr //
}; };
//new 使
const hospitalsToProcess = this.activeHosList.map(hospital => hospital.hid);
Object.keys(this.rawScheduleData).forEach(hospitalId => { // old
// Object.keys(this.rawScheduleData).forEach(hospitalId => {
// const hospital = this.rawScheduleData[hospitalId];
// new
hospitalsToProcess.forEach(hospitalId => {
const hospital = this.rawScheduleData[hospitalId]; const hospital = this.rawScheduleData[hospitalId];
const { worktime_no_fixed, worktime_list, temp_change_worktime } = hospital; const { worktime_no_fixed, worktime_list, temp_change_worktime } = hospital;
@ -2190,8 +2241,6 @@ export default {
// //
this.checkScheduleConflicts(daySchedule, dateStr); this.checkScheduleConflicts(daySchedule, dateStr);
// console.log(daySchedule,'daySchedule===');
return Object.keys(daySchedule).length > 1 ? daySchedule : null; return Object.keys(daySchedule).length > 1 ? daySchedule : null;
}, },
// //
@ -3236,6 +3285,8 @@ export default {
.select-container { .select-container {
position: relative; position: relative;
flex: 1; flex: 1;
/* 确保容器不超出父元素 */
max-width: 100%;
} }
.conflictTip { .conflictTip {
@ -3256,8 +3307,8 @@ export default {
text-align: center; text-align: center;
letter-spacing: 0.08em; letter-spacing: 0.08em;
color: #FF4D4F; color: #FF4D4F;
box-sizing: border-box;
margin-right: 6px; margin-right: 6px;
flex-shrink: 0;
} }
.selected-hospitals-display { .selected-hospitals-display {
@ -3272,6 +3323,8 @@ export default {
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
transition: border-color 0.2s; transition: border-color 0.2s;
width: 100%;
box-sizing: border-box;
} }
.selected-hospitals-display:hover { .selected-hospitals-display:hover {
@ -3282,6 +3335,30 @@ export default {
border-color: #409EFF; border-color: #409EFF;
} }
.overHostext {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
flex: 1;
min-width: 0; /* 重要:确保文本截断生效 */
overflow-x: auto;
padding-right: 8px;
}
/* 隐藏滚动条但保持滚动功能 */
.overHostext::-webkit-scrollbar {
height: 3px;
}
.overHostext::-webkit-scrollbar-track {
background: #f1f1f1;
}
.overHostext::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 3px;
}
.hidden-select { .hidden-select {
position: absolute; position: absolute;
top: 0; top: 0;
@ -3289,8 +3366,8 @@ export default {
width: 100%; width: 100%;
opacity: 0; opacity: 0;
z-index: 1; z-index: 1;
// pointer-events: none;
} }
// -- // --
.tooltip-content { .tooltip-content {
@ -3493,6 +3570,10 @@ export default {
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
} }
.hidden-tag {
display: none !important;
}
// //
.opacity-tag { .opacity-tag {
opacity: .6; opacity: .6;

5
src/views/conflictDialog.vue

@ -268,7 +268,7 @@ export default {
// ..end // ..end
async setDepartWorkTime() { async setDepartWorkTime() {
const { display_work_days, planDays, worktime_no_fixed,worktimes } = this.houseCallSettingForm; const { display_work_days, planDays, worktime_no_fixed,worktimes } = this.houseCallSettingForm;
if(worktime_no_fixed == 1){ if(worktime_no_fixed == 1){//
this.saveWorkTimeDirect() this.saveWorkTimeDirect()
return; return;
} }
@ -456,7 +456,8 @@ export default {
conflictShift: conflictShift, // conflictShift: conflictShift, //
scheduleType: scheduleType, scheduleType: scheduleType,
workDesc: workDesc, workDesc: workDesc,
dayOfWeek dayOfWeek,
type: scheduleType === '固定排班' ? 'fixed' : 'temp', // type
// displayText: `${date} ${planMap[newPlan]} ${hospitalName} ${conflictShift} ` // displayText: `${date} ${planMap[newPlan]} ${hospitalName} ${conflictShift} `
}; };

Loading…
Cancel
Save