|
@@ -5,16 +5,27 @@
|
|
|
<div class="w_1200">
|
|
|
<el-col :span="24" class="dataShow">
|
|
|
<el-col :span="24" class="top">
|
|
|
- 统计监测
|
|
|
+ <span></span>
|
|
|
</el-col>
|
|
|
- <el-col :span="8" class="user">
|
|
|
- <users></users>
|
|
|
+ <el-col :span="24" class="dataShowInfo">
|
|
|
+ <el-col :span="8" class="left">
|
|
|
+ <el-col :span="1" class="leftTit">
|
|
|
+ <p>数据展示</p>
|
|
|
+ <p></p>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="23" class="leftInfo">
|
|
|
+ <userTwo></userTwo>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="center">
|
|
|
+ 中间
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" class="right">
|
|
|
+ 右侧
|
|
|
+ </el-col>
|
|
|
</el-col>
|
|
|
- <el-col :span="8" class="city">
|
|
|
- <maps></maps>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8" class="data">
|
|
|
- 正在洽谈,达成意向,交易成功
|
|
|
+ <el-col :span="24" class="top down">
|
|
|
+ <span></span>
|
|
|
</el-col>
|
|
|
</el-col>
|
|
|
<el-col :span="24" class="dealShow">
|
|
@@ -32,13 +43,14 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import users from './parts/user.vue';
|
|
|
+import userTwo from './parts/userTwo.vue';
|
|
|
import pie from './parts/down-pie.vue';
|
|
|
import maps from './parts/map.vue';
|
|
|
export default {
|
|
|
name: 'index',
|
|
|
props: {},
|
|
|
- components: { users, pie, maps },
|
|
|
+ // userTwo, maps,
|
|
|
+ components: { userTwo, pie },
|
|
|
data: () => ({}),
|
|
|
created() {},
|
|
|
computed: {},
|
|
@@ -54,26 +66,71 @@ export default {
|
|
|
.main {
|
|
|
float: left;
|
|
|
width: 100%;
|
|
|
- margin: 20px 0;
|
|
|
+ margin: 40px 0;
|
|
|
min-height: 600px;
|
|
|
}
|
|
|
.dataShow {
|
|
|
float: left;
|
|
|
width: 100%;
|
|
|
- height: 500px;
|
|
|
+ height: 709px;
|
|
|
overflow: hidden;
|
|
|
margin: 0 0 30px 0;
|
|
|
- border: 1px solid red;
|
|
|
}
|
|
|
.dataShow .top {
|
|
|
float: left;
|
|
|
width: 100%;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
+ height: 1px;
|
|
|
+}
|
|
|
+.dataShow .top span {
|
|
|
+ float: right;
|
|
|
+ width: 30%;
|
|
|
+ height: 1px;
|
|
|
+ background: #9cb9cb;
|
|
|
+}
|
|
|
+.dataShow .down span {
|
|
|
+ float: left;
|
|
|
+ width: 30%;
|
|
|
+ height: 1px;
|
|
|
+ background: #9cb9cb;
|
|
|
+}
|
|
|
+.dataShow .dataShowInfo {
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ height: 707px;
|
|
|
+}
|
|
|
+.dataShow .dataShowInfo .left {
|
|
|
+ float: left;
|
|
|
+ width: 30%;
|
|
|
+ height: 707px;
|
|
|
+ border: 1px solid red;
|
|
|
+}
|
|
|
+.dataShow .dataShowInfo .left p:first-child {
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ height: 100px;
|
|
|
font-size: 18px;
|
|
|
- padding: 0 15px;
|
|
|
- font-weight: bold;
|
|
|
+ color: red;
|
|
|
}
|
|
|
+.dataShow .dataShowInfo .left p:last-child {
|
|
|
+ float: left;
|
|
|
+ width: 2px;
|
|
|
+ height: 606px;
|
|
|
+ background: red;
|
|
|
+ margin: 0;
|
|
|
+ position: relative;
|
|
|
+ left: 5px;
|
|
|
+}
|
|
|
+.dataShow .dataShowInfo .center {
|
|
|
+ float: left;
|
|
|
+ width: 30%;
|
|
|
+ height: 707px;
|
|
|
+}
|
|
|
+.dataShow .dataShowInfo .right {
|
|
|
+ float: left;
|
|
|
+ width: 30%;
|
|
|
+ height: 707px;
|
|
|
+}
|
|
|
+
|
|
|
.dataShow .user {
|
|
|
width: 32%;
|
|
|
height: 460px;
|