洪城义警-安卓端
blame | history | patch | commit | commitdiff | ignore whitespace
Administrator
2021-06-17 ffc9f497ed62c2d0814dfdf64c80c2f8fd8a769f 
 xcxMapJQ/xcxmap.html


@@ -2,143 +2,135 @@


<html>




<head>


   <meta charset="utf-8" />


   <meta name="viewport" content="width=device-width, initial-scale=1">


   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />


   <title>地图</title>


   <!-- vue -->


   <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>


    <meta charset="utf-8" />


    <meta name="viewport" content="width=device-width, initial-scale=1">


    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />


    <title>地图</title>


    <!-- vue -->


    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>




   <!-- leaflet支持 -->


   <script src="./lid/leaflet.js"></script>


   <link rel="stylesheet" href="./lid/leaflet.css" />


    <!-- leaflet支持 -->


    <script src="./lid/leaflet.js"></script>


    <link rel="stylesheet" href="./lid/leaflet.css" />




   <!-- leaflet聚合支持 -->


   <link rel="stylesheet" href="./lid/MarkerCluster.css" />


   <link rel="stylesheet" href="./lid/MarkerCluster.Default.css" />


   <script src="./lid/leaflet.markercluster-src.js"></script>


    <!-- leaflet聚合支持 -->


    <link rel="stylesheet" href="./lid/MarkerCluster.css" />


    <link rel="stylesheet" href="./lid/MarkerCluster.Default.css" />


    <script src="./lid/leaflet.markercluster-src.js"></script>




   <!-- layui支持 -->


   <!-- <link rel="stylesheet" href="../map/lib/layui/css/layui.css" media="all"> -->


   <!-- <script src="../map/lib/layui/layui.js" charset="utf-8"></script> -->


	


   <!-- 百度地图api -->


   <script type="text/javascript" src="https://mapapi.qq.com/web/mapComponents/geoLocation/v/geolocation.min.js"></script>


    <!-- layui支持 -->


    <!-- <link rel="stylesheet" href="../map/lib/layui/css/layui.css" media="all"> -->


    <!-- <script src="../map/lib/layui/layui.js" charset="utf-8"></script> -->




   <!-- axios支持 -->


   <script src="../map/lib/axios.js"></script>


    <!-- 百度地图api -->


    <script type="text/javascript" src="https://mapapi.qq.com/web/mapComponents/geoLocation/v/geolocation.min.js"></script>




   <!-- elementui -->


   <script src="../map/lib/elementUi.js"></script>


   <!-- <link rel="stylesheet" href="../map/lib/elementUi.css"> -->


   <link rel="stylesheet" href="./css/elementUI.css">


   <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->


    <!-- axios支持 -->


    <script src="../map/lib/axios.js"></script>




   <!-- jqurey -->


   <script src="../map/lib/jquery.js" charset="utf-8"></script>


    <!-- elementui -->


    <script src="../map/lib/elementUi.js"></script>


    <!-- <link rel="stylesheet" href="../map/lib/elementUi.css"> -->


    <link rel="stylesheet" href="./css/elementUI.css">


    <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->




   <!-- 微信支持 -->


   <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>


   <!-- <script src="./js/wx.js"></script> -->


    <!-- jqurey -->


    <script src="../map/lib/jquery.js" charset="utf-8"></script>




   <!-- omyself支持 -->


   <link rel="stylesheet" href="./css/body.css" />


    <!-- 微信支持 -->


    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>


    <!-- <script src="./js/wx.js"></script> -->




   <!-- myDomMove -->


   <script src="./js/move.js"></script>


   <!-- sha1加密 -->


   <!-- <script src="./js/sha1.js"></script> -->


   <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>


    <!-- omyself支持 -->


    <link rel="stylesheet" href="./css/body.css" />




    <!-- myDomMove -->


    <script src="./js/move.js"></script>


    <!-- sha1加密 -->


    <!-- <script src="./js/sha1.js"></script> -->


    <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>


</head>




