zhangkunling hace 3 años
padre
commit
3a68c1f844

+ 1 - 8
src/assets/styles/common.css

@@ -47,7 +47,7 @@ html,body{
   border: 1px solid #5774A3;
   border-radius: 5px;
   color: #83A4D9;
-  font-size: 12px;
+  /* font-size: 12px; */
 }
 .common-modal .ivu-btn-default:hover {
   background-color: #1A4385;
@@ -298,7 +298,6 @@ html,body{
  }
  .common-table .ivu-table-stripe-even td{
   background-color: #081C43;
-  
  }
  .common-table .ivu-table-stripe-odd td{
   background-color: #072453;
@@ -307,14 +306,8 @@ html,body{
  /* .ivu-table-tip {
   min-height: 300px;
 } */
-.ivu-table-tip table {
-  display: none;
-}
 .ivu-spin-fix {
   background-color: #06214d;
-  /* background-color: yellow; */
-  /* height: auto; */
-  /* min-height: 580px; */
  }
  .ivu-spin-fix .ivu-spin-main {
    width: 100%;

+ 96 - 61
src/components/common/RollingDetailTable.vue

@@ -1,10 +1,9 @@
 <template>
   <div class="rolling-loading">
-    <Table ref="table" no-data-text="" :row-class-name="rowClassName" :loading="loading" class="table" :columns="columns1" :data="detailTabData" @on-sort-change="changeSort">
-       <template slot="loading">
-        <Loading-animation></Loading-animation>
-      </template>
-    </Table>
+    <div class="common-modal-loading" v-show="loading">
+      <loading-animation></loading-animation>
+    </div>
+    <Table ref="table" v-show="!loading" class="table" :columns="columns1" :data="detailTabData" @on-sort-change="changeSort" :row-class-name="rowClassName"></Table>
     <!-- <Table ref="table" v-show="!loading" class="table" :columns="columns1" :data="detailTabData" @on-sort-change="changeSort" :row-class-name="rowClassName"></Table> -->
   </div>
 </template>
@@ -30,7 +29,7 @@ export default {
   },
   data() {
     return {
-      loading: true,
+      loading: false,
       detailTabData: [],
       detailParams: {},
       curPage: 1,
@@ -82,10 +81,16 @@ export default {
       this.getDetailData().then(res => {
         this.loading = false
         if (res.httpCode == 1) {
-          // res.data.data.count 真分页 res.data.data.dateCount 假分页 this.detailDataCount 真分页后端不返回数据总数
-          this.detailTotal = Number(res.data.count) || this.detailDataCount || Number(res.data.dateCount);
-          // res.data.data.data 有分页 // res.data.data 无分页
-          this.detailTabData = res.data.data;
+          if (res.data.data && res.data.data.length==0) {
+            this.detailTotal = 0
+          } else {
+            this.detailTabData = res.data.data
+            this.detailTotal = Number(res.data.count)
+            if (!this.detailTabData) {
+              this.detailTabData = res.data[1].value.data
+              this.detailTotal = res.data[1].value.count
+            }
+          }
           if (res.data.offset) {
             this.detailParams.index = res.data.offset
           }
@@ -132,8 +137,18 @@ export default {
         this.curPage++;
         this.getDetailData().then(res => {
           if (res.httpCode == 1) {
-            this.detailTabData = this.detailTabData.concat(res.data.data);
-            this.detailTotal = Number(res.data.count) || this.detailDataCount || Number(res.data.dateCount);
+            if (res.data.data && res.data.data.length==0) {
+              this.detailTotal = 0
+            } else {
+              this.detailTabData = this.detailTabData.concat(res.data.data)
+              this.detailTotal = Number(res.data.count)
+              if (!this.detailTabData) {
+                this.detailTabData = this.detailTabData.concat(res.data[1].value.data)
+                this.detailTotal = res.data[1].value.count
+              }
+            }
+            // this.detailTabData = this.detailTabData.concat(res.data.data);
+            // this.detailTotal = Number(res.data.count);
             if (res.data.data.offset) {
              this.detailParams.index = res.data.offset // 为假分页准备
             }
@@ -158,8 +173,16 @@ export default {
         this.curPage++;
         this.getDetailData().then(res => {
           if (res.httpCode == 1) {
-            this.detailTabData = this.detailTabData.concat(res.data.data);
-            this.detailTotal = Number(res.data.count) || this.detailDataCount || Number(res.data.dateCount);
+            if (res.data.data && res.data.data.length==0) {
+              this.detailTotal = 0
+            } else {
+              this.detailTabData = this.detailTabData.concat(res.data.data)
+              this.detailTotal = Number(res.data.count)
+              if (!this.detailTabData) {
+                this.detailTabData = this.detailTabData.concat(res.data[1].value.data)
+                this.detailTotal = res.data[1].value.count
+              }
+            }
             if (res.data.data.offset) {
              this.detailParams.index = res.data.offset // 为假分页准备
             }
@@ -187,66 +210,78 @@ export default {
 };
 </script>
 <style lang="stylus" scoped>
+>>> .common-modal-loading {
+ position: relative;
+}
+>>> .common-modal-loading .ivu-spin-fix { 
+  height: 100%;
+  background: none!important;
+}
 .rolling-loading {
     height: 100%;
     margin-top: 10px;
 }
   /*对话框表格样式*/
- >>> .ivu-table{
-  min-height: 180PX;
-  background-color: transparent;
-  position: relative;
-   height: 100%;
- }
- >>>  .ivu-table:before {
-  height: 0;
- }
- >>>  .ivu-table th {
-  background-color: #14316A;
-  color: #FFFFFF;
-  border-bottom: 1px solid #173B77;
- }
- >>>  .ivu-table td {
-  border-bottom: 1px solid #173B77;
-  color: #FFFFFF;
- }
- >>> .rolling-loading .ivu-table td {
-  background-color: transparent;
- }
- >>>  .ivu-table .ivu-table-cell {
-   padding-left: 10px;
-   padding-right: 10px;
- }
- >>>  .ivu-table-stripe-even td{
-  background-color: #081C43;
- }
+  >>> .table {
+      height: 100%;
+  }
+  >>> .ivu-table {
+      color: #fff;
+      background-color:transparent;
+      height: 100%;
+  }
+   >>> .ivu-table .ivu-table-cell {
+      padding: 0px 4PX;
+  }
+  >>> .ivu-table-header .ivu-table-cell {
+      font-weight: bold;
+  }
+  >>> .ivu-table th {
+   background-color: #0E2D6B;
+  }
+  >>> .ivu-table td{
+      border-bottom: none;
+      height: 48PX;
+      background-color: transparent;
+  }
+  >>> .ivu-table th {
+       border-bottom: none;
+       height: 48PX;
+  }
+  >>> .ivu-table:before{
+    background-color:transparent;
+  }
+  >>> .ivu-table:after{
+    background-color:transparent;
+  }
+  >>> .ivu-table-body td:last-child {
+      padding-right: 6PX;
+  }
  >>> .ivu-table-body {
-    max-height: 480PX;
-    overflow: hidden;
-    overflow-y: auto;
+   max-height: 479PX;
+   overflow: hidden;
+   overflow-y: auto;
  }
- >>>  .ivu-table-stripe-odd td{
-  background-color: #072453;
+ >>> .ivu-table-tbody {
+     height: 100%;
  }
+/*偶数行*/
+ >>> .ivu-table-stripe-even td{
+   background-color: #081C43 !important;
+ }
+ /*奇数行*/
+ >>> .ivu-table-stripe-odd td{
+   background-color: #072453 !important;
+ } 
  /*暂无数据*/
  >>> .ivu-table-tip {
+    // max-height: 435px;
     display: flex;
     align-items: center;
-    background: url('../../assets/images/noData.png') no-repeat center;
-    height: 100%;
-    min-height: 142PX;
+    // background: url('../../assets/images/noData.png') no-repeat center;
  }
  >>> .ivu-table-tip table {
-   display: none;
- }
-</style>
-<style lang="stylus">
-.rolling-loading .ivu-table th  {
-  height: 38PX !important;
-}
-.ivu-modal-wrap .rolling-loading .ivu-spin-fix {
-   top: 38PX !important;
-   min-height: 142PX;
-   height: calc(100% - 38PX);
+  //  display: none;
  }
+
 </style>

+ 1 - 0
src/main.js

@@ -19,6 +19,7 @@ import Common from './components/common' //自定义通用全局组件
 Vue.use(Common)
 Vue.config.productionTip = false
 Vue.use(ViewUI)
+
 new Vue({
   router,
   store,

+ 9 - 4
src/views/homecomponents/BasicInfomation/ApplicationEquip.vue

@@ -237,7 +237,8 @@ export default {
           if (this.currentStation == '' && i==0) {
             val.expand = true
           }
-          val.children.forEach ((lastVal,lastIndex) => {
+          if (val.children) {
+            val.children.forEach ((lastVal,lastIndex) => {
             lastVal.selected = false; //expand 是否展开直子节点 
             lastVal.disabled = false; 
             lastVal.expand = false;
@@ -250,7 +251,8 @@ export default {
               this.currentStaData.push(lastVal)
               this.showTree = true
             } 
-          })
+           })
+          }
         });
       });
     },
@@ -459,14 +461,17 @@ export default {
  >>> .common-table .ivu-table td {
   height: 54px;
  }
->>> .ivu-spin-fix {
+>>>  .common-table .ivu-spin-fix {
   top: 54px;
   height: calc(100vh - 350px);
 }
->>> .ivu-table-tip {
+>>>  .common-table .ivu-table-tip {
   background: url('../../../assets/images/noData.png') no-repeat center;
   height: calc(100vh - 350px);
 }
+>>> .common-table .ivu-table-tip table {
+ display: none;
+}
 .common-page {
   margin-top: 15px;
   display: flex;

+ 151 - 145
src/views/homecomponents/BasicInfomation/ApplicationStation.vue

@@ -3,7 +3,7 @@
     <div class="search-list">
       <div class="search-left">
         <Form class="common-form common-form-list" ref="tableParams" :model="tableParams" inline>
-          <FormItem label="" prop="level">
+          <!-- <FormItem label="" prop="level">
             <Select v-model="tableParams.level" placeholder="层级">
                 <Option v-for="item in levelData" :value="item.id" :key="item.id">{{ item.value }}</Option>
             </Select>
@@ -17,7 +17,7 @@
             <Select v-model="tableParams.stationId" placeholder="站点">
               <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
             </Select>
-          </FormItem>
+          </FormItem> -->
           <FormItem label="" prop="equipmentCheck">
              <Select v-model="tableParams.equipmentCheck" placeholder="接入设备">
                 <Option v-for="item in equipmentCheckData" :value="item.value" :key="item.value">{{ item.label }}</Option>
@@ -72,7 +72,7 @@
       :mask-closable="false"
       class-name="common-modal">
       <Form class="common-form" ref="formOption" :model="formOption" :rules="ruleValidate" :label-width="120">
-				<FormItem label="归属线路:" prop="lineId">
+				<!-- <FormItem label="归属线路:" prop="lineId">
           <Select v-model="formOption.lineId" placeholder="线路" @on-change="selectModalLine" label-in-value>
               <Option v-for="item in lineTypeData" :value="String(item.id)" :key="item.id">{{ item.lineName }}</Option>
           </Select>
@@ -81,7 +81,7 @@
            <Select v-model="formOption.stationId" placeholder="站点" @on-change="selectModalStation" label-in-value>
             <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
           </Select>
-        </FormItem>
+        </FormItem> -->
         <FormItem label="应用ID:">
           <span v-show="title=='新增应用'">系统自动生成,唯一不重复</span>
           <span v-show="title=='编辑应用'">{{formOption.appCode}}</span>
@@ -89,11 +89,11 @@
         <FormItem label="应用名称:" prop="appName">
           <Input v-model="formOption.appName" maxlength="100" show-word-limit />  
         </FormItem>
-        <FormItem label="层级:" prop="level">
+        <!-- <FormItem label="层级:" prop="level">
           <Select v-model="formOption.level" placeholder="层级" @on-change="selectModalLevel" label-in-value>
              <Option v-for="item in levelModalData" :value="String(item.id)" :key="item.id">{{ item.value }}</Option>
           </Select>
-        </FormItem>
+        </FormItem> -->
 			</Form>
       <div slot="footer">
           <Button @click="modalCancel">取消</Button>
@@ -131,7 +131,7 @@
       </Tabs>
         <div v-if="currentModalTabs =='基础信息'" class="modal-tabs-item">
           <div class="common-modal-content">
-            <div class="modal-content-item" :class="{'item-especial': item.name == '层级'}" v-for="(item,index) in detailLabel" :key="index">
+            <div class="modal-content-item" :class="{'item-especial': index == 1}" v-for="(item,index) in detailLabel" :key="index">
               <span class="modal-content-item-name">
               {{item.name}}
               </span>
@@ -150,7 +150,7 @@
   </div>
 </template>
 <script>
-const defaultFrom = {lineId: '',lineName: '',stationId: '',stationName: '',appName: '',level:''}
+const defaultFrom = {appName: '',level:''}
 export default {
   name: "ApplicationStation",
   components:{
@@ -169,9 +169,9 @@ export default {
       //   pageSize: 10
       // },
       tableParams: {
-        level: '',
-        lineId: '',
-        stationId: '',
+        // level: '',
+        // lineId: '',
+        // stationId: '',
         equipmentCheck: '',
         instrumentCheck: '',
         pageNum: 1,
@@ -180,9 +180,9 @@ export default {
       tableData: [],
       tableTotal: 0,
       rowObj: {},
-      levelData: [],
-      lineTypeData: [],
-      stationTypeData: [],
+      // levelData: [],
+      // lineTypeData: [],
+      // stationTypeData: [],
       equipmentCheckData: [
         {
           value: '-1',
@@ -220,25 +220,28 @@ export default {
           {
             title: '应用名称',
             key: 'appName',
-            align: 'center'
-          },
-          {
-            title: '层级',
-            key: 'levelDesc',
-            align: 'center'
-          },
-          {
-            title: '归属线路',
-            key: 'lineName',
-           align: 'center'
-          },
-          {
-            title: '归属站点',
-            key: 'stationName',
             align: 'center',
             ellipsis: true,
             tooltip: true
           },
+          // {
+          //   title: '层级',
+          //   key: 'levelDesc',
+          //   align: 'center',
+          //   width: 100,
+          // },
+          // {
+          //   title: '归属线路',
+          //   key: 'lineName',
+          //  align: 'center'
+          // },
+          // {
+          //   title: '归属站点',
+          //   key: 'stationName',
+          //   align: 'center',
+          //   ellipsis: true,
+          //   tooltip: true
+          // },
           {
             title: '接入设备数量',
             key: 'equipmentNum',
@@ -265,30 +268,30 @@ export default {
       activeColor: '#E92E2E',
       activeClass: '',
       modalTitle: '',
-      formOption: {lineId: '',lineName: '',stationId: '',stationName: '',appName: '',level:''},
+      formOption: {appName: '',level:''},
       ruleValidate: {
-        lineId: [{
-          required: true,
-          message: '请选择所属线路',
-          trigger: 'change'
-        }],
-        stationId: [{
-          required: true,
-          message: '请选择所属站点',
-          trigger: 'change'
-        }],
+        // lineId: [{
+        //   required: true,
+        //   message: '请选择所属线路',
+        //   trigger: 'change'
+        // }],
+        // stationId: [{
+        //   required: true,
+        //   message: '请选择所属站点',
+        //   trigger: 'change'
+        // }],
         appName: [{
           required: true,
           message: '请输入应用名称',
           trigger: 'blur'
         }],
-        level: [{
-          required: true,
-          message: '请选择层级',
-          trigger: 'change'
-        }]
+        // level: [{
+        //   required: true,
+        //   message: '请选择层级',
+        //   trigger: 'change'
+        // }]
       }, 
-      levelModalData: [],
+      // levelModalData: [],
       currentModalTabs:'基础信息',
       tabsModalData: [{label:'基础信息'},{label:'关联设备类型'}],
       detailLabel: [],
@@ -311,7 +314,7 @@ export default {
       ],
       // equipTableData: [],
       detailParams: {
-					applicationId: "",
+					applicationId: null,
 					pageNum: 1,
 					pageSize: 10
 			},
@@ -339,23 +342,23 @@ export default {
     },
     getType  () {
       //获取所属线路
-      this.$get('metroapi/lineStation/queryLine', {lineName:''}).then(res=>{
-        if (res.httpCode == 1 ){
-          this.lineTypeData = res.data
-          this.lineTypeData.unshift({ id: '-1', lineName: '线路' })
-          this.getStationData ('-1')
-        } else {
-          this.lineTypeData = []
-        }
-      })
+      // this.$get('metroapi/lineStation/queryLine', {lineName:''}).then(res=>{
+      //   if (res.httpCode == 1 ){
+      //     this.lineTypeData = res.data
+      //     this.lineTypeData.unshift({ id: '-1', lineName: '线路' })
+      //     this.getStationData ('-1')
+      //   } else {
+      //     this.lineTypeData = []
+      //   }
+      // })
       // 获取层级
-      this.$get('metroapi/dic/queryDictionary', {name:'层级类型'}).then(res=>{
-        if (res.httpCode == 1 ){
-          this.levelData = res.data
-        } else {
-          this.levelData = []
-        }
-      })
+      // this.$get('metroapi/dic/queryDictionary', {name:'层级类型'}).then(res=>{
+      //   if (res.httpCode == 1 ){
+      //     this.levelData = res.data
+      //   } else {
+      //     this.levelData = []
+      //   }
+      // })
     },
     selectLine (val) {
        // 获取站点类型
@@ -366,23 +369,23 @@ export default {
       }
     },
     // 获取所属站点
-    getStationData (lineId) { 
-      if(lineId == '-1') {
-        this.stationTypeData = [{ id: '-1', stationName: '站点' }]
-      } else {
-        this.$get('metroapi/lineStation/queryStationByLineId', {lineId:lineId}).then(res=>{
-          if (res.httpCode == 1 ){
-            this.stationTypeData = res.data
-            this.stationTypeData.unshift({ id: '-1', stationName: '站点' })
-          }
-        })
-      }
-    },
+    // getStationData (lineId) { 
+    //   if(lineId == '-1') {
+    //     this.stationTypeData = [{ id: '-1', stationName: '站点' }]
+    //   } else {
+    //     this.$get('metroapi/lineStation/queryStationByLineId', {lineId:lineId}).then(res=>{
+    //       if (res.httpCode == 1 ){
+    //         this.stationTypeData = res.data
+    //         this.stationTypeData.unshift({ id: '-1', stationName: '站点' })
+    //       }
+    //     })
+    //   }
+    // },
     // 获取表格数据
     getTableData () {
       let params = JSON.parse(JSON.stringify(this.tableParams))
-      params.lineId = params.lineId == '-1' ? '':params.lineId
-      params.stationId = params.stationId == '-1' ?'':params.stationId
+      // params.lineId = params.lineId == '-1' ? '':params.lineId
+      // params.stationId = params.stationId == '-1' ?'':params.stationId
       params.equipmentCheck = params.equipmentCheck == '-1' ?'':params.equipmentCheck
       params.instrumentCheck = params.instrumentCheck == '-1' ?'':params.instrumentCheck
       this.loading = true
@@ -401,45 +404,45 @@ export default {
           }
         })
     },
-    selectModalLine (val) {
-      this.formOption.stationId = ''
-      this.formOption.level = ''
-      if (val) {
-        this.formOption.lineName = val.label
-        this.formOption.lineId =val.value
-        this.getStationData(val.value)
-      }
-      this.levelModalData = this.getCurrentLevel()
-    },
-    selectModalStation (val) {
-      if (val) {
-       this.formOption.stationName = val.label
-       this.formOption.stationId =val.value
-       this.levelModalData = this.getCurrentLevel()
-      }
-    },
-    selectModalLevel (val) {
-      if (val) {
-       this.formOption.levelDesc = val.label
-       this.formOption.level =val.value
-      }
-    },
+    // selectModalLine (val) {
+    //   this.formOption.stationId = ''
+    //   this.formOption.level = ''
+    //   if (val) {
+    //     this.formOption.lineName = val.label
+    //     this.formOption.lineId =val.value
+    //     this.getStationData(val.value)
+    //   }
+    //   this.levelModalData = this.getCurrentLevel()
+    // },
+    // selectModalStation (val) {
+    //   if (val) {
+    //    this.formOption.stationName = val.label
+    //    this.formOption.stationId =val.value
+    //    this.levelModalData = this.getCurrentLevel()
+    //   }
+    // },
+    // selectModalLevel (val) {
+    //   if (val) {
+    //    this.formOption.levelDesc = val.label
+    //    this.formOption.level =val.value
+    //   }
+    // },
     // 获取对话框层级数据
-    getCurrentLevel () {
-      let arr = []
-      if (this.formOption.lineId == '-1') {
-        if (this.formOption.stationId == '' || this.formOption.stationId == '-1') {
-          arr = [{value:'线网',id:'9'}]
-        }
-      } else {
-        if (this.formOption.stationId == '' || this.formOption.stationId == '-1') {
-          arr = [{value:'线路',id:'8'}]
-        } else {
-          arr = [{value:'站点',id:'7'}]
-        }
-      }
-      return arr
-    },
+    // getCurrentLevel () {
+    //   let arr = []
+    //   if (this.formOption.lineId == '-1') {
+    //     if (this.formOption.stationId == '' || this.formOption.stationId == '-1') {
+    //       arr = [{value:'线网',id:'9'}]
+    //     }
+    //   } else {
+    //     if (this.formOption.stationId == '' || this.formOption.stationId == '-1') {
+    //       arr = [{value:'线路',id:'8'}]
+    //     } else {
+    //       arr = [{value:'站点',id:'7'}]
+    //     }
+    //   }
+    //   return arr
+    // },
     searchClick () {
       this.getTableData()
     },
@@ -467,11 +470,11 @@ export default {
     editClick (row) {
       this.rowObj = row
       this.formOption = JSON.parse(JSON.stringify(row));
-      this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
-      this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
-      this.formOption.level = String(this.formOption.level)
-      this.getStationData(this.formOption.lineId)
-      this.levelModalData = this.getCurrentLevel()
+      // this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
+      // this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
+      // this.formOption.level = String(this.formOption.level)
+      // this.getStationData(this.formOption.lineId)
+      // this.levelModalData = this.getCurrentLevel()
       this.title = '编辑应用'
       this.showModal = true
     },
@@ -490,10 +493,10 @@ export default {
     },
     modalOk (formName) {
       let params = JSON.parse(JSON.stringify(this.formOption)) //把对象中的数据给了某个变量,改变一个对象的值,另一个对象也变化的解决方法
-      params.lineId = params.lineId == '-1' ? null:params.lineId
-      params.lineName = params.lineName == '线路' ? null:params.lineName
-      params.stationId = params.stationId == '-1' ? null:params.stationId
-      params.stationName = params.stationName == '站点' ? null:params.stationName
+      // params.lineId = params.lineId == '-1' ? null:params.lineId
+      // params.lineName = params.lineName == '线路' ? null:params.lineName
+      // params.stationId = params.stationId == '-1' ? null:params.stationId
+      // params.stationName = params.stationName == '站点' ? null:params.stationName
       if (this.title == '新增应用') {
         this.$refs[formName].validate((valid) => {
           if (valid) {
@@ -513,8 +516,8 @@ export default {
       } else {
         this.$refs[formName].validate((valid) => {
           if (valid) {
-            params.lineName = params.lineName == '/' ? null:params.lineName
-            params.stationName = params.stationName == '/' ? null:params.stationName
+            // params.lineName = params.lineName == '/' ? null:params.lineName
+            // params.stationName = params.stationName == '/' ? null:params.stationName
             this.$post('metroapi/application/addApp', params).then(res=>{
               if (res.httpCode == 1 ){
                 this.showModal = false
@@ -555,13 +558,13 @@ export default {
       })
     },
     tabsClick (name) {
+       // this.equipDetail (this.rowObj)
       this.currentModalTabs = name
       if (this.currentModalTabs == '关联设备类型') {
-        // this.equipDetail (this.rowObj)
         this.detailParams.applicationId = this.rowObj.id
         this.$nextTick(() => {
            document.querySelector(".common-modal-detail .ivu-table-body").scrollTo(0, 0)
-          this.$refs.detailTable.getChartsDetail(this.detailParams)
+           this.$refs.detailTable.getChartsDetail(this.detailParams)
         });
       }
     },
@@ -619,15 +622,18 @@ export default {
  >>> .common-table .ivu-table td {
   height: 53px;
  }
-  >>> .ivu-spin-fix {
+  >>> .common-table .ivu-spin-fix {
    top: 53px;
  }
   >>> .app-table .ivu-spin-fix {
    height: calc(100vh - 355px);
  }
- >>> .ivu-table-tip {
+ >>> .common-table .ivu-table-tip {
   background: url('../../../assets/images/noData.png') no-repeat center;
 }
+>>> .common-table .ivu-table-tip table {
+ display: none;
+}
 >>> .app-table .ivu-table-tip {
    height: calc(100vh - 355px);
  }
@@ -663,12 +669,12 @@ export default {
   border-right: 1px solid #21437B;
 }
 >>> .modal-content-item {
-  width: 50%;
-  display: flex;
-}
->>> .item-especial {
   width: 100%;
+  display: flex;
 }
+// >>> .item-especial {
+//   width: 100%;
+// }
 >>> .modal-content-item-name {
   width: 50%;
   height: 45px;
@@ -694,20 +700,20 @@ export default {
   padding-left: 20px;
 }
 >>> .item-especial .modal-content-item-name{
-  width: 25%;
-  height: auto;
-  min-height: 45px;
+  // width: 25%;
+  // height: auto;
+  // min-height: 45px;
   border-bottom: 1px solid #21437B;
-  display: flex;
-  align-items: center;
+  // display: flex;
+  // align-items: center;
 }
 >>> .item-especial .modal-content-item-value{
-  width: 75%;
-  height: auto;
-  min-height: 45px;
+  // width: 75%;
+  // height: auto;
+  // min-height: 45px;
   border-bottom: 1px solid #21437B;
-  display: flex;
-  align-items: center;
-  line-height: 22px;
+  // display: flex;
+  // align-items: center;
+  // line-height: 22px;
 }
 </style>

+ 19 - 5
src/views/homecomponents/BasicInfomation/DeviceManage.vue

@@ -79,7 +79,13 @@ export default {
       this.currentStaData = []
       this.treeName = []
       this.$nextTick(()=> {
-        // this.$refs.stationManage.getTableData(this.currentStation)
+        if (this.currentTabs == '设备管理') {
+          this.$refs.device.getTableData(this.currentStation)
+        } else if(this.currentTabs == '设备类型管理'){
+          this.$nextTick(()=> {
+            this.$refs.deviceType.getTableData(this.currentStation)
+          })
+        }
       })
       if(this.currentStation != ''){
         this.showTree = false
@@ -95,7 +101,13 @@ export default {
     clearChange () {
       this.getSelectedItem()
       this.$nextTick(()=> {
-        // this.$refs.stationManage.getTableData(this.currentStation)
+        if (this.currentTabs == '设备管理') {
+          this.$refs.device.getTableData(this.currentStation)
+        } else if(this.currentTabs == '设备类型管理'){
+          this.$nextTick(()=> {
+            this.$refs.deviceType.getTableData(this.currentStation)
+          })
+        }
       })
     },
     getSelectedItem  () {
@@ -128,7 +140,8 @@ export default {
           if (this.currentStation == '' && i==0) {
             val.expand = true
           }
-          val.children.forEach ((lastVal,lastIndex) => {
+          if (val.children) {
+            val.children.forEach ((lastVal,lastIndex) => {
             lastVal.selected = false; //expand 是否展开直子节点 
             lastVal.disabled = false; 
             lastVal.expand = false;
@@ -141,14 +154,15 @@ export default {
               this.currentStaData.push(lastVal)
               this.showTree = true
             } 
-          })
+           })
+          } 
         });
       });
     },
     treeChange(val,arr,level) {
       this.currentStation = val
       if (this.currentTabs == '设备管理') {
-        
+        this.$refs.device.getTableData(this.currentStation,arr,level)
       } else if(this.currentTabs == '设备类型管理'){
         this.$nextTick(()=> {
           this.$refs.deviceType.getTableData(this.currentStation,arr,level)

+ 114 - 26
src/views/homecomponents/BasicInfomation/DeviceManageIndex.vue

@@ -18,11 +18,11 @@
                 <Option v-for="item in equipStateData" :value="item.id" :key="item.id">{{ item.value }}</Option>
             </Select>
           </FormItem>
-          <FormItem label="" prop="equipmentType">
+          <!-- <FormItem label="" prop="equipmentType">
              <Select v-model="tableParams.equipmentType" placeholder="设备类型">
               <Option v-for="item in equipTypeData" :value="(item.id)" :key="item.id">{{ item.name }}</Option>
             </Select>
-          </FormItem>
+          </FormItem> -->
           <FormItem label="">
             <DatePicker type="daterange" :value="dateRange" :clearable="false" class="common-date-picker date-picker-main" placement="bottom-end" placeholder="启用日期范围" @on-change="changePicker"></DatePicker>
           </FormItem>
@@ -89,6 +89,16 @@
             <Option v-for="item in stationTypeData" :value="String(item.id)" :key="item.id">{{ item.stationName }}</Option>
           </Select>
         </FormItem>
+        <FormItem label="归属应用:" prop="appId" style="width:48%">
+           <Select v-model="formOption.appId" placeholder="归属应用" @on-change="selectModalApp">
+             <Option v-for="item in equipAppModalData" :value="String(item.id)" :key="item.id">{{ item.appName }}</Option>
+          </Select>
+        </FormItem>
+        <FormItem label="设备类型:" prop="equipmentType" style="width:48%">
+          <Select v-model="formOption.equipmentType" placeholder="设备类型">
+             <Option v-for="item in equipTypeModalData" :value="item.equipmentTypeId" :key="item.equipmentTypeId">{{ item.equipmentName }}</Option>
+          </Select>
+        </FormItem>
         <FormItem label="设备ID:" style="width:100%">
           <span v-show="title=='新增设备'">系统自动生成,唯一不重复</span>
           <span v-show="title=='编辑设备'">{{formOption.equipmentId}}</span>
@@ -96,17 +106,12 @@
         <FormItem label="设备名称:" prop="equipmentName" style="width:100%">
           <Input v-model="formOption.equipmentName" maxlength="100" show-word-limit />  
         </FormItem>
-        <FormItem label="设备类型:" prop="equipmentType" style="width:48%">
-          <Select v-model="formOption.equipmentType" placeholder="设备类型">
-             <Option v-for="item in equipTypeModalData" :value="item.id" :key="item.id">{{ item.name }}</Option>
-          </Select>
-        </FormItem>
         <FormItem label="设备状态:" prop="equipmentStatus" style="width:48%">
           <Select v-model="formOption.equipmentStatus" placeholder="设备状态">
             <Option v-for="item in equipStateModalData" :value="item.id" :key="item.id">{{ item.value }}</Option>
           </Select>
         </FormItem>
-        <FormItem label="启用日期:" prop="useDate">
+        <FormItem label="启用日期:" prop="useDate" style="width:48%">
            <DatePicker type="date" :value="formOption.useDate" :clearable="false" class="common-date-picker" placement="bottom-end" placeholder="启用日期" style="width: 100%" @on-change="changeMoldaPicker"></DatePicker>
         </FormItem>
          <FormItem label="设备型号:" prop="equipmentVersion" style="width:100%">
@@ -159,7 +164,7 @@
             <span class="modal-content-item-name">
             {{val.name}}
             </span>
-            <span class="modal-content-item-value" v-if="val.name == '启用状态'">{{val.value==1 ? '启用' : '关闭'}}</span>
+            <span class="modal-content-item-value" v-if="val.name == '归属线路' || val.name == '归属站点'">{{!val.value ? '/' : val.value}}</span>
             <span class="modal-content-item-value" v-else>{{val.value}}</span>
           </div>
         </div>
@@ -168,19 +173,37 @@
   </div>
 </template>
 <script>
-const defaultFrom = {lineId: '',stationId: '',equipmentName: '',equipmentType:'',equipmentStatus: '',equipmentVersion: '',supplier: '',remark: ''}
+const defaultFrom = {lineId: '',stationId: '',appId:'',equipmentName: '',equipmentType:'',equipmentStatus: '',equipmentVersion: '',supplier: '',remark: ''}
 export default {
   name: "DeviceManageIndex",
   components:{
   },
   data() {
     return {
+      applicationParams: {
+        level: '',
+        lineId: '',
+        stationId: '',
+        equipmentCheck: '',
+        instrumentCheck: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
+      appParams: {
+        applicationId: '',
+        equipmentTypeId: '',
+        keywords: '',
+        pageNum: 1,
+        pageSize: 9999
+      },
       loading: true,
       dateRange: [],
       tableParams: {
         lineId: '',
         stationId: '',
         equipmentStatus: '',
+        keywords: '',
+        applicationId:'',
         equipmentType: '',
         useDateBegin: '',
         useDateEnd: '',
@@ -197,7 +220,13 @@ export default {
       equipStateModalData: [],
       equipTypeData: [],
       equipTypeModalData: [],
+      equipAppModalData: [],
       columns: [
+        //  {
+        //     type: 'selection',
+        //     width: 60,
+        //     align: 'center'
+        //   },
           {
             title: '设备ID',
             key: 'equipmentId',
@@ -206,7 +235,9 @@ export default {
           {
             title: '设备名称',
             key: 'equipmentName',
-            align: 'center'
+            align: 'center',
+            ellipsis: true,
+            tooltip: true
           },
           {
             title: '设备类型',
@@ -227,8 +258,6 @@ export default {
             title: '归属站点',
             align: 'center',
             slot: 'stationName',
-            // ellipsis: true,
-            // tooltip: true
           },
           {
             title: '设备状态',
@@ -255,7 +284,7 @@ export default {
       activeColor: '#E92E2E',
       activeClass: '',
       modalTitle: '',
-      formOption: {lineId: '',stationId: '',equipmentName: '',equipmentType:'',equipmentStatus: '',useDate:'',equipmentVersion: '',supplier: '',remark: ''},
+      formOption: {lineId: '',stationId: '',appId:'',equipmentName: '',equipmentType:'',equipmentStatus: '',useDate:'',equipmentVersion: '',supplier: '',remark: ''},
       ruleValidate: {
         lineId: [{
           required: true,
@@ -267,6 +296,11 @@ export default {
           message: '请选择所属站点',
           trigger: 'change'
         }],
+        appId: [{
+          required: true,
+          message: '请选择归属应用',
+          trigger: 'change'
+        }],
         equipmentName: [{
           required: true,
           message: '请输入设备名称',
@@ -341,17 +375,25 @@ export default {
           this.equipStateModalData = []
         }
       })
-       // 获取设备类型
-      this.$get('metroapi/equipment/queryEquipmentType', {name:''}).then(res=>{
+      // 获取归属应用
+      this.$get('metroapi/application/info/list', this.applicationParams).then(res=>{
         if (res.httpCode == 1 ){
-          this.equipTypeModalData = JSON.parse(JSON.stringify(res.data))
-          this.equipTypeData = res.data
-          this.equipTypeData.unshift({ id: '-1', name: '设备类型' })
+          this.equipAppModalData = res.data.data
         } else {
-          this.equipTypeData = []
-          this.equipTypeModalData = []
+          this.equipAppModalData = []
         }
       })
+      //  // 获取设备类型
+      // this.$get('metroapi/equipment/queryEquipmentType', {name:''}).then(res=>{
+      //   if (res.httpCode == 1 ){
+      //     this.equipTypeModalData = JSON.parse(JSON.stringify(res.data))
+      //     this.equipTypeData = res.data
+      //     this.equipTypeData.unshift({ id: '-1', name: '设备类型' })
+      //   } else {
+      //     this.equipTypeData = []
+      //     this.equipTypeModalData = []
+      //   }
+      // })
     },
     selectLine (val) {
       // 获取站点类型
@@ -374,13 +416,37 @@ export default {
         })
       }
     },
+    selectChange (selection) {
+     console.log(selection)
+     let user = selection.map(item => item.id)
+     console.log(user)
+    },
     // 获取表格数据
-    getTableData () {
+    getTableData (keywords,arr,level) {
+       if (level) {
+        this.tableParams.keywords = ''
+        if (level == 2) {
+          this.tableParams.applicationId = arr[arr.length-1]
+          this.tableParams.equipmentType = ''
+        } else if (level == 3) {
+          this.tableParams.applicationId = arr[arr.length-2]
+          this.tableParams.equipmentType = arr[arr.length-1]
+        } else {
+          this.tableParams.applicationId = ''
+          this.tableParams.equipmentType = ''
+        }
+      } else {
+        this.tableParams.applicationId = ''
+        this.tableParams.equipmentType = ''
+        if (keywords == '合肥轨道交通' || keywords == '' || !keywords) {
+          this.tableParams.keywords = ''
+        } else {
+          this.tableParams.keywords = keywords
+        }
+      }
       let params = JSON.parse(JSON.stringify(this.tableParams))
       params.lineId = params.lineId == '-1' ? '':params.lineId
       params.stationId = params.stationId == '-1' ?'':params.stationId
-      params.equipmentCheck = params.equipmentCheck == '-1' ?'':params.equipmentCheck
-      params.instrumentCheck = params.instrumentCheck == '-1' ?'':params.instrumentCheck
       this.loading = true
       this.$get('metroapi/equipment/queryEquipmentPage', params).then(res=>{
         this.loading = false
@@ -408,6 +474,23 @@ export default {
        this.formOption.stationId =val.value
       }
     },
+    selectModalApp (val) {
+      this.appParams.applicationId = val
+      this.formOption.equipmentType = ''
+      if (val) {
+        this.getAddEquipType( this.appParams)
+      }
+    },
+    // 获取新增设备类型 
+    getAddEquipType (params) {
+      this.$get('metroapi/application/equipmentTypeInfo', params).then(res=>{
+        if (res.httpCode == 1 ){
+          this.equipTypeModalData = res.data.data
+        } else {
+          this.equipTypeModalData = []
+        }
+      })
+    },
     searchClick () {
       this.getTableData()
     },
@@ -429,7 +512,7 @@ export default {
     detailClick (row) {
       this.rowObj = row
       this.detailStatus = true
-      this.$get('metroapi/lineStation/lineDetail', {lineId:row.id}).then(res=>{
+      this.$get('metroapi/equipment/equipmentDetail', {equipmentId:row.id}).then(res=>{
         if ( res.httpCode == 1 ){
           this.detailLabel = res.data
         } else {
@@ -443,6 +526,8 @@ export default {
       this.formOption.lineId = this.formOption.lineId ? String(this.formOption.lineId) : '-1'
       this.formOption.stationId = this.formOption.stationId ? String(this.formOption.stationId) : '-1'
       this.getStationData(this.formOption.lineId)
+      this.appParams.applicationId = this.formOption.appId
+      this.getAddEquipType(this.appParams)
       this.title = '编辑设备'
       this.showModal = true
     },
@@ -589,7 +674,7 @@ export default {
  >>> .common-table .ivu-table td {
   height: 51px;
  }
-  >>> .ivu-spin-fix {
+  >>> .common-table .ivu-spin-fix {
    top: 51px;
  }
   >>> .app-table .ivu-spin-fix {
@@ -601,6 +686,9 @@ export default {
 >>> .app-table .ivu-table-tip {
   height: calc(100vh - 375px);
  }
+ >>> .common-table .ivu-table-tip table {
+ display: none;
+}
  >>> .modal-table {
    overflow: auto !important;
  }

+ 207 - 13
src/views/homecomponents/BasicInfomation/DeviceTypeManage.vue

@@ -69,6 +69,32 @@
           <Button type="primary" @click="commonOk">确定</Button>
         </div>
     </Modal>
+    <Modal
+      v-model="detailStatus"
+      title="设备类型信息"
+      width="45"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      footer-hide
+      :mask-closable="false"
+      class-name="common-modal common-modal-detail">
+       <Tabs :value="currentModalTabs" @on-click="tabsClick" class="common-tabs">
+        <TabPane v-for="tab in tabsModalData" :key="tab.label" :label="tab.label" :name="tab.label"></TabPane>
+      </Tabs>
+       <div v-for="(item,index) in detailLabel" :key="index" v-show="currentModalTabs =='设备类型信息'">
+          <div class="common-modal-top" :class="{'common-modal-top-especial': index==1}">
+          <span class="common-modal-top-text">{{item.name}}</span>
+          </div>
+          <div class="common-modal-content" v-if="index==0">
+            <div class="modal-content-item" v-for="(val,i) in item.value" :key="i" :class="{'item-especial': val.name == '说明' }">
+                <span class="modal-content-item-name">{{val.name}}</span>
+                <span class="modal-content-item-value">{{val.value}}</span>
+            </div>
+          </div>
+      </div>
+      <rolling-detail-table :columns1="columnsModal" :apiUrl="apiUrl" ref="detailTable" class="rolling-detail-table"></rolling-detail-table>
+    </Modal>
 </div>
 </template>
 <script>
@@ -81,7 +107,9 @@ export default {
   data() {
     return {
       tableTotal: 0,
-       tableParams: {
+      tableParams: {
+        equipmentTypeId: '',
+        applicationId: '',
         name: '',
         pageNum: 1,
         pageSize: 10
@@ -113,6 +141,7 @@ export default {
             title: '操作',
             align: 'center',
             slot: 'action',
+            width: 120
           }
       ],
       rowObj: {},
@@ -133,6 +162,74 @@ export default {
     activeColor: '#E92E2E',
     activeClass: '',
     modalTitle: '',
+    detailStatus: false,
+    currentModalTabs:'设备类型信息',
+    tabsModalData: [{label:'设备类型信息'},{label:'关联设备'}],
+    detailLabel: [],
+    columnsModal: [],
+    columnsEquipType: [
+        {
+          title: '序号',
+          type: 'index',
+          align: 'center'
+        },
+        {
+          title: '应用名称',
+          key: 'appName',
+          align: 'center'
+        },
+        {
+          title: '设备数量',
+          key: 'equipmentNum',
+          align: 'center'
+        }
+      ],
+      columnsRelatedEquip: [
+          {
+            title: '序号',
+            type: 'index',
+            align: 'center'
+          },
+          {
+            title: '设备ID',
+            key: 'equipmentId',
+            align: 'center'
+         },
+         {
+            title: '设备名称',
+            key: 'equipmentName',
+            align: 'center'
+         },
+         {
+            title: '归属线路',
+            key: 'lineName',
+            align: 'center',
+            render:(h,params)=>{
+              return h('div', [ h('span',!params.row.lineName ? '/' : params.row.lineName) ])
+            }
+         },
+         {
+            title: '归属站点',
+            key: 'stationName',
+            align: 'center',
+             render:(h,params)=>{
+              return h('div', [ h('span',!params.row.stationName ? '/' : params.row.stationName) ])
+            }
+         },
+         {
+            title: '状态',
+            key: 'equipmentStatusValue',
+            align: 'center'
+         },
+      ],
+      // equipTypeModal: [],
+      // equipTypeCount: 0,
+      detailParams: {
+					equipmentTypeId: null,
+					pageNum: 1,
+					pageSize: 10
+			},
+      apiUrl: '',
     appNameObj: {
         level: '',
         lineId: '',
@@ -167,7 +264,7 @@ export default {
     },
     getTableData (keywords,arr,level) {
       if (level) {
-        this.tableParams.keywords = ''
+        this.tableParams.name = ''
         if (level == 2) {
           this.tableParams.applicationId = arr[arr.length-1]
           this.tableParams.equipmentTypeId = ''
@@ -176,15 +273,15 @@ export default {
           this.tableParams.equipmentTypeId = arr[arr.length-1]
         } else {
           this.tableParams.applicationId = ''
-          this.tableParams.applicationId = ''
+          this.tableParams.equipmentTypeId = ''
         }
       } else {
         this.tableParams.applicationId = ''
         this.tableParams.equipmentTypeId = ''
         if (keywords == '合肥轨道交通' || keywords == '' || keywords == undefined) {
-          this.tableParams.keywords = ''
+          this.tableParams.name = ''
         } else {
-          this.tableParams.keywords = keywords
+          this.tableParams.name = keywords
         }
       }
       this.loading = true
@@ -227,15 +324,24 @@ export default {
       this.showModal = true
     },
     detailClick (row) {
+      this.detailParams.equipmentTypeId = Number(row.id)
       this.rowObj = row
       this.detailStatus = true
-      this.$get('metroapi/lineStation/lineDetail', {lineId:row.id}).then(res=>{
+      this.currentModalTabs = '设备类型信息'
+      this.$nextTick(() => {
+        this.apiUrl = 'metroapi/equipment/equipmentTypeDetail'
+        this.columnsModal = this.columnsEquipType
+        document.querySelector(".rolling-detail-table .ivu-table-body").scrollTo(0, 0) 
+        this.$refs.detailTable.getChartsDetail(this.detailParams,this.apiUrl)
+      });
+      this.$get('metroapi/equipment/equipmentTypeDetail', this.detailParams).then(res=>{
         if ( res.httpCode == 1 ){
-          this.detailLabel = res.data
-        } else {
-          this.$Message.info(res.msg)
-        }
-      })
+            this.detailLabel = res.data
+          } else {
+            this.$Message.info(res.msg)
+          }
+        })
+        // document.querySelector(".rolling-detail-table .ivu-table-body").scrollTo(0, 0)
     },
     editClick (row) {
       this.rowObj = row
@@ -315,6 +421,20 @@ export default {
         }
       })
     },
+    tabsClick (name) {
+      this.currentModalTabs = name
+      if (this.currentModalTabs == '设备类型信息') {
+        this.apiUrl = 'metroapi/equipment/equipmentTypeDetail'
+        this.columnsModal = this.columnsEquipType
+      } else if (this.currentModalTabs == '关联设备') {
+        this.apiUrl = 'metroapi/equipment/queryEquipmentByTypePage'
+        this.columnsModal = this.columnsRelatedEquip
+      }
+      this.$nextTick(() => {    
+        document.querySelector(".rolling-detail-table .ivu-table-body").scrollTo(0, 0) 
+        this.$refs.detailTable.getChartsDetail(this.detailParams,this.apiUrl)
+      });
+    }
   }
 };
 </script>
@@ -393,14 +513,17 @@ export default {
  >>> .common-table .ivu-table td {
   height: 54px;
  }
->>> .ivu-spin-fix {
+>>> .common-table .ivu-spin-fix {
   top: 54px;
   height: calc(100vh - 350px);
 }
->>> .ivu-table-tip {
+>>> .common-table .ivu-table-tip {
   background: url('../../../assets/images/noData.png') no-repeat center;
   height: calc(100vh - 350px);
 }
+>>> .common-table .ivu-table-tip table {
+ display: none;
+}
 .common-page {
   margin-top: 15px;
   display: flex;
@@ -409,4 +532,75 @@ export default {
   bottom: 0;
   right: 0;
 }
+>>> .common-modal-top-text {
+  font-size: 14px;
+  font-weight: bold;
+  color: #29A0FF;
+  line-height: 42px;
+  border-left: 3px solid #1590F1;
+  padding-left: 12px;
+}
+>>> .common-modal-top-especial {
+  margin-bottom: -10px;
+}
+>>> .common-modal-content {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  margin-bottom: 15px;
+  border-right: 1px solid #21437B;
+}
+>>> .modal-content-item {
+  width: 100%;
+  display: flex;
+}
+>>> .item-especial {
+  width: 100%;
+}
+>>> .modal-content-item-name {
+  width: 25%;
+  height: 45px;
+  line-height: 45px;
+  background: #13305F;
+  border-top: 1px solid #21437B;
+  border-left: 1px solid #21437B;
+  font-size: 14px;
+  color: #F5F5F5;
+  padding-left: 20px;
+}
+>>> .modal-content-item-value {
+  width: 75%;
+  height: 45px;
+  line-height: 45px;
+  background: #06214D;
+  border-top: 1px solid #21437B;
+  border-left: 1px solid #21437B;
+  font-size: 14px;
+  color: #F5F5F5;
+  padding-left: 20px;
+}
+// >>> .item-especial .modal-content-item-name{
+//   width: 25%;
+//   height: auto;
+//   min-height: 45px;
+//   border-bottom: 1px solid #21437B;
+//   display: flex;
+//   align-items: center;
+// }
+// >>> .item-especial .modal-content-item-value{
+//   width: 75%;
+//   height: auto;
+//   min-height: 45px;
+//   border-bottom: 1px solid #21437B;
+//   display: flex;
+//   align-items: center;
+//   line-height: 22px;
+// }
+>>> .item-especial .modal-content-item-name {
+  border-bottom: 1px solid #21437B;
+}
+>>> .item-especial .modal-content-item-value {
+  border-bottom: 1px solid #21437B;
+}
 </style>

+ 25 - 10
src/views/homecomponents/BasicInfomation/LineManage.vue

@@ -48,7 +48,7 @@
           </Select>
         </FormItem>
         <FormItem label="线路长度(km):" prop="lineLength">
-          <InputNumber v-model="formOption.lineLength" placeholder="保留2位小数" :precision="2" :active-change="false"></InputNumber>
+          <InputNumber v-model="formOption.lineLength" placeholder="保留2位小数" :min="0" :precision="2" :active-change="false"></InputNumber>
         </FormItem>
         <FormItem label="运营机构:" prop="operatingGroup">
           <Input v-model="formOption.operatingGroup" maxlength="20" show-word-limit />
@@ -160,7 +160,9 @@ export default {
           title: '线路名称',
           key: 'lineName',
           align: 'center',
-          width: 100,
+          ellipsis: true,
+          tooltip: true
+          // width: 100,
         },
         {
           title: '当前线路长度(km)',
@@ -176,6 +178,8 @@ export default {
           title: '运营机构',
           key: 'operatingGroup',
           align: 'center',
+          ellipsis: true,
+          tooltip: true
         },
         {
           title: '线路类型',
@@ -228,6 +232,11 @@ export default {
     this.getLineType()
   },
   methods: {
+    // formatter(VauleNumber){
+    //   console.log(VauleNumber)
+    //   let num = VauleNumber.toFixed(2)
+    //   return num;
+    // },
     rowClassName(row, index) {
       if (index % 2 == 0) {
         return "ivu-table-stripe-even";
@@ -264,6 +273,7 @@ export default {
       this.$get('metroapi/lineStation/lineDetail', {lineId:row.id}).then(res=>{
         if ( res.httpCode == 1 ){
           this.detailLabel = res.data
+          console.log(this.detailLabel)
         } else {
           this.$Message.info(res.msg)
         }
@@ -312,10 +322,12 @@ export default {
      }
     },
     modalOk (formName) {
+      let params = JSON.parse(JSON.stringify(this.formOption))
+      params.lineLength = params.lineLength ? params.lineLength.toFixed(2):params.lineLength
       if (this.title == '新增线路') {
         this.$refs[formName].validate((valid) => {
           if (valid) {
-            this.$post('metroapi/lineStation/addLine', this.formOption).then(res=>{
+            this.$post('metroapi/lineStation/addLine', params).then(res=>{
               if ( res.httpCode == 1 ){
                 this.showModal = false
                 this.$Message.info(res.msg)
@@ -331,7 +343,7 @@ export default {
       } else {
         this.$refs[formName].validate((valid) => {
           if (valid) {
-            this.$post('metroapi/lineStation/editLine', this.formOption).then(res=>{
+            this.$post('metroapi/lineStation/editLine', params).then(res=>{
               if ( res.httpCode == 1 ){
                 this.showModal = false
                 this.$Message.info(res.msg)
@@ -353,13 +365,13 @@ export default {
       if (this.commonTitle == '确认启用') {
         let params = {
           lineId: this.rowObj.id,
-          enabled: 0
+          enabled: 1
         }
         this.getSwitchStatus(params)
       } else if (this.commonTitle == '确认关闭') {
         let params = {
           lineId: this.rowObj.id,
-          enabled:1
+          enabled:0
         }
         this.getSwitchStatus(params)
       } else {
@@ -377,9 +389,9 @@ export default {
       this.$get('metroapi/lineStation/enableLine',params).then(res=>{
         if (res.httpCode == 1 ){
           if (params.enabled == 0) {
-            this.rowObj.enabled = 1
-          } else {
             this.rowObj.enabled = 0
+          } else {
+            this.rowObj.enabled = 1
           }
           this.modalStatus = false
         } else {
@@ -429,14 +441,17 @@ export default {
  >>> .common-table .ivu-table td {
   height: 55px;
  }
- >>> .ivu-spin-fix {
+ >>> .common-table .ivu-spin-fix {
    top: 52px;
    height: calc(100vh - 338px);
  }
- >>> .ivu-table-tip {
+ >>> .common-table .ivu-table-tip {
   height: calc(100vh - 338px);
   background: url('../../../assets/images/noData.png') no-repeat center;
 }
+>>> .common-table .ivu-table-tip table {
+ display: none;
+}
 .common-page {
   margin-top: 15px;
   display: flex;

+ 17 - 9
src/views/homecomponents/BasicInfomation/StationManage.vue

@@ -190,7 +190,8 @@ export default {
           title: '站点名称',
           key: 'stationName',
           align: 'center',
-          width: 100,
+          ellipsis: true,
+          tooltip: true
         },
          {
           title: '所属线路',
@@ -364,10 +365,14 @@ export default {
      }
     },
     modalOk (formName) {
+      let params = JSON.parse(JSON.stringify(this.formOption))
+      params.area = params.area ? params.area.toFixed(2):params.area
+      params.lat = params.lat ? params.lat.toFixed(2):params.lat
+      params.lon = params.lon ? params.lon.toFixed(2):params.lon
       if (this.title == '新增站点') {
         this.$refs[formName].validate((valid) => {
           if (valid) {
-            this.$post('metroapi/lineStation/addStation', this.formOption).then(res=>{
+            this.$post('metroapi/lineStation/addStation', params).then(res=>{
               if ( res.httpCode == 1 ){
                 this.showModal = false
                 this.$Message.info(res.msg)
@@ -384,7 +389,7 @@ export default {
       } else {
         this.$refs[formName].validate((valid) => {
           if (valid) {
-            this.$post('metroapi/lineStation/editStation', this.formOption).then(res=>{
+            this.$post('metroapi/lineStation/editStation', params).then(res=>{
               if ( res.httpCode == 1 ){
                 this.showModal = false
                 this.$Message.info(res.msg)
@@ -408,14 +413,14 @@ export default {
         // this.rowObj.enabled = 1
         let params = {
           stationId: this.rowObj.id,
-          enabled: 0
+          enabled: 1
         }
         this.getSwitchStatus(params)
       } else if (this.commonTitle == '确认关闭') {
         // this.rowObj.enabled = 0
         let params = {
           stationId: this.rowObj.id,
-          enabled: 1
+          enabled: 0
         }
         this.getSwitchStatus(params)
       } else {
@@ -433,9 +438,9 @@ export default {
       this.$get('metroapi/lineStation/enableStation',params).then(res=>{
         if (res.httpCode == 1 ){
           if (params.enabled == 0) {
-            this.rowObj.enabled = 1
-          } else {
             this.rowObj.enabled = 0
+          } else {
+            this.rowObj.enabled = 1
           }
           this.modalStatus = false
         } else {
@@ -484,14 +489,17 @@ export default {
  >>> .common-table .ivu-table td {
   height: 52px;
  }
- >>> .ivu-spin-fix {
+ >>> .common-table .ivu-spin-fix {
   top: 52px;
   height: calc(100vh - 355px);
  }
-  >>> .ivu-table-tip {
+  >>> .common-table .ivu-table-tip {
   background: url('../../../assets/images/noData.png') no-repeat center;
   height: calc(100vh - 370px);
 }
+>>> .common-table .ivu-table-tip table {
+ display: none;
+}
 .common-page {
   margin-top: 15px;
   display: flex;

+ 53 - 10
src/views/homecomponents/EquipmentAnalysis/AlarmMonitor.vue

@@ -1,24 +1,67 @@
 <template>
   <div class="container">
-    侧边栏
+    <!-- 简单模糊查询 -->
+    <!-- <input type="text" placeholder="请输入..." v-model="searchVal" />
+    <ul>
+      <li
+        v-for="(item, index) in NewItems"
+        :key="index"
+        :value="item.value"
+        v-text="item.name"
+      ></li>
+    </ul> -->
   </div>
 </template>
 <script>
+import _ from "lodash";
 export default {
   name: "AlarmMonitor",
-  components:{
-  },
+  components: {},
   data() {
     return {
+      searchVal: "",
+      items: [
+        {
+          name: "上海",
+          value: "sh",
+        },
+        {
+          name: "北京",
+          value: "bj",
+        },
+        {
+          name: "重庆",
+          value: "cq",
+        },
+        {
+          name: "嗨嗨嗨",
+          value: "hhh",
+        },
+        {
+          name: "海上",
+          value: "hs",
+        },
+        {
+          name: "京都",
+          value: "jd",
+        },
+      ],
     };
   },
-  mounted() {
+  mounted() {},
+  computed: {
+    NewItems() {
+      var _this = this;
+      var NewItems = [];
+      this.items.map(function (item) {
+        if (item.name.search(_this.searchVal) != -1) {
+          NewItems.push(item);
+        }
+      });
+      return NewItems;
+    },
   },
-  methods: {
-   
-  }
+  methods: {},
 };
 </script>
-<style scoped lang="stylus">
-
-</style>
+<style scoped lang="stylus"></style>

+ 282 - 8
src/views/homecomponents/EquipmentAnalysis/EquipmentMonitor.vue

@@ -1,24 +1,298 @@
 <template>
   <div class="container">
-    侧边栏
+    <!-- :prop="`formDynamic[${index}].alarmType`" -->
+    <Button type="primary" @click="showModal">Display dialog box</Button>
+    <Modal
+      v-model="modal1"
+      :title="title"
+      width="40"
+      ref="modalGrag"
+      draggable
+      reset-drag-position
+      :mask-closable="false"
+      class-name="common-modal"
+    >
+      <Form ref="formDynamic" :model="formCustom" :label-width="0">
+        <Row
+          v-for="(item, index) in formCustom.formDynamic"
+          :key="index"
+          style="position: relative"
+        >
+          <Col span="2">
+            {{ item.name + (index + 1) }}
+          </Col>
+          <Col span="16">
+            <Row v-for="(val, i) in item.formItems" :key="i">
+              <Col span="4">
+                <FormItem
+                  :prop="'formDynamic.' + index + '.formItems.' + i + '.logic'"
+                  :rules="{
+                    required: true,
+                    message: '请选择告警等级',
+                    trigger: 'change',
+                  }"
+                  style="display:flex"
+                >
+                <span>{{val.sublogic}}</span>
+                  <Select
+                    v-model="val.logic"
+                    style="width: 75%"
+                    placeholder="告警等级"
+                    :disabled="val.disabled"
+                  >
+                    <Option
+                      v-for="subItem in alarmList"
+                      :value="subItem.value"
+                      :key="subItem.value"
+                      >{{ subItem.label }}</Option
+                    >
+                  </Select>
+                </FormItem>
+              </Col>
+              <Col span="4">
+                <FormItem
+                  :prop="'formDynamic.' + index + '.formItems.' + i + '.baohan'"
+                  :rules="{
+                    required: true,
+                    message: '请选择包含关系',
+                    trigger: 'change',
+                  }"
+                >
+                  <Select
+                    v-model="val.baohan"
+                    style="width: 100%"
+                    placeholder="告警等级"
+                    :disabled="val.disabled"
+                  >
+                    <Option
+                      v-for="item in alarmList"
+                      :value="item.value"
+                      :key="item.value"
+                      >{{ item.label }}</Option
+                    >
+                  </Select>
+                </FormItem>
+              </Col>
+              <Button
+                @click="handleRemove(index)"
+                v-if="i != 0"
+                style="position: absolute; right: 0px"
+                >删除</Button
+              >
+            </Row>
+          </Col>
+          <Col span="2">
+            {{ item.text }}
+          </Col>
+          <Col span="2">
+            <FormItem
+              :prop="'formDynamic.'+index+'.alarmType'"
+              :rules="{
+                required: true,
+                message: '请选择告警等级',
+                trigger: 'change',
+              }"
+            >
+              <Select
+                v-model="item.alarmType"
+                style="width: 100%"
+                placeholder="告警等级"
+                :disabled="item.disabled"
+              >
+                <Option
+                  v-for="firstitem in alarmList"
+                  :value="firstitem.value"
+                  :key="firstitem.value"
+                  >{{ firstitem.label }}</Option
+                >
+              </Select>
+            </FormItem>
+          </Col>
+          <Col span="2">
+            <Button
+              type="dashed"
+              @click="handleAdd('formDynamic')"
+              icon="md-add"
+              v-if="
+                index == formCustom.formDynamic.length - 1 && title == '新增'
+              "
+              >新增</Button
+            >
+            <Button
+              type="dashed"
+              @click="handleEdit('formDynamic')"
+              icon="md-add"
+              v-if="title == '编辑' && showEdit"
+              >编辑</Button
+            >
+            <Button
+              type="dashed"
+              @click="handleSave('formDynamic')"
+              icon="md-add"
+              v-if="title == '编辑' && !showEdit"
+              >保存</Button
+            >
+          </Col>
+        </Row>
+        <FormItem class="sub-add">
+          <span @click="handleAddSub('formDynamic')"
+            >新增一条子策略 子策略与现有子策略间为</span
+          >
+          <Select
+            v-model="formCustom.logical"
+            placeholder="逻辑判断"
+            style="width: 200px"
+          >
+            <Option
+              v-for="item in cityList"
+              :value="item.value"
+              :key="item.value"
+              >{{ item.label }}</Option
+            > </Select
+          >关系
+        </FormItem>
+      </Form>
+    </Modal>
   </div>
 </template>
 <script>
 export default {
   name: "EquipmentMonitor",
-  components:{
-  },
+  components: {},
   data() {
     return {
+      modal1: false,
+      cityList: [
+        {
+          value: "与",
+          label: "与",
+        },
+        {
+          value: "或",
+          label: "或",
+        },
+        {
+          value: "非",
+          label: "非",
+        },
+      ],
+      alarmList: [
+        {
+          value: "一级",
+          label: "一级",
+        },
+        {
+          value: "二级",
+          label: "二级",
+        },
+        {
+          value: "三级",
+          label: "三级",
+        },
+      ],
+      formCustom: {
+        formDynamic: [
+          {
+            name: "策略",
+            formItems: [
+              {
+                logic: "",
+                baohan: "",
+                disabled: false,
+                sublogic: ''
+              },
+            ],
+            text: "判定为",
+            alarmType: "",
+            disabled: false,
+          },
+        ],
+        logical : ''
+      },
+      title: "新增",
+      showEdit: true,
     };
   },
-  mounted() {
-  },
+  mounted() {},
   methods: {
-   
-  }
+    handleAdd(name) {
+      this.$refs[name].validate((valid) => {
+        if (valid) {
+          this.formCustom.formDynamic.push({
+            name: "策略",
+            formItems: [
+              {
+                logic: "",
+                baohan: "",
+                disabled: false,
+                sublogic: ''
+              },
+            ],
+            text: "判定为",
+            alarmType: "",
+          });
+        }
+      });
+    },
+    handleAddSub(name) {
+      console.log(this.formCustom.logical)
+      this.$refs[name].validate((valid) => {
+        if (valid) {
+          this.formCustom.formDynamic[
+            this.formCustom.formDynamic.length - 1
+          ].formItems.push({
+            logic: "",
+            baohan: "",
+            disabled: false,
+            sublogic: this.formCustom.logical
+            // sublogic: this.formCustom.formDynamic[this.formCustom.formDynamic.length - 1]
+          });
+          this.formCustom.logical = ''
+        }
+      });
+    },
+    handleRemove(index) {
+      this.formCustom.formDynamic[
+        this.formCustom.formDynamic.length - 1
+      ].formItems.splice(index, 1)
+    },
+    showModal() {
+      this.modal1 = true
+      this.title = "新增"
+      // this.title = "编辑"
+      // this.formCustom.formDynamic = this.getStrategy(
+      //   this.formCustom.formDynamic
+      // )
+    },
+    getStrategy(arr) {
+      return arr.map((v, index) => {
+        v.disabled = !v.disabled
+        if (v.formItems) v.formItems = this.getStrategy(v.formItems);
+        return v;
+      });
+    },
+    handleEdit() {
+      this.formCustom.formDynamic = this.getStrategy(
+        this.formCustom.formDynamic
+      );
+      this.showEdit = false;
+    },
+    handleSave() {
+      // this.formCustom.formDynamic = this.getStrategy(
+      //   this.formCustom.formDynamic
+      // );
+      // this.showEdit = true
+    },
+  },
 };
 </script>
 <style scoped lang="stylus">
+.sub-add {
+  display: flex;
+  align-items: center;
+}
 
-</style>
+>>> .ivu-col {
+  position: initial;
+}
+</style>

+ 2 - 3
vue.config.js

@@ -7,7 +7,7 @@ module.exports = {
       open: false,//配置自动启动浏览器 
       proxy: { // 设置代理
       '/metroapi': {
-        target: 'http://192.168.20.247:8088',// http://192.168.20.58:8086 http://192.168.20.247:8088
+        target: 'http://192.168.20.58:8088',// http://192.168.20.58:8086 http://192.168.20.247:8088
         changeOrigin: true, //允许跨域
         pathRewrite: {
             '^/metroapi': ''
@@ -56,8 +56,7 @@ module.exports = {
               ]
           },
       }
-  }
-    
+  }   
     // chainWebpack: (config) => {
     //   config.entry('main').add('babel-polyfill');
     // },