209 lines
35 KiB
HTML
209 lines
35 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>codem-dispatch</title>
|
|
|
|
<script src="./js/vue.js"></script>
|
|
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link rel="stylesheet" href="./css/style.css">
|
|
</head>
|
|
<body>
|
|
<div id="app" style="display: none;">
|
|
<div class="w-full h-[100vh] font-['Gilroy-Bold'] z-[1000]">
|
|
|
|
<div class="absolute right-[.6771vw] top-[13.2778vh] h-[80vh] z-[10]" v-if="Config.DispatchLocales">
|
|
<transition-group name="slide">
|
|
<div class="px-[.7813vw] w-[15.8333vw] h-[16.0185vh] bg-[#10122399] rounded-[.4167vw] overflow-hidden
|
|
relative mt-[2vh]" v-for="(data,index) in Notifications" :key="data.id" style="background-size: 100% 100%;"
|
|
@contextmenu.prevent="showContextMenu($event, data.id)"
|
|
@click="hideContextMenu"
|
|
>
|
|
<div class="w-full relative flex justify-between top-[0.9259vh] z-[5]">
|
|
<p class="text-[.7292vw] font-['Gilroy-Bold']">{{Config.DispatchLocales['UI'].Dispatch}}</p>
|
|
|
|
<div class="w-full absolute flex items-center justify-center">
|
|
<p class="text-[.625vw] font-['Gilroy-Medium'] text-[#FFFFFF59]">{{calculateTime(data.time)}}</p>
|
|
</div>
|
|
|
|
<div class="w-[3.125vw] h-[1.8519vh] rounded-[.3125vw] bg-[#FF4747] flex items-center justify-center">
|
|
<p class="text-[.625vw] font-['Gilroy-Bold'] text-[#750000] whitespace-nowrap">{{data.code ? data.code : Config.DispatchTypes[data.type].code}}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-col font-['Gilroy-Bold'] mt-[2.3vh] leading-[.9] ">
|
|
<p class="text-[.7292vw] text-[#FF6E6E]" style="text-shadow: 0px 4px 4px #000;">{{data.header ? data.header : Config.DispatchLocales['UI'][data.type]}}</p>
|
|
<p class="text-[.7292vw] mt-[1.3889vh]">{{data.zone}}</p>
|
|
<p class="text-[.625vw] text-[#FFFFFF85] font-['Gilroy-SemiBold'] mt-[.5vh] leading-[1.2vh]">{{data.text ? data.text : Config.DispatchLocales['Dispatch'][data.type]}} <span class="text-[#FF6E6E]">{{data.vehicle ? ' / ' + data.vehicle : ''}}</span></p>
|
|
</div>
|
|
|
|
<div class="absolute right-[.7813vw] bottom-[0.9259vh] font-['Gilroy-Bold'] flex gap-x-[.5208vw]">
|
|
<div class="w-[3.0729vw] h-[2.7778vh] relative flex items-center justify-end">
|
|
<p class="absolute text-[.7813vw] right-[.4688vw]" style="
|
|
background: radial-gradient(103.1% 106.05% at 37.85% 23.61%, #FFF 0%, rgba(255, 255, 255, 0.00) 100%);
|
|
background-clip: text;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;"
|
|
>{{Config.Keys.AcceptLabel}}</p>
|
|
<img src="./assets/images/takeCallBg.png" class="w-full h-full" alt="">
|
|
</div>
|
|
<img src="./assets/images/clickBg.png" class="w-[1.5625vw] h-[2.7778vh]" alt="">
|
|
</div>
|
|
|
|
<div class="absolute w-full h-full flex items-center justify-center top-0 left-0">
|
|
<inline-svg class="flex items-center justify-center w-[6.6667vw] h-[5.9259vh]" :src="'./assets/dispatchTypes/' + Config.DispatchTypes[data.type].icon"></inline-svg>
|
|
</div>
|
|
|
|
<div class="w-[8vw] h-[9.2593vh] absolute -top-[2vh] -left-[3vw] bg-[#96BCFF] rounded-full blur-[40px]"
|
|
:class="sirenStatus ? 'animate-pulse' : ''"
|
|
></div>
|
|
|
|
<div class="w-[8vw] h-[9.2593vh] absolute -top-[2vh] -right-[3vw] bg-[#FF4747] rounded-full blur-[40px] "
|
|
:class="sirenStatus ? 'animate-pulse' : ''"
|
|
></div>
|
|
|
|
<div v-show="context.show" class="fixed flex flex-col gap-y-[0.463vh] w-[8.3854vw] p-[.2604vw] font-['Gilroy-Bold'] bg-[url('./assets/images/contextBg.png')]" :style="{ top: context.top + 'px', left: context.left + 'px' }" style="background-size: 100% 100%;">
|
|
<div @click="contextHandle('takeCall')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".6771vw" height="1.2037vh" viewBox="0 0 13 13" fill="none">
|
|
<path d="M3.20298 9.73045C3.81219 10.3355 4.4529 10.8817 5.12513 11.369C5.79736 11.8564 6.46958 12.2429 7.14181 12.5286C7.81404 12.8143 8.45055 12.9571 9.05136 12.9571C9.45887 12.9571 9.83908 12.8836 10.192 12.7366C10.545 12.5895 10.8643 12.3584 11.1499 12.0433C11.3138 11.8585 11.4451 11.66 11.5438 11.4478C11.6426 11.2356 11.692 11.0224 11.692 10.8081C11.692 10.6485 11.6594 10.4962 11.5942 10.3512C11.5291 10.2063 11.4209 10.0813 11.2697 9.97626L9.34125 8.6024C9.1942 8.50155 9.05764 8.42592 8.93159 8.3755C8.80558 8.32508 8.68584 8.29987 8.57239 8.29987C8.42956 8.29987 8.29092 8.33874 8.15647 8.41648C8.02203 8.49422 7.88337 8.60451 7.74049 8.74734L7.29308 9.18849C7.22584 9.25569 7.14601 9.28929 7.0536 9.28929C7.00317 9.28929 6.95589 9.28091 6.91175 9.26413C6.86765 9.2473 6.8288 9.23259 6.7952 9.21999C6.60195 9.11497 6.35196 8.93326 6.04524 8.67487C5.73853 8.41648 5.42973 8.13182 5.11883 7.8209C4.81212 7.51002 4.52853 7.20122 4.26804 6.89452C4.00755 6.58781 3.82689 6.33782 3.72606 6.14456C3.70926 6.11095 3.6935 6.07209 3.6788 6.02797C3.66409 5.98386 3.65674 5.93869 3.65674 5.89248C3.65674 5.80005 3.68825 5.72232 3.75127 5.6593L4.19242 5.19924C4.33527 5.0564 4.44555 4.91775 4.52328 4.7833C4.601 4.64886 4.63986 4.51021 4.63986 4.36737C4.63986 4.25393 4.61466 4.13419 4.56424 4.00815C4.51382 3.8821 4.4361 3.74556 4.33106 3.59851L2.97611 1.68897C2.86687 1.53771 2.73663 1.42743 2.58538 1.3581C2.43413 1.28878 2.27447 1.25412 2.10641 1.25412C1.66947 1.25412 1.26404 1.43688 0.89011 1.80241C0.583406 2.0965 0.35968 2.42106 0.218933 2.77608C0.078186 3.1311 0.0078125 3.51027 0.0078125 3.91361C0.0078125 4.51861 0.147509 5.15408 0.426903 5.82C0.706298 6.48592 1.08758 7.15289 1.57074 7.8209C2.0539 8.48895 2.59798 9.12547 3.20298 9.73045ZM6.46118 6.529C6.62922 6.69704 6.833 6.78107 7.0725 6.78107C7.31197 6.78107 7.51572 6.69493 7.68377 6.52267C7.85185 6.35463 7.9359 6.15296 7.9359 5.91768C7.9359 5.68241 7.85185 5.48074 7.68377 5.31268C7.51572 5.14042 7.31197 5.05429 7.0725 5.05429C6.833 5.05429 6.62922 5.13832 6.46118 5.30638C6.29312 5.47444 6.20909 5.67715 6.20909 5.91453C6.20909 6.15191 6.29312 6.35674 6.46118 6.529ZM7.08509 3.03762C6.98424 3.13425 6.93382 3.25294 6.93382 3.39369C6.93382 3.53444 6.98424 3.65523 7.08509 3.75606L9.23412 5.90508C9.33492 6.00592 9.45571 6.05633 9.59648 6.05633C9.73721 6.05633 9.8559 6.00592 9.95258 5.90508C10.0492 5.80845 10.0975 5.68976 10.0975 5.54901C10.0975 5.40826 10.0492 5.28957 9.95258 5.19294L7.79722 3.03762C7.70059 2.93679 7.58191 2.88637 7.44118 2.88637C7.30042 2.88637 7.18172 2.93679 7.08509 3.03762ZM9.35383 3.64262C9.52609 3.80648 9.72987 3.8884 9.96516 3.8884C10.2004 3.8884 10.4021 3.80438 10.5702 3.63632C10.7382 3.46826 10.8222 3.26554 10.8222 3.02816C10.8222 2.79078 10.7382 2.59017 10.5702 2.42632C10.4021 2.25406 10.1994 2.16793 9.962 2.16793C9.7246 2.16793 9.52188 2.25196 9.35383 2.42001C9.18157 2.58807 9.09544 2.78973 9.09544 3.02501C9.09544 3.2603 9.18157 3.46616 9.35383 3.64262ZM9.97774 0.144948C9.88111 0.245782 9.8328 0.366573 9.8328 0.50732C9.8328 0.648067 9.88111 0.766756 9.97774 0.863389L12.1268 3.01871C12.2234 3.11534 12.3431 3.16366 12.486 3.16366C12.6288 3.16366 12.7486 3.11534 12.8452 3.01871C12.9461 2.92208 12.9965 2.80339 12.9965 2.66264C12.9965 2.5219 12.9461 2.40111 12.8452 2.30027L10.6962 0.144948C10.5954 0.0483161 10.4735 0 10.3307 0C10.1878 0 10.0702 0.0483161 9.97774 0.144948Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Take_Call}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('markOnMap')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".8333vw" height="1.3889vh" viewBox="0 0 16 15" fill="none">
|
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.7113 13.7584C9.84787 14.1328 8.92714 14.3199 7.94905 14.3199C6.97099 14.3199 6.05025 14.1328 5.18684 13.7584C4.32343 13.384 3.5618 12.8669 2.90196 12.2071C2.24212 11.5472 1.72501 10.7856 1.35063 9.92222C0.976252 9.05879 0.789062 8.13804 0.789062 7.15999C0.789062 6.18192 0.976252 5.26119 1.35063 4.39778C1.72501 3.53437 2.24095 2.77274 2.89845 2.1129C3.55595 1.45306 4.31641 0.935948 5.17982 0.561568C6.04323 0.187189 6.96397 0 7.94203 0C8.9201 0 9.842 0.187189 10.7077 0.561568C11.5735 0.935948 12.3363 1.45306 12.9961 2.1129C13.656 2.77274 14.1731 3.53437 14.5475 4.39778C14.9219 5.26119 15.1091 6.18192 15.1091 7.15999C15.1091 8.13804 14.9219 9.05879 14.5475 9.92222C14.1731 10.7856 13.656 11.5472 12.9961 12.2071C12.3363 12.8669 11.5747 13.384 10.7113 13.7584ZM6.51705 3.62211C6.3673 3.87014 6.29243 4.14624 6.29243 4.45042C6.29243 4.82012 6.40123 5.14771 6.61884 5.43317C6.83644 5.71863 7.11138 5.91518 7.44364 6.02281V9.6449C7.44364 10.0006 7.46236 10.3317 7.4998 10.6382C7.53723 10.9447 7.59339 11.1916 7.66826 11.3787C7.74314 11.566 7.83674 11.6596 7.94905 11.6596C8.06136 11.6596 8.15379 11.5671 8.22634 11.3823C8.29884 11.1974 8.35383 10.9517 8.3913 10.6452C8.42873 10.3387 8.44744 10.0053 8.44744 9.6449V6.02281C8.77972 5.91986 9.05582 5.72565 9.27572 5.44018C9.49568 5.15472 9.60566 4.8248 9.60566 4.45042C9.60566 4.14624 9.53078 3.87014 9.38103 3.62211C9.23128 3.37409 9.03123 3.1752 8.7809 3.02545C8.53051 2.87569 8.25323 2.80082 7.94905 2.80082C7.64487 2.80082 7.36759 2.87569 7.11723 3.02545C6.86686 3.1752 6.6668 3.37409 6.51705 3.62211ZM6.99438 4.02924C6.99906 4.16964 7.05405 4.29248 7.15934 4.39778C7.26464 4.50307 7.38514 4.55572 7.52085 4.55572C7.66593 4.55572 7.78994 4.50307 7.89289 4.39778C7.99587 4.29248 8.04736 4.16964 8.04736 4.02924C8.04736 3.88886 7.99587 3.76485 7.89289 3.65721C7.78994 3.54958 7.66593 3.49576 7.52085 3.49576C7.38514 3.49576 7.26347 3.54958 7.15583 3.65721C7.0482 3.76485 6.99438 3.88886 6.99438 4.02924Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Mark_On_Map}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('forwardEMS')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".625vw" height="1.2037vh" viewBox="0 0 12 13" fill="none">
|
|
<path d="M4.84107 5.84692L1.27779 7.90747C1.09405 8.01248 0.95624 8.11746 0.864369 8.22242C0.772498 8.32743 0.726562 8.44556 0.726562 8.57682C0.726562 8.73429 0.803122 8.94208 0.95624 9.20021L0.989051 9.25927C1.20342 9.63988 1.43091 9.83018 1.67152 9.83018C1.81589 9.83018 2.01276 9.75581 2.26212 9.60709L5.72697 7.60562L5.2873 7.36936V11.3789C5.2873 11.7332 5.35839 11.9738 5.50057 12.1007C5.64275 12.2276 5.89758 12.291 6.26507 12.291H6.35037C6.71348 12.291 6.96613 12.2276 7.10831 12.1007C7.25049 11.9738 7.32158 11.7332 7.32158 11.3789V7.36936L6.88191 7.60562L10.3468 9.60709C10.4649 9.67706 10.571 9.73064 10.665 9.76782C10.7591 9.805 10.8455 9.82359 10.9242 9.82359C11.0511 9.82359 11.167 9.77768 11.2721 9.68584C11.377 9.59396 11.4929 9.45397 11.6198 9.26586L11.6658 9.19362C11.8233 8.96179 11.902 8.76056 11.902 8.58992C11.902 8.45432 11.8539 8.33292 11.7576 8.22572C11.6614 8.11856 11.5192 8.01248 11.3311 7.90747L7.77438 5.84692V6.32596L11.3245 4.38355C11.5126 4.28293 11.6515 4.18012 11.7412 4.07513C11.8309 3.97013 11.8758 3.84983 11.8758 3.71421C11.8758 3.55671 11.8058 3.35329 11.6658 3.10392L11.6133 3.02517C11.3989 2.64894 11.1736 2.46083 10.9373 2.46083C10.7799 2.46083 10.5808 2.53082 10.3402 2.67082L6.88191 4.67885L7.32158 4.90853V0.912145C7.32158 0.557787 7.25049 0.317173 7.10831 0.190304C6.96613 0.0634346 6.71348 0 6.35037 0H6.26507C5.89758 0 5.64275 0.0634346 5.50057 0.190304C5.35839 0.317173 5.2873 0.557787 5.2873 0.912145V4.90853L5.72697 4.67885L2.26868 2.67082C2.15056 2.60082 2.039 2.54614 1.93401 2.50676C1.82901 2.46739 1.73277 2.4477 1.64527 2.4477C1.50965 2.4477 1.38825 2.49364 1.28107 2.58551C1.17389 2.67738 1.07217 2.82393 0.975926 3.02517L0.943116 3.09736C0.820621 3.36423 0.759374 3.57422 0.759374 3.72734C0.759374 3.85858 0.802028 3.97451 0.887337 4.07513C0.972645 4.17575 1.10936 4.28074 1.29747 4.39011L4.84107 6.32596V5.84692Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Forward_EMS}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('allCalls')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".625vw" height="1.2037vh" viewBox="0 0 12 13" fill="none">
|
|
<path d="M1.0002 7.58033C1.1387 7.58033 1.25446 7.53283 1.34745 7.43785C1.44046 7.3429 1.48696 7.23012 1.48696 7.09952V5.30089C1.48696 5.17029 1.44046 5.05652 1.34745 4.95956C1.25446 4.86261 1.1387 4.81413 1.0002 4.81413C0.869605 4.81413 0.758798 4.86261 0.667779 4.95956C0.57676 5.05652 0.53125 5.17029 0.53125 5.30089V7.09952C0.53125 7.23012 0.57676 7.3429 0.667779 7.43785C0.758798 7.53283 0.869605 7.58033 1.0002 7.58033ZM3.00064 10.0081C3.13915 10.0081 3.25392 9.96166 3.34494 9.8687C3.43596 9.7757 3.48147 9.66191 3.48147 9.52733V2.87304C3.48147 2.73849 3.43596 2.62373 3.34494 2.52876C3.25392 2.43378 3.13915 2.38629 3.00064 2.38629C2.86609 2.38629 2.75331 2.43378 2.66229 2.52876C2.57127 2.62373 2.52576 2.73849 2.52576 2.87304V9.52733C2.52576 9.66191 2.57127 9.7757 2.66229 9.8687C2.75331 9.96166 2.86609 10.0081 3.00064 10.0081ZM4.99515 12.4004C5.13366 12.4004 5.24942 12.3539 5.34241 12.2609C5.43541 12.1679 5.48191 12.0541 5.48191 11.9196V0.48082C5.48191 0.346269 5.43541 0.232495 5.34241 0.139497C5.24942 0.046499 5.13366 0 4.99515 0C4.8606 0 4.74881 0.046499 4.65977 0.139497C4.57073 0.232495 4.52621 0.346269 4.52621 0.48082V11.9196C4.52621 12.0541 4.57073 12.1679 4.65977 12.2609C4.74881 12.3539 4.8606 12.4004 4.99515 12.4004ZM6.99562 9.28395C7.13016 9.28395 7.24393 9.23844 7.33693 9.14743C7.42993 9.05641 7.47643 8.94363 7.47643 8.8091V3.5913C7.47643 3.45675 7.42993 3.34298 7.33693 3.24998C7.24393 3.15699 7.13016 3.11049 6.99562 3.11049C6.86104 3.11049 6.74825 3.15699 6.65723 3.24998C6.56622 3.34298 6.52072 3.45675 6.52072 3.5913V8.8091C6.52072 8.94363 6.56622 9.05641 6.65723 9.14743C6.74825 9.23844 6.86104 9.28395 6.99562 9.28395ZM8.99606 11.0826C9.1306 11.0826 9.24337 11.0361 9.33439 10.9431C9.4254 10.8501 9.47091 10.7383 9.47091 10.6077V1.79269C9.47091 1.66209 9.4254 1.54931 9.33439 1.45433C9.24337 1.35935 9.1306 1.31186 8.99606 1.31186C8.85755 1.31186 8.74279 1.35935 8.65177 1.45433C8.56076 1.54931 8.51525 1.66209 8.51525 1.79269V10.6077C8.51525 10.7383 8.56076 10.8501 8.65177 10.9431C8.74279 11.0361 8.85755 11.0826 8.99606 11.0826ZM10.9905 8.0908C11.1251 8.0908 11.2389 8.04432 11.3319 7.95136C11.4249 7.85836 11.4713 7.74655 11.4713 7.61595V4.78445C11.4713 4.65386 11.4249 4.54107 11.3319 4.44609C11.2389 4.35112 11.1251 4.30363 10.9905 4.30363C10.852 4.30363 10.7383 4.35112 10.6492 4.44609C10.5602 4.54107 10.5157 4.65386 10.5157 4.78445V7.61595C10.5157 7.74655 10.5602 7.85836 10.6492 7.95136C10.7383 8.04432 10.852 8.0908 10.9905 8.0908Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].All_Calls}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</transition-group>
|
|
</div>
|
|
|
|
<transition-group name="fade">
|
|
<div v-if="state == 'allDispatchs'" key="allDispatchs" class="w-[16.5104vw] h-full absolute right-0 top-0 font-['Gilroy-Bold'] bg-[#101223] z-[20]">
|
|
<div class="w-full px-[.7813vw] flex items-center justify-between mt-[1.3889vh]">
|
|
<p class="text-[.7292vw]">{{Config.DispatchLocales['UI'].All_Dispatch_Calls}}</p>
|
|
<p class="text-[.625vw] font-['Gilroy-Medium'] text-[#FFFFFF59]">{{Dispatchs.length}} {{Config.DispatchLocales['UI'].Calls}}</p>
|
|
</div>
|
|
<div class="w-full h-[91.1111vh] px-[.3125vw] overflow-hidden overflow-y-scroll mt-[1.8519vh] grid grid-cols-1 content-start gap-y-[1.3889vh]">
|
|
<div v-for="(data, index) in Dispatchs.slice().reverse()" :key="data.id" class="w-full h-[16.0185vh] rounded-[.4167vw] px-[.7813vw] relative bg-[#262B55]"
|
|
@contextmenu.prevent="showContextMenu($event, data.id)"
|
|
@click="hideContextMenu"
|
|
>
|
|
|
|
<div class="w-full relative flex justify-between top-[0.9259vh]">
|
|
<p class="text-[.7292vw] font-['Gilroy-Bold']">{{Config.DispatchLocales['UI'].Dispatch}}</p>
|
|
|
|
<div class="w-full absolute flex items-center justify-center">
|
|
<p class="text-[.625vw] font-['Gilroy-Medium'] text-[#FFFFFF59]">{{calculateTime(data.time)}}</p>
|
|
</div>
|
|
|
|
<div class="w-[3.125vw] h-[1.8519vh] rounded-[.3125vw] bg-[#FF4747] flex items-center justify-center">
|
|
<p class="text-[.625vw] font-['Gilroy-Bold'] text-[#750000] whitespace-nowrap">{{data.code ? data.code : Config.DispatchTypes[data.type].code}}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-y-[1.3889vh] font-['Gilroy-Bold'] mt-[2.3vh] leading-[.9]">
|
|
<p class="text-[.7292vw] text-[#FF6E6E]" style="text-shadow: 0px 4px 4px #000;">{{data.header ? data.header : Config.DispatchLocales['UI'][data.type]}}</p>
|
|
<p class="text-[.7292vw]">{{data.zone}}</p>
|
|
<p class="text-[.625vw] text-[#FFFFFF85] font-['Gilroy-SemiBold'] leading-[1.2vh]">{{data.text ? data.text : Config.DispatchLocales['Dispatch'][data.type]}} <span class="text-[#FF6E6E]">{{data.vehicle ? ' / ' + data.vehicle : ''}}</span></p>
|
|
</div>
|
|
|
|
<div class="flex items-end absolute leading-[1.1] bottom-[1vh] gap-x-[.5729vw]" v-if="data.units.length > 0">
|
|
<inline-svg class="flex items-center justify-center w-[.8048vw] h-[1.2144vh]" src="./assets/images/carIcon2.svg"></inline-svg>
|
|
<p class="text-[.625vw] font-['Gilroy-SemiBold'] italic text-[#FFFFFF85]">{{data.units.length}} {{Config.DispatchLocales['UI'].ON_THE_WAY}}</p>
|
|
</div>
|
|
|
|
<div class="absolute right-[.7813vw] bottom-[0.9259vh] font-['Gilroy-Bold'] flex gap-x-[.5208vw]">
|
|
<img src="./assets/images/clickBg.png" class="w-[1.5625vw] h-[2.7778vh]" alt="">
|
|
</div>
|
|
|
|
<div class="absolute w-full h-full flex items-center justify-center top-0 left-0">
|
|
<inline-svg class="flex items-center justify-center w-[6.6667vw] h-[5.9259vh]" :src="'./assets/dispatchTypes/' + Config.DispatchTypes[data.type].icon"></inline-svg>
|
|
</div>
|
|
|
|
<div v-show="context.show" class="fixed flex flex-col gap-y-[0.463vh] w-[8.3854vw] p-[.2604vw] font-['Gilroy-Bold'] bg-[url('./assets/images/contextBg.png')]" :style="{ top: context.top + 'px', left: context.left + 'px' }" style="background-size: 100% 100%;">
|
|
<div @click="contextHandle('takeCall')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".6771vw" height="1.2037vh" viewBox="0 0 13 13" fill="none">
|
|
<path d="M3.20298 9.73045C3.81219 10.3355 4.4529 10.8817 5.12513 11.369C5.79736 11.8564 6.46958 12.2429 7.14181 12.5286C7.81404 12.8143 8.45055 12.9571 9.05136 12.9571C9.45887 12.9571 9.83908 12.8836 10.192 12.7366C10.545 12.5895 10.8643 12.3584 11.1499 12.0433C11.3138 11.8585 11.4451 11.66 11.5438 11.4478C11.6426 11.2356 11.692 11.0224 11.692 10.8081C11.692 10.6485 11.6594 10.4962 11.5942 10.3512C11.5291 10.2063 11.4209 10.0813 11.2697 9.97626L9.34125 8.6024C9.1942 8.50155 9.05764 8.42592 8.93159 8.3755C8.80558 8.32508 8.68584 8.29987 8.57239 8.29987C8.42956 8.29987 8.29092 8.33874 8.15647 8.41648C8.02203 8.49422 7.88337 8.60451 7.74049 8.74734L7.29308 9.18849C7.22584 9.25569 7.14601 9.28929 7.0536 9.28929C7.00317 9.28929 6.95589 9.28091 6.91175 9.26413C6.86765 9.2473 6.8288 9.23259 6.7952 9.21999C6.60195 9.11497 6.35196 8.93326 6.04524 8.67487C5.73853 8.41648 5.42973 8.13182 5.11883 7.8209C4.81212 7.51002 4.52853 7.20122 4.26804 6.89452C4.00755 6.58781 3.82689 6.33782 3.72606 6.14456C3.70926 6.11095 3.6935 6.07209 3.6788 6.02797C3.66409 5.98386 3.65674 5.93869 3.65674 5.89248C3.65674 5.80005 3.68825 5.72232 3.75127 5.6593L4.19242 5.19924C4.33527 5.0564 4.44555 4.91775 4.52328 4.7833C4.601 4.64886 4.63986 4.51021 4.63986 4.36737C4.63986 4.25393 4.61466 4.13419 4.56424 4.00815C4.51382 3.8821 4.4361 3.74556 4.33106 3.59851L2.97611 1.68897C2.86687 1.53771 2.73663 1.42743 2.58538 1.3581C2.43413 1.28878 2.27447 1.25412 2.10641 1.25412C1.66947 1.25412 1.26404 1.43688 0.89011 1.80241C0.583406 2.0965 0.35968 2.42106 0.218933 2.77608C0.078186 3.1311 0.0078125 3.51027 0.0078125 3.91361C0.0078125 4.51861 0.147509 5.15408 0.426903 5.82C0.706298 6.48592 1.08758 7.15289 1.57074 7.8209C2.0539 8.48895 2.59798 9.12547 3.20298 9.73045ZM6.46118 6.529C6.62922 6.69704 6.833 6.78107 7.0725 6.78107C7.31197 6.78107 7.51572 6.69493 7.68377 6.52267C7.85185 6.35463 7.9359 6.15296 7.9359 5.91768C7.9359 5.68241 7.85185 5.48074 7.68377 5.31268C7.51572 5.14042 7.31197 5.05429 7.0725 5.05429C6.833 5.05429 6.62922 5.13832 6.46118 5.30638C6.29312 5.47444 6.20909 5.67715 6.20909 5.91453C6.20909 6.15191 6.29312 6.35674 6.46118 6.529ZM7.08509 3.03762C6.98424 3.13425 6.93382 3.25294 6.93382 3.39369C6.93382 3.53444 6.98424 3.65523 7.08509 3.75606L9.23412 5.90508C9.33492 6.00592 9.45571 6.05633 9.59648 6.05633C9.73721 6.05633 9.8559 6.00592 9.95258 5.90508C10.0492 5.80845 10.0975 5.68976 10.0975 5.54901C10.0975 5.40826 10.0492 5.28957 9.95258 5.19294L7.79722 3.03762C7.70059 2.93679 7.58191 2.88637 7.44118 2.88637C7.30042 2.88637 7.18172 2.93679 7.08509 3.03762ZM9.35383 3.64262C9.52609 3.80648 9.72987 3.8884 9.96516 3.8884C10.2004 3.8884 10.4021 3.80438 10.5702 3.63632C10.7382 3.46826 10.8222 3.26554 10.8222 3.02816C10.8222 2.79078 10.7382 2.59017 10.5702 2.42632C10.4021 2.25406 10.1994 2.16793 9.962 2.16793C9.7246 2.16793 9.52188 2.25196 9.35383 2.42001C9.18157 2.58807 9.09544 2.78973 9.09544 3.02501C9.09544 3.2603 9.18157 3.46616 9.35383 3.64262ZM9.97774 0.144948C9.88111 0.245782 9.8328 0.366573 9.8328 0.50732C9.8328 0.648067 9.88111 0.766756 9.97774 0.863389L12.1268 3.01871C12.2234 3.11534 12.3431 3.16366 12.486 3.16366C12.6288 3.16366 12.7486 3.11534 12.8452 3.01871C12.9461 2.92208 12.9965 2.80339 12.9965 2.66264C12.9965 2.5219 12.9461 2.40111 12.8452 2.30027L10.6962 0.144948C10.5954 0.0483161 10.4735 0 10.3307 0C10.1878 0 10.0702 0.0483161 9.97774 0.144948Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Take_Call}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('removeCall')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".6771vw" height="1.2037vh" viewBox="0 0 13 13" fill="none">
|
|
<path d="M3.20298 9.73045C3.81219 10.3355 4.4529 10.8817 5.12513 11.369C5.79736 11.8564 6.46958 12.2429 7.14181 12.5286C7.81404 12.8143 8.45055 12.9571 9.05136 12.9571C9.45887 12.9571 9.83908 12.8836 10.192 12.7366C10.545 12.5895 10.8643 12.3584 11.1499 12.0433C11.3138 11.8585 11.4451 11.66 11.5438 11.4478C11.6426 11.2356 11.6919 11.0224 11.6919 10.8081C11.6919 10.6485 11.6594 10.4962 11.5942 10.3512C11.5291 10.2063 11.4209 10.0813 11.2697 9.97626L9.34125 8.6024C9.1942 8.50155 9.05764 8.42592 8.93159 8.3755C8.80558 8.32508 8.68584 8.29986 8.57239 8.29986C8.42956 8.29986 8.29092 8.33874 8.15648 8.41648C8.02203 8.49422 7.88337 8.60451 7.74049 8.74734L7.29308 9.18849C7.22584 9.25569 7.14601 9.28929 7.0536 9.28929C7.00317 9.28929 6.95589 9.28091 6.91175 9.26413C6.86765 9.24731 6.8288 9.23259 6.7952 9.21999C6.60195 9.11497 6.35196 8.93326 6.04524 8.67487C5.73853 8.41648 5.42973 8.13182 5.11882 7.8209C4.81212 7.51002 4.52853 7.20122 4.26804 6.89452C4.00755 6.58781 3.82689 6.33782 3.72606 6.14456C3.70926 6.11095 3.6935 6.07209 3.6788 6.02797C3.66409 5.98386 3.65674 5.93869 3.65674 5.89248C3.65674 5.80005 3.68825 5.72232 3.75127 5.6593L4.19242 5.19924C4.33527 5.0564 4.44555 4.91775 4.52328 4.7833C4.601 4.64886 4.63986 4.51021 4.63986 4.36737C4.63986 4.25393 4.61466 4.13419 4.56424 4.00815C4.51382 3.8821 4.4361 3.74556 4.33106 3.59851L2.97611 1.68897C2.86687 1.53771 2.73663 1.42743 2.58538 1.3581C2.43413 1.28878 2.27447 1.25412 2.10641 1.25412C1.66947 1.25412 1.26404 1.43688 0.89011 1.8024C0.583406 2.0965 0.35968 2.42106 0.218933 2.77608C0.078186 3.1311 0.0078125 3.51027 0.0078125 3.91361C0.0078125 4.51861 0.147509 5.15408 0.426903 5.82C0.706297 6.48592 1.08758 7.15289 1.57074 7.8209C2.0539 8.48895 2.59798 9.12547 3.20298 9.73045Z" fill="white"/>
|
|
<path d="M9.96386 5.9219C10.3641 5.9219 10.743 5.84417 11.1004 5.68871C11.458 5.53329 11.7737 5.31958 12.0476 5.04757C12.3216 4.77557 12.5362 4.46083 12.6917 4.10335C12.8471 3.74588 12.9248 3.36507 12.9248 2.96092C12.9248 2.55291 12.8481 2.17017 12.6946 1.8127C12.5411 1.45522 12.3284 1.14048 12.0564 0.868479C11.7844 0.596473 11.4696 0.383716 11.1121 0.230206C10.7546 0.0767353 10.3719 0 9.96386 0C9.55975 0 9.17896 0.0767353 8.82148 0.230206C8.46397 0.383716 8.14923 0.597448 7.87726 0.871403C7.60526 1.14532 7.39153 1.46006 7.23607 1.81562C7.08065 2.17115 7.00294 2.55291 7.00294 2.96092C7.00294 3.36893 7.08065 3.75169 7.23607 4.1092C7.39153 4.46668 7.60526 4.78142 7.87726 5.05342C8.14923 5.32543 8.46397 5.53816 8.82148 5.69164C9.17896 5.84515 9.55975 5.9219 9.96386 5.9219Z" fill="#FF3B30"/>
|
|
<path d="M8.46594 3.31647C8.36877 3.31647 8.28523 3.28054 8.21532 3.20868C8.14537 3.13678 8.11039 3.05419 8.11039 2.96092C8.11039 2.86769 8.14537 2.78513 8.21532 2.71323C8.28523 2.64133 8.36877 2.60538 8.46594 2.60538H11.4618C11.559 2.60538 11.6435 2.64133 11.7154 2.71323C11.7873 2.78513 11.8232 2.86769 11.8232 2.96092C11.8232 3.05419 11.7873 3.13678 11.7154 3.20868C11.6435 3.28054 11.559 3.31647 11.4618 3.31647H8.46594Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Remove_Call}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('markOnMap')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".8333vw" height="1.3889vh" viewBox="0 0 16 15" fill="none">
|
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.7113 13.7584C9.84787 14.1328 8.92714 14.3199 7.94905 14.3199C6.97099 14.3199 6.05025 14.1328 5.18684 13.7584C4.32343 13.384 3.5618 12.8669 2.90196 12.2071C2.24212 11.5472 1.72501 10.7856 1.35063 9.92222C0.976252 9.05879 0.789062 8.13804 0.789062 7.15999C0.789062 6.18192 0.976252 5.26119 1.35063 4.39778C1.72501 3.53437 2.24095 2.77274 2.89845 2.1129C3.55595 1.45306 4.31641 0.935948 5.17982 0.561568C6.04323 0.187189 6.96397 0 7.94203 0C8.9201 0 9.842 0.187189 10.7077 0.561568C11.5735 0.935948 12.3363 1.45306 12.9961 2.1129C13.656 2.77274 14.1731 3.53437 14.5475 4.39778C14.9219 5.26119 15.1091 6.18192 15.1091 7.15999C15.1091 8.13804 14.9219 9.05879 14.5475 9.92222C14.1731 10.7856 13.656 11.5472 12.9961 12.2071C12.3363 12.8669 11.5747 13.384 10.7113 13.7584ZM6.51705 3.62211C6.3673 3.87014 6.29243 4.14624 6.29243 4.45042C6.29243 4.82012 6.40123 5.14771 6.61884 5.43317C6.83644 5.71863 7.11138 5.91518 7.44364 6.02281V9.6449C7.44364 10.0006 7.46236 10.3317 7.4998 10.6382C7.53723 10.9447 7.59339 11.1916 7.66826 11.3787C7.74314 11.566 7.83674 11.6596 7.94905 11.6596C8.06136 11.6596 8.15379 11.5671 8.22634 11.3823C8.29884 11.1974 8.35383 10.9517 8.3913 10.6452C8.42873 10.3387 8.44744 10.0053 8.44744 9.6449V6.02281C8.77972 5.91986 9.05582 5.72565 9.27572 5.44018C9.49568 5.15472 9.60566 4.8248 9.60566 4.45042C9.60566 4.14624 9.53078 3.87014 9.38103 3.62211C9.23128 3.37409 9.03123 3.1752 8.7809 3.02545C8.53051 2.87569 8.25323 2.80082 7.94905 2.80082C7.64487 2.80082 7.36759 2.87569 7.11723 3.02545C6.86686 3.1752 6.6668 3.37409 6.51705 3.62211ZM6.99438 4.02924C6.99906 4.16964 7.05405 4.29248 7.15934 4.39778C7.26464 4.50307 7.38514 4.55572 7.52085 4.55572C7.66593 4.55572 7.78994 4.50307 7.89289 4.39778C7.99587 4.29248 8.04736 4.16964 8.04736 4.02924C8.04736 3.88886 7.99587 3.76485 7.89289 3.65721C7.78994 3.54958 7.66593 3.49576 7.52085 3.49576C7.38514 3.49576 7.26347 3.54958 7.15583 3.65721C7.0482 3.76485 6.99438 3.88886 6.99438 4.02924Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Mark_On_Map}}</p>
|
|
</div>
|
|
|
|
<div @click="contextHandle('forwardEMS')" class="w-full context-item h-[2.7778vh] rounded-[.2083vw] flex items-center gap-x-[.7813vw]">
|
|
<div class="w-[1.25vw] h-[2.2222vh] flex items-center justify-center">
|
|
<svg width=".625vw" height="1.2037vh" viewBox="0 0 12 13" fill="none">
|
|
<path d="M4.84107 5.84692L1.27779 7.90747C1.09405 8.01248 0.95624 8.11746 0.864369 8.22242C0.772498 8.32743 0.726562 8.44556 0.726562 8.57682C0.726562 8.73429 0.803122 8.94208 0.95624 9.20021L0.989051 9.25927C1.20342 9.63988 1.43091 9.83018 1.67152 9.83018C1.81589 9.83018 2.01276 9.75581 2.26212 9.60709L5.72697 7.60562L5.2873 7.36936V11.3789C5.2873 11.7332 5.35839 11.9738 5.50057 12.1007C5.64275 12.2276 5.89758 12.291 6.26507 12.291H6.35037C6.71348 12.291 6.96613 12.2276 7.10831 12.1007C7.25049 11.9738 7.32158 11.7332 7.32158 11.3789V7.36936L6.88191 7.60562L10.3468 9.60709C10.4649 9.67706 10.571 9.73064 10.665 9.76782C10.7591 9.805 10.8455 9.82359 10.9242 9.82359C11.0511 9.82359 11.167 9.77768 11.2721 9.68584C11.377 9.59396 11.4929 9.45397 11.6198 9.26586L11.6658 9.19362C11.8233 8.96179 11.902 8.76056 11.902 8.58992C11.902 8.45432 11.8539 8.33292 11.7576 8.22572C11.6614 8.11856 11.5192 8.01248 11.3311 7.90747L7.77438 5.84692V6.32596L11.3245 4.38355C11.5126 4.28293 11.6515 4.18012 11.7412 4.07513C11.8309 3.97013 11.8758 3.84983 11.8758 3.71421C11.8758 3.55671 11.8058 3.35329 11.6658 3.10392L11.6133 3.02517C11.3989 2.64894 11.1736 2.46083 10.9373 2.46083C10.7799 2.46083 10.5808 2.53082 10.3402 2.67082L6.88191 4.67885L7.32158 4.90853V0.912145C7.32158 0.557787 7.25049 0.317173 7.10831 0.190304C6.96613 0.0634346 6.71348 0 6.35037 0H6.26507C5.89758 0 5.64275 0.0634346 5.50057 0.190304C5.35839 0.317173 5.2873 0.557787 5.2873 0.912145V4.90853L5.72697 4.67885L2.26868 2.67082C2.15056 2.60082 2.039 2.54614 1.93401 2.50676C1.82901 2.46739 1.73277 2.4477 1.64527 2.4477C1.50965 2.4477 1.38825 2.49364 1.28107 2.58551C1.17389 2.67738 1.07217 2.82393 0.975926 3.02517L0.943116 3.09736C0.820621 3.36423 0.759374 3.57422 0.759374 3.72734C0.759374 3.85858 0.802028 3.97451 0.887337 4.07513C0.972645 4.17575 1.10936 4.28074 1.29747 4.39011L4.84107 6.32596V5.84692Z" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-[.625vw]">{{Config.DispatchLocales['UI'].Forward_EMS}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="w-full flex items-center mt-[.6vh] px-[.3125vw] justify-end gap-x-[.625vw]">
|
|
<p class="font-['Gilroy-SemiBold'] italic text-[.625vw] text-[#FFFFFF85]">{{Config.DispatchLocales['UI'].Close_Panel}}</p>
|
|
<div @click="closeDispatch" class="w-[3.0729vw] h-[2.7778vh] bg-opacity-[.39] cursor-pointer flex items-center justify-center bg-[#663131] rounded-[.3125vw] hover:scale-105 transition-all duration-200" style="box-shadow: 0px 0px 4.8px 0px #FF3838 inset;">
|
|
<p class="text-[.7813vw] font-['Gilroy-Bold']" style="
|
|
background: radial-gradient(103.1% 106.05% at 37.85% 23.61%, #FF4747 0%, rgba(255, 71, 71, 0.00) 100%);
|
|
background-clip: text;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
">{{setNui ? Config.DispatchLocales['UI'].ESC : Config.Keys.ShowDispatchsLabel}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</transition-group>
|
|
</div>
|
|
</div>
|
|
<script src="./js/app.js" type="module"></script>
|
|
</body>
|
|
</html> |