|
@@ -5,12 +5,13 @@
|
|
|
<ul>
|
|
|
<li
|
|
|
:class="{
|
|
|
- selected: item.id === hotspot.icontype
|
|
|
+ selected: item.id === hotspot.icontype,
|
|
|
}"
|
|
|
v-for="(item, i) in hotspotIconList"
|
|
|
- @click="onClickIcon(item)" :key="i"
|
|
|
+ @click="onClickIcon(item)"
|
|
|
+ :key="i"
|
|
|
>
|
|
|
- <img :src="item.thumb" alt="">
|
|
|
+ <img :src="item.thumb" alt="" />
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
@@ -23,42 +24,46 @@ import { mapGetters } from "vuex";
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
- let cdn = this.$config.getStaticResource('/panoassets/images/hotspot/icon/')
|
|
|
- let hotspotIconList = []
|
|
|
+ let cdn = this.$config.getStaticResource(
|
|
|
+ "/panoassets/images/hotspot/icon/"
|
|
|
+ );
|
|
|
+ let hotspotIconList = [];
|
|
|
for (let i = 0; i < 17; i++) {
|
|
|
hotspotIconList[i] = {
|
|
|
- type: 'system_icon',
|
|
|
- id: 'icon' + (i + 1),
|
|
|
- img: cdn + `img_doticon_${String(i + 1).padStart(2, '0')}.svg`,
|
|
|
- thumb: cdn + `img_doticon_${String(i + 1).padStart(2, '0')}.svg`
|
|
|
- }
|
|
|
+ type: "system_icon",
|
|
|
+ id: "icon" + (i + 1),
|
|
|
+ img: cdn + `img_doticon_${String(i + 1).padStart(2, "0")}.svg`,
|
|
|
+ thumb: cdn + `img_doticon_${String(i + 1).padStart(2, "0")}.svg`,
|
|
|
+ };
|
|
|
}
|
|
|
+ //TODO 临时隐藏PDF
|
|
|
+
|
|
|
+ hotspotIconList.splice(14, 1);
|
|
|
|
|
|
return {
|
|
|
hotspotIconList,
|
|
|
- }
|
|
|
+ };
|
|
|
},
|
|
|
computed: {
|
|
|
...mapGetters({
|
|
|
- hotspot: 'hotspot',
|
|
|
+ hotspot: "hotspot",
|
|
|
}),
|
|
|
},
|
|
|
methods: {
|
|
|
onClickIcon(item) {
|
|
|
- this.hotspot.img = item.img
|
|
|
- this.hotspot.icontype = item.id
|
|
|
- }
|
|
|
+ this.hotspot.img = item.img;
|
|
|
+ this.hotspot.icontype = item.id;
|
|
|
+ },
|
|
|
},
|
|
|
- mounted() {
|
|
|
- }
|
|
|
-}
|
|
|
+ mounted() {},
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
.icon-list {
|
|
|
margin-top: 16px;
|
|
|
height: 158px;
|
|
|
- background: #1A1B1D;
|
|
|
+ background: #1a1b1d;
|
|
|
border-radius: 2px;
|
|
|
border: 1px solid #404040;
|
|
|
padding: 4px 2px 4px 4px;
|
|
@@ -66,7 +71,7 @@ export default {
|
|
|
overflow: auto;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
- >.margin-handler-layer {
|
|
|
+ > .margin-handler-layer {
|
|
|
overflow: hidden;
|
|
|
ul {
|
|
|
display: flex;
|
|
@@ -97,13 +102,27 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-::-webkit-scrollbar { width: 3px; height: 0; } /*宽度是对垂直滚动条而言,高度是对水平滚动条而言*/
|
|
|
+::-webkit-scrollbar {
|
|
|
+ width: 3px;
|
|
|
+ height: 0;
|
|
|
+} /*宽度是对垂直滚动条而言,高度是对水平滚动条而言*/
|
|
|
::-webkit-scrollbar-thumb {
|
|
|
- background: rgba(255,255,255,0.3);
|
|
|
+ background: rgba(255, 255, 255, 0.3);
|
|
|
border-radius: 1.5px;
|
|
|
}
|
|
|
-::-webkit-scrollbar-button { background-color: transparent; height: 0; }
|
|
|
-::-webkit-scrollbar-track { background: transparent; border-radius: 1.5px; }
|
|
|
-::-webkit-scrollbar-corner { background: transparent; border-radius: 1.5px; }
|
|
|
-::-webkit-scrollbar-resizer { background: transparent;}
|
|
|
-</style>
|
|
|
+::-webkit-scrollbar-button {
|
|
|
+ background-color: transparent;
|
|
|
+ height: 0;
|
|
|
+}
|
|
|
+::-webkit-scrollbar-track {
|
|
|
+ background: transparent;
|
|
|
+ border-radius: 1.5px;
|
|
|
+}
|
|
|
+::-webkit-scrollbar-corner {
|
|
|
+ background: transparent;
|
|
|
+ border-radius: 1.5px;
|
|
|
+}
|
|
|
+::-webkit-scrollbar-resizer {
|
|
|
+ background: transparent;
|
|
|
+}
|
|
|
+</style>
|