网页设计就是网站开发吗尔雅网站开发实战

网页设计就是网站开发吗,尔雅网站开发实战,福州有网站建设的公司,网站制作尺寸vue 甘特图 vxe-gantt 如何自定义依赖线的颜色,通过设置 links 定义连接线,from 对应源任务的行主键,tom 对应目标任务的行主键 查看官网#xff1a;https://gantt.vxeui.com/ gitbub#xff1a;https://github.com/x-extends/vxe-gantt gitee#xff1a;https://gitee.com…vue 甘特图 vxe-gantt 如何自定义依赖线的颜色,通过设置 links 定义连接线,from 对应源任务的行主键,tom 对应目标任务的行主键查看官网https://gantt.vxeui.com/gitbubhttps://github.com/x-extends/vxe-ganttgiteehttps://gitee.com/x-extends/vxe-gantt自定义所有连接线的的颜色通过设置 task-link-config.lineColor 自定义连接线的颜色templatevxe-ganttv-bindganttOptions/vxe-gantt/templatescriptsetupimport{reactive}fromvueimport{VxeGanttDependencyType}fromvxe-ganttconstganttOptionsreactive({border:true,height:500,rowConfig:{keyField:id// 行主键},taskBarConfig:{showProgress:true,// 是否显示进度条showContent:true,// 是否在任务条显示内容move:true,// 是否允许拖拽任务移动日期resize:true,// 是否允许拖拽任务调整日期barStyle:{round:true,// 圆角bgColor:#fca60b,// 任务条的背景颜色completedBgColor:#65c16f// 已完成部分任务条的背景颜色}},taskViewConfig:{tableStyle:{width:480// 表格宽度}},taskLinkConfig:{lineColor:#fad06c// 给所有线自定义颜色},links:[{from:10001,to:10002,type:VxeGanttDependencyType.FinishToFinish},{from:10004,to:10005,type:VxeGanttDependencyType.StartToStart},{from:10005,to:10006,type:VxeGanttDependencyType.FinishToStart},{from:10013,to:10012,type:VxeGanttDependencyType.StartToFinish}],columns:[{type:seq,width:70},{field:title,title:任务名称},{field:start,title:开始时间,width:100},{field:end,title:结束时间,width:100},{field:progress,title:进度(%),width:80}],data:[{id:10001,title:任务1,start:2024-03-01,end:2024-03-04,progress:3},{id:10002,title:任务2,start:2024-03-03,end:2024-03-08,progress:10},{id:10003,title:任务3,start:2024-03-03,end:2024-03-11,progress:90},{id:10004,title:任务4,start:2024-03-05,end:2024-03-11,progress:15},{id:10005,title:任务5,start:2024-03-08,end:2024-03-15,progress:100},{id:10006,title:任务6,start:2024-03-10,end:2024-03-21,progress:5},{id:10007,title:任务7,start:2024-03-15,end:2024-03-24,progress:70},{id:10008,title:任务8,start:2024-03-05,end:2024-03-15,progress:50},{id:10009,title:任务9,start:2024-03-19,end:2024-03-20,progress:5},{id:10010,title:任务10,start:2024-03-12,end:2024-03-20,progress:10},{id:10011,title:任务11,start:2024-03-01,end:2024-03-08,progress:90},{id:10012,title:任务12,start:2024-03-03,end:2024-03-06,progress:60},{id:10013,title:任务13,start:2024-03-02,end:2024-03-05,progress:50},{id:10014,title:任务14,start:2024-03-04,end:2024-03-15,progress:0},{id:10015,title:任务15,start:2024-03-01,end:2024-03-05,progress:30}]})/script每条线单独自定义颜色templatevxe-ganttv-bindganttOptions/vxe-gantt/templatescriptsetupimport{reactive}fromvueimport{VxeGanttDependencyType}fromvxe-ganttconstganttOptionsreactive({border:true,height:500,rowConfig:{keyField:id// 行主键},taskBarConfig:{showProgress:true,// 是否显示进度条showContent:true,// 是否在任务条显示内容move:true,// 是否允许拖拽任务移动日期resize:true,// 是否允许拖拽任务调整日期barStyle:{round:true,// 圆角bgColor:#fca60b,// 任务条的背景颜色completedBgColor:#65c16f// 已完成部分任务条的背景颜色}},taskViewConfig:{tableStyle:{width:480// 表格宽度}},links:[{from:10001,to:10002,lineColor:#fad06c,type:VxeGanttDependencyType.FinishToFinish},{from:10004,to:10005,lineColor:#92c1f1,type:VxeGanttDependencyType.StartToStart},{from:10005,to:10006,lineColor:#fd9393,type:VxeGanttDependencyType.FinishToStart},{from:10013,to:10012,lineColor:#e78dd2,type:VxeGanttDependencyType.StartToFinish}],columns:[{type:seq,width:70},{field:title,title:任务名称},{field:start,title:开始时间,width:100},{field:end,title:结束时间,width:100},{field:progress,title:进度(%),width:80}],data:[{id:10001,title:任务1,start:2024-03-01,end:2024-03-04,progress:3},{id:10002,title:任务2,start:2024-03-03,end:2024-03-08,progress:10},{id:10003,title:任务3,start:2024-03-03,end:2024-03-11,progress:90},{id:10004,title:任务4,start:2024-03-05,end:2024-03-11,progress:15},{id:10005,title:任务5,start:2024-03-08,end:2024-03-15,progress:100},{id:10006,title:任务6,start:2024-03-10,end:2024-03-21,progress:5},{id:10007,title:任务7,start:2024-03-15,end:2024-03-24,progress:70},{id:10008,title:任务8,start:2024-03-05,end:2024-03-15,progress:50},{id:10009,title:任务9,start:2024-03-19,end:2024-03-20,progress:5},{id:10010,title:任务10,start:2024-03-12,end:2024-03-20,progress:10},{id:10011,title:任务11,start:2024-03-01,end:2024-03-08,progress:90},{id:10012,title:任务12,start:2024-03-03,end:2024-03-06,progress:60},{id:10013,title:任务13,start:2024-03-02,end:2024-03-05,progress:50},{id:10014,title:任务14,start:2024-03-04,end:2024-03-15,progress:0},{id:10015,title:任务15,start:2024-03-01,end:2024-03-05,progress:30}]})/scripthttps://gitee.com/x-extends/vxe-gantt