|
@@ -350,7 +350,7 @@
|
350
|
350
|
</div>
|
351
|
351
|
</Modal>
|
352
|
352
|
<Modal
|
353
|
|
- class="modal2"
|
|
353
|
+ class="modal5"
|
354
|
354
|
:mask-closable="false"
|
355
|
355
|
v-model="deviceDetailInfo.show"
|
356
|
356
|
:title="`查看【${deviceDetailInfo.username}】`"
|
|
@@ -358,7 +358,14 @@
|
358
|
358
|
<div class="section_title">基本信息</div>
|
359
|
359
|
<div class="section_item">
|
360
|
360
|
<div class="device_base">
|
361
|
|
- <div class="device_base_left"></div>
|
|
361
|
+ <div class="device_base_left">
|
|
362
|
+ <div class="phone_dot"></div>
|
|
363
|
+ <Icon
|
|
364
|
+ class="ivu-icon iconfont icon-anzhuoandroid"
|
|
365
|
+ color="#52C41A"
|
|
366
|
+ size="45"
|
|
367
|
+ ></Icon>
|
|
368
|
+ </div>
|
362
|
369
|
<div class="device_base_right">
|
363
|
370
|
<Form :label-width="90">
|
364
|
371
|
<FormItem label="使用人">{{
|
|
@@ -396,20 +403,16 @@
|
396
|
403
|
<div class="detail_left">
|
397
|
404
|
<table class="my_table">
|
398
|
405
|
<tr>
|
399
|
|
- <th style="width: 110px">设备号</th>
|
400
|
|
- <td></td>
|
401
|
|
- </tr>
|
402
|
|
- <tr>
|
403
|
|
- <th>SN/IMEI</th>
|
404
|
|
- <td></td>
|
|
406
|
+ <th style="width: 110px">SN/IMEI</th>
|
|
407
|
+ <td>{{ deviceDetailInfo.detail.sn }}</td>
|
405
|
408
|
</tr>
|
406
|
409
|
<tr>
|
407
|
410
|
<th>WiFi/MAC</th>
|
408
|
|
- <td></td>
|
|
411
|
+ <td>{{ deviceDetailInfo.detail.wifyMac }}</td>
|
409
|
412
|
</tr>
|
410
|
413
|
<tr>
|
411
|
414
|
<th>蓝牙MAC</th>
|
412
|
|
- <td></td>
|
|
415
|
+ <td>{{ deviceDetailInfo.detail.blueMac }}</td>
|
413
|
416
|
</tr>
|
414
|
417
|
</table>
|
415
|
418
|
</div>
|
|
@@ -417,19 +420,21 @@
|
417
|
420
|
<table class="my_table">
|
418
|
421
|
<tr>
|
419
|
422
|
<th style="width: 110px">系统内核</th>
|
420
|
|
- <td></td>
|
|
423
|
+ <td>{{ deviceDetailInfo.detail.sysKernel }}</td>
|
421
|
424
|
</tr>
|
422
|
425
|
<tr>
|
423
|
426
|
<th>Rom版本</th>
|
424
|
|
- <td></td>
|
|
427
|
+ <td>{{ deviceDetailInfo.detail.romVersion }}</td>
|
425
|
428
|
</tr>
|
426
|
429
|
<tr>
|
427
|
430
|
<th>SIM序列号</th>
|
428
|
|
- <td></td>
|
|
431
|
+ <td>{{ deviceDetailInfo.detail.sim }}</td>
|
429
|
432
|
</tr>
|
430
|
433
|
</table>
|
431
|
434
|
</div>
|
432
|
|
- <div class="detail_right"></div>
|
|
435
|
+ <div class="detail_right">
|
|
436
|
+ <div id="memory_detail"></div>
|
|
437
|
+ </div>
|
433
|
438
|
<div></div>
|
434
|
439
|
</div>
|
435
|
440
|
<div class="section_title">已安装应用</div>
|
|
@@ -440,7 +445,57 @@
|
440
|
445
|
></Table>
|
441
|
446
|
</div>
|
442
|
447
|
<div class="section_title">地理位置</div>
|
443
|
|
- <div class="section_title">应用使用统计</div>
|
|
448
|
+ <div class="geo_location">
|
|
449
|
+ <div class="geo_location_header">
|
|
450
|
+ <div>只显示最近十条位置信息</div>
|
|
451
|
+ </div>
|
|
452
|
+ <div class="geo_location_main" v-if="deviceDetailInfo.show">
|
|
453
|
+ <baidu-map
|
|
454
|
+ class="baidu_map"
|
|
455
|
+ ak="2xUGaxSQ2TXTsPoiAtT9jZ88tsAl8qw2"
|
|
456
|
+ :center="baiduMapInfo.center"
|
|
457
|
+ :zoom="14"
|
|
458
|
+ :scroll-wheel-zoom="true"
|
|
459
|
+ @ready="baiduMapReady"
|
|
460
|
+ >
|
|
461
|
+ <!--缩放-->
|
|
462
|
+ <bm-navigation anchor="BMAP_ANCHOR_TOP_LEFT"></bm-navigation>
|
|
463
|
+ <!--定位-->
|
|
464
|
+ <bm-geolocation
|
|
465
|
+ anchor="BMAP_ANCHOR_BOTTOM_RIGHT"
|
|
466
|
+ :showAddressBar="true"
|
|
467
|
+ :autoLocation="true"
|
|
468
|
+ ></bm-geolocation>
|
|
469
|
+ <!--点-->
|
|
470
|
+ <bm-marker
|
|
471
|
+ v-for="(item, index) in baiduMapInfo.positions"
|
|
472
|
+ :key="index"
|
|
473
|
+ :position="{ lng: item.lng, lat: item.lat }"
|
|
474
|
+ :dragging="true"
|
|
475
|
+ animation="BMAP_ANIMATION_DROP"
|
|
476
|
+ @click="bmMarkerClick(item, $event)"
|
|
477
|
+ >
|
|
478
|
+ <!-- 信息弹窗 -->
|
|
479
|
+ <bm-info-window
|
|
480
|
+ title="坐标信息"
|
|
481
|
+ :position="{
|
|
482
|
+ lng: baiduMapInfo.markerInfo.lng,
|
|
483
|
+ lat: baiduMapInfo.markerInfo.lat
|
|
484
|
+ }"
|
|
485
|
+ :show="baiduMapInfo.markerInfo.show"
|
|
486
|
+ @close="closeBmInfoWindow()"
|
|
487
|
+ >
|
|
488
|
+ <div>地址: {{ baiduMapInfo.markerInfo.address }}</div>
|
|
489
|
+ <div>经度:{{ baiduMapInfo.markerInfo.lng }}</div>
|
|
490
|
+ <div>维度:{{ baiduMapInfo.markerInfo.lat }}</div>
|
|
491
|
+ </bm-info-window>
|
|
492
|
+ </bm-marker>
|
|
493
|
+ </baidu-map>
|
|
494
|
+ </div>
|
|
495
|
+ </div>
|
|
496
|
+ <div class="section_title">
|
|
497
|
+ 应用使用统计<span>应用使用统计(最近七天)</span>
|
|
498
|
+ </div>
|
444
|
499
|
<div class="section_table_wrap">
|
445
|
500
|
<Table :columns="usesColumns" :data="deviceDetailInfo.detail.uses">
|
446
|
501
|
<template slot-scope="{ row }" slot="durationSlot">
|
|
@@ -464,6 +519,12 @@
|
464
|
519
|
</template>
|
465
|
520
|
|
466
|
521
|
<script>
|
|
522
|
+import BaiduMap from "vue-baidu-map/components/map/Map.vue";
|
|
523
|
+import BmNavigation from "vue-baidu-map/components/controls/Navigation";
|
|
524
|
+import BmGeolocation from "vue-baidu-map/components/controls/Geolocation";
|
|
525
|
+import BmMarker from "vue-baidu-map/components/overlays/Marker";
|
|
526
|
+import BmInfoWindow from "vue-baidu-map/components/overlays/InfoWindow";
|
|
527
|
+import * as echarts from "echarts";
|
467
|
528
|
import controlWs from "@/utils/ControlWs";
|
468
|
529
|
import ControlWSMsg from "@/utils/ControlWSMsg";
|
469
|
530
|
import { exportToExcel } from "@/utils/exportToExcel";
|
|
@@ -485,8 +546,24 @@ import {
|
485
|
546
|
formatSeconds
|
486
|
547
|
} from "@/utils";
|
487
|
548
|
export default {
|
|
549
|
+ components: {
|
|
550
|
+ BaiduMap,
|
|
551
|
+ BmNavigation,
|
|
552
|
+ BmGeolocation,
|
|
553
|
+ BmMarker,
|
|
554
|
+ BmInfoWindow
|
|
555
|
+ },
|
488
|
556
|
data() {
|
489
|
557
|
return {
|
|
558
|
+ baiduMapInfo: {
|
|
559
|
+ center: "郑州市",
|
|
560
|
+ // {lng, lat}
|
|
561
|
+ positions: [],
|
|
562
|
+ // {show, title, lng, lat}
|
|
563
|
+ markerInfo: {},
|
|
564
|
+ BMap: null,
|
|
565
|
+ map: null
|
|
566
|
+ },
|
490
|
567
|
weekDay,
|
491
|
568
|
padDeviceIcon,
|
492
|
569
|
padViolatesInfo,
|
|
@@ -574,8 +651,9 @@ export default {
|
574
|
651
|
align: "center"
|
575
|
652
|
},
|
576
|
653
|
{
|
577
|
|
- title: "在线状态",
|
|
654
|
+ title: "状态",
|
578
|
655
|
slot: "onlineSlot",
|
|
656
|
+ width: 70,
|
579
|
657
|
align: "center"
|
580
|
658
|
},
|
581
|
659
|
{
|
|
@@ -772,6 +850,76 @@ export default {
|
772
|
850
|
controlWs.closeWs();
|
773
|
851
|
},
|
774
|
852
|
methods: {
|
|
853
|
+ initMemoryDetailEcharts() {
|
|
854
|
+ let _totalMemory = this.deviceDetailInfo.detail.totalMemory;
|
|
855
|
+ let _usedMemory = this.deviceDetailInfo.detail.usedMemory;
|
|
856
|
+ let _residueMemory = _totalMemory - _usedMemory;
|
|
857
|
+ const options = {
|
|
858
|
+ tooltip: {
|
|
859
|
+ trigger: "item",
|
|
860
|
+ formatter: "{b}: {d}%"
|
|
861
|
+ },
|
|
862
|
+ legend: {
|
|
863
|
+ bottom: "10",
|
|
864
|
+ left: "center",
|
|
865
|
+ itemWidth: 10,
|
|
866
|
+ itemHeight: 10,
|
|
867
|
+ //图例距离饼图的距离
|
|
868
|
+ itemGap: 10,
|
|
869
|
+ orient: "horizontal",
|
|
870
|
+ data: ["内部存储"],
|
|
871
|
+ textStyle: {
|
|
872
|
+ color: "#253A70"
|
|
873
|
+ }
|
|
874
|
+ },
|
|
875
|
+ color: ["#FFC300", "#FF8D1A"],
|
|
876
|
+ series: [
|
|
877
|
+ {
|
|
878
|
+ type: "pie",
|
|
879
|
+ name: "内部存储",
|
|
880
|
+ radius: ["30%", "45%"],
|
|
881
|
+ center: ["50%", "45%"],
|
|
882
|
+ label: {
|
|
883
|
+ formatter: (params) => {
|
|
884
|
+ let memoryInfo = {
|
|
885
|
+ value: params.value,
|
|
886
|
+ unit: "B"
|
|
887
|
+ };
|
|
888
|
+ if (memoryInfo.value / 1024 < 1024) {
|
|
889
|
+ memoryInfo.value =
|
|
890
|
+ Math.floor((memoryInfo.value / 1024) * 100) / 100;
|
|
891
|
+ memoryInfo.unit = "KB";
|
|
892
|
+ } else if (memoryInfo.value / 1024 / 1024 < 1024) {
|
|
893
|
+ memoryInfo.value =
|
|
894
|
+ Math.floor((memoryInfo.value / 1024 / 1024) * 100) / 100;
|
|
895
|
+ memoryInfo.unit = "MB";
|
|
896
|
+ } else {
|
|
897
|
+ memoryInfo.value =
|
|
898
|
+ Math.floor((memoryInfo.value / 1024 / 1024 / 1024) * 100) /
|
|
899
|
+ 100;
|
|
900
|
+ memoryInfo.unit = "GB";
|
|
901
|
+ }
|
|
902
|
+ return `${params.name}\n${memoryInfo.value}${memoryInfo.unit}`;
|
|
903
|
+ },
|
|
904
|
+ borderWidth: 1,
|
|
905
|
+ borderRadius: 4,
|
|
906
|
+ color: "#7C8DB5",
|
|
907
|
+ fontSize: 12,
|
|
908
|
+ lineHeight: 18
|
|
909
|
+ },
|
|
910
|
+ data: [
|
|
911
|
+ { value: _residueMemory, name: "剩余" },
|
|
912
|
+ { value: _usedMemory, name: "已使用" }
|
|
913
|
+ ]
|
|
914
|
+ }
|
|
915
|
+ ]
|
|
916
|
+ };
|
|
917
|
+ const memoryEcharts = echarts.init(
|
|
918
|
+ document.getElementById("memory_detail")
|
|
919
|
+ );
|
|
920
|
+ memoryEcharts.clear();
|
|
921
|
+ memoryEcharts.setOption(options);
|
|
922
|
+ },
|
775
|
923
|
initMonitorWS() {
|
776
|
924
|
controlWs.setWs();
|
777
|
925
|
this.getWSEventInfo();
|
|
@@ -954,11 +1102,60 @@ export default {
|
954
|
1102
|
this.deviceDetailInfo.show = true;
|
955
|
1103
|
this.deviceDetailInfo.username = row.username;
|
956
|
1104
|
this.deviceDetailInfo.detail = data.obj;
|
|
1105
|
+ if (this.deviceDetailInfo.detail.positions.length > 0) {
|
|
1106
|
+ let _positions = this.deviceDetailInfo.detail.positions;
|
|
1107
|
+ this.baiduMapInfo.positions = _positions.map((item) => {
|
|
1108
|
+ return { address: "", lng: item.lon, lat: item.lat };
|
|
1109
|
+ });
|
|
1110
|
+ this.baiduMapInfo.center = {
|
|
1111
|
+ lng: this.baiduMapInfo.positions[0].lng,
|
|
1112
|
+ lat: this.baiduMapInfo.positions[0].lat
|
|
1113
|
+ };
|
|
1114
|
+ this.baiduMapInfo.markerInfo = {
|
|
1115
|
+ show: false,
|
|
1116
|
+ address: "",
|
|
1117
|
+ lng: this.baiduMapInfo.center.lng,
|
|
1118
|
+ lat: this.baiduMapInfo.center.lat
|
|
1119
|
+ };
|
|
1120
|
+ } else {
|
|
1121
|
+ this.baiduMapInfo.center = "郑州市";
|
|
1122
|
+ }
|
|
1123
|
+ this.initMemoryDetailEcharts();
|
957
|
1124
|
} else {
|
958
|
1125
|
this.$Message.error(data.msg);
|
959
|
1126
|
}
|
960
|
1127
|
});
|
961
|
1128
|
},
|
|
1129
|
+ baiduMapReady({ BMap, map }) {
|
|
1130
|
+ this.baiduMapInfo.BMap = BMap;
|
|
1131
|
+ this.baiduMapInfo.map = map;
|
|
1132
|
+ },
|
|
1133
|
+ bmMarkerClick(item, { point }) {
|
|
1134
|
+ if (item.address) {
|
|
1135
|
+ this.baiduMapInfo.markerInfo = {
|
|
1136
|
+ show: true,
|
|
1137
|
+ address: item.address,
|
|
1138
|
+ lng: item.lng,
|
|
1139
|
+ lat: item.lat
|
|
1140
|
+ };
|
|
1141
|
+ } else {
|
|
1142
|
+ const geocoder = new this.baiduMapInfo.BMap.Geocoder();
|
|
1143
|
+ geocoder.getLocation(point, (data) => {
|
|
1144
|
+ if (data) {
|
|
1145
|
+ item.address = data.address;
|
|
1146
|
+ this.baiduMapInfo.markerInfo = {
|
|
1147
|
+ show: true,
|
|
1148
|
+ address: data.address,
|
|
1149
|
+ lng: item.lng,
|
|
1150
|
+ lat: item.lat
|
|
1151
|
+ };
|
|
1152
|
+ }
|
|
1153
|
+ });
|
|
1154
|
+ }
|
|
1155
|
+ },
|
|
1156
|
+ closeBmInfoWindow() {
|
|
1157
|
+ this.baiduMapInfo.markerInfo.show = false;
|
|
1158
|
+ },
|
962
|
1159
|
// 策略
|
963
|
1160
|
toStrategy(row) {
|
964
|
1161
|
stPad_detail_web({ objectid: row.userid }).then((res) => {
|
|
@@ -975,19 +1172,23 @@ export default {
|
975
|
1172
|
this.strategyInfo.padApps = res.obj.padApps || [];
|
976
|
1173
|
this.strategyInfo.padWifis = res.obj.padWifis || [];
|
977
|
1174
|
this.strategyInfo.padTimes = res.obj.padTimes || [];
|
978
|
|
- let pdtypeInfo = {};
|
979
|
|
- this.strategyInfo.padDevices = res.obj.padDevices;
|
980
|
|
- this.strategyInfo.padDevices.forEach((item) => {
|
981
|
|
- pdtypeInfo[item.pdtype] = item.enabled;
|
982
|
|
- });
|
983
|
|
- this.strategyInfo.pdtypeInfo = pdtypeInfo;
|
984
|
|
- let violatesInfo = {};
|
985
|
|
- this.strategyInfo.padViolates = res.obj.padViolates;
|
986
|
|
- this.strategyInfo.padViolates.forEach((item) => {
|
987
|
|
- violatesInfo[item.violateType] =
|
988
|
|
- item.handle_method && item.handle_method.split(";");
|
989
|
|
- });
|
990
|
|
- this.strategyInfo.violatesInfo = violatesInfo;
|
|
1175
|
+ if (this.strategyInfo.hasdevice) {
|
|
1176
|
+ let pdtypeInfo = {};
|
|
1177
|
+ this.strategyInfo.padDevices = res.obj.padDevices;
|
|
1178
|
+ this.strategyInfo.padDevices.forEach((item) => {
|
|
1179
|
+ pdtypeInfo[item.pdtype] = item.enabled;
|
|
1180
|
+ });
|
|
1181
|
+ this.strategyInfo.pdtypeInfo = pdtypeInfo;
|
|
1182
|
+ }
|
|
1183
|
+ if (this.strategyInfo.hasviolate) {
|
|
1184
|
+ let violatesInfo = {};
|
|
1185
|
+ this.strategyInfo.padViolates = res.obj.padViolates;
|
|
1186
|
+ this.strategyInfo.padViolates.forEach((item) => {
|
|
1187
|
+ violatesInfo[item.violateType] =
|
|
1188
|
+ item.handle_method && item.handle_method.split(";");
|
|
1189
|
+ });
|
|
1190
|
+ this.strategyInfo.violatesInfo = violatesInfo;
|
|
1191
|
+ }
|
991
|
1192
|
this.strategyInfo.show = true;
|
992
|
1193
|
} else {
|
993
|
1194
|
this.$Message.error(res.msg);
|
|
@@ -999,7 +1200,7 @@ export default {
|
999
|
1200
|
password_detail_userpwd({
|
1000
|
1201
|
rtype: this.powerParams.rtype,
|
1001
|
1202
|
objectid: this.powerParams.objectid,
|
1002
|
|
- sn: row.sn
|
|
1203
|
+ userid: row.userid
|
1003
|
1204
|
}).then((data) => {
|
1004
|
1205
|
if (data.code === 0) {
|
1005
|
1206
|
this.devicePswInfo = {
|
|
@@ -1149,11 +1350,7 @@ export default {
|
1149
|
1350
|
pushType: 6,
|
1150
|
1351
|
pushObj: 1
|
1151
|
1352
|
};
|
1152
|
|
- if (snList.length > 1) {
|
1153
|
|
- form.userids = useridList;
|
1154
|
|
- } else {
|
1155
|
|
- form.pushObjid = useridList[0];
|
1156
|
|
- }
|
|
1353
|
+ form.userids = useridList;
|
1157
|
1354
|
this.addPushLog(form);
|
1158
|
1355
|
},
|
1159
|
1356
|
// 发送消息
|
|
@@ -1168,21 +1365,23 @@ export default {
|
1168
|
1365
|
this.userInfo.adminid,
|
1169
|
1366
|
snList
|
1170
|
1367
|
);
|
1171
|
|
- controlWSMsg.msgContent(this.controlMessageInfo.content);
|
|
1368
|
+ controlWSMsg.msgContent(
|
|
1369
|
+ JSON.stringify({
|
|
1370
|
+ title: this.controlMessageInfo.title,
|
|
1371
|
+ content: this.controlMessageInfo.content
|
|
1372
|
+ })
|
|
1373
|
+ );
|
1172
|
1374
|
controlWSMsg.send();
|
1173
|
1375
|
let form = {
|
1174
|
1376
|
pushType: 1,
|
1175
|
1377
|
pushObj: this.controlMessageInfo.classid ? 2 : 1,
|
|
1378
|
+ pushObjname: this.controlMessageInfo.title,
|
1176
|
1379
|
content: this.controlMessageInfo.content
|
1177
|
1380
|
};
|
1178
|
1381
|
if (this.controlMessageInfo.classid) {
|
1179
|
1382
|
form.pushObjid = this.controlMessageInfo.classid;
|
1180
|
1383
|
} else {
|
1181
|
|
- if (snList.length > 1) {
|
1182
|
|
- form.userids = useridList;
|
1183
|
|
- } else {
|
1184
|
|
- form.pushObjid = useridList[0];
|
1185
|
|
- }
|
|
1384
|
+ form.userids = useridList;
|
1186
|
1385
|
}
|
1187
|
1386
|
this.addPushLog(form);
|
1188
|
1387
|
}
|
|
@@ -1201,11 +1400,7 @@ export default {
|
1201
|
1400
|
pushType: 2,
|
1202
|
1401
|
pushObj: 1
|
1203
|
1402
|
};
|
1204
|
|
- if (snList.length > 1) {
|
1205
|
|
- form.userids = useridList;
|
1206
|
|
- } else {
|
1207
|
|
- form.pushObjid = useridList[0];
|
1208
|
|
- }
|
|
1403
|
+ form.userids = useridList;
|
1209
|
1404
|
this.addPushLog(form);
|
1210
|
1405
|
},
|
1211
|
1406
|
// 限制使用
|
|
@@ -1221,11 +1416,7 @@ export default {
|
1221
|
1416
|
pushType: 3,
|
1222
|
1417
|
pushObj: 1
|
1223
|
1418
|
};
|
1224
|
|
- if (snList.length > 1) {
|
1225
|
|
- form.userids = useridList;
|
1226
|
|
- } else {
|
1227
|
|
- form.pushObjid = useridList[0];
|
1228
|
|
- }
|
|
1419
|
+ form.userids = useridList;
|
1229
|
1420
|
this.addPushLog(form);
|
1230
|
1421
|
},
|
1231
|
1422
|
// 更新策略
|
|
@@ -1241,11 +1432,7 @@ export default {
|
1241
|
1432
|
pushType: 4,
|
1242
|
1433
|
pushObj: 1
|
1243
|
1434
|
};
|
1244
|
|
- if (snList.length > 1) {
|
1245
|
|
- form.userids = useridList;
|
1246
|
|
- } else {
|
1247
|
|
- form.pushObjid = useridList[0];
|
1248
|
|
- }
|
|
1435
|
+ form.userids = useridList;
|
1249
|
1436
|
this.addPushLog(form);
|
1250
|
1437
|
},
|
1251
|
1438
|
// 重启设备
|
|
@@ -1261,11 +1448,7 @@ export default {
|
1261
|
1448
|
pushType: 4,
|
1262
|
1449
|
pushObj: 1
|
1263
|
1450
|
};
|
1264
|
|
- if (snList.length > 1) {
|
1265
|
|
- form.userids = useridList;
|
1266
|
|
- } else {
|
1267
|
|
- form.pushObjid = useridList[0];
|
1268
|
|
- }
|
|
1451
|
+ form.userids = useridList;
|
1269
|
1452
|
this.addPushLog(form);
|
1270
|
1453
|
},
|
1271
|
1454
|
// 添加推送日志
|
|
@@ -1552,11 +1735,18 @@ export default {
|
1552
|
1735
|
}
|
1553
|
1736
|
}
|
1554
|
1737
|
.section_title {
|
|
1738
|
+ display: flex;
|
|
1739
|
+ justify-content: space-between;
|
|
1740
|
+ align-items: center;
|
1555
|
1741
|
padding-left: 10px;
|
1556
|
1742
|
font-size: 18px;
|
1557
|
1743
|
line-height: 20px;
|
1558
|
1744
|
font-weight: bold;
|
1559
|
1745
|
border-left: 4px solid #339dff;
|
|
1746
|
+ > span {
|
|
1747
|
+ font-weight: normal;
|
|
1748
|
+ font-size: 16px;
|
|
1749
|
+ }
|
1560
|
1750
|
}
|
1561
|
1751
|
.section_table_wrap {
|
1562
|
1752
|
margin: 16px 0;
|
|
@@ -1575,11 +1765,24 @@ export default {
|
1575
|
1765
|
margin: 16px 0;
|
1576
|
1766
|
width: 50%;
|
1577
|
1767
|
.device_base_left {
|
|
1768
|
+ position: relative;
|
|
1769
|
+ display: flex;
|
|
1770
|
+ justify-content: center;
|
|
1771
|
+ align-items: center;
|
1578
|
1772
|
margin-left: 10px;
|
1579
|
1773
|
width: 120px;
|
1580
|
1774
|
height: 240px;
|
1581
|
1775
|
border-radius: 15px;
|
1582
|
|
- border: 3px solid #000;
|
|
1776
|
+ border: 4px solid #000;
|
|
1777
|
+ .phone_dot {
|
|
1778
|
+ position: absolute;
|
|
1779
|
+ top: 10px;
|
|
1780
|
+ margin: 0 auto;
|
|
1781
|
+ width: 30px;
|
|
1782
|
+ height: 8px;
|
|
1783
|
+ border-radius: 4px;
|
|
1784
|
+ background-color: #000;
|
|
1785
|
+ }
|
1583
|
1786
|
}
|
1584
|
1787
|
.device_base_right {
|
1585
|
1788
|
width: calc(100% - 140px);
|
|
@@ -1622,22 +1825,53 @@ export default {
|
1622
|
1825
|
td {
|
1623
|
1826
|
position: relative;
|
1624
|
1827
|
padding: 0;
|
1625
|
|
- line-height: 46px;
|
|
1828
|
+ line-height: 22px;
|
1626
|
1829
|
color: #798cb5;
|
1627
|
1830
|
text-align: center;
|
1628
|
1831
|
vertical-align: middle;
|
1629
|
|
- white-space: nowrap;
|
|
1832
|
+ // white-space: nowrap;
|
|
1833
|
+ word-break: break-all;
|
|
1834
|
+ white-space: normal;
|
1630
|
1835
|
border: 1px solid #ced9f2;
|
1631
|
1836
|
}
|
1632
|
1837
|
}
|
1633
|
1838
|
.detail_left {
|
1634
|
|
- width: calc(33.33% - 30px);
|
|
1839
|
+ margin-right: 15px;
|
|
1840
|
+ width: calc(50% - 280px);
|
1635
|
1841
|
}
|
1636
|
1842
|
.detail_center {
|
1637
|
|
- width: calc(33.33% - 20px);
|
|
1843
|
+ margin-right: 15px;
|
|
1844
|
+ width: calc(50% - 150px);
|
1638
|
1845
|
}
|
1639
|
1846
|
.detail_right {
|
1640
|
|
- width: 33.33%;
|
|
1847
|
+ width: 400px;
|
|
1848
|
+ height: 200px;
|
|
1849
|
+ #memory_detail {
|
|
1850
|
+ width: 400px;
|
|
1851
|
+ height: 200px;
|
|
1852
|
+ }
|
|
1853
|
+ }
|
|
1854
|
+}
|
|
1855
|
+.geo_location {
|
|
1856
|
+ margin: 16px 0;
|
|
1857
|
+ border: 1px solid #ced9f2;
|
|
1858
|
+ .geo_location_header {
|
|
1859
|
+ display: flex;
|
|
1860
|
+ justify-content: flex-end;
|
|
1861
|
+ align-items: center;
|
|
1862
|
+ padding: 0 16px;
|
|
1863
|
+ line-height: 44px;
|
|
1864
|
+ font-size: 16px;
|
|
1865
|
+ color: #339dff;
|
|
1866
|
+ border-bottom: 1px solid #ced9f2;
|
|
1867
|
+ background: #edf3ff;
|
|
1868
|
+ }
|
|
1869
|
+ .geo_location_main {
|
|
1870
|
+ height: 400px;
|
|
1871
|
+ .baidu_map {
|
|
1872
|
+ width: 100%;
|
|
1873
|
+ height: 100%;
|
|
1874
|
+ }
|
1641
|
1875
|
}
|
1642
|
1876
|
}
|
1643
|
1877
|
</style>
|