From c14cdd4737b582bb4f468f9d0a993c00cef590f4 Mon Sep 17 00:00:00 2001
From: yuyongdong <yuyongdong@kingsome.cn>
Date: Sat, 14 Sep 2024 14:35:41 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B4=A8=E6=8A=BCcec=20=E6=B5=8B=E8=AF=95?=
 =?UTF-8?q?=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/staking/cecDialog.vue  | 43 +++++++-------
 src/components/staking/conversion.vue | 66 +++++++++++----------
 src/components/staking/header.vue     |  5 +-
 src/components/staking/index.vue      | 83 ++++++++++++++-------------
 src/views/StakingView.vue             | 26 +++++----
 5 files changed, 122 insertions(+), 101 deletions(-)

diff --git a/src/components/staking/cecDialog.vue b/src/components/staking/cecDialog.vue
index 88c8a40..6232ec6 100644
--- a/src/components/staking/cecDialog.vue
+++ b/src/components/staking/cecDialog.vue
@@ -2,12 +2,12 @@
   <div class="cec-dialog" ref="cecModal">
     <a-modal
       :class="'cecDialog'"
-      v-model:open="props.cecDialogVisible"
+      :open="props.cecDialogVisible"
       :closable="false"
       :footer="null"
       :getContainer="() => $refs.cecModal"
       :maskClosable="false"
-      destroyOnClose
+      :destroyOnClose="true"
     >
       <div class="top-close" @click="handleCancel">
         <img src="@/assets/img/marketplace/Close_counter.png" alt />
@@ -22,7 +22,7 @@
             <div class="left">
               <span>{{ props.dialogText.typeLabel }}</span>
               <p>
-                <input type="number" :placeholder="placeholderAmount" v-model="modelAmount" @input="handleInput">
+                <input type="number" placeholder="Please enter the amount" v-model="modelAmount" @input="handleInput">
               </p>
             </div>
             <div class="right" @click="cecAmount">
@@ -42,7 +42,7 @@
           </li>
         </div>
         <div class="content-btn" @click="eventBtn">
-          Approve
+          {{ props.dialogText.btnText }}
         </div>
       </div>
     </a-modal>
@@ -50,7 +50,7 @@
 </template>
 
 <script setup>
-import { ref, inject } from "vue";
+import { ref, toRaw, watch, onUnmounted, inject } from "vue";
 const message = inject("$message");
 import { priceCalculated } from "@/configs/priceCalculate"
 
@@ -61,18 +61,12 @@ const props = defineProps({
   },
   dialogText: {
     type: Object,
-    required: true,
+    required: false,
   },
-  // buyDataArr: {
-  //   type: Array,
-  //   required: true,
-  // },
 });
-
-const placeholderAmount = ref(0)
 const emit = defineEmits(["handleClose", "eventBtn"]);
 const handleCancel = (e) => {
-  modelAmount.value = 0
+  modelAmount.value = ''
   emit("handleClose");
 };
 
@@ -84,19 +78,25 @@ const eventBtn = () => {
   }
 }
 
