fix:排班日历中增加下拉框,以便快速定位到某个月

This commit is contained in:
zhangxuanming 2024-12-27 16:00:54 +08:00
parent 8028e4a32f
commit 0873930f45
3 changed files with 83 additions and 43 deletions

View File

@ -11,6 +11,16 @@
</el-radio-group>
</el-aside>
<el-main>
<el-form :model="form" size="small" :inline="true" label-width="100px">
<el-form-item label="日期" prop="date">
<el-date-picker
v-model="form.date"
type="date"
@change="changeDate"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-form>
<el-calendar v-loading="loading" v-model="date">
<template slot="dateCell" slot-scope="{date, data }">
<div>
@ -50,11 +60,14 @@
import { listCalholiday } from "@/api/mes/cal/calholiday";
import { listCalendars } from "@/api/mes/cal/calendar";
import calendar from '@/utils/calendar';
import UserSingleSelect from "@/components/userSelect/single.vue";
export default {
name: 'CalendarTypeView',
components: {UserSingleSelect},
dicts:['mes_calendar_type'],
data(){
return {
form: {},
//
loading: true,
date: new Date(),
@ -92,6 +105,9 @@ export default {
this.getList();
},
methods:{
changeDate(val) {
this.date = val
},
/** 查询节假日设置列表 */
getList() {
this.loading = true;

View File

@ -14,6 +14,14 @@
</el-input>
<UserSingleSelect ref="userSelect" @onSelected="onUserSelected"></UserSingleSelect>
</el-form-item>
<el-form-item label="日期" prop="date">
<el-date-picker
v-model="form.date"
type="date"
@change="changeDate"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-form>
</el-header>
<el-main>
@ -87,7 +95,6 @@ export default {
watch:{
date:{
handler(newVal,oldVal){
console.log(newVal.getFullYear()+'-'+(newVal.getMonth()+1)+'-'+newVal.getDate());
this.teamShiftQueryParams.date = newVal.getFullYear()+'-'+(newVal.getMonth()+1)+'-'+newVal.getDate();
this.loading = true;
listCalendars(this.teamShiftQueryParams).then(response =>{
@ -101,6 +108,9 @@ export default {
this.getList();
},
methods:{
changeDate(val) {
this.date = val
},
/** 查询节假日设置列表 */
getList() {
this.loading = true;

View File

@ -11,6 +11,16 @@
</el-radio-group>
</el-aside>
<el-main>
<el-form :model="form" size="small" :inline="true" label-width="100px">
<el-form-item label="日期" prop="date">
<el-date-picker
v-model="form.date"
type="date"
@change="changeDate"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-form>
<el-calendar v-loading="loading" v-model="date">
<template slot="dateCell" slot-scope="{date, data }">
<div>
@ -56,6 +66,7 @@ export default {
dicts:['mes_calendar_type'],
data(){
return {
form: {},
//
loading: true,
date: new Date(),
@ -94,6 +105,9 @@ export default {
this.getTeams();
},
methods:{
changeDate(val) {
this.date = val
},
getTeams(){
listAllTeam().then(response =>{
this.teamList = response.data;