Compare commits
2 Commits
171c81eea6
...
c11eb1a0a1
| Author | SHA1 | Date |
|---|---|---|
|
|
c11eb1a0a1 | |
|
|
20927c459b |
|
|
@ -56,7 +56,12 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="useNum" label="已使用" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.leftNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="已关联功能" width="180">
|
||||
<template #default="scope">
|
||||
<el-link type="primary" @click="RelevanceDialogRef.show(scope.row)">
|
||||
|
|
@ -70,14 +75,21 @@
|
|||
v-model="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
:disabled="scope.row.syncId"
|
||||
:disabled="!!scope.row.syncId"
|
||||
@change="statusChange($event, scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" label="创建时间" width="180" />
|
||||
<el-table-column prop="actions" label="操作" align="center" width="140" fixed="right">
|
||||
<el-table-column
|
||||
prop="actions"
|
||||
label="操作"
|
||||
align="center"
|
||||
width="140"
|
||||
fixed="right"
|
||||
>
|
||||
<template #default="scope">
|
||||
<template v-if="!scope.row.syncId">
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
|
|
@ -94,6 +106,17 @@
|
|||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="danger" disabled link>删除</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,12 @@
|
|||
<template>
|
||||
<el-dialog v-model="dialogVisible" :title="titleOptions.title" width="80%" top="4vh">
|
||||
<div class="scroll">
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="titleOptions.title"
|
||||
width="80%"
|
||||
top="4vh"
|
||||
@closed="closedReset"
|
||||
>
|
||||
<div class="scroll" ref="scrollRef">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
|
|
@ -11,6 +17,7 @@
|
|||
<el-form-item label="优惠券名称" prop="title">
|
||||
<el-input
|
||||
v-model="form.title"
|
||||
:maxlength="20"
|
||||
placeholder="请输入优惠券名称"
|
||||
style="width: 300px"
|
||||
/>
|
||||
|
|
@ -23,6 +30,7 @@
|
|||
placeholder="请输入使用门槛"
|
||||
style="width: 240px"
|
||||
input-style="text-align: center;"
|
||||
@input="(e) => (form.fullAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #prepend>满</template>
|
||||
<template #append>元</template>
|
||||
|
|
@ -32,6 +40,7 @@
|
|||
placeholder="请输入满减金额"
|
||||
style="width: 240px"
|
||||
input-style="text-align: center;"
|
||||
@input="(e) => (form.discountAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #prepend>减</template>
|
||||
<template #append>元</template>
|
||||
|
|
@ -47,6 +56,7 @@
|
|||
placeholder="请输入使用门槛"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="(e) => (form.fullAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #prepend>满</template>
|
||||
<template #append>可用</template>
|
||||
|
|
@ -83,6 +93,7 @@
|
|||
v-model="form.discountNum"
|
||||
placeholder="请输入可抵扣商品件数"
|
||||
style="width: 200px"
|
||||
@input="discountNumInput"
|
||||
/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
|
@ -92,6 +103,7 @@
|
|||
v-model="form.discountRate"
|
||||
placeholder="输入折扣(%)"
|
||||
style="width: 200px"
|
||||
@input="discountRateInput"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="使用门槛" prop="discountAmount">
|
||||
|
|
@ -101,6 +113,7 @@
|
|||
placeholder="请输入使用门槛"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="(e) => (form.discountAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #prepend>满</template>
|
||||
<template #append>可用</template>
|
||||
|
|
@ -113,6 +126,7 @@
|
|||
v-model="form.maxDiscountAmount"
|
||||
placeholder="请输入金额"
|
||||
style="width: 200px"
|
||||
@input="(e) => (form.maxDiscountAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #append>可用</template>
|
||||
</el-input>
|
||||
|
|
@ -122,13 +136,11 @@
|
|||
<div v-if="form.couponType == 4"></div>
|
||||
<div v-if="form.couponType == 6"></div>
|
||||
<div class="title">指定设置</div>
|
||||
<el-form-item label="选择门店" prop="useShopType">
|
||||
<el-form-item label="选择门店" prop="useShopType" v-if="shopInfo.isHeadShop">
|
||||
<el-radio-group v-model="form.useShopType">
|
||||
<el-radio label="仅本店可用" value="only"></el-radio>
|
||||
<template v-if="shopInfo.isHeadShop">
|
||||
<el-radio label="全部门店" value="all"></el-radio>
|
||||
<el-radio label="指定门店可用" value="custom"></el-radio>
|
||||
</template>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="选择门店" v-if="form.useShopType == 'custom'">
|
||||
|
|
@ -190,9 +202,11 @@
|
|||
style="width: 200px"
|
||||
v-if="form.validType == 'fixed'"
|
||||
input-style="text-align: center;"
|
||||
@input="validDaysInput"
|
||||
>
|
||||
<template #append>天</template>
|
||||
</el-input>
|
||||
<div style="width: 200px">
|
||||
<el-date-picker
|
||||
v-model="validityScope"
|
||||
type="daterange"
|
||||
|
|
@ -202,17 +216,35 @@
|
|||
v-if="form.validType == 'custom'"
|
||||
@change="validityScopeChange"
|
||||
/>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="隔天生效" prop="daysToTakeEffect">
|
||||
<el-form-item
|
||||
label="隔天生效"
|
||||
prop="daysToTakeEffect"
|
||||
v-if="form.validType == 'fixed'"
|
||||
>
|
||||
<div class="center">
|
||||
<el-input
|
||||
v-model="form.daysToTakeEffect"
|
||||
placeholder="请输入隔天生效日期"
|
||||
style="width: 300px"
|
||||
input-style="text-align: center;"
|
||||
@input="daysToTakeEffectInput"
|
||||
>
|
||||
<template #prepend>隔</template>
|
||||
<template #append>天生效</template>
|
||||
</el-input>
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="`领取后${form.daysToTakeEffect}天后的0点0分生效`"
|
||||
placement="top-start"
|
||||
>
|
||||
<el-icon size="18">
|
||||
<QuestionFilled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="可用周期" prop="useDays">
|
||||
<el-checkbox-group v-model="form.useDays">
|
||||
|
|
@ -222,16 +254,17 @@
|
|||
<el-checkbox value="周四" label="周四" />
|
||||
<el-checkbox value="周五" label="周五" />
|
||||
<el-checkbox value="周六" label="周六" />
|
||||
<el-checkbox value="周七" label="周七" />
|
||||
<el-checkbox value="周七" label="周日" />
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="指定时间段">
|
||||
<el-radio-group v-model="form.useTimeType">
|
||||
<el-radio label="领券后有效期内可用" value="all"></el-radio>
|
||||
<el-radio label="固定有效期范围内可用" value="custom"></el-radio>
|
||||
<el-radio label="全时段可用" value="all"></el-radio>
|
||||
<el-radio label="指定时间段可用" value="custom"></el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.useTimeType == 'custom'" prop="useTimeType">
|
||||
<div style="width: 200px">
|
||||
<el-time-picker
|
||||
v-model="useTimeScope"
|
||||
is-range
|
||||
|
|
@ -239,8 +272,8 @@
|
|||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
@change="useTimeScopeChange"
|
||||
style="width: 300px"
|
||||
/>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="title">发放设置</div>
|
||||
<el-form-item label="发放设置">
|
||||
|
|
@ -268,6 +301,7 @@
|
|||
placeholder="请输入总发放数量"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="giveNumInput"
|
||||
>
|
||||
<template #append>张</template>
|
||||
</el-input>
|
||||
|
|
@ -288,30 +322,34 @@
|
|||
placeholder="请输入每人限领量"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="getLimitInput"
|
||||
>
|
||||
<template #append>张</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="每人每日使用限量" prop="useLimit">
|
||||
<el-form-item label="每人每日使用限量">
|
||||
<div class="column">
|
||||
<div class="center">
|
||||
<el-switch
|
||||
<el-radio-group
|
||||
v-model="infiniteUseLimit"
|
||||
@change="infiniteUseLimitChange"
|
||||
/>
|
||||
<span>关闭则为无限制</span>
|
||||
>
|
||||
<el-radio label="无限制" :value="true"></el-radio>
|
||||
<el-radio label="每日限用" :value="false"></el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div v-if="infiniteUseLimit" style="margin-top: 10px">
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="限用数量" v-if="!infiniteUseLimit" prop="useLimit">
|
||||
<el-input
|
||||
v-model="form.useLimit"
|
||||
placeholder="请输入每人每日使用限量"
|
||||
placeholder="需小于或等于每人限领量"
|
||||
style="width: 255px"
|
||||
input-style="text-align: center;"
|
||||
@input="useLimitInput"
|
||||
>
|
||||
<template #append>张/每人1天</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="title">其他设置</div>
|
||||
<el-form-item label="与限时折扣同享">
|
||||
|
|
@ -370,7 +408,7 @@
|
|||
</el-form>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer" v-if="shopInfo.isHeadShop">
|
||||
<div class="dialog-footer" v-if="shopInfo.isHeadShop || !form.syncId">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="submitHandle">确 定</el-button>
|
||||
</div>
|
||||
|
|
@ -379,6 +417,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import _ from "lodash";
|
||||
import { dayjs } from "element-plus";
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { getBranchPage, getProductList, getCategoryList, addCoupon } from "@/api/coupon/index.js";
|
||||
|
|
@ -447,14 +486,26 @@ function shopsChange(e) {
|
|||
// 有效期时间
|
||||
const validityScope = ref([]);
|
||||
function validityScopeChange(e) {
|
||||
console.log("validityScopeChange===", e);
|
||||
if (e && e.length) {
|
||||
form.value.validStartTime = dayjs(e[0]).format("YYYY-MM-DD 00:00:00");
|
||||
form.value.validEndTime = dayjs(e[1]).format("YYYY-MM-DD 23:59:59");
|
||||
} else {
|
||||
form.value.validStartTime = "";
|
||||
form.value.validEndTime = "";
|
||||
}
|
||||
}
|
||||
// 可用时间
|
||||
const useTimeScope = ref([]);
|
||||
function useTimeScopeChange(e) {
|
||||
console.log("useTimeScopeChange===", e);
|
||||
if (e && e.length) {
|
||||
form.value.useStartTime = dayjs(e[0]).format("HH:mm:00");
|
||||
form.value.useEndTime = dayjs(e[1]).format("HH:mm:00");
|
||||
} else {
|
||||
form.value.useStartTime = "";
|
||||
form.value.useEndTime = "";
|
||||
}
|
||||
}
|
||||
|
||||
// 是否为无限数量
|
||||
|
|
@ -462,15 +513,18 @@ const infiniteFlagNum = ref(-10086);
|
|||
const infiniteGiveNum = ref(true);
|
||||
function infiniteGiveNumChange(e) {
|
||||
if (!e) {
|
||||
form.giveNum = infiniteFlagNum.value;
|
||||
form.value.giveNum = infiniteFlagNum.value;
|
||||
} else {
|
||||
form.value.giveNum = "";
|
||||
}
|
||||
formRef.value.validate();
|
||||
}
|
||||
// 是否为无限每人领取限量
|
||||
const infiniteUseLimit = ref(true);
|
||||
function infiniteUseLimitChange(e) {
|
||||
if (!e) {
|
||||
form.useLimit = infiniteFlagNum.value;
|
||||
if (e) {
|
||||
form.value.useLimit = infiniteFlagNum.value;
|
||||
} else {
|
||||
form.value.useLimit = "";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -497,12 +551,12 @@ const form = ref({
|
|||
useTimeType: "all", // 可用时间段类型:all-全时段,custom-指定时段
|
||||
useStartTime: "", // 可用开始时间
|
||||
useEndTime: "", // 可用结束时间
|
||||
getType: "yes", // 发放设置:不可自行领取/no,可领取/yes
|
||||
getMode: ["home", "eat"], // 用户领取方式 home/首页-优惠券 eat/点餐页-自动弹出 order/订单支付页面
|
||||
getType: "no", // 发放设置:不可自行领取/no,可领取/yes
|
||||
getMode: ["eat"], // 用户领取方式 home/首页-优惠券 eat/点餐页-自动弹出 order/订单支付页面
|
||||
giveNum: "", // 总发放数量,-10086为不限量
|
||||
getUserType: "all", // 可领取用户:全部/all,新用户一次/new,仅会员/vip
|
||||
getLimit: "", // 每人领取限量,-10086为不限量
|
||||
useLimit: "", // 每人每日使用限量,-10086为不限量
|
||||
getLimit: 1, // 每人领取限量,-10086为不限量
|
||||
useLimit: -10086, // 每人每日使用限量,-10086为不限量
|
||||
discountShare: 1, // 与限时折扣同享:0-否,1-是
|
||||
vipPriceShare: 1, // 与会员价同享:0-否,1-是
|
||||
ruleDetails: "", // 附加规则说明
|
||||
|
|
@ -587,8 +641,8 @@ const daysToTakeEffectValidate = (rule, value, callback) => {
|
|||
|
||||
// 自定义校验固定有效期范围内可用
|
||||
const useTimeTypeValidate = (rule, value, callback) => {
|
||||
if (form.value.daysToTakeEffect < 0) {
|
||||
callback(new Error("请输入大于等于0的值"));
|
||||
if (!form.value.useStartTime) {
|
||||
callback(new Error("请选择指定可用时间段"));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
|
|
@ -605,7 +659,7 @@ const giveNumValidate = (rule, value, callback) => {
|
|||
|
||||
// 自定义校验每人每日使用限量
|
||||
const useLimitValidate = (rule, value, callback) => {
|
||||
if (form.value.useLimit <= 0 && infiniteUseLimit.value) {
|
||||
if (form.value.useLimit <= 0 && !infiniteUseLimit.value) {
|
||||
callback(new Error("请输入每人每日使用限量"));
|
||||
} else {
|
||||
callback();
|
||||
|
|
@ -748,7 +802,15 @@ function formatCategoryWithProducts(categories, products) {
|
|||
}
|
||||
|
||||
// 显示弹窗
|
||||
const scrollRef = ref(null);
|
||||
function show(t, obj = null) {
|
||||
nextTick(() => {
|
||||
if (scrollRef.value) {
|
||||
setTimeout(() => {
|
||||
scrollRef.value.scrollTop = 0;
|
||||
}, 50);
|
||||
}
|
||||
});
|
||||
let m = titleOptions.couponTypeList.find((item) => item.value == t);
|
||||
if (obj && obj.id) {
|
||||
titleOptions.title = `编辑${m.label}`;
|
||||
|
|
@ -758,6 +820,10 @@ function show(t, obj = null) {
|
|||
form.value.useDays = JSON.parse(form.value.useDays);
|
||||
form.value.useType = JSON.parse(form.value.useType);
|
||||
|
||||
if (!!form.value.syncId) {
|
||||
form.value.useShopType = "only";
|
||||
}
|
||||
|
||||
if (form.value.foods != "") {
|
||||
goodsType.value = 2;
|
||||
goodsTypeCascaderValue.value = form.value.foods.split(",");
|
||||
|
|
@ -787,7 +853,7 @@ function show(t, obj = null) {
|
|||
}
|
||||
|
||||
if (form.value.useLimit == infiniteFlagNum.value) {
|
||||
infiniteUseLimit.value = false;
|
||||
infiniteUseLimit.value = true;
|
||||
}
|
||||
} else {
|
||||
reset();
|
||||
|
|
@ -797,6 +863,11 @@ function show(t, obj = null) {
|
|||
dialogVisible.value = true;
|
||||
}
|
||||
|
||||
// 关闭后重置表单验证
|
||||
function closedReset() {
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
|
||||
/**
|
||||
* 将时分秒字符串转换为完整日期格式
|
||||
* @param {string} timeStr - 时分秒字符串,格式需为 HH:mm:ss(如 '00:53:00')
|
||||
|
|
@ -844,6 +915,93 @@ function convertTimeToDate(timeStr, options = {}) {
|
|||
return dateObj.format(format);
|
||||
}
|
||||
|
||||
// input过滤
|
||||
const time = 500;
|
||||
const discountNumInput = _.debounce(function (value) {
|
||||
form.value.discountNum = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
const discountRateInput = _.debounce(function (value) {
|
||||
form.value.discountRate = filterNumberInput(value, true);
|
||||
if (form.value.discountRate >= 100) {
|
||||
form.value.discountRate = 100;
|
||||
}
|
||||
}, time);
|
||||
|
||||
const validDaysInput = _.debounce(function (value) {
|
||||
form.value.validDays = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
const daysToTakeEffectInput = _.debounce(function (value) {
|
||||
form.value.daysToTakeEffect = filterNumberInput(value, true);
|
||||
if (form.value.daysToTakeEffect === "") {
|
||||
form.value.daysToTakeEffect = 0;
|
||||
}
|
||||
}, time);
|
||||
|
||||
const giveNumInput = _.debounce(function (value) {
|
||||
form.value.giveNum = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
const getLimitInput = _.debounce(function (value) {
|
||||
form.value.getLimit = filterNumberInput(value, true);
|
||||
if (form.value.getLimit == "") {
|
||||
form.value.getLimit = 1;
|
||||
}
|
||||
}, time);
|
||||
|
||||
const useLimitInput = _.debounce(function (value) {
|
||||
form.value.useLimit = filterNumberInput(value, true);
|
||||
if (form.value.useLimit >= form.value.getLimit) {
|
||||
form.value.useLimit = form.value.getLimit;
|
||||
}
|
||||
}, time);
|
||||
|
||||
/**
|
||||
* 过滤输入,只允许数字和最多两位小数
|
||||
* @param {string} value - 输入框当前值
|
||||
* @param {boolean} isIntegerOnly - 是否只允许正整数(无小数点),开启时最小值为1
|
||||
* @returns {string} 过滤后的合法值
|
||||
*/
|
||||
function filterNumberInput(value, isIntegerOnly = false) {
|
||||
// 第一步就过滤所有非数字和非小数点的字符(包括字母)
|
||||
let filtered = value.replace(/[^\d.]/g, "");
|
||||
|
||||
// 整数模式处理
|
||||
if (isIntegerOnly) {
|
||||
// 移除所有小数点
|
||||
filtered = filtered.replace(/\./g, "");
|
||||
|
||||
// 处理前导零
|
||||
filtered = filtered.replace(/^0+(\d)/, "$1") || filtered;
|
||||
|
||||
// 空值处理(允许临时删除)
|
||||
if (filtered === "") {
|
||||
return "";
|
||||
}
|
||||
|
||||
// 最小值限制
|
||||
if (filtered === "0" || parseInt(filtered, 10) < 1) {
|
||||
return "1";
|
||||
}
|
||||
|
||||
return filtered;
|
||||
}
|
||||
|
||||
// 小数模式处理
|
||||
const parts = filtered.split(".");
|
||||
if (parts.length > 1) {
|
||||
filtered = parts[0] + "." + (parts[1].substring(0, 2) || "");
|
||||
}
|
||||
|
||||
// 处理前导零
|
||||
if (filtered.startsWith("0") && filtered.length > 1 && !filtered.startsWith("0.")) {
|
||||
filtered = filtered.replace(/^0+(\d)/, "$1");
|
||||
}
|
||||
|
||||
return filtered;
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
show,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
</el-table-column>
|
||||
<!-- <el-table-column label="描述" prop="id"></el-table-column> -->
|
||||
<el-table-column label="数量" prop="num"></el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<el-table-column label="操作" width="100">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" link @click="linkTo(scope.row)">查看</el-button>
|
||||
<!-- <el-popconfirm
|
||||
|
|
|
|||
|
|
@ -1,6 +1,11 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-dialog v-model="dialogVisible" :title="titleOptions.title" width="80%">
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="titleOptions.title"
|
||||
width="80%"
|
||||
@closed="closedReset"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
|
|
@ -14,6 +19,7 @@
|
|||
placeholder="请输入赠券门槛"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="(e) => (form.fullAmount = filterNumberInput(e))"
|
||||
>
|
||||
<template #prepend>满</template>
|
||||
<template #append>元</template>
|
||||
|
|
@ -38,6 +44,7 @@
|
|||
placeholder="请输入"
|
||||
style="width: 250px"
|
||||
input-style="text-align: center;"
|
||||
@input="couponGiveNumInput"
|
||||
>
|
||||
<template #prepend>每次赠送</template>
|
||||
<template #append>张</template>
|
||||
|
|
@ -66,6 +73,7 @@
|
|||
placeholder="请输入总发放数量"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="giveNumInput"
|
||||
>
|
||||
<template #append>张</template>
|
||||
</el-input>
|
||||
|
|
@ -87,6 +95,7 @@
|
|||
placeholder="请输入每人限量"
|
||||
style="width: 200px"
|
||||
input-style="text-align: center;"
|
||||
@input="getLimitInput"
|
||||
>
|
||||
<template #append>张</template>
|
||||
</el-input>
|
||||
|
|
@ -110,6 +119,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import _ from "lodash";
|
||||
import { ref, onMounted } from "vue";
|
||||
import { addConsumerCoupon, couponPage, updateConsumerCouponById } from "@/api/coupon/index.js";
|
||||
const shopInfo = ref("");
|
||||
|
|
@ -157,6 +167,8 @@ const infiniteGiveNum = ref(true);
|
|||
function infiniteGiveNumChange(e) {
|
||||
if (!e) {
|
||||
form.value.giveNum = infiniteFlagNum.value;
|
||||
} else {
|
||||
form.value.giveNum = "";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -165,6 +177,8 @@ const infiniteUseLimit = ref(true);
|
|||
function infiniteUseLimitChange(e) {
|
||||
if (!e) {
|
||||
form.value.getLimit = infiniteFlagNum.value;
|
||||
} else {
|
||||
form.value.getLimit = "";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -308,6 +322,11 @@ function show(t, obj = null) {
|
|||
dialogVisible.value = true;
|
||||
}
|
||||
|
||||
// 关闭后重置表单验证
|
||||
function closedReset() {
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
|
||||
// 获取优惠券列表
|
||||
async function couponPageAjax() {
|
||||
try {
|
||||
|
|
@ -331,6 +350,65 @@ onMounted(() => {
|
|||
couponPageAjax();
|
||||
});
|
||||
|
||||
/**
|
||||
* 过滤输入,只允许数字和最多两位小数
|
||||
* @param {string} value - 输入框当前值
|
||||
* @param {boolean} isIntegerOnly - 是否只允许正整数(无小数点),开启时最小值为1
|
||||
* @returns {string} 过滤后的合法值
|
||||
*/
|
||||
function filterNumberInput(value, isIntegerOnly = false) {
|
||||
// 第一步就过滤所有非数字和非小数点的字符(包括字母)
|
||||
let filtered = value.replace(/[^\d.]/g, "");
|
||||
|
||||
// 整数模式处理
|
||||
if (isIntegerOnly) {
|
||||
// 移除所有小数点
|
||||
filtered = filtered.replace(/\./g, "");
|
||||
|
||||
// 处理前导零
|
||||
filtered = filtered.replace(/^0+(\d)/, "$1") || filtered;
|
||||
|
||||
// 空值处理(允许临时删除)
|
||||
if (filtered === "") {
|
||||
return "";
|
||||
}
|
||||
|
||||
// 最小值限制
|
||||
if (filtered === "0" || parseInt(filtered, 10) < 1) {
|
||||
return "1";
|
||||
}
|
||||
|
||||
return filtered;
|
||||
}
|
||||
|
||||
// 小数模式处理
|
||||
const parts = filtered.split(".");
|
||||
if (parts.length > 1) {
|
||||
filtered = parts[0] + "." + (parts[1].substring(0, 2) || "");
|
||||
}
|
||||
|
||||
// 处理前导零
|
||||
if (filtered.startsWith("0") && filtered.length > 1 && !filtered.startsWith("0.")) {
|
||||
filtered = filtered.replace(/^0+(\d)/, "$1");
|
||||
}
|
||||
|
||||
return filtered;
|
||||
}
|
||||
|
||||
// input过滤
|
||||
const time = 500;
|
||||
const couponGiveNumInput = _.debounce(function (value) {
|
||||
couponGiveNum.value = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
const giveNumInput = _.debounce(function (value) {
|
||||
form.value.giveNum = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
const getLimitInput = _.debounce(function (value) {
|
||||
form.value.getLimit = filterNumberInput(value, true);
|
||||
}, time);
|
||||
|
||||
defineExpose({
|
||||
show,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -31,7 +31,12 @@
|
|||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="giveNum" label="总发放数量" width="100" />
|
||||
<el-table-column prop="giveNum" label="总发放数量" width="100">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.giveNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="giftNum" label="已领取" width="180">
|
||||
<template #default="scope">
|
||||
<div class="center">
|
||||
|
|
@ -47,7 +52,12 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="useNum" label="已使用" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.leftNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="已关联功能" width="180">
|
||||
<template #default="scope">
|
||||
<el-link type="primary" @click="RelevanceDialogRef.show(scope.row)">
|
||||
|
|
@ -61,7 +71,7 @@
|
|||
v-model="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
:disabled="scope.row.syncId"
|
||||
:disabled="!!scope.row.syncId"
|
||||
@change="statusChange($event, scope.row)"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -75,6 +85,7 @@
|
|||
fixed="right"
|
||||
>
|
||||
<template #default="scope">
|
||||
<template v-if="!scope.row.syncId">
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
|
|
@ -85,13 +96,22 @@
|
|||
<el-popconfirm
|
||||
title="确认要删除吗?"
|
||||
@confirm="deleteHandle(scope.row)"
|
||||
v-if="!scope.row.syncId"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
<el-button type="danger link" v-else>删除</el-button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="danger" disabled link>删除</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
|
|
|||
|
|
@ -70,14 +70,21 @@
|
|||
v-model="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
:disabled="scope.row.syncId"
|
||||
:disabled="!!scope.row.syncId"
|
||||
@change="statusChange($event, scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" label="创建时间" width="180" />
|
||||
<el-table-column prop="actions" label="操作" align="center" width="140" fixed="right">
|
||||
<el-table-column
|
||||
prop="actions"
|
||||
label="操作"
|
||||
align="center"
|
||||
width="140"
|
||||
fixed="right"
|
||||
>
|
||||
<template #default="scope">
|
||||
<template v-if="!scope.row.syncId">
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
|
|
@ -94,6 +101,17 @@
|
|||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="danger" disabled link>删除</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -45,7 +45,12 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="useNum" label="已使用" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.leftNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="已关联功能" width="180">
|
||||
<template #default="scope">
|
||||
<el-link type="primary" @click="RelevanceDialogRef.show(scope.row)">
|
||||
|
|
@ -59,7 +64,7 @@
|
|||
v-model="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
:disabled="scope.row.syncId"
|
||||
:disabled="!!scope.row.syncId"
|
||||
@change="statusChange($event, scope.row)"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -73,6 +78,7 @@
|
|||
fixed="right"
|
||||
>
|
||||
<template #default="scope">
|
||||
<template v-if="!scope.row.syncId">
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
|
|
@ -89,6 +95,17 @@
|
|||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="danger" disabled link>删除</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
label="最大折扣金额"
|
||||
width="180"
|
||||
/>
|
||||
<el-table-column prop="validStartTime" label="有效期" width="200" >
|
||||
<el-table-column prop="validStartTime" label="有效期" width="200">
|
||||
<template #default="scope">
|
||||
<div v-if="scope.row.validType == 'fixed'">
|
||||
{{ scope.row.validDays }}天
|
||||
|
|
@ -31,7 +31,12 @@
|
|||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="giveNum" label="总发放数量" width="100" />
|
||||
<el-table-column prop="giveNum" label="总发放数量" width="100">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.giveNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="giftNum" label="已领取" width="180">
|
||||
<template #default="scope">
|
||||
<div class="center">
|
||||
|
|
@ -47,7 +52,12 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="useNum" label="已使用" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180" />
|
||||
<el-table-column prop="leftNum" label="剩余" width="180">
|
||||
<template #default="scope">
|
||||
<template v-if="scope.row.giveNum == -10086">无限</template>
|
||||
<template v-else>{{ scope.row.leftNum }}</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="" label="已关联功能" width="180">
|
||||
<template #default="scope">
|
||||
<el-link type="primary" @click="RelevanceDialogRef.show(scope.row)">
|
||||
|
|
@ -61,11 +71,12 @@
|
|||
v-model="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
:disabled="scope.row.syncId"
|
||||
:disabled="!!scope.row.syncId"
|
||||
@change="statusChange($event, scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="createTime" label="创建时间" width="180" />
|
||||
<el-table-column
|
||||
prop="actions"
|
||||
label="操作"
|
||||
|
|
@ -74,9 +85,9 @@
|
|||
fixed="right"
|
||||
>
|
||||
<template #default="scope">
|
||||
<template v-if="!scope.row.syncId">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
|
|
@ -87,10 +98,21 @@
|
|||
@confirm="deleteHandle(scope.row)"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button type="danger" link size="small">删除</el-button>
|
||||
<el-button type="danger" link>删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-button
|
||||
type="primary"
|
||||
link
|
||||
@click="CouponDialogRef.show(couponType, scope.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
<el-button type="danger" disabled link>删除</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue