From 30d1ee7be942d7a2201e1ab2ca7d96badff8bf50 Mon Sep 17 00:00:00 2001
From: 李 <344137771@qq.com>
Date: Sat, 23 May 2026 11:23:00 +0800
Subject: [PATCH] 1

---
 src/views/cryptos/Withdraw/withdrawPage.vue |  915 +++++++++++++++++++++++++++++++-------------------------
 1 files changed, 508 insertions(+), 407 deletions(-)

diff --git a/src/views/cryptos/Withdraw/withdrawPage.vue b/src/views/cryptos/Withdraw/withdrawPage.vue
index df60089..dfb9f9d 100644
--- a/src/views/cryptos/Withdraw/withdrawPage.vue
+++ b/src/views/cryptos/Withdraw/withdrawPage.vue
@@ -1,421 +1,522 @@
 <template>
-  <div id="cryptos">
-    <div class="withdrawl-page font-28">
-      <assets-head title="">
-        <img src="../../../assets/image/assets-center/exchange.png" alt="exchange-img" class="w-44 h-38"
-          @click="goRouter('/cryptos/assetsCenter/rechargeWithdrawRecord')" />
-      </assets-head>
-      <div class="px-32 pb-48">
-        <!--<h1 class="font-52 pt-40 textColor">{{ $t('提币') }} USDT</h1>-->
-        <h1 class="font-52 pt-40 textColor">{{ $t('提币 ') + value }} </h1>
-        <!--<p class="text-grey font-30 mt-26">{{ $t('提币 USDT 到数字币地址') }}</p>-->
-        <p class="text-grey font-30 mt-26">{{ $t('提币 ') + value + $t(' 到数字币地址') }}</p>
-        <div @click="showSymbol = true"
-          class="flex border-grey items-center items-center justify-between rounded-lg mt-42 inputBackground textColor">
-          <input disabled v-model="value" class="flex-1 h-100 border-none px-16 inputBackground textColor" />
-          <p class="flex items-center">
-            <span>{{ $t('选择币种') }}</span>
-            <img src="@/assets/image/icon-left_arrow.png" alt="logo" class="w-20 h-33 ml-30 mr-40"
-              style="transform: rotate(-90deg)" />
-          </p>
-        </div>
-        <p class="font-35 mt-44 textColor">{{ $t('区块链网络') }}</p>
-        <ul class="flex mt-22  flex-wrap">
-          <li
-            class="w-210 h-96 mb-20 mr-40 rounded rounded-lg border border-solid flex justify-center items-center textColor"
-            :class="blockchainIndex == index ? 'active' : ''" v-for="(item, index) in blockList" :key="item.id"
-            @click="changeBlockchain(item, index)">{{ item.blockchain_name }}</li>
-        </ul>
-        <p class="font-35 mt-22 textColor">{{ $t('地址') }}</p>
-        <div class="inputBackground flex items-center justify-between h-96 rounded mt-22">
-          <input :placeholder="$t('长按粘贴')" class="h-full flex-1 border-none bg-none px-16 textColor" v-model="address" />
-          <div class="flex items-center">
-            <span class="colorMain" @click="pastCont">{{ $t('粘贴') }}</span>
-            <div>
-              <img @click="clickCode()" src="@/assets/image/public/scan.png" alt="logo" class="w-65 h-65 ml-20 mr-30" />
-            </div>
-          </div>
-        </div>
-        <p class="font-35 mt-44 textColor">{{ $t('数量') }}</p>
-        <div class="inputBackground flex items-center justify-between h-96 rounded mt-22">
-          <input :placeholder="$t('请输入提币数量')" maxlength="10"
-            class="h-full flex-1 border-none bg-none px-16 font-22 textColor" type="number" v-model="amount"
-            @input="changeInput" />
-          <p class="flex items-center">
-            <!--<span class="text-grey">USDT</span>-->
-            <span class="text-grey">{{ value }}</span>
-            <span class="colorMain ml-20 mr-30" @click="allBtn">{{ $t('全部') }}</span>
-          </p>
-        </div>
-        <p class="flex justify-between text-grey mt-22 font-28">
-          <span>{{ $t('可用') }}</span>
-          <!--<span>{{ usdtBalance }} USDT</span>-->
-          <span>{{ getwei(usdtBalance * 1, numLenth) }} {{ value }}</span>
-        </p>
-        <p class="text-grey mt-64 font-28">{{ $t('可到账数量') }}</p>
-        <div class="font-40 mt-20 fon-bold ">
-          <span class="font-40 font-700 textColor"> {{ volume_last || '0.00' }}</span>
-          <!--<span class="font-32 ml-5 text-grey">USDT</span>-->
-          <span class="font-32 ml-5 text-grey">{{ value }}</span>
-        </div>
-        <p class="text-grey mt-22 font-28">{{ $t('提现费用') }}:{{ fee || '0.00' }} {{ value }}</p>
-        <p class="text-white mt-46 textColor font-28">{{ $t('提币说明') }}:
-        </p>
-        <div class="text-grey mt-10 font-28" v-html="tip"></div>
-        <van-button class="w-768 h-100 rounded flex justify-center items-center mt-56  text-white btnMain border-none"
-          @click="showDetail">
-          {{ $t('提现') }}</van-button>
+	<div id="cryptos" class="withdraw-wrap">
+		<assets-head :title="$t('提取')" :show-left="true" :back-func="goBack">
+			<img src="../../../assets/image/assets-center/exchange.png" alt="" class="withdraw-head-icon"
+				@click="goRouter('/cryptos/assetsCenter/rechargeWithdrawRecord')" />
+		</assets-head>
 
-      </div>
-      <van-popup v-model:show="show" position="bottom">
-        <div class="pop-box relative font-28">
-          <img src="@/assets/image/icon-close.png" class="w-38 h-38 absolute right-20 top-20" @click="show = false" />
-          <p class="font-38 text-center pt-60 textColor">{{ $t('确认订单') }}</p>
-          <p class="font-35 mt-49 text-grey text-center">{{ $t('实际到账') }}</p>
-          <p class="font-50 mt-23 text-center textColor">{{ volume_last }} <span class="text-grey font-35">
-              {{ value }}</span></p>
-          <ul class="border-b-color px-32 pb-34">
-            <li class="flex justify-between font-32 mt-25 items-center">
-              <span class="textColor">{{ $t('提币地址') }}</span>
-              <span class="text-grey font-26">{{ address }}</span>
-            </li>
-            <li class="flex justify-between font-32 mt-25">
-              <span class="textColor">{{ $t('主网络') }}</span>
-              <span class="text-grey">{{ blockName }}</span>
-            </li>
-            <li class="flex justify-between font-32 mt-25">
-              <span class="textColor">{{ $t('提现来源账户') }}</span>
-              <span class="text-grey">{{ $t('钱包账户') }}</span>
-            </li>
-          </ul>
-          <ul class="px-32 mt-32">
-            <li class="flex justify-between font-32 mt-25">
-              <span class="textColor">{{ $t('币种') }}</span>
-              <span class="text-grey">{{ value }}</span>
-            </li>
-            <li class="flex justify-between font-32 mt-25">
-              <span class="textColor">{{ $t('金额') }}</span>
-              <span class="text-grey">{{ amount }}&nbsp;{{ value }}</span>
-            </li>
-            <li class="flex justify-between font-32 mt-25">
-              <span class="textColor">{{ $t('网络手续费') }}</span>
-              <span class="text-grey">{{ fee }}&nbsp;{{ value }}</span>
-            </li>
-          </ul>
-          <p class="px-32 mt-49 font-30 textColor">
-            1. {{ $t('请确保您输入了正确的提币地址并且您选择的转账网络与地址相匹配') }}
-          </p>
-          <p class="px-32 mt-40 font-30 textColor">2. {{ $t('提币订单创建后不可取消。') }}</p>
-          <p class="w-768 h-100 rounded flex justify-center items-center mt-56 mb-48 btnMain text-white ml-32"
-            @click="onConfirm">
-            {{ $t('确定') }}</p>
-        </div>
-      </van-popup>
-      <!-- 币种 -->
-      <van-action-sheet v-model:show="showSymbol" :actions="actions.filter(item => item.name !== value)"
-        @select="onSelect" />
-      <bar-scan v-if="scancode" @ok="getResult"></bar-scan>
-    </div>
-  </div>
+		<!-- 第一部分:转账网络 + 选择币种 -->
+		<div class="withdraw-part withdraw-part-1">
+			<div class="withdraw-row" @click="showNetworkSheet = true">
+				<span class="withdraw-label">{{ $t('转账网络') }}</span>
+				<div class="withdraw-row-right">
+					<span class="withdraw-value">{{ blockName || '–' }}</span>
+					<van-icon name="arrow" class="withdraw-arrow" />
+				</div>
+			</div>
+			<div class="withdraw-row" @click="showSymbol = true">
+				<span class="withdraw-label">{{ $t('选择币种') }}</span>
+				<div class="withdraw-row-right">
+					<span class="withdraw-value">{{ value }}</span>
+					<van-icon name="arrow" class="withdraw-arrow" />
+				</div>
+			</div>
+		</div>
+		<!-- 第二部分:地址 + 数量 -->
+		<div class="withdraw-part withdraw-part-2">
+			<div class="withdraw-block">
+				<div class="withdraw-label">{{ $t('地址') }}</div>
+				<div class="withdraw-input-row">
+					<input v-model="address" type="text" class="withdraw-input" :placeholder="$t('长按粘贴')" />
+					<span class="withdraw-paste" @click="pastCont">{{ $t('粘贴') }}</span>
+					<img src="@/assets/image/public/scan.png" alt="scan" class="withdraw-scan" @click="clickCode" />
+				</div>
+			</div>
+			<div class="withdraw-block">
+				<div class="withdraw-label">{{ $t('数量') }}</div>
+				<div class="withdraw-input-row withdraw-quantity-row">
+					<input v-model="amount" type="number" class="withdraw-input" :placeholder="$t('请输入提币数量')"
+						maxlength="10" @input="changeInput" />
+					<span class="withdraw-unit">{{ value }}</span>
+					<span class="withdraw-all" @click="allBtn">{{ $t('全部') }}</span>
+				</div>
+				<div class="withdraw-fee-balance">
+					<span class="withdraw-fee">{{ $t('提现费用') }}: {{ fee || '0' }} {{ value }}</span>
+					<div class="withdraw-balance-col">
+						<span>{{ $t('可用') }}: {{ getwei(usdtBalance * 1, numLenth) || '0' }} {{ value }}</span>
+						<span>Locked: 0 {{ value }}</span>
+						<span>{{ $t('可提现') }}: ≈{{ getwei(usdtBalance * 1, numLenth) || '0' }} {{ value }}</span>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<div class="withdraw-body-footer">
+			<van-button class="withdraw-submit-btn" @click="onMainSubmit">
+				{{ $t('提交') }}
+			</van-button>
+		</div>
+
+		<!-- Network 选择 -->
+		<van-action-sheet v-model:show="showNetworkSheet" :actions="networkActions" @select="onSelectNetwork" />
+
+		<!-- Currency 选择 -->
+		<van-action-sheet v-model:show="showSymbol" :actions="actions.filter(item => item.name !== value)" @select="onSelect" />
+
+		<!-- Payment Password 弹框 (图二) -->
+		<van-popup v-model:show="showPasswordPopup" position="bottom" round class="withdraw-password-popup">
+			<div class="withdraw-password-box">
+				<div class="withdraw-password-head">
+					<span class="withdraw-password-title">{{ $t('fundsPassword') }}</span>
+					<van-icon name="cross" class="withdraw-password-close" @click="showPasswordPopup = false" />
+				</div>
+				<input v-model="safeword" type="password" class="withdraw-password-input"
+					:placeholder="$t('fundsPasswordContTips')" maxlength="6" />
+				<div class="withdraw-password-forgot-wrap">
+					<span class="withdraw-password-forgot" @click="onForgotPassword">{{ $t('忘记资金密码?') }}</span>
+				</div>
+				<van-button class="withdraw-password-submit" @click="onConfirm">
+					{{ $t('提交') }}
+				</van-button>
+			</div>
+		</van-popup>
+
+		<bar-scan v-if="scancode" @ok="getResult"></bar-scan>
+	</div>
 </template>
 
 <script>
