|
|
@@ -186,8 +186,24 @@
|
|
|
aria-label
|
|
|
aria-description="You've reached the pop-up window section, which has one URL and one image. Please use the tab key to go through the information."
|
|
|
>
|
|
|
+ <li class="searchLi" v-if="!menaInd.includes('Search')">
|
|
|
+ <div class="searchHover">
|
|
|
+ <div class="ll" @click="search2">
|
|
|
+ <img src="@/assets/images/LayoutSearch2.jpg" alt="" />
|
|
|
+ </div>
|
|
|
+ <div class="rr" @keyup.enter="search2">
|
|
|
+ <input type="text" placeholder="search" v-model="searchTxt2" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <img src="@/assets/images/LayoutSearch.png" alt="" />
|
|
|
+ </li>
|
|
|
<li title="game">
|
|
|
- <a href="" tabindex="0" aria-description="shadow art game">
|
|
|
+ <a
|
|
|
+ href="/game/index.html"
|
|
|
+ target="_blank"
|
|
|
+ tabindex="0"
|
|
|
+ aria-description="shadow art game"
|
|
|
+ >
|
|
|
<img
|
|
|
v-if="themeIdx === 0"
|
|
|
src="@/assets/images/game-default-color.svg"
|
|
|
@@ -259,6 +275,7 @@ export default {
|
|
|
topData,
|
|
|
loveFlag: false,
|
|
|
searchTxt: "",
|
|
|
+ searchTxt2: "",
|
|
|
footerData: [
|
|
|
{ name: "Site Index", path: "/Layout/Index" },
|
|
|
{ name: "Terms of Use", path: "/Layout/Use" },
|
|
|
@@ -306,6 +323,15 @@ export default {
|
|
|
params: { txt: this.searchTxt },
|
|
|
});
|
|
|
},
|
|
|
+ // 点击搜索
|
|
|
+ search2() {
|
|
|
+ // if (this.searchTxt.trim() === "" || this.searchTxt.trim().length < 4) return
|
|
|
+ this.$router.push({
|
|
|
+ name: "Search",
|
|
|
+ params: { txt: this.searchTxt2 },
|
|
|
+ });
|
|
|
+ this.searchTxt2 = "";
|
|
|
+ },
|
|
|
// 第一级的跳转
|
|
|
skipOne(url) {
|
|
|
this.$router.push("/Layout/" + url).catch(() => {});
|
|
|
@@ -526,6 +552,46 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .searchLi {
|
|
|
+ padding-top: 18px;
|
|
|
+ position: relative;
|
|
|
+ .searchHover {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ width: 300px;
|
|
|
+ height: 60px;
|
|
|
+ display: flex !important;
|
|
|
+ opacity: 0;
|
|
|
+ pointer-events: none;
|
|
|
+ .ll {
|
|
|
+ width: 60px;
|
|
|
+ height: 60px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #fff;
|
|
|
+ border: 1px solid #a3a3a3;
|
|
|
+ }
|
|
|
+ .rr {
|
|
|
+ width: 240px;
|
|
|
+ background-color: #c20e11;
|
|
|
+ padding: 8px;
|
|
|
+ input {
|
|
|
+ padding: 0 5px;
|
|
|
+ width: 200px;
|
|
|
+ height: 38px;
|
|
|
+ line-height: 44px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ .searchHover {
|
|
|
+ opacity: 1;
|
|
|
+ pointer-events: auto;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.footer {
|
|
|
@@ -593,7 +659,7 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .search{
|
|
|
+ .search {
|
|
|
right: 20px;
|
|
|
}
|
|
|
}
|
