czg_team/cashier-web
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add: 增加新功能

Browse Source
This commit is contained in:
gyq
2025-10-17 11:28:41 +08:00
parent 0405a0fb99
commit 44482d9dc9
30 changed files with 4695 additions and 507 deletions
Download Patch File Download Diff File Expand all files Collapse all files

127
src/views/marketing_center/cashback/index.vue
View File

@@ -6,15 +6,15 @@
<div style="padding-top: 14px;">
<el-tabs v-model="tabsValue">
<el-tab-pane label="基础明细" :name="1">
<el-form :model="form" :rules="rules" label-position="left" label-width="100px">
<el-form ref="formRef" :model="form" :rules="rules" label-position="left" label-width="100px">
<el-form-item label="可用门店">
<el-radio-group v-model="form.useType">
<el-radio label="全部门店" value="all"></el-radio>
<el-radio label="指定门店可用" value="part"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="选择门店" v-if="form.shopType == 'part'">
<selectBranchs ref="selectBranchsRef" @success="successShop" />
<el-form-item label="选择门店" prop="shopIdList" v-if="form.useType == 'part'">
<selectBranchs v-model="form.shopIdList" />
</el-form-item>
<el-form-item label="适用用户">
<el-radio-group v-model="form.applicableUser">
@@ -29,26 +29,28 @@
<el-radio label="固定金额" value="fix"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="阶梯设置" prop="">
<el-form-item label="阶梯设置" prop="stepValidate">
<div class="row">
<div class="item border" v-for="(item, index) in callbackList" :key="index">
<div class="item border" v-for="(item, index) in form.cashbackStepList" :key="index">
<div class="row_title">
<span>{{ `第${index + 1}组` }}</span>
<el-icon @click="callbackList.splice(index, 1)">
<el-icon @click="form.cashbackStepList.splice(index, 1)">
<Delete />
</el-icon>
</div>
<div class="ipt">
<div class="ipt_row">
<span>返现门槛</span>
<el-input placeholder="请输入返现门槛" v-model="item.amount">
<el-input placeholder="请输入返现门槛" :maxlength="8" v-model="item.amount"
@input="e => item.amount = filterNumberInput(e)">
<template #append>元</template>
</el-input>
</div>
<div class="ipt_row">
<span>{{ form.cashbackType == 'percentage' ? '返现比例' : '返现金额' }}</span>
<el-input :placeholder="form.cashbackType == 'percentage' ? '请输入返现比例' : '请输入返现金额'"
v-model="item.cashbackAmount">
<el-input :maxlength="8"
:placeholder="form.cashbackType == 'percentage' ? '请输入返现比例' : '请输入返现金额'"
v-model="item.cashbackAmount" @input="e => item.cashbackAmount = filterNumberInput(e)">
<template #append>
{{ form.cashbackType == 'percentage' ? '%' : '元' }}
</template>
@@ -56,19 +58,19 @@
</div>
</div>
</div>
<div class="item">
<div class="item" v-if="shopInfo.isHeadShop == 1 && shopInfo.shopType != 'only'">
<el-button type="primary" @click="addCashBackItem">添加阶梯</el-button>
</div>
</div>
</el-form-item>
<el-form-item>
<el-button type="primary">保存</el-button>
<el-button>取消</el-button>
<el-form-item style="margin-top: 50px;" v-if="shopInfo.isHeadShop == 1 && shopInfo.shopType != 'only'">
<el-button type="primary" @click="submitHandle">保存</el-button>
<el-button @click="router.back()">取消</el-button>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="返现明细" :name="2">
<div>312321</div>
<record />
</el-tab-pane>
</el-tabs>
</div>
@@ -78,12 +80,17 @@
<script setup>
import HeaderCard from "../components/headerCard.vue";
import record from "./record.vue";
import selectBranchs from "../components/selectBranchs.vue";
import { ref } from 'vue'
import { ref, onMounted } from 'vue'
import { useRouter } from "vue-router";
import { consumeCashback, consumeCashbackPost } from '@/api/coupon/index.js'
import { filterNumberInput } from '@/utils'
const selectBranchsRef = ref(null)
const router = useRouter();
const tabsValue = ref(1)
const formRef = ref(null)
const shopInfo = ref(JSON.parse(localStorage.getItem('userInfo')))
const form = ref({
useType: 'all', // all 全部可用 part部分门店可用
shopIdList: [], // 门店列表
@@ -94,23 +101,88 @@ const form = ref({
})
const rules = ref({
shopIdList: [
{
required: true,
validator: (rule, value, callback) => {
if (form.value.shopIdList.length <= 0) {
callback(new Error('请选择门店'))
} else {
callback()
}
},
trigger: 'change'
}
],
stepValidate: [
{
required: true,
validator: (rule, value, callback) => {
if (form.value.cashbackStepList.length <= 0) {
callback(new Error('请添加阶梯'))
return
}
let flag = true;
form.value.cashbackStepList.map(item => {
if (!item.amount || !item.cashbackAmount || item.cashbackAmount > item.amount) {
flag = false
}
})
if (!flag) {
callback(new Error('输入有误，请检查返现金额是不是大于返现门槛'))
} else {
callback()
}
},
trigger: 'change'
}
]
})
// 已选泽的店铺
function successShop(e) {
console.log('successShop===', e);
form.value.shops = e
}
// 添加返现阶梯
const callbackList = ref([])
function addCashBackItem() {
callbackList.value.push({
form.value.cashbackStepList.push({
amount: '',
cashbackAmount: ''
})
}
// 提交保存
function submitHandle() {
formRef.value.validate(async (valid) => {
try {
if (valid) {
await consumeCashbackPost(form.value);
ElNotification({
title: "注意",
message: "保存成功",
type: "success",
});
}
} catch (err) {
console.log(err);
}
});
}
// 配置信息获取
async function consumeCashbackAjax() {
try {
const res = await consumeCashback()
if (res.cashbackStepList == null) {
res.cashbackStepList = []
}
form.value = res
} catch (error) {
console.log(error);
}
}
onMounted(() => {
consumeCashbackAjax()
})
</script>
<style scoped lang="scss">
@@ -126,9 +198,12 @@ function addCashBackItem() {
.row {
.item {
margin-bottom: 24px;
position: relative;
&:not(:first-child) {
margin-top: 16px;
}
.row_title {
position: absolute;
top: 0;