aklast/backendEle/src/views/bonus/perf-adjustment.vue

<template>
  <div v-loading="loading">
    <div class="white-box">
      <div class="filter-user" @keyup.enter="getData()">
        <el-input v-model="memberCode" size="small" style="width:400px;" prefix-icon="el-icon-user-solid">
          <template slot="prepend">会员编号</template>
        </el-input>
        <el-button type="primary" icon="el-icon-search" size="small" @click="getData()">确定</el-button>
      </div>

      <div style="margin-top: 45px;">
        <el-row>
          <el-col :span="15" v-show="show">
            <div class="grid-content bg-purple" style="width: 100%;">
              <el-card class="box-card" shadow="hover" style="margin: 15px;">
                <el-form :model="perfForm" status-icon ref="perfForm" label-width="100px" width="100%" class="demo-ruleForm">
                  <el-form-item label="会员编号" prop="USER_NAME" v-show="false">
                    <el-input type="text" size="small" v-model="perfForm.USER_ID"></el-input>
                    <el-input type="text" size="small" v-model="perfForm.USER_NAME"></el-input>
                  </el-form-item>

                  <el-divider><i class="el-icon-s-data"></i> 一市场业绩</el-divider>
                  <el-form-item label="会员编号" prop="SURPLUS_1L_USER_NAME">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_1L_USER_NAME" autocomplete="off" readonly prefix-icon="el-icon-user"></el-input>
                  </el-form-item>
                  <el-form-item label="综合结余" prop="SURPLUS_1L">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_1L" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="首单结余" prop="SURPLUS_1L_ZC">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_1L_ZC" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="复消结余" prop="SURPLUS_1L_FX">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_1L_FX" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>

                  <el-divider><i class="el-icon-s-data"></i> 二市场业绩</el-divider>
                  <el-form-item label="会员编号" prop="SURPLUS_2L_USER_NAME">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_2L_USER_NAME" autocomplete="off" readonly prefix-icon="el-icon-user"></el-input>
                  </el-form-item>
                  <el-form-item label="综合结余" prop="SURPLUS_2L">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_2L" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="首单结余" prop="SURPLUS_2L_ZC">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_2L_ZC" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="复消结余" prop="SURPLUS_2L_FX">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_2L_FX" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>

                  <el-divider><i class="el-icon-s-data"></i> 三市场业绩</el-divider>
                  <el-form-item label="会员编号" prop="SURPLUS_3L_USER_NAME">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_3L_USER_NAME" autocomplete="off" readonly prefix-icon="el-icon-user"></el-input>
                  </el-form-item>
                  <el-form-item label="综合结余" prop="SURPLUS_3L">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_3L" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="首单结余" prop="SURPLUS_3L_ZC">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_3L_ZC" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>
                  <el-form-item label="复消结余" prop="SURPLUS_3L_FX">
                    <el-input type="text" size="small" v-model="perfForm.SURPLUS_3L_FX" autocomplete="off" prefix-icon="el-icon-s-data"></el-input>
                  </el-form-item>

                  <el-form-item>
                    <el-button type="primary" size="small" @click="handlePerfAdjustment('perfForm')">确定</el-button>
                  </el-form-item>
                </el-form>
              </el-card>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
import network from '@/utils/network'

export default {
  name: 'bonus-perf-adjustment',
  data() {
    return {
      loading: false,
      memberCode: '',
      show: false,
      perfForm: {
        USER_ID: '',
        USER_NAME: '',
        SURPLUS_1L: '',
        SURPLUS_1L_ZC: '',
        SURPLUS_1L_FX: '',
        SURPLUS_1L_USER_NAME: '',
        SURPLUS_2L: '',
        SURPLUS_2L_ZC: '',
        SURPLUS_2L_FX: '',
        SURPLUS_2L_USER_NAME: '',
        SURPLUS_3L: '',
        SURPLUS_3L_ZC: '',
        SURPLUS_3L_FX: '',
        SURPLUS_3L_USER_NAME: '',
      },
    }
  },
  methods: {
    // 查询安置网的下级会员和业绩
    getData() {
      if (!this.memberCode.length) {
        this.$message({
          message: '请输入会员编号',
          type: 'info'
        });
        return false;
      }

      // 清除上一次的填充结果
      this.$refs['perfForm'].resetFields();
      this.show = false;

      return network.getData(`bonus/perf-adjustment`, { memberCode : this.memberCode }).then(response => {
        this.perfForm = response.allData;
        this.show = true;
        this.loading = false;
      }).catch(error => {
        this.$message({
          message: error,
          type: 'warning'
        });

        this.loading = false;
      })
    },
    // 修改会员业绩
    handlePerfAdjustment(formName) {
      this.$confirm('确认修改会员业绩?', '提示', { //
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.loading = true;
        return network.postData(`bonus/perf-adjustment`, this.perfForm).then(response => {
          this.$message({
            message: response,
            type: 'success'
          });
          this.loading = false;

          // 刷新数据
          this.getData();
        }).catch(error => {
          this.$message({
            message: error,
            type: 'warning'
          });
          this.loading = false;
        });
      })
    },
  }
}
</script>

<style>
  .filter-user { font-size: 14px; margin-bottom: 20px; }
  .filter-user:after { content: ''; display: table;  clear: both; }
</style>