qimall/addons/Coupon/backend/views/default/edit.php

<?php defined('YII_ENV') or exit('Access Denied'); ?>
<?php
use common\helpers\ComponentHelper;
use common\helpers\AddonHelper;
ComponentHelper::loadComponentView('com-dialog-store');
ComponentHelper::loadComponentView('com-dialog-mch');
?>
<style>
    .list {
        margin-top: 10px;
        width: 100%;
    }

    .choose {
        border: 1px solid #e2e2e2;
        height: 125px;
        width: 120px;
        padding-top: 15px;
        text-align: center;
        margin: 0 10px 20px 0;
        border-radius: 0 !important;
        position: relative;
    }

    .choose i {
        position: absolute;
        top: 5px;
        right: 5px;
        cursor: pointer;
    }

    .choose .name {
        margin-top: -10px;
    }

    .item .el-checkbox-button__inner {
        border: 1px solid #e2e2e2;
        height: 125px;
        width: 120px;
        padding-top: 15px;
        text-align: center;
        margin: 0 20px 20px 0;
        cursor: pointer;
        border-radius: 0 !important;
    }

    .item.active {
        background-color: #50A0E4;
        color: #fff;
    }

    .list .img {
        height: 60px;
        width: 60px;
        border-radius: 30px;
    }

    .name {
        margin-top: 10px;
        font-size: 13px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .el-tabs__header {
        padding: 0 20px;
        height: 56px;
        line-height: 56px;
        background-color: #fff;
        margin-bottom: 0;
    }

    .form-body {
        background-color: #fff;
        /* padding: 20px 50% 20px 20px; */
        padding: 0;
        min-width: 1000px;
    }

    .el-form-item{
        padding-right: 40%
    }

    .button-item {
        /*margin-top: 12px;*/
        padding: 9px 25px;
    }

    .del-btn {
        position: absolute;
        right: -8px;
        top: -8px;
        padding: 4px 4px !important;
    }

    .header-box {
        padding: 20px;
        background-color: #fff;
        margin-bottom: 10px;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }

    .el-card,
    .el-message {
        border-radius: 0;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }

    .text {
        cursor: pointer;
        color: #419EFB;
    }

    .coupon-type {
        border: 1px solid #E0E0E0;
        padding: 20px 16px;
        font-size: 16px;
        line-height: 30px;
        margin-right: 24px;
        min-width: 160px;
        border-radius: 8px;
        color: #E0E0E0;
        font-weight: 400;
    }

    .coupon-type-name {
        color: #666;
        font-size: 24px;
        font-weight: bold;
    }

    .coupon-type-img{
        margin-right: 12px;
    }

    .coupon-type:hover,
    .click-so {
        cursor: pointer;
    }

    .sel-coupon-type {
        border: 2px solid #409EFF;
        color: #666;
    }

    .sel-coupon-type-name {
        color: #409EFF;
    }

    .discount-text {
        line-height: 30px;
    }

    .add-goods-info{
        margin-left: 12px;
        font-size: 16px;
        color: #333;
        line-height: 24px;
    }

    .coupon-form .el-input-group__prepend{
        background: transparent;
    }

    .coupon-form  .el-input-group__append{
        background: #F2F3F4;
        border: 1px solid #E0E0E0;
        border-left: 0;
        font-size: 14px;
        color: #666666;

    }

    .coupon-form .el-input__inner[type="number"]{
        padding-right: 0;
    }

    .expire_type_model{
        margin-bottom: 10px;
    }

    .coupon_expire_type,.coupon_expire_type_text{
        display: flex;
        align-items: center;
    }

    .coupon_expire_type .el-input-group{
        margin: 0 6px;
    }

    .coupon-model-title{
        padding: 0 16px 20px;
        margin-bottom: 20px;
        font-size: 18px;
        font-weight: 500;
        line-height: 31px;
        color: #333333;
        border-bottom: 1px solid #F2F2F2;
    }

    .coupon-model-title:first-child{
        padding-top: 20px;
    }


    .coupon-award>div{
        margin-bottom: 20px;
    }

</style>

<div id="app" v-cloak>
    <div slot="header" class="header-box">
        <div flex="cross:center box:first">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                    <span style="color: #409EFF;cursor: pointer" @click="$navigate({r:'coupon/default/index'})">
                        优惠券管理
                    </span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>优惠券编辑</el-breadcrumb-item>
            </el-breadcrumb>
            <div flex="dir:right">
                <div>
                    <el-button :disabled="!is_can_edit" class="button-item" type="primary" size="small" :loading=submitLoading @click="onSubmit">保存</el-button>
                </div>
            </div>
        </div>
    </div>
    <el-card v-loading="loading" style="border:0" shadow="never" body-style="background-color: #f3f3f3;padding: 0 0;">
        <el-form class="coupon-form" :model="form" label-width="10.5rem" :rules="FormRules" ref="form">
            <div class="form-body">
                <div class="coupon-model-title">
                    规则设置
                </div>
                <el-form-item  label="优惠券类型" prop="type">
                    <div flex>
                        <div class="coupon-type" flex :class="{'sel-coupon-type': form.type == 2}" @click="selectType(2)">
                            <div class="coupon-type-img">
                                <el-image style="width: 52px; height: 52px" :src="form.type == 2?'resources/img/plugins/coupon/selCoupon.png':'resources/img/plugins/coupon/noCoupon.png'"></el-image>
                            </div>
                            <div>
                                <div class="coupon-type-name" :class="{'sel-coupon-type-name': form.type == 2}">满减券</div>
                                <div>例：满100减20</div>
                            </div>
                        </div>
                        <div class="coupon-type" flex :class="{'sel-coupon-type': form.type == 1}" @click="selectType(1)">
                            <div class="coupon-type-img">
                                <el-image style="width: 52px; height: 52px" :src="form.type == 1?'resources/img/plugins/coupon/selCoupon.png':'resources/img/plugins/coupon/noCoupon.png'"></el-image>
                            </div>
                            <div>
                                <div class="coupon-type-name" :class="{'sel-coupon-type-name': form.type == 1}">折扣券</div>
                                <div>例：满100打9折</div>
                            </div>
                        </div>
                        <div class="coupon-type" flex :class="{'sel-coupon-type': form.type == 4}" @click="selectType(4)">
                            <div class="coupon-type-img">
                                <el-image style="width: 52px; height: 52px" :src="form.type == 4?'resources/img/plugins/coupon/selCoupon.png':'resources/img/plugins/coupon/noCoupon.png'"></el-image>
                            </div>
                            <div>
                                <div class="coupon-type-name" :class="{'sel-coupon-type-name': form.type == 4}">兑换券</div>
                                <div>例：XX商品兑换券</div>
                            </div>
                        </div>
                    </div>
                </el-form-item>

                <el-form-item prop="discount" v-if="form.type != 4">
                    <template slot='label'>
                        <span class="discount-text">优惠内容</span>
                    </template>
                    <!-- 满减 -->
                    <div v-if="form.type == 2" style="display: flex;">
                        <el-input size="small" @input="handleMinPrice" ref="min_price" style="width: 30%;margin-right: 6px;" type="number" v-model="form.min_price" autocomplete="off">
                            <div class="discount-text" slot="prepend">消费满</div>
                            <template slot="append">元</template>
                        </el-input>
                        <el-input size="small" @input="handleSubPrice" ref="sub_price" style="width: 30%;margin: 0 6px;" type="number" v-model="form.sub_price" autocomplete="off">
                            <div class="discount-text" slot="prepend" style="text-align: center;">减</div>
                            <template slot="append">元</template>
                        </el-input>
                    </div>
                    <!-- 折扣 -->
                    <div v-if="form.type == 1" style="display: flex;">
                        <el-input size="small" @input="handleMinPrice" style="margin-right: 6px;" ref="fold_min_price" prop="min_price" type="number" v-model="form.min_price" autocomplete="off">
                            <div class="discount-text" slot="prepend" >消费满</div>
                            <template slot="append">元</template>
                        </el-input>
                        <el-input size="small" @input="handleSubPrice" style="margin: 0 6px;" type="number" v-model="form.discount" autocomplete="off" prop="discount">
                            <div class="discount-text" slot="prepend" >打</div>
                            <template slot="append">折</template>
                        </el-input>
                        <el-checkbox ref="is_discount_limit" @change="discount_limit_change" v-model="is_discount_limit" :true-label="1" :false-label="0" style="display: flex;justify-content: center;align-items: center;margin: 0 6px;">最多优惠</el-checkbox>
                        <el-input size="small" @input="handleDiscountLimit" style="margin: 0 6px;" ref="fold_discount_limit" type="number" v-model="form.discount_limit" autocomplete="off" prop="discount_limit">
                            <template slot="append">元</template>
                        </el-input>
                    </div>
                </el-form-item>

                <el-form-item label="优惠券名称" prop="name">
                    <el-input size="small" minlength="1" maxlength="150" show-word-limit v-model="form.name" autocomplete="off" placeholder="请输入优惠券名称"></el-input>
                </el-form-item>

                <el-form-item prop="total_count">
                    <template slot='label'>
                        <span>发放总数</span>
                        <el-tooltip effect="dark" content="优惠券总数量不能为 0" placement="top">
                            <i class="el-icon-info"></i>
                        </el-tooltip>
                    </template>
                    <el-input size="small" style="width: 260px;" @input="numForm($event,'total_count')" v-model.number="form.total_count" :min="1" autocomplete="off">
                        <template slot="append">张</template>
                    </el-input>
                    <!-- <el-checkbox v-model="form.total_count" :true-label="-1" :false-label="0">无限制</el-checkbox> -->
                </el-form-item>

                <el-form-item label="优惠券有效期" prop="expire_type">
                    <div class="expire_type_model">
                        <el-radio class="coupon_expire_type" :disabled="is_can_change_time" v-model="form.expire_type" :label="1">
                            <span class="coupon_expire_type_text" style="color: #333;">
                                领券后立即生效，有效
                                <el-input size="small" style="width: 30%;" min="1" :disabled="is_can_change_time" v-model="form.expire_day" autocomplete="off" @input="numForm($event,'expire_day')">
                                    <template slot="append">天</template>
                                </el-input>
                            </span>
                        </el-radio>
                    </div>
                    <div class="expire_type_model">
                        <el-radio class="coupon_expire_type" :disabled="is_can_change_time" v-model="form.expire_type" :label="3">
                            <span class="coupon_expire_type_text" style="color: #333;">
                                领券
                                <el-input size="small" style="width: 30%;" min="1" :disabled="is_can_change_time" v-model="form.effect_days" autocomplete="off" @input="numForm($event,'effect_days')" >
                                    <template slot="append">天</template>
                                </el-input>
                                后生效，有效期
                                <el-input size="small" style="width: 30%;" min="1" :disabled="is_can_change_time" v-model="form.effect_expire_days" autocomplete="off" @input="numForm($event,'effect_expire_days')">
                                    <template slot="append">天</template>
                                </el-input>
                            </span>
                        </el-radio>
                    </div>
                    <div class="expire_type_model">
                        <el-radio class="coupon_expire_type" :disabled="is_can_change_time" v-model="form.expire_type" :label="2">
                            <el-date-picker size="small" :disabled="is_can_change_time" v-model="expire_time" value-format="timestamp" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="select_expire_time">
                            </el-date-picker>
                        </el-radio>
                    </div>
                </el-form-item>

                <el-form-item label="用户每天使用次数" prop="day_limit" v-if="form.type == 4">
                    <el-input size="small" type="number" v-model="form.day_limit" :min="0" autocomplete="off" placeholder="用户每天使用次数" style="width: 260px;"></el-input>
                </el-form-item>

                <el-form-item label="使用范围" prop="appoint_type">
                    <template v-if="form.type != 4">
                        <el-radio v-model="form.appoint_type" :label="3">全场可用</el-radio>
                        <el-radio v-model="form.appoint_type" @click.native="goodsListVisible = true" :label="2">
                            指定商品可用
                        </el-radio>
                        <el-radio v-model="form.appoint_type" :label="1">指定商品分类可用</el-radio>
                        <el-radio v-model="form.appoint_type" :label="6" v-if="addons_store">指定门店（o2o门店）商品可用</el-radio>
                        <el-radio v-model="form.appoint_type" :label="4" v-if="addons_store">指定门店（o2o门店）</el-radio>
                        <el-radio v-model="form.appoint_type" :label="5" v-if="addons_mch">指定商户</el-radio>
                    </template>
                    <template v-else>
                        <el-radio v-model="form.appoint_type" @click.native="goodsListVisible = true" :label="2">平台商品可用</el-radio>
                        <el-radio v-model="form.appoint_type" :label="6" v-if="addons_store">门店商品可用</el-radio>
                    </template>

                    <div v-if="form.appoint_type ==1">
                        <el-cascader size="small" v-model="cat_id_list" :options="cats_list" :props="{ multiple: true,checkStrictly: true,emitPath: false, }" clearable></el-cascader>
                    </div>

                    <div v-if="form.appoint_type == 2">
                        <el-button :disabled="!is_can_edit" type="text" @click.native="goodsAddVisible = true">选择商品</el-button>
                        <el-button :disabled="!is_can_edit" type="text" @click="delSelectGoods">批量删除</el-button>
                        <el-table :data="selected_goods" style="width: 100%" del-max-height="99999px" ref="selectedGoodsRef">
                            <el-table-column type="selection" width="55"></el-table-column>
                            <el-table-column prop="goods_id" label="ID" width="80"></el-table-column>
                            <el-table-column prop="cover_pic" label="商品" width="280">
                                <template slot-scope="scope">
                                    <div flex>
                                        <com-image mode="aspectFill" :src="scope.row.cover_pic"></com-image>
                                        <div class="add-goods-info">
                                            <div>{{scope.row.goods_name}}</div>
                                            <div style="font-size: 14px;color: #B2B2B2;">{{scope.row.price}} - {{scope.row.original_price}}</div>
                                        </div>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="120">
                                <template slot-scope="scope">
                                    <el-button plain size="mini" type="danger" @click="goodsDestroy(scope.$index)">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>

                    <div v-if="form.appoint_type == 6">
                        <div style="width: 100%;">
                            <el-button :disabled="!is_can_edit" type="text" @click.native="storeGoodsAddVisible = true">选择门店商品</el-button>
                            <el-button :disabled="!is_can_edit" type="text" @click="delSelectStoreGoods">批量删除</el-button>
                        </div>
                        <el-table :data="selected_store_goods" style="width: 100%" del-max-height="99999px" ref="selectedStoreGoodsRef">
                            <el-table-column type="selection" width="55"></el-table-column>
                            <el-table-column label="ID" width="80">
                                <template slot-scope="scope">
                                    {{scope.row.goods_id}}
                                </template>
                            </el-table-column>
                            <el-table-column prop="cover_pic" label="商品" width="280">
                                <template slot-scope="scope">
                                    <div flex>
                                        <com-image mode="aspectFill" :src="scope.row.cover_pic"></com-image>
                                        <div class="add-goods-info">
                                            <div>{{scope.row.goods_name}}</div>
                                            <div style="font-size: 14px;color: #B2B2B2;">{{scope.row.price}} - {{scope.row.original_price}}</div>
                                        </div>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作" width="120">
                                <template slot-scope="scope">
                                    <el-button plain size="mini" type="danger" @click="storeGoodsDestroy(scope.$index)">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>

                    <div v-if="form.appoint_type == 4">
                        <com-dialog-store :multiple="true" @selected="storeSelect" title="门店选择">
                            <el-button size="mini">选择门店</el-button>
                        </com-dialog-store>
                        <el-form-item v-if="store_list && store_list.length > 0 ">
                            <div style="max-width:400px;max-height: 300px;overflow-y: auto;background-color: #eee;margin: 5px 0;" v-for="(item,index) in store_list">
                                <div flex>
                                    <div style="padding-right: 10px;flex-grow: 0">
                                        <com-image mode="aspectFill"
                                                   :src="item.logo_img"></com-image>
                                    </div>
                                    <div style="flex-grow: 1;">
                                        <com-ellipsis :line="2">{{item.store_name}}
                                        </com-ellipsis>
                                    </div>
                                    <div style="flex-grow: 0;">
                                        <el-button @click="handle('deleteStore', index)"
                                                   type="text" circle size="mini">
                                            <el-tooltip class="item" effect="dark" content="删除" placement="top">
                                                <img src="resources/img/mall/del.png" alt="">
                                            </el-tooltip>
                                        </el-button>
                                    </div>
                                </div>
                            </div>
                        </el-form-item>
                    </div>
                    <div v-if="form.appoint_type == 5">
                        <com-dialog-mch url="coupon/default/select-mch" :multiple="true" @selected="mchSelect" title="选择商户">
                            <el-button size="mini">选择商户</el-button>
                        </com-dialog-mch>
                        <el-form-item v-if="mch_list && mch_list.length > 0 ">
                            <div style="max-width:400px;max-height: 300px;overflow-y: auto;background-color: #eee;margin: 5px 0;" v-for="(item,index) in mch_list">
                                <div flex>
                                    <div style="padding-right: 10px;flex-grow: 0">
                                        <com-image mode="aspectFill" :src="item.logo_img"></com-image>
                                    </div>
                                    <div style="flex-grow: 1;">
                                        <com-ellipsis :line="2">{{item.store_name}}
                                        </com-ellipsis>
                                    </div>
                                    <div style="flex-grow: 0;">
                                        <el-button @click="handle('deleteMch', index)"
                                                   type="text" circle size="mini">
                                            <el-tooltip class="item" effect="dark" content="删除" placement="top">
                                                <img src="resources/img/mall/del.png" alt="">
                                            </el-tooltip>
                                        </el-button>
                                    </div>
                                </div>
                            </div>
                        </el-form-item>
                    </div>
                </el-form-item>

<!--                <el-form-item label="过期提醒" prop="is_remind">-->
<!--                    <div style="display: flex;align-items: center;">-->
<!--                        <el-checkbox v-model="form.is_remind" :true-label="1" :false-label="0">-->
<!--                            <span style="color: #333;">优惠券过期前</span>-->
<!--                        </el-checkbox>-->
<!--                        <el-input size="small" prop="remind_days" :disabled="form.is_remind!=1" style="width: 20%;margin: 0 10px;" v-model="form.remind_days" autocomplete="off" @input="numForm($event,'remind_days')">-->
<!--                            <template slot="append">天</template>-->
<!--                        </el-input>-->
<!--                        <div>提醒</div>-->
<!--                        <el-tooltip effect="dark" content="建议设置的天数小于优惠券的有效期，否则用户无法收到过期提醒"-->
<!--                                    placement="top">-->
<!--                                <i class="el-icon-question" style="font-size: 20px;color: #858585;margin-left: 10px;"></i>-->
<!--                        </el-tooltip>-->
<!--                    </div>-->
<!--                </el-form-item>-->

                <el-form-item label="原价使用" prop="is_original_use" v-if="form.type != 4">
                    <el-checkbox v-model="form.is_original_use" :true-label="1" :false-label="0">
                        <span style="color: #333;">优惠券仅原价购买时可用</span>
                    </el-checkbox>
                    <div>勾选后商品需要原价购买才可使用该优惠券。举例:商品享受会员折扣后无法使用该券</div>
                </el-form-item>

                <el-form-item label="不允许叠加余额支付" prop="is_not_allow_balance_pay" v-if="form.type != 4">
                    <el-switch v-model="form.is_not_allow_balance_pay" active-color="#13ce66" :active-value="1" :inactive-value="0">
                    </el-switch>
                    <div>开启后，使用该优惠券时不可使用余额支付</div>
                </el-form-item>

                <el-form-item label="使用叠加" prop="is_superposition_use" v-if="isShowSuperpositionUse()">
                    <el-switch v-model="form.is_superposition_use" active-color="#13ce66" :active-value="1" :inactive-value="0">
                    </el-switch>
                    <div >开启后同一个优惠券在同一个商品中可以叠加使用。举例: 用户有A优惠券4张, 可在商品里4张一起叠加使用</div>
                </el-form-item>

                <el-form-item label="使用说明" prop="rule">
                    <el-input size="small" v-model="form.rule" type="textarea" :rows="4" placeholder="请输入内容">
                    </el-input>
                </el-form-item>
                <div class="coupon-model-title">
                    领取规则
                </div>
                <el-form-item label="每人最多可领取" prop="receive_count">
                    <el-input size="small" v-model="form.receive_count" autocomplete="off" style="width: 260px;" @input="numForm($event,'receive_count')">
                        <template slot="append">张</template>
                    </el-input>
                    <div style="color: #999;font-size: 14px;">编辑保存后，仅对后续领取的客户生效，对之前已领取的客户无法生效。</div>
                </el-form-item>
                <el-form-item label="是否设为开屏优惠券" prop="is_open_screen">
                    <el-switch  v-model="form.is_open_screen" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                </el-form-item>
                <el-form-item label="优惠券允许公开领取" prop="is_public_receive">
                    <!-- <el-radio v-model="form.is_public_receive" :label="0">关闭</el-radio>
                    <el-radio v-model="form.is_public_receive" :label="1">开启</el-radio> -->
                    <el-switch :disabled="!is_can_edit" v-model="form.is_public_receive" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                    <span style="color: #999; font-size: 14px;line-height:24px;margin-left: 4px;">开启后会在商品详情区域、领券中心展示</span>
                </el-form-item>
                <!-- <el-form-item label="启用优惠券转送功能" prop="is_giving">
                    <el-switch v-model="form.is_giving" style="margin-right: 10px;" :active-value="1" :inactive-value="0"></el-switch>
                    说明：可将优惠券转送给指定会员
                </el-form-item> -->
                <el-form-item label="转赠设置" prop="is_giving">
                    <div>
                        <el-switch :disabled="!is_can_edit" @change="updateGiving" v-model="form.is_giving" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                        <span>优惠券允许转赠给好友</span>
                        <el-tooltip effect="dark" content="转赠的优惠券被领取后不扣减优惠券库存，只做所属权的转移" placement="top">
                            <i class="el-icon-question" style="font-size: 20px;color: #858585 ;"></i>
                        </el-tooltip>
                    </div>
                </el-form-item>
                <el-form-item label="必须转赠" prop="is_giving_use" v-if="form.is_giving == 1">
                    <div>
                        <el-switch v-model="form.is_giving_use" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                        <div style="color: #999;font-size: 14px;">开启后，用户不是通过转增领取的，则只可进行转增，不可使用，只有通过转增领取的才可以使用</div>
                    </div>
                </el-form-item>
                <el-form-item label="赠送有效期" prop="giving_expire" v-if="form.is_giving==1">
                    <div>
                        <el-input size="small" v-model="form.giving_expire" autocomplete="off" style="width: 260px;" :min="0" type="number" >
                            <template slot="append">天</template>
                        </el-input>
                        <div style="color: #999;font-size: 14px;">优惠券赠送过程中，如对方超时没有领取，自动反回赠送者账号，0不限制</div>
                    </div>
                </el-form-item>
                <el-form-item label="可转赠次数" prop="give_time" v-if="form.is_giving==1">
                <el-input size="small"  min="0" v-model="form.give_time" autocomplete="off">
                                </el-input>
                                <div style="color: #999;font-size: 14px;">0不限制</div>
                </el-form-item>
                <!-- <el-form-item label="优惠券排序" prop="sort">
                    <el-inputsize="small" type="number" v-model="form.sort" autocomplete="off">
                    </el-inputsize=>
                </el-form-item> -->
                <el-form-item label="领取人限制" prop="is_member">
                    <div>
                        <el-radio v-model="form.is_member" :label="0">不限制，所有人可领</el-radio>
                        <el-radio v-model="form.is_member" :label="1">指定会员等级可领取</el-radio>
                    </div>
                    <div v-if="form.is_member==1">
                        <el-checkbox :indeterminate="isIndeterminate" v-model="member_check_all" @change="handleCheckAllChange">全选</el-checkbox>
                        <el-checkbox-group v-model="member_level_limits" @change="handleCheckedMemberChange">
                            <!-- <el-checkbox :label="0">全部</el-checkbox> -->
                            <el-checkbox v-for="(item, key) in member_levels" :label="item.level" :key="key">{{item.name}}</el-checkbox>
                        </el-checkbox-group>
                    </div>
                </el-form-item>

                <div class="coupon-model-title"  v-if="form.appoint_type != 4 && form.appoint_type != 5 ">
                    奖励规则
                </div>
                <el-form-item label="奖励使用者" prop="is_consume_reward"  v-if="form.appoint_type != 4  && form.appoint_type != 5 ">
                    <div>
                        <el-switch :disabled="!is_can_edit" v-model="form.is_consume_reward" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                        <span style="color: #999; font-size: 14px;line-height:24px;margin-left: 4px;">会员使用优惠券获得奖励</span>
                    </div>
                    <div class="coupon-award" v-if="form.is_consume_reward==1">
                        <div>
                            <span>余额</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'balance','double','consume_reward')" @blur="blurNumForm('consume_reward','balance')" v-model="consume_reward.balance" autocomplete="off">
                                <template slot="append">元</template>
                            </el-input>
                        </div>
                        <div>
                            <span>积分</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'score','double','consume_reward')" @blur="blurNumForm('consume_reward','score')" v-model="consume_reward.score" autocomplete="off">
                                <template slot="append">分</template>
                            </el-input>
                        </div>
                        <div>
                            <span>红包</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'red_packet','double','consume_reward')" @blur="blurNumForm('consume_reward','red_packet')" v-model="consume_reward.red_packet" autocomplete="off">
                                <template slot="append">元</template>
                            </el-input>
                        </div>
                    </div>
                </el-form-item>
                <el-form-item label="奖励转赠者" prop="is_giving_reward"  v-if="form.appoint_type != 4  && form.appoint_type != 5 ">
                    <!-- <el-radio v-model="form.is_giving_reward" :label="0">关闭</el-radio>
                    <el-radio v-model="form.is_giving_reward" :label="1">开启</el-radio> -->
                    <div>
                        <el-switch :disabled="!is_can_edit || form.is_giving == 0" v-model="form.is_giving_reward" active-color="#13ce66" :active-value="1" :inactive-value="0"></el-switch>
                        <span style="color: #999; font-size: 14px;line-height:24px;margin-left: 4px;">会员使用优惠券转赠者获得奖励</span>
                    </div>
                    <div class="coupon-award"  v-if="form.is_giving_reward==1">
                        <div>
                            <span>余额</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'balance','double','giving_reward')" @blur="blurNumForm('giving_reward','balance')" v-model="giving_reward.balance" autocomplete="off">
                                <template slot="append">元</template>
                            </el-input>
                        </div>
                        <div>
                            <span>积分</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'score','double','giving_reward')" @blur="blurNumForm('giving_reward','score')" v-model="giving_reward.score" autocomplete="off">
                                <template slot="append">分</template>
                            </el-input>
                        </div>
                        <div>
                            <span>红包</span>
                            <el-input size="small" style="width: 30%;margin: 0 10px;" @input="numForm($event,'red_packet','double','giving_reward')" @blur="blurNumForm('giving_reward','red_packet')" v-model="giving_reward.red_packet" autocomplete="off">
                                <template slot="append">元</template>
                            </el-input>
                        </div>
                    </div>
                </el-form-item>
            </div>
        </el-form>
        <!--指定商品分类-->
        <el-dialog title="已指定商品类别" :visible.sync="catsListVisible" width="35%">
            <el-tree style="margin-left:30px" :indent="40" :data="cats_list" show-checkbox default-expand-all :default-checked-keys="cat_id_list" node-key="id" ref="tree" highlight-current :props="defaultProps"></el-tree>
            <div slot="footer" class="dialog-footer">
                <el-button plain type="submit" @click="catsListVisible = false">取消</el-button>
                <el-button plain type="primary" @click="catsAdd">确定</el-button>
            </div>
        </el-dialog>
        <!-- 添加商品弹窗 -->
        <el-dialog title="添加商品" :visible.sync="goodsAddVisible" append-to-body>
            <el-form @submit.native.prevent>
                <el-form-item>
                    <el-input size="small" v-model="keyword" autocomplete="off" placeholder="商品名称"
                              @keyup.enter.native="search('coupon/coupon/search-goods','goods')"
                              style="width: 40%"></el-input>
                    <el-button size="small" :loading="btnLoading"
                               @click="search('coupon/coupon/search-goods','goods')">查找商品
                    </el-button>
                    <el-button size="small"  style="margin-left: 0;" @click="goodsBatchAdd">批量添加</el-button>
                    <el-button size="small" style="margin-left: 0" @click="resetGoodsSearch">重置</el-button>
                </el-form-item>
            </el-form>
            <el-table :data="goods_list" @selection-change="selsChange" style="width: 100%">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="goods_id" label="ID" width="80"></el-table-column>
                <el-table-column prop="cover_pic" label="商品图" width="200">
                    <template slot-scope="scope">
                        <div flex="box:first">
                            <div style="padding-right: 10px;">
                                <com-image mode="aspectFill" :src="scope.row.cover_pic"></com-image>
                            </div>
                            <div>
                                <div>
                                    <com-ellipsis :line="2">{{scope.row.goods_name}}</com-ellipsis>
                                </div>
                                <div>
                                    ￥{{scope.row.price}}
                                </div>
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column prop="cost_price" label="成本价"></el-table-column>
                <el-table-column prop="stock" label="库存"></el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button v-if="goods_id_list.indexOf(scope.row.goods_id) == -1" plain size="mini"
                                   type="primary" @click="goodsAdd(scope.$index, scope.row.goods_id)">添加
                        </el-button>
                        <el-button v-else plain size="mini" type="primary" disabled>已添加</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-pagination
                        v-if="pagination"
                        background
                        @current-change="pageChange"
                        :current-page="currPage"
                        layout="prev, pager, next"
                        :page-count="pageCount">
                </el-pagination>
            </div>
        </el-dialog>
        
        <!-- 添加门店商品弹窗 -->
        <el-dialog title="添加商品" :visible.sync="storeGoodsAddVisible" append-to-body>
            <el-form @submit.native.prevent :inline="true" class="store_goods_from">
                <el-form-item>
                    <el-input size="small" v-model="store_keyword" autocomplete="off" placeholder="请输入门店名称/ID"
                              @keyup.enter.native="storeSearch('coupon/coupon/search-store-goods','store_goods')"
                              style="width: 200px"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-input size="small" v-model="keyword" autocomplete="off" placeholder="请输入商品名称/ID"
                              @keyup.enter.native="storeSearch('coupon/coupon/search-store-goods','store_goods')"
                              style="width: 200px"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button size="small" :loading="btnLoading" @click="storeSearch('coupon/coupon/search-store-goods','store_goods')">查找商品</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button size="small" @click="storeGoodsBatchAdd">批量添加</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button size="small" @click="resetStoreGoodsSearch">重置</el-button>
                </el-form-item>
            </el-form>
            <el-table :data="store_goods_list" @selection-change="storeGoodsSelsChange" style="width: 100%">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="goods_id" label="商品ID"></el-table-column>
                <el-table-column label="商品" width="200">
                    <template slot-scope="scope">
                        <div flex="box:first">
                            <div style="padding-right: 10px;">
                                <com-image mode="aspectFill" :src="scope.row.cover_pic"></com-image>
                            </div>
                            <div>
                                <div>
                                    <com-ellipsis :line="2">{{scope.row.goods_name}}</com-ellipsis>
                                </div>
                                <div>
                                    ￥{{scope.row.price}}
                                </div>
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column prop="store_id" label="门店ID"></el-table-column>
                <el-table-column label="门店" width="200">
                    <template slot-scope="scope">
                        <div flex="box:first">
                            <div style="padding-right: 10px;">
                                <com-image mode="aspectFill" :src="scope.row?.store?.logo_img ?? ''"></com-image>
                            </div>
                            <div>
                                <div>
                                    <com-ellipsis :line="2">{{scope.row?.store?.store_name ?? ''}}</com-ellipsis>
                                </div>
                                <div>
                                    {{scope.row?.store?.shop_mobile ?? ''}}
                                </div>
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column prop="cost_price" label="成本价"></el-table-column>
                <el-table-column prop="stock" label="库存"></el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button v-if="store_goods_id_list.indexOf(scope.row.goods_id) == -1" plain size="mini"
                                   type="primary" @click="storeGoodsAdd(scope.$index, scope.row.goods_id)">添加
                        </el-button>
                        <el-button v-else plain size="mini" type="primary" disabled>已添加</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-pagination
                        v-if="storePagination"
                        background
                        @current-change="storeGoodsPageChange"
                        :current-page="currPage"
                        layout="prev, pager, next"
                        :page-count="storePageCount">
                </el-pagination>
            </div>
        </el-dialog>

        <!-- 添加门店弹窗 -->
        <el-dialog title="添加门店" :visible.sync="storeAddVisible" append-to-body>
            <el-form>
                <el-form-item>
                    <el-input size="small" v-model="keyword" autocomplete="off" placeholder="门店名称"
                              style="width: 40%"></el-input>
                    <el-button size="small" :loading="btnLoading"
                               @click="searchStore">查找门店
                    </el-button>
                </el-form-item>
            </el-form>
            <el-table :data="storeList" @selection-change="storeSelectChange" style="width: 100%;margin: 0 0 10px 10px;">
                <el-table-column prop="id" label="ID" width="80"></el-table-column>
                <el-table-column prop="logo_img" label="门店LOGO" width="180">
                    <template slot-scope="scope">
                        <com-image mode="aspectFill" :src="scope.row.logo_img"></com-image>
                    </template>
                </el-table-column>
                <el-table-column prop="name" label="门店名称">
                    <template slot-scope="scope">
                        <com-ellipsis :line="2">{{scope.row.store_name}}</com-ellipsis>
                    </template>
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button v-if="form.store_id != scope.row.id" plain size="mini"
                                   type="primary" @click="storeAdd(scope.$index, scope.row.id)">添加
                        </el-button>
                        <el-button v-else plain size="mini" type="primary" disabled>已添加</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-pagination
                        v-if="paginations"
                        background
                        @current-change="storePageChange"
                        layout="prev, pager, next"
                        :page-count="pageCounts">
                </el-pagination>
            </div>
        </el-dialog>
    </el-card>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            var check_min_price = (rule, value, callback) => {
                if (this.form.type == 4) {
                    return callback();
                }

                // console.log('check_min_price:', value);
                if (!value) {
                    return callback(new Error('最低消费金额不能为空'));
                }
                if (value <= 0) {
                    return callback(new Error('最低消费金额必须大于0'));
                }
                callback();
            };
            var check_sub_price = (rule, value, callback) => {
                if (this.form.type == 4) {
                    return callback();
                }

                if (this.form.type == 2) {
                    if (!value) {
                        return callback(new Error('优惠金额不能为空'));
                    }
                    if (value <= 0) {
                        return callback(new Error('优惠金额必须大于0'));
                    }
                    if (value >= this.form.min_price) {
                        return callback(new Error('优惠减免金额必须小于等于优惠券使用门槛金额'));
                    }
                    callback();
                } else {
                    callback();
                }
            };
            var check_discount = (rule, value, callback) => {
                if (this.form.type == 4) {
                    return callback();
                }

                // console.info(rule, value,this.form.type);
                if (this.form.type == 1) {
                    let foldMinPrice = Number(this.$refs.fold_min_price.value);
                    let isDiscountLimit = Number(this.$refs.is_discount_limit.value);
                    let foldDiscountLimit = Number(this.$refs.fold_discount_limit.value);
                    if(!foldMinPrice || foldMinPrice <= 0){
                        return callback(new Error('请输入消费金额活或消费金额不能小于等于0'));
                    }
                    if (!value) {
                        return callback(new Error('请输入优惠折扣'));
                    }
                    if (value < 1 || value > 9.9) {
                        return callback(new Error('折扣券：优惠券折扣必须大于等于1, 且最大不能超过9.9优惠券折扣最多支持一位小数'));
                    }
                    if(isDiscountLimit == 1 && (!foldDiscountLimit || foldDiscountLimit <= 0)){
                        return callback(new Error('请输入最多优惠金额活最多优惠不能小于等于0'));
                    }
                    callback();
                } else {
                    let minPrice = Number(this.$refs.min_price.value);
                    let subPrice = Number(this.$refs.sub_price.value);
                    console.info(minPrice,subPrice,Boolean(minPrice));
                    if(!minPrice || minPrice <= 0){
                        return callback(new Error('请输入消费金额或消费金额不能小于等于0'));
                    }

                    if(!subPrice || subPrice <= 0){
                        return callback(new Error('请输入满减金额或满减金额不能小于等于0'));
                    }

                    if (this.form.is_not_allow_balance_pay == 1 && subPrice == minPrice) {
                        return callback(new Error('开启不允许叠加余额支付满减后金额不能等于0'));
                    }

                    if(subPrice > minPrice){
                        return callback(new Error('满减金额不能大于消费金额'));
                    }
                    callback();
                }
            };
            var check_discount_limit = (rule, value, callback) => {
                if (this.form.type == 4) {
                    return callback();
                }

                if (this.form.type == 1) {
                    if (this.is_discount_limit && !this.form.discount_limit) {
                        return callback(new Error('请填写优惠限额'));
                    }
                    callback();
                } else {
                    callback();
                }
            };
            var check_expire_type = (rule, value, callback) => {

                if (this.form.expire_type == 1) {
                    if(!this.form.expire_day){
                        return callback(new Error('请填写有效天数'));
                    } else if(Number(this.form.expire_day) < 1){
                        return callback(new Error('领券后立即生效，有效天数不能小于1'));
                    }
                    callback();
                } else if (this.form.expire_type == 2 && !this.expire_time.length) {
                    return callback(new Error('请选择有效期起止时间'));
                } else if (this.form.expire_type == 3) {
                    if (!this.form.effect_days) {
                        return callback(new Error('请填写生效的延后天数'));
                    }
                    if (!this.form.effect_expire_days) {
                        return callback(new Error('请填写有效天数'));
                    } else if(Number(this.form.effect_expire_days) < 1){
                        return callback(new Error('领券后立即生效，有效天数不能小于1'));
                    }
                    callback();
                } else {
                    callback();
                }
            };
            var check_appoint_type = (rule, value, callback) => {
                if (this.form.appoint_type == 2 && !this.goods_id_list) {
                    return callback(new Error('请选择指定商品'));
                } else if (this.form.appoint_type == 1 && !this.cat_id_list.length) {
                    return callback(new Error('请选择指定的商品分类'));
                } else if (this.form.appoint_type == 4 && !this.store_list) {
                    return callback(new Error('请选择指定的门店'));
                }  else if (this.form.appoint_type == 6 && !this.store_goods_id_list) {
                    return callback(new Error('请选择指定门店商品'));
                } else {
                    callback();
                }
            };
            var check_is_member = (rule, value, callback) => {
                if (this.form.is_member == 1 && !this.member_level_limits.length) {
                    return callback(new Error('请选择会员等级'));
                } else {
                    callback();
                }
            };
            var total_count_t = (rule, value, callback) => {
                if(value <= 0){
                    return callback(new Error('发放总数不能小于1'));
                }
                callback();
            };
            var remind_days = (rule, value, callback) => {
                if(this.form.is_remind == 1 && value <= 0){
                    return callback(new Error('过期前提醒天数不能小于 0'));
                }
                callback();
            };
            return {
                goods_status: -1,
                //添加商品
                pagination: null,
                pageCount: 1,
                currPage: 1,

                // 添加门店商品
                store_goods_list: [],
                storePagination: [],
                storePageCount: 1,

                paginations: null,
                pageCounts: 1,

                goodsListVisible: false,
                goodsAddVisible: false,
                storeGoodsAddVisible: false,
                goodsBatchList: [],
                storeGoodsBatchList: [],
                //添加分类
                catsListVisible: false,
                defaultProps: {
                    children: 'child',
                    label: 'name'
                },

                activeName: 'first',
                form: {
                    store_id: 0,
                    name: '',
                    type: 2,
                    discount: '',
                    discount_limit: '',
                    min_price: '',
                    give_time:0,
                    sub_price: '',
                    total_count: 9999,
                    sort: 99,
                    expire_type: 1,
                    expire_day: 30,
                    effect_expire_days: 30,
                    begin_at: 0,
                    end_at: 0,
                    appoint_type: 3,
                    rule: '',
                    is_remind: 0,
                    remind_days: 3,
                    effect_days: 3,
                    is_receive_limit: 1,
                    receive_count: 1,
                    is_member: 0,
                    is_original_use: 0,
                    is_public_receive: 1,
                    is_giving: 0,
                    giving_expire: '',
                    is_giving_reward: 0,
                    is_consume_reward: 0,
                    is_open_screen: 0,
                    goods_id_list: [],
                    store_goods_id_list: [],
                    is_superposition_use: 0,
                    is_not_allow_balance_pay: 0,
                    is_giving_use: 0,
                    day_limit: 1,
                },
                btnLoading: false,
                submitLoading: false,
                loading: false,
                cats_list: [],
                goods_list: [],
                cat: [],
                keyword: null,
                store_keyword: null,
                time: [],
                goods: [],
                cat_id: null,
                goods_id: null,
                cat_id_list: [
                    // [21, 69],
                    // [21, 70],
                    // [21, 228, 229]
                ],      // 已经选中的商品分类
                checkAll: false,
                couponMember: [],
                membersList: [],
                isIndeterminate: false,
                FormRules: {
                    name: [{ required: true, message: '优惠券名称不能为空', trigger: 'blur' }],
                    type: [{ required: true, message: '请选择优惠券类型', trigger: 'blur' }],
                    // total_count:[{required: true, message: '请填写优惠券数量', trigger: 'blur'}],
                    // min_price: [{ required: true, message: '最低消费金额不能为空', trigger: 'blur' }],
                    min_price: [{ validator: check_min_price, trigger: 'blur' }, ],
                    sub_price: [{ validator: check_sub_price, trigger: 'blur' }, ],
                    discount: [{required: true,validator: check_discount, trigger: 'blur' },],
                    discount_limit: [{required: true,validator: check_discount_limit, trigger: 'blur' }],
                    expire_type: [{ required: true, message: '请选择优惠券生效方式', trigger: 'blur'}, {validator: check_expire_type, trigger: 'blur' }],
                    // expire_day: [{ required: true, message: '优惠券有效天数不能为空', trigger: 'blur' }],
                    appoint_type: [{ required: true, message: '请选择优惠券使用场景', trigger: 'blur'}, {validator: check_appoint_type, trigger: 'blur' }],
                    total_count: [{ required: true, message: '发放总数不能为空', trigger: 'blur' },{ validator: total_count_t, trigger: 'blur' }],
                    receive_count: [{ required: true, message: '请填写每人可领取的数量', trigger: 'blur' }],
                    sort: [{ required: true, pattern: /^[0-9]\d{0,8}$/, message: '排序必须在9位整数内' }],
                    remind_days: [{validator: remind_days, trigger: 'blur' }],
                },
                receive: [],
                isScanCodePayShow: false,
                activeNames: true,

                is_discount_limit: 0,  // 是否限制折扣上限
                member_level_limits: [],  // 限制领取的等级
                member_levels: [],      // 全部的会员等级
                member_check_all: false,    // 会员全选
                goods_id_list: [],  // 已选中的商品 id
                store_goods_id_list: [],  // 已选中的门店商品 id
                selected_goods: [],     // 已经选中的商品信息
                selected_store_goods: [],     // 已经选中的门店商品信息
                expire_time: [],    // 有效期起止时间
                giving_reward: {    // 转赠奖励
                    balance: 0, score: 0, red_packet: 0
                },
                consume_reward: {   // 使用奖励
                    balance: 0, score: 0, red_packet: 0
                },
                expire_day: 1,     // 有效期天数
                is_can_change_time: false,   // 是否可以更改时间
                is_can_edit: true,     // 整个页面是否可以编辑
                coupon_id: 0,   // 优惠券id
                coupon_name: '',    // 暂存自动生成的优惠券名称

                storeList: [],         // 门店列表
                selectedStores: [],     // 已选中门店
                storeAddVisible: false,
                store_list:[],
                mch_list:[],
                addons_store :false,
                addons_mch :false
            };
        },
        methods: {
            enter(index) {
                this.goods_status = index;
            },
            leave() {
                this.goods_status = -1;
            },
            catDestroy(index) {
                this.cat_id_list.splice(index, 1);
                this.form.cat.splice(index, 1);
            },

            handleCheckAllChange(value) {
                if (value) {
                    let checked_levels = [];
                    let number = this.member_levels.length;
                    for (let i = 0; i < number; i++) {
                        checked_levels.push(this.member_levels[i].level);
                    }
                    this.member_level_limits = checked_levels;
                } else {
                    this.member_level_limits = [];
                }
                this.isIndeterminate = false;
            },
            handleCheckedMemberChange(value) {
                let checkedCount = value.length;
                this.member_check_all = checkedCount === this.member_levels.length;
                this.isIndeterminate = checkedCount > 0 && checkedCount < this.member_levels.length;
            },
            //分页
            pageChange(page) {
                this.currPage = page;
                this.search('coupon/coupon/search-goods', 'goods', page, false);
            },
            storeGoodsPageChange(page) {
                this.currPage = page;
                this.storeSearch('coupon/coupon/search-store-goods','store_goods', page, false)
            },
            storePageChange(page) {
                this.currPage = page;
                this.searchStore();
            },

            catsAdd() {
                let cat_id_list = this.$refs.tree.getCheckedKeys();
                this.cat_id_list = cat_id_list;
                let array = [];
                this.cats.map(v => {
                    if (cat_id_list.indexOf(v.id) != -1) {
                        array.push(v);
                    }
                    v.child.map(v1 => {
                        if (cat_id_list.indexOf(v1.id) != -1) {
                            array.push(v1);
                        }
                        v1.child.map(v2 => {
                            if (cat_id_list.indexOf(v2.id) != -1) {
                                array.push(v2);
                            }
                        })
                    })
                })
                this.form.cat = array;
                this.$message({
                    message: '添加成功',
                    type: 'success'
                });

                this.catsListVisible = false;
            },
            //指定商品
            goodsDestroy(index) {
                this.goods_id_list.splice(index, 1);
                this.selected_goods.splice(index, 1);
            },
            storeGoodsDestroy(index) {
                this.store_goods_id_list.splice(index, 1);
                this.selected_store_goods.splice(index, 1);
            },
            selsChange(row) {
                this.goodsBatchList = row;
            },
            goodsBatchAdd() {
                if (this.goodsBatchList.length === 0) {
                    this.$message.error('请勾选需要的商品')
                    return
                }

                this.goodsBatchList.forEach(goods => {
                    this.setGoods(goods);
                })
                this.goodsAddVisible = false;
            },
            storeGoodsSelsChange(row) {
                this.storeGoodsBatchList = row;
            },
            storeGoodsBatchAdd() {
                if (this.storeGoodsBatchList.length === 0) {
                    this.$message.error('请勾选需要的商品')
                    return
                }
                
                this.storeGoodsBatchList.forEach(goods => {
                    this.setStoreGoods(goods);
                })
                this.storeGoodsAddVisible = false;
            },
            goodsAdd(index, row) {
                let goods = this.goods_list[index];
                this.setGoods(goods);
                this.goodsAddVisible = false;
            },
            storeGoodsAdd(index, row) {
                let goods = this.store_goods_list[index];
                this.setStoreGoods(goods);
                this.storeGoodsAddVisible = false;
            },
            storeAdd(index, row) {
                let store = this.storeList[index];
                this.form.store_id = store.id;
                this.selectedStores = [];
                this.selectedStores.push(store);
                this.storeAddVisible = false;
            },
            storeDestroy(index) {
                this.form.store_id = 0;
                this.selectedStores = [];
            },

            setGoods(goods) {
                let sentinel = true;
                this.selected_goods.forEach(v => {
                    if (v.id == goods.goods_id) {
                        sentinel = false;
                    }
                })
                if (sentinel) {
                    this.selected_goods.push(goods);
                    this.goods_id_list.push(goods.goods_id);
                    // this.$message({
                    //     message: '添加成功',
                    //     type: 'success'
                    // });
                    // this.goodsAddVisible = false;
                }
            },

            setStoreGoods(goods) {
                let sentinel = true;
                this.selected_store_goods.forEach(v => {
                    if (v.goods_id == goods.goods_id) {
                        sentinel = false;
                    }
                })
                if (sentinel) {
                    this.selected_store_goods.push(goods);
                    this.store_goods_id_list.push(goods.goods_id);
                    // this.$message({
                    //     message: '添加成功',
                    //     type: 'success'
                    // });
                    // this.goodsAddVisible = false;
                }
            },
            //分类
            catsDestroy(index, row) {
                this.form.cat.splice(index, 1);
            },
            // 返回上一页
            Cancel() {
                window.history.go(-1)
            },

            // 点击获取商品分类列表或者商品列表
            search(url, attr, page = 1, resetPage = true) {
                this.btnLoading = true;
                if (attr == 'goods' && resetPage) {
                    this.currPage = 1
                }
                request({
                    params: {
                        r: url,
                        keyword: this.keyword,
                        page: this.currPage,
                        limit: 7,
                    },
                }).then(e => {
                    this.btnLoading = false;
                    if (e.data.code == 0) {
                        if (attr == 'cats') {
                            this.cats_list = e.data.data.list;
                        } else if (attr == 'goods') {
                            this.goods_list = e.data.data.list;
                            this.pagination = e.data.data.pagination;
                            this.pageCount = e.data.data.page_count;
                        } else if (attr == 'store_goods') {
                            this.store_goods_list = e.data.data.list;
                            this.storePagination = e.data.data.pagination;
                            this.storePageCount = e.data.data.page_count;
                        }
                    }
                }).catch(e => {
                    this.btnLoading = false;
                });
            },
            // 点击获取商品分类列表或者商品列表
            storeSearch(url, attr, page = 1, resetPage = true) {
                this.btnLoading = true;
                if (resetPage) {
                    this.currPage = 1
                }
                request({
                    params: {
                        r: url,
                        keyword: this.keyword,
                        store_keyword: this.store_keyword,
                        exclude_ids: this.store_goods_id_list,
                        page: this.currPage,
                        limit: 7,
                    },
                }).then(e => {
                    this.btnLoading = false;
                    if (e.data.code == 0) {
                        this.store_goods_list = e.data.data.list;
                        this.storePagination = e.data.data.pagination;
                        this.storePageCount = e.data.data.page_count;
                    }
                }).catch(e => {
                    this.btnLoading = false;
                });
            },
            // 所搜门店列表
            searchStore() {
                this.btnLoading = true;
                request({
                    params: {
                        r: 'coupon/coupon/search-stores',
                        keyword: this.keyword,
                        page: this.currPage,
                        limit: 7,
                    },
                }).then(e => {
                    this.btnLoading = false;
                    if (e.data.code == 0) {
                        this.storeList = e.data.data.list;
                        this.paginations = e.data.data.pagination;
                        this.pageCounts = e.data.data.page_count;
                    } else {
                        this.$message.error(e.data.msg);
                        return false;
                    }
                }).catch(e => {
                    this.btnLoading = false;
                    console.log(e);
                    this.$message.error('网络错误');
                });
            },
            // 选中门店
            storeSelectChange(val) {
                console.log(val, 'storeSelectChange =============== ');
            },

            // 提交数据
            onSubmit() {
                // console.log(this.member_level_limits);return null;
                let self = this;
                if (self.form.is_giving) {
                    self.form.is_giving = 1;
                } else {
                    self.form.is_giving = 0;
                }
                if (self.form.is_original_use) {
                    self.form.is_original_use = 1;
                } else {
                    self.form.is_original_use = 0;
                }
                if (self.form.is_remind) {
                    self.form.is_remind = 1;
                } else {
                    self.form.is_remind = 0;
                    self.form.remind_days = 0;
                }
                if (!self.form.discount) {
                    self.form.discount = 0;
                }
                if (!self.form.discount_limit || self.form.discount_limit < 0) {
                    self.form.discount_limit = 0;
                }
                if (!self.form.min_price) {
                    self.form.min_price = 0;
                }
                if (!self.form.sub_price) {
                    self.form.sub_price = 0;
                }
                if (self.form.appoint_type == 4 || self.form.appoint_type == 5 ) {
                    self.form.is_consume_reward = 0;
                    self.form.is_giving_reward = 0;
                    self.giving_reward.balance = 0;
                    self.giving_reward.score = 0;
                    self.giving_reward.red_packet = 0;
                    self.consume_reward.balance = 0;
                    self.consume_reward.score = 0;
                    self.consume_reward.red_packet = 0;
                }
                if (self.form.is_remind == 1 && self.form.remind_days <= 0) {
                    self.$message.error('过期前提醒天数不能小于 0');
                    return false;
                }
                if (getQuery('is_copy')) {
                    self.form.id = 0;
                }
                // let newCatList = [];
                // self.cat_id_list.forEach(v => {
                //     newCatList.push([v]);
                // })

                if(self.form.expire_type == 3){
                    self.form.expire_day = self.form.effect_expire_days;
                }

                self.$refs.form.validate((valid, obj) => {
                    // console.log(valid, obj);return null;
                    // console.log(self.form, self.member_level_limits, self.goods_id_list, self.giving_reward, self.consume_reward, self.cat_id_list);return null;
                    if (valid) {
                        self.submitLoading = true;
                        request({
                            params: {
                                r: 'coupon/default/edit',
                            },
                            data: {
                                coupon_info: self.form,
                                member_level_limits: self.member_level_limits,
                                goods_id_list: self.goods_id_list,
                                store_goods_id_list: self.store_goods_id_list,
                                giving_reward: self.giving_reward,
                                consume_reward: self.consume_reward,
                                category_ids: self.cat_id_list,
                                store_list: self.store_list,
                                mch_list: self.mch_list,
                            },
                            method: 'post'
                        }).then(e => {
                            self.submitLoading = false;
                            if (e.data.code === 0) {
                                self.$message({
                                    message: e.data.msg,
                                    type: 'success'
                                });
                                setTimeout(function() {
                                    navigateTo({ r: 'coupon/default/index' });
                                }, 500);

                            } else {
                                self.$message.error(e.data.msg);
                            }
                        }).catch(e => {
                            self.submitLoading = false;
                            console.log(e);
                            self.$message.error(e.data.msg)
                        });
                    } else {
                        console.log('validate result: ', obj);
                        self.loading = false;
                    }
                });
            },

            //获取列表
            getList() {
                this.loading = true;
                let self = this;
                request({
                    params: {
                        r: 'coupon/coupon/coupon-info',
                        coupon_id: this.coupon_id,
                    },
                }).then(e => {
                    console.log(e);
                    self.loading = false;
                    if (e.data.code == 0) {
                        if (this.coupon_id) {
                            self.form = {...this.form, ...e.data.data.coupon_info};
                            if (self.form.expire_type == 2) {
                                self.expire_time.push(self.form.begin_at*1000);
                                self.expire_time.push(self.form.end_at*1000);
                            } else if (self.form.expire_type == 3) {
                                self.form.effect_expire_days = self.form.expire_day;
                            }

                            if (e.data.data.coupon_info.type == 1 && e.data.data.coupon_info.discount_limit) {
                                self.is_discount_limit = 1;
                            }
                            if (e.data.data.member_level_limits) {
                                self.member_level_limits = e.data.data.member_level_limits;
                            }
                            if (e.data.data.good_lists) {
                                self.selected_goods = e.data.data.good_lists;
                            }
                            if (e.data.data.store_goods_lists) {
                                self.selected_store_goods = e.data.data.store_goods_lists;
                            }
                            if (e.data.data.giving_rewards) {
                                self.giving_reward = e.data.data.giving_rewards;
                            }
                            if (e.data.data.consume_rewards) {
                                self.consume_reward = e.data.data.consume_rewards;
                            }
                            e.data.data.checked_categorys.forEach(v => {
                                self.cat_id_list.push(v[0])
                            })
                            if (e.data.data.goods_id_list) {
                                this.goods_id_list = e.data.data.goods_id_list;
                            }
                            if (e.data.data.store_goods_id_list) {
                                this.store_goods_id_list = e.data.data.store_goods_id_list;
                            }
                            if (e.data.data.store.length) {
                                this.selectedStores = e.data.data.store;
                            }
                        }
                        self.member_levels = e.data.data.member_levels;
                        self.cats_list = e.data.data.good_categorys;
                        self.store_list = e.data.data.store_list;
                        self.mch_list = e.data.data.mch_list;
                        self.addons_store = e.data.data.addons_store;
                        self.addons_mch = e.data.data.addons_mch;
                    } else {
                        self.$message.error(e.data.msg);
                    }

                    if (self.status == 3 || self.status == 4) {
                        // 锁定整个页面，不可修改
                        self.is_can_edit = false;
                        self.$nextTick(() => {
                            let domArr = document.getElementsByTagName('input');
                            let domTextarea = document.getElementsByTagName('textarea');
                            let conponType = document.getElementsByClassName('coupon-type');
                            for(let i = 0; i < domArr.length;i++){
                                domArr[i].setAttribute("disabled",true);
                                domArr[i].parentNode.classList.add("is-disabled");
                            }
                            for(let i = 0; i < domTextarea.length;i++){
                                domTextarea[i].setAttribute("disabled",true);
                                domTextarea[i].parentNode.classList.add("is-disabled");
                            }
                            for (let i = 0; i < conponType.length; i++) {
                                conponType[i].setAttribute('style', 'cursor:not-allowed');

                            }

                        })
                    }
                }).catch(e => {
                    console.log(e);
                    this.$message.error('网络错误');
                });
            },

            // 选中时间处理方法
            select_expire_time(date) {
                console.log(date,"dateUUUU");
                this.form.begin_at = parseInt(date[0] / 1000);
                this.form.end_at = parseInt(date[1] / 1000);
            },
            // 优惠限额选中/取消处理方法
            discount_limit_change(val) {
                if (!val) {
                    this.form.discount_limit = 0;
                }
                this.handleDiscountLimit(this.form.discount_limit);
            },
            // 选中优惠券类型
            selectType(type) {
                if (this.is_can_edit) {
                    // 兑换券只有两种适用范围，如果不是这两种适用范围则设置为允许的适用范围
                    if (type == 4 && !([2, 6].includes(this.form.appoint_type))) {
                        this.form.appoint_type = 2
                    }

                    let name = '';
                    this.form.type = type;
                    this.form.name = '';
                    if (!this.form.min_price) {
                        this.form.min_price = '';
                    } else {
                        name += '消费满' + this.form.min_price + '元';
                    }
                    if (!this.form.sub_price) {
                        this.form.sub_price = '';
                    } else {
                        if (this.form.type == 2) name += '优惠' + this.form.sub_price + '元';
                    }
                    if (!this.form.discount) {
                        this.form.discount = '';
                    } else {
                        if (this.form.type == 1) name += '打' + this.form.discount + '折';
                    }
                    if (!this.form.discount_limit) {
                        this.form.discount_limit = '';
                    } else {
                        if (this.form.is_discount_limit && this.form.type == 1) {
                            name += '最多优惠' + this.form.discount_limit + '元';
                        }
                    }
                    this.form.name = name;
                    this.is_discount_limit = false;
                }
            },
            // 最低消费金额值改变
            handleMinPrice(val) {
                if (!val) {
                    return ;
                }
                let coupon_name = '';
                coupon_name = '消费满' + val + '元';
                if (this.form.type == 1) {
                    // 折扣券
                    if (this.form.discount) {
                        coupon_name += '打' . this.form.discount + '折'
                    }
                } else {
                    // 满减券
                    if (this.form.sub_price) {
                        coupon_name += '减' + this.form.sub_price + '元';
                    }
                }
                this.form.name = coupon_name;
            },
            // 满减券减免金额 / 折扣券折扣
            handleSubPrice(val) {
                let min_price = this.form.min_price;
                let coupon_name = '消费满' + min_price + '元';
                if (this.form.type == 1) {
                    // 折扣券
                    if (this.form.discount) {
                        coupon_name += '打' + this.form.discount + '折';
                    }
                } else {
                    // 满减券
                    if (min_price) {
                        coupon_name += '减' + this.form.sub_price + '元';
                    }
                }
                this.form.name = coupon_name;
            },
            // 最高优惠金额
            handleDiscountLimit(val) {
                let coupon_name = '';
                if (this.form.type == 1 && this.form.min_price && this.form.discount) {
                    coupon_name = '消费满' + this.form.min_price + '元打 ' + this.form.discount + '折';
                    // 折扣券
                    if (this.is_discount_limit && val) {
                        coupon_name += ', 最高优惠' + val + '元';
                    }
                    this.form.name = coupon_name;
                }
            },
             // 数值类型不让输入小于0
             numForm(val,key,type = 'int',valueKey){
                console.info(val,type)
                let reg = /^[0-9]*$/;
                let point = val.indexOf(".");
                let regT = /[0-9]+|\./;
                let tIndex = -1;
                for(let j = 0;j < val.length; j++){
                    if(!regT.test(val[j])){
                        tIndex = j;
                        break;
                    }
                }
                if(tIndex != -1){
                    val = val.substr(0,tIndex);
                }

                if(val < 0){
                    val = 0;
                }else if(!reg.test(val) && type == 'int'){
                    val = val.substr(0,point);
                } else if(type == 'double'){
                    let doubleReg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;
                    let pointIndex = val.lastIndexOf(".");
                    if(pointIndex != -1 && point != pointIndex){
                        val = val.substr(0,pointIndex)
                    }

                    if(pointIndex != -1 && !doubleReg.test(val) && pointIndex != val.length){
                        val = val.substr(0,point + 3);
                    }

                }

                //
                if(valueKey){
                    this[valueKey][key] = val;
                }else{
                    this.form[key] = val;
                }

            },
            blurNumForm(valueKey,key){
                let val = this[valueKey][key];
                if(!val){
                    this[valueKey][key] = 0;
                }
            },
            //
            updateGiving(val){
                if(val == 0 && this.form.is_giving_reward == 1){
                    this.form.is_giving_reward = 0;
                }
            },
            storeSelect(param) {
                for (let i = 0; i < param.length; i++) {
                    if (i > 14) {
                        break;
                    }
                    var in_is = 0;
                    for(let j=0;j<this.store_list.length; j++){
                        if(this.store_list[j].id == param[i]['id']){
                            in_is = 1;
                            break;
                        }
                    }
                    if(in_is!=1){
                        this.store_list.push(JSON.parse(JSON.stringify({
                            store_name: param[i]['store_name'], id: param[i]['id'], logo_img: param[i]['logo_img']
                        })));
                    }
                }
            },
            mchSelect(param){
                for (let i = 0; i < param.length; i++) {
                    if (i > 14) {
                        break;
                    }
                    var in_is = 0;
                    for(let j=0;j<this.mch_list.length; j++){
                        if(this.mch_list[j].id == param[i]['id']){
                            in_is = 1;
                            break;
                        }
                    }
                    if(in_is!=1){
                        this.mch_list.push(JSON.parse(JSON.stringify({
                            store_name: param[i]['store_name'], id: param[i]['id'], logo_img: param[i]['logo_img']
                        })));
                    }
                }
            },
            handle(type, param1 = null, param2 = null) {
                switch(type) {
                    case 'deleteStore':
                        this.store_list.splice(param1,1);
                        break;
                        case 'deleteMch':
                        this.mch_list.splice(param1,1);
                        break;
                    case 'store_select':
                        this.storeLoading = true;
                        break;
                }
            },
            /**
             * 判断是否显示优惠券叠加
             */
            isShowSuperpositionUse() {
                if (this.form.appoint_type == 1 && this.form.type == 2) return true
                if (this.form.appoint_type == 2 && this.form.type == 2) return true
                if (this.form.appoint_type == 3 && this.form.type == 2) return true
                return false
            },

            delSelectGoods() {
                const selectGoodsList = this.$refs['selectedGoodsRef']?.selection ?? []
                if (selectGoodsList.length === 0) {
                    this.$message.error('请勾选需要删除的商品')
                    return
                }

                for (const item of selectGoodsList) {
                    const index = this.goods_id_list.indexOf(item.goods_id)
                    if (index !== -1) {
                        this.goods_id_list.splice(index, 1);
                    }

                    for (const selectedGoodsKey in this.selected_goods) {
                        if (this.selected_goods[selectedGoodsKey].goods_id == item.goods_id) {
                            this.selected_goods.splice(selectedGoodsKey, 1)
                            break
                        }
                    }
                }
            },

            delSelectStoreGoods() {
                const selectGoodsList = this.$refs['selectedStoreGoodsRef']?.selection ?? []
                if (selectGoodsList.length === 0) {
                    this.$message.error('请勾选需要删除的商品')
                    return
                }

                for (const item of selectGoodsList) {
                    const index = this.store_goods_id_list.indexOf(item.goods_id)
                    if (index !== -1) {
                        this.store_goods_id_list.splice(index, 1);
                    }

                    for (const selectedStoreGoodsKey in this.selected_store_goods) {
                        if (this.selected_store_goods[selectedStoreGoodsKey].goods_id == item.goods_id) {
                            this.selected_store_goods.splice(selectedStoreGoodsKey, 1)
                            break
                        }
                    }
                }
            },
            resetGoodsSearch() {
                this.keyword = ''
                this.search('coupon/coupon/search-goods','goods')
            },
            resetStoreGoodsSearch() {
                this.store_keyword = ''
                this.keyword = ''
                this.storeSearch('coupon/coupon/search-store-goods','store_goods')
            }
        },


        mounted: function() {
            this.coupon_id = getQuery('coupon_id');
            let is_copy = getQuery('is_copy');
            if (this.coupon_id && !is_copy) {
                this.is_can_change_time = true;
            }
            this.status = getQuery('status');
            if (this.status == 3 || this.status == 4) {
                this.is_can_edit = false;
            }

            this.search('coupon/coupon/search-goods', 'goods');
            this.storeSearch('coupon/coupon/search-store-goods','store_goods')
            this.getList();
            // this.getPermsssions();

            this.searchStore();
        },
        watch: {
            'form.appoint_type': function (n) {
                // 选择门店和多商户时 优惠券叠加不可使用
                if (n == 4) this.form.is_superposition_use = 0
                if (n == 5) this.form.is_superposition_use = 0
            },
            'form.type': function (n) {
                // 折扣券时 优惠券叠加不可使用
                if (n == 1) this.form.is_superposition_use = 0
            },
        }
    })
</script>

<style>
    .store_goods_from .el-form-item {
        padding-right: 0;
    }
</style>