Skip to content

platform / fanxing_new

Go to a project
Commit e056acf7 by 夏新然
Options

解决冲突

2 parents 42273f29 b7b9eada
Inline Side-by-side
Showing 55 changed files with 2502 additions and 1160 deletions
UI/图标/交通首页icon.zip 0 → 100644
No preview for this file type
UI/图标/交通首页icon/信息存储.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>51CE9DB1-4C55-40A4-B61F-9CD23023C54F</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-291.000000, -367.000000)">
<g id="信息存储" transform="translate(291.000000, 367.000000)">
<rect id="矩形备份-3" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="35" height="35"></rect>
<g id="存储" transform="translate(7.000000, 6.000000)" fill="#3BB7FF" fill-rule="nonzero">
<path d="M7.56277015,5.04166667 C7.56277015,4.40916667 8.0551511,3.89583333 8.66277015,3.89583333 C9.2703892,3.89583333 9.76277015,4.40916667 9.76277015,5.04166667 C9.76277015,5.67416667 9.2703892,6.1875 8.66277015,6.1875 C8.0551511,6.1875 7.56277015,5.67416667 7.56277015,5.04166667 Z M17.6000042,17.6458333 C17.6000042,18.2783333 17.1076232,18.7916667 16.5000042,18.7916667 L5.50000415,18.7916667 C4.8923851,18.7916667 4.40000415,18.2783333 4.40000415,17.6458333 C4.40000415,17.0133333 4.8923851,16.5 5.50000415,16.5 L16.5000042,16.5 C17.1076232,16.5 17.6000042,17.0133333 17.6000042,17.6458333 Z M17.6000042,13.0625 C17.6000042,13.695 17.1076232,14.2083333 16.5000042,14.2083333 L5.50000415,14.2083333 C4.8923851,14.2083333 4.40000415,13.695 4.40000415,13.0625 C4.40000415,12.43 4.8923851,11.9166667 5.50000415,11.9166667 L16.5000042,11.9166667 C17.1076232,11.9166667 17.6000042,12.43 17.6000042,13.0625 Z M19.8000042,19.9375 C19.8000042,20.57 19.3076232,21.0833333 18.7000042,21.0833333 L3.30000415,21.0833333 C2.6923851,21.0833333 2.20000415,20.57 2.20000415,19.9375 L2.20000415,8.52958781 C2.20000415,8.37719198 2.25867082,8.23167114 2.36028987,8.12510864 L4.40000415,6.00073364 L4.40000415,7.33333781 C4.40000415,8.59948364 5.38476606,9.62500448 6.60000415,9.62500448 L15.4000042,9.62500448 C16.6152422,9.62500448 17.6000042,8.59948364 17.6000042,7.33333781 L17.6000042,2.75000448 L18.7000042,2.75000448 C19.3076232,2.75000448 19.8000042,3.26333781 19.8000042,3.89583781 L19.8000042,19.9375045 L19.8000042,19.9375 Z M6.60000415,3.70905355 L7.36057558,2.91728271 L7.36057562,2.91728267 C7.46561396,2.80960634 7.60423299,2.74977974 7.74819467,2.74999045 L15.4000083,2.74999045 L15.4000083,6.18749101 C15.4000083,6.81999101 14.9076273,7.33332434 14.3000083,7.33332434 L7.70000829,7.33332434 C7.09238924,7.33332434 6.60000415,6.81999101 6.60000415,6.18749101 L6.60000415,3.70904455 L6.60000415,3.70905355 Z M19.8000042,0.458333333 L7.07143272,0.458333333 C6.78019463,0.458333333 6.50152796,0.578645833 6.29619463,0.792916667 L0.325809583,6.99760417 L0.325809524,6.99760423 C0.120877232,7.20801705 0.00417615327,7.50142401 0.00314285714,7.80885423 L0,21.0833334 C0,22.3483334 0.984761905,23.3750001 2.19895647,23.3750001 L19.8,23.3750001 C21.0152381,23.3750001 22,22.3494792 22,21.0833334 L22,2.75000006 C22,1.48385423 21.0152381,0.458333333 19.8,0.458333333 L19.8000042,0.458333333 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/分析资源.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>7ED4EC4C-2CDC-4CAD-8439-035274EB51E0</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-291.000000, -148.000000)">
<g id="分析资源" transform="translate(291.000000, 148.000000)">
<rect id="矩形" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="35" height="35"></rect>
<path d="M15.1586307,26.1703695 C14.1114494,26.1276036 13.0830595,25.8703911 12.1335892,25.4137706 C10.7422325,24.725194 9.84480738,23.6237101 9.46682212,22.1558606 L9.67784456,22.1558606 C9.8892508,22.1564175 10.0849936,22.0412172 10.1917529,21.8534106 C10.2985122,21.665604 10.3001775,21.4335322 10.196125,21.2441231 L8.65635681,18.5327783 C8.54970665,18.3437338 8.35336611,18.2273943 8.14097507,18.2273943 C7.92858404,18.2273943 7.7322435,18.3437338 7.62559334,18.5327783 L6.07886841,21.2465099 C5.97314646,21.435962 5.97375139,21.6690974 6.08045499,21.8579656 C6.18715859,22.0468338 6.38372123,22.16269 6.59598934,22.1618275 L7.0284694,22.1618275 C7.58037425,25.2717591 9.54102782,26.8386587 11.0923906,27.6024178 C12.3674975,28.2174452 13.7511472,28.5581447 15.1586307,28.6036637 C15.8134528,28.6056408 16.3462057,28.0615784 16.3494119,27.3876106 C16.3508024,27.0639357 16.2254119,26.7533369 16.001561,26.5259948 C15.7776334,26.296919 15.4743483,26.1689656 15.1586307,26.1703695 L15.1586307,26.1703695 Z M28.9272654,13.7592838 C28.8218868,13.5659554 28.6232009,13.4463613 28.4078255,13.4466199 L27.9753454,13.4466199 C27.4234406,10.3366882 25.4616276,8.76978867 23.9114242,8.00244943 C22.636339,7.38735846 21.2526763,7.04665575 19.8451841,7.00120896 C19.4144602,6.98731612 19.0105505,7.21589327 18.7911975,7.59767207 C18.5718444,7.97945087 18.5718444,8.45386912 18.7911975,8.83564792 C19.0105505,9.21742672 19.4144602,9.44600386 19.8451841,9.43211103 C20.8923308,9.47785302 21.9205411,9.73492211 22.8713851,10.1887099 C24.2627418,10.8784799 25.1601669,11.9787703 25.5381522,13.4466199 L25.3271297,13.4466199 C25.112234,13.4427422 24.9120853,13.5587182 24.8038487,13.7498345 C24.6956122,13.9409509 24.6961944,14.1773552 24.805371,14.3679043 L26.3439796,17.0792492 C26.4506298,17.2682937 26.6469703,17.3846332 26.8593614,17.3846332 C27.0717524,17.3846332 27.2680929,17.2682937 27.3747431,17.0792492 L28.9110329,14.3714845 C29.0235545,14.1854373 29.0297608,13.9513704 28.9272654,13.7592838 L28.9272654,13.7592838 Z M26.6442808,17.7952656 L18.9535563,17.7952656 C18.1480604,17.7926287 17.4924648,18.4615257 17.4879939,19.2905705 L17.4879939,27.1107479 C17.4924648,27.9397927 18.1480604,28.6086897 18.9535563,28.6060528 L26.6442808,28.6060528 C27.4497767,28.6086897 28.1053724,27.9397927 28.1098433,27.1107479 L28.1098433,19.2905705 C28.1053724,18.4615257 27.4497767,17.7926287 26.6442808,17.7952656 L26.6442808,17.7952656 Z M25.7329421,20.2273688 L25.7329421,26.1703695 L19.8695328,26.1703695 L19.8695328,20.2273688 L25.7329421,20.2273688 Z M17.500748,8.49531273 C17.4962771,7.66626788 16.8406814,6.99737089 16.0351855,7.00000777 L8.34098261,7.00000777 C7.53593873,6.99802998 6.88104978,7.66673496 6.87657962,8.49531273 L6.87657962,16.3154901 C6.87719386,16.7144904 7.03186114,17.0968799 7.30652357,17.3784559 C7.581186,17.660032 7.95332048,17.8177046 8.34098261,17.8167773 L16.0317071,17.8167773 C16.4201712,17.8189759 16.7934991,17.6618651 17.0691662,17.3801512 C17.3448334,17.0984373 17.5001373,16.7153208 17.500748,16.3154901 L17.500748,8.49531273 Z M15.119209,9.43211103 L15.119209,15.3798852 L9.25811861,15.3798852 L9.25811861,9.43211103 L15.119209,9.43211103 Z" id="形状" fill="#3BB7FF" fill-rule="nonzero"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/删 除.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="16px" viewBox="0 0 12 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>DB87ED2D-0B60-4F5D-9360-22CED3FFCE03</title>
<desc>Created with Sketch.</desc>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="操作" transform="translate(-47.000000, -2.000000)" fill="#F2284F" fill-rule="nonzero">
<g transform="translate(32.000000, 1.000000)" id="删-除">
<g transform="translate(15.000000, 1.000000)">
<path d="M10.2654594,1.95458005 L1.46202698,1.95458005 C0.656740486,1.95458005 0,2.61132054 0,3.42442621 L0,3.90916163 L11.7274803,3.90916163 L11.7274803,3.41660703 C11.7274803,2.61132054 11.0707414,1.95458005 10.2654533,1.95458005 L10.2654594,1.95458005 Z M7.70104479,0.977290026 L7.91995727,2.51750571 L3.8075261,2.51750571 L4.02643857,0.977290026 L7.70105396,0.977290026 L7.70104479,0.977290026 Z M7.81832876,0 L3.90916866,0 C3.50261583,0 3.12733664,0.328370243 3.07260852,0.727103902 L2.7833311,2.7755049 C2.72860283,3.17424008 3.01006275,3.5026088 3.41661559,3.5026088 L8.30306572,3.5026088 C8.70961855,3.5026088 8.99107832,3.17423855 8.9363502,2.7755049 L8.64707278,0.727103902 C8.60016277,0.328368715 8.22488313,0 7.81833029,0 L7.81832876,0 Z M10.5078334,4.88645013 L1.21966706,4.88645013 C0.680203514,4.88645013 0.281468328,5.32427661 0.328378799,5.86374016 L1.12584764,14.6671726 C1.17275766,15.1988185 1.65749354,15.6444626 2.18913944,15.6444626 L9.52272575,15.6444626 C10.0621893,15.6444626 10.5391071,15.2066362 10.5860175,14.6671726 L11.391304,5.86374016 C11.4460323,5.32427661 11.0472985,4.88645013 10.5078334,4.88645013 L10.5078334,4.88645013 Z M3.90917019,13.6820604 L2.43932556,13.6820604 L1.95459014,6.84103018 L3.90917019,6.84103018 L3.90917019,13.6820604 L3.90917019,13.6820604 Z M6.84104027,13.6820604 L4.88646021,13.6820604 L4.88646021,6.84103018 L6.84104027,6.84103018 L6.84104027,13.6820604 Z M9.28817645,13.6820604 L7.81833182,13.6820604 L7.81833182,6.84103018 L9.77291187,6.84103018 L9.28817645,13.6820604 Z" id="Shape"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/危险品.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="38px" height="38px" viewBox="0 0 38 38" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>8B55E524-C630-41D6-B823-8B461209158F</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-1181.000000, -820.000000)">
<g id="危险品" transform="translate(1181.000000, 820.000000)">
<rect id="矩形备份-4" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="38" height="38"></rect>
<g id="危险品车" transform="translate(6.000000, 7.000000)" fill="#3BB7FF" fill-rule="nonzero">
<path d="M26.923109,20.2461458 L24.7692606,20.2461458 C24.5000298,18.3674972 22.9250299,16.921345 21.0000174,16.921345 C19.0750174,16.921345 17.486554,18.3810137 17.2307741,20.2461458 L12.92309,20.2461458 C12.3307831,20.2461458 11.8461674,19.7595896 11.8461674,19.1513943 L11.8461674,5.64945935 L13.6634761,5.64945935 L13.6634761,18.408034 L15.8846311,18.408034 C16.7865557,16.4347793 18.7654029,15.0832332 21.0000079,15.0832332 C23.2346255,15.0832332 25.2134822,16.4347793 26.1153847,18.408034 L26.1961539,18.408034 L26.1961539,5.64945935 L28,5.64945935 L28,19.1513943 C28,19.7460731 27.5153844,20.2461458 26.9230774,20.2461458 L26.923109,20.2461458 Z M24.5673374,11.596247 C24.8634915,11.596247 25.0654157,11.7584324 25.173107,12.0692867 C25.1865685,12.1368638 25.2000301,12.2044413 25.2000301,12.285534 C25.2000301,12.677481 24.9577223,12.8937293 24.459644,12.9207591 C24.6615672,13.1234909 24.7557981,13.3397391 24.7557981,13.5289544 C24.7557981,13.7316862 24.6481059,13.9073881 24.4461827,14.056057 C24.3115671,14.1371497 24.2038749,14.1641805 24.082721,14.1641805 C23.6923372,14.1641805 23.4231042,13.8398096 23.2615656,13.1640382 L20.0577073,11.9611641 L16.8538489,13.1640382 C16.6923104,13.8262963 16.4230805,14.1641805 16.0461562,14.1641805 C15.9250023,14.1641805 15.8038484,14.1236341 15.6692319,14.056057 C15.4673087,13.9073871 15.3730778,13.7452017 15.3730778,13.5289544 C15.3730778,13.3262226 15.4673087,13.1234909 15.6692319,12.9207591 C15.1711536,12.8937282 14.9153832,12.677481 14.9153832,12.285534 C14.9153832,12.2044413 14.9288479,12.1368642 14.9423095,12.0692867 C15.0634634,11.7584314 15.2653866,11.596247 15.5615416,11.596247 C15.8038495,11.596247 16.0865419,11.717886 16.409619,11.9476476 L18.2538497,11.2718762 L16.3826938,10.5690717 C16.0730784,10.7718035 15.7769243,10.8799269 15.5211538,10.8799269 C15.2384614,10.8799269 15.0500008,10.7177415 14.9423063,10.4068872 C14.9288448,10.3393101 14.9153832,10.2717326 14.9153832,10.1906399 C14.9153832,9.79869292 15.1711527,9.58244466 15.6692287,9.55541481 C15.4673055,9.35268305 15.3730746,9.13643479 15.3730746,8.94721954 C15.3730746,8.74448778 15.4673055,8.56878587 15.6692287,8.42011697 C15.776921,8.36605507 15.8980749,8.3390211 16.0057684,8.3390211 C16.4096148,8.3390211 16.6788446,8.69042493 16.8269237,9.3797129 L20.0442226,10.5825869 L23.2615215,9.35267989 C23.4095984,8.67690842 23.6788304,8.3390211 24.0826768,8.3390211 C24.2038307,8.3390211 24.311523,8.36605199 24.4192165,8.42011381 C24.6346013,8.56878366 24.7288319,8.74448462 24.7288319,8.94721637 C24.7288319,9.14994813 24.6211397,9.35267989 24.4326778,9.55541164 C24.9307561,9.58244253 25.1730639,9.79868975 25.1730639,10.1906368 C25.1730639,10.2582139 25.1596023,10.3393066 25.1461408,10.4068841 C25.0519099,10.7177393 24.8634484,10.8799238 24.5672933,10.8799238 C24.2980625,10.8799238 24.015371,10.7718003 23.7057533,10.5690685 L21.84806,11.271873 L23.6788313,11.961161 C24.0288304,11.7178829 24.3249855,11.5962438 24.5672933,11.5962438 L24.5673374,11.596247 Z M22.1173372,8.24442583 L22.1173372,8.40661124 C22.1173372,8.67692014 22.0365679,8.89316745 21.8615677,9.06886937 C21.6865675,9.24457033 21.471184,9.35269383 21.2154135,9.37972462 C20.9731057,9.39324008 20.7846451,9.35269373 20.6500286,9.25808557 C20.4615671,9.40675542 20.2461823,9.47433288 20.017337,9.47433288 C19.7750292,9.47433288 19.546184,9.39324018 19.3442608,9.24457033 C19.2096453,9.35269383 19.0211837,9.40675573 18.7519539,9.37972494 C18.4961844,9.36620948 18.2808008,9.25808588 18.1057997,9.08238492 C17.9307995,8.90668396 17.8500302,8.67692141 17.8500302,8.42012679 L17.8500302,8.20387948 C16.9346462,7.93357058 16.2211821,7.501075 15.7231071,6.90639624 C15.2250288,6.31171747 14.9692616,5.60891299 14.9692616,4.82501581 C14.9692616,4.64931485 14.9827231,4.46009865 15.0231079,4.25736689 C15.1981081,3.04097635 15.7365687,2.04083407 16.6250307,1.24342039 C17.56734,0.405463514 18.7115692,0 20.0711969,0 C21.4308119,0 22.5750444,0.41898002 23.5173631,1.25693689 C24.4192877,2.04083407 24.9577474,3.04097635 25.1327485,4.25736689 C25.1731332,4.46009865 25.1865948,4.6493139 25.1865948,4.82501581 C25.1865948,5.63594284 24.9308254,6.33874732 24.4058241,6.93342608 C23.8673613,7.52810485 23.1000532,7.97411471 22.1173624,8.24442583 L22.1173372,8.24442583 Z M18.8865663,3.23020427 C18.6173355,2.90583346 18.2807967,2.74364806 17.9038724,2.74364806 C17.5134886,2.74364806 17.1904115,2.90583346 16.9211785,3.23020427 C16.6519477,3.55457508 16.5038696,3.94652209 16.5038696,4.41956497 C16.5038696,4.87909134 16.6384851,5.28455485 16.9211785,5.60892566 C17.1904093,5.93329648 17.5269481,6.09548188 17.9038724,6.09548188 C18.2942562,6.09548188 18.6173333,5.93329648 18.8865663,5.60892566 C19.1557971,5.28455485 19.3038752,4.89260785 19.3038752,4.41956497 C19.3038752,3.94652526 19.1557983,3.55457508 18.8865663,3.23020427 Z M20.4346451,6.51445873 C20.3134912,6.31172698 20.1923372,6.21711872 20.0711833,6.21711872 C19.9365678,6.21711872 19.8154139,6.31172698 19.6807996,6.48742762 C19.546184,6.66312858 19.4788764,6.83882828 19.4788764,7.02804669 C19.4788764,7.13617019 19.5057995,7.23077845 19.5731073,7.31187115 C19.6807996,7.43351021 19.8557998,7.48757212 20.084645,7.48757212 C20.4346441,7.48757212 20.6096453,7.35241751 20.6096453,7.0821086 C20.5961837,6.8928924 20.5423376,6.70367493 20.4346451,6.51445968 L20.4346451,6.51445873 Z M23.1000311,3.23020427 C22.8308003,2.90583346 22.4942615,2.74364806 22.1038778,2.74364806 C21.7269534,2.74364806 21.3904169,2.90583346 21.1211839,3.23020427 C20.8519531,3.55457508 20.7173375,3.94652209 20.7173375,4.41956497 C20.7173375,4.87909134 20.8519531,5.28455485 21.1211839,5.60892566 C21.3904147,5.93329648 21.7134908,6.09548188 22.1038778,6.09548188 C22.4942615,6.09548188 22.8308012,5.93329648 23.1000311,5.60892566 C23.3692619,5.28455485 23.5038774,4.89260785 23.5038774,4.41956497 C23.517339,3.94652526 23.3692619,3.55457508 23.1000311,3.23020427 Z M9.69233172,20.2461458 C9.42310091,18.3674972 7.84810103,16.921345 5.92308845,16.921345 C3.99808849,16.921345 2.40962507,18.3810137 2.15384518,20.2461458 L1.07692259,20.2461458 C0.484615639,20.2461458 0,19.7595896 0,19.1513943 L0,13.7046573 C0,12.677482 0.82115533,11.5016378 0.82115533,11.5016378 L3.23077093,8.25792967 C3.72884917,7.6632509 4.05192626,7.16317818 4.84615639,7.16317818 L9.69231279,7.16317818 C10.2846197,7.16317818 10.7692354,7.6497344 10.7692354,8.25792967 L10.7692354,19.1513722 C10.7692354,19.7460509 10.2846197,20.2326072 9.69231279,20.2461458 L9.69233172,20.2461458 Z M8.95194566,9.0012805 L4.98077921,9.0012805 C4.91347159,9.0823732 4.81924067,9.1904967 4.73847139,9.28510496 L4.65770212,9.39322846 L2.28847116,12.5828642 C2.04616334,12.9477814 1.80385552,13.4884004 1.80385552,13.7046455 L1.8577018,14.1641719 L8.95194566,14.0965948 L8.95194566,9.0012805 L8.95194566,9.0012805 Z M5.89617588,17.9214778 C7.44425467,17.9214778 8.70963784,19.2054445 8.70963784,20.7732389 C8.70963784,22.3410301 7.44425151,23.625 5.89617588,23.625 C4.34809709,23.625 3.08271391,22.3410333 3.08271391,20.7732389 C3.08271391,19.2054477 4.34810024,17.9214778 5.89617588,17.9214778 Z M21.0538867,17.9214778 C22.6019655,17.9214778 23.8673486,19.2054445 23.8673486,20.7732389 C23.8673486,22.3410301 22.6019623,23.625 21.0538867,23.625 C19.5058079,23.625 18.2404247,22.3410333 18.2404247,20.7732389 C18.2404247,19.1919312 19.505811,17.9214778 21.0538867,17.9214778 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/定位 位置.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="13px" height="16px" viewBox="0 0 13 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>F641DF01-F6EB-4FBF-A6E0-29E9E9E6C104</title>
<desc>Created with Sketch.</desc>
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="操作" transform="translate(-8.000000, -2.000000)" fill="#799AF4" fill-rule="nonzero">
<g id="定位-位置" transform="translate(8.000000, 2.000000)">
<path d="M6.49998464,0 C2.91013004,0 0,2.96659375 0,6.62776563 C0,8.45740625 0.727991126,10.113875 1.90356175,11.313875 L6.49998464,16 L11.0963921,11.313875 L11.0963919,11.3138752 C12.3184024,10.0691611 13.0030522,8.38373455 12.9999795,6.6277658 C12.9999795,2.96659392 10.0898237,0 6.49998447,0 L6.49998464,0 Z M6.49998464,9.57176563 L6.49998473,9.57176563 C4.89994274,9.56762328 3.60617992,8.24956719 3.61025543,6.6278125 C3.61025543,6.62716884 3.61025543,6.62652518 3.61025543,6.62588153 L3.61025543,6.62588559 C3.60564982,5.00463559 4.89857624,3.68657309 6.4980941,3.68188069 C6.49872234,3.68188069 6.49935058,3.68188069 6.49997881,3.68188069 L6.49997894,3.68188069 C8.10002093,3.68603178 9.39378374,5.00409475 9.38969293,6.62584944 C9.38969293,6.6264879 9.38969293,6.62712637 9.38969293,6.62776483 L9.38969293,6.62777913 C9.39479926,8.24901351 8.10228009,9.56749788 6.50276377,9.57270871 C6.50183282,9.57270871 6.50090186,9.57270871 6.49997091,9.57270871 L6.49998464,9.57176563 Z" id="形状"></path>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/渣土车抓拍.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="38px" height="38px" viewBox="0 0 38 38" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>81984471-8C82-4814-A72F-3A358F900444</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-1181.000000, -748.000000)">
<g id="渣土车抓拍" transform="translate(1181.000000, 748.000000)">
<rect id="矩形" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="38" height="38"></rect>
<g id="货车，渣土车，汽车" transform="translate(19.500000, 19.500000) scale(-1, 1) translate(-19.500000, -19.500000) translate(6.000000, 6.500000)" fill="#3BB7FF" fill-rule="nonzero">
<path d="M6.91574476,12.202874 L6.91574481,12.202874 C6.46012949,12.1139697 6.01596182,12.3976829 5.92366632,12.8365643 C5.92342333,12.8377197 5.92318296,12.8388757 5.92294521,12.8400322 L5.07906671,16.9022769 L5.07906672,16.9022769 C4.9876342,17.3423143 5.28377823,17.7704484 5.74057363,17.8586128 L5.74057354,17.8586128 C5.79545819,17.8692276 5.85131918,17.8744519 5.90729878,17.8742136 L5.90729879,17.8742136 C6.30908143,17.8738911 6.65490687,17.6007187 6.73391225,17.2212459 L7.5772504,13.1590012 L7.57725042,13.1590011 C7.66876886,12.7191491 7.37279301,12.2911114 6.91617052,12.2029546 C6.91602854,12.2029272 6.91588655,12.2028998 6.91574456,12.2028725 L6.91574476,12.202874 Z M10.2907316,12.202874 L10.2907316,12.202874 C9.83627872,12.1132247 9.39242472,12.395427 9.2993569,12.8331898 C9.29887243,12.8354686 9.29839817,12.8377494 9.29793413,12.8400322 L8.45405562,16.902277 L8.45405563,16.9022769 C8.36262312,17.3423143 8.65876714,17.7704484 9.11556254,17.8586128 L9.11556245,17.8586128 C9.17044711,17.8692276 9.2263081,17.8744519 9.2822877,17.8742136 L9.2822877,17.8742136 C9.68407034,17.8738912 10.0298958,17.6007187 10.1089012,17.221246 L10.9522393,13.1590012 L10.9522393,13.1590011 C11.0437578,12.7191491 10.7477819,12.2911114 10.2911594,12.2029546 C10.2910175,12.2029272 10.2908755,12.2028998 10.2907335,12.2028725 L10.2907316,12.202874 Z M13.6657185,12.202874 L13.6657185,12.202874 C13.2103852,12.1137892 12.7662914,12.3971365 12.6738113,12.8357467 C12.6735103,12.8371743 12.6732133,12.8386028 12.6729203,12.840032 L11.8290418,16.9022768 L11.8290418,16.9022767 C11.7376093,17.3423141 12.0337533,17.7704482 12.4905487,17.8586126 L12.4905487,17.8586126 C12.5454373,17.8692024 12.6012956,17.8744264 12.6572739,17.8742118 L12.6572739,17.8742118 C13.0590566,17.873891 13.404882,17.6007185 13.4838874,17.2212457 L14.3272255,13.159001 L14.3272256,13.1590009 C14.418744,12.7191489 14.1227682,12.2911112 13.6661457,12.2029544 C13.6660037,12.202927 13.6658617,12.2028996 13.6657197,12.2028723 L13.6657185,12.202874 Z M26.9163375,16.7206293 C26.9131001,16.7134568 26.9147188,16.7050368 26.9109418,16.6983841 L24.3798467,11.8236091 L24.3798467,11.8236091 C24.2367332,11.5483807 23.9445567,11.3745834 23.6249952,11.3745987 L19.0856326,11.3745987 L19.3899482,9.90917005 L19.3899482,9.90916988 C19.4812233,9.46900809 19.1847896,9.04090946 18.7278456,8.95298628 C18.6734997,8.94252932 18.6182162,8.93724173 18.5627967,8.93724173 L0.844036733,8.93724173 L0.844036719,8.93724173 C0.378065012,8.93724173 0,9.30080469 0,9.74966282 C0,9.80322059 0.00545386433,9.85664939 0.0163448657,9.9091697 L2.54798038,22.0960056 L2.54798033,22.0960053 C2.62710194,22.4756228 2.9731749,22.7488174 3.37513151,22.7489646 L4.21901001,22.7489646 L4.21901001,22.7489651 C4.2190103,24.544456 5.73003886,26 7.59399686,26 C9.45794432,26 10.9689837,24.5444662 10.9689837,22.7489651 L17.718931,22.7489651 L17.718931,22.7486783 C17.7189313,24.5441692 19.2299599,25.9997132 21.0939179,25.9997132 C22.9576307,25.9997129 24.468562,24.5445298 24.4689047,22.7492623 L26.1566617,22.7492623 L26.1566617,22.7492623 C26.6221853,22.749492 27,22.3861564 27,21.9377274 C27,21.9374155 27,21.9371035 27,21.9367916 L27,17.0620674 L27,17.0620688 C26.9989253,16.9437582 26.9703482,16.8271825 26.916368,16.7209056 L26.9163375,16.7206293 Z M24.7909946,16.2493206 L21.9377812,16.2493206 L21.9377812,12.9996061 L23.1037806,12.9996061 L24.7909946,16.2493206 Z M7.59400799,24.373864 L7.59400796,24.373864 C6.66267343,24.3728594 5.90779558,23.6461004 5.90625088,22.7489732 L5.90625088,22.7489793 C5.90833944,22.5689905 5.94190201,22.3906266 6.00552831,22.2213844 C6.00714701,22.2165507 6.01092397,22.2133803 6.01254264,22.2087025 L6.01254265,22.2087025 C6.18474685,21.7448587 6.56558818,21.3809835 7.04850599,21.2188939 C7.07386552,21.210526 7.09976472,21.2033015 7.12566361,21.1954533 L7.12566375,21.1954532 C7.43025341,21.1000931 7.75838943,21.1002386 8.06288684,21.1958691 C8.08824637,21.2030416 8.11360574,21.2101622 8.13842576,21.2184781 L8.13842565,21.2184781 C8.62167295,21.3809354 9.00269536,21.7452478 9.17493198,22.2095283 C9.17709024,22.21431 9.18086718,22.218312 9.18302547,22.2229898 L9.18302543,22.2229897 C9.24603731,22.3918373 9.27923048,22.5696626 9.28122614,22.7490789 L9.28122614,22.7490575 C9.27990052,23.6460501 8.52522276,24.3728204 7.59403057,24.373864 L7.59400799,24.373864 Z M10.506028,21.1240448 C10.4957763,21.1074129 10.4833663,21.0928598 10.4731145,21.0764358 L10.4731145,21.0764358 C10.4168281,20.9870763 10.356334,20.9002398 10.291821,20.8161981 C10.242181,20.7519572 10.1876851,20.6924981 10.1337285,20.6321033 L10.1337286,20.6321034 C10.0358305,20.5229289 9.93056722,20.4200904 9.81862173,20.3242554 C9.74092454,20.2576758 9.66268753,20.1929671 9.57905512,20.133508 L9.5790552,20.1335081 C9.50914942,20.0847413 9.43752585,20.038301 9.36431125,19.9942694 L9.36431132,19.9942694 C9.25545113,19.9294584 9.14286089,19.8706496 9.02708413,19.8181267 C8.96233653,19.7883972 8.89866778,19.7578361 8.83122235,19.7324202 L8.83122223,19.7324201 C8.67683662,19.6737652 8.51812393,19.6262844 8.3564045,19.590373 L8.35640469,19.590373 C8.30046806,19.5776466 8.24414816,19.5665364 8.18752118,19.5570573 L8.18752149,19.5570573 C7.79553643,19.4798579 7.39138677,19.4798579 6.99940171,19.557057 C6.94274732,19.5665684 6.88771189,19.577847 6.83213689,19.5899571 L6.83213661,19.5899572 C6.66832322,19.6261627 6.50760911,19.6743264 6.3513855,19.7340313 C6.28825658,19.7581476 6.2283648,19.7867337 6.16739415,19.8145401 L6.16739437,19.81454 C6.04822734,19.8684944 5.93238943,19.9290237 5.82045658,19.9958264 L5.82045684,19.9958262 C5.74924551,20.0387049 5.6795999,20.08395 5.61164548,20.1314805 C5.52423611,20.1933824 5.44168257,20.2614175 5.36074799,20.3310119 L5.36074794,20.3310119 C5.25400832,20.4228895 5.15344615,20.5212165 5.05967191,20.6253976 C5.00301752,20.688495 4.9463634,20.7501372 4.89510466,20.8177043 C4.83035706,20.9008639 4.7715444,20.9867782 4.71489028,21.076383 C4.70463856,21.0926511 4.69168901,21.107568 4.68197678,21.1240448 L4.06632635,21.1240448 L1.8729961,10.561988 L17.5333146,10.561988 L15.3399844,21.1238904 L10.5060353,21.1238904 L10.506028,21.1240448 Z M21.0939027,24.3738609 L21.0939026,24.3738609 C20.1625681,24.3728594 19.4076902,23.6461004 19.4061456,22.7489732 L19.4061456,22.7489773 C19.4081493,22.5689346 19.4419024,22.3905281 19.5059636,22.2213798 L19.5059636,22.2213798 C19.5078713,22.2170381 19.5100331,22.212804 19.5124384,22.208698 L19.5124384,22.2086979 C19.6846426,21.7448542 20.0654839,21.380979 20.5484017,21.2188893 C20.5737613,21.2105214 20.5996605,21.2032969 20.6260989,21.1954487 L20.6260989,21.1954487 C20.9305041,21.1000903 21.2584688,21.1002358 21.5627817,21.1958645 C21.5881412,21.203037 21.6135006,21.2101576 21.6383206,21.2184735 L21.6383206,21.2184735 C22.1215678,21.3809316 22.5025903,21.7452433 22.6748242,22.2095237 C22.6769825,22.2143054 22.6807594,22.2183075 22.6829177,22.2229852 L22.6829177,22.2229851 C22.7459295,22.3918328 22.7791227,22.5696581 22.7811184,22.7490744 L22.7811184,22.7490529 C22.7797928,23.6460455 22.025115,24.3728159 21.0939228,24.3738609 L21.0939027,24.3738609 Z M24.0059227,21.1240448 C23.9962105,21.1074129 23.983261,21.0928598 23.9730092,21.0764358 L23.9730092,21.0764358 C23.9167228,20.9870763 23.8562287,20.9002398 23.7917157,20.8161981 C23.7420756,20.7519572 23.6875798,20.6924981 23.6336232,20.6321033 L23.6336232,20.6321033 C23.5357691,20.5230609 23.4306946,20.4202305 23.3190567,20.3242554 C23.2413595,20.2576757 23.1625829,20.1929671 23.0789505,20.133508 L23.0789506,20.133508 C23.0091303,20.0846216 22.9375014,20.0381778 22.864204,19.9942676 L22.8642041,19.9942676 C22.7553439,19.9294566 22.6427537,19.8706478 22.5269769,19.8181249 C22.4622293,19.7883954 22.3985606,19.7578343 22.3311151,19.7324184 L22.331115,19.7324183 C22.1767294,19.6737634 22.0180167,19.6262826 21.8562973,19.5903712 L21.8562975,19.5903712 C21.8003609,19.5776448 21.744041,19.5665345 21.687414,19.5570555 L21.6874143,19.5570555 C21.2954292,19.4798561 20.8912796,19.4798561 20.4992945,19.5570552 C20.44318,19.5665666 20.3876047,19.5778452 20.3320294,19.5899553 L20.3320292,19.5899554 C20.1682164,19.6261609 20.0075017,19.6743244 19.8512781,19.734029 C19.7881492,19.7581453 19.7282574,19.7867314 19.6672868,19.8145378 L19.667287,19.8145377 C19.5481199,19.8684921 19.432282,19.9290214 19.3203492,19.995824 L19.3203494,19.9958239 C19.2491381,20.0387026 19.1794925,20.0839476 19.1115381,20.1314782 C19.0241287,20.1933801 18.9415752,20.2614152 18.8606406,20.3310095 L18.8606404,20.3310097 C18.7539008,20.4228872 18.6533386,20.5212143 18.5595644,20.6253954 C18.50291,20.6884928 18.4462559,20.750135 18.3949972,20.8177021 L18.394997,20.8177023 C18.3306157,20.9009551 18.2706475,20.9872917 18.2153221,21.076381 C18.2050704,21.0926491 18.1915813,21.107566 18.1818691,21.12399 L17.0606533,21.12399 L18.7478647,12.999602 L20.2500106,12.999602 L20.2500106,17.0618976 L20.2500106,17.0619496 C20.2500105,17.5106071 20.6275853,17.8743148 21.0933488,17.8743148 C21.0935467,17.8743148 21.0937446,17.8743147 21.0939425,17.8743146 L25.3128078,17.8743146 L25.3128078,21.1241307 L24.0059836,21.1241307 L24.0059227,21.1240448 Z M1.68683209,8.1247803 L1.6868321,8.1247803 C1.93751581,8.12530126 2.17542497,8.0182787 2.33592663,7.83278639 L5.96340488,3.64117562 L7.84108793,5.44932637 L7.84108795,5.44932639 C8.17146184,5.76679995 8.70645946,5.76618041 9.03603731,5.44793995 C9.05744191,5.42727175 9.07767664,5.40550917 9.0966537,5.38274659 L11.8824149,2.02903142 L17.9660105,7.88658174 L17.9660104,7.88658165 C18.290878,8.20816598 18.8248687,8.21517637 19.158714,7.90224149 C19.4925594,7.58930526 19.4998371,7.07492624 19.1749709,6.75334191 C19.1697148,6.74813894 19.1643866,6.74300406 19.1589876,6.73793865 L12.4090403,0.238331793 L12.4090403,0.238331785 C12.2411402,0.0723058211 12.0059186,-0.0141642419 11.7658791,0.00189847043 L11.7658791,0.00189846985 C11.5263705,0.0146713756 11.3037611,0.124817245 11.1534735,0.304911983 L8.36771231,3.65867794 L6.50297673,1.86320989 L6.50297674,1.8632099 C6.33594626,1.70105857 6.10530608,1.61483556 5.86844811,1.62599684 L5.86844809,1.62599684 C5.63149339,1.63623468 5.40988849,1.74183666 5.25766088,1.91705637 L1.03934906,6.79178056 L1.03934904,6.79178059 C0.740848271,7.13618614 0.788709084,7.64847804 1.14624708,7.93601588 C1.2979209,8.05799393 1.48924159,8.12480036 1.68682751,8.12477827 L1.68683209,8.1247803 Z M5.90622462,8.1247803 L7.59398163,8.1247803 L7.59398163,6.49983923 L5.90622462,6.49983923 L5.90622462,8.1247803 L5.90622462,8.1247803 Z M10.9689685,8.1247803 L10.9689685,6.49983923 L9.28121147,6.49983923 L9.28121147,8.1247803 L10.9689685,8.1247803 Z M14.3439553,6.49983923 L12.6561983,6.49983923 L12.6561983,8.1247803 L14.3439553,8.1247803 L14.3439553,6.49983923 Z M12.6561983,4.06248222 L10.9689817,4.06248222 L10.9689817,5.68742329 L12.6561983,5.68742329 L12.6561983,4.06248222 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/运行异常.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>9B89F789-2EB4-44CD-9EE4-4DAB323DB55B</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-291.000000, -294.000000)">
<g id="运行异常" transform="translate(291.000000, 294.000000)">
<rect id="矩形备份-2" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="35" height="35"></rect>
<g id="异常提醒设置" transform="translate(4.000000, 5.000000)" fill="#3BB7FF" fill-rule="nonzero">
<rect id="矩形" opacity="0" x="0" y="0" width="26" height="26"></rect>
<path d="M23.8041134,22.2924511 L3.19619575,22.2924511 C2.16544234,22.2924511 1.61926404,21.092376 2.30459956,20.334063 L2.39865444,20.2299915 C4.67247224,17.714929 5.31325543,14.7434695 6.12564754,10.9806325 C6.23675329,10.4673213 6.35005917,9.94208518 6.46996539,9.40546626 C7.32030944,5.61390122 10.5522769,4.26259719 13.294169,4.26259719 C13.3706229,4.26259719 13.4360763,4.26368128 13.488879,4.26584943 C13.5427818,4.26422331 13.6076852,4.26259719 13.6835891,4.26259719 C16.4254812,4.26259719 19.6579987,5.61390122 20.5083427,9.40546626 C20.706903,10.2906165 20.8708115,11.1437864 21.0292197,11.9687702 C21.6810035,15.3651886 22.1958302,18.0477411 24.4960493,20.1454333 L24.6143055,20.2527571 C25.4118467,20.9801739 24.8898697,22.2924511 23.8041134,22.2924511 Z M5.8143314,19.8153314 L20.9731168,19.8153314 C19.5523932,17.5994746 19.066718,15.0686931 18.5590417,12.4289616 C18.4050337,11.6224071 18.2449755,10.7882086 18.0546656,9.93991703 C17.407282,7.05193154 14.7830961,6.7397169 13.6841391,6.7397169 C13.623636,6.7397169 13.5752335,6.74080098 13.5389316,6.7424271 L13.489429,6.74459525 L13.4399265,6.7424271 C13.4047247,6.74134302 13.3552221,6.7397169 13.2941689,6.7397169 C12.1963121,6.7397169 9.57212609,7.05193154 8.92474255,9.93991703 C8.8059364,10.4700315 8.69428061,10.9887631 8.58427492,11.4961119 C7.92039051,14.5759793 7.32635973,17.328997 5.8143314,19.8153314 Z M8.52762197,23.5223383 L18.873658,23.5223383 L18.873658,26 L8.52762197,26 L8.52762197,23.5223383 Z M13.2776681,6.07788689 C11.57753,6.07788689 10.1942082,4.71465801 10.1942082,3.03867243 C10.1936583,1.36322888 11.57753,0 13.2776681,0 C14.9778062,0 16.3611278,1.36322888 16.3611278,3.03867243 C16.3611278,4.71465799 14.9778062,6.07788689 13.2776681,6.07788689 Z M13.2776681,1.7480768 C12.5554807,1.7480768 11.9675002,2.3269748 11.9675002,3.03921446 C11.9675002,3.75145412 12.5549306,4.33035212 13.2776681,4.33035212 C14.0004055,4.33035212 14.587836,3.75145412 14.587836,3.03921446 C14.587836,2.32643276 13.9998555,1.7480768 13.2776681,1.7480768 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/运行路数.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="35px" height="35px" viewBox="0 0 35 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>A5CE73EC-0B68-4295-B8EB-18B19B4FFA15</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-291.000000, -221.000000)">
<g id="运行路数" transform="translate(291.000000, 221.000000)">
<rect id="矩形备份" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="35" height="35"></rect>
<g id="分析" transform="translate(5.000000, 8.000000)" fill="#3BB7FF" fill-rule="nonzero">
<path d="M22.533308,0 C20.6197047,0 19.0666459,1.56001695 19.0666459,3.48260639 L19.0666457,3.48276429 C19.0658237,4.47443901 19.4844285,5.41823595 20.2150958,6.0720914 L16.7198376,12.3837237 C16.5465044,12.3545401 16.3653715,12.3395061 16.1781708,12.3395061 C15.5134379,12.3395061 14.8920383,12.5499821 14.3867763,12.9054924 L9.75011384,8.77821134 C9.93818065,8.40766664 10.0387131,7.98760008 10.0387131,7.54453824 C10.0387131,6.02168218 8.81151367,4.78800908 7.29484719,4.78800908 C5.77818071,4.78800908 4.55000321,6.02246248 4.55000321,7.54442936 C4.55000321,8.2775579 4.83860244,8.95231996 5.30833645,9.44578557 L3.14167259,12.5286436 L3.14167238,12.5286436 C2.89697194,12.4464142 2.64096647,12.4046173 2.38333914,12.4048342 C1.06860534,12.4048342 0,13.4784386 0,14.7987777 C0,16.1191168 1.0686,17.1927212 2.38333914,17.1927212 C3.69807294,17.1927212 4.76667827,16.1191168 4.76667827,14.7987777 C4.76667827,14.3274164 4.62974497,13.8852401 4.39141248,13.5146972 L6.68807439,10.2364011 L6.6880743,10.2364011 C7.3564368,10.3839147 8.05457258,10.277969 8.65193409,9.93837352 L13.3614025,14.1240138 C13.1733357,14.5308171 13.0650034,14.9800687 13.0650034,15.4523138 C13.0650034,17.171497 14.4586039,18.5714286 16.1702675,18.5714286 C17.8819346,18.5714286 19.2764029,17.171497 19.2764029,15.4523138 C19.2764029,14.4874832 18.8430701,13.6234711 18.1566697,13.0504039 L21.6016715,6.83340574 C21.8980706,6.92095672 22.2083374,6.96429007 22.5333378,6.96429007 C24.4469412,6.96429007 26,5.40428989 26,3.48170044 C26,1.56000199 24.4469341,0 22.5333378,0 L22.533308,0 Z" id="路径"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
UI/图标/交通首页icon/重型罐式.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg width="38px" height="38px" viewBox="0 0 38 38" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>C10C01C0-1D85-4F01-9CBF-A7DF53A52BEE</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="交通首页" transform="translate(-1181.000000, -890.000000)">
<g id="重型罐式" transform="translate(1181.000000, 890.000000)">
<rect id="矩形备份-5" fill="#B3E5FC" opacity="0.209999993" x="0" y="0" width="38" height="38"></rect>
<g id="危险品车" transform="translate(6.000000, 7.000000)" fill="#3BB7FF" fill-rule="nonzero">
<path d="M27.0085306,4.17837474 L25.5101555,1.12346042 C25.2661612,0.622703374 24.6874568,0.350101902 24.1181369,0.462698162 L15.7847938,2.11608535 L15.7879219,2.12497453 C13.74838,2.62573158 12.2468767,4.38282585 12.25,6.47178277 C12.2562611,8.93704826 14.4396971,10.9697071 17.0423028,10.9371134 C17.8868984,10.9252612 18.6783157,10.7059948 19.3633766,10.3267231 L19.3696328,10.3445015 L26.5831047,5.65694142 C27.0867339,5.32804182 27.2650374,4.70283627 27.0085306,4.17837474 L27.0085306,4.17837474 Z" id="路径"></path>
<path d="M9.42535215,13.4173193 L9.42535215,6.95989825 C9.42535215,6.25689821 8.88234023,5.6875 8.2119177,5.6875 L6.90747566,5.6875 C5.98526548,5.6875 5.09642474,6.05649549 4.41993503,6.71814258 L0.770530917,10.2967626 L0.770530878,10.2967627 C0.279317443,10.777303 0.000285157096,11.4500295 0,12.1544641 L0,20.1610301 C0,20.8640301 0.543011918,21.4334283 1.21343445,21.4334283 L1.82925244,21.4334283 C1.82925244,19.1812834 3.57053088,17.34903 5.72134345,17.34903 C7.87215601,17.34903 9.61040087,19.1749214 9.61040087,21.4302473 C9.61040087,21.4334283 17.7555796,21.4366093 17.7555796,21.4334283 C17.7555796,19.1812834 19.4968581,17.34903 21.6446371,17.34903 C23.792416,17.34903 25.5336945,19.1844644 25.5336945,21.4366093 C25.5336945,21.4397903 26.7865655,21.4334283 26.7865655,21.4334283 C27.4569881,21.4334283 28,20.8640301 28,20.1610301 L28,15.9621159 C28,15.2591158 27.4569881,14.6897176 26.7865655,14.6897176 L10.6387866,14.6897176 C9.96836403,14.6897176 9.42535211,14.1203194 9.42535211,13.4173194 L9.42535215,13.4173193 Z" id="路径"></path>
<path d="M2.625,20.6895039 L2.625,20.6895043 C2.625,22.0691103 3.72720765,23.1875 5.08685209,23.1875 C6.44649653,23.1875 7.54870419,22.0691103 7.54870419,20.6895043 L7.54870419,20.6895043 C7.54870419,19.3098982 6.44649653,18.1915085 5.08685209,18.1915085 C3.72720765,18.1915085 2.625,19.3098982 2.625,20.6895043 L2.625,20.6895039 Z M18.5814488,20.6895039 L18.5814488,20.6895043 C18.5814488,22.0691103 19.6836564,23.1875 21.0433009,23.1875 C22.4029453,23.1875 23.5051529,22.0691103 23.5051529,20.6895043 L23.5051529,20.6895043 C23.5051529,19.3098982 22.4029453,18.1915085 21.0433009,18.1915085 C19.6836564,18.1915085 18.5814488,19.3098982 18.5814488,20.6895043 L18.5814488,20.6895039 Z M27.1249937,7.80169619 C27.1280266,6.81174973 26.0399488,6.22271617 25.2314887,6.77474239 L20.0859139,10.2811883 C18.3079096,11.3914086 16.9037421,11.3482334 15.9493945,11.1878682 C13.4358739,10.7653677 12.1532794,9.30049364 11.5028642,7.7955283 C10.6852861,5.8989019 10.8737242,8.79781055 10.8737242,8.79781055 L10.8737242,10.5988346 C10.8737242,11.2803866 11.4177631,11.8324128 12.0894536,11.8324128 L25.9001399,11.8324128 C26.5718304,11.8324128 27.11283,11.2834705 27.1158693,10.6019186 L27.1249937,7.80169619 L27.1249937,7.80169619 Z" id="形状"></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file \ No newline at end of file
dist.zip 0 → 100644
No preview for this file type
public/index.html
...@@ -18,4 +18,117 @@ ...@@ -18,4 +18,117 @@
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>
<script>
function connectCamera(szDeviceIp, szUser, szPass, camType) {
var i = 0;
camType = 'ball'
switch (camType) {
case "0":
//console.log("");
break;
case "-1":
// console.log("未找到目标相机");
break;
case "rifle":
//console.log("枪机无云台操作");
break;
case "ball":
i = VionVideo.PtzRegistDev(szDeviceIp, szUser, szPass);
if (i == 1) {
console.log('云台连接成功')
return true;
} else {
//showMessagerInfo("连接云台失败");
return false;
}
break;
default:
i = VionVideo.PtzRegistDev(szDeviceIp, szUser, szPass);
if (i == 1) {
return true;
} else {
//showMessagerInfo("连接云台失败");
return false;
}
break;
}
}
</script>
<script language="javascript" event="VideoCoreEvent(EventType,nParam1,nParam2,szParam3)" for="VionVideo">
if (EventType == 1) {
if (nParam2 != 0) {
//alert("播放失败！");
} else {
}
}
//播放窗口改变事件调用云台控制事件
else if (EventType == 3) {
var curVideoIndex = VionVideo.GetCurSelWnd();
console.log('当前窗口' + curVideoIndex)
var videoInfo = JSON.parse(localStorage.getItem('video' + curVideoIndex));
console.log('相机信息' + videoInfo);
ve.videovid = videoInfo;
//根据树信息返回地址IP 用户名 密码
if (videoInfo) {
var szDeviceIp = videoInfo.vchan_prop.ip,
szUser = videoInfo.vchan_prop.user_name,
szPass = videoInfo.vchan_prop.password;
var camType = '';
if (videoInfo.vchan_prop.is_demo) {
camType = 'ball'
}
var state = connectCamera(szDeviceIp, szUser, szPass, camType);
console.log(state);
}
} else if (EventType == 4) {
//openManualCapture(szParam3);
} else if (EventType == 2) {
//setCamIcon(szParam3, 1);
} else if (EventType == 12) {
jianPanKongzhi(nParam1);
} else if (EventType == 10) {
videoEventHandle.Screenshot(szParam3);
//alert("wwww");
}
//ocx播放窗格切换
else if (EventType == 8) {
//根据拼接定义获取当前窗格数
var tmpArr = szParam3.split(':');
if (tmpArr.length > 0) {
var windowSum = tmpArr[0];
//alert("切换窗格数：" + windowSum);
var ownDefine = tmpArr.length > 1 ? tmpArr[1] : "";
//需要使用子码流播放
if (windowSum >= subNum) {
//alert("当前应使用子码流播放");
//从主码流切换至子码流
if (realVideoNum < subNum) {
//alert("从主码流切换至子码流");
realVideoNum = windowSum;
reSetHasPlayVideos(windowSum, ownDefine, 'SUB');
} else {
realVideoNum = windowSum;
}
}
//需要使用主码流播放
else {
//alert("当前应使用主码流播放");
//从子码流切换至主码流
if (realVideoNum >= subNum) {
//alert("从子码流切换至主码流");
realVideoNum = windowSum;
reSetHasPlayVideos(windowSum, ownDefine, 'MAIN');
} else {
realVideoNum = windowSum;
}
}
}
}
</script>
</html> </html>
public/js/baseconfig.json 0 → 100644
{
"development":"http://192.168.9.133:20080", //测试环境
"pre":"http://192.168.9.133:20080", //预上线环境
"production":"http://192.168.9.133:20080" //生产环境
}
src/App.vue
...@@ -10,6 +10,16 @@ export default { ...@@ -10,6 +10,16 @@ export default {
} }
}, },
created(){
let menus = JSON.parse(localStorage.getItem('menu'))
if(menus) {
this.$store.dispatch('GetMenuRole',menus).then(res => {})
}
},
mounted(){
}
} }
</script> </script>
<style lang="scss"> <style lang="scss">
......
src/api/baseUrl.js
let baseUrl = "/api"; // 本地代理 let baseUrl = "/api"; // 本地代理
import axios from "axios";
console.log(process.env.NODE_ENV); console.log(process.env.NODE_ENV);
switch (process.env.NODE_ENV) { switch (process.env.NODE_ENV) {
case "development": case "development":
baseUrl = "http://192.168.9.133:20080"; // 测试环境url baseUrl = "http://vion-panda.51vip.biz:52510"; // 测试环境url
// baseUrl = "http://192.168.9.61:8086"; // baseUrl = "http://192.168.9.61:8086";
break; break;
case "pre": case "pre":
......
src/api/device/index.js
...@@ -2,7 +2,6 @@ import api from "../index"; ...@@ -2,7 +2,6 @@ import api from "../index";
import baseUrl from "../baseUrl"; import baseUrl from "../baseUrl";
export default { export default {
getDev(params) { getDev(params) {
//重点车辆
return api.get(`${baseUrl}/api/v1/devconf_fx/devs`); return api.get(`${baseUrl}/api/v1/devconf_fx/devs`);
}, },
getGlobalWs(uid, clientid) { getGlobalWs(uid, clientid) {
...@@ -10,5 +9,29 @@ export default { ...@@ -10,5 +9,29 @@ export default {
}, },
getConfParam(params) { getConfParam(params) {
return api.get(`${baseUrl}/api/v1/devconf_fx/conf_param/types`, params); //获取类型 return api.get(`${baseUrl}/api/v1/devconf_fx/conf_param/types`, params); //获取类型
},
getDevtree(devuid, devname, params) {
let url = "";
switch (devname) {
case "外部设备":
url = "/vchan_struct?vchan_type=extern";
break;
case "内部设备":
url = "/vchan_struct?vchan_type=camera";
break;
case "短视频":
url = "/vchans?vchan_type=vfile";
break;
}
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${devuid}${url}`, params);
},
getFxStream(devuid, refid) {
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/${devuid}/vchans/${refid}`); //获取分析流
},
sipSet(devid, userid) {
return api.get(`${baseUrl}/devconf_fx/devs/${devid}/${userid}/sip_server`)
},
getStore(params) {
return api.get(`${baseUrl}/api/v1/devconf_fx/store_confs`, params)
} }
}; };
src/api/index.js
...@@ -33,6 +33,14 @@ export default { ...@@ -33,6 +33,14 @@ export default {
} }
return instance.put(url, params, options); return instance.put(url, params, options);
}, },
post2(url, params, headers) {
let options = {};
if (headers) {
options.headers = headers;
}
return instance.post(url, params, options);
},
delete(url, params, headers) { delete(url, params, headers) {
let options = {}; let options = {};
......
src/api/show/index.js
...@@ -35,5 +35,9 @@ export default { ...@@ -35,5 +35,9 @@ export default {
getBehaviorHour(params) { getBehaviorHour(params) {
//今日事件趋势 //今日事件趋势
return api.get(`${baseUrl}/api/v1/datahandle/statistics/behavior/hour`, params); return api.get(`${baseUrl}/api/v1/datahandle/statistics/behavior/hour`, params);
},
getDevList(devid) {
// 获取设备信息
return api.get(`${baseUrl}/api/v1/devconf_fx/devs/9cb6e39adc5176b81879f6c22f1d962/vchan_struct?typea=1&s=1578967233185&limit=1000000`);
} }
}; }
\ No newline at end of file \ No newline at end of file
src/api/task/index.js
...@@ -6,9 +6,15 @@ export default { ...@@ -6,9 +6,15 @@ export default {
getTask(params, id) { getTask(params, id) {
return api.get(urls.getTask, params); return api.get(urls.getTask, params);
}, },
addTask(params, headers) {
return api.post2(urls.getTask, params, headers)
},
editTask(params, taskid) { editTask(params, taskid) {
return api.post(urls.editTask(taskid), params); return api.post(urls.editTask(taskid), params);
}, },
editSubTask(taskid, params) {
return api.post2(urls.setSubTask(taskid), params)
},
editRoi(taskid, subtaskid, params) { editRoi(taskid, subtaskid, params) {
return api.post(urls.editroi(taskid, subtaskid), params); return api.post(urls.editroi(taskid, subtaskid), params);
}, },
...@@ -35,5 +41,11 @@ export default { ...@@ -35,5 +41,11 @@ export default {
}, },
deleteTask(taskid) { deleteTask(taskid) {
return api.delete(urls.deleteTask(taskid)); return api.delete(urls.deleteTask(taskid));
},
deleteSubTask(taskid, subtaskid) {
return api.delete(urls.deleteSubTask(taskid, subtaskid));
},
setTaskStatus(taskid, params) {
return api.post(urls.changeTask(taskid), params);
} }
}; };
src/api/task/urls.js
...@@ -3,12 +3,12 @@ function gitTimer() { ...@@ -3,12 +3,12 @@ function gitTimer() {
return new Date().getTime(); return new Date().getTime();
} }
export default { export default {
getTask: `${baseUrl}/api/v1/devconf_fx/tasks?s=${gitTimer()}`, getTask: `${baseUrl}/api/v1/devconf_fx/tasks`,
editTask: taskid => { editTask: taskid => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}`; return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}`;
}, },
editroi: (taskid, subtaskid) => { editroi: (taskid, subtaskid) => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtasks/${subtaskid}?s=${gitTimer()}`; // ROI设置 return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtasks/${subtaskid}}`; // ROI设置
}, },
alternatestate: (taskid, subtaskid) => { alternatestate: (taskid, subtaskid) => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}/suspend_alternate_task?s=${gitTimer()}`; return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}/suspend_alternate_task?s=${gitTimer()}`;
...@@ -17,7 +17,10 @@ export default { ...@@ -17,7 +17,10 @@ export default {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}/suspend_algorithm?s=${gitTimer()}`; return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}/suspend_algorithm?s=${gitTimer()}`;
}, },
getSubTask: id => { getSubTask: id => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtasks?s=${gitTimer()}`; return `${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtasks`;
},
setSubTask: id => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${id}/subtask`;
}, },
getstream: (devid, vrefid) => { getstream: (devid, vrefid) => {
return `${baseUrl}/api/v1/stream/devs/${devid}/vchans/${vrefid}/live/is_sending?s=${gitTimer()}`; return `${baseUrl}/api/v1/stream/devs/${devid}/vchans/${vrefid}/live/is_sending?s=${gitTimer()}`;
...@@ -35,7 +38,7 @@ export default { ...@@ -35,7 +38,7 @@ export default {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}?s=${gitTimer()}`; // 删除子任务 return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}?s=${gitTimer()}`; // 删除子任务
}, },
deleteSubTask: (taskid, subtaskid) => { deleteSubTask: (taskid, subtaskid) => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}?s=${gitTimer()}`; // 删除子任务 return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/subtask/${subtaskid}`; // 删除子任务
}, },
changeTask: taskid => { changeTask: taskid => {
return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/start_or_stop?s=${gitTimer()}`; // 切换任务 return `${baseUrl}/api/v1/devconf_fx/tasks/${taskid}/start_or_stop?s=${gitTimer()}`; // 切换任务
......
src/assets/css/public.css
...@@ -158,3 +158,43 @@ html,body{ ...@@ -158,3 +158,43 @@ html,body{
right: .5em; right: .5em;
top:auto!important; top:auto!important;
} }
.nav-tag-box {
line-height: 40px;
}
.nav-tag-box .el-tag{
border-radius: 0;
border: 0;
border-right: 1px solid #ccc;
padding-right: 10px;
padding-left: 10px;
line-height: 25px;
background: none;
cursor: pointer;
color: #888888;
}
.nav-tag-box .el-tag .el-icon-close{
color: #888888;
cursor: pointer;
}
.nav-tag-box .el-tag .el-icon-close:hover{
background: none;
cursor: pointer;
color: #3BB7FF;
}
.alarm-event-box .el-table__body tr{
background: #fff!important;
}
.alarm-event-box .el-table .el-table__header th{
background:rgba(248,249,250,1);
box-shadow:0px 1px 0px 0px rgba(0,0,0,0.09);
}
.img-box img{
height: 20vh;
width:20vw;
height: 100%;
width: 100%;
}
.ol-popup img{
height :100%;
width :100%;
}
\ No newline at end of file \ No newline at end of file
src/assets/js/vporto.js
import Vue from "vue"; import Vue from "vue";
Vue.prototype.dev_unid = "2cb6e39adc5176b81879f6c22f1d9e1c";
/** /**
* 图片上传限制 * @param {unid} 设备id
*/ */
Vue.prototype.uploadImgCondition = function(file) { Vue.prototype.setDevunid = function(devuid) {
const isJPG = file.type === "image/jpeg"; Vue.prototype.dev_unid = devuid;
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error("上传头像图片只能是 JPG 格式!");
}
if (!isLt2M) {
this.$message.error("上传头像图片大小不能超过 2MB!");
}
return isJPG && isLt2M;
}; };
/** /**
* tar文件上传设置 * tar文件上传设置
*/ */
...@@ -34,3 +26,252 @@ Vue.prototype.uploadFile = function(file, type, size) { ...@@ -34,3 +26,252 @@ Vue.prototype.uploadFile = function(file, type, size) {
return isType && isSize; return isType && isSize;
}; };
Vue.prototype.globalWs = null; Vue.prototype.globalWs = null;
Vue.prototype.getCode = function(codeName, code) {
var name = window.localStorage.getItem(codeName + "-" + code);
name = name ? name : "";
return name;
};
/**
* @param {src} 图片路径
* 图片放大
*/
Vue.prototype.zoomImg = function(data) {
store.commit("setImgsrc", data);
};
Vue.filter("sexfn", function(value) {
if (!value) return;
var str = "";
if (value == 1) str = "男";
if (value == 2) str = "女";
return str;
});
Vue.filter("dbnamefn", function(value) {
let dbData = store.state.initinfo.facedbdata,
dbname = "";
dbData.forEach(ele => {
if (ele.code == value) {
dbname = ele.name;
}
});
return dbname;
});
Vue.filter("filterDeployType", function(value) {
let dbData = store.state.alarmtype,
dbname = "";
dbData.forEach(ele => {
if (ele.type == value) {
dbname = ele.name;
}
});
return dbname;
});
/**
* @param {provenceid} 省份id
* @param {cityid} 城市id
*/
Vue.prototype.showCity = function(provenceid, cityid) {
this.cData = this.$store.state.initinfo.province;
var province = provenceid;
var provinceNmae = "";
var cityName = "";
var curProvince = "";
var city = cityid;
if (province) {
this.cData.forEach(function(ele) {
if (ele.code == province) {
if (ele.cities) curProvince = ele.cities;
provinceNmae = ele.name;
}
}, this);
if (city) {
if (curProvince)
curProvince.list_data.forEach(function(ele) {
if (ele.code == city) {
cityName = ele.name;
}
});
}
} else {
provinceNmae = "--";
cityName = "--";
}
return provinceNmae + "-" + cityName;
};
/**
* @param {obj}
* 格式化时间
*/
Vue.prototype.timeForm = function(obj) {
var nowY = obj.getFullYear();
var nowM =
obj.getMonth() + 1 < 10 ? "0" + (obj.getMonth() + 1) : obj.getMonth() + 1;
var nowD = obj.getDate() < 10 ? "0" + obj.getDate() : obj.getDate();
var nowH = obj.getHours() < 10 ? "0" + obj.getHours() : obj.getHours();
var nowMi = obj.getMinutes() < 10 ? "0" + obj.getMinutes() : obj.getMinutes();
var nowS = obj.getSeconds() < 10 ? "0" + obj.getSeconds() : obj.getSeconds();
var timeNow =
nowY + "-" + nowM + "-" + nowD + " " + nowH + ":" + nowMi + ":" + nowS;
return timeNow;
};
/**
* @param {obj}
* UTC时间处理
*/
Vue.prototype.setUtcTime = function(obj) {
if (obj && obj != "") {
let num = new Date(obj).getTime();
let offset = Math.abs(new Date().getTimezoneOffset());
let time;
if (isNaN(num)) {
let ary = obj.split(":");
let h = parseInt(ary[0]) - offset / 60;
if (h < 0) {
h += 24;
}
if (h < 10) {
h = "0" + h;
}
time = h + ":" + ary[1] + ":" + ary[2];
} else {
time = this.timeForm(new Date(new Date(obj).getTime() - offset * 60000));
}
return time;
}
};
/**IE
* 检查浏览器
*/
function checkIE() {
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
var isIE =
userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
var isIE11 =
userAgent.indexOf("Trident") > -1 && userAgent.indexOf("rv:11.0") > -1;
if (isIE || isEdge || isIE11) {
return true;
} else {
return false;
}
}
Vue.prototype.showLocalTime = function(obj) {
if (obj == undefined) return;
let dt = "",
ndt = "";
if (checkIE()) {
dt = obj.replace(/-/g, "/");
ndt = String(dt).split(".")[0];
} else {
ndt = obj;
}
let num = new Date(ndt).getTime();
let offset = Math.abs(new Date().getTimezoneOffset());
let time;
if (isNaN(num)) {
let ary = obj.split(":");
let h = Number(ary[0]) + offset / 60;
if (h >= 24) {
h -= 24;
}
if (h < 10) {
h = "0" + h;
}
time = h + ":" + ary[1] + ":" + ary[2];
} else {
time = this.timeForm(new Date(new Date(ndt).getTime() + offset * 60000));
}
return time;
};
/**
* 本地存储相机信息
*/
Vue.prototype.setCameralocalStor = function(key, val) {
if (window.localStorage) {
localStorage[key] = val;
} else {
alert("浏览器不支持本地存储");
}
};
/**
* @param {key}
* 获取本地存储相机信息
*/
Vue.prototype.getCameralocalStor = function(key) {
var val = "";
if (window.localStorage) {
val = localStorage[key];
} else {
alert("浏览器不支持本地存储");
}
return val;
};
/**
* 图片上传限制
*/
Vue.prototype.uploadImgCondition = function(file) {
const isJPG = file.type === "image/jpeg";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error("上传头像图片只能是 JPG 格式!");
}
if (!isLt2M) {
this.$message.error("上传头像图片大小不能超过 2MB!");
}
return isJPG && isLt2M;
};
/**
* base64图片
*/
Vue.prototype.base64Img = function(file) {
// eslint-disable-next-line no-redeclare
var file = file.file;
return new Promise((resolve, reject) => {
var srcs = "";
var reader = new FileReader();
if (file) {
reader.readAsDataURL(file);
}
reader.onloadend = function(evt) {
srcs = reader.result.split(",")[1];
let data = {
pic_base64: srcs,
format: file.type.split("/")[1],
ofilename: file.name,
t_format: "jpg"
};
data.src = evt.target.result;
resolve(data);
};
});
};
/**
* code操作
*/
var codeNation = 1004; //民族
var codeCulture = 1005; //文化程度
var codeBlood = 1006; //血型
var codeRelationTOhead = 1009; //与户主关系
var codePersonType = 1012; //人员类别
var profession = 1013; //职业
var faith = 1020; //宗教信仰
var army = 1021; //服兵役情况
var personType = 1067; //关注人员类型
var marriage = 1007; //婚姻状况
// 获取code编码
Vue.prototype.getCode = (codeName, code) => {
var name = localStorage.getItem(codeName + "-" + code);
name = name ? name : "";
return name;
};
src/main.js
...@@ -24,7 +24,6 @@ Vue.use(ElementUI, { size: "small", zIndex: 3000 }); ...@@ -24,7 +24,6 @@ Vue.use(ElementUI, { size: "small", zIndex: 3000 });
Vue.use(resetCss); Vue.use(resetCss);
Vue.config.productionTip = false; Vue.config.productionTip = false;
new Vue({ new Vue({
router, router,
store, store,
......
src/router/index.js
...@@ -8,6 +8,7 @@ export const constantRouterMap = [ ...@@ -8,6 +8,7 @@ export const constantRouterMap = [
path: "/", path: "/",
name: "首页", name: "首页",
component: resolve => require(["../views/Layout/index.vue"], resolve), component: resolve => require(["../views/Layout/index.vue"], resolve),
redirect: "/trficcshow",
children: [ children: [
{ {
path: "/trficcshow", path: "/trficcshow",
...@@ -42,31 +43,34 @@ export const constantRouterMap = [ ...@@ -42,31 +43,34 @@ export const constantRouterMap = [
]; ];
export const asyncRouterMap = [ export const asyncRouterMap = [
{ {
path: "/", path: "/video_task",
name: "tanskmanage", name: "任务管理",
component: resolve => require(["../views/Layout/index.vue"], resolve), component: resolve => require(["../views/Layout/index.vue"], resolve),
meta: { meta: {
icon: "el-icon-location" icon: "el-icon-location"
}, },
children: [ children: [
{ {
path: "/task/sceneSet", path: "/video_task/config",
name: "场景设置", name: "场景设置",
meta: { meta: {
icon: "el-icon-location" icon: "el-icon-location"
}, },
component: resolve => require(["../views/sceneManage/index.vue"], resolve) component: resolve =>
require(["../views/sceneManage/index.vue"], resolve)
}, },
{ {
path: "/task/taskSet", path: "/video_task/manage",
name: "任务设置", name: "任务设置",
meta: { meta: {
icon: "el-icon-location" icon: "el-icon-location"
}, },
component: resolve => require(["../views/taskManage/index.vue"], resolve) component: resolve =>
require(["../views/taskManage/index.vue"], resolve)
} }
] ]
},{ },
{
path: "/search", path: "/search",
name: "智能检索", name: "智能检索",
component: resolve => require(["../views/Layout/index.vue"], resolve), component: resolve => require(["../views/Layout/index.vue"], resolve),
...@@ -97,7 +101,8 @@ export const asyncRouterMap = [ ...@@ -97,7 +101,8 @@ export const asyncRouterMap = [
meta: { meta: {
icon: "el-icon-location" icon: "el-icon-location"
}, },
component: resolve => require(["../views/search/pedestrian.vue"], resolve) component: resolve =>
require(["../views/search/pedestrian.vue"], resolve)
}, },
{ {
path: "/search/event", path: "/search/event",
...@@ -131,7 +136,8 @@ export const asyncRouterMap = [ ...@@ -131,7 +136,8 @@ export const asyncRouterMap = [
component: resolve => require(["../views/search/publicFlow.vue"], resolve), component: resolve => require(["../views/search/publicFlow.vue"], resolve),
} }
] ]
},{ },
{
path: "/resource", path: "/resource",
name: "资源管理", name: "资源管理",
component: resolve => require(["../views/Layout/index.vue"], resolve), component: resolve => require(["../views/Layout/index.vue"], resolve),
......
src/views/Home.vue
<<<<<<< HEAD
<template> <template>
<div class="home" @keyup.esc="KeyUpF11"> <div>
<el-container class="home-box">
<el-header class="headers">
<img class="logoImg" src="../assets/img/home/logo.png" alt="">
<div class="headRight">
<span>2019-11-15 16:50 星期一</span>
<img src="../assets/img/home/user.png" alt="">
<span class="exit">退出<i class="el-icon-arrow-down"></i></span>
</div>
</el-header>
<el-container style="min-height:calc(100vh - 64px);">
<el-aside :width="menuwidth">
<el-menu default-active="/trficcshow" class="el-menu-vertical-demo" :collapse="isCollapse" @select="handleSelect">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">首页</span>
</template>
<el-menu-item index="/trficcshow"> <i class="el-icon-location"></i>交通展示</el-menu-item>
<el-menu-item index="/behaviorshow"> <i class="el-icon-location"></i>综治展示</el-menu-item>
</el-submenu>
<el-submenu index="2">
<template slot="title">
<i class="el-icon-location"></i>
<span slot="title">任务管理</span>
</template>
<el-menu-item index="/task/sceneSet"> <i class="el-icon-location"></i>场景配置</el-menu-item>
<el-menu-item index="/task/taskSet"> <i class="el-icon-location"></i>任务配置</el-menu-item>
</el-submenu>
<el-submenu index="3">
<template slot="title">
<i class="el-icon-document"></i>
<span slot="title">智能检索</span>
</template>
<el-menu-item index="/search/vehicleSearch"> <i class="el-icon-location"></i>过车记录检索</el-menu-item>
<el-menu-item index="/search/xcycle"> <i class="el-icon-location"></i>非机动车检索</el-menu-item>
<el-menu-item index="/search/pedestrian"> <i class="el-icon-location"></i>行人检索</el-menu-item>
<el-menu-item index="/search/event"> <i class="el-icon-location"></i>事件查询</el-menu-item>
<el-menu-item index="/search/illegal"> <i class="el-icon-location"></i>违法记录查询</el-menu-item>
<el-menu-item index="/search/publicFlow"> <i class="el-icon-location"></i>公共客流</el-menu-item>
<el-menu-item index="/search/traficflow"> <i class="el-icon-location"></i>交通流量</el-menu-item>
</el-submenu>
<el-submenu index="4">
<template slot="title">
<i class="el-icon-document"></i>
<span slot="title">资源管理</span>
</template>
<el-menu-item index="/resource/videoEquipment"> <i class="el-icon-location"></i>视频设备</el-menu-item>
</el-submenu>
</el-menu>
</el-aside>
<el-main>
<div class="nav"></div>
<router-view></router-view>
</el-main>
</el-container>
</el-container>
</div> </div>
</template> </template>
<script> <script>
// import HelloWorld from "@/components/HelloWorld.vue";
export default { export default {
name: "home", data() {
data(){ return {
return{
isCollapse: false,
conHeight:0,
menuwidth:"254px",
full:false
};
},
created(){
this.$router.push('/trficcshow')
},
mounted(){
this.conHeight=window.innerHeight-65;
console.log(this.conHeight)
document.addEventListener("keydown", (event)=>{
var e = event || window.event || arguments.callee.caller.arguments[0];
if(e && e.keyCode==122 ){ // 按 Esc
if(this.full) {
this.menuwidth = "254px";
this.full = false
return
}
this.menuwidth = 0
this.full = true
}
});
},
components: {
// HelloWorld
},
methods:{
handleSelect(key, keyPath) {
this.$router.push(key)
console.log(key, keyPath);
} }
},
created(){
alert(1)
} }
}; }
</script> </script>
<style lang="stylus" scoped>
</style>
\ No newline at end of file \ No newline at end of file
<style>
</style>>
\ No newline at end of file \ No newline at end of file
src/views/Layout/index.vue
...@@ -11,10 +11,22 @@ ...@@ -11,10 +11,22 @@
</el-header> </el-header>
<el-container style="min-height:calc(100vh - 64px);"> <el-container style="min-height:calc(100vh - 64px);">
<el-aside :width="menuwidth"> <el-aside :width="menuwidth">
<menus></menus> <menus @setTopBar="setTopBar" ref="leftmenu"></menus>
</el-aside> </el-aside>
<el-main> <el-main>
<div class="nav"></div> <div class="nav">
<div class="nav-tag-box">
<el-tag
v-for="(tag,index) in topbarArr" :key="index"
closable
@close="closetag(tag,index)"
@click="toPath(tag)"
>
<i :class="tag.icon"></i>
{{tag.name}}
</el-tag>
</div>
</div>
<router-view></router-view> <router-view></router-view>
</el-main> </el-main>
</el-container> </el-container>
...@@ -26,18 +38,51 @@ ...@@ -26,18 +38,51 @@
// import HelloWorld from "@/components/HelloWorld.vue"; // import HelloWorld from "@/components/HelloWorld.vue";
import menus from './menu' import menus from './menu'
export default { export default {
name: "home", name: "x",
data(){ data(){
return{ return{
isCollapse: false, isCollapse: false,
conHeight:0, conHeight:0,
menuwidth:"254px", menuwidth:"254px",
full:false, full:false,
topbarArr:[]
}; };
}, },
methods:{
setTopBar(data){
if(this.topbarArr.length < 1) {
this.topbarArr.push(data)
}
let hasBar = false;
for(let i = 0; i < this.topbarArr.length; i++) {
if(this.topbarArr[i].path == data.path){
hasBar = true
}
}
if(!hasBar) {
this.topbarArr.push(data)
}
},
toPath(data){
this.$refs.leftmenu.handleSelect(data.path)
},
closetag(data,index){
this.topbarArr.splice(index,1)
}
},
created(){ created(){
this.$api.device.getDev().then(m => {
if(m.length < 1) {
// this.infoFun('未发现运维服务，请联系相关人员')
this.$message({
message: '未发现运维服务，请联系相关人员',
type: 'error'
});
this.setDevunid('9cb6e39adc5176b81879f6c22f1d963')
return
}
this.setDevunid(m[0].dev_unid)
})
}, },
components:{ components:{
menus menus
......
src/views/Layout/menu.vue
...@@ -39,14 +39,15 @@ export default { ...@@ -39,14 +39,15 @@ export default {
return { return {
full: false, full: false,
isCollapse: false, isCollapse: false,
activemenu: "/search/vehicleSearch" activemenu: "/",
topbar:[]
}; };
}, },
methods: { methods: {
handleSelect(key, keyPath) { handleSelect(key, keyPath) {
this.$router.push(key); this.$router.push(key);
localStorage.setItem("curmenu", key); localStorage.setItem("curmenu", key);
console.log(key, keyPath); this.activemenu = key
} }
}, },
computed: { computed: {
...@@ -54,17 +55,23 @@ export default { ...@@ -54,17 +55,23 @@ export default {
}, },
created() { created() {
let activemenu = localStorage.getItem("curmenu"); let activemenu = localStorage.getItem("curmenu");
let menus = JSON.parse(localStorage.getItem('menu'))
if(menus) {
this.$store.dispatch('GetMenuRole',menus).then(res => {
if (activemenu) { if (activemenu) {
this.activemenu = activemenu; this.activemenu = activemenu;
this.$router.push(activemenu);
} else { } else {
this.$router.push("/"); this.$router.push('/');
this.activemenu = '/';
} }
}) },
watch:{
$route(t, f){
let obj = {
name:f.name,
path:f.path,
icon:f.meta.icon
}
this.$emit("setTopBar",obj)
} }
} }
}; };
</script> </script>
......
src/views/Show.vue
...@@ -166,7 +166,6 @@ export default { ...@@ -166,7 +166,6 @@ export default {
} else if (data.type == "response") { } else if (data.type == "response") {
console.log("请求任务推送成功"); console.log("请求任务推送成功");
} else if (data.event_cate) { } else if (data.event_cate) {
debugger
if (data.event_cate != "flow") { if (data.event_cate != "flow") {
try { try {
data.picsEmpty = data.pics.length == 0 ? true : false; data.picsEmpty = data.pics.length == 0 ? true : false;
......
src/views/behaviorShow/alarmEvent.vue
...@@ -2,12 +2,30 @@ ...@@ -2,12 +2,30 @@
<div> <div>
<el-table :data="tableData"> <el-table :data="tableData">
<el-table-column type="index" align="center" label="#"></el-table-column> <el-table-column type="index" align="center" label="#"></el-table-column>
<el-table-column align="center" prop="eventType" label="事件地点" :formatter="eventFormatter"></el-table-column> <el-table-column
<el-table-column align="center" prop="locationName" label="抓拍类型"></el-table-column> align="center"
<el-table-column align="center" prop="startDt" label="发生时间"></el-table-column> prop="eventType"
label="事件地点"
:formatter="eventFormatter"
></el-table-column>
<el-table-column
align="center"
prop="locationName"
label="抓拍类型"
></el-table-column>
<el-table-column
align="center"
prop="startDt"
label="发生时间"
></el-table-column>
<el-table-column align="center" prop="operation" label="操作"> <el-table-column align="center" prop="operation" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tooltip content="详情及审核" placement="bottom" effect="light" :visible-arrow="false"> <el-tooltip
content="详情及审核"
placement="bottom"
effect="light"
:visible-arrow="false"
>
<img <img
src="../../assets/img/home/look.png" src="../../assets/img/home/look.png"
alt alt
...@@ -16,7 +34,12 @@ ...@@ -16,7 +34,12 @@
/> />
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow="false"> <el-tooltip
content="删除"
placement="bottom"
effect="light"
:visible-arrow="false"
>
<img <img
src="../../assets/img/home/del.png" src="../../assets/img/home/del.png"
alt alt
...@@ -34,104 +57,104 @@ ...@@ -34,104 +57,104 @@
export default { export default {
data() { data() {
return { return {
tableData:[] tableData: []
} };
}, },
methods:{ methods: {
delFun(index, rows) { delFun(index, rows) {
rows.splice(index, 1); rows.splice(index, 1);
}, },
eventFormatter(row, column, cellValue, index){ eventFormatter(row, column, cellValue, index) {
let value='' let value = "";
this.eventTypeList.forEach(item=>{ this.eventTypeList.forEach(item => {
if(item.code==cellValue){ if (item.code == cellValue) {
value=item.name; value = item.name;
} }
}) });
return value; return value;
}
}, },
}, beforeMount() {
beforeMount(){ try {
let that = this; let that = this;
this.connect_id = new Date().getTime() this.connect_id = new Date().getTime();
// this.cws = new WebSocket('ws://'+ this.API.IP +'/websocket/v1/integrated/connects/' + this.connect_id) // this.cws = new WebSocket('ws://'+ this.API.IP +'/websocket/v1/integrated/connects/' + this.connect_id)
this.cws = new WebSocket(`ws://${this.$api.wsIP}/websocket/api/v1/integrated/connects/${this.connect_id}`) this.cws = new WebSocket(
`ws://${this.$api.wsIP}/websocket/api/v1/integrated/connects/${this.connect_id}`
);
this.cws.onopen = () =>{ this.cws.onopen = () => {
console.log('ws事件推送服务连接成功') console.log("ws事件推送服务连接成功");
} };
//事件断开 //事件断开
this.cws.onclose = () =>{ this.cws.onclose = () => {
window.clearTimeout(that.keepAlive) window.clearTimeout(that.keepAlive);
console.log('ws事件推送服务断开') console.log("ws事件推送服务断开");
that.connect_id = new Date().getTime() that.connect_id = new Date().getTime();
that.cws = new WebSocket(`ws://${this.$api.wsIP}/websocket/api/v1/integrated/connects/${this.connect_id}`) that.cws = new WebSocket(
`ws://${this.$api.wsIP}/websocket/api/v1/integrated/connects/${this.connect_id}`
);
that.keepAlive = setInterval(() => { that.keepAlive = setInterval(() => {
let message = { let message = {
type: 'request', type: "request",
id: new Date().getTime(), id: new Date().getTime(),
mts: new Date().getTime(), mts: new Date().getTime(),
command:'get /websocket/v1/recv_data/connects/' + this.connect_id +'/keep_alive' command:
} "get /websocket/v1/recv_data/connects/" +
this.cws.send(JSON.stringify(message)) this.connect_id +
"/keep_alive"
};
this.cws.send(JSON.stringify(message));
}, 20000); }, 20000);
} };
//事件推送信息 //事件推送信息
this.cws.onmessage = (evt) =>{ this.cws.onmessage = evt => {
let data = JSON.parse(evt.data) let data = JSON.parse(evt.data);
try { try {
if(data.event_cate == 'behavior'){ if (data.event_cate == "behavior") {
let illame = this.getCode('安防事件',data.event_type); let illame = this.getCode("安防事件", data.event_type);
let camername = data.event_data.device?data.event_data.device.name:'' let camername = data.event_data.device
let addressname = data.event_data.location?data.event_data.location.name:'' ? data.event_data.device.name
let dt = this.setUtcTime(data.event_dt).split(' ')[1]; : "";
let pics = 'data:image/jpeg;base64,'+data.pics[0].pic_base64 let addressname = data.event_data.location
let obj = { ? data.event_data.location.name
illame:illame, : "";
illdt:dt, let dt = this.showLocalTime(data.event_dt).split(" ")[1];
addressname:addressname, let pics = "data:image/jpeg;base64," + data.pics[0].pic_base64;
camername:camername,
pics:pics
}
that.tableData.unshift(obj)
} else if(data.event_data.illegal.state == 1){
let illame = this.getCode('违法类型',data.event_data.illegal.code);
let camername = data.event_data.location.name
let dt = this.setUtcTime(data.event_dt).split(' ')[1];
let pics = 'data:image/jpeg;base64,'+data.pics[0].pic_base64
let obj = { let obj = {
illame:illame, illame: illame,
illdt:dt, illdt: dt,
camername:camername, addressname: addressname,
pics:pics camername: camername,
} pics: pics
};
that.list.unshift(obj) that.tableData.unshift(obj);
}
} catch (error) {
}
if(data.command){
console.log('推送服务连接正常')
} else if(data.type =='response'){
console.log('请求任务推送成功')
} }
} catch (error) {}
if (data.command) {
console.log("推送服务连接正常");
} else if (data.type == "response") {
console.log("请求任务推送成功");
} }
};
this.keepAlive = setInterval(() => { this.keepAlive = setInterval(() => {
let message = { let message = {
type: 'request', type: "request",
id: new Date().getTime(), id: new Date().getTime(),
mts: new Date().getTime(), mts: new Date().getTime(),
command:'get /websocket/v1/recv_data/connects/' + this.connect_id +'/keep_alive' command:
} "get /websocket/v1/recv_data/connects/" +
this.cws.send(JSON.stringify(message)) this.connect_id +
"/keep_alive"
};
this.cws.send(JSON.stringify(message));
}, 50000); }, 50000);
} catch (err) {
console.log(err);
}
} }
}; };
</script> </script>
<style>
</style>>
\ No newline at end of file \ No newline at end of file
<style></style>>
src/views/behaviorShow/devInfo.vue 0 → 100644
<template>
<div class="devinfo-box">
<div class="item-box">
<div class="icon el-icon-cpu"></div>
<div class="item-info-box">
<div>分析资源</div>
<div><span>64</span> 路</div>
</div>
</div>
<div class="item-box">
<div class="icon el-icon-view"></div>
<div class="item-info-box">
<div>运行路数</div>
<div> <span>47</span> 路</div>
</div>
</div>
<div class="item-box">
<div class="icon el-icon-bell"></div>
<div class="item-info-box">
<div>运行异常资源</div>
<div><span>6</span>个</div>
</div>
</div>
<div class="item-box">
<div class="icon el-icon-s-order"></div>
<div class="item-info-box">
<div>信息存储量</div>
<div> <span>1.2</span> T</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
}
};
</script>
<style scoped="scoped" lang="stylus">
.devinfo-box {
width: 8vw;
height: 28vh;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.19);
overflow hidden
.item-box{
margin-top 2vh
overflow hidden
}
.item-box:first-child{
margin-top 2vh
}
}
.icon{
margin-left .6vw
width 1.7vw
height 3.5vh
float left
font-size 28px
line-height 3.5vh
text-align center
color #3BB7FF
background:rgba(179,229,252,.21);
}
.item-info-box{
float left
margin-left 1vw
width 4vw
div:first-child{
color:rgba(102,102,102,1)
}
div:last-child span{
color:rgba(68,68,68,1);
font-size 20px
line-height 2.5vh
letter-spacing 20
}
}
</style>
\ No newline at end of file \ No newline at end of file
src/views/behaviorShow/index.vue
<template> <template>
<el-row :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"> <el-row
<el-col :span="14" > :gutter="10"
<el-row class="infoBox" :gutter="9"> style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"
<el-col :span="6" class="infoChild"> >
<div class="info-item-box"> <el-col :span="15">
<img src="../../assets/img/map/syn.png" alt="">
<span class="textCon">
<div>分析资源</div>
<div class="colorText"><span>64</span>路</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/car.png" alt="">
<span class="textCon">
<div>运行路数</div>
<div class="colorText"><span>47</span>路</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/warn.png" alt="">
<span class="textCon">
<div>运行异常资源</div>
<div class="colorText"><span>7</span>个</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/total.png" alt="">
<span class="textCon">
<div>数量总数</div>
<div class="colorText"><span>23548</span>路</div>
</span>
</div>
</el-col>
</el-row>
<div id="map" class="maps"> <div id="map" class="maps">
<showmap></showmap> <showmap></showmap>
<div class="eventlist-box"> <div class="eventlist-box">
<eventList></eventList> <devInfo></devInfo>
</div> </div>
</div>
<div style="clear: both;"></div>
</el-col>
<el-col :span="10">
<div class="video-box"> <div class="video-box">
<videoPlay ref="ocx"></videoPlay> <videoPlay ref="ocx"></videoPlay>
</div> </div>
<div class="collect-box"> </div>
<div style="clear: both;"></div>
</el-col>
<el-col :span="9">
<el-row class="collect-box">
<div class="header-title">今日抓拍量</div> <div class="header-title">今日抓拍量</div>
<div class="collect-content"> <div class="collect-content">
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.day_total_snap_num}}</div> <div class="item-num">{{ snapData.day_total_snap_num }}</div>
<div>事件检测总量</div> <div>事件检测总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.day_single_snap_num}}</div> <div class="item-num">{{ snapData.day_single_snap_num }}</div>
<div>单项总量</div> <div>单项总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.month_total_snap_num}}</div> <div class="item-num">{{ snapData.month_total_snap_num }}</div>
<div>本月事件检测总量</div> <div>本月事件检测总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.month_single_snap_num}}</div> <div class="item-num">{{ snapData.month_single_snap_num }}</div>
<div>本月单项总量</div> <div>本月单项总量</div>
</el-col> </el-col>
</div> </div>
</div> </el-row>
<div style="clear: both;"></div> <el-row class="bottom-box" style="margin-top:1vh">
</el-col>
<el-col :span="24" class="clearpright">
<el-row :gutter="10" class="bottom-box">
<el-col :span="8">
<div class="bottom-item-box"> <div class="bottom-item-box">
<behaviortrend></behaviortrend> <behaviortrend></behaviortrend>
</div> </div>
</el-col> </el-row>
<el-col :span="6"> <el-row style="margin-top:1vh">
<div class="bottom-item-box"> <div class="bottom-item-box">
<behaviordis></behaviordis> <behaviordis></behaviordis>
</div> </div>
</el-col> </el-row>
<el-col :span="10" class="clearpright"> <el-row style="margin-top:1vh">
<div class="bottom-item-box"> <div class="bottom-item-box">
<div class="title">实时事件</div> <div class="title">实时事件</div>
<alarmEvent></alarmEvent> <alarmEvent></alarmEvent>
</div> </div>
</el-col>
</el-row> </el-row>
<div style="clear: both;"></div>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
<script> <script>
import showmap from './map' import showmap from "./map";
import videoPlay from '../public/videoPlay' import videoPlay from "../public/videoPlay";
import behaviortrend from './behaviortrend' import behaviortrend from "./behaviortrend";
import behaviordis from './behaviordis' import behaviordis from "./behaviordis";
import eventList from './eventList' import eventList from "./eventList";
import alarmEvent from './alarmEvent' import alarmEvent from "./alarmEvent";
export default{ import devInfo from "./devInfo";
data(){ export default {
return{ data() {
collects:{}, return {
typeList:[], collects: {},
tableData:[], typeList: [],
eventTypeList:[], tableData: [],
illageList:[], eventTypeList: [],
setShow:false, illageList: [],
archiveUnid:0, setShow: false,
snap_num:0, archiveUnid: 0,
audit_num:0, snap_num: 0,
snapData:{ audit_num: 0,
day_total_snap_num:0, snapData: {
day_single_snap_num:0, day_total_snap_num: 0,
month_total_snap_num:0, day_single_snap_num: 0,
month_single_snap_num:0 month_total_snap_num: 0,
} month_single_snap_num: 0
} }
};
}, },
components:{ components: {
showmap, showmap,
videoPlay, videoPlay,
behaviortrend, behaviortrend,
behaviordis, behaviordis,
alarmEvent, alarmEvent,
eventList eventList,
devInfo
}, },
mounted(){ mounted() {},
methods: {
}, editVideo(index, row) {
methods:{ this.setShow = true;
editVideo(index,row){ this.archiveUnid = row.archive_unid;
this.setShow=true;
this.archiveUnid=row.archive_unid;
}, },
delFun(index,row){ delFun(index, row) {
this.$api.map.delEvent({},row.archive_unid).then((res)=>{ this.$api.map.delEvent({}, row.archive_unid).then(res => {
console.log(res) console.log(res);
}) });
console.log(row) console.log(row);
}, },
getBehaviorSnap(){ getBehaviorSnap() {
this.$api.show.getBehaviorSna().then(res => { this.$api.show.getBehaviorSna().then(res => {
this.snapData = res; this.snapData = res;
}) });
} }
}, },
created(){ created() {
this.getBehaviorSnap() this.getBehaviorSnap();
}
} }
};
</script> </script>
<style scoped="scoped" lang="stylus"> <style scoped="scoped" lang="stylus">
.video-box{ .video-box {
height: 46.5vh; height: 46.5vh;
margin-bottom: 1vh; margin-bottom: 1vh;
background: #444444; background: #444444;
}
.collect-box {
height: 11.8vh;
background: #fff;
.header-title {
padding: 10px 0px 0 20px;
} }
.collect-box{
height 11.8vh .collect-content {
background #fff margin-top: 1.6vh;
.header-title{
padding 10px 0px 0 20px .content-item {
} text-align: center;
.collect-content{ border-right: 1px solid #E5E5E5;
margin-top 1.6vh
.content-item{
text-align center
border-right 1px solid #E5E5E5
}
.content-item:last-child{
border-right 0
}
} }
.item-num{
font-size 16px .content-item:last-child {
color #444444 border-right: 0;
} }
} }
.left-box{
.item-num {
font-size: 16px;
color: #444444;
} }
.infoBox{ }
.left-box {
}
.infoBox {
margin-bottom: 1vh; margin-bottom: 1vh;
} }
.infoChild{
.infoChild {
height: 8.5vh; height: 8.5vh;
display: inline-block; display: inline-block;
} }
.info-item-box{
height 100% .info-item-box {
height: 100%;
background: #FFFFFF; background: #FFFFFF;
} }
.infoChild:nth-child(1) img{
.infoChild:nth-child(1) img {
width: 27px; width: 27px;
height: 27px; height: 27px;
margin: 22px 20px 21px 40px; margin: 22px 20px 21px 40px;
} }
.infoChild:nth-child(2) img{
.infoChild:nth-child(2) img {
width: 30px; width: 30px;
height: 27px; height: 27px;
margin: 22px 22px 21px 37px; margin: 22px 22px 21px 37px;
} }
.infoChild:nth-child(3) img{
.infoChild:nth-child(3) img {
width: 28px; width: 28px;
height: 28px; height: 28px;
margin: 22px 22px 20px 34px; margin: 22px 22px 20px 34px;
} }
.infoChild:nth-child(4) img{
.infoChild:nth-child(4) img {
width: 27px; width: 27px;
height: 28px; height: 28px;
margin: 22px 22px 20px 34px; margin: 22px 22px 20px 34px;
} }
.textCon{
.textCon {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
font-size: 12px; font-size: 12px;
color: #666666; color: #666666;
margin-top: 14px; margin-top: 14px;
} }
.textCon span{
.textCon span {
font-size: 20px; font-size: 20px;
margin-right: 2px; margin-right: 2px;
} }
.colorText{
.colorText {
margin-top: 6px; margin-top: 6px;
color: #444444; color: #444444;
} }
.ol-control button{
display:none!important;
background:red!important
}
.pop-info{ .ol-control button {
display: none !important;
background: red !important;
}
.pop-info {
float: left; float: left;
padding-left: 20px; padding-left: 20px;
width :100px width: 100px;
} }
.numBox{ .numBox {
width: 307px; width: 307px;
height: 125px; height: 125px;
background: #FFFFFF; background: #FFFFFF;
color: #444444; color: #444444;
position: relative; position: relative;
} }
.numBox:nth-child(1){
.numBox:nth-child(1) {
margin-bottom: 6px; margin-bottom: 6px;
} }
.num{
.num {
font-size: 30px; font-size: 30px;
margin: 27px 0 0 13px; margin: 27px 0 0 13px;
display: inline-block; display: inline-block;
font-weight:bold; font-weight: bold;
} }
.catch{
.catch {
width: 57px; width: 57px;
position: absolute; position: absolute;
top:59px; top: 59px;
right: 16px; right: 16px;
} }
.backSea{
.backSea {
width: 100%; width: 100%;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
.ltext{ .ltext {
width: 71px; width: 71px;
height: 100%; height: 100%;
border-right:1px solid #E5E5E5; border-right: 1px solid #E5E5E5;
} }
.lnum{
.lnum {
width: 37px; width: 37px;
} }
.maps{
height: 50vh; .maps {
width:100%; height: 59.5vh;
width: 100%;
margin-bottom: 8px; margin-bottom: 8px;
position: relative; position: relative;
} }
.el-table__body tr{ .el-table__body tr {
background: #FFFFFF!important; background: #FFFFFF !important;
} }
.bottom-box{
.bottom-box {
width: 100%; width: 100%;
height: 25vh; height: 26.5vh;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box {
height: 25vh; .bottom-item-box {
height: 27vh;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box .title{
.bottom-item-box .title {
padding-left: 5px; padding-left: 5px;
line-height 3vh line-height: 3vh;
} }
.car-dis-info{
display flex .car-dis-info {
flex-direction row display: flex;
margin 1vh .3vw flex-direction: row;
margin: 1vh 0.3vw;
.left-icon { .left-icon {
width 3vw width: 3vw;
height 6vh height: 6vh;
line-height 6vh line-height: 6vh;
text-align center text-align: center;
span{
font-size 30px span {
} font-size: 30px;
} }
} }
.car-dis-info:nth-child(2){ }
.car-dis-info:nth-child(2) {
.left-icon { .left-icon {
span{ span {
color #FF9630 color: #FF9630;
}
} }
} }
.car-dis-info:nth-child(3){ }
.car-dis-info:nth-child(3) {
.left-icon { .left-icon {
span{ span {
color #F56C6C color: #F56C6C;
} }
} }
} }
.car-dis-info:nth-child(4){
.car-dis-info:nth-child(4) {
.left-icon { .left-icon {
span{ span {
color #36BEA6 color: #36BEA6;
}
}
} }
.car-num{
font-size 22px
font-weight 600
padding-right 5px
} }
.eventlist-box{
position absolute
left 10px
top 10px
z-index 1000
} }
.car-num {
font-size: 22px;
font-weight: 600;
padding-right: 5px;
}
.eventlist-box {
position: absolute;
left: 10px;
top: 10px;
z-index: 1000;
}
.video-box {
position: absolute;
height: 46.5vh;
width: 30vw;
margin-bottom: 1vh;
background: #444444;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
z-index: 1000;
}
</style> </style>
src/views/public/videoPlay.vue
...@@ -101,6 +101,7 @@ ...@@ -101,6 +101,7 @@
try { try {
if(val == 0){ if(val == 0){
this.isShow = false this.isShow = false
document.getElementById("VionVideo").StartPlay(1);
} else { } else {
this.isShow = true this.isShow = true
document.getElementById("VionVideo").StartPlay(0); document.getElementById("VionVideo").StartPlay(0);
......
src/views/public/ytVideo.vue 0 → 100644
<template>
<div class="item">
<div class="player">
<div class="ocx-box">
<object id="VionVideo" classid="clsid:96DFBBAF-4220-4978-9681-4ABA534A7718"
width="98%" height="550" style="margin-left:.9%">
</object>
</div>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
data() {
return {};
},
props: ['playurl', 'type'],
methods: {
videoPlay: function () {
this.urlFlag = false
if (!this.playurl.sip_serv_ip) {
let url = this.playurl.rtsp_url
let ocxPlayRes = document.getElementById('VionVideo').StartPlay(url, 0);
console.log('video Ocx播放rtsp流返回值:', ocxPlayRes);
if (ocxPlayRes != 0) {
alert('播放失败!');
}
} else {
let OcxResponse = document.getElementById('VionVideo').StartPlaySip(this.playurl.sip_serv_id, this.playurl.sip_serv_ip,
this.playurl.sip_serv_port, this.playurl.sip_unid, this.playurl.sip_password, this.playurl.devId, 0)
console.log('video Ocx播放sip流返回值:', OcxResponse);
if (OcxResponse != 0 && OcxResponse != 200) {
alert('播放失败!');
}
}
},
initocx(){
VionVideo.Init(0, 'Null', 4);
},
downloadOCx() {
if (navigator.userAgent.indexOf('Trident') > -1) {
this.axios.get(IP + "/api/v1/device/dlfile", {
params: {
file_type: "video_ocx"
}
})
.then(response => {
location.href = response.data.file_url;
});
} else {
this.$message.error("视频控件加载失败请用IE10及以上版本打开！");
}
},
checkIE() {
var agent = navigator.userAgent.toLowerCase();
if (/(msie\s|trident.*rv:)([\w.]+)/.test(agent) && document.documentMode < 10) {
this.$message.error("IE 版本过低请升级到IE10级以上版本！");
}
}
},
created() {
this.checkIE();
},
mounted() {
VionVideo.Init(0, 'Null', 4);
try {
if (document.getElementById("VionVideo").GetVersion()) {
}
} catch (error) {
this.downloadOCx();
}
},
computed: {
...mapState(['ocxstate'])
},
watch: {
},
beforeDestroy: function () {
if (this.videoplayer.techName_ == "Flash" && this.videoplayer.pause) {
this.videoplayer.pause();
}
}
};
</script>
<style lang="stylus" scoped>
</style>
src/views/sceneManage/index.vue
...@@ -259,8 +259,8 @@ export default { ...@@ -259,8 +259,8 @@ export default {
overflow hidden overflow hidden
} }
.subtask{ .subtask{
margin-bottom 10px margin-bottom 5px
width 100% width 15vw
height 30px height 30px
padding-left 30px padding-left 30px
line-height 30px line-height 30px
......
src/views/sceneManage/setting/demarcate.vue
...@@ -70,10 +70,10 @@ ...@@ -70,10 +70,10 @@
scRTEngineCalcBaseon6Points, scRTEngineCalcBaseon6Points,
CalcCarOutline, CalcCarOutline,
changeModelData changeModelData
} from "../../../assets/javscript/CalibrationCalc.js" } from "../../../assets/js/CalibrationCalc.js"
import { import {
configxml configxml
} from '../../../assets/javscript/configxml.js' } from '../../../assets/js/configxml.js'
export default { export default {
data() { data() {
return { return {
......
src/views/sceneManage/setting/index.vue
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
</el-table> </el-table>
<div class="setting-box"> <div class="setting-box">
<div class="set-header ">基础操作</div> <div class="set-header ">基础操作</div>
<div class="set-item">场景添加 <span class="set-icon el-icon-circle-plus"></span> </div> <div class="set-item" @click="setsounces">场景添加 <span class="set-icon el-icon-circle-plus"></span> </div>
<div class="set-item">轮询播放 <span class="set-icon"> <div class="set-item">轮询播放 <span class="set-icon">
<el-switch <el-switch
:width="25" :width="25"
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
<handleparam ref="handleparam"></handleparam> <handleparam ref="handleparam"></handleparam>
</div> </div>
<div class="yt-box"> <div class="yt-box">
<ytconfig></ytconfig> <ytconfig ref="yt"></ytconfig>
</div> </div>
<div> <div>
<parameter ref="parameter"></parameter> <parameter ref="parameter"></parameter>
...@@ -163,6 +163,9 @@ export default { ...@@ -163,6 +163,9 @@ export default {
handleparam(type){ handleparam(type){
this.$refs.handleparam.show(type) this.$refs.handleparam.show(type)
}, },
setsounces(){
this.$refs.yt.openyt()
},
getTaskParams(){ getTaskParams(){
this.$api.task.getTaskParams(this.taskid,this.subtaskid).then(data => { this.$api.task.getTaskParams(this.taskid,this.subtaskid).then(data => {
this.taskInfo = data this.taskInfo = data
...@@ -337,13 +340,7 @@ export default { ...@@ -337,13 +340,7 @@ export default {
margin-right 20px margin-right 20px
} }
.yt-box{ .yt-box{
position absolute
top 0
left 0
right 0
margin auto
color #333
z-index 100
} }
.settimertype,.sel-box{ .settimertype,.sel-box{
display flex display flex
......
src/views/sceneManage/setting/parameter.vue
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<iframe <iframe
id="iframe" id="iframe"
ref="iframe" ref="iframe"
src="/dynamicParameters.html" src="./dynamicParameters.html"
frameborder="0" frameborder="0"
width="100%" width="100%"
height="415" height="415"
......
src/views/sceneManage/setting/ytconfig.vue
<template> <template>
<div class="yt-box" v-show="showyt"> <div class="control-box" v-show="showyt">
<div class="control-let-box">
<div>
<span
@mousedown="Ytontroller('36')"
@mouseup="stopYtontroller('36')"
class="control-btn el-icon-top-left"
></span>
<span
@mousedown="Ytontroller('38')"
@mouseup="stopYtontroller('38')"
class="control-btn el-icon-top"
></span>
<span
@mousedown="Ytontroller('33')"
@mouseup="stopYtontroller('33')"
class="control-btn el-icon-top-right"
></span>
</div>
<div>
<span
@mousedown="Ytontroller('37')"
@mouseup="stopYtontroller('37')"
class="control-btn el-icon-back"
></span>
<span
@mousedown="Ytontroller('12')"
@mouseup="stopYtontroller('12')"
class="control-btn el-icon-refresh"
></span>
<span
@mousedown="Ytontroller('39')"
@mouseup="stopYtontroller('39')"
class="control-btn el-icon-right"
></span>
</div>
<div>
<span class="control-btn el-icon-bottom-left"></span>
<span class="control-btn el-icon-bottom"></span>
<span class="control-btn el-icon-bottom-right"></span>
</div>
</div>
<div class="control-right-box">
<div class="slider-box">
<span class="title">光圈</span>
<el-slider class="slider-item" v-model="value" show-input></el-slider>
</div>
<div class="slider-box">
<span class="title">光倍</span>
<el-slider class="slider-item" v-model="value" show-input></el-slider>
</div>
<div class="slider-box">
<span class="title">焦距</span>
<el-slider class="slider-item" v-model="value" show-input></el-slider>
</div>
<div class="slider-box">
<span class="title">速度</span>
<el-slider class="slider-item" v-model="value" show-input></el-slider>
</div>
<div class="right-bottom-box">
<div class="setyzw item-box">
<el-input placeholder="预置位编号"></el-input>
</div>
<div class="subbtn item-box">
<el-button @click="subset">确定</el-button>
</div>
<div class="closebtn item-box">
<el-button @click="closeyt">关闭</el-button>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import {
StopControlCamera,
controlDevice,
getControlParam,
setCameraSpeed,
connectCamera
} from "../../../assets/js/YtContronByVionVideo.js";
import { CameraController } from "../../../assets/js/positionOperateByVido.js";
const optionController = new CameraController();
export default { export default {
data() { data() {
return { return {
showyt:false showyt: false,
} value: ""
};
}, },
} methods: {
openyt() {
this.showyt = true;
},
closeyt() {
this.showyt = false;
},
/**
* 控制云台
* @param {code}
*/
Ytontroller(code) {
var param = getControlParam(code);
setCameraSpeed(this.ballspeed);
// VionVideo.PtzSendCmd(param, pvalue, "");
controlDevice(param);
},
/**
* 停止云台控制
* @param {code}
*/
stopYtontroller(code) {
StopControlCamera();
},
subset() {
let mtasks = this.allMask.mtasks;
this.allMask.mtasks.forEach(ele => {
ele.scenes[this.curindex].algo_type = this.algo_type;
ele.scenes[this.curindex].position_name = this.position_name;
ele.scenes[this.curindex].position_num = this.position_num;
});
let reqObj = {
subtask_id: this.curentSubTaskId,
mtasks: this.allMask.mtasks
};
this.$api.task
.editRoi(this.curentTaskId, this.curentSubTaskId, reqObj)
.then(res => {
if (data.ecode == "200") {
this.closeyt();
}
});
}
}
};
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.yt-box{ .control-box {
height 30vh position: absolute;
width 31vw top: 0;
background blue left: 0;
right: 0;
margin: auto;
color: #333;
z-index: 100;
height: 24vh;
width: 31vw;
margin-top: 0.5vh;
background: #ffffff;
box-shadow: 1px 0px 4px 3px rgba(74, 74, 74, 0.14);
}
.control-let-box {
float: left;
width: 12vw;
.control-btn {
height: 5vh;
margin-top: 2vh;
width: 3.5vw;
overflow: hidden;
font-size: 30px;
text-align: center;
color: #cccccc;
font-weight: 600;
} }
}
.control-right-box {
float: left;
width: 18.5vw;
}
.slider-box {
overflow: hidden;
.title {
float: left;
width: 2vw;
line-height: 35px;
}
.slider-item {
float: left;
width: 16vw;
}
}
.item-box {
float: left;
margin-top: 1vh;
}
.item-box:nth-child(1) {
margin-left: 0;
}
.setyzw {
width: 6vw;
}
.subbtn {
margin: 1vh 0.3vw 0 2vw;
}
</style> </style>
\ No newline at end of file \ No newline at end of file
src/views/sceneManage/videoplay.vue
...@@ -25,9 +25,8 @@ ...@@ -25,9 +25,8 @@
videoPlay: function () { videoPlay: function () {
this.urlFlag = false this.urlFlag = false
if (!this.playulr.sip_serv_ip) { if (!this.playulr.sip_serv_ip) {
debugger
let url = this.playulr.rtsp_url let url = this.playulr.rtsp_url
let ocxPlayRes = document.getElementById('VionVideo').StartPlay(url, 0); let ocxPlayRes = VionVideo.PlayRealVideo(url, "0", "xxx", '',undefined);
console.log('video Ocx播放rtsp流返回值:', ocxPlayRes); console.log('video Ocx播放rtsp流返回值:', ocxPlayRes);
if (ocxPlayRes != 0) { if (ocxPlayRes != 0) {
alert('播放失败!'); alert('播放失败!');
...@@ -59,7 +58,7 @@ ...@@ -59,7 +58,7 @@
}); });
}, },
initocx() { initocx() {
// VionVideo.Init(0, 'Null', 4); VionVideo.Init(0, 'Null', 1);
}, },
downloadOCx() { downloadOCx() {
// if (navigator.userAgent.indexOf('Trident') > -1) { // if (navigator.userAgent.indexOf('Trident') > -1) {
...@@ -90,7 +89,7 @@ ...@@ -90,7 +89,7 @@
// this.initocx(); // this.initocx();
}, },
mounted() { mounted() {
// VionVideo.Init(0, 'Null', 4); this.initocx();
// try { // try {
// if (document.getElementById("VionVideo").GetVersion()) { // if (document.getElementById("VionVideo").GetVersion()) {
// } // }
......
src/views/taskManage/editSet.vue
...@@ -4,72 +4,76 @@ ...@@ -4,72 +4,76 @@
title="任务配置修改" title="任务配置修改"
:visible.sync="setvisible" :visible.sync="setvisible"
width="450px" width="450px"
:before-close="handleClose"> :before-close="handleClose"
>
<div> <div>
<el-form label-position="left" label-width="80px" :model="formData"> <el-form label-position="left" label-width="80px" :model="formData">
<el-form-item label="任务名称"> <el-form-item label="任务名称">
<el-input v-model="formData.task_name" placeholder="请输入任务名称"></el-input> <el-input
v-model="formData.task_name"
placeholder="请输入任务名称"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="算法类型"> <el-form-item label="算法类型">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false> <el-select
<el-option v-model="formData.task_algo_type"
key="1" placeholder="请选择"
label="全部" :popper-append-to-body="false"
value=""> >
</el-option> <el-option value label="--"></el-option>
<el-option <el-option value="0" label="交通"></el-option>
key="2" <el-option value="1" label="客流"></el-option>
label="222" <el-option value="2" label="行为分析"></el-option>
value="2"> <el-option value="5" label="交通行人"></el-option>
</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="场景占用"> <el-form-item label="场景占用">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false> <el-select
<el-option v-model="formData.type"
key="1" placeholder="请选择"
label="全部" :popper-append-to-body="false"
value=""> >
</el-option> <el-option key="1" label="全部" value></el-option>
<el-option <el-option key="2" label="222" value="2"></el-option>
key="2"
label="222"
value="2">
</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="时间计划"> <el-form-item label="时间计划">
<el-input v-model="formData.type"></el-input> <el-input v-model="formData.type"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="时间"> <el-form-item label="时间">
<el-input v-model="formData.type"></el-input> <el-date-picker
style="width:100%"
v-model="formData.timer"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="存储配置"> <el-form-item label="存储配置">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false> <el-select
v-model="formData.store_conf.unid"
placeholder="请选择"
:popper-append-to-body="false"
>
<el-option <el-option
key="1" :value="store.unid"
label="全部" :label="store.name"
value=""> v-for="store in store_confs"
</el-option> :key="store.unid"
<el-option ></el-option>
key="2"
label="222"
value="2">
</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="优先级"> <el-form-item label="优先级">
<el-select v-model="formData.type" placeholder="请选择" :popper-append-to-body=false> <el-select
<el-option v-model="formData.priority"
key="1" placeholder="请选择"
label="全部" :popper-append-to-body="false"
value=""> >
</el-option> <el-option value="high" label="高"></el-option>
<el-option <el-option value="normal" selected label="中"></el-option>
key="2" <el-option value="low" label="低"></el-option>
label="222"
value="2">
</el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
...@@ -83,54 +87,141 @@ ...@@ -83,54 +87,141 @@
</template> </template>
<script> <script>
export default{ export default {
data(){ data() {
return{ return {
formData:{}, setvisible: false,
sessionData:{} formData: {
task_name: "",
task_algo_type: "",
timer: "",
store_conf: {
unid: ""
},
priority: ""
},
vchanAry: [],
sessionData: {},
store_confs: []
};
},
props: {
pedittype: {
type: String,
default: "add"
} }
}, },
props:{ watch: {},
setvisible:{ mounted() {
type:Boolean, console.log("mounted", this.formData);
default:false },
methods: {
initData(type, pdata) {
debugger;
this.setvisible = true;
if (type == "add") {
this.formData = {
task_name: "",
task_algo_type: "",
timer: "",
store_conf: {
unid: ""
}, },
parentData:{ priority: ""
type:Object, };
default: function () {
return {}
} }
if (type == "edit") {
pdata.timer = [pdata.start_dt, pdata.end_dt];
this.formData = pdata;
this.$api.task.getSubTask(pdata.task_id).then(res => {
let ary = [];
let data = res.list_data;
for (let i in data) {
if (data[i].vchan) {
data[i].vchan.subtask_id = data[i].subtask_id;
data[i].vchan.refid = data[i].vchan.vchan_refid;
} else {
data.vchan = {
subtask_id: data[i].subtask_id,
refid: "",
vchan_name: data[i].subtask_name
};
} }
}, ary.push(data[i].vchan);
watch:{ }
parentData(nval, oval){ // this.$refs.edit.editData = confile;
console.log(nval, oval) // this.$refs.edit.vchanAry = ary;
this.sessionData=JSON.parse(JSON.stringify(nval)); this.vchanAry = ary;
this.formData=nval; });
console.log(this.formData)
} }
}, },
mounted(){ handleClose() {
console.log('mounted',this.formData) this.setvisible = false;
}, },
methods:{ closeVisible() {
handleClose(){ for (var key in this.sessionData) {
this.$emit('update:setvisible',false) this.formData[key] = this.sessionData[key];
}
this.setvisible = false;
}, },
closeVisible(){ save() {
for(var key in this.sessionData){ this.sessionData = JSON.parse(JSON.stringify(this.formData));
this.formData[key]=this.sessionData[key] this.setvisible = false;
//
let postData = {
task_name: this.formData.task_name,
task_algo_type: this.formData.task_algo_type,
source_type: "pull_video_stream",
dev_unid: this.dev_unid,
node_count: 0,
start_dt: this.setUtcTime(this.formData.timer[0]),
end_dt: this.setUtcTime(this.formData.timer[1]),
priority: this.formData.priority,
store_conf_unid: this.formData.store_conf.unid,
task_type: "normal"
// algo_comb_unid: this.formData.store_conf,
};
let formData = new FormData();
for (let i in postData) {
formData.append(i, postData[i]);
}
if (this.pedittype == "add") {
this.addTask(formData);
}
if (this.pedittype == "edit") {
this.editTask(formData);
} }
this.$emit('update:setvisible',false)
}, },
save(){ addTask(data) {
this.sessionData=JSON.parse(JSON.stringify(this.formData)); this.$api.task
this.$emit('update:parentData',this.formData); .addTask(data, {
this.$emit('update:setvisible',false) "content-type": "multipart/form-data"
})
.then(res => {
console.log(res);
this.$emit("refresh");
});
}, },
editTask(data) {
this.$api.task.editTask(data, this.formData.task_id).then(res => {
this.$emit("refresh");
});
},
getStore() {
let params = {
offset: 0,
limit: ""
};
this.$api.device.getStore(params).then(res => {
this.store_confs = res.list_data;
});
} }
},
created() {
this.getStore();
} }
};
</script> </script>
<style> <style></style>
</style>
src/views/taskManage/editVideo.vue
...@@ -5,107 +5,61 @@ ...@@ -5,107 +5,61 @@
top="12vh" top="12vh"
:visible.sync="setvisible" :visible.sync="setvisible"
width="906px" width="906px"
:before-close="handleClose"> :before-close="handleClose"
>
<!-- 内层dialog --> <!-- 内层dialog -->
<el-dialog <!-- <el-dialog width="630px" title="视频迁移" :visible.sync="innerVisible" append-to-body >
width="630px" <el-table height="286" :data="taskData" stripe border style="width: 100%">
title="视频迁移" <el-table-column align="center" prop="name" label="任务名称"></el-table-column>
:visible.sync="innerVisible" <el-table-column align="center" prop="status" label="状态">
append-to-body>
<el-table
height="286"
:data="taskData"
stripe
border
style="width: 100%">
<el-table-column
align="center"
prop="name"
label="任务名称">
</el-table-column>
<el-table-column
align="center"
prop="status"
label="状态">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag <el-tag :key="scope.$index" type="warning" effect="dark">{{ scope.row.status}}</el-tag>
:key="scope.$index"
type="warning"
effect="dark">
{{ scope.row.status}}
</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column align="center" prop="type" label="算法类型"></el-table-column>
align="center" <el-table-column align="center" prop="set" label="储存配置"></el-table-column>
prop="type" <el-table-column align="center" prop="per" label="场景占用"></el-table-column>
label="算法类型">
</el-table-column>
<el-table-column
align="center"
prop="set"
label="储存配置">
</el-table-column>
<el-table-column
align="center"
prop="per"
label="场景占用">
</el-table-column>
</el-table> </el-table>
</el-dialog> </el-dialog> -->
<div> <div>
<!-- 外层内容 --> <!-- 外层内容 -->
<div class="leftBox"> <div class="leftBox">
<div class="titles">视频设备</div> <div class="titles">视频设备</div>
<div class="treeBox"> <div class="treeBox">
<el-tree <el-tree
:data="data" :props="props"
:props="defaultProps" :load="loadNode"
accordion lazy
highlight-current :node-key="props.id"
:expand-on-click-node=false show-checkbox
@node-click="handleNodeClick"> @node-click="vchanClick"
<span class="custom-tree-node" slot-scope="{ node, data }"> ref="tree"
<span @click.stop="() => selectVideo(data)">{{ node.label }}</span> @check="handleCheckChange"
<span v-if="!node.children" class="iconfont icon-bofang1 bofangIcon" @click.stop="() =>playVideo(data)"></span> ></el-tree>
</span>
</el-tree>
</div> </div>
</div> </div>
<div class="rightBox"> <div class="rightBox">
<div class="imgBox"> <div class="imgBox">
<img src="../../assets/img/taskmanage/weather.png" alt=""> <videoplay ref="video" :playurl="play_url"></videoplay>
</div> </div>
<div class="tableBox"> <div class="tableBox">
<el-table <el-table height="286" :data="tableData" stripe border style="width: 100%">
height="286" <el-table-column align="center" prop="name" label="视频源名称"></el-table-column>
:data="tableData" <el-table-column align="center" prop="status" label="视频状态"></el-table-column>
stripe <el-table-column align="center" width="136" prop="operation" label="视频操作">
border
style="width: 100%">
<el-table-column
align="center"
prop="name"
label="视频源名称">
</el-table-column>
<el-table-column
align="center"
prop="status"
label="视频状态">
</el-table-column>
<el-table-column
align="center"
width="136"
prop="operation"
label="视频操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tooltip content="迁移" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="迁移" placement="bottom" effect="light" :visible-arrow="false">
<span class="iconfont icon-Migration moveIcon" @click="moveFun(scope.$index, scope.row)"></span> <span
class="iconfont icon-Migration moveIcon"
@click="moveFun(scope.$index, scope.row)"
></span>
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow="false">
<span class="iconfont icon-detail delIcon" @click="delFun(scope.$index, scope.row)"></span> <span
class="iconfont icon-detail delIcon"
@click="delFun(scope.$index, scope.row)"
></span>
</el-tooltip> </el-tooltip>
</template> </template>
</el-table-column> </el-table-column>
...@@ -115,114 +69,319 @@ ...@@ -115,114 +69,319 @@
<div style="clear: both;"></div> <div style="clear: both;"></div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="closeVisible">取 消</el-button> <el-button @click="handleClose">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button> <el-button type="primary" @click="save">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default{ import videoplay from '../public/videoPlay'
data(){ export default {
return{ data() {
innerVisible:false, return {
tableData:[{ innerVisible: false,
"name":111, tableData: [],
"status":22 play_url:'',
}, user_unid:'',
{ formData: {},
"name":111, editData: {},
"status":22 setvisible:false,
}], props: {
taskData:[ id: "vchan_refid",
{ label: "name",
"name":111, children: "zones",
"status":22, disabled: "disabled",
"type":33, isLeaf: "leaf"
"set":44,
"per":55
}, },
], sessionData: {},
formData:{}, data: [],
sessionData:{},
data: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: { defaultProps: {
children: 'children', children: "children",
label: 'label' label: "label",
id:"vchan_refid"
} }
};
},
props: {
pedittype:{
type:String,
default:'add'
},
},
watch: {
parentData(val) {
// this.sessionData = JSON.parse(JSON.stringify(val));
// this.editData = val;
} }
}, },
props:{ components:{
setvisible:{ videoplay
type:Boolean, },
default:false mounted() {
console.log(this.setvisible);
}, },
parentData:{ methods: {
type:Object, showModal(val){
default: function () { this.tableData = []
return {} this.setvisible = true
this.$store.commit("setocxstate", 1);
this.editData = val;
this.$api.task.getSubTask(val.task_id).then(res => {
let ary = []
let data = res.list_data
for(let i in data) {
if (data[i].vchan) {
data[i].vchan.subtask_id = data[i].subtask_id
data[i].vchan.refid = data[i].vchan.vchan_refid
data[i].vchan.name = data[i].vchan.vchan_name
}else {
data.vchan = {
subtask_id: data[i].subtask_id,
refid:'',
vchan_name:data[i].subtask_name,
name:data[i].subtask_name,
}
} }
ary.push(data[i].vchan)
} }
this.tableData = ary;
this.checkvckan()
})
}, },
watch:{ handleCheckChange(data,node) {
parentData(val){ debugger
this.sessionData=JSON.parse(JSON.stringify(val)); console.log(node)
this.formData=val; let staus = false
if(this.tableData.length > 0) {
for(let i = 0; i < this.tableData.length; i++){
if(this.tableData[i].vchan_id == data.vchan_id) {
this.tableData.splice(i,1)
staus = true
break
} else {
} }
}
}
if(data.leaf && !staus){
this.editsubTask(data)
staus = false
}
}, },
mounted(){ editsubTask(vchan){
console.log(this.setvisible) let data = {
is_dome: false,
subtask_name: vchan.name,
vchan: {
vchan_refid: vchan.refid || vchan.vchan_refid,
vchan_duid: vchan.duid || vchan.vchan_duid,
vdev_unid: this.dev_unid,
vchan_name: vchan.name
}
}
this.$api.task.editSubTask(this.editData.task_id,data).then(res => {
this.tableData.push(vchan)
})
}, },
methods:{ playVideo(data) {
selectVideo(data){ console.log("b", data);
console.log('a',data)
}, },
playVideo(data){ delFun(index, data) {
console.log('b',data) debugger
this.$api.task.deleteSubTask(this.editData.task_id,data.subtask_id).then(res => {
this.tableData.splice(index,1)
})
this.checkvckan()
}, },
append(data) { append(data) {
const newChild = { id: id++, label: 'testtest', children: [] }; const newChild = { id: id++, label: "testtest", children: [] };
if (!data.children) { if (!data.children) {
this.$set(data, 'children', []); this.$set(data, "children", []);
} }
data.children.push(newChild); data.children.push(newChild);
}, },
checkvckan(){
this.$refs.tree.setCheckedKeys([])
let arr = []
this.tableData.forEach(ele => {
arr.push(ele.vchan_refid)
})
this.$refs.tree.setCheckedKeys(arr)
},
loadNode(node, resolve) {
if (node.level === 0) {
return resolve([
{
dev_unid: this.dev_unid,
refid: "",
name: "外部设备",
leaf: false,
disabled: true
},
{
dev_unid: this.dev_unid,
refid: "",
name: "内部设备",
leaf: false,
disabled: true
},
{
dev_unid: this.dev_unid,
refid: "",
name: "短视频",
leaf: false,
disabled: true
}
]);
}
if (node.level === 1) {
// http请求
let params = {
offset: 0,
limit: ""
}
this.$api.device.getDevtree(this.dev_unid,node.data.name,params).then(data => {
debugger
let vchans = data.vchan_struct || data.list_data;
for (let i in vchans) {
const vchan = vchans[i];
vchan.leaf =
vchan.typea == 1 ||
vchan.vchan_type == "camera" ||
Boolean(vchan.vchan_refid);
vchan.disabled = !vchan.leaf;
vchan.name =
vchan.name || vchan.org_name || vchan.vchan_name || "未命名";
vchan.leafNode = vchan.typea
? "extern"
: vchan.vchan_type === "vfile"
? "vfile"
: "camera";
if (vchan.leaf) {
vchan.childs = "";
}
}
resolve(vchans);
setTimeout(()=>{
this.checkvckan()
},0)
});
return;
}
for (let i in node.data.childs) {
const element = node.data.childs[i];
// console.log(element.childs)
element.leaf = element.typea == 1 || element.vchan_type == "camera";
element.disabled = !element.leaf;
element.name =
element.name || element.org_name || element.vchan_name || "未命名";
element.leafNode = element.typea
? "extern"
: element.vchan_type === "vfile"
? "vfile"
: "camera";
}
if (!node.data.childs.length) {
this.$message({
type: "info",
message: "该组织下没有像机"
});
}
return resolve(node.data.childs);
},
vchanClick(node) {
if (!node.refid && !node.vchan_refid) {
return;
}
try {
window.clearTimeout(this.timeout1);
window.clearTimeout(this.timeout2);
} catch (err) { }
// var e = e || window.event;
this.play_url = "";
// if (this.testIe.isIe) {
try {
let video_ocx = document.getElementById("VionVideo");
let stopRes = video_ocx.StopPlaySip(0);
let stopRtspRes = video_ocx.StopPlay(0);
console.log("视频新建任务,停止sip播放返回值:", stopRes);
console.log("视频新建任务,停止rtsp播放返回值:", stopRtspRes);
} catch (err) {
console.log("视频新建任务,停止异常:", err.message);
}
// 判断播放sip or rtsp
if (node.leafNode === "camera" || node.leafNode === "vfile") {
if (node.video_url) {
if (node.leafNode === "vfile") {
debugger
this.play_url = {
rtsp_url: node.video_url
};
} else {
this.play_url = {
rtsp_url: node.video_url
};
}
console.log("playURL:", JSON.stringify(this.play_url));
setTimeout(() => {
this.$refs.video.videoPlay();
}, 0);
} else {
alert("播放地址不存在!");
}
} else {
this.getSipSetting(node.refid);
}
// } else {
// this.getSendingCount = 1;
// this.isNeedRewriteIsSending = true;
// this.currentVchan = node.refid || node.vchan_refid;
// }
},
getSipSetting: function(refid) {
if (this.dev_unid) {
this.$api.device.setsip(this.dev_unid,this.user_unid).then(res => {
if (!res.ecode) {
console.log('获取sip配置返回:', JSON.stringify(res.data));
this.playUrl = res.res;
this.playUrl.devId = refid;
console.log("playUrl", JSON.stringify(res));
for (let attr of Object.keys(this.playUrl)) {
if (this.playUrl[attr] === "") {
setTimeout(() => {
this.$message({
message: '获取播放地址失败,请前往配置sip服务!!请重试!',
type: 'error'
});
}, 0);
return;
}
}
setTimeout(() => {
this.$refs.video.videoPlay();
}, 0);
} else {
this.$message({
message: '获取播放地址失败,请前往配置sip服务!!请重试!',
type: 'error'
});
}
})
} else {
console.log("运维ID获取失败");
this.$message({
type: "warning",
message: "运维ID获取失败"
});
}
},
remove(node, data) { remove(node, data) {
const parent = node.parent; const parent = node.parent;
const children = parent.data.children || parent.data; const children = parent.data.children || parent.data;
...@@ -232,70 +391,68 @@ ...@@ -232,70 +391,68 @@
handleNodeClick(data) { handleNodeClick(data) {
console.log(data); console.log(data);
}, },
handleClose(){}, handleClose() {
closeVisible(){ this.setvisible = false;
for(var key in this.sessionData){ this.$store.commit("setocxstate", 0);
this.formData[key]=this.sessionData[key] this.$refs.tree.setCheckedKeys([]);
}
this.$emit('update:setvisible',false)
},
save(){
this.sessionData=JSON.parse(JSON.stringify(this.formData));
this.$emit('update:parentData',this.formData);
this.$emit('update:setvisible',false)
}, },
delFun(index,row){ save() {
}, },
moveFun(index,row){ moveFun(index, row) {
this.innerVisible=true; this.innerVisible = true;
}
} }
},
created(){
this.user_unid = window.localStorage.getItem('user_unid');
} }
};
</script> </script>
<style scoped="scoped" lang="scss"> <style scoped="scoped" lang="scss">
.bofangIcon{ .bofangIcon {
cursor: pointer; cursor: pointer;
color:#cccccc; color: #cccccc;
font-size:16px; font-size: 16px;
margin-left: 26px; margin-left: 26px;
} }
.moveIcon{ .moveIcon {
cursor: pointer; cursor: pointer;
color:#34b3a2; color: #34b3a2;
font-size:16px; font-size: 16px;
} }
.delIcon{ .delIcon {
cursor: pointer; cursor: pointer;
color:#f2365a; color: #f2365a;
font-size:16px; font-size: 16px;
} }
.leftBox{ .leftBox {
width: 233px; width: 233px;
height: 630px; height: 630px;
border:1px solid rgba(229,229,229,1); border: 1px solid rgba(229, 229, 229, 1);
float: left; float: left;
} overflow:hidden;
.titles{ overflow-y: auto;
}
.titles {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
padding-left: 13px; padding-left: 13px;
background: $title-backgroud; background: $title-backgroud;
font-size: 14px; font-size: 14px;
color: $title-color; color: $title-color;
} }
.treeBox{ .treeBox {
padding: 6px; padding: 6px;
} overflow: auto
.rightBox{ }
.rightBox {
float: left; float: left;
margin-left: 14px; }
} .imgBox {
.imgBox{
width: 587px; width: 587px;
height: 330px; height: 330px;
border:1px solid #444444; border: 1px solid #444444;
margin-bottom: 14px; margin-bottom: 14px;
} }
</style> </style>
src/views/taskManage/index.vue
...@@ -51,10 +51,10 @@ ...@@ -51,10 +51,10 @@
</span> </span>
<el-button type="primary" style="position: relative;top: -2px;" @click="query">查询</el-button> <el-button type="primary" style="position: relative;top: -2px;" @click="query">查询</el-button>
<span style="float: right;"> <span style="float: right;">
<el-button type="info" icon="el-icon-search">新建任务</el-button> <el-button type="info" icon="el-icon-plus" @click="editTask('add')">新建任务</el-button>
</span> </span>
</div> </div>
<div style="padding: 0 15px 20px 23px;"> <div style="padding: 0 23px 20px 23px;width:99%">
<el-table <el-table
height="574" height="574"
:data="tableData" :data="tableData"
...@@ -123,15 +123,15 @@ ...@@ -123,15 +123,15 @@
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="修改任务源配置" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="修改任务源配置" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-xiugai editIcon2" @click="editTask(scope.$index, scope.row)"></span> <span class="iconfont icon-xiugai editIcon2" @click="editTask('edit',scope.$index, scope.row)"></span>
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="启动" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="启动" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-bofang playIcon" @click="playFun(scope.$index, scope.row)"></span> <span class="iconfont icon-bofang playIcon" @click="setTaskStatus(scope.row,'start')"></span>
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="暂停" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="暂停" placement="bottom" effect="light" :visible-arrow=false>
<span class="iconfont icon-zanting pauseIcon" @click="pauseFun(scope.$index, scope.row)"></span> <span class="iconfont icon-zanting pauseIcon" @click="setTaskStatus(scope.row,'stop')"></span>
</el-tooltip> </el-tooltip>
<span class="tableSpanBorder"></span> <span class="tableSpanBorder"></span>
<el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false> <el-tooltip content="删除" placement="bottom" effect="light" :visible-arrow=false>
...@@ -157,8 +157,8 @@ ...@@ -157,8 +157,8 @@
</div> </div>
</div> </div>
<editset :setvisible.sync="setShow" :parentData="editForm"></editset> <editset ref="editset" :pedittype="pedittype" @refresh="getTaskList"></editset>
<editvideo :setvisible.sync="videoShow"></editvideo> <editvideo ref="editvideo" :parentData="curtask" :pedittype="pedittype" @refresh="getTaskList"></editvideo>
</div> </div>
</div> </div>
</template> </template>
...@@ -169,6 +169,7 @@ ...@@ -169,6 +169,7 @@
data(){ data(){
return{ return{
task_name:'', task_name:'',
curtask:'',
task_algo_type:'', task_algo_type:'',
total:0, total:0,
page:1, page:1,
...@@ -176,7 +177,8 @@ ...@@ -176,7 +177,8 @@
setShow:false, setShow:false,
videoShow:false, videoShow:false,
editForm:{}, editForm:{},
tableData: [] tableData: [],
pedittype:'add'
} }
}, },
components:{ components:{
...@@ -285,24 +287,44 @@ ...@@ -285,24 +287,44 @@
}) })
}, },
editVideo(index,row){ editVideo(index,row){
this.videoShow=true; this.$refs.editvideo.showModal(row)
console.log(row)
}, },
editTask(index,row){ editTask(type,index,row){
this.setShow=true; this.$refs.editset.initData(type,row)
this.pedittype = type
this.$nextTick(() => { this.$nextTick(() => {
this.editForm=row; this.editForm=row;
}) })
}, },
playFun(index,row){ setTaskStatus(data,type){
console.log(row) this.$api.task.setTaskStatus(data.task_id,{start_stop_status:type}).then(res =>{
}, this.$message({
pauseFun(index,row){ type: res.ecode=='200'?'success':'error',
console.log(row) message: res.enote
})
if(res.ecode=='200') {
this.getTaskList();
}
})
}, },
delFun(index,row){ delFun(index, data){
console.log(row) this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$api.task.deleteTask(data.task_id).then(res => {
this.$message({
type: res.ecode=='200'?'success':'error',
message: res.enote
})
if (res.ecode == '200'){
this.getTaskList();
}
})
})
} }
}, },
} }
......
src/views/trafficShow/alarmEvent.vue
<template> <template>
<div> <div class="alarm-event-box">
<el-table :data="tableData" height="30vh"> <el-table :data="tableData" height="30vh">
<el-table-column type="index" align="center" label="#"></el-table-column> <el-table-column type="index" align="center" label="#"></el-table-column>
<el-table-column align="center" prop="eventType" label="事件地点"></el-table-column> <el-table-column align="center" prop="camername" label="事件地点"></el-table-column>
<el-table-column align="center" prop="locationName" label="抓拍类型"></el-table-column> <el-table-column align="center" prop="illname" label="抓拍类型"></el-table-column>
<el-table-column align="center" prop="startDt" label="发生时间"></el-table-column> <el-table-column align="center" prop="illdt" label="发生时间"></el-table-column>
<el-table-column align="center" prop="operation" label="操作"> <el-table-column align="center" prop="operation" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tooltip content="查看" placement="bottom" effect="light" :visible-arrow="false"> <el-tooltip content="查看" placement="bottom" effect="light" :visible-arrow="false">
...@@ -71,19 +71,23 @@ export default { ...@@ -71,19 +71,23 @@ export default {
}, 20000); }, 20000);
} }
//事件推送信息 //事件推送信息
let _this = this;
this.cws.onmessage = (evt) =>{ this.cws.onmessage = (evt) =>{
let data = JSON.parse(evt.data) let data = JSON.parse(evt.data)
try { try {
if(data.event_data.illegal.state == 1){ if(data.event_data.illegal.state == 1){
let illame = this.getCode('违法类型',data.event_data.illegal.code); let illname = _this.getCode('违法类型',data.event_data.illegal.code) || '';
let camername = data.event_data.location.name let camername = data.event_data.location.name
let dt = this.setUtcTime(data.event_dt).split(' ')[1]; let dt = this.showLocalTime(data.event_dt).split(' ')[1];
let pics = 'data:image/jpeg;base64,'+ data.pics[0].pic_base64 console.log(data.pics[0].src_url)
let pics = data.pics[0].src_url
let pos = data.event_data.location.pos
let obj = { let obj = {
illame:illame, illname:illname,
illdt:dt, illdt:dt,
camername:camername, camername:camername,
pics:pics pics:pics,
pos:pos
} }
if(that.tableData.length > 40) { if(that.tableData.length > 40) {
that.tableData.pop(obj) that.tableData.pop(obj)
...@@ -93,11 +97,6 @@ export default { ...@@ -93,11 +97,6 @@ export default {
that.tableData.unshift(obj) that.tableData.unshift(obj)
} else{ } else{
if(that.tableData.length > 40) {
that.tableData.pop(data)
} else {
that.tableData.unshift(data)
}
} }
} catch (error) { } catch (error) {
......
src/views/trafficShow/illegaltrend.vue
...@@ -4,35 +4,33 @@ ...@@ -4,35 +4,33 @@
<el-col :span="5" class="header-title">违法事件趋势</el-col> <el-col :span="5" class="header-title">违法事件趋势</el-col>
<span class="header-label">违法</span> <span class="header-label">违法</span>
<div class="header-select"> <div class="header-select">
<el-select v-model="illtype"> <el-select v-model="illtype" @change="getTrafficHour">
<el-option <el-option
v-for="item in illageList" v-for="item in illageList"
:key="item.value" :key="item.value"
:label="item.name" :label="item.name"
:value="item.code"> :value="item.code"
</el-option> ></el-option>
</el-select> </el-select>
</div> </div>
<span class="header-label">事件</span> <span class="header-label">事件</span>
<div class="header-select"> <div class="header-select">
<el-select v-model="illtype"> <el-select v-model="eventtype" @change="getTrafficHour">
<el-option <el-option
v-for="item in options" v-for="item in eventList"
:key="item.value" :key="item.value"
:label="item.label" :label="item.name"
:value="item.code"> :value="item.code"
</el-option> ></el-option>
</el-select> </el-select>
</div> </div>
<span class="header-label">重点车辆</span> <span class="header-label">重点车辆</span>
<div class="header-select"> <div class="header-select">
<el-select v-model="illtype"> <el-select v-model="special_type" @change="getTrafficHour">
<el-option <el-option value label="全部"></el-option>
v-for="item in illageList" <el-option value="1" label="车辆运输车"></el-option>
:key="item.value" <el-option value="2" label="危险品运输车"></el-option>
:label="item.name" <el-option value="3" label="救护车"></el-option>
:value="item.code">
</el-option>
</el-select> </el-select>
</div> </div>
</div> </div>
...@@ -44,15 +42,46 @@ ...@@ -44,15 +42,46 @@
export default { export default {
data() { data() {
return { return {
illtype:'', illtype: "",
options:[], eventtype: "",
special_type: "",
options: [],
illageList: [], illageList: [],
eventList: []
}; };
}, },
methods: { methods: {
initchart(cdata) { initchart(cdata) {
let xData = ["00","01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24"] let xData = [
let maychart = this.$echarts.init(document.getElementById("illtrendchart")); "00",
"01",
"02",
"03",
"04",
"05",
"06",
"07",
"08",
"09",
"10",
"11",
"12",
"13",
"14",
"15",
"16",
"17",
"18",
"19",
"20",
"21",
"22",
"23",
"24"
];
let maychart = this.$echarts.init(
document.getElementById("illtrendchart")
);
let option = { let option = {
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
...@@ -72,7 +101,7 @@ export default { ...@@ -72,7 +101,7 @@ export default {
itemHeight: 10 itemHeight: 10
}, },
grid: { grid: {
top:"10%", top: "10%",
left: "3%", left: "3%",
right: "10%", right: "10%",
bottom: "10%", bottom: "10%",
...@@ -81,7 +110,7 @@ export default { ...@@ -81,7 +110,7 @@ export default {
xAxis: [ xAxis: [
{ {
type: "category", type: "category",
data:xData, data: xData,
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
...@@ -120,7 +149,7 @@ export default { ...@@ -120,7 +149,7 @@ export default {
show: true, show: true,
lineStyle: { lineStyle: {
color: "#D9D9D9", color: "#D9D9D9",
width:1, width: 1,
type: "solid" type: "solid"
} }
}, },
...@@ -139,16 +168,16 @@ export default { ...@@ -139,16 +168,16 @@ export default {
name: "违法", name: "违法",
type: "line", type: "line",
data: (function() { data: (function() {
let d = [] let d = [];
cdata.illegal.map(ele => { cdata.illegal.map(ele => {
for(let i = 0; i < xData.length; i++) { for (let i = 0; i < xData.length; i++) {
if(ele.hour == xData[i]){ if (ele.hour == xData[i]) {
d.push(ele.total_num) d.push(ele.total_num);
} else { } else {
d.push(0) d.push(0);
} }
} }
}) });
return d; return d;
})(), })(),
itemStyle: { itemStyle: {
...@@ -169,16 +198,16 @@ export default { ...@@ -169,16 +198,16 @@ export default {
name: "事件", name: "事件",
type: "line", type: "line",
data: (function() { data: (function() {
let d = [] let d = [];
cdata.event_type.map(ele => { cdata.event_type.map(ele => {
for(let i = 0; i < xData.length; i++) { for (let i = 0; i < xData.length; i++) {
if(ele.hour == xData[i]){ if (ele.hour == xData[i]) {
d.push(ele.total_num) d.push(ele.total_num);
} else { } else {
d.push(0) d.push(0);
} }
} }
}) });
return d; return d;
})(), })(),
itemStyle: { itemStyle: {
...@@ -199,16 +228,16 @@ export default { ...@@ -199,16 +228,16 @@ export default {
name: "重点车辆", name: "重点车辆",
type: "line", type: "line",
data: (function() { data: (function() {
let d = [] let d = [];
cdata.key_vehicle.map(ele => { cdata.key_vehicle.map(ele => {
for(let i = 0; i < xData.length; i++) { for (let i = 0; i < xData.length; i++) {
if(ele.hour == xData[i]){ if (ele.hour == xData[i]) {
d.push(ele.total_num) d.push(ele.total_num);
} else { } else {
d.push(0) d.push(0);
} }
} }
}) });
return d; return d;
})(), })(),
itemStyle: { itemStyle: {
...@@ -224,53 +253,65 @@ export default { ...@@ -224,53 +253,65 @@ export default {
shadowOffsetY: 10 shadowOffsetY: 10
} }
} }
}, }
] ]
}; };
maychart.setOption(option) maychart.setOption(option);
}, },
getillageList(){ getillageList() {
this.illageList = JSON.parse(localStorage.getItem('违法类型')) ; this.illageList = JSON.parse(localStorage.getItem("违法类型"));
}, },
getTrafficHour(){ getTrafficHour() {
this.$api.show.getTrafficHour().then(res => { let data = {
this.initchart(res) illegal_type: this.illtype,
}) event_type: this.eventtype,
} key_vehicle_type: this.special_type
}, };
created(){ this.$api.show.getTrafficHour(data).then(res => {
this.initchart(res);
});
}, },
mounted() {
this.getillageList()
this.getTrafficHour()
getEvents() {
this.$api.show.getEventType().then(res => {
this.eventList = res.list_data;
});
}
}, },
created() {},
mounted() {
this.getillageList();
this.getTrafficHour();
this.getEvents();
}
}; };
</script> </script>
<style lang="stylus" scoped> <style lang="stylus" scoped>
.chart-header-box{ .chart-header-box {
height 3vh height: 3vh;
overflow hidden overflow: hidden;
font-size 14px font-size: 14px;
} }
.header-title { .header-title {
line-height 3vh line-height: 3vh;
}
.illtrendchart{
height 22vh
width 30vw
} }
.header-label{
font-size 12px .illtrendchart {
line-height 3vh height: 22vh;
float left width: 30vw;
} }
.header-select{
width 4.5vw .header-label {
margin .2vh .5vw 0 .2vw font-size: 12px;
float left line-height: 3vh;
float: left;
} }
.header-select {
width: 4.5vw;
margin: 0.2vh 0.5vw 0 0.2vw;
float: left;
}
</style> </style>
\ No newline at end of file \ No newline at end of file
src/views/trafficShow/index.vue
<template> <template>
<el-row :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden"> <el-row :gutter="10" style="padding: 10px 0 10px 10px;width: 100%;overflow:hidden">
<el-col :span="14" > <el-col :span="15">
<el-row class="infoBox" :gutter="9">
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/syn.png" alt="">
<span class="textCon">
<div>分析资源</div>
<div class="colorText"><span>64</span>路</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/car.png" alt="">
<span class="textCon">
<div>运行路数</div>
<div class="colorText"><span>47</span>路</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/warn.png" alt="">
<span class="textCon">
<div>运行异常资源</div>
<div class="colorText"><span>7</span>个</div>
</span>
</div>
</el-col>
<el-col :span="6" class="infoChild">
<div class="info-item-box">
<img src="../../assets/img/map/total.png" alt="">
<span class="textCon">
<div>数量总数</div>
<div class="colorText"><span>23548</span>路</div>
</span>
</div>
</el-col>
</el-row>
<div id="map" class="maps"> <div id="map" class="maps">
<showmap ref="map"></showmap> <showmap ref="map"></showmap>
<div class="eventlist-box"> <div class="eventlist-box">
<eventList></eventList> <!-- <eventList></eventList> -->
<devInfo></devInfo>
</div> </div>
<!-- <div class="video-box">
</div> -->
</div> </div>
<div style="clear: both;"></div> <div style="clear: both;"></div>
</el-col> </el-col>
<el-col :span="10"> <el-col :span="9">
<div class="video-box"> <el-row>
<videoPlay ref="ocx" :playurl="playurl"></videoPlay>
</div>
<div class="collect-box"> <div class="collect-box">
<div class="header-title">今日抓拍量</div> <div class="header-title">今日抓拍量</div>
<div class="collect-content"> <div class="collect-content">
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.kakou_total_snap_num}}</div> <div class="item-num">{{ snapData.kakou_total_snap_num }}</div>
<div>卡口总量</div> <div>卡口总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.event_total_snap_num}}</div> <div class="item-num">{{ snapData.event_total_snap_num }}</div>
<div>事件总量</div> <div>事件总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.illega_total_snap_num}}</div> <div class="item-num">{{ snapData.illega_total_snap_num }}</div>
<div>违法总量</div> <div>违法总量</div>
</el-col> </el-col>
<el-col :span="6" class="content-item"> <el-col :span="6" class="content-item">
<div class="item-num">{{snapData.key_vehicle_total_snap_num}}</div> <div class="item-num">{{ snapData.key_vehicle_total_snap_num }}</div>
<div>特殊车辆总量</div> <div>特殊车辆总量</div>
</el-col> </el-col>
</div> </div>
</div> </div>
<div style="clear: both;"></div> </el-row>
</el-col> <el-row :gutter="12" class="event-type-box" style="margin-top:1vh">
<el-col :span="24" class="clearpright"> <el-col :span="16">
<el-row :gutter="12" class="bottom-box"> <div class="right-item-box">
<el-col :span="8">
<div class="bottom-item-box">
<illegaltrend></illegaltrend>
</div>
</el-col>
<el-col :span="6">
<div class="bottom-item-box">
<eventTypedis></eventTypedis> <eventTypedis></eventTypedis>
</div> </div>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="8" style="padding-right:0">
<div class="bottom-item-box"> <div class="right-item-box">
<div class="title">重点车辆分布</div> <div class="title">重点车辆分布</div>
<!-- <div class="car-dis-info" v-for="(item, index) in keyVehicleData" :key="index">
<div class="left-icon">
<span class="icon-fanxin-bianzu2"></span>
</div>
<div class="right-content">
<div class="">
<span class="car-num">{{item.total_num}}</span>辆
</div>
<div>{{item.vehicle_name}}</div>
</div>
</div> -->
<div class="car-dis-info"> <div class="car-dis-info">
<div class="left-icon"> <div class="left-icon">
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class>
<span class="car-num">10</span>辆 <span class="car-num">10</span>辆
</div> </div>
<div>渣土车抓拍</div> <div>渣土车抓拍</div>
...@@ -117,7 +61,7 @@ ...@@ -117,7 +61,7 @@
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class>
<span class="car-num">10</span>辆 <span class="car-num">10</span>辆
</div> </div>
<div>危险品车</div> <div>危险品车</div>
...@@ -128,7 +72,7 @@ ...@@ -128,7 +72,7 @@
<span class="icon-fanxin-bianzu2"></span> <span class="icon-fanxin-bianzu2"></span>
</div> </div>
<div class="right-content"> <div class="right-content">
<div class=""> <div class>
<span class="car-num">29</span>辆 <span class="car-num">29</span>辆
</div> </div>
<div>重型罐式车</div> <div>重型罐式车</div>
...@@ -136,272 +80,313 @@ ...@@ -136,272 +80,313 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="7" class="clearpright"> </el-row>
<div class="bottom-item-box"> <el-row style="margin-top:1vh;background:#fff">
<div class>
<illegaltrend></illegaltrend>
</div>
</el-row>
<el-row class="clearpright" style="margin-top:1vh">
<div class="right-item-box">
<div class="title">实时事件</div> <div class="title">实时事件</div>
<alarmEvent @event = "alarmevent"></alarmEvent> <alarmEvent @event="alarmevent"></alarmEvent>
</div> </div>
</el-col>
</el-row> </el-row>
<div style="clear: both;"></div>
</el-col> </el-col>
</el-row> </el-row>
</template> </template>
<script> <script>
import showmap from './map' import showmap from "./map";
import videoPlay from '../public/videoPlay' import illegaltrend from "./illegaltrend";
import illegaltrend from './illegaltrend' import eventTypedis from "./eventTypedis";
import eventTypedis from './eventTypedis' import eventList from "./eventList";
import eventList from './eventList' import alarmEvent from "./alarmEvent";
import alarmEvent from './alarmEvent' import devInfo from "../behaviorShow/devInfo";
export default{ export default {
data(){ data() {
return{ return {
typeList:[], typeList: [],
tableData:[], tableData: [],
eventTypeList:[], eventTypeList: [],
keyVehicleData:[], keyVehicleData: [],
illageList:[], illageList: [],
setShow:false, setShow: false,
archiveUnid:0, archiveUnid: 0,
snap_num:0, snap_num: 0,
playurl:'', playurl: "",
audit_num:0, audit_num: 0,
snapData:{ snapData: {
illega_total_snap_num:0, illega_total_snap_num: 0,
key_vehicle_total_snap_num:0, key_vehicle_total_snap_num: 0,
event_total_snap_num:0, event_total_snap_num: 0,
kakou_total_snap_num:0, kakou_total_snap_num: 0
} }
} };
}, },
components:{ components: {
showmap, showmap,
videoPlay,
illegaltrend, illegaltrend,
eventTypedis, eventTypedis,
alarmEvent, alarmEvent,
devInfo,
eventList eventList
}, },
mounted(){ mounted() {},
methods: {
}, alarmevent(data) {
methods:{
alarmevent(data){
//移动地图 //移动地图
this.$refs.map.movemap(data) this.$refs.map.movemap(data);
}, },
getTrafficSnap(){ getTrafficSnap() {
this.$api.show.getTrafficSnap().then(res => { this.$api.show.getTrafficSnap().then(res => {
this.snapData = res; this.snapData = res;
}) });
}, },
getKeyVehicle(){ getKeyVehicle() {
this.$api.show.getKeyVehicle().then(res => { this.$api.show.getKeyVehicle().then(res => {
this.keyVehicleData = res; this.keyVehicleData = res;
}) });
} }
}, },
created(){ created() {
this.getTrafficSnap() this.getTrafficSnap();
this.getKeyVehicle() this.getKeyVehicle();
}
} }
};
</script> </script>
<style scoped="scoped" lang="stylus"> <style scoped="scoped" lang="stylus">
.video-box{ .collect-box {
height: 46.5vh; height: 11.8vh;
margin-bottom: 1vh; background: #fff;
background: #444444;
} .header-title {
.collect-box{ padding: 10px 0px 0 20px;
height 11.8vh
background #fff
.header-title{
padding 10px 0px 0 20px
}
.collect-content{
margin-top 1.6vh
.content-item{
text-align center
border-right 1px solid #E5E5E5
}
.content-item:last-child{
border-right 0
}
} }
.item-num{
font-size 16px .collect-content {
color #444444 margin-top: 1.6vh;
.content-item {
text-align: center;
border-right: 1px solid #E5E5E5;
} }
.content-item:last-child {
border-right: 0;
} }
.left-box{
} }
.infoBox{
margin-bottom: 1vh; .item-num {
font-size: 16px;
color: #444444;
} }
.infoChild{ }
.left-box {
}
.infoChild {
height: 8.5vh; height: 8.5vh;
display: inline-block; display: inline-block;
} }
.info-item-box{
height 100%; .info-item-box {
height: 100%;
background: #FFFFFF; background: #FFFFFF;
} }
.infoChild:nth-child(1) img{
.infoChild:nth-child(1) img {
width: 27px; width: 27px;
height: 27px; height: 27px;
margin: 22px 20px 21px 40px; margin: 22px 20px 21px 40px;
} }
.infoChild:nth-child(2) img{
.infoChild:nth-child(2) img {
width: 30px; width: 30px;
height: 27px; height: 27px;
margin: 22px 22px 21px 37px; margin: 22px 22px 21px 37px;
} }
.infoChild:nth-child(3) img{
.infoChild:nth-child(3) img {
width: 28px; width: 28px;
height: 28px; height: 28px;
margin: 22px 22px 20px 34px; margin: 22px 22px 20px 34px;
} }
.infoChild:nth-child(4) img{
.infoChild:nth-child(4) img {
width: 27px; width: 27px;
height: 28px; height: 28px;
margin: 22px 22px 20px 34px; margin: 22px 22px 20px 34px;
} }
.textCon{
.textCon {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
font-size: 12px; font-size: 12px;
color: #666666; color: #666666;
margin-top: 14px; margin-top: 14px;
} }
.textCon span{
.textCon span {
font-size: 20px; font-size: 20px;
margin-right: 2px; margin-right: 2px;
} }
.colorText{
.colorText {
margin-top: 6px; margin-top: 6px;
color: #444444; color: #444444;
} }
.ol-control button{
display:none!important; .ol-control button {
background:red!important display: none !important;
} background: red !important;
}
.pop-info{ .pop-info {
float: left; float: left;
padding-left: 20px; padding-left: 20px;
width :100px width: 100px;
} }
.numBox{ .numBox {
width: 307px; width: 307px;
height: 125px; height: 125px;
background: #FFFFFF; background: #FFFFFF;
color: #444444; color: #444444;
position: relative; position: relative;
} }
.numBox:nth-child(1){
.numBox:nth-child(1) {
margin-bottom: 6px; margin-bottom: 6px;
} }
.num{
.num {
font-size: 30px; font-size: 30px;
margin: 27px 0 0 13px; margin: 27px 0 0 13px;
display: inline-block; display: inline-block;
font-weight:bold; font-weight: bold;
} }
.catch{
.catch {
width: 57px; width: 57px;
position: absolute; position: absolute;
top:59px; top: 59px;
right: 16px; right: 16px;
} }
.backSea{
.backSea {
width: 100%; width: 100%;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
.ltext{ .ltext {
width: 71px; width: 71px;
height: 100%; height: 100%;
border-right:1px solid #E5E5E5; border-right: 1px solid #E5E5E5;
} }
.lnum{
.lnum {
width: 37px; width: 37px;
} }
.maps{
height: 50vh; .maps {
width:100%; height: 89.3vh;
width: 100%;
margin-bottom: 8px; margin-bottom: 8px;
position: relative; position: relative;
} }
.el-table__body tr{ .el-table__body tr {
background: #FFFFFF!important; background: #FFFFFF !important;
} }
.bottom-box{
.event-type-box {
width: 100%; width: 100%;
height: 25vh; height: 26.5vh;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box {
height: 25vh; .right-item-box {
height: 27vh;
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
} }
.bottom-item-box .title{
.right-item-box .title {
padding-left: 5px; padding-left: 5px;
line-height 3vh line-height: 3vh;
} }
.car-dis-info{
display flex .car-dis-info {
flex-direction row display: flex;
margin 1vh .3vw flex-direction: row;
margin: 1vh 0.3vw;
.left-icon { .left-icon {
width 3vw width: 3vw;
height 6vh height: 6vh;
line-height 6vh line-height: 6vh;
text-align center text-align: center;
span{
font-size 30px span {
} font-size: 30px;
} }
} }
.car-dis-info:nth-child(2){ }
.car-dis-info:nth-child(2) {
.left-icon { .left-icon {
span{ span {
color #FF9630 color: #FF9630;
} }
} }
} }
.car-dis-info:nth-child(3){
.car-dis-info:nth-child(3) {
.left-icon { .left-icon {
span{ span {
color #F56C6C color: #F56C6C;
}
} }
} }
.car-dis-info:nth-child(4){ }
.car-dis-info:nth-child(4) {
.left-icon { .left-icon {
span{ span {
color #36BEA6 color: #36BEA6;
}
} }
} }
.car-num{
font-size 22px
font-weight 600
padding-right 5px
}
.eventlist-box{
position absolute
left 10px
top 10px
z-index 1000
} }
.car-num {
font-size: 22px;
font-weight: 600;
padding-right: 5px;
}
.eventlist-box {
position: absolute;
left: 10px;
top: 10px;
z-index: 1000;
}
.video-box {
position: absolute;
height: 46.5vh;
width: 30vw;
margin-bottom: 1vh;
background: #444444;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
z-index: 1000;
}
</style> </style>
src/views/trafficShow/map.vue
...@@ -2,13 +2,30 @@ ...@@ -2,13 +2,30 @@
<div> <div>
<div id="map" class="maps"></div> <div id="map" class="maps"></div>
<div id="popup" class="ol-popup"> <div id="popup" class="ol-popup">
<a href="#" id="popup-closer" class="ol-popup-closer" @click="closepopup"></a> <a
<div id="t-popup-content">SFDSFA</div> href="#"
id="popup-closer"
class="ol-popup-closer"
@click="closepopup"
></a>
<div id="t-popup-content"></div>
</div>
<div id="videopopup" class="ol-popup">
<a
href="#"
id="popup-closer"
class="ol-popup-closer"
@click="closevideopopup"
></a>
<div id="">
<videoPlay ref="ocx" :playurl="playurl"></videoPlay>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import videoPlay from "../public/videoPlay";
import { inherits } from "ol/util.js"; import { inherits } from "ol/util.js";
import Map from "ol/Map"; import Map from "ol/Map";
import View from "ol/View"; import View from "ol/View";
...@@ -47,13 +64,20 @@ import GeoJSON from "ol/format/GeoJSON.js"; ...@@ -47,13 +64,20 @@ import GeoJSON from "ol/format/GeoJSON.js";
import "ol/ol.css"; //地图默认样式 import "ol/ol.css"; //地图默认样式
var map = ""; var map = "";
var Views = ""; var Views = "";
var container = ''; var container = "";
var videocontainer = "";
var content = ""; var content = "";
var voideocontent = "";
var closer = ""; var closer = "";
var overlay = ""; var overlay = "";
export default { export default {
data() { data() {
return {}; return {
devList: []
};
},
components: {
videoPlay
}, },
methods: { methods: {
InitMap() { InitMap() {
...@@ -121,7 +145,6 @@ export default { ...@@ -121,7 +145,6 @@ export default {
// 创建一个使用Open Street Map地图源的瓦片图层 // 创建一个使用Open Street Map地图源的瓦片图层
offlineMapLayer offlineMapLayer
], ],
Interactions: [defaults, Select, DragBox],
loadTilesWhileAnimating: true, loadTilesWhileAnimating: true,
// 设置显示地图的视图 // 设置显示地图的视图
...@@ -138,13 +161,18 @@ export default { ...@@ -138,13 +161,18 @@ export default {
map.addLayer(heatmapvector); map.addLayer(heatmapvector);
// 添加一个使用离线瓦片地图的层 // 添加一个使用离线瓦片地图的层
this.devList.map(ele => {
console.log(ele.longitude);
var CameraVertorlayer = new VectorLayer({ var CameraVertorlayer = new VectorLayer({
source: _this.addCameraLayer([120.324447, 36.064594], "相机A") source: _this.addCameraLayer(
[Number(ele.longitude), Number(ele.latitude)],
ele
)
}); });
map.addLayer(CameraVertorlayer); map.addLayer(CameraVertorlayer);
});
this.addLayer(); let that = this;
map.on("click", e => { map.on("click", e => {
var pixel = map.getEventPixel(e.originalEvent); var pixel = map.getEventPixel(e.originalEvent);
...@@ -156,65 +184,88 @@ export default { ...@@ -156,65 +184,88 @@ export default {
// Overlay.setPosition(coodinate); // Overlay.setPosition(coodinate);
// map.addOverlay(Overlay); // map.addOverlay(Overlay);
//播放视频操作 //播放视频操作
alert("视频播放") let data = feature.getProperties().cameraInfo;
that.playvideo(data);
console.log("视频播放地址" + data);
}); });
}); });
}, },
movemap(data){ movemap(data) {
let pos = [120.324447, 36.074594] let pos = [120.324447, 36.074594];
Views.animate({ Views.animate({
center: pos, center: pos,
duration: 400, duration: 400,
zoom:14 zoom: 14
}); });
this.addLayer(pos) this.addLayer(data, pos);
}, },
closepopup(){ closepopup() {
overlay.setPosition(undefined); overlay.setPosition(undefined);
closer.blur(); closer.blur();
return false; return false;
}, },
addLayer(pdata) { closevideopopup() {
let HTML= '<div>车牌号:京V8888</div><div>车辆类型:小型客车</div><div>车身颜色:白</div><div>违法类型：闯红灯</div><div></div>' let video_ocx = document.getElementById("VionVideo");
content.innerHTML = '<div class="content-box"><div class="img-box"><img src='+ require('../../assets/img/home/defaultImg.png')+'></div>'+ HTML +'</div>' let stopRes = video_ocx.StopPlaySip(0);
let stopRtspRes = video_ocx.StopPlay(0);
overlay.setPosition(undefined);
closer.blur();
return false;
},
addLayer(pdata, pos) {
document.getElementById("popup").style.display = "block";
console.log(pdata);
if (pdata.pics) {
content.innerHTML =
'<div class="content-box"><div class="img-box"><img src=' +
pdata.pics +
"></div></div>";
} else {
content.innerHTML =
'<div class="content-box"><div class="img-box"><img src=""></div></div>';
}
overlay = new Overlay({ overlay = new Overlay({
element: container, element: container,
autoPan: true, autoPan: true,
position:pdata, position: pos,
autoPanAnimation: { autoPanAnimation: {
duration: 500 duration: 500
} }
}); });
map.addOverlay(overlay); map.addOverlay(overlay);
}, },
addCameraLayer(coordinate, phonetext) { addCameraLayer(coordinate, data) {
let vectorSource = new VectorSource({ id: 1 }); let vectorSource = new VectorSource({ id: 1 });
let icon = new Feature({ let icon = new Feature({
geometry: new Point(coordinate), geometry: new Point(coordinate),
unid: "1" unid: "1",
cameraInfo: data
}); });
let color = "#156BB1"; //设置气泡颜色 let color = "#156BB1"; //设置气泡颜色
//添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致 //添加svg图标需注意 width,height要和 new Icon 的imgSize保持一致
let svg = // let svg =
'<svg t="1540524238971" class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"><defs><style type="text/css"></style></defs>' + // '<svg t="1540524238971" class="icon" style="text-align:center" x="0px" y="0px" width="28px" height="28px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4126" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"><defs><style type="text/css"></style></defs>' +
'<path fill="' + // '<path fill="' +
color + // color +
'" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>'; // '" d="M865.309 291.918c-19.289-45.606-46.897-86.557-82.06-121.719-35.161-35.162-76.114-62.771-121.718-82.06-47.23-19.976-97.385-30.105-149.072-30.105S410.618 68.163 363.388 88.139c-45.605 19.289-86.557 46.898-121.719 82.06-35.162 35.161-62.771 76.114-82.06 121.719-19.976 47.229-30.105 97.384-30.105 149.071 0 51.687 10.129 101.841 30.105 149.07 19.289 45.605 46.898 86.558 82.06 121.72 35.162 35.161 76.114 62.771 121.719 82.06 11.201 4.738 22.569 8.914 34.081 12.541l-58.051 143.991-17.783 0c-14.129 0-25.583 11.454-25.583 25.583s11.454 25.583 25.583 25.583l352.169 0c0.063 0 0.124 0.007 0.187 0.007 0.101 0 0.203-0.006 0.303-0.007l35.985 0c14.13 0 25.583-11.454 25.583-25.583s-11.453-25.583-25.583-25.583l-18.876 0-57.565-146.13c24.322-8.109 47.832-18.654 70.119-31.546 57.156-33.063 105.093-80.61 138.628-137.502 34.561-58.633 52.83-125.787 52.83-194.204C895.414 389.302 885.285 339.148 865.309 291.918zM513.814 146.1c26.472 0 48.01 21.537 48.01 48.01 0 26.472-21.537 48.01-48.01 48.01s-48.011-21.537-48.011-48.01C465.804 167.638 487.342 146.1 513.814 146.1zM512.54 688.835c-111.982 0-203.086-91.104-203.086-203.086 0-111.982 91.104-203.086 203.086-203.086 111.981 0 203.086 91.104 203.086 203.086C715.626 597.731 624.521 688.835 512.54 688.835z" p-id="4127"></path><path d="M512.54 333.829c-83.769 0-151.921 68.152-151.921 151.921 0 83.769 68.15 151.921 151.921 151.921 83.769 0 151.921-68.15 151.921-151.921C664.461 401.98 596.309 333.829 512.54 333.829z" p-id="4128"></path><path d="M513.814 197.265c1.739 0 3.154-1.415 3.154-3.155 0-1.74-1.415-3.155-3.154-3.155-1.74 0-3.155 1.415-3.155 3.155C510.659 195.85 512.074 197.265 513.814 197.265z" p-id="4129"></path><path d="M636.408 950.372 636.408 950.372 636.408 950.373Z" p-id="4130"></path></svg>';
let cameraIcon = new Image(); // let cameraIcon = new Image();
cameraIcon.src = "data:image/svg+xml," + escape(svg); // cameraIcon.src = "data:image/svg+xml," + escape(svg);
icon.setStyle( icon.setStyle(
new Style({ new Style({
//设置样式和大小 //设置样式和大小
image: new Icon({ image: new Icon({
img: cameraIcon, // img: cameraIcon,
crossOrigin: "anonymous", // crossOrigin: "anonymous",
// src:'http://192.168.9.233:20080/static/pics/cache/biaozhu.svg', // imgSize: [38, 38],
imgSize: [28, 28], // marginTop: 100
zIndex: 20, anchor: [0.5, 36],
marginTop: 100 anchorXUnits: "fraction",
anchorYUnits: "pixels",
src: require("./bioazhu.png")
}), }),
text: new Text({ text: new Text({
text: phonetext, text: data.vchan_name,
textBaseline: "top", textBaseline: "top",
font: "normal 12px 微软雅黑", font: "normal 12px 微软雅黑",
lineHeight: "0px", lineHeight: "0px",
...@@ -233,42 +284,79 @@ export default { ...@@ -233,42 +284,79 @@ export default {
return vectorSource; return vectorSource;
}, },
addFeature() { playvideo(data) {
function createStyle(src, img) { let pos = [data.longitude, data.latitude];
return new Style({ document.getElementById("videopopup").style.display = "block";
image: new Icon( overlay = new Overlay({
/** @type {module:ol/style/Icon~Options} */ ({ element: videocontainer,
anchor: [0.5, 0.96], autoPan: true,
crossOrigin: "anonymous", position: pos,
src: src, autoPanAnimation: {
img: img, duration: 500
imgSize: img ? [img.width, img.height] : undefined
})
)
});
} }
var iconFeature = new Feature(new Point([113.338591, 34.50691]));
iconFeature.set(
"style",
createStyle("../../../assets/img/dianli.png", undefined)
);
var CameraVertorlayer = new VectorLayer({
source: iconFeature,
id: 1
}); });
map.addLayer(this.CameraVertorlayer); map.addOverlay(overlay);
let obj = {};
if (data.vchan_name == "视频1") {
obj.rtsp_url =
"rtsp://192.168.9.133:20090/6af6f0f9a445463d8b07273fe538694d";
} else if (data.vchan_name == "视频2") {
obj.rtsp_url =
"rtsp://192.168.9.133:20090/68504674201c4490bfe1a9d18c86b6ac";
} }
this.playurl = obj;
setTimeout(() => {
this.$refs.ocx.videoPlay();
}, 0);
//获取视频流
// this.$api.device.getFxStream(this.dev_unid, data.vchan_refid).then(res => {
// debugger
// if(res.task_list.length >0) {
// var taskarr = res.task_list;
// let obj = {};
// for(let i = 0; i < taskarr.length; i++){
// if(taskarr[i].rtsp_url !=''){
// obj.rtsp_url = res.task_list[i].rtsp_url
// break;
// }
// }
// this.playurl = obj
// this.$refs.ocx.videoPlay()
// } else {
// this.$message({
// message: '该相机下没有分析任务',
// type: 'error'
// });
// }
// })
}, },
mounted(){ getDevList() {
setTimeout(()=>{ this.$api.show.getDevList(this.dev_unid).then(res => {
let devlist = [];
res.list_data.map(ele => {
if (ele.vchan_type == "camera") {
devlist.push(ele);
}
});
this.devList = devlist;
setTimeout(() => {
this.InitMap(); this.InitMap();
},300) }, 200);
container = document.getElementById('popup'); });
content = document.getElementById('t-popup-content'); }
closer = document.getElementById('popup-closer');
}, },
mounted() {
setTimeout(() => {
this.getDevList();
}, 1000);
container = document.getElementById("popup");
videocontainer = document.getElementById("videopopup");
content = document.getElementById("t-popup-content");
voideocontent = document.getElementById("video-popup-content");
closer = document.getElementById("popup-closer");
}
}; };
</script> </script>
...@@ -291,6 +379,7 @@ export default { ...@@ -291,6 +379,7 @@ export default {
} }
.ol-popup { .ol-popup {
display: none;
position: absolute; position: absolute;
background-color: white; background-color: white;
-webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2)); -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
...@@ -300,7 +389,9 @@ export default { ...@@ -300,7 +389,9 @@ export default {
border: 1px solid #cccccc; border: 1px solid #cccccc;
bottom: 12px; bottom: 12px;
left: -50px; left: -50px;
min-width: 280px; width: 20vw;
height 25vh;
overflow hidden
} }
.ol-popup:after, .ol-popup:before { .ol-popup:after, .ol-popup:before {
top: 100%; top: 100%;
......
yarn.lock 0 → 100644
This diff could not be displayed because it is too large.
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!