-const modelAmount = ref(0)
+const modelAmount = ref()
 const cecAmount = () => {
   modelAmount.value = priceCalculated(props.dialogText.amount)
 }
 
 const handleInput = (e) => {
-  if(Number(modelAmount.value) > Number(priceCalculated(props.dialogText.amount))) {
+  if(Number(modelAmount.value) == 0 || Number(modelAmount.value) < 0) {
+    modelAmount.value= ''
+  } else if(Number(modelAmount.value) > Number(priceCalculated(props.dialogText.amount))) {
     modelAmount.value = priceCalculated(props.dialogText.amount)
-  } else if(Number(modelAmount.value) == 0 || Number(modelAmount.value) < 0) {
-    modelAmount.value= 0
   }
 }
 
+watch(props,(preTest1, oldTest1) => {
+  if(!toRaw(preTest1).cecDialogVisible) {
+    modelAmount.value= ''
+  }
+});
+
 </script>
 
 <style lang="scss" scoped>
@@ -163,8 +163,9 @@ const handleInput = (e) => {
             font-size: 28px;
             font-family: 'Poppins';
             input {
-              width: 200px;
+              width: 260px;
               border: 0;
+              font-size: 28px;
               background: #2d2738;
               padding-left: 20px;
               box-sizing: border-box;
@@ -179,11 +180,13 @@ const handleInput = (e) => {
               margin: 0;
             }
             input::input-placeholder {
-              color: #fff;
+              font-size: 18px;
+              color: #B3B5DA;
             }
             input::-webkit-input-placeholder {
               //兼容WebKit browsers（Chrome的内核）
-              color: #fff;
+              font-size: 18px;
+              color: #B3B5DA;
             }
             input::-moz-placeholder {
               //Mozilla Firefox 4 to 18
diff --git a/src/components/staking/conversion.vue b/src/components/staking/conversion.vue
index 16c21b0..a1d36e3 100644
--- a/src/components/staking/conversion.vue
+++ b/src/components/staking/conversion.vue
@@ -102,13 +102,14 @@ const dialogUnstakeText = ref({
 const conversionModal = () => {
   cecDialogVisible.value = true
   dialogUnstakeText.value = {
-  title: "Vest esCEC",
-  typeLabel: "Vest",
-  tips: "Vest esCEC needs to lock amount of CEC",
-  typeName: "es CEC",
-  conversion: "CEC Locked",
-  conversionName: "CEC",
-  amount: stakingStore.cecInfoData.esCecBalance
+    title: "Vest esCEC",
+    typeLabel: "Vest",
+    tips: "Vest esCEC needs to lock amount of CEC",
+    typeName: "es CEC",
+    conversion: "CEC Locked",
+    conversionName: "CEC",
+    amount: stakingStore.cecInfoData.esCecBalance,
+    btnText: 'Confirm'
   }
 }
 
@@ -146,25 +147,34 @@ const eventBtnName = (val) => {
 
 // 转化
 const cecDeposit = async (_amount) => {
-  let amount = BigInt(_amount * 1e18)
-  loadingDialogVisible.value = true
-  try {
-    let res = await bc.vester.deposit(amount)
-    if(res.hash != '') {
-      refreshCecInfo()
-      cecDialogVisible.value = false
-      const confirmResult = await createModal(ConfirmDialog, {
+  if(Number(priceCalculated(stakingStore.cecInfoData.CecStaked)) < Number(_amount)) {
+    cecDialogVisible.value = false
+    const confirmResult = await createModal(ConfirmDialog, {
         title: "",
         noBtnTitle: '',
-        message: 'Conversion Successful'
+        message: 'Please stake a sufficient amount of CEC, which will be used to lock the corresponding amount of CEC when the esCEC is vested.'
       }).show();
+  } else {
+    let amount = BigInt(_amount * 1e18)
+    loadingDialogVisible.value = true
+    try {
+      let res = await bc.vester.deposit(amount)
+      if(res.hash != '') {
+        refreshCecInfo()
+        handleClose()
+        loadingDialogVisible.value = false
+        const confirmResult = await createModal(ConfirmDialog, {
+          title: "",
+          noBtnTitle: '',
+          message: 'Conversion Successful'
+        }).show();
+      }
+    } catch (e) {
+      if(e.message.indexOf('User denied transaction signature') == -1) {
+        message.error('User denied transaction signature')
+      }
       loadingDialogVisible.value = false
     }
-  } catch (e) {
-    if(e.message.indexOf('User denied transaction signature') == -1) {
-      message.error('User denied transaction signature')
-    }
-    loadingDialogVisible.value = false
   }
 }
 
@@ -175,13 +185,12 @@ const cecWithdraw = async () => {
     let res = await bc.vester.withdraw()
     if(res.hash != '') {
       refreshCecInfo()
-      cecDialogVisible.value = false
+      loadingDialogVisible.value = false
       const confirmResult = await createModal(ConfirmDialog, {
         title: "",
         noBtnTitle: '',
         message: 'Withdraw Successful'
       }).show();
-      loadingDialogVisible.value = false
     }
   } catch (e) {
     if(e.message.indexOf('User denied transaction signature') == -1) {
@@ -210,13 +219,12 @@ const claimCec = async () => {
     let res = await bc.vester.claim()
     if(res.hash != '') {
       refreshCecInfo()
-      cecDialogVisible.value = false
-      const confirmResult = await createModal(ConfirmDialog, {
-      title: "",
-      noBtnTitle: '',
-      message: 'Claim Successful'
-    }).show();
       loadingDialogVisible.value = false
+      const confirmResult = await createModal(ConfirmDialog, {
+        title: "",
+        noBtnTitle: '',
+        message: 'Claim Successful'
+      }).show();
     }
   } catch (e) {
     loadingDialogVisible.value = false
diff --git a/src/components/staking/header.vue b/src/components/staking/header.vue
index ffd72e7..71042eb 100644
--- a/src/components/staking/header.vue
+++ b/src/components/staking/header.vue
@@ -3,8 +3,8 @@
     <div class="staking-header-tit">
       <h1>STAKING OVERVIEW</h1>
       <div>
-        <p><span><img :src="icon_pass" alt=""></span> {{ stakingStore.bindPassportAddress ? sliceAddress(stakingStore.bindPassportAddress) : '-' }}</p>
-        <p><span>Email:</span> {{ stakingStore.bindPassportEmail ? stakingStore.bindPassportEmail : '-' }}</p>
+        <!-- <p><span><img :src="icon_pass" alt=""></span> {{ stakingStore.bindPassportAddress ? sliceAddress(stakingStore.bindPassportAddress) : '-' }}</p> -->
+        <!-- <p><span>Email:</span> {{ stakingStore.bindPassportEmail ? stakingStore.bindPassportEmail : '-' }}</p> -->
       </div>
     </div>
     <div class="content">
@@ -266,6 +266,7 @@ onMounted(() => {
       p {
         display: flex;
         align-items: center;
+        font-size: 18px;
         span {
           width: 40px;
           display: flex;
diff --git a/src/components/staking/index.vue b/src/components/staking/index.vue
index 285997a..e881037 100644
--- a/src/components/staking/index.vue
+++ b/src/components/staking/index.vue
@@ -61,7 +61,8 @@
             <span v-else class="no">Stake</span>
           </div>
           <div class="btn">
-            <span v-if="stakingStore.cecInfoData.CecStaked" @click="closeCecStakedText">Unstake</span>
+            <span v-if="Number(stakingStore.cecInfoData.CecStaked) - Number(stakingStore.cecInfoData.CecDisarm) == 0" class="no">Unstake</span>
+            <span v-else-if="Number(stakingStore.cecInfoData.CecStaked) != 0" @click="closeCecStakedText">Unstake</span>
             <span v-else class="no">Unstake</span>
           </div>
           <div class="btn">
@@ -184,7 +185,7 @@ const toLogin = async () => {
 const handleClose = () => {
   cecDialogVisible.value = false
 }
-
+console.log(stakingStore.cecInfoData.CecStaked, stakingStore.cecInfoData.CecDisarm)
 // 通用事件按钮
 const eventBtnName = (val) => {
   if(val.title == 'Stake CEC') {
@@ -200,39 +201,40 @@ const eventBtnName = (val) => {
 
 // cec stake
 const cecStakingText = async () => {
-  if(!stakingStore.bindPassportAddress) {
-    const confirmResult = await createModal(ConfirmDialog, {
-    title: 'Link your Passport.', 
-    message: 'Please note, once linked, it cannot be unlinked. Ensure you’re connecting the correct Passport.'
-    }).show()
-    if(confirmResult.errcode == 0) {
-      await new  BlockChain().appendPassport()
-      let res = await apiBindPassport({passport_jwt: 'Bearer ' + await new  BlockChain().passportToken()})
-      if(res.errcode == 0) {
-        message.success('Bind Successful')
-        refreshCecInfo()
-      } else if(res.errcode == 1) {
-        const confirmResult1 = await createModal(ConfirmDialog, {
-        title: '',
-        noBtnTitle: '',
-        message: 'This Immutable Passport is already connected to another wallet. Please use a different Immutable Passport.'
-      }).show()
-        if(confirmResult1.errcode == 0) {
-          new PassportWallet().logout();
-        }
-      }
-    } else {
-      message.error('User denied transaction signature')
-    }
-  } else {
+  // if(!stakingStore.bindPassportAddress) {
+  //   const confirmResult = await createModal(ConfirmDialog, {
+  //   title: 'Link your Passport.', 
+  //   message: 'Please note, once linked, it cannot be unlinked. Ensure you’re connecting the correct Passport.'
+  //   }).show()
+  //   if(confirmResult.errcode == 0) {
+  //     await new  BlockChain().appendPassport()
+  //     let res = await apiBindPassport({passport_jwt: 'Bearer ' + await new  BlockChain().passportToken()})
+  //     if(res.errcode == 0) {
+  //       message.success('Bind Successful')
+  //       refreshCecInfo()
+  //     } else if(res.errcode == 1) {
+  //       const confirmResult1 = await createModal(ConfirmDialog, {
+  //       title: '',
+  //       noBtnTitle: '',
+  //       message: 'This Immutable Passport is already connected to another wallet. Please use a different Immutable Passport.'
+  //     }).show()
+  //       if(confirmResult1.errcode == 0) {
+  //         new PassportWallet().logout();
+  //       }
+  //     }
+  //   } else {
+  //     message.error('User denied transaction signature')
+  //   }
+  // } else {
     cecDialogVisible.value = true
     dialogUnstakeText.value = {
       title: "Stake CEC",
       typeLabel: "Stake",
       typeName: "CEC",
-      amount: stakingStore.cecInfoData.cecBalance
+      amount: stakingStore.cecInfoData.cecBalance,
+      btnText: 'Confirm'
     }
-  }
+  // }
 }
 
 const closeCecStakedText = () => {
@@ -241,7 +243,8 @@ const closeCecStakedText = () => {
     title: "Unstake CEC",
     typeLabel: "Unstake",
     typeName: "CEC",
-    amount: stakingStore.cecInfoData.CecStaked - stakingStore.cecInfoData.CecDisarm
+    amount: stakingStore.cecInfoData.CecStaked - stakingStore.cecInfoData.CecDisarm,
+    btnText: 'Unstake'
   }
 }
 
@@ -265,7 +268,8 @@ const esCecStakingText = () => {
     title: "Stake esCEC",
     typeLabel: "Stake",
     typeName: "esCEC",
-    amount: stakingStore.cecInfoData.esCecBalance
+    amount: stakingStore.cecInfoData.esCecBalance,
+    btnText: 'Confirm',
   }
 }
 
@@ -275,7 +279,8 @@ const closeEsCecStakedText = () => {
     title: "Unstake esCEC",
     typeLabel: "Unstake",
     typeName: "esCEC",
-    amount: stakingStore.cecInfoData.esCecStaked
+    amount: stakingStore.cecInfoData.esCecStaked,
+    btnText: 'Unstake'
   }
 }
 // esCec end
@@ -294,7 +299,7 @@ const cecStaked = async (_amount) => {
     let res2 = await bc.staking.stakeCec(amount)
     if(res2.hash != '') {
       refreshCecInfo()
-      cecDialogVisible.value = false
+      handleClose()
       loadingDialogVisible.value = false
       const confirmResult = await createModal(ConfirmDialog, {
         title: '',
@@ -319,13 +324,13 @@ const closeStaked = async (type, _amount) => {
       let res = await bc.staking.unstakeCec(amount)
       if(res.hash != '') {
         refreshCecInfo()
+        handleClose()
+        loadingDialogVisible.value = false
         const confirmResult = await createModal(ConfirmDialog, {
           title: "",
           noBtnTitle: '',
           message: 'Unstake Successful'
         }).show();
-        cecDialogVisible.value = false
-        loadingDialogVisible.value = false
       }
     } catch (e) {
       if(e.message.indexOf('User denied transaction signature') == -1) {
@@ -338,13 +343,13 @@ const closeStaked = async (type, _amount) => {
       let res = await bc.staking.unstakeEsCec(amount)
       if(res.hash != '') {
         refreshCecInfo()
+        handleClose()
+        loadingDialogVisible.value = false
         const confirmResult = await createModal(ConfirmDialog, {
           title: "",
           noBtnTitle: '',
           message: 'Unstake Successful'
         }).show();
-        cecDialogVisible.value = false
-        loadingDialogVisible.value = false
       }
     } catch (e) {
       if(e.message.indexOf('User denied transaction signature') == -1) {
@@ -368,7 +373,6 @@ const getCecCollection = async (type) => {
           noBtnTitle: '',
           message: 'Claim Successful'
         }).show();
-        cecDialogVisible.value = false
         loadingDialogVisible.value = false
       }
     } catch (e) {
@@ -387,7 +391,6 @@ const getCecCollection = async (type) => {
           noBtnTitle: '',
           message: 'Claim Successful'
         }).show();
-        cecDialogVisible.value = false
         loadingDialogVisible.value = false
       }
     } catch (e) {
@@ -408,7 +411,7 @@ const esCecStaked = async (_amount) => {
     let res = await bc.staking.stakeEsCec(amount)
     if(res.hash != '') {
       refreshCecInfo()
-      cecDialogVisible.value = false
+      handleClose()
       loadingDialogVisible.value = false
       const confirmResult = await createModal(ConfirmDialog, {
         title: '',
diff --git a/src/views/StakingView.vue b/src/views/StakingView.vue
index ca960bb..eb87747 100644
--- a/src/views/StakingView.vue
+++ b/src/views/StakingView.vue
@@ -13,9 +13,14 @@
               <img src="@/assets/img/cec_activity/Icon_Disc.png" alt />
             </a>
           </div>
-          <div @click="toTwitter">
-            <img src="@/assets/img/cec_activity/Icon_X.png" alt />
+          <div>
+            <a href="https://x.com/playCounterFire" target="_blank" rel="noopener noreferrer">
+              <img src="@/assets/img/cec_activity/Icon_X.png" alt />
+            </a>
           </div>
+          <!-- <div @click="toTwitter">
+            <img src="@/assets/img/cec_activity/Icon_X.png" alt />
+          </div> -->
         </div>
         <div class="right">
           <div
@@ -218,12 +223,12 @@ const getNetId = async () => {
 
 // 判断是否绑定passport账号
 const getVipInfo = async () => {
-  const {errcode, info} = await apiVipInfo();
-  console.log("bind_passport_address", info.bind_passport_address);
-  if (errcode == 0) {
-    stakingStore.bindPassportAddress = info.bind_passport_address;
-    stakingStore.bindPassportEmail = info.bind_email;
-  }
+  // const {errcode, info} = await apiVipInfo();
+  // console.log("bind_passport_address", info.bind_passport_address);
+  // if (errcode == 0) {
+  //   stakingStore.bindPassportAddress = info.bind_passport_address;
+  //   stakingStore.bindPassportEmail = info.bind_email;
+  // }
 };
 
 // 发送推文
@@ -238,7 +243,7 @@ const toTwitter = () => {
 
 const userCecInfo = () => {
   getNetId();
-  getVipInfo();
+  // getVipInfo();
   getCecData();
 };
 
@@ -254,7 +259,7 @@ onMounted(() => {
   background: #16141b;
   color: #fff;
   .header {
-    width: 1506px;
+    width: 1420px;
     height: 316px;
     margin: 0 auto;
     display: flex;
@@ -276,6 +281,7 @@ onMounted(() => {
       // align-items: center;
       color: #fff;
       margin-top: 43px;
+      margin-right: -24px;
       .left {
         width: 106px;
         height: 47px;