|
@@ -3,10 +3,15 @@
|
|
<div class="head-bg" />
|
|
<div class="head-bg" />
|
|
<div class="head-nav-bar">{{$t("dapp.Exploration")}}</div>
|
|
<div class="head-nav-bar">{{$t("dapp.Exploration")}}</div>
|
|
|
|
|
|
- <div class="search-box">
|
|
|
|
- <svg-icon class="search-icon" name="search" />
|
|
|
|
- <van-field v-model="searchValue" :placeholder="$t('dapp.EnterTheNameOrURLOfTheDApp')" />
|
|
|
|
- </div>
|
|
|
|
|
|
+ <van-search
|
|
|
|
+ class="search-box"
|
|
|
|
+ v-model="searchValue" :placeholder="$t('dapp.EnterTheNameOrURLOfTheDApp')"
|
|
|
|
+ @search="handleSearch"
|
|
|
|
+ >
|
|
|
|
+ <template #left-icon>
|
|
|
|
+ <svg-icon class="search-icon" name="search" />
|
|
|
|
+ </template>
|
|
|
|
+ </van-search>
|
|
<van-skeleton-image v-if="slidesList.length == 0" style="width: 90%;" class="swipe-box" />
|
|
<van-skeleton-image v-if="slidesList.length == 0" style="width: 90%;" class="swipe-box" />
|
|
<van-swipe v-else class="swipe-box" :autoplay="3000" lazy-render>
|
|
<van-swipe v-else class="swipe-box" :autoplay="3000" lazy-render>
|
|
<van-swipe-item v-for="item in slidesList" :key="item.id">
|
|
<van-swipe-item v-for="item in slidesList" :key="item.id">
|
|
@@ -241,6 +246,22 @@ const handleVisitDapp = (item) => {
|
|
}
|
|
}
|
|
openDapp(item.url, { dapp, d:walletStore.account });
|
|
openDapp(item.url, { dapp, d:walletStore.account });
|
|
};
|
|
};
|
|
|
|
+
|
|
|
|
+// 搜索
|
|
|
|
+const handleSearch = () => {
|
|
|
|
+ const val = searchValue.value.trim();
|
|
|
|
+ if (!val) return;
|
|
|
|
+
|
|
|
|
+ // 判断是否是网址或域名
|
|
|
|
+ const urlPattern = /^(https?:\/\/)?([\w.-]+)\.([a-z]{2,})(\/.*)?$/i;
|
|
|
|
+ if (urlPattern.test(val)) {
|
|
|
|
+ // 自动补 https
|
|
|
|
+ const finalUrl = /^https?:\/\//i.test(val) ? val : `https://${val}`;
|
|
|
|
+ openDapp(finalUrl)
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+
|
|
const loadHistoryList = () => {
|
|
const loadHistoryList = () => {
|
|
const history = systemStore.DAPP_CACHE_KEY;
|
|
const history = systemStore.DAPP_CACHE_KEY;
|
|
tabsAppConfig.value[1].children = history;
|
|
tabsAppConfig.value[1].children = history;
|
|
@@ -285,20 +306,22 @@ onMounted(async () => {
|
|
border-radius: 23px 23px 23px 23px;
|
|
border-radius: 23px 23px 23px 23px;
|
|
background-color: #e3edfd;
|
|
background-color: #e3edfd;
|
|
color: #95a9ed;
|
|
color: #95a9ed;
|
|
|
|
+ :deep(.van-search__content){
|
|
|
|
+ padding-left: 0 !important;
|
|
|
|
+ background: initial !important;
|
|
|
|
+ }
|
|
.search-icon {
|
|
.search-icon {
|
|
height: 25px;
|
|
height: 25px;
|
|
width: 25px;
|
|
width: 25px;
|
|
- margin-left: 6px;
|
|
|
|
|
|
+ color: #95a9ed;
|
|
|
|
+ margin-top: 4px;
|
|
}
|
|
}
|
|
:deep(.van-cell) {
|
|
:deep(.van-cell) {
|
|
flex: 1;
|
|
flex: 1;
|
|
font-size: 15px;
|
|
font-size: 15px;
|
|
- margin: 0 6px;
|
|
|
|
- padding: 0 !important;
|
|
|
|
- background: #e3edfd !important;
|
|
|
|
- line-height: 25px !important;
|
|
|
|
width: initial !important;
|
|
width: initial !important;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
|
+ height: 33px !important;
|
|
}
|
|
}
|
|
:deep(.van-field__control) {
|
|
:deep(.van-field__control) {
|
|
color: #95a9ed !important;
|
|
color: #95a9ed !important;
|