资金看板

This commit is contained in:
2025-08-21 17:34:02 +08:00
parent b4a023570f
commit 48a30fd508
3 changed files with 33 additions and 9 deletions

View File

@ -5,7 +5,7 @@ VITE_APP_TITLE = 煤科建管平台
VITE_APP_ENV = 'development' VITE_APP_ENV = 'development'
# 开发环境 # 开发环境
VITE_APP_BASE_API = 'http://192.168.110.213:8899' VITE_APP_BASE_API = 'http://192.168.110.180:8899'
# 无人机接口地址 # 无人机接口地址

View File

@ -72,7 +72,7 @@ const percentageClass = computed(() => {
.progress_component { .progress_component {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin-bottom: 10px;
:deep(.el-progress-bar__outer) { :deep(.el-progress-bar__outer) {
background-color: transparent; background-color: transparent;
} }

View File

@ -2,22 +2,45 @@
<div class="leftPage"> <div class="leftPage">
<!-- --> <!-- -->
<div class="kpi_box"> <div class="kpi_box">
<TitleComponent :title="'支付KPI'"/> <TitleComponent :title="'支付KPI'" style="margin-bottom: 20px;"/>
<div style="height: 100px;"></div>
<ProgressComponent <ProgressComponent
title="营业收入" title="应收账款"
value="123,456.78" value="123,456.78"
percentageChange="+25.30%" percentageChange="+25.30%"
progressPercentage="75" progressPercentage="75"
progressColor="rgba(255, 77, 79, 1)"
/>
<ProgressComponent
title="应付账款"
value="123,456.78"
percentageChange="+25.30%"
progressPercentage="25"
progressColor="rgba(29, 214, 255, 1)"
/>
<ProgressComponent
title="本月付款"
value="123,456.78"
percentageChange="+25.30%"
progressPercentage="45"
progressColor="rgba(0, 227, 150, 1)" progressColor="rgba(0, 227, 150, 1)"
/> />
<ProgressComponent
title="本月收款"
value="123,456.78"
percentageChange="+25.30%"
progressPercentage="10"
progressColor="rgba(255, 147, 42, 1)"
/>
</div> </div>
<div class="contract_box">
</div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue'; import { ref, reactive, onMounted, computed, toRefs, getCurrentInstance, nextTick } from 'vue';
import echarts from 'echarts';
import TitleComponent from './TitleComponent.vue'; import TitleComponent from './TitleComponent.vue';
import ProgressComponent from './ProgressComponent.vue'; import ProgressComponent from './ProgressComponent.vue';
</script> </script>
@ -26,12 +49,13 @@ import ProgressComponent from './ProgressComponent.vue';
.leftPage { .leftPage {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #0c1e35; .kpi_box{
margin-bottom: 10px;
.kpi_box { }
.kpi_box,.contract_box {
padding: 10px; padding: 10px;
box-sizing: border-box; box-sizing: border-box;
border: 1px solid rgba(29, 214, 255, 0.3);
} }
} }
</style> </style>