SAAS-FRONTEND/src/views/dzk/Dzk_RuleList.vue

<template>
  <div v-if="pageStatus == 0">配置加载中...</div>
  <div v-else-if="pageStatus == 1">此页面不对此账号开放</div>
  <div v-else-if="pageStatus == 2">没有此页内容的配置权限，请检查集团上的配置</div>
  <div v-else-if="pageStatus == 3">加载发生错误</div>
  <div v-else-if="pageStatus == 4" class="app-container">
    <el-form :model="sumForm">
      <el-form-item label="电子卡启动状态">
        {{ sumForm.cardEnabledFlag == 0 ? "未开启" : "已开启" }}
      </el-form-item>
      <el-form-item
        label="目前启动的电子卡"
        v-if="sumForm.cardEnabledFlag == 1"
      >
        {{
          sumForm.cardOilsType.length == 0
            ? "你尚未选择要启动的电子卡"
            : sumForm.cardOilsType.join("， ")
        }}
      </el-form-item>

      <!-- <el-form-item
        label="所有积分规则的失效时间"
        v-if="sumForm.termDateManage == 2"
      >
        {{
          sumForm.termDateManage == 0 ? "积分规则永久有效" : sumForm.emptyDate
        }}
      </el-form-item>
      <el-form-item label="多倍积分活动的状态">
        {{
          sumForm.integralActivity == 0 ? "未开启" : integralActivityDatePicker
        }}
      </el-form-item> -->
      <el-form-item 
        label="正在生效中的充值规则" 
        v-if="sumForm.cardEnabledFlag == 1"
      >
          {{ sumForm.detailList.length===0 ? "你尚没有正在生效的规则":"" }}
          <el-table :data="sumForm.detailList" v-if="sumForm.detailList.length!==0">
            <af-table-column
              label="电子卡"
              align="center"
              :formatter="oilNameFormatter"
            />
            <af-table-column label="条件" align="center" prop="discountAmtTerm">
              <template slot-scope="scope1">
                {{ scope1.row.discountAmtStart }}≤充值金额(元)&lt;{{
                  scope1.row.discountAmtEnd
                }}
              </template>
            </af-table-column>

            <af-table-column label="赠送" align="center">
              <template slot-scope="scope">
                {{
                  scope.row.settingRuleType == 1
                    ? "按金额赠送"
                    : scope.row.settingRuleType == 2
                    ? "按比例赠送"
                    : ""
                }}
                --- 额度为 {{ scope.row.presentAmt }}
                {{
                  scope.row.settingRuleType == "1"
                    ? "元"
                    : scope.row.settingRuleType == "2"
                    ? "%"
                    : ""
                }}
              </template>
            </af-table-column>
          </el-table>
      </el-form-item>

      
      
      <el-form-item
        label="电子卡会叠加的优惠方案"
        v-if="sumForm.cardEnabledFlag == 1"
      >
        <div>
          {{ sumForm.isMarket == 1 ? "营销方案 ":""}}
          {{ sumForm.isGradeSetting == 1 ? "等级优惠 ":""}}
          {{ sumForm.isDiscountCoupon == 1 ? "优惠券 ":""}}
          {{ sumForm.isLabel == 1 ? "标签 ":""}}
          {{ sumForm.isMarket == 1 || sumForm.isGradeSetting == 1 || sumForm.isDiscountCoupon == 1 ? '' : "您未启动叠加，电子卡不会执行任何优惠方案" }}
        </div>
      </el-form-item>

      <el-form-item
        label="充值活动"
        v-if="sumForm.cardEnabledFlag == 1"
      >
        {{
          sumForm.discountTimeSetting == 0 ? "未开启" : integralActivityDatePicker
        }}
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { listDetailInfo } from "@/api/customer/cardSettingDetail";
import { selectCustomerCardSetting } from "@/api/customer/cardSetting";
export default {
  name: "Dzk_RuleList",
  data() {
    return {
      // 总条数
      total: 0,
      // 客户电子会员卡充值优惠设置明细表格数据
      detailList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      sumForm: {},
      timeSelect: [
        ,
        ["周天", "周一", "周二", "周三", "周四", "周五", "周六"],
        [
          "1号",
          "2号",
          "3号",
          "4号",
          "5号",
          "6号",
          "7号",
          "8号",
          "9号",
          "10号",
          "11号",
          "12号",
          "13号",
          "14号",
          "15号",
          "16号",
          "17号",
          "18号",
          "19号",
          "20号",
          "21号",
          "22号",
          "23号",
          "24号",
          "25号",
          "26号",
          "27号",
          "28号",
          "29号",
          "30号",
          "31号",
        ],
      ],
      pageStatus: 0,
    };
  },
  created() {
    this.setPageStatus();
    this.getList();
    this.init();
  },
  computed:{
    integralActivityDatePicker() {
      if (!this.sumForm.discountTime) {
        return "";
      }
      if (this.sumForm.integralActivity == 0) {
        return "";
      }

      let timeString = "";
      const discountTimeType = this.sumForm.discountTimeType;

      if (discountTimeType == 1) {
        timeString += "每周的";
      }
      if (discountTimeType == 2) {
        timeString += "每月的";
      }
      if (discountTimeType == 3) {
        timeString += "指定的日期 ";
      }
      if (discountTimeType == 1 || discountTimeType == 2) {
        this.sumForm.discountTime.forEach((ele) => {
          timeString += this.timeSelect[discountTimeType][ele] + "、";
        });
      } else if (discountTimeType == 3) {
        console.log(this.sumForm.discountTime);
        timeString += this.sumForm.discountTime.toString();
      }

      timeString = timeString.replace(/(、)$/g, "") + " 享受赠送比例是" + this.sumForm.presentScale + '%的活动优惠';
      return timeString;
    },
  },
  methods: {
    init() {
      selectCustomerCardSetting().then((response) => {
        this.sumForm = response.data;
        const cardOilsType = this.sumForm.cardOilsType == null ? "" : this.sumForm.cardOilsType
        this.sumForm.cardOilsType = cardOilsType
          .split(",")
          .filter((ele) => {
            return ele != "";
          });

        this.sumForm.detailList = this.sumForm.detailList.filter((ele)=>{
          return this.sumForm.cardOilsType.includes(ele.cardType)
        })

        const oilType = ['',"汽油卡", "柴油卡", "非油品卡", "LNG卡", "CNG卡"];
        this.sumForm.cardOilsType.map((ele, index) => {
          this.sumForm.cardOilsType[index] = oilType[ele];
        });

        if (
          this.sumForm.discountTimeType == "1" ||
          this.sumForm.discountTimeType == "2"
        ) {
          // if( this.form.discountTime == ""){
          //   this.form.discountTime = [];
          // }
          this.sumForm.discountTime = this.sumForm.discountTime
            .split(",")
            .map(parseFloat);
        } else if (this.sumForm.discountTimeType == "3") {
          if (this.sumForm.discountTime.length == 0) {
            this.sumForm.discountTime = [];
          } else {
            this.sumForm.discountTime = this.sumForm.discountTime.split(
              ","
            );
          }
        }
      });
    },
    setPageStatus() {
      this.queryPageStatus([1,2],2).then((res) => {
        this.pageStatus = res;
      });
    },
    oilNameFormatter(row, column) {
      if (row.cardType === "1") {
        return "汽油卡";
      } else if (row.cardType === "2") {
        return "柴油卡";
      } else if (row.cardType === "3") {
        return "非油品卡";
      } else if (row.cardType === "4") {
        return "LNG卡";
      } else if (row.cardType === "5") {
        return "CNG卡";
      } else {
        return row.cardType;
      }
    },
    /** 查询客户电子会员卡充值优惠设置明细列表 */
    getList() {
      listDetailInfo(this.queryParams).then((response) => {
        this.detailList = response.rows;
        this.total = response.total;
      });
    },
  },
};
</script>