| | |
| | | <template> |
| | | <div class="main_body"> |
| | | <el-container style="height: 100%"> |
| | | <el-aside v-if="this.$store.state.aside" width="300px" style="background-color: rgb(238, 241, 246); padding-top: 10px"> |
| | | <span style=" |
| | | <el-aside |
| | | v-if="$store.state.aside" |
| | | width="300px" |
| | | style="background-color: rgb(238, 241, 246); padding-top: 10px" |
| | | > |
| | | <span |
| | | style=" |
| | | font-size: 13px; |
| | | padding-left: 10px; |
| | | font-weight: 500; |
| | | color: rgb(64, 158, 255); |
| | | ">走航车设备</span> |
| | | " |
| | | >走航车设备</span> |
| | | <el-menu style="margin-top: 10px"> |
| | | <el-menu-item v-for="(item, index) in defaultData" :key="index" style=" |
| | | <el-menu-item |
| | | v-for="(item, index) in defaultData" |
| | | :key="index" |
| | | style=" |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding-right: 0; |
| | | border-bottom: 1px solid #eee; |
| | | " :index="(index + 1 + '-' + index + 1).toString()" @click="changeCarData(item)"> |
| | | " |
| | | :index="(index + 1 + '-' + index + 1).toString()" |
| | | @click="changeCarData(item)" |
| | | > |
| | | <span>{{ item.name }}</span> |
| | | <i style=" |
| | | <i |
| | | style=" |
| | | vertical-align: -2.5px; |
| | | font-size: 20px; |
| | | margin-right: 10px; |
| | | margin-left: auto; |
| | | " class="iconfont iconfaxianzuobiao" @click="deviceDetail(item.mac, null, item, 0)" /> |
| | | " |
| | | class="iconfont iconfaxianzuobiao" |
| | | @click="deviceDetail(item.mac, null, item, 0)" |
| | | /> |
| | | <!-- @click="deviceDetail('p5dnd7a0245390',null,item,0)"--> |
| | | </el-menu-item> |
| | | </el-menu> |
| | | </el-aside> |
| | | <el-dialog> </el-dialog> |
| | | <el-dialog /> |
| | | <el-container style="position: relative"> |
| | | <div class="carTop"> |
| | | <span style="float: left; margin: 1px 10px 0 0"> |
| | | <el-button size="medium" type="primary" icon="el-icon-setting" @click="dialogFormVisible = true">6参设定</el-button> |
| | | <el-button |
| | | size="medium" |
| | | type="primary" |
| | | icon="el-icon-setting" |
| | | @click="dialogFormVisible = true" |
| | | >6参设定</el-button> |
| | | </span> |
| | | <span v-for="(item, index) in snesorParams" :key="index" class="left" :class="{ click: changeColor == index }" @click="changeCode(index)">{{ item }} |
| | | <span |
| | | v-for="(item, index) in snesorParams" |
| | | :key="index" |
| | | class="left" |
| | | :class="{ click: changeColor == index }" |
| | | @click="changeCode(index)" |
| | | >{{ item }} |
| | | </span> |
| | | <span v-for="(item, index) in viewOptions" :key="index + '-only'" class="right" :class="{ click: changeColor1 == index }" @click="changeCode1(index)">{{ item }} |
| | | <span |
| | | v-for="(item, index) in viewOptions" |
| | | :key="index + '-only'" |
| | | class="right" |
| | | :class="{ click: changeColor1 == index }" |
| | | @click="changeCode1(index)" |
| | | >{{ item }} |
| | | </span> |
| | | <span v-if="webSocketView" style="float: right; margin: 2px 10px 0 0"> |
| | | <el-button size="medium" type="primary" @click="wsStart()">开启实时</el-button> |
| | | <span |
| | | v-if="webSocketView" |
| | | style="float: right; margin: 2px 10px 0 0" |
| | | > |
| | | <el-button |
| | | size="medium" |
| | | type="primary" |
| | | @click="wsStart()" |
| | | >开启实时</el-button> |
| | | </span> |
| | | <!-- <el-date-picker |
| | | v-if="historyView" |
| | |
| | | <!-- />--> |
| | | <!-- </el-select>--> |
| | | |
| | | <el-button type="primary" size="small" style="margin-left: 1.5rem" @click="insertL">添加</el-button> |
| | | <el-input placeholder="请输入内容" v-model="inputnum" class="inputNum" clearable> |
| | | </el-input> |
| | | <el-button |
| | | type="primary" |
| | | size="small" |
| | | style="margin-left: 1.5rem" |
| | | @click="insertL" |
| | | > |
| | | 添加 |
| | | </el-button> |
| | | <el-input |
| | | v-model="inputnum" |
| | | placeholder="请输入内容" |
| | | class="inputNum" |
| | | clearable |
| | | /> |
| | | |
| | | <div class="insLu"> |
| | | <el-upload class="upload-demo" ref="upload" action="" :on-change="handleChange" :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" :limit="1"> |
| | | <el-button slot="trigger" size="small" type="primary">选取文件</el-button> |
| | | <div slot="tip" class="el-upload__tip" style="color: red"> |
| | | <el-upload |
| | | ref="upload" |
| | | class="upload-demo" |
| | | action="" |
| | | :on-change="handleChange" |
| | | :on-remove="handleRemove" |
| | | :file-list="fileList" |
| | | :auto-upload="false" |
| | | :limit="1" |
| | | > |
| | | <el-button |
| | | slot="trigger" |
| | | size="small" |
| | | type="primary" |
| | | > |
| | | 选取文件 |
| | | </el-button> |
| | | <div |
| | | slot="tip" |
| | | class="el-upload__tip" |
| | | style="color: red" |
| | | > |
| | | 上传走航轨迹图片(可选可不选) |
| | | </div> |
| | | </el-upload> |
| | |
| | | <el-button @click="insqu">取消</el-button> |
| | | <el-button @click="qnull">清空</el-button> |
| | | </div> --> |
| | | <el-table :data="tableData" style="width: 100%"> |
| | | <el-table-column label="开始时间" width="180"> |
| | | <el-table |
| | | :data="tableData" |
| | | style="width: 100%" |
| | | > |
| | | <el-table-column |
| | | label="开始时间" |
| | | width="180" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <span style="margin-left: 10px">{{ scope.row.start }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="结束时间" width="180"> |
| | | <el-table-column |
| | | label="结束时间" |
| | | width="180" |
| | | > |
| | | <template slot-scope="scope"> |
| | | <span style="margin-left: 10px">{{ scope.row.end }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div style="display: flex"> |
| | | <span class="statspan">路段名称:</span><el-input v-model="Lname" style="width: 12rem; margin-left: 1.7rem"></el-input> |
| | | <span class="statspan">路段名称:</span><el-input |
| | | v-model="Lname" |
| | | style="width: 12rem; margin-left: 1.7rem" |
| | | /> |
| | | </div> |
| | | <div style="display: flex; margin-left: 4rem"> |
| | | <el-button type="primary" @click="insLuDuan">保存</el-button> |
| | | <el-button @click="insqu">关闭</el-button> |
| | | <el-button @click="qnull">清空</el-button> |
| | | <el-button |
| | | type="primary" |
| | | @click="insLuDuan" |
| | | > |
| | | 保存 |
| | | </el-button> |
| | | <el-button @click="insqu"> |
| | | 关闭 |
| | | </el-button> |
| | | <el-button @click="qnull"> |
| | | 清空 |
| | | </el-button> |
| | | </div> |
| | | </div> |
| | | <el-date-picker style="float: right; margin-right: 10px" @change="dateChange" v-model="dateValue" type="datetimerange" :picker-options="threeOptions" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | <el-date-picker |
| | | v-model="dateValue" |
| | | style="float: right; margin-right: 10px" |
| | | type="datetimerange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | @change="dateChange" |
| | | /> |
| | | <!-- 历史/实时切换下拉框 --> |
| | | <el-select v-model="dataTypeValue" placeholder="数据类型" style=" |
| | | <el-select |
| | | v-model="dataTypeValue" |
| | | placeholder="数据类型" |
| | | style=" |
| | | float: right; |
| | | line-height: 40px; |
| | | margin-right: 10px; |
| | | width: 103px; |
| | | "> |
| | | <el-option v-for="item in dataTypeList" :key="item.value" :label="item.label" :value="item.value" /> |
| | | " |
| | | > |
| | | <el-option |
| | | v-for="item in dataTypeList" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </div> |
| | | <div v-if="noneData" class="noneData">当前时间没有走航数据</div> |
| | | <div id="map_container" v-loading="loading" /> |
| | | <div |
| | | v-if="noneData" |
| | | class="noneData" |
| | | > |
| | | 当前时间没有走航数据 |
| | | </div> |
| | | <div |
| | | id="map_container" |
| | | v-loading="loading" |
| | | /> |
| | | <!-- 百度地图 --> |
| | | </el-container> |
| | | </el-container> |
| | |
| | | <!-- <img src="/img/pollutionlevel.png" class="sensorLevel"> |
| | | <div id="cpm">查无走航车轨迹</div> --> |
| | | <!-- 6参设定弹窗 --> |
| | | <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" content-class-name="my-content">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-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" |
| | | content-class-name="my-content" |
| | | > |
| | | 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> |
| | | <!-- <el-descriptions title="设备标准值" border> |
| | | </el-descriptions> --> |
| | | <div style=" |
| | | <div |
| | | style=" |
| | | font-size: 16px; |
| | | font-weight: 700; |
| | | margin: 10px 0 20px 0; |
| | | font-size: 16px; |
| | | font-weight: 700; |
| | | color: #303133; |
| | | "> |
| | | " |
| | | > |
| | | 设备标准值 |
| | | </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> |
| | |
| | | if (value.a21026) point.a21026 = parseInt(value.a21026 - 0 + 5) |
| | | if (value.a21004) point.a21004 = parseInt(value.a21004 - 20) |
| | | // point.a21004 = parseInt(value.a21004) |
| | | if (value.a21005) |
| | | point.a21005 = parseFloat(value.a21005 - 0 + 0.85).toFixed(3) |
| | | if (value.a21005) { point.a21005 = parseFloat(value.a21005 - 0 + 0.85).toFixed(3) } |
| | | if (value.a05024 < 15) { |
| | | point.a05024 = parseInt(value.a05024 + 3) |
| | | } else if (value.a05024 > 18) { |