title组件、progress组件

src/views/largeScreen/components/leftPage.vue

@@ -1,13 +1,37 @@
 <template>
-  <div class="leftPage">左边</div>
+  <div class="leftPage">
+    <!--  -->
+    <div class="kpi_box">
+      <TitleComponent :title="'支付KPI'"/>
+      <div style="height: 100px;"></div>
+      <ProgressComponent 
+        title="营业收入" 
+        value="123,456.78" 
+        percentageChange="+25.30%" 
+        progressPercentage="75" 
+        progressColor="rgba(0, 227, 150, 1)"
+      />
+    </div>
+
+  </div>
 </template>
 
-<script setup lang="ts"></script>
+<script setup>
+import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue';
+import TitleComponent  from './TitleComponent.vue';
+import ProgressComponent from './ProgressComponent.vue';
+</script>
 
-<style scoped lang="scss">
+<style lang="scss">
 .leftPage {
   width: 100%;
   height: 100%;
   background: #0c1e35;
+
+  .kpi_box {
+    padding: 10px;
+    box-sizing: border-box;
+  }
+
 }
 </style>