style

lxf

2025-05-22 e74a7c7afc56cf229058091fe2ae143cf0bdb3ca

 src/components/layout/commonHeader.vue

@@ -6,9 +6,9 @@
        <div class="left-page-header">
          <div @click="goRouter('/')" class="logo">
            <img
              src="/src/assets/forexImages/newlogo.png"
              width="26"
              height="26"
              src="./src/assets/forexImages/newlogo.png"
              width="40"
              height="40"
            />
            <span class="logoName2"> {{ $title }} </span>
          </div>
@@ -49,11 +49,11 @@
        <!-- 登录后的右边菜单 -->
        <div class="right-page-header" v-else>
          <!-- 充值 -->
          <div style="margin: auto; top: 0; left: 0; bottom: 0; right: 0">
          <!-- <div style="margin: auto; top: 0; left: 0; bottom: 0; right: 0">
            <div
              @click="goRechargePage"
              style="
                background-color: rgb(42, 100, 251);
                background-color: #f7b328;
                font-size: 14px;
                font-weight: 700;
                width: 85px;
@@ -66,10 +66,9 @@
                gap: 6px;
              "
            >
              <!-- <img src="https://BCWP.com/img/material-symbols.248b9d5f.svg" /> -->
              {{ $t("message.user.chongzhi") }}
            </div>
          </div>
          </div> -->
          <!-- 钱包订单用户中心 -->
          <menu-item
            v-for="(_, i) in rightMenuList"
