oil-station/fuintAdmin/src/views/userGrade/index.vue

<template>
  <div class="app-container">
    <el-card>
      <div slot="header" class="clearfix">
        <span>等级配置</span>
      </div>
      <div>
        <div style="display: flex;justify-content: space-between">
          <span style="color: grey;">会员等级规则说明</span>
          <el-button v-show="level1" @click="editLevel1" type="primary" round>开启等级功能</el-button>
          <el-button v-show="level2" @click="editLevel2" type="danger" round>关闭等级功能</el-button>
        </div>
        <el-alert
          type="warning"
          style="margin-top: 15px"
          :closable="false">
          <p v-for="(item,index) in memberLevelRule" :id="index">
            {{item}}
          </p>
        </el-alert>
      </div>
      <div style="margin-top: 15px">
        <span style="color: grey;">等级清算规则</span>
        <div style="margin-top: 10px">
          <template>
            <el-radio v-model="clear" label="clear_month">按月清算</el-radio>
            <el-radio v-model="clear" label="clear_no">不清算</el-radio>
          </template>
          <el-button type="primary" round @click="updateClearConfig">保存</el-button>
        </div>
        <el-alert
          type="warning"
          style="margin-top: 15px"
          :closable="false">
          <p v-for="(item,index) in levelClearRule" :key="index">
            {{item}}
          </p>
        </el-alert>
      </div>
      <div style="margin-top: 15px">
        <span style="color: grey;">成长值计算方式</span>
        <div style="display: flex;justify-content: space-between">
          <el-input v-model="gasGrowthValue" disabled style="margin: 10px 10px">
            <template slot="prepend">汽油成长值比例,每消费1元积</template>
            <template slot="append">成长值</template>
          </el-input>
          <el-input v-model="dieselGrowthValue" disabled style="margin: 10px 10px">
            <template slot="prepend">柴油成长值比例,每消费1元积</template>
            <template slot="append">成长值</template>
          </el-input>
          <el-input v-model="naturalGrowthValue" disabled style="margin: 10px 10px">
            <template slot="prepend">天然气成长值比例,每消费1元积</template>
            <template slot="append">成长值</template>
          </el-input>
        </div>
        <el-alert
          type="warning"
          style="margin-top: 15px"
          :closable="false">
          <p v-for="(item,index) in growthValueRule" :id="index">
            {{item}}
          </p>
        </el-alert>
      </div>
    </el-card>

    <el-card class="card">
      <el-row :gutter="10" class="mb8">
        <el-col :span="21">
          <span style="font-size: 18px">等级规则</span>
          <span style="font-size: 14px">（最多支持20个等级）</span>
        </el-col>
        <el-col :span="3">
          <el-button
            type="primary"
            icon="el-icon-plus"
            @click="handleAdd"
          >新增会员等级</el-button>
        </el-col>
<!--        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>-->
      </el-row>
      <el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
      <el-table-column label="等级" prop="grade" width="55"/>
      <el-table-column label="等级名称" align="center" prop="name" />
      <el-table-column label="成长值" align="center" prop="growthValue" />
<!--      <el-table-column label="汽油成长值" align="center" prop="gasoline" />-->
<!--      <el-table-column label="柴油成长值" align="center" prop="dieselOil" />-->
<!--      <el-table-column label="天然气成长值" align="center" prop="naturalGas" />-->
<!--      <el-table-column label="升级条件值" align="center" prop="catchValue">-->
<!--        <template slot-scope="scope">-->
<!--          <span v-if="scope.row.catchValue > 0">-->
<!--              <span>{{ scope.row.catchValue }}</span>-->
<!--          </span>-->
<!--          <span v-else>无条件</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column label="有效天数" align="center" prop="validDay">-->
<!--         <template slot-scope="scope">-->
<!--             <span v-if="scope.row.validDay > 0">{{ scope.row.validDay + '天' }}</span>-->
<!--             <span v-else>永久</span>-->
<!--         </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column label="支付折扣" align="center" prop="discount">-->
<!--        <template slot-scope="scope">-->
<!--          <span v-if="scope.row.discount > 0">{{ scope.row.discount + '折' }}</span>-->
<!--          <span v-else>无折扣</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--      <el-table-column label="积分加速" align="center" prop="speedPoint">-->
<!--        <template slot-scope="scope">-->
<!--          <span v-if="scope.row.speedPoint > 0">{{ scope.row.speedPoint + '倍数' }}</span>-->
<!--          <span v-else>不加倍</span>-->
<!--        </template>-->
<!--      </el-table-column>-->
        <el-table-column label="优惠类型" align="center" prop="preferential" >
