BJ_web_developers / dyitoc

Commit 9ce9cfeace70be5e44db3feb2faaf3ffe1396550

Authored by liuqimichale
1 parent 9598d2c1

进出场

Inline Side-by-side
Showing 3 changed files with 91 additions and 3 deletions
src/assets/img/sectionbig.svg 0 → 100644
  View file @9ce9cfe
  1 +<?xml version="1.0" encoding="utf-8"?>
  2 +<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
  3 +<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
  4 + viewBox="-340 -89.7 653.5 219.7" style="enable-background:new -340 -89.7 653.5 219.7;" xml:space="preserve">
  5 +<style type="text/css">
  6 + .st0{fill:none;stroke:#2391FA;stroke-miterlimit:10;}
  7 + .st1{opacity:0.8;fill:#2391FA;enable-background:new ;}
  8 + .st2{fill:#2391FA;}
  9 + .st3{display:none;opacity:0.2;fill:url(#XMLID_4_);enable-background:new ;}
  10 + .st4{display:none;opacity:0.2;fill:url(#XMLID_5_);enable-background:new ;}
  11 +</style>
  12 +<path id="XMLID_11_" class="st0" d="M-339.5-89.2H297l16,16V114l-15.8,15.5h-620.7l-16-15.1V-89.2z"/>
  13 +<path id="XMLID_2_" class="st1" d="M312.5,117.5v3l-9,9h-3L312.5,117.5z"/>
  14 +<path id="XMLID_1_" class="st2" d="M310.5-86.8h-8l8,8"/>
  15 +<linearGradient id="XMLID_4_" gradientUnits="userSpaceOnUse" x1="-338.9" y1="114.4" x2="-31.5667" y2="114.4" gradientTransform="matrix(1 0 0 -1 0 40.6)">
  16 + <stop offset="0" style="stop-color:#3E9AF1"/>
  17 + <stop offset="0.6139" style="stop-color:#3E9AF1;stop-opacity:0.2862"/>
  18 + <stop offset="1" style="stop-color:#3E9AF1;stop-opacity:0"/>
  19 +</linearGradient>
  20 +<path id="XMLID_7_" class="st3" d="M-338.9-88.8h303v30h-303V-88.8z"/>
  21 +<path id="XMLID_9_" class="st2" d="M-338.9-89.2h4v4h-4C-338.9-85.2-338.9-89.2-338.9-89.2z"/>
  22 +<linearGradient id="XMLID_5_" gradientUnits="userSpaceOnUse" x1="-13.5" y1="115.3" x2="293.8333" y2="115.3" gradientTransform="matrix(1 0 0 -1 0 40.6)">
  23 + <stop offset="0" style="stop-color:#3E9AF1"/>
  24 + <stop offset="0.6139" style="stop-color:#3E9AF1;stop-opacity:0.2862"/>
  25 + <stop offset="1" style="stop-color:#3E9AF1;stop-opacity:0"/>
  26 +</linearGradient>
  27 +<path id="XMLID_39_" class="st4" d="M-13.5-89.7h303v30h-303V-89.7z"/>
  28 +</svg>
... ...
src/views/mainContainer.vue
  View file @9ce9cfe
... ... @@ -8,7 +8,10 @@
8 8 </li>
9 9 <li class="margin0-12">
10 10 <div class="heightper-top"></div>
11   - <div class="heightper-bottom"></div>
  11 + <div class="heightper-bottom">
  12 + <outsection style="width: 50%;float: left"></outsection>
  13 + <outsection style="width: 50%;float: left"></outsection>
  14 + </div>
12 15 </li>
13 16 <li>
14 17 <sfysection class="sectionsmall"></sfysection>
... ... @@ -28,6 +31,8 @@ import youdaopingsection from &#39;../views/youdaopingsection&#39;
28 31 import sfysection from '../views/sfysection'
29 32 import berthsection from '../views/berthsection'
30 33 import newssection from '../views/newssection'
  34 +import outsection from '../views/outsection'
  35 +
31 36  
32 37 export default {
33 38 name: 'mainContainer',
... ... @@ -38,7 +43,8 @@ export default {
38 43 youdaopingsection,
39 44 sfysection,
40 45 berthsection,
41   - newssection
  46 + newssection,
  47 + outsection
42 48 },
43 49 data() {
44 50 return {
... ... @@ -88,8 +94,9 @@ export default {
88 94  
89 95 .heightper-bottom {
90 96 height: calc((100% - 24px) / 3);
91   - background: #f00;
92 97 margin-top: 12px;
  98 + background: url("../assets/img/sectionsmall.png") no-repeat;
  99 + background-size: 100% 100%;
93 100 }
94 101  
95 102 .containerwrap > li:nth-of-type(3) {
... ...
src/views/outsection.vue 0 → 100644
  View file @9ce9cfe
  1 +<template>
  2 + <div>
  3 + <titlesection title="周出场统计"></titlesection>
  4 + <ul class="flexfm ydp-dz-wrap">
  5 +
  6 + </ul>
  7 + </div>
  8 +</template>
  9 +
  10 +<script>
  11 +import titlesection from '../components/titlesection'
  12 +import {fetchList} from '../api/api'
  13 +
  14 +const lineChartData = {
  15 + newVisitis: {
  16 + yData: [100, 120, 161],
  17 + xData: ['正常', '异常', '故障']
  18 + }
  19 +}
  20 +
  21 +
  22 +export default {
  23 + name: 'outsection',
  24 + components: {
  25 + titlesection
  26 + },
  27 + data() {
  28 + return {
  29 + lineChartData: lineChartData.newVisitis,
  30 + dzNum: '23454',
  31 + ydpNum: '4454'
  32 + }
  33 + },
  34 + created() {
  35 + },
  36 + methods: {
  37 + getList() {
  38 + fetchList()
  39 + .then(res => {
  40 + console.log(res);
  41 +
  42 + });
  43 + },
  44 + }
  45 +}
  46 +</script>
  47 +
  48 +<style lang="scss" scoped>
  49 + .ydp-dz-wrap{
  50 + display: flex;
  51 +
  52 + }
  53 +</style>
... ...