@@ -79,18 +78,81 @@
            :isRight="true"
          >
          </menu-item>
          <img
          <i
            @click="goApp()"
            data-v-7747fbf3=""
            class="el-icon Icon"
            style="font-size: 24px; --color: #fff"
            ><svg
              data-v-7747fbf3=""
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 1024 1024"
            >
              <path
                fill="currentColor"
                d="M160 832h704a32 32 0 1 1 0 64H160a32 32 0 1 1 0-64m384-253.696 236.288-236.352 45.248 45.248L508.8 704 192 387.2l45.248-45.248L480 584.704V128h64z"
              ></path>
            </svg>
            <div
              data-v-7747fbf3=""
              class="list downloadList"
              style="display: none"
            >
              <i
                data-v-7747fbf3=""
                class="el-icon list_Icon"
                style="font-size: 20px; --color: #fff"
                ><svg
                  data-v-7747fbf3=""
                  xmlns="http://www.w3.org/2000/svg"
                  viewBox="0 0 1024 1024"
                >
                  <path
                    fill="currentColor"
                    d="M512 320 192 704h639.936z"
                  ></path></svg
              ></i>
              <div data-v-7747fbf3="" class="content">
                <canvas
                  data-v-7747fbf3=""
                  width="200"
                  height="200"
                  style="width: 100px; height: 100px"
                ></canvas
                ><span data-v-7747fbf3="" class="more">More</span>
              </div>
            </div></i
          >

          <i
            @click="handleChangeLang('lang')"
            data-v-7747fbf3=""
            class="el-icon Icon languageIcon"
            style="font-size: 24px; --color: #fff"
          >
            <svg
              data-v-7747fbf3=""
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 1024 1024"
            >
              <path
                fill="currentColor"
                d="M778.752 788.224a382.464 382.464 0 0 0 116.032-245.632 256.512 256.512 0 0 0-241.728-13.952 762.88 762.88 0 0 1 125.696 259.584zm-55.04 44.224a699.648 699.648 0 0 0-125.056-269.632 256.128 256.128 0 0 0-56.064 331.968 382.72 382.72 0 0 0 181.12-62.336m-254.08 61.248A320.128 320.128 0 0 1 557.76 513.6a715.84 715.84 0 0 0-48.192-48.128 320.128 320.128 0 0 1-379.264 88.384 382.4 382.4 0 0 0 110.144 229.696 382.4 382.4 0 0 0 229.184 110.08zM129.28 481.088a256.128 256.128 0 0 0 331.072-56.448 699.648 699.648 0 0 0-268.8-124.352 382.656 382.656 0 0 0-62.272 180.8m106.56-235.84a762.88 762.88 0 0 1 258.688 125.056 256.512 256.512 0 0 0-13.44-241.088A382.464 382.464 0 0 0 235.84 245.248zm318.08-114.944c40.576 89.536 37.76 193.92-8.448 281.344a779.84 779.84 0 0 1 66.176 66.112 320.832 320.832 0 0 1 282.112-8.128 382.4 382.4 0 0 0-110.144-229.12 382.4 382.4 0 0 0-229.632-110.208zM828.8 828.8a448 448 0 1 1-633.6-633.6 448 448 0 0 1 633.6 633.6"
              ></path>
            </svg>
          </i>
          <!-- <img
            @click="goApp()"
            src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAMAAACfvvDEAAAAAXNSR0IArs4c6QAAAF1QTFRFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAuQcU8AAAAB50Uk5TAAEQESBBT1BfYG9wcX+Ajo+Qnp+vvr/Oz97f7u/+OkswXgAAAMVJREFUOMvt1c0OgjAQBOBpRXFFxh8EQWnf/zE9mEAhdKkHEw/OsfmS3W7SLfALkab3i2n2U1j5eE4hLL0WjtCq0D/tIHNdOhkkdRmUn8k2bxNlMT+ISvnLb8iHJm+Wg+R4vCAJ8C0dYc5adQHoBXQlDPU+BaCAExi5EQGLbAJjdycAmCJlSgQgafOkkcTJBzNfkwkvrr4GqTpFZpMVtFHkcRvm8nGfrhxX4orcjRus12XQPhOLA6hdHNaz7X13y+kOX/wzXhVNdrraQcPPAAAAAElFTkSuQmCC"
            alt=""
            class="child-menu-img"
            style="margin-left: 38px"
          />
          <img
          /> -->
          <!-- <img
            @click="handleChangeLang('lang')"
            src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAMAAACfvvDEAAAAAXNSR0IArs4c6QAAAHJQTFRFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAmuLzngAAACV0Uk5TAAEQESAwP0BBT1BRXl9gYW9wcX+Ajo+en6Cvvr/Oz93e3+7v/pZTn78AAAGJSURBVDjLzZTbUoMwFEU3GAxWS4utBZVWaLP+/xd9SGhCRRxnfHA/nZA1nHukfybb0RkpX2Ly3UlaATiru64133IX1jIDAOdcJbzM/tgOMEiveDXKOuiLr+AWYC0TQFyuZ8DVt+AOAKP9SLLXHYDbTcEVAJ00XMleWQfg1iloLgDU0Tk4o2efXFqCk7+0qhKyVumt9wiO99JbJGl8oBP/IbjT9edjoOHiGMMMilY45lfrt2qDrIo2lZENVuPBYgysCmUdk6+0iRWLVb8tErhKj6P5IEmqI1nfkGWsraTYapt03Xe+jOYS6RJyt+x9G71vJ72cyaicZmRilabkw/Xswug3QVamSVXIjubv25kFRevmODN1QxLnUdlpnL+vk/yakG/KQj5P0f27/1SkBY3l/EgCLc4zG1eEjXOTQa4Xtng7TX8PcMmTzh/mXwZp74BaebLum1lQWvXQSW0AG2UDrr+fq79pHVbGJ9cbbXCH755b03ZS5fx0ZMfD4vbm0qp3x3v98Hz/jT4BmyVmQK6IMAEAAAAASUVORK5CYII="
            class="child-menu-img"
          />
          /> -->
          <!-- 选择的语言 -->
          <!--          <div @click="handleChangeLang('lang')" style="margin-left: 16px">-->
          <!--            {{ $t("message.home.language") }}-->
@@ -146,6 +208,10 @@