<!--          <template slot-scope="scope">-->
<!--            <dict-tag :options="dict.type.yhlx" :value="scope.row.preferential"/>-->
<!--          </template>-->
        </el-table-column>
        <el-table-column label="特权信息">
          <template slot-scope="scope">
            <div v-show="scope.row.preferential=='自定义优惠'">
              <p>
                汽油：
                <span style="margin-left: 10px">{{ scope.row.gasolineDiscount }}</span>
                <span v-if="scope.row.gasolineRule!=null && scope.row.gasolineRule!=''"
                      style="color: grey;font-size: 12px">
                  <div style="margin-left: 10px"
                       v-if="scope.row.gasolineDiscount=='满减优惠'"
                       v-for="(item,index) in scope.row.gasolineRuleList"
                       :key="index">
                    消费满{{item.gasolineRule1}}元,立减{{item.gasolineRule2}}元
                  </div>
                  <div style="margin-left: 10px"
                       v-if="scope.row.gasolineDiscount=='每升优惠'"
                       v-for="(item,index) in scope.row.gasolineRuleList"
                       :key="index">
                    消费满{{item.gasolineRule1}}元,每升优惠{{item.gasolineRule3}}元
                  </div>
                </span>
              </p>
              <p>
                柴油：
                <span style="margin-left: 10px">{{ scope.row.dieselDiscount }}</span>
                <span v-if="scope.row.dieselRule!=null && scope.row.dieselRule!=''"
                      style="margin-left: 10px;color: grey;font-size: 12px">
                  <div style="margin-left: 10px"
                       v-if="scope.row.dieselDiscount=='满减优惠'"
                       v-for="(item,index) in scope.row.dieselRuleList"
                       :key="index">
                    消费满{{item.dieselRule1}}元,立减{{item.dieselRule2}}元
                  </div>
                  <div style="margin-left: 10px"
                       v-if="scope.row.dieselDiscount=='每升优惠'"
                       v-for="(item,index) in scope.row.dieselRuleList"
                       :key="index">
                    消费满{{item.dieselRule1}}元,每升优惠{{item.dieselRule3}}元
                  </div>
                </span>
              </p>
              <p>
                天然气：
                <span style="margin-left: 10px">{{ scope.row.naturalGasDiscount }}</span>
                <span v-if="scope.row.naturalGasRule!=null && scope.row.naturalGasRule!=''"
                      style="margin-left: 10px;color: grey;font-size: 12px">
                  <div style="margin-left: 10px"
                       v-if="scope.row.naturalGasDiscount=='满减优惠'"
                       v-for="(item,index) in scope.row.naturalGasRuleList"
                       :key="index">
                    消费满{{item.naturalGas1}}元,立减{{item.naturalGas2}}元
                  </div>
                  <div style="margin-left: 10px"
                       v-if="scope.row.naturalGasDiscount=='每单位优惠'"
                       v-for="(item,index) in scope.row.naturalGasRuleList"
                       :key="index">
                    消费满{{item.naturalGas1}}元,每单位优惠{{item.naturalGas3}}元
                  </div>
                </span>
              </p>
            </div>
            <div v-show="scope.row.preferential=='优惠活动组'">
              优惠活动组：
              <span style="margin-left: 10px">{{ scope.row.promotionGroup }}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="scope">
