Feat：抽奖2.0（部分接口未调通）

2026-04-27 08:47:33 +08:00
parent 0202f14073
commit d3602c010e
11 changed files with 2718 additions and 29 deletions
@@ -0,0 +1,175 @@
+<template>
+  <view class="county-lottery-rules-page">
+    <view class="custom-header" :style="{ paddingTop: `${statusBarHeight}px` }">
+      <view class="header-inner">
+        <view class="header-back" @click="goBack">
+          <text class="header-back-icon">‹</text>
+        </view>
+        <view class="header-title">活动规则</view>
+        <view class="header-right">
+          <view class="right-dot"></view>
+          <view class="right-ring"></view>
+        </view>
+      </view>
+    </view>
+
+    <view class="page-body" :style="{ paddingTop: `${statusBarHeight + 88}px` }">
+      <view class="rule-card">
+        <view class="rule-title">《香道汉平台》满额抽奖活动规则</view>
+        <view class="rule-content">
+          <rich-text v-if="ruleContent" :nodes="ruleContent" />
+          <view class="state-text" v-else>{{ loading ? '规则加载中...' : '暂无活动规则' }}</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { getDrawRuleConfig } from '@/api/lottery'
+
+export default {
+  name: 'CountyLotteryRulesPage',
+  data() {
+    return {
+      statusBarHeight: 20,
+      loading: true,
+      ruleContent: ''
+    }
+  },
+  onLoad() {
+    this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight || 20
+    this.fetchRuleConfig()
+  },
+  methods: {
+    fetchRuleConfig() {
+      this.loading = true
+      getDrawRuleConfig().then(res => {
+        const data = res.data || {}
+        this.ruleContent = data.ruleContent || ''
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    goBack() {
+      if (getCurrentPages().length > 1) {
+        uni.navigateBack()
+        return
+      }
+      uni.switchTab({
+        url: '/pages/home/index'
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.county-lottery-rules-page {
+  min-height: 100vh;
+  background: #f5f5f5;
+}
+
+.custom-header {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  background: #f5f5f5;
+  z-index: 20;
+}
+
+.header-inner {
+  height: 88rpx;
+  padding: 0 24rpx;
+  display: flex;
+  align-items: center;
+}
+
+.header-back {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 8rpx;
+  border: 2rpx solid #d8d8d8;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #fff;
+}
+
+.header-back-icon {
+  font-size: 44rpx;
+  color: #111;
+  line-height: 1;
+  margin-top: -4rpx;
+}
+
+.header-title {
+  flex: 1;
+  text-align: center;
+  margin-left: 56rpx;
+  font-size: 34rpx;
+  color: #333;
+  font-weight: 700;
+}
+
+.header-right {
+  width: 88rpx;
+  height: 44rpx;
+  border-radius: 24rpx;
+  border: 2rpx solid #d8d8d8;
+  background: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.right-dot {
+  width: 8rpx;
+  height: 8rpx;
+  border-radius: 50%;
+  background: #111;
+  margin-right: 14rpx;
+}
+
+.right-ring {
+  width: 18rpx;
+  height: 18rpx;
+  border-radius: 50%;
+  border: 2rpx solid #111;
+}
+
+.page-body {
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+
+.rule-card {
+  background: #fff;
+  border-radius: 24rpx;
+  padding: 24rpx;
+}
+
+.rule-title {
+  font-size: 34rpx;
+  font-weight: 700;
+  color: #333;
+  line-height: 1.4;
+}
+
+.rule-content {
+  margin-top: 20rpx;
+  font-size: 32rpx;
+  color: #444;
+  line-height: 1.8;
+}
+
+.state-text {
+  color: #999;
+  font-size: 28rpx;
+}
+
+/deep/ .rule-content p {
+  margin-bottom: 10rpx;
+}
+</style>