admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

湖里大屏(进度计划)：完成甘特图栅格 ref 绑定

Browse Source
This commit is contained in:
Jack 2022-08-09 15:11:08 +08:00
parent e8ef6bf8cc
commit 6cd08a5982
1 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/views/projectAdmin/jlw/planProgress/centerTop.vue
View File

@ -13,7 +13,7 @@
{{ date }}
</div>
<div class="days">
<div class="day" v-for="day in getDays(date)" :key="day">{{ day }}</div>
<div class="day" v-for="day in getDays(date)" :key="day.num">{{ day.num }}</div>
</div>
</div>
</div>
@ -27,10 +27,10 @@
<div class="td">{{ p.endTime }}</div>
<div class="td" v-for="date in dates" :key="date + 'grid-date'">
<div class="grids">
<div class="grid" v-for="day in getDays(date)" :key="day + 'grid'"></div>
<div class="grid" v-for="day in getDays(date)" :key="'grid' + day.num" :ref="p.pName + '-' + day.date"></div>
</div>
</div>
<div class="progress"></div>
<div class="progress" :style="{ left: gantt.left, width: gantt.width }" v-for="(gantt, index) in p.gantts" :key="index"></div>
</div>
<div class="children">
<div class="row" v-for="child in p.children" :key="'child-' + child.pName">
@ -39,7 +39,7 @@
<div class="td">{{ child.endTime }}</div>
<div class="td" v-for="date in dates" :key="date + 'grid-date'">
<div class="grids">
<div class="grid" v-for="day in getDays(date)" :key="day + 'grid'"></div>
<div class="grid" v-for="day in getDays(date)" :key="'grid' + day.num" :ref="child.pName + '-' + day.date"></div>
</div>
</div>
<div class="progress"></div>
@ -65,6 +65,10 @@ export default {
created() {
console.log(this.getDays('2022/09'), '到')
},
mounted() {
console.log(this.projects)
console.log(this.$refs, 'sdfsf')
},
data() {
return {
dates: ['2020/04', '2020/05', '2020/07', '2020/08'],
@ -73,10 +77,10 @@ export default {
pName: '地基与基础工程',
startTime: '2020/04/06',
endTime: '2020/05/09',
gantts: [{ startTime: '', endTime: '', status: '' }],
gantts: [{ left: '420px', width: '100px', status: '' }],
children: [
{ pName: '无支护土方工程', startTime: '2020/04', endTime: '2020/05' },
{ pName: '有支护土方工程', startTime: '2020/04', endTime: '2020/05' }
{ pName: '无支护土方工程', startTime: '2020/04/06', endTime: '2020/05/07' },
{ pName: '有支护土方工程', startTime: '2020/04/10', endTime: '2020/05/08' }
]
},
{ pName: '主体结构', startTime: '2020/03/12', endTime: '2020/06/04' },
@ -108,12 +112,16 @@ export default {
return (() => {
const days = new Array(count)
.fill(0)
.map((item, index) => index + 1)
.filter(item => item % 2)
.map((item, index) => {
let num = index + 1
let fulldate = date + (num < 10 ? '/0' + num : '/' + num)
return { num, date: fulldate }
})
.filter(item => item.num % 2)
if (count === 28) {
days.push(28)
days.push({ num: 28, date: date + '/28' })
} else if (count === 30) {
days.push(30)
days.push({ num: 30, date: date + '/30' })
}
return days
})()
@ -187,6 +195,7 @@ export default {
border-right: 4px solid transparent;
border-bottom: 4px solid transparent;
border-left: 4px solid #5be1f4;
z-index: 99;
}
&.open {
&::before {