From e4f89e5a05408c5b1e507cecabca4df4f04b0e6c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=B7=B3?= <454313500@qq.com>
Date: Thu, 14 Mar 2024 18:32:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=8A=E7=BA=BF=E9=93=B6=E8=A1=8C?=
 =?UTF-8?q?=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Dtos/Bank/BankCardDto.cs                  |   9 +-
 Yi.Bbs.Vue3/src/apis/bankApi.js               |   5 +-
 .../src/components/ArticleContentInfo.vue     |   1 -
 Yi.Bbs.Vue3/src/hooks/useAuths.js             |   1 +
 Yi.Bbs.Vue3/src/layout/AppHeader.vue          |  25 +++-
 .../activity/components/ActivityNav.vue       |   6 +-
 Yi.Bbs.Vue3/src/stores/user.js                |  20 ++-
 Yi.Bbs.Vue3/src/views/bank/Index.vue          | 116 +++++++++++++++---
 .../src/views/bank/components/BankCard.vue    |  91 ++++++++++++--
 .../bank/components/ExchangeRateChart.vue     |   1 -
 .../views/bank/hooks/exchangeRateConfig.js    |   2 +-
 11 files changed, 230 insertions(+), 47 deletions(-)

diff --git a/Yi.Abp.Net8/module/bbs/Yi.Framework.Bbs.Application.Contracts/Dtos/Bank/BankCardDto.cs b/Yi.Abp.Net8/module/bbs/Yi.Framework.Bbs.Application.Contracts/Dtos/Bank/BankCardDto.cs
index 8e0fe990..82e5df09 100644
--- a/Yi.Abp.Net8/module/bbs/Yi.Framework.Bbs.Application.Contracts/Dtos/Bank/BankCardDto.cs
+++ b/Yi.Abp.Net8/module/bbs/Yi.Framework.Bbs.Application.Contracts/Dtos/Bank/BankCardDto.cs
@@ -10,7 +10,10 @@ namespace Yi.Framework.Bbs.Application.Contracts.Dtos.Bank
 {
     public class BankCardDto:EntityDto<Guid>
     {
-
+        /// <summary>
+        /// 满期限时间，可空
+        /// </summary>
+        public DateTime? FulltermTime { get; set; }
         public DateTime? LastDepositTime { get; set; }
         public DateTime CreationTime { get; set; }
 
@@ -31,10 +34,6 @@ namespace Yi.Framework.Bbs.Application.Contracts.Dtos.Bank
         public decimal MaxStorageMoney { get; set; }
 
 
-        /// <summary>
-        /// 满期限时间，可空
-        /// </summary>
-        public DateTime? Fullterm { get; set; }
 
         /// <summary>
         /// 银行卡状态
diff --git a/Yi.Bbs.Vue3/src/apis/bankApi.js b/Yi.Bbs.Vue3/src/apis/bankApi.js
index 517bc4e8..ab7b626c 100644
--- a/Yi.Bbs.Vue3/src/apis/bankApi.js
+++ b/Yi.Bbs.Vue3/src/apis/bankApi.js
@@ -29,13 +29,12 @@ export function applyingBankCard() {
 export function drawMoney(cardId) {
   return request({
     url: `/bank/draw/${cardId}`,
-    method: "put",
-    data: data,
+    method: "put"
   });
 }
 
 // 存款
-export function delUser(cardId,moneyNum) {
+export function depositMoney(cardId,moneyNum) {
   return request({
     url: `/bank/deposit/${cardId}/${moneyNum}`,
     method: "put"
diff --git a/Yi.Bbs.Vue3/src/components/ArticleContentInfo.vue b/Yi.Bbs.Vue3/src/components/ArticleContentInfo.vue
index b10187aa..26d5edf8 100644
--- a/Yi.Bbs.Vue3/src/components/ArticleContentInfo.vue
+++ b/Yi.Bbs.Vue3/src/components/ArticleContentInfo.vue
@@ -92,7 +92,6 @@ const props = defineProps(['code'])
 let codeCopyDic=[];
 const addCopyEvent=()=>{
     const copySpans = document.querySelectorAll('.copy');
-console.log(copySpans,"copySpans");
 // 为每个 copy span 元素添加点击事件
 copySpans.forEach(span => {
     
diff --git a/Yi.Bbs.Vue3/src/hooks/useAuths.js b/Yi.Bbs.Vue3/src/hooks/useAuths.js
index e9b86ab7..8b03190a 100644
--- a/Yi.Bbs.Vue3/src/hooks/useAuths.js
+++ b/Yi.Bbs.Vue3/src/hooks/useAuths.js
@@ -147,6 +147,7 @@ const currentUserInfo=computed(()=>{
     useUserStore().updateToken(token);
     try {
       // 存储用户信息
+
       await useUserStore().getInfo(); // 用户信息
       // 登录成功后 路由跳转
       // 如果有记录当前跳转页面
diff --git a/Yi.Bbs.Vue3/src/layout/AppHeader.vue b/Yi.Bbs.Vue3/src/layout/AppHeader.vue
index 130e4031..32001fe0 100644
--- a/Yi.Bbs.Vue3/src/layout/AppHeader.vue
+++ b/Yi.Bbs.Vue3/src/layout/AppHeader.vue
@@ -48,10 +48,17 @@
       </el-input>
     </div>
     <div class="user">
+
+
+      <div class="money" v-if="isLogin">钱钱：<span>{{money}}</span></div>
       <el-dropdown trigger="click">
         <AvatarInfo :size="30" :isSelf="true" />
+
         <template #dropdown>
+
+       
           <el-dropdown-menu v-if="isLogin">
+            <el-dropdown-item>你的钱钱：{{money}}</el-dropdown-item>
             <el-dropdown-item @click="enterProfile"
               >进入个人中心</el-dropdown-item
             >
@@ -60,11 +67,14 @@
             >
             <el-dropdown-item @click="logout">登出</el-dropdown-item>
           </el-dropdown-menu>
-          <el-dropdown-menu v-else="isLogin">
+          <el-dropdown-menu v-else>
             <el-dropdown-item @click="toLogin">去登录</el-dropdown-item>
           </el-dropdown-menu>
         </template>
       </el-dropdown>
+
+
+
       <div class="gitee" @click="handleGitClick">
         <el-tooltip effect="dark" content="在gitee找到我们" placement="bottom">
           <img src="@/assets/common/icons/gitee.png" alt="" />
@@ -86,12 +96,13 @@ import useUserStore from "@/stores/user.js";
 import useConfigStore from "@/stores/config";
 import useAuths from "@/hooks/useAuths";
 import { Session } from "@/utils/storage";
-
+import { storeToRefs } from 'pinia'
 const { isLogin, clearStorage } = useAuths();
 const configStore = useConfigStore();
 const router = useRouter();
 const route = useRoute();
 const userStore = useUserStore();
+const { money } = storeToRefs(userStore)
 const activeIndex = ref("1");
 const searchText = ref("");
 const handleSelect = (key, keyPath) => {
@@ -142,6 +153,16 @@ const handleGithubClick = () => {
 </script>
 
 <style scoped lang="scss">
+.money
+{
+
+  font-size: small;
+  color: #FED055;
+  margin: 0 5px;
+  span{
+    font-weight: 600;
+  }
+}
 .header {
   width: 1300px;
   display: flex;
diff --git a/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue b/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
index bc30dce7..280a2ec7 100644
--- a/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
+++ b/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
@@ -27,7 +27,7 @@
     <el-menu-item index="5" :route="{ path: '/activity/bank' }">
       <el-icon>
         <Money />
-      </el-icon> <span>银行(即将开放)</span>
+      </el-icon> <span>银行</span>
     </el-menu-item>
     <el-menu-item index="6" :route="{ path: '/activity/x' }">
       <el-icon>
@@ -40,10 +40,10 @@
 </template>
 <script setup>
 const handleOpen = (key, keyPath) => {
-  console.log(key, keyPath)
+  //console.log(key, keyPath)
 }
 const handleClose = (key, keyPath) => {
-  console.log(key, keyPath)
+ // console.log(key, keyPath)
 }
 </script>
 <style lang="scss" scoped>
diff --git a/Yi.Bbs.Vue3/src/stores/user.js b/Yi.Bbs.Vue3/src/stores/user.js
index ebf38c60..0d54b6ec 100644
--- a/Yi.Bbs.Vue3/src/stores/user.js
+++ b/Yi.Bbs.Vue3/src/stores/user.js
@@ -2,7 +2,7 @@ import { login, logout, register } from "@/apis/accountApi";
 import { getUserDetailInfo, getLoginCode } from "@/apis/auth";
 import useAuths from "@/hooks/useAuths";
 import { defineStore } from "pinia";
-
+import { getBbsUserProfile } from '@/apis/userApi.js'
 const { getToken, setToken, clearStorage } = useAuths();
 
 const useUserStore = defineStore("user", {
@@ -16,6 +16,7 @@ const useUserStore = defineStore("user", {
     permissions: [],
     codeImageURL: "",
     codeUUid: "",
+    money:0
   }),
   getters: {},
   actions: {
@@ -42,8 +43,10 @@ const useUserStore = defineStore("user", {
     // 获取用户信息
     getInfo() {
       return new Promise((resolve, reject) => {
+
         getUserDetailInfo()
-          .then((response) => {
+          .then(async (response) => {
+  
             const res = response.data;
             const user = res.user;
             const avatar =
@@ -59,6 +62,7 @@ const useUserStore = defineStore("user", {
             } else {
               this.roles = ["ROLE_DEFAULT"];
             }
+     
             // this.roles = ["admin"];
             // this.permissions=["*:*:*"]
             this.name = user.nick;
@@ -66,11 +70,23 @@ const useUserStore = defineStore("user", {
 
             this.userName = user.userName;
             this.id = user.id;
+       
+
+          //获取bbs信息
+         const  {data:bbsData}=  await  getBbsUserProfile(this.id)
+             
+     
+            this.money= bbsData.money;
+   
             resolve(res);
           })
           .catch((error) => {
             reject(error);
           });
+
+
+
+
       });
     },
     // 退出系统
diff --git a/Yi.Bbs.Vue3/src/views/bank/Index.vue b/Yi.Bbs.Vue3/src/views/bank/Index.vue
index 118b8717..074c9cf4 100644
--- a/Yi.Bbs.Vue3/src/views/bank/Index.vue
+++ b/Yi.Bbs.Vue3/src/views/bank/Index.vue
@@ -4,7 +4,7 @@
     <div>
       <ExchangeRate :option="statisOptions" />
       <div class="div-show">
-        <p class="p-rate">当前实时利息：<span>110%</span>（可获取投入的百分之110%的本金）</p>
+        <p class="p-rate">当前实时利息：<span>130%</span>（可获取投入的百分之130%的本金）</p>
         <el-button type="primary" @click="applying()"><el-icon>
             <AddLocation />
           </el-icon>申领银行卡</el-button>
@@ -12,48 +12,132 @@
     </div>
     <el-divider />
     <div>
-      <el-row :gutter="20">
-        <el-col :span=8 v-for="item in bankCardList">
-          <BankCard></BankCard>
+      <el-row :gutter="20" v-if="bankCardList.length > 0">
+
+        <el-col :span=8 v-for="item in bankCardList" :key="item.id">
+          <BankCard :card="item" @handlerDeposit="handlerDeposit(item.id)" @handlerDraw="sendDraw(item.id)"></BankCard>
         </el-col>
       </el-row>
-
+      <div v-else> <el-alert title="当前暂未拥有银行卡，请申请！" type="info" center :closable="false" /></div>
     </div>
+
+    <el-dialog v-model="depositDialogVisible" title="输入您的存款金额，最低不能少于50，该卡最大上限100" width="600">
+      <el-form :model="depositForm" ref="depositFormRef"  >
+        <el-form-item label="存入金额" prop="number">
+          <el-input-number v-model="depositForm.number" :min="50" :max="100"  autocomplete="off"/>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="depositDialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="sendDeposit">
+            确认存入该卡中
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 <script setup>
 import BankCard from "./components/BankCard.vue"
 import ExchangeRate from "./components/ExchangeRateChart.vue"
-import { getBankCardList, applyingBankCard, getInterestList } from '@/apis/bankApi'
+import { getBankCardList, applyingBankCard, getInterestList, depositMoney,drawMoney } from '@/apis/bankApi'
 import useAuths from '@/hooks/useAuths.js';
-import { computed, ref,onMounted } from "vue";
-
+import { computed, ref, onMounted,reactive } from "vue";
+import useUserStore from "@/stores/user";
 const { isLogin } = useAuths();
 const bankCardList = ref([]);
+const interestList = ref([]);
+const depositForm = ref({
+  cardId: null,
+  number: 50
+});
+const userStore=useUserStore();
+
+const depositFormRef = ref(null)
+
+const depositDialogVisible = ref(false);
 
-const interestList=ref([]);
 const refreshData = async () => {
 
   if (isLogin) {
-  const {data} = await getBankCardList();
-  bankCardList.value=data;
+    const { data } = await getBankCardList();
+    bankCardList.value = data;
   }
 
-   const {data2:data}  = await getInterestList();
-  interestList.value =data;
+  const { data2: data } = await getInterestList();
+  interestList.value = data;
 }
 
 onMounted(async () => {
   await refreshData();
 })
+
+//申请银行卡
 const applying = async () => {
- // await applyingBankCard();
+
+  ElMessageBox.confirm(
+    '现在要向行长申领银行卡吗？行长会根据你的【等级】信誉可为你开通不同数量的银行卡',
+    '提交申请',
+    {
+      confirmButtonText: '申请',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(async () => {
+      await applyingBankCard();
+      ElMessage({
+        type: 'success',
+        message: '领取成功',
+      })
+      await refreshData();
+    });
   //刷新一下
-  await refreshData();
+
 }
 
+//打开存款面板
+const handlerDeposit = (cardId) => {
+  depositForm.value.cardId = cardId;
+  depositDialogVisible.value = true;
+}
+//进行提款操作
+const sendDraw=async (cardId)=>{
+  ElMessageBox.confirm(
+    '确定现在进行提款吗？如果提前提款，将只能获取存入的本金',
+    '提款',
+    {
+      confirmButtonText: '确认提款',
+      cancelButtonText: '取消',
+      type: 'warning',
+    }
+  )
+    .then(async () => {
+      await drawMoney(cardId)
+      await refreshData();
+      await userStore.getInfo();
+      ElMessage({
+        type: 'success',
+        message: '钱钱提款成功',
+      })
+    });
 
-const statisOptions = computed( () => {
+
+}
+
+//进行存款操作
+const sendDeposit = async () => {
+  await depositMoney(depositForm.value.cardId, depositForm.value.number);
+  depositDialogVisible.value=false;
+      await refreshData();
+     await userStore.getInfo();
+      ElMessage({
+        type: 'success',
+        message: '钱钱提款成功',
+      })
+}
+const statisOptions = computed(() => {
 
   return {
     xAxis: {
diff --git a/Yi.Bbs.Vue3/src/views/bank/components/BankCard.vue b/Yi.Bbs.Vue3/src/views/bank/components/BankCard.vue
index 7eefad0c..ec38656e 100644
--- a/Yi.Bbs.Vue3/src/views/bank/components/BankCard.vue
+++ b/Yi.Bbs.Vue3/src/views/bank/components/BankCard.vue
@@ -1,34 +1,99 @@
 <template>
     <div class="card">
-<div class="card-body">
-        银行卡-32659854213658541
-        <p>当前余额：100钱钱</p>
-        <p>状态：存款中</p>
-        <p>剩余定期提款时间还剩: 2天12小时</p>
-    </div>    
+        <div class="card-body"
+         :class="{ 'card-wait': cardData.bankCardState=='Wait',
+        'card-unused': cardData.bankCardState=='Unused'}">
+            银行卡-{{ cardData.id.substring(0,8) }}
+            <p>当前余额：{{ cardData.storageMoney }}钱钱</p>
+            <p>状态：{{ state }}</p>
+            <p v-if="cardData.bankCardState=='Wait'">剩余提款时间: {{ time }}</p>
+        </div>
         <div class="div-oper">
-            <el-button>存款</el-button><el-button type="danger">提款</el-button>
+            <el-button v-if="cardData.bankCardState=='Unused'" @click="handlerDeposit">存款</el-button>
+            <el-button v-if="cardData.bankCardState=='Wait'" type="danger" @click="handlerDraw(cardData.id)">提款</el-button>
         </div>
     </div>
 </template>
+<script setup>
+import {computed,watch,ref} from 'vue'
+const props = defineProps(['card'])
+const emit =defineEmits(['handlerDeposit'])
+const cardData=ref(props.card);
+const bankCardStateEnum=[
+{key:'Unused',value:"闲置中"},
+{key:'Wait',value:"存款中"}
+]
+const state=computed(()=>{
+   return bankCardStateEnum.filter(x=>x.key==cardData.value.bankCardState)[0].value
+})
+
+const time=computed(()=> {
+    // 将传入的字符串转换为时间对象
+    const inputDate = new Date(props.card.fulltermTime);
+    
+    // 获取当前时间
+    const currentDate = new Date();
+    
+    // 计算时间差（以毫秒为单位）
+    const timeDiff = inputDate.getTime() - currentDate.getTime();
+
+    // 如果传入时间早于当前时间，则返回"已满"提示
+    if (timeDiff <= 0) {
+        return "0";
+    }
+
+    // 将时间差转换为天、小时、分钟和秒
+    const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
+    const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))+1;
+    // 返回剩余时间字符串
+    return `${days}天${hours}时`;
+}
+)
+
+const handlerDraw=(cardId)=>{
+    emit('handlerDraw',cardId)
+}
+
+//存款
+const handlerDeposit=()=>{
+    emit('handlerDeposit')
+};
+
+watch(
+  () => props.card,
+   (val, oldValue) => {
+    cardData.value=props.card;
+  },
+  { immediate: true, deep: true }
+);
+</script>
 <style scoped lang="scss">
+.card-wait
+{
+    background-color:brown;
+}
+.card-unused
+{ background-color: #FDC830;
+   
+}
 .card {
     height: 140px;
     margin: 10px 0;
     border-radius: 15px;
     box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px 0px;
-    .card-body
-    {
+
+    .card-body {
         padding: 5px;
         height: 100px;
-        background-color: #FDC830;
-  color: #FFFFFF;
-      border-radius: 15px 15px 0 0;
+        // background-color: #FDC830;
+        color: #FFFFFF;
+        border-radius: 15px 15px 0 0;
     }
+
     .div-oper {
         padding: 5px;
         padding-right: 10px;
-        border-radius:0 0 15px 15px ;
+        border-radius: 0 0 15px 15px;
         background-color: #FFFFFF;
         text-align: end;
         height: 40px;
diff --git a/Yi.Bbs.Vue3/src/views/bank/components/ExchangeRateChart.vue b/Yi.Bbs.Vue3/src/views/bank/components/ExchangeRateChart.vue
index cc711af8..c9b9fa29 100644
--- a/Yi.Bbs.Vue3/src/views/bank/components/ExchangeRateChart.vue
+++ b/Yi.Bbs.Vue3/src/views/bank/components/ExchangeRateChart.vue
@@ -1,7 +1,6 @@
 <template>
     <div>
     <div class="rate v-chart"  ref="statis">
-        银行利息利息趋势图
     </div>
    
     
diff --git a/Yi.Bbs.Vue3/src/views/bank/hooks/exchangeRateConfig.js b/Yi.Bbs.Vue3/src/views/bank/hooks/exchangeRateConfig.js
index 809a8b52..8d8b4185 100644
--- a/Yi.Bbs.Vue3/src/views/bank/hooks/exchangeRateConfig.js
+++ b/Yi.Bbs.Vue3/src/views/bank/hooks/exchangeRateConfig.js
@@ -1,6 +1,6 @@
 export const exchangeRateConfig ={
   title: {
-    text: '银行利息趋势图'
+    text: '银行利息趋势图-（暂未开放）'
   },
   tooltip: {
     trigger: 'axis'