const leftMenuList = [
  {
    title: "home", //首页
    url: "/page",
  },
  {
    title: "hangqing", //市场
    url: "/market",
  },
@@ -167,17 +233,26 @@
  //   title: "xianhuojiaoyishouye", //现货交易
  //   url: "/coin/spot/btc",
  // },
  // {
  //   title: "shandui", //闪兑
  //   url: "/exchange",
  // },
  {
    title: "shandui", //闪兑
    url: "/exchange",
    title: "bibijiaoyi", // 现货交易
    url: "/coin/spot/btc",
  },
  {
    title: "jiaoyi", // 数字货币= 现货交易 永续合约 交割合约
    menuList: [
      ...contractList("/coin/constract/btc"),
      ...spotList("/coin/spot/btc"),
    ],
    title: "heyue", // 永续合约
    url: "/coin/constract/btc",
  },

  // {
  //   title: "jiaoyi", // 数字货币= 现货交易 永续合约 交割合约
  //   menuList: [
  //     ...contractList("/coin/constract/btc"),
  //     ...spotList("/coin/spot/btc"),
  //   ],
  // },
  // {
  //   title: "waihui", // 外汇=永续合约 交割合约
  //   menuList: contractList("/forex/constract/BTCUSD"),
@@ -197,20 +272,20 @@
  // //   menuList: [],
  // //   tips: true,
  // // },
  // {
  //   title: "licaijijin", //
  //   url: `/fundMa`,
  //   iconPath: getImages("headIcon/left-menu/pig.png"),
  // },
  {
    title: "licaijijin", //
    url: `/fundMa`,
    iconPath: getImages("headIcon/left-menu/pig.png"),
  },
  {
    title: "kuangchisuocang", //
    title: "staking", //
    url: `/fundMakc`,
    iconPath: getImages("headIcon/left-menu/min.png"),
    // iconPath: getImages("headIcon/left-menu/min.png"),
  },
  {
    title: "tuiguangzhouxin", //推广中心
    url: "/promote",
  },
  // {
  //   title: "tuiguangzhouxin", //推广中心
  //   url: "/promote",
  // },
  /*  {
    title: "jinrongyewu", // 金融业务=基金理财+矿池锁仓+C2C
    menuList: [
@@ -237,102 +312,102 @@
];

const rightMenuList = [
  {
    title: "qianbao",
    menuList: [
      {
        urlPath: "/wallet/walletOverview",
        title: "qianbaozonglan",
        iconPath: getImages("headIcon/wallet-menu/wallet-overview.png"),
      },
      // // etf
      // {
      //   urlPath: "/wallet/etfAccounts",
      //   title: "etfZhanghu",
      //   iconPath: getImages("headIcon/wallet-menu/etf.png"),
      // },
      // // 外汇
      // {
      //   urlPath: "/wallet/forexAccounts",
      //   title: "waihuiZhanghu",
      //   iconPath: getImages("headIcon/wallet-menu/forex.png"),
      // },
      // // 数字货币
      // {
      //   urlPath: "/wallet/cryptosAccounts",
      //   title: "shuzihuobiZhanghu",
      //   iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
      // },
      // // 美股
      // {
      //   urlPath: "/wallet/usStocksAccounts",
      //   title: "meiguZhanghu",
      //   iconPath: getImages("headIcon/wallet-menu/us.png"),
      // },
      // 现货账户
      {
        urlPath: "/wallet/spot",
        title: "xianhuozhanghu",
        iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
      },
      // 合约账户
      {
        urlPath: "/wallet/contractAccounts",
        title: "heyuezhanghu",
        iconPath: getImages("headIcon/wallet-menu/us.png"),
      },
      {
        urlPath: "/wallet/financialAccounts",
        title: "licaizhanghu",
        iconPath: getImages("headIcon/wallet-menu/financial-account.png"),
      },
    ],
  },
  {
    title: "dingdan",
    menuList: [
      // {
      //   urlPath: "/order/etfOrder",
      //   title: "etflishi",
      //   iconPath: getImages("headIcon/wallet-menu/etf.png"),
      // },
      // {
      //   urlPath: "/order/forexOrder",
      //   title: "waihuilishi",
      //   iconPath: getImages("headIcon/wallet-menu/forex.png"),
      // },
      {
        urlPath: "/order/coinOrder",
        title: "shuzihuobilishi",
        iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
      },
      // {
      //   urlPath: "/order/usStocksOrder",
      //   title: "meigulishi",
      //   iconPath: getImages("headIcon/wallet-menu/us.png"),
      // },
      {
        urlPath: "/order/financialOrder",
        title: "licailishi",
        iconPath: getImages("headIcon/wallet-menu/financial-account.png"),
      },
      {
        urlPath: "/order/changeRecord",
        title: "zhangbianjilu",
        iconPath: getImages("headIcon/wallet-menu/record.png"),
      },
      {
        urlPath: "/order/walletHistory",
        title: "qianbaolishi",
        iconPath: getImages("headIcon/wallet-menu/wallet-history.png"),
      },
      {
        urlPath: "/order/exchangeOrder",
        title: "duihuanlishi",
        iconPath: getImages("headIcon/wallet-menu/exchange.png"),
      },
    ],
  },
  // {
  //   title: "qianbao",
  //   menuList: [
  // {
  //   urlPath: "/wallet/walletOverview",
  //   title: "qianbaozonglan",
  //   iconPath: getImages("headIcon/wallet-menu/wallet-overview.png"),
  // },
  // // etf
  // {
  //   urlPath: "/wallet/etfAccounts",
  //   title: "etfZhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/etf.png"),
  // },
  // // 外汇
  // {
  //   urlPath: "/wallet/forexAccounts",
  //   title: "waihuiZhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/forex.png"),
  // },
  // // 数字货币
  // {
  //   urlPath: "/wallet/cryptosAccounts",
  //   title: "shuzihuobiZhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
  // },
  // // 美股
  // {
  //   urlPath: "/wallet/usStocksAccounts",
  //   title: "meiguZhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/us.png"),
  // },
  // 现货账户
  // {
  //   urlPath: "/wallet/spot",
  //   title: "xianhuozhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
  // },
  // 合约账户
  // {
  //   urlPath: "/wallet/contractAccounts",
  //   title: "heyuezhanghu",
  //   iconPath: getImages("headIcon/wallet-menu/us.png"),
  // },
  //     {
  //       urlPath: "/wallet/financialAccounts",
  //       title: "licaizhanghu",
  //       iconPath: getImages("headIcon/wallet-menu/financial-account.png"),
  //     },
  //   ],
  // },
  // {
  //   title: "dingdan",
  //   menuList: [
  // {
  //   urlPath: "/order/etfOrder",
  //   title: "etflishi",
  //   iconPath: getImages("headIcon/wallet-menu/etf.png"),
  // },
  // {
  //   urlPath: "/order/forexOrder",
  //   title: "waihuilishi",
  //   iconPath: getImages("headIcon/wallet-menu/forex.png"),
  // },
  // {
  //   urlPath: "/order/coinOrder",
  //   title: "shuzihuobilishi",
  //   iconPath: getImages("headIcon/wallet-menu/cryptos.png"),
  // },
  // {
  //   urlPath: "/order/usStocksOrder",
  //   title: "meigulishi",
  //   iconPath: getImages("headIcon/wallet-menu/us.png"),
  // },
  //     {
  //       urlPath: "/order/financialOrder",
  //       title: "licailishi",
  //       iconPath: getImages("headIcon/wallet-menu/financial-account.png"),
  //     },
  //     {
  //       urlPath: "/order/changeRecord",
  //       title: "zhangbianjilu",
  //       iconPath: getImages("headIcon/wallet-menu/record.png"),
  //     },
  //     {
  //       urlPath: "/order/walletHistory",
  //       title: "qianbaolishi",
  //       iconPath: getImages("headIcon/wallet-menu/wallet-history.png"),
  //     },
  //     {
  //       urlPath: "/order/exchangeOrder",
  //       title: "duihuanlishi",
  //       iconPath: getImages("headIcon/wallet-menu/exchange.png"),
  //     },
  //   ],
  // },
  {
    title: "zhanghu",
    menuList: [
@@ -434,7 +509,7 @@
</script>
<style scoped>
.page-header-background {
  background-color: #ffffff;
  background-color: rgb(24, 26, 32);
  padding: 0 20px;
  position: fixed;
  top: 0;
@@ -486,6 +561,19 @@
  color: #00d6ca;
}

.right-page-header {
  display: flex;
  align-items: center;
  .Icon {
    width: 34px;
    height: 34px;
    margin-left: 24px;
    padding: 5px;
    cursor: pointer;
    position: relative;
  }
}

/* 子菜单 */
.child-menu-box {
  position: absolute;
@@ -535,13 +623,14 @@
}

.logoName2 {
  margin-left: 14px;
  /* margin-left: 14px; */
  margin-right: 40px;
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 22px;
  color: #2b64fb;
  color: #fff;
  font-size: 16px;
  letter-spacing: 3px;
}

.el-dropdown-link {
@@ -572,7 +661,7 @@
  line-height: 34px;
  padding: 0 20px;
  color: #fff !important;
  background: #2a64fb;
  background: #f7b328;
  border-radius: 8px;
  opacity: 1;
  margin-top: 9px;