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