You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
760 lines
42 KiB
760 lines
42 KiB
9 months ago
|
{extend name="public/container"}
|
||
|
|
{block name="head_top"}
|
||
|
|
<link href="{__ADMIN_PATH}plug/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
|
||
|
|
<link href="{__ADMIN_PATH}module/wechat/news/css/style.css" type="text/css" rel="stylesheet">
|
||
|
|
<link href="{__FRAME_PATH}css/plugins/chosen/chosen.css" rel="stylesheet">
|
||
|
|
<script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/template.min.js"></script>
|
||
|
|
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.config.js"></script>
|
||
|
|
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.min.js"></script>
|
||
|
|
<script src="{__ADMIN_PATH}frame/js/ajaxfileupload.js"></script>
|
||
|
|
<script src="{__ADMIN_PATH}plug/validate/jquery.validate.js"></script>
|
||
|
|
<script src="{__FRAME_PATH}js/plugins/chosen/chosen.jquery.js"></script>
|
||
|
|
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/ueditor/third-party/zeroclipboard/ZeroClipboard.js"></script>
|
||
|
|
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/ueditor/ueditor.config.js"></script>
|
||
|
|
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/ueditor/ueditor.all.min.js"></script>
|
||
|
|
<style>
|
||
|
|
.layui-form-item.event .layui-input-inline {
|
||
|
|
width: 130px;
|
||
|
|
}
|
||
|
|
.layui-form-item.event .layui-inline:nth-child(4) .layui-input-inline {
|
||
|
|
width: 500px;
|
||
|
|
}
|
||
|
|
.layui-form-item.event .layui-inline:nth-child(5) .layui-input-inline {
|
||
|
|
width: 60px;
|
||
|
|
}
|
||
|
|
.layui-form-item.event .layui-form-label {
|
||
|
|
width: 50px;
|
||
|
|
}
|
||
|
|
.layui-form-item.price .layui-input-inline {
|
||
|
|
width: 130px;
|
||
|
|
}
|
||
|
|
.layui-form-item.price .layui-input-block .layui-form-label {
|
||
|
|
width: 50px;
|
||
|
|
}
|
||
|
|
.layui-form-item.price .layui-inline:nth-child(4) .layui-form-label {
|
||
|
|
width: 80px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
{/block}
|
||
|
|
{block name="content"}
|
||
|
|
<div v-cloak id="app" class="layui-fluid">
|
||
|
|
<div class="layui-card">
|
||
|
|
<div class="layui-card-body">
|
||
|
|
<form class="layui-form" action="">
|
||
|
|
<div class="layui-tab layui-tab-brief" lay-filter="tab">
|
||
|
|
<ul class="layui-tab-title">
|
||
|
|
<li class="layui-this" lay-id="0">基本设置</li>
|
||
|
|
<li lay-id="1">规则设置</li>
|
||
|
|
<li lay-id="2">详情设置</li>
|
||
|
|
<li lay-id="3">资料设置</li>
|
||
|
|
<li lay-id="4">价格设置</li>
|
||
|
|
</ul>
|
||
|
|
<div class="layui-tab-content">
|
||
|
|
<div class="layui-tab-item layui-show">
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">活动标题：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<input type="text" required lay-verify="required" placeholder="请输入活动标题" maxlength="50" autocomplete="off" class="layui-input" v-model.trim="formData.title">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<div class="layui-inline">
|
||
|
|
<label class="layui-form-label">报名时间：</label>
|
||
|
|
<div class="layui-input-inline" style="width: 380px;">
|
||
|
|
<input type="text" class="layui-input" autocomplete="off" id="date1" placeholder=" - ">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<div class="layui-inline">
|
||
|
|
<label class="layui-form-label">活动时间：</label>
|
||
|
|
<div class="layui-input-inline" style="width: 380px;">
|
||
|
|
<input type="text" class="layui-input" autocomplete="off" id="date2" placeholder=" - ">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">活动人数：</label>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input type="number" required lay-verify="required" min="1" placeholder="活动人数必须大于1" autocomplete="off" class="layui-input" v-model.number="formData.number">
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-mid layui-word-aux">活动人数必须大于1</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">活动封面：（710*400）</label>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<div v-show="formData.image" class="upload-image-box" @mousemove="mask.image = true" @mouseleave="mask.image = false">
|
||
|
|
<img :src="formData.image">
|
||
|
|
<div v-show="mask.image" class="mask" style="display: block;">
|
||
|
|
<p>
|
||
|
|
<i class="fa fa-eye" @click="look(formData.image)"></i>
|
||
|
|
<i class="fa fa-trash-o" @click="delect('image')"></i>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-show="!formData.image" class="upload-image" @click="upload('image')">
|
||
|
|
<div class="fiexd"><i class="fa fa-plus"></i></div>
|
||
|
|
<p>选择图片</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">二维码：（200*200）</label>
|
||
|
|
<div class="layui-input-inline" style="width: auto;">
|
||
|
|
<div v-show="formData.qrcode_img" class="upload-image-box" @mousemove="mask.qrcode_img = true" @mouseleave="mask.qrcode_img = false">
|
||
|
|
<img :src="formData.qrcode_img">
|
||
|
|
<div v-show="mask.qrcode_img" class="mask" style="display: block;">
|
||
|
|
<p>
|
||
|
|
<i class="fa fa-eye" @click="look(formData.qrcode_img)"></i>
|
||
|
|
<i class="fa fa-trash-o" @click="delect('qrcode_img')"></i>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-show="!formData.qrcode_img" class="upload-image" @click="upload('qrcode_img')">
|
||
|
|
<div class="fiexd"><i class="fa fa-plus"></i></div>
|
||
|
|
<p>选择图片</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item" id="area-picker">
|
||
|
|
<label class="layui-form-label">活动地址：</label>
|
||
|
|
<div class="layui-input-inline" style="width: 380px;">
|
||
|
|
<select name="province" class="province-selector" data-value="" lay-filter="province-1" v-model="formData.province">
|
||
|
|
<option value="">请选择省</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="layui-input-inline" style="width: 380px;">
|
||
|
|
<select name="city" class="city-selector" data-value="" lay-filter="city-1" v-model="formData.city">
|
||
|
|
<option value="">请选择市</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
<div class="layui-input-inline" style="width: 380px;">
|
||
|
|
<select name="county" class="county-selector" data-value="" lay-filter="county-1" v-model="formData.district">
|
||
|
|
<option value="">请选择区</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">详细地址：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<input type="text" name="detail" required lay-verify="required" placeholder="请输入详细地址" maxlength="50" autocomplete="off" class="layui-input" v-model="formData.detail">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<label class="layui-form-label">排序：</label>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input type="number" name="sort" required lay-verify="required" min="0" autocomplete="off" class="layui-input" v-model.number="formData.sort">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<label class="layui-form-label">限购：</label>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input type="number" name="restrictions" required lay-verify="required" min="0" autocomplete="off" class="layui-input" v-model.number="formData.restrictions">
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-mid layui-word-aux">设置每人可以购买的次数，0默认不限购</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<label class="layui-form-label">活动状态：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<input type="checkbox" lay-skin="switch" lay-text="开启|关闭" lay-filter="is_show" :checked="formData.is_show">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-tab-item">
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">活动规则：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<script id="editor1" name="content1" type="text/plain">{{ formData.activity_rules }}</script>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-tab-item">
|
||
|
|
<div class="layui-form-item required">
|
||
|
|
<label class="layui-form-label">活动详情：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<script id="editor2" name="content2" type="text/plain">{{ formData.content }}</script>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-tab-item">
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<label class="layui-form-label">填写资料：</label>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<input type="checkbox" lay-skin="switch" lay-text="开启|关闭" lay-filter="is_fill" :checked="formData.is_fill">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<template v-if="formData.is_fill">
|
||
|
|
<div v-for="(item, index) in event" :key="index" class="layui-form-item event">
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">排序</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.sort" type="text" autocomplete="off" class="layui-input" @change="sortChange(item)">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">标题</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.event_name" type="text" placeholder="4字以内" maxlength="4" autocomplete="off" class="layui-input">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">类型</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<div class="layui-unselect layui-form-select" :class="{ 'layui-form-selected': item.show }">
|
||
|
|
<div class="layui-select-title" @click="onSelect(item)">
|
||
|
|
<input type="text" placeholder="请选择类型" :value="item.event_type_name" readonly="" class="layui-input layui-unselect" @blur="selectBlur(item)">
|
||
|
|
<i class="layui-edge"></i>
|
||
|
|
</div>
|
||
|
|
<dl class="layui-anim layui-anim-upbit" style="">
|
||
|
|
<dd lay-value="" class="layui-select-tips" :class="{ 'layui-this': item.event_type === -1 }">请选择类型</dd>
|
||
|
|
<dd lay-value="1" :class="{ 'layui-this': item.event_type === 1}" @click.stop="onSelectChange(1, item, $event)">文本框</dd>
|
||
|
|
<dd lay-value="2" :class="{ 'layui-this': item.event_type === 2}" @click.stop="onSelectChange(2, item, $event)">单选框</dd>
|
||
|
|
<dd lay-value="3" :class="{ 'layui-this': item.event_type === 3}" @click.stop="onSelectChange(3, item, $event)">多选框</dd>
|
||
|
|
<dd lay-value="4" :class="{ 'layui-this': item.event_type === 4}" @click.stop="onSelectChange(4, item, $event)">手机号</dd>
|
||
|
|
<dd lay-value="5" :class="{ 'layui-this': item.event_type === 5}" @click.stop="onSelectChange(5, item, $event)">下拉框</dd>
|
||
|
|
</dl>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-show="item.event_type !== 1 && item.event_type !== 4" class="layui-inline">
|
||
|
|
<div class="layui-form-label">选项</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.event_value" type="text" placeholder="请输入选项（不小于2项，以“#”隔开，如：选项一#选项二#选项三）" autocomplete="off" class="layui-input">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">必填</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<div :class="{ 'layui-form-onswitch': item.is_required }" class="layui-unselect layui-form-switch" @click="item.is_required = item.is_required ? 0 : 1">
|
||
|
|
<em>{{ item.is_required ? '是' : '否' }}</em><i></i>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-if="event.length > 1" class="layui-inline">
|
||
|
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-danger" @click="delEvent(index)">删除</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" @click="addEvent">再加一项</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
<div class="layui-tab-item">
|
||
|
|
<div v-for="(item, index) in price" class="layui-form-item price">
|
||
|
|
<div v-if="!index" class="layui-form-label">价格设置：</div>
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">排序</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.sort" :readonly="!index" :min="index ? 1 : 0" type="number" autocomplete="off" class="layui-input" @change="sortChange2(item)">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">人数</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.event_number" :readonly="!index" type="text" autocomplete="off" class="layui-input" @change="peopleChange(item)">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">价格</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.event_price" type="text" autocomplete="off" class="layui-input" @change="priceChange(item, 'event_price')">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-inline">
|
||
|
|
<div class="layui-form-label">会员价格</div>
|
||
|
|
<div class="layui-input-inline">
|
||
|
|
<input v-model.trim="item.event_mer_price" type="text" autocomplete="off" class="layui-input" @change="priceChange(item, 'event_mer_price')">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div v-show="index" class="layui-inline">
|
||
|
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-danger" @click="delPrice(index)">删除</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" @click="addPrice">再加一项</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="layui-form-item">
|
||
|
|
<div class="layui-input-block">
|
||
|
|
<button type="button" class="layui-btn layui-btn-primary" @click="clone_form">取消</button>
|
||
|
|
<button v-show="tabIndex" type="button" class="layui-btn layui-btn-primary" @click="tabChange(-1)">上一步</button>
|
||
|
|
<button v-show="tabIndex != 4" type="button" class="layui-btn layui-btn-normal" @click="tabChange(1)">下一步</button>
|
||
|
|
<button v-show="tabIndex == 4" type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="submit">{$id ?'确认修改':'立即提交'}</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<script src="{__ADMIN_PATH}js/layuiList.js"></script>
|
||
|
|
<script src="/static/plug/reg-verify.js"></script>
|
||
|
|
{/block}
|
||
|
|
{block name="script"}
|
||
|
|
<script>
|
||
|
|
var id = {$id}, news = {$news}, event = {$event}, price = {$price};
|
||
|
|
if (Array.isArray(news)) {
|
||
|
|
news = {};
|
||
|
|
}
|
||
|
|
require(['vue', 'moment', 'zh-cn','request','aliyun-oss','plupload','OssUpload'], function (Vue, moment) {
|
||
|
|
var vm = new Vue({
|
||
|
|
el: "#app",
|
||
|
|
data: {
|
||
|
|
formData: {
|
||
|
|
id:id,
|
||
|
|
title: news.title || '',
|
||
|
|
image: news.image || '',
|
||
|
|
qrcode_img: news.qrcode_img || '',
|
||
|
|
start_time: news.start_time || '',
|
||
|
|
end_time: news.end_time || '',
|
||
|
|
signup_start_time: news.signup_start_time || '',
|
||
|
|
signup_end_time: news.signup_end_time || '',
|
||
|
|
province: news.province || '北京市',
|
||
|
|
city: news.city || '北京市',
|
||
|
|
district: news.district || '东城区',
|
||
|
|
detail: news.detail || '',
|
||
|
|
number: news.number || 1,
|
||
|
|
activity_rules: news.activity_rules || '',
|
||
|
|
content: news.content || '',
|
||
|
|
sort: news.sort || 0,
|
||
|
|
restrictions: news.restrictions || 0,
|
||
|
|
is_show: news.is_show || 0,
|
||
|
|
is_fill: news.is_fill || 0
|
||
|
|
},
|
||
|
|
mask: {
|
||
|
|
image: false,
|
||
|
|
qrcode_img: false
|
||
|
|
},
|
||
|
|
event: [
|
||
|
|
{
|
||
|
|
event_name: '',
|
||
|
|
event_type: 1,
|
||
|
|
event_type_name: '文本框',
|
||
|
|
event_value: '',
|
||
|
|
sort: 0,
|
||
|
|
is_required: 1,
|
||
|
|
show: false
|
||
|
|
}
|
||
|
|
],
|
||
|
|
price: [
|
||
|
|
{
|
||
|
|
sort: 0,
|
||
|
|
event_number: 1,
|
||
|
|
event_price: 0,
|
||
|
|
event_mer_price: 0
|
||
|
|
}
|
||
|
|
],
|
||
|
|
priceVerify: true,
|
||
|
|
tabIndex: 0
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
sortChange: function (item) {
|
||
|
|
var sort = parseInt(item.sort);
|
||
|
|
item.sort = isNaN(sort) ? 0 : Math.abs(sort);
|
||
|
|
},
|
||
|
|
sortChange2: function (item) {
|
||
|
|
var sort = parseInt(item.sort);
|
||
|
|
item.sort = isNaN(sort) ? 1 : Math.abs(sort);
|
||
|
|
},
|
||
|
|
peopleChange: function (item) {
|
||
|
|
var eventNumber = parseInt(item.event_number);
|
||
|
|
eventNumber = isNaN(eventNumber) ? 2 : Math.abs(eventNumber);
|
||
|
|
if (eventNumber < 2) {
|
||
|
|
eventNumber = 2;
|
||
|
|
}
|
||
|
|
item.event_number = eventNumber;
|
||
|
|
},
|
||
|
|
priceChange: function (item, key) {
|
||
|
|
var price = item[key];
|
||
|
|
var label = key === 'event_price' ? '价格' : '会员价格';
|
||
|
|
this.priceVerify = true;
|
||
|
|
if (price) {
|
||
|
|
if (isNaN(price)) {
|
||
|
|
this.priceVerify = false;
|
||
|
|
layer.msg('请正确输入' + label);
|
||
|
|
} else {
|
||
|
|
var index = price.indexOf('.');
|
||
|
|
if (index === -1) {
|
||
|
|
price = parseInt(price);
|
||
|
|
} else {
|
||
|
|
var number = price.length - index -1;
|
||
|
|
if (number) {
|
||
|
|
if (number > 2) {
|
||
|
|
this.priceVerify = false;
|
||
|
|
layer.msg('小数点后最多保留2位小数');
|
||
|
|
return;
|
||
|
|
} else {
|
||
|
|
price = parseFloat(price);
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.priceVerify = false;
|
||
|
|
layer.msg('小数点后最少保留1位小数');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (price < 0) {
|
||
|
|
this.priceVerify = false;
|
||
|
|
layer.msg(label + '不能为负数');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.priceVerify = false;
|
||
|
|
layer.msg('请输入' + label);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 添加价格
|
||
|
|
addPrice: function () {
|
||
|
|
this.price.push({
|
||
|
|
sort: 1,
|
||
|
|
event_number: 2,
|
||
|
|
event_price: 0,
|
||
|
|
event_mer_price: 0
|
||
|
|
});
|
||
|
|
},
|
||
|
|
// 删除价格
|
||
|
|
delPrice: function (index) {
|
||
|
|
this.price.splice(index, 1);
|
||
|
|
},
|
||
|
|
// 添加资料
|
||
|
|
addEvent: function () {
|
||
|
|
this.event.push({
|
||
|
|
event_name: '',
|
||
|
|
event_type: 1,
|
||
|
|
event_type_name: '文本框',
|
||
|
|
event_value: '',
|
||
|
|
sort: 0,
|
||
|
|
is_required: 1,
|
||
|
|
show: false
|
||
|
|
});
|
||
|
|
},
|
||
|
|
// 删除资料
|
||
|
|
delEvent: function (index) {
|
||
|
|
this.event.splice(index, 1);
|
||
|
|
},
|
||
|
|
// 显示、隐藏下拉框
|
||
|
|
onSelect: function (item) {
|
||
|
|
item.show = !item.show;
|
||
|
|
},
|
||
|
|
// 改变下拉框的值
|
||
|
|
onSelectChange: function (value, item, event) {
|
||
|
|
item.event_type = value;
|
||
|
|
item.event_type_name = event.target.innerHTML;
|
||
|
|
},
|
||
|
|
// 下拉框失焦
|
||
|
|
selectBlur: function (item) {
|
||
|
|
setTimeout(function () {
|
||
|
|
item.show = false;
|
||
|
|
}, 200);
|
||
|
|
},
|
||
|
|
//删除图片
|
||
|
|
delect: function (key, index) {
|
||
|
|
var that = this;
|
||
|
|
if (index != undefined) {
|
||
|
|
that.formData[key].splice(index, 1);
|
||
|
|
that.$set(that.formData, key, that.formData[key]);
|
||
|
|
} else {
|
||
|
|
that.$set(that.formData, key, '');
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//查看图片
|
||
|
|
look: function (pic) {
|
||
|
|
parent.$eb.openImage(pic);
|
||
|
|
},
|
||
|
|
changeIMG: function (key, value, multiple) {
|
||
|
|
if (multiple) {
|
||
|
|
var that = this;
|
||
|
|
value.map(function (v) {
|
||
|
|
that.formData[key].push({pic: v, is_show: false});
|
||
|
|
});
|
||
|
|
this.$set(this.formData, key, this.formData[key]);
|
||
|
|
} else {
|
||
|
|
this.$set(this.formData, key, value);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//上传图片
|
||
|
|
upload: function (key, count) {
|
||
|
|
ossUpload.createFrame('请选择图片', {fodder: key, max_count: count === undefined ? 0 : count},{w:800,h:550});
|
||
|
|
},
|
||
|
|
clone_form: function () {
|
||
|
|
var that = this;
|
||
|
|
if (parseInt(id) == 0) {
|
||
|
|
parent.layer.closeAll();
|
||
|
|
}
|
||
|
|
parent.layer.closeAll();
|
||
|
|
},
|
||
|
|
// 验证资料组件
|
||
|
|
verifyFormEvent: function (formData) {
|
||
|
|
var status = true;
|
||
|
|
if (formData.is_fill) {
|
||
|
|
var formEvent = this.event;
|
||
|
|
for (var i = formEvent.length; i--;) {
|
||
|
|
if (formEvent[i].event_name) {
|
||
|
|
if (formEvent[i].event_type === -1) {
|
||
|
|
layer.msg('资料设置中存在未选择类型项，请检查');
|
||
|
|
status = false;
|
||
|
|
break;
|
||
|
|
} else {
|
||
|
|
if (formEvent[i].event_type !== 1 && formEvent[i].event_type !== 4) {
|
||
|
|
if (formEvent[i].event_value) {
|
||
|
|
var index = formEvent[i].event_value.indexOf('#');
|
||
|
|
if (index === -1) {
|
||
|
|
layer.msg('资料设置中存在选项格式不正确或小于2个的项<br>请检查');
|
||
|
|
status = false;
|
||
|
|
break;
|
||
|
|
} else {
|
||
|
|
if (!index || index === formEvent[i].event_value.length - 1) {
|
||
|
|
layer.msg('资料设置中存在选项以#为首尾的项，请检查');
|
||
|
|
status = false;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
layer.msg('资料设置中存在未输入选项的项，请检查');
|
||
|
|
status = false;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
layer.msg('资料设置中存在未输入标题的项，请检查');
|
||
|
|
status = false;
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return status;
|
||
|
|
},
|
||
|
|
// 上一步、下一步
|
||
|
|
tabChange: function (value) {
|
||
|
|
layui.element.tabChange('tab', this.tabIndex + value);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created: function () {
|
||
|
|
if (event.length) {
|
||
|
|
event.forEach(function (item) {
|
||
|
|
switch (item.event_type) {
|
||
|
|
case 1:
|
||
|
|
item.event_type_name = '文本框';
|
||
|
|
break;
|
||
|
|
case 2:
|
||
|
|
item.event_type_name = '单选框';
|
||
|
|
break;
|
||
|
|
case 3:
|
||
|
|
item.event_type_name = '多选框';
|
||
|
|
break;
|
||
|
|
case 4:
|
||
|
|
item.event_type_name = '手机号';
|
||
|
|
break;
|
||
|
|
case 5:
|
||
|
|
item.event_type_name = '下拉框';
|
||
|
|
break;
|
||
|
|
}
|
||
|
|
item.show = false;
|
||
|
|
});
|
||
|
|
this.event = event;
|
||
|
|
}
|
||
|
|
if (price.length) {
|
||
|
|
this.price = price;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted: function () {
|
||
|
|
this.$nextTick(function () {
|
||
|
|
var vm = this;
|
||
|
|
layui.config({
|
||
|
|
base: '{__ADMIN_PATH}mods/',
|
||
|
|
version: '1.0'
|
||
|
|
});
|
||
|
|
|
||
|
|
layui.use([
|
||
|
|
'layarea',
|
||
|
|
'laydate',
|
||
|
|
'form',
|
||
|
|
'element'
|
||
|
|
], function () {
|
||
|
|
var layarea = layui.layarea;
|
||
|
|
var laydate = layui.laydate;
|
||
|
|
var form = layui.form;
|
||
|
|
var layer = layui.layer;
|
||
|
|
var element = layui.element;
|
||
|
|
var dateOption1 = {
|
||
|
|
elem: '#date1',
|
||
|
|
type: 'datetime',
|
||
|
|
range: true,
|
||
|
|
done: function (value) {
|
||
|
|
var arr = value.split(' - ');
|
||
|
|
vm.formData.signup_start_time = arr[0];
|
||
|
|
vm.formData.signup_end_time = arr[1];
|
||
|
|
}
|
||
|
|
};
|
||
|
|
var dateOption2 = {
|
||
|
|
elem: '#date2',
|
||
|
|
type: 'datetime',
|
||
|
|
range: true,
|
||
|
|
done: function (value) {
|
||
|
|
var arr = value.split(' - ');
|
||
|
|
vm.formData.start_time = arr[0];
|
||
|
|
vm.formData.end_time = arr[1];
|
||
|
|
}
|
||
|
|
};
|
||
|
|
var areaPicker = {
|
||
|
|
elem: '#area-picker',
|
||
|
|
change: function (res) {
|
||
|
|
vm.formData.province = res.province;
|
||
|
|
vm.formData.city = res.city;
|
||
|
|
vm.formData.district = res.county;
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
if (news.signup_start_time) {
|
||
|
|
dateOption1.value = vm.formData.signup_start_time + ' - ' + vm.formData.signup_end_time;
|
||
|
|
dateOption2.value = vm.formData.start_time + ' - ' + vm.formData.end_time;
|
||
|
|
areaPicker.data = {
|
||
|
|
province: vm.formData.province,
|
||
|
|
city: vm.formData.city,
|
||
|
|
district: vm.formData.district
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
laydate.render(dateOption1);
|
||
|
|
laydate.render(dateOption2);
|
||
|
|
layarea.render(areaPicker);
|
||
|
|
form.render();
|
||
|
|
|
||
|
|
element.on('tab(tab)', function (data) {
|
||
|
|
vm.tabIndex = data.index;
|
||
|
|
});
|
||
|
|
|
||
|
|
form.on('switch(is_show)', function (data) {
|
||
|
|
vm.formData.is_show = Number(data.elem.checked);
|
||
|
|
});
|
||
|
|
|
||
|
|
form.on('switch(is_fill)', function (data) {
|
||
|
|
vm.formData.is_fill = Number(data.elem.checked);
|
||
|
|
});
|
||
|
|
|
||
|
|
form.on('switch(pay_type)', function (data) {
|
||
|
|
vm.formData.pay_type = Number(data.elem.checked);
|
||
|
|
});
|
||
|
|
|
||
|
|
form.on('switch(member_pay_type)', function (data) {
|
||
|
|
vm.formData.member_pay_type = Number(data.elem.checked);
|
||
|
|
});
|
||
|
|
|
||
|
|
form.on('submit(submit)', function () {
|
||
|
|
var formData = vm.formData;
|
||
|
|
var activity_rules = vm.editor1.getContent();
|
||
|
|
var content = vm.editor2.getContent();
|
||
|
|
if (!formData.signup_start_time) {
|
||
|
|
layer.msg('请选择报名时间');
|
||
|
|
} else if (!formData.start_time) {
|
||
|
|
layer.msg('请选择活动时间');
|
||
|
|
} else if (formData.number <= 1 || parseInt(formData.number) !== parseFloat(formData.number)) {
|
||
|
|
layer.msg('请输入正确的活动人数');
|
||
|
|
} else if (!formData.image) {
|
||
|
|
layer.msg('请上传活动封面');
|
||
|
|
} else if (!formData.qrcode_img) {
|
||
|
|
layer.msg('请上传二维码');
|
||
|
|
} else if (!formData.detail) {
|
||
|
|
layer.msg('请输入详细地址');
|
||
|
|
} else if (!activity_rules) {
|
||
|
|
layer.msg('请输入活动规则');
|
||
|
|
} else if (!content) {
|
||
|
|
layer.msg('请输入活动详情');
|
||
|
|
} else {
|
||
|
|
if (vm.verifyFormEvent(formData)) {
|
||
|
|
for (var i = 0, len = vm.price.length; i < len; i++) {
|
||
|
|
if (vm.price[i].event_number > vm.formData.number) {
|
||
|
|
layer.msg('价格设置中输入的人数不能大于输入的活动人数');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (!vm.priceVerify) {
|
||
|
|
layer.msg('请检查价格设置中的价格或会员价格');
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
formData.activity_rules = activity_rules;
|
||
|
|
formData.content = content;
|
||
|
|
if (formData.is_fill) {
|
||
|
|
formData.event = JSON.stringify(vm.event);
|
||
|
|
}
|
||
|
|
formData.event_price = JSON.stringify(vm.price);
|
||
|
|
formData.price = vm.price[0].event_price;
|
||
|
|
formData.member_price = vm.price[0].event_mer_price;
|
||
|
|
var loadIndex = layer.load(1);
|
||
|
|
layList.basePost(layList.U({
|
||
|
|
a: 'add_new',
|
||
|
|
}), formData, function (res) {
|
||
|
|
layer.close(loadIndex);
|
||
|
|
if (parseInt(id) === 0) {
|
||
|
|
layer.confirm('添加成功,您要继续添加活动吗?', {
|
||
|
|
btn: ['继续添加', '立即提交']
|
||
|
|
}, function (index) {
|
||
|
|
layer.close(index);
|
||
|
|
window.location.reload();
|
||
|
|
}, function () {
|
||
|
|
parent.layer.closeAll();
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
layList.msg('修改成功', function () {
|
||
|
|
parent.layer.closeAll();
|
||
|
|
window.location.reload();
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}, function (res) {
|
||
|
|
layer.close(loadIndex);
|
||
|
|
layer.msg(res.msg)
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
UE.registerUI('选择图片', function (editor, uiName) {
|
||
|
|
var btn = new UE.ui.Button({
|
||
|
|
name: uiName,
|
||
|
|
title: uiName,
|
||
|
|
cssRules: 'background-position: -380px 0;',
|
||
|
|
onclick: function() {
|
||
|
|
ossUpload.createFrame(uiName, { fodder: editor.key }, { w: 800, h: 550 });
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return btn;
|
||
|
|
});
|
||
|
|
var scripts = document.scripts;
|
||
|
|
var scriptId = '';
|
||
|
|
for (var i = scripts.length; i--;) {
|
||
|
|
if (scripts[i].type != 'text/plain') {
|
||
|
|
continue;
|
||
|
|
}
|
||
|
|
scriptId = scripts[i].id;
|
||
|
|
this[scriptId] = UE.getEditor(scriptId);
|
||
|
|
}
|
||
|
|
|
||
|
|
function changeIMG(index, pic) {
|
||
|
|
$(".image_img").css('background-image', "url(" + pic + ")");
|
||
|
|
$(".active").css('background-image', "url(" + pic + ")");
|
||
|
|
$('#image_input').val(pic);
|
||
|
|
};
|
||
|
|
|
||
|
|
window.insertEditor = function (list, fodder) {
|
||
|
|
vm[fodder].execCommand('insertimage', list);
|
||
|
|
};
|
||
|
|
|
||
|
|
window.changeIMG = vm.changeIMG;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
})
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
{/block}
|