新增营销系统、分销系统、会员功能、门店、提现功能
This commit is contained in:
Shaw
92
views/account/integral/index.scss
Normal file
92
views/account/integral/index.scss
Normal file
@ -0,0 +1,92 @@
|
||||
/**
|
||||
* @name: index
|
||||
* @author: kahu4
|
||||
* @date: 2024-01-19 14:26
|
||||
* @description：index
|
||||
* @update: 2024-01-19 14:26
|
||||
* */
|
||||
|
||||
.integral {
|
||||
width: 100%;
|
||||
@include usePadding(34, 34);
|
||||
|
||||
.num-card {
|
||||
width: 100%;
|
||||
border-radius: 15rpx;
|
||||
aspect-ratio: 682/278;
|
||||
background-size: 100% 100%;
|
||||
@include usePadding(48, 76);
|
||||
color: #663405;
|
||||
font-size: 28rpx;
|
||||
|
||||
.num {
|
||||
font-weight: bold;
|
||||
font-size: 64rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-row {
|
||||
width: 100%;
|
||||
gap: 16rpx;
|
||||
margin: 34rpx 0;
|
||||
|
||||
.tab-item {
|
||||
flex-grow: 1;
|
||||
@include usePadding(0, 16);
|
||||
background: #F6F8F8;
|
||||
transition: all .3s;
|
||||
border-radius: 8rpx;
|
||||
text-align: center;
|
||||
|
||||
&.current {
|
||||
background: #333333;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.integral-list {
|
||||
@include usePadding(32, 32);
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 15rpx;
|
||||
|
||||
.row {
|
||||
margin: 25rpx 0;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
color: #333333;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.right {
|
||||
@include usePadding(38, 10);
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.success {
|
||||
color: #28C445;
|
||||
background: rgba(40, 196, 69, 0.1);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #EE6D46;
|
||||
background: #FFF7F5;
|
||||
}
|
||||
}
|
||||
}
|
||||
118
views/account/integral/index.vue
Normal file
118
views/account/integral/index.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<!--
|
||||
@name: index
|
||||
@author: kahu4
|
||||
@date: 2024-01-19 14:26
|
||||
@description：index
|
||||
@update: 2024-01-19 14:26
|
||||
-->
|
||||
<script setup>
|
||||
import './index.scss'
|
||||
import Header from '@/components/Header/index.vue'
|
||||
import { useScroll } from "@/hooks/useScroll";
|
||||
import { onLoad, onPageScroll } from "@dcloudio/uni-app";
|
||||
import { accountIntegralBg, emptyOrderIcon } from "@/utils/images";
|
||||
import { ref } from "vue";
|
||||
import { pageIntegralBill } from "@/api/account/integral";
|
||||
import { usePaging } from "@/hooks/usePaging";
|
||||
import moment from "moment";
|
||||
import Empty from '@/components/Empty/index.vue'
|
||||
import { useMainStore } from "@/store/store";
|
||||
import { storeToRefs } from "pinia";
|
||||
|
||||
const {scrollTop} = useScroll();
|
||||
onPageScroll(() => {
|
||||
})
|
||||
|
||||
const mainStore = useMainStore()
|
||||
const {user} = storeToRefs(mainStore);
|
||||
|
||||
const filterTabs = [
|
||||
{label: '全部', value: 99},
|
||||
{label: '收入', value: 1},
|
||||
{label: '支出', value: 0}
|
||||
]
|
||||
|
||||
const tabCurrent = ref(99)
|
||||
|
||||
async function tabCurrentChange(item) {
|
||||
tabCurrent.value = item.value
|
||||
if (item.value === 99) {
|
||||
delete otherParams.value.pm
|
||||
} else {
|
||||
otherParams.value.pm = item.value
|
||||
}
|
||||
await refreshPage()
|
||||
}
|
||||
|
||||
// 账单列表
|
||||
const {otherParams, list, loading, refreshPage} = usePaging({
|
||||
request: pageIntegralBill,
|
||||
load: false
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
otherParams.value = {}
|
||||
otherParams.value.category = "integral"
|
||||
refreshPage()
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<view>
|
||||
<Header
|
||||
:scroll-top="scrollTop"
|
||||
system-bar-area-bg="#fff"
|
||||
header-area-bg="#fff"> 我的积分
|
||||
</Header>
|
||||
<view class="integral">
|
||||
<!-- 积分展示 -->
|
||||
<view
|
||||
class="num-card"
|
||||
:style="{backgroundImage:`url(${accountIntegralBg})`}">
|
||||
<view class="title">当前积分</view>
|
||||
<view class="num"> {{ user.integral || '0.00' }}</view>
|
||||
</view>
|
||||
<!-- tabs -->
|
||||
<view class="tabs-row flex flex-ai__center flex-jc__sb">
|
||||
<view
|
||||
class="tab-item"
|
||||
:class="{current:tabCurrent === tab.value}"
|
||||
v-for="tab in filterTabs"
|
||||
:key="tab.value"
|
||||
@click="tabCurrentChange(tab)">
|
||||
{{ tab.label }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- list -->
|
||||
<view class="integral-list">
|
||||
<template v-if="list.length>0">
|
||||
<view
|
||||
class="row flex flex-jc__sb flex-ai__center"
|
||||
v-for="item in list">
|
||||
<view class="left">
|
||||
<view class="name">{{ item.title }}</view>
|
||||
<view class="time">{{ moment(item.createTime).format("YYYY-MM-DD HH:mm:ss") }}</view>
|
||||
</view>
|
||||
<view
|
||||
class="right"
|
||||
:class="{error:item.pm===0,success:item.pm===1}">
|
||||
{{ item.pm === 0 ? '-' : '+' }}{{ item.number }}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-if="!loading && list.length===0">
|
||||
<Empty
|
||||
:icon-src="emptyOrderIcon"
|
||||
padding="0 0" />
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style
|
||||
scoped
|
||||
lang="scss">
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user