Compare commits
9 Commits
ef9d79f6e0
...
37b4d08873
| Author | SHA1 | Date |
|---|---|---|
|
|
37b4d08873 | |
|
|
344dd7888e | |
|
|
1cb45fe535 | |
|
|
da4bc2367e | |
|
|
7895ea0a13 | |
|
|
2a37575f8f | |
|
|
db204fe98e | |
|
|
0ef27266dc | |
|
|
6e1b7c1da9 |
|
|
@ -0,0 +1,45 @@
|
|||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<!--
|
||||
2013-9-30: Created.
|
||||
-->
|
||||
<svg>
|
||||
<metadata>
|
||||
Created by iconfont
|
||||
</metadata>
|
||||
<defs>
|
||||
|
||||
<font id="laydate-icon" horiz-adv-x="1024" >
|
||||
<font-face
|
||||
font-family="laydate-icon"
|
||||
font-weight="500"
|
||||
font-stretch="normal"
|
||||
units-per-em="1024"
|
||||
ascent="896"
|
||||
descent="-128"
|
||||
/>
|
||||
<missing-glyph />
|
||||
|
||||
<glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
|
||||
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
|
||||
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
|
||||
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
|
||||
|
||||
|
||||
|
||||
<glyph glyph-name="youyou" unicode="" d="M283.648 721.918976 340.873216 780.926976 740.352 383.997952 340.876288-12.925952 283.648 46.077952 619.52 383.997952Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zuozuo" unicode="" d="M740.352 721.918976 683.126784 780.926976 283.648 383.997952 683.123712-12.925952 740.352 46.077952 404.48 383.997952Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xiayiye" unicode="" d="M62.573 384.103l423.401 423.662c18.985 18.985 49.757 18.985 68.727 0 18.982-18.972 18.985-49.746 0-68.729l-355.058-355.067 356.796-356.796c18.977-18.971 18.976-49.746 0-68.727-18.982-18.976-49.751-18.976-68.727 0l-39.753 39.753 0.269 0.246-385.655 385.661zM451.365 384.103l423.407 423.662c18.985 18.985 49.757 18.985 68.727 0 18.982-18.972 18.985-49.746 0-68.729l-355.058-355.067 356.796-356.796c18.977-18.971 18.976-49.746 0-68.727-18.982-18.976-49.757-18.977-68.727 0l-39.762 39.754 0.273 0.249-385.662 385.661zM451.365 384.103z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xiayiye1" unicode="" d="M948.066926 382.958838l-411.990051-412.24426c-18.47333-18.47333-48.417689-18.47333-66.875207 0-18.47333 18.461167-18.47333 48.405526 0 66.875207L814.691135 383.088983 467.512212 730.269123c-18.466032 18.458735-18.466032 48.405526 0 66.873991 18.468465 18.464816 48.410391 18.464816 66.872774 0l38.682336-38.682336-0.261507-0.239614 375.259894-375.265975v0.003649m-378.312834 0L157.756743-29.285422c-18.47333-18.47333-48.415256-18.47333-66.872775 0-18.47333 18.461167-18.47333 48.405526 0 66.875207L436.369787 383.088983 89.19208 730.269123c-18.4636 18.458735-18.4636 48.405526 0 66.873991 18.470898 18.464816 48.415256 18.464816 66.872774 0l38.692067-38.682336-0.266372-0.239614 375.267191-375.265975-0.004865 0.003649m0 0z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
|
||||
|
||||
</font>
|
||||
</defs></svg>
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -5,6 +5,10 @@
|
|||
"appname":"平邑县森林防火电子沙盘",
|
||||
"area":"平邑县",
|
||||
"baseUrl":"",
|
||||
"map":{
|
||||
"center":[],
|
||||
"zoom":null
|
||||
},
|
||||
"waterUrl":"http://175.27.168.120:8080/geoserver/pingyixian/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=pingyixian%3Ashuiyuandi_new&maxFeatures=50000&outputFormat=application%2Fjson",
|
||||
"goodsUrl":"",
|
||||
"tools":{
|
||||
|
|
@ -22,6 +26,11 @@
|
|||
"appname":"费县森林防火电子沙盘",
|
||||
"area":"费县",
|
||||
"baseUrl":"",
|
||||
"map":{
|
||||
"center":[],
|
||||
"zoom":null
|
||||
},
|
||||
"waterUrl":"",
|
||||
"goodsUrl":"",
|
||||
"tools":{
|
||||
"routebox":true,
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,87 @@
|
|||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Created by iconfont</metadata>
|
||||
<defs>
|
||||
<font id="iconfont" horiz-adv-x="1024">
|
||||
<font-face
|
||||
font-family="iconfont"
|
||||
font-weight="400"
|
||||
font-stretch="normal"
|
||||
units-per-em="1024"
|
||||
ascent="896"
|
||||
descent="-128"
|
||||
/>
|
||||
<missing-glyph />
|
||||
|
||||
<glyph glyph-name="talk_1" unicode="" d="M515.072 885.0944a178.3808 178.3808 0 0 0 178.176-178.2272v-366.2336a178.2272 178.2272 0 0 0-356.4032 0V706.8672A178.3808 178.3808 0 0 0 515.072 885.0944z m0-671.4368a127.1296 127.1296 0 0 1 127.0272 127.0272V706.8672a127.0272 127.0272 0 0 1-254.0032 0v-366.2336a127.1296 127.1296 0 0 1 126.976-126.976zM512-117.09439999999995a25.6 25.6 0 0 0-25.6 25.6v141.7728a25.6 25.6 0 0 0 51.2 0v-141.7728a25.6 25.6 0 0 0-25.6-25.6zM512 24.67840000000001a380.416 380.416 0 0 0-380.0064 380.0064 25.6 25.6 0 1 0 51.2 0 328.8064 328.8064 0 0 1 657.5616 0 25.6 25.6 0 0 0 51.2 0A380.416 380.416 0 0 0 512 24.67840000000001z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="icon_yuyinguanbi" unicode="" d="M515.072 885.0944a178.3808 178.3808 0 0 0 178.176-178.2272v-366.2336a178.2272 178.2272 0 0 0-356.4032 0V706.8672A178.3808 178.3808 0 0 0 515.072 885.0944z m0-671.4368a127.1296 127.1296 0 0 1 127.0272 127.0272V706.8672a127.0272 127.0272 0 0 1-254.0032 0v-366.2336a127.1296 127.1296 0 0 1 126.976-126.976zM512 24.6784a380.416 380.416 0 0 0-380.0064 380.0064 25.6 25.6 0 0 0 51.2 0A329.1648 329.1648 0 0 1 512 75.8784a349.44 349.44 0 0 1 126.8736 25.344 25.6 25.6 0 1 0 17.7664-48.0256 397.4144 397.4144 0 0 0-144.64-28.5184zM512-117.0944a25.6 25.6 0 0 0-25.6 25.6v141.7728a25.6 25.6 0 0 0 51.2 0v-141.7728a25.6 25.6 0 0 0-25.6-25.6zM818.7904 201.6256a25.6 25.6 0 0 0-21.4528 39.5776 316.5184 316.5184 0 0 1 43.4176 163.4816 25.6 25.6 0 0 0 51.2 0 364.8512 364.8512 0 0 0-51.712-191.3856 25.6 25.6 0 0 0-21.4528-11.6736zM939.008-68.608a25.6 25.6 0 0 0-18.1248 7.4752L66.8672 792.8832a25.6 25.6 0 0 0 36.1984 36.1984l854.016-854.016a25.6 25.6 0 0 0-18.1248-43.7248z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="talk" unicode="" d="M515.072 885.0944a178.3808 178.3808 0 0 0 178.176-178.2272v-366.2336a178.2272 178.2272 0 0 0-356.4032 0V706.8672A178.3808 178.3808 0 0 0 515.072 885.0944z m0-671.4368a127.1296 127.1296 0 0 1 127.0272 127.0272V706.8672a127.0272 127.0272 0 0 1-254.0032 0v-366.2336a127.1296 127.1296 0 0 1 126.976-126.976zM512 24.67840000000001a380.416 380.416 0 0 0-380.0064 380.0064 25.6 25.6 0 0 0 51.2 0A329.1648 329.1648 0 0 1 512 75.87840000000006a349.44 349.44 0 0 1 126.8736 25.344 25.6 25.6 0 1 0 17.7664-48.0256 397.4144 397.4144 0 0 0-144.64-28.5184zM512-117.09439999999995a25.6 25.6 0 0 0-25.6 25.6v141.7728a25.6 25.6 0 0 0 51.2 0v-141.7728a25.6 25.6 0 0 0-25.6-25.6zM818.7904 201.62559999999996a25.6 25.6 0 0 0-21.4528 39.5776 316.5184 316.5184 0 0 1 43.4176 163.4816 25.6 25.6 0 0 0 51.2 0 364.8512 364.8512 0 0 0-51.712-191.3856 25.6 25.6 0 0 0-21.4528-11.6736zM939.008-68.60799999999995a25.6 25.6 0 0 0-18.1248 7.4752L66.8672 792.8832a25.6 25.6 0 0 0 36.1984 36.1984l854.016-854.016a25.6 25.6 0 0 0-18.1248-43.7248z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="icon_shouqi" unicode="" d="M716.8 376.456533a34.133333 34.133333 0 0 0-10.001067-24.132266l-336.349866-336.349867a34.133333 34.133333 0 0 0-48.264534 0 34.133333 34.133333 0 0 0 0 48.264533l312.183467 312.2176-329.0112 329.045334a34.133333 34.133333 0 0 0 0 48.264533 34.133333 34.133333 0 0 0 48.264533 0l353.1776-353.1776a34.133333 34.133333 0 0 0 10.001067-24.132267z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="icon_zhankai" unicode="" d="M295.355733 376.4224a34.133333 34.133333 0 0 0 10.001067 24.132267L658.5344 753.732267a34.133333 34.133333 0 0 0 48.264533 0 34.133333 34.133333 0 0 0 0-48.264534l-329.0112-329.045333 312.183467-312.2176a34.133333 34.133333 0 0 0-48.264533-48.264533l-336.349867 336.349866a34.133333 34.133333 0 0 0-10.001067 24.132267z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_YunLuXiang" unicode="" d="M307.264 20.096a239.488 239.488 0 0 0-55.552 472.384 32 32 0 0 0 14.784-62.272 175.488 175.488 0 1 1 88.704-339.52 32 32 0 1 0 17.472-61.568 239.808 239.808 0 0 0-65.408-9.024zM716.672 20.096a239.808 239.808 0 0 0-65.408 9.024 32 32 0 1 0 17.472 61.568 175.488 175.488 0 1 1 88.704 339.52 32 32 0 0 0 14.784 62.272 239.488 239.488 0 0 0-55.552-472.384zM763.712 434.944a32 32 0 0 0-32 32 216.96 216.96 0 0 1-433.856 0 32 32 0 1 0-64 0 280.96 280.96 0 0 0 561.856 0 32 32 0 0 0-32-32zM662.72 269.056a32 32 0 0 0-22.528 9.28L514.88 402.624l-121.6-121.6a32 32 0 0 0-45.312 45.184l143.872 144.32a32 32 0 0 0 45.184 0l147.968-146.816a32 32 0 0 0-22.528-54.72zM514.752 61.568a32 32 0 0 0-32 32V374.4a32 32 0 0 0 64 0v-280.832a32 32 0 0 0-32-32z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_BenDiLuXiang" unicode="" d="M298.688 842.688h554.688a32 32 0 0 0 32-32v-853.312a32 32 0 0 0-32-32H170.688a32 32 0 0 0-32 32V640a32 32 0 0 0 6.4 19.2l128 170.688a32 32 0 0 0 25.6 12.8z m522.688-64H314.688l-112-149.312v-640h618.688zM320 416a32 32 0 0 0-32 32V576a32 32 0 0 0 64 0v-128a32 32 0 0 0-32-32zM448 480a32 32 0 0 0-32 32V640a32 32 0 0 0 64 0v-128a32 32 0 0 0-32-32zM704 480a32 32 0 0 0-32 32V640a32 32 0 0 0 64 0v-128a32 32 0 0 0-32-32zM576 480a32 32 0 0 0-32 32V640a32 32 0 0 0 64 0v-128a32 32 0 0 0-32-32z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="voice_1" unicode="" d="M494.7456 819.2a25.6 25.6 0 0 0 25.6-25.6v-798.3616a25.6 25.6 0 0 0-25.6-25.6 302.4896 302.4896 0 0 0-212.0704 109.568A628.0704 628.0704 0 0 0 209.92 172.79999999999995H95.5392A70.0416 70.0416 0 0 0 25.6 242.73919999999998v306.688A70.0416 70.0416 0 0 0 95.5392 619.52H209.92c29.6448 46.08 139.008 199.68 284.8256 199.68z m-25.6-796.2624V765.9008c-126.0544-20.48-221.7984-183.1936-222.8224-184.9856a25.6 25.6 0 0 0-22.1696-12.8H95.5392a18.7904 18.7904 0 0 1-18.7392-18.7392v-306.688a18.7904 18.7904 0 0 1 18.7392-18.7392h128.6144a25.6 25.6 0 0 0 22.272-12.9536c0.9728-1.7408 96.6144-167.3216 222.72-188.0576zM929.0752 213.86239999999998a25.6 25.6 0 0 0-18.0736 7.4752l-289.0752 289.0752a25.6 25.6 0 0 0 36.1984 36.1984L947.2 257.53599999999994a25.6 25.6 0 0 0-18.1248-43.7248zM640 213.86239999999998a25.6 25.6 0 0 0-18.1248 43.7248l289.0752 289.0752a25.6 25.6 0 1 0 36.1984-36.1984l-289.024-289.1264a25.6 25.6 0 0 0-18.1248-7.4752z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_JingYin" unicode="" d="M494.7456 819.2a25.6 25.6 0 0 0 25.6-25.6v-798.3616a25.6 25.6 0 0 0-25.6-25.6 302.4896 302.4896 0 0 0-212.0704 109.568A628.0704 628.0704 0 0 0 209.92 172.8H95.5392A70.0416 70.0416 0 0 0 25.6 242.7392v306.688A70.0416 70.0416 0 0 0 95.5392 619.52H209.92c29.6448 46.08 139.008 199.68 284.8256 199.68z m-25.6-796.2624V765.9008c-126.0544-20.48-221.7984-183.1936-222.8224-184.9856a25.6 25.6 0 0 0-22.1696-12.8H95.5392a18.7904 18.7904 0 0 1-18.7392-18.7392v-306.688a18.7904 18.7904 0 0 1 18.7392-18.7392h128.6144a25.6 25.6 0 0 0 22.272-12.9536c0.9728-1.7408 96.6144-167.3216 222.72-188.0576zM929.0752 213.8624a25.6 25.6 0 0 0-18.0736 7.4752l-289.0752 289.0752a25.6 25.6 0 0 0 36.1984 36.1984L947.2 257.536a25.6 25.6 0 0 0-18.1248-43.7248zM640 213.8624a25.6 25.6 0 0 0-18.1248 43.7248l289.0752 289.0752a25.6 25.6 0 1 0 36.1984-36.1984l-289.024-289.1264a25.6 25.6 0 0 0-18.1248-7.4752z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="fullPage" unicode="" d="M501.76 0H163.84a87.04 87.04 0 0 0-87.04 87.04V424.96a25.6 25.6 0 0 0 25.6 25.6 25.6 25.6 0 0 0 25.6-25.6v-337.92a35.84 35.84 0 0 1 35.84-35.84h337.92a25.6 25.6 0 0 0 0-51.2zM911.36 317.44000000000005a25.6 25.6 0 0 0-25.6 25.6V680.96a35.84 35.84 0 0 1-35.84 35.84H512a25.6 25.6 0 0 0-25.6 25.6 25.6 25.6 0 0 0 25.6 25.6h337.92a87.04 87.04 0 0 0 87.04-87.04v-337.92a25.6 25.6 0 0 0-25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_QuanPing" unicode="" d="M501.76 0H163.84a87.04 87.04 0 0 0-87.04 87.04V424.96a25.6 25.6 0 0 0 25.6 25.6 25.6 25.6 0 0 0 25.6-25.6v-337.92a35.84 35.84 0 0 1 35.84-35.84h337.92a25.6 25.6 0 0 0 0-51.2zM911.36 317.44a25.6 25.6 0 0 0-25.6 25.6V680.96a35.84 35.84 0 0 1-35.84 35.84H512a25.6 25.6 0 0 0-25.6 25.6 25.6 25.6 0 0 0 25.6 25.6h337.92a87.04 87.04 0 0 0 87.04-87.04v-337.92a25.6 25.6 0 0 0-25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="clarity_1" unicode="" d="M258.6624 239.25760000000002a104.5504 104.5504 0 0 0-42.0864 85.504h49.8176a72.2432 72.2432 0 0 1 24.9344-49.8688 96.1024 96.1024 0 0 1 55.8592-13.312 109.4656 109.4656 0 0 1 53.248 11.1616 34.8672 34.8672 0 0 1 19.7632 30.72 43.4688 43.4688 0 0 1-28.7744 38.6048 563.2 563.2 0 0 1-59.6992 20.48 500.6848 500.6848 0 0 0-70.4512 25.6 67.7888 67.7888 0 0 0-35.2256 61.8496 72.704 72.704 0 0 0 34.3552 64 165.7344 165.7344 0 0 0 166.2464 0 98.2016 98.2016 0 0 0 36.9664-74.2912h-49.8688a66.8672 66.8672 0 0 1-23.6544 40.96 83.3024 83.3024 0 0 1-50.688 12.4416 94.464 94.464 0 0 1-44.2368-8.1408 32.8192 32.8192 0 0 1-18.8928-31.7952 34.8672 34.8672 0 0 1 21.4528-31.3856 438.3744 438.3744 0 0 1 52.4288-18.8928 480.0512 480.0512 0 0 0 80.3328-30.0544 73.5744 73.5744 0 0 0 39.936-66.1504 76.8 76.8 0 0 0-32.256-65.28 188.3648 188.3648 0 0 0-179.5584-1.6896z m392.7552-21.248h-115.6608V537.6h118.6304c103.7824-1.1776 156.2624-54.8864 157.3888-160.4096 2.9184-106.24-47.36-159.3344-151.7568-159.3344z m-63.232 43.5712h63.232c72.1408-1.1776 107.52 36.9664 106.7008 114.4832-1.1776 74.5472-36.352 112.64-104.9088 113.92h-65.024zM51.2 691.2v-629.0432h921.6V691.2H51.2M46.5408 742.4h930.9184a43.8784 43.8784 0 0 0 46.5408-40.6528v-650.24a43.8784 43.8784 0 0 0-46.5408-40.6528H46.5408A43.8784 43.8784 0 0 0 0 51.6096V701.7472A43.8784 43.8784 0 0 0 46.5408 742.4z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="voice" unicode="" d="M494.7456 819.2a25.6 25.6 0 0 0 25.6-25.6v-798.3616a25.6 25.6 0 0 0-25.6-25.6 302.4896 302.4896 0 0 0-212.0704 109.568A628.0704 628.0704 0 0 0 209.92 172.79999999999995H95.5392A70.0416 70.0416 0 0 0 25.6 242.73919999999998v306.688A70.0416 70.0416 0 0 0 95.5392 619.52H209.92c29.6448 46.08 139.008 199.68 284.8256 199.68z m-25.6-796.2624V765.9008c-126.0544-20.48-221.7984-183.1936-222.8224-184.9856a25.6 25.6 0 0 0-22.1696-12.8H95.5392a18.7904 18.7904 0 0 1-18.7392-18.7392v-306.688a18.7904 18.7904 0 0 1 18.7392-18.7392h128.6144a25.6 25.6 0 0 0 22.272-12.9536c0.9728-1.7408 96.6144-167.3216 222.72-188.0576zM672.1536 169.06240000000003a25.6 25.6 0 0 0-17.0496 44.6976 238.8992 238.8992 0 0 1 34.4576 38.2464 244.2752 244.2752 0 0 1-0.768 285.4912 238.8992 238.8992 0 0 1-33.7408 37.2224 25.6 25.6 0 0 0 34.0992 38.1952 293.632 293.632 0 0 0 0-437.4016 25.6 25.6 0 0 0-16.9984-6.4512zM721.7664-12.543999999999983a25.6 25.6 0 0 0-13.1584 47.5648 417.9968 417.9968 0 0 1 5.6832 715.3152 25.6 25.6 0 0 0 26.9312 43.52 469.1968 469.1968 0 0 0-6.3488-802.3552 25.6 25.6 0 0 0-13.1072-4.0448z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="capture" unicode="" d="M699.904 620.9536H308.3776a25.6 25.6 0 0 0-22.8864 37.0688L350.72 788.5312a25.6 25.6 0 0 0 22.8864 14.1312h261.12a25.6 25.6 0 0 0 22.8864-14.1312l65.28-130.5088a25.6 25.6 0 0 0-22.8864-37.0688z m-350.1056 51.2h308.6848l-39.6288 79.3088h-229.376zM153.6 672.1536h701.1328a128 128 0 0 0 128-128v-422.3488a128 128 0 0 0-128-128H153.6a128 128 0 0 0-128 128V544.1536a128 128 0 0 0 128 128z m701.1328-627.1488a76.8 76.8 0 0 1 76.8 76.8V544.1536a76.8 76.8 0 0 1-76.8 76.8H153.6a76.8 76.8 0 0 1-76.8-76.8v-422.3488a76.8 76.8 0 0 1 76.8-76.8zM503.6032 137.06240000000003a199.68 199.68 0 1 0 199.68 199.68 199.68 199.68 0 0 0-199.68-199.68z m0 348.16a148.48 148.48 0 1 1 148.48-148.48 148.48 148.48 0 0 1-148.48 148.48z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_LuPing" unicode="" d="M50.2784 716.8h716.8a25.6 25.6 0 0 0 25.6-25.6v-614.4a25.6 25.6 0 0 0-25.6-25.6h-716.8a25.6 25.6 0 0 0-25.6 25.6V691.2a25.6 25.6 0 0 0 25.6 25.6z m691.2-51.2h-665.6v-563.2h665.6zM971.8784 640a25.6 25.6 0 0 0 25.6-25.6v-460.8a25.6 25.6 0 0 0-40.96-20.48l-204.8 155.5456a25.6 25.6 0 0 0-10.24 20.48V458.9056a25.6 25.6 0 0 0 10.24 20.48l204.8 155.4944a25.6 25.6 0 0 0 15.36 5.12z m-25.6-434.7904V562.7904l-153.6-116.6336v-124.3648zM358.4 241.92a25.6 25.6 0 0 0-16.384 45.2608L458.1888 384 342.016 480.8192a25.6 25.6 0 0 0 32.768 39.3216l139.776-116.48a25.6 25.6 0 0 0 0-39.3216l-139.776-116.48a25.6 25.6 0 0 0-16.384-5.9392z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_HD" unicode="" d="M413.4912 536.4224h54.272v-319.5904h-54.272v141.9264H257.28v-141.9264H204.8V536.4224h52.48v-131.1744h156.2112z m237.8752-318.3616H535.552V537.6512h118.6304c103.7312-1.1776 156.2112-54.8352 157.3888-160.4096 3.1744-109.1584-49.8688-162.2016-160.2048-159.232z m1.792 271.872h-64.9728v-228.352h63.1808c72.1408-1.1776 107.52 36.9664 106.7008 114.4832-1.1776 74.496-36.352 112.64-104.7552 113.8176zM51.2 691.2v-629.0432h921.6V691.2H51.2M46.5408 742.4h930.9184a43.8784 43.8784 0 0 0 46.5408-40.6528v-650.24a43.8784 43.8784 0 0 0-46.5408-40.6528H46.5408A43.8784 43.8784 0 0 0 0 51.6096V701.7472A43.8784 43.8784 0 0 0 46.5408 742.4z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Voice" unicode="" d="M494.7456 819.2a25.6 25.6 0 0 0 25.6-25.6v-798.3616a25.6 25.6 0 0 0-25.6-25.6 302.4896 302.4896 0 0 0-212.0704 109.568A628.0704 628.0704 0 0 0 209.92 172.8H95.5392A70.0416 70.0416 0 0 0 25.6 242.7392v306.688A70.0416 70.0416 0 0 0 95.5392 619.52H209.92c29.6448 46.08 139.008 199.68 284.8256 199.68z m-25.6-796.2624V765.9008c-126.0544-20.48-221.7984-183.1936-222.8224-184.9856a25.6 25.6 0 0 0-22.1696-12.8H95.5392a18.7904 18.7904 0 0 1-18.7392-18.7392v-306.688a18.7904 18.7904 0 0 1 18.7392-18.7392h128.6144a25.6 25.6 0 0 0 22.272-12.9536c0.9728-1.7408 96.6144-167.3216 222.72-188.0576zM672.1536 169.0624a25.6 25.6 0 0 0-17.0496 44.6976 238.8992 238.8992 0 0 1 34.4576 38.2464 244.2752 244.2752 0 0 1-0.768 285.4912 238.8992 238.8992 0 0 1-33.7408 37.2224 25.6 25.6 0 0 0 34.0992 38.1952 293.632 293.632 0 0 0 0-437.4016 25.6 25.6 0 0 0-16.9984-6.4512zM721.7664-12.544a25.6 25.6 0 0 0-13.1584 47.5648 417.9968 417.9968 0 0 1 5.6832 715.3152 25.6 25.6 0 0 0 26.9312 43.52 469.1968 469.1968 0 0 0-6.3488-802.3552 25.6 25.6 0 0 0-13.1072-4.0448z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_ScreenShot" unicode="" d="M699.904 620.9536H308.3776a25.6 25.6 0 0 0-22.8864 37.0688L350.72 788.5312a25.6 25.6 0 0 0 22.8864 14.1312h261.12a25.6 25.6 0 0 0 22.8864-14.1312l65.28-130.5088a25.6 25.6 0 0 0-22.8864-37.0688z m-350.1056 51.2h308.6848l-39.6288 79.3088h-229.376zM153.6 672.1536h701.1328a128 128 0 0 0 128-128v-422.3488a128 128 0 0 0-128-128H153.6a128 128 0 0 0-128 128V544.1536a128 128 0 0 0 128 128z m701.1328-627.1488a76.8 76.8 0 0 1 76.8 76.8V544.1536a76.8 76.8 0 0 1-76.8 76.8H153.6a76.8 76.8 0 0 1-76.8-76.8v-422.3488a76.8 76.8 0 0 1 76.8-76.8zM503.6032 137.0624a199.68 199.68 0 1 0 199.68 199.68 199.68 199.68 0 0 0-199.68-199.68z m0 348.16a148.48 148.48 0 1 1 148.48-148.48 148.48 148.48 0 0 1-148.48 148.48z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_SD" unicode="" d="M258.6624 239.2576a104.5504 104.5504 0 0 0-42.0864 85.504h49.8176a72.2432 72.2432 0 0 1 24.9344-49.8688 96.1024 96.1024 0 0 1 55.8592-13.312 109.4656 109.4656 0 0 1 53.248 11.1616 34.8672 34.8672 0 0 1 19.7632 30.72 43.4688 43.4688 0 0 1-28.7744 38.6048 563.2 563.2 0 0 1-59.6992 20.48 500.6848 500.6848 0 0 0-70.4512 25.6 67.7888 67.7888 0 0 0-35.2256 61.8496 72.704 72.704 0 0 0 34.3552 64 165.7344 165.7344 0 0 0 166.2464 0 98.2016 98.2016 0 0 0 36.9664-74.2912h-49.8688a66.8672 66.8672 0 0 1-23.6544 40.96 83.3024 83.3024 0 0 1-50.688 12.4416 94.464 94.464 0 0 1-44.2368-8.1408 32.8192 32.8192 0 0 1-18.8928-31.7952 34.8672 34.8672 0 0 1 21.4528-31.3856 438.3744 438.3744 0 0 1 52.4288-18.8928 480.0512 480.0512 0 0 0 80.3328-30.0544 73.5744 73.5744 0 0 0 39.936-66.1504 76.8 76.8 0 0 0-32.256-65.28 188.3648 188.3648 0 0 0-179.5584-1.6896z m392.7552-21.248h-115.6608V537.6h118.6304c103.7824-1.1776 156.2624-54.8864 157.3888-160.4096 2.9184-106.24-47.36-159.3344-151.7568-159.3344z m-63.232 43.5712h63.232c72.1408-1.1776 107.52 36.9664 106.7008 114.4832-1.1776 74.5472-36.352 112.64-104.9088 113.92h-65.024zM51.2 691.2v-629.0432h921.6V691.2H51.2M46.5408 742.4h930.9184a43.8784 43.8784 0 0 0 46.5408-40.6528v-650.24a43.8784 43.8784 0 0 0-46.5408-40.6528H46.5408A43.8784 43.8784 0 0 0 0 51.6096V701.7472A43.8784 43.8784 0 0 0 46.5408 742.4z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_YunTai" unicode="" d="M514.7136 490.7008a109.4144 109.4144 0 1 1 109.4144-109.4144 109.5168 109.5168 0 0 1-109.4144 109.4144m0 51.2a160.6144 160.6144 0 1 0-160.6144-160.6144 160.6144 160.6144 0 0 0 160.6144 160.6144zM804.9664 182.5792a25.6 25.6 0 0 0-18.1248 43.7248l160.4096 160.4608-160.4096 160.4096a25.6 25.6 0 0 0 36.1984 36.1984l178.5344-178.5344a25.6 25.6 0 0 0 0-36.1984l-178.5344-178.5344a25.6 25.6 0 0 0-18.0736-7.5264zM310.5792 91.0336a25.6 25.6 0 0 0 7.4752 18.1248 25.6 25.6 0 0 0 36.1984 0l160.4608-160.4608 160.4096 160.4608a25.6 25.6 0 0 0 36.1984 0 25.6 25.6 0 0 0 0-36.1984l-178.4832-178.5856a25.6 25.6 0 0 0-36.1984 0l-178.5856 178.5344a25.6 25.6 0 0 0-7.4752 18.1248zM219.0336 177.152a25.6 25.6 0 0 0-18.1248 7.4752L22.3744 363.1616a25.6 25.6 0 0 0 0 36.1984l178.5344 178.5344a25.6 25.6 0 1 0 36.1984-36.1984l-160.4096-160.4096 160.4096-160.4608a25.6 25.6 0 0 0-18.1248-43.7248zM305.152 676.9664a25.6 25.6 0 0 0 7.4752 18.1248L491.1616 873.6256a25.6 25.6 0 0 0 36.1984 0l178.5856-178.5344a25.6 25.6 0 0 0 0-36.1984 25.6 25.6 0 0 0-36.1984 0L509.2864 819.3024 348.8768 658.8416a25.6 25.6 0 0 0-43.7248 18.1248z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_WangYeQuanPing" unicode="" d="M326.6048-53.8624H94.8224a74.752 74.752 0 0 0-71.936 77.3632V744.5504a74.752 74.752 0 0 0 71.936 77.1072h834.304a74.752 74.752 0 0 0 71.936-77.1072v-154.5216a25.6 25.6 0 1 0-51.2 0V744.5504a24.064 24.064 0 0 1-20.736 25.9072H94.8224a24.064 24.064 0 0 1-20.736-25.9072v-721.0496a24.064 24.064 0 0 1 20.736-25.9072h231.7824a25.6 25.6 0 0 0 0-51.2zM583.7824 409.6h309.6576a76.8 76.8 0 0 0 76.8-76.8v-309.6576a76.8 76.8 0 0 0-76.8-76.8h-309.6576a76.8 76.8 0 0 0-76.8 76.8V332.8a76.8 76.8 0 0 0 76.8 76.8z m309.6576-412.0576a25.6 25.6 0 0 1 25.6 25.6V332.8a25.6 25.6 0 0 1-25.6 25.6h-309.6576a25.6 25.6 0 0 1-25.6-25.6v-309.6576a25.6 25.6 0 0 1 25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="clarity" unicode="" d="M413.4912 536.4223999999999h54.272v-319.5904h-54.272v141.9264H257.28v-141.9264H204.8V536.4223999999999h52.48v-131.1744h156.2112z m237.8752-318.3616H535.552V537.6512h118.6304c103.7312-1.1776 156.2112-54.8352 157.3888-160.4096 3.1744-109.1584-49.8688-162.2016-160.2048-159.232z m1.792 271.872h-64.9728v-228.352h63.1808c72.1408-1.1776 107.52 36.9664 106.7008 114.4832-1.1776 74.496-36.352 112.64-104.7552 113.8176zM51.2 691.2v-629.0432h921.6V691.2H51.2M46.5408 742.4h930.9184a43.8784 43.8784 0 0 0 46.5408-40.6528v-650.24a43.8784 43.8784 0 0 0-46.5408-40.6528H46.5408A43.8784 43.8784 0 0 0 0 51.6096V701.7472A43.8784 43.8784 0 0 0 46.5408 742.4z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="WangYeQuanPing" unicode="" d="M326.6048-53.86239999999998H94.8224a74.752 74.752 0 0 0-71.936 77.3632V744.5504a74.752 74.752 0 0 0 71.936 77.1072h834.304a74.752 74.752 0 0 0 71.936-77.1072v-154.5216a25.6 25.6 0 1 0-51.2 0V744.5504a24.064 24.064 0 0 1-20.736 25.9072H94.8224a24.064 24.064 0 0 1-20.736-25.9072v-721.0496a24.064 24.064 0 0 1 20.736-25.9072h231.7824a25.6 25.6 0 0 0 0-51.2zM583.7824 409.6h309.6576a76.8 76.8 0 0 0 76.8-76.8v-309.6576a76.8 76.8 0 0 0-76.8-76.8h-309.6576a76.8 76.8 0 0 0-76.8 76.8V332.79999999999995a76.8 76.8 0 0 0 76.8 76.8z m309.6576-412.0576a25.6 25.6 0 0 1 25.6 25.6V332.79999999999995a25.6 25.6 0 0 1-25.6 25.6h-309.6576a25.6 25.6 0 0 1-25.6-25.6v-309.6576a25.6 25.6 0 0 1 25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Play" unicode="" d="M859.2896 384a75.3664 75.3664 0 0 1-35.84 65.1264L373.504 730.1632A76.8 76.8 0 0 1 256 665.0368v-562.0736a76.8 76.8 0 0 1 117.76-65.1264l449.4336 281.0368A75.3664 75.3664 0 0 1 859.2896 384m51.2 0a126.9248 126.9248 0 0 0-60.16-108.544l-449.6896-281.0368A128 128 0 0 0 204.8 102.9632V665.0368a128 128 0 0 0 195.84 108.544l449.6896-281.0368A126.9248 126.9248 0 0 0 910.4896 384z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Stop" unicode="" d="M307.2 0a25.6 25.6 0 0 0-25.6 25.6V742.4a25.6 25.6 0 0 0 51.2 0v-716.8a25.6 25.6 0 0 0-25.6-25.6zM716.8 0a25.6 25.6 0 0 0-25.6 25.6V742.4a25.6 25.6 0 0 0 51.2 0v-716.8a25.6 25.6 0 0 0-25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="play_1" unicode="" d="M307.2 0a25.6 25.6 0 0 0-25.6 25.6V742.4a25.6 25.6 0 0 0 51.2 0v-716.8a25.6 25.6 0 0 0-25.6-25.6zM716.8 0a25.6 25.6 0 0 0-25.6 25.6V742.4a25.6 25.6 0 0 0 51.2 0v-716.8a25.6 25.6 0 0 0-25.6-25.6z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="play" unicode="" d="M859.2896 384a75.3664 75.3664 0 0 1-35.84 65.1264L373.504 730.1632A76.8 76.8 0 0 1 256 665.0368v-562.0736a76.8 76.8 0 0 1 117.76-65.1264l449.4336 281.0368A75.3664 75.3664 0 0 1 859.2896 384m51.2 0a126.9248 126.9248 0 0 0-60.16-108.544l-449.6896-281.0368A128 128 0 0 0 204.8 102.96320000000003V665.0368a128 128 0 0 0 195.84 108.544l449.6896-281.0368A126.9248 126.9248 0 0 0 910.4896 384z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_SDcard" unicode="" d="M845.376-75.392H169.088a32 32 0 0 0-32 32V633.088a32 32 0 0 0 6.4 19.2l126.784 169.088a32.32 32.32 0 0 0 25.6 12.8h549.504a32 32 0 0 0 32-32v-845.376a32 32 0 0 0-32-32.192zM316.992 601.472a32 32 0 0 1-32-32v-126.784a32 32 0 0 1 32-32 32 32 0 0 1 32 32V569.472a32 32 0 0 1-31.936 32z m380.416 63.424a32 32 0 0 1-32-32v-126.784a32 32 0 0 1 32-32 32 32 0 0 1 32 32V633.088a32 32 0 0 1-32 32z m-126.784 0a32 32 0 0 1-32-32v-126.784a32 32 0 0 1 32-32 32 32 0 0 1 32 32V633.088a32 32 0 0 1-32 32z m-126.848 0a32 32 0 0 1-32-32v-126.784a32 32 0 0 1 32-32 32 32 0 0 1 32 32V633.088a32 32 0 0 1-31.936 32z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Cloud" unicode="" d="M997.248 311.232a274.624 274.624 0 0 0-272.896-275.968H269.376A244.736 244.736 0 0 0 26.752 267.648a232.768 232.768 0 0 0 151.616 211.904 60.608 60.608 0 0 1 36.224 43.904 270.08 270.08 0 0 0 267.072 209.408 275.2 275.2 0 0 0 230.784-122.304 60.672 60.672 0 0 1 41.92-26.752 279.872 279.872 0 0 0 242.88-272.576z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Left" unicode="" d="M227.968 304a102.4 102.4 0 0 0 0 159.872L601.6 762.88a102.4 102.4 0 0 0 166.4-80v-597.888a102.4 102.4 0 0 0-166.4-79.872z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Icon_Right" unicode="" d="M796.032 464a102.4 102.4 0 0 0 0-159.872L422.4 5.12A102.4 102.4 0 0 0 256 85.12V683.008a102.4 102.4 0 0 0 166.4 79.872z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Console_icon_delete" unicode="" d="M805.248 0.256L511.872 293.504 218.624 0.256a64 64 0 0 0-45.312-18.816A64 64 0 0 0 128 0.256a64 64 0 0 0 0 90.496L421.248 384 128 677.248a64 64 0 0 0 0 90.496 64 64 0 0 0 90.496 0l293.248-293.248L805.12 767.744a64 64 0 0 0 90.496 0 64 64 0 0 0 0-90.496L602.368 384l293.248-293.248a64 64 0 0 0 0-90.496 64 64 0 0 0-45.312-18.816 64 64 0 0 0-45.056 18.816z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="Console_icon_calendar" unicode="" d="M179.153455 1.815273a116.363636 116.363636 0 0 0-116.363637 116.363636V559.197091a116.363636 116.363636 0 0 0 116.363637 116.363636h91.648V732.578909a23.272727 23.272727 0 0 0 23.272727 23.272727 23.272727 23.272727 0 0 0 23.272727-23.272727v-56.878545h369.570909V732.578909a23.272727 23.272727 0 0 0 23.272727 23.272727 23.272727 23.272727 0 0 0 23.272728-23.272727v-56.878545h95.744a116.363636 116.363636 0 0 0 116.363636-116.363637v-441.157818a116.363636 116.363636 0 0 0-116.363636-116.363636z m-69.818182 557.335272v-440.971636a69.818182 69.818182 0 0 1 69.818182-69.818182h650.053818a69.818182 69.818182 0 0 1 69.818182 69.818182V559.197091a69.818182 69.818182 0 0 1-69.818182 69.818182h-95.744V565.992727a23.272727 23.272727 0 0 0-23.272728-23.272727 23.272727 23.272727 0 0 0-23.272727 23.272727V629.015273h-369.570909V565.992727a23.272727 23.272727 0 0 0-23.272727-23.272727 23.272727 23.272727 0 0 0-23.272727 23.272727V629.015273H179.153455a69.818182 69.818182 0 0 1-69.818182-69.678546z m184.785454-370.129454a23.272727 23.272727 0 0 0-23.272727 23.272727 23.272727 23.272727 0 0 0 23.272727 23.272727h416.116364a23.272727 23.272727 0 0 0 23.272727-23.272727 23.272727 23.272727 0 0 0-23.272727-23.272727z m0 166.446545a23.272727 23.272727 0 0 0-23.272727 23.272728 23.272727 23.272727 0 0 0 23.272727 23.272727h228.864a23.272727 23.272727 0 0 0 23.272728-23.272727 23.272727 23.272727 0 0 0-23.272728-23.272728z" horiz-adv-x="1024" />
|
||||
|
||||
<glyph glyph-name="code_icon_copy" unicode="" d="M136.192-91.428571A99.766857 99.766857 0 0 0 36.571429 8.192V574.171429a99.693714 99.693714 0 0 0 99.620571 99.620571h86.089143V759.881143A99.766857 99.766857 0 0 0 321.828571 859.428571h565.906286A99.766857 99.766857 0 0 0 987.428571 759.808V193.828571a99.693714 99.693714 0 0 0-99.620571-99.620571h-86.089143v-86.089143A99.766857 99.766857 0 0 0 702.171429-91.428571z m-30.939429 665.6v-565.906286a31.012571 31.012571 0 0 1 30.939429-31.012572H702.171429a31.012571 31.012571 0 0 1 31.012571 31.012572V574.171429a31.012571 31.012571 0 0 1-31.012571 30.939428H136.265143a31.012571 31.012571 0 0 1-31.012572-30.939428z m782.628572-411.136a31.012571 31.012571 0 0 1 30.939428 30.939428V759.881143a31.012571 31.012571 0 0 1-30.939428 31.012571H321.828571a31.012571 31.012571 0 0 1-31.012571-31.012571v-86.089143H702.171429A99.766857 99.766857 0 0 0 801.792 574.171429v-411.136z" horiz-adv-x="1024" />
|
||||
|
||||
</font>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 458 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 346 KiB |
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,14 @@
|
|||
/*!
|
||||
* Layui
|
||||
* Classic modular Front-End UI library
|
||||
* MIT Licensed
|
||||
*/
|
||||
|
||||
/*!
|
||||
* layDate 日期与时间组件(单独版)
|
||||
* MIT Licensed
|
||||
*/
|
||||
|
||||
/*! lay 基础 DOM 操作 | MIT Licensed */
|
||||
|
||||
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -18,6 +18,11 @@
|
|||
nprogress,toastr,admui,turf,mars3d,mars3d-widget,mars3d-esri,mars3d-echarts"
|
||||
></script>
|
||||
|
||||
<script type="text/javascript" src="imouPlayer.js"></script>
|
||||
<link rel="stylesheet" href="index.css">
|
||||
<script>
|
||||
console.log("imouPlayer",imouPlayer)
|
||||
</script>
|
||||
<link rel="stylesheet" href="http://mars3d.cn/temp/css/divGraphic.css">
|
||||
</head>
|
||||
<body style="padding:0px;">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,145 @@
|
|||
.flex{
|
||||
display: flex;
|
||||
}
|
||||
.flex-1{
|
||||
flex: 1;
|
||||
}
|
||||
.wrap{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.nowrap{
|
||||
flex-wrap: nowrap;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.row{
|
||||
flex-direction: row;
|
||||
}
|
||||
.column{
|
||||
flex-direction: column;
|
||||
}
|
||||
.hidden{
|
||||
overflow: hidden;
|
||||
}
|
||||
.auto{
|
||||
overflow: auto;
|
||||
}
|
||||
.ai-c{
|
||||
align-items: center;
|
||||
}
|
||||
.ai-e{
|
||||
align-items: end;
|
||||
}
|
||||
.jc-se{
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.jc-sa{
|
||||
justify-content: space-around;
|
||||
}
|
||||
.jc-sb{
|
||||
justify-content: space-between;
|
||||
}
|
||||
.jc-c{
|
||||
justify-content: center;
|
||||
}
|
||||
.jc-e{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.mt-1{
|
||||
margin-top: 10px;
|
||||
}
|
||||
.mt-2{
|
||||
margin-top: 20px;
|
||||
}
|
||||
.mt-3{
|
||||
margin-top: 30px;
|
||||
}
|
||||
.ml-1{
|
||||
margin-left: 10px;
|
||||
}
|
||||
.ml-2{
|
||||
margin-left: 20px;
|
||||
}
|
||||
.ml-3{
|
||||
margin-left: 30px;
|
||||
}
|
||||
.mb-1{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.mb-2{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.mb-3{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.mr-1{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mr-2{
|
||||
margin-right: 20px;
|
||||
}
|
||||
.mr-3{
|
||||
margin-right: 30px;
|
||||
}
|
||||
.ta-c{
|
||||
text-align: center;
|
||||
}
|
||||
.ta-l{
|
||||
text-align: left;
|
||||
}
|
||||
.cursor{
|
||||
cursor: pointer;
|
||||
}
|
||||
.pos-r{
|
||||
position: relative;
|
||||
}
|
||||
.pos-a{
|
||||
position: absolute;
|
||||
}
|
||||
.pos-f{
|
||||
position: fixed;
|
||||
}
|
||||
.max-w{
|
||||
width: 100%;
|
||||
}
|
||||
.max-h{
|
||||
height: 100%;
|
||||
}
|
||||
.fz-12{
|
||||
font-size: 12px;
|
||||
}
|
||||
.fz-14{
|
||||
font-size: 14px;
|
||||
}
|
||||
.fz-16{
|
||||
font-size: 16px;
|
||||
}
|
||||
.fz-18{
|
||||
font-size: 18px;
|
||||
}
|
||||
.fz-20{
|
||||
font-size: 20px;
|
||||
}
|
||||
.fz-22{
|
||||
font-size: 22px;
|
||||
}
|
||||
.fz-24{
|
||||
font-size: 24px;
|
||||
}
|
||||
.fz-26{
|
||||
font-size: 26px;
|
||||
}
|
||||
.fz-28{
|
||||
font-size: 28px;
|
||||
}
|
||||
.fc-w{
|
||||
color: white;
|
||||
}
|
||||
.fc-b{
|
||||
color: black;
|
||||
}
|
||||
.fc-r{
|
||||
color: red;
|
||||
}
|
||||
.fw-b{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -0,0 +1,365 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="./common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0,0,0,0);
|
||||
position:relative;
|
||||
}
|
||||
.camera-box{
|
||||
width: 720px;
|
||||
height: 360px;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
left:50%;
|
||||
top:50%;
|
||||
transform:translate(-50%,-50%);
|
||||
z-index: 9999;
|
||||
}
|
||||
.camera-header{
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
}
|
||||
.camera-header img{
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
.camera-body{
|
||||
|
||||
width: 90%;
|
||||
height: 230px;
|
||||
/* border: 1px solid #fff; */
|
||||
margin-left: 5%;
|
||||
}
|
||||
.camera-footer{
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
color: #4371ec;
|
||||
text-align: left;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.camera-footer span{
|
||||
margin-left: 5px;
|
||||
}
|
||||
.playWnd {
|
||||
width: 360px; /*播放容器的宽和高设定*/
|
||||
height: 230px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box">
|
||||
<div class="camera-header ">
|
||||
<span class="fz-16" id="carmerName"></span>
|
||||
<img src="../img/close.png" class="cursor" id="closeBtn" />
|
||||
</div>
|
||||
<div class="camera-body">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
<div class="camera-footer mt-1" style="display: none;">
|
||||
设备编号:<span id="carmerCard"></span>
|
||||
</div>
|
||||
<div style="display: none;" id="carmerAppKey"></div>
|
||||
<div style="display: none;" id="carmerIp"></div>
|
||||
<div style="display: none;" id="carmerPort"></div>
|
||||
<div style="display: none;" id="appSecret"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
console.log("play-data",e.data);
|
||||
$("#carmerName").text(e.data[0])
|
||||
$("#carmerCard").text(e.data[1])
|
||||
$("#carmerAppKey").text(e.data[2])
|
||||
$("#carmerIp").text(e.data[3])
|
||||
$("#carmerPort").text(e.data[4])
|
||||
$("#appSecret").text(e.data[5])
|
||||
}
|
||||
}, false)
|
||||
|
||||
initPlugin();
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
// initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号,建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 780, 430).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动,正在尝试启动,请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数,采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
window.parent.alertInstallVideoPlayer();
|
||||
$("#playWnd").html("插件启动失败,请检查插件是否安装!");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开:bNormalClose = false
|
||||
// JS_Disconnect正常断开:bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
// var appkey = "21274765"; //综合安防管理平台提供的appkey,必填
|
||||
// var ip = "223.99.16.253"; //综合安防管理平台IP地址,必填
|
||||
// var port = 1443; //综合安防管理平台端口,若启用HTTPS协议,默认443
|
||||
|
||||
var appkey = $("#carmerAppKey").text(); //综合安防管理平台提供的appkey,必填
|
||||
var ip = $("#carmerIp").text(); //综合安防管理平台IP地址,必填
|
||||
var port = Number($("#carmerPort").text());
|
||||
var appSecret = $("#appSecret").text();
|
||||
console.log(appkey,ip,port,appSecret)
|
||||
// var secret = setEncrypt("tGJdjmKxKxVWtzp1M6px"); //综合安防管理平台提供的secret,必填
|
||||
var secret = setEncrypt(appSecret); //综合安防管理平台提供的secret,必填
|
||||
|
||||
var playMode = 0; //初始播放模式:0-预览,1-回放
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互,这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段,默认加密领域为secret
|
||||
var showToolbar = 1; //是否显示工具栏,0-不显示,非0-显示
|
||||
var showSmart = 1; //是否显示智能信息(如配置移动侦测后画面上的线框),0-不显示,非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式(决定显示预览还是回放界面)
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(780, 430); // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件,使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(780, 430);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件,使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(780, 430);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪,当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 360) ? 360 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 230) ? 230 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 360) ? 360 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 230) ? 230 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 230); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 230);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条,防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(360 - iCoverRight, 0, iCoverRight, 230);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 230 - iCoverBottom, 360, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,318 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="../../common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
/* width: 100vw;
|
||||
height: 100vh; */
|
||||
}
|
||||
.camera-box{
|
||||
width: 180px;
|
||||
height: 115px;
|
||||
background: rgba(19,21,35,.9);
|
||||
box-shadow: 0 0 0.0625rem 0.3125rem hsl(0deg 0% 100% / 10%);
|
||||
border: 1px solid #386df5;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
bottom: 130px;
|
||||
z-index: 999;
|
||||
padding: 10px;
|
||||
}
|
||||
.camera-body{
|
||||
width: 100%;
|
||||
height: 115px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.playWnd {
|
||||
width: 180px; /*播放容器的宽和高设定*/
|
||||
height: 115px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box fc-w fz-14">
|
||||
<div class="camera-body pos-r">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="carmerCard" style="display: none;"></div>
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
$("#carmerCard").text(e.data[0])
|
||||
}
|
||||
}, false)
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号,建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 180, 115).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动,正在尝试启动,请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数,采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
$("#playWnd").html("插件启动失败,请检查插件是否安装!");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开:bNormalClose = false
|
||||
// JS_Disconnect正常断开:bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
var appkey = "21274765"; //综合安防管理平台提供的appkey,必填
|
||||
var secret = setEncrypt("CraRtGvpNB2xOcYSFTov"); //综合安防管理平台提供的secret,必填
|
||||
var ip = "223.99.16.253"; //综合安防管理平台IP地址,必填
|
||||
var playMode = 0; //初始播放模式:0-预览,1-回放
|
||||
var port = 1443; //综合安防管理平台端口,若启用HTTPS协议,默认443
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互,这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段,默认加密领域为secret
|
||||
var showToolbar = 1; //是否显示工具栏,0-不显示,非0-显示
|
||||
var showSmart = 1; //是否显示智能信息(如配置移动侦测后画面上的线框),0-不显示,非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式(决定显示预览还是回放界面)
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(180, 115); // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件,使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件,使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪,当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 180) ? 180 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 115) ? 115 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 180) ? 180 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 115) ? 115 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 115); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 115);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条,防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(180 - iCoverRight, 0, iCoverRight, 115);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 115 - iCoverBottom, 180, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,318 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>preview_demo</title>
|
||||
<link href="../../common.css" rel="stylesheet">
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.camera-dia{
|
||||
/* width: 100vw;
|
||||
height: 100vh; */
|
||||
}
|
||||
.camera-box{
|
||||
width: 180px;
|
||||
height: 115px;
|
||||
background: rgba(19,21,35,.9);
|
||||
box-shadow: 0 0 0.0625rem 0.3125rem hsl(0deg 0% 100% / 10%);
|
||||
border: 1px solid #386df5;
|
||||
border-radius: 5px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
bottom: 10px;
|
||||
z-index: 999;
|
||||
padding: 10px;
|
||||
}
|
||||
.camera-body{
|
||||
width: 100%;
|
||||
height: 115px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.playWnd {
|
||||
width: 180px; /*播放容器的宽和高设定*/
|
||||
height: 115px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box fc-w fz-14">
|
||||
<div class="camera-body pos-r">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="carmerCard" style="display: none;"></div>
|
||||
</body>
|
||||
|
||||
<!--三个必要的js文件引入-->
|
||||
<script src="jquery-1.12.4.min.js"></script>
|
||||
<script src="jsencrypt.min.js"></script> <!-- 用于RSA加密 -->
|
||||
<script src="jsWebControl-1.0.0.min.js"></script> <!-- 用于前端与插件交互 -->
|
||||
|
||||
<script type="text/javascript">
|
||||
window.onload = () => {
|
||||
// 子页面接收消息
|
||||
window.addEventListener('message', function (e) {
|
||||
if (e.data) {
|
||||
$("#carmerCard").text(e.data[0])
|
||||
}
|
||||
}, false)
|
||||
}
|
||||
$("#closeBtn").click(function(){
|
||||
window.parent.postMessage(
|
||||
{
|
||||
cmd: 'close'
|
||||
}
|
||||
)
|
||||
})
|
||||
//页面加载时创建播放实例初始化
|
||||
$(window).load(function () {
|
||||
initPlugin();
|
||||
});
|
||||
|
||||
//声明公用变量
|
||||
var initCount = 0;
|
||||
var pubKey = '';
|
||||
|
||||
// 创建播放实例
|
||||
function initPlugin () {
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd", // 指定容器id
|
||||
iServicePortStart: 15900, // 指定起止端口号,建议使用该值
|
||||
iServicePortEnd: 15909,
|
||||
szClassId:"23BF3B0A-2C56-4D97-9C03-0CB103AA8F11", // 用于IE10使用ActiveX的clsid
|
||||
cbConnectSuccess: function () { // 创建WebControl实例成功
|
||||
oWebControl.JS_StartService("window", { // WebControl实例创建成功后需要启动服务
|
||||
dllPath: "./VideoPluginConnect.dll" // 值"./VideoPluginConnect.dll"写死
|
||||
}).then(function () { // 启动插件服务成功
|
||||
oWebControl.JS_SetWindowControlCallback({ // 设置消息回调
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
|
||||
oWebControl.JS_CreateWnd("playWnd", 180, 115).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定
|
||||
init(); // 创建播放实例成功后初始化
|
||||
});
|
||||
}, function () { // 启动插件服务失败
|
||||
});
|
||||
},
|
||||
cbConnectError: function () { // 创建WebControl实例失败
|
||||
oWebControl = null;
|
||||
$("#playWnd").html("插件未启动,正在尝试启动,请稍候...");
|
||||
WebControl.JS_WakeUp("VideoWebPlugin://"); // 程序未启动时执行error函数,采用wakeup来启动程序
|
||||
initCount ++;
|
||||
if (initCount < 3) {
|
||||
setTimeout(function () {
|
||||
initPlugin();
|
||||
}, 3000)
|
||||
} else {
|
||||
$("#playWnd").html("插件启动失败,请检查插件是否安装!");
|
||||
}
|
||||
},
|
||||
cbConnectClose: function (bNormalClose) {
|
||||
// 异常断开:bNormalClose = false
|
||||
// JS_Disconnect正常断开:bNormalClose = true
|
||||
oWebControl = null;
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 设置窗口控制回调
|
||||
function setCallbacks() {
|
||||
oWebControl.JS_SetWindowControlCallback({
|
||||
cbIntegrationCallBack: cbIntegrationCallBack
|
||||
});
|
||||
}
|
||||
|
||||
// 推送消息
|
||||
function cbIntegrationCallBack(oData) {
|
||||
// showCBInfo(JSON.stringify(oData.responseMsg));
|
||||
}
|
||||
|
||||
//初始化
|
||||
function init()
|
||||
{
|
||||
getPubKey(function () {
|
||||
|
||||
////////////////////////////////// 请自行修改以下变量值 ////////////////////////////////////
|
||||
var appkey = "21274765"; //综合安防管理平台提供的appkey,必填
|
||||
var secret = setEncrypt("CraRtGvpNB2xOcYSFTov"); //综合安防管理平台提供的secret,必填
|
||||
var ip = "223.99.16.253"; //综合安防管理平台IP地址,必填
|
||||
var playMode = 0; //初始播放模式:0-预览,1-回放
|
||||
var port = 1443; //综合安防管理平台端口,若启用HTTPS协议,默认443
|
||||
var snapDir = "D:\\SnapDir"; //抓图存储路径
|
||||
var videoDir = "D:\\VideoDir"; //紧急录像或录像剪辑存储路径
|
||||
var layout = "1x1"; //playMode指定模式的布局
|
||||
var enableHTTPS = 1; //是否启用HTTPS协议与综合安防管理平台交互,这里总是填1
|
||||
var encryptedFields = 'secret'; //加密字段,默认加密领域为secret
|
||||
var showToolbar = 1; //是否显示工具栏,0-不显示,非0-显示
|
||||
var showSmart = 1; //是否显示智能信息(如配置移动侦测后画面上的线框),0-不显示,非0-显示
|
||||
var buttonIDs = "0,16,256,257,258,259,260,512,513,514,515,516,517,768,769"; //自定义工具条按钮
|
||||
////////////////////////////////// 请自行修改以上变量值 ////////////////////////////////////
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "init",
|
||||
argument: JSON.stringify({
|
||||
appkey: appkey, //API网关提供的appkey
|
||||
secret: secret, //API网关提供的secret
|
||||
ip: ip, //API网关IP地址
|
||||
playMode: playMode, //播放模式(决定显示预览还是回放界面)
|
||||
port: port, //端口
|
||||
snapDir: snapDir, //抓图存储路径
|
||||
videoDir: videoDir, //紧急录像或录像剪辑存储路径
|
||||
layout: layout, //布局
|
||||
enableHTTPS: enableHTTPS, //是否启用HTTPS协议
|
||||
encryptedFields: encryptedFields, //加密字段
|
||||
showToolbar: showToolbar, //是否显示工具栏
|
||||
showSmart: showSmart, //是否显示智能信息
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
oWebControl.JS_Resize(180, 115); // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
setWndCover();
|
||||
});
|
||||
// var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var cameraIndexCode = $("#carmerCard").text()
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
//获取公钥
|
||||
function getPubKey (callback) {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "getRSAPubKey",
|
||||
argument: JSON.stringify({
|
||||
keyLength: 1024
|
||||
})
|
||||
}).then(function (oData) {
|
||||
if (oData.responseMsg.data) {
|
||||
pubKey = oData.responseMsg.data;
|
||||
callback()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//RSA加密
|
||||
function setEncrypt (value) {
|
||||
var encrypt = new JSEncrypt();
|
||||
encrypt.setPublicKey(pubKey);
|
||||
return encrypt.encrypt(value);
|
||||
}
|
||||
|
||||
// 监听resize事件,使插件窗口尺寸跟随DIV窗口变化
|
||||
$(window).resize(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听滚动条scroll事件,使插件窗口跟随浏览器滚动而移动
|
||||
$(window).scroll(function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Resize(180, 115);
|
||||
setWndCover();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// 设置窗口裁剪,当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口
|
||||
function setWndCover() {
|
||||
var iWidth = $(window).width();
|
||||
var iHeight = $(window).height();
|
||||
var oDivRect = $("#playWnd").get(0).getBoundingClientRect();
|
||||
|
||||
var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0;
|
||||
var iCoverTop = (oDivRect.top < 0) ? Math.abs(oDivRect.top): 0;
|
||||
var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0;
|
||||
var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0;
|
||||
|
||||
iCoverLeft = (iCoverLeft > 180) ? 180 : iCoverLeft;
|
||||
iCoverTop = (iCoverTop > 115) ? 115 : iCoverTop;
|
||||
iCoverRight = (iCoverRight > 180) ? 180 : iCoverRight;
|
||||
iCoverBottom = (iCoverBottom > 115) ? 115 : iCoverBottom;
|
||||
|
||||
oWebControl.JS_RepairPartWindow(0, 0, 1001, 115); // 多1个像素点防止还原后边界缺失一个像素条
|
||||
if (iCoverLeft != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, iCoverLeft, 115);
|
||||
}
|
||||
if (iCoverTop != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 0, 1001, iCoverTop); // 多剪掉一个像素条,防止出现剪掉一部分窗口后出现一个像素条
|
||||
}
|
||||
if (iCoverRight != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(180 - iCoverRight, 0, iCoverRight, 115);
|
||||
}
|
||||
if (iCoverBottom != 0) {
|
||||
oWebControl.JS_CuttingPartWindow(0, 115 - iCoverBottom, 180, iCoverBottom);
|
||||
}
|
||||
}
|
||||
|
||||
//视频预览功能
|
||||
$("#startPreview").click(function () {
|
||||
var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值,必填
|
||||
var streamMode = 0; //主子码流标识:0-主码流,1-子码流
|
||||
var transMode = 1; //传输协议:0-UDP,1-TCP
|
||||
var gpuMode = 0; //是否启用GPU硬解,0-不启用,1-启用
|
||||
var wndId = -1; //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
||||
|
||||
cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, "");
|
||||
cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, "");
|
||||
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "startPreview",
|
||||
argument: JSON.stringify({
|
||||
cameraIndexCode:cameraIndexCode, //监控点编号
|
||||
streamMode: streamMode, //主子码流标识
|
||||
transMode: transMode, //传输协议
|
||||
gpuMode: gpuMode, //是否开启GPU硬解
|
||||
wndId:wndId //可指定播放窗口
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
//停止全部预览
|
||||
$("#stopAllPreview").click(function () {
|
||||
oWebControl.JS_RequestInterface({
|
||||
funcName: "stopAllPreview"
|
||||
});
|
||||
});
|
||||
|
||||
// 标签关闭
|
||||
$(window).unload(function () {
|
||||
if (oWebControl != null){
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){ // 断开与插件服务连接成功
|
||||
},
|
||||
function() { // 断开与插件服务连接失败
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -5,6 +5,7 @@
|
|||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import axios from 'axios';
|
||||
// 使用免费开源版本
|
||||
// import 'mars3d/dist/mars3d.css'
|
||||
// import * as mars3d from 'mars3d'
|
||||
|
|
@ -65,7 +66,15 @@ export default {
|
|||
mars3d.Resource.fetchJson({ url: this.url }).then((data) => {
|
||||
|
||||
console.log("datadatadatadata:::::",data);
|
||||
|
||||
axios({
|
||||
method:"get",
|
||||
url:"",
|
||||
headers:{
|
||||
"X-Token":localStorage.getItem("X-Token")
|
||||
}
|
||||
}).then(res=>{
|
||||
// 印象形成效应:刻板效应、晕轮效应、首因效应、近因效应、投射效应
|
||||
})
|
||||
|
||||
this.initMars3d(data.map3d)// 构建地图
|
||||
})
|
||||
|
|
@ -78,6 +87,9 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
getLayers(){
|
||||
|
||||
},
|
||||
initMars3d(options) {
|
||||
if (this[`map${this.mapKey}`]) return
|
||||
|
||||
|
|
|
|||
|
|
@ -44,8 +44,21 @@
|
|||
<toolbox :globalmap="globalmap"></toolbox>
|
||||
</div>
|
||||
|
||||
<<<<<<< HEAD
|
||||
<div class="huoqing-box" v-if="reportlistShow">
|
||||
<<<<<<< HEAD
|
||||
<reportlist :mergeSuccessRandom="mergeSuccessRandom" @wuzi="wuzi" @shuiyuan="shuiyuan" @jiankong="jiankong" @renyuan="renyuan" @merge="mergeboxShow=true;" @changeCurrentInfo="changeCurrentInfo" :globalmap="globalmap" :checkList="checkList"></reportlist>
|
||||
=======
|
||||
<reportlist :mergeSuccessRandom="mergeSuccessRandom" @wuzi="wuzi" @shuiyuan="shuiyuan" @jiankong="jiankong" @merge="mergeboxShow=true;" @changeCurrentInfo="changeCurrentInfo" :globalmap="globalmap" :checkList="checkList"></reportlist>
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
</div>
|
||||
|
||||
<div class="huoqing-box" v-if="mergeboxShow">
|
||||
<mergebox @wuzi="wuzi" @shuiyuan="shuiyuan" @changeCurrentInfo="changeCurrentInfo" @clsoe="mergeboxShow = false;" @success="mergeSuccess" :globalmap="globalmap" :checkList="checkList"></mergebox>
|
||||
=======
|
||||
<div class="tools-box" v-if="reportlistShow">
|
||||
<reportlist @wuzi="wuzi" @shuiyuan="shuiyuan" @renyuan="renyuan" @changeCurrentInfo="changeCurrentInfo" :globalmap="globalmap"></reportlist>
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
</div>
|
||||
|
||||
<!-- 火情调度 -->
|
||||
|
|
@ -88,7 +101,11 @@
|
|||
</div>
|
||||
<!-- 人员 -->
|
||||
<div class="personnel-container" v-show="personVisible">
|
||||
<<<<<<< HEAD
|
||||
<personnel :fireData="currentInfo" :globalmap="globalmap"></personnel>
|
||||
=======
|
||||
<personnel :fireData="currentInfo" :globalmap="globalmap" v-if="personVisible"></personnel>
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
</div>
|
||||
<!-- 物资 -->
|
||||
<div class="goods-container" v-show="goodsVisible">
|
||||
|
|
@ -118,10 +135,22 @@
|
|||
|
||||
<!-- 监控列表 -->
|
||||
<div class="monitor" v-if="monitorShow && appTools['monitorbox']">
|
||||
<monitorbox></monitorbox>
|
||||
<monitorbox @showLCmonitorbox="showLCmonitorbox"></monitorbox>
|
||||
</div>
|
||||
|
||||
<div class="monitor" v-if="LCmonitorboxShow">
|
||||
<div class="close-button" @click="LCmonitorboxShow = false">
|
||||
<i class='el-icon el-icon-close'></i>
|
||||
</div>
|
||||
<LCmonitorbox v-if="LCmonitorboxShow" :deviceId="deviceId" :channelId="channelId"></LCmonitorbox>
|
||||
</div>
|
||||
|
||||
<div class="monitor" v-if="HKmonitorboxShow">
|
||||
<div class="close-button" @click="HKmonitorboxShow = false">
|
||||
<i class='el-icon el-icon-close'></i>
|
||||
</div>
|
||||
<HKmonitorbox v-if="HKmonitorboxShow" :deviceId="deviceId" :channelId="channelId"></HKmonitorbox>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
@ -143,6 +172,7 @@ import { getModules } from '@/api/modules.js';
|
|||
|
||||
import AppConfigInfo from '../../../public/config/app.json'
|
||||
|
||||
import $ from 'jquery'
|
||||
import Map from '@/components/mars3d/Map.vue'
|
||||
// import widgetdiv from '@/components/Widget/index.vue'
|
||||
import Uavbox from './widget/uavbox.vue'
|
||||
|
|
@ -156,9 +186,20 @@ import goodsbox from './widget/goodsbox.vue';
|
|||
import trendsbox from './widget/trendsbox.vue';
|
||||
import taskbox from './widget/taskbox.vue';
|
||||
import gridbox from './widget/gridbox.vue';
|
||||
<<<<<<< HEAD
|
||||
import LCmonitorbox from './widget/LCmonitorbox.vue'
|
||||
import HKmonitorbox from './widget/HKmonitorbox.vue'
|
||||
<<<<<<< HEAD
|
||||
import personnel from './widget/personnel.vue';
|
||||
=======
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
=======
|
||||
import personnel from './widget/personnel.vue';
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
import axios from 'axios';
|
||||
import jQuery from 'jquery';
|
||||
import { mask } from '@turf/turf';
|
||||
import mergebox from './widget/mergebox.vue';
|
||||
|
||||
export default {
|
||||
name: 'business',
|
||||
|
|
@ -176,7 +217,18 @@ export default {
|
|||
trendsbox,
|
||||
taskbox,
|
||||
gridbox,
|
||||
<<<<<<< HEAD
|
||||
LCmonitorbox,
|
||||
HKmonitorbox,
|
||||
<<<<<<< HEAD
|
||||
mergebox,
|
||||
personnel
|
||||
=======
|
||||
mergebox
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
=======
|
||||
personnel
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
},
|
||||
|
||||
data() {
|
||||
|
|
@ -220,6 +272,13 @@ export default {
|
|||
"sourceTypeName": "摄像机",
|
||||
"stateName": "上报"
|
||||
},
|
||||
LCmonitorboxShow:false,
|
||||
HKmonitorboxShow:false,
|
||||
deviceId:null,
|
||||
channelId:null,
|
||||
checkList:[],
|
||||
mergeboxShow:false,
|
||||
mergeSuccessRandom:1,
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -239,18 +298,44 @@ export default {
|
|||
|
||||
// 获取天气
|
||||
this.getWeater();
|
||||
|
||||
//脱敏
|
||||
window.hiddenReadData= function(e){
|
||||
e.innerHTML = e.getAttribute('data-phone').replace(/(\d{3})\d*(\d{4})/, '$1****$2');
|
||||
}
|
||||
window.showReadData = function(e){
|
||||
e.innerHTML = e.getAttribute('data-phone')
|
||||
}
|
||||
|
||||
window.lookMonitorByMonitorLayer = this.lookMonitorByMonitorLayer
|
||||
},
|
||||
methods: {
|
||||
mergeSuccess(){
|
||||
this.mergeboxShow = false;
|
||||
|
||||
this.$message({
|
||||
type:"success",
|
||||
message:"合并成功!"
|
||||
})
|
||||
this.checkList = [];
|
||||
|
||||
this.mergeSuccessRandom = Math.random();
|
||||
},
|
||||
// 乐橙监控
|
||||
showLCmonitorbox(e){
|
||||
this.channelId = e.channelId;
|
||||
this.deviceId = e.deviceId;
|
||||
this.LCmonitorboxShow = true;
|
||||
},
|
||||
changeCurrentInfo(item){
|
||||
this.currentInfo = item;
|
||||
// this.reportSituationShow = true;
|
||||
},
|
||||
getAllReportList(){
|
||||
this.reportlistShow = true;
|
||||
this.reportlistShow = !this.reportlistShow;
|
||||
},
|
||||
// 退出登录
|
||||
logout(){
|
||||
alert(111);
|
||||
localStorage.setItem("X-Token",null);
|
||||
this.$router.push({'path':'/login'})
|
||||
},
|
||||
|
|
@ -263,6 +348,17 @@ export default {
|
|||
this.goodsVisible = true;
|
||||
}
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
// 监控
|
||||
jiankong(){
|
||||
// this.deviceId = "8L0995DPAG5DF32";
|
||||
// this.channelId = "0";
|
||||
this.HKmonitorboxShow = true;
|
||||
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
renyuan(item){
|
||||
if(this.personVisible){
|
||||
this.personVisible = false
|
||||
|
|
@ -270,6 +366,11 @@ export default {
|
|||
this.personVisible = true;
|
||||
}
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
=======
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
// 水源
|
||||
shuiyuan(item){
|
||||
this.waterCenter = item;
|
||||
|
|
@ -316,6 +417,7 @@ export default {
|
|||
|
||||
_self.graphicLayer.addGraphic(graphic) // 还可以另外一种写法: graphic.addTo(graphicLayer)
|
||||
|
||||
_self.bindShowTilesParts();
|
||||
},
|
||||
|
||||
onMapClick(e){
|
||||
|
|
@ -324,8 +426,8 @@ export default {
|
|||
// 当前日期时间
|
||||
handlerTime(){
|
||||
let date = new Date();
|
||||
this.time = (date.getHours<10 ? '0'+ date.getHours() : date.getHours())+":"+ (date.getMinutes()<10 ? '0'+date.getMinutes():date.getMinutes())+":"+(date.getSeconds()<10?'0'+date.getSeconds():date.getSeconds());
|
||||
this.date = date.getFullYear()+'-'+((date.getMonth()+1)<10?'0'+(date.getMonth()+1):(date.getMonth()+1))+'-'+((date.getDate()+1)<10 ? '0'+(date.getDate()+1):(date.getDate()+1));
|
||||
this.time = (date.getHours()<10 ? '0'+ date.getHours() : date.getHours())+":"+ (date.getMinutes()<10 ? '0'+date.getMinutes():date.getMinutes())+":"+(date.getSeconds()<10?'0'+date.getSeconds():date.getSeconds());
|
||||
this.date = date.getFullYear()+'-'+((date.getMonth()+1)<10?'0'+(date.getMonth()+1):(date.getMonth()+1))+'-'+((date.getDate())<10 ? '0'+(date.getDate()):(date.getDate()));
|
||||
},
|
||||
// 当前天气
|
||||
getWeater(){
|
||||
|
|
@ -364,6 +466,95 @@ export default {
|
|||
this.globalmap.removeLayer(this.tileLayer, true)
|
||||
this.tileLayer = null
|
||||
}
|
||||
},
|
||||
// 邦定地图点击事件
|
||||
bindShowTilesParts(){
|
||||
let _this = this;
|
||||
this.globalmap.on(mars3d.EventType.clickGraphic, function (event) {
|
||||
_this.loadUserList(event);
|
||||
})
|
||||
},
|
||||
// 点击事件获取人员
|
||||
loadUserList(event){
|
||||
console.log("event222",event);
|
||||
let layerName = event.layer.options.name;
|
||||
// 如果是监控图层
|
||||
if(layerName == '视频监控'){
|
||||
console.log("event:::",event)
|
||||
this.getMonitorList(event.graphic.options.position[0],event.graphic.options.position[1]);
|
||||
return;
|
||||
}
|
||||
// 其他图层
|
||||
let queryName = event.graphic.options.attr['防火检'];
|
||||
let url = null;
|
||||
switch(layerName){
|
||||
case "检查点": url = "/api/FirePrevention/LoadjianchadianUser";
|
||||
break;
|
||||
case "检查站": url = "/api/FirePrevention/LoadpyjianchadianUser";
|
||||
// queryName = event.graphic.options.attr['Name'];
|
||||
//
|
||||
break;
|
||||
case "瞭望台": url = "/api/FirePrevention/Loadliaowangtaiuser";
|
||||
break;
|
||||
case "护林点": url = "/api/FirePrevention/LoadhulindianUser";
|
||||
break;
|
||||
case "防火驿站": url = "/api/FirePrevention/Loadfanghuoyizhanuser";
|
||||
break;
|
||||
case "向导": url ="/api/FirePrevention/Loadxiangdaouser";
|
||||
break;
|
||||
}
|
||||
if(url){
|
||||
// 查询人员列表
|
||||
this.loadUserListApi(url,queryName);
|
||||
}
|
||||
},
|
||||
// 获取监控
|
||||
getMonitorList(lng,lat){
|
||||
axios({
|
||||
method:"get",
|
||||
params:{
|
||||
lng:lng,
|
||||
lat:lat
|
||||
},
|
||||
url:"http://123.132.248.154:9224/api/Camera/GetCameraInfoByPoint"
|
||||
}).then(res=>{
|
||||
if(res.data.code == 200){
|
||||
res.data.data.forEach((item,index)=>{
|
||||
let monitorName = item.forestrytype == 1 ? '防火监控':'卡口监控';
|
||||
$("#monitor_popup").append("<div onclick='lookMonitorByMonitorLayer("+item.type+",\""+item.id+"\","+item.road+");' class='monitor-btn' data-channelId='"+item.type+"' data-deviceId="+item.id+" style='padding:4px 8px;text-align:center;font-size:14px;border-radius:2px;background:#108eff;color:#fff;margin:6px 0px;cursor:pointer;'><img src='/img/monitor-video.png' width='24px' style='position:relative;top:-2px;left:-4px;'/>"+monitorName+":"+item.name+"</div>");
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
// 获取人员
|
||||
loadUserListApi(url,queryName){
|
||||
|
||||
axios({
|
||||
method:"get",
|
||||
params:{
|
||||
area:queryName
|
||||
},
|
||||
url:"http://123.132.248.154:9224"+url,
|
||||
}).then(data=>{
|
||||
console.log("data111",data);
|
||||
if(data.data.code == 200){
|
||||
data.data.data.forEach((item,index)=>{
|
||||
$("#jianchazhan_popup").append("<div class='popup-item'>"+item.username+" <span data-phone='"+item.phone+"' onmouseenter='showReadData(this);' onmouseleave='hiddenReadData(this);'>"+item.phone.replace(/(\d{3})\d*(\d{4})/, '$1****$2')+"</span> "+item.area+" "+item.usertype+"</div>");
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 监控信息
|
||||
lookMonitorByMonitorLayer(type,id,road){
|
||||
if(type == 1){ //乐橙
|
||||
this.channelId = road;
|
||||
this.deviceId = id;
|
||||
this.LCmonitorboxShow = true;
|
||||
}else if(type == 2){ //海康
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -499,7 +690,12 @@ export default {
|
|||
float:left;
|
||||
margin-right:15px;
|
||||
}
|
||||
|
||||
.huoqing-box{
|
||||
width:480px;
|
||||
height:360px;
|
||||
float:left;
|
||||
margin-right:12px;
|
||||
}
|
||||
.grid-container{
|
||||
width:1200px;
|
||||
padding-top:100px;
|
||||
|
|
@ -555,7 +751,23 @@ export default {
|
|||
height: 200px;
|
||||
float:left;
|
||||
margin-right:15px;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.close-button{
|
||||
position:absolute;
|
||||
right:20px;
|
||||
top:14px;
|
||||
cursor:pointer;
|
||||
color:#fff;
|
||||
font-weight: bold;
|
||||
width:20px;
|
||||
height:20px;
|
||||
background:#0ABFB5cc;
|
||||
line-height:20px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
/* 火情调度 */
|
||||
.situation{
|
||||
width:480px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="box-title">视频监控</div>
|
||||
<div class="box-container">
|
||||
<iframe
|
||||
id = "iframe"
|
||||
ref="fIframe"
|
||||
scrolling="no"
|
||||
frameborder ="0"
|
||||
width="100%"
|
||||
height="100%"
|
||||
src="/monitor/hk/index.html"
|
||||
>
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
export default {
|
||||
name: 'monitorbox',
|
||||
props:["deviceId","channelId"],
|
||||
data(){
|
||||
return{
|
||||
list:[],
|
||||
monitorPlayer:null,
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
let arr = [
|
||||
"ec515c98537b4c3fa17b863ee429ba55",
|
||||
"ec515c98537b4c3fa17b863ee429ba55",
|
||||
"21274765",
|
||||
"223.99.16.253",
|
||||
1443,
|
||||
"CraRtGvpNB2xOcYSFTov"
|
||||
]
|
||||
|
||||
let _this = this;
|
||||
|
||||
this.$refs.fIframe.onload = function () {
|
||||
_this.$refs.fIframe.contentWindow.postMessage(arr)
|
||||
}
|
||||
|
||||
window.addEventListener('message', (e)=>{
|
||||
this.$emit("closeMonitor")
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.box{
|
||||
width: 340px;
|
||||
height: 200px;
|
||||
overflow: hidden;
|
||||
background-image: url(/img/uav-bg.png);
|
||||
background-size: 100% 100%;
|
||||
text-align:left;
|
||||
z-index: 99;
|
||||
}
|
||||
.box-title{
|
||||
width:100%;
|
||||
height:40px;
|
||||
line-height:50px;
|
||||
text-indent:20px;
|
||||
color: #00FFF0;
|
||||
}
|
||||
.box-container{
|
||||
width: calc( 100% - 0px);
|
||||
padding:0px 12px;
|
||||
height: calc( 100% - 60px);
|
||||
}
|
||||
.table-header{
|
||||
width: calc( 100% - 10px);
|
||||
height:25px;
|
||||
color:#fff;
|
||||
text-align: center;
|
||||
}
|
||||
.table-header div{
|
||||
float:left;
|
||||
width:25%;
|
||||
border-bottom:1px dashed #00FFF0;
|
||||
padding-bottom:8px;
|
||||
}
|
||||
.table-body{
|
||||
width:100%;
|
||||
height: calc( 100% - 40px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.table-body .item{
|
||||
width:100%;
|
||||
height:36px;
|
||||
background: #00ffee2f;
|
||||
font-size:12px;
|
||||
text-align: center;
|
||||
line-height:36px;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.table-body .item:nth-child(2n){
|
||||
background:#00ffee50;
|
||||
}
|
||||
|
||||
.table-body .item div{
|
||||
float:left;
|
||||
width:25%;
|
||||
color:#eee;
|
||||
overflow: hidden;
|
||||
height:36px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
background: transparent;
|
||||
border-radius: 5px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
padding-top: 100px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
|
||||
background-color: #797979;
|
||||
min-height: 28px;
|
||||
border-radius: 4px;
|
||||
background-clip: padding-box
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .25);
|
||||
background-color: rgba(0, 0, 0, .4)
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .35);
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,165 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="box-title">视频监控</div>
|
||||
<div class="box-container">
|
||||
<div id="root"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from "axios";
|
||||
export default {
|
||||
name: 'monitorbox',
|
||||
props:["deviceId","channelId"],
|
||||
data(){
|
||||
return{
|
||||
list:[],
|
||||
monitorPlayer:null,
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
deviceId:function(e){
|
||||
this.getKitToken(this.deviceId,this.channelId);
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getKitToken(this.deviceId,this.channelId);
|
||||
},
|
||||
methods:{
|
||||
getKitToken(deviceId,channelId){
|
||||
let params = {
|
||||
deviceId:deviceId,
|
||||
channelId:channelId,
|
||||
type:0,
|
||||
}
|
||||
axios({
|
||||
method:"post",
|
||||
url:"http://123.132.248.154:9224/api/Camera/getKitToken?deviceId="+deviceId+"&channelId="+channelId+"&type=0",
|
||||
}).then(res=>{
|
||||
|
||||
let kitToken = res.data.result.data.kitToken;
|
||||
this.loadMonitorVideo(deviceId,kitToken,channelId);
|
||||
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
loadMonitorVideo(deviceId,kitToken,channelId){
|
||||
this.monitorPlayer && this.monitorPlayer.destroy()
|
||||
this.monitorPlayer = null
|
||||
this.monitorPlayer = new imouPlayer({
|
||||
id: 'root',
|
||||
width: 314,
|
||||
height: 140,
|
||||
deviceId: deviceId,
|
||||
token: kitToken,
|
||||
channelId:channelId,
|
||||
type:1,
|
||||
streamId:0,
|
||||
recordType: 'cloud',
|
||||
code:""
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.box{
|
||||
width: 340px;
|
||||
height: 200px;
|
||||
overflow: hidden;
|
||||
background-image: url(/img/uav-bg.png);
|
||||
background-size: 100% 100%;
|
||||
text-align:left;
|
||||
z-index: 99;
|
||||
}
|
||||
.box-title{
|
||||
width:100%;
|
||||
height:40px;
|
||||
line-height:50px;
|
||||
text-indent:20px;
|
||||
color: #00FFF0;
|
||||
}
|
||||
.box-container{
|
||||
width: calc( 100% - 0px);
|
||||
padding:0px 12px;
|
||||
height: calc( 100% - 60px);
|
||||
}
|
||||
.table-header{
|
||||
width: calc( 100% - 10px);
|
||||
height:25px;
|
||||
color:#fff;
|
||||
text-align: center;
|
||||
}
|
||||
.table-header div{
|
||||
float:left;
|
||||
width:25%;
|
||||
border-bottom:1px dashed #00FFF0;
|
||||
padding-bottom:8px;
|
||||
}
|
||||
.table-body{
|
||||
width:100%;
|
||||
height: calc( 100% - 40px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.table-body .item{
|
||||
width:100%;
|
||||
height:36px;
|
||||
background: #00ffee2f;
|
||||
font-size:12px;
|
||||
text-align: center;
|
||||
line-height:36px;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.table-body .item:nth-child(2n){
|
||||
background:#00ffee50;
|
||||
}
|
||||
|
||||
.table-body .item div{
|
||||
float:left;
|
||||
width:25%;
|
||||
color:#eee;
|
||||
overflow: hidden;
|
||||
height:36px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
background: transparent;
|
||||
border-radius: 5px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
padding-top: 100px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
|
||||
background-color: #797979;
|
||||
min-height: 28px;
|
||||
border-radius: 4px;
|
||||
background-clip: padding-box
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .25);
|
||||
background-color: rgba(0, 0, 0, .4)
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .35);
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,372 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="box-title">线索合并</div>
|
||||
<div class="tip-title">将会对选中的火情线索进行合并,请您确定合</div>
|
||||
<div class="box-container">
|
||||
<span v-for="(item,index) in checkList" :key="index" style="margin:4px 10px;background: #112A26;border: 1px solid #1C4741;float:left;padding:3px 6px 3px 6px;border-radius: 19px 0px 19px 19px;">
|
||||
编号:{{item}}
|
||||
<!-- <i class="el-icon el-icon-close"></i> -->
|
||||
</span>
|
||||
</div>
|
||||
<div style="text-align:right;margin:0px 28px;">
|
||||
<span style="margin-right:12px;color:#fff;">{{formData.lng}} {{formData.lat}}</span>
|
||||
<el-button type="success" size="mini" @click="selectPosition()">选择位置</el-button>
|
||||
<el-button type="warning" size="mini" @click="cancle()">取消操作</el-button>
|
||||
<el-button type="primary" size="mini" @click="merage()">确认合并</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import { parse } from '../lib/handleGeojson';
|
||||
export default {
|
||||
name: 'mergebox',
|
||||
props:['globalmap','checkList'],
|
||||
data(){
|
||||
return {
|
||||
active:1,
|
||||
list:[
|
||||
|
||||
],
|
||||
formData:{
|
||||
"address": "",
|
||||
"lng": "",
|
||||
"lat": "",
|
||||
"ids": [],
|
||||
"modifyId": ""
|
||||
},
|
||||
graphicLayer:null,
|
||||
graphicPoint:null,
|
||||
graphicWinodw:null,
|
||||
pathPointGraphicLayer:null,
|
||||
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
checkList:function(e){
|
||||
|
||||
}
|
||||
},
|
||||
created(){
|
||||
// this.getList();
|
||||
window.wuzi = this.wuzi
|
||||
window.shuiyuan = this.shuiyuan
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
selectPosition(){
|
||||
let _this = this;
|
||||
this.globalmap.once(mars3d.EventType.click, function (event) {
|
||||
_this.globalmap.setCursor(false)
|
||||
const cartesian = event.cartesian
|
||||
const point = mars3d.LngLatPoint.fromCartesian(cartesian)
|
||||
point.format()
|
||||
_this.drawPoint(point.lng, point.lat, point.z);
|
||||
_this.formData.lng = point.lng;
|
||||
_this.formData.lat = point.lat;
|
||||
})
|
||||
},
|
||||
drawPoint(lng,lat,z){
|
||||
if(this.pathPointGraphicLayer==null){
|
||||
this.pathPointGraphicLayer = new mars3d.layer.GraphicLayer();
|
||||
this.globalmap.addLayer(this.pathPointGraphicLayer);
|
||||
}else{
|
||||
this.pathPointGraphicLayer.clear();
|
||||
}
|
||||
let graphic = new mars3d.graphic.BillboardEntity({
|
||||
position: [lng, lat, z],
|
||||
style: {
|
||||
image: "/img/route-start.png",
|
||||
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
clampToGround: true
|
||||
},
|
||||
attr: "合并后火点"
|
||||
})
|
||||
this.pathPointGraphicLayer.addGraphic(graphic) // 还可以另
|
||||
},
|
||||
shuiyuan(e){
|
||||
this.$emit("shuiyuan",e);
|
||||
},
|
||||
wuzi(e){
|
||||
this.$emit("wuzi",e);
|
||||
},
|
||||
getInfo(active){
|
||||
this.listQuery.state = active;
|
||||
this.active = active;
|
||||
this.getList();
|
||||
},
|
||||
merage(){
|
||||
this.formData.ids = this.checkList;
|
||||
axios({
|
||||
method:"post",
|
||||
url:"http://123.132.248.154:9224/api/FireManagement/MergeNewFireClueInfo",
|
||||
data:this.formData,
|
||||
headers:{
|
||||
'X-Token':localStorage.getItem("X-Token")
|
||||
}
|
||||
|
||||
}).then(res=>{
|
||||
if(res.data.code == 200){
|
||||
this.pathPointGraphicLayer.clear();
|
||||
this.pathPointGraphicLayer = null;
|
||||
this.$emit("success");
|
||||
}
|
||||
})
|
||||
},
|
||||
cancle(){
|
||||
if(this.pathPointGraphicLayer){
|
||||
this.pathPointGraphicLayer.clear();
|
||||
this.pathPointGraphicLayer = null;
|
||||
}
|
||||
this.$emit("clsoe");
|
||||
},
|
||||
getList(){
|
||||
axios({
|
||||
method:"post",
|
||||
url:"http://123.132.248.154:9224/api/FireManagement/LoadFireClueInfoByAreaName",
|
||||
params:this.listQuery,
|
||||
headers:{
|
||||
'X-Token':localStorage.getItem("X-Token")
|
||||
}
|
||||
}).then(res=>{
|
||||
if(res.data.code == 200){
|
||||
this.list = res.data.data;
|
||||
}
|
||||
})
|
||||
},
|
||||
toPosition(item){
|
||||
console.log(item);
|
||||
this.$emit("changeCurrentInfo",item);
|
||||
let _self = this;
|
||||
|
||||
if(!_self.graphicLayer){
|
||||
_self.graphicLayer = new this.mars3d.layer.GraphicLayer({
|
||||
pid:88,
|
||||
})
|
||||
_self.globalmap.addLayer(_self.graphicLayer)
|
||||
}
|
||||
if(_self.graphicPoint && _self.graphicWinodw){
|
||||
_self.graphicLayer.clear();
|
||||
_self.graphicPoint = null;
|
||||
_self.graphicWinodw = null;
|
||||
}
|
||||
_self.graphicPoint = new mars3d.graphic.DivLightPoint({
|
||||
position: [parseFloat(item.lng),parseFloat(item.lat)],
|
||||
style: {
|
||||
color: "#f33349",
|
||||
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000), // 按视距距离显示
|
||||
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
|
||||
},
|
||||
})
|
||||
_self.graphicLayer.addGraphic(_self.graphicPoint)
|
||||
|
||||
_self.graphicWinodw = new mars3d.graphic.DivGraphic({
|
||||
position: [parseFloat(item.lng),parseFloat(item.lat)],
|
||||
style: {
|
||||
html: `<div class="marsTiltPanel marsTiltPanel-theme-red" style="font-size:12px;">
|
||||
<div class="marsTiltPanel-wrap">
|
||||
<div class="area">
|
||||
<div class="arrow-lt"></div>
|
||||
<div class="b-t"></div>
|
||||
<div class="b-r"></div>
|
||||
<div class="b-b"></div>
|
||||
<div class="b-l"></div>
|
||||
<div class="arrow-rb"></div>
|
||||
<div class="label-wrap">
|
||||
<div class="title">${item.address}</div>
|
||||
<div class="label-content">
|
||||
<div class="data-li">
|
||||
<div class="data-label">火情描述:${item.describe}</div>
|
||||
</div>
|
||||
<div class="data-li">
|
||||
<div class="data-label">上报时间:</div>
|
||||
<div class="data-value"><span id="lablYeWei" class="label-num">${item.reportTime}</span><span class="label-unit"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data-li">
|
||||
<div class="data-value">
|
||||
<span id="lablSBZT1" class="label-tag data-value-status-1" title="中间状态">人员调度</span>
|
||||
<span id="lablSBZT2" onclick="wuzi([${item.lng},${item.lat}]);" class="label-tag data-value-status-0" title="关闭状态" >物资调度</span>
|
||||
<span id="lablCSFM2" onclick="shuiyuan([${item.lng},${item.lat}])" class="label-tag data-value-status-2" title="打开状态">附近水源</span>
|
||||
<span id="lablSBZT1" class="label-tag data-value-status-1" title="中间状态">路线规划</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="b-t-l"></div>
|
||||
<div class="b-b-r"></div>
|
||||
</div>
|
||||
<div class="arrow" ></div>
|
||||
</div>`,horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
|
||||
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
||||
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000), // 按视距距离显示
|
||||
scaleByDistance: new Cesium.NearFarScalar(1000, 1.0, 200000, 0.2),
|
||||
clampToGround: true
|
||||
},
|
||||
attr: { remark: "示例10" },
|
||||
// 可以传入自定义测试点样式
|
||||
// testPoint: {
|
||||
// color: '#ff0000',
|
||||
// pixelSize: 8,
|
||||
// },
|
||||
pointerEvents: true // false时不允许拾取和触发任意鼠标事件,但可以穿透div缩放地球
|
||||
})
|
||||
_self.graphicLayer.addGraphic(_self.graphicWinodw);
|
||||
|
||||
_self.graphicWinodw.flyTo();
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.box{
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-image: url(/img/hebing-bg.png);
|
||||
background-size:100% 100%;
|
||||
}
|
||||
|
||||
.box-title{
|
||||
width:100%;
|
||||
height:40px;
|
||||
line-height:40px;
|
||||
color:#fff;
|
||||
text-indent:30px;
|
||||
text-align:left;
|
||||
}
|
||||
.tip-title{
|
||||
width:280px;
|
||||
margin:0px auto;
|
||||
height:80px;
|
||||
padding-top:20px;
|
||||
font-size: 22px;
|
||||
font-family: OPPOSans-M, OPPOSans;
|
||||
font-weight: normal;
|
||||
color: #17C5C8;
|
||||
line-height: 32px;
|
||||
|
||||
}
|
||||
.tab-container{
|
||||
width:210px;
|
||||
height:60px;
|
||||
border-bottom:1px solid #2F5D55;
|
||||
padding-top:10px;
|
||||
margin:0px auto;
|
||||
}
|
||||
.tab-button{
|
||||
width:70px;
|
||||
font-size:12px;
|
||||
height:50px;
|
||||
line-height:50px;
|
||||
color:#0ABFB5;
|
||||
float:left;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.box-container{
|
||||
width: calc( 100% - 20px);
|
||||
margin:0px 15px;
|
||||
margin-bottom:10px;
|
||||
height: calc( 100% - 190px);
|
||||
overflow-y:auto;
|
||||
}
|
||||
.news{
|
||||
width: calc( 100% - 10px);
|
||||
line-height:18px;
|
||||
padding:6px 15px 10px 15px;
|
||||
text-align:left;
|
||||
color:#ccc;
|
||||
background:rgba(0,0,0,0.5);
|
||||
margin:6px 0px;
|
||||
border:1px dashed #999;
|
||||
}
|
||||
.news::after{
|
||||
content:"";
|
||||
clear:both;
|
||||
display:block;
|
||||
height:0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.checkbox-container{
|
||||
width:18px;
|
||||
height:18px;
|
||||
position:relative;
|
||||
top:12px;
|
||||
margin-right:10px;
|
||||
float:left;
|
||||
background: rgba(2,0,77,0.4);
|
||||
box-shadow: inset 0px 0px 34px 0px #A15E01;
|
||||
border: 1px solid #F18B00;
|
||||
cursor: pointer;
|
||||
}
|
||||
.news-container{
|
||||
width: calc( 100% - 30px);
|
||||
float:left;
|
||||
}
|
||||
.news .title{
|
||||
line-height:40px;
|
||||
color:#E48F19;
|
||||
margin-bottom:12px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.news .title::after{
|
||||
content:"";
|
||||
width:100%;
|
||||
height:0px;
|
||||
border: 0.5px solid;
|
||||
position:absolute;
|
||||
bottom:0px;
|
||||
left:0px;
|
||||
border-image: linear-gradient(90deg, rgba(241, 139, 0, 1), rgba(86, 254, 254, 0),rgba(86, 254, 254, 0)) 1 1;
|
||||
}
|
||||
|
||||
.news .desc{
|
||||
font-size:12px;
|
||||
color:#fff;
|
||||
margin-bottom:6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
background: transparent;
|
||||
border-radius: 5px
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
padding-top: 100px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset -1px -1px 0 rgba(0, 0, 0, .07);
|
||||
background-color: #797979;
|
||||
min-height: 28px;
|
||||
border-radius: 4px;
|
||||
background-clip: padding-box
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
border: 0
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
-webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .25);
|
||||
background-color: rgba(0, 0, 0, .4)
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
-webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, .35);
|
||||
background-color: rgba(0, 0, 0, .5)
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -10,10 +10,12 @@
|
|||
</div>
|
||||
<div class="table-body">
|
||||
<div class="item" v-for="(item,index) in list" :key="index">
|
||||
<div>{{item.name}}</div>
|
||||
<div>{{item.type}}</div>
|
||||
<div>通道{{item.road}}</div>
|
||||
<div>查看</div>
|
||||
<div>{{item.deviceName}}</div>
|
||||
<div>{{item.cameraType}}</div>
|
||||
<div>通道{{item.channelNumber}}</div>
|
||||
<div>
|
||||
<el-button type="primary" size="mini" @click="showLCmonitorbox(item.equipmentSerialNumber,item.channelNumber)">查看</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -33,15 +35,18 @@ import axios from "axios";
|
|||
this.getMonitorList();
|
||||
},
|
||||
methods:{
|
||||
showLCmonitorbox(equipmentSerialNumber,channelNumber){
|
||||
this.$emit("showLCmonitorbox",{deviceId:equipmentSerialNumber, channelId:channelNumber})
|
||||
},
|
||||
getMonitorList(){
|
||||
axios({
|
||||
method: 'post',
|
||||
headers:{
|
||||
"X-Token":localStorage.getItem("X-Token")
|
||||
},
|
||||
url: 'http://123.132.248.154:9210/api/LiveManager/GetAllLiveData?pageIndex=1&pageSize=200',
|
||||
url: 'http://123.132.248.154:9224/api/LiveManager/GetAllLiveData?pageIndex=1&pageSize=200',
|
||||
}).then(res => {
|
||||
console.log("res",res)
|
||||
this.list = res.data.data;
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -106,6 +111,8 @@ import axios from "axios";
|
|||
float:left;
|
||||
width:25%;
|
||||
color:#eee;
|
||||
overflow: hidden;
|
||||
height:36px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
|
|
|
|||
|
|
@ -70,7 +70,11 @@
|
|||
listData:[],
|
||||
allData:[],
|
||||
fireLngLat:'',
|
||||
<<<<<<< HEAD
|
||||
distanceradio: 5
|
||||
=======
|
||||
distanceradio: 4
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
|
|
@ -128,6 +132,10 @@
|
|||
this.listData = newArr
|
||||
}
|
||||
if(this.distanceradio == 5){
|
||||
<<<<<<< HEAD
|
||||
this.listData = arr
|
||||
}
|
||||
=======
|
||||
arr.forEach(item =>{
|
||||
newArr.push(item)
|
||||
})
|
||||
|
|
@ -136,6 +144,7 @@
|
|||
this.listData.sort((a,b)=>{
|
||||
return a.distance - b.distance
|
||||
})
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
},
|
||||
callPhone(phone){
|
||||
let time1 = this.fireData.reportTime.split(' ')[0]
|
||||
|
|
@ -201,11 +210,16 @@
|
|||
}
|
||||
postMethodCommon("/FireCodePC/GetForestRangers",arr).then(res =>{
|
||||
let rel = res.data
|
||||
<<<<<<< HEAD
|
||||
|
||||
this.handleData(rel).then(dl =>{
|
||||
=======
|
||||
this.handleData(rel).then(dl =>{
|
||||
dl.sort((a,b)=>{
|
||||
return a.distance - b.distance
|
||||
})
|
||||
console.log('dl',dl)
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
_this.listData = dl
|
||||
_this.allData = dl
|
||||
setTimeout(()=>{
|
||||
|
|
@ -218,6 +232,24 @@
|
|||
},
|
||||
handleData(data){
|
||||
|
||||
<<<<<<< HEAD
|
||||
// data.forEach(item =>{
|
||||
// let url = "https://restapi.amap.com/v3/direction/driving?key="+appConfig.gaodeApi+"&origin=" + this.fireLngLat[0] + "," + this.fireLngLat[1] +
|
||||
// "&destination=" + item.lng + "," + item.lat + "&extensions=base"
|
||||
// axios({
|
||||
// method: 'get',
|
||||
// url: url,
|
||||
// }).then(res => {
|
||||
// if(res.data.route.paths[0]){
|
||||
// let obj = res.data.route.paths[0]
|
||||
// item.distance = (obj.distance/1000).toFixed(2)
|
||||
// item.duration = Math.round(obj.duration/60)
|
||||
// }
|
||||
// }).catch(err =>{
|
||||
// console.log('ee',err)
|
||||
// })
|
||||
// })
|
||||
=======
|
||||
data.forEach(item =>{
|
||||
let url = "https://restapi.amap.com/v3/direction/driving?key="+appConfig.gaodeApi+"&origin=" + this.fireLngLat[0] + "," + this.fireLngLat[1] +
|
||||
"&destination=" + item.lng + "," + item.lat + "&extensions=base"
|
||||
|
|
@ -234,6 +266,7 @@
|
|||
console.log('ee',err)
|
||||
})
|
||||
})
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
return Promise.resolve(data)
|
||||
}
|
||||
}
|
||||
|
|
@ -376,10 +409,17 @@
|
|||
border: 1px solid #2D80EE;
|
||||
}
|
||||
.li-desc{
|
||||
<<<<<<< HEAD
|
||||
padding: 3px 7px;
|
||||
background: #14332F;
|
||||
border-radius: 2px;
|
||||
margin-right: 8px;
|
||||
=======
|
||||
padding: 3px 10px;
|
||||
background: #14332F;
|
||||
border-radius: 2px;
|
||||
margin-right: 10px;
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
}
|
||||
.li-desc:last-child{
|
||||
margin-right: 0;
|
||||
|
|
|
|||
|
|
@ -2,12 +2,12 @@
|
|||
<div class="box">
|
||||
<div class="news">
|
||||
<p class="title">
|
||||
塔山森林景区发生火灾
|
||||
<el-button size="mini" type="warning" style="" icon="el-icon-position" >查看</el-button>
|
||||
{{reportList.address}}上报了一条火情线索
|
||||
<!-- <el-button size="mini" type="warning" style="" icon="el-icon-position" >查看</el-button> -->
|
||||
</p>
|
||||
<p class="desc">
|
||||
<span>塔山森林公园北侧发生火灾…… </span>
|
||||
<span class="time">2023-07-21 12:42:32</span>
|
||||
<span>{{reportList.describe}}</span>
|
||||
<span class="time">{{reportList.reportTime}}</span>
|
||||
</p>
|
||||
<p style="font-size:12px;text-align:right;color:#fff;cursor:pointer;">
|
||||
<span @click="getAllReportList">查看全部上报>></span>
|
||||
|
|
@ -17,24 +17,45 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
name: 'reportbox',
|
||||
props:['globalmap'],
|
||||
data(){
|
||||
return {
|
||||
reportList:[
|
||||
{
|
||||
time:"2023-07-22 10:45:10",
|
||||
title:"大公馆西北侧发生火灾",
|
||||
desc:"大公馆西北侧发生5级火灾……",
|
||||
lngLat:""
|
||||
}
|
||||
]
|
||||
reportList:{},
|
||||
listQuery:{
|
||||
state:0,
|
||||
areaname:'feixian',
|
||||
pageIndex:1,
|
||||
pageSize:10,
|
||||
},
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getList();
|
||||
},
|
||||
methods:{
|
||||
getAllReportList(){
|
||||
this.$emit("getAllReportList");
|
||||
},
|
||||
getList(){
|
||||
axios({
|
||||
method:"get",
|
||||
url:"http://123.132.248.154:9224/api/FireManagement/LoadFireClueInfoByState",
|
||||
params:this.listQuery,
|
||||
headers:{
|
||||
'X-Token':localStorage.getItem("X-Token")
|
||||
}
|
||||
}).then(res=>{
|
||||
if(res.data.code == 200){
|
||||
this.list = res.data.data;
|
||||
this.reportList = this.list[0]
|
||||
this.list.forEach((item,index)=>{
|
||||
this.list[index].check = false;
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -58,6 +79,7 @@
|
|||
|
||||
.news .title{
|
||||
line-height:10px;
|
||||
margin-top:20px;
|
||||
font-weight: bold;
|
||||
color:aquamarine;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,33 +1,41 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="tab-container">
|
||||
<div class="tab-button" :style="{'border-bottom':active == 1 ? '3px solid #01D6D5': '0px'}" @click="getInfo(1)">最新上报</div>
|
||||
<div class="tab-button" :style="{'border-bottom':active == 2 ? '3px solid #01D6D5': '0px'}" @click="getInfo(2)">正在处理</div>
|
||||
<div class="tab-button" :style="{'border-bottom':active == 3 ? '3px solid #01D6D5': '0px'}" @click="getInfo(3)">处理完成</div>
|
||||
</div>
|
||||
<div class="box-title">火情线索</div>
|
||||
<div class="box-container">
|
||||
|
||||
|
||||
<div class="draw" v-show="active == 1">
|
||||
<div class="news" v-for="(item,index) in list" :key="index" >
|
||||
<div class="checkbox-container" @click="checkNews(index)" :key="checkRandom">
|
||||
<i class="el-icon el-icon-check" v-show="item.check" ></i>
|
||||
</div>
|
||||
<div class="news-container">
|
||||
<div class="title">
|
||||
{{item.address }}
|
||||
{{item.address}}上报了一条火情线索
|
||||
<div
|
||||
class="daohang"
|
||||
style="width:30px;height:24px;text-align:center;line-height:24px;border-radius:0px;float:right;background:#108eff;color:#fff;position:relative;top:4px;cursor:pointer;"
|
||||
@click="toPosition(item);"
|
||||
><i class="el-icon el-icon-document"></i></div>
|
||||
style="height:24px;text-align:center;line-height:24px;border-radius:0px;float:right;color:#fff;position:relative;top:8px;cursor:pointer;"
|
||||
|
||||
>编号:{{item.id}}</div>
|
||||
</div>
|
||||
<p class="desc">
|
||||
<span>信息描述:{{item.describe}}</span>
|
||||
<span class="time">上报时间:<span style="color:#aaa;">{{item.reportTime}}</span></span>
|
||||
|
||||
<span class="time">上报人员:<span style="color:#aaa;">{{item.reportPerson}}</span></span>
|
||||
</p>
|
||||
<p class="desc">
|
||||
<span class="time">上报时间:{{item.reportTime}}</span>
|
||||
<span>火情描述:<span style="color:#aaa;">{{item.describe}}</span></span>
|
||||
<el-button type="primary" size="mini" style="float:right;position:relative;top:-12px;" @click="toPosition(item);">位置</el-button>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="text-align:right;margin:0px 28px;">
|
||||
<el-button type="primary" size="mini" @click="$emit('merge')">线索合并</el-button>
|
||||
<el-button type="warning" size="mini">标为误报线索</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -35,13 +43,11 @@ import axios from 'axios'
|
|||
import { parse } from '../lib/handleGeojson';
|
||||
export default {
|
||||
name: 'toolbox',
|
||||
props:['globalmap'],
|
||||
props:['globalmap','checkList','mergeSuccessRandom'],
|
||||
data(){
|
||||
return {
|
||||
active:1,
|
||||
list:[
|
||||
|
||||
],
|
||||
list:[],
|
||||
listQuery:{
|
||||
state:0,
|
||||
areaname:'feixian',
|
||||
|
|
@ -51,18 +57,36 @@ import { parse } from '../lib/handleGeojson';
|
|||
graphicLayer:null,
|
||||
graphicPoint:null,
|
||||
graphicWinodw:null,
|
||||
checkRandom:1111,
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
mergeSuccessRandom:function(e){
|
||||
this.checkList = [];
|
||||
this.getList();
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.getList();
|
||||
window.wuzi = this.wuzi
|
||||
window.shuiyuan = this.shuiyuan
|
||||
<<<<<<< HEAD
|
||||
window.jiankong = this.jiankong;
|
||||
<<<<<<< HEAD
|
||||
window.renyuan = this.renyuan
|
||||
=======
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
=======
|
||||
window.renyuan = this.renyuan
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
},
|
||||
mounted(){
|
||||
|
||||
},
|
||||
methods:{
|
||||
jiankong(e){
|
||||
this.$emit("jiankong",e);
|
||||
},
|
||||
shuiyuan(e){
|
||||
this.$emit("shuiyuan",e);
|
||||
},
|
||||
|
|
@ -77,10 +101,32 @@ import { parse } from '../lib/handleGeojson';
|
|||
this.active = active;
|
||||
this.getList();
|
||||
},
|
||||
checkNews(index){
|
||||
|
||||
this.list[index].check = !this.list[index].check;
|
||||
this.getCheckList(this.list[index].check,this.list[index].id);
|
||||
this.checkRandom = Math.random()*100000000;
|
||||
console.log(this.list)
|
||||
},
|
||||
getCheckList(type,id){
|
||||
if(type){
|
||||
let idx = this.checkList.lastIndexOf(id);
|
||||
if(idx == -1){
|
||||
this.checkList.push(id);
|
||||
}else{
|
||||
|
||||
}
|
||||
}else{
|
||||
let idx = this.checkList.lastIndexOf(id);
|
||||
this.checkList.splice(idx,1);
|
||||
}
|
||||
console.log(this.checkList);
|
||||
},
|
||||
|
||||
getList(){
|
||||
axios({
|
||||
method:"post",
|
||||
url:"http://123.132.248.154:9224/api/FireManagement/LoadFireClueInfoByAreaName",
|
||||
method:"get",
|
||||
url:"http://123.132.248.154:9224/api/FireManagement/LoadFireClueInfoByState",
|
||||
params:this.listQuery,
|
||||
headers:{
|
||||
'X-Token':localStorage.getItem("X-Token")
|
||||
|
|
@ -88,12 +134,15 @@ import { parse } from '../lib/handleGeojson';
|
|||
}).then(res=>{
|
||||
if(res.data.code == 200){
|
||||
this.list = res.data.data;
|
||||
this.list.forEach((item,index)=>{
|
||||
this.list[index].check = false;
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
toPosition(item){
|
||||
console.log(item);
|
||||
this.$emit("changeCurrentInfo",item);
|
||||
|
||||
// this.$emit("changeCurrentInfo",item);
|
||||
let _self = this;
|
||||
|
||||
if(!_self.graphicLayer){
|
||||
|
|
@ -142,11 +191,22 @@ import { parse } from '../lib/handleGeojson';
|
|||
</div>
|
||||
<div class="data-li">
|
||||
<div class="data-value">
|
||||
<<<<<<< HEAD
|
||||
<<<<<<< HEAD
|
||||
<span id="lablSBZT1" onclick="renyuan([${item.lng},${item.lat}]);" class="label-tag data-value-status-1" title="中间状态">人员调度</span>
|
||||
=======
|
||||
<span id="lablSBZT1" class="label-tag data-value-status-1" title="人员调度">人员调度</span>
|
||||
>>>>>>> db204fe98ead24f5ba150023a2da0b2e70e01a80
|
||||
<span id="lablSBZT2" onclick="wuzi([${item.lng},${item.lat}]);" class="label-tag data-value-status-0" title="物资调度" >物资调度</span>
|
||||
<span id="lablCSFM2" onclick="shuiyuan([${item.lng},${item.lat}])" class="label-tag data-value-status-2" title="附近水源">附近水源</span>
|
||||
<span id="lablSBZT1" onclick="jiankong([${item.lng},${item.lat}])" class="label-tag data-value-status-1" title="视频监控">视频监控</span>
|
||||
=======
|
||||
<span id="lablSBZT1" onclick="renyuan([${item.lng},${item.lat}]);" class="label-tag data-value-status-1" title="中间状态">人员调度</span>
|
||||
<span id="lablSBZT2" onclick="wuzi([${item.lng},${item.lat}]);" class="label-tag data-value-status-0" title="关闭状态" >物资调度</span>
|
||||
<span id="lablCSFM2" onclick="shuiyuan([${item.lng},${item.lat}])" class="label-tag data-value-status-2" title="打开状态">附近水源</span>
|
||||
<span id="lablSBZT1" class="label-tag data-value-status-1" title="中间状态">路线规划</span>
|
||||
|
||||
>>>>>>> ef9d79f6e014554ccf41b120f6fc72d374b9389f
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -181,11 +241,20 @@ import { parse } from '../lib/handleGeojson';
|
|||
|
||||
<style scoped>
|
||||
.box{
|
||||
width:250px;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-image: url(/img/tool-bg.png);
|
||||
background-image: url(/img/huoqing-bg.png);
|
||||
background-size:100% 100%;
|
||||
}
|
||||
|
||||
.box-title{
|
||||
width:100%;
|
||||
height:45px;
|
||||
line-height:45px;
|
||||
color:#fff;
|
||||
text-indent:30px;
|
||||
text-align:left;
|
||||
}
|
||||
.tab-container{
|
||||
width:210px;
|
||||
height:60px;
|
||||
|
|
@ -204,28 +273,67 @@ import { parse } from '../lib/handleGeojson';
|
|||
}
|
||||
|
||||
.box-container{
|
||||
width: 220px;
|
||||
margin:15px;
|
||||
width: calc( 100% - 20px);
|
||||
margin:0px 15px;
|
||||
margin-bottom:10px;
|
||||
height: calc( 100% - 90px);
|
||||
overflow-y:auto;
|
||||
}
|
||||
.news{
|
||||
width:100%;
|
||||
width: calc( 100% - 10px);
|
||||
line-height:18px;
|
||||
padding:10px 15px 0px 15px;
|
||||
padding:6px 15px 10px 15px;
|
||||
text-align:left;
|
||||
color:#ccc;
|
||||
border-bottom:1px solid #01d6d67a;
|
||||
background:rgba(0,0,0,0.5);
|
||||
margin:6px 0px;
|
||||
border:1px dashed #999;
|
||||
}
|
||||
.news::after{
|
||||
content:"";
|
||||
clear:both;
|
||||
display:block;
|
||||
height:0px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.checkbox-container{
|
||||
width:18px;
|
||||
height:18px;
|
||||
position:relative;
|
||||
top:12px;
|
||||
margin-right:10px;
|
||||
float:left;
|
||||
background: rgba(2,0,77,0.4);
|
||||
box-shadow: inset 0px 0px 34px 0px #A15E01;
|
||||
border: 1px solid #F18B00;
|
||||
cursor: pointer;
|
||||
}
|
||||
.news-container{
|
||||
width: calc( 100% - 30px);
|
||||
float:left;
|
||||
}
|
||||
.news .title{
|
||||
line-height:40px;
|
||||
color:#E48F19;
|
||||
margin-bottom:12px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.news .title{
|
||||
line-height:30px;
|
||||
font-weight: bold;
|
||||
color:aquamarine;
|
||||
.news .title::after{
|
||||
content:"";
|
||||
width:100%;
|
||||
height:0px;
|
||||
border: 0.5px solid;
|
||||
position:absolute;
|
||||
bottom:0px;
|
||||
left:0px;
|
||||
border-image: linear-gradient(90deg, rgba(241, 139, 0, 1), rgba(86, 254, 254, 0),rgba(86, 254, 254, 0)) 1 1;
|
||||
}
|
||||
|
||||
.news .desc{
|
||||
font-size:12px;
|
||||
color:#fff;
|
||||
margin-bottom:6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb {
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<div class="item-name">{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="padding:12px 0px;height:50px;color:#fff;">
|
||||
<!-- <div style="padding:12px 0px;height:50px;color:#fff;">
|
||||
<span style="float:left;">单位:</span>
|
||||
<el-select v-model="unit" placeholder="请选择" size="mini" style="float:left;width:100px;">
|
||||
<el-option
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div> -->
|
||||
<div style="background: #0077ff; color: #fff; border-radius: 15px; height:30px;line-height:30px;width:140px;margin:0px auto;cursor:pointer;" @click="measureClear">
|
||||
清空测量数据
|
||||
</div>
|
||||
|
|
@ -506,7 +506,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
|
||||
//
|
||||
drawMarker(img) { //图上标绘
|
||||
this.graphicLayerbiaohui.startDraw({
|
||||
type: "billboard",
|
||||
|
|
|
|||
Loading…
Reference in New Issue