td_official/src/views/largeScreen/components/leftPage.vue

<template>
  <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>
import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue';
import TitleComponent  from './TitleComponent.vue';
import ProgressComponent from './ProgressComponent.vue';
</script>

<style lang="scss">
.leftPage {
  width: 100%;
  height: 100%;
  background: #0c1e35;

  .kpi_box {
    padding: 10px;
    box-sizing: border-box;
  }

}
</style>