|  |  |  | 
|---|
|  |  |  | @focus="chooseDate2" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- <el-card class="box-card" style="width: 274px; margin: 13px auto"> --> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- <div v-else style="height: 180px; width: 274px; overflow-x: hidden"> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | style=" | 
|---|
|  |  |  | width: 272px; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | height: 180px; | 
|---|
|  |  |  | line-height: 140px; | 
|---|
|  |  |  | font-size: 14px; | 
|---|
|  |  |  | color: #5a5c60; | 
|---|
|  |  |  | " | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 无飞行记录 | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> --> | 
|---|
|  |  |  | <!-- </el-card> --> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | style="width: 274px; margin: 10px auto; border-radius: 8px" | 
|---|
|  |  |  | class="coll" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <!--accordion 手风琴模式--> | 
|---|
|  |  |  | <el-collapse v-show="shou1 === true" v-loading="loading"> | 
|---|
|  |  |  | <el-collapse | 
|---|
|  |  |  | v-show="shou1 === true" | 
|---|
|  |  |  | v-loading="loading" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-collapse-item | 
|---|
|  |  |  | style="text-indent: 2em; position: relative; padding-botton: 10px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 
|---|
|  |  |  | <img | 
|---|
|  |  |  | style="position: absolute; left: 18px" | 
|---|
|  |  |  | src="../../assets/images/uav/uav.png" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <span | 
|---|
|  |  |  | style="display: inline-block; position: absolute; left: 20px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 该日期暂无无人机数据</span | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 该日期暂无无人机数据</span> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-collapse-item> | 
|---|
|  |  |  | </el-collapse> | 
|---|
|  |  |  | 
|---|
|  |  |  | <img | 
|---|
|  |  |  | style="position: absolute; left: 18px" | 
|---|
|  |  |  | src="../../assets/images/uav/uav.png" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <span | 
|---|
|  |  |  | style="display: inline-block; position: absolute; left: 20px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | {{ item1.name }}</span | 
|---|
|  |  |  | > | 
|---|
|  |  |  | {{ item1.name }}</span> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <el-scrollbar style="height: 200px; overflow-x: hidden"> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | 
|---|
|  |  |  | <el-radio-button label="03" /> | 
|---|
|  |  |  | <el-radio-button label="TVOC" /> | 
|---|
|  |  |  | </el-radio-group> | 
|---|
|  |  |  | <div v-if="selecttrue === 2" class="Duo"> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | v-if="selecttrue === 2" | 
|---|
|  |  |  | class="Duo" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <div class="spantuu"> | 
|---|
|  |  |  | <span>无人机飞行高度范围(米): </span> | 
|---|
|  |  |  | <el-input ref="uvas" v-model="tallone" class="inputtu" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | ref="uvas" | 
|---|
|  |  |  | v-model="tallone" | 
|---|
|  |  |  | class="inputtu" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | -- | 
|---|
|  |  |  | <el-input ref="uvas" v-model="talltwo" class="inputtu" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | ref="uvas" | 
|---|
|  |  |  | v-model="talltwo" | 
|---|
|  |  |  | class="inputtu" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- <el-select v-model="Duovalue" placeholder="其他因子" class="slee"> | 
|---|
|  |  |  | <el-option | 
|---|
|  |  |  | 
|---|
|  |  |  | </el-option> | 
|---|
|  |  |  | </el-select> --> | 
|---|
|  |  |  | <div class="spantu"> | 
|---|
|  |  |  | <span>图形边长(米): </span | 
|---|
|  |  |  | ><el-input | 
|---|
|  |  |  | <span>图形边长(米): </span><el-input | 
|---|
|  |  |  | ref="uvas" | 
|---|
|  |  |  | v-model="uvasize" | 
|---|
|  |  |  | class="inputtu" | 
|---|
|  |  |  | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <el-select v-model="Duovalue" placeholder="其他因子" class="slee"> | 
|---|
|  |  |  | <el-select | 
|---|
|  |  |  | v-model="Duovalue" | 
|---|
|  |  |  | placeholder="其他因子" | 
|---|
|  |  |  | class="slee" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-option | 
|---|
|  |  |  | v-for="item in optionsduo" | 
|---|
|  |  |  | :key="item.code" | 
|---|
|  |  |  | 
|---|
|  |  |  | ></el-input> | 
|---|
|  |  |  | </div> --> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div v-if="selecttrue === 1" style="margin-left: 10px"> | 
|---|
|  |  |  | <el-button type="primary" style="margin-top: 10px" @click="gengD"> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | v-if="selecttrue === 1" | 
|---|
|  |  |  | style="margin-left: 10px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-button | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | style="margin-top: 10px" | 
|---|
|  |  |  | @click="gengD" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 更多条件 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 6参设定 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | <el-button class="gengD" @click="shou"> 收起 </el-button> | 
|---|
|  |  |  | <el-button type="primary" @click="selectDuo"> 查询 </el-button> | 
|---|
|  |  |  | <el-button | 
|---|
|  |  |  | class="gengD" | 
|---|
|  |  |  | @click="shou" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 收起 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | <el-button | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | @click="selectDuo" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 查询 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- <div class="Duo" v-if="selecttrue === 2"> | 
|---|
|  |  |  | 
|---|
|  |  |  | </div> --> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- <div v-if="noneData" class="noneData">当前时间没有飞行数据</div> --> | 
|---|
|  |  |  | <div id="map_container" v-loading="loading1" /> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | id="map_container" | 
|---|
|  |  |  | v-loading="loading1" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <div class="dataParameter"> | 
|---|
|  |  |  | <dir class="item"> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | v-for="(item, index) in temMergeDataList" | 
|---|
|  |  |  | v-show="index < 3" | 
|---|
|  |  |  | :key="index" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <p> {{ item.name }}:{{ item.value }}</p> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </dir> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | class="item1" | 
|---|
|  |  |  | style="margin-left: 10px;" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | v-for="(item, index) in temMergeDataList" | 
|---|
|  |  |  | v-show="index > 2" | 
|---|
|  |  |  | :key="index" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <p> {{ item.name }}:{{ item.value }}</p> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-main> | 
|---|
|  |  |  | </el-container> | 
|---|
|  |  |  | <el-dialog title="6参设定" :visible.sync="dialogFormVisible" width="1000px"> | 
|---|
|  |  |  | <el-descriptions title="国控6参" :column="3" border> | 
|---|
|  |  |  | <el-dialog | 
|---|
|  |  |  | title="6参设定" | 
|---|
|  |  |  | :visible.sync="dialogFormVisible" | 
|---|
|  |  |  | width="1000px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-descriptions | 
|---|
|  |  |  | title="国控6参" | 
|---|
|  |  |  | :column="3" | 
|---|
|  |  |  | border | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-descriptions-item | 
|---|
|  |  |  | label="PM2.5 | ug/m³" | 
|---|
|  |  |  | label-class-name="my-label" | 
|---|
|  |  |  | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 22 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="PM10 | ug/m³"> 34 </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="SO2 | ug/m³"> 4 </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="NO2 | ug/m³"> 16 </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="CO | mg/m³"> 0.5 </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="O3 | ug/m³"> 149 </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="PM10 | ug/m³"> | 
|---|
|  |  |  | 34 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="SO2 | ug/m³"> | 
|---|
|  |  |  | 4 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="NO2 | ug/m³"> | 
|---|
|  |  |  | 16 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="CO | mg/m³"> | 
|---|
|  |  |  | 0.5 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | <el-descriptions-item label="O3 | ug/m³"> | 
|---|
|  |  |  | 149 | 
|---|
|  |  |  | </el-descriptions-item> | 
|---|
|  |  |  | </el-descriptions> | 
|---|
|  |  |  | <!-- <el-descriptions title="设备标准值"  border> | 
|---|
|  |  |  | </el-descriptions> --> | 
|---|
|  |  |  | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 设备标准值 | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <el-table :data="sensorTableData" border> | 
|---|
|  |  |  | <el-table-column prop="sensorName" label="名称" /> | 
|---|
|  |  |  | <el-table-column prop="unit" label="单位" /> | 
|---|
|  |  |  | <el-table | 
|---|
|  |  |  | :data="sensorTableData" | 
|---|
|  |  |  | border | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="sensorName" | 
|---|
|  |  |  | label="名称" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column | 
|---|
|  |  |  | prop="unit" | 
|---|
|  |  |  | label="单位" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <el-table-column label="一级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab1" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab1" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | <!-- <span v-show="!scope.row.show">{{ scope.row.tab1 }}</span> --> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | <el-table-column label="二级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab2" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab2" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | <el-table-column label="三级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab3" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab3" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | <el-table-column label="四级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab4" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab4" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | <el-table-column label="五级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab5" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab5" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | <el-table-column label="六级"> | 
|---|
|  |  |  | <template slot-scope="scope"> | 
|---|
|  |  |  | <el-input v-model="scope.row.tab6" placeholder="请输入内容" /> | 
|---|
|  |  |  | <el-input | 
|---|
|  |  |  | v-model="scope.row.tab6" | 
|---|
|  |  |  | placeholder="请输入内容" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </el-table-column> | 
|---|
|  |  |  | </el-table> | 
|---|
|  |  |  | <div slot="footer" class="dialog-footer"> | 
|---|
|  |  |  | <el-button @click="dialogFormVisible = false"> 取 消 </el-button> | 
|---|
|  |  |  | <el-button type="primary" @click="customLevel"> 确 定 </el-button> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | slot="footer" | 
|---|
|  |  |  | class="dialog-footer" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-button @click="dialogFormVisible = false"> | 
|---|
|  |  |  | 取 消 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | <el-button | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | @click="customLevel" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 确 定 | 
|---|
|  |  |  | </el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-dialog> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | return json[value] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | dialogFormVisible: false, | 
|---|
|  |  |  | chosee: 1, | 
|---|
|  |  |  | 
|---|
|  |  |  | tab6: '50000', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | temMergeDataList: [] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | watch: { | 
|---|
|  |  |  | dataTypeValue(n, o) { | 
|---|
|  |  |  | dataTypeValue (n, o) { | 
|---|
|  |  |  | if (this.dataTypeValue === 'webSocket') { | 
|---|
|  |  |  | this.dateValue = [] | 
|---|
|  |  |  | this.historyView = false | 
|---|
|  |  |  | 
|---|
|  |  |  | this.webSocketView = false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | dateValue(n, o) { | 
|---|
|  |  |  | dateValue (n, o) { | 
|---|
|  |  |  | if (n === null) { | 
|---|
|  |  |  | this.dateValue = [] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | viewKey(n, o) { | 
|---|
|  |  |  | viewKey (n, o) { | 
|---|
|  |  |  | // console.log(n) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | deep: true, | 
|---|
|  |  |  | immediate: true, | 
|---|
|  |  |  | }, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | mounted() { | 
|---|
|  |  |  | mounted () { | 
|---|
|  |  |  | this.$nextTick(() => { | 
|---|
|  |  |  | this.initStart() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | 
|---|
|  |  |  | // this.getDate() | 
|---|
|  |  |  | // this.flyData() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created() { | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | this.newTime(this.timeValue) | 
|---|
|  |  |  | this.newDate() | 
|---|
|  |  |  | this.getDate() | 
|---|
|  |  |  | 
|---|
|  |  |  | // this.getFlyData() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | customLevel() { | 
|---|
|  |  |  | customLevel () { | 
|---|
|  |  |  | this.selectDuo() | 
|---|
|  |  |  | this.dialogFormVisible = false | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | selectDuo() { | 
|---|
|  |  |  | selectDuo () { | 
|---|
|  |  |  | // console.log(2115); | 
|---|
|  |  |  | if (this.chosee === 1) { | 
|---|
|  |  |  | this.$message.warning('请先在左侧选择无人机时间') | 
|---|
|  |  |  | 
|---|
|  |  |  | this.initStart(this.carData) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | chooseDate() { | 
|---|
|  |  |  | chooseDate () { | 
|---|
|  |  |  | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 | 
|---|
|  |  |  | this.getTimeAreaData(this.datenum) | 
|---|
|  |  |  | $('.coll').css('margin-top', '350px') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | chooseDate2() { | 
|---|
|  |  |  | chooseDate2 () { | 
|---|
|  |  |  | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 | 
|---|
|  |  |  | // this.getTimeAreaData(this.datenum) | 
|---|
|  |  |  | $('.coll').css('margin-top', '350px') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | chooseDate1() { | 
|---|
|  |  |  | chooseDate1 () { | 
|---|
|  |  |  | $('.coll').css('margin-top', '10px') | 
|---|
|  |  |  | // this.$refs.datePick.focus() // 选择日期后依旧触发焦点 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | gengD() { | 
|---|
|  |  |  | gengD () { | 
|---|
|  |  |  | // if (this.zhanK === 1) { | 
|---|
|  |  |  | //   this.$message.warning('请先在左侧选择无人机和时间') | 
|---|
|  |  |  | //   return | 
|---|
|  |  |  | 
|---|
|  |  |  | this.selecttrue = 2 | 
|---|
|  |  |  | $('.numss').css({ width: '1050px' }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | shou() { | 
|---|
|  |  |  | shou () { | 
|---|
|  |  |  | this.selecttrue = 1 | 
|---|
|  |  |  | $('.numss').css({ width: '700px' }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | parseTime(time, cFormat) { | 
|---|
|  |  |  | parseTime (time, cFormat) { | 
|---|
|  |  |  | if (arguments.length === 0 || !time) { | 
|---|
|  |  |  | return null | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | return time_str | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | newTime2(timeArr) { | 
|---|
|  |  |  | newTime2 (timeArr) { | 
|---|
|  |  |  | var arr = [] | 
|---|
|  |  |  | timeArr.map((v) => { | 
|---|
|  |  |  | var date = new Date(v) | 
|---|
|  |  |  | 
|---|
|  |  |  | return arr | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 进行经纬度转换为距离的计算 | 
|---|
|  |  |  | Rad(d) { | 
|---|
|  |  |  | Rad (d) { | 
|---|
|  |  |  | return (d * Math.PI) / 180.0 // 经纬度转换成三角函数中度分表形式。 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 计算距离,参数分别为第一点的纬度,经度;第二点的纬度,经度 | 
|---|
|  |  |  | GetDistance(lat1, lng1, lat2, lng2) { | 
|---|
|  |  |  | GetDistance (lat1, lng1, lat2, lng2) { | 
|---|
|  |  |  | var radLat1 = this.Rad(lat1) | 
|---|
|  |  |  | var radLat2 = this.Rad(lat2) | 
|---|
|  |  |  | var a = radLat1 - radLat2 | 
|---|
|  |  |  | 
|---|
|  |  |  | return s | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 日期格式化 | 
|---|
|  |  |  | newDate() { | 
|---|
|  |  |  | newDate () { | 
|---|
|  |  |  | var aData = new Date() | 
|---|
|  |  |  | var month = | 
|---|
|  |  |  | aData.getMonth() < 9 | 
|---|
|  |  |  | 
|---|
|  |  |  | this.sensorDate = aData.getFullYear() + '-' + month + '-' + date | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 时间格式化 | 
|---|
|  |  |  | newTime(timeArr) { | 
|---|
|  |  |  | newTime (timeArr) { | 
|---|
|  |  |  | let str = '' | 
|---|
|  |  |  | let str2 = '' | 
|---|
|  |  |  | this.sensorTime = [] | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 修改时间 | 
|---|
|  |  |  | dateChange(e) { | 
|---|
|  |  |  | dateChange (e) { | 
|---|
|  |  |  | if (e === null) { | 
|---|
|  |  |  | this.sensorDate = [] | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 获取无人机以及时间区间 | 
|---|
|  |  |  | getTimeAreaData(item) { | 
|---|
|  |  |  | getTimeAreaData (item) { | 
|---|
|  |  |  | // this.asideData.uavTimeFly = [] | 
|---|
|  |  |  | this.loading = true | 
|---|
|  |  |  | this.$request({ | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 折叠面板监听 | 
|---|
|  |  |  | handleChange(val) { | 
|---|
|  |  |  | handleChange (val) { | 
|---|
|  |  |  | // console.log(val, 222) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 经纬度转换为三维坐标系下的 XY 坐标 map.lngLatToGeodeticCoord | 
|---|
|  |  |  | // 选中radio | 
|---|
|  |  |  | selectRedio(item) { | 
|---|
|  |  |  | selectRedio (item) { | 
|---|
|  |  |  | this.map.remove(this.textMarkers.markers) | 
|---|
|  |  |  | this.textMarkers.markers = [] | 
|---|
|  |  |  | this.map.remove(this.Layler) | 
|---|
|  |  |  | this.addLayers(item) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 初始化地图 | 
|---|
|  |  |  | getFlyData(item, index, mac) { | 
|---|
|  |  |  | getFlyData (item, index, mac) { | 
|---|
|  |  |  | // for (var i = 0; i < this.xie.date.length; i++) { | 
|---|
|  |  |  | //   this.xie.date[i].flyLat = this.xie.date[i].flyLat + ' °'.toString() | 
|---|
|  |  |  | //   this.xie.date[i].flyLon = this.xie.date[i].flyLon + ' °'.toString() | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 获取组织下存在飞行记录的日期 | 
|---|
|  |  |  | getDate() { | 
|---|
|  |  |  | getDate () { | 
|---|
|  |  |  | this.$request({ | 
|---|
|  |  |  | url: '/uav/queryDate', | 
|---|
|  |  |  | method: 'get', | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initStart(res) { | 
|---|
|  |  |  | initDataParams (res) { | 
|---|
|  |  |  | let options = {TemMergeAvg: '合并范围均值', TemMergedHighest: '合并范围最高值', TemMergedLowest: '合并范围最低值', TemNotMergedAvg: '未合并范围均值', TemNotMergedHighest: '未合并范围最高值', TemNotMergedLowest: '未合并范围最低值'} | 
|---|
|  |  |  | let optionKeys = Object.keys(options) | 
|---|
|  |  |  | this.temMergeDataList = optionKeys.reduce((acc, key) => { | 
|---|
|  |  |  | // 使用正则表达式匹配data对象的键 | 
|---|
|  |  |  | let regex = new RegExp(key, 'i') | 
|---|
|  |  |  | let matchedDataKey = Object.keys(res).find(k => regex.test(k)) | 
|---|
|  |  |  | if (matchedDataKey) { | 
|---|
|  |  |  | acc.push({ | 
|---|
|  |  |  | name: options[key], | 
|---|
|  |  |  | value: res[matchedDataKey] | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | return acc | 
|---|
|  |  |  | }, []) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | console.log(this.temMergeDataList) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initStart (res) { | 
|---|
|  |  |  | console.log('res', res) | 
|---|
|  |  |  | this.abc += 1 | 
|---|
|  |  |  | const that = this | 
|---|
|  |  |  | if (res) this.initDataParams(res[0]) | 
|---|
|  |  |  | if (!res) { | 
|---|
|  |  |  | that.map = new BMapGL.Map('map_container') | 
|---|
|  |  |  | console.log('BMapGL', BMapGL) | 
|---|
|  |  |  | 
|---|
|  |  |  | // draw(that.sensor, that.viewType, that.carMac) | 
|---|
|  |  |  | // drawLine()// 轨迹(绘制带折线箭头) | 
|---|
|  |  |  | // drawStartAndEnd() // 起点和终点标注 | 
|---|
|  |  |  | function draw(sensor, type, carMac) { | 
|---|
|  |  |  | function draw (sensor, type, carMac) { | 
|---|
|  |  |  | var levels = getGrading(sensor, type, carMac) | 
|---|
|  |  |  | $.each(levels, function (index, value) { | 
|---|
|  |  |  | var color = value.color | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 画方块,上色,添加文字 | 
|---|
|  |  |  | function drawPolygon(sensor) { | 
|---|
|  |  |  | function drawPolygon (sensor) { | 
|---|
|  |  |  | $.each(that.showPoints, function (item, point) { | 
|---|
|  |  |  | var sw = getPoint(225, point.lng, point.lat, that.distance) | 
|---|
|  |  |  | var ne = getPoint(45, point.lng, point.lat, that.distance) | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 起点和终点标注 | 
|---|
|  |  |  | function drawStartAndEnd() { | 
|---|
|  |  |  | function drawStartAndEnd () { | 
|---|
|  |  |  | var startIcon = new BMapGL.Icon( | 
|---|
|  |  |  | require('@/assets/images/start.png'), | 
|---|
|  |  |  | new BMapGL.Size(48, 48) | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 绘制带箭头折线 | 
|---|
|  |  |  | function drawLine() { | 
|---|
|  |  |  | function drawLine () { | 
|---|
|  |  |  | var data = [] | 
|---|
|  |  |  | var points = [] | 
|---|
|  |  |  | $.each(trackPoints, function (index, value) { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 格子间隔>=size的放进points | 
|---|
|  |  |  | function getShowPoints(size) { | 
|---|
|  |  |  | function getShowPoints (size) { | 
|---|
|  |  |  | var points = [] | 
|---|
|  |  |  | points.push(trackPoints[0]) | 
|---|
|  |  |  | for (var i = 1; i < trackPoints.length; i++) { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 根据中心,角度,距离,找点 | 
|---|
|  |  |  | function getPoint(angle, lng, lat, distance) { | 
|---|
|  |  |  | function getPoint (angle, lng, lat, distance) { | 
|---|
|  |  |  | var EARTH_RADIUS = 6378137 // 地球的半径,m | 
|---|
|  |  |  | // 将距离转换成经度的计算公式 | 
|---|
|  |  |  | var ra = distance / EARTH_RADIUS | 
|---|
|  |  |  | 
|---|
|  |  |  | return new BMapGL.Point(lng, lat) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function getGrading(sensor, type, carMac) { | 
|---|
|  |  |  | function getGrading (sensor, type, carMac) { | 
|---|
|  |  |  | var levels = [] | 
|---|
|  |  |  | var level0 = {} | 
|---|
|  |  |  | var level1 = {} | 
|---|
|  |  |  | 
|---|
|  |  |  | levels.push(level0, level1, level2, level3, level4, level5, level6) | 
|---|
|  |  |  | return levels | 
|---|
|  |  |  | } | 
|---|
|  |  |  | function getColorAndLevel(senosor, data) { | 
|---|
|  |  |  | function getColorAndLevel (senosor, data) { | 
|---|
|  |  |  | var levelData = that.sensorTableData | 
|---|
|  |  |  | var colorAndLevel = {} | 
|---|
|  |  |  | var color | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // point上添加label文本 | 
|---|
|  |  |  | function setLabelStyle(content, point) { | 
|---|
|  |  |  | function setLabelStyle (content, point) { | 
|---|
|  |  |  | var label = new BMapGL.Label( | 
|---|
|  |  |  | "<span class='my-maptip'>" + content + '<br /><span>', // 为lable填写内容 | 
|---|
|  |  |  | { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // 无数据时,缩放至该中心 | 
|---|
|  |  |  | function showNoPoints() { | 
|---|
|  |  |  | function showNoPoints () { | 
|---|
|  |  |  | that.map.centerAndZoom('苏州市', 17) | 
|---|
|  |  |  | setTimeout(function () { | 
|---|
|  |  |  | document.getElementById('cpm').style.display = 'block' | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // var that = this | 
|---|
|  |  |  | function clickChange() { | 
|---|
|  |  |  | function clickChange () { | 
|---|
|  |  |  | $('.carTop').on('click', () => { | 
|---|
|  |  |  | // console.log('点击了') | 
|---|
|  |  |  | that.view.removeAllLayers() | 
|---|
|  |  |  | 
|---|
|  |  |  | clickChange() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeCode(value) { | 
|---|
|  |  |  | changeCode (value) { | 
|---|
|  |  |  | switch (value) { | 
|---|
|  |  |  | case 'PM2.5': | 
|---|
|  |  |  | this.sensorKey = 'a34004' | 
|---|
|  |  |  | 
|---|
|  |  |  | .el-scrollbar__wrap { | 
|---|
|  |  |  | overflow-x: hidden; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .dataParameter{ | 
|---|
|  |  |  | background-color: rgba(192, 192, 192, 0.4); | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | bottom: 0px; | 
|---|
|  |  |  | padding: 10px; | 
|---|
|  |  |  | color: #000; | 
|---|
|  |  |  | font-size: 16px; | 
|---|
|  |  |  | cursor: pointer; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | .item{ | 
|---|
|  |  |  | margin: 0px; | 
|---|
|  |  |  | padding: 0px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <style > | 
|---|
|  |  |  | .jlpMySelectPopper.el-picker-panel { | 
|---|
|  |  |  | 
|---|
|  |  |  | z-index: 999; | 
|---|
|  |  |  | background-color: #f40; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </style> | 
|---|