Skip to content

F
factory_front
Commit 05565f21 by qinjianhui
Options

fix: 样式修改

parent ce37c11e
Showing with 31 additions and 62 deletions
src/views/Dashboard.vue
<template>
<div class="dashboard-wrapper">
<div class="card-wrapper">
<div class="dashboard-title">核心数据看板</div>
<el-row class="card-container" :gutter="20">
<el-col :span="6">
<div class="card-container-wrapper">
<div class="card-container">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">今日新单（件/单）</div>
......@@ -25,8 +26,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">今日接单（件/单）</div>
......@@ -49,8 +48,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">未发货订单（单）</div>
......@@ -69,8 +66,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">超时未发订单（单）</div>
......@@ -89,10 +84,8 @@
</div>
</div>
</div>
</el-col>
</el-row>
<el-row class="card-container" :gutter="20">
<el-col :span="6">
</div>
<div class="card-container" :gutter="20">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">昨日发货数（单）</div>
......@@ -136,8 +129,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">24h发货率</div>
......@@ -165,8 +156,8 @@
>
<div class="text-red">
{{
(statisticData?.compareLastDayShipmentRateOf24Hour ?? '-') +
'%'
(statisticData?.compareLastDayShipmentRateOf24Hour ??
'-') + '%'
}}
</div>
<div class="up-icon"></div>
......@@ -184,8 +175,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">48h发货率</div>
......@@ -213,8 +202,8 @@
>
<div class="text-red">
{{
(statisticData?.compareLastDayShipmentRateOf48Hour ?? '-') +
'%'
(statisticData?.compareLastDayShipmentRateOf48Hour ??
'-') + '%'
}}
</div>
<div class="up-icon"></div>
......@@ -232,8 +221,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">发货超时率</div>
......@@ -266,8 +253,8 @@
>
<div class="text-red">
{{
(statisticData?.compareLastDayOverTimeShipmentRate ?? '-') +
'%'
(statisticData?.compareLastDayOverTimeShipmentRate ??
'-') + '%'
}}
</div>
<div class="up-icon"></div>
......@@ -285,10 +272,8 @@
</div>
</div>
</div>
</el-col>
</el-row>
<el-row class="card-container" :gutter="20">
<el-col :span="6">
</div>
<div class="card-container">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">待创建物流（单）</div>
......@@ -307,8 +292,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">待排单（单）</div>
......@@ -327,8 +310,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">生产中（单）</div>
......@@ -347,8 +328,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">待发货（单）</div>
......@@ -367,8 +346,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">拦截申请（单）</div>
......@@ -387,8 +364,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">异常单（单）</div>
......@@ -407,10 +382,8 @@
</div>
</div>
</div>
</el-col>
</el-row>
<el-row class="card-container" :gutter="20">
<el-col :span="6">
</div>
<div class="card-container">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货中订单（单）</div>
......@@ -429,8 +402,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货&lt;24h单（单）</div>
......@@ -449,8 +420,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货&lt;48h单（单）</div>
......@@ -469,8 +438,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货≥48h单（单）</div>
......@@ -489,8 +456,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货库存SKU数</div>
......@@ -509,8 +474,6 @@
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="card-item">
<div class="card-item-header">
<div class="card-title">缺货总件数</div>
......@@ -529,8 +492,9 @@
</div>
</div>
</div>
</el-col>
</el-row>
</div>
</div>
</div>
<div class="chart-wrapper" style="width: 100%">
<el-radio-group
v-model="chartTimes1"
......@@ -1129,22 +1093,27 @@ onBeforeUnmount(() => {
</script>
<style lang="scss" scoped>
.dashboard-title {
font-size: 22px;
font-size: 20px;
font-weight: 600;
color: #333;
margin: 0px 0 10px 20px;
padding: 10px 20px;
}
.card-wrapper {
background-color: #fff;
}
.card-container-wrapper {
padding: 0 20px 20px;
}
.card-container {
padding: 15px 0 0 10px;
width: 100%;
margin-bottom: 10px;
background-color: #fff;
border-radius: 5px;
box-sizing: border-box;
:deep(.el-col) {
margin-bottom: 15px;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
&:not(:last-child) {
margin-bottom: 20px;
}
.card-item {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment