5.10航天ui交易所pc端,代码jiem-pc
lxf
2025-05-29 c85ab99aa28039a74d8011e0866919e4e6fe9a73
style
7 files modified
11 files added
1167 ■■■■■ changed files
src/assets/1-e8dc2a35.jpg patch | view | raw | blame | history
src/assets/2-99bf9001.jpg patch | view | raw | blame | history
src/assets/3-1cadf24f.jpg patch | view | raw | blame | history
src/assets/css/my/index-0c4c93e2.css 1 ●●●● patch | view | raw | blame | history
src/assets/css/my/index-554eeb30.css 1 ●●●● patch | view | raw | blame | history
src/assets/css/my/index-a4ccec66.css 1 ●●●● patch | view | raw | blame | history
src/assets/wallet/asset-4aac2d85.css 1 ●●●● patch | view | raw | blame | history
src/components/layout/commonHeader.vue 10 ●●●●● patch | view | raw | blame | history
src/router/my.js 2 ●●●●● patch | view | raw | blame | history
src/router/wealth.js 12 ●●●●● patch | view | raw | blame | history
src/views/my/advance-auth.vue 274 ●●●●● patch | view | raw | blame | history
src/views/my/center.vue 122 ●●●●● patch | view | raw | blame | history
src/views/my/change-password.vue 194 ●●●●● patch | view | raw | blame | history
src/views/wallet/components/optionRecord.vue 2 ●●● patch | view | raw | blame | history
src/views/wallet/recharge.vue 14 ●●●●● patch | view | raw | blame | history
src/views/wallet/withdraw.vue 15 ●●●●● patch | view | raw | blame | history
src/views/wealth/asset.vue 263 ●●●●● patch | view | raw | blame | history
src/views/wealth/transactionRecord.vue 255 ●●●●● patch | view | raw | blame | history
src/assets/1-e8dc2a35.jpg
src/assets/2-99bf9001.jpg
src/assets/3-1cadf24f.jpg
src/assets/css/my/index-0c4c93e2.css
New file
@@ -0,0 +1 @@
.el-drawer__body{color:#000;display:flex;flex-direction:column}.el-drawer__body .headers{width:100%;color:#76727b;font-size:14px;box-sizing:border-box;margin-bottom:40px}.el-drawer__body .el-scrollbar{flex:1}.el-drawer__body .el-scrollbar__view .el-collapse{border:none!important}.el-drawer__body .el-scrollbar__view .el-collapse-item{margin-bottom:20px}.el-drawer__body .el-scrollbar__view .el-collapse-item button{text-align:left;line-height:1.5;background-color:#f5f5f5;padding:10px;height:max-content}.el-drawer__body .el-scrollbar__view .el-collapse-item div{border:none;color:#000}.myCenterPopup{width:256px!important;border:1px solid #373737!important;border-radius:10px}.myCenterPopup .el-scrollbar__wrap{background:#c3c5c7!important;border-radius:10px}.myCenterPopup .el-popper__arrow:before{border-color:#f7b328!important;background:#f7b328!important}.myCenterPopup .el-dropdown-menu{padding:0!important;background:#112639!important}.myCenterPopup .el-dropdown-menu .header{clip-path:polygon(0 0,100% 0,100% 72%,0 100%);background-color:#f7b328;height:100px;display:flex;align-items:center;padding:0 16px}.myCenterPopup .el-dropdown-menu .header .logo{width:40px;height:40px;background:url(/assets/avatar-e57e8e09.png) no-repeat center center;background-size:40px 40px;border-radius:50%;margin-right:10px}.myCenterPopup .el-dropdown-menu .header .right{display:flex;flex-direction:column;height:max-content}.myCenterPopup .el-dropdown-menu li{height:48px;line-height:48px;box-sizing:border-box;color:#fff}.myCenterPopup .el-dropdown-menu li:hover{background:rgba(255,255,255,.082);color:#fff}.myCenterPopup .el-dropdown-menu li.logoout{border-top:1px solid #6d6d6d;color:#ef4444;padding-top:30px;padding-bottom:30px}.header[data-v-7747fbf3]{height:72px;box-sizing:border-box;width:100%;background:rgb(24,26,32);color:#fff;font-size:14px}.header_container[data-v-7747fbf3]{height:100%;display:flex;justify-content:space-between;align-content:center}.header_container_right[data-v-7747fbf3]{display:flex;align-items:center}.header_container_right .el-dropdown-link[data-v-7747fbf3]{cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:none;outline:none}.header_container_right .el-dropdown-link .applogo[data-v-7747fbf3]{display:inline-block;width:24px;height:24px;background:url(/assets/avatar-e57e8e09.png) no-repeat center center;background-size:24px 24px;border-radius:50%}.header_container_right .el-dropdown-link .userName[data-v-7747fbf3]{display:inline-block;height:24px;line-height:24px;margin:0 5px}.header_container_right .btn[data-v-7747fbf3]{width:120px;height:40px;line-height:40px;text-align:center;border:1px solid #fff;border-radius:9999px;font-size:14px;font-weight:700;color:#fff;background:#000;cursor:pointer}.header_container_right .btn.register[data-v-7747fbf3]{background-color:#f7b328;border-color:transparent;margin-left:24px}.header_container_right .btn[data-v-7747fbf3]:hover{opacity:.9}.header_container_right .Icon[data-v-7747fbf3]{margin-left:24px;padding:5px;cursor:pointer;position:relative}.header_container_right .Icon .list[data-v-7747fbf3]{background:#000;position:absolute;z-index:100;width:200px;top:50px;right:0;background:rgb(17,38,57);border-radius:10px}.header_container_right .Icon .list.downloadList[data-v-7747fbf3]{width:auto}.header_container_right .Icon .list .content[data-v-7747fbf3]{display:flex;align-items:center;flex-direction:column;justify-content:center;padding:16px}.header_container_right .Icon .list .content .codeImg[data-v-7747fbf3]{width:100px;height:100px;margin-bottom:10px}.header_container_right .Icon .list .content .more[data-v-7747fbf3]{width:100px;height:36px;margin-top:10px;text-align:center;line-height:36px;color:#fff;font-size:14px;background:#ffd302;border-radius:10px;font-style:normal}.header_container_right .Icon .list_Icon[data-v-7747fbf3]{position:absolute;top:-15px;right:7px;width:50px;display:flex;justify-content:flex-end}.header_container_right .Icon .list_item[data-v-7747fbf3]{font-style:normal;padding:10px;width:100%;box-sizing:border-box}.header_container_right .Icon .list_item .item_box[data-v-7747fbf3]{justify-content:flex-start;height:52px;display:flex;box-sizing:border-box;align-items:center;line-height:52px;color:#606266;padding:8px 12px;font-size:14px}.header_container_right .Icon .list_item .item_box[data-v-7747fbf3]:hover{background:hsla(0,0%,100%,.0823529412)!important}.header_container_right .Icon .list_item .item_box.active[data-v-7747fbf3]{color:#f7b328;font-size:16px;background:rgba(247,179,40,.1)}.header_container_right .Icon .list_item .item_box_img[data-v-7747fbf3]{width:20px;height:20px;margin-right:12px;border-radius:50%}.header_container_right .Icon[data-v-7747fbf3]:hover{background:rgba(247,179,40,.1);padding:5px;border-radius:5px;color:#f7b328}.header_container_left[data-v-7747fbf3],.header_container_left .logo[data-v-7747fbf3]{display:flex;align-items:center}.header_container_left .logo .avatar[data-v-7747fbf3]{width:40px;height:40px;background:url(/assets/logo-66dce226.png) no-repeat center center;background-size:40px 40px}.header_container_left .logo .text[data-v-7747fbf3]{color:#fff;font-size:16px;letter-spacing:3px}.header_container_left .nav[data-v-7747fbf3]{display:flex;justify-content:space-around;align-content:center;height:max-content;margin-left:10px}.header_container_left .nav_item[data-v-7747fbf3]{margin:0 20px;min-width:40px;cursor:pointer}.header_container_left .nav_item.active[data-v-7747fbf3]{color:#ffd302}.footer[data-v-cf3ee57a]{min-height:100px;background:rgb(24,26,32);border-top:1px solid rgba(109,109,109,.5)}.footer .footer_top[data-v-cf3ee57a]{width:94%;margin:0 auto;display:flex;padding:16px 0}.footer .footer_top .footer_left[data-v-cf3ee57a]{flex:0 0 40%;box-sizing:border-box}.footer .footer_top .footer_left .logo[data-v-cf3ee57a]{display:flex;align-items:center}.footer .footer_top .footer_left .logo .avatar[data-v-cf3ee57a]{width:40px;height:40px;background:url(/assets/logo-66dce226.png) no-repeat center center;background-size:40px 40px}.footer .footer_top .footer_left .logo .text[data-v-cf3ee57a]{color:#fff;font-size:16px;letter-spacing:3px}.footer .footer_top .footer_left .text[data-v-cf3ee57a]{color:#989898;font-size:14px}.footer .footer_top .footer_list[data-v-cf3ee57a]{flex:0 0 30%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.footer .footer_top .footer_list .about[data-v-cf3ee57a]{color:#fff;font-size:20px;font-weight:400;width:100%;text-align:center}.footer .footer_top .footer_list ul[data-v-cf3ee57a]{width:100%}.footer .footer_top .footer_list li[data-v-cf3ee57a]{width:100%;text-align:center}.footer .footer_top .footer_list li a[data-v-cf3ee57a]{width:100%;text-align:center;text-decoration:none;color:#989898;height:40px;line-height:40px}.footer .footer_top .footer_list li a[data-v-cf3ee57a]:hover{display:inline-block;color:#f7b328}.footer .footer_bottom[data-v-cf3ee57a]{width:94%;margin:0 auto;padding:16px 0;border-top:1px solid rgba(109,109,109,.5)}.footer .footer_bottom p[data-v-cf3ee57a]{margin-top:4px;color:#989898;font-size:12px}.main{width:100%;height:100%;display:flex;flex-direction:column;align-content:center;justify-content:space-between}.router-view{flex:1;background-color:#000}.service_online{position:fixed;right:30px;bottom:100px;background-color:#f7b328;background-image:linear-gradient(to right bottom,rgb(247,179,40),rgb(17,38,57));width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;z-index:10}
src/assets/css/my/index-554eeb30.css
New file
@@ -0,0 +1 @@
.container[data-v-5ac03575]{background-color:#000;max-width:1232px;padding:0 16px 16px;margin:auto}.header[data-v-5ac03575]{display:flex;align-items:center;height:160px}.header-content[data-v-5ac03575]{font-size:24px;color:#fff;margin-left:16px}.content[data-v-5ac03575]{color:#fff;padding:48px 24px;background-color:#181a20;border-radius:8px}.form[data-v-5ac03575]{max-width:920px;margin:auto}.form-title[data-v-5ac03575]{font-size:16px;line-height:24px;margin-bottom:16px;font-weight:600}.form[data-v-5ac03575] .el-input__wrapper{height:52px;border-radius:8px;background-color:#181a20;border:1px solid rgba(250,250,250,.2);box-shadow:none;margin-bottom:12px}.form[data-v-5ac03575] .el-input__wrapper input::placeholder{font-size:16px;font-weight:600}.form-btn[data-v-5ac03575]{width:100%;line-height:50px;background-color:#ffd302;font-size:14px;box-shadow:none;border:none;color:#fff;border-radius:8px;cursor:pointer;font-size:20px}
src/assets/css/my/index-a4ccec66.css
New file
@@ -0,0 +1 @@
.container[data-v-b78bf5cc]{background-color:#000;max-width:1232px;padding:0 16px;margin:auto}.header[data-v-b78bf5cc]{display:flex;align-items:center;height:100px;padding:48px 24px 12px 0;color:#fff;box-sizing:border-box}.header-content[data-v-b78bf5cc]{font-size:24px;font-weight:600;margin-left:12px}.content[data-v-b78bf5cc]{padding:0 24px 32px;background-color:#fff;border-radius:12px}.content-title[data-v-b78bf5cc]{line-height:55px;font-weight:600;border-bottom:1px solid rgb(209,209,209)}.form[data-v-b78bf5cc]{display:flex;justify-content:space-between;height:320px;padding:48px 0 16px;text-align:center}.uploader-container[data-v-b78bf5cc]{display:flex;flex-direction:column}.avatar-uploader .el-upload[data-v-b78bf5cc]{border-radius:6px;cursor:pointer;position:relative;overflow:hidden}.avatar-uploader__title[data-v-b78bf5cc]{font-weight:600;margin-top:12px}.avatar-uploader__desc[data-v-b78bf5cc]{margin-top:4px;font-size:12px}.avatar-uploader-icons[data-v-b78bf5cc]{font-size:28px;color:#8c939d;width:300px;height:200px;background:rgb(33,33,33) url(@/assets/1-e8dc2a35.jpg);background-size:300px 200px;text-align:center;border-radius:12px}.avatar-uploader-icon2[data-v-b78bf5cc]{background:rgb(33,33,33) url(@/assets/2-99bf9001.jpg)!important;background-size:300px 200px!important}.avatar-uploader-icon3[data-v-b78bf5cc]{background:rgb(33,33,33) url(@/assets/3-1cadf24f.jpg)!important;background-size:300px 200px!important}.avatar[data-v-b78bf5cc]{width:300px;height:200px}.page-btn[data-v-b78bf5cc]{width:192px;line-height:50px;background-color:#ffd302;font-size:14px;box-shadow:none;border:none;color:#fff;border-radius:8px;cursor:pointer;font-size:20px;margin:24px auto 48px;display:block}
src/assets/wallet/asset-4aac2d85.css
New file
@@ -0,0 +1 @@
.asset[data-v-0036adc0]{min-height:700px;background:#000;padding-bottom:16px}.asset .asset_content[data-v-0036adc0]{max-width:1232px;min-width:976px;margin:0 auto;color:#fff;padding-top:48px}.asset .asset_content .asset_card[data-v-0036adc0]{display:flex;justify-content:space-between;align-items:flex-start;padding:32px;border-radius:16px;background:linear-gradient(to bottom right,#f7b328,#1e2129)}.asset .asset_content .asset_card .left[data-v-0036adc0]{width:50%;font-size:14px;color:#ffffffb3}.asset .asset_content .asset_card .left_item[data-v-0036adc0]{display:flex;justify-content:space-between;margin-bottom:16px}.asset .asset_content .asset_card .left_item[data-v-0036adc0]:nth-child(3){margin-bottom:0}.asset .asset_content .asset_card .left_item_totalNum[data-v-0036adc0]{font-size:30px;font-weight:700;margin-right:8px;color:#fff}.asset .asset_content .asset_card .left_item_num[data-v-0036adc0]{font-size:14px;font-weight:700;margin-right:8px;color:#fff}.asset .asset_content .asset_card .right[data-v-0036adc0]{display:flex;justify-content:space-between}.asset .asset_content .asset_card .right .btn[data-v-0036adc0]{padding:8px 24px;border-radius:30px;background:rgba(255,255,255,.1019607843);cursor:pointer;position:relative;margin-right:5px}.asset .asset_content .asset_card .right .btn[data-v-0036adc0]:hover{position:relative}.asset .asset_content .asset_card .right .btn[data-v-0036adc0]:hover:after{content:"";width:100%;height:100%;border-radius:30px;position:absolute;left:0;top:0;background:rgba(0,0,0,.2);z-index:2}.asset .asset_content .asset_card .right .btn.btn1[data-v-0036adc0]{background:#fff;color:#f7b328}.asset .asset_content .search[data-v-0036adc0]{display:flex;justify-content:space-between;align-items:center;margin:16px 0}.asset .asset_content .search_left[data-v-0036adc0],.asset .asset_content .search_right[data-v-0036adc0]{display:flex;align-items:center}.asset .asset_content .search_right[data-v-0036adc0]{position:relative}.asset .asset_content .search_right .icon[data-v-0036adc0]{position:absolute;top:14px;left:16px}.asset .asset_content .search_right input[data-v-0036adc0]{width:288px;box-sizing:border-box;padding:12px 16px 12px 36px;border-radius:8px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff!important;font-size:16px}.asset .asset_content .search_right input[data-v-0036adc0]:focus,.asset .asset_content .search_right input[data-v-0036adc0]:hover{border:1px solid #f7b328!important}.asset .asset_content .assetList[data-v-0036adc0]{display:flex;justify-content:flex-start;flex-wrap:wrap}.asset .asset_content .assetList .assetItem[data-v-0036adc0]{width:32%;border:1px solid rgba(255,255,255,.3);border-radius:8px;margin-bottom:32px;margin-right:16px}.asset .asset_content .assetList .assetItem[data-v-0036adc0]:nth-child(3n){margin-right:0}.asset .asset_content .assetList .assetItem_h[data-v-0036adc0]{display:flex;align-items:center;background:#181a20;border-radius:8px 8px 0 0;padding:12px;border-bottom:1px solid rgba(255,255,255,.5)}.asset .asset_content .assetList .assetItem_h_img[data-v-0036adc0]{width:40px;height:40px;border-radius:50%;margin-right:12px}.asset .asset_content .assetList .assetItem_h_label[data-v-0036adc0]{font-size:20px;font-weight:700;color:#f7b328}.asset .asset_content .assetList .assetItem_b[data-v-0036adc0]{padding:12px;font-size:14px;color:#fff9;background:#1c1f25;border-radius:0 0 8px 8px}.asset .asset_content .assetList .assetItem_b_flex[data-v-0036adc0]{display:flex;justify-content:space-between;align-items:center;line-height:1.5}.asset .asset_content .assetList .assetItem_b_flex .assetNum[data-v-0036adc0]{color:#fff}.asset .asset_content .assetList .assetItem_b_flex .assetNum.lock[data-v-0036adc0]{color:#000}.asset .asset_content .assetList .assetItem_b .assetBtn[data-v-0036adc0]{text-align:right;margin-top:16px}.asset .asset_content .assetList .assetItem_b .assetBtn .assetBtn1[data-v-0036adc0]{padding:6px 16px;background:#e5e5e5;color:#b1b1b1;border-radius:30px;margin-right:8px}.asset .asset_content .assetList .assetItem_b .assetBtn .assetBtn1.rechargeBtn[data-v-0036adc0]{background:#f7b328;color:#fff}.asset .asset_content .assetList .assetItem_b .assetBtn .assetBtn1.withdrawBtn[data-v-0036adc0]{background:#b45309;color:#fff}
src/components/layout/commonHeader.vue
@@ -5,11 +5,7 @@
        <!-- 通用左边菜单 -->
        <div class="left-page-header">
          <div @click="goRouter('/')" class="logo">
            <img
              src="./src/assets/forexImages/newlogo.png"
              width="40"
              height="40"
            />
            <img src="" width="40" height="40" />
            <span class="logoName2"> {{ $title }} </span>
          </div>
          <menu-item
@@ -485,12 +481,12 @@
      },
      {
        urlPath: "/wallet/spot",
        urlPath: "/asset",
        title: "zijinguanli",
      },
      {
        urlPath: "/order/coinOrder",
        urlPath: "/transactionRecord",
        title: "jiaoyiguanli",
        // iconPath: getImages("headIcon/personal-menu/help-center.png"),
      },
src/router/my.js
@@ -12,6 +12,8 @@
      { path: '/my/universal', name: 'universal', component: () => import('@/views/my/universal.vue') },//通用
      { path: '/my/helpCenter', name: 'helpCenter', component: () => import("@/views/my/helpCenter.vue") }, //帮助中心
      { path: '/my/announcement', name: 'Announcement', component: () => import("@/views/my/announcement.vue") },//公告中心
      { path: '/my/change-password/:id', name: 'changePassword', component: () => import("@/views/my/change-password.vue") },//公告中心
      { path: '/my/advance-auth', name: 'advaceAuth', component: () => import("@/views/my/advance-auth.vue") },//高级认证
    ]
  },
];
src/router/wealth.js
@@ -17,6 +17,18 @@
    },
    path: '/pledgeRecord', name: 'pledgeRecord', component: () => import("@/views/wealth/pledgeRecord.vue"),// 质押记录
  },
  {
    meta: {
      commonHeader: true,
    },
    path: '/transactionRecord', name: 'transactionRecord', component: () => import("@/views/wealth/transactionRecord.vue"),// 交易管理
  },
  {
    meta: {
      commonHeader: true,
    },
    path: '/asset', name: 'asset', component: () => import("@/views/wealth/asset.vue"),// 资金管理
  },
];
export { wealthRoutes };
src/views/my/advance-auth.vue
New file
@@ -0,0 +1,274 @@
<template>
  <div class="advance-auth">
    <div class="router-view">
      <section data-v-b78bf5cc="" class="container">
        <section data-v-b78bf5cc="" class="header">
          <i
            data-v-b78bf5cc=""
            class="el-icon"
            style="font-size: 30px; --color: #fff"
            ><svg
              data-v-b78bf5cc=""
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 1024 1024"
            >
              <path
                fill="currentColor"
                d="M224 480h640a32 32 0 1 1 0 64H224a32 32 0 0 1 0-64"
              ></path>
              <path
                fill="currentColor"
                d="m237.248 512 265.408 265.344a32 32 0 0 1-45.312 45.312l-288-288a32 32 0 0 1 0-45.312l288-288a32 32 0 1 1 45.312 45.312z"
              ></path>
            </svg>
          </i>
          <p data-v-b78bf5cc="" class="header-content">高級認證</p>
        </section>
        <section data-v-b78bf5cc="" class="content">
          <p data-v-b78bf5cc="" class="content-title">高級認證照片</p>
          <div data-v-b78bf5cc="" class="form">
            <div
              data-v-b78bf5cc=""
              class="el-row"
              element-loading-background="transparent"
            >
              <div data-v-b78bf5cc="" class="uploader-container">
                <el-upload
                  data-v-b78bf5cc=""
                  class="avatar-uploader"
                  :action="`${nowUrl}/wap/public/uploadimg!execute.action`"
                  accept=".jpg,.jpeg,.png,.gif.JPG,.JPEG,.PNG,.GIF"
                  :show-file-list="false"
                  :on-success="handelDoucumentsFront"
                  :before-upload="(file) => beforeUpload(file, 0)"
                  :on-change="(file) => handleChange(file, 0)"
                >
                  <span
                    data-v-b78bf5cc=""
                    class="avatar-uploader-icon1 avatar-uploader-icons"
                  ></span>
                  <img
                    v-if="previewList[0]"
                    :src="previewList[0]"
                    class="preview-img"
                  />
                </el-upload>
                <p data-v-b78bf5cc="" class="avatar-uploader__title">
                  身份證正面照
                </p>
                <p data-v-b78bf5cc="" class="avatar-uploader__desc">
                  請上傳身份證正面照
                </p>
              </div>
            </div>
            <div
              data-v-b78bf5cc=""
              class="el-row"
              element-loading-background="transparent"
            >
              <div data-v-b78bf5cc="" class="uploader-container">
                <el-upload
                  data-v-b78bf5cc=""
                  class="avatar-uploader"
                  :action="`${nowUrl}/wap/public/uploadimg!execute.action`"
                  accept=".jpg,.jpeg,.png,.gif.JPG,.JPEG,.PNG,.GIF"
                  :on-success="handelDoucumentsBack"
                  :show-file-list="false"
                  :before-upload="(file) => beforeUpload(file, 1)"
                  :on-change="(file) => handleChange(file, 1)"
                >
                  <div class="upload-inner">
                    <span
                      data-v-b78bf5cc=""
                      class="avatar-uploader-icon1 avatar-uploader-icons"
                    ></span>
                    <img
                      v-if="previewList[1]"
                      :src="previewList[1]"
                      class="preview-img"
                    />
                  </div>
                </el-upload>
                <p data-v-b78bf5cc="" class="avatar-uploader__title">
                  身份證反面照
                </p>
                <p data-v-b78bf5cc="" class="avatar-uploader__desc">
                  請上傳身份證反面照
                </p>
              </div>
            </div>
            <div
              data-v-b78bf5cc=""
              class="el-row"
              element-loading-background="transparent"
            >
              <div data-v-b78bf5cc="" class="uploader-container">
                <el-upload
                  data-v-b78bf5cc=""
                  class="avatar-uploader"
                  action=""
                  :action="`${nowUrl}/wap/public/uploadimg!execute.action`"
                  accept=".jpg,.jpeg,.png,.gif.JPG,.JPEG,.PNG,.GIF"
                  :on-success="holdIdCardSuccess"
                  :show-file-list="false"
                  :before-upload="(file) => beforeUpload(file, 2)"
                  :on-change="(file) => handleChange(file, 2)"
                >
                  <span
                    data-v-b78bf5cc=""
                    class="avatar-uploader-icon1 avatar-uploader-icons"
                  ></span>
                  <img
                    v-if="previewList[2]"
                    :src="previewList[2]"
                    class="preview-img"
                  />
                </el-upload>
                <p data-v-b78bf5cc="" class="avatar-uploader__title">
                  手持證件照片
                </p>
                <p data-v-b78bf5cc="" class="avatar-uploader__desc">
                  請上傳手持證件照片
                </p>
              </div>
            </div>
          </div>
        </section>
        <button data-v-b78bf5cc="" class="page-btn" @click="onSubmit">
          提交審核
        </button>
      </section>
    </div>
  </div>
  <footer-view></footer-view>
