修改红包等

2026-03-12 16:13:56 +08:00
parent 1160f1189d
commit 1aa035b52f
9 changed files with 1019 additions and 2 deletions
@@ -0,0 +1,127 @@
+<template>
+  <div class="hongbao-bg">
+    <el-form :inline="true" :model="form" ref="ruleForm" label-width="150px" label-position="right">
+      <el-row :gutter="24">
+        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <el-form-item label="展示开启" prop="enabled">
+            <el-switch v-model="form.enabled" active-color="#13ce66" inactive-color="#ff4949" active-text="开启"
+              inactive-text="关闭"></el-switch>
+          </el-form-item>
+        </el-col>
+        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <el-form-item label="发放金币总数" prop="content">
+            <el-input placeholder="请输入总数" v-model.number="form.dailyLimit" style="width: 400px">
+              <template #append>
+                <span>金币</span>
+              </template>
+            </el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <el-form-item :label="`第${i + 1}次领取`" size="mini" v-for="(ru, i) in form.rule" :key="i">
+            <el-form-item label="间隔：" size="mini" label-width="50">
+              <el-input placeholder="单位（s）" v-model.number="ru.interval" style="width: 120px">
+                <template #append>
+                  <span>秒</span>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-form-item label="最小：" size="mini" label-width="50">
+              <el-input placeholder="该次领取最小值" v-model.number="ru.min" style="width: 150px">
+                <template #append>
+                  <span>金币</span>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-form-item label="最大：" size="mini" label-width="50">
+              <el-input placeholder="该次领取最大值" v-model.number="ru.max" style="width: 150px">
+                <template #append>
+                  <span>金币</span>
+                </template>
+              </el-input>
+            </el-form-item>
+            <el-button icon="el-icon-delete" type="danger" size="mini" @click="delRule(i)"></el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div style="margin-left: 100px;">
+      <el-button type="text" icon="el-icon-circle-plus-outline" @click="addRule">新增规则</el-button>
+      <el-button type="primary" @click="submit"> 确 定 </el-button>
+    </div>
+  </div>
+</template>
+<script>
+import { updateConfig, getConfig } from '@/api/activity/msg'
+export default {
+  name: 'Hongbao',
+  data() {
+    return {
+      form: {
+        enabled: true,
+        interval: 600,
+        dailyLimit: 200,
+        rule: []
+      }
+    }
+  },
+  computed: {
+    isLastRuleAvailable() {
+      if (!this.form.rule || !this.form.rule.length) return true
+      const lastRule = this.form.rule[this.form.rule.length - 1]
+      return lastRule.interval && lastRule.min && lastRule.max
+    }
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+    async init() {
+      const res = await getConfig()
+      this.form = res.data
+      this.form.dailyLimit = (res.data.dailyLimit || 0) / 100
+      if (this.form.rule) {
+        this.form.rule = this.form.rule.map(v => ({ ...v, min: v.min / 100, max: v.max / 100 }))
+      }
+    },
+    async submit() {
+      if (!this.isLastRuleAvailable) {
+        this.$message.error('请完善最后一项规则或者删除')
+        return
+      }
+      const form = {
+        ...this.form,
+        dailyLimit: this.form.dailyLimit * 100
+      }
+      if (this.form.rule) {
+        form.rule = this.form.rule.map(v => ({ ...v, min: v.min * 100, max: v.max * 100 }))
+      }
+      await updateConfig(form)
+      this.$message.success('修改成功')
+    },
+    addRule() {
+      if (!this.isLastRuleAvailable) {
+        this.$message.error('请先完善上一项规则')
+        return
+      }
+      const rule = {
+        min: null,
+        max: null,
+        interval: null
+      }
+      this.form.rule = this.form.rule || []
+      this.form.rule.push(rule)
+    },
+    delRule(i) {
+      this.form.rule.splice(i, 1)
+    }
+  }
+}
+</script>
+<style>
+.hongbao-bg {
+  height: 80vh;
+  background-color: #fff;
+  padding: 50px 100px;
+}
+</style>