// 流程图 .flowChartContainer { position: relative; width: 100%; height: calc(100%); background-color: #fff; .chartBox { position: relative; // display: flex; height: calc(100% - 52px); .flowName { position: absolute; width: calc(100% - 360px); top: 10px; text-align: center; font-size: 24px; font-weight: 700; color: #1585FF; background-color: transparent; z-index: 9; } .myOverviewDiv { position: absolute; height: 142px; width: 234px; left: 0; bottom: 0; background-color: #ccc; z-index: 9; } } .control { display: flex; justify-content: space-between; height: 52px; align-items: center; padding: 0 10px; .nodeList { display: flex; align-items: center; .myPaletteSubprocess { height: 52px; width: 130px; canvas { height: 100%; width: 1000px; } } .myPaletteDiv { // margin-right: 20px; height: 52px; width: 380px; canvas { height: 100%; width: 1000px; } } .lineBox { height: 52px; width: 1px; background-color: #ccc; // margin-right: 10px; } .nodeBox { display: flex; align-items: center; justify-content: center; height: 52px; padding: 0 10px; border-radius: 10px; background-color: #D9E0FF; margin-right: 10px; .nodeImg { img { height: 35px; } margin-right: 5px; } } } .buttonList { display: flex; justify-content: flex-start; margin: 15px 0 15px 0; .ant-btn { display: flex; align-items: center; justify-content: center; margin-left: 10px; } } } canvas { border: 0px; outline: none; } .myDiagramDiv { width: calc(100% - 360px); // flex: 1; height: 100%; } }