gantt
This commit is contained in:
parent
65280b7411
commit
88d2e747d9
|
|
@ -2,7 +2,6 @@
|
||||||
<div
|
<div
|
||||||
class="slider"
|
class="slider"
|
||||||
ref="slider"
|
ref="slider"
|
||||||
:style="{ width: '100%', display: inline-block}"
|
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="process"
|
class="process"
|
||||||
|
|
@ -113,6 +112,8 @@ export default {
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
cursor: text;
|
cursor: text;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
|
width: 100%;
|
||||||
|
display: inline-block
|
||||||
}
|
}
|
||||||
.slider .process {
|
.slider .process {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
|
||||||
|
|
@ -1,44 +1,45 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="chart" ref="chart">
|
<div>
|
||||||
<div class="left" :style="{ width: rightLineX + 'px' }">
|
<div class="chart" ref="chart">
|
||||||
<leftMenu
|
<div class="left" :style="{ width: rightLineX + 'px' }">
|
||||||
:list="list"
|
<leftMenu
|
||||||
ref="leftMenu"
|
:list="list"
|
||||||
:BGScrollTop.sync="BGScrollTop"
|
ref="leftMenu"
|
||||||
@TableScrollTop="TableScrollTop"
|
:BGScrollTop.sync="BGScrollTop"
|
||||||
@handlerRowClick="handlerRowClick"
|
@TableScrollTop="TableScrollTop"
|
||||||
@handlerGroup="handlerGroup"
|
@handlerRowClick="handlerRowClick"
|
||||||
@handlerExpand="handlerExpand"
|
@handlerGroup="handlerGroup"
|
||||||
></leftMenu>
|
@handlerExpand="handlerExpand"
|
||||||
<div class="rightLine" :style="{ left: rightLineX + 'px' }"></div>
|
></leftMenu>
|
||||||
<div
|
<div class="rightLine" :style="{ left: rightLineX + 'px' }"></div>
|
||||||
class="rightLine"
|
|
||||||
:style="{ left: rightLineX + 'px' }"
|
|
||||||
ref="rightLine"
|
|
||||||
@mousedown="rightLineMousedown"
|
|
||||||
></div>
|
|
||||||
</div>
|
|
||||||
<div class="date" :style="{ left: rightLineX + 2 + 'px' }">
|
|
||||||
<div class="years" v-for="item in allDays" :key="item.year">
|
|
||||||
<div
|
<div
|
||||||
class="month"
|
class="rightLine"
|
||||||
v-for="(value, key) in item.month[0]"
|
:style="{ left: rightLineX + 'px' }"
|
||||||
:key="value + 'zz' + key"
|
ref="rightLine"
|
||||||
:style="{ width: value.length * currentDaySize.value + 'px' }"
|
@mousedown="rightLineMousedown"
|
||||||
>
|
></div>
|
||||||
<div class="month-top">{{ item.year }}年{{ key }}月</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="topMonth" v-if="showFixdTopMonth">{{ fixdTopMonth }}</div>
|
<div class="date" :style="{ left: rightLineX + 2 + 'px' }">
|
||||||
<div class="allDaysArray">
|
<div class="years" v-for="item in allDays" :key="item.year">
|
||||||
<div class="alldays">
|
|
||||||
<div
|
<div
|
||||||
v-for="(j, index) in days"
|
class="month"
|
||||||
:key="index"
|
v-for="(value, key) in item.month[0]"
|
||||||
class="day"
|
:key="value + 'zz' + key"
|
||||||
:style="{ width: currentDaySize.value + 'px' }"
|
:style="{ width: value.length * currentDaySize.value + 'px' }"
|
||||||
>
|
>
|
||||||
<template v-if="currentDaySize.value === 20">
|
<div class="month-top">{{ item.year }}年{{ key }}月</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="topMonth" v-if="showFixdTopMonth">{{ fixdTopMonth }}</div>
|
||||||
|
<div class="allDaysArray">
|
||||||
|
<div class="alldays">
|
||||||
|
<div
|
||||||
|
v-for="(j, index) in days"
|
||||||
|
:key="index"
|
||||||
|
class="day"
|
||||||
|
:style="{ width: currentDaySize.value + 'px' }"
|
||||||
|
>
|
||||||
|
<template v-if="currentDaySize.value === 20">
|
||||||
<span
|
<span
|
||||||
v-if="j.today"
|
v-if="j.today"
|
||||||
class="dateNum todayDateNum"
|
class="dateNum todayDateNum"
|
||||||
|
|
@ -46,34 +47,34 @@
|
||||||
>
|
>
|
||||||
今天
|
今天
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
v-else
|
v-else
|
||||||
class="dateNum"
|
class="dateNum"
|
||||||
:style="{
|
:style="{
|
||||||
borderLeft: index == 0 ? 'none' : '1px solid #d7d7d7'
|
borderLeft: index == 0 ? 'none' : '1px solid #d7d7d7'
|
||||||
}"
|
}"
|
||||||
:class="{
|
:class="{
|
||||||
weekday: j.weekday == 0 || j.weekday == 6,
|
weekday: j.weekday == 0 || j.weekday == 6,
|
||||||
isHover:
|
isHover:
|
||||||
j.width >= currentLineDay.start &&
|
j.width >= currentLineDay.start &&
|
||||||
j.width <= currentLineDay.end
|
j.width <= currentLineDay.end
|
||||||
}"
|
}"
|
||||||
>{{ j.date }}</span>
|
>{{ j.date }}</span>
|
||||||
<span
|
<span
|
||||||
class="dateBG"
|
class="dateBG"
|
||||||
:class="{
|
:class="{
|
||||||
weekday2: j.weekday == 0,
|
weekday2: j.weekday == 0,
|
||||||
weekday1: j.weekday == 6,
|
weekday1: j.weekday == 6,
|
||||||
today: j.today
|
today: j.today
|
||||||
}"
|
}"
|
||||||
:style="{
|
:style="{
|
||||||
width: currentDaySize.value + 'px',
|
width: currentDaySize.value + 'px',
|
||||||
height:
|
height:
|
||||||
j.weekday == 0 || j.weekday == 6 ? lineBGHeight : '0px'
|
j.weekday == 0 || j.weekday == 6 ? lineBGHeight : '0px'
|
||||||
}"
|
}"
|
||||||
></span>
|
></span>
|
||||||
</template>
|
</template>
|
||||||
<template v-if="currentDaySize.value == 10">
|
<template v-if="currentDaySize.value == 10">
|
||||||
<span
|
<span
|
||||||
class="dateNum"
|
class="dateNum"
|
||||||
:class="{
|
:class="{
|
||||||
|
|
@ -100,21 +101,21 @@
|
||||||
{{ j.date }}
|
{{ j.date }}
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="dateBG"
|
class="dateBG"
|
||||||
:class="{
|
:class="{
|
||||||
weekday2: j.weekday === 0,
|
weekday2: j.weekday === 0,
|
||||||
weekday1: j.weekday === 6,
|
weekday1: j.weekday === 6,
|
||||||
today: j.today
|
today: j.today
|
||||||
}"
|
}"
|
||||||
:style="{
|
:style="{
|
||||||
width: currentDaySize.value + 'px',
|
width: currentDaySize.value + 'px',
|
||||||
height:
|
height:
|
||||||
j.weekday === 0 || j.weekday === 6 ? lineBGHeight : '0px'
|
j.weekday === 0 || j.weekday === 6 ? lineBGHeight : '0px'
|
||||||
}"
|
}"
|
||||||
></span>
|
></span>
|
||||||
</template>
|
</template>
|
||||||
<template v-if="currentDaySize.value === 2">
|
<template v-if="currentDaySize.value === 2">
|
||||||
<span
|
<span
|
||||||
class="dateNum"
|
class="dateNum"
|
||||||
:class="{
|
:class="{
|
||||||
|
|
@ -140,34 +141,36 @@
|
||||||
{{ j.date }}
|
{{ j.date }}
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
class="dateBG weekday2"
|
class="dateBG weekday2"
|
||||||
:class="{
|
:class="{
|
||||||
today: j.today
|
today: j.today
|
||||||
}"
|
}"
|
||||||
style="border-right:none;"
|
style="border-right:none;"
|
||||||
:style="{
|
:style="{
|
||||||
width: currentDaySize.value + 'px',
|
width: currentDaySize.value + 'px',
|
||||||
height:
|
height:
|
||||||
j.weekday === 0 || j.weekday === 6 ? lineBGHeight : '0px'
|
j.weekday === 0 || j.weekday === 6 ? lineBGHeight : '0px'
|
||||||
}"
|
}"
|
||||||
></span>
|
></span>
|
||||||
</template>
|
</template>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="lineBG" @scroll="handlerBGScroll" ref="lineBG">
|
||||||
<div class="lineBG" @scroll="handlerBGScroll" ref="lineBG">
|
<template v-for="(item, index) in computedList">
|
||||||
<template v-for="(item, index) in computedList">
|
<!--<div :key="item.id" class="tetst">{{item.isShow}}</div>-->
|
||||||
<!--<div :key="item.id" class="tetst">{{item.id}}</div>-->
|
<div
|
||||||
<div
|
v-show="item.isShow"
|
||||||
:ref="'line' + item.id"
|
:ref="'line' + item.id"
|
||||||
:key="item.id + index"
|
:key="item.id + index"
|
||||||
class="line"
|
|
||||||
:style="{
|
class="line"
|
||||||
|
:style="{
|
||||||
left: item.left + 'px',
|
left: item.left + 'px',
|
||||||
width: item.widthMe + 'px',
|
width: item.widthMe + 'px',
|
||||||
top: item.top + 'px'
|
top: item.top + 'px'
|
||||||
}"
|
}"
|
||||||
@mouseover="
|
@mouseover="
|
||||||
lineMouseover(
|
lineMouseover(
|
||||||
`line${item.id}`,
|
`line${item.id}`,
|
||||||
$event,
|
$event,
|
||||||
|
|
@ -176,8 +179,8 @@
|
||||||
index
|
index
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
@mouseleave="lineMouseleave"
|
@mouseleave="lineMouseleave"
|
||||||
@mouseenter="
|
@mouseenter="
|
||||||
lineMouseenter(
|
lineMouseenter(
|
||||||
`line${item.id}`,
|
`line${item.id}`,
|
||||||
$event,
|
$event,
|
||||||
|
|
@ -186,88 +189,89 @@
|
||||||
index
|
index
|
||||||
)
|
)
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
<slider
|
<slider
|
||||||
v-show="item.type == 1"
|
v-show="item.type == 1"
|
||||||
:id="item.id"
|
:id="item.id"
|
||||||
v-model="item.per"
|
v-model="item.per"
|
||||||
:min="0"
|
:min="0"
|
||||||
:max="item.per"
|
:max="item.per"
|
||||||
:per1="item.per1"
|
:per1="item.per1"
|
||||||
:disabled="disable"
|
:disabled="disable"
|
||||||
:widths="item.widthChild"
|
:widths="item.widthChild"
|
||||||
></slider>
|
></slider>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="item.type == 3"
|
v-if="item.type == 3"
|
||||||
:key="item.id"
|
:key="item.id"
|
||||||
class="group"
|
class="group"
|
||||||
:style="{
|
:style="{
|
||||||
top: item.top + 'px',
|
top: item.top + 'px',
|
||||||
left: item.left + 'px',
|
left: item.left + 'px',
|
||||||
width: item.widthMe + 'px'
|
width: item.widthMe + 'px'
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<div class="progress" :style="{ width: item.per + '%' }"></div>
|
<div class="progress" :style="{ width: item.per + '%' }"></div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="toolTip">
|
||||||
<div class="toolTip">
|
<!--<div class="today base" @click="handleGoToday">今天</div>-->
|
||||||
<!--<div class="today base" @click="handleGoToday">今天</div>-->
|
<el-dropdown trigger="click">
|
||||||
<el-dropdown trigger="click">
|
|
||||||
<span class="base">
|
<span class="base">
|
||||||
{{this.currentDaySize.label}}
|
{{this.currentDaySize.label}}
|
||||||
<i class="el-icon-arrow-down el-icon--right"></i>
|
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||||
</span>
|
</span>
|
||||||
<el-dropdown-menu
|
<el-dropdown-menu
|
||||||
slot="dropdown"
|
slot="dropdown"
|
||||||
:style="{ left: this.left + 'px !important' }"
|
:style="{ left: this.left + 'px !important' }"
|
||||||
>
|
|
||||||
<el-dropdown-item
|
|
||||||
v-for="item in currentDaySizeOptions"
|
|
||||||
:key="item.value + 'ck'"
|
|
||||||
@click.native="handleSetDaySize(item)"
|
|
||||||
>
|
>
|
||||||
{{ item.label }}
|
<el-dropdown-item
|
||||||
</el-dropdown-item>
|
v-for="item in currentDaySizeOptions"
|
||||||
</el-dropdown-menu>
|
:key="item.value + 'ck'"
|
||||||
</el-dropdown>
|
@click.native="handleSetDaySize(item)"
|
||||||
</div>
|
>
|
||||||
<transition name="el-zoom-in-center">
|
{{ item.label }}
|
||||||
<div
|
</el-dropdown-item>
|
||||||
v-show="isShowMsg"
|
</el-dropdown-menu>
|
||||||
:style="{
|
</el-dropdown>
|
||||||
|
</div>
|
||||||
|
<transition name="el-zoom-in-center">
|
||||||
|
<div
|
||||||
|
v-show="isShowMsg"
|
||||||
|
:style="{
|
||||||
left: currentProjectMsg.left + 'px',
|
left: currentProjectMsg.left + 'px',
|
||||||
top: currentProjectMsg.top + 'px'
|
top: currentProjectMsg.top + 'px'
|
||||||
}"
|
}"
|
||||||
class="projectMsg"
|
class="projectMsg"
|
||||||
>
|
>
|
||||||
<div class="lineMsg projectName">
|
<div class="lineMsg projectName">
|
||||||
{{ currentProjectMsg.name }}
|
{{ currentProjectMsg.name }}
|
||||||
|
</div>
|
||||||
|
<div class="lineMsg">
|
||||||
|
<span class="title">工作周期：</span>
|
||||||
|
<span>{{ currentProjectMsg.allTime }}天</span>
|
||||||
|
</div>
|
||||||
|
<div class="lineMsg">
|
||||||
|
<span class="title">当前进度：</span>
|
||||||
|
<span>{{ currentProjectMsg.per }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="lineMsg">
|
||||||
|
<span class="title">合格数量：</span>
|
||||||
|
<span>{{ currentProjectMsg.per1 }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="lineMsg">
|
||||||
|
<span class="title">开始时间：</span>
|
||||||
|
<span>{{ currentProjectMsg.startTime }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="lineMsg">
|
||||||
|
<span class="title">结束时间：</span>
|
||||||
|
<span>{{ currentProjectMsg.endTime }}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="lineMsg">
|
</transition>
|
||||||
<span class="title">工作周期：</span>
|
</div>
|
||||||
<span>{{ currentProjectMsg.allTime }}天</span>
|
|
||||||
</div>
|
|
||||||
<div class="lineMsg">
|
|
||||||
<span class="title">当前进度：</span>
|
|
||||||
<span>{{ currentProjectMsg.per }}</span>
|
|
||||||
</div>
|
|
||||||
<div class="lineMsg">
|
|
||||||
<span class="title">合格数量：</span>
|
|
||||||
<span>{{ currentProjectMsg.per1 }}</span>
|
|
||||||
</div>
|
|
||||||
<div class="lineMsg">
|
|
||||||
<span class="title">开始时间：</span>
|
|
||||||
<span>{{ currentProjectMsg.startTime }}</span>
|
|
||||||
</div>
|
|
||||||
<div class="lineMsg">
|
|
||||||
<span class="title">结束时间：</span>
|
|
||||||
<span>{{ currentProjectMsg.endTime }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</transition>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -284,8 +288,8 @@
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
//当前项是否是子集
|
|
||||||
disable: true,
|
disable: true,
|
||||||
|
//当前项是否是子集
|
||||||
isChildren: false,
|
isChildren: false,
|
||||||
dialogVal: false,
|
dialogVal: false,
|
||||||
//title
|
//title
|
||||||
|
|
@ -375,13 +379,13 @@
|
||||||
let that = this;
|
let that = this;
|
||||||
getPlanGantt({}).then(res=>{
|
getPlanGantt({}).then(res=>{
|
||||||
if(res.code===200){
|
if(res.code===200){
|
||||||
debugger;
|
// debugger;
|
||||||
let arr =[];
|
let arr =[];
|
||||||
let list = res.data.results;
|
let list = res.data.results;
|
||||||
list.forEach(item => {
|
list.forEach(item => {
|
||||||
if (!item.children || item.children.length < 1) {
|
if (!item.children || item.children.length < 1) {
|
||||||
let startTime = new Date(item.startTime).getTime();
|
let startTime = new Date(item.start_date).getTime();
|
||||||
let endTime = new Date(item.endDate).getTime();
|
let endTime = new Date(item.end_date).getTime();
|
||||||
let obj=new Object();
|
let obj=new Object();
|
||||||
obj.name=item.number;
|
obj.name=item.number;
|
||||||
obj.id=item.id;
|
obj.id=item.id;
|
||||||
|
|
@ -391,19 +395,19 @@
|
||||||
obj.planTime = [startTime,endTime];
|
obj.planTime = [startTime,endTime];
|
||||||
obj.per=item.count;
|
obj.per=item.count;
|
||||||
obj.per1=item.count_real;
|
obj.per1=item.count_real;
|
||||||
obj.type=3;
|
obj.type=1;
|
||||||
obj.isShow= true;
|
obj.isShow= true;
|
||||||
arr.push(obj);
|
arr.push(obj);
|
||||||
} else if (item.children && item.children.length >= 1) {
|
} else if (item.children && item.children.length >= 1) {
|
||||||
let startTime = new Date(item.start_date).getTime();
|
let startTime = new Date(item.start_date).getTime();
|
||||||
let endTime = new Date(item.start_date).getTime();
|
let endTime = new Date(item.end_date).getTime();
|
||||||
debugger;
|
debugger;
|
||||||
let temp =[];
|
let temp =[];
|
||||||
let parentId = item.id;
|
let parentId = item.id;
|
||||||
let children = item.children;
|
let children = item.children;
|
||||||
children.forEach(child => {
|
children.forEach(child => {
|
||||||
let start = new Date(item.start_date).getTime();
|
let start = new Date(child.start_date).getTime();
|
||||||
let end = new Date(item.end_date).getTime();
|
let end = new Date(child.end_date).getTime();
|
||||||
let objChild = new Object();
|
let objChild = new Object();
|
||||||
objChild.name = child.number;
|
objChild.name = child.number;
|
||||||
objChild.id = child.id;
|
objChild.id = child.id;
|
||||||
|
|
@ -434,7 +438,7 @@
|
||||||
arr.push(obj);
|
arr.push(obj);
|
||||||
}
|
}
|
||||||
that.list = arr;
|
that.list = arr;
|
||||||
that.handlerCheckList(arr);
|
that.handlerCheckList(that.list);
|
||||||
});
|
});
|
||||||
console.log(that.list);
|
console.log(that.list);
|
||||||
}else{
|
}else{
|
||||||
|
|
@ -444,7 +448,7 @@
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
computedList() {
|
computedList() {
|
||||||
debugger;
|
// debugger;
|
||||||
console.log(this.list);
|
console.log(this.list);
|
||||||
let arr = [];
|
let arr = [];
|
||||||
this.list.forEach(item => {
|
this.list.forEach(item => {
|
||||||
|
|
@ -489,7 +493,7 @@
|
||||||
//过滤导入的数据
|
//过滤导入的数据
|
||||||
handlerCheckList(list) {
|
handlerCheckList(list) {
|
||||||
list.forEach((item, index) => {
|
list.forEach((item, index) => {
|
||||||
item.planTime = [];
|
item.planTime = [item.startTime, item.endTime];
|
||||||
item.left = this.computedTimeWidth(item.startTime);
|
item.left = this.computedTimeWidth(item.startTime);
|
||||||
item.widthMe = item.widthChild = this.computedTimeWidth(item.startTime, item.endTime) ;
|
item.widthMe = item.widthChild = this.computedTimeWidth(item.startTime, item.endTime) ;
|
||||||
item.isShow = true;
|
item.isShow = true;
|
||||||
|
|
@ -499,14 +503,11 @@
|
||||||
item.isexpand = true;
|
item.isexpand = true;
|
||||||
if (item.children.length > 0) {
|
if (item.children.length > 0) {
|
||||||
item.children.forEach((k, i) => {
|
item.children.forEach((k, i) => {
|
||||||
k.planTime = [];
|
k.planTime = [k.startTime, k.endTime];
|
||||||
k.top = item.top + i * 40 + 35;
|
k.top = item.top + i * 40 + 40;
|
||||||
k.isShow = true;
|
k.isShow = true;
|
||||||
k.left = this.computedTimeWidth(k.startTime);
|
k.left = this.computedTimeWidth(k.startTime);
|
||||||
k.widthMe = k.widthChild = this.computedTimeWidth(
|
k.widthMe = k.widthChild = this.computedTimeWidth(k.startTime,k.endTime,k);
|
||||||
k.startTime,
|
|
||||||
k.endTime
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -518,14 +519,11 @@
|
||||||
item.isexpand = true;
|
item.isexpand = true;
|
||||||
if (item.children.length > 0) {
|
if (item.children.length > 0) {
|
||||||
item.children.forEach((z, o) => {
|
item.children.forEach((z, o) => {
|
||||||
z.planTime = [];
|
z.planTime = [z.startTime, z.endTime];
|
||||||
z.top = item.top + o * 40+40;
|
z.top = item.top + o * 40+40;
|
||||||
z.isShow = true;
|
z.isShow = true;
|
||||||
z.left = this.computedTimeWidth(z.startTime);
|
z.left = this.computedTimeWidth(z.startTime);
|
||||||
z.widthMe = z.widthChild = this.computedTimeWidth(
|
z.widthMe = z.widthChild = this.computedTimeWidth(z.startTime, z.endTime,z);
|
||||||
z.startTime,
|
|
||||||
z.endTime
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -570,21 +568,15 @@
|
||||||
},
|
},
|
||||||
// 根据时间计算距离
|
// 根据时间计算距离
|
||||||
computedTimeWidth(startTime, endTime) {
|
computedTimeWidth(startTime, endTime) {
|
||||||
let start = new Date(startTime).getTime();
|
|
||||||
let end = new Date(endTime).getTime();
|
|
||||||
let left =
|
|
||||||
(Math.floor(
|
|
||||||
start - new Date(`${this.currentYear - 1}/01/01`).getTime()
|
|
||||||
) /
|
|
||||||
(1000 * 60 * 60 * 24)) *
|
|
||||||
this.currentDaySize.value;
|
|
||||||
let width =
|
|
||||||
(Math.floor(end - start) / (1000 * 60 * 60 * 24)) *
|
|
||||||
this.currentDaySize.value +
|
|
||||||
this.currentDaySize.value;
|
|
||||||
if (!endTime) {
|
if (!endTime) {
|
||||||
|
let left =
|
||||||
|
(Math.floor( startTime - new Date(`${this.currentYear - 1}/01/01`).getTime() ) /
|
||||||
|
(1000 * 60 * 60 * 24)) *this.currentDaySize.value;
|
||||||
return left;
|
return left;
|
||||||
} else {
|
} else {
|
||||||
|
let width = (Math.floor(endTime - startTime) / (1000 * 60 * 60 * 24)) * this.currentDaySize.value + this.currentDaySize.value;
|
||||||
|
debugger;
|
||||||
|
console.log(width);
|
||||||
return width;
|
return width;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -697,9 +689,8 @@
|
||||||
behavior: "smooth"
|
behavior: "smooth"
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
//更改daySize
|
//更改daySize-----按天/按周/按月
|
||||||
handleSetDaySize(item) {
|
handleSetDaySize(item) {
|
||||||
// console.log(item);
|
|
||||||
this.currentDaySize = item;
|
this.currentDaySize = item;
|
||||||
this.days.forEach((item, index) => {
|
this.days.forEach((item, index) => {
|
||||||
item.width = (index + 1) * this.currentDaySize.value;
|
item.width = (index + 1) * this.currentDaySize.value;
|
||||||
|
|
@ -797,8 +788,7 @@
|
||||||
* @param {Boolean|String} time
|
* @param {Boolean|String} time
|
||||||
*/
|
*/
|
||||||
computedWithTime(width, time) {
|
computedWithTime(width, time) {
|
||||||
let startTime =
|
let startTime = (width / this.currentDaySize.value) * (1000 * 60 * 60 * 24) +
|
||||||
(width / this.currentDaySize.value) * (1000 * 60 * 60 * 24) +
|
|
||||||
new Date(`${this.currentYear - 1}/01/01`).getTime();
|
new Date(`${this.currentYear - 1}/01/01`).getTime();
|
||||||
let s = new Date(startTime);
|
let s = new Date(startTime);
|
||||||
if (time && time == true) {
|
if (time && time == true) {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue