Browse Source

日历模块

lwx_15
超级管理员 1 year ago
parent
commit
1452bcf2fe
  1. 8
      src/api/calendar/Calendar.ts
  2. 64
      src/api/calendar/DateClass.ts
  3. 13
      src/api/calendar/const.ts
  4. 4
      src/components/DesignForm/app/calendar/calendar1/calendarItem.vue
  5. 18
      src/components/DesignForm/app/calendar/calendar1/calendarPage.vue
  6. 9
      src/components/DesignForm/app/calendar/calendar1/monthPage.vue
  7. 2
      src/components/DesignForm/app/index.vue
  8. 4
      src/types/components.d.ts

8
src/api/calendar/Calendar.ts

@ -43,7 +43,7 @@ class Calendar {
title() { title() {
const title: string[] = []; const title: string[] = [];
for (let i = 0; i <= 6; i++) { for (let i = 0; i <= 6; i++) {
title.push(constValue.nStr1[i % 7]); title.push(constValue.nStr5[i % 7]);
} }
return title; return title;
} }
@ -82,7 +82,7 @@ class Calendar {
const y = date[1] === 1 ? date[0] - 1 : date[0]; const y = date[1] === 1 ? date[0] - 1 : date[0];
const m = date[1] === 1 ? 12 : date[1] - 1; const m = date[1] === 1 ? 12 : date[1] - 1;
let w = DateClass.solarMonth(y, m); let w = DateClass.solarMonth(y, m);
// console.log("获取当月前面需补齐的数组-->",y,m,w,last)
const arr: dateBase[] = []; const arr: dateBase[] = [];
for (let i = 0; i < last; i++) { for (let i = 0; i < last; i++) {
const lun = DateClass.getLunars(y, m, w - i); const lun = DateClass.getLunars(y, m, w - i);
@ -171,7 +171,7 @@ class Calendar {
const result = this.validateDate(date); const result = this.validateDate(date);
const currentDay = DateClass.solarWeeks(result[0], result[1]); const currentDay = DateClass.solarWeeks(result[0], result[1]);
// console.log("获取当月的完整数据",currentDay,result)
// 获取当月的完整数据 // 获取当月的完整数据
const beforDays = this.beforDays(date, currentDay).reverse(); const beforDays = this.beforDays(date, currentDay).reverse();
@ -187,7 +187,7 @@ class Calendar {
for (let row = 0; row < 6; row++) { for (let row = 0; row < 6; row++) {
dateArray.push(params.splice(0, 7)); dateArray.push(params.splice(0, 7));
} }
console.log("日历数据",dateArray) // console.log("日历数据",dateArray)
return dateArray; return dateArray;
} }
} }

64
src/api/calendar/DateClass.ts

@ -1,7 +1,8 @@
import constValue from '@/api/calendar/const'; import constValue from '@/api/calendar/const';
import { clockFactory } from '@/api/calendar/utils'; import { clockFactory } from '@/api/calendar/utils';
import config from '@/api/calendar/config'; import config from '@/api/calendar/config';
export const dayArr = ['日', '一', '二', '三', '四', '五', '六']; export const dayArr = [ '一', '二', '三', '四', '五', '六','日'];
// export const dayArr = ['日', '一', '二', '三', '四', '五', '六'];
/** /**
* *
@ -34,12 +35,12 @@ class DateClass {
); );
} }
getWorks(date: number[]) { getWorks(date: number[]) {
console.log("日清杀杀杀",`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`) // console.log("日清杀杀杀",`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`)
console.log("日清杀杀杀--》",config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`)) // console.log("日清杀杀杀--》",config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`))
console.log("日清杀杀杀--》",( // console.log("日清杀杀杀--》",(
config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`) > // config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`) >
-1 // -1
)) // ))
return ( return (
config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`) > config.Works.indexOf(`${date[0]}${clockFactory(date[1])}${clockFactory(date[2])}`) >
-1 -1
@ -73,7 +74,11 @@ class DateClass {
*/ */
solarWeek(y: number, m: number, d: number) { solarWeek(y: number, m: number, d: number) {
let date = new Date(y, m - 1, d); let date = new Date(y, m - 1, d);
let week = date.getDay(); let week = date.getDay()-1;
if(week < 0){
week = 6
}
// console.log("获取公历某一天是星期几",y, m ,date,week,week < 0)
return week; return week;
} }
/** /**
@ -94,7 +99,7 @@ class DateClass {
*/ */
toChinaDay(d: number) { toChinaDay(d: number) {
let str = d == 10 ? constValue.nStr2[0] : constValue.nStr2[Math.floor(d / 10)]; let str = d == 10 ? constValue.nStr2[0] : constValue.nStr2[Math.floor(d / 10)];
return str + (d % 10 ? constValue.nStr1[d % 10] : constValue.nStr1[10]); return str + (d % 10 ? constValue.nStr5[d % 10] : constValue.nStr5[10]);
} }
/** /**
* *
@ -310,12 +315,41 @@ class DateClass {
} }
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ 时间: 2024-07-15 09:00:20
@ 功能: 前进时间
@ 1: 23
*/
moveTime(y: number, m: number, d: number,t?:number){
switch(t){
case 2:
break;
case 3:
break;
default:
let month = m + 1
if(month > 12){
y = y + 1;
m = 1
d = this.solarMonth(y,m)
}else{
m = month
let day = this.solarMonth(y,month)
if(d > day){
d = day
}
}
return [y,m,d]
}
}
/**
@ 作者: 秦东
@ 时间: 2024-07-12 11:50:37 @ 时间: 2024-07-12 11:50:37
@ 功能: 处理年月日回退数据 @ 功能: 处理年月日回退数据
@ 1: 23 @ 1: 23
*/ */
gobackTime(y: number, m: number, d: number,t?:number){ gobackTime(y: number, m: number, d: number,t?:number){
console.log("计算时间--0--》",y,m,d,t) // console.log("计算时间--0--》",y,m,d,t)
switch(t){ switch(t){
case 2: case 2:
let startWeek = this.getMonday(y,m,d,'s',-1) let startWeek = this.getMonday(y,m,d,'s',-1)
@ -385,11 +419,11 @@ class DateClass {
console.log("now--->",now) // console.log("now--->",now)
console.log("nowTime--->",nowTime) // console.log("nowTime--->",nowTime)
console.log("day--->",day) // console.log("day--->",day)
console.log("longTime--->",longTime) // console.log("longTime--->",longTime)
console.log("n--->",n) // console.log("n--->",n)

13
src/api/calendar/const.ts

@ -303,6 +303,19 @@ export default {
'\u516b', '\u516b',
'\u4e5d', '\u4e5d',
'\u5341' '\u5341'
],
nStr5: [
'\u4e00',
'\u4e8c',
'\u4e09',
'\u56db',
'\u4e94',
'\u516d',
'\u65e5',
'\u4e03',
'\u516b',
'\u4e5d',
'\u5341'
], ],
/** /**
* *

4
src/components/DesignForm/app/calendar/calendar1/calendarItem.vue

@ -17,9 +17,7 @@
<div v-if="col.isHolidays"></div> <div v-if="col.isHolidays"></div>
<span >{{ col.lunarsChina }}</span> <span >{{ col.lunarsChina }}</span>
</div> </div>
{{col.date}}
{{props.time}}
</div> </div>

18
src/components/DesignForm/app/calendar/calendar1/calendarPage.vue

@ -5,6 +5,7 @@
--> -->
<script lang='ts' setup> <script lang='ts' setup>
import DateClass from '@/api/calendar/DateClass'; import DateClass from '@/api/calendar/DateClass';
import { clockFactory } from '@/api/calendar/utils';
// //
import MonthPage from './monthPage.vue' import MonthPage from './monthPage.vue'
@ -25,6 +26,12 @@ const taday = ref<any>([]);
const curtteDayType = ref(1) const curtteDayType = ref(1)
const curtteDay = ref(1) const curtteDay = ref(1)
onMounted(() => {
if(taday.value.length <= 0){
taday.value = DateClass.getCurrent()
}
console.log("系统加载",taday.value)
})
const curttWeek = computed(()=>{ const curttWeek = computed(()=>{
if(taday.value.length <= 0){ if(taday.value.length <= 0){
@ -85,6 +92,13 @@ const forwardTime = () =>{
if(taday.value.length <= 0){ if(taday.value.length <= 0){
taday.value = DateClass.getCurrent() taday.value = DateClass.getCurrent()
} }
if(curtteDayType.value != 2){
taday.value = DateClass.moveTime(taday.value[0],taday.value[1],taday.value[2],curtteDayType.value)
}else{
let weekObject = DateClass.moveTime(taday.value.start[0],taday.value.start[1],taday.value.start[2],curtteDayType.value)
taday.value = weekObject
}
} }
/** /**
@ 作者: 秦东 @ 作者: 秦东
@ -98,8 +112,8 @@ const pickTime = (val:number) => {
taday.value = DateClass.getCurrent() taday.value = DateClass.getCurrent()
let weekObject = DateClass.gobackTime(taday.value[0],taday.value[1],taday.value[2],curtteDayType.value) let weekObject = DateClass.gobackTime(taday.value[0],taday.value[1],taday.value[2],curtteDayType.value)
taday.value = weekObject taday.value = weekObject
curtteMonth.value = taday.value[0]+"年" // curtteMonth.value = taday.value[0]+""
curttWeek.value = taday.value[1]+"月"+taday.value[2]+"日" // curttWeek.value = taday.value[1]+""+taday.value[2]+""
// console.log("formEl---------4--------->",curttWeek.value ) // console.log("formEl---------4--------->",curttWeek.value )
break; break;
case 3: case 3:

9
src/components/DesignForm/app/calendar/calendar1/monthPage.vue

@ -6,7 +6,7 @@
<script lang='ts' setup> <script lang='ts' setup>
import Calendar from '@/api/calendar/Calendar'; import Calendar from '@/api/calendar/Calendar';
import DateClass from '@/api/calendar/DateClass'; import DateClass from '@/api/calendar/DateClass';
import { dateBase } from '@/api/calendar/Calendar';
import { clockFactory } from '@/api/calendar/utils'; import { clockFactory } from '@/api/calendar/utils';
import CalendarItem from './calendarItem.vue'; import CalendarItem from './calendarItem.vue';
@ -21,6 +21,13 @@ const props = defineProps({
} }
}); });
onMounted(()=>{
nextTick(()=>{
selectedTime.value = props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2])
})
})
const selectedTime = ref(props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2])) const selectedTime = ref(props.taDay[0] + "-" + clockFactory(props.taDay[1]) + "-" + clockFactory(props.taDay[2]))
const emit = defineEmits(['getDate']); const emit = defineEmits(['getDate']);
function changeDate(time: dateBase) { function changeDate(time: dateBase) {

2
src/components/DesignForm/app/index.vue

@ -857,7 +857,7 @@ const tabsView = (val:any,types:number) => {
</div> </div>
</el-col> </el-col>
<el-col v-if="viewType==2" :span="24"> <el-col v-if="viewType==2" :span="24">
<CalendarPage /> <CalendarPage v-if="viewType==2" />
</el-col> </el-col>
<el-col v-if="viewType==3" :span="24"> <el-col v-if="viewType==3" :span="24">
<TimeAxisPage ref="timeAxisRef" :data="tableDataList" :view-layout="viewLayout" :columns-filter="columnsFilter" :search-send="searchSend" /> <TimeAxisPage ref="timeAxisRef" :data="tableDataList" :view-layout="viewLayout" :columns-filter="columnsFilter" :search-send="searchSend" />

4
src/types/components.d.ts

@ -63,6 +63,7 @@ declare module '@vue/runtime-core' {
ElImageViewer: typeof import('element-plus/es')['ElImageViewer'] ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElLink: typeof import('element-plus/es')['ElLink']
ElMain: typeof import('element-plus/es')['ElMain'] ElMain: typeof import('element-plus/es')['ElMain']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
@ -124,10 +125,13 @@ declare module '@vue/runtime-core' {
HeadToolsNew: typeof import('./../components/DesignForm/public/headToolsNew.vue')['default'] HeadToolsNew: typeof import('./../components/DesignForm/public/headToolsNew.vue')['default']
IconSelect: typeof import('./../components/IconSelect/index.vue')['default'] IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default'] IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
IEpClose: typeof import('~icons/ep/close')['default'] IEpClose: typeof import('~icons/ep/close')['default']
IEpCollection: typeof import('~icons/ep/collection')['default']
IEpDelete: typeof import('~icons/ep/delete')['default'] IEpDelete: typeof import('~icons/ep/delete')['default']
IEpEdit: typeof import('~icons/ep/edit')['default'] IEpEdit: typeof import('~icons/ep/edit')['default']
IEpMessageBox: typeof import('~icons/ep/message-box')['default'] IEpMessageBox: typeof import('~icons/ep/message-box')['default']
IEpPicture: typeof import('~icons/ep/picture')['default']
IEpPlus: typeof import('~icons/ep/plus')['default'] IEpPlus: typeof import('~icons/ep/plus')['default']
IEpRefresh: typeof import('~icons/ep/refresh')['default'] IEpRefresh: typeof import('~icons/ep/refresh')['default']
IEpSearch: typeof import('~icons/ep/search')['default'] IEpSearch: typeof import('~icons/ep/search')['default']

Loading…
Cancel
Save