src/api/index.ts

@@ -253,7 +253,51 @@ export async function videodel(data:any) {
     console.log(res)
 }
 
+/**
+ * 新增账户
+ */
+export async function accountadd(data?:any) {
+    const res = await post<Liveaddrule>('wallect',data);
+    if(res.code==0){
+        message.success("新增成功")
+    }
    
+    console.log(res)
+}
+
+interface SaleInfo{
+    total:number,
+    accountid:number,
+    memberid:number,
+    sn:string,
+    type:number,
+    typename:string,
+    money:string,
+    source:number,
+    remark:string,
+    deleted_at:string,
+    created_at:string,
+    updated_at:string,
+    basemoney:string
+}
+/**
+ * 交易明细
+ * @param data 
+ */
+export async function saleinfo(data?:any){
+    const res= await get<SaleInfo>('account',data)
+    console.log(res)
+}
+
+/**
+ * 申请提现
+ */
+export async function cashout(data?:any){
+    const res = await post<Liveaddrule>('withdrawal',data);
+    if(res.code==0){
+        message.success("新增成功")
+    }
+}
 /**
  * 发送验证码 
  * @param phone 手机号 

src/components/ReviewItemtwo.vue

@@ -0,0 +1,106 @@
+<template>
+    <div class="reviewitem">
+        <div class="top">
+            <img src="" alt="">
+            <div class="name">qweqw</div>
+            <!-- <div class="lv">
+                <div class="img">
+                    <img src="@/static/images/starred.png" alt="">
+                    <img src="@/static/images/starred.png" alt="">
+                    <img src="@/static/images/starred.png" alt="">
+                    <img src="@/static/images/star.png" alt="">
+                    <img src="@/static/images/star.png" alt="">
+                </div>
+                <div class="num">8.0</div>
+            </div> -->
+        </div>
+        <div class="cont">
+            dafjkldashfjksdhjkhfgjkdshjkfgsdhjkghjkshgjsjkhg
+        </div>
+        <div class="bottom">
+            <div class="date">2020-10-10</div>
+            <div class="reply">
+                回复
+                <span class="reply del">删除</span>
+            </div>
+          
+        </div>
+    </div>
+</template>
+<style lang="scss" scoped>
+.reviewitem{
+    width: 100%;
+    margin-bottom: 50px;
+    .top{
+        display: flex;
+        align-items: center;
+        >img{
+            width: 45px;
+            height: 45px;
+            border-radius: 50%;
+            background-color: #0f0;
+
+        }
+        .name{
+            font-size: 13px;
+            color: #111;
+            margin-left: 10px;
+
+        }
+        .lv{
+            display: flex;
+            align-items: center;
+            .img{
+                display: flex;
+                align-items: center;
+                >img{
+                    width: 12px;
+                    height: 12px;
+                    // background-color: #0f0;
+                    margin-left: 3px;
+                }
+            }
+            .num{
+                font-size: 11px;
+                color: #D12C2E;
+                margin-left: 3px;
+            }
+        }
+    }
+    .cont{
+        margin-left: 67px;
+        font-size: 11px;
+        line-height: 1.2;
+
+    }
+    .bottom{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-left: 67px;
+        margin-top: 25px;
+        .date{
+            font-size: 10px;
+            color: #999;
+
+        }
+        .reply{
+            font-size: 10px;
+            color: #08AE98;
+        }
+        .del{
+            color:#D12C2D!important;
+            margin-left: 28px;
+        }
+    }
+}
+</style>
+<script lang="ts">
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+    setup(){
+        console.log(1)
+    }
+})
+</script>

src/components/VideoReview.vue

@@ -11,11 +11,14 @@
         <div class="list">
             <ReviewItem></ReviewItem>
             <ReviewItem></ReviewItem>
-            <ReviewItem></ReviewItem>
+            <div class="huifu">
-            <ReviewItem></ReviewItem>
+                <ReviewItemtwo></ReviewItemtwo>
+                <ReviewItemtwo></ReviewItemtwo>
             </div>
            
-        <div class="reply">
+        </div>
+
+        <div>
             <a-textarea v-model:value="value" placeholder="Basic usage" :rows="4" />
             <div class="send">发表留言</div>
         </div>
@@ -75,16 +78,20 @@
 
         }
     }
+    .huifu{
+        margin-left: 56px;
+    }
     
 }
 </style>
 <script lang="ts">
 import { defineComponent } from 'vue';
 import ReviewItem from "./ReviewItem.vue"
-
+import ReviewItemtwo from "./ReviewItemtwo.vue"
 export default defineComponent({
     components:{
-        ReviewItem
+        ReviewItem,
+        ReviewItemtwo
     },
     serup(){
         console.log(1)

src/views/mine/Addaccount.vue

@@ -20,9 +20,9 @@
             v-model="paytype"
             class="accountlist"
             @change="onChange"
-            :default-value="1"
+            :default-value="4"
           >
-            <a-radio :value="1">
+            <a-radio :value="4">
               <img src="@/static/images/bank.png" alt="" class="icon icon1" />
               <span>银行卡</span>
             </a-radio>
@@ -30,7 +30,7 @@
               <img src="@/static/images/walletzfb.png" alt="" class="icon" />
               <span>支付宝</span>
             </a-radio>
-            <a-radio :value="3">
+            <a-radio :value="1">
               <img src="@/static/images/walletweixin.png" alt="" class="icon" />
               <span>微信</span>
             </a-radio>
@@ -59,16 +59,17 @@
           </a-radio-group>
         </div>
       </div>
-      <div class="cashoutmoney" v-if="paytype == 1 && ifchina">
+      <div class="cashoutmoney" v-if="paytype == 4 && ifchina">
+         <a-form >
           <div>
             <div class="infoitem">
               <span class="label label1">姓名</span>
-            <a-input v-model="money" class="shuru" placeholder="请输入姓名" />
+              <a-input v-model:value="accountinfo.mname" class="shuru" placeholder="请输入姓名" />
             </div>
             <div class="infoitem">
               <span class="label label1">卡号</span>
               <a-input
-              v-model="money"
+                v-model:value="accountinfo.bankcode"
                 class="shuru"
                 placeholder="请输入收款人储蓄卡号"
               />
@@ -76,26 +77,27 @@
             <div class="infoitem">
               <span class="label label1">开户行</span>
               <a-input
-              v-model="money"
+                v-model:value="accountinfo.bankname"
-              class="shuru shuru1"
+                class="shuru shuru2"
                 placeholder="请输入开户行"
               />
             </div>
           </div>
+         </a-form>
       </div>
       <div class="cashoutmoney" v-if="paytype == 2 && ifchina">
         <div>
           <div class="infoitem">
             <span class="label label1">帐号</span>
             <a-input
-              v-model="money"
+              v-model:value="accountinfo.account"
               class="shuru"
               placeholder="请输入支付宝账号/密码"
             />
           </div>
         </div>
       </div>
-      <div class="cashoutmoney" v-if="paytype == 3 && ifchina">
+      <div class="cashoutmoney" v-if="paytype == 1 && ifchina">
         <div class="label label1">扫码绑定</div>
         <div class="ewmbox">
           <img src="@/static/images/erweima.png" alt="" class="ewmpic" />
@@ -110,12 +112,12 @@
         <div>
           <div class="infoitem">
             <span class="label label1">账户名</span>
-            <a-input v-model="money" class="shuru" placeholder="请输入姓名" />
+            <a-input v-model="accountinfo.mname" class="shuru" placeholder="请输入姓名" />
           </div>
           <div class="infoitem">
             <span class="label label1">银行账户</span>
             <a-input
-              v-model="money"
+              v-model="accountinfo.bankcode"
               class="shuru shuru2"
               placeholder="请输入收款人储蓄卡号"
             />
@@ -123,7 +125,7 @@
           <div class="infoitem infoitem1">
             <div class="label label1 label2"> 银行BIC码 /swift code </div>
             <a-input
-              v-model="money"
+              v-model="accountinfo.bankname"
               class="shuru shuru1"
               placeholder="请输入开户行"
             />
@@ -136,22 +138,23 @@
           <div class="infoitem">
             <span class="label label1">帐号</span>
             <a-input
-              v-model="money"
+             v-model:value="accountinfo.account"
               class="shuru"
               placeholder="请输入账号"
             />
           </div>
         </div>
       </div>
-      <div class="cashoutall submit">提交</div>
+      <div class="cashoutall submit" @click="sub">提交</div>
       <NavBottom class="navbottom"></NavBottom>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "vue";
+import { defineComponent, ref, toRaw } from "vue";
 import NavBottom from "@/components/NavBottom.vue";
+import { accountadd } from '@/api';
 export default defineComponent({
   name: "Cashout",
   components: {
@@ -159,9 +162,15 @@ export default defineComponent({
   },
   setup() {
     const money = ref(0);
-    const paytype = ref(1);
+    const paytype = ref(4);
     const paytypeforign = ref(1);
-
+    const accountinfo = ref<any>({
+      type: 4,
+      account:"",
+      mname: "",
+      bankcode: "",
+      bankname: "",
+    });
     interface Changes {
         target: {
           value: number;
@@ -171,19 +180,26 @@ export default defineComponent({
     const onChange: (e: Changes) => void = (e: Changes) => {
       console.log("radio checked", e.target.value);
       paytype.value = e.target.value;
+      accountinfo.value.type=e.target.value
     };
     const onChange1: (e: Changes) => void = (e: Changes) => {
       console.log("radio checked", e.target.value);
       paytypeforign.value = e.target.value;
     };
-    const ifchina = ref(false);
+    function sub(){
+      console.log(toRaw(accountinfo.value),11)
+      accountadd(toRaw(accountinfo.value))
+    }
+    const ifchina = ref(true);
     return {
       money,
       onChange,
       paytype,
       ifchina,
       paytypeforign,
-      onChange1
+      onChange1,
+      sub,
+      accountinfo
     };
   },
 });

src/views/mine/Cashout.vue

@@ -18,8 +18,10 @@
         <div class="chooseitem">
           <div class="label">选择账户</div>
           <!-- <a-radio></a-radio> -->
+         {{payinfo.type}}
+          <a-radio-group v-model:value="payinfo.type" @change="onChange">
             <div class="accountlist">
-            <a-radio>
+              <a-radio :value="4">
                 <div class="accountitem">
                   <div class="hostinfo">
                     <div>
@@ -30,7 +32,9 @@
                   <div class="zhanghao">账号：6217 **** **** **** 175</div>
                 </div>
               </a-radio>
-            <a-radio>
+              
+              
+              <a-radio :value="2">
                 <div class="accountitem">
                   <div class="hostinfo">
                     <div>
@@ -45,7 +49,7 @@
                   <div class="zhanghao">账号：6217 **** **** **** 175</div>
                 </div>
               </a-radio>
-            <a-radio>
+              <a-radio :value="1">
                 <div class="accountitem">
                   <div class="hostinfo">
                     <div>
@@ -61,27 +65,30 @@
                 </div>
               </a-radio>
             </div>
+            </a-radio-group>
+          
         </div>
         <div class="cashoutmoney">
           <div class="label">提现金额</div>
           <div class="moneynum">
-            <a-input v-model="money" class="shuru" @change="moneychange" />
+            <a-input v-model:value="payinfo.money" class="shuru" />
             <div>￥</div>
-            <div class="cashoutall">全部金额</div>
+            <div class="cashoutall" @click="all">全部金额</div>
             <div class="desc">注：每笔提现收取0.1%服务费，最低￥0.1</div>
           </div>
         </div>
-        <div class="ale">*您的余额只有￥50，最低提现金额￥100</div>
+        <div class="ale">*您的余额只有￥{{yue}}，最低提现金额￥100</div>
       </div>
-      <div class="cashoutall submit">全部金额</div>
+      <div class="cashoutall submit" @click="sub">立即提现</div>
       <NavBottom class="navbottom"></NavBottom>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "vue";
+import { defineComponent, ref, toRaw } from "vue";
 import NavBottom from "@/components/NavBottom.vue";
+import { cashout } from '@/api';
 export default defineComponent({
   name: "Cashout",
   components: {
@@ -89,12 +96,40 @@ export default defineComponent({
   },
   setup() {
     const money = ref(0);
+    const payinfo=ref<any>({
+      type:4,
+      money:0,
+      account	:"",
+      mname:"",
+      bankcode:"",
+      bankname:"",
+      international:0
+
+    })
     const moneychange: (e: number) => void = (e: number) => {
       console.log(e);
     };
+    const yue=ref<number>(105)
+    function onChange(e: any) {
+      console.log(e.target.value);
+      payinfo.value.type=e.target.value
+    }
+    function all(){
+      payinfo.value.money=yue.value
+    }
+    function sub(){
+      console.log(toRaw(payinfo.value))
+      cashout(toRaw(payinfo.value))
+      
+    }
     return {
       money,
       moneychange,
+      payinfo,
+      onChange,
+      all,
+      yue,
+      sub
     };
   },
 });
@@ -108,6 +143,7 @@ export default defineComponent({
 }
 .cashout ::v-deep(.ant-radio) {
   top: 43px;
+  height:13px
 }
 .cashout {
   .mingxilist {

src/views/mine/Wallet.vue

@@ -129,9 +129,23 @@
       </div>
     </div>
     <div class="mingxilist">
+      <div class="mingxitop">
         <div class="tabs">
-        <div class="beforetab">明细查询</div>
+          <span class="tabtitle">明细查询</span>
+
+          <div :class="tabindex == 4 ? 'on' : ''" @click="tabchange(4)">
+            全部
           </div>
+          <div :class="tabindex == 0 ? 'on' : ''" @click="tabchange(0)">
+            收入
+          </div>
+          <div :class="tabindex == 1 ? 'on' : ''" @click="tabchange(1)">
+            支出
+          </div>
+        </div>
+        <a-range-picker @change="onChange" class="choosedate"  :placeholder="['请选择开始日期', '请选择结束日期']"/>
+      </div>
+
       <div>
         <table class="table">
           <thead>
@@ -201,10 +215,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
+import { defineComponent, onMounted, ref } from "vue";
 import NavBottom from "@/components/NavBottom.vue";
-import router from '@/router';
+import router from "@/router";
-import { getwallect } from '@/api';
+import { getwallect, saleinfo } from "@/api";
 export default defineComponent({
   name: "Wallet",
   components: {
@@ -213,21 +227,37 @@ export default defineComponent({
   setup() {
     const ifchina = false;
     const ifmingxi = true;
-    getwallect()
+    getwallect();
+      onMounted(async () => {
+
+      const res = await saleinfo();
+
+    });
+    const tabindex = ref(4);
+    function tabchange(e: number): void {
+      tabindex.value = e;
+      // console.log(videolist)
+    }
     function navto(index: number) {
       let url = "";
       switch (index) {
-        case 1: url = "/mine/addaccount"; break;
+        case 1:
-        case 2: url = "/mine/cashout"; break;
+          url = "/mine/addaccount";
+          break;
+        case 2:
+          url = "/mine/cashout";
+          break;
       }
       router.push({
-        path: url
+        path: url,
-      })
+      });
     }
     return {
       ifchina,
       ifmingxi,
-      navto
+      navto,
+      tabindex,
+      tabchange,
     };
   },
 });
@@ -236,7 +266,52 @@ export default defineComponent({
 .wallet ::v-deep(.ant-breadcrumb) > span:last-child {
   color: #08ae98;
 }
+.wallet ::v-deep(.ant-calendar-picker) {
+  width: 271px;
+  height: 25px;
+}
+.wallet ::v-deep(.ant-calendar-range-picker-input){
+  height: 25px;
+  font-size:9px;
+}
+.wallet ::v-deep(.ant-calendar-date){
+  font-size: 12px;
+}
 .wallet {
+  .tabs {
+    display: flex;
+    align-items: center;
+    flex-shrink: 0;
+    font-size: 13px;
+    font-weight: bold;
+    color: #111;
+    padding: 11px 0;
+    .tabtitle {
+      width: 60px;
+      margin-right: 30px;
+    }
+    > div {
+      margin-right: 38px;
+      cursor: pointer;
+      text-align: center;
+      width: 40px;
+      font-size:11px;
+    }
+    .on {
+      color: #08ae98;
+      position: relative;
+      &::before {
+        content: "";
+        display: block;
+        position: absolute;
+        bottom: -6px;
+        left: 8px;
+        width: 25px;
+        height: 1px;
+        background-color: #08ae98;
+      }
+    }
+  }
   .mywallet {
     width: 761px;
     margin-right: 18px;
@@ -413,6 +488,14 @@ export default defineComponent({
     background: white;
     border-radius: 18px;
     margin-top: 18px;
+    .mingxitop {
+      display: flex;
+      justify-content: space-between;
+    }
+    .choosedate{
+      margin:auto 0;
+      margin-right: 39px;
+    }
     .tabs {
       display: flex;
       flex-wrap: nowrap;