历史报警的modal等

ebc-middle-platform/src/modules/authorization/menu-authorization.vue

@@ -22,6 +22,7 @@
      <t-transfer
        ref="transfer"
        :data="dataTable"
        :target-keys="targetKeys"
        :selected-keys="targetKeysTable"
        :operations="['← 绑定','解绑 →']"
        :titles="['已关联菜单','可关联菜单']"
@@ -35,7 +36,7 @@
          ></t-tree>
        </div>
        <div slot="listBodyRight" slot-scope="tableRight">
          <t-tree :multiple="true"
          <t-tree ref="rightTree" :multiple="true"
                  :with-ancestors="true"
                  :with-descendants="true"
                  :node-data="tableRight.data" @select="changeRightTree"
@@ -130,6 +131,7 @@ export default {
        }
      ],
      targetKeysTable: [],
      targetKeys: [],
      copyData: [],
      removeData: []
    }
@@ -156,7 +158,7 @@ export default {
        })
        this.removeData = []
      }
      console.log(this.dataTable)
      console.log(this.targetKeysTable)
    },
    changeLeftTree(ids) {
      console.log(ids)
@@ -209,6 +211,21 @@ export default {
                index: dataIndex
              })
            }
            if (includeFlag) {
              var includeIndex = 0
              this.dataTable.forEach((e, index) => {
                if (e.id === id) {
                  includeIndex = index
                }
              })
              this.removeData.push({
                key: id,
                label: this.$refs.leftTree.getNodeStateById(id).label,
                title: this.$refs.leftTree.getNodeStateById(id).title,
                id: id,
                index: includeIndex
              })
            }
          } else {
            if (includeFlag) {
              var includeIndex = 0
@@ -241,6 +258,85 @@ export default {
    },
    changeRightTree(ids) {
      console.log(ids)
      var transferId = []
      ids.forEach(id => {
        console.log(this.$refs.rightTree.getNodeStateById(id))
        if (this.$refs.rightTree.getNodeStateById(id).children && this.isContained(ids, this.$refs.rightTree.getNodeStateById(id).children)) {
          // 修改子节点的pid
          var includeFlag = true
          this.$refs.rightTree.getNodeStateById(id).children.forEach(elementChild => {
            // 不含在选中的ids
            if (ids.indexOf(elementChild) === -1) {
              includeFlag = false
              // this.dataTable.forEach(elementChildTable => {
              //   if (elementChildTable.id === elementChild) {
              //     if (elementChildTable.pid.indexOf('copy') === -1) {
              //       elementChildTable.pid = 'copy' + elementChildTable.pid
              //     }
              //   }
              // })
            } else {
              // this.dataTable.forEach(elementChildTable => {
              //   if (elementChildTable.id === elementChild) {
              //     if (elementChildTable.pid.indexOf('copy') !== -1) {
              //       elementChildTable.pid = elementChildTable.pid.slice(4)
              //     }
              //   }
              // })
              this.dataTable.forEach(elementChildTable => {
                if (elementChildTable.id === elementChild) {
                  if (elementChildTable.pid.indexOf('copy') === -1) {
                    elementChildTable.pid = 'copy' + elementChildTable.pid
                  }
                }
              })
            }
          })
          if (includeFlag) {
            transferId.push(id)
            var includeIndex = 0
            this.dataTable.forEach((e, index) => {
              if (e.id === id) {
                includeIndex = index
              }
            })
            this.removeData.push({
              key: id,
              label: this.$refs.rightTree.getNodeStateById(id).label,
              title: this.$refs.rightTree.getNodeStateById(id).title,
              id: id,
              index: includeIndex
            })
          } else {
            var dataIndex = 0
            this.dataTable.forEach((e, index) => {
              if (e.id === id) {
                dataIndex = index
              }
            })
            this.copyData.push({
              key: 'copy' + id,
              label: this.$refs.rightTree.getNodeStateById(id).label,
              title: this.$refs.rightTree.getNodeStateById(id).title,
              id: 'copy' + id,
              index: dataIndex
            })
          }
        } else {
          transferId.push(id)
        }
        if (id.indexOf('copy') === -1) {
          // transferId.push(id)
        } else {
          console.log(this.$refs.rightTree.getNodeStateById(id).children)
          if (!this.$refs.rightTree.getNodeStateById(id).children) {
            console.log(123213, id)
          }
        }
      })
      console.log(transferId)
      this.targetKeysTable = transferId
    },
    onPagerChange(page) {

ebc-middle-platform/src/modules/call-help/current.vue

@@ -87,6 +87,8 @@ export default {
    var maplayer = null
    maplayer = Ai.TileLayer('http://192.168.74.189:9999/tdtvector')
    this.map.addLayer(maplayer)
    var la = Ai.WMTSLayer('http://192.168.74.216:5071/gisserver/dzht:dzht/wmts')
    this.map.addLayer(la)
    var icon = Ai.Icon({
      // 设置图标URL路径
      iconUrl: '/static/images/worker.png',

ebc-middle-platform/src/modules/call-help/history.scss

@@ -61,4 +61,99 @@
  .table-pager{
    margin: 20px auto;
  }
}
.modal{
  .operate{
    display: flex;
    line-height: 30px;
    >div{
      margin-right: 10px;
    }
    .playback-btn{
      margin-left: 20px;
    }
  }
  #playback{
    height: 600px;
    margin-top: 10px;
  }
}
.aimap-popup-content-wrapper{
  background: #344979!important;
  .aimap-popup-content{
    margin: 0;
  }
}
.aimap-popup-tip-container{
  .aimap-popup-tip{
    background-color: #344979;
  }
} 
.tips-item{
  // width: 300px;
  // margin: 10px 30px;
  // border: 1px solid #E0E0E0;
  border-radius: 5px;
  background: #344979;
  .top{
    display: flex;
    border-bottom: 1px solid #99A3BA;
    height: 40px;
    line-height: 40px;
    padding-left: 20px;
    font-size: 12px;
    color: #ffffff;
    .user-pic{
      width: 25px;
      height: 25px;
      border-radius: 50%;
      background-image: url('/static/images/user.png');
      background-size: 100% 100%;
      margin: 7.5px 5px 0 0;
    }
    .alarm{
      color: #F5222D;
      background-color: #343E6B;
      margin: 7.5px 0 0 5px;
      padding: 0 5px;
      font-size: 8px;
      height: 25px;
      line-height: 25px;
    }
    .hand-alarm{
      color: #FAAD14;
      background-color:#495571;
      margin: 7.5px 0 0 5px;
      padding: 0 5px;
      font-size: 8px;
      height: 25px;
      line-height: 25px;
    }
  }
  .middle{
    padding-left: 20px;
    line-height: 30px;
    font-size: 10px;
    color: #ffffff;
    .row{
      display: flex;
      margin: 0;
      justify-content: space-between;
      >div{
        flex: 1;
        text-align: left;
      }
    }
  }
  .footer{
    height: 40px;
    border-top: 1px solid #E0E0E0;
    display: flex;
    justify-content: flex-end;
    button{
      height: 25px;
      line-height: 25px;
      margin: 7.5px 10px 0 0;
    }
  }
}

ebc-middle-platform/src/modules/call-help/history.vue

@@ -49,7 +49,7 @@
          width="120"
        >
          <template slot-scope="scope">
            <a href="javascript:void(0)" size="sm" @click="handleClick(scope.row)">救援回放</a>
            <a href="javascript:void(0)" size="sm" @click="rescuePlayback(scope.row)">救援回放</a>
            <a href="javascript:void(0)" size="sm" @click="remove(scope.$index)">删除</a>
          </template>
        </t-table-column>
@@ -63,6 +63,26 @@
               @on-change="onPagerChange">
      </t-pager>
    </div>
    <t-modal :visibled.sync="modal" :footer-visibled="false" class="modal" title="救援回放" width="1200px">
      <div class="operate">
        <div class="label">速度:</div>
        <div class="input-rule">
          <t-select v-model="speed">
            <t-option value="4">4X</t-option>
            <t-option value="2">2X</t-option>
            <t-option value="1">1X</t-option>
            <t-option value="0.5">0.5X</t-option>
            <t-option value="0.25">0.25X</t-option>
          </t-select>
        </div>
        <div class="playback-btn">
          <t-button color="secondary" icon="video-outline" class="reset-btn" @click="onReset">回放</t-button>
        </div>
      </div>
      <div id="playback">
      </div>
    </t-modal>
  </div>
</template>
<script>
@@ -121,24 +141,145 @@ export default {
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          },
          {
            name: '王小明',
            number: 'ZDBH0001',
            type: '落水告警',
            address: '113.445294°E 23.157791°N',
            alarmTime: '2020.7.10 08:21:43',
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          },
          {
            name: '王小明',
            number: 'ZDBH0001',
            type: '落水告警',
            address: '113.445294°E 23.157791°N',
            alarmTime: '2020.7.10 08:21:43',
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          },
          {
            name: '王小明',
            number: 'ZDBH0001',
            type: '落水告警',
            address: '113.445294°E 23.157791°N',
            alarmTime: '2020.7.10 08:21:43',
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          },
          {
            name: '王小明',
            number: 'ZDBH0001',
            type: '落水告警',
            address: '113.445294°E 23.157791°N',
            alarmTime: '2020.7.10 08:21:43',
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          },
          {
            name: '王小明',
            number: 'ZDBH0001',
            type: '落水告警',
            address: '113.445294°E 23.157791°N',
            alarmTime: '2020.7.10 08:21:43',
            rescuePerson: '海事局A',
            rescueTime: '2020.7.3 11:22:16',
            rescueDuration: '10小时39分钟'
          }
        ],
        pager: {
          currentPage: 1,
          size: 10,
          total: 0
          total: 100
        }
      },
      queryCondition: {
        type: '',
        alarmPerson: ''
      },
      rangeDate: ''
      rangeDate: '',
      modal: false,
      speed: '1'
    }
  },
  mounted() {
    this.table.data = this.table.data.concat(this.table.data)
    this.table.pager.total = this.table.data.length
    this.map = new Ai.Map('playback', {
      ak: 'MTYwMTEMTAwMU1UWXdNVEV3TXpRek16STVOU014TnpRdw__',
      center: [39.915599, 116.406568],
      zoom: 5
    })
    var maplayer = null
    maplayer = Ai.TileLayer('http://192.168.74.189:9999/tdtvector')
    this.map.addLayer(maplayer)
    var la = Ai.WMTSLayer('http://192.168.74.216:5071/gisserver/dzht:dzht/wmts')
    this.map.addLayer(la)
    var icon = Ai.Icon({
      // 设置图标URL路径
      iconUrl: '/static/images/worker(1).png',
      // 设置图标大小
      iconSize: [20, 20],
      // 设置点对象和图标的相对偏移量
      iconAnchor: [0, 0]
    })
    var point = Ai.Point([29.86089241772908, 122.09930419921876], {icon: icon})
    point.on('click', (e) => {
      console.log(e)
      var content = '<div class="tips-item"><div class="top"><div class="user-pic"><t-icon icon="user-outline"></t-icon></div><div>张三</div><div class="hand-alarm">救援人员</div></div><div class="middle"><div class="row">' +
            '<div>终端编号</div>' +
            '<div>ZDBH0001</div>' +
          '</div>' +
          '<div class="row">' +
            '<div>最新定位时间</div>' +
            '<div>2020.08.13 08:24:32</div>' +
          '</div></div></div>'
      var popup = Ai.Popup({minWidth: 300, offset: [0, -10], autoClose: false})
      // 设置弹出框弹出位置
        .setLatLng({lat: 29.86089241772908, lng: 122.09930419921876})
      // 设置弹出框弹出内容
        .setContent(content)
        .openOn(this.map)
    })
    this.map.addLayer(point)
    point = Ai.Point([29.388158098102554, 122.45361328125], {icon: Ai.Icon({
      // 设置图标URL路径
      iconUrl: '/static/images/worker.png',
      // 设置图标大小
      iconSize: [20, 20],
      // 设置点对象和图标的相对偏移量
      iconAnchor: [0, 0]
    })})
    point.on('click', (e) => {
      console.log(e)
      var content = '<div class="tips-item"><div class="top"><div class="user-pic"><t-icon icon="user-outline"></t-icon></div><div>张三</div><div class="alarm">报警人员</div></div><div class="middle"><div class="row">' +
            '<div>终端编号</div>' +
            '<div>ZDBH0001</div>' +
          '</div>' +
          '<div class="row">' +
            '<div>最新定位时间</div>' +
            '<div>2020.08.13 08:24:32</div>' +
          '</div></div></div>'
      var popup = Ai.Popup({minWidth: 300, offset: [0, -10], autoClose: false})
      // 设置弹出框弹出位置
        .setLatLng({lat: 29.388158098102554, lng: 122.45361328125})
      // 设置弹出框弹出内容
        .setContent(content)
        .openOn(this.map)
    })
    this.map.addLayer(point)
    var lineWktstr = 'LINESTRING ( 122.09930419921876 29.86089241772908,122.18582153320314 29.6913335169976,122.21878051757814 29.42494595179543,122.45361328125 29.388158098102554)'
    var polyline = Ai.Polyline(lineWktstr, {color: 'red'})
    this.map.addLayer(polyline)
    this.map.on('click', function(evt) {
      var lat = evt.latlng.lat // 点击地图时的纬度
      var lng = evt.latlng.lng // 点击地图时的经度
      console.log(lng, lat)
    })
  },
  methods: {
    onChange(value) {
@@ -154,10 +295,13 @@ export default {
    },
    onPagerChange(page) {
      console.log(page)
    },
    onSizeChange(number) {
      console.log(number, this.table.pager.currentPage)
    },
    rescuePlayback(row) {
      this.modal = true
    }
  }
}

ebc-middle-platform/src/modules/system-management/map-mark.vue

@@ -164,7 +164,7 @@ export default {
  },
  mounted() {
    this.map = new Ai.Map('modalMap', {
      ak: 'MTYwMDkMTAwMU1UWXdNRGt4T0RnNU5UVXlNaU14TnpRdw__',
      ak: 'MTYwMDkMTAwMU1UWXdNRGs1T0RZeE1EZzNPU014TnpRdw__',
      center: [39.915599, 116.406568],
      zoom: 5
    })