Joe пре 4 година
родитељ
комит
e44c03c255

+ 551 - 99
src/views/customer/cardSetting/index.vue

@@ -1,137 +1,589 @@
 <template>
   <div class="app-container">
-    <el-table  :data="detailList" >
-      <el-table-column label="电子会员卡充值规则" align="center" prop="parentId" >
-        <template slot-scope="scope">
-          <span v-show="scope.row.oilName=='1'">汽油</span>
-          <span v-show="scope.row.oilName=='2'">柴油</span>
-          <span>充值金额大于等于{{scope.row.discountAmtStart}}元小于{{scope.row.discountAmtEnd}}元赠送</span>
-          <span v-show="scope.row.settingRuleType==1">{{scope.row.presentAmt}}元</span>
-          <span v-show="scope.row.settingRuleType==2">{{scope.row.presentAmt}}%</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="是否启用充值规则" align="center" prop="cardOilsType" >
-        <template slot-scope="scope1">
-          <span v-show="scope1.row.cardOilsType=='1' && scope1.row.oilName=='1'">开启</span>
-          <span v-show="scope1.row.cardOilsType=='2' && scope1.row.oilName=='2'">开启</span>
-          <span v-show="scope1.row.cardOilsType=='1,2'">开启</span>
-          <span v-show="scope1.row.cardOilsType=='2,1'">开启</span>
-          <span v-show="scope1.row.cardOilsType==''">关闭</span>
-           <span v-show="scope1.row.cardOilsType=='2' && scope1.row.oilName=='1'">关闭</span>
-           <span v-show="scope1.row.cardOilsType=='1' && scope1.row.oilName=='2'">关闭</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="充值活动设置" align="center" prop="discountTimeSetting" :formatter="discountTimeSettingFormatter" width="100px;"/>
-      <el-table-column label="周期类型" align="center" prop="discountTimeType" :formatter="discountTimeTypeFormatter" width="90px;"/>
-      <el-table-column label="赠送比例" align="center" width="90px;" >
-        <template slot-scope="scope1">
-           <span >{{scope1.row.presentScale}}</span>
-           <span v-show="scope1.row.presentScale!=null&&scope1.row.presentScale!=''">%</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="电子卡支付产生积分可享受倍数" align="center" width="90px;" >
-        <template slot-scope="scope2">
-           <span >{{scope2.row.enjoyIntegralMultiple}}</span>
-           <span v-show="scope2.row.enjoyIntegralMultiple!=null&&scope2.row.enjoyIntegralMultiple!=''">倍</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="是否叠加优惠劵" align="center" prop="isDiscountCoupon" :formatter="isDiscountCouponFormatter" width="90px;"/>
-      <el-table-column label="是否叠加营销活动" align="center" prop="isMarket" :formatter="isMarketFormatter" width="90px;"/>
-      <el-table-column label="是否叠加等级设置" align="center" prop="isGradeSetting" :formatter="isGradeSettingFormatter" width="90px;"/>
-    </el-table>
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+    <el-form ref="settingform" :model="settingform" :rules="rules" label-width="130px">
+      <el-row>
+        <el-col :span="6" style=""> 
+          <el-form-item label="是否启用充值规则">
+            <el-checkbox-group v-model="cardOilsTypeList">
+              <el-checkbox v-for = "item in checkList" :key="item.id" :label="item.id" :value="item.value">{{item.value}}</el-checkbox>
+            </el-checkbox-group>
+          </el-form-item> 
+        </el-col>
+        <el-col :span="8" style=""> 
+          <el-button type="primary" style="" @click="handleAdd">新增充值规则</el-button>
+        </el-col> 
+      </el-row>
+      <div>
+        <el-table :data="settingform.detailList" >
+          <el-table-column label="id" align="center" prop="id" v-if="false" />
+          <el-table-column label="所对应电子会员卡ID" align="center" prop="parentId"  v-if="false" />
+          <el-table-column label="油品" align="center" prop="oilName"  :formatter="oilNameFormatter"/>
+          <el-table-column label="优惠条件金额" align="center" prop="discountAmtTerm" >
+            <template slot-scope="scope1">
+               {{scope1.row.discountAmtStart}}≤充值金额(元)&lt;{{scope1.row.discountAmtEnd}}
+            </template>
+          </el-table-column>
+          <el-table-column label="赠送方式" align="center" prop="settingRuleType"  :formatter="settingRuleTypeFotmat"/>
+          <el-table-column label="赠送金额值或比例" align="center" prop="presentAmt">
+            <template slot-scope="scope2">
+               {{scope2.row.presentAmt}}
+                <span v-show="scope2.row.settingRuleType=='1'">元</span>
+                <span v-show="scope2.row.settingRuleType=='2'">%</span>
+            </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.$index,scope.row)"
+              >修改</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.$index,scope.row)"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <el-form-item label="充值活动设置">
+      </el-form-item>
+      <el-form-item >
+       <el-radio-group v-model="settingform.discountTimeSetting">
+          <el-radio
+            v-for="dict in discountTimeSettingOptions"
+            :key="dict.dictValue"
+            :label="dict.dictValue"
+          >{{dict.dictLabel}}</el-radio>
+        </el-radio-group>
+      </el-form-item>  
+      <el-row>
+        <el-col :span="8" style="">
+          <el-form-item  label="周期选择" >
+            <el-select v-model="settingform.discountTimeType" clearable  size="mini"  @change="datePickerChang" >
+                <el-option
+                  v-for="item in discountTimeTypeOptions"
+                  :key="item.dictValue"
+                  :label="item.dictLabel"
+                  :value="item.dictValue"
+                ></el-option>
+              </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">  
+          <el-form-item v-show="workDaytrue">
+            <div style="display: flex;flex-wrap: wrap;border-style: solid;border-color:#F5F7FA">
+              <div v-for="(item, index) in workDay" :key="index" style="margin:3px;">
+                <div class="hover-style" style="border-radius:5px;font-weight:bold;font-size:12px;cursor: pointer;" @click="clickWorkDayCalendar(item, index)">
+                  <div>{{ item }}</div>
+                  <div v-if="collectClickWorkDay.indexOf(index) > -1" style="width:4px;height:4px;border-radius:50%;background-color:red;position: relative;left:calc(50% - 2px);"></div>
+                  <div v-else style="width:4px;height:4px;"></div>
+                </div>
+              </div>
+             </div>
+          </el-form-item>
+          <el-form-item v-show="moonDaytrue" >
+             <div style="display: flex;flex-wrap: wrap;border-style: solid;border-color:#F5F7FA">
+              <div v-for="(item, index) in moonEverDay" :key="index" style="margin:3px;">
+                <div class="hover-style" style="border-radius:5px;font-weight:bold;font-size:12px;cursor: pointer;" @click="clickCalendar(item, index)">
+                  <div>{{ item }}</div>
+                  <div v-if="collectClickCalendar.indexOf(index) > -1" style="width:4px;height:4px;border-radius:50%;background-color:red;position: relative;left:calc(50% - 2px);"></div>
+                  <div v-else style="width:4px;height:4px;"></div>
+                </div>
+              </div>
+             </div>
+          </el-form-item>
+          <el-form-item  v-show="datetrue">
+            <el-date-picker clearable size="small" style="margin-left: 10px;width: 200px"
+                            v-model="pickerTime"
+                            type="dates"
+                            value-format="yyyy-MM-dd"
+                            placeholder="选择提醒时间设置">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="赠送比例" prop="presentScale">
+            <el-input v-model="settingform.presentScale" placeholder="请输入赠送比例" style="width:70px;"/>%
+          </el-form-item>
+        </el-col>
+      </el-row>  
+      <el-form-item label="叠加优惠设置" ></el-form-item>
+      <el-row style="margin-left:80px;">
+        <el-col :span="8" >
+          <el-form-item  prop="isDiscountCoupon" label="是否叠加优惠券">
+            <el-radio-group v-model="settingform.isDiscountCoupon">
+              <el-radio
+                v-for="dict in isDiscountCouponOptions"
+                :key="dict.dictValue"
+                :label="dict.dictValue"
+              >{{dict.dictLabel}}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8" >
+          <el-form-item  prop="isMarket" label="是否叠加营销方案">
+            <el-radio-group v-model="settingform.isMarket">
+              <el-radio
+                v-for="dict in isDiscountCouponOptions"
+                :key="dict.dictValue"
+                :label="dict.dictValue"
+              >{{dict.dictLabel}}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8" >
+          <el-form-item  prop="isGradeSetting" label="是否叠加等级优惠">
+            <el-radio-group v-model="settingform.isGradeSetting">
+              <el-radio
+                v-for="dict in isDiscountCouponOptions"
+                :key="dict.dictValue"
+                :label="dict.dictValue"
+              >{{dict.dictLabel}}</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="8" style="margin-left:80px;">
+          <el-form-item  prop="isDiscountCoupon" label="电子卡支付产生积分可享受倍数" label-width="225px">
+            <el-input v-model="settingform.enjoyIntegralMultiple" placeholder="请输入积分可享受倍数" style="width:100px;"/>倍
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+    </div>
+
+     <!-- 添加或修改客户电子会员卡充值优惠设置明细对话框 -->
+    <el-dialog :title="title" :visible.sync="open"  append-to-body>
+      <el-form ref="infoform" :model="infoform" :rules="rules" label-width="110px">
+        <el-form-item label="选择油品" >
+          <el-select
+            v-model="infoform.oilName"
+            placeholder="请选择油品"
+            clearable
+            size="small"
+          >
+          <el-option
+            v-for="item in oilOptions"
+            :key="item.dictLabel"
+            :label="item.dictLabel"
+            :value="item.dictValue"
+          ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="充值条件金额" prop="discountAmtTerm">
+          <el-input-number v-model="infoform.discountAmtStart" placeholder="请输入充值条件开始金额" style="width:200px;" /> 
+          <span>≤充值金额(元)&lt;</span>
+          <el-input-number v-model="infoform.discountAmtEnd" placeholder="请输入充值条件结束金额" style="width:200px;"/> 
+        </el-form-item>
+        <el-form-item label="赠送方式"></el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item >
+              <el-select v-model="infoform.settingRuleType" placeholder="请选择赠送方式" @change="settingRuleTypeChange">
+                <el-option
+                  v-for="item in settingRuleTypeOptions"
+                  :key="item.dictLabel"
+                  :label="item.dictLabel"
+                  :value="item.dictValue"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12" >
+            <el-form-item>
+              <el-input v-model="infoform.presentAmt" style="width:100px;"/>
+              <span v-show="jine">元</span>
+              <span v-show="bili">%</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+           <span style="color:red;margin-left:90px;">例:按赠送金额:充100赠送10元;按赠送比例:充100赠送10%</span>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="save">设置</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listDetailInfo} from "@/api/customer/cardSettingDetail";
+import { addSetting, updateSetting,selectCustomerCardSetting} from "@/api/customer/cardSetting";
 export default {
-  name: "Detail",
+  name: "Setting",
   data() {
     return {
       // 总条数
       total: 0,
-      // 客户电子会员卡充值优惠设置明细表格数据
-      detailList: [],
+      oilOptions:[],
+      isDiscountCouponOptions:[],
+      discountTimeSettingOptions:[],
+      collectClickCalendar: [], // 收集固定日期选择的日子
+      collectClickWorkDay:[],
+      discountTimeTypeOptions :[],
+      settingRuleTypeOptions:[],
+      checkList:[
+        {id:"1",value:"汽油"},
+        {id:"2",value:"柴油"}
+      ],
+      cardOilsTypeList:[],
+      pickerTime:"",
+      moonEverDay: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10',
+      '11', '12', '13', '14', '15', '16', '17', '18', '19', '20',
+      '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'],
+      workDay:["周天","周一","周二","周三","周四","周五","周六"],
+      workDaytrue:false,
+      moonDaytrue:false,
+      datetrue:false,
+      jine:false,
+      bili:false,
       // 弹出层标题
       title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10
-      },
       // 表单参数
-      form: {},
+      settingform: {
+        detailList:[]
+      },
+      //判断保存次数
+      num:0,
+      queryParams:{
+        stationId: null
+      },
+
+      index1:null,
+      open:false,
+      infoform:{},
       // 表单校验
       rules: {
       }
     };
   },
   created() {
-    this.getList();
+    this.getDicts("integral_manage").then(response => {
+      this.discountTimeSettingOptions = response.data;
+    });
+    
+    this.getDicts("date_picker").then(response => {
+      this.discountTimeTypeOptions = response.data;
+    });
+    this.getDicts("is_flag").then(response => {
+      this.isDiscountCouponOptions = response.data;
+    });
+    this.getDicts("oil").then(response => {
+      this.oilOptions = response.data;
+    });
+    this.getDicts("setting_rule_type").then(response => {
+      this.settingRuleTypeOptions = response.data;
+    });
+
+    selectCustomerCardSetting(this.queryParams).then(response => {
+      if(response.hasOwnProperty('data')){
+        this.settingform = response.data;
+        if(this.settingform.cardOilsType!=null &&this.settingform.cardOilsType!="" ){
+          this.cardOilsTypeList=this.settingform.cardOilsType.split(",");
+        }
+        if(this.settingform.discountTimeType == "1"){
+          this.workDaytrue=true;
+          this.moonDaytrue=false;
+          this.datetrue=false;
+          this.collectClickWorkDay =this.settingform.discountTime.split(",").map(parseFloat);
+        }else if(this.settingform.discountTimeType == "2"){
+          this.workDaytrue=false;
+          this.moonDaytrue=true;
+          this.datetrue=false;
+          this.collectClickCalendar= this.settingform.discountTime.split(',').map(parseFloat);
+        }else if(this.settingform.discountTimeType == "3"){
+          this.workDaytrue=false;
+          this.moonDaytrue=false;
+          this.datetrue=true;
+          if(this.settingform.discountTime!=""){
+              this.pickerTime =this.settingform.discountTime.split(",");
+          }else{
+            this.pickerTime =null;
+          }
+        }
+      }
+    });
   },
   methods: {
-    cardOilsTypeFormatter(row, column){
-      if(row.cardOilsType === '1'){
-        return '汽油卡'
-      }else if(row.cardOilsType === '2'){
-        return '柴油卡'
-      }else if(row.cardOilsType === '1,2'){
-        return '汽油卡,柴油卡'
+    oilNameFormatter(row, column){
+      if(row.oilName === '1'){
+        return '汽油'
+      }else if(row.oilName === '2'){
+        return '柴油'
+      }
+    },
+    settingRuleTypeFotmat(row, column){
+      if(row.settingRuleType === '1'){
+        return '按赠送金额'
+      }else if(row.settingRuleType === '2'){
+        return '按赠送比例'
+      }
+    },
+    settingRuleTypeChange(){
+      if(this.infoform.settingRuleType == "1"){
+        this.jine=true;
+        this.bili=false;
+      }else if(this.infoform.settingRuleType == "2"){
+        this.jine=false;
+        this.bili=true;
       }
     },
-    discountTimeSettingFormatter(row, column){
-      if(row.discountTimeSetting === '1'){
-        return '开启'
-      }else if(row.discountTimeSetting === '2'){
-        return '关闭'
+    datePickerChang(){
+      if(this.settingform.discountTimeType == "1"){
+        this.workDaytrue=true;
+        this.moonDaytrue=false;
+        this.datetrue=false;
+      }else if(this.settingform.discountTimeType == "2"){
+        this.workDaytrue=false;
+        this.moonDaytrue=true;
+        this.datetrue=false;
+      }else if(this.settingform.discountTimeType == "3"){
+        this.workDaytrue=false;
+        this.moonDaytrue=false;
+        this.datetrue=true;
       }
     },
-    discountTimeTypeFormatter(row, column){
-      if(row.discountTimeSetting === '1'){
-        return '每周指定日'
-      }else if(row.discountTimeSetting === '2'){
-        return '每月指定日'
-      }else if(row.discountTimeSetting === '2'){
-        return '固定活动日'
+    resetInfo() {
+      this.infoform = {
+        id: null,
+        parentId:null,
+        oilName: null,
+        discountAmtStart: null,
+        discountAmtEnd: null,
+        settingRuleType: null,
+        presentAmt: null
+      };
+      this.resetForm("infoform");
+
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.resetInfo();
+      this.index1=null;
+      this.open = true;
+      this.title = "添加客户电子会员卡充值优惠设置";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(index,row) {
+      this.index1=index;
+      this.infoform = row;
+      this.open = true;
+      this.title = "修改客户电子会员卡充值优惠设置";
+      this.settingRuleTypeChange();
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["settingform"].validate(valid => {
+        if (valid) {
+          let flag=true;
+          if(this.cardOilsTypeList !=null && this.cardOilsTypeList.length>0){
+            this.settingform.cardOilsType=this.cardOilsTypeList.toString();
+          }else{
+            this.settingform.cardOilsType="";
+            flag=false;
+          }
+          if (this.settingform.id != null) {
+            let datepicker = this.settingform.discountTimeType;
+            if(datepicker=="1"){
+              if(this.collectClickWorkDay!=null&&this.collectClickWorkDay.length>0){
+                let discountTime=null;
+                for(let i =0;i<this.collectClickWorkDay.length;i++){
+                  if(!isNaN(this.collectClickWorkDay[i]) && this.collectClickWorkDay[i]!="NaN"){
+                    if( discountTime!=null){
+                      discountTime =discountTime+","+this.collectClickWorkDay[i];
+                    }else{
+                      discountTime =this.collectClickWorkDay[i];
+                    }
+                  }else{
+                    discountTime =discountTime;
+                  }
+                }
+                this.settingform.discountTime=discountTime; 
+                discountTime=null;
+              } else{
+                  this.settingform.discountTime=""; 
+              }
+            }else if(datepicker=="2"){
+              if(this.collectClickCalendar!=null&&this.collectClickCalendar.length>0){
+                let discountTime=null;
+                for(let i =0;i<this.collectClickCalendar.length;i++){
+                  if(!isNaN(this.collectClickCalendar[i]) && this.collectClickCalendar[i]!="NaN"){
+                    if( discountTime!=null){
+                      discountTime =discountTime+","+this.collectClickCalendar[i];
+                    }else{
+                      discountTime =this.collectClickCalendar[i];
+                    }
+                  }else{
+                    discountTime =discountTime;
+                  }
+                }
+                this.settingform.discountTime=discountTime; 
+                discountTime=null;
+              } else{
+                  this.settingform.discountTime=""; 
+              }
+            }else{
+              if(this.pickerTime!=null){
+                  this.settingform.discountTime = this.pickerTime.toString();
+              }else{
+                this.settingform.discountTime = "";
+              }
+            }    
+            updateSetting(this.settingform).then(response => {
+              this.msgSuccess("修改成功");
+              this.jine=false;
+              this.bili=false;
+            });
+          } else {
+            if(this.num==0){
+              if(datepicker=="1"){
+                if(this.collectClickWorkDay!=null&&this.collectClickWorkDay.length>0){
+                  let discountTime=null;
+                  for(let i =0;i<this.collectClickWorkDay.length;i++){
+                    if(!isNaN(this.collectClickWorkDay[i]) && this.collectClickWorkDay[i]!="NaN"){
+                      if( discountTime!=null){
+                        discountTime =discountTime+","+this.collectClickWorkDay[i];
+                      }else{
+                        discountTime =this.collectClickWorkDay[i];
+                      }
+                    }else{
+                      discountTime =discountTime;
+                    }
+                  }
+                  this.settingform.discountTime=discountTime; 
+                  discountTime=null;
+                } else{
+                    this.settingform.discountTime=""; 
+                }
+              }else if(datepicker=="2"){
+                  if(this.collectClickCalendar!=null&&this.collectClickCalendar.length>0){
+                    let discountTime=null;
+                    for(let i =0;i<this.collectClickCalendar.length;i++){
+                      if(!isNaN(this.collectClickCalendar[i]) && this.collectClickCalendar[i]!="NaN"){
+                        if( discountTime!=null){
+                          discountTime =discountTime+","+this.collectClickCalendar[i];
+                        }else{
+                          discountTime =this.collectClickCalendar[i];
+                        }
+                      }else{
+                        discountTime =discountTime;
+                      }
+                    }
+                    this.settingform.discountTime=discountTime; 
+                    discountTime=null;
+                  } else{
+                      this.settingform.discountTime=""; 
+                  }
+              }else{
+                if(this.pickerTime!=null){
+                   this.settingform.discountTime = this.pickerTime.toString();
+                }else{
+                  this.settingform.discountTime = "";
+                }
+              }
+              addSetting(this.settingform).then(response => {
+                this.msgSuccess("新增成功");
+                this.num=this.num+1;
+                this.jine=false;
+                this.bili=false;
+              });
+            }else{
+              this.msgSuccess("已新增成功,如需修改请刷新页面");
+            }
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(index) {
+     this.settingform.detailList.splice(index, 1)
+    },
+    deleteItemFromArr(item) {
+      Array.prototype.indexOf = function(val) {
+        for (var i = 0; i < this.length; i++) {
+          if (this[i] === val) {
+            return i
+          }
+        }
+        return -1
+      }
+      // 通过索引删除数组元素
+      Array.prototype.remove = function(val) {
+        var index = this.indexOf(val)
+        if (index > -1) {
+          this.splice(index, 1)
+        }
       }
+      // 删除数组元素
+      this.collectClickCalendar.remove(item)
     },
-    isDiscountCouponFormatter(row, column){
-      if(row.isDiscountCoupon === '0'){
-        return '是'
-      }else if(row.isDiscountCoupon === '1'){
-        return '否'
+    clickCalendar(item, index) {
+      if (this.collectClickCalendar.indexOf(index) === -1) {
+        this.collectClickCalendar.push(index)
+      } else if (this.collectClickCalendar.indexOf(index) > -1) {
+        this.deleteItemFromArr(index)
       }
     },
-    isMarketFormatter(row, column){
-      if(row.isMarket === '0'){
-        return '是'
-      }else if(row.isMarket === '1'){
-        return '否'
+    deleteWorkDayFromArr(item) {
+      Array.prototype.indexOf = function(val) {
+        for (var i = 0; i < this.length; i++) {
+          if (this[i] === val) {
+            return i
+          }
+        }
+        return -1
+      }
+      // 通过索引删除数组元素
+      Array.prototype.remove = function(val) {
+        var index = this.indexOf(val)
+        if (index > -1) {
+          this.splice(index, 1)
+        }
       }
+      // 删除数组元素
+      this.collectClickWorkDay.remove(item);
     },
-    isGradeSettingFormatter(row, column){
-      if(row.isGradeSetting === '0'){
-        return '是'
-      }else if(row.isGradeSetting === '1'){
-        return '否'
+    clickWorkDayCalendar(item, index) {
+      if (this.collectClickWorkDay.indexOf(index) === -1) {
+        this.collectClickWorkDay.push(index)
+      } else if (this.collectClickWorkDay.indexOf(index) > -1) {
+        this.deleteWorkDayFromArr(index)
       }
     },
-    /** 查询客户电子会员卡充值优惠设置明细列表 */
-    getList() {
-      listDetailInfo(this.queryParams).then(response => {
-        this.detailList = response.rows;
-        this.total = response.total;
-      });
+    cancelOpen(){
+      this.infoform = {
+        oilName: null,
+        discountAmtStart: null,
+        discountAmtEnd: null,
+        settingRuleType: null,
+        presentAmt: null
+      };
+      this.index1=null;
+      this.resetForm("infoform");
+      this.open = false;
+      this.jine=false;
+      this.bili=false;
     },
+    save(){
+      const that = this;
+      this.$refs["infoform"].validate(valid => {
+        if (valid) {
+          if(that.index1!=null){
+            that.handleDelete(that.index1);
+          }
+          that.settingform.detailList.push(that.infoform);
+        }
+      });
+      this.cancelOpen();
+    }
   }
 };
 </script>

+ 0 - 0
src/views/dzk/Dzk_Bill.vue


+ 421 - 0
src/views/dzk/Dzk_Report.vue

@@ -0,0 +1,421 @@
+<template>
+  <el-scrollbar style="height:100%">
+    <div>
+      <div style="width:99%;">
+        <span style="color:#ff9955;font-size:25px;">|</span>
+        <span style="font-size:20px;">数据概览</span>
+        <el-row :gutter="10" class="panel-group">
+          <el-col :xs="12" :sm="12" :lg="6">
+            <div class="flex xiaoliang">
+              <div style="font-size: 28px;">电子会员余额</div>
+              <div style="line-height: 62px;font-size: 32px;">{{hzAmt }}元</div>
+            </div>
+          </el-col>
+          <el-col :xs="12" :sm="12" :lg="6">
+            <div class="flex xiaoe">
+              <div style="font-size: 28px;">电子会员总数</div>
+              <div style="line-height: 62px;font-size: 32px;">{{ cardNum }}个</div>
+            </div>
+          </el-col>
+        </el-row>
+      </div>
+      <div style="width:99%; height: 181px;">
+        <span style="color:#ff9955;font-size:25px;">|</span>
+        <span style="font-size:20px;">详情:</span>
+        <el-table v-loading="loading"  :data="dayReportList">
+          <el-table-column label="日期" align="center" prop="createTime">
+              <template slot-scope="scope">
+              <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="充值金额" align="center" prop="czamt" />
+          <el-table-column label="消费金额" align="center" prop="xfamt"/>
+          <el-table-column label="新增电子会员" align="center" prop="cardnum" />
+        </el-table>
+        <div  style="float:right;">
+          <el-pagination
+            style="padding-top: 15px;"
+            @size-change="findSizeChange"
+            @current-change="findPage"
+            :current-page.sync="pageNow"
+            background
+            :pager-count="6"
+            :page-sizes="[5,10,20,50,100]"
+            :page-size="size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total">
+          </el-pagination>
+        </div>
+      </div> 
+      <el-dialog :title="title" width="800px"  :visible.sync="open" append-to-body>
+        <el-table v-loading="loading" :data="dayReportDetailsList">
+          <el-table-column label="订单单号" align="center" prop="orderNo" />
+          <el-table-column label="微信用户唯一标识" align="center" prop="unionId" v-if="false" />
+          <el-table-column label="会员号ID" align="center" prop="customerNo" />
+          <el-table-column label="会员名" align="center" prop="customerName" />
+          <el-table-column label="油品" align="center" prop="cardOilsType" :formatter="cardOilsTypeFotmat"/>
+          <el-table-column label="订单类型" align="center" prop="usageType" :formatter="usageTypeFotmat"/>
+          <el-table-column label="消费金额" align="center" prop="amt" />
+          <el-table-column label="余额" align="center" prop="balance" />
+          <el-table-column label="消费方式" align="center" prop="payType" :formatter="payTypeFotmat"/>
+          <el-table-column label="油站ID" align="center" prop="stationId" v-if="false"/>
+          <el-table-column label="油站名称" align="center" prop="stationName" />
+          <el-table-column label="油站名称" align="center" prop="create_time" v-if="false"/>
+        </el-table>
+        <div  class="pagination-container">
+          <el-pagination
+            style="padding-top: 15px"
+            @size-change="sizeChange"
+            @current-change="currentChange"
+            :current-page.sync="pageNow2"
+            background
+            :pager-count="6"
+            :page-sizes="[5,10,20,50,100]"
+            :page-size="setting"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total1">
+          </el-pagination>
+        </div>
+      </el-dialog>
+    </div>
+  </el-scrollbar>
+</template>
+
+<script>
+
+import {listSum,selectCard} from "@/api/customer/card";
+import { xfAmtQuery } from "@/api/customer/consumption";
+import { czAmtQuery,selectCardDetail } from "@/api/customer/recharge";
+export default {
+  name: "source",
+  data() {
+    return {
+      charts: null,
+      size:10,
+      pageNow:1,
+      pageNow2:1,
+      setting:10,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      total1: 0,
+      hzAmt: 0,
+      cardNum:0,
+      // 优惠劵管理表格数据
+      couponList: [],
+      dayReportDetailsList: [],
+      dateRangeCreatedDate: [],
+      //x轴数据
+      xdata: [],
+      //92#汽油数据
+      czdata: [],
+      //95#汽油数据
+      xfdata: [],
+      // 弹出层标题
+      title: "",
+      rows:[],
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageSetting:10,
+        pageNum:1,
+        createdDate: null,
+        stationId:null,
+        stationName: null,
+        beginTime: null,
+        endTime: null,
+        payDate: null,
+        status:"1"
+      },
+      // 查询参数
+      queryInfo: {
+        pageSetting:10,
+        pageNo:1,
+        createDate: null
+      },
+      query:{
+        stationId:null
+      },
+      //日报数据
+      dayReportList: [],
+      // 表单参数
+      form: {
+        czAmt: 0,
+        xfAmt: 0
+      },
+      // 表单校验
+      rules: {}
+    };
+  },
+ 
+  created() {
+    this.dayDataSource();
+    this.getHZlist();
+    //获取折线图的数据
+    this.reset();
+    this.queryParams.beginTime = this.getMonthDate();
+    this.queryParams.endTime = this.getEndFormatDate(new Date());
+    this.queryParams.stationId=this.$store.selectDeptId;
+  },
+  methods: {
+    usageTypeFotmat(row, column){
+      if(row.usageType === '+'){
+        return '充值'
+      }else if(row.usageType === '-'){
+        return '消费'
+      }
+    },
+    payTypeFotmat(row, column){
+      if(row.payType === '1'){
+        return '小程序'
+      }else if(row.payType === '2'){
+        return 'POS'
+      }
+    },
+    cardOilsTypeFotmat(row, column){
+      if(row.cardOilsType === '1'){
+        return '汽油'
+      }else if(row.cardOilsType === '2'){
+        return '柴油'
+      }
+    },
+    /** 查询电子会员数据 */
+    getList() {
+      if(this.queryParams.stationId==null || this.queryParams.stationId==""){
+        this.queryParams.stationId =this.$store.state.user.deptId;
+      }
+      xfAmtQuery(this.queryParams).then(response => {
+        if (response.hasOwnProperty('data')) {
+          this.form.xfAmt = response.data.amt;
+        }
+      });
+      czAmtQuery(this.queryParams).then(response => {
+        if (response.hasOwnProperty('data')) {
+          this.form.czAmt = response.data.amt;
+        }
+      });
+      this.dayReportDetail();
+    },
+    getHZlist(){
+      //汇总电子会员数据
+      this.query.stationId=this.$store.selectDeptId;
+      if(this.query.stationId==null || this.query.stationId==""){
+        this.query.stationId =this.$store.state.user.deptId;
+      }
+      listSum(this.query).then(response => {
+        if (response.hasOwnProperty('data')) {
+          this.cardNum= response.data.num;
+          this.hzAmt = response.data.amt;
+        }
+      });
+    },
+    findPage(val){
+      this.pageNow = val;
+      this.dayReportDetail();
+    },
+    findSizeChange(size) {
+      //将val赋值给size
+      this.size = size;
+      //重新去后台查询数据
+      this.dayReportDetail();
+    },
+    dayReportDetail(){
+      this.loading = false;
+      this.queryParams.pageNo =this.pageNow;
+      this.queryParams.pageSetting =this.size;
+      selectCard(this.queryParams).then(response => {
+       this.dayReportList= response.rows;
+        this.total = response.total;
+      });
+    },
+    //本日的数据
+    dayDataSource() {
+      this.reset();
+      this.queryParams.beginTime = this.getNowFormatDate(new Date());
+      this.queryParams.endTime = this.getEndFormatDate(new Date());
+      this.queryParams.stationId=this.$store.selectDeptId;
+      if(this.queryParams.stationId==null || this.queryParams.stationId==""){
+        this.queryParams.stationId =this.$store.state.user.deptId;
+      }
+      this.getList();
+    },
+    //今天
+    getNowFormatDate(date) {
+      let seperator1 = "-";
+      let month = date.getMonth() + 1;
+      let strDate = date.getDate();
+      if (month >= 1 && month <= 9) {
+        month = "0" + month;
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = "0" + strDate;
+      }
+      let currentdate1 =
+        date.getFullYear() + seperator1 + month + seperator1 + strDate;
+      return currentdate1;
+    },
+    //明天
+    getEndFormatDate(myDate) {
+      let date = myDate.getDate();
+      date = date + 1;
+      myDate.setDate(date);
+      let seperator2 = "-";
+      let month = myDate.getMonth() + 1;
+      let strDate = myDate.getDate();
+      if (month >= 1 && month <= 9) {
+        month = "0" + month;
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = "0" + strDate;
+      }
+      let currentdate2 =
+        myDate.getFullYear() + seperator2 + month + seperator2 + strDate;
+      return currentdate2;
+    },
+    //昨天
+    getFormatDate(myDate) {
+      let date = myDate.getDate();
+      date = date - 1;
+      myDate.setDate(date);
+      let seperator3 = "-";
+      let month = myDate.getMonth() + 1;
+      let strDate = myDate.getDate();
+      if (month >= 1 && month <= 9) {
+        month = "0" + month;
+      }
+      if (strDate >= 0 && strDate <= 9) {
+        strDate = "0" + strDate;
+      }
+      let currentdate3 =
+        myDate.getFullYear() + seperator3 + month + seperator3 + strDate;
+      return currentdate3;
+    },
+    getDates() {
+      var new_Date = new Date();
+      var timesStamp = new_Date.getTime();
+      var currenDay = new_Date.getDay();
+      var dates = new Date(
+        timesStamp + 24 * 60 * 60 * 1000 * (0 - ((currenDay + 6) % 7))
+      )
+        .toLocaleDateString()
+        .replace(/[年月]/g, "-")
+        .replace(/[日上下午]/g, "");
+      let s = dates.replace(/-/g, "/");
+      var dt = new Date(s);
+      var m = dt.getMonth() + 1;
+      var d = dt.getDate();
+      m = m < 10 ? "0" + m : m;
+      d = d < 10 ? "0" + d : d;
+      dates = dt.getFullYear() + "-" + m + "-" + d;
+      return dates;
+    },
+    //本月第一天
+    getMonthDate() {
+      let date = new Date();
+      let seperator1 = "-";
+      let month = date.getMonth() + 1;
+      if (month >= 1 && month <= 9) {
+        month = "0" + month;
+      }
+      let currentdate =
+        date.getFullYear() + seperator1 + month + seperator1 + "01";
+      return currentdate;
+    },
+    // 表单重置
+    reset() {
+      this.queryParams = {
+        pageSetting:10,
+        pageNo:1,
+        createDate: null,
+        stationId: null,
+        stationName: null,
+        beginTime:null,
+        endTime:null
+      };
+      this.form = {
+        czAmt: 0,
+        xfAmt: 0
+      };
+      this.queryInfo={
+        pageSetting:10,
+        pageNo:1,
+        createDate: null
+      };
+    },
+
+    /** 查看详情按钮操作 */
+    handleLook(row) {
+      this.rows=row;
+      this.getLookOrder(row);
+    },
+    sizeChange(psize){
+      //将val赋值给size
+      this.setting = psize;
+      this.getLookOrder(this.rows);
+    },
+    currentChange(val) {
+      this.pageNow2 = val;
+      //重新去后台查询数据
+      this.getLookOrder(this.rows);
+    },
+    getLookOrder(row) {
+      const createDate = row.createTime;
+      this.queryInfo.createDate =createDate.substring(0,10);
+      this.queryInfo.pageNo =this.pageNow2;
+      this.queryInfo.pageSetting =this.setting;
+      return selectCardDetail(this.queryInfo).then(response => {
+        this.dayReportDetailsList = response.rows;
+        this.total1 = response.total;
+        this.open = true;
+        this.title = "电子会员明细";
+      });
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.flex {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 170px;
+  flex-direction: column;
+}
+.flex-qy {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.flex-qy-sx {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+.panel-group {
+  padding-left: 10px;
+}
+
+.flex-sr {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  flex-direction: column;
+}
+.sr-font {
+  font-size: 20px;
+  color: #f4a645;
+}
+</style>

+ 608 - 0
src/views/dzk/Dzk_Rule.vue

@@ -0,0 +1,608 @@
+<template>
+  <div class="app-container">
+    <el-form
+      ref="settingform"
+      :model="settingform"
+      :rules="rules"
+      label-width="130px"
+    >
+      <el-form-item label="是否启用电子卡" prop="cardEnabledFlag">
+        <el-radio-group v-model="settingform.cardEnabledFlag">
+          <el-radio label="0">关闭</el-radio>
+          <el-radio label="1">开启</el-radio>
+        </el-radio-group>
+      </el-form-item>
+
+      <el-form-item label="启用哪种电子卡">
+        <el-checkbox-group v-model="settingform.cardOilsType">
+          <el-checkbox label="汽油" value="1" />
+          <el-checkbox label="柴油" value="2" />
+          <el-checkbox label="非油品卡" value="3" />
+          <el-checkbox label="LNG" value="4" />
+          <el-checkbox label="CNG" value="5" />
+        </el-checkbox-group>
+      </el-form-item>
+      <div style="text-align: right">
+        <el-button type="primary" @click="handleAdd" size="mini">
+          新增规则
+        </el-button>
+      </div>
+      <div>
+        <el-table :data="settingform.detailList">
+          <el-table-column label="id" align="center" prop="id" v-if="false" />
+          <el-table-column
+            label="所对应电子会员卡ID"
+            align="center"
+            prop="parentId"
+            v-if="false"
+          />
+          <el-table-column
+            label="油品"
+            align="center"
+            prop="oilName"
+            :formatter="oilNameFormatter"
+          />
+          <el-table-column
+            label="优惠条件金额"
+            align="center"
+            prop="discountAmtTerm"
+          >
+            <template slot-scope="scope1">
+              {{ scope1.row.discountAmtStart }}≤充值金额(元)&lt;{{
+                scope1.row.discountAmtEnd
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="赠送方式"
+            align="center"
+            prop="settingRuleType"
+            :formatter="settingRuleTypeFotmat"
+          />
+          <el-table-column
+            label="赠送金额值或比例"
+            align="center"
+            prop="presentAmt"
+          >
+            <template slot-scope="scope2">
+              {{ scope2.row.presentAmt }}
+              <span v-show="scope2.row.settingRuleType == '1'">元</span>
+              <span v-show="scope2.row.settingRuleType == '2'">%</span>
+            </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.$index, scope.row)"
+                >修改</el-button
+              >
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.$index, scope.row)"
+                >删除</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <el-form-item label="充值活动">
+        <el-radio-group v-model="settingform.discountTimeSetting">
+          <el-radio label="关闭" value="0"></el-radio>
+          <el-radio label="开启" value="1"></el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="活动的周期类型" prop="discountTimeType">
+        <el-select v-model="settingform.discountTimeType" clearable size="mini">
+          <el-option label="每周指定日" value="1"></el-option>
+          <el-option label="每月指定日" value="2"></el-option>
+          <el-option label="固定活动日" value="3"></el-option>
+        </el-select>
+        <div
+          v-show="settingform.discountTimeType != 3"
+          style="
+            display: flex;
+            flex-wrap: wrap;
+            border-style: solid;
+            border-color: #f5f7fa;
+          "
+        >
+          <div
+            v-for="(item, index) in timeSelect[settingform.discountTimeType]"
+            :key="index"
+            style="margin: 3px"
+          >
+            <div
+              class="hover-style"
+              style="
+                border-radius: 5px;
+                font-weight: bold;
+                font-size: 12px;
+                cursor: pointer;
+              "
+              @click="clickCalendar(index)"
+            >
+              <div>{{ item }}</div>
+              <div
+                v-if="settingform.collectClickCalendar.indexOf(index) > -1"
+                style="
+                  width: 4px;
+                  height: 4px;
+                  border-radius: 50%;
+                  background-color: red;
+                  position: relative;
+                  left: calc(50% - 2px);
+                "
+              ></div>
+              <div v-else style="width: 4px; height: 4px"></div>
+            </div>
+          </div>
+        </div>
+        <div v-show="settingform.discountTimeType == 3">
+          <el-date-picker
+            clearable
+            size="small"
+            style="margin-left: 10px; width: 200px"
+            v-model="settingform.collectClickDay"
+            type="dates"
+            value-format="yyyy-MM-dd"
+            placeholder="选择提醒时间设置"
+          >
+          </el-date-picker>
+        </div>
+      </el-form-item>
+      <el-form-item label="活动的赠送比例" prop="presentScale">
+        <el-input
+          v-model="settingform.presentScale"
+          placeholder="请输入赠送比例"
+          style="width: 70px"
+        />%
+      </el-form-item>
+      <el-form-item prop="isDiscountCoupon" label="是否叠加优惠券">
+        <el-radio-group v-model="settingform.isDiscountCoupon">
+          <el-radio
+            label="叠加"
+            value="1"
+            >
+          </el-radio>
+          <el-radio
+            label="不叠加"
+            value="0"
+            >
+            </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item prop="isMarket" label="是否叠加营销方案">
+        <el-radio-group v-model="settingform.isMarket">
+          <el-radio
+            label="叠加"
+            value="1"
+            >
+          </el-radio>
+          <el-radio
+            label="不叠加"
+            value="0"
+            >
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item prop="isGradeSetting" label="是否叠加等级优惠">
+        <el-radio-group v-model="settingform.isGradeSetting">
+          <el-radio
+            label="叠加"
+            value="1"
+            >
+          </el-radio>
+          <el-radio
+            label="不叠加"
+            value="0"
+            >
+            </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item prop="isDiscountCoupon" label="支付产生积分倍数">
+        <el-input
+          v-model="settingform.enjoyIntegralMultiple"
+          style="width: 60px"
+          size="mini"
+        />倍
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确 定</el-button>
+    </div>
+
+    <!-- 添加或修改客户电子会员卡充值优惠设置明细对话框 -->
+    <el-dialog :title="title" :visible.sync="open" append-to-body>
+      <el-form ref="infoForm" :model="infoForm" :rules="infoRules">
+        <el-form-item label="选择电子卡" prop="cardType">
+          <el-select
+            v-model="infoForm.cardType"
+            placeholder="请选择油品"
+            clearable
+            size="small"
+          >
+            <el-option label="汽油卡" value="1"></el-option>
+            <el-option label="柴油卡" value="2"></el-option>
+            <el-option label="非油品" value="3"></el-option>
+            <el-option label="LNG" value="4"></el-option>
+            <el-option label="CNG" value="5"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="条件设置" prop="discountAmtTerm">
+          <el-input-number
+            v-model="infoForm.discountAmtStart"
+            placeholder="开始金额"
+            size="mini"
+          />
+          <span>≤充值金额(元)&lt;</span>
+          <el-input-number
+            v-model="infoForm.discountAmtEnd"
+            placeholder="结束金额"
+            size="mini"
+          />
+        </el-form-item>
+        <el-form-item label="赠送方式"></el-form-item>
+        <el-row>
+          <el-form-item>
+            <el-select
+              v-model="infoForm.settingRuleType"
+              placeholder="请选择赠送方式"
+              @change="settingRuleTypeChange"
+              size="mini"
+            >
+              <el-option label="按赠送金额" value="1"></el-option>
+              <el-option label="按赠送比例" value="2"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-input v-model="infoForm.presentAmt" style="width: 100px"  size="mini"/>
+            <span v-show="jine">元</span>
+            <span v-show="bili">%</span>
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <span style="color: red"
+            >例:按赠送金额:充100赠送10元;按赠送比例:充100赠送10%</span
+          >
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="save">添加</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  addSetting,
+  updateSetting,
+  selectCustomerCardSetting,
+} from "@/api/customer/cardSetting";
+export default {
+  name: "Setting",
+  data() {
+    const validateCardType = (rule, value, callback) => {
+      if (this.form.itemsDetail.length <= 0) {
+        callback(new Error("请先配置设置规则"));
+        return;
+      }
+      this.form.itemsDetail.forEach((ele) => {
+        if (!ele.oilName || !ele.ruleTerms || !ele.saleAmt || !ele.integral) {
+          console.log("1");
+          callback(new Error("请检查规则完整性"));
+          return;
+        }
+        if (ele.oilType != 3) {
+          if (!ele.ruleType || ele.grade === undefined || ele.grade === "") {
+            console.log("2");
+            console.log('grade',ele.grade)
+            callback(new Error("请检查规则完整性"));
+            return;
+          }
+        }
+      });
+      callback();
+    };
+    return {
+      // 总条数
+      total: 0,
+      oilOptions: [],
+      isDiscountCouponOptions: [],
+      discountTimeSettingOptions: [],
+      discountTimeTypeOptions: [],
+      checkList: [
+        { id: "1", value: "汽油" },
+        { id: "2", value: "柴油" },
+      ],
+      pickerTime: "",
+      moonEverDay: [
+        "01",
+        "02",
+        "03",
+        "04",
+        "05",
+        "06",
+        "07",
+        "08",
+        "09",
+        "10",
+        "11",
+        "12",
+        "13",
+        "14",
+        "15",
+        "16",
+        "17",
+        "18",
+        "19",
+        "20",
+        "21",
+        "22",
+        "23",
+        "24",
+        "25",
+        "26",
+        "27",
+        "28",
+        "29",
+        "30",
+        "31",
+      ],
+      workDay: ["周天", "周一", "周二", "周三", "周四", "周五", "周六"],
+      workDaytrue: false,
+      moonDaytrue: false,
+      datetrue: false,
+      jine: false,
+      bili: false,
+      // 弹出层标题
+      title: "",
+      // 表单参数
+      settingform: {
+        detailList: [],
+        collectClickCalendar: [], // 收集固定日期选择的日子
+        collectClickDay: [],
+        cardOilsType: [],
+      },
+      queryParams: {
+        stationId: null,
+      },
+
+      index1: null,
+      open: false,
+      infoForm: {},
+      // 表单校验
+      rules: {
+
+      },
+      timeSelect: [
+        ,
+        ["周天", "周一", "周二", "周三", "周四", "周五", "周六"],
+        [
+          "01",
+          "02",
+          "03",
+          "04",
+          "05",
+          "06",
+          "07",
+          "08",
+          "09",
+          "10",
+          "11",
+          "12",
+          "13",
+          "14",
+          "15",
+          "16",
+          "17",
+          "18",
+          "19",
+          "20",
+          "21",
+          "22",
+          "23",
+          "24",
+          "25",
+          "26",
+          "27",
+          "28",
+          "29",
+          "30",
+          "31",
+        ],
+      ],
+      infoRules:{
+        cardType:[{ validator: validateCardType, trigger: "change" }],
+      }
+    };
+  },
+  created() {
+    this.getDicts("integral_manage").then((response) => {
+      this.discountTimeSettingOptions = response.data;
+    });
+
+    this.getDicts("date_picker").then((response) => {
+      this.discountTimeTypeOptions = response.data;
+    });
+    this.getDicts("is_flag").then((response) => {
+      this.isDiscountCouponOptions = response.data;
+    });
+    this.getDicts("oil").then((response) => {
+      this.oilOptions = response.data;
+    });
+    selectCustomerCardSetting(this.queryParams).then((response) => {
+      console.log("response", response);
+      this.settingform = response.data;
+      this.settingform.collectClickCalendar = [];
+      this.settingform.collectClickDay = "";
+      if (
+        this.settingform.discountTimeType == "1" ||
+        this.settingform.discountTimeType == "2"
+      ) {
+        // if( this.form.discountTime == ""){
+        //   this.form.collectClickCalendar = [];
+        // }
+        this.settingform.collectClickCalendar = this.settingform.discountTime
+          .split(",")
+          .map(parseFloat);
+      } else {
+        if (this.settingform.discountTime.length == 0) {
+          this.settingform.collectClickDay = [];
+        } else {
+          this.settingform.collectClickDay = this.settingform.discountTime.split(
+            ","
+          );
+        }
+      }
+    });
+  },
+  methods: {
+    clickCalendar(index) {
+      if (this.settingform.collectClickCalendar.indexOf(index) === -1) {
+        this.settingform.collectClickCalendar.push(index);
+      } else if (this.settingform.collectClickCalendar.indexOf(index) > -1) {
+        const temp = this.settingform.collectClickCalendar.findIndex((ele) => {
+          return ele == index;
+        });
+        this.settingform.collectClickCalendar.splice(temp, 1);
+      }
+      this.settingform = { ...this.settingform };
+    },
+    oilNameFormatter(row, column) {
+      if (row.oilName === "1") {
+        return "汽油";
+      } else if (row.oilName === "2") {
+        return "柴油";
+      }
+    },
+    settingRuleTypeFotmat(row, column) {
+      if (row.settingRuleType === "1") {
+        return "按赠送金额";
+      } else if (row.settingRuleType === "2") {
+        return "按赠送比例";
+      }
+    },
+    settingRuleTypeChange() {
+      if (this.infoForm.settingRuleType == "1") {
+        this.jine = true;
+        this.bili = false;
+      } else if (this.infoForm.settingRuleType == "2") {
+        this.jine = false;
+        this.bili = true;
+      }
+    },
+    discountTimeTypeChang() {
+      if (this.settingform.discountTimeType == "1") {
+        this.workDaytrue = true;
+        this.moonDaytrue = false;
+        this.datetrue = false;
+      } else if (this.settingform.discountTimeType == "2") {
+        this.workDaytrue = false;
+        this.moonDaytrue = true;
+        this.datetrue = false;
+      } else if (this.settingform.discountTimeType == "3") {
+        this.workDaytrue = false;
+        this.moonDaytrue = false;
+        this.datetrue = true;
+      }
+    },
+    resetInfo() {
+      this.infoForm = {
+        id: null,
+        parentId: null,
+        oilName: null,
+        discountAmtStart: null,
+        discountAmtEnd: null,
+        settingRuleType: null,
+        presentAmt: null,
+      };
+      this.resetForm("infoForm");
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.resetInfo();
+      this.index1 = null;
+      this.open = true;
+      this.title = "添加客户电子会员卡充值优惠设置";
+    },
+    /** 修改按钮操作 */
+    handleUpdate(index, row) {
+      this.index1 = index;
+      this.infoForm = row;
+      this.open = true;
+      this.title = "修改客户电子会员卡充值优惠设置";
+      this.settingRuleTypeChange();
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["settingform"].validate((valid) => {
+        if (valid) {
+          this.settingform.cardOilsType = this.cardOilsType.toString();
+          if (
+            this.settingform.discountTimeType == "1" ||
+            this.settingform.discountTimeType == "2"
+          ) {
+            this.settingform.discountTime = this.settingform.collectClickCalendar.toString();
+          } else {
+            this.settingform.discountTime = this.settingform.collectClickDay.toString();
+          }
+          if (this.settingform.id != null) {
+            updateSetting(this.settingform).then((response) => {
+              this.msgSuccess("修改成功");
+              this.jine = false;
+              this.bili = false;
+            });
+          } else {
+            addSetting(this.settingform).then((response) => {
+              this.msgSuccess("新增成功");
+              this.jine = false;
+              this.bili = false;
+            });
+          }
+        }
+      });
+    },
+    /** 删除按钮操作 */
+    handleDelete(index) {
+      this.settingform.detailList.splice(index, 1);
+    },
+    cancelOpen() {
+      this.infoForm = {
+        oilName: null,
+        discountAmtStart: null,
+        discountAmtEnd: null,
+        settingRuleType: null,
+        presentAmt: null,
+      };
+      this.index1 = null;
+      this.resetForm("infoForm");
+      this.open = false;
+      this.jine = false;
+      this.bili = false;
+    },
+    save() {
+      const that = this;
+      this.$refs["infoForm"].validate((valid) => {
+        if (valid) {
+          if (that.index1 != null) {
+            that.handleDelete(that.index1);
+          }
+          console.log(that.infoForm);
+          that.settingform.detailList.push(that.infoForm);
+        }
+      });
+      this.cancelOpen();
+    },
+  },
+};
+</script>

+ 137 - 0
src/views/dzk/Dzk_RuleList.vue

@@ -0,0 +1,137 @@
+<template>
+  <div class="app-container">
+    <el-table  :data="detailList" >
+      <el-table-column label="电子会员卡充值规则" align="center" prop="parentId" >
+        <template slot-scope="scope">
+          <span v-show="scope.row.oilName=='1'">汽油</span>
+          <span v-show="scope.row.oilName=='2'">柴油</span>
+          <span>充值金额大于等于{{scope.row.discountAmtStart}}元小于{{scope.row.discountAmtEnd}}元赠送</span>
+          <span v-show="scope.row.settingRuleType==1">{{scope.row.presentAmt}}元</span>
+          <span v-show="scope.row.settingRuleType==2">{{scope.row.presentAmt}}%</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="是否启用充值规则" align="center" prop="cardOilsType" >
+        <template slot-scope="scope1">
+          <span v-show="scope1.row.cardOilsType=='1' && scope1.row.oilName=='1'">开启</span>
+          <span v-show="scope1.row.cardOilsType=='2' && scope1.row.oilName=='2'">开启</span>
+          <span v-show="scope1.row.cardOilsType=='1,2'">开启</span>
+          <span v-show="scope1.row.cardOilsType=='2,1'">开启</span>
+          <span v-show="scope1.row.cardOilsType==''">关闭</span>
+           <span v-show="scope1.row.cardOilsType=='2' && scope1.row.oilName=='1'">关闭</span>
+           <span v-show="scope1.row.cardOilsType=='1' && scope1.row.oilName=='2'">关闭</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="充值活动设置" align="center" prop="discountTimeSetting" :formatter="discountTimeSettingFormatter" width="100px;"/>
+      <el-table-column label="周期类型" align="center" prop="discountTimeType" :formatter="discountTimeTypeFormatter" width="90px;"/>
+      <el-table-column label="赠送比例" align="center" width="90px;" >
+        <template slot-scope="scope1">
+           <span >{{scope1.row.presentScale}}</span>
+           <span v-show="scope1.row.presentScale!=null&&scope1.row.presentScale!=''">%</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="电子卡支付产生积分可享受倍数" align="center" width="90px;" >
+        <template slot-scope="scope2">
+           <span >{{scope2.row.enjoyIntegralMultiple}}</span>
+           <span v-show="scope2.row.enjoyIntegralMultiple!=null&&scope2.row.enjoyIntegralMultiple!=''">倍</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="是否叠加优惠劵" align="center" prop="isDiscountCoupon" :formatter="isDiscountCouponFormatter" width="90px;"/>
+      <el-table-column label="是否叠加营销活动" align="center" prop="isMarket" :formatter="isMarketFormatter" width="90px;"/>
+      <el-table-column label="是否叠加等级设置" align="center" prop="isGradeSetting" :formatter="isGradeSettingFormatter" width="90px;"/>
+    </el-table>
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+import { listDetailInfo} from "@/api/customer/cardSettingDetail";
+export default {
+  name: "Detail",
+  data() {
+    return {
+      // 总条数
+      total: 0,
+      // 客户电子会员卡充值优惠设置明细表格数据
+      detailList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    cardOilsTypeFormatter(row, column){
+      if(row.cardOilsType === '1'){
+        return '汽油卡'
+      }else if(row.cardOilsType === '2'){
+        return '柴油卡'
+      }else if(row.cardOilsType === '1,2'){
+        return '汽油卡,柴油卡'
+      }
+    },
+    discountTimeSettingFormatter(row, column){
+      if(row.discountTimeSetting === '1'){
+        return '开启'
+      }else if(row.discountTimeSetting === '2'){
+        return '关闭'
+      }
+    },
+    discountTimeTypeFormatter(row, column){
+      if(row.discountTimeSetting === '1'){
+        return '每周指定日'
+      }else if(row.discountTimeSetting === '2'){
+        return '每月指定日'
+      }else if(row.discountTimeSetting === '2'){
+        return '固定活动日'
+      }
+    },
+    isDiscountCouponFormatter(row, column){
+      if(row.isDiscountCoupon === '0'){
+        return '是'
+      }else if(row.isDiscountCoupon === '1'){
+        return '否'
+      }
+    },
+    isMarketFormatter(row, column){
+      if(row.isMarket === '0'){
+        return '是'
+      }else if(row.isMarket === '1'){
+        return '否'
+      }
+    },
+    isGradeSettingFormatter(row, column){
+      if(row.isGradeSetting === '0'){
+        return '是'
+      }else if(row.isGradeSetting === '1'){
+        return '否'
+      }
+    },
+    /** 查询客户电子会员卡充值优惠设置明细列表 */
+    getList() {
+      listDetailInfo(this.queryParams).then(response => {
+        this.detailList = response.rows;
+        this.total = response.total;
+      });
+    },
+  }
+};
+</script>

+ 5 - 6
src/views/point/Point_Rule.vue

@@ -231,9 +231,9 @@
         >
           <el-input-number
             v-model="form.integralProportion"
-            style="width: 130px"
             :min="1"
             placeholder="请输入加倍比例"
+            size="small"
           />
           <span>倍</span>
         </el-form-item>
@@ -449,6 +449,9 @@ export default {
         this.form.itemsDetail = [{}];
       }
       if (this.form.datePicker == "1" || this.form.datePicker == "2") {
+        // if( this.form.datePickerTime == ""){
+        //   this.form.collectClickCalendar = [];
+        // }
         this.form.collectClickCalendar = this.form.datePickerTime
           .split(",")
           .map(parseFloat);
@@ -459,7 +462,6 @@ export default {
           this.form.collectClickDay = this.form.datePickerTime
           .split(",");
         }
-        
       }
       this.form = { ...this.form };
     });
@@ -483,8 +485,6 @@ export default {
     },
     // 删除行
     delItem(index) {
-      console.log(123456);
-      console.log(index);
       this.form.itemsDetail.splice(index, 1);
       if (this.form.itemsDetail.length <= 0) {
         this.form.itemsDetail = [{}];
@@ -565,7 +565,6 @@ export default {
               this.msgSuccess("更新成功");
             });
           } else {
-            this.form.datePickerTime = "";
             addRule(this.form).then((response) => {
               this.msgSuccess("新增成功");
             });
@@ -581,9 +580,9 @@ export default {
         const temp = this.form.collectClickCalendar.findIndex((ele) => {
           return ele == index;
         });
-        console.log(temp);
         this.form.collectClickCalendar.splice(temp, 1);
       }
+      this.form = {...this.form}
     },
   },
 };