chore: initialize qiming workspace repository

qiming-mobile/subpackages/pages/my-subscriptions/components/credits-breakdown/credits-breakdown.scss

@@ -0,0 +1,95 @@
+.credits-breakdown {
+  display: flex;
+  flex-direction: row;
+  background: #ffffff;
+  border-radius: 32rpx;
+  padding: 48rpx 32rpx;
+  box-shadow: 0 8rpx 32rpx rgba(30, 109, 235, 0.04);
+  border: 1rpx solid rgba(30, 109, 235, 0.06);
+
+  .credits-column {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 48rpx;
+  }
+
+  .credits-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 16rpx;
+    width: 100%;
+
+    &.clickable:active {
+      opacity: 0.8;
+    }
+
+    .credits-header {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      gap: 10rpx;
+    }
+
+    .credits-label {
+      font-size: 26rpx;
+      color: #8c96a0;
+      font-weight: 500;
+    }
+
+    .credits-btn {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      padding: 4rpx 16rpx;
+      border-radius: 100rpx;
+      border: 1rpx solid transparent;
+
+      &.btn-blue {
+        background-color: rgba(30, 109, 235, 0.06);
+        border-color: rgba(30, 109, 235, 0.12);
+      }
+
+      &.btn-green {
+        background-color: rgba(0, 139, 112, 0.06);
+        border-color: rgba(0, 139, 112, 0.12);
+      }
+
+      .credits-btn-text {
+        font-size: 20rpx;
+        font-weight: 500;
+
+        &.text-blue {
+          color: #1e6deb;
+        }
+
+        &.text-green {
+          color: #008b70;
+        }
+      }
+    }
+
+    .credits-value {
+      font-size: 48rpx;
+      font-weight: 700;
+      color: #1d2129;
+
+      &.color-blue {
+        color: #1e6deb;
+      }
+
+      &.color-green {
+        color: #008b70;
+      }
+
+      &.color-orange {
+        color: #e28c00;
+      }
+    }
+  }
+}
+

qiming-mobile/subpackages/pages/my-subscriptions/components/credits-breakdown/credits-breakdown.uvue

@@ -0,0 +1,92 @@
+<template>
+  <view class="credits-breakdown">
+    <!-- 左列 -->
+    <view class="credits-column">
+      <view class="credits-item clickable" @tap="handleDetail">
+        <view class="credits-header">
+          <text class="credits-label">{{
+            t("Mobile.MySubscriptions.totalCredits")
+          }}</text>
+          <view class="credits-btn btn-blue">
+            <text class="credits-btn-text text-blue">{{
+              t("Mobile.MySubscriptions.detail")
+            }}</text>
+          </view>
+        </view>
+        <text class="credits-value">{{
+          formatNumber(summary?.totalCredit ?? 0, 0)
+        }}</text>
+      </view>
+
+      <view class="credits-item clickable" @tap="handleAddPurchase">
+        <view class="credits-header">
+          <text class="credits-label">{{
+            t("Mobile.MySubscriptions.purchaseCredits")
+          }}</text>
+          <view class="credits-btn btn-green">
+            <text class="credits-btn-text text-green">{{
+              t("Mobile.MySubscriptions.addPurchase")
+            }}</text>
+          </view>
+        </view>
+        <text class="credits-value color-green">{{
+          formatNumber(summary?.purchaseCredit ?? 0, 0)
+        }}</text>
+      </view>
+    </view>
+
+    <!-- 右列 -->
+    <view class="credits-column">
+      <view class="credits-item">
+        <view class="credits-header">
+          <text class="credits-label">{{
+            t("Mobile.MySubscriptions.subscriptionCredits")
+          }}</text>
+        </view>
+        <text class="credits-value color-blue">{{
+          formatNumber(summary?.subscriptionCredit ?? 0, 0)
+        }}</text>
+      </view>
+
+      <view class="credits-item">
+        <view class="credits-header">
+          <text class="credits-label">{{
+            t("Mobile.MySubscriptions.activityCredits")
+          }}</text>
+        </view>
+        <text class="credits-value color-orange">{{
+          formatNumber(summary?.activityCredit ?? 0, 0)
+        }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup lang="uts">
+  import type { CreditSummaryInfo } from "@/subpackages/types/interfaces/subscription";
+  import { useI18n } from "@/utils/i18n";
+  import { formatNumber } from "@/utils/system";
+
+  const { t } = useI18n();
+
+  interface Props {
+    summary: CreditSummaryInfo | null;
+  }
+
+  defineProps<Props>();
+  const emit = defineEmits(["add-purchase"]);
+
+  const handleAddPurchase = () => {
+    emit("add-purchase");
+  };
+
+  const handleDetail = () => {
+    uni.navigateTo({
+      url: "/subpackages/pages/credit-records/credit-records",
+    });
+  };
+</script>
+
+<style lang="scss" scoped>
+  @import "./credits-breakdown.scss";
+</style>