net/emoticon_xcx_back
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat 添加优惠券管理

Browse Source
This commit is contained in:
lwh 2023-07-29 20:10:04 +08:00
parent ad2e099b1d
commit 4a77470025
5 changed files with 160 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/views/business/Marketing/CouponManage/Coupons/components/AddDialog.vue
View File

@ -222,7 +222,8 @@ const formData = reactive({
couponSort: 100,
couponSendNumber: -1,
couponApplicableScopeConfig: [],
couponGoodsIds: []
couponGoodsIds: [],
couponFixedTime: []
});
const props = defineProps({
modelValue: Boolean,
@ -261,6 +262,10 @@ const handleAddClick = async (formEl) => {
if (formData.couponApplicableScopeConfig) {
formData.couponApplicableScopeConfig = JSON.stringify(formData.couponApplicableScopeConfig)
}
if(formData.couponFixedTime.length != 0){
formData.couponFixedStartTime = formData.couponFixedTime[0]
formData.couponFixedEndTime = formData.couponFixedTime[1]
}
const { code } = await addOrUpdateCoupon(formData);
if (code == 200) {

224
src/views/business/Marketing/CouponManage/Coupons/components/DetailDialog.vue
View File

@ -6,118 +6,124 @@
* @LastEditors: (lwh)
* @LastEditTime: (2023-07-24)
-->
<template>
<template>
<el-dialog v-model="props.modelValue" title="优惠券信息详情" width="900px" @closed="closeDialog" @open="openDialog">
<el-form ref="formRef" :model="formData" :disabled="true">
<el-form ref="formRef" :model="formData" :rules="rules" disabled>
<el-row :gutter="20">
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="优惠劵名称" prop="couponName">
<el-input v-model="formData.couponName" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :lg="24">
<el-form-item :label-width="labelWidth" label="优惠劵类型" prop="couponType">
<el-radio-group v-model="formData.couponType">
<el-radio v-for="item in coupon_type " :key="item.dictValue" :label="parseInt(item.dictValue)">{{
item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12" v-if="formData.couponType == 1">
<el-form-item :label-width="labelWidth" label="减免金额" prop="couponDeductionMoney">
<el-input-number v-model.number="formData.couponDeductionMoney" controls-position="right" :min="0"
precision="2" />
<span class="number-unit">元</span>
</el-form-item>
</el-col>
<el-col :lg="12" v-if="formData.couponType == 2">
<el-form-item :label-width="labelWidth" label="折扣率" prop="couponDiscountRate">
<el-input-number v-model.number="formData.couponDiscountRate" controls-position="right" :min="0"
precision="2" />
<span class="number-unit">%</span>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="最低消费金额" prop="couponMinConsumeMoney">
<el-input-number v-model.number="formData.couponMinConsumeMoney" controls-position="right" :min="0"
precision="2" />
<span class="number-unit">元</span>
</el-form-item>
</el-col>
<el-col :lg="24">
<el-form-item :label-width="labelWidth" label="到期类型" prop="couponExpireType">
<el-radio-group v-model="formData.couponExpireType">
<el-radio v-for="item in coupon_expire_type " :key="item.dictValue" :label="parseInt(item.dictValue)">{{
item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12" v-if="formData.couponExpireType == 1">
<el-form-item :label-width="labelWidth" label="有效天数" prop="couponEffectiveDays">
<el-input-number v-model.number="formData.couponEffectiveDays" controls-position="right" :min="0" />
<span class="number-unit">天</span>
</el-form-item>
</el-col>
<el-col :lg="12" v-if="formData.couponExpireType == 2">
<el-form-item :label-width="labelWidth" label="" prop="couponFixedStartTime">
<!-- <el-date-picker v-model="formData.couponFixedStartTime" type="datetime" :teleported="false"
></el-date-picker> -->
<el-date-picker v-model="formData.couponFixedTime" type="daterange" range-separator="-"
start end />
</el-form-item>
</el-col>
<el-col :lg="24">
<el-form-item :label-width="labelWidth" label="适用范围" prop="couponApplicableScope">
<el-radio-group v-model="formData.couponApplicableScope">
<el-radio v-for="item in applicable_scope " :key="item.dictValue" :label="parseInt(item.dictValue)">{{
item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="24" v-if="formData.couponApplicableScope == 2">
<el-form-item :label-width="labelWidth" label="" prop="">
<el-button type="primary" plain @click="handleChooseGoods">+ 指定商品</el-button>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="优惠劵名称" >
<el-input v-model="formData.couponName" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="优惠劵类型" >
<el-radio-group v-model="formData.couponType">
<el-radio v-for="item in coupon_type " :key="item.dictValue" :label="parseInt(item.dictValue)">{{item.dictLabel}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="减免金额" >
<el-input-number v-model.number="formData.couponDeductionMoney" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="折扣率" >
<el-input-number v-model.number="formData.couponDiscountRate" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="最低消费金额" >
<el-input-number v-model.number="formData.couponMinConsumeMoney" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="到期类型" >
<el-radio-group v-model="formData.couponExpireType">
<el-radio v-for="item in coupon_expire_type " :key="item.dictValue" :label="parseInt(item.dictValue)">{{item.dictLabel}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="有效天数" >
<el-input-number v-model.number="formData.couponEffectiveDays" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="固定时间-开始时间" >
<el-date-picker v-model="formData.couponFixedStartTime" type="datetime" :teleported="false" isabledStr}></el-date-picker>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="固定时间-结束时间" >
<el-date-picker v-model="formData.couponFixedEndTime" type="datetime" :teleported="false" isabledStr}></el-date-picker>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="适用范围" >
<el-radio-group v-model="formData.couponApplicableScope">
<el-radio v-for="item in applicable_scope " :key="item.dictValue" :label="parseInt(item.dictValue)">{{item.dictLabel}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="适用范围配置(json)" >
<el-input v-model="formData.couponApplicableScopeConfig" :disabled="true"/>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="发送数量(-1不限制)" >
<el-input-number v-model.number="formData.couponSendNumber" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="已领取数量" >
<el-input-number v-model.number="formData.couponGetNumber" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="显示状态" >
<el-radio-group v-model="formData.couponDisplayStatus">
<el-radio v-for="item in display_status " :key="item.dictValue" :label="parseInt(item.dictValue)">{{item.dictLabel}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="排序" >
<el-input-number v-model.number="formData.couponSort" controls-position="right" :precision="2" />
</el-form-item>
</el-col>
<el-table v-if="formData.couponApplicableScopeConfig.length != 0" v-loading="loading"
:data="formData.couponApplicableScopeConfig" ref="tableRef" border highlight-current-row>
<el-table-column prop="goodsPicture" width="150" label="图片" align="center">
<template #default="scope">
<el-image preview-teleported :hide-on-click-modal="true" lazy class="table-td-thumb" fit="contain"
:src="scope.row.goodsPicture?.split(',')[0]" :preview-src-list="scope.row.goodsPicture?.split(',')">
<div><el-icon :size="15">
<document />
</el-icon></div>
</el-image>
</template>
</el-table-column>
<el-table-column prop="goodsName" width="400" label="商品名称" align="left" :show-overflow-tooltip="true" />
<el-table-column prop="goodsPriceLowest" label="价格" align="center" />
<el-table-column prop="goodsTotalInventory" label="库存总量" align="center" />
</el-table>
</el-form-item>
</el-col>
<el-col :lg="24">
<el-form-item :label-width="labelWidth" label="发送数量" prop="couponSendNumber">
<div style="display: block;">
<el-input-number v-model.number="formData.couponSendNumber" controls-position="right" :min="-1" />
<div class="input-intro">(-1不限制)</div>
</div>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="显示状态" prop="couponDisplayStatus">
<el-radio-group v-model="formData.couponDisplayStatus">
<el-radio v-for="item in display_status " :key="item.dictValue" :label="parseInt(item.dictValue)">{{
item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item :label-width="labelWidth" label="排序" prop="couponSort">
<el-input-number v-model.number="formData.couponSort" controls-position="right" :min="0" />
</el-form-item>
</el-col>
</el-row>
</el-form>
@ -131,10 +137,10 @@ import { reactive, ref, watch } from "vue";
// 打开弹窗时回调
const openDialog = async () => {
await getcoupon_type()
await getcoupon_expire_type()
await getapplicable_scope()
await getdisplay_status()
await getcoupon_type()
await getcoupon_expire_type()
await getapplicable_scope()
await getdisplay_status()
}

15
src/views/business/Marketing/CouponManage/Coupons/components/EditDialog.vue
View File

@ -84,12 +84,9 @@
<el-col :lg="24" v-if="formData.couponApplicableScope == 2">
<el-form-item :label-width="labelWidth" label="" prop="">
<el-button type="primary" plain @click="handleChooseGoods">+ 指定商品</el-button>
</el-form-item>
</el-col>
<el-col :lg="24" v-if="formData.couponApplicableScopeConfig.length != 0">
<el-form-item :label-width="labelWidth" label="" prop="">
<el-table v-loading="loading" :data="formData.couponApplicableScopeConfig" ref="tableRef" border
highlight-current-row>
<el-table v-if="formData.couponApplicableScopeConfig.length != 0" v-loading="loading"
:data="formData.couponApplicableScopeConfig" ref="tableRef" border highlight-current-row>
<el-table-column prop="goodsPicture" width="150" label="图片" align="center">
<template #default="scope">
<el-image preview-teleported :hide-on-click-modal="true" lazy class="table-td-thumb" fit="contain"
@ -211,7 +208,7 @@ async function getdisplay_status() {
// 打开选择商品弹窗
const handleChooseGoods = () => {
ChooseGoodsDialogVisible.value = true
ChooseGoodsDialogRow.value = formData
ChooseGoodsDialogRow.value = formData.value
}
@ -260,6 +257,10 @@ const handleEditClick = async (formEl) => {
if (formData.value.couponApplicableScopeConfig) {
formData.value.couponApplicableScopeConfig = JSON.stringify(formData.value.couponApplicableScopeConfig)
}
if(formData.value.couponFixedTime.length != 0){
formData.value.couponFixedStartTime = formData.value.couponFixedTime[0]
formData.value.couponFixedEndTime = formData.value.couponFixedTime[1]
}
const { code } = await addOrUpdateCoupon(formData.value);
if (code == 200) {

21
src/views/business/Marketing/CouponManage/Coupons/index.vue
View File

@ -48,7 +48,7 @@
{{ $t('btn.delete') }}
</el-button>
</el-col>
<el-col :span="1.5">
<!-- <el-col :span="1.5">
<el-button type="primary" plain icon="Upload" @click="UploadDialogVisible = true"
v-hasPermi="['business:coupon:import']">导入</el-button>
</el-col>
@ -56,7 +56,7 @@
<el-button type="warning" plain icon="download" @click="handleExport" v-hasPermi="['business:coupon:export']">
{{ $t('btn.export') }}
</el-button>
</el-col>
</el-col> -->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -200,11 +200,20 @@ function getList() {
dataList.value = res.data.result;
total.value = res.data.totalNum;
dataList.forEach(item => {
item.couponGoodsIds = item.couponGoodsIds.split(',')
item.couponApplicableScopeConfig = JSON.parse(item.couponApplicableScopeConfig)
dataList.value.forEach(item => {
if(item.couponGoodsIdsArr.length !=- 0){
item.couponGoodsIds = item.couponGoodsIdsArr.split(',')
}
if(item.couponApplicableScopeConfig){
item.couponApplicableScopeConfig = JSON.parse(item.couponApplicableScopeConfig)
}
if(item.couponFixedStartTime && item.couponFixedEndTime){
item.couponFixedTime = []
item.couponFixedTime.push(item.couponFixedStartTime)
item.couponFixedTime.push(item.couponFixedEndTime)
// console.log(item.couponFixedTime,'列表的捏');
}
});
console.log(dataList.value,'列表的捏');
}
});
}

20
src/views/business/components/ChooseMultipleGoodsDialog.vue
View File

@ -14,7 +14,7 @@
<!-- 表格渲染 prop="对应的字段"-->
<el-table v-loading="loading" :data="goodssList" ref="tableRef" border highlight-current-row
@row-click="handleRowClick" @selection-change="handleSelectionChange">
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center" />
<el-table-column prop="goodsPicture" width="150" label="图片" align="center">
<template #default="scope">
@ -77,8 +77,6 @@ const formData = ref({
const goodssList = ref([]);
// 打开窗口时运行
const openDialog = async () => {
await getgoodsListFun()
}
@ -93,8 +91,18 @@ const getgoodsListFun = async () => {
if (res.code == 200) {
goodssList.value = res.data
loading.value = false
}
})
// 勾选已选中的
goodssList.value.forEach(item => {
props.data.couponApplicableScopeConfig.forEach(e => {
if (item.goodsId === e.goodsId) {
tableRef.value.toggleRowSelection(item);
}
});
});
}
watch(props, (v) => {
@ -111,8 +119,8 @@ function handleSelectionChange(selection) {
ids.value = selection.map((item) => item.goodsId)
goodsTableData.value = selection.map((item) => item)
console.log(ids.value,"商品的ids");
console.log(goodsTableData.value,"商品的表单列表");
// console.log(ids.value,"商品的ids");
// console.log(goodsTableData.value,"商品的表单列表");
}
const closeDialog = () => {
@ -128,7 +136,7 @@ const handleEditClick = async () => {
formData.value.couponApplicableScopeConfig = goodsTableData.value
formData.value.couponGoodsIds = ids.value
console.log(formData.value,'外面的表单');
console.log(formData.value, '外面的表单');
if (formData.value.couponApplicableScopeConfig.length != 0) {
// props.done();
closeDialog();