Blame view

src/components/geomagnetism.vue 2.31 KB
54dab3c6   liuqimichale   导入公用css
1
  <template>
c793b6c7   liuqimichale   地磁故障
2
    <div class="">
d1443fcf   liuqimichale   getUrlKey
3
4
      <ul class="dici-wrap" v-if="queryGeoFaultList != undefined && queryGeoFaultList.length > 0">
        <li v-for="(item, index) in queryGeoFaultList" :key="index" >
e47fb2bc   liuqimichale   地磁故障api
5
6
          <p class="parkName">{{item.plName}}</p>
          <ul class="diciList" v-for="(list, i) in item.eqpDTOs" :key="i">
c793b6c7   liuqimichale   地磁故障
7
            <li>
e47fb2bc   liuqimichale   地磁故障api
8
              编号 :{{list.eqpNo}}
c793b6c7   liuqimichale   地磁故障
9
10
            </li>
            <li>
e47fb2bc   liuqimichale   地磁故障api
11
              故障时间 :{{list.modifyTime | dataFilter}}
c793b6c7   liuqimichale   地磁故障
12
13
            </li>
          </ul>
c793b6c7   liuqimichale   地磁故障
14
        </li>
c793b6c7   liuqimichale   地磁故障
15
      </ul>
d1443fcf   liuqimichale   getUrlKey
16
      <div v-else class="noData">暂无数据</div>
54dab3c6   liuqimichale   导入公用css
17
18
19
20
    </div>
  </template>
  
  <script>
497e575d   liuqimichale   诱导屏故障
21
  import { diciAddress } from '../utils/api'
54dab3c6   liuqimichale   导入公用css
22
23
  export default {
    name: 'geomagnetism',
c793b6c7   liuqimichale   地磁故障
24
    data() {
e47fb2bc   liuqimichale   地磁故障api
25
      return {
82af1dd4   liuqimichale   new Date
26
27
        modifyTimeBegin: new Date(decodeURIComponent(this.getUrlKey("modifyTimeBegin"))),
        modifyTimeEnd:  new Date(decodeURIComponent(this.getUrlKey("modifyTimeEnd"))),
e47fb2bc   liuqimichale   地磁故障api
28
29
        queryGeoFaultList: []
      }
c793b6c7   liuqimichale   地磁故障
30
31
32
    },
    created() {
      document.title = '地磁故障'
82af1dd4   liuqimichale   new Date
33
34
      console.log(this.modifyTimeBegin)
      console.log(this.modifyTimeEnd)
497e575d   liuqimichale   诱导屏故障
35
      diciAddress({
e47fb2bc   liuqimichale   地磁故障api
36
37
        modifyTimeBegin:this.modifyTimeBegin,
        modifyTimeEnd: this.modifyTimeEnd,
497e575d   liuqimichale   诱导屏故障
38
39
        orgId: 10003,
        sysCode:'1001',
6c4a55b8   liuqimichale   条数限制
40
41
42
43
        baseRequest: {
          "pageNum": 1,
          "pageSize": 500
        },
497e575d   liuqimichale   诱导屏故障
44
45
      })
      .then((res) => {
e47fb2bc   liuqimichale   地磁故障api
46
        console.log(res.data.data)
d1443fcf   liuqimichale   getUrlKey
47
48
49
50
51
52
53
        if(res.data.code === '8888'){
          const queryGeoFaultList = res.data.data
          this.queryGeoFaultList = queryGeoFaultList
        }else{
          alert('服务器出错了')
        }
  
497e575d   liuqimichale   诱导屏故障
54
55
56
57
      })
      .catch((res) => {
        console.log(res)
      })
54dab3c6   liuqimichale   导入公用css
58
59
60
61
62
63
    }
  }
  </script>
  
  <!-- Add "scoped" attribute to limit CSS to this component only -->
  <style scoped lang="scss">
c793b6c7   liuqimichale   地磁故障
64
65
66
67
68
    .dici-wrap > li {
      background-color: $whiteBg;
      margin-bottom: 12px;
      padding: 15px 15px;
    }
54dab3c6   liuqimichale   导入公用css
69
  
c793b6c7   liuqimichale   地磁故障
70
71
    .parkName {
      font-size: 1.8rem;
497e575d   liuqimichale   诱导屏故障
72
      font-weight: 700;
c793b6c7   liuqimichale   地磁故障
73
74
75
76
77
78
79
80
81
82
      padding-left: 2.5rem;
      background: url("../assets/images/parkName.png") no-repeat 0 center;
      background-size: 1.8rem 1.8rem;
    }
    .diciList{
      background-color: #fafafa;
      border-radius: 4px;
      padding: 0 15px;
      margin-top: 12px;
      >li{
497e575d   liuqimichale   诱导屏故障
83
84
        height: 3.8rem;
        line-height: 3.8rem;
c793b6c7   liuqimichale   地磁故障
85
86
87
88
89
90
91
        position: relative;
        &:first-child:after{
         @include border-1px(#D9D9D9, bottom)
          opacity: .5;
        }
      }
    }
d1443fcf   liuqimichale   getUrlKey
92
93
94
95
    .noData{
      padding-top: 20px;
      text-align: center;
    }
54dab3c6   liuqimichale   导入公用css
96
  </style>