|
@@ -3,16 +3,22 @@
|
|
|
<m-nav-bar :transparent="true" title="提现页面" style="color: #ffffff" />
|
|
|
<div class="user-data">
|
|
|
<div class="left">
|
|
|
- <m-user-avatar />
|
|
|
+ <!-- <m-user-avatar /> -->
|
|
|
<div class="name">
|
|
|
- <m-user-name />
|
|
|
+ <!-- <m-user-name /> -->
|
|
|
<span
|
|
|
- >可提现余额<span class="grade">{{ profitPrice }}</span
|
|
|
- >元</span
|
|
|
+ ><span class="grade">{{ profitPrice }}</span></span
|
|
|
>
|
|
|
+ <div>可提现余额(元)</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <m-button @click="showCashout(updateExtractList)" class="continue" width="90px" height="30px" text="我要提现" />
|
|
|
+ <div class="draw-button">
|
|
|
+ <m-button @click="showCashout(updateExtractList)" class="continue" width="90px" height="30px" text="我要提现" />
|
|
|
+ </div>
|
|
|
+ <!-- <div class="draw-button mr15">
|
|
|
+ <m-button @click="()=>{
|
|
|
+ push('/drawByBank')}" class="bank" width="90px" height="30px" text="银行卡提现" />
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="summary content-box">
|
|
@@ -37,140 +43,162 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
- import { CashOutModel } from "@/model/cashOut";
|
|
|
- import { ref, onBeforeMount } from "vue";
|
|
|
- const cashOutModel = new CashOutModel();
|
|
|
-
|
|
|
- /**用户提现列表展示 */
|
|
|
- const useExtract = () => {
|
|
|
- type ExtractType = {
|
|
|
- status: number;
|
|
|
- extractPrice: number;
|
|
|
- partnerTradeNo: string;
|
|
|
- id: number;
|
|
|
- createTime: string;
|
|
|
- };
|
|
|
-
|
|
|
- const extractList = ref<Array<ExtractType>>([]);
|
|
|
-
|
|
|
- const updateExtractList = async () => {
|
|
|
- const extractListRes = await cashOutModel.extractList();
|
|
|
- extractList.value = extractListRes.rows;
|
|
|
- };
|
|
|
-
|
|
|
- onBeforeMount(updateExtractList);
|
|
|
+import { CashOutModel } from "@/model/cashOut";
|
|
|
+import { ref, onBeforeMount } from "vue";
|
|
|
+import { userData} from "@/hooks/base/userData"
|
|
|
+const cashOutModel = new CashOutModel();
|
|
|
+/**用户提现列表展示 */
|
|
|
+const useExtract = () => {
|
|
|
+ type ExtractType = {
|
|
|
+ status: number;
|
|
|
+ extractPrice: number;
|
|
|
+ partnerTradeNo: string;
|
|
|
+ id: number;
|
|
|
+ createTime: string;
|
|
|
+ };
|
|
|
|
|
|
- return {
|
|
|
- extractList,
|
|
|
- updateExtractList,
|
|
|
- };
|
|
|
+ const extractList = ref<Array<ExtractType>>([]);
|
|
|
+ // const userData =
|
|
|
+ const updateExtractList = async () => {
|
|
|
+ const extractListRes = await cashOutModel.extractList();
|
|
|
+ extractList.value = extractListRes.rows;
|
|
|
+ };
|
|
|
+ onBeforeMount(updateExtractList);
|
|
|
+ const isAgent = userData.value.saleType==2||userData.value.saleType==3||false
|
|
|
+ return {
|
|
|
+ extractList,
|
|
|
+ updateExtractList,
|
|
|
+ userData,
|
|
|
+ isAgent,
|
|
|
+
|
|
|
};
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
- import { useProfitPrice } from "@/hooks/user";
|
|
|
- import { showCashout } from "./components/cashout";
|
|
|
- const searchValue = ref("");
|
|
|
-
|
|
|
- const { profitPrice } = useProfitPrice();
|
|
|
- const { extractList, updateExtractList } = useExtract();
|
|
|
+import { useProfitPrice } from "@/hooks/user";
|
|
|
+import { showCashout } from "./components/cashout";
|
|
|
+import { useRouter } from "vue-router";
|
|
|
+const searchValue = ref("");
|
|
|
+const push = useRouter().push
|
|
|
+const { profitPrice } = useProfitPrice();
|
|
|
+const { extractList, updateExtractList } = useExtract();
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
- .header-back {
|
|
|
- width: 375px;
|
|
|
- padding-bottom: 82px;
|
|
|
- background: linear-gradient(180deg, #498ef5 0%, #4da8e6 100%);
|
|
|
- border-radius: 0px 0px 82px 82px;
|
|
|
- .user-data {
|
|
|
+.mr15{
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+.header-back {
|
|
|
+ width: 375px;
|
|
|
+ padding-bottom: 82px;
|
|
|
+ background: linear-gradient(180deg, #498ef5 0%, #4da8e6 100%);
|
|
|
+ border-radius: 0px 0px 82px 82px;
|
|
|
+ .user-data {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .draw-button {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .left {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
- padding: 19px 17px 24px;
|
|
|
- .left {
|
|
|
+ margin-bottom: 12px;
|
|
|
+ .name {
|
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- .name {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- font-size: 13px;
|
|
|
- color: #ffffff;
|
|
|
- justify-content: space-between;
|
|
|
- margin-left: 6px;
|
|
|
- .grade {
|
|
|
- font-size: 24px;
|
|
|
- padding: 4px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .continue {
|
|
|
+ flex-direction: column;
|
|
|
font-size: 13px;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- line-height: 19px;
|
|
|
+ width: 100%;
|
|
|
color: #ffffff;
|
|
|
- background: #01c18d;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin-left: 6px;
|
|
|
+ .grade {
|
|
|
+ font-size: 36px;
|
|
|
+ padding: 4px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
- .content-box {
|
|
|
- width: 345px;
|
|
|
- background: #ffffff;
|
|
|
- box-shadow: 0px 0px 8px rgba(124, 129, 136, 0.2);
|
|
|
- border-radius: 10px;
|
|
|
- position: relative;
|
|
|
- left: 50%;
|
|
|
- transform: translateX(-50%);
|
|
|
- top: -82px;
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
- .summary {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- box-sizing: border-box;
|
|
|
- overflow: hidden;
|
|
|
- .search {
|
|
|
- width: 100%;
|
|
|
+ .bank{
|
|
|
+ font-size: 13px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 19px;
|
|
|
+ color: #498ef5;
|
|
|
+ background: #fff;
|
|
|
+
|
|
|
+ }
|
|
|
+ .continue {
|
|
|
+ font-size: 13px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 19px;
|
|
|
+ color: #498ef5;
|
|
|
+ background: #fff;
|
|
|
}
|
|
|
}
|
|
|
- .test-scores {
|
|
|
+}
|
|
|
+.content-box {
|
|
|
+ width: 345px;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0px 0px 8px rgba(124, 129, 136, 0.2);
|
|
|
+ border-radius: 10px;
|
|
|
+ position: relative;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ top: -82px;
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+.summary {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ .search {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+}
|
|
|
+.test-scores {
|
|
|
+ font-size: 13px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 19px;
|
|
|
+ color: #0a1a33;
|
|
|
+ padding: 15px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .table {
|
|
|
+ width: 100%;
|
|
|
+ border-collapse: collapse;
|
|
|
font-size: 13px;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-weight: 400;
|
|
|
- line-height: 19px;
|
|
|
- color: #0a1a33;
|
|
|
- padding: 15px;
|
|
|
- box-sizing: border-box;
|
|
|
- .table {
|
|
|
- width: 100%;
|
|
|
- border-collapse: collapse;
|
|
|
- font-size: 13px;
|
|
|
|
|
|
- th {
|
|
|
- padding: 5px;
|
|
|
- color: #0a1a33;
|
|
|
+ th {
|
|
|
+ padding: 5px;
|
|
|
+ color: #0a1a33;
|
|
|
+ }
|
|
|
+ td {
|
|
|
+ text-align: center;
|
|
|
+ padding: 5px;
|
|
|
+ color: #8a9099;
|
|
|
+ }
|
|
|
+ tr {
|
|
|
+ &:nth-of-type(n) {
|
|
|
+ background: #ffffff;
|
|
|
}
|
|
|
- td {
|
|
|
- text-align: center;
|
|
|
- padding: 5px;
|
|
|
- color: #8a9099;
|
|
|
- }
|
|
|
- tr {
|
|
|
- &:nth-of-type(n) {
|
|
|
- background: #ffffff;
|
|
|
- }
|
|
|
- &:nth-of-type(2n) {
|
|
|
- background: rgba(73, 142, 245, 0.15);
|
|
|
- }
|
|
|
+ &:nth-of-type(2n) {
|
|
|
+ background: rgba(73, 142, 245, 0.15);
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .oneColunm {
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- overflow: hidden;
|
|
|
- width: 50px;
|
|
|
- }
|
|
|
+ .oneColunm {
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ width: 50px;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|