-import { Popup, ActionSheet, showToast } from "vant"
-import Axios from "@/service/recharge.js"
-import { _withdrawFee,_withdrawApply } from "@/service/withdraw.api.js"
+import { Popup, ActionSheet, showToast } from "vant";
+import Axios from "@/service/recharge.js";
+import { _widtGetSessionToken, _withdrawFee, _withdrawApply } from "@/service/withdraw.api.js";
 import assetsHead from "@/components/Transform/assets-head/index.vue";
 import BarScan from '@/components/Transform/scan/scan.vue';
 import { _getAllWallet } from "@/service/fund.api";
+import { throttle } from "@/utils/index.js";
+
 export default {
-  name: "withdrawPage",
-  components: {
-    assetsHead,
-    [Popup.name]: Popup,
-    [ActionSheet.name]: ActionSheet,
-    BarScan
-  },
-  data() {
-    return {
-      tip: '',
-      value: 'USDT', //选中的币种
-      show: false,
-      showSymbol: false,
-      actions: [{ name: 'USDT' }, { name: 'BTC' }, { name: 'ETH' }, { name: 'USDC' }],
-      blockList: [],
-      blockchainIndex: "",
-      usdtBalance: "", //余额
-      amount: "",//提现金额
-      fee: "", //手续费
-      volume_last: "",//到账金额
-      blockName: "",//当前链名称
-      address: "",// 二维码扫描结果
-      scancode: false,//控制是否使用扫一扫功能
-      withdraw_fee_type: '',
-      percent: 0,
-      numLenth: 3
-    }
-  },
-  created() {
-    this.getBlock(this.value);
-    this.getAvailable(this.actions[0].name);
-
-
-    Axios.getRechargeTips({
-      language: this.$i18n.locale,
-      token: this.$store.state.user.userInfo.token,
-      content_code: '003',
-    }).then(res => {
-      this.tip = res.content
-    }).catch(err => {
-      if (err.code === 'ECONNABORTED') { showToast(this.$t('网络超时!')); }
-      else if (err.msg !== undefined) { showToast(this.$t(err.msg)); }
-    })
-    _withdrawFee({
-      amount: 1,
-      channel: this.value + '_' + this.blockName
-    }).then((res) => {
-      this.withdraw_fee_type = res.withdraw_fee_type
-      if (this.withdraw_fee_type == 'rate') {
-        this.percent = res.fee
-      } else {
-        this.fee = res.fee;
-      }
-    });
-  },
-  methods: {
-    getwei(value, numLenth) {
-      console.log(numLenth)
-      let str = value.toString();
-      let strIndex = str.indexOf('.');
-      if (strIndex === -1) return str;
-      str = str.substring(0, strIndex + numLenth);
-      console.log(str, numLenth)
-      return str;
-    },
-    // 打开相机
-    clickCode() {
-      this.scancode = true;
-    },
-    //返回扫描结果并关闭摄像头
-    getResult(result) {
-      this.address = result;
-      if (result !== "") {
-        this.scancode = false;
-      }
-    },
-    showDetail() {
-      if (this.address.length > 63 || this.address.length == 0) {
-        showToast(this.$t('提现地址格式错误'))
-        return
-      }
-      if (!this.amount) {
-        showToast(this.$t('请输入正确数量'))
-        return
-      }
-      if (this.amount / 1 > this.usdtBalance / 1) {
-        showToast(this.$t('金额不足'))
-        return
-      }
-      this.show = true;
-    },
-    goRouter(params) {
-      this.$router.push({
-        path: params,
-        query: {
-          type: '2',
-          back: "1"
-        }
-      });
-    },
-    // onConfirm() {
-    //     this.$router.push('/withdraw/withdrawSumbit')
-    // },
-    //选中币种
-    onSelect(item) {
-      this.amount = ''
-      this.volume_last = ''
-      this.fee = ''
-      this.showSymbol = false;
-      this.value = item.name;
-      this.withdraw_fee_type = ''
-      this.getBlock(item.name);
-      this.getAvailable(item.name)
-      if (item.name == 'BTC' || item.name == 'ETH') {
-        this.numLenth = 7
-        _withdrawFee({
-          amount: 1,
-          channel: this.value + '_' + this.blockName
-        }).then((res) => {
-          this.withdraw_fee_type = res.withdraw_fee_type
-          if (this.withdraw_fee_type == 'fixed') {
-            this.fee = res.fee;
-          } else {
-            this.percent = res.fee
-          }
-        });
-      } else {
-        this.numLenth = 3
-      }
-    },
-    //根据币种获取链地址
-    getBlock(symbol) {
-      Axios.getBlock({
-        coin: symbol
-      }).then((res) => {
-        this.blockList = res;
-        this.blockName = res[0].blockchain_name;
-      });
-    },
-    //选中链名称
-    changeBlockchain(item, index) {
-      this.blockchainIndex = index;
-      this.blockName = item.blockchain_name;
-    },
-    //获取钱包余额
-    getAvailable(symbol) {
-      _getAllWallet().then((res) => {
-        let walletList = res.extends;
-        let initObj = walletList.find(item => {
-          return item.symbol_data.toLowerCase() == symbol.toLowerCase()
-        })
-        this.usdtBalance = initObj.volume
-      });
-    },
-    //点全部
-    allBtn() {
-      this.amount = this.getwei(this.usdtBalance, this.numLenth);
-      this.changeInput()
-    },
-    //输入改变
-    changeInput() {
-      if (this.amount === '') {
-        this.volume_last = '0.00'
-        return
-      }
-      if (this.amount.length > 11) {
-        this.amount = this.amount.slice(0, 11)
-      }
-
-      if (this.withdraw_fee_type == 'part') {
-        _withdrawFee({
-          amount: this.amount,
-          channel: this.value + '_' + this.blockName
-        }).then((res) => {
-          console.log(res)
-          this.fee = res.fee;
-          this.volume_last = res.volume_last;
-        });
-      } else if (this.withdraw_fee_type == 'rate') {
-        if (this.amount == '') {
-          this.volume_last = 0
-        } else {
-          this.fee = this.getwei(this.percent * this.amount, this.numLenth)
-          this.volume_last = this.getwei(this.amount * 1 - this.percent * this.amount, this.numLenth)
-        }
-      } else {
-        if (this.amount * 1 < this.fee * 1) {
-          console.log('a')
-          this.volume_last = 0
-        } else {
-          this.volume_last = this.getwei(this.amount * 1 - this.fee * 1, this.numLenth)
-        }
-      }
-
-    },
-    //提币提交
-    onConfirm() {
-      if (!this.amount) {
-        showToast(this.$t('请输入数量'));
-        return;
-      }
-
-      let numReg = /^[0-9]+([.]{1}[0-9]+){0,1}$/;
-      if (!numReg.test(this.amount)) {
-        showToast(this.$t('请输入数字'));
-        return;
-      }
-
-      if (!this.address) {
-        showToast(this.$t('请输入提现地址'));
-        return;
-      }
-
-      if (this.amount && this.address) {
-        // this.$router.push({
-        //   path: '/cryptos/withdraw/securityVerification',
-        //   query: {
-        //     amount: this.amount,
-        //     from: this.address,
-        //     channel: this.value + '_' + this.blockName
-        //   }
-        // })
-        _withdrawApply({
-            session_token:this.sessionToken,
-            amount:this.amount,
-            from:this.address,
-            channel:this.value+'_'+ this.blockName
-        }).then((res)=> {
-			console.log('123123123123123',res);
-            if(res.code==0) {
-                this.$router.push({
-                    path:"/withdraw/withdrawSumbit"
-                });
-            }else{
-              this.$toast(this.$t(res.msg));
-            }
-            this.getToken();
-        });
-      } else {
-        showToast(this.$t('请输入提币数量'));
-      }
-    },
-    async pastCont() {
-      this.address = await navigator.clipboard.readText();
-    }
-  }
-}
+	name: "withdrawPage",
+	components: {
+		assetsHead,
+		[Popup.name]: Popup,
+		[ActionSheet.name]: ActionSheet,
+		BarScan
+	},
+	data() {
+		return {
+			tip: '',
+			value: 'USDT',
+			showSymbol: false,
+			showNetworkSheet: false,
+			showPasswordPopup: false,
+			actions: [{ name: 'USDT' }, { name: 'BTC' }, { name: 'ETH' }, { name: 'USDC' }],
+			blockList: [],
+			blockchainIndex: 0,
+			usdtBalance: "",
+			amount: "",
+			fee: "",
+			volume_last: "",
+			blockName: "",
+			address: "",
+			scancode: false,
+			withdraw_fee_type: '',
+			percent: 0,
+			numLenth: 3,
+			safeword: '',
+			sessionToken: ''
+		};
+	},
+	computed: {
+		networkActions() {
+			return (this.blockList || []).map((item, index) => ({
+				name: item.blockchain_name,
+				index
+			}));
+		}
+	},
+	created() {
+		_widtGetSessionToken().then((res) => {
+			this.sessionToken = (res && res.session_token) ? res.session_token : '';
+		}).catch(() => {});
+		this.getBlock(this.value);
+		this.getAvailable(this.actions[0].name);
+		Axios.getRechargeTips({
+			language: this.$i18n.locale,
+			token: this.$store.state.user.userInfo.token,
+			content_code: '003',
+		}).then(res => {
+			this.tip = res.content;
+		}).catch(() => {});
+		this.fetchFee();
+	},
+	methods: {
+		goBack() {
+			this.$router.push('/quotes/index?tabActive=1');
+		},
+		fetchFee() {
+			_withdrawFee({
+				amount: 1,
+				channel: this.value + '_' + (this.blockName || (this.blockList[0] && this.blockList[0].blockchain_name))
+			}).then((res) => {
+				this.withdraw_fee_type = res.withdraw_fee_type;
+				if (this.withdraw_fee_type === 'rate') {
+					this.percent = res.fee;
+				} else {
+					this.fee = res.fee;
+				}
+			}).catch(() => {});
+		},
+		getwei(value, numLenth) {
+			let str = (value || 0).toString();
+			const strIndex = str.indexOf('.');
+			if (strIndex === -1) return str;
+			return str.substring(0, strIndex + numLenth);
+		},
+		clickCode() {
+			this.scancode = true;
+		},
+		getResult(result) {
+			this.address = result || '';
+			if (result !== "") this.scancode = false;
+		},
+		onMainSubmit() {
+			if (!this.address || this.address.length > 63) {
+				showToast(this.$t('提现地址格式错误'));
+				return;
+			}
+			if (!this.amount) {
+				showToast(this.$t('请输入正确数量'));
+				return;
+			}
+			if (this.amount / 1 > this.usdtBalance / 1) {
+				showToast(this.$t('金额不足'));
+				return;
+			}
+			this.showPasswordPopup = true;
+		},
+		onSelectNetwork(item) {
+			this.blockchainIndex = item.index;
+			this.blockName = item.name;
+			this.showNetworkSheet = false;
+			this.fetchFee();
+		},
+		goRouter(params) {
+			this.$router.push({ path: params, query: { type: '2', back: "1" } });
+		},
+		onSelect(item) {
+			this.amount = '';
+			this.volume_last = '';
+			this.fee = '';
+			this.showSymbol = false;
+			this.value = item.name;
+			this.withdraw_fee_type = '';
+			this.getBlock(item.name);
+			this.getAvailable(item.name);
+			if (item.name === 'BTC' || item.name === 'ETH') {
+				this.numLenth = 7;
+				_withdrawFee({
+					amount: 1,
+					channel: this.value + '_' + this.blockName
+				}).then((res) => {
+					this.withdraw_fee_type = res.withdraw_fee_type;
+					if (this.withdraw_fee_type === 'fixed') this.fee = res.fee;
+					else this.percent = res.fee;
+				});
+			} else {
+				this.numLenth = 3;
+			}
+		},
+		getBlock(symbol) {
+			Axios.getBlock({ coin: symbol }).then((res) => {
+				this.blockList = res || [];
+				this.blockName = this.blockList[0] ? this.blockList[0].blockchain_name : '';
+				this.blockchainIndex = 0;
+				this.fetchFee();
+			});
+		},
+		getAvailable(symbol) {
+			_getAllWallet().then((res) => {
+				const walletList = (res.extends || []);
+				const initObj = walletList.find(item => (item.symbol_data || '').toLowerCase() === (symbol || '').toLowerCase());
+				this.usdtBalance = initObj ? initObj.volume : '';
+			});
+		},
+		allBtn() {
+			this.amount = this.getwei(this.usdtBalance, this.numLenth);
+			this.changeInput();
+		},
+		changeInput() {
+			if (this.amount === '') {
+				this.volume_last = '0.00';
+				return;
+			}
+			if (this.amount.length > 11) this.amount = this.amount.slice(0, 11);
+			if (this.withdraw_fee_type === 'part') {
+				_withdrawFee({
+					amount: this.amount,
+					channel: this.value + '_' + this.blockName
+				}).then((res) => {
+					this.fee = res.fee;
+					this.volume_last = res.volume_last;
+				});
+			} else if (this.withdraw_fee_type === 'rate') {
+				this.fee = this.amount ? this.getwei(this.percent * this.amount, this.numLenth) : '0';
+				this.volume_last = this.amount ? this.getwei(this.amount * 1 - this.percent * this.amount, this.numLenth) : '0';
+			} else {
+				this.volume_last = (this.amount * 1 < this.fee * 1) ? '0' : this.getwei(this.amount * 1 - this.fee * 1, this.numLenth);
+			}
+		},
+		onForgotPassword() {
+			this.showPasswordPopup = false;
+			// 可跳转忘记资金密码页
+		},
+		onConfirm: throttle(function () {
+			if (!this.amount) {
+				showToast(this.$t('请输入数量'));
+				return;
+			}
+			const numReg = /^[0-9]+([.]{1}[0-9]+){0,1}$/;
+			if (!numReg.test(this.amount)) {
+				showToast(this.$t('请输入数字'));
+				return;
+			}
+			if (!this.address) {
+				showToast(this.$t('请输入提现地址'));
+				return;
+			}
+			if (!this.safeword) {
+				showToast(this.$t('fundsPasswordContTips'));
+				return;
+			}
+			_withdrawApply({
+				session_token: this.sessionToken,
+				amount: this.amount,
+				safeword: this.safeword,
+				from: this.address,
+				channel: this.value + '_' + this.blockName
+			}).then(() => {
+				this.showPasswordPopup = false;
+				this.$router.push({ path: "/cryptos/withdraw/withdrawSumbit" });
+			}).catch(err => {
+				if (err.code == 105) {
+					showToast(this.$t('当前还需交易%s,才可提币', { 'MONEY': err.msg }));
+				} else if (err.code === 'ECONNABORTED') {
+					showToast(this.$t('网络超时!'));
+				} else if (err.msg !== undefined) {
+					showToast(this.$t(err.msg));
+				}
+			});
+		}, 1000),
+		async pastCont() {
+			try {
+				if (navigator.clipboard && navigator.clipboard.readText) {
+					this.address = await navigator.clipboard.readText();
+				}
+			} catch (e) {}
+		}
+	}
+};
 </script>