</template>
<script setup>
import { ref } from "vue";
import { ElMessage } from "element-plus";
import Axios2 from "@/api/my.js";
// 三张图片的文件和预览
const fileList = ref([null, null, null]);
const previewList = ref([null, null, null]);
//上传背面
const idBackImg = ref(null);
const idFrontImg = ref(null);
const handheldPhoto = ref(null);
function handelDoucumentsFront(res, file) {
  const { path, httpUrl } = res.data;
  console.log("上传成功", path);
  // this.twoImg = httpUrl;
  idFrontImg.value = path;
}
function handelDoucumentsBack(res, file) {
  const { path, httpUrl } = res.data;
  console.log("上传成功", path);
  // this.twoImg = httpUrl;
  idBackImg.value = path;
}
function holdIdCardSuccess(res, file) {
  const { path, httpUrl } = res.data;
  console.log("上传成功", path);
  // this.twoImg = httpUrl;
  handheldPhoto.value = path;
}
function beforeUpload(file, idx) {
  console.log("beforeUpload", file, idx);
  if (!file.type.startsWith("image/")) {
    ElMessage.error("請選擇圖片文件");
    return false;
  }
  fileList.value[idx] = file;
  // 生成本地预览
  const reader = new FileReader();
  reader.onload = (ev) => {
    previewList.value[idx] = ev.target.result;
  };
  reader.readAsDataURL(file);
  // 阻止自动上传
  return false;
}
function handleChange(file, idx) {
  // 这里可以根据需要处理 file
}
// 提交
async function onSubmit() {
  if (!fileList.value[0] || !fileList.value[1] || !fileList.value[2]) {
    ElMessage.error("請上傳所有照片");
    return;
  }
  const formData = new FormData();
  formData.append("front", fileList.value[0]);
  formData.append("back", fileList.value[1]);
  formData.append("hand", fileList.value[2]);
  Axios2.apply({
    // nationality: this.nationality,
    // idNumber: this.idNumber,
    idName: "id/passpost",
    // name: this.name,
    idFrontImg: idFrontImg.value,
    idBackImg: idBackImg.value,
    handheldPhoto: handheldPhoto.value,
  }).then((res) => {
    if (res.code == "0") {
      // 出来一个弹窗,显示已经提交成功
      ElMessage.success("提交成功,請等待審核");
      this.$parent.getIdentifyInfo();
    }
  });
}
</script>
<style scoped>
@import url("@/assets/css/my/index-0c4c93e2.css");
@import url("@/assets/css/my/index-a4ccec66.css");
.preview-img {
  width: 300px;
  height: 200px;
  object-fit: cover;
  margin-top: 8px;
  border-radius: 6px;
  border: 1px solid #eee;
}
.el-upload__input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  /* 不要用 display: none; */
}
.avatar-uploader {
  position: relative;
  display: inline-block;
}
.upload-inner {
  position: relative;
  width: 100%;
  height: 100%;
}
.avatar-uploader-icons {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 120px;
  text-align: center;
  font-size: 32px;
  color: #8c939d;
}
.preview-img {
  position: absolute;
  left: 0;
  top: -8px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid #eee;
  z-index: 2;
}
</style>
src/views/my/center.vue
@@ -65,7 +65,12 @@
            </i>
            <div data-v-1a056e44="" class="plane-item__content">高級認證</div>
            <div data-v-1a056e44="" class="plane-item__opt">
              <!----><!----><!----><span data-v-1a056e44="">未認證</span>
              <!----><!----><!----><span
                data-v-1a056e44=""
                @click="isFyc(users.kyc_status)"
              >
                {{ $t(`message.user.${statusMap[users.kyc_status]}`) }}</span
              >
            </div>
          </div>
          <div data-v-1a056e44="" class="plane-item">
