整合api请求、添加购买会员卡页面、登陆页面

gym-manage-uniapp/pages/memberInfo/trainReport.vue

@@ -69,64 +69,57 @@
     </view>
 </template>
 
-<script>
+<script setup>
+import { ref, computed } from 'vue'
 import MemberInfoSubNav from '@/components/memberInfo/MemberInfoSubNav.vue'
 import BodyTestTrendChart from '@/components/memberInfo/BodyTestTrendChart.vue'
-import { PAGE, navigateToPage } from '@/common/constants/routes.js'
+import { PAGE, navigateToPage, backToMemberCenter } from '@/common/constants/routes.js'
 import { getTrainingReportData, filterTrainingSessions } from '@/common/memberInfo/moduleStore.js'
 import { loadMemberStore } from '@/common/memberInfo/store.js'
-import { subPageMixin } from '@/common/memberInfo/mixins.js'
 
-export default {
-    components: { MemberInfoSubNav, BodyTestTrendChart },
-    mixins: [subPageMixin],
-    data() {
-        return {
-            period: 'week',
-            periods: [
-                { key: 'week', label: '本周' },
-                { key: 'month', label: '本月' }
-            ],
-            typeFilter: 'all',
-            typeFilters: [
-                { key: 'all', label: '全部' },
-                { key: 'group', label: '团课' },
-                { key: 'private', label: '私教' },
-                { key: 'free', label: '自由' }
-            ],
-            report: { summary: {}, trendHours: [], trendCalories: [], sessions: [] },
-            sessions: [],
-            chartWidth: 300
-        }
-    },
-    onLoad() {
-        this.chartWidth = uni.getSystemInfoSync().windowWidth - 64
-        this.refresh()
-    },
-    onShow() { this.refresh() },
-    methods: {
-        refresh() {
-            const store = loadMemberStore()
-            this.report = getTrainingReportData(store, this.period)
-            this.sessions = filterTrainingSessions(store, { type: this.typeFilter })
-        },
-        switchPeriod(key) {
-            this.period = key
-            this.refresh()
-        },
-        goSession(item) {
-            navigateToPage(`${PAGE.TRAIN_SESSION}?id=${item.id}`)
-        }
-    },
-    watch: {
-        typeFilter() {
-            this.sessions = filterTrainingSessions(loadMemberStore(), { type: this.typeFilter })
-        }
-    }
+const period = ref('week')
+const periods = ref([
+    { key: 'week', label: '本周' },
+    { key: 'month', label: '本月' }
+])
+const typeFilter = ref('all')
+const typeFilters = ref([
+    { key: 'all', label: '全部' },
+    { key: 'group', label: '团课' },
+    { key: 'private', label: '私教' },
+    { key: 'free', label: '自由' }
+])
+const report = ref({ summary: {}, trendHours: [], trendCalories: [], sessions: [] })
+const chartWidth = ref(300)
+
+const sessions = computed(() => {
+    return filterTrainingSessions(report.value.sessions, typeFilter.value)
+})
+
+function switchPeriod(p) {
+    period.value = p
+    refresh()
 }
+
+function refresh() {
+    const store = loadMemberStore()
+    report.value = getTrainingReportData(store, period.value)
+}
+
+function goBack() {
+    backToMemberCenter()
+}
+
+function goSession(item) {
+    navigateToPage(`${PAGE.TRAIN_SESSION_DETAIL}?id=${item.id}`)
+}
+
+// Initialize
+chartWidth.value = uni.getSystemInfoSync().windowWidth - 64
+refresh()
 </script>
 
-<style>
+<style lang="scss">
 @import '@/common/style/base.css';
 @import '@/common/style/memberInfo/pages/page-reset.css';
 @import '@/common/style/memberInfo/pages/sub-page-base.css';