<body>


   <div id="mapVue">


      <div class="dingwei" @click="locationMap">


         <img style="width: 80%;height: 80%;" src="./img/dingwei.png" alt="">


      </div>


      <div id="map"></div>


      <div id="seedata">


         <div class="title" @click="titleClick">


            {{seedata.deviceName}}


            <div class="title-span"> </div>


            {{seedata.deviceNumber}}


            <div class="title-span"> </div>


            <div class="title-span"> </div>


         </div>


         <div class="main">


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/shiyongren.png" alt="">


                  使用方:


               </div>


               <div class="f-m-o-center">{{seedata.deptName}}</div>


            </div>


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/ren.png" alt="">


                  接警人:


               </div>


               <div class="f-m-o-center">{{seedata.alarmPeople}}</div>


            </div>


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/dianhua.png" alt="">


                  联系电话:


               </div>


               <div class="f-m-o-center">{{seedata.phoneNumber}}</div>


            </div>


            <el-divider></el-divider>


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/shijian.png" alt="">


                  报警时间:


               </div>


               <div class="f-m-o-center">{{seedata.alarmTime}}</div>


            </div>


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/leixing.png" alt="">


                  报警类型:


               </div>


               <div class="f-m-o-center">{{seedata.alarmType}}</div>


            </div>


            <el-divider></el-divider>


            <div class="f-m-once">


               <div class="f-m-o-title">


                  <img class="f-m-o-t-img" src="./img/beizhu.png" alt="">


                  备注:


               </div>


               <div class="f-m-o-center">{{seedata.bz}}</div>


            </div>


            <div class="but">


               <div class="buta" @click="shipingClick(true)">


                  <img class="b-b-img" src="./img/shiping.png" alt="">


               </div>


               <!-- 加上display： none不会闪烁 -->


               <div class="shipingPopup" v-show="shipingPopupShow" style="display: none;">


                  <div class="s-p-main">


                     <div @click="shipingClick(false)">


                        <img src="./img/gaunbi.png" alt="" class="s-p-gaunbi">


                     </div>


                     <!-- <video style="height: 550px; width: 100%" controls="controls"


                        id="real_video_shipingPopup" src=""></video> -->


                     <video style="height: 550px; width: 100%" controls="controls" :src="shipingM3u8Url"></video>


                  </div>


               </div>


               <div class="butb" @click="resultFeedbackClick">结果反馈</div>


    <div id="mapVue">


        <div class="dingwei" @click="locationMap">


            <img style="width: 80%;height: 80%;" src="./img/dingwei.png" alt="">


        </div>


        <div id="map">


            <div class="title" @click="titleClick">


                <span class="device-name">{{seedata.deviceName}}</span>


                <span class="device-number">{{seedata.deviceNumber}}</span>


            </div>


        </div>


        <div id="seedata">


            <div class="main">


                <div class="div-alarm-people">


                    <div class="f-m-once">


                        <img class="f-m-o-t-img" src="./img/ren.png" alt="">


                        <div class="f-m-o-title">接警人</div>


                        <div class="f-m-o-center">{{seedata.alarmPeople}}</div>


                    </div>


                    <div class="f-m-once-phone-number">


                        <img class="f-m-o-t-img" src="./img/dianhua.png" alt="">


                        <div class="f-m-o-title">联系电话</div>


                        <div class="f-m-o-center">{{seedata.phoneNumber}}</div>


                    </div>


                </div>




               <div class="butc">


                  <img class="b-b-img" src="./img/huifang.png" alt="">


                  <!-- <div class="huifangPopup">


                <div class="interval"></div>




                <div class="div-alarm-people">


                    <div class="f-m-once">


                        <img class="f-m-o-t-img" src="./img/shijian.png" alt="">


                        <div class="f-m-o-title">报警时间</div>


                        <div class="f-m-o-center">{{seedata.alarmTime}}</div>


                    </div>


                    <div class="f-m-once-alarm-type">


                        <img class="f-m-o-t-img" src="./img/leixing.png" alt="">


                        <div class="f-m-o-title">报警类型</div>


                        <div class="f-m-o-center">{{seedata.alarmType}}</div>


                    </div>


                </div>


                <div class="interval"></div>




                <div class="div-alarm-people">


                    <div class="f-m-once-desc">


                        <img class="f-m-o-t-img-desc" src="./img/beizhu.png" alt="">


                        <div class="f-m-o-title-desc">备注</div>


                        <div class="f-m-o-center-desc">{{seedata.bz}}</div>


                    </div>


                </div>




                <div class="interval"></div>


                <div class="but">


                    <div class="buta" @click="shipingClick(true)">


                        <img class="b-b-img" src="./img/shiping.png" alt="">


                    </div>


                    <!-- 加上display： none不会闪烁 -->


                    <div class="shipingPopup" v-show="shipingPopupShow" style="display: none;">


                        <div class="s-p-main">


                            <div @click="shipingClick(false)">


                                <img src="./img/gaunbi.png" alt="" class="s-p-gaunbi">


                            </div>


                            <!-- <video style="height: 550px; width: 100%" controls="controls"


                        id="real_video_shipingPopup" src=""></video> -->


                            <video style="height: 550px; width: 100%" controls="controls" :src="shipingM3u8Url"></video>


                        </div>


                    </div>


                    <div class="butb" @click="resultFeedbackClick">结果反馈</div>




                    <div class="butc">


                        <img class="b-b-img" src="./img/huifang.png" alt="">


                        <!-- <div class="huifangPopup">


                     回放


                  </div> -->


               </div>


            </div>


         </div>


      </div>


   </div>


   <!-- vue渲染 -->


   <script src="./js/vueMain.js"></script>


                    </div>


                </div>


            </div>


        </div>


    </div>


    <!-- vue渲染 -->


    <script src="./js/vueMain.js"></script>


</body>




</html>