甘特图实现

104 阅读9分钟
.content { background-color: #fff; padding: 20px; border-radius: 5px; .contentform { height: 100%; border-bottom: 1px solid #ebe8e8; position: relative; .contentformtop { height: 50px; margin-left: 10px; } .contentform-class { .classitem { height: 50px; font-size: 1.48vh !important; line-height: 30px; } // height: 212px; // width: 100%; // display: flex; // flex-wrap: wrap; // :deep(.ant-form-item-label) { // width: 5.81vw; // } .a-button { position: absolute; height: 50px; right: 0vw; bottom: 7px; } } } .contenttop { margin-top: 30px; height: 25px; .ddmx { position: absolute; height: 2vh; line-height: 2vh; font-size: 2vh; padding-left: 5px; width: 30%; } .titleright { height: 25px; display: flex; position: absolute; right: 30px; } } .contenttable { margin-top: 50px; height: 500px; padding: 0; overflow-y: auto; .gantt-container { width: 100%; height: 90%; } } .pcright { position: relative; right: 20px; top: -70px; .a-button { position: absolute; top: 40px; right: 60px; } .a-button1 { position: absolute; top: 40px; right: -20px; } } } @media screen and (min-width: 3001px) and (max-width: 3840px) { html { font-size: 28px; } .content { .contentform { height: 500px; font-size: 28px; .contentformtop { height: 50px; margin-left: 10px; .toptext { font-size: 28px; } } .contentform-class { .classitem { height: 50px; font-size: 28px !important; line-height: 50px; } :deep(.ant-form-item-control-input) { font-size: 24px !important; } :deep(.ant-select-selection-item) { height: 50px; line-height: 50px; } height: 50px; :deep(.ant-select-selector) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-form-item) { font-size: 28px !important; } :deep(.ant-picker-input >input) { height: 50px; font-size: 28px !important; } :deep(.ant-form-item-label >label) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-input) { height: 50px; font-size: 28px; } } .ExportExcel { height: 50px; font-size: 28px; } .addpage { height: 50px; font-size: 28px; } } .contenttop { margin-top: 3vh; .ddmx { font-size: 28px; } .titleright { // width: 30%; height: 50px; display: flex; position: absolute; right: 10px; .ExportExcel { height: 50px; font-size: 28px; } .addpage { height: 50px; font-size: 28px; } } } .contenttable { margin-top: 50px; height: 900px; padding: 0; overflow-y: auto; .gantt-container { width: 100%; height: 90%; :deep(.gantt_grid) { width: 1200px; // background-color: aqua; :deep(.gantt_grid_scale) { height: 50px !important; } } } } } .a-modaldemo { .a-modal { :deep(.ant-select-selection-item) { height: 50px; line-height: 50px; } :deep(.ant-form-item) { font-size: 28px !important; } :deep(.ant-select-selector) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-form-item-label >label) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-input) { height: 50px; font-size: 28px; } } } .contenttable { height: 1000px; font-size: 28px; overflow-y: auto; :deep(.ant-table-content) { font-size: 28px; width: 100%; // background-color: #004696; } :deep(.ant-table-pagination) { font-size: 28px; } :deep(.ant-select-selector) { font-size: 28px; } } } @media screen and (min-width: 2561px) and (max-width: 3000px) { html { font-size: 28px; } .content { .contentform { height: 500px; font-size: 28px; .contentformtop { height: 50px; margin-left: 10px; .toptext { font-size: 28px; } } .contentform-class { .classitem { height: 50px; font-size: 28px !important; line-height: 50px; } :deep(.ant-form-item-control-input) { font-size: 24px !important; } :deep(.ant-select-selection-item) { height: 50px; line-height: 50px; } height: 50px; :deep(.ant-select-selector) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-form-item) { font-size: 28px !important; } :deep(.ant-picker-input >input) { height: 50px; font-size: 28px !important; } :deep(.ant-form-item-label >label) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-input) { height: 50px; font-size: 28px; } } .ExportExcel { height: 50px; font-size: 28px; } .addpage { height: 50px; font-size: 28px; } } .contenttop { margin-top: 3vh; .ddmx { font-size: 28px; } .titleright { // width: 30%; height: 50px; display: flex; position: absolute; right: 10px; .ExportExcel { height: 50px; font-size: 28px; } .addpage { height: 50px; font-size: 28px; } } } .contenttable { margin-top: 50px; height: 900px; padding: 0; overflow-y: auto; .gantt-container { width: 100%; height: 90%; .gantt_grid_head_cell { padding-left: 20px; text-align: left !important; border-bottom: 0; font-size: 28px !important; font-weight: 500; color: #999999 !important; } } } } .a-modaldemo { .a-modal { :deep(.ant-select-selection-item) { height: 50px; line-height: 50px; } :deep(.ant-form-item) { font-size: 28px !important; } :deep(.ant-select-selector) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-form-item-label >label) { height: 50px; font-size: 28px !important; line-height: 28px; } :deep(.ant-input) { height: 50px; font-size: 28px; } } } .contenttable { height: 1000px; font-size: 28px; overflow-y: auto; :deep(.ant-table-content) { font-size: 28px; width: 100%; // background-color: #004696; } :deep(.ant-table-pagination) { font-size: 28px; } :deep(.ant-select-selector) { font-size: 28px; } } } @media screen and (min-width: 1921px) and (max-width: 2560px) { html { font-size: 17px; } .content { .contentform { height: 400px; font-size: 17px; .contentformtop { margin-left: 17px; .toptext { font-size: 17px; } } .contentform-class { .classitem { height: 50px; font-size: 17px !important; line-height: 45px; } height: 50px; :deep(.ant-select-selection-item) { height: 45px; font-size: 17px !important; line-height: 45px; } :deep(.ant-select-selector) { height: 45px; font-size: 17px !important; line-height: 17px; } :deep(.ant-form-item) { font-size: 17px !important; } :deep(.ant-picker-input >input) { font-size: 17px !important; height: 40px; } :deep(.ant-form-item-label >label) { height: 45px; font-size: 17px !important; line-height: 17px; } :deep(.ant-input) { height: 45px; font-size: 17px; } } .ExportExcel { height: 45px; font-size: 17px; } .addpage { height: 45px; font-size: 17px; } } .contenttop { margin-top: 45px; .ddmx { font-size: 17px; } .titleright { // width: 30%; height: 45px; display: flex; position: absolute; right: 10px; .ExportExcel { height: 45px; font-size: 17px; } .addpage { height: 45px; font-size: 17px; } } } } .a-modaldemo { .a-modal { :deep(.ant-form-item) { font-size: 17px !important; } :deep(.ant-select-selector) { height: 45px; font-size: 17px !important; line-height: 17px; } :deep(.ant-form-item-label >label) { height: 45px; font-size: 17px !important; line-height: 17px; } :deep(.ant-input) { height: 45px; font-size: 17px; } } } .contenttable { height: 1000px; font-size: 17px; overflow-y: auto; :deep(.ant-table-content) { font-size: 17px; width: 100%; // background-color: #004696; } :deep(.ant-table-pagination) { font-size: 17px; } :deep(.ant-select-selector) { font-size: 17px; } } } @media screen and (min-width: 1402px) and (max-width: 1920px) { html { font-size: 16px; } } @media screen and (min-width: 992px) and (max-width: 1401px) { html { font-size: 12px; } } ::v-deep .ant-table-tbody tr:nth-child(2n) { background-color: #fafafa !important; } /* 表头加粗和背景颜色 */ ::v-deep .ant-table-content .ant-table-thead .ant-table-cell { font-weight: 550; background-color: #f4f7fd; }