<!DOCTYPE HTML>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
|
<meta name="renderer" content="webkit|ie-comp|ie-stand">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport"
|
content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
|
<meta http-equiv="Cache-Control" content="no-siteapp"/>
|
<!-- 本框架基本脚本和样式 -->
|
<script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script>
|
<link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}">
|
<link rel="stylesheet" th:href="@{/plugin/bootstrap-3.3.5/css/bootstrap.min.css}">
|
<link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/>
|
|
<!-- 富文本编辑器 -->
|
<script type="text/javascript" charset="utf-8"
|
th:src="@{/plugin/beditor/ueditor.config.js}"></script>
|
<script type="text/javascript" charset="utf-8"
|
th:src="@{/plugin/beditor/ueditor.all.js}">
|
</script>
|
<script type="text/javascript" charset="utf-8"
|
th:src="@{/plugin/beditor/lang/zh-cn/zh-cn.js}"></script>
|
<style>
|
|
.el-aside {
|
background-color: #D3DCE6;
|
color: #333;
|
text-align: center;
|
}
|
.el-main {
|
background-color: #E9EEF3;
|
color: #333;
|
}
|
body > .el-container {
|
margin-bottom: 1000px;
|
}
|
.button {
|
padding: 5px;
|
text-align: center;
|
}
|
|
.imageOne {
|
display: block;
|
height: 50px;
|
padding: 5px 5px;
|
text-align: center;
|
}
|
.imageTwo {
|
display: block;
|
height: 280px;
|
padding: 5px 5px;
|
text-align: center;
|
}
|
.imageThree {
|
display: block;
|
padding: 5px 5px;
|
text-align: center;
|
}
|
|
.box-card {
|
padding: 5px 5px;
|
}
|
|
</style>
|
</head>
|
|
<body>
|
<div class="panel-body" id="app" v-cloak>
|
<el-form :model="ruleForm" :rules="rules" class="form-horizontal" id="dataform" ref="ruleForm" label-width="120px">
|
|
<el-container>
|
<el-aside width="30%">
|
<el-card class="box-card" :body-style="{ padding: '10px 10px'}">
|
<el-row>
|
<div @click="uploadImg()" class="imageTwo" >
|
<img v-if="imageUrlHead" :src="imageUrlHead" style="width: 100%;height: 100%">
|
<el-button type="primary" v-show="imageUrlHead == ''" round><span style="font-size: 20px;">头部</span><span style="padding:5px;font-size: 15px;color: red;">(上传图片)</span></span></el-button>
|
</div>
|
</el-row>
|
<el-row style="display:flex;">
|
<el-col>
|
<div style="padding:5px;font-size: 15px;text-align: left;">
|
<el-button type="primary" size="mini" round>
|
<span>拥有积分：</span>
|
</el-button>
|
</div>
|
</el-col>
|
</el-row>
|
|
<el-row>
|
<div @click="uploadImg()" class="imageThree" >
|
<el-button type="primary" v-show="imageUrlButton == ''" round><span style="font-size: 20px;">签到按钮</span><span style="padding:5px;font-size: 15px;color: red;">(上传图片)</span></span></el-button>
|
<img v-if="imageUrlButton" :src="imageUrlButton" style="width: 100%;">
|
</div>
|
</el-row>
|
|
|
<el-row>
|
<div style="text-align: center;padding: 5px;" @click="gzsmSet()">
|
<div class="col-sm-8 col-sm-offset-2" style="text-align: left;">
|
<span style="padding:5px;font-size: 30px;">-- 规则说明--</span>
|
</div>
|
<div class="el-col-sm-24" style="text-align: center;">
|
<span style="padding:5px;font-size: 15px;color: red;">(点击，编辑规则内容，背景颜色，字体颜色、大小、透明度)</span>
|
</div>
|
<div class="col-sm-8 col-sm-offset-2" style="text-align: left;">
|
<span style="padding:5px;font-size: 15px;">1、每天参与签到可获得积分换取抽奖机会</span>
|
</div>
|
<div class="col-sm-8 col-sm-offset-2" style="text-align: left;">
|
<span style="padding:5px;font-size: 15px;">2、每天参与签到可获得积分换取抽奖机会</span>
|
</div>
|
<div class="col-sm-8 col-sm-offset-2" style="text-align: left;">
|
<span style="padding:5px;font-size: 15px;">3、每天参与签到可获得积分换取抽奖机会</span>
|
</div>
|
</div>
|
</el-row>
|
</el-card>
|
</el-aside>
|
|
<el-main width="70%">
|
<div>
|
<el-tabs v-model="activeName" @tab-click="clickSecondTab">
|
<el-tab-pane label="活动设置" name="first">
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="活动名称" prop="actName">
|
<el-input v-model="ruleForm.actName" placeholder="请输入活动名称"></el-input>
|
</el-form-item>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="活动编码" prop="actCode">
|
<el-input v-model.number="ruleForm.actCode" placeholder="请输入最大开团数量"></el-input>
|
</el-form-item>
|
</div>
|
<div class="col-sm-4 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="活动时间" prop="actTime">
|
<div class="block">
|
<el-date-picker
|
v-model="ruleForm.actTime"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期">
|
</el-date-picker>
|
</div>
|
</el-form-item>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<p class="el-big-title" style="text-align: left;">抽奖规则</p>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="每日抽奖机会">
|
<el-form-item label="每人每日有" prop="wmkcjjh">
|
<el-input-number v-model="ruleForm.wmkcjjh" :min="1" :max="10" label="描述文字"></el-input-number> 次无门槛抽奖机会
|
</el-form-item>
|
</el-form-item>
|
<el-form-item>
|
<el-form-item label="可用" prop="dhycjfs">
|
<el-input-number v-model="ruleForm.dhycjfs" :min="1" :max="200" label="描述文字"></el-input-number> 积分兑换1次抽奖机会,每日最多兑换
|
</el-form-item>
|
</el-form-item>
|
<el-form-item>
|
<el-form-item label="每日最多兑换" prop="jfdhcs">
|
<el-input-number v-model="ruleForm.jfdhcs" :min="1" :max="10" label="描述文字"></el-input-number> 次抽奖机会
|
</el-form-item>
|
</el-form-item>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="中奖概率">
|
<el-form-item label="每人最多中奖" prop="zzjcs">
|
<el-input-number v-model="ruleForm.zzjcs" :min="1" :max="100" label="描述文字"></el-input-number> 次
|
</el-form-item>
|
</el-form-item>
|
<el-form-item>
|
<el-form-item label="总中奖率" prop="zzjl">
|
<el-input-number v-model="ruleForm.zzjl" :min="1" :max="100" label="描述文字"></el-input-number> %
|
</el-form-item>
|
</el-form-item>
|
</div>
|
</el-tab-pane>
|
|
<el-tab-pane label="奖品设置" name="second">
|
<el-row style="display:flex;">
|
<el-col :span="20">
|
<el-tabs v-model="editableTabsValue" type="card" closable @tab-click="clickTab" @tab-remove="removeTab">
|
<el-tab-pane v-for="(item, index) in editableTabs" :key="item.name" :label="item.title" :name="item.name">
|
<el-row v-show="editableTabsValue !== '1'">
|
</el-row>
|
<el-row >
|
<el-col>
|
<el-form-item label="奖项名称">
|
<el-input v-model="item.content.awardName" placeholder="奖项名称"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row >
|
<el-col>
|
<el-form-item label="图片介绍">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="introduceImgSuccess">
|
<img v-if="item.content.introduceImg" :src="item.content.introduceImg" style="max-width: 200px;">
|
</el-upload>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div v-show="item.name !== '1'">
|
<el-row>
|
<el-form-item label="奖项类型">
|
<el-col>
|
<el-radio-group v-model="item.content.awardType" @change="jxlxChange">
|
<el-radio :label="1">自定义奖品</el-radio>
|
<el-radio :label="2">积分</el-radio>
|
<el-radio :label="3">优惠券</el-radio>
|
<el-radio :label="4">商品</el-radio>
|
</el-radio-group>
|
</el-col>
|
</el-form-item >
|
</el-row>
|
|
<div>
|
<el-row style="display:flex;">
|
<el-col>
|
<el-form-item label="奖项库存">
|
<el-input v-model="item.content.awardInventoryCnt" oninput ="value=value.replace(/[^0-9.]/g,'')"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col>
|
<el-form-item label="已派发">
|
<el-input v-model="item.content.awardDistributeCnt"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div v-show="item.content.awardType === 1">
|
<el-row >
|
<el-col>
|
<el-form-item label="文字介绍">
|
<el-input type="textarea" v-model="item.content.introduceTip"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row >
|
<el-col>
|
<el-form-item label="兑奖方式">
|
<el-col>
|
<el-radio-group v-model="item.content.awardWay" @change="awardWayChange">
|
<el-radio :label="'1'">线下兑换</el-radio>
|
<el-radio :label="'2'">物流配送</el-radio>
|
<el-radio :label="'3'">客服兑换</el-radio>
|
</el-radio-group>
|
</el-col>
|
</el-form-item >
|
</el-col>
|
</el-row>
|
<el-row >
|
<el-col>
|
<el-form-item label="操作提示">
|
<el-input v-model="item.content.operationTip"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div v-show="item.content.awardWay === '1'">
|
<el-row >
|
<el-col>
|
<el-form-item label="兑奖地址">
|
<el-input v-model="item.content.prizeAddress"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
</div>
|
<div v-show="item.content.awardWay === '3'">
|
<el-row >
|
<el-col>
|
<el-form-item label="客服微信">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="wechatImgSuccess">
|
<img v-if="item.content.wechatImg" :src="item.content.wechatImg" style="max-width: 200px;">
|
</el-upload>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div v-show="[1,3].includes(item.content.awardWay)">
|
<el-row >
|
<el-col>
|
<el-form-item label="客服电话">
|
<el-input v-model="item.content.customerPhone"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div v-show="item.content.awardWay !== '2'">
|
<el-row >
|
<el-col>
|
<el-form-item label="兑奖期限">
|
<div class="block">
|
<el-date-picker
|
v-model="item.content.prizeTime"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期">
|
</el-date-picker>
|
</div>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
</div>
|
<div v-show="item.content.awardType === 2">
|
<el-row >
|
<el-col>
|
<el-form-item label="积分数量">
|
<el-input v-model="item.content.scoreCnt" oninput ="value=value.replace(/[^0-9.]/g,'')"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</div>
|
<div v-show="item.content.awardType === 3">
|
<el-row style="display:flex;">
|
<el-col>
|
<el-form-item label="优惠券名称">
|
<el-input v-model="item.content.couponName"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col>
|
<el-form-item label="优惠券">
|
<el-input v-model="item.content.couponId"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col>
|
<el-button type="primary" @click="chooseCoupon(item.content.couponName,item.name)">
|
选择优惠券
|
</el-button>
|
</el-col>
|
</el-row>
|
|
<el-drawer
|
title="选择商城优惠券"
|
:visible.sync="drawerCoupon"
|
:direction="directionCoupon"
|
size="90%">
|
<el-row style="margin-left: 50px;">
|
<el-col :span="24">
|
<el-row>
|
<el-form ref="formCoupon" :model="formCoupon" inline >
|
<el-form-item prop="yhjmc">
|
<el-input v-model="formCoupon.yhjmc" placeholder="请输入优惠券名称"></el-input>
|
</el-form-item>
|
<el-button type="primary" @click="searchFormCoupon" >搜索</el-button>
|
<el-button @click="resetFormCoupon('formCoupon')">重置</el-button>
|
</el-form>
|
</el-row>
|
|
<el-row class="table-style" >
|
<el-table ref="multipleTable"
|
:data="couponList.rows"
|
:height="tableHeightCoupon"
|
stripe:true
|
style="width: 100%">
|
<el-table-column
|
prop="cname"
|
label="优惠券名称"
|
show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column
|
prop="endTime"
|
label="截止日期"
|
show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="操作">
|
<template slot-scope="scope">
|
<el-button type="primary"
|
size="mini"
|
@click="chooseOneCoupon(scope.row)">选择
|
</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-row>
|
<el-row class="paginationStyle" >
|
<el-pagination background
|
@size-change="changePageSizeCoupon"
|
@current-change="changeCurrentPageCoupon"
|
:current-page="couponList.currentPage"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="couponList.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="couponList.total">
|
</el-pagination>
|
</el-row>
|
</el-col>
|
</el-row>
|
</el-drawer>
|
</div>
|
<div v-show="item.content.awardType === 4">
|
<el-row style="display:flex;">
|
<el-col>
|
<el-form-item label="品项名称">
|
<el-input v-model="item.content.goodsName"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col>
|
<el-form-item label="品项">
|
<el-input v-model="item.content.goodsId"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col>
|
<el-button type="primary" @click="chooseGoods(item.content.goodsName,item.name)">
|
选择品项
|
</el-button>
|
</el-col>
|
</el-row>
|
|
<el-drawer
|
title="选择ERP产品"
|
:visible.sync="drawerGoods"
|
:direction="directionGoods"
|
size="90%">
|
<el-row style="margin-left: 50px;">
|
<el-col :span="24">
|
<el-row>
|
<el-form ref="formGoods" :model="formGoods" inline >
|
<el-form-item prop="cpmc">
|
<el-input v-model="formGoods.cpmc" placeholder="请输入产品名称"></el-input>
|
</el-form-item>
|
<el-button type="primary" @click="searchFormGoods" >搜索</el-button>
|
<el-button @click="resetFormGoods('formGoods')">重置</el-button>
|
</el-form>
|
</el-row>
|
|
<el-row class="table-style" >
|
<el-table ref="multipleTable"
|
:data="goodsList.rows"
|
:height="tableHeightGoods"
|
stripe:true
|
style="width: 100%">
|
<el-table-column
|
prop="name"
|
label="名称"
|
show-overflow-tooltip>
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="操作">
|
<template slot-scope="scope">
|
<el-button type="primary"
|
size="mini"
|
@click="chooseOneGoods(scope.row)">选择
|
</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-row>
|
<el-row class="paginationStyle" >
|
<el-pagination background
|
@size-change="changePageSizeGoods"
|
@current-change="changeCurrentPageGoods"
|
:current-page="goodsList.currentPage"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="goodsList.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="goodsList.total">
|
</el-pagination>
|
</el-row>
|
</el-col>
|
</el-row>
|
</el-drawer>
|
</div>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
</el-col>
|
<el-col :span="4">
|
<el-button type="primary" @click="addTab(editableTabsValue)">
|
新增奖品
|
</el-button>
|
</el-col>
|
</el-row>
|
</el-tab-pane>
|
|
<el-tab-pane label="背景图片上传" name="third">
|
<!--<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="标题">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="imageUrlTitleSuccess">
|
<img v-if="imageUrlTitle" :src="imageUrlTitle" style="max-width: 300px;">
|
</el-upload>
|
</el-form-item>
|
</div>-->
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="头部">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="imageUrlHeadSuccess">
|
<img v-if="imageUrlHead" :src="imageUrlHead" style="max-width: 300px;">
|
</el-upload>
|
</el-form-item>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="开始按钮">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="imageUrlTitleSuccess">
|
<img v-if="imageUrlTitle" :src="imageUrlTitle" style="max-width: 300px;">
|
</el-upload>
|
</el-form-item>
|
</div>
|
<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="奖品划分线">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="imageLineSuccess">
|
<img v-if="imageLine" :src="imageLine" style="max-width: 300px;">
|
</el-upload>
|
</el-form-item>
|
</div>
|
|
<!--<div class="col-sm-8 col-sm-offset-1" style="padding: 10px">
|
<el-form-item label="转盘背景">
|
<el-upload
|
action="/admin/multipleUploadFile/doUpload"
|
:show-file-list="false"
|
:on-success="imageUrlButtonSuccess">
|
<img v-if="imageUrlButton" :src="imageUrlButton" style="max-width: 300px;">
|
<i v-else></i>
|
</el-upload>
|
</el-form-item>
|
</div>-->
|
</el-tab-pane>
|
|
<el-tab-pane label="规则说明" name="fourth">
|
<div class="col-sm-8 col-sm-offset-1">
|
<el-form-item label="规则内容" prop="ruleExplain" style="padding: 10px">
|
<el-input type="textarea" v-model="ruleForm.ruleExplain"></el-input>
|
</el-form-item>
|
<el-form-item label="背景颜色" style="padding: 10px">
|
<el-color-picker v-model="backgroundColor"></el-color-picker>
|
</el-form-item>
|
<el-form-item label="字体颜色" style="padding: 10px">
|
<el-color-picker v-model="typographyColor"></el-color-picker>
|
</el-form-item>
|
<el-form-item label="字体大小" style="padding: 10px">
|
<el-input-number v-model="typographyNum" :min="10" :max="50" label="描述文字"></el-input-number>
|
</el-form-item>
|
<!--<el-form-item label="字体透明度" style="padding: 10px">
|
<el-input-number v-model="typographyLight" :min="1" :max="100" label="描述文字">%</el-input-number>
|
</el-form-item>-->
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
|
<div class="form-group ">
|
<div class="col-sm-12 text-center">
|
<el-button type="primary" @click="updateSignAwardSet('ruleForm')">保存</el-button>
|
<el-button type="danger" @click="cancelSubmit">关闭</el-button>
|
</div>
|
</div>
|
</el-main>
|
|
</el-container>
|
|
</el-form>
|
</div>
|
</body>
|
<script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/jquery.query.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/bootstrap-3.3.5/js/bootstrap.min.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/layer/layer.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script>
|
|
<script>
|
//获取传输的活动对象
|
var actId = $.query.get("actId");
|
const prize = {
|
//奖品基本信息
|
id:'',
|
cumulativeDay:'',
|
awardType:1,
|
awardName:'',
|
introduceImg:'',
|
introduceTip:'',
|
awardInventoryCnt:'',
|
awardDistributeCnt:'',
|
awardWay:1,
|
operationTip:'',
|
prizeAddress:'',
|
prizeTime: '',
|
wechatImg:'',
|
scoreCnt:'',
|
couponId:'',
|
customerPhone:'',
|
goodsId:'',
|
couponName:'',
|
goodsName:'',
|
}
|
var app = new Vue({
|
el: '#app',
|
data: {
|
activeName: 'first',
|
formLabelWidth: '120px',
|
//标题图片
|
imageLine: "../../../images/luckyDraw/line.png",
|
imageUrlTitle: "../../../images/luckyDraw/start.png",
|
imageUrlButton: "",
|
imageUrlHead: "../../../images/luckyDraw/zhuanpan.png",
|
|
activeClickTab:0,
|
|
//优惠券搜索弹出
|
drawerCoupon: false,
|
directionCoupon: 'rtl',
|
tableHeightCoupon: 500,
|
//--优惠券
|
formCoupon:{
|
yhjmc:'',
|
order:'',
|
sort:''
|
},
|
couponList:{
|
rows:[],
|
total:0,
|
pageSize:10,
|
currentPage:1,
|
},
|
|
//品项搜索弹出
|
drawerGoods: false,
|
directionGoods: 'rtl',
|
tableHeightGoods: 500,
|
//--品项
|
formGoods:{
|
cpmc:'',
|
order:'',
|
sort:''
|
},
|
goodsList:{
|
rows:[],
|
total:0,
|
pageSize:10,
|
currentPage:1,
|
},
|
|
//字体颜色
|
typographyColor: '#409EFF',
|
//背景颜色
|
backgroundColor: '#409EFF',
|
//字体大小
|
typographyNum: '5',
|
//字体透明度
|
typographyLight: '50',
|
//奖品设置
|
prize:JSON.parse(JSON.stringify(prize)),
|
editableTabsValue: '1',
|
editableTabs: [{
|
title: '谢谢参与',
|
name: '1',
|
content: JSON.parse(JSON.stringify(prize))
|
}],
|
tabIndex: 1,
|
|
ruleForm : {
|
//商品基本信息
|
actName : '',
|
actCode : '',
|
actTime : '',
|
//抽奖规则
|
wmkcjjh : '5',
|
dhycjfs : '20',
|
jfdhcs : '10',
|
zzjcs : '5',
|
zzjl : '10',
|
//规则说明
|
ruleExplain : '',
|
},
|
rules : {
|
//商品基本信息
|
actName : [
|
{ required: true, message: '请输入活动名称', trigger: 'blur' }
|
],
|
actCode : [
|
{ required: true, message: '请输入活动编码', trigger: 'blur' }
|
],
|
actTime : [
|
{ required: true, message: '请选择日期', trigger: 'change' }
|
],
|
wmkcjjh : [
|
{ required: true, message: '请输入1到10的数字', trigger: 'blur' }
|
],
|
dhycjfs : [
|
{ required: true, message: '请输入1到200的数字', trigger: 'blur' }
|
],
|
jfdhcs : [
|
{ required: true, message: '请输入1到10的数字', trigger: 'blur' }
|
],
|
zzjcs : [
|
{ required: true, message: '请输入1到100的数字', trigger: 'blur' }
|
],
|
zzjl : [
|
{ required: true, message: '请输入1到100的数字', trigger: 'blur' }
|
],
|
ruleExplain : [
|
{ required: true, message: '请输入规则内容', trigger: 'blur' }
|
]
|
},
|
},
|
created: function () {
|
this.loadInfo();
|
},
|
methods: {
|
//选择优惠券
|
chooseCoupon(val,name){
|
let _this = this;
|
_this.drawerCoupon = true;
|
_this.activeClickTab = parseInt(name);
|
|
console.log(_this.activeClickTab);
|
_this.formCoupon.yhjmc = val;
|
_this.loadCouponList();
|
},
|
//--优惠券
|
loadCouponList() {
|
let _this = this;
|
let data=_this.getRequestParamCoupon();
|
data.pageSize=_this.couponList.pageSize;
|
data.pageNum=_this.couponList.currentPage;
|
AjaxProxy.requst({
|
app: _this,
|
data:data,
|
url: basePath + '/admin/activitySignAwardSet/selectCouponList',
|
callback: function (data) {
|
_this.couponList.rows = data.rows;
|
_this.couponList.total = data.total;
|
}
|
});
|
},
|
//查询参数
|
getRequestParamCoupon(){
|
let _this = this;
|
return {
|
yhjmc:_this.formCoupon.yhjmc,
|
order:_this.formCoupon.order,
|
sort:_this.formCoupon.sort,
|
}
|
},
|
//查询
|
searchFormCoupon:function(){
|
this.couponList.currentPage=1;
|
this.loadCouponList();
|
},
|
//重置
|
resetFormCoupon(formName) {
|
(this.$refs[formName])[0].resetFields();
|
},
|
changePageSizeCoupon(val) {
|
this.couponList.pageSize = val;
|
this.loadCouponList();
|
},
|
changeCurrentPageCoupon(val) {
|
this.couponList.currentPage = val;
|
this.loadCouponList();
|
},
|
//选择
|
chooseOneCoupon(row) {
|
let _this = this;
|
_this.editableTabs[_this.activeClickTab-1].content.couponId = row.id;
|
_this.editableTabs[_this.activeClickTab-1].content.couponName = row.cname;
|
_this.drawerCoupon = false;
|
},
|
|
//选择品项
|
chooseGoods(val,name){
|
let _this = this;
|
_this.drawerGoods = true;
|
_this.activeClickTab = parseInt(name);
|
_this.formGoods.cpmc = val;
|
_this.loadGoodsList();
|
},
|
//--品项
|
loadGoodsList() {
|
let _this = this;
|
let data=_this.getRequestParamGoods();
|
data.pageSize=_this.goodsList.pageSize;
|
data.pageNum=_this.goodsList.currentPage;
|
AjaxProxy.requst({
|
app: _this,
|
data:data,
|
url: basePath + '/admin/activitySignAwardSet/selectGoodsList',
|
callback: function (data) {
|
_this.goodsList.rows = data.rows;
|
_this.goodsList.total = data.total;
|
}
|
});
|
},
|
//查询参数
|
getRequestParamGoods(){
|
let _this = this;
|
return {
|
cpmc:_this.formCoupon.cpmc,
|
order:_this.formCoupon.order,
|
sort:_this.formCoupon.sort,
|
}
|
},
|
//查询
|
searchFormGoods:function(){
|
this.goodsList.currentPage=1;
|
this.loadGoodsList();
|
},
|
//重置
|
resetFormGoods(formName) {
|
(this.$refs[formName])[0].resetFields();
|
},
|
changePageSizeGoods(val) {
|
this.goodsList.pageSize = val;
|
this.loadGoodsList();
|
},
|
changeCurrentPageGoods(val) {
|
this.goodsList.currentPage = val;
|
this.loadGoodsList();
|
},
|
//选择
|
chooseOneGoods(row) {
|
let _this = this;
|
_this.editableTabs[_this.activeClickTab-1].content.goodsId = row.id;
|
_this.editableTabs[_this.activeClickTab-1].content.goodsName = row.name;
|
_this.drawerGoods = false;
|
},
|
|
//加载活动详情
|
loadInfo() {
|
let _this = this;
|
_this.loadSign();
|
},
|
loadSign() {
|
let _this = this;
|
let data={
|
actId:actId,
|
};
|
AjaxProxy.requst({
|
app: _this,
|
data:data,
|
url: basePath + '/admin/activitySignAwardSet/findLuckyDrawForUpdate',
|
callback: function (data) {
|
_this.ruleForm.actName = data.mapInfo.addLuckyDrawSetVo.actName;
|
_this.ruleForm.actCode = data.mapInfo.addLuckyDrawSetVo.actCode;
|
let arrayObj = new Array();
|
arrayObj.push(new Date(data.mapInfo.addLuckyDrawSetVo.beginTime));
|
arrayObj.push(new Date(data.mapInfo.addLuckyDrawSetVo.endTime));
|
_this.ruleForm.actTime = arrayObj;
|
//抽奖规则
|
_this.ruleForm.wmkcjjh = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.wmkcjjh;
|
_this.ruleForm.dhycjfs = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.dhycjfs;
|
_this.ruleForm.jfdhcs = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.jfdhcs;
|
_this.ruleForm.zzjcs = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.zzjcs;
|
_this.ruleForm.zzjl = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.zzjl;
|
//字体颜色
|
_this.ruleForm.ruleExplain = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.ruleExplain;
|
_this.typographyColor = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.typographyColor;
|
_this.backgroundColor = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.backgroundColor;
|
_this.typographyNum = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.typographyNum;
|
_this.typographyLight = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.typographyLight;
|
_this.imageUrlTitle = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.imageUrlTitle;
|
_this.imageUrlHead = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.imageUrlHead;
|
_this.imageUrlButton = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.imageUrlButton;
|
_this.imageUrlState = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.imageUrlState;
|
_this.imageLine = data.mapInfo.addLuckyDrawSetVo.luckyDrawBasicJsonVo.imageLine;
|
|
for (let i = 0; i < data.mapInfo.addLuckyDrawSetVo.activityluckyDrawSets.length; i++) {
|
_this.tabIndex = data.mapInfo.addLuckyDrawSetVo.activityluckyDrawSets.length;
|
let prizeVo = data.mapInfo.addLuckyDrawSetVo.activityluckyDrawSets[i];
|
let arrayObjs = new Array();
|
arrayObjs.push(new Date(prizeVo.prizeStartTime));
|
arrayObjs.push(new Date(prizeVo.prizeEndTime));
|
let content = JSON.parse(JSON.stringify(prize));
|
content = {
|
id: prizeVo.id,
|
cumulativeDay: prizeVo.cumulativeDay,
|
awardType: parseInt(prizeVo.awardType),
|
awardName: prizeVo.awardName,
|
introduceImg: prizeVo.introduceImg,
|
customerPhone: prizeVo.customerPhone,
|
introduceTip: prizeVo.introduceTip,
|
awardInventoryCnt: prizeVo.awardInventoryCnt,
|
awardDistributeCnt: prizeVo.awardDistributeCnt,
|
awardWay: parseInt(prizeVo.awardWay),
|
operationTip: prizeVo.operationTip,
|
prizeAddress: prizeVo.prizeAddress,
|
wechatImg: prizeVo.wechatImg,
|
scoreCnt: prizeVo.scoreCnt,
|
couponId: prizeVo.couponId,
|
goodsId: prizeVo.goodsId,
|
couponName: prizeVo.couponName,
|
goodsName: prizeVo.goodsName,
|
prizeTime: arrayObjs,
|
}
|
if(i === 0){
|
_this.editableTabs[0].content = content;
|
}else{
|
let newTabName = i+1 +'';
|
_this.editableTabs.push({
|
title: "商品奖励"+"("+newTabName+")",
|
name: newTabName,
|
content: content,
|
});
|
this.editableTabsValue = newTabName;
|
}
|
}
|
}
|
});
|
},
|
//保存
|
updateSignAwardSet : function(formName) {
|
const _this = this;
|
let flag = false;
|
_this.$refs[formName].validate((valid) => {
|
if (!valid) {
|
_this.$notify({
|
title: '提示',
|
message: '请完善转盘抽奖活动信息',
|
type: 'warning'
|
});
|
flag = true;
|
return;
|
}
|
});
|
if (flag) {
|
return;
|
}
|
//活动基本信息
|
let luckyDrawBasicJsonDto = {
|
ruleExplain: _this.ruleForm.ruleExplain,
|
//字体颜色
|
typographyColor: _this.typographyColor,
|
//背景颜色
|
backgroundColor: _this.backgroundColor,
|
//字体大小
|
typographyNum: _this.typographyNum,
|
//标题图片
|
imageUrlTitle: _this.imageUrlTitle,
|
imageLine: _this.imageLine,
|
imageUrlHead: _this.imageUrlHead,
|
imageUrlButton: _this.imageUrlButton,
|
//抽奖规则
|
wmkcjjh: _this.ruleForm.wmkcjjh,
|
dhycjfs: _this.ruleForm.dhycjfs,
|
jfdhcs: _this.ruleForm.jfdhcs,
|
zzjcs: _this.ruleForm.zzjcs,
|
zzjl: _this.ruleForm.zzjl,
|
}
|
//奖品信息
|
let activityAwardSets = [];
|
for (let i = 0; i < _this.editableTabs.length; i++) {
|
let prize = _this.editableTabs[i].content;
|
let name = _this.editableTabs[i].title;
|
let awardRule = 2;
|
if(name == "谢谢参与"){
|
awardRule = 1;
|
}
|
let activitySignAwardSet = {
|
id: prize.id,
|
cumulativeDay: prize.cumulativeDay,
|
awardRule: awardRule,
|
awardType: prize.awardType,
|
awardName: prize.awardName,
|
introduceImg: prize.introduceImg,
|
introduceTip: prize.introduceTip,
|
awardInventoryCnt: prize.awardInventoryCnt,
|
awardDistributeCnt: prize.awardDistributeCnt,
|
awardWay: prize.awardWay,
|
operationTip: prize.operationTip,
|
customerPhone: prize.customerPhone,
|
prizeAddress: prize.prizeAddress,
|
wechatImg: prize.wechatImg,
|
scoreCnt: prize.scoreCnt,
|
couponId: prize.couponId,
|
goodsId: prize.goodsId,
|
couponName: prize.couponName,
|
goodsName: prize.goodsName,
|
prizeStartTime: prize.prizeTime[0],
|
prizeEndTime: prize.prizeTime[1],
|
}
|
activityAwardSets.push(activitySignAwardSet);
|
}
|
let resultData = {
|
actMainId: actId,
|
actName: _this.ruleForm.actName,
|
actCode: _this.ruleForm.actCode,
|
beginTime : _this.ruleForm.actTime[0],
|
endTime : _this.ruleForm.actTime[1],
|
luckyDrawBasicJsonDto,
|
activityAwardSets,
|
}
|
AjaxProxy.requst({
|
app: _this,
|
data: resultData,
|
url: basePath + '/admin/activitySignAwardSet/updateLuckyDrawSet',
|
callback: function (data) {
|
_this.$message({
|
message: data.info,
|
type: 'success',
|
});
|
}
|
});
|
},
|
//奖品设置
|
addTab(targetName) {
|
let newTabName = ++this.tabIndex + '';
|
this.editableTabs.push({
|
title: "转盘奖品"+"("+newTabName+")",
|
name: newTabName,
|
content: JSON.parse(JSON.stringify(prize)),
|
});
|
this.editableTabsValue = newTabName;
|
this.activeClickTab = parseInt(newTabName);
|
},
|
clickSecondTab(targetName) {
|
this.activeClickTab = 1;
|
},
|
clickTab(targetName) {
|
console.log(targetName.name);
|
this.activeClickTab = parseInt(targetName.name);
|
},
|
removeTab(targetName) {
|
let tabs = this.editableTabs;
|
let activeName = this.editableTabsValue;
|
if(activeName === '1' || targetName === '1'){
|
this.$notify({
|
title: '提示',
|
message: '【谢谢参与】不能删除',
|
type: 'warning'
|
});
|
}else{
|
if (activeName === targetName) {
|
tabs.forEach((tab, index) => {
|
if (tab.name === targetName && tab.title !== "谢谢参与") {
|
let nextTab = tabs[index + 1] || tabs[index - 1];
|
if (nextTab) {
|
activeName = nextTab.name;
|
}
|
}
|
});
|
}
|
this.editableTabsValue = activeName;
|
this.editableTabs = tabs.filter(tab => tab.name !== targetName);
|
this.tabIndex = this.editableTabs.length;
|
}
|
},
|
//切换奖项类型，显示不同内容
|
jxlxChange(val){
|
let _this = this;
|
_this.isShow=val;
|
},
|
//切换兑奖方式，显示不同内容
|
awardWayChange(val){
|
let _this = this;
|
_this.isShow=val;
|
},
|
//跳转到图片上传
|
uploadImg(){
|
this.activeName = 'third';
|
},
|
//跳转到规则说明
|
gzsmSet(){
|
this.activeName = 'fourth';
|
},
|
//标题图片
|
imageUrlTitleSuccess(res, file) {
|
this.imageUrlTitle = res.path;
|
},
|
imageLineSuccess(res, file) {
|
this.imageLine = res.path;
|
},
|
imageUrlHeadSuccess(res, file) {
|
this.imageUrlHead = res.path;
|
},
|
imageUrlButtonSuccess(res, file) {
|
this.imageUrlButton = res.path;
|
},
|
//奖品设置的图片介绍
|
introduceImgSuccess(res, file) {
|
this.editableTabs[this.activeClickTab-1].content.introduceImg = res.path;
|
},
|
//奖品设置的客服微信
|
wechatImgSuccess(res, file) {
|
this.editableTabs[this.activeClickTab-1].content.wechatImg = res.path;
|
},
|
cancelSubmit() {
|
this.closeFrame();
|
},
|
closeFrame() {
|
parent.layer.close(parent.layer.getFrameIndex(window.name));
|
},
|
}
|
})
|
</script>
|
|
</body>
|
</html>
|