<!--          <dict-tag :options="dict.type.zhzt" :value="scope.row.status"/>-->
          <el-tag v-if="scope.row.status == 'qy'">启用</el-tag>
          <el-tag v-else type="info">禁用</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.page"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </el-card>

    <!-- 添加或修改对话框 -->
    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="60%" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="24">
            <el-form-item label="等级" prop="grade">
              <el-input v-model="form.grade" placeholder="请输入等级级别，必须为正整数，且不可重复" maxlength="10" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="等级名称" prop="name">
              <el-input v-model="form.name" placeholder="请输入等级名称" maxlength="200" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="所需成长值" prop="growthValue">
              <el-input v-model="form.growthValue" placeholder="达到当前等级需要的成长值">
                <template slot="append">成长值</template>
              </el-input>
<!--              <e-row>-->
<!--                <el-col :span="8">-->
<!--                  <el-form-item prop="gasoline">-->
<!--                    <el-input v-model="form.gasoline" placeholder="1">-->
<!--                      <template slot="prepend">汽油</template>-->
<!--                      <template slot="append">成长值</template>-->
<!--                    </el-input>-->
<!--                  </el-form-item>-->
<!--                </el-col>-->
<!--              </e-row>-->
<!--              <e-row>-->
<!--                <el-col :span="8">-->
<!--                  <el-form-item prop="dieselOil">-->
<!--                    <el-input v-model="form.dieselOil" placeholder="1">-->
<!--                      <template slot="prepend">柴油</template>-->
<!--                      <template slot="append">成长值</template>-->
<!--                    </el-input>-->
<!--                  </el-form-item>-->
<!--                </el-col>-->
<!--              </e-row>-->
<!--              <e-row>-->
<!--                <el-col :span="8">-->
<!--                  <el-form-item prop="naturalGas">-->
<!--                    <el-input v-model="form.naturalGas" placeholder="1">-->
<!--                      <template slot="prepend">天然气</template>-->
<!--                      <template slot="append">成长值</template>-->
<!--                    </el-input>-->
<!--                  </el-form-item>-->
<!--                </el-col>-->
<!--              </e-row>-->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div style="font-size: 16px">
              等级特权
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="优惠类型" prop="preferential">
              <el-radio-group v-model="form.preferential">
