|
@@ -31,12 +31,19 @@
|
|
class="calendar-cell"
|
|
class="calendar-cell"
|
|
@dblclick="handleDayDblClick(data.day)"
|
|
@dblclick="handleDayDblClick(data.day)"
|
|
>
|
|
>
|
|
- <el-checkbox
|
|
|
|
|
|
+ <!-- <el-checkbox
|
|
:label="formatMonthDay(data.day)"
|
|
:label="formatMonthDay(data.day)"
|
|
:value="data.day"
|
|
:value="data.day"
|
|
v-model="selectedDates"
|
|
v-model="selectedDates"
|
|
@click.stop
|
|
@click.stop
|
|
|
|
+ /> -->
|
|
|
|
+ <el-checkbox
|
|
|
|
+ :label="formatMonthDay(data.day)"
|
|
|
|
+ :checked="selectedDates.includes(data.day)"
|
|
|
|
+ @change="(val) => handleDateToggle(data.day, val)"
|
|
|
|
+ @click.stop
|
|
/>
|
|
/>
|
|
|
|
+
|
|
<div class="employee-names">
|
|
<div class="employee-names">
|
|
<div v-for="(name, index) in (scheduleMap[data.day]?.names || [])" :key="index" class="employee-name" @dblclick.stop>
|
|
<div v-for="(name, index) in (scheduleMap[data.day]?.names || [])" :key="index" class="employee-name" @dblclick.stop>
|
|
{{ name }}
|
|
{{ name }}
|
|
@@ -45,7 +52,6 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
</el-calendar>
|
|
</el-calendar>
|
|
-
|
|
|
|
<el-pagination :current-page="state.page" :page-sizes="[10, 20, 50, 100]" :page-size="state.limit" :total="state.total" layout="total, sizes, prev, pager, next, jumper" @size-change="state.pageSizeChangeHandle" @current-change="state.pageCurrentChangeHandle"> </el-pagination>
|
|
<el-pagination :current-page="state.page" :page-sizes="[10, 20, 50, 100]" :page-size="state.limit" :total="state.total" layout="total, sizes, prev, pager, next, jumper" @size-change="state.pageSizeChangeHandle" @current-change="state.pageCurrentChangeHandle"> </el-pagination>
|
|
<!-- 弹窗, 新增 / 修改 -->
|
|
<!-- 弹窗, 新增 / 修改 -->
|
|
<add-or-update ref="addOrUpdateRef" @refreshDataList="refreshAfterAdd">确定</add-or-update>
|
|
<add-or-update ref="addOrUpdateRef" @refreshDataList="refreshAfterAdd">确定</add-or-update>
|
|
@@ -70,6 +76,7 @@ const view = reactive({
|
|
|
|
|
|
const state = reactive({ ...useView(view), ...toRefs(view) });
|
|
const state = reactive({ ...useView(view), ...toRefs(view) });
|
|
|
|
|
|
|
|
+
|
|
//日历
|
|
//日历
|
|
const calendarValue = ref(new Date())
|
|
const calendarValue = ref(new Date())
|
|
const selectedDates = ref<string[]>([]);
|
|
const selectedDates = ref<string[]>([]);
|
|
@@ -102,8 +109,7 @@ const buildScheduleMap = (list: any[]) => {
|
|
const ids = item.employeeIds || [];
|
|
const ids = item.employeeIds || [];
|
|
const names = ids.map((id: string) => employeeIdMap.value[id] || `员工姓名未知,id为${id}`);
|
|
const names = ids.map((id: string) => employeeIdMap.value[id] || `员工姓名未知,id为${id}`);
|
|
scheduleMap.value[day] = { id: item.id, names};
|
|
scheduleMap.value[day] = { id: item.id, names};
|
|
- console.log(list);
|
|
|
|
- console.log(scheduleMap.value);
|
|
|
|
|
|
+
|
|
}
|
|
}
|
|
};
|
|
};
|
|
import { onMounted } from 'vue'
|
|
import { onMounted } from 'vue'
|
|
@@ -112,14 +118,14 @@ onMounted(async () => {
|
|
await state.getDataList();
|
|
await state.getDataList();
|
|
buildScheduleMap(state.dataList || []);
|
|
buildScheduleMap(state.dataList || []);
|
|
|
|
|
|
-
|
|
|
|
|
|
+ console.log(state.dataList);
|
|
});
|
|
});
|
|
|
|
|
|
// 新增按钮
|
|
// 新增按钮
|
|
const addHandle = () => {
|
|
const addHandle = () => {
|
|
if (!selectedDates.value || selectedDates.value.length === 0) {
|
|
if (!selectedDates.value || selectedDates.value.length === 0) {
|
|
ElMessage({
|
|
ElMessage({
|
|
- message: '请先选择一个或多个日期再新增排班',
|
|
|
|
|
|
+ message: '请选择操作项',
|
|
type: 'warning',
|
|
type: 'warning',
|
|
duration: 500,
|
|
duration: 500,
|
|
});
|
|
});
|
|
@@ -128,12 +134,14 @@ const addHandle = () => {
|
|
// 批量添加
|
|
// 批量添加
|
|
addOrUpdateHandle(undefined, undefined, selectedDates.value);
|
|
addOrUpdateHandle(undefined, undefined, selectedDates.value);
|
|
};
|
|
};
|
|
-//新增后清除已选中
|
|
|
|
|
|
+
|
|
const refreshAfterAdd = async () => {
|
|
const refreshAfterAdd = async () => {
|
|
|
|
+ selectedDates.value = [];
|
|
await fetchEmployeeOptions();
|
|
await fetchEmployeeOptions();
|
|
await state.getDataList();
|
|
await state.getDataList();
|
|
- buildScheduleMap(state.dataList || []);
|
|
|
|
- selectedDates.value = [];
|
|
|
|
|
|
+
|
|
|
|
+ console.log(state.dataList);
|
|
|
|
+ buildScheduleMap(state.dataList || []);
|
|
};
|
|
};
|
|
|
|
|
|
const addOrUpdateRef = ref();
|
|
const addOrUpdateRef = ref();
|
|
@@ -153,6 +161,15 @@ const handleDayDblClick = (day: string) => {
|
|
}
|
|
}
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+const handleDateToggle = (day: string, checked: boolean) => {
|
|
|
|
+ const index = selectedDates.value.indexOf(day);
|
|
|
|
+ if (checked && index === -1) {
|
|
|
|
+ selectedDates.value.push(day);
|
|
|
|
+ } else if (!checked && index !== -1) {
|
|
|
|
+ selectedDates.value.splice(index, 1);
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+
|
|
// 审阅
|
|
// 审阅
|
|
const reviewHandle = (id?: string) => {
|
|
const reviewHandle = (id?: string) => {
|
|
if (!id && state.dataListSelections && state.dataListSelections.length <= 0) {
|
|
if (!id && state.dataListSelections && state.dataListSelections.length <= 0) {
|