添加幸福存折

src/components/newPersonalCenter/integral/RedBag.vue

+<template>
+  <div id="redBag">
+    <RedEnvel v-if="active==6" v-on:ChildEvent="ChildEvent"></RedEnvel>
+    <useDetails v-else></useDetails>
+  </div>
+</template>
+<script>
+import RedEnvel from './RedEnvelopes'
+import useDetails from './useDetails'
+export default {
+ components:{
+     RedEnvel:RedEnvel,
+     useDetails:useDetails,
+ },
+ props:{
+    data: ""
+  },
+  data () {
+    return {
+     active:"",
+    }
+  },
+  mounted() {
+    console.log('456', this.data)
+    this.active=this.data;
+  },
+  methods: {
+    ChildEvent(val){
+        console.log(val,"ChildEventChildEventChildEvent")
+        this.active=val;
+    },
+  }
+}
+</script>
+
+<style>
+
+</style>

src/components/newPersonalCenter/integral/useDetails.vue

+<template>
+  <div id="useDetails">
+    <div style="width:963px;background:#fff;padding:30px;box-sizing:border-box">
+      <p style="font-family:'PingFangR'">使用明细</p>
+      <div style="margin:20px 0">
+        <span style="margin-right:8px;font-size:14px">时间选择</span>
+          <span><el-date-picker @change="DateChange" size="small"
+        v-model="value2" value-format="yyyy-MM"
+        type="month"
+        placeholder="选择月">
+      </el-date-picker></span>
+      </div>
+      <div class="rentou-box">
+      <table style="width: 100%;"  cellpadding="0" cellspacing="0">
+          <tr class=" c66 rentou-box-table-head">
+          
+          <th>时间</th>
+          <th>描述</th>
+          <th>收入（支出）</th>
+          </tr>
+          <tr class="c11" v-for="(item,index) in dataList" :key="index">
+            <td width="120">{{item.updateTime | YMD}}</td>
+            <td>{{item.description}}</td>
+            <td width="120" style="color:#EE4454">￥{{item.money}}</td>
+          </tr>
+          
+        </table>
+        <div v-if="dataList.length==0" style="padding:15px 0;text-align:center">
+              <div class="empty-data"><i class="iconfont icon-kong"></i>
+                  很抱歉，你想要的信息我们真的找不到了
+              </div>
+          </div>
+      </div>
+    </div>
+    
+  </div>
+</template>
+<script>
+
+export default {
+ 
+  data () {
+    return {
+     value2:"",
+     dataList:[],
+    }
+  },
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    DateChange(val){
+      this.value2=val;
+      this.getList();
+    },
+    getList(){
+        this.apiJavaPost('/api/b2b/user/getBankbookUseDetail',{queryTime:this.value2},res=>{         
+            if(res.data.resultCode==1){
+                this.dataList=res.data.data.pageData;  
+
+            }else{
+                this.Error(res.data.message);
+            }
+            },null)
+    },
+  }
+}
+</script>
+
+<style scoped>
+#useDetails .rentou-box th{
+  color:#666666;
+  font-size: 14px;
+}
+#useDetails .rentou-box th,.rentou-box td {
+    padding: 8px  20px;
+    text-align: left !important;
+}
+#useDetails .rentou-box td{
+    font-size: 14px;
+    color:#111111;
+}
+#useDetails .rentou-box-table{
+    padding: 30px;
+}
+#useDetails .rentou-box-table-head{
+    box-shadow:0px 1px 0px 0px rgba(221,221,221, .7);
+    border-bottom:1px solid #DDDDDD;
+    background: #fff!important;
+}
+#useDetails table tr:nth-child(odd){
+    background:rgba(245,245,245,1);
+}
+</style>

src/components/newPersonalCenter/newPersonalCenter.vue

@@ -105,7 +105,7 @@
               </el-menu-item> -->
               <el-menu-item index="8" @click="clickMenu('6')">
                 <i><img style="width:19px;height:17px" src="../../assets/img/active/hb.png" alt=""></i>
-                <span>我的大红包</span>
+                <span>幸福存折</span>
               </el-menu-item>
             </el-menu>
           </el-col>
@@ -126,7 +126,7 @@
             <!-- 我的积分 -->
             <Integral v-else-if="active.indexOf('4-') !== -1" :data="active"/>
             <!-- 我的大红包 -->
-            <RedEnvelopes v-else-if="active.indexOf('6') !== -1" :data="active"/>
+            <RedBag v-else-if="active.indexOf('6') !== -1" :data="active"/>
           </el-col>
         </el-row>
       </div>
@@ -141,7 +141,7 @@ import MemberCenter from '@/components/newPersonalCenter/block/MemberCenter'
 import OrderCenter from '@/components/newPersonalCenter/block/OrderCenter'
 import MyCoupon from '@/components/newPersonalCenter/block/MyCoupon'
 import Integral from '@/components/newPersonalCenter/integral/index'
-import  RedEnvelopes from '@/components/newPersonalCenter/integral/RedEnvelopes'
+import  RedBag from '@/components/newPersonalCenter/integral/RedBag'
 export default {
   components: {
     HomePage,
@@ -151,7 +151,7 @@ export default {
     MyCoupon,
     Integral,
     CustomizedList,
-    RedEnvelopes
+    RedBag
   },
   data () {
     return {