@@ -121,7 +126,7 @@
            </i>
            <div data-v-1a056e44="" class="plane-item__content">郵箱</div>
            <div data-v-1a056e44="" class="plane-item__email">
              jennifer88425@gmail.com
              {{ users.email }}
            </div>
          </div>
        </section>
@@ -147,7 +152,15 @@
              </svg>
            </i>
            <div data-v-1a056e44="" class="plane-item__content">登錄密碼</div>
            <div data-v-1a056e44="" class="plane-item__opt">修改</div>
            <div
              data-v-1a056e44=""
              class="plane-item__opt"
              @click="
                $router.push('/my/change-password/1', { query: { type: 1 } })
              "
            >
              修改
            </div>
          </div>
          <div data-v-1a056e44="" class="plane-item">
            <i
@@ -175,11 +188,25 @@
              </svg>
            </i>
            <div data-v-1a056e44="" class="plane-item__content">資金密碼</div>
            <div data-v-1a056e44="" class="plane-item__opt">修改</div>
            <div
              data-v-1a056e44=""
              class="plane-item__opt"
              @click="
                $router.push('/my/change-password/2', { query: { type: 2 } })
              "
            >
              修改
            </div>
          </div>
        </section>
        <section data-v-1a056e44="" class="page-bottom">
          <button data-v-1a056e44="" class="page-bottom__btn">退出登錄</button>
          <button
            data-v-1a056e44=""
            class="page-bottom__btn"
            @click="gotoRoute"
          >
            退出登錄
          </button>
        </section>
      </section>
    </div>
