|
|
@@ -2,10 +2,26 @@
|
|
|
<div class="mod-home">
|
|
|
<el-row :span="24" class="sample-bg">
|
|
|
<el-col :span="6" class="bg1-1">
|
|
|
- <el-row :span="24" class="bg1-1-1"></el-row>
|
|
|
- <el-row :span="24" class="bg1-1-2"></el-row>
|
|
|
- <el-row :span="24" class="bg1-1-1"></el-row>
|
|
|
- <el-row :span="24" class="bg1-1-2"></el-row>
|
|
|
+ <el-row :span="24" class="bg1-1-1">
|
|
|
+ <div class="box-company-title">
|
|
|
+ <div class="company-title">东齐公司大数据看板</div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <el-row :span="24" class="bg1-1-2">
|
|
|
+ <div class="box-custom-number">
|
|
|
+ <div class="custom-number">客户数：10</div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <el-row :span="24" class="bg1-1-1">
|
|
|
+ <div class="box-contract-number">
|
|
|
+ <div class="contract-number">合同数：10</div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ <el-row :span="24" class="bg1-1-2">
|
|
|
+ <div class="box-contract-amount">
|
|
|
+ <div class="contract-amount">合同总金额：10</div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
</el-col>
|
|
|
<el-col :span="12" class="bg1-2"></el-col>
|
|
|
<el-col :span="6" class="bg1-3"></el-col>
|
|
|
@@ -74,13 +90,72 @@ body,
|
|
|
}
|
|
|
|
|
|
.bg1-1-1 {
|
|
|
- background-color: forestgreen;
|
|
|
height: 25%;
|
|
|
+ padding: 10px;
|
|
|
+ border: 1px solid black;
|
|
|
}
|
|
|
|
|
|
.bg1-1-2 {
|
|
|
- background-color:blue;
|
|
|
height: 25%;
|
|
|
+ padding: 10px;
|
|
|
+ border: 1px solid black;
|
|
|
+}
|
|
|
+
|
|
|
+.box-company-title {
|
|
|
+ background-color: forestgreen;
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.company-title {
|
|
|
+ font-size: 20px;
|
|
|
+ color: aliceblue;
|
|
|
+ margin: 0 auto;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.box-custom-number {
|
|
|
+ background-color: forestgreen;
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.custom-number {
|
|
|
+ font-size: 20px;
|
|
|
+ color: aliceblue;
|
|
|
+ margin: 0 auto;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
}
|
|
|
+
|
|
|
+.box-contract-number {
|
|
|
+ background-color: forestgreen;
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.contract-number {
|
|
|
+ font-size: 20px;
|
|
|
+ color: aliceblue;
|
|
|
+ margin: 0 auto;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.box-contract-amount {
|
|
|
+ background-color: forestgreen;
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.contract-amount {
|
|
|
+ font-size: 20px;
|
|
|
+ color: aliceblue;
|
|
|
+ margin: 0 auto;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
</style>
|
|
|
|
