share-fun-web/src/views/pointsManagement/pointsSetting/index.vue

<template>
  <div class="m-10 bg-w p-20 br-10">
    <h1>积分设置</h1>
    <div class="f-c-c f-col">
      <el-form
        ref="form"
        :model="form"
        label-position="right"
        label-width="280px"
        :rules="rules"
        class="mrow-60"
      >
        <el-form-item label="积分抵现（设置多少积分抵一元人民币）">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_CASH_OUT"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="邀请好友注册获得积分">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_INVITE_TO_SIGN_UP"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="分享资讯获得积分">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_SHARE_POINTS"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="点赞照片获得积分">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_LIKE_TO_POINTS"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="被点赞照片获得积分">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_POINTS_BY_LIKE"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="每日签到获得积分">
          <el-input-number
            controls-position="right"
            v-model="form.INTEGRAL_SIGN_IN_BY_DAY"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="照片购买摄影师分成（%）">
          <el-input-number
            controls-position="right"
            v-model="form.CASH_PHOTOER_INCOME"
            style="width: 100%;"
            :precision="2"
            :step="0.1"
            :min="0"
          ></el-input-number>
        </el-form-item>

        <el-form-item label="H5网页域名">
          <el-input
            v-model="form.BUSINESS_H5_WEB_DOMAIN"
            placeholder="请输入"
          ></el-input>
        </el-form-item>

        <el-form-item class="f-fe-c">
          <el-button type="primary" @click="onSubmit">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import { getList, saveItem } from '@/api/config';

export default {
  name: 'PointsSetting',

  components: { toolbar },

  data() {
    return {
      form: {
        INTEGRAL_CASH_OUT: 0,
        INTEGRAL_INVITE_TO_SIGN_UP: 0,
        INTEGRAL_SHARE_POINTS: 0,
        INTEGRAL_LIKE_TO_POINTS: 0,
        INTEGRAL_POINTS_BY_LIKE: 0,
        INTEGRAL_SIGN_IN_BY_DAY: 0,
        CASH_PHOTOER_INCOME: 0,
        BUSINESS_H5_WEB_DOMAIN: ''
      },
      rules: {
        INTEGRAL_CASH_OUT: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        INTEGRAL_INVITE_TO_SIGN_UP: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        INTEGRAL_SHARE_POINTS: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        INTEGRAL_LIKE_TO_POINTS: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        INTEGRAL_POINTS_BY_LIKE: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        INTEGRAL_SIGN_IN_BY_DAY: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        CASH_PHOTOER_INCOME: [
          { required: true, message: '请输入积分', trigger: 'blur' }
        ],
        BUSINESS_H5_WEB_DOMAIN: [
          { required: true, message: '请输入地址', trigger: 'blur' }
        ]
      }
    };
  },

  created() {
    this.loadData();
  },

  methods: {
    async loadData() {
      const { data } = await getList();
      const result = data.reduce((init, item) => {
        init[item.code] = item.value;
        return init;
      }, {});
      this.form = result;
    },

    async onSubmit() {
      this.$refs.form.validate(async valid => {
        if (valid) {
          const params = [];
          for (let key in this.form) {
            params.push({
              code: key,
              value: this.form[key] + ''
            });
          }
          const { success } = await saveItem(params);
          if (success) {
            this.$success('保存成功');
            this.loadData();
          }
        }
      });
    }
  }
};
</script>

<style type="scss" scoped></style>