<!--                <el-radio-->
<!--                  v-for="dict in dict.type.yhlx"-->
<!--                  :key="dict.value"-->
<!--                  :label="dict.label"-->
<!--                  :value="dict.value"></el-radio>-->
                <el-radio
                  label="自定义优惠"
                  value="自定义优惠"></el-radio>
              </el-radio-group>
              <div>
                <div style="color: grey;font-size: 12px;height: 18px">
                  自定义优惠:当前页面自定义简单的油品优惠
                </div>
                <div style="color: grey;font-size: 12px;height: 18px">
                  优惠活动组:使用优惠组设置来配置当前等级用户的优惠信息,支持周期性
                </div>
              </div>
            </el-form-item>
          </el-col>
        </el-row>

        <div v-if="form.preferential=='自定义优惠'">
          <el-row>
            <el-col :span="24">
              <el-form-item label="汽油优惠"  prop="preferential">
                <el-radio-group v-model="form.gasolineDiscount">
                  <el-radio label="无优惠">无优惠</el-radio>
                  <el-radio label="满减优惠">满减优惠</el-radio>
                  <el-radio label="每升优惠">每升优惠</el-radio>
                </el-radio-group>
                <div v-if="form.gasolineDiscount != '无优惠'">
                  <div v-for="(item,idx) in gasolinePreferential" style="display: flex">
                    <el-input v-model="item.gasolineRule1" placeholder="1" style="width: 260px;">
                      <template slot="prepend">消费满</template>
                      <template slot="append">元，</template>
                    </el-input>
                    <el-input v-model="item.gasolineRule2" placeholder="1" style="width: 260px;" v-if="form.gasolineDiscount == '满减优惠'">
                      <template slot="prepend">立减</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-input v-model="item.gasolineRule3" placeholder="1" style="width: 260px;" v-if="form.gasolineDiscount == '每升优惠'">
                      <template slot="prepend">每升优惠</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-button v-if="idx==0" type="primary" @click="addGasOline()" icon="el-icon-plus" style="margin-left: 20px"></el-button>
                    <el-button v-else type="danger" @click="subGasOline(idx)" icon="el-icon-close" style="margin-left: 20px"></el-button>
                  </div>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="柴油优惠" prop="preferential">
                <el-radio-group v-model="form.dieselDiscount">
                  <el-radio label="无优惠">无优惠</el-radio>
                  <el-radio label="满减优惠">满减优惠</el-radio>
                  <el-radio label="每升优惠">每升优惠</el-radio>
                </el-radio-group>
                <div v-if="form.dieselDiscount != '无优惠'">
                  <div v-for="(item,idx) in dieselPreferential" style="display: flex">
                    <el-input v-model="item.dieselRule1" placeholder="1" style="width: 260px;">
                      <template slot="prepend">消费满</template>
                      <template slot="append">元，</template>
                    </el-input>
                    <el-input v-model="item.dieselRule2" placeholder="1" style="width: 260px;" v-if="form.dieselDiscount == '满减优惠'">
                      <template slot="prepend">立减</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-input v-model="item.dieselRule3" placeholder="1" style="width: 260px;" v-if="form.dieselDiscount == '每升优惠'">
                      <template slot="prepend">每升优惠</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-button v-if="idx==0" type="primary" @click="addDiesel()" icon="el-icon-plus" style="margin-left: 20px"></el-button>
                    <el-button v-else type="danger" @click="subDiesel(idx)" icon="el-icon-close" style="margin-left: 20px"></el-button>
                  </div>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="天然气优惠" prop="preferential">
                <el-radio-group v-model="form.naturalGasDiscount">
                  <el-radio label="无优惠">无优惠</el-radio>
                  <el-radio label="满减优惠">满减优惠</el-radio>
                  <el-radio label="每单位优惠">每单位优惠</el-radio>
                </el-radio-group>
                <div v-if="form.naturalGasDiscount != '无优惠'">
                  <div v-for="(item,idx) in naturalGasPreferential" style="display: flex">
                    <el-input v-model="item.naturalGas1" placeholder="1" style="width: 260px;">
                      <template slot="prepend">消费满</template>
                      <template slot="append">元，</template>
                    </el-input>
                    <el-input v-model="item.naturalGas2" placeholder="1" style="width: 260px;" v-if="form.naturalGasDiscount == '满减优惠'">
                      <template slot="prepend">立减</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-input v-model="item.naturalGas3" placeholder="1" style="width: 260px;" v-if="form.naturalGasDiscount == '每单位优惠'">
                      <template slot="prepend">每单位优惠</template>
                      <template slot="append">元</template>
                    </el-input>
                    <el-button v-if="idx==0" type="primary" @click="addNaturalGas()" icon="el-icon-plus" style="margin-left: 20px"></el-button>
                    <el-button v-else type="danger" @click="subNaturalGas(idx)" icon="el-icon-close" style="margin-left: 20px"></el-button>
                  </div>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div v-else>
          <el-row>
            <el-col :span="24">
              <el-form-item label="关联优惠组" prop="preferential">
                <el-select v-model="form.promotionGroup">
                  <el-option
                    v-for="dict in dict.type.yhhdz"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  />
                </el-select>
                <div>
                  <div style="color: grey;font-size: 12px;height: 18px">
                    关联组后当前等级的用户优惠将按照优惠组的规则享受满减优惠
                  </div>
                  <div style="color: grey;font-size: 12px;height: 18px">
                    优惠活动组请前往活动营销-特惠活动-优惠活动组进行配置
                  </div>
                </div>
              </el-form-item>
            </el-col>
          </el-row>
        </div>

        <el-row>
          <el-col :span="24">
            <el-form-item label="状态" prop="status">
              <el-radio-group v-model="form.status">
                <el-radio label="qy">启用</el-radio>
                <el-radio label="jy">禁用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getUserGradeList, updateUserGradeStatus, getUserGradeInfo, saveUserGrade, deleteUserGrade } from "@/api/userGrade";
