From 136d5835ef62ecfb9932526c5f48a434988b1be7 Mon Sep 17 00:00:00 2001
From: zzzz <690498789@qq.com>
Date: Mon, 15 Apr 2024 18:48:23 +0800
Subject: [PATCH] first
---
src/components/ex-nav/index.vue | 208 ++++++++++++++++++++++++++++-----------------------
1 files changed, 113 insertions(+), 95 deletions(-)
diff --git a/src/components/ex-nav/index.vue b/src/components/ex-nav/index.vue
index f30b905..0b77847 100644
--- a/src/components/ex-nav/index.vue
+++ b/src/components/ex-nav/index.vue
@@ -11,7 +11,7 @@
<div class="mt-15 text-center font-20 newcolor1">{{ item.name }}</div>
</div>
</div>
- <div class="nav mb-44">
+ <div class="nav mb-44" style="margin-bottom: 15px">
<div
v-for="(item, index) in navList1"
:key="index"
@@ -24,11 +24,26 @@
</div>
</div>
</div>
+ <div class="nav mb-44" v-if="isLock">
+ <div
+ v-for="(item, index) in navList2"
+ :key="index"
+ class="list"
+ @click="goPath(item.path, item.router)"
+ >
+ <div class="imgBox"><img :src="item.icon" alt="" /></div>
+ <div class="mt-15 text-center font-20 newcolor1">
+ {{ item.name }}
+ </div>
+ </div>
+ </div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
+import Axios from "@/API/userCenter";
+
export default {
props: {},
computed: {
@@ -38,113 +53,115 @@
},
data() {
return {
+ isLock: false,
navList: [],
navList1: [],
+ navList2: [],
+ zbUrl: "",
+ bsUrl: "",
};
},
methods: {
- goPath(path, name) {
+ async getUrl() {
+ const res = await Axios.getConfigurationByKey();
+ res.map((val) => {
+ if (val.configKey === "zb") {
+ this.zbUrl = val.configValue;
+ }
+ if (val.configKey === "bs") {
+ this.bsUrl = val.configValue;
+ }
+ });
+ },
+ getNavlist() {
+ this.navList = [
+ {
+ name: this.$t("ICO"),
+ icon: require(`@/assets/3x/资源 7@3x.png`),
+
+ path: "/new-urrency",
+ },
+
+ {
+ name: this.$t("理财"),
+ icon: require(`@/assets/3x/资源 3@3x.png`),
+ path: "/fm-home",
+ },
+ {
+ name: this.$t("合约交易"),
+ icon: require(`@/assets/3x/资源 5@3x.png`),
+ path: "/trendDetails/btc",
+ },
+ {
+ name: this.$t("分享"),
+ icon: require(`@/assets/3x/资源 2@3x.png`),
+ path: "/promote",
+ },
+ ];
+ this.navList1 = [
+ {
+ name: this.$t("在线客服"),
+ icon: require(`@/assets/3x/资源 8@3x.png`),
+
+ path: "/customerService",
+ },
+ {
+ name: this.$t("质押借币"),
+ icon: require(`@/assets/3x/资源 6@3x.png`),
+ path: "/pledgeLoan",
+ },
+ {
+ name: this.$t("账变记录"),
+ icon: require(`@/assets/3x/资源 9@3x.png`),
+ path: "/accountChange",
+ },
+
+ {
+ name: this.$t("更多"),
+ icon: require(`@/assets/3x/Artboard 2@33x copy 3.png`),
+ path: "/more",
+ },
+ ];
+ this.navList2 = [
+ {
+ name: this.$t("闪兑"),
+ icon: require(`@/assets/3x/资源 1@3x.png`),
+ path: "/exchange/exchangePage",
+ },
+ {
+ name: this.$t("直播"),
+ icon: require(`@/assets/3x/Artboard 3@33x copy 3.png`),
+ id: "zb",
+ path: "/zb",
+ router: "",
+ },
+ {
+ name: this.$t("比赛"),
+ icon: require(`@/assets/3x/Artboard 4@33x copy 3.png`),
+ id: "bs",
+ path: "/bs",
+ router: "",
+ },
+ ];
+ },
+ goPath(path, router) {
if (path == "/more") {
- this.$toast(this.$t("敬请期待"));
+ this.isLock = !this.isLock;
+ } else if (path === "/zb") {
+ if (this.zbUrl) window.open(this.zbUrl);
+ } else if (path === "/bs") {
+ if (this.bsUrl) window.open(this.bsUrl);
} else {
this.$router.push(path);
}
},
},
mounted() {
- this.navList = [
- {
- name: this.$t("闪兑"),
- icon: require(`@/assets/3x/资源 1@3x.png`),
- path: "/exchange/exchangePage",
- },
- {
- name: this.$t("理财"),
- icon: require(`@/assets/3x/资源 3@3x.png`),
- path: "/fm-home",
- },
- {
- name: this.$t("合约交易"),
- icon: require(`@/assets/3x/资源 5@3x.png`),
- path: "/trendDetails/btc",
- },
- {
- name: this.$t("分享"),
- icon: require(`@/assets/3x/资源 2@3x.png`),
- path: "/promote",
- },
- ];
- this.navList1 = [
- {
- name: this.$t("在线客服"),
- icon: require(`@/assets/3x/资源 8@3x.png`),
-
- path: "/customerService",
- },
- {
- name: this.$t("质押借币"),
- icon: require(`@/assets/3x/资源 6@3x.png`),
- path: "/pledgeLoan",
- },
- {
- name: this.$t("账变记录"),
- icon: require(`@/assets/3x/资源 9@3x.png`),
- path: "/accountChange",
- },
- {
- name: this.$t("ICO"),
- icon: require(`@/assets/3x/资源 7@3x.png`),
-
- path: "/new-urrency",
- },
- ];
+ this.getNavlist();
+ this.getUrl();
},
activated() {
- this.navList = [
- {
- name: this.$t("闪兑"),
- icon: require(`@/assets/3x/资源 1@3x.png`),
- path: "/exchange/exchangePage",
- },
- {
- name: this.$t("理财"),
- icon: require(`@/assets/3x/资源 3@3x.png`),
- path: "/fm-home",
- },
- {
- name: this.$t("合约交易"),
- icon: require(`@/assets/3x/资源 5@3x.png`),
- path: "/trendDetails/btc",
- },
- {
- name: this.$t("分享"),
- icon: require(`@/assets/3x/资源 2@3x.png`),
- path: "/promote",
- },
- ];
- this.navList1 = [
- {
- name: this.$t("在线客服"),
- icon: require(`@/assets/3x/资源 8@3x.png`),
- path: "/customerService",
- },
- {
- name: this.$t("质押借币"),
- icon: require(`@/assets/3x/资源 6@3x.png`),
- path: "/pledgeLoan",
- },
- {
- name: this.$t("账变记录"),
- icon: require(`@/assets/3x/资源 9@3x.png`),
- path: "/accountChange",
- },
- {
- name: this.$t("ICO"),
- icon: require(`@/assets/3x/资源 7@3x.png`),
-
- path: "/new-urrency",
- },
- ];
+ this.getNavlist();
},
};
</script>
@@ -153,7 +170,7 @@
.nav {
display: flex;
- justify-content: center;
+ //justify-content: center;
align-items: center;
font-size: 26px;
color: #21262f;
@@ -163,6 +180,7 @@
}
.list {
+ max-width: 25%;
display: flex;
flex-direction: column;
justify-content: center;
--
Gitblit v1.9.3