+
 <style lang="scss" scoped>
-@import "@/assets/init.scss";
+.withdraw-wrap {
+	min-height: 100vh;
+	background: #f5f5f5;
+	padding-bottom: 2rem;
+}
+.withdraw-head-icon {
+	width: 1.375rem;
+	height: 1.1875rem;
+}
+/* 两个独立 div:上下边距各 20px */
+.withdraw-part {
+	margin: 20px 1rem;
+	padding: 0 1.5rem;
+	background: #fff;
+	border-radius: 0.5rem;
+	overflow: hidden;
+}
+.withdraw-body-footer {
+	margin: 20px 1rem 2rem;
+	padding: 20px 0;
+}
+/* 字体加大 */
+.withdraw-row {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	min-height: 4rem;
+	padding: 40px 0;
+	font-size: 34px;
+}
+.withdraw-label {
+	color: #333;
+	font-weight: 600;
+}
+.withdraw-row-right {
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+	gap: 0.25rem;
+}
+.withdraw-value {
+	color: #333;
+	text-align: right;
+}
+.withdraw-arrow {
+	color: #999;
+	font-size: 34px;
+	flex-shrink: 0;
+}
+.withdraw-block {
+	padding: 1rem 0;
+}
+.withdraw-block .withdraw-label {
+	display: block;
+	margin-bottom: 0.75rem;
+	font-size: 34px;
+	color: #333;
+}
+.withdraw-input-row {
+	display: flex;
+	align-items: center;
+	background: transparent;
+	border-radius: 0.5rem;
+	padding: 0 1rem;
+	height: 4rem;
+}
+.withdraw-input {
+	flex: 1;
+	border: none;
+	background: transparent;
+	font-size: 34px;
+	color: #333;
+	outline: none;
+}
+.withdraw-input::placeholder {
+	color: #9b9b9b;
+}
+.withdraw-paste {
+	font-size: 32px;
+	color: #5e2bc8;
+	margin-left: 0.5rem;
+	cursor: pointer;
+}
+.withdraw-scan {
+	width: 2.25rem;
+	height: 2.25rem;
+	margin-left: 0.75rem;
+	cursor: pointer;
+}
+.withdraw-quantity-row .withdraw-unit {
+	font-size: 28px;
+	color: #9b9b9b;
+	margin-left: 0.5rem;
+}
+.withdraw-all {
+	font-size: 32px;
+	color: #5e2bc8;
+	margin-left: 0.75rem;
+	cursor: pointer;
+}
+.withdraw-fee-balance {
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-start;
+	margin-top: 0.75rem;
+	font-size: 28px;
+	color: #9b9b9b;
+	font-weight: normal;
+}
+.withdraw-balance-col {
+	display: flex;
+	flex-direction: column;
+	align-items: flex-end;
+	font-weight: normal;
+}
+.withdraw-balance-col span {
+	line-height: 1.5;
+}
+.withdraw-submit-btn {
+	width: 100%;
+	margin: 20px 0;
+	padding: 20px 0;
+	border: none;
+	border-radius: 0.5rem;
+	background: linear-gradient(90deg, #a443cf, #5e2bc8);
+	color: #fff !important;
+	font-size: 38px;
+	font-weight: 600;
+}
+:deep(.withdraw-submit-btn .van-button__text) {
+	color: #fff !important;
+}
 
-#cryptos {
-  .withdrawl-page {
-    width: 100%;
-    box-sizing: border-box;
-    font-size: 26px;
-  }
-
-  .van-popup.van-popup--bottom {
-    border-top-left-radius: 30px;
-    border-top-right-radius: 30px;
-  }
-
-  .pop-box {
-    border-top-left-radius: 30px;
-    border-top-right-radius: 30px;
-  }
-
-  .color-blue {
-    color: $btn_main;
-  }
-
-  .bg-grey-light {
-    background: $light-grey;
-  }
-
-  li {
-    &.active {
-      border-color: $color_main;
-      color: $color_main;
-    }
-  }
-
-  .van-button--default {
-    color: $text_color;
-  }
-
-  .btnMain {
-    background: $btn_main;
-  }
+/* Payment Password 弹框 - 字体加大 */
+.withdraw-password-popup {
+	border-radius: 1rem 1rem 0 0;
+}
+.withdraw-password-box {
+	padding: 2rem 1.5rem 3rem;
+	background: #fff;
+}
+.withdraw-password-head {
+	position: relative;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin-bottom: 2.5rem;
+}
+.withdraw-password-title {
+	font-size: 42px;
+	font-weight: 600;
+	color: #333;
+	text-align: center;
+}
+.withdraw-password-close {
+	position: absolute;
+	right: 0;
+	top: 50%;
+	transform: translateY(-50%);
+	font-size: 38px;
+	color: #999;
+	cursor: pointer;
+}
+.withdraw-password-input {
+	width: 100%;
+	padding: 2rem 1rem;
+	background: #f6f6f6;
+	border: none;
+	border-radius: 0.5rem;
+	font-size: 34px;
+	color: #333;
+	box-sizing: border-box;
+	outline: none;
+}
+.withdraw-password-input::placeholder {
+	color: #9b9b9b;
+}
+.withdraw-password-forgot-wrap {
+	text-align: right;
+	margin-top: 0.75rem;
+	margin-bottom: 1.5rem;
+}
+.withdraw-password-forgot {
+	font-size: 32px;
+	color: #666;
+	cursor: pointer;
+}
+.withdraw-password-submit {
+	width: 100%;
+	border: none;
+	border-radius: 0.5rem;
+	background: linear-gradient(90deg, #a443cf, #5e2bc8);
+	color: #fff !important;
+	font-size: 38px;
+	font-weight: 600;
+	margin-bottom: 40px;
+}
+:deep(.withdraw-password-submit .van-button__text) {
+	color: #fff !important;
 }
 </style>

--
Gitblit v1.9.3