|
|
@@ -0,0 +1,259 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <el-form :model="form" ref="form" :rules="rules" label-width="auto" v-loading="loading">
|
|
|
+ <el-form-item label="签到标题：" prop="signTitle">
|
|
|
+ <el-input v-model="form.signTitle" placeholder="请输入签到标题" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="签到周期：" prop="signDay">
|
|
|
+ <el-input v-model.number="form.signDay" placeholder="请输入签到周期" @change="changeSignDay">
|
|
|
+ <template slot="append">天</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="基础积分：" prop="baseRewardPoint">
|
|
|
+ <el-input v-model.number="form.baseRewardPoint" placeholder="请输入基础积分">
|
|
|
+ <template slot="append">积分</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="连续签到奖励：">
|
|
|
+ <el-popover placement="top" content="连续签到一定天数后，可以额外获得积分" trigger="hover">
|
|
|
+ <el-checkbox v-model="form.isContinueReward" :true-label="0" :false-label="1" slot="reference">
|
|
|
+ 开启
|
|
|
+ </el-checkbox>
|
|
|
+ </el-popover>
|
|
|
+ <el-table v-if="form.isContinueReward === 0" :data="form.pointConfigContinueRList">
|
|
|
+ <el-table-column label="连续签到天数 / 天" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model.number="scope.row.signDay" @change="getChange($event, scope.$index)" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="奖励积分 / 积分" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model.number="scope.row.rewardPoint" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center">
|
|
|
+ <template #header>
|
|
|
+ <el-button type="text" icon="el-icon-plus" @click="handlerPush('签到奖励')"
|
|
|
+ :disabled="continuePush">添加</el-button>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="delete" @click="getDeleteContinue(scope)">
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="收听播放奖励：">
|
|
|
+ <el-popover placement="top" content="播放一定时间后，可以获得相应奖励" trigger="hover">
|
|
|
+ <el-select v-model="form.notifyRewardType" placeholder="请选择奖励类型" slot="reference"
|
|
|
+ style="width: 150px; margin-bottom: 10px">
|
|
|
+ <el-option v-for="item in rewardOptions" :key="item.value" :value="item.value"
|
|
|
+ :label="item.label" />
|
|
|
+ </el-select>
|
|
|
+ </el-popover>
|
|
|
+ <el-table v-if="form.notifyRewardType" :data="form.pointConfigListenGoodList">
|
|
|
+ <el-table-column label="播放时间 / 小时" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model.number="scope.row.listenTime" @change="getChange($event, scope.$index)" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="奖励积分 / 积分" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input v-model.number="scope.row.rewardPoint" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center">
|
|
|
+ <template #header>
|
|
|
+ <el-button type="text" icon="el-icon-plus" @click="handlerPush('播放奖励')"
|
|
|
+ :disabled="listenGoodPush">添加</el-button>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="delete" @click="getDeleteListenGood(scope)">
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="手机通知奖励：">
|
|
|
+ <el-input v-model.number="form.notifyRewardPoint" placeholder="请输入手机通知奖励">
|
|
|
+ <template slot="append">积分</template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="签到规则：" prop="signRule">
|
|
|
+ <el-input v-model="form.signRule" type="textarea" :autosize="{minRows: 5, maxRows: 10}"
|
|
|
+ placeholder="请输入签到规则" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="getSubmit">确定</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { list, submit, removeContinue, removeListenGood } from '@/api/registration/regConfig'
|
|
|
+import { rewardMixin } from '@/mixin/index'
|
|
|
+export default {
|
|
|
+ mixins: [rewardMixin],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // 遮罩层
|
|
|
+ loading: false,
|
|
|
+ // 表单
|
|
|
+ form: {},
|
|
|
+ // 连续签到奖励 添加按钮禁止
|
|
|
+ continuePush: false,
|
|
|
+ // 收听播放奖励 添加按钮禁止
|
|
|
+ listenGoodPush: false,
|
|
|
+ // 校验
|
|
|
+ rules: {
|
|
|
+ signTitle: [{
|
|
|
+ required: true, message: '请输入签到标题', trigger: 'blur'
|
|
|
+ }],
|
|
|
+ signDay: [{
|
|
|
+ required: true, message: '请输入签到周期', trigger: 'blur'
|
|
|
+ }],
|
|
|
+ baseRewardPoint: [{
|
|
|
+ required: true, message: '请输入基础积分', trigger: 'blur'
|
|
|
+ }],
|
|
|
+ signRule: [{
|
|
|
+ required: true, message: '请输入签到规则', trigger: 'blur'
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ 'form.signDay'() {
|
|
|
+ // this.form.pointConfigContinueRList = []
|
|
|
+ },
|
|
|
+ 'form.pointConfigContinueRList': {
|
|
|
+ handler(val) {
|
|
|
+ // 当连续签到已达基础签到周期上限则禁止添加新数据
|
|
|
+ this.continuePush = val.findIndex(i => i.signDay === this.form.signDay) !== -1 ? true : false
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ 'form.pointConfigListenGoodList'(val) {
|
|
|
+ this.listenGoodPush = val.length >= 10 ? true : false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 详情
|
|
|
+ getList() {
|
|
|
+ this.loading = true
|
|
|
+ list().then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.form = res.data
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 签到周期改变 连续签到列表重置
|
|
|
+ changeSignDay() {
|
|
|
+ this.form.pointConfigContinueRList = []
|
|
|
+ },
|
|
|
+
|
|
|
+ // 添加
|
|
|
+ handlerPush(key) {
|
|
|
+ if (key === '签到奖励') {
|
|
|
+ this.form.pointConfigContinueRList.push({
|
|
|
+ signDay: '',
|
|
|
+ rewardPoint: ''
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.form.pointConfigListenGoodList.push({
|
|
|
+ listenTime: '',
|
|
|
+ rewardPoint: ''
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 判断连续签到天数是否大于签到周期天数
|
|
|
+ getChange(e, index) {
|
|
|
+ if (Number(e) > this.form.signDay) {
|
|
|
+ this.$message.error('连续签到天数不可大于签到周期！')
|
|
|
+ this.form.pointConfigContinueRList[index].signDay = null
|
|
|
+ }
|
|
|
+ if (this.form.pointConfigContinueRList.filter(i => i.signDay === Number(e)).length >= 2) {
|
|
|
+ this.$message.error('此天数已存在！')
|
|
|
+ this.form.pointConfigContinueRList[index].signDay = null
|
|
|
+ }
|
|
|
+ if (this.form.pointConfigListenGoodList.filter(i => i.listenTime === Number(e)).length >= 2) {
|
|
|
+ this.$message.error('此时间已存在！')
|
|
|
+ this.form.pointConfigListenGoodList[index].listenTime = null
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 删除连续签到奖励
|
|
|
+ getDeleteContinue(scope) {
|
|
|
+ let title = scope.row.signDay ? scope.row.signDay : '空'
|
|
|
+ this.$confirm(`是否删除 连续签到天数为${title} 的数据?`, '提示', {
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ if (scope.row.id) {
|
|
|
+ removeContinue({
|
|
|
+ id: scope.row.id
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code !== 0) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.$message.success('删除成功！')
|
|
|
+ this.form.pointConfigContinueRList.splice(scope.$index, 1)
|
|
|
+ }).catch(() => { })
|
|
|
+ },
|
|
|
+
|
|
|
+ // 删除收听播放奖励
|
|
|
+ getDeleteListenGood(scope) {
|
|
|
+ let title = scope.row.listenTime ? scope.row.listenTime : '空'
|
|
|
+ this.$confirm(`是否删除 播放时间为${title} 的数据?`, '提示', {
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ if (scope.row.id) {
|
|
|
+ removeListenGood({
|
|
|
+ id: scope.row.id
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code !== 0) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.$message.success('删除成功！')
|
|
|
+ this.form.pointConfigListenGoodList.splice(scope.$index, 1)
|
|
|
+ }).catch(() => { })
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ // 确定
|
|
|
+ getSubmit() {
|
|
|
+ this.$refs.form.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ submit(this.form).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message.success('修改成功！')
|
|
|
+ this.getList()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.el-form {
|
|
|
+ width: 500px;
|
|
|
+}
|
|
|
+</style>
|
