Hooke / map-demo

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
a8612cb4 1 parent e93686d7

fix 3D功能优化

Inline Side-by-side
Showing 4 changed files with 668 additions and 426 deletions
<!--
* @Date: 2023-07-27 11:04:04
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-07-31 18:23:08
* @LastEditTime: 2023-08-02 07:17:28
* @FilePath: /map-demo/src/components/Floor/index.vue
* @Description: 文件描述
-->
......@@ -12,23 +12,27 @@
<header class="codrops-header">
<h1>3D导航地图</h1>
</header>
<div style="position: relative;">
<div @click="onClose" style="position: absolute; z-index: 100; top: 1rem; right: 1rem; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: center;">
<div class="tool-bar">
<div @click="onClose" class="close icon">
<van-icon name="cross" size="1.25rem" />
</div>
<div @click="onSearch" style="position: absolute; z-index: 100; top: 2.75rem; right: 1rem; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: center;">
<div @click="onSearch" class="search-icon icon">
<van-icon name="search" size="1.25rem" />
</div>
<div v-if="level_show" style="position: absolute; z-index: 100; top: 4.5rem; right: 1rem; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: center;">
<span v-if="level_show < 4" @click="switchFloor('left')"><van-icon name="arrow-up" size="1.25rem" /></span>
<div v-if="level_show" class="switch-left icon">
<span v-if="level_show < 4" @click="switchFloor('left')">
<van-icon name="arrow-up" size="1.25rem" />
</span>
</div>
<div v-if="level_show" @click.native="onCloseLevel" style="position: absolute; z-index: 100; top: 6rem; right: 1rem; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: center;">
<div v-if="level_show" class="close-level icon" @click.native="onCloseLevel">
<span>
<van-icon name="points" size="1.25rem" />
</span>
</div>
<div v-if="level_show" style="position: absolute; z-index: 100; top: 8rem; right: 1rem; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; text-align: center;">
<span v-if="level_show > 1" @click="switchFloor('right')"><van-icon name="arrow-down" size="1.25rem" /></span>
<div v-if="level_show" class="switch-right icon">
<span v-if="level_show > 1" @click="switchFloor('right')">
<van-icon name="arrow-down" size="1.25rem" />
</span>
</div>
</div>
<div class="mall">
......@@ -36,395 +40,32 @@
<img class="surroundings__map" src="./surroundings.svg" alt="Surroundings" />
</div> -->
<div class="levels">
<div @click="onFloorClick(1)" class="level level--1" aria-label="Level 1">
<svg class="map map--1" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 1</title>
<polygon
points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41"
class="map__ground" />
<path
d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z"
class="map__outline" />
<path
d="M425.68,198.63c-6.85-14.83-46.38-30.35-58-11.24-41.24,67.9-83.63,118.16-65.12,124.22,7.55,2.48,56.77.11,94.11-54.39,21.35-31.13,31.71-52.74,29-58.59h0Z"
class="map__lake" />
<ellipse cx="389.64" cy="214.94" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="369.54" cy="191.71" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="354.59" cy="220.27" rx="13.95" ry="13.8" class="map__tree" />
<path
d="M724.87,696.45c14.61,7.58,42.34-6.42,52.85-26.15,24.57-46.13-43.25-126.94-61.66-120.57-7.5,2.6-6.47,29.34-4.4,82.81C713.74,686.25,719.12,693.46,724.87,696.45Z"
class="map__lake" />
<ellipse cx="738.82" cy="595.48" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="768.46" cy="605.4" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="744.64" cy="624.92" rx="13.95" ry="13.8" class="map__tree" />
<polygon data-space="1.04" points="874.9,554.3 874.9,422.9 1036.1,422.9 1036.1,576.6 965.2,576.6 965.2,555"
class="map__space" />
<rect x="854.08" y="639.79" width="88.09" height="147.62" class="map__space" />
<rect x="947.85" y="639.79" width="88.09" height="147.62" class="map__space" />
<polygon
points="768.46 722.99 789.65 735.1 789.65 759.31 768.46 771.42 747.27 759.31 747.27 735.1 768.46 722.99"
class="map__space" />
<rect x="666.88" y="565.62" width="26.26" height="25.99" class="map__space" />
<rect data-space="1.07" x="716.66" y="354.39" width="110.72" height="136.73" class="map__space" />
<rect x="602.1" y="354.39" width="110.72" height="136.73" class="map__space" />
<path data-space="1.05"
d="M454.76,266.19h63a24.34,24.34,0,0,1,24.47,24.21h0V489.82A24.34,24.34,0,0,1,517.74,514h-63a24.34,24.34,0,0,1-24.47-24.21h0V290.4a24.34,24.34,0,0,1,24.47-24.21h0Z"
class="map__space" />
<path d="M492.72,123.19c30.57,0,55.36-24.53,55.36-54.78H437.36C437.36,98.67,462.15,123.19,492.72,123.19Z"
class="map__space" />
<rect data-space="1.09" x="600" y="12.59" width="93.14" height="168.14" class="map__space" />
<rect data-space="1.08" x="698.07" y="12" width="93.14" height="168.14" class="map__space" />
<rect x="796.13" y="12" width="93.14" height="107.12" class="map__space" />
<rect x="894.18" y="12" width="93.14" height="107.12" class="map__space" />
<rect data-space="1.03" x="991.9" y="12" width="195.4" height="339.1" class="map__space" />
<rect x="602" y="278.06" width="385.71" height="72.46" class="map__space" />
<rect x="48.89" y="209.37" width="169.92" height="94.85" class="map__space" />
<rect data-space="1.02" x="49.12" y="110.57" width="254.49" height="94.85" class="map__space" />
<rect data-space="1.06" x="49.09" y="12.16" width="334.73" height="94.85" class="map__space" />
<polygon
points="898.12 182.42 919.31 194.53 919.31 218.74 898.12 230.85 876.93 218.74 876.93 194.53 898.12 182.42"
class="map__space" />
<polygon
points="49.18 309.14 218.94 309.14 218.94 358.1 277.46 358.1 277.46 474.63 11.72 474.63 11.72 365.63 49.18 365.63 49.18 309.14"
class="map__space" />
<polygon data-space="1.01"
points="12.72 685.56 153.78 685.56 153.78 747.64 215.44 747.64 215.44 712.85 263.89 712.85 263.89 787.41 12.72 787.41 12.72 685.56"
class="map__space" />
<rect x="48.08" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="94.01" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="139.5" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="48.3" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="94.24" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="139.72" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="282.3" y="478.13" width="26.26" height="25.99" class="map__space" />
<polygon
points="218.01 585.07 239.2 597.17 239.2 621.38 218.01 633.49 196.82 621.38 196.82 597.17 218.01 585.07"
class="map__space" />
<polygon points="410.01 601.42 358.8 778.44 320.06 767.07 372.92 591.6 410.01 601.42" class="map__space" />
<polygon points="561.3,603.9 624,777 661.9,763.2 597.7,591.5" class="map__space" />
</svg>
<div v-for="(level, index) in level_list" :key="index" @click="onFloorClick(index + 1)"
:class="['level', 'level--' + (index + 1)]">
<div v-html="level.svg"></div>
<div class="level__pins">
<a class="pin pin--1-1" data-category="1" data-space="1.01" aria-label="Pin for Apple Heart">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--appleheart">
<use xlink:href="#icon-appleheart"></use>
</svg>
</span>
</a>
<a class="pin pin--1-2" data-category="1" data-space="1.02" aria-label="Pin for Crazy Banana">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--bananas">
<use xlink:href="#icon-bananas"></use>
</svg>
</span>
</a>
<a class="pin pin--1-3" data-category="2" data-space="1.03" aria-label="Pin for Folding Life">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--origami">
<use xlink:href="#icon-origami"></use>
</svg>
</span>
</a>
<a class="pin pin--1-4" data-category="3" data-space="1.04" aria-label="Pin for Dress me not">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--dress">
<use xlink:href="#icon-dress"></use>
</svg>
</span>
</a>
<a class="pin pin--1-5" data-category="4" data-space="1.05" aria-label="Pin for Meditation Garden">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--tree2">
<use xlink:href="#icon-tree2"></use>
</svg>
</span>
</a>
<a class="pin pin--1-6" data-category="1" data-space="1.06" aria-label="Pin for Seed of Life">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--avocado">
<use xlink:href="#icon-avocado"></use>
</svg>
</span>
</a>
<a class="pin pin--1-7" data-category="1" data-space="1.07" aria-label="Pin for Raw Delight">
<a v-for="(item, index) in level.pin" :key="index" class="pin" :style="item.style"
:data-category="item.category" :data-space="item.space">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--cake">
<use xlink:href="#icon-cake"></use>
</svg>
</span>
</a>
<a class="pin pin--1-8" data-category="1" data-space="1.08" aria-label="Pin for The Wizard">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--mushroom">
<use xlink:href="#icon-mushroom"></use>
</svg>
</span>
</a>
<a class="pin pin--1-9" data-category="1" data-space="1.09"
aria-label="Pin for Smoothies &amp; Soul">
<span class="pin__icon">
<svg class="icon icon--pin">
<use xlink:href="#icon-pin"></use>
</svg>
<svg class="icon icon--logo icon--pear">
<use xlink:href="#icon-pear"></use>
<svg :class="['icon', 'icon--logo', `icon--${item.icon}`]">
<use :xlink:href='"#icon-" + item.icon'></use>
</svg>
</span>
</a>
</div>
<div class="level_after">L1</div>
<!-- /level__pins -->
</div>
<div @click="onFloorClick(2)" class="level level--2" aria-label="Level 2">
<svg class="map map--2" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 2</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<polygon points="768.46 722.99 789.65 735.1 789.65 759.31 768.46 771.42 747.27 759.31 747.27 735.1 768.46 722.99" class="map__space" />
<rect x="666.88" y="565.62" width="26.26" height="25.99" class="map__space" />
<path data-space="2.07" d="M454.76,266.19h63a24.34,24.34,0,0,1,24.47,24.21h0V489.82A24.34,24.34,0,0,1,517.74,514h-63a24.34,24.34,0,0,1-24.47-24.21h0V290.4a24.34,24.34,0,0,1,24.47-24.21h0Z" class="map__space" />
<path d="M492.72,123.19c30.57,0,55.36-24.53,55.36-54.78H437.36C437.36,98.67,462.15,123.19,492.72,123.19Z" class="map__space" />
<polygon points="898.12 182.42 919.31 194.53 919.31 218.74 898.12 230.85 876.93 218.74 876.93 194.53 898.12 182.42" class="map__space" />
<rect x="282.3" y="478.13" width="26.26" height="25.99" class="map__space" />
<polygon data-space="2.06" points="395.25 652.42 12.72 652.42 12.72 787.41 356.2 787.41 395.25 652.42" class="map__space" />
<rect data-space="2.02" x="12.72" y="366.5" width="157.39" height="212.11" class="map__space" />
<rect x="49.37" y="12.59" width="120.74" height="120.74" class="map__space" />
<rect data-space="2.01" x="177.56" y="12" width="240.03" height="121.33" class="map__space" />
<rect x="49.37" y="170.48" width="60.37" height="60.37" class="map__space" />
<rect x="49.37" y="238.6" width="278.23" height="111.92" class="map__space" />
<rect data-space="2.05" x="600" y="12" width="93.14" height="249.1" class="map__space" />
<rect x="702.59" y="12.59" width="484.68" height="98.51" class="map__space" />
<rect data-space="2.03" x="968.07" y="120.1" width="219.21" height="230.42" class="map__space" />
<rect x="855.37" y="277.6" width="103.7" height="72.92" class="map__space" />
<circle data-space="2.04" cx="680.68" cy="466.59" r="66.59" class="map__space" />
<rect data-space="2.08" x="855.37" y="423.16" width="180.58" height="364.25" class="map__space" />
<polygon points="627.81 787.41 716.09 787.41 716.09 646.58 576.88 646.58 627.81 787.41" class="map__space" />
</svg>
<div class="level__pins">
<a class="pin pin--2-1" data-category="1" data-space="2.01" aria-label="Pin for Grilled Chipotle">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--pepper"><use xlink:href="#icon-pepper"></use></svg>
</span>
</a>
<a class="pin pin--2-2" data-category="2" data-space="2.02" aria-label="Pin for Rocketship Tech">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--rocket"><use xlink:href="#icon-rocket"></use></svg>
</span>
</a>
<a class="pin pin--2-3" data-category="2" data-space="2.03" aria-label="Pin for Which Bug?">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--bug"><use xlink:href="#icon-bug"></use></svg>
</span>
</a>
<a class="pin pin--2-4" data-category="3" data-space="2.04" aria-label="Pin for Cognitio">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--books"><use xlink:href="#icon-books"></use></svg>
</span>
</a>
<a class="pin pin--2-5" data-category="1" data-space="2.05" aria-label="Pin for The Eggplanthead">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--eggplant"><use xlink:href="#icon-eggplant"></use></svg>
</span>
</a>
<a class="pin pin--2-6" data-category="1" data-space="2.06" aria-label="Pin for Superfood">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--strawberry"><use xlink:href="#icon-strawberry"></use></svg>
</span>
</a>
<a class="pin pin--2-7" data-category="3" data-space="2.07" aria-label="Pin for No Princess">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--heart"><use xlink:href="#icon-heart"></use></svg>
</span>
</a>
<a class="pin pin--2-8" data-category="3" data-space="2.08" aria-label="Pin for Tool Exchange">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--wrench"><use xlink:href="#icon-wrench"></use></svg>
</span>
</a>
</div>
<div class="level_after">L2</div>
</div>
<div @click="onFloorClick(3)" class="level level--3" aria-label="Level 3">
<svg class="map map--3" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 3</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<rect x="666.9" y="565.6" width="26.3" height="26" class="map__space" />
<path data-space="3.07" d="M454.8,266.2h63c13.4-0.1,24.4,10.8,24.5,24.2c0,0,0,0,0,0l0,0v199.4c-0.1,13.4-11.1,24.3-24.5,24.2h-63c-13.4,0.1-24.4-10.8-24.5-24.2c0,0,0,0,0,0l0,0V290.4C430.3,277,441.3,266.1,454.8,266.2C454.7,266.2,454.7,266.2,454.8,266.2L454.8,266.2L454.8,266.2z" class="map__space" />
<polygon points="898.1,182.4 919.3,194.5 919.3,218.7 898.1,230.9 876.9,218.7 876.9,194.5 " class="map__space" />
<rect x="282.3" y="478.1" width="26.3" height="26" class="map__space" />
<rect x="381.5" y="12.6" width="55.8" height="55.8" class="map__space" />
<rect x="566" y="12.6" width="110.6" height="110.6" class="map__space" />
<rect x="566" y="157.4" width="110.6" height="73.5" class="map__space" />
<rect x="742" y="12.6" width="445.3" height="110.6" class="map__space" />
<rect data-space="3.03" x="972.8" y="128.5" width="214.5" height="222" class="map__space" />
<rect x="756" y="423.2" width="279.9" height="161.2" class="map__space" />
<rect x="876.9" y="591.6" width="159" height="195.8" class="map__space" />
<polygon data-space="3.04" points="871.6,680 589.4,680 627.8,787.4 871.6,787.4 " class="map__space" />
<circle data-space="3.06" cx="735.7" cy="343.8" r="55.7" class="map__space" />
<rect x="12.7" y="696" width="91.4" height="91.4" class="map__space" />
<rect x="12.7" y="591.6" width="146.9" height="97.9" class="map__space" />
<rect data-space="3.02" x="12.7" y="366.5" width="146.9" height="217.9" class="map__space" />
<polygon data-space="3.05" points="356.2,787.4 414.9,584.4 275.1,584.4 275.1,787.4 " class="map__space" />
<rect data-space="3.01" x="49.4" y="12.6" width="312.7" height="343" class="map__space" />
</svg>
<div class="level__pins">
<a class="pin pin--3-1" data-category="1" data-space="3.01" aria-label="Pin for Oolong House">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--tea"><use xlink:href="#icon-tea"></use></svg>
</span>
</a>
<a class="pin pin--3-2" data-category="2" data-space="3.02" aria-label="Pin for Enlightend Path">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--pyramid"><use xlink:href="#icon-pyramid"></use></svg>
</span>
</a>
<a class="pin pin--3-3" data-category="3" data-space="3.03" aria-label="Pin for What makes us walk">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--shoe"><use xlink:href="#icon-shoe"></use></svg>
</span>
</a>
<a class="pin pin--3-4" data-category="3" data-space="3.04" aria-label="Pin for Your Last Shirt">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--shirt"><use xlink:href="#icon-shirt"></use></svg>
</span>
</a>
<a class="pin pin--3-5" data-category="4" data-space="3.05" aria-label="Pin for Breathe">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--tree"><use xlink:href="#icon-tree"></use></svg>
</span>
</a>
<a class="pin pin--3-6" data-category="4" data-space="3.06" aria-label="Pin for Feel the Grass">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--grass"><use xlink:href="#icon-grass"></use></svg>
</span>
</a>
<a class="pin pin--3-7" data-category="4" data-space="3.07" aria-label="Pin for Star Gazer">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--star"><use xlink:href="#icon-star"></use></svg>
</span>
</a>
</div>
<div class="level_after">L3</div>
</div>
<div @click="onFloorClick(4)" class="level level--4" aria-label="Level 4">
<svg class="map map--4" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 2</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<path d="M674.5,647c2,16.3,29.2,31.3,51.4,28.9c51.9-5.8,80.3-107.4,64.7-119c-6.4-4.7-27.9,11.2-70.8,43.1C676.6,632,673.7,640.5,674.5,647z" class="map__lake" />
<ellipse cx="738.82" cy="595.48" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="768.46" cy="605.4" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="744.64" cy="624.92" rx="13.95" ry="13.8" class="map__tree" />
<rect x="666.9" y="565.6" width="26.3" height="26" class="map__space" />
<path data-space="4.05" d="M454.8,266.2h63c13.4-0.1,24.4,10.8,24.5,24.2c0,0,0,0,0,0l0,0v199.4c-0.1,13.4-11.1,24.3-24.5,24.2h-63c-13.4,0.1-24.4-10.8-24.5-24.2c0,0,0,0,0,0l0,0V290.4C430.3,277,441.3,266.1,454.8,266.2C454.7,266.2,454.7,266.2,454.8,266.2L454.8,266.2L454.8,266.2z" class="map__space" />
<rect x="282.3" y="478.1" width="26.3" height="26" class="map__space" />
<rect x="12.7" y="366.5" width="202.4" height="175.1" class="map__space" />
<rect x="12.7" y="550.6" width="50.9" height="236.8" class="map__space" />
<circle data-space="4.07" cx="143.1" cy="708.1" r="49.5" class="map__space" />
<circle data-space="4.01" cx="288.6" cy="658.6" r="66" class="map__space" />
<polygon data-space="4.02" points="49.4,354.1 362.1,354.1 362.1,230.9 600,230.9 600,297.1 855.4,297.1 855.4,12.6 548.1,12.6 548.1,68.9 437.4,68.9 437.4,12.6 49.4,12.6 " class="map__space" />
<rect x="1065.6" y="12.6" width="121.7" height="110.5" class="map__space" />
<rect data-space="4.03" x="1065.6" y="132.1" width="121.7" height="218.4" class="map__space" />
<polygon points="901.3,92.6 886.9,67.8 901.3,43 929.9,43 944.2,67.8 929.9,92.6 " class="map__space" />
<polygon points="953.3,129.1 938.6,103.6 953.3,78.1 982.8,78.1 997.5,103.6 982.8,129.1 " class="map__space" />
<rect x="951.6" y="213.1" width="73.5" height="73.5" class="map__space" />
<rect data-space="4.06" x="639.6" y="399.5" width="151.5" height="121.1" class="map__space" />
<rect data-space="4.04" x="855.4" y="423.2" width="180.6" height="364.2" class="map__space" />
<polygon points="613.2,747 846.6,658.6 846.6,787.4 627.8,787.4" class="map__space" />
</svg>
<div class="level__pins">
<a class="pin pin--4-1" data-category="1" data-space="4.01" aria-label="Pin for Cold Soup Kitchen">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--tomato"><use xlink:href="#icon-tomato"></use></svg>
</span>
</a>
<a class="pin pin--4-2" data-category="2" data-space="4.02" aria-label="Pin for Docu Dome">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--cinema"><use xlink:href="#icon-cinema"></use></svg>
</span>
</a>
<a class="pin pin--4-3" data-category="3" data-space="4.03" aria-label="Pin for Little Artist">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--paint-brush"><use xlink:href="#icon-paint-brush"></use></svg>
</span>
</a>
<a class="pin pin--4-4" data-category="4" data-space="4.04" aria-label="Pin for Sacred Symmetry">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--modx"><use xlink:href="#icon-modx"></use></svg>
</span>
</a>
<a class="pin pin--4-5" data-category="4" data-space="4.05" aria-label="Pin for Hot Tub Festival">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--droplet"><use xlink:href="#icon-droplet"></use></svg>
</span>
</a>
<a class="pin pin--4-6" data-category="2" data-space="4.06" aria-label="Pin for Love 2 Cook">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--cupcake"><use xlink:href="#icon-cupcake"></use></svg>
</span>
</a>
<a class="pin pin--4-7" data-category="2" data-space="4.07" aria-label="Pin for Permaculture Hub">
<span class="pin__icon">
<svg class="icon icon--pin"><use xlink:href="#icon-pin"></use></svg>
<svg class="icon icon--logo icon--leafcircle"><use xlink:href="#icon-leafcircle"></use></svg>
</span>
</a>
</div>
<div class="level_after">L4</div>
<div class="level_after">L{{ index + 1 }}</div>
</div>
</div>
</div>
</div>
</div>
<van-popup v-model:show="show_popup" position="bottom" :overlay="false" :style="{ height: '50%', background: '#FFF' }">
<div @click="show_popup=false" style="text-align: right; padding: 1rem;">
<van-popup v-model:show="show_popup" position="bottom" :overlay="false"
:style="{ height: '50%', background: '#FFF' }">
<div @click="onClosePopup" style="text-align: right; padding: 1rem;">
<van-icon name="cross" size="1.5rem" />
</div>
<div style="margin: 0 1rem">
......@@ -437,35 +78,18 @@
<svg-icon></svg-icon>
<van-popup v-model:show="show_search_popup" position="right" :overlay="true" :style="{ height: '100%', width: '80%', background: '#FFF' }">
<van-popup v-model:show="show_search_popup" position="right" :overlay="true"
:style="{ height: '100%', width: '80%', background: '#FFF' }">
<div style="background-color: #F7f8fa; padding: 1rem;">
<van-field v-model="search_value" placeholder="请输入搜索关键词" style="border-radius: 5px; padding: 0.5rem 1rem;" />
</div>
<div class="search_box">
<div class="search_box_title">4-客房</div>
<div>
<van-row @click="onSearchRow(4.01)" style="color: #aaa; margin-bottom: 0.5rem;">
<van-col span="20">401～410室</van-col>
<van-col span="4" style="text-align: right;">L1</van-col>
<div v-for="(item, index) in search_list" :key="index" class="search_box">
<div class="search_box_title">{{ item.title }}</div>
<van-row v-for="(x, idx) in item.list" :key="idx" @click="onSearchRow(x.space)"
style="color: #aaa; margin-bottom: 0.5rem;">
<van-col span="20">{{ x.text }}</van-col>
<van-col span="4" style="text-align: right;">{{ x.floor }}</van-col>
</van-row>
<van-row @click="onSearchRow(4.02)" style="color: #aaa; margin-bottom: 0.5rem;">
<van-col span="20">411～419室</van-col>
<van-col span="4" style="text-align: right;">L1</van-col>
</van-row>
</div>
</div>
<div style="padding: 1rem;">
<div style="color: #000; margin-bottom: 1rem; font-size: 1.15rem;">3-客房</div>
<div>
<van-row @click="onSearchRow(3.01)" style="color: #aaa; margin-bottom: 0.5rem;">
<van-col span="20">301～310室</van-col>
<van-col span="4" style="text-align: right;">L1</van-col>
</van-row>
<van-row @click="onSearchRow(3.02)" style="color: #aaa; margin-bottom: 0.5rem;">
<van-col span="20">311～319室</van-col>
<van-col span="4" style="text-align: right;">L1</van-col>
</van-row>
</div>
</div>
</van-popup>
</div>
......@@ -475,6 +99,7 @@
import './floor.css';
import $ from 'jquery';
import SvgIcon from './svgIcon.vue'
import Data from './pin'
export default {
data() {
......@@ -483,6 +108,39 @@ export default {
search_value: '',
show_popup: false,
show_search_popup: false,
level_list: Data,
search_list: [
{
title: '1-客房',
list: [
{
space: 1.01,
text: '101～110室',
floor: 'L1'
},
{
space: 1.02,
text: '111～119室',
floor: 'L1'
},
],
},
{
title: '2-客房',
list: [
{
space: 2.01,
text: '201～210室',
floor: 'L2'
},
{
space: 2.02,
text: '211～219室',
floor: 'L2'
},
],
},
]
}
},
async mounted() {
......@@ -494,7 +152,7 @@ export default {
});
},
methods: {
clearPinShow () {
clearPinShow() {
$('.level__pins').children('.pin').each((index, ele) => {
$(ele).removeClass('pin--active');
})
......@@ -506,7 +164,7 @@ export default {
$(`.level--${level}`).addClass('level--current');
$(`.level--${level} .level__pins`).addClass('level__pins--active');
},
onCloseLevel () {
onCloseLevel() {
this.show_popup = false;
let level = this.level_show;
$('.mall').removeClass('mall--content-open');
......@@ -516,13 +174,14 @@ export default {
this.level_show = '';
this.clearPinShow();
},
onClose () {
this.$emit('close')
onClose() {
this.onCloseLevel();
this.$emit('close');
},
onClickCloseIcon () {
onClickCloseIcon() {
this.clearPinShow();
},
switchFloor (type) { // 切换楼层
switchFloor(type) { // 切换楼层
let level = this.level_show;
if (type === 'right') {
level = level - 1 < 1 ? 1 : level - 1;
......@@ -533,10 +192,10 @@ export default {
this.onCloseLevel();
this.onFloorClick(level);
},
onSearch () {
onSearch() {
this.show_search_popup = true;
},
onSearchRow (val) {
onSearchRow(val) {
// 清空图层显示
this.onCloseLevel();
this.show_popup = false;
......@@ -561,24 +220,70 @@ export default {
}, 500);
// 关闭搜索弹框
this.show_search_popup = false;
},
onClosePopup() {
this.show_popup = false;
this.clearPinShow();
}
}
}
</script>
<style lang="less" scoped>
.test {
.test {
opacity: 0;
}
}
.search_box {
.search_box {
padding: 1rem;
.search_box_title {
color: #000; margin-bottom: 1rem; font-size: 1.15rem;
color: #000;
margin-bottom: 1rem;
font-size: 1.15rem;
}
}
.tool-bar {
position: relative;
.icon {
position: absolute;
z-index: 100;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
text-align: center;
}
.level_after {
.close {
top: 1rem;
right: 1rem;
}
.search-icon {
top: 2.75rem;
right: 1rem;
}
.switch-left {
top: 4.5rem;
right: 1rem;
}
.close-level {
top: 6rem;
right: 1rem;
}
.switch-right {
top: 8rem;
right: 1rem;
}
}
.level_after {
font-size: 0.75rem;
line-height: 0;
position: absolute;
......@@ -593,13 +298,13 @@ export default {
transition: transform 1s, color 0.3s;
-webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
}
}
.level--current {
.level--current {
.level_after {
font-size: 1rem;
-webkit-transform: rotateZ(25deg) rotateX(-60deg) translateZ(15vmin);
transform: rotateZ(25deg) rotateX(-60deg) translateZ(15vmin);
}
}
}
</style>
......
/*
* @Date: 2023-08-01 13:55:03
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-08-01 16:12:24
* @FilePath: /map-demo/src/components/Floor/pin.js
* @Description: 文件描述
*/
const testInfo = [
{
svg: `
<svg class="map map--1" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 1</title>
<polygon
points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41"
class="map__ground" />
<path
d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z"
class="map__outline" />
<path
d="M425.68,198.63c-6.85-14.83-46.38-30.35-58-11.24-41.24,67.9-83.63,118.16-65.12,124.22,7.55,2.48,56.77.11,94.11-54.39,21.35-31.13,31.71-52.74,29-58.59h0Z"
class="map__lake" />
<ellipse cx="389.64" cy="214.94" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="369.54" cy="191.71" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="354.59" cy="220.27" rx="13.95" ry="13.8" class="map__tree" />
<path
d="M724.87,696.45c14.61,7.58,42.34-6.42,52.85-26.15,24.57-46.13-43.25-126.94-61.66-120.57-7.5,2.6-6.47,29.34-4.4,82.81C713.74,686.25,719.12,693.46,724.87,696.45Z"
class="map__lake" />
<ellipse cx="738.82" cy="595.48" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="768.46" cy="605.4" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="744.64" cy="624.92" rx="13.95" ry="13.8" class="map__tree" />
<polygon data-space="1.04" points="874.9,554.3 874.9,422.9 1036.1,422.9 1036.1,576.6 965.2,576.6 965.2,555"
class="map__space" />
<rect x="854.08" y="639.79" width="88.09" height="147.62" class="map__space" />
<rect x="947.85" y="639.79" width="88.09" height="147.62" class="map__space" />
<polygon
points="768.46 722.99 789.65 735.1 789.65 759.31 768.46 771.42 747.27 759.31 747.27 735.1 768.46 722.99"
class="map__space" />
<rect x="666.88" y="565.62" width="26.26" height="25.99" class="map__space" />
<rect data-space="1.07" x="716.66" y="354.39" width="110.72" height="136.73" class="map__space" />
<rect x="602.1" y="354.39" width="110.72" height="136.73" class="map__space" />
<path data-space="1.05"
d="M454.76,266.19h63a24.34,24.34,0,0,1,24.47,24.21h0V489.82A24.34,24.34,0,0,1,517.74,514h-63a24.34,24.34,0,0,1-24.47-24.21h0V290.4a24.34,24.34,0,0,1,24.47-24.21h0Z"
class="map__space" />
<path d="M492.72,123.19c30.57,0,55.36-24.53,55.36-54.78H437.36C437.36,98.67,462.15,123.19,492.72,123.19Z"
class="map__space" />
<rect data-space="1.09" x="600" y="12.59" width="93.14" height="168.14" class="map__space" />
<rect data-space="1.08" x="698.07" y="12" width="93.14" height="168.14" class="map__space" />
<rect x="796.13" y="12" width="93.14" height="107.12" class="map__space" />
<rect x="894.18" y="12" width="93.14" height="107.12" class="map__space" />
<rect data-space="1.03" x="991.9" y="12" width="195.4" height="339.1" class="map__space" />
<rect x="602" y="278.06" width="385.71" height="72.46" class="map__space" />
<rect x="48.89" y="209.37" width="169.92" height="94.85" class="map__space" />
<rect data-space="1.02" x="49.12" y="110.57" width="254.49" height="94.85" class="map__space" />
<rect data-space="1.06" x="49.09" y="12.16" width="334.73" height="94.85" class="map__space" />
<polygon
points="898.12 182.42 919.31 194.53 919.31 218.74 898.12 230.85 876.93 218.74 876.93 194.53 898.12 182.42"
class="map__space" />
<polygon
points="49.18 309.14 218.94 309.14 218.94 358.1 277.46 358.1 277.46 474.63 11.72 474.63 11.72 365.63 49.18 365.63 49.18 309.14"
class="map__space" />
<polygon data-space="1.01"
points="12.72 685.56 153.78 685.56 153.78 747.64 215.44 747.64 215.44 712.85 263.89 712.85 263.89 787.41 12.72 787.41 12.72 685.56"
class="map__space" />
<rect x="48.08" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="94.01" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="139.5" y="501.73" width="35.61" height="35.23" class="map__space" />
<rect x="48.3" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="94.24" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="139.72" y="547.25" width="35.61" height="35.23" class="map__space" />
<rect x="282.3" y="478.13" width="26.26" height="25.99" class="map__space" />
<polygon
points="218.01 585.07 239.2 597.17 239.2 621.38 218.01 633.49 196.82 621.38 196.82 597.17 218.01 585.07"
class="map__space" />
<polygon points="410.01 601.42 358.8 778.44 320.06 767.07 372.92 591.6 410.01 601.42" class="map__space" />
<polygon points="561.3,603.9 624,777 661.9,763.2 597.7,591.5" class="map__space" />
</svg>
`,
pin: [
{
id: 'pin--1-1',
category: 1,
space: 1.01,
icon: 'appleheart',
style: { top: '60vmin', left: '8vmin' },
},
{
id: 'pin--1-2',
category: 1,
space: 1.02,
icon: 'bananas',
style: { top: '15vmin', left: '15vmin' },
},
{
id: 'pin--1-3',
category: 2,
space: 1.03,
icon: 'origami',
style: { top: '15vmin', left: '88vmin' },
},
{
id: 'pin--1-4',
category: 3,
space: 1.04,
icon: 'dress',
style: { top: '40vmin', left: '77vmin' },
},
{
id: 'pin--1-5',
category: 4,
space: 1.05,
icon: 'tree2',
style: { top: '33vmin', left: '38vmin' },
},
{
id: 'pin--1-6',
category: 1,
space: 1.06,
icon: 'avocado',
style: { top: '6vmin', left: '27vmin' },
},
{
id: 'pin--1-7',
category: 1,
space: 1.07,
icon: 'cake',
style: { top: '36vmin', left: '61vmin' },
},
{
id: 'pin--1-8',
category: 1,
space: 1.08,
icon: 'mushroom',
style: { top: '9vmin', left: '59vmin' },
},
{
id: 'pin--1-9',
category: 1,
space: 1.09,
icon: 'pear',
style: { top: '8vmin', left: '51vmin' },
},
],
},
{
svg: `
<svg class="map map--2" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 2</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<polygon points="768.46 722.99 789.65 735.1 789.65 759.31 768.46 771.42 747.27 759.31 747.27 735.1 768.46 722.99" class="map__space" />
<rect x="666.88" y="565.62" width="26.26" height="25.99" class="map__space" />
<path data-space="2.07" d="M454.76,266.19h63a24.34,24.34,0,0,1,24.47,24.21h0V489.82A24.34,24.34,0,0,1,517.74,514h-63a24.34,24.34,0,0,1-24.47-24.21h0V290.4a24.34,24.34,0,0,1,24.47-24.21h0Z" class="map__space" />
<path d="M492.72,123.19c30.57,0,55.36-24.53,55.36-54.78H437.36C437.36,98.67,462.15,123.19,492.72,123.19Z" class="map__space" />
<polygon points="898.12 182.42 919.31 194.53 919.31 218.74 898.12 230.85 876.93 218.74 876.93 194.53 898.12 182.42" class="map__space" />
<rect x="282.3" y="478.13" width="26.26" height="25.99" class="map__space" />
<polygon data-space="2.06" points="395.25 652.42 12.72 652.42 12.72 787.41 356.2 787.41 395.25 652.42" class="map__space" />
<rect data-space="2.02" x="12.72" y="366.5" width="157.39" height="212.11" class="map__space" />
<rect x="49.37" y="12.59" width="120.74" height="120.74" class="map__space" />
<rect data-space="2.01" x="177.56" y="12" width="240.03" height="121.33" class="map__space" />
<rect x="49.37" y="170.48" width="60.37" height="60.37" class="map__space" />
<rect x="49.37" y="238.6" width="278.23" height="111.92" class="map__space" />
<rect data-space="2.05" x="600" y="12" width="93.14" height="249.1" class="map__space" />
<rect x="702.59" y="12.59" width="484.68" height="98.51" class="map__space" />
<rect data-space="2.03" x="968.07" y="120.1" width="219.21" height="230.42" class="map__space" />
<rect x="855.37" y="277.6" width="103.7" height="72.92" class="map__space" />
<circle data-space="2.04" cx="680.68" cy="466.59" r="66.59" class="map__space" />
<rect data-space="2.08" x="855.37" y="423.16" width="180.58" height="364.25" class="map__space" />
<polygon points="627.81 787.41 716.09 787.41 716.09 646.58 576.88 646.58 627.81 787.41" class="map__space" />
</svg>
`,
pin: [
{
id: 'pin--2-1',
category: 1,
space: 2.01,
icon: 'pepper',
style: { top: '7vmin', left: '22vmin' },
},
{
id: 'pin--2-2',
category: 1,
space: 2.02,
icon: 'rocket',
style: { top: '39vmin', left: '5vmin' },
},
{
id: 'pin--2-3',
category: 2,
space: 2.03,
icon: 'bug',
style: { top: '21vmin', left: '84vmin' },
},
{
id: 'pin--2-4',
category: 3,
space: 2.04,
icon: 'books',
style: { top: '39vmin', left: '53vmin' },
},
{
id: 'pin--2-5',
category: 4,
space: 2.05,
icon: 'eggplant',
style: { top: '14vmin', left: '50vmin' },
},
{
id: 'pin--2-6',
category: 1,
space: 2.06,
icon: 'strawberry',
style: { top: '60vmin', left: '15vmin' },
},
{
id: 'pin--2-7',
category: 1,
space: 2.07,
icon: 'heart',
style: { top: '34vmin', left: '37vmin' },
},
{
id: 'pin--2-8',
category: 1,
space: 2.08,
icon: 'wrench',
style: { top: '52vmin', left: '74vmin' },
},
],
},
{
svg: `
<svg class="map map--3" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 3</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<rect x="666.9" y="565.6" width="26.3" height="26" class="map__space" />
<path data-space="3.07" d="M454.8,266.2h63c13.4-0.1,24.4,10.8,24.5,24.2c0,0,0,0,0,0l0,0v199.4c-0.1,13.4-11.1,24.3-24.5,24.2h-63c-13.4,0.1-24.4-10.8-24.5-24.2c0,0,0,0,0,0l0,0V290.4C430.3,277,441.3,266.1,454.8,266.2C454.7,266.2,454.7,266.2,454.8,266.2L454.8,266.2L454.8,266.2z" class="map__space" />
<polygon points="898.1,182.4 919.3,194.5 919.3,218.7 898.1,230.9 876.9,218.7 876.9,194.5 " class="map__space" />
<rect x="282.3" y="478.1" width="26.3" height="26" class="map__space" />
<rect x="381.5" y="12.6" width="55.8" height="55.8" class="map__space" />
<rect x="566" y="12.6" width="110.6" height="110.6" class="map__space" />
<rect x="566" y="157.4" width="110.6" height="73.5" class="map__space" />
<rect x="742" y="12.6" width="445.3" height="110.6" class="map__space" />
<rect data-space="3.03" x="972.8" y="128.5" width="214.5" height="222" class="map__space" />
<rect x="756" y="423.2" width="279.9" height="161.2" class="map__space" />
<rect x="876.9" y="591.6" width="159" height="195.8" class="map__space" />
<polygon data-space="3.04" points="871.6,680 589.4,680 627.8,787.4 871.6,787.4 " class="map__space" />
<circle data-space="3.06" cx="735.7" cy="343.8" r="55.7" class="map__space" />
<rect x="12.7" y="696" width="91.4" height="91.4" class="map__space" />
<rect x="12.7" y="591.6" width="146.9" height="97.9" class="map__space" />
<rect data-space="3.02" x="12.7" y="366.5" width="146.9" height="217.9" class="map__space" />
<polygon data-space="3.05" points="356.2,787.4 414.9,584.4 275.1,584.4 275.1,787.4 " class="map__space" />
<rect data-space="3.01" x="49.4" y="12.6" width="312.7" height="343" class="map__space" />
</svg>
`,
pin: [
{
id: 'pin--3-1',
category: 1,
space: 3.01,
icon: 'tea',
style: { top: '17vmin', left: '15vmin' },
},
{
id: 'pin--3-2',
category: 1,
space: 3.02,
icon: 'pyramid',
style: { top: '42vmin', left: '5vmin' },
},
{
id: 'pin--3-3',
category: 2,
space: 3.03,
icon: 'shoe',
style: { top: '19vmin', left: '85vmin' },
},
{
id: 'pin--3-4',
category: 3,
space: 3.04,
icon: 'shirt',
style: { top: '61vmin', left: '57vmin' },
},
{
id: 'pin--3-5',
category: 4,
space: 3.05,
icon: 'tree',
style: { top: '58vmin', left: '25vmin' },
},
{
id: 'pin--3-6',
category: 1,
space: 3.06,
icon: 'grass',
style: { top: '30vmin', left: '57vmin' },
},
{
id: 'pin--3-7',
category: 1,
space: 3.07,
icon: 'star',
style: { top: '32vmin', left: '37vmin' },
},
],
},
{
svg: `
<svg class="map map--4" viewBox="0 0 1200 800" width="100%" height="100%" preserveAspectRatio="xMidYMid meet">
<title>Map Level 2</title>
<polygon points="1035.94 787.41 1035.94 423.16 855.37 423.16 855.37 350.52 1187.28 350.52 1187.28 12.59 548.09 12.59 548.09 68.87 437.36 68.87 437.36 12.59 49.37 12.59 49.37 366.5 12.72 366.5 12.72 787.41 356.2 787.41 414.93 584.41 554.4 584.41 627.81 787.41 1035.94 787.41" class="map__ground" />
<path d="M1187.28,12.59V350.52H855.37v72.64h180.58V787.41H627.81l-73.41-203H414.93l-58.73,203H12.72V366.5H49.37V12.59h388V68.87H548.08V12.59h639.19M1200,0H535.36V56.28H450.09V0H36.65V353.91H0V800H365.8l2.64-9.13L424.52,597H545.44l70.39,194.65,3,8.35h429.82V410.57H868.09V363.11H1200V0h0Z" class="map__outline" />
<path d="M674.5,647c2,16.3,29.2,31.3,51.4,28.9c51.9-5.8,80.3-107.4,64.7-119c-6.4-4.7-27.9,11.2-70.8,43.1C676.6,632,673.7,640.5,674.5,647z" class="map__lake" />
<ellipse cx="738.82" cy="595.48" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="768.46" cy="605.4" rx="13.95" ry="13.8" class="map__tree" />
<ellipse cx="744.64" cy="624.92" rx="13.95" ry="13.8" class="map__tree" />
<rect x="666.9" y="565.6" width="26.3" height="26" class="map__space" />
<path data-space="4.05" d="M454.8,266.2h63c13.4-0.1,24.4,10.8,24.5,24.2c0,0,0,0,0,0l0,0v199.4c-0.1,13.4-11.1,24.3-24.5,24.2h-63c-13.4,0.1-24.4-10.8-24.5-24.2c0,0,0,0,0,0l0,0V290.4C430.3,277,441.3,266.1,454.8,266.2C454.7,266.2,454.7,266.2,454.8,266.2L454.8,266.2L454.8,266.2z" class="map__space" />
<rect x="282.3" y="478.1" width="26.3" height="26" class="map__space" />
<rect x="12.7" y="366.5" width="202.4" height="175.1" class="map__space" />
<rect x="12.7" y="550.6" width="50.9" height="236.8" class="map__space" />
<circle data-space="4.07" cx="143.1" cy="708.1" r="49.5" class="map__space" />
<circle data-space="4.01" cx="288.6" cy="658.6" r="66" class="map__space" />
<polygon data-space="4.02" points="49.4,354.1 362.1,354.1 362.1,230.9 600,230.9 600,297.1 855.4,297.1 855.4,12.6 548.1,12.6 548.1,68.9 437.4,68.9 437.4,12.6 49.4,12.6 " class="map__space" />
<rect x="1065.6" y="12.6" width="121.7" height="110.5" class="map__space" />
<rect data-space="4.03" x="1065.6" y="132.1" width="121.7" height="218.4" class="map__space" />
<polygon points="901.3,92.6 886.9,67.8 901.3,43 929.9,43 944.2,67.8 929.9,92.6 " class="map__space" />
<polygon points="953.3,129.1 938.6,103.6 953.3,78.1 982.8,78.1 997.5,103.6 982.8,129.1 " class="map__space" />
<rect x="951.6" y="213.1" width="73.5" height="73.5" class="map__space" />
<rect data-space="4.06" x="639.6" y="399.5" width="151.5" height="121.1" class="map__space" />
<rect data-space="4.04" x="855.4" y="423.2" width="180.6" height="364.2" class="map__space" />
<polygon points="613.2,747 846.6,658.6 846.6,787.4 627.8,787.4" class="map__space" />
</svg>
`,
pin: [
{
id: 'pin--4-1',
category: 1,
space: 4.01,
icon: 'tomato',
style: { top: '55vmin', left: '21vmin' },
},
{
id: 'pin--4-2',
category: 1,
space: 4.02,
icon: 'cinema',
style: { top: '18vmin', left: '20vmin' },
},
{
id: 'pin--4-3',
category: 2,
space: 4.03,
icon: 'paint-brush',
style: { top: '21vmin', left: '88vmin' },
},
{
id: 'pin--4-4',
category: 3,
space: 4.04,
icon: 'modx',
style: { top: '52vmin', left: '74vmin' },
},
{
id: 'pin--4-5',
category: 4,
space: 4.05,
icon: 'droplet',
style: { top: '33vmin', left: '38vmin' },
},
{
id: 'pin--4-6',
category: 1,
space: 4.06,
icon: 'cupcake',
style: { top: '39vmin', left: '56vmin' },
},
{
id: 'pin--4-7',
category: 1,
space: 4.07,
icon: 'leafcircle',
style: { top: '58vmin', left: '10vmin' },
},
],
},
];
export default testInfo;
......@@ -59,7 +59,7 @@
v-model:show="showPopup"
position="bottom"
:overlay="true"
:style="{ height: '90%' }"
:style="{ height: '100%' }"
teleport="body"
>
<van-icon name="cross" size="1.35rem" @click="showPopup = false" style="float: right; color: gray; margin-right: 1rem; margin-top: 1rem;" />
......
......@@ -149,6 +149,11 @@
dependencies:
"@types/sizzle" "*"
"@types/json-schema@^7.0.8":
version "7.0.12"
resolved "https://mirrors.cloud.tencent.com/npm/@types/json-schema/-/json-schema-7.0.12.tgz#d70faba7039d5fca54c83c7dbab41051d2b6f6cb"
integrity sha512-Hr5Jfhc9eYOQNPYO5WLDq/n4jqijdHNlDXjuAQkkt+mWdQR+XJToOHrsD4cPaMXpn6KO7y2+wM8AZEs8VpBLVA==
"@types/lodash@^4.14.182":
version "4.14.182"
resolved "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.182.tgz"
......@@ -454,6 +459,21 @@ aggregate-error@^3.0.0:
clean-stack "^2.0.0"
indent-string "^4.0.0"
ajv-keywords@^3.1.0, ajv-keywords@^3.5.2:
version "3.5.2"
resolved "https://mirrors.cloud.tencent.com/npm/ajv-keywords/-/ajv-keywords-3.5.2.tgz#31f29da5ab6e00d1c2d329acf7b5929614d5014d"
integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==
ajv@^6.1.0, ajv@^6.12.5:
version "6.12.6"
resolved "https://mirrors.cloud.tencent.com/npm/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==
dependencies:
fast-deep-equal "^3.1.1"
fast-json-stable-stringify "^2.0.0"
json-schema-traverse "^0.4.1"
uri-js "^4.2.2"
animate.css@^4.1.1:
version "4.1.1"
resolved "https://registry.npmjs.org/animate.css/-/animate.css-4.1.1.tgz"
......@@ -580,6 +600,11 @@ axios@^0.27.2:
follow-redirects "^1.14.9"
form-data "^4.0.0"
babel-plugin-syntax-dynamic-import@^6.18.0:
version "6.18.0"
resolved "https://mirrors.cloud.tencent.com/npm/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz#8d6a26229c83745a9982a441051572caa179b1da"
integrity sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=
balanced-match@^1.0.0:
version "1.0.2"
resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz"
......@@ -602,6 +627,11 @@ bcrypt-pbkdf@^1.0.0:
dependencies:
tweetnacl "^0.14.3"
big.js@^5.2.2:
version "5.2.2"
resolved "https://mirrors.cloud.tencent.com/npm/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
integrity sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==
binary-extensions@^2.0.0:
version "2.2.0"
resolved "https://mirrors.cloud.tencent.com/npm/binary-extensions/-/binary-extensions-2.2.0.tgz"
......@@ -1083,6 +1113,11 @@ emoji-regex@^8.0.0:
resolved "https://mirrors.cloud.tencent.com/npm/emoji-regex/-/emoji-regex-8.0.0.tgz"
integrity sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==
emojis-list@^3.0.0:
version "3.0.0"
resolved "https://mirrors.cloud.tencent.com/npm/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
end-of-stream@^1.1.0:
version "1.4.4"
resolved "https://mirrors.cloud.tencent.com/npm/end-of-stream/-/end-of-stream-1.4.4.tgz"
......@@ -1372,6 +1407,11 @@ extsprintf@1.3.0, extsprintf@^1.2.0:
resolved "https://mirrors.cloud.tencent.com/npm/extsprintf/-/extsprintf-1.3.0.tgz"
integrity sha1-lpGEQOMEGnpBT4xS48V06zw+HgU=
fast-deep-equal@^3.1.1:
version "3.1.3"
resolved "https://mirrors.cloud.tencent.com/npm/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
fast-glob@^3.2.11, fast-glob@^3.2.12, fast-glob@^3.2.9:
version "3.2.12"
resolved "https://mirrors.cloud.tencent.com/npm/fast-glob/-/fast-glob-3.2.12.tgz"
......@@ -1383,6 +1423,11 @@ fast-glob@^3.2.11, fast-glob@^3.2.12, fast-glob@^3.2.9:
merge2 "^1.3.0"
micromatch "^4.0.4"
fast-json-stable-stringify@^2.0.0:
version "2.1.0"
resolved "https://mirrors.cloud.tencent.com/npm/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
fastq@^1.6.0:
version "1.15.0"
resolved "https://mirrors.cloud.tencent.com/npm/fastq/-/fastq-1.15.0.tgz"
......@@ -1843,6 +1888,11 @@ jsbn@~0.1.0:
resolved "https://mirrors.cloud.tencent.com/npm/jsbn/-/jsbn-0.1.1.tgz"
integrity sha1-peZUwuWi3rXyAdls77yoDA7y9RM=
json-schema-traverse@^0.4.1:
version "0.4.1"
resolved "https://mirrors.cloud.tencent.com/npm/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
integrity sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==
json-schema@0.4.0:
version "0.4.0"
resolved "https://mirrors.cloud.tencent.com/npm/json-schema/-/json-schema-0.4.0.tgz"
......@@ -1853,6 +1903,18 @@ json-stringify-safe@~5.0.1:
resolved "https://mirrors.cloud.tencent.com/npm/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
integrity sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=
json5@^1.0.1:
version "1.0.2"
resolved "https://mirrors.cloud.tencent.com/npm/json5/-/json5-1.0.2.tgz#63d98d60f21b313b77c4d6da18bfa69d80e1d593"
integrity sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==
dependencies:
minimist "^1.2.0"
json5@^2.1.2:
version "2.2.3"
resolved "https://mirrors.cloud.tencent.com/npm/json5/-/json5-2.2.3.tgz#78cd6f1a19bdc12b73db5ad0c61efd66c1e29283"
integrity sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==
jsonc-parser@^3.2.0:
version "3.2.0"
resolved "https://mirrors.cloud.tencent.com/npm/jsonc-parser/-/jsonc-parser-3.2.0.tgz"
......@@ -1925,6 +1987,24 @@ listr2@^3.8.3:
through "^2.3.8"
wrap-ansi "^7.0.0"
loader-utils@^1.0.0, loader-utils@^1.4.0:
version "1.4.2"
resolved "https://mirrors.cloud.tencent.com/npm/loader-utils/-/loader-utils-1.4.2.tgz#29a957f3a63973883eb684f10ffd3d151fec01a3"
integrity sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==
dependencies:
big.js "^5.2.2"
emojis-list "^3.0.0"
json5 "^1.0.1"
loader-utils@^2.0.0:
version "2.0.4"
resolved "https://mirrors.cloud.tencent.com/npm/loader-utils/-/loader-utils-2.0.4.tgz#8b5cb38b5c34a9a018ee1fc0e6a066d1dfcc528c"
integrity sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==
dependencies:
big.js "^5.2.2"
emojis-list "^3.0.0"
json5 "^2.1.2"
local-pkg@^0.4.1, local-pkg@^0.4.3:
version "0.4.3"
resolved "https://mirrors.cloud.tencent.com/npm/local-pkg/-/local-pkg-0.4.3.tgz"
......@@ -2099,6 +2179,11 @@ minimatch@^7.4.2:
dependencies:
brace-expansion "^2.0.1"
minimist@^1.2.0:
version "1.2.8"
resolved "https://mirrors.cloud.tencent.com/npm/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
minimist@^1.2.6:
version "1.2.6"
resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz"
......@@ -2378,6 +2463,11 @@ pathval@^1.1.1:
resolved "https://mirrors.cloud.tencent.com/npm/pathval/-/pathval-1.1.1.tgz"
integrity sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==
pdfjs-dist@2.6.347:
version "2.6.347"
resolved "https://mirrors.cloud.tencent.com/npm/pdfjs-dist/-/pdfjs-dist-2.6.347.tgz#f257ed66e83be900cd0fd28524a2187fb9e25cd5"
integrity sha512-QC+h7hG2su9v/nU1wEI3SnpPIrqJODL7GTDFvR74ANKGq1AFJW16PH8VWnhpiTi9YcLSFV9xLeWSgq+ckHLdVQ==
pend@~1.2.0:
version "1.2.0"
resolved "https://mirrors.cloud.tencent.com/npm/pend/-/pend-1.2.0.tgz"
......@@ -2490,7 +2580,7 @@ pump@^3.0.0:
end-of-stream "^1.1.0"
once "^1.3.1"
punycode@^2.1.1:
punycode@^2.1.0, punycode@^2.1.1:
version "2.3.0"
resolved "https://mirrors.cloud.tencent.com/npm/punycode/-/punycode-2.3.0.tgz"
integrity sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==
......@@ -2514,6 +2604,14 @@ randombytes@^2.1.0:
dependencies:
safe-buffer "^5.1.0"
raw-loader@^4.0.2:
version "4.0.2"
resolved "https://mirrors.cloud.tencent.com/npm/raw-loader/-/raw-loader-4.0.2.tgz#1aac6b7d1ad1501e66efdac1522c73e59a584eb6"
integrity sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==
dependencies:
loader-utils "^2.0.0"
schema-utils "^3.0.0"
readdirp@~3.6.0:
version "3.6.0"
resolved "https://mirrors.cloud.tencent.com/npm/readdirp/-/readdirp-3.6.0.tgz"
......@@ -2627,6 +2725,23 @@ sax@^1.2.4:
resolved "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz"
integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
schema-utils@^0.4.0:
version "0.4.7"
resolved "https://mirrors.cloud.tencent.com/npm/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187"
integrity sha512-v/iwU6wvwGK8HbU9yi3/nhGzP0yGSuhQMzL6ySiec1FSrZZDkhm4noOSWzrNFo/jEc+SJY6jRTwuwbSXJPDUnQ==
dependencies:
ajv "^6.1.0"
ajv-keywords "^3.1.0"
schema-utils@^3.0.0:
version "3.3.0"
resolved "https://mirrors.cloud.tencent.com/npm/schema-utils/-/schema-utils-3.3.0.tgz#f50a88877c3c01652a15b622ae9e9795df7a60fe"
integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==
dependencies:
"@types/json-schema" "^7.0.8"
ajv "^6.12.5"
ajv-keywords "^3.5.2"
scule@^0.2.1:
version "0.2.1"
resolved "https://mirrors.cloud.tencent.com/npm/scule/-/scule-0.2.1.tgz"
......@@ -3035,6 +3150,13 @@ upper-case@^2.0.2:
dependencies:
tslib "^2.0.3"
uri-js@^4.2.2:
version "4.4.1"
resolved "https://mirrors.cloud.tencent.com/npm/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==
dependencies:
punycode "^2.1.0"
url-toolkit@^2.2.1:
version "2.2.5"
resolved "https://mirrors.cloud.tencent.com/npm/url-toolkit/-/url-toolkit-2.2.5.tgz"
......@@ -3198,6 +3320,23 @@ vue-eslint-parser@^9.3.0:
lodash "^4.17.21"
semver "^7.3.6"
vue-pdf@^4.3.0:
version "4.3.0"
resolved "https://mirrors.cloud.tencent.com/npm/vue-pdf/-/vue-pdf-4.3.0.tgz#d5f790ee7967e7b7aa9089b97b11ab168e19dbd0"
integrity sha512-zd3lJj6CbtrawgaaDDciTDjkJMUKiLWtbEmBg5CvFn9Noe9oAO/GNy/fc5c59qGuFCJ14ibIV1baw4S07e5bSQ==
dependencies:
babel-plugin-syntax-dynamic-import "^6.18.0"
loader-utils "^1.4.0"
pdfjs-dist "2.6.347"
raw-loader "^4.0.2"
vue-resize-sensor "^2.0.0"
worker-loader "^2.0.0"
vue-resize-sensor@^2.0.0:
version "2.0.0"
resolved "https://mirrors.cloud.tencent.com/npm/vue-resize-sensor/-/vue-resize-sensor-2.0.0.tgz#3a587fd6802e1688709cf2c5aadae7a0075952bf"
integrity sha512-W+y2EAI/BxS4Vlcca9scQv8ifeBFck56DRtSwWJ2H4Cw1GLNUYxiZxUHHkuzuI5JPW/cYtL1bPO5xPyEXx4LmQ==
vue-router@^4.0.15:
version "4.2.1"
resolved "https://mirrors.cloud.tencent.com/npm/vue-router/-/vue-router-4.2.1.tgz"
......@@ -3243,6 +3382,14 @@ which@^2.0.1:
dependencies:
isexe "^2.0.0"
worker-loader@^2.0.0:
version "2.0.0"
resolved "https://mirrors.cloud.tencent.com/npm/worker-loader/-/worker-loader-2.0.0.tgz#45fda3ef76aca815771a89107399ee4119b430ac"
integrity sha512-tnvNp4K3KQOpfRnD20m8xltE3eWh89Ye+5oj7wXEEHKac1P4oZ6p9oTj8/8ExqoSBnk9nu5Pr4nKfQ1hn2APJw==
dependencies:
loader-utils "^1.0.0"
schema-utils "^0.4.0"
workerpool@6.2.1:
version "6.2.1"
resolved "https://mirrors.cloud.tencent.com/npm/workerpool/-/workerpool-6.2.1.tgz"
......