|
@@ -8,11 +8,54 @@
|
|
|
class="search"
|
|
|
/>
|
|
|
</div>
|
|
|
+
|
|
|
+ <van-skeleton avatar title :row="2" :loading="loading" />
|
|
|
+
|
|
|
+ <div class="network-list">
|
|
|
+ <div class="network-item" v-for="item in networkComputed" :key="item.id" @click="selectNetwork(item)">
|
|
|
+ <van-image loading-icon="wechat-moments" lazy-load class="network-item-icon" :src="item.icon" />
|
|
|
+ <div class="network-item-name">{{ item.name }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script setup>
|
|
|
+import { getNetwork } from '@/api/path/login.api'
|
|
|
+
|
|
|
+const router = useRouter()
|
|
|
|
|
|
const value = ref('')
|
|
|
+const networkList = ref([])
|
|
|
+const loading = ref(true)
|
|
|
+
|
|
|
+const initNetwork = async () => {
|
|
|
+ const { data } = await getNetwork({})
|
|
|
+ loading.value = false
|
|
|
+ networkList.value = data
|
|
|
+}
|
|
|
|
|
|
+const networkComputed = computed(() => {
|
|
|
+ if (!value.value) return networkList.value
|
|
|
+ let arr = [];
|
|
|
+ arr = networkList.value.filter((item) => {
|
|
|
+ return JSON.stringify(item).includes(value.value);
|
|
|
+ });
|
|
|
+ return arr;
|
|
|
+})
|
|
|
+
|
|
|
+const selectNetwork = (item) => {
|
|
|
+ router.push({
|
|
|
+ path: '/createWallet',
|
|
|
+ query: {
|
|
|
+ network: item.url
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+onMounted(() =>{
|
|
|
+ initNetwork()
|
|
|
+})
|
|
|
</script>
|
|
|
<style scoped lang="less">
|
|
|
.search{
|
|
@@ -21,5 +64,24 @@ const value = ref('')
|
|
|
:deep(.van-search__content){
|
|
|
background: @bg-color1;
|
|
|
}
|
|
|
+.network-list{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ margin: 20px 20px 0 20px;
|
|
|
+ .network-item{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 17px;
|
|
|
+ .network-item-icon{
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ .network-item-name{
|
|
|
+ margin-left: 10px;
|
|
|
+ font-size: 15px;
|
|
|
+ color: @font-color2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
</style>
|