907 lines
28 KiB
Vue
907 lines
28 KiB
Vue
<template>
|
||
<!-- Modal -->
|
||
<a-modal
|
||
v-model:visible="modalVisible"
|
||
fullscreen
|
||
:title="modalForm.coupon_id ? '编辑优惠劵' : '创建优惠劵'"
|
||
title-align="start"
|
||
:auto-label-width="true"
|
||
:footer="false"
|
||
@cancel="handleClose"
|
||
>
|
||
<div class="titlebox">
|
||
<div class="bar"></div>
|
||
<div class="name">优惠劵信息</div>
|
||
</div>
|
||
<a-form
|
||
:model="modalForm"
|
||
ref="modalFormRef"
|
||
:auto-label-width="true"
|
||
:rules="rules"
|
||
>
|
||
<a-row :gutter="24" style="margin-top: 35px">
|
||
<a-col :span="12">
|
||
<a-form-item field="coupon_name" label="优惠劵名称:">
|
||
<a-input
|
||
placeholder="请输入优惠劵名称"
|
||
v-model="modalForm.coupon_name"
|
||
></a-input>
|
||
</a-form-item>
|
||
</a-col>
|
||
<a-col :span="12">
|
||
<a-form-item field="coupon_client" label="使用平台:">
|
||
<a-select
|
||
:disabled="modalForm.coupon_id?true:false"
|
||
placeholder="请选择使用平台"
|
||
v-model="modalForm.coupon_client"
|
||
>
|
||
<a-option :key="1" :value="1" label="小程序">小程序</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col :span="12">
|
||
<a-form-item field="application_scope" label="使用范围:">
|
||
<a-select
|
||
:disabled="modalForm.coupon_id?true:false"
|
||
@change="changeScope"
|
||
placeholder="请选择使用范围"
|
||
v-model="modalForm.application_scope"
|
||
>
|
||
<!-- 1:全场通用 2:问诊 3:按品牌适用 4:按类别适用 5:单品使用 6:全品类药品 -->
|
||
<a-option :key="1" :value="1" label="全场通用">全场通用</a-option>
|
||
<a-option :key="2" :value="2" label="问诊">问诊</a-option>
|
||
<a-option :key="3" :value="3" label="按品牌适用"
|
||
>按品牌适用</a-option
|
||
>
|
||
<a-option :key="4" :value="4" label="按类别适用"
|
||
>按类别适用</a-option
|
||
>
|
||
<a-option :key="5" :value="5" label="单品使用">单品使用</a-option>
|
||
<a-option :key="6" :value="6" label="全品类药品"
|
||
>全品类药品</a-option
|
||
>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
<a-col :span="12">
|
||
<a-form-item field="coupon_type" label="发放类型:">
|
||
<a-select
|
||
:disabled="modalForm.coupon_id ? true: false"
|
||
placeholder="请选择发放类型"
|
||
v-model="modalForm.coupon_type"
|
||
@change="changeType"
|
||
>
|
||
<!-- 1 :无门槛 2:满减 3:数量 -->
|
||
<a-option :key="1" :value="1" label="无门槛">无门槛</a-option>
|
||
<a-option :key="2" :value="2" label="满减">满减</a-option>
|
||
<a-option :key="3" :value="3" label="数量">数量</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col :span="12">
|
||
<a-form-item field="distribution_object" label="发放对象:">
|
||
<a-select
|
||
placeholder="请选择发放对象"
|
||
v-model="modalForm.distribution_object"
|
||
@change="changeObject"
|
||
>
|
||
<!-- 1:全部用户 2:新注册用户 3:会员 4:近期消费 5:近期购药 6:存量用户 7:健康包服务用户 -->
|
||
<a-option :key="1" :value="1" label="全部用户">全部用户</a-option>
|
||
<a-option :key="2" :value="2" label="新注册用户"
|
||
>新注册用户</a-option
|
||
>
|
||
<a-option :key="3" :value="3" label="会员">会员</a-option>
|
||
<a-option :key="4" :value="4" label="近期消费">近期消费</a-option>
|
||
<a-option :key="5" :value="5" label="近期购药">近期购药</a-option>
|
||
<a-option :key="6" :value="6" label="存量用户">存量用户</a-option>
|
||
<a-option :key="7" :value="7" label="健康包服务用户"
|
||
>健康包服务用户</a-option
|
||
>
|
||
<a-option :key="8" :value="8" label="app用户">app用户</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
<a-col :span="12">
|
||
<a-form-item field="valid_type" label="有效类型:">
|
||
<a-select
|
||
:disabled="modalForm.coupon_id ? true: false"
|
||
placeholder="请选择有效类型"
|
||
v-model="modalForm.valid_type"
|
||
@change="changeValidType"
|
||
>
|
||
<!-- 有效类型(1:绝对时效,xxx-xxx时间段有效 2:相对时效 n天内有效) -->
|
||
<a-option :key="1" :value="1" label="绝对时效">绝对时效</a-option>
|
||
<a-option :key="2" :value="2" label="相对时效">相对时效</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showConnectType">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="inquiry_type" label="问诊类型:">
|
||
<a-select
|
||
:style="{ width: '320px' }"
|
||
multiple
|
||
placeholder="请选择问诊类型"
|
||
v-model="modalForm.inquiry_type"
|
||
>
|
||
<!-- 1:'专家问诊', 2:'快速问诊', 3:'公益问诊', 4:'问诊购药',5:'糖组检测') -->
|
||
<a-option key="1" value="1" label="专家问诊">专家问诊</a-option>
|
||
<a-option key="2" value="2" label="快速问诊">快速问诊</a-option>
|
||
<a-option key="3" value="3" label="公益问诊">公益问诊</a-option>
|
||
<a-option key="4" value="4" label="问诊购药">问诊购药</a-option>
|
||
<a-option key="5" value="5" label="糖组检测">糖组检测</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="coupon_count" label="发放数量:">
|
||
<a-input-number
|
||
v-model="modalForm.coupon_count"
|
||
:style="{ width: '320px' }"
|
||
:step="1"
|
||
:precision="0"
|
||
placeholder="请输入发放数量"
|
||
class="input-demo"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="modalForm.coupon_id">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="coupon_count" label="已发放数量:">
|
||
<a-input-number
|
||
disabled
|
||
v-model="modalForm.coupon_take_count"
|
||
:style="{ width: '320px' }"
|
||
:step="1"
|
||
:precision="0"
|
||
placeholder="请输入已发放数量"
|
||
class="input-demo"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="modalForm.coupon_id">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="coupon_count" label="已领取数量:">
|
||
<a-input-number
|
||
disabled
|
||
v-model="modalForm.coupon_used_count"
|
||
:style="{ width: '320px' }"
|
||
:step="1"
|
||
:precision="0"
|
||
placeholder="请输入已已领取数量"
|
||
class="input-demo"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="coupon_price" label="优惠劵金额:">
|
||
<a-input-number
|
||
v-model="modalForm.coupon_price"
|
||
:style="{ width: '320px' }"
|
||
placeholder="请输入优惠劵金额"
|
||
class="input-demo"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showTimeRange">
|
||
<a-col :span="12">
|
||
<a-form-item
|
||
field="valid_start_time"
|
||
:validate-trigger="['input']"
|
||
label="有效时间:"
|
||
:rules="[{ required: true, message: '请选择有效时间' }]"
|
||
>
|
||
<a-range-picker
|
||
v-model="rangeValue"
|
||
style="width: 360px"
|
||
show-time
|
||
:defaultValue="defaultValue"
|
||
:disabled-date="disabledDate"
|
||
format="YYYY-MM-DD HH:mm"
|
||
value-format="YYYY-MM-DD HH:mm"
|
||
@ok="onOk"
|
||
@clear="clearDate"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showValidDay">
|
||
<a-col a-col :span="24">
|
||
<a-form-item
|
||
:disabled="modalForm.coupon_id?true:false"
|
||
field="valid_days"
|
||
label="领取之日起有效天数:"
|
||
:validate-trigger="['blur']"
|
||
:rules="[{ required: true, message: '请输入领取之日起有效天数' }]"
|
||
>
|
||
<a-input-number
|
||
v-model="modalForm.valid_days"
|
||
:style="{ width: '320px' }"
|
||
placeholder="请输入有效天数"
|
||
:step="1"
|
||
:precision="0"
|
||
class="input-demo"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showManjian">
|
||
<a-col a-col :span="24">
|
||
<a-form-item
|
||
field="with_amount"
|
||
label="满减金额(元):"
|
||
:rules="[{ required: true, message: '请输入满减金额' }]"
|
||
>
|
||
<a-input-number
|
||
v-model="modalForm.with_amount"
|
||
:style="{ width: '320px' }"
|
||
placeholder="请输入满减金额"
|
||
class="input-demo"
|
||
:min="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showMinNumber">
|
||
<a-col a-col :span="24">
|
||
<a-form-item
|
||
field="min_usable_number"
|
||
label="单商品最小可使用数量:"
|
||
:rules="[{ required: true, message: '请输入单商品最小可使用数量' }]"
|
||
>
|
||
<a-input-number
|
||
v-model="modalForm.min_usable_number"
|
||
:style="{ width: '320px' }"
|
||
placeholder="请输入单商品最小可使用数量"
|
||
class="input-demo"
|
||
:min="1"
|
||
:step="1"
|
||
:precision="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="showDistributionDay">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="distribution_with_day" label="发放关联天数:">
|
||
<a-input-number
|
||
v-model="modalForm.distribution_with_day"
|
||
:style="{ width: '320px' }"
|
||
placeholder="请输入发放关联天数"
|
||
class="input-demo"
|
||
:step="1"
|
||
:precision="0"
|
||
:min="1"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<!-- <a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="brand_id" label="关联品牌:">
|
||
<a-input-number v-model="modalForm.brand_id" :style="{width:'320px'}" placeholder="请选择关联品牌" class="input-demo" :min="1" />
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row> -->
|
||
<a-row :gutter="24" v-if="showProduct">
|
||
<a-col a-col :span="12">
|
||
<a-form-item
|
||
field="product_id"
|
||
label="关联商品:"
|
||
:rules="[{ required: true, message: '请选择关联商品' }]"
|
||
>
|
||
<a-select
|
||
multiple
|
||
v-model="modalForm.product_id"
|
||
placeholder="请选择关联商品"
|
||
allow-search
|
||
:loading="loading"
|
||
@search="handleGetProduct"
|
||
>
|
||
<a-option
|
||
v-for="item in productList"
|
||
:key="item.product_id"
|
||
:value="item.product_id"
|
||
:label="item.product_name"
|
||
>
|
||
{{ item.product_name }}
|
||
</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="is_display" label="是否展示:">
|
||
<a-switch
|
||
v-model="modalForm.is_display"
|
||
:checked-value="1"
|
||
:unchecked-value="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="is_mutex" label="是否互斥:">
|
||
<a-switch
|
||
v-model="modalForm.is_mutex"
|
||
:checked-value="1"
|
||
:unchecked-value="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item
|
||
field="is_reissuable_after_expire"
|
||
label="过期再次发放:"
|
||
>
|
||
<a-switch
|
||
v-model="modalForm.is_reissuable_after_expire"
|
||
:checked-value="1"
|
||
:unchecked-value="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="modalForm.coupon_id">
|
||
<a-col a-col :span="12">
|
||
<a-form-item
|
||
field="inquiry_type"
|
||
label="状态:"
|
||
:style="{ width: '320px' }"
|
||
>
|
||
<a-select
|
||
placeholder="请选择状态"
|
||
:disabled="modalForm.coupon_id?true:false"
|
||
v-model="modalForm.coupon_status"
|
||
>
|
||
<!-- 1:正常 2:强制失效 3:结束 4:删除-->
|
||
<a-option :key="1" :value="1" label="正常">正常</a-option>
|
||
<a-option :key="2" :value="2" label="强制失效">强制失效</a-option>
|
||
<a-option :key="3" :value="3" label="结束">结束</a-option>
|
||
<a-option :key="4" :value="4" label="删除">删除</a-option>
|
||
</a-select>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="24">
|
||
<a-form-item field="is_popup" label="是否弹窗:">
|
||
<a-switch
|
||
v-model="modalForm.is_popup"
|
||
:checked-value="1"
|
||
:unchecked-value="0"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col a-col :span="12">
|
||
<a-form-item field="coupon_desc" label="优惠劵描述:">
|
||
<a-textarea
|
||
v-model="modalForm.coupon_desc"
|
||
placeholder="请输入优惠劵描述"
|
||
allow-clear
|
||
:style="{ minHeight: '100px' }"
|
||
/>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24" v-if="record_data.length>0 && modalForm.coupon_id">
|
||
<a-col a-col :span="18">
|
||
<a-form-item field="coupon_desc" label="发放记录:">
|
||
<a-table
|
||
:columns="record_columns"
|
||
:data="record_data"
|
||
:pagination="false"
|
||
>
|
||
<template #grant_type="{ record }">
|
||
<div v-if="record.grant_type==1">具体用户 </div>
|
||
<div v-else>未拥有用户 </div>
|
||
</template>
|
||
<template #grant_result="{ record }">
|
||
<!-- 1:成功 2:发放中 3:失败 -->
|
||
<div v-if="record.grant_result==1">成功 </div>
|
||
<div v-else-if="record.grant_result==2">发放中</div>
|
||
<div v-else>失败</div>
|
||
</template>
|
||
</a-table>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
</a-form>
|
||
<a-divider />
|
||
<div class="titlebox">
|
||
<div class="bar"></div>
|
||
<div class="name">操作</div>
|
||
</div>
|
||
<a-row :gutter="24" style="margin-top: 35px">
|
||
<a-col :span="24">
|
||
<a-form-item field="" label="" no-style>
|
||
<a-space style="margin-right: 8px" v-if="!modalForm.coupon_id">
|
||
<a-button
|
||
type="primary"
|
||
v-has="'admin:sysCouponList:add'"
|
||
@click="handleAddCoupon"
|
||
>添加</a-button
|
||
>
|
||
</a-space>
|
||
|
||
<a-space style="margin-right: 8px" v-else>
|
||
<a-button
|
||
type="primary"
|
||
v-has="'admin:sysCouponList:edit'"
|
||
|
||
:disabled="modalForm.coupon_status == 2"
|
||
@click="handleUpdateCoupon"
|
||
>修改</a-button
|
||
>
|
||
</a-space>
|
||
<a-space
|
||
style="margin-right: 8px"
|
||
v-if="modalForm.coupon_id && modalForm.coupon_status == 1"
|
||
>
|
||
<a-button
|
||
type="primary"
|
||
v-has="'admin:sysCouponList:force'"
|
||
status="danger"
|
||
@click="showCoupon"
|
||
>强制失效</a-button
|
||
>
|
||
</a-space>
|
||
</a-form-item>
|
||
</a-col>
|
||
</a-row>
|
||
</a-modal>
|
||
<isOkCouponModal
|
||
:isVisible="isVisible"
|
||
:api="updateCouponStatus"
|
||
:title="okTitle"
|
||
:dealType="'status'"
|
||
:id="modalForm.coupon_id"
|
||
@closeChangeOk="closeChangeOk"
|
||
></isOkCouponModal>
|
||
</template>
|
||
<script setup>
|
||
import { ref, toRefs, watch, getCurrentInstance, defineExpose } from 'vue';
|
||
import {
|
||
addCoupon,
|
||
updateCoupon,
|
||
getProduct,
|
||
updateCouponStatus,
|
||
} from '@/api/coupon/list';
|
||
import { Message } from '@arco-design/web-vue';
|
||
const { proxy } = getCurrentInstance();
|
||
import dayjs from 'dayjs';
|
||
const emits = defineEmits(['closeChange', 'changeTimeRange', 'freshDetail','changeValue']);
|
||
const props = defineProps({
|
||
// 是否显示
|
||
modalVisible: {
|
||
type: Boolean,
|
||
default: false,
|
||
},
|
||
modalForm: {
|
||
type: Object,
|
||
default: {},
|
||
},
|
||
});
|
||
const valid_start_time = ref('');
|
||
const valid_end_time = ref('');
|
||
const { modalVisible, modalForm } = toRefs(props);
|
||
const showManjian = ref(false);
|
||
const showMinNumber = ref(false);
|
||
const showConnectType = ref(false);
|
||
const showProduct = ref(false);
|
||
const showTimeRange = ref(false);
|
||
const showValidDay = ref(false);
|
||
const showDistributionDay = ref(false);
|
||
const defaultValue = ref([]);
|
||
const rangeValue = ref([]);
|
||
const productList = ref([]);
|
||
const loading = ref(false);
|
||
const okTitle = ref('');
|
||
const isVisible = ref(false);
|
||
const showCoupon = () => {
|
||
okTitle.value = '确定强制失效吗?';
|
||
isVisible.value = true;
|
||
};
|
||
const record_data = ref([]);
|
||
const record_columns = [
|
||
{
|
||
title: '用户名称',
|
||
dataIndex: 'user_name',
|
||
},
|
||
{
|
||
title: '操作人',
|
||
dataIndex: 'useradmin_user_name_name',
|
||
},
|
||
{
|
||
title: '发放类型',
|
||
dataIndex: 'grant_type',
|
||
slotName: 'grant_type',
|
||
},
|
||
{
|
||
title: '目标发放数量',
|
||
dataIndex: 'total_quantity',
|
||
},
|
||
{
|
||
title: '已发放数量',
|
||
dataIndex: 'grant_quantity',
|
||
},
|
||
{
|
||
title: '发放结果',
|
||
dataIndex: 'grant_result',
|
||
slotName: 'grant_result',
|
||
},
|
||
{
|
||
title: '操作时间',
|
||
dataIndex: 'created_at',
|
||
slotName: 'created_at',
|
||
},
|
||
];
|
||
const clearDate = () => {
|
||
valid_start_time.value = '';
|
||
valid_end_time.value = '';
|
||
emits('changeTimeRange', {
|
||
valid_start_time: '',
|
||
valid_end_time: '',
|
||
});
|
||
};
|
||
//关闭启用弹框
|
||
const closeChangeOk = () => {
|
||
isVisible.value = false;
|
||
modalVisible.value = false;
|
||
handleClose();
|
||
emits('freshDetail', {
|
||
coupon_id: modalForm.value.coupon_id,
|
||
});
|
||
};
|
||
const handleGetProduct = async (name = '', id = '') => {
|
||
loading.value = true;
|
||
const { code, data } = await getProduct({
|
||
product_name: '',
|
||
product_id: '',
|
||
limit: 100,
|
||
});
|
||
if (code == 200) {
|
||
productList.value = data;
|
||
}
|
||
loading.value = false;
|
||
};
|
||
const changeType = (val,flag=true) => {
|
||
showManjian.value = false;
|
||
showMinNumber.value = false;
|
||
if(flag){
|
||
emits('changeValue','with_amount');
|
||
emits('changeValue','min_usable_number');
|
||
}
|
||
|
||
if (val == 2) {
|
||
showManjian.value = true;
|
||
} else if (val == 3) {
|
||
showMinNumber.value = true;
|
||
}
|
||
};
|
||
const changeValidType = (val,flag=true) => {
|
||
showTimeRange.value = false;
|
||
|
||
showValidDay.value = false;
|
||
if(flag){
|
||
clearDate();
|
||
emits('changeValue','valid_days');
|
||
}
|
||
if (val == 1) {
|
||
showTimeRange.value = true;
|
||
if (modalForm.value.valid_start_time) {
|
||
rangeValue.value = [
|
||
modalForm.value.valid_start_time,
|
||
modalForm.value.valid_end_time,
|
||
];
|
||
}
|
||
} else {
|
||
showValidDay.value = true;
|
||
}
|
||
};
|
||
const changeScope = (val,flag=true) => {
|
||
showConnectType.value = false;
|
||
|
||
showProduct.value = false;
|
||
|
||
showManjian.value = false;
|
||
|
||
showMinNumber.value = false;
|
||
|
||
if(flag){
|
||
emits('changeValue','inquiry_type');
|
||
emits('changeValue','product_id');
|
||
emits('changeValue','with_amount');
|
||
emits('changeValue','min_usable_number');
|
||
}
|
||
if (val == 1) {
|
||
modalForm.coupon_type == 2 && (showManjian.value = true);
|
||
modalForm.coupon_type == 3 && (showMinNumber.value = true);
|
||
} else if (val == 2) {
|
||
showConnectType.value = true;
|
||
} else if (val == 5) {
|
||
showProduct.value = true;
|
||
handleGetProduct('', modalForm.value.product_id);
|
||
}
|
||
};
|
||
const changeObject = (val,flag=true) => {
|
||
showDistributionDay.value = false;
|
||
if(flag){
|
||
emits('changeValue','distribution_with_day');
|
||
}
|
||
|
||
if (val == 4) {
|
||
showDistributionDay.value = true;
|
||
}
|
||
};
|
||
|
||
watch(
|
||
() => props.modalForm,
|
||
() => {
|
||
//console.log(props.modalForm);
|
||
if (props.modalForm.coupon_id) {
|
||
changeType(props.modalForm.coupon_type,false);
|
||
changeScope(props.modalForm.application_scope,false);
|
||
changeObject(props.modalForm.distribution_object,false);
|
||
changeValidType(props.modalForm.valid_type,false);
|
||
if (props.modalForm.valid_start_time && props.modalForm.valid_end_time) {
|
||
defaultValue.value = [
|
||
props.modalForm.valid_start_time,
|
||
props.modalForm.valid_end_time,
|
||
];
|
||
}
|
||
if (
|
||
props.modalForm.coupon_grant &&
|
||
props.modalForm.coupon_grant.length > 0
|
||
) {
|
||
record_data.value = props.modalForm.coupon_grant;
|
||
}
|
||
}
|
||
},
|
||
{ immediate: true, deep: true }
|
||
);
|
||
const onOk = (dateString, date) => {
|
||
[valid_start_time.value, valid_end_time.value] = dateString;
|
||
rangeValue.value = [valid_start_time.value, valid_end_time.value];
|
||
emits('changeTimeRange', {
|
||
valid_start_time: valid_start_time.value,
|
||
valid_end_time: valid_end_time.value,
|
||
});
|
||
proxy.$refs.modalFormRef.validateField('valid_start_time', (valid) => {
|
||
if (!valid) {
|
||
}
|
||
});
|
||
};
|
||
|
||
|
||
const changeStatus = () => {
|
||
showConnectType.value = false;
|
||
//emits('changeValue','inquiry_type');
|
||
showProduct.value = false;
|
||
//emits('changeValue','product_id');
|
||
showManjian.value = false;
|
||
//emits('changeValue','with_amount');
|
||
showMinNumber.value = false;
|
||
//emits('changeValue','min_usable_number');
|
||
showDistributionDay.value = false;
|
||
//emits('changeValue','distribution_with_day');
|
||
showTimeRange.value = false;
|
||
//clearDate();
|
||
showValidDay.value = false;
|
||
//emits('changeValue','valid_days');
|
||
};
|
||
const handleClose = () => {
|
||
emits('closeChange', (modalVisible.value = false));
|
||
proxy.$refs.modalFormRef.resetFields();
|
||
};
|
||
const disabledDate = (time) => {
|
||
return time.getTime() < Date.now() - 8.64e7;
|
||
};
|
||
const handleAddCoupon = () => {
|
||
proxy.$refs.modalFormRef.validate(async (valid) => {
|
||
if (!valid) {
|
||
let {
|
||
coupon_name,
|
||
coupon_client,
|
||
coupon_type,
|
||
distribution_object,
|
||
application_scope,
|
||
inquiry_type,
|
||
is_mutex,
|
||
is_display,
|
||
distribution_with_day,
|
||
min_usable_number,
|
||
coupon_count,
|
||
coupon_price,
|
||
with_amount,
|
||
valid_type,
|
||
valid_days,
|
||
valid_start_time,
|
||
valid_end_time,
|
||
product_id,
|
||
reissue_interval_days,
|
||
is_reissuable_after_expire,
|
||
is_popup,
|
||
coupon_desc,
|
||
} = props.modalForm;
|
||
let product_id_arr = [];
|
||
if (product_id && typeof product_id === 'string') {
|
||
product_id_arr = product_id.split(',');
|
||
} else if (product_id && product_id instanceof Array) {
|
||
product_id_arr = product_id;
|
||
}
|
||
let basicObj = {
|
||
coupon_name,
|
||
coupon_client,
|
||
coupon_type,
|
||
distribution_object,
|
||
application_scope,
|
||
coupon_count,
|
||
coupon_price,
|
||
reissue_interval_days,
|
||
is_reissuable_after_expire,
|
||
is_popup,
|
||
coupon_desc,
|
||
valid_type,
|
||
is_mutex,
|
||
is_display,
|
||
};
|
||
if (showManjian.value) {
|
||
basicObj.with_amount = with_amount;
|
||
}
|
||
if (showMinNumber.value) {
|
||
basicObj.min_usable_number = min_usable_number;
|
||
}
|
||
if (showDistributionDay.value) {
|
||
basicObj.distribution_with_day = distribution_with_day;
|
||
}
|
||
if (showConnectType.value) {
|
||
basicObj.inquiry_type = inquiry_type;
|
||
}
|
||
if (showProduct.value) {
|
||
basicObj.product_id = product_id_arr;
|
||
}
|
||
if (showValidDay.value) {
|
||
basicObj.valid_days = valid_days;
|
||
}
|
||
if (showTimeRange.value) {
|
||
basicObj.valid_start_time = dayjs(valid_start_time).format(
|
||
'YYYY-MM-DD HH:mm:ss'
|
||
);
|
||
basicObj.valid_end_time = dayjs(valid_end_time).format(
|
||
'YYYY-MM-DD HH:mm:ss'
|
||
);
|
||
}
|
||
const { code } = await addCoupon(basicObj);
|
||
if (code == 200) {
|
||
Message.success('添加成功');
|
||
handleClose();
|
||
} else {
|
||
proxy.$notification.error(response.message);
|
||
}
|
||
}
|
||
});
|
||
};
|
||
const handleUpdateCoupon = async () => {
|
||
proxy.$refs.modalFormRef.validate(async (valid) => {
|
||
if (!valid) {
|
||
let {
|
||
coupon_id,
|
||
coupon_name,
|
||
coupon_client,
|
||
coupon_type,
|
||
distribution_object,
|
||
application_scope,
|
||
inquiry_type,
|
||
is_mutex,
|
||
is_display,
|
||
distribution_with_day,
|
||
min_usable_number,
|
||
coupon_count,
|
||
coupon_price,
|
||
with_amount,
|
||
valid_type,
|
||
valid_days,
|
||
valid_start_time,
|
||
valid_end_time,
|
||
product_id,
|
||
reissue_interval_days,
|
||
is_reissuable_after_expire,
|
||
is_popup,
|
||
coupon_desc,
|
||
} = props.modalForm;
|
||
let product_id_arr = [];
|
||
console.log(product_id);
|
||
if (product_id && typeof product_id === 'string') {
|
||
product_id_arr = product_id.split(',');
|
||
} else if (product_id && product_id instanceof Array) {
|
||
product_id_arr = product_id;
|
||
}
|
||
let basicObj = {
|
||
coupon_name,
|
||
coupon_client,
|
||
coupon_type,
|
||
distribution_object,
|
||
application_scope,
|
||
coupon_count,
|
||
coupon_price,
|
||
reissue_interval_days,
|
||
is_reissuable_after_expire,
|
||
is_popup,
|
||
coupon_desc,
|
||
valid_type,
|
||
is_mutex,
|
||
is_display,
|
||
};
|
||
if (showManjian.value) {
|
||
basicObj.with_amount = with_amount;
|
||
}
|
||
if (showMinNumber.value) {
|
||
basicObj.min_usable_number = min_usable_number;
|
||
}
|
||
if (showDistributionDay.value) {
|
||
basicObj.distribution_with_day = distribution_with_day;
|
||
}
|
||
if (showConnectType.value) {
|
||
basicObj.inquiry_type = inquiry_type;
|
||
}
|
||
if (showProduct.value) {
|
||
basicObj.product_id = product_id_arr;
|
||
}
|
||
if (showValidDay.value) {
|
||
basicObj.valid_days = valid_days;
|
||
}
|
||
if (showTimeRange.value) {
|
||
basicObj.valid_start_time = valid_start_time;
|
||
basicObj.valid_end_time = valid_end_time;
|
||
}
|
||
const { code } = await updateCoupon(coupon_id, basicObj);
|
||
if (code == 200) {
|
||
Message.success('修改成功');
|
||
|
||
handleClose();
|
||
} else {
|
||
proxy.$notification.error(response.message);
|
||
}
|
||
}
|
||
});
|
||
};
|
||
const rules = {
|
||
coupon_name: [{ required: true, message: '请输入优惠劵名称' }],
|
||
coupon_client: [{ required: true, message: '请选择使用平台' }],
|
||
application_scope: [{ required: true, message: '请选择使用范围' }],
|
||
coupon_type: [{ required: true, message: '请选择发放类型' }],
|
||
distribution_object: [{ required: true, message: '请选择发放对象' }],
|
||
valid_type: [{ required: true, message: '请选择有效类型' }],
|
||
coupon_count:[{ required: true, message: '请输入发放数量' }],
|
||
coupon_price:[{ required: true, message: '请输入优惠劵金额' }]
|
||
};
|
||
defineExpose({
|
||
changeStatus,
|
||
});
|
||
</script>
|
||
<style scoped>
|
||
</style> |