内外作业进度样式修改

src/styles/schedule/write.scss

@@ -1,59 +0,0 @@
-.hc-layout-box {
-    display: flex;
-    position: relative;
-    height: 100%;
-    .hc-layout-left-box {
-        width: 382px;
-        position: relative;
-        background: #f1f5f8;
-        border-radius: 10px;
-        box-shadow: -2px 0 10px 0 rgba(32, 37, 50, 0.03), 0 10px 21px 20px rgba(32, 37, 50, 0.03);
-        .horizontal-drag-line {
-            position: absolute;
-            right: 0;
-            top: 0;
-            width: 4px;
-            height: 100%;
-            user-select: none;
-            cursor: col-resize;
-            background-color: #00000000;
-        }
-        .hc-project-box {
-            position: relative;
-            padding: 15px 24px;
-            display: flex;
-            align-items: flex-start;
-            border-bottom: 1px solid #E9E9E9;
-            .hc-project-icon-box {
-                font-size: 30px;
-                color: var(--el-color-primary);
-            }
-            .project-name-box {
-                flex: auto;
-                position: relative;
-                overflow: hidden;
-                .project-alias {
-                    color: var(--el-color-primary);
-                }
-                .project-name {
-                    margin-top: 6px;
-                    color: #838791;
-                }
-            }
-        }
-        .hc-tree-box {
-            position: relative;
-            padding: 15px 20px;
-            height: calc(100% - 80px);
-        }
-    }
-    .hc-chart-content-box {
-        flex: 1;
-        position: relative;
-        margin-left: 24px;
-        background: #f1f5f8;
-        border-radius: 10px;
-        padding-top: 24px;
-        box-shadow: -2px 0 10px 0 rgba(32, 37, 50, 0.03), 0 10px 21px 20px rgba(32, 37, 50, 0.03);
-    }
-}

src/views/schedule/write.vue

@@ -1,27 +1,13 @@
 <template>
-    <div class="hc-layout-box">
-        <div :style="`width:${leftWidth}px;`" class="hc-layout-left-box bg-white">
-            <div class="hc-project-box">
-                <div class="hc-project-icon-box">
-                    <HcIcon name="stack" />
-                </div>
-                <div class="project-name-box ml-2">
-                    <span class="project-alias">{{ projectInfo.projectName }}</span>
-                </div>
-            </div>
-            <div class="hc-tree-box">
-                <el-scrollbar>
-                    <HcLazyTree :auto-expand-keys="treeAutoExpandKeys" is-type @load="treeLoadNode" @node-tap="wbsElTreeClick" />
-                    <!-- WbsTree :autoExpandKeys="treeAutoExpandKeys" :classifyType="classifyType" :contractId="contractId"
-                             :projectId="projectId" @nodeTap="wbsElTreeClick"/ -->
-                </el-scrollbar>
-            </div>
-            <!-- 左右拖动 -->
-            <div class="horizontal-drag-line" @mousedown="onmousedown" />
-        </div>
-        <div v-loading="isLoading" class="hc-chart-content-box">
-            <BarChart ref="barChartRef" :datas="barChartDatas" />
-        </div>
+    <div class="write-page-box">
+        <hc-page-split :project-nmae="projectInfo.projectName">
+            <template #tree>
+                <HcLazyTree :auto-expand-keys="treeAutoExpandKeys" is-type @load="treeLoadNode" @node-tap="wbsElTreeClick" />
+            </template>
+            <hc-card v-loading="isLoading">
+                <BarChart ref="barChartRef" :datas="barChartDatas" />
+            </hc-card>
+        </hc-page-split>
     </div>
 </template>
 
@@ -130,5 +116,7 @@ const onmousedown = () => {
 </script>
 
 <style lang="scss" scoped>
-@import '../../styles/schedule/write.scss';
+.write-page-box{
+    height: 100%;
+}
 </style>