import {
  addUserGrade,
  delUserGrade,
  getUserGrade,
  listUserGrade,
  queryUserGrade,
  updateUserGrade
} from "@/api/staff/user/usergrade";
import {getChainStoreConfig, updateChainStoreConfig} from "@/api/staff/user/chainstoreconfig";
import {editSysConfig, getSysConfig} from "@/api/staff/user/sysconfig";
import {ljStoreInfo, updateStoreRule} from "@/api/staff/store";
export default {
  name: "UserGradeIndex",
  dicts: ['yhlx','zhzt','yhhdz'],
  data() {
    return {
      level1:true,
      level2:false,
      // 是否开启等级功能
      isEnableLevel:"",
      // 优惠值
      gasolinePreferential:[
        {
          gasolineRule1:1,
          gasolineRule2:1,
          gasolineRule3:1,
        }
      ],
      dieselPreferential:[
        {
          dieselRule1:1,
          dieselRule2:1,
          dieselRule3:1,
        }
      ],
      naturalGasPreferential:[
        {
          naturalGas1:1,
          naturalGas2:1,
          naturalGas3:1,
        }
      ],
      // 会员等级规则说明
      memberLevelRule:[],
      // 等级清算规则
      levelClearRule:[],
      // 成长值计算规则
      growthValueRule:[],
      // 汽油成长值
      gasGrowthValue:0,
      // 柴油成长值
      dieselGrowthValue:0,
      // 天然气成长值
      naturalGrowthValue:0,
      clear:'',
      // 遮罩层
      loading: true,
      // 标题
      title: "",
      // 选中数组
      ids: [],
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 表格数据
      list: [],
      // 升级条件
      catchTypeList: [],
      // 是否显示弹出层
      open: false,
      // 等级开启信息
      map:{
        isEnableLevel:this.isEnableLevel,
        isMonthClear:this.clear,
      },
      // 默认排序
      defaultSort: {prop: 'createTime', order: 'descending'},
      // 表单参数
      form: { id: '', grade: "", name: '',gasoline:1,dieselOil:1,naturalGas:1,preferential:'自定义优惠',
        gasolineDiscount:'无优惠',dieselDiscount:'无优惠',naturalGasDiscount:'无优惠',promotionGroup:'',
        // catchCondition: '', userPrivilege: '', catchType: '', catchValue: '', validDay: '',discount: '', speedPoint: '',
        status: 'qy' },
      // 查询参数
      queryParams: {
        page: 1,
        pageSize: 10,
        name: '',
        catchType: '',
        status: ''
      },
      // 表单校验
      rules: {
        grade: [
          { required: true, message: "等级不能为空", trigger: "blur" },
          { pattern: /^[0-9]{1,10}$/ , message: `必须正整数`, trigger: 'blur' }
        ],
        name: [
          { required: true, message: "等级名称不能为空", trigger: "blur" },
        ],
        growthValue: [
          { required: true, message: "请填写会员升级所需成长值", trigger: "blur" },
        ],
        gasoline: [
          { required: true, message: "请填写汽油成长值", trigger: "blur" },
        ],
        dieselOil: [
          { required: true, message: "请填写柴油成长值", trigger: "blur" },
        ],
        naturalGas: [
          { required: true, message: "请填写天然气成长值", trigger: "blur" },
        ],
        preferential: [
          { required: true, message: "请选择优惠类型", trigger: "blur" },
        ],
        status: [
          { required: true, message: "会员等级状态", trigger: "blur" },
        ],
        discount: [
          { required: true, message: "请输入支付折扣", trigger: "blur" },
        ],
        speedPoint: [
          { required: true, message: "请输入加分加速倍数", trigger: "blur" },
        ],
      }
    };
  },
  created() {
    this.getList();
    this.getClearConfig();
    this.getRule();
    this.getISEnableLevel();
  },
  methods: {
    // 是否开启等级功能
    getISEnableLevel(){
      getChainStoreConfig().then(response => {
        this.isEnableLevel = response.data.isEnableLevel;
        this.clear = response.data.isMonthClear;
        if (response.data.gasGrowthValue){
          this.gasGrowthValue = response.data.gasGrowthValue;
        }
        if (response.data.dieselGrowthValue) {
          this.dieselGrowthValue = response.data.dieselGrowthValue;
        }
        if (response.data.naturalGrowthValue) {
          this.naturalGrowthValue = response.data.naturalGrowthValue;
        }
        if (response.data.isEnableLevel=="no"){
          this.level1 = true;
          this.level2 = false;
        }else {
          this.level1 = false;
          this.level2 = true;
        }
      })
      // getSysConfig('is_enable_level').then(response => {
      //   this.isEnableLevel = response.data
      //   if (response.data=="no"){
      //     this.level1 = true;
      //     this.level2 = false;
      //   }else {
      //     this.level1 = false;
      //     this.level2 = true;
      //   }
      // });
    },
    editLevel1(){
      this.map.isEnableLevel = "yes"
      this.map.isMonthClear = this.clear
      updateStoreRule(this.map).then(res => {
        this.level1 = false;
        this.level2 = true;
        this.$modal.msgSuccess("等级状态更新成功");
        this.getISEnableLevel();
      })
    },
    editLevel2(){
      this.map.isEnableLevel = "no"
      this.map.isMonthClear = this.clear
      updateStoreRule(this.map).then(res => {
        this.level1 = true;
        this.level2 = false;
        this.$modal.msgSuccess("等级状态更新成功");
        this.getISEnableLevel();
      })
    },
    addGasOline(){
      let temp= {
        gasolineRule1:1,
        gasolineRule2:1,
        gasolineRule3:1,
      }
      this.gasolinePreferential.push(temp);
    },
    subGasOline(idx){
      this.gasolinePreferential.splice(idx-1,1);
    },
    addDiesel(){
      let temp= {
        dieselRule1:1,
        dieselRule2:1,
        dieselRule3:1,
      }
      this.dieselPreferential.push(temp);
    },
    subDiesel(idx){
      this.dieselPreferential.splice(idx-1,1);
    },
    addNaturalGas(){
      let temp= {
        naturalGas1:1,
        naturalGas2:1,
        naturalGas3:1,
      }
      this.naturalGasPreferential.push(temp);
    },
    subNaturalGas(idx){
      this.naturalGasPreferential.splice(idx-1,1);
    },
    // 获取规则信息
    getRule(){
      getSysConfig('member_level_rule').then(response => {
        this.memberLevelRule = response.data.split(";")
      });
      getSysConfig('level_clear_rule').then(response => {
        this.levelClearRule = response.data.split(";")
      });
      getSysConfig('growth_value_rule').then(response => {
        this.growthValueRule = response.data.split(";")
      });
    },
    // 查询连锁店配置信息
    getClearConfig(){
      getChainStoreConfig().then(response => {
        this.clear = response.data.levelClearRule;
      })
    },
    // 修改清算规则
    updateClearConfig(){
      this.map.isEnableLevel = this.isEnableLevel;
      this.map.isMonthClear = this.clear;
      updateStoreRule(this.map).then(response => {
        this.$modal.msgSuccess("修改成功");
        this.getISEnableLevel();
      });
    },
    // 查询列表
    getList() {
      this.loading = true;
      listUserGrade(this.queryParams).then(response => {
        this.list = response.data.records;
        this.total = response.data.total;
        this.loading = false;
      })
    },
    // 搜索按钮操作
    handleQuery() {
      this.queryParams.page = 1;
      this.getList();
    },
    // 重置按钮操作
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
      this.handleQuery();
    },
    // 状态修改
    handleStatusChange(row) {
      let text = row.status == "A" ? "启用" : "禁用";
      this.$modal.confirm('确认要' + text + '"' + row.name + '"吗？').then(function() {
        return updateUserGradeStatus(row.id, row.status);
      }).then(() => {
        this.$modal.msgSuccess(text + "成功");
      }).catch(function() {
        row.status = row.status === "N" ? "A" : "N";
      });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.multiple = !selection.length
    },
    // 排序触发事件
    handleSortChange(column, prop, order) {
      this.queryParams.orderByColumn = column.prop;
      this.queryParams.isAsc = column.order;
      this.getList();
    },
    // 新增按钮操作
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "新增会员等级";
    },
    // 表单重置
    reset() {
      this.form = {
        id: '', grade: "", name: '',gasoline:1,dieselOil:1,naturalGas:1,preferential:'自定义优惠',
          gasolineDiscount:'无优惠',dieselDiscount:'无优惠',naturalGasDiscount:'无优惠',promotionGroup:'',
          status: 'qy'
      };
      this.gasolinePreferential=[
        {
          gasolineRule1:1,
          gasolineRule2:1,
          gasolineRule3:1,
        }
      ],
        this.dieselPreferential=[
        {
          dieselRule1:1,
          dieselRule2:1,
          dieselRule3:1,
        }
      ],
        this.naturalGasPreferential=[
        {
          naturalGas1:1,
          naturalGas2:1,
          naturalGas3:1,
        }
      ],
      this.resetForm("form");
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 提交按钮
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.form.gasolineRule = JSON.stringify(this.gasolinePreferential)
          this.form.dieselRule = JSON.stringify(this.dieselPreferential)
          this.form.naturalGasRule = JSON.stringify(this.naturalGasPreferential)
          if (this.form.id) {
            updateUserGrade(this.form).then(response => {
              if (response.data==1) {
                this.$modal.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              }else if (response.data==2) {
                this.$modal.msgError("修改失败，已存在当前等级的会员等级信息");
              }else if (response.data==3) {
                this.$modal.msgError("修改失败，会员等级名称已存在");
              }else {
                this.$modal.msgError("修改失败，已存在当前成长值的会员等级");
              }
            });
          } else {
            queryUserGrade({name:this.form.name}).then( response => {
              if(response.data!=null){
                this.$modal.msgError("会员等级名称已存在");
              }else {
                addUserGrade(this.form).then(res => {
                  if (res.data==1){
                    this.$modal.msgSuccess("新增成功");
                    this.open = false;
                    this.getList();
                  }else if (res.data==0){
                    this.$modal.msgError("新增失败，最多支持20个等级");
                  }else {
                    this.$modal.msgError("新增失败，已存在当前等级的会员等级信息");
                  }
                });
              }
            })
          }
        }
      });
    },
    // 修改按钮操作
    handleUpdate(row) {
      let _this = this;
      this.reset();
      const id = row.id || this.ids;
      getUserGrade(id).then(response => {
        _this.form = response.data;
        this.gasolinePreferential = JSON.parse(this.form.gasolineRule)
        this.dieselPreferential = JSON.parse(this.form.dieselRule)
        this.naturalGasPreferential = JSON.parse(this.form.naturalGasRule)
        this.open = true;
        this.title = "编辑会员等级";
      });
    },
    // 删除按钮操作
    handleDelete(row) {
      const name = row.name
      this.$modal.confirm('是否确认删除"' + name + '"的数据项？').then(function() {
        // return deleteUserGrade(row.id);
        return delUserGrade(row.id);
      }).then(() => {
        this.queryParams.page = 1
        this.$modal.msgSuccess("删除成功");
        this.getList();
      }).catch(() => {});
    }
  }
};
</script>

<style scoped>
  .app-container{
    width: 100%;
    height: 100%;
    background: #f6f8f9;
  }
  .card{
    margin-top: 15px;
  }
</style>