文件

2674 行
136 KiB
HTML
可执行文件

此文件含有模棱两可的 Unicode 字符

此文件含有可能会与其他字符混淆的 Unicode 字符。 如果您是想特意这样的,可以安全地忽略该警告。 使用 Escape 按钮显示他们。

<!doctype html>
<html>
<!--[1.8.72]-->
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>营销次卡</title>
<link rel="stylesheet" type="text/css" href="__PUBLIC__/vue/element-ui.css">
<link rel="stylesheet" href="__PUBLIC__/css/system-gallery.css?v=1.0.3">
<script src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="__PUBLIC__/vue/js/vue2.5.16.js"></script>
<script type="text/javascript" charset="utf-8" src="__PUBLIC__/vue/element-ui.js"></script>
<script charset="utf-8" src="__PUBLIC__/js/system-gallery.js?v=1.0.3"></script>
<style>
[v-cloak] {
display: none;
}
.content-table {
width: 100%;
height: 50px;
text-indent: 35px;
line-height: 50px;
border-bottom: 1px solid #e5e5e5;
color: #409EFF;
font-weight: bold;
font-size: 15px;
margin-bottom: 20px;
}
.title {
width: 100%;
padding-bottom: 10px;
border-bottom: 1px solid #e5e5e5;
color: #409EFF;
font-weight: bold;
margin-bottom: 10px;
}
.tip {
padding: 1px 25px;
background-color: #ecf8ff;
border-radius: 4px;
border-left: 5px solid #50bfff;
margin-bottom: 10px;
}
.store {
margin: 2px 5px;
border: 1px solid #e5e5e5;
padding: 0px 8px;
white-space: nowrap;
}
.vip_search {
padding-top: 8px;
padding-bottom: 8px;
border-top: 1px solid #dcdfe6;
border-left: 1px solid #dcdfe6;
border-right: 1px solid #dcdfe6;
padding-left: 10px;
/*text-align: right;*/
}
.text_area {
width: 100%;
}
.el-dropdown-link {
cursor: pointer;
color: #409EFF;
font-size: 12px;
}
.image_label {
padding: 10px 20px;
width: 400px;
height: 200px;
}
.image_label > img {
width: 100%;
height: 100%;
border-radius: 5px;
}
.button_label {
padding: 10px 0px;
}
.fileinput-button {
position: relative;
display: inline-block;
overflow: hidden;
}
.file_image {
position: absolute;
left: 0px;
top: 0px;
opacity: 0;
-ms-filter: 'alpha(opacity=0)';
}
.span-tips {
color: #EF0F15FF;
font-size: 12px;
margin-left: 10px;
}
</style>
</head>
<body>
<div id="app" v-cloak>
<!-- 次卡,卡包展示 -->
<el-tabs v-model="card_mold" type="border-card" @tab-click="cardMoldChange">
<el-tab-pane label="次卡" name="1">
<el-form ref="form" style="padding: 10px 0px;">
<el-input v-model="seek_data.name" placeholder="次卡名称" size="small" clearable
style="width: 220px;margin-right: 10px;"></el-input>
<el-select v-model="seek_data.type" size="small" clearable placeholder="类型搜索"
style="margin-right: 10px;">
<el-option value="1" label="自主发放"></el-option>
<el-option value="2" label="充值赠送"></el-option>
<el-option value="3" label="消费赠送"></el-option>
<el-option value="4" label="门店购买"></el-option>
<el-option value="5" label="门店消费指定商品"></el-option>
</el-select>
<el-date-picker v-model="seek_data.start_time" type="datetime" size="small" :editable="false"
:clearable="false" placeholder="创建时间(起)" value-format="yyyy-MM-dd HH:mm:ss"
align="right">
</el-date-picker>
<span style="color:#c6c6c6;">-</span>
<el-date-picker v-model="seek_data.end_time" type="datetime" size="small" :editable="false"
:clearable="false" placeholder="创建时间(止)" value-format="yyyy-MM-dd HH:mm:ss"
align="right">
</el-date-picker>
<el-button type="primary" @click="searchCard" size="small">搜索</el-button>
<if condition="$authArr['getStoreListAndVipGrade']">
<el-button type="primary" @click="getStoreListAndVipGrade" size="small">新建</el-button>
</if>
</el-form>
<el-tabs v-model="card_state" @tab-click="searchCard" style="padding: 10px 0px;">
<el-tab-pane label="全部" name="1"></el-tab-pane>
<el-tab-pane label="进行中" name="2"></el-tab-pane>
<el-tab-pane label="已结束" name="3"></el-tab-pane>
</el-tabs>
<el-table border :data="sub_card" size="mini" max-height="450">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="次卡名称" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="stock" label="发放总量" width="120" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="surplus" label="剩余" width="120" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="use_rule" label="使用规则" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="time_interval" label="可用时段" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="addtime" label="创建时间" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="end_time" label="发放截止日期" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="effective_time" label="有效使用日期" :show-overflow-tooltip="true" width="170">
</el-table-column>
<el-table-column property="type_name" label="次卡类型" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="status_name" label="状态" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="操作" width="140" fixed="right">
<template slot-scope="scope">
<if condition="$authArr['subCardRecord']">
<el-button type="text" size="mini" @click="showRecord(scope.row.id)">记录</el-button>
</if>
<el-dropdown trigger="click" style="margin-left: 10px;">
<span class="el-dropdown-link">更多操作</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>
<el-button type="text" size="mini" @click="getGiveDetails(scope.row.id)">
次卡详情
</el-button>
</el-dropdown-item>
<if condition="$authArr['getVips']">
<el-dropdown-item v-if="scope.row.status == 0 && scope.row.type == 1">
<el-button type="text" size="mini"
@click="getVips(scope.row.id,scope.row.storeids,scope.row.gradeids)">
批量投放
</el-button>
</el-dropdown-item>
</if>
<if condition="$authArr['getSendOutVipList']">
<el-dropdown-item v-if="scope.row.status == 0 && scope.row.type == 1">
<el-button type="text" size="mini"
@click="depositVipMap(scope.row.id,scope.row.storeids,scope.row.gradeids)">
指定投放
</el-button>
</el-dropdown-item>
</if>
<if condition="$authArr['getCardImage']">
<el-dropdown-item>
<el-button type="text" size="mini" @click="getCardImage(scope.row.id,1)">
卡面图片
</el-button>
</el-dropdown-item>
</if>
<if condition="$authArr['invalidSubCard']">
<el-dropdown-item v-if="scope.row.status == 0">
<el-button type="text" size="mini" @click="invalidSubCard(scope.row.id)">
使失效
</el-button>
</el-dropdown-item>
</if>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="limitChange" @current-change="pageChange" :current-page="page"
:page-size="limit" :total="total" :pager-count="5"
:page-sizes="[10,20,30,40,50,60,70,80,90,100]"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</el-tab-pane>
<el-tab-pane label="卡包" name="2">
<el-form style="padding: 10px 0px;">
<el-input v-model="seek_data.name" placeholder="请输入卡包名称" size="small" clearable
style="width: 220px;margin-right: 10px;"></el-input>
<el-select v-model="seek_data.type" size="small" clearable placeholder="类型搜索"
style="margin-right: 10px;">
<el-option value="1" label="自主发放"></el-option>
<el-option value="2" label="充值赠送"></el-option>
<el-option value="3" label="消费赠送"></el-option>
<el-option value="4" label="门店购买"></el-option>
<el-option value="5" label="门店消费指定商品"></el-option>
</el-select>
<el-date-picker v-model="seek_data.start_time" type="datetime" size="small" placeholder="创建时间(起)"
value-format="yyyy-MM-dd HH:mm:ss" align="right">
</el-date-picker>
<span style="color:#c6c6c6">-</span>
<el-date-picker v-model="seek_data.end_time" type="datetime" size="small" placeholder="创建时间(止)"
value-format="yyyy-MM-dd HH:mm:ss" align="right">
</el-date-picker>
<el-button type="primary" @click="searchCard" size="small">搜索</el-button>
<el-button type="primary" @click="getStoreListAndVipGrade" size="small">新建</el-button>
</el-form>
<el-tabs v-model="card_state" @tab-click="searchCard" style="padding: 10px 0px;">
<el-tab-pane label="全部" name="1"></el-tab-pane>
<el-tab-pane label="进行中" name="2"></el-tab-pane>
<el-tab-pane label="已结束" name="3"></el-tab-pane>
</el-tabs>
<el-table border :data="card_bag" size="mini" max-height="450">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="卡包名称" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="stock" label="发放总量" width="120" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="surplus" label="剩余" width="120" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="addtime" label="创建时间" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="end_time" label="发放截止日期" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="type_name" label="卡包类型" width="160" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="status_name" label="状态" width="160" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column label="操作" width="160" fixed="right">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="showRecord(scope.row.id)">记录</el-button>
<el-dropdown trigger="click" style="margin-left: 10px;">
<span class="el-dropdown-link">更多操作</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>
<el-button type="text" size="mini" @click="getGiveDetails(scope.row.id)">
卡包详情
</el-button>
</el-dropdown-item>
<el-dropdown-item>
<el-button type="text" size="mini" @click="cardBagDetails(scope.row.id)">次卡详情
</el-button>
</el-dropdown-item>
<el-dropdown-item v-if="scope.row.status == 0 && scope.row.type == 1">
<el-button type="text" size="mini"
@click="getVips(scope.row.id,scope.row.storeids,scope.row.gradeids)">批量投放
</el-button>
</el-dropdown-item>
<el-dropdown-item v-if="scope.row.status == 0 && scope.row.type == 1">
<el-button type="text" size="mini"
@click="depositVipMap(scope.row.id,scope.row.storeids,scope.row.gradeids)">
指定投放
</el-button>
</el-dropdown-item>
<if condition="$authArr['getCardImage']">
<el-dropdown-item>
<el-button type="text" size="mini" @click="getCardImage(scope.row.id,2)">
卡包图片
</el-button>
</el-dropdown-item>
</if>
<el-dropdown-item v-if="scope.row.status == 0">
<el-button type="text" size="mini" @click="invalidCardBag(scope.row.id)">使失效
</el-button>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="limitChange" @current-change="pageChange" :current-page="page"
:page-size="limit" :total="total" :pager-count="5"
:page-sizes="[10,20,30,40,50,60,70,80,90,100]"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</el-tab-pane>
<el-tab-pane label="设置" name="3">
<el-form>
<el-form-item label="手机号登录核销是否需要输入核销码">
<el-switch v-model="use_sub_card_code" :inactive-value="2" :active-value="1"
:active-text="use_sub_card_code==1?'需要':'不需要'"
@change="setCardSetting">
</el-switch>
</el-form-item>
</el-form>
</el-tab-pane>
</el-tabs>
<!-- 创建次卡 -->
<el-dialog :modal-append-to-body="false" :visible.sync="add_sub_card" title="新建次卡"
:before-close="clearSubCardForm" top="3vh" width="70%" :close-on-click-modal="false">
<el-form :model="sub_card_form" label-width="170px" size="mini" style="padding-left: 50px;">
<el-form-item label="次卡名称:">
<el-input v-model="sub_card_form.name" placeholder="请设置次卡名称" style="width: 215px;"></el-input>
</el-form-item>
<div style="display: flex;">
<el-form-item label="卡面名称颜色:">
<el-color-picker v-model="sub_card_form.card_name_color"></el-color-picker>
</el-form-item>
<el-form-item label="按钮背景颜色:">
<el-color-picker v-model="sub_card_form.btn_background"></el-color-picker>
</el-form-item>
<el-form-item label="按钮文字颜色:">
<el-color-picker v-model="sub_card_form.btn_text_color"></el-color-picker>
</el-form-item>
</div>
<el-form-item label="发放总量:">
<el-input v-model="sub_card_form.stock" placeholder="请设置发放总量"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item label="使用类型:">
<el-radio v-model="sub_card_form.use_type" label="1">每天一次</el-radio>
<br>
<el-radio v-model="sub_card_form.use_type" label="3">
<template>
<span>每隔</span>
<el-input v-model="sub_card_form.use_type_3_limit"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 100px;"></el-input>
<span>天可使用一次</span>
</template>
</el-radio>
<br>
<el-radio v-model="sub_card_form.use_type" label="2">自定义使用</el-radio>
</el-form-item>
<el-form-item v-if="sub_card_form.use_type == 2" label="自定义次数:">
<el-input v-model="sub_card_form.frequency" placeholder="请设置自定义次数"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item v-if="sub_card_form.use_type == 2" placeholder="请设置每天使用次数" label="每天使用次数:">
<el-input v-model="sub_card_form.use_type_2_limit" oninput="value=value.replace(/[^\d]/g,'')"
style="width: 215px;"></el-input>
</el-form-item>
<el-form-item label="使用时段:">
<el-time-picker is-range v-model="sub_card_form.time_interval" :editable="false" :clearable="false"
range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间"
value-format="HH:mm:ss">
</el-time-picker>
</el-form-item>
<el-form-item label="次卡类型:">
<el-radio v-model="sub_card_form.type" label="1">自主发放</el-radio>
<el-radio v-model="sub_card_form.type" label="2">充值赠送</el-radio>
<el-radio v-model="sub_card_form.type" label="3">消费赠送</el-radio>
<el-radio v-model="sub_card_form.type" label="4">门店购买</el-radio>
<el-radio v-model="sub_card_form.type" label="5">门店消费指定商品</el-radio>
</el-form-item>
<template v-if="sub_card_form.type != 1">
<el-form-item label="线下赠送/购买状态:">
<el-switch v-model="sub_card_form.line_state" active-value="1" inactive-value="0"
:active-text="sub_card_form.line_state==1?'开启':'关闭'"></el-switch>
</el-form-item>
<el-form-item label="线上赠送/购买状态:">
<el-switch v-model="sub_card_form.online_state" active-value="1" inactive-value="0"
:active-text="sub_card_form.online_state==1?'开启':'关闭'" @change="changeOnlineState">
</el-switch>
</el-form-item>
</template>
<el-form-item v-if="sub_card_form.type == 1 || sub_card_form.type == 2 || sub_card_form.type == 3"
label="指定会员等级:">
<el-radio v-model="sub_card_form.grade_type" label="1">所有等级</el-radio>
<el-radio v-model="sub_card_form.grade_type" label="2">指定等级</el-radio>
</el-form-item>
<el-form-item
v-if="(sub_card_form.type == 1 || sub_card_form.type == 2 || sub_card_form.type == 3) && sub_card_form.grade_type == 2">
<el-select v-model="sub_card_form.gradeids" multiple collapse-tags placeholder="请选择指定等级会员">
<el-option v-for="(val,key) in vip_grade" :label="val.cardname" :value="val.id" :key="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-if="sub_card_form.type == 1 || sub_card_form.type == 2 || sub_card_form.type == 3"
label="指定门店:">
<el-radio v-model="sub_card_form.store_type" label="1">所有门店</el-radio>
<el-radio v-model="sub_card_form.store_type" label="2">指定门店</el-radio>
</el-form-item>
<el-form-item
v-if="(sub_card_form.type == 1 || sub_card_form.type == 2 || sub_card_form.type == 3) && sub_card_form.store_type == 2">
<el-select v-model="sub_card_form.storeids" multiple collapse-tags placeholder="请选择指定门店">
<el-option v-for="(val,key) in store_list" :label="val.storetag" :value="val.id" :key="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-if="sub_card_form.type == 4 || sub_card_form.type == 5" label="选择门店:">
<el-select v-model="sub_card_form.store_id" placeholder="请选择门店" @change="closeStore">
<el-option v-for="(val,key) in store_list" :label="val.storetag" :value="val.id" :key="key">
</el-option>
</el-select>
<el-button v-if="sub_card_form.type == 5" type="primary" @click="getStoreGoods">选择商品</el-button>
</el-form-item>
<el-form-item v-if="sub_card_form.type == 5">
<template>
<el-table border :data="sub_card_form.goods" size="mini" max-height="300">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="goods_name" label="商品名称" width="200"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_number" label="货号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_code" label="条码" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="sku_name" label="规格" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_num" label="库存" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column label="称重类型">
<template slot-scope="scope">
<span v-if="scope.row.pricing_method == 1">非称重</span>
<span v-else>称重</span>
</template>
</el-table-column>
<el-table-column label="数量" :show-overflow-tooltip="true">
<template slot-scope="scope">
<el-input v-if="scope.row.pricing_method == 1" v-model="scope.row.number"
oninput="value=value.replace(/[^\d]/g,'')"></el-input>
<el-input v-else v-model="scope.row.number"
oninput="value=value.replace(/[^\d\.]/g,'')"></el-input>
</template>
</el-table-column>
<el-table-column label="线上出售">
<template slot-scope="scope">
<span v-if="scope.row.online_state == 1">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button v-if="scope.row.attribute_state == 2" type="text" size="mini"
@click="getSkuList(scope.row.id,scope.$index)">选规格
</el-button>
<el-button type="text" size="mini" @click="remoeGoods(scope.$index)">移除</el-button>
</template>
</el-table-column>
</el-table>
</template>
</el-form-item>
<el-form-item v-if="sub_card_form.type == 2 || sub_card_form.type == 3 || sub_card_form.type == 4"
label="充值消费金额/购买价格:">
<el-input v-model="sub_card_form.money" placeholder="设置充值消费金额/购买价格"
oninput="value=value.replace(/[^\d|.]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item v-if="sub_card_form.type != 1" label="赠送/可购买次数:">
<el-input v-model="sub_card_form.give_num" placeholder="设置赠送/可购买次数"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item label="发放截止日期:">
<el-date-picker v-model="sub_card_form.end_time" type="datetime" :editable="false"
:clearable="false" placeholder="截止日期" value-format="yyyy-MM-dd HH:mm:ss" align="right">
</el-date-picker>
</el-form-item>
<el-form-item label="有效期类型">
<el-radio-group v-model="sub_card_form.effective_time_type">
<el-radio :label="1">固定日期</el-radio>
<el-radio :label="2">领卡当日开始</el-radio>
<el-radio :label="3">领卡次日开始</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="有效使用日期:" v-if="sub_card_form.effective_time_type==1">
<el-date-picker v-model="sub_card_form.effective_time" type="daterange" :editable="false"
:clearable="false" value-format="yyyy-MM-dd" range-separator="-"
start-placeholder="开始有效"
end-placeholder="有效截止">
</el-date-picker>
</el-form-item>
<el-form-item v-if="sub_card_form.effective_time_type==2||sub_card_form.effective_time_type==3"
:label="(sub_card_form.effective_time_type==2?'当':'次')+'日开始:'">
<el-input v-model="sub_card_form.effective_day" oninput="value=this.value.replace(/^[0]|\D/,'')"
style="width: 155px;"></el-input>
<span>天内有效</span>
</el-form-item>
<el-form-item label="使用介绍:">
<el-input type="textarea" v-model="sub_card_form.introduce" class="text_area" style="width: 60%;">
</el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="createSubCard">创建次卡</el-button>
</el-form-item>
</el-form>
</el-dialog>
<!-- 创建卡包 -->
<el-dialog :modal-append-to-body="false" :visible.sync="add_card_bag" title="新建卡包"
:before-close="clearCardBagForm" top="0vh" :close-on-click-modal="false"
custom-class="select-image-el-dialog">
<div class="tip" style="font-size: 14px;color: #409EFF;">
<p>1.卡包创建系统会自动移除错误的次卡,请按照要求设置正确的次卡</p>
<p>2.卡包最大只能存放20张次卡</p>
</div>
<div class="title">卡包信息</div>
<el-form :model="card_bag_form" label-width="170px" size="mini" style="padding-left: 20px;">
<el-form-item label="卡包名称:">
<el-input v-model="card_bag_form.name" style="width: 215px;" placeholder="请设置卡包名称"></el-input>
</el-form-item>
<div style="display: flex;">
<el-form-item label="卡面名称颜色:">
<el-color-picker v-model="card_bag_form.card_name_color"></el-color-picker>
</el-form-item>
<el-form-item label="按钮背景颜色:">
<el-color-picker v-model="card_bag_form.btn_background"></el-color-picker>
</el-form-item>
<el-form-item label="按钮文字颜色:">
<el-color-picker v-model="card_bag_form.btn_text_color"></el-color-picker>
</el-form-item>
</div>
<el-form-item label="发放总量:">
<el-input v-model="card_bag_form.stock" oninput="value=value.replace(/[^\d]/g,'')"
style="width: 215px;" placeholder="请设置发放总量"></el-input>
</el-form-item>
<el-form-item label="次卡类型:">
<el-radio v-model="card_bag_form.type" label="1">自主发放</el-radio>
<el-radio v-model="card_bag_form.type" label="2">充值赠送</el-radio>
<el-radio v-model="card_bag_form.type" label="3">消费赠送</el-radio>
<el-radio v-model="card_bag_form.type" label="4">门店购买</el-radio>
<el-radio v-model="card_bag_form.type" label="5">门店消费指定商品</el-radio>
</el-form-item>
<template v-if="card_bag_form.type != 1">
<el-form-item label="线下赠送/购买状态:">
<el-switch v-model="card_bag_form.line_state" active-value="1" inactive-value="0"
:active-text="card_bag_form.line_state==1?'开启':'关闭'"></el-switch>
</el-form-item>
<el-form-item label="线上赠送/购买状态:">
<el-switch v-model="card_bag_form.online_state" active-value="1" inactive-value="0"
:active-text="card_bag_form.online_state==1?'开启':'关闭'" @change="changeOnlineState">
</el-switch>
</el-form-item>
</template>
<el-form-item v-if="card_bag_form.type == 1 || card_bag_form.type == 2 || card_bag_form.type == 3"
label="指定会员等级:">
<el-radio v-model="card_bag_form.grade_type" label="1">所有等级</el-radio>
<el-radio v-model="card_bag_form.grade_type" label="2">指定等级</el-radio>
</el-form-item>
<el-form-item
v-if="(card_bag_form.type == 1 || card_bag_form.type == 2 || card_bag_form.type == 3) && card_bag_form.grade_type == 2">
<el-select v-model="card_bag_form.gradeids" multiple collapse-tags placeholder="请选择指定等级会员">
<el-option v-for="(val,key) in vip_grade" :label="val.cardname" :value="val.id" :key="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-if="card_bag_form.type == 1 || card_bag_form.type == 2 || card_bag_form.type == 3"
label="指定门店:">
<el-radio v-model="card_bag_form.store_type" label="1">所有门店</el-radio>
<el-radio v-model="card_bag_form.store_type" label="2">指定门店</el-radio>
</el-form-item>
<el-form-item
v-if="(card_bag_form.type == 1 || card_bag_form.type == 2 || card_bag_form.type == 3) && card_bag_form.store_type == 2">
<el-select v-model="card_bag_form.storeids" multiple collapse-tags placeholder="请选择指定门店">
<el-option v-for="(val,key) in store_list" :label="val.storetag" :value="val.id" :key="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item v-if="card_bag_form.type == 4 || card_bag_form.type == 5" label="选择门店:">
<el-select v-model="card_bag_form.store_id" placeholder="请选择门店" @change="closeStore">
<el-option v-for="(val,key) in store_list" :label="val.storetag" :value="val.id" :key="key">
</el-option>
</el-select>
<el-button v-if="card_bag_form.type == 5" type="primary" @click="getStoreGoods">选择商品</el-button>
</el-form-item>
<el-form-item v-if="card_bag_form.type == 5">
<template>
<el-table border :data="card_bag_form.goods" size="mini" max-height="300">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="goods_name" label="商品名称" width="200"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_number" label="货号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_code" label="条码" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="sku_name" label="规格" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_num" label="库存" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column label="称重类型">
<template slot-scope="scope">
<span v-if="scope.row.pricing_method == 1">非称重</span>
<span v-else>称重</span>
</template>
</el-table-column>
<el-table-column label="数量" :show-overflow-tooltip="true">
<template slot-scope="scope">
<el-input v-if="scope.row.pricing_method == 1" v-model="scope.row.number"
oninput="value=value.replace(/[^\d]/g,'')"></el-input>
<el-input v-else v-model="scope.row.number"
oninput="value=value.replace(/[^\d\.]/g,'')"></el-input>
</template>
</el-table-column>
<el-table-column label="线上出售">
<template slot-scope="scope">
<span v-if="scope.row.online_state == 1">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button v-if="scope.row.attribute_state == 2" type="text" size="mini"
@click="getSkuList(scope.row.id,scope.$index)">选规格
</el-button>
<el-button type="text" size="mini" @click="remoeGoods(scope.$index)">移除</el-button>
</template>
</el-table-column>
</el-table>
</template>
</el-form-item>
<el-form-item v-if="card_bag_form.type == 2 || card_bag_form.type == 3 || card_bag_form.type == 4"
label="充值消费金额/购买价格:">
<el-input v-model="card_bag_form.money" placeholder="设置充值消费金额/购买价格"
oninput="value=value.replace(/[^\d|.]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item v-if="card_bag_form.type != 1" label="赠送/可购买次数:">
<el-input v-model="card_bag_form.give_num" placeholder="设置赠送/可购买次数"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item label="发放截止日期:">
<el-date-picker v-model="card_bag_form.end_time" type="datetime" placeholder="截止日期"
value-format="yyyy-MM-dd HH:mm:ss" align="right">
</el-date-picker>
</el-form-item>
</el-form>
<div class="title">次卡</div>
<div style="width: 80%;padding-left: 20px;">
<div style="padding-bottom: 20px;padding-top: 10px;">
<el-button type="primary" @click="unshiftCardBag" size="small" icon="el-icon-plus">添加次卡
</el-button>
</div>
<el-table border :data="wait_add" size="mini" max-height="300">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="次卡名称" width="200" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="use_rule" label="使用规则" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="time_interval_v" label="使用时段" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="effective_time_v" label="有效使用时间" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="introduce" label="使用说明" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="removeCardBageToSubCard(scope.$index)">移除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div style="padding: 15px 150px;">
<el-button type="primary" size="small" @click="createCardBag">创建卡包</el-button>
</div>
</el-dialog>
<!-- 添加卡包次卡 -->
<el-dialog :modal-append-to-body="false" :visible.sync="new_add" :before-close="clearSubCardForm"
:close-on-click-modal="false">
<el-form :model="sub_card_form" label-width="100px" size="small" style="padding-left: 20px;">
<div class="title">次卡信息</div>
<el-form-item label="次卡名称:">
<el-input v-model="sub_card_form.name" style="width: 215px;" placeholder="请设置次卡名称"></el-input>
</el-form-item>
<el-form-item label="使用类型:">
<el-radio v-model="sub_card_form.use_type" label="1">每天一次</el-radio>
<br>
<el-radio v-model="sub_card_form.use_type" label="3">
<template>
<span>每隔</span>
<el-input v-model="sub_card_form.use_type_3_limit"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 100px;"></el-input>
<span>天可使用一次</span>
</template>
</el-radio>
<br>
<el-radio v-model="sub_card_form.use_type" label="2">自定义使用</el-radio>
</el-form-item>
<el-form-item v-if="sub_card_form.use_type == 2" label="自定义次数:">
<el-input v-model="sub_card_form.frequency" placeholder="请设置自定义次数"
oninput="value=value.replace(/[^\d]/g,'')" style="width: 215px;"></el-input>
</el-form-item>
<el-form-item v-if="sub_card_form.use_type == 2" placeholder="请设置每天使用次数" label="每天使用次数:">
<el-input v-model="sub_card_form.use_type_2_limit" oninput="value=value.replace(/[^\d]/g,'')"
style="width: 215px;"></el-input>
</el-form-item>
<el-form-item label="使用时段:">
<el-time-picker is-range v-model="sub_card_form.time_interval" :editable="false" :clearable="false"
range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间"
value-format="HH:mm:ss">
</el-time-picker>
</el-form-item>
<el-form-item label="有效期类型">
<el-radio-group v-model="sub_card_form.effective_time_type">
<el-radio :label="1">固定日期</el-radio>
<el-radio :label="2">领卡当日开始</el-radio>
<el-radio :label="3">领卡次日开始</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="有效使用日期:" v-if="sub_card_form.effective_time_type==1">
<el-date-picker v-model="sub_card_form.effective_time" type="daterange" :editable="false"
:clearable="false" value-format="yyyy-MM-dd" range-separator="-"
start-placeholder="开始有效"
end-placeholder="有效截止">
</el-date-picker>
</el-form-item>
<el-form-item v-if="sub_card_form.effective_time_type==2||sub_card_form.effective_time_type==3"
:label="(sub_card_form.effective_time_type==2?'当':'次')+'日开始:'">
<el-input v-model="sub_card_form.effective_day" oninput="value=this.value.replace(/^[0]|\D/,'')"
style="width: 155px;"></el-input>
<span>天内有效</span>
</el-form-item>
<el-form-item label="使用介绍:">
<el-input type="textarea" v-model="sub_card_form.introduce" class="text_area"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="unShiftWaitAdd">确定</el-button>
</el-form-item>
</el-form>
</el-dialog>
<!-- 选择商品 -->
<el-dialog :modal-append-to-body="false" :visible.sync="close_goods" title="选择商品" :before-close="clearGoodsList"
:close-on-click-modal="false">
<el-form style="padding: 10px 0px;">
<el-input v-model="g_keyword" placeholder="商品名称,货号,条码" size="small" clearable
style="width: 220px;margin-right: 10px;"></el-input>
<el-button type="primary" @click="getStoreGoods" size="small">搜索</el-button>
</el-form>
<el-table border :data="goods_list" size="mini" max-height="300">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="goods_name" label="商品名称" width="200" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_number" label="货号" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_code" label="条码" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_num" label="库存" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="unShiftGoods(scope.row)">选择</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination @current-change="gPageChange" :current-page="g_page" :total="g_total" :pager-count="5"
layout="total, prev, pager, next, jumper">
</el-pagination>
<div slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="clearGoodsList">确 定</el-button>
</div>
</el-dialog>
<!-- 选择规格 -->
<el-dialog :modal-append-to-body="false" :visible.sync="close_sku" title="选择规格" :before-close="clearskuList"
:close-on-click-modal="false">
<el-table border :data="sku_list" size="mini" max-height="300">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="sku_name" label="规格" width="200" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="sku_goods_number" label="货号" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="sku_code" label="条码" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_num" label="库存" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="closeSku(scope.row)">选择</el-button>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="clearskuList">确 定</el-button>
</div>
</el-dialog>
<!-- 卡包次卡详情 -->
<el-dialog :modal-append-to-body="false" :visible.sync="show_details" title="次卡详情"
custom-class="select-image-el-dialog" :close-on-click-modal="false">
<div class="title">卡包信息</div>
<div style="padding: 10px">
<el-table border :data="card_bag_details" size="mini" height="500">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="次卡名称" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="use_rule" label="使用规则" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="time_interval" label="可用时段" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="effective_time" label="有效使用日期" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column label="操作" width="100">
<template slot-scope="scope">
<el-button type="text" size="mini" @click="getCardImage(scope.row.id,1)">卡面图片</el-button>
</template>
</el-table-column>
</el-table>
</div>
</el-dialog>
<!-- 指定发放 -->
<el-dialog :modal-append-to-body="false" :visible.sync="send_out" title="发放" :top="'50px'"
:before-close="clearSendOutVipList" custom-class="select-image-el-dialog" :close-on-click-modal="false">
<div :v-loading="loading" element-loading-text="加载中,请等待" element-loading-spinner="el-icon-loading">
<el-form label-width="100px" size="small" style="padding-left: 20px;" @submit.native.prevent>
<el-form-item v-if="card_mold == 1" label="次卡名称:">
<template>{{ card_data.name }}</template>
</el-form-item>
<el-form-item v-if="card_mold == 2" label="卡包名称:">
<template>{{ card_data.name }}</template>
</el-form-item>
<el-form-item label="指定门店:">
<div style="display: flex;flex-wrap: wrap;">
<div v-for="val in stores" class="store">{{ val }}</div>
</div>
</el-form-item>
<el-form-item label="指定等级会员:">
<div style="display: flex;flex-wrap: wrap;">
<div v-for="val in grades" class="store">{{ val }}</div>
</div>
</el-form-item>
<el-form-item label="指定会员:">
<div class="vip_search">
<el-input v-model="seek_data.keyword" placeholder="手机号/实体卡" size="mini" clearable
style="width: 200px;margin-right: 5px;"></el-input>
<el-button @click="getSendOutVipList" type="primary" size="mini">搜索</el-button>
<el-button @click="appointGrantCard" type="primary" size="mini">发放</el-button>
</div>
<el-table border :data="vip_list" size="small" height="400" @selection-change="choseVip">
<el-table-column type="selection" width="40" align="center"></el-table-column>
<el-table-column property="store_name" label="门店" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="user_name" label="姓名|昵称" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="mobile_phone" label="手机号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="card_key" label="实体卡" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="balance" label="余额" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="integral" label="积分" :show-overflow-tooltip="true">
</el-table-column>
</el-table>
</el-form-item>
</el-form>
</div>
</el-dialog>
<!-- 发放记录 核销记录 -->
<el-dialog :modal-append-to-body="false" :visible.sync="grant_record" title="记录" :before-close="clearRecord"
custom-class="select-image-el-dialog" :close-on-click-modal="false">
<div :v-loading="loading2" element-loading-text="加载中,请等待" element-loading-spinner="el-icon-loading"
style="margin-top: 10px;">
<el-tabs v-model="record_taps" @tab-click="chooseRecordType">
<el-tab-pane label="发放记录" name="1">
<div class="vip_search">
<el-input v-model="seek_data.keyword" placeholder="手机号/实体卡" size="mini" clearable
style="width: 200px;margin-right: 6px;">
<el-button slot="append" type="primary" icon="el-icon-search" @click="recordSeek">
</el-button>
</el-input>
</div>
<el-table border :data="record_list" size="mini" height="350">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="次卡名称" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="vip_name" label="会员姓名" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="nickname" label="会员昵称" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="mobile_phone" label="手机号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="card_key" label="实体卡" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="addtime" label="发放时间" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="use_num" label="使用次数" :show-overflow-tooltip="true">
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="核销记录" name="2">
<div class="vip_search">
<el-input v-model="seek_data.keyword" placeholder="手机号/实体卡" size="mini" clearable
style="width: 200px;margin-right: 6px;">
<el-button slot="append" type="primary" icon="el-icon-search" @click="recordSeek">
</el-button>
</el-input>
</div>
<el-table border :data="use_record_list" size="mini" height="350">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="name" label="次卡名称" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="vip_name" label="会员姓名" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="nickname" label="会员昵称" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="mobile_phone" label="手机号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="use_store_name" label="核销门店" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="cashier_name" label="核销收银员" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="add_time" label="核销时间" :show-overflow-tooltip="true">
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
<el-pagination @size-change="rLimitChange" @current-change="rPageChange" :current-page="r_page"
:page-size="r_limit" :total="r_total" :pager-count="5"
:page-sizes="[10,20,30,40,50,60,70,80,90,100]"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</div>
</el-dialog>
<!-- 次卡,卡包详情 -->
<el-dialog :modal-append-to-body="false" :visible.sync="give_details_show" title="详情"
:before-close="clearGiveDetails" :custom-class="give_details.type == 5 ? 'select-image-el-dialog' : ''"
:close-on-click-modal="false">
<el-form label-width="150px" size="small" style="padding-left: 20px;">
<el-form-item v-if="card_mold == 1" label="次卡名称:">
<template>{{ give_details.name }}</template>
</el-form-item>
<el-form-item v-if="card_mold == 2" label="卡包名称:">
<template>{{ give_details.name }}</template>
</el-form-item>
<el-form-item label="发放类型:">
<template>{{ give_details.type_name }}</template>
</el-form-item>
<el-form-item v-if="give_details.type == 2" label="充值金额:">
<template>{{ give_details.money }}(元)</template>
</el-form-item>
<el-form-item v-if="give_details.type == 3" label="消费金额:">
<template>{{ give_details.money }}(元)</template>
</el-form-item>
<el-form-item v-if="give_details.type == 4" label="购买价格:">
<template>{{ give_details.money }}(元)</template>
</el-form-item>
<el-form-item v-if="give_details.type != 1" label="赠送次数:">
<template>{{ give_details.give_num }} 次</template>
</el-form-item>
<el-form-item v-if="give_details.type == 1 || give_details.type == 2 || give_details.type == 3"
label="指定门店:">
<div style="display: flex;flex-wrap: wrap;">
<div v-for="val in give_details.stores" class="store">{{ val }}</div>
</div>
</el-form-item>
<el-form-item v-if="give_details.type == 4 || give_details.type == 5" label="可购买门店:">
<template>{{ give_details.store_name }}</template>
</el-form-item>
<el-form-item v-if="give_details.type == 1 || give_details.type == 2 || give_details.type == 3"
label="指定会员等级:">
<div style="display: flex;flex-wrap: wrap;">
<div v-for="val in give_details.grades" class="store">{{ val }}</div>
</div>
</el-form-item>
<templat v-if="give_details.type != 1">
<el-form-item label="线下赠送/购买状态:">
<el-switch v-model="give_details.line_state" active-value="1" inactive-value="0" disabled
:active-text="give_details.line_state==1?'开启':'关闭'"></el-switch>
</el-form-item>
<el-form-item label="线上赠送/购买状态:">
<el-switch v-model="give_details.online_state" active-value="1" inactive-value="0" disabled
:active-text="give_details.online_state==1?'开启':'关闭'"></el-switch>
</el-form-item>
</templat>
<el-form-item v-if="give_details.type == 5" label="商品:">
<el-table border :data="give_details.goods" size="mini">
<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
<el-table-column property="goods_name" label="商品名称" width="200" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_number" label="货号" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="goods_code" label="条码" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column property="sku_name" label="规格" :show-overflow-tooltip="true"></el-table-column>
<el-table-column property="goods_num" label="库存" :show-overflow-tooltip="true">
</el-table-column>
<el-table-column label="称重类型">
<template slot-scope="scope">
<span v-if="scope.row.pricing_method == 1">非称重</span>
<span v-else>称重</span>
</template>
</el-table-column>
<el-table-column label="数量" :show-overflow-tooltip="true">
<template slot-scope="scope">
<el-input v-if="scope.row.pricing_method == 1" v-model="scope.row.number"
oninput="value=value.replace(/[^\d]/g,'')"></el-input>
<el-input v-else v-model="scope.row.number"
oninput="value=value.replace(/[^\d\.]/g,'')"></el-input>
</template>
</el-table-column>
<el-table-column label="线上出售">
<template slot-scope="scope">
<span v-if="scope.row.online_state == 1">是</span>
<span v-else>否</span>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
</el-dialog>
<!-- 卡面图片 -->
<el-dialog :modal-append-to-body="false" :visible.sync="card_image" title="次卡图片" :before-close="clearCardImage"
:close-on-click-modal="false">
<div :v-loading="loading3" element-loading-text="加载中,请等待" element-loading-spinner="el-icon-loading">
<form id="carg_img" style="display: flex;">
<input type="hidden" name="sub_card_id" v-model="map.id">
<input type="hidden" name="gallery_id" v-model="gallery_id">
<div class="image_label">
<img :src="image_url ? image_url : '__PUBLIC__/paper/images/sub_card.png'">
</div>
<div class="button_label">
<span class="fileinput-button">
<el-button type="primary" size="small" icon="el-icon-upload" plain>本地选择</el-button>
<input type="file" name="image" class="file_image" @change="changeImage"
accept="image/png,image/jpeg,'image/png',image/gif" value="">
</span>
<div style="padding: 5px 0px;">
<el-button type="primary" size="small" icon="el-icon-picture" plain @click="selectImage">
图库图片
</el-button>
</div>
</div>
</form>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" icon="el-icon-success" @click="saveCardSet">保存设置</el-button>
</div>
</el-dialog>
<!-- 卡包图片 -->
<el-dialog :modal-append-to-body="false" :visible.sync="bag_image" title="卡包图片" :before-close="clearCardImage"
:close-on-click-modal="false">
<div :v-loading="loading3" element-loading-text="加载中,请等待" element-loading-spinner="el-icon-loading">
<form id="bag_img" style="display: flex;">
<input type="hidden" name="card_bag_id" v-model="map.id">
<input type="hidden" name="gallery_id" v-model="gallery_id">
<div class="image_label">
<img :src="image_url ? image_url : '__PUBLIC__/paper/images/sub_card.png'">
</div>
<div class="button_label">
<span class="fileinput-button">
<el-button type="primary" size="small" icon="el-icon-upload" plain>本地选择</el-button>
<input type="file" name="image" class="file_image" @change="changeImage"
accept="image/png,image/jpeg,'image/png',image/gif" value="">
</span>
<div style="padding: 5px 0px;">
<el-button type="primary" size="small" icon="el-icon-picture" plain @click="selectImage">
图库图片
</el-button>
</div>
</div>
</form>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" icon="el-icon-success" @click="saveBagSet">保存设置</el-button>
</div>
</el-dialog>
<!-- 图库图片 -->
<el-dialog :modal-append-to-body="false" :visible.sync="gallery_image" custom-class="select-image-el-dialog"
:top="'10px'">
<template-select-image :can-select-num="1" @selectfile="choseFile"></template-select-image>
</el-dialog>
</div>
</body>
<script>
var app = new Vue({
el: '#app',
data() {
return {
card_mold: '1', // 1.次卡 2.卡包
card_state: '1', // 1.所有次卡 2.进行中 3.已结束
seek_data: {
name: '', // 名称
start_time: '', // 创建时间(起)
end_time: '', // 创建时间(止)
keyword: '', // 指定发放会员手机号、实体卡搜索添加
type: '', // 类型搜索
},
sub_card: [], // 次卡列表
store_list: [], // 可用门店
vip_grade: [], // 等级会员
goods_list: [], // 商品
add_sub_card: false, // 显示新建次卡
sub_card_form: {
name: '', // 次卡名称
card_name_color: '#FFFFFF', // 卡面名称颜色
btn_background: '#FFFFFF', // 按钮背景颜色
btn_text_color: '#36549a', // 按钮文字颜色
stock: '', // 库存
use_type: '1', // 使用类型 1.每天一次 2.自定义次数
frequency: '', // 自定义次数
limit: '', // 每天可用次数
use_type_2_limit: '',
use_type_3_limit: '',
time_interval: ['00:00:00', '23:59:59'], // 使用时段
type: '1', // 类型 1.自主发放 2.充值赠送 3.消费赠送 4.购买使用 5.消费商品
line_state: '1', // 线下
online_state: '1', // 线上
money: '', // 充值赠送,消费赠送金额
give_num: 1, // 充值赠送,消费赠送赠送次数
grade_type: '1', // 等级类型 1.所有等级 2.指定等级
gradeids: [], // 指定等级
store_type: '1', // 指定门店 1.所有门店 2.指定门店
storeids: [], // 选择的门点
end_time: '', // 发放截止时间
effective_time_type: 1, // 有效使用期类型
effective_time: [], // 使用有效时间
effective_day: '', // 有效使用期类型为2、3时,几天内有效
introduce: '', // 使用介绍
store_id: '', // 门店id
goods: [], // 商品
},
card_bag: [], // 卡包
add_card_bag: false, // 显示新建卡包
card_bag_form: {
name: '', // 卡包名称
card_name_color: '#FFFFFF', // 卡面名称颜色
btn_background: '#FFFFFF', // 按钮背景颜色
btn_text_color: '#36549a', // 按钮文字颜色
stock: '', // 发放数量
type: '1', // 类型 1.自主发放 2.充值赠送 3.消费赠送 4.购买使用 5.消费商品
line_state: '1', // 线下
online_state: '1', // 线上
money: '', // 充值赠送,消费赠送金额
give_num: 1, // 充值赠送,消费赠送赠送次数
grade_type: '1', // 等级类型 1.所有等级 2.指定等级
gradeids: [], // 指定等级
store_type: '1', // 指定门店 1.所有门店 2.指定门店
storeids: [], // 选择的门点
end_time: '', // 结束时间
store_id: '', // 门店id
goods: [], // 商品
},
page: 1, // 分页
limit: 10, // 数量
total: 0, // 总数
new_add: false, // 显示添加卡包次卡
wait_add: [], // 卡包次卡
show_details: false, // 显示卡包详情
card_bag_details: [], // 卡包详情
send_out: false, // 显示指定发放
loading: false, // 加载(指定发放)
map: { // 临时保存查询条件
id: '',
storeids: '',
gradeids: ''
},
card_data: { // 指定发放信息
id: '',
name: '',
},
stores: [], // 指定发放门店展示
grades: [], // 指定发放等级展示
vip_list: [], // 指定发放会员展示
chose_vip: [], // 勾选的会员
vips: [], // 拆分后的会员(二位数组)
grant_record: false, // 显示发放记录
loading2: false, // 加载(发放记录)
record_list: [], // 发放记录列表
r_page: 1, // 次卡记录分页
r_limit: 10, // 次卡记录数量
r_total: 0, // 次卡记录总数
give_details_show: false, // 显示赠送详情
give_details: {
name: '', // 次卡、卡包名称
type: '', // 类型 2.充值 3.消费
money: '', // 金额
give_num: '', // 赠送次数
},
card_image: false, // 显示次卡图片
bag_image: false, // 显示卡包图片
image_type: 1, // 显示图片类型 1.次卡图片 2.卡包图片
loading3: false, // 加载(卡面图片)
image_url: '', // 图片
gallery_image: false, // 显示图库图片
gallery_id: '', // 图库图片id
record_taps: '1', // 记录类型 1.发放记录 2.核销记录
use_record_list: [], // 核销记录
g_keyword: '',
close_goods: false, // 选择商品
goods_list: [],
g_page: 1,
g_total: 0,
close_sku: false, // 选择规格
sku_list: [],
goods_index: 0,
use_sub_card_code: 1 // 手机号核销是否需要认证核销码
}
},
methods: {
// 次卡、卡包切换
cardMoldChange() {
this.card_state = '1';
this.clearSeekData();
this.loading = true;
switch (this.card_mold) {
case '1': //次卡
this.getSubCardList()
break
case '2': //卡包
this.getCardBagList()
break
case '3': //设置
this.getCardSetting()
break
}
},
// 搜索
searchCard() {
this.page = 1;
// 判断次卡卡包
if (this.card_mold == 2 || this.card_mold == '2') {
this.getCardBagList();
} else {
this.getSubCardList();
}
},
// 获取次卡列表
getSubCardList() {
this.$loading({
lock: true,
text: '数据加载中......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
$.ajax({
url: "{:U('getSubCardList')}",
type: "post",
data: {page: this.page, limit: this.limit, card_state: this.card_state, seek_data: this.seek_data},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.sub_card = res.sub_card;
this.total = res.total;
} else {
this.sub_card = [];
this.total = 0;
}
}
})
},
// 获取卡包列表
getCardBagList() {
this.$loading({
lock: true,
text: '数据加载中......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
$.ajax({
url: "{:U('getCardBagList')}",
type: "post",
data: {page: this.page, limit: this.limit, card_state: this.card_state, seek_data: this.seek_data},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.card_bag = res.card_bag;
this.total = res.total;
} else {
this.card_bag = [];
this.total = 0;
}
}
})
},
// 获取次卡设置
getCardSetting() {
$.ajax({
url: "{:U('getCardBaseData')}",
type: "post",
success: (response) => {
this.loading = false
if (response.status == 1) {
this.use_sub_card_code = response.data.use_sub_card_code
} else {
this.$message.error(response.message)
}
}
})
},
// 修改次卡设置
setCardSetting() {
$.ajax({
url: "{:U('setCardBaseData')}",
type: "post",
data: {use_sub_card_code: this.use_sub_card_code},
success: (response) => {
if (response.status == 1) {
this.$message.success(response.message)
} else {
this.$message.error(response.message)
}
}
})
},
// 次卡,卡包切换每页数量
limitChange(val) {
this.limit = val;
this.page = 1;
if (this.card_mold == 2 || this.card_mold == '2') {
// 卡包
this.getCardBagList();
} else {
// 次卡
this.getSubCardList();
}
},
// 次卡,卡包切换页数
pageChange(val) {
this.page = val;
if (this.card_mold == 2 || this.card_mold == '2') {
// 卡包
this.getCardBagList();
} else {
// 次卡
this.getSubCardList();
}
},
// 获取门店和等级会员打开新建次卡或卡包
getStoreListAndVipGrade() {
$.ajax({
url: "{:U('getStoreListAndVipGrade')}",
type: "post",
success: (res) => {
if (this.card_mold == 2 || this.card_mold == '2') {
// 卡包
this.add_card_bag = true;
} else {
// 次卡
this.add_sub_card = true;
}
if (res.status == 1) {
this.store_list = res.store_list;
this.vip_grade = res.vip_grade;
} else {
this.store_list = [];
this.vip_grade = [];
}
}
})
},
// 选择门店
closeStore(val) {
if (parseInt(this.card_mold) == 1) {
this.sub_card_form.goods = [];
} else {
this.card_bag_form.goods = [];
}
},
// 开启,关闭线上线下
changeOnlineState(val) {
// 判断值
if (parseInt(val) == 1) {
// 判断类型
if (parseInt(this.card_mold) == 1) {
var goods = JSON.parse(JSON.stringify(this.sub_card_form.goods));
} else {
var goods = JSON.parse(JSON.stringify(this.card_bag_form.goods));
}
// 开启线上出售,判断是否存在非商城出售的商品
var ret = true;
for (var i = 0; i <= goods.length; i++) {
if (goods[i].online_state != 1) {
ret = false;
break;
}
}
if (ret == false) {
if (parseInt(this.card_mold) == 1) {
this.sub_card_form.online_state = '0';
} else {
this.card_bag_form.online_state = '0';
}
this.$message({
message: '请先移除非线上出售的商品',
type: 'warning'
});
return false;
}
}
},
// 获取门店商品
getStoreGoods() {
// 判断
if (parseInt(this.card_mold) == 1) {
var store_id = this.sub_card_form.store_id;
var online_state = parseInt(this.sub_card_form.online_state);
} else {
var store_id = this.card_bag_form.store_id;
var online_state = parseInt(this.card_bag_form.online_state);
}
if (!store_id) {
this.$message({
message: '提示:请先选择门店',
type: 'warning'
});
return false;
}
this.$loading({
lock: true,
text: '查询中,请稍等......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
// 获取门店
$.ajax({
url: "{:U('getStoreGoods')}",
type: "post",
data: {store_id: store_id, page: this.g_page, keyword: this.g_keyword, online_state: online_state},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.close_goods = true;
this.goods_list = res.goods_list;
this.g_total = res.total;
} else {
this.goods_list = [];
this.g_total = 0;
this.$message({
message: res.msg,
type: 'error'
});
return false;
}
}
})
},
// 商品列表切换页数
gPageChange(val) {
this.g_page = val;
this.getStoreGoods();
},
// 选择商品
unShiftGoods(data) {
// 判断类型
if (parseInt(this.card_mold) == 1) {
var goods = this.sub_card_form.goods;
} else {
var goods = this.card_bag_form.goods;
}
// 判断数量,限制5件商品
if (goods.length >= 5) {
this.$message({
message: '提示:商品限制5件',
type: 'warning'
});
return false;
}
// 判断商品是否已选择
if (goods.length > 0) {
for (var i = 0; i < goods.length; i++) {
if (goods[i].id == data.id) {
this.$message({
message: '提示:该商品已存在',
type: 'warning'
});
return false;
}
}
}
//
var u_res = goods.unshift(data);
if (!u_res || u_res <= 0) {
this.$message({
message: '提示:添加失败,请刷新重试',
type: 'warning'
});
return false;
}
// 判断类型
if (parseInt(this.card_mold) == 1) {
this.sub_card_form.goods = goods;
} else {
this.card_bag_form.goods = goods;
}
},
// 关闭商品列表
clearGoodsList() {
this.goods_list = [];
this.g_page = 1;
this.g_total = 0;
this.close_goods = false;
},
// 获取规格
getSkuList(goods_id, index) {
// 判断
if (parseInt(this.card_mold) == 1) {
var store_id = this.sub_card_form.store_id
} else {
var store_id = this.card_bag_form.store_id
}
// 判断
if (!store_id) {
this.$message({
message: '提示:请选择门店',
type: 'error'
});
return false;
}
this.$loading({
lock: true,
text: '加载中,请稍等......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
// 获取门店
$.ajax({
url: "{:U('getSkuList')}",
type: "post",
data: {store_id: store_id, goods_id: goods_id},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.close_sku = true;
this.goods_index = index;
this.sku_list = res.sku_list;
} else {
this.sku_list = [];
this.$message({
message: res.msg,
type: 'error'
});
return false;
}
}
})
},
// 选择规格
closeSku(sku_data) {
// 判断类型
if (parseInt(this.card_mold) == 1) {
var goods = JSON.parse(JSON.stringify(this.sub_card_form.goods));
} else {
var goods = JSON.parse(JSON.stringify(this.card_bag_form.goods));
}
// 赋值
var index = this.goods_index;
goods[index].sku_id = sku_data.id;
goods[index].sku_name = sku_data.sku_name;
goods[index].goods_num = sku_data.goods_num;
if (parseInt(this.card_mold) == 1) {
this.sub_card_form.goods = [];
this.sub_card_form.goods = goods;
} else {
this.card_bag_form.goods = [];
this.card_bag_form.goods = goods;
}
},
// 关闭规格列表
clearskuList() {
this.sku_list = [];
this.close_sku = false;
this.goods_index = 0;
},
// 移除商品
remoeGoods(index) {
this.$confirm('确定移除该商品嘛!', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 判断类型
if (parseInt(this.card_mold) == 1) {
var goods = this.sub_card_form.goods;
} else {
var goods = this.card_bag_form.goods;
}
// 移除
goods.splice(index, 1);
// 判断类型
if (parseInt(this.card_mold) == 1) {
this.sub_card_form.goods = goods;
} else {
this.card_bag_form.goods = goods;
}
});
},
// 创建次卡
createSubCard() {
this.sub_card_form.limit = this.sub_card_form.use_type == 2 ? this.sub_card_form.use_type_2_limit : this.sub_card_form.use_type_3_limit
// 次卡名称
if (!this.sub_card_form.name) {
return this.$message.warning('提示:请设置次卡名称');
}
// 卡面名称颜色
if (!this.sub_card_form.card_name_color) {
return this.$message.warning('提示:请设置卡面名称颜色');
}
// 按钮背景颜色
if (!this.sub_card_form.btn_background) {
return this.$message.warning('提示:请设置按钮背景颜色');
}
// 按钮文字颜色
if (!this.sub_card_form.btn_text_color) {
return this.$message.warning('提示:请设置按钮文字颜色');
}
// 发放数量
if (!this.sub_card_form.stock || parseInt(this.sub_card_form.stock) <= 0) {
return this.$message.warning('提示:请设置正确的发放数量');
}
// 使用类型 2. 自定义
if (this.sub_card_form.use_type == 2) {
if (!this.sub_card_form.frequency || parseInt(this.sub_card_form.frequency) <= 0) {
return this.$message.warning('提示:请设置正确的自定义次数');
}
if (!this.sub_card_form.limit || parseInt(this.sub_card_form.limit) <= 0) {
return this.$message.warning('提示:请设置正确的每日使用次数');
}
} else if (this.sub_card_form.use_type == 3) {
if (!this.sub_card_form.limit || parseInt(this.sub_card_form.limit) <= 0) {
return this.$message.warning('提示:请设置正确的每隔多少天可使用一次的天数');
}
}
// 使用时段
if (!this.sub_card_form.time_interval) {
return this.$message.warning('提示:请设置正确的使用时段');
}
// 使用类型
if (!this.sub_card_form.type) {
return this.$message.warning('提示:请选择使用类型');
}
// 指定等级
if ((parseInt(this.sub_card_form.type) == 1 || parseInt(this.sub_card_form.type) == 2 || parseInt(this.sub_card_form.type) == 3) && parseInt(this.sub_card_form.grade_type) == 2) {
if (this.sub_card_form.gradeids.length <= 0) {
return this.$message.warning('提示:请选择指定会员等级');
}
}
// 指定门店
if ((parseInt(this.sub_card_form.type) == 1 || parseInt(this.sub_card_form.type) == 2 || parseInt(this.sub_card_form.type) == 3) && parseInt(this.sub_card_form.store_type) == 2) {
if (this.sub_card_form.storeids.length <= 0) {
return this.$message.warning('提示:请选择指定门店');
}
}
// 选择门店
if ((parseInt(this.sub_card_form.type) == 4 || parseInt(this.sub_card_form.type) == 5) && !this.sub_card_form.store_id) {
return this.$message.warning('提示:请选择门店');
}
// 指定商品
if (parseInt(this.sub_card_form.type) == 5) {
var goods = JSON.parse(JSON.stringify(this.sub_card_form.goods));
if (goods.length <= 0) {
return this.$message.warning('提示:请选择商品');
}
// 处理数据
for (var i = 0; i < goods.length; i++) {
if (!goods[i].number || parseInt(goods[i].number * 100) <= 0) {
return this.$message.warning('提示:请设置合理的数量');
}
}
}
// 金额
if (parseInt(this.sub_card_form.type) == 2 || parseInt(this.sub_card_form.type) == 3 || parseInt(this.sub_card_form.type) == 4) {
if (!this.sub_card_form.money || parseFloat(this.sub_card_form.money) <= 0 || parseInt(this.sub_card_form.money * 100) <= 0) {
return this.$message.warning('提示:请设置金额度');
}
}
// 次数
if (parseInt(this.sub_card_form.type) == 2 || parseInt(this.sub_card_form.type) == 3 || parseInt(this.sub_card_form.type) == 5) {
if (!this.sub_card_form.give_num) {
return this.$message.warning('提示:请设置赠送次数');
}
} else if (parseInt(this.sub_card_form.type) == 4) {
if (!this.sub_card_form.give_num) {
return this.$message.warning('提示:请设置购买次数');
}
}
// 发放截止时间
if (!this.sub_card_form.end_time) {
return this.$message.warning('提示:请设置发放截止日期');
}
// 有效使用时间
if (this.sub_card_form.effective_time_type == 1 && this.sub_card_form.effective_time.length <= 0) {
return this.$message.warning('提示:请设置有效使用日期');
} else if (this.sub_card_form.effective_time_type != 1 && !this.sub_card_form.effective_day) {
return this.$message.warning('提示:请设置有效天数');
} else if (this.sub_card_form.effective_time_type != 1 && this.sub_card_form.effective_day > 2147483647) {
return this.$message.warning('提示:有效天数不能大于2147483647');
}
this.$loading({
lock: true,
text: '创建中,请稍等......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
$.ajax({
url: "{:U('createSubCard')}",
type: "post",
data: {sub_card: this.sub_card_form},
success: (res) => {
this.$loading().close();
if (res.status == 1 || res.status == 2) {
this.clearSubCardForm();
this.$message.success(res.msg);
this.getSubCardList();
} else {
this.$message.error(res.msg);
}
}
})
},
// 添加卡包次卡
unshiftCardBag() {
if (this.wait_add.length >= 20) {
return this.$message.warning('提示:卡包最大只能设置20张次卡');
} else {
this.new_add = true;
}
},
// 确定 将次卡unshift到卡包
unShiftWaitAdd() {
this.sub_card_form.limit = this.sub_card_form.use_type == 2 ? this.sub_card_form.use_type_2_limit : this.sub_card_form.use_type_3_limit
if (this.wait_add.length >= 20) {
return this.$message.warning('提示:卡包最大只能设置20张次卡');
}
var sub_card_form = JSON.parse(JSON.stringify(this.sub_card_form));
if (!sub_card_form.name) {
return this.$message.warning('提示:请设置次卡名称');
}
if (!sub_card_form.use_type) {
return this.$message.warning('提示:选择使用类型');
}
// 自定义使用
if (sub_card_form.use_type == 2) {
if (!sub_card_form.frequency || parseInt(sub_card_form.frequency) <= 0) {
return this.$message.warning('提示:请设置自定仪使用次数');
}
if (!sub_card_form.limit || parseInt(sub_card_form.limit) <= 0) {
return this.$message.warning('提示:请设置自定仪每天使用次数');
}
sub_card_form.use_rule = '可用' + sub_card_form.frequency + '次,每日最多使用' + sub_card_form.limit + '次';
} else if (sub_card_form.use_type == 1) {
sub_card_form.use_rule = '每天一次';
} else {
if (!sub_card_form.limit) {
return this.$message.warning('提示:请输入每隔多少天可使用一次的天数');
}
sub_card_form.use_rule = '每隔' + sub_card_form.limit + '天可使用一次';
}
// 时间段
if (sub_card_form.time_interval.length <= 0) {
return this.$message.warning('提示:请设置使用时段');
} else {
sub_card_form.time_interval_v = sub_card_form.time_interval[0] + ' - ' + sub_card_form.time_interval[1];
}
// 有效使用时间
if (sub_card_form.effective_time_type == 1) {
if (sub_card_form.effective_time.length <= 0) return this.$message.warning('提示:请设置有效使用日期');
sub_card_form.effective_time_v = sub_card_form.effective_time[0] + ' - ' + sub_card_form.effective_time[1];
} else if (sub_card_form.effective_time_type != 1) {
if (!sub_card_form.effective_day) return this.$message.warning('提示:请设置有效天数');
if (sub_card_form.effective_day > 2147483647) return this.$message.warning('提示:有效天数不能大于2147483647');
sub_card_form.effective_time_v = '领卡' + (sub_card_form.effective_time_type == 2 ? '当日' : '次日') + sub_card_form.effective_day + '天内有效';
}
sub_card_form.introduce = sub_card_form.introduce && sub_card_form.introduce != '' ? sub_card_form.introduce : '暂无说明';
var wait_add = this.wait_add;
var unshift_res = wait_add.unshift(sub_card_form);
if (!unshift_res || unshift_res <= 0) {
return this.$message.warning('提示:添加失败,请刷新重试');
} else {
this.clearSubCardForm();
}
},
// 移除卡包中指定的次卡
removeCardBageToSubCard(index) {
this.$confirm('确定移除该张次卡吗?移除后将不可恢复!', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
var wait_add = this.wait_add;
wait_add.splice(index, 1);
this.wait_add = wait_add;
});
},
// 创建卡包
createCardBag() {
// 次卡名称
if (!this.card_bag_form.name) {
return this.$message.warning('提示:请设置卡包名称');
}
// 卡面名称颜色
if (!this.card_bag_form.card_name_color) {
return this.$message.warning('提示:请设置卡面名称颜色');
}
// 按钮背景颜色
if (!this.card_bag_form.btn_background) {
return this.$message.warning('提示:请设置按钮背景颜色');
}
// 按钮文字颜色
if (!this.card_bag_form.btn_text_color) {
return this.$message.warning('提示:请设置按钮文字颜色');
}
// 发放数量
if (!this.card_bag_form.stock || parseInt(this.card_bag_form.stock) <= 0) {
return this.$message.warning('提示:请输入正确的发放数量');
}
if (!this.card_bag_form.type) {
return this.$message.warning('提示:请选择正确的使用类型');
}
// 指定等级
if ((parseInt(this.card_bag_form.type) == 1 || parseInt(this.card_bag_form.type) == 2 || parseInt(this.card_bag_form.type) == 3) && parseInt(this.card_bag_form.grade_type) == 2) {
if (this.card_bag_form.gradeids.length <= 0) {
return this.$message.warning('提示:请选择指定会员等级');
}
}
// 指定门店
if ((parseInt(this.card_bag_form.type) == 1 || parseInt(this.card_bag_form.type) == 2 || parseInt(this.card_bag_form.type) == 3) && parseInt(this.card_bag_form.store_type) == 2) {
if (this.card_bag_form.storeids.length <= 0) {
return this.$message.warning('提示:请选择指定门店');
}
}
// 选择门店
if ((parseInt(this.card_bag_form.type) == 4 || parseInt(this.card_bag_form.type) == 5) && !this.card_bag_form.store_id) {
return this.$message.warning('提示:请选择门店');
}
// 指定商品
if (parseInt(this.card_bag_form.type) == 5) {
var goods = JSON.parse(JSON.stringify(this.card_bag_form.goods));
if (goods.length <= 0) {
return this.$message.warning('提示:请选择商品');
}
// 判断数量
for (var i = 0; i < goods.length; i++) {
if (!goods[i].number || parseInt(goods[i].number * 100) <= 0) {
return this.$message.warning('提示:请设置合理的数量');
}
}
}
// 金额
if (parseInt(this.card_bag_form.type) == 2 || parseInt(this.card_bag_form.type) == 3 || parseInt(this.card_bag_form.type) == 4) {
if (!this.card_bag_form.money || parseFloat(this.card_bag_form.money) <= 0 || parseInt(this.card_bag_form.money * 100) <= 0) {
return this.$message.warning('提示:请设置金额度');
}
}
// 次数
if (parseInt(this.card_bag_form.type) == 2 || parseInt(this.card_bag_form.type) == 3 || parseInt(this.card_bag_form.type) == 5) {
if (!this.card_bag_form.give_num) {
return this.$message.warning('提示:请设置赠送次数');
}
} else if (parseInt(this.card_bag_form.type) == 4) {
if (!this.card_bag_form.give_num) {
return this.$message.warning('提示:请设置购买次数');
}
}
// 截止日期
if (!this.card_bag_form.end_time) {
return this.$message.warning('提示:请选择截止时间');
}
// 是否存在次卡
if (this.wait_add.length <= 0) {
return this.$message.warning('提示:请先添加次卡');
}
this.$loading({
lock: true,
text: '创建中,请稍等......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
$.ajax({
url: "{:U('createCardBag')}",
type: "post",
data: {card_bag: this.card_bag_form, wait_add: this.wait_add},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.clearCardBagForm();
this.getCardBagList();
this.$message.success(res.msg);
} else {
this.$message.error(res.msg);
}
}
});
},
// 卡包详情
cardBagDetails(id) {
$.ajax({
url: "{:U('cardBagDetails')}",
type: "post",
data: {id: id},
success: (res) => {
if (res.status == 1) {
this.show_details = true;
this.card_bag_details = res.card_bag_details;
} else {
this.$message.warning(res.msg)
}
}
})
},
// 获取会员、批量发送
getVips(id, storeids, gradeids) {
this.$loading({
lock: true,
text: '会员查询中,请稍后......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
$.ajax({
url: "{:U('getVips')}",
type: "post",
data: {storeids: storeids, gradeids: gradeids},
success: (res) => {
this.$loading().close();
if (res.status == 1) {
this.splitVipsSendOut(res.vip_list, id);
} else {
this.$message({
message: res.msg,
type: 'error'
});
return false;
}
}
})
},
// 拆分会员(分开发送)
splitVipsSendOut(vip_list, id) {
this.$loading({
lock: true,
text: '发放中,请保持网络正常......',
spinner: 'el-icon-loading',
background: 'rgba(255, 255, 255, 0.7)'
});
var vips = new Array();
for (var i = 0; i < vip_list.length; i += 10) {
vips.push(vip_list.slice(i, i + 10));
}
if (vips.length > 0) {
this.vips = vips;
this.recursionVip(id, 0);
} else {
this.$loading().close();
this.$message({
message: '暂无可以发放的会员',
type: 'success'
});
}
},
// 递归得到要发送的会员
recursionVip(id, num) {
if ((num + 1) > this.vips.length) {
this.$loading().close();
this.$message({
message: '发送成功',
type: 'success'
});
if (this.card_mold == 2 || this.card_mold == '2') {
this.getCardBagList();
} else {
this.getSubCardList();
}
return false;
} else {
for (var i = 0; i < this.vips.length; i++) {
if (num == i) {
if (this.card_mold == 2 || this.card_mold == '2') { // 卡包
this.batchPutInCardBag(id, this.vips[i], num);
} else { // 次卡
this.batchPutInSubCard(id, this.vips[i], num);
}
}
}
}
},
// 次卡批量发放
batchPutInSubCard(id, vips, num) {
$.ajax({
url: "{:U('batchPutInSubCard')}",
type: "post",
data: {id: id, vips: vips},
success: (res) => {
if (res.status == 1) {
this.recursionVip(id, ++num)
} else if (res.status == 2) {
this.$loading().close();
this.$message({
message: '发送成功',
type: 'success'
});
this.getSubCardList();
this.vips = [];
} else {
this.$loading().close();
this.$message({
message: res.msg,
type: 'error'
});
this.getSubCardList();
this.vips = [];
}
}
})
},
// 卡包批量发送
batchPutInCardBag(id, vips, num) {
$.ajax({
url: "{:U('batchPutInCardBag')}",
type: "post",
data: {id: id, vips: vips},
success: (res) => {
if (res.status == 1) {
this.recursionVip(id, ++num)
} else if (res.status == 2) {
this.$loading().close();
this.$message({
message: '发送成功',
type: 'success'
});
this.getCardBagList();
this.vips = [];
} else {
this.$loading().close();
this.$message({
message: res.msg,
type: 'error'
});
this.getCardBagList();
this.vips = [];
}
}
})
},
// 指定发放临时保存查询条件
depositVipMap(id, storeids, gradeids) {
// 将id storeids gradeids 保存
var map = {
id: id,
storeids: storeids,
gradeids: gradeids
};
this.map = map;
this.getSendOutVipList();
},
// 指定发送获取会员
getSendOutVipList() {
this.loading = true
$.ajax({
url: "{:U('getSendOutVipList')}",
type: "post",
data: {
id: this.map.id,
card_mold: this.card_mold,
storeids: this.map.storeids,
gradeids: this.map.gradeids,
keyword: this.seek_data.keyword
},
success: (res) => {
this.loading = false;
if (res.status == 1) {
this.send_out = true;
this.card_data = res.card_data;
this.stores = res.stores;
this.grades = res.grades;
this.vip_list = res.vip_list;
} else {
this.$message({
message: res.msg,
type: 'error'
});
this.clearSendOutVipList();
}
}
})
},
// 勾选会员
choseVip(data) {
this.chose_vip = data;
},
// 指定发放
appointGrantCard() {
if (this.chose_vip.length <= 0) {
this.$message({
message: '提示:请先勾选指定发放的会员',
type: 'warning',
})
return false;
}
this.splitVipsSendOut(this.chose_vip, this.card_data.id);
},
// 获取详情
getGiveDetails(id) {
$.ajax({
url: "{:U('getGiveDetails')}",
type: "post",
data: {id: id, card_mold: this.card_mold},
success: (res) => {
if (res.status == 1) {
this.give_details_show = true;
this.give_details = res.give_details;
} else {
this.$message({
message: res.msg,
type: 'error',
})
return false;
}
}
})
},
// 记录
showRecord(id) {
// 弹出层
this.grant_record = true;
this.map.id = id;
this.record_taps = '1';
// 判断次卡类型
if (parseInt(this.card_mold) == 1) {
this.subCardRecord(id);
} else {
this.cardBagRecord(id);
}
},
// 选择记录类型
chooseRecordType() {
this.r_page = 1;
this.r_total = 0;
this.seek_data.keyword = '';
// 判断次卡类型
if (parseInt(this.card_mold) == 1) { // 次卡,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.subCardRecord(this.map.id); // 发放记录
} else {
this.subCardUseRecord(this.map.id); // 核销记录
}
} else { // 卡包,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.cardBagRecord(this.map.id); // 发放记录
} else {
this.cardBagUseRecord(this.map.id); // 核销记录
}
}
},
// 次卡发放记录
subCardRecord(id) {
this.loading2 = true;
$.ajax({
url: "{:U('subCardRecord')}",
type: "post",
data: {id: id, page: this.r_page, limit: this.r_limit, keyword: this.seek_data.keyword},
success: (res) => {
this.loading2 = false;
this.use_record_list = [];
if (res.status == 1) {
this.record_list = res.record_list;
this.r_total = res.total;
} else {
this.record_list = [];
this.r_total = 0;
}
}
})
},
// 次卡核销记录
subCardUseRecord(id) {
this.loading2 = true;
$.ajax({
url: "{:U('subCardUseRecord')}",
type: "post",
data: {id: id, page: this.r_page, limit: this.r_limit, keyword: this.seek_data.keyword},
success: (res) => {
this.loading2 = false;
this.record_list = [];
if (res.status == 1) {
this.use_record_list = res.use_record_list;
this.r_total = res.total;
} else {
this.use_record_list = [];
this.r_total = 0;
}
}
})
},
// 卡包发放记录
cardBagRecord(id) {
this.map.id = id;
this.grant_record = true;
this.loading2 = true;
$.ajax({
url: "{:U('cardBagRecord')}",
type: "post",
data: {id: id, page: this.r_page, limit: this.r_limit, keyword: this.seek_data.keyword},
success: (res) => {
this.loading2 = false;
if (res.status == 1) {
this.record_list = res.record_list;
this.r_total = res.total;
} else {
this.record_list = [];
this.r_total = 0;
}
}
})
},
// 卡包使用记录
cardBagUseRecord(id) {
this.loading2 = true;
$.ajax({
url: "{:U('cardBagUseRecord')}",
type: "post",
data: {id: id, page: this.r_page, limit: this.r_limit, keyword: this.seek_data.keyword},
success: (res) => {
this.loading2 = false;
this.record_list = [];
if (res.status == 1) {
this.use_record_list = res.use_record_list;
this.r_total = res.total;
} else {
this.use_record_list = [];
this.r_total = 0;
}
}
})
},
// 记录搜索
recordSeek() {
// 判断次卡类型
if (parseInt(this.card_mold) == 1) { // 次卡,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.subCardRecord(this.map.id); // 发放记录
} else {
this.subCardUseRecord(this.map.id); // 核销记录
}
} else { // 卡包,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.cardBagRecord(this.map.id); // 发放记录
} else {
this.cardBagUseRecord(this.map.id); // 核销记录
}
}
},
// 切换记录每页数量
rLimitChange(val) {
this.r_limit = val;
this.r_page = 1;
// 判断次卡类型
if (parseInt(this.card_mold) == 1) { // 次卡,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.subCardRecord(this.map.id); // 发放记录
} else {
this.subCardUseRecord(this.map.id); // 核销记录
}
} else { // 卡包,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.cardBagRecord(this.map.id); // 发放记录
} else {
this.cardBagUseRecord(this.map.id); // 核销记录
}
}
},
// 切换记录页数
rPageChange(val) {
this.r_page = val;
// 判断次卡类型
if (parseInt(this.card_mold) == 1) { // 次卡,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.subCardRecord(this.map.id); // 发放记录
} else {
this.subCardUseRecord(this.map.id); // 核销记录
}
} else { // 卡包,判断选择的类型
if (parseInt(this.record_taps) == 1) {
this.cardBagRecord(this.map.id); // 发放记录
} else {
this.cardBagUseRecord(this.map.id); // 核销记录
}
}
},
// 获取卡面图片
getCardImage(id, type) {
this.map.id = id;
this.image_type = type;
this.loading3 = true;
$.ajax({
url: "{:U('getCardImage')}",
type: "post",
data: {id: id, type: type},
success: (res) => {
this.loading3 = false;
if (res.status == 1) {
if (type == 1) {
this.card_image = true;
} else {
this.bag_image = true;
}
this.image_url = res.image_url && res.image_url != '' ? res.image_url : '';
} else {
this.$message({
message: res.msg,
type: 'error',
})
return false;
}
}
})
},
// 本地选择图片
changeImage() {
if (window.event.target.files.length) {
var imgObj = window.event.target.files[0];
var imgType = ['image/jpeg', 'image/jpg', 'image/png', 'image/gif'];
var that = this;
if (jQuery.inArray(imgObj.type, imgType) != -1) {
var reader = new FileReader();
reader.readAsDataURL(imgObj);
reader.onload = function () {
that.image_url = this.result;
that.gallery_id = '';
}
}
}
},
// 图库图片
selectImage() {
this.gallery_image = true;
},
// 选择图库图片
choseFile(item) {
if (item.length > 0) {
$("input[type='file']").val(''); // 清除本地选择
this.image_url = item[0].path;
this.gallery_id = item[0].id;
this.gallery_image = false;
} else {
this.$message({
message: '提示:请选择图片',
type: 'warning'
})
return false;
}
},
// 保存次卡卡面设置
saveCardSet() {
if (!this.image_url) {
this.$message({
message: '提示:请选择图片',
type: 'warning'
})
return false;
}
var formData = new FormData(document.getElementById('carg_img'));
$.ajax({
url: "{:U('saveCardSet')}",
type: "post",
data: formData,
processData: false, // jQuery不要去处理发送的数据
contentType: false, // jQuery不要去设置Content-Type请求头
success: (res) => {
if (res.status == 1) {
this.$message({
type: 'success',
message: res.msg,
});
} else {
this.$message({
type: 'error',
message: res.msg,
});
}
}
})
},
// 保存卡包卡面设置
saveBagSet() {
if (!this.image_url) {
this.$message({
message: '提示:请选择图片',
type: 'warning'
})
return false;
}
var formData = new FormData(document.getElementById('bag_img'));
$.ajax({
url: "{:U('saveBagSet')}",
type: "post",
data: formData,
processData: false, // jQuery不要去处理发送的数据
contentType: false, // jQuery不要去设置Content-Type请求头
success: (res) => {
if (res.status == 1) {
this.$message({
type: 'success',
message: res.msg,
});
} else {
this.$message({
type: 'error',
message: res.msg,
});
}
}
})
},
// 失效次卡
invalidSubCard(id) {
this.$confirm('确定失效该张次卡吗?失效后将不可恢复,已发次卡仍可以继续使用', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.ajax({
url: "{:U('invalidSubCard')}",
type: "post",
data: {id: id},
success: (res) => {
if (res.status == 1) {
this.$message({
message: res.msg,
type: 'success',
})
this.getSubCardList();
} else {
this.$message({
message: res.msg,
type: 'success',
})
return false;
}
}
})
});
},
// 失效卡包
invalidCardBag(id) {
this.$confirm('确定失效该卡包吗?失效后将不可恢复,已发次卡仍可以继续使用', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
$.ajax({
url: "{:U('invalidCardBag')}",
type: "post",
data: {id: id},
success: (res) => {
if (res.status == 1) {
this.$message({
message: res.msg,
type: 'success',
})
this.getCardBagList();
} else {
this.$message({
message: res.msg,
type: 'success',
})
return false;
}
}
})
});
},
// 清除搜索条件
clearSeekData() {
var seek_data = {
name: '',
start_time: '',
end_time: '',
};
this.seek_data = seek_data;
this.page = 1;
this.limit = 10;
this.total = 0;
},
// 清除次卡表单提交
clearSubCardForm() {
var sub_card_form = {
name: '',
card_name_color: '#FFFFFF',
btn_background: '#ffd100',
btn_text_color: '#333333',
stock: '',
use_type: '1',
frequency: '',
limit: '',
time_interval: ['00:00:00', '23:59:59'],
type: '1',
line_state: '1',
online_state: '1',
money: '',
give_num: 1,
grade_type: '1',
gradeids: [],
price: '',
vip_type: '1',
store_type: '1',
storeids: [],
end_time: '',
effective_time_type: 1,
effective_time: [],
effective_day: '',
introduce: '',
store_id: '',
goods: [],
};
this.sub_card_form = sub_card_form;
if (this.card_mold == 2 || this.card_mold == '2') {
// 卡包
this.new_add = false;
} else {
// 次卡
this.add_sub_card = false;
}
},
// 清除卡包表单提交
clearCardBagForm() {
var card_bag_form = {
name: '',
card_name_color: '#FFFFFF',
btn_background: '#ffd100',
btn_text_color: '#333333',
stock: '',
type: '1',
line_state: '1',
online_state: '1',
money: '',
give_num: 1,
grade_type: '1',
gradeids: [],
price: '',
vip_type: '1',
store_type: '1',
storeids: [],
end_time: '',
store_id: '',
goods: [],
};
this.card_bag_form = card_bag_form;
this.wait_add = [];
this.add_card_bag = false;
},
// 清除指定发放数据
clearSendOutVipList() {
var card_data = {
id: '',
name: ''
};
var vip_map = {
id: '',
storeids: '',
gradeids: ''
};
this.vip_map = vip_map;
this.seek_data.keyword = '';
this.card_data = card_data;
this.stores = [];
this.grades = [];
this.vip_list = [];
this.chose_vip = [];
this.send_out = false;
},
// 清除记录
clearRecord() {
this.grant_record = false;
this.record_list = [];
this.seek_data.keyword = '';
this.map.id = '';
this.r_page = 1;
this.r_limit = 10;
this.r_total = 0;
this.record_taps = '1';
this.use_record_list = [];
},
// 清除详情
clearGiveDetails() {
var give_details = {
name: '',
type: '',
money: '',
give_num: '',
};
this.give_details = give_details;
this.give_details_show = false;
},
// 清除次卡卡面图片
clearCardImage() {
this.card_image = false;
this.bag_image = false;
this.image_type = 1;
this.map.id = '';
this.image_url = '';
this.gallery_id = '';
},
},
created() {
this.getSubCardList();
},
})
</script>
</html>