|
@@ -0,0 +1,103 @@
|
|
|
+<template>
|
|
|
+ <div class="activity-terms-container">
|
|
|
+ <div class="activity-terms">
|
|
|
+ <h1 class="terms-title">{{ title }}</h1>
|
|
|
+ <ol class="activity-terms-content">
|
|
|
+ <li v-for="(item, index) in contentList" :key="index" v-html="item.text"></li>
|
|
|
+ </ol>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { getActivityConfig } from '@/api/modules'
|
|
|
+export default {
|
|
|
+ name: 'activity-terms',
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ query: {},
|
|
|
+ title: '赠送须知',
|
|
|
+ contentList: [
|
|
|
+ // {
|
|
|
+ // text: '本活动最终解释权归剑鱼标讯所有。'
|
|
|
+ // }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.getQuery()
|
|
|
+ this.getConfig()
|
|
|
+ this.refreshTitle()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getQuery () {
|
|
|
+ const query = this.$route.query
|
|
|
+ this.query = query
|
|
|
+ },
|
|
|
+ refreshTitle () {
|
|
|
+ if (this.query.title) {
|
|
|
+ this.title = this.query.title
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async getConfig () {
|
|
|
+ // ?id=Rw==
|
|
|
+ const id = this.query.id
|
|
|
+ if (!id) {
|
|
|
+ return this.$toast('缺少活动id')
|
|
|
+ }
|
|
|
+ const { error_code: code, error_msg: msg, data } = await getActivityConfig({ id })
|
|
|
+ if (code === 0 && data) {
|
|
|
+ if (Array.isArray(data.rule)) {
|
|
|
+ this.contentList = data.rule
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$toast(msg || '请求失败')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+::v-deep {
|
|
|
+ a,
|
|
|
+ .terms-link {
|
|
|
+ color: blue;
|
|
|
+ }
|
|
|
+}
|
|
|
+ol {
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+ol, li {
|
|
|
+ list-style-type: decimal;
|
|
|
+}
|
|
|
+.activity-terms-container {
|
|
|
+ padding-top: 32px;
|
|
|
+ padding-bottom: 32px;
|
|
|
+}
|
|
|
+.activity-terms {
|
|
|
+ width: 1200px;
|
|
|
+ margin: auto;
|
|
|
+ background-color: #fff;
|
|
|
+ min-height: 800px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 40px 60px;
|
|
|
+}
|
|
|
+.terms-title {
|
|
|
+ font-size: 24px;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 36px;
|
|
|
+ letter-spacing: 0em;
|
|
|
+ text-align: center;
|
|
|
+ color: #1D1D1D;
|
|
|
+ margin-bottom: 32px;
|
|
|
+}
|
|
|
+.activity-terms-content {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 38px;
|
|
|
+ letter-spacing: 0em;
|
|
|
+ text-align: left;
|
|
|
+ color: #686868;
|
|
|
+}
|
|
|
+</style>
|