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

湖里大屏(进度计划)：完成外层甘特图进度条显示

Browse Source
This commit is contained in:
Jack 2022-08-10 11:01:07 +08:00
parent 005b0cb0e6
commit d5a71a2877
1 changed files with 52 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -42,7 +42,12 @@
<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>
<div
class="progress"
:style="{ left: gantt.left, width: gantt.width }"
v-for="(gantt, index) in child.gantts"
:key="index"
></div>
</div>
</div>
</div>
@ -66,7 +71,7 @@ export default {
console.log(this.getDays('2022/09'), '到')
},
mounted() {
this.getGantts()
this.setGantts()
},
data() {
return {
@ -76,55 +81,64 @@ export default {
pName: '地基与基础工程',
startTime: '2020/04/06',
endTime: '2020/05/09',
gantts: [{ left: '420px', width: '100px', status: '' }],
gantts: [],
// gantts: [{ left: '420px', width: '100px', status: '' }],
children: [
{ pName: '无支护土方工程', startTime: '2020/04/06', endTime: '2020/05/07' },
{ pName: '有支护土方工程', startTime: '2020/04/10', endTime: '2020/05/08' }
{ pName: '无支护土方工程', startTime: '2020/04/06', endTime: '2020/04/09', gantts: [] },
{ pName: '有支护土方工程', startTime: '2020/04/10', endTime: '2020/05/08', gantts: [] }
]
},
{ pName: '主体结构', startTime: '2020/03/12', endTime: '2020/06/04' },
{ pName: '建筑装饰装修', startTime: '2020/04/21', endTime: '2020/07/30' }
{ pName: '建筑装饰装修', startTime: '2020/04/21', endTime: '2020/07/30', gantts: [] }
],
openedIndex: 9999
}
},
methods: {
getGantts() {
this.projects.map(project => {
let { startTime, endTime, pName, gantts } = project
const startArr = startTime.split('/')
const endArr = endTime.split('/')
let startRef = null
let endRef = null
setGantts() {
const configGantts = projects => {
projects.map(project => {
let { startTime, endTime, pName, gantts } = project
const startArr = startTime.split('/')
const endArr = endTime.split('/')
let startRef = null
let endRef = null
if (!(startArr[2] % 2)) {
const day = startArr[2] - 1
startArr[2] = day < 10 ? '0' + day : day
startTime = startArr.join('/')
console.log(startTime, 'xxx')
}
if (!(endArr[2] % 2)) {
const day = endArr[2] - 1
endArr[2] = day < 10 ? '0' + day : day
endTime = endArr.join('/')
console.log(endTime, 'xxx')
}
if (!(startArr[2] % 2)) {
const day = startArr[2] - 1
startArr[2] = day < 10 ? '0' + day : day
startTime = startArr.join('/')
console.log(startTime, 'xxx')
}
if (!(endArr[2] % 2)) {
const day = endArr[2] - 1
endArr[2] = day < 10 ? '0' + day : day
endTime = endArr.join('/')
console.log(endTime, 'xxx')
}
startRef = this.$refs[`${pName}-${startTime}`][0]
const startLeft = startRef.offsetLeft
startRef = this.$refs[`${pName}-${startTime}`][0]
const startLeft = startRef.offsetLeft
endRef = this.$refs[`${pName}-${endTime}`][0]
const endWidth = endRef.offsetWidth
const endLeft = endRef.offsetLeft
const ganttWidth = endLeft - startLeft + endWidth
endRef = this.$refs[`${pName}-${endTime}`][0]
const endWidth = endRef.offsetWidth
const endLeft = endRef.offsetLeft
const ganttWidth = endLeft - startLeft + endWidth
if (gantts) {
gantts[0].left = startLeft + 'px'
gantts[0].width = ganttWidth + 'px'
}
console.log(startLeft, ganttWidth, '丢雷', `${pName}-${endTime}`)
// 设置 left
})
const gantt = { left: startLeft + 'px', width: ganttWidth + 'px' }
if (gantts) {
gantts.push(gantt)
} else {
project.gantts = [gantt]
}
console.log(startLeft, ganttWidth, '丢雷', `${pName}-${endTime}`)
// debugger
project.children && configGantts(project.children)
})
}
configGantts(this.projects)
},
getDays(date) {
const year = date.split('/')[0]