@@ -187,6 +214,91 @@
  <footerView></footerView>
</template>
<script setup>
import { removeStorage } from "@/utils";
import Axios from "@/api/login.js";
import { ref } from "vue";
import Axios2 from "@/api/my.js";
import { onMounted } from "vue";
onMounted(() => {
  getUserInfo();
});
const gotoRoute = (item) => {
  const { urlPath, urlQuery } = item || {};
  if (!urlPath) {
    return;
  }
  if (urlPath.includes("loginOut")) {
    Axios.loginOut().then((res) => {
      if (res.code == "0") {
        store.resetUserInfo();
        removeStorage("spToken");
        removeStorage("username");
        router.push("/");
        return;
      }
    });
    return;
  }
  let route = urlPath;
  if (urlQuery) {
    route = {
      path: urlPath,
      query: urlQuery,
    };
  }
  router.push(route);
};
const isFyc = (kyc_status) => {
  // 0已申请未审核=未绑定 ,1审核中 ,2 审核通过,3审核未通过
  if (kyc_status == 0) {
    router.push("/my/advance-auth");
  } else if (kyc_status == 1) {
    // ElMessage.warning("您的认证正在审核中,请耐心等待");
  } else if (kyc_status == 2) {
    // ElMessage.success("您已完成高级认证");
  } else if (kyc_status == 3) {
    ElMessage.error("您的高级认证未通过,请重新申请");
    router.push("/my/advance-auth");
  }
};
// 获取用户信息
let users = ref({});
// ("0已申请未审核=未绑定 ,1审核中 ,2 审核通过,3审核未通过")
const statusMap = ref([
  "weibangding",
  "shenhezhong",
  "yirenzheng",
  "shenheweitongguo",
]);
const getUserInfo = () => {
  Axios2.getUserInfo().then((res) => {
    users.value = res.data || {};
    console.log(users, "users");
    // this.googleverif = googleverif;
    // this.emailverif = emailverif;
    // this.phoneverif = phoneverif;
    // this.identityverif = identityverif;
    // this.advancedverif = advancedverif;
    // this.kyc_status = kyc_status;
    //邮箱和手机事情打*显示的
    // if (res.data.email) {
    //   let arremail = res.data.email.split("@");
    //   users.email = res.data.email.substring(0, 3) + "*****" + "@" + arremail[1];
    // }
    // if (phone) {
    //   users.phone = res.data.phone.replace(phone.substr(3, 4), "****");
    // }
  });
};
</script>
<style scoped>
.router-view {
  flex: 1;
src/views/my/change-password.vue
New file
@@ -0,0 +1,194 @@
<template>
  <div class="router-view">
    <section data-v-5ac03575="" class="container">
      <section data-v-5ac03575="" class="header">
        <i
          @click="$router.back()"
          data-v-5ac03575=""
          class="el-icon"
          style="font-size: 30px; --color: #fff"
          ><svg
            data-v-5ac03575=""
            xmlns="http://www.w3.org/2000/svg"
            viewBox="0 0 1024 1024"
          >
            <path
              fill="currentColor"
              d="M224 480h640a32 32 0 1 1 0 64H224a32 32 0 0 1 0-64"
            ></path>
            <path
              fill="currentColor"
              d="m237.248 512 265.408 265.344a32 32 0 0 1-45.312 45.312l-288-288a32 32 0 0 1 0-45.312l288-288a32 32 0 1 1 45.312 45.312z"
            ></path>
          </svg>
        </i>
        <p data-v-5ac03575="" class="header-content">
          <!----><span data-v-5ac03575=""
            >修改 {{ $route.params.id == 1 ? "登录密碼" : "資金密码" }}</span
          >
        </p>
      </section>
      <section data-v-5ac03575="" class="content">
        <div data-v-5ac03575="" class="form">
          <p data-v-5ac03575="" class="form-title">
            <!----><span data-v-5ac03575=""
              >修改 {{ $route.params.id == 1 ? "登录密碼" : "資金密码" }}</span
            >
          </p>
          <form
            data-v-5ac03575=""
            class="el-form el-form--default el-form--label-right demo-form-inline"
          >
            <div
              data-v-5ac03575=""
              class="el-form-item is-required asterisk-left el-form-item--label-right"
            >
              <!--v-if-->
              <div class="el-form-item__content">
                <div data-v-5ac03575="" class="el-input">
                  <!-- input --><!-- prepend slot --><!--v-if-->
                  <div class="el-input__wrapper" tabindex="-1">
                    <!-- prefix slot --><!--v-if--><input
                      class="el-input__inner"
                      type="password"
                      autocomplete="off"
                      v-model="formData.password"
                      tabindex="0"
                      placeholder="請輸入原始密碼"
                      id="el-id-8983-100"
                    /><!-- suffix slot --><!--v-if-->
                  </div>
                  <!-- append slot --><!--v-if-->
                </div>
              </div>
            </div>
            <!---->
            <div
              data-v-5ac03575=""
              class="el-form-item is-required asterisk-left el-form-item--label-right"
            >
              <!--v-if-->
              <div class="el-form-item__content">
                <div data-v-5ac03575="" class="el-input">
                  <!-- input --><!-- prepend slot --><!--v-if-->
                  <div class="el-input__wrapper" tabindex="-1">
                    <!-- prefix slot --><!--v-if--><input
                      class="el-input__inner"
                      type="password"
                      v-model="formData.password1"
                      autocomplete="off"
                      tabindex="0"
                      placeholder="請輸入新密碼"
                      id="el-id-8983-101"
                    /><!-- suffix slot --><!--v-if-->
                  </div>
                  <!-- append slot --><!--v-if-->
                </div>
              </div>
            </div>
            <div
              data-v-5ac03575=""
              class="el-form-item is-required asterisk-left el-form-item--label-right"
            >
              <!--v-if-->
              <div class="el-form-item__content">
                <div data-v-5ac03575="" class="el-input">
                  <!-- input --><!-- prepend slot --><!--v-if-->
                  <div class="el-input__wrapper" tabindex="-1">
                    <!-- prefix slot --><!--v-if--><input
                      class="el-input__inner"
                      type="password"
                      v-model="formData.password2"
                      autocomplete="off"
                      tabindex="0"
                      placeholder="確認新密碼"
                      id="el-id-8983-102"
                    /><!-- suffix slot --><!--v-if-->
                  </div>
                  <!-- append slot --><!--v-if-->
                </div>
              </div>
            </div>
          </form>
          <button data-v-5ac03575="" class="form-btn" @click="onsubmit">
            提交
          </button>
        </div>
      </section>
    </section>
  </div>
  <footer-view></footer-view>
</template>
<script setup>
import { ref } from "vue";
import Axios from "@/api/login.js";
import Axios2 from "@/api/my.js";
import { ElMessage } from "element-plus";
import { useRoute } from "vue-router";
const $route = useRoute();
console.log($route.params.id, "$route.params.id");
const formData = ref({
  password: "",
  password1: "",
  password2: "",
});
const onsubmit = () => {
  if (formData.value.password === "") {
    ElMessage.error("請輸入原始密碼");
    return;
  }
  if (formData.value.password1 === "") {
    ElMessage.error("請輸入新密碼");
    return;
  }
  if (formData.value.password2 === "") {
    ElMessage.error("請確認新密碼");
    return;
  }
  if (formData.value.password1 !== formData.value.password2) {
    ElMessage.error("兩次輸入的密碼不一致");
    return;
  }
  if ($route.params.id == 1) {
    // 提交表單  登录密码
    Axios2.updatepsw({
      password: formData.value.password2,
    })
      .then((res) => {
        if (res.code == "0") {
          ElMessage.success(this.$t("message.user.xiugaichenggong_qcxdl"));
          Axios.loginOut().then((res) => {
            if (res.code == "0") {
              localStorage.clear();
              $router.push("/login");
            }
          });
        }
      })
      .catch((error) => {
        console.error(error);
        ElMessage.error("修改失败,请稍后再试");
      });
  } else {
    // 资金密码
    Axios2.setSafeword({
      safeword: formData.value.password2,
    })
      .then((res) => {
        if (res.code == "0") {
          ElMessage.success(this.$t("message.user.xiugaichenggong"));
          this.$parent.getUserInfo();
          this.handClose();
        }
      })
      .catch((error) => {
        console.error(error);
        ElMessage.error("修改失败,请稍后再试");
      });
  }
};
</script>
<style scoped>
@import url("@/assets/css/my/index-0c4c93e2.css");
@import url("@/assets/css/my/index-554eeb30.css");
</style>
src/views/wallet/components/optionRecord.vue
@@ -99,7 +99,7 @@
            class="pagination-box"
            v-model:current-page="pageNum"
            default-page-size="20"
            layout="total, prev, pager, next, jumper"
             layout="prev, pager, next"
            :total="tableLength"
            @current-change="handleCurrentChange"
          />
src/views/wallet/recharge.vue
@@ -710,4 +710,18 @@
  padding-top: 24px;
  padding-bottom: 24px;
}
.css-1ay57iv {
  color: #fff;
  background-color: #000;
}
.css-1dihobw {
  color: #fff;
  background-color: rgb(27, 30, 38);
}
.css-7ng27,
.recharge-question-text,
.css-17bmjki,
.css-1x9w05y {
  color: #fff;
}
</style>
src/views/wallet/withdraw.vue
@@ -846,4 +846,19 @@
  margin-left: 200px;
  margin-top: 50px;
}
.css-h4euq4 {
  color: #fff;
  background-color: rgb(27, 30, 38);
}
.css-5vzups,
.css-7ng27,
.recharge-question-text,
.css-17bmjki,
.css-1x9w05y {
  color: #fff;
}
.css-1w42vtu {
  background: #000;
  color: #fff;
}
</style>
src/views/wealth/asset.vue
New file
@@ -0,0 +1,263 @@
<template>
  <div class="asset">
    <div class="asset_content">
      <div data-v-0036adc0="" class="asset_card">
        <div data-v-0036adc0="" class="left">
          <div data-v-0036adc0="" class="left_item">
            <div data-v-0036adc0="" class="">
              {{ $t("message.user.zongzicanguzhi") }}:
            </div>
            <div data-v-0036adc0="" class="">
              <span data-v-0036adc0="" class="left_item_totalNum">{{
                assetsData.total
              }}</span
              ><span data-v-0036adc0="" class="">USDT</span>
            </div>
          </div>
          <!-- <div data-v-0036adc0="" class="left_item">
            <div data-v-0036adc0="" class="">
              {{ $t("message.user.shuzihuobiZhanghu") }}:
            </div>
            <div data-v-0036adc0="" class="">
              <span data-v-0036adc0="" class="left_item_num">{{
                assetsData.money_coin
              }}</span
              ><span data-v-0036adc0="" class="">USDT</span>
            </div>
          </div> -->
          <div data-v-0036adc0="" class="left_item">
            <div data-v-0036adc0="" class="">
              {{ $t("message.user.xian14") }}:
            </div>
            <div data-v-0036adc0="" class="">
              <span data-v-0036adc0="" class="left_item_num">{{
                assetsData.money_wallet
              }}</span
              ><span data-v-0036adc0="" class="">USDT</span>
            </div>
          </div>
        </div>
        <div data-v-0036adc0="" class="right">
          <div
            data-v-0036adc0=""
            class="btn btn1"
            @click="$router.push('/recharge')"
          >
            {{ $t("message.user.chongbi") }}
          </div>
          <div
            data-v-0036adc0=""
            class="btn"
            @click="$router.push('/exchange')"
          >
            {{ $t("message.user.shandui") }}
          </div>
          <div
            data-v-0036adc0=""
            class="btn"
            @click="$router.push('/withdraw')"
          >
            {{ $t("message.user.tixian") }}
          </div>
          <!-- <div data-v-0036adc0="" class="btn" @click="$router.push('/recharge')">資金劃轉</div> -->
        </div>
      </div>
      <div data-v-0036adc0="" class="search">
        <div data-v-0036adc0="" class="search_left">
          <el-switch
            v-model="switch_value"
            active-color="#f7b328"
            inactive-color="#686868"
            @change="onHide"
          >
          </el-switch>
          <span
            data-v-0036adc0=""
            style="
              margin-left: 10px;
              font-size: 12px;
              color: rgb(152, 152, 152);
            "
            >隱藏小余額</span
          >
        </div>
        <div data-v-0036adc0="" class="search_right">
          <i data-v-0036adc0="" class="el-icon icon"
            ><svg
              data-v-0036adc0=""
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 1024 1024"
            >
              <path
                fill="currentColor"
                d="m795.904 750.72 124.992 124.928a32 32 0 0 1-45.248 45.248L750.656 795.904a416 416 0 1 1 45.248-45.248zM480 832a352 352 0 1 0 0-704 352 352 0 0 0 0 704"
              ></path></svg></i
          ><input
            data-v-0036adc0=""
            type="text"
            placeholder="搜尋"
            class="search_right_input"
          />
        </div>
      </div>
      <div class="assetList">
        <div
          data-v-0036adc0=""
          class="assetItem"
          v-for="(item, index) in assetsList"
          :key="index"
        >
          <div data-v-0036adc0="" class="assetItem_h">
            <img
              data-v-0036adc0=""
              src="https://api.uscoinmate.com/uploads/BillOfCredit/856bfdb63dc0d6fad6b92fc6a29719e1.png"
              class="assetItem_h_img"
            />
            <div data-v-0036adc0="" class="assetItem_h_label">
              {{ item.name }}
            </div>
          </div>
          <div data-v-0036adc0="" class="assetItem_b">
            <div data-v-0036adc0="" class="assetItem_b_flex">
              <div data-v-0036adc0="" class="">
                {{ $t("message.user.keyong") }}
              </div>
              <div data-v-0036adc0="" class="assetNum">
                {{ item.volume || 0 }}
              </div>
            </div>
            <div data-v-0036adc0="" class="assetItem_b_flex">
              <div data-v-0036adc0="" class="">
                {{ $t("message.jiaoyi.suocang") }}
              </div>
              <div data-v-0036adc0="" class="assetNum lock">
                {{ item.lock_money || 0 }}
              </div>
            </div>
            <div data-v-0036adc0="" class="assetItem_b_flex">
              <div data-v-0036adc0="" class="">
                {{ $t("message.user.jiedai") }}
              </div>
              <div data-v-0036adc0="" class="assetNum">
                {{ item.frozenAmount || 0 }}
              </div>
            </div>
            <div data-v-0036adc0="" class="assetItem_b_flex">
              <div data-v-0036adc0="" class="">
                {{ $t("message.user.dongjie") }}
              </div>
              <div data-v-0036adc0="" class="assetNum">
                {{ item.freeze_money || 0 }}
              </div>
            </div>
            <!-- <div data-v-0036adc0="" class="assetItem_b_flex">
              <div data-v-0036adc0="" class="">折合USDT</div>
              <div data-v-0036adc0="" class="assetNum">56710041.06893</div>
            </div> -->
            <div data-v-0036adc0="" class="assetBtn">
              <button
                :disabled="item.volume"
                data-v-0036adc0=""
                class="assetBtn1"
                :class="{ rechargeBtn: item.volume }"
                @click="$router.push('/recharge')"
              >
                {{ $t("message.user.chongbi") }}</button
              ><button
                :disabled="item.volume"
                data-v-0036adc0=""
                class="assetBtn1"
                :class="{ withdrawBtn: item.volume }"
                @click="$router.push('/withdraw')"
              >
                {{ $t("message.user.tixian") }}
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <footer-view></footer-view>
</template>
<script>
import Axios2 from "@/api/wallet.js";
import Axios from "@/utils/http";
export default {
  name: "asset",
  data() {
    return {
      assetsList: [],
      assetsData: {},
      switch_value: false,
    };
  },
  created() {
    this.getAssetsAll();
    this.getList();
  },
  methods: {
    onHide() {
      if (this.switch_value) {
        this.assetsList = this.assetsList.filter(
          (item) => item.symbol === "usdt"
        );
      } else {
        this.assetsList = this.assetsList2;
      }
    },
    //总账户资产
    getAssetsAll() {
      Axios2.getAllAssets().then((res) => {
        if (res.code == 0) {
          this.assetsData = res.data;
        }
      });
    },
    //理财账户列表数据
    getList() {
      Axios.fetch("wap/api/wallet!getAll.action").then((res) => {
        if (res.code == 0) {
          this.assetsList = res.data.extends;
          this.assetsList2 = res.data.extends;
        }
      });
    },
  },
};
</script>
<style scoped>
@import url("../../assets/wallet/asset-4aac2d85.css");
.asset {
  min-height: 700px;
  background: #000;
  padding-bottom: 16px;
}
.asset .asset_content {
  max-width: 1232px;
  min-width: 976px;
  margin: 0 auto;
  color: #fff;
  padding-top: 48px;
}
/deep/ .el-switch {
  --el-switch-on-color: #f7b328;
}
.asset .asset_content .assetList {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.asset .asset_content .assetList .assetItem {
  width: 32%;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 8px;
  margin-bottom: 32px;
  margin-right: 16px;
}
</style>
src/views/wealth/transactionRecord.vue
New file
@@ -0,0 +1,255 @@
<template>
  <div class="router-view">
    <div class="trade">
      <div class="recharge_content">
        <el-tabs
          v-model="activeName"
          class="order-tab"
          @tab-click="handleClick"
        >
          <el-tab-pane
            v-for="(item, index) in labels"
            :key="index"
            :name="index"
            :label="item"
            name="financial"
          >
          </el-tab-pane>
          <div class="list">
            <div class="item" v-for="(item, index) in tableData" :key="index">
              <div class="el-row">
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.shijian") }}</div>
                  <div class="value">{{ formatterDate(item) }}</div>
                </div>
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.bizhong") }}</div>
                  <div class="value">{{ item.name }}</div>
                </div>
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.leixing") }}</div>
                  <div
                    class="value red"
                    :class="item.direction == 'buy' ? 'green' : 'red'"
                  >
                    {{
                      item.direction == "buy"
                        ? $t("message.home.kaiduo")
                        : $t("message.home.kaikong")
                    }}
                  </div>
                </div>
              </div>
              <div class="el-row">
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.pingcangjiage") }}</div>
                  <div class="value">{{ item.close_avg_price }}</div>
                </div>
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.chengjiaoshuliang") }}</div>
                  <div class="value">{{ item.amount_open }}</div>
                </div>
                <div class="el-col el-col-8">
                  <div>{{ $t("message.user.zhuangtai") }}</div>
                  <div class="value">
                    {{
                      item.state == "created"
                        ? $t("message.user.yipingcang")
                        : $t("message.user.chicang")
                    }}
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- 分页 -->
          <!-- <el-pagination
            class="pagination-box"
            v-model:current-page="pageNum"
            default-page-size="20"
            :total="tableLength"
            @current-change="handleCurrentChange"
          /> -->
          <el-pagination
            class="pagination-box"
            background
            v-model:current-page="pageNum"
            @current-change="handleCurrentChange"
            default-page-size="20"
            layout="prev, pager, next"
            :total="tableLength"
          >
          </el-pagination>
        </el-tabs>
      </div>
    </div>
  </div>
  <footer-view></footer-view>
</template>
<script>
import { getContractOrder } from "@/api/order.js";
import dayjs from "dayjs";
export default {
  name: "financialHistory",
  data() {
    return {
      activeName: 0,
      labels: ["當前委託", "歷史委託"],
      tableData: [],
      mineData: [],
      pageNum: 1,
      tableLength: 0,
    };
  },
  mounted() {
    // if (this.$route.query.type) {
    //   this.activeName = this.$route.query.type;
    // }
    let spToken = localStorage.getItem("spToken");
    if (spToken) {
      this.getList();
      this.getMineList();
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log("handleClick: ");
      this.pageNum = 1;
      this.getList();
    },
    formatterDate(row) {
      return dayjs.unix(row.create_time_ts).format("YYYY-MM-DD HH:mm:ss");
    },
    async getList() {
      const data = {
        page_no: this.pageNum,
        type: this.activeName ? "orders" : "hisorders",
        symbol: "",
      };
      const res = await getContractOrder(data);
      this.tableData = res.data;
      this.tableLength = res.data.length;
      if (this.tableLength == 0 || this.tableLength < 10) {
        this.isNext = true;
      } else {
        this.isNext = false;
      }
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.getList();
    },
    getLocalLan() {
      var lang = JSON.parse(localStorage.getItem("lang"));
      // 简体中文:miner_name,繁体:miner_name_cn miner_name_en
      if (lang == "en") {
        return "miner_name_en";
      } else if (lang == "cht") {
        return "miner_name_cn";
      } else if (lang == "zh-CN") {
        return "miner_name";
      }
      return "miner_name_en";
    },
  },
};
</script>
<style scoped>
.router-view {
  flex: 1;
  background-color: #000;
}
.trade {
  min-height: 700px;
  background: #000;
  padding-bottom: 16px;
  padding-top: 28px;
}
.trade .recharge_content {
  max-width: 1232px;
  min-width: 976px;
  margin: 0 auto;
  color: #fff;
}
/deep/ .el-table {
  border-radius: 8px;
  padding: 16px;
  background-color: #1b1e26 !important;
}
/deep/ .el-table th.el-table__cell {
  background-color: #1b1e26 !important;
  border-bottom: none !important;
}
/deep/ .el-table__inner-wrapper:before {
  background-color: #1b1e26 !important;
}
/deep/ .el-tabs__nav-wrap:after {
  background-color: #000 !important;
}
/deep/ .el-tabs__item,
/deep/ .el-tabs__item:hover {
  color: #b1b1b1 !important;
  font-size: 18px;
}
/deep/ .el-tabs__item.is-active {
  color: #f7b328 !important;
  font-size: 18px !important;
  font-weight: 600;
}
.list .item {
  width: 47%;
  background: #112639;
  padding: 12px;
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 12px;
  color: #b1b1b180;
}
.el-row {
  margin-bottom: 16px;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.list .item .value {
  font-size: 14px;
  color: #b1b1b1;
  margin-top: 6px;
}
.list .item .value.red {
  color: red;
}
.list .item .value.green {
  color: #1cd36d;
}
/deep/ .el-pagination button.is-disabled,
/deep/ .el-pagination button:disabled,
/deep/ .el-pager li,
/deep/ .el-input__wrapper {
  background-color: #1b1e26 !important;
}
/deep/ .el-pager li.is-active {
  color: #f7b328 !important;
}
/deep/ .el-input__inner {
  color: #fff;
}
.pagination-box {
  justify-content: center;
  display: flex;
  margin-top: 20px;
}
</style>