<template>
|
<div class="act_add">
|
<div class="fl-al">
|
<v-header :title="(!add ? '新增' : '编辑') + '活动'"></v-header>
|
<el-button class="mr-l-50" size="mini" @click="$router.go(-1)"
|
>返回</el-button
|
>
|
</div>
|
<el-form
|
:model="form"
|
:rules="rules"
|
label-position="right"
|
ref="form"
|
label-width="170px"
|
class="demo-ruleForm"
|
>
|
<el-tabs v-model="activeName">
|
<el-tab-pane label="基础信息" name="first">
|
<el-form-item label="活动名称:" prop="activityName">
|
<el-input
|
class="input-width"
|
placeholder="请输入活动名称"
|
size="small"
|
v-model.trim="form.activityName"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="活动地点:" prop="activityAddr" required>
|
<el-input
|
class="input-width"
|
placeholder="请选择活动地点"
|
size="small"
|
type="textarea"
|
resize="none"
|
:rows="3"
|
v-model="form.activityAddr"
|
maxlength="50"
|
@focus="mapCheck"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="报名时间:" required>
|
<el-form-item prop="signtime">
|
<el-date-picker
|
type="daterange"
|
range-separator="~"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
size="small"
|
v-model="signtime"
|
class="input-width"
|
@focus="handleCloseMap"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
format="yyyy-MM-dd HH:mm:ss"
|
:default-time="['00:00:00', '23:59:59']"
|
:picker-options="pickerOptions"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-form-item>
|
<el-form-item label="活动时间:" required>
|
<el-form-item prop="activetime">
|
<el-date-picker
|
class="input-width"
|
type="daterange"
|
range-separator="~"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
size="small"
|
v-model="activetime"
|
@focus="handleCloseMap"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
format="yyyy-MM-dd HH:mm:ss"
|
:default-time="['00:00:00', '23:59:59']"
|
:picker-options="pickerOptions"
|
>
|
</el-date-picker>
|
</el-form-item>
|
<span class="fc-999 mr-l-10"
|
>请先选择报名时间！ 活动结束时间不能早于报名结束时间！</span
|
>
|
</el-form-item>
|
<el-form-item label="活动分类:" required>
|
<el-radio-group v-model="form.activityType">
|
<el-radio
|
:label="type.label"
|
v-for="type in radioList"
|
:key="type.value"
|
:value="type.label"
|
>{{ type.label }}</el-radio
|
>
|
</el-radio-group>
|
<el-input
|
v-model="inputType"
|
class="input-width2"
|
placeholder="请输入内容"
|
></el-input>
|
<el-button type="primary" size="small" @click="addtype()"
|
>添加</el-button
|
>
|
</el-form-item>
|
<div class="fl-fw">
|
<el-form-item label="联系人姓名:">
|
<el-input
|
class="input-width"
|
placeholder="请输入联系人姓名"
|
size="small"
|
v-model.trim="form.contactName"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="联系人电话:">
|
<el-input
|
class="input-width"
|
placeholder="请输入联系人电话"
|
size="small"
|
v-model.trim.number="form.contactPhone"
|
></el-input>
|
</el-form-item>
|
</div>
|
<el-form-item label="广告设置:">
|
<el-checkbox v-model="form.isTop" :true-label="1" :false-label="0"
|
>首页顶部</el-checkbox
|
>
|
</el-form-item>
|
<el-form-item label="活动封面:" required>
|
<UpdateCover
|
:width="520"
|
:height="308"
|
:cover="form.cover"
|
@updateBackImg="updateBackImg"
|
@listCheck="listCheck"
|
/>
|
</el-form-item>
|
<el-form-item label="活动详情:" required>
|
<editor-bar
|
v-model="content"
|
:isClear="isClear"
|
@change="change"
|
></editor-bar>
|
</el-form-item>
|
</el-tab-pane>
|
<el-tab-pane label="限制和奖励" name="second">
|
<el-form-item label="签到范围（以内）:" required>
|
<el-form-item prop="range">
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的数字"
|
size="small"
|
v-model.trim="form.range"
|
:disabled="isrange == 1"
|
></el-input>
|
<span class="mr-l-10">km</span>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="isrange"
|
@change="israngeC"
|
>无限制</el-checkbox
|
>
|
</el-form-item>
|
<span class="mr-l-10 fc-999">若设置签到范围将限制用户签到距离</span>
|
</el-form-item>
|
<el-form-item label="签退范围（以内）:" required>
|
<el-form-item prop="signOutRange">
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的数字"
|
size="small"
|
v-model.trim="form.signOutRange"
|
:disabled="israngeOut == 1"
|
></el-input>
|
<span class="mr-l-10">km</span>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="israngeOut"
|
@change="israngeO"
|
>无限制</el-checkbox
|
>
|
</el-form-item>
|
<span class="mr-l-10 fc-999">若设置签退范围将限制用户签退距离</span>
|
</el-form-item>
|
<el-form-item label="报名后取消:">
|
<el-radio v-model="form.canCancel" :label="1">允许</el-radio>
|
<el-radio v-model="form.canCancel" :label="2">拒绝</el-radio>
|
</el-form-item>
|
|
<el-form-item
|
label="取消活动扣除金汇币:"
|
prop="cancelDeduct"
|
required
|
v-if="form.canCancel == 1 && isJinHui"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.jinhuiCoinPunishment"
|
:min="0"
|
label=""
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
即用户参与活动后取消活动将会扣除一定金汇币作为惩罚
|
</div>
|
</el-form-item>
|
|
<el-form-item
|
label="取消活动扣除积分:"
|
prop="cancelDeduct"
|
required
|
v-if="form.canCancel == 1 && !isJinHui"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.cancelDeduct"
|
:min="1"
|
label=""
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
即用户参与活动后取消活动将会扣除一定积分作为惩罚
|
</div>
|
</el-form-item>
|
|
<el-form-item
|
label="奖励金汇币:"
|
prop="cancelDeduct"
|
required
|
v-if="isJinHui"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.jinhuiCoinAward"
|
:min="0"
|
label=""
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
填0表示不奖励金汇币
|
</div>
|
</el-form-item>
|
|
<el-form-item label="每人可参与此活动次数" required prop="limit">
|
<el-form-item prop="">
|
<span style="color:#606266"
|
>（注：长期活动需求多次参与，可在此设置每人参与次数）:</span
|
>
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的整数"
|
size="small"
|
v-model.trim="form.limit"
|
:disabled="form.limit === -1"
|
></el-input>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="checkCountPeople"
|
@change="menberChange"
|
>不限</el-checkbox
|
>
|
</el-form-item>
|
</el-form-item>
|
|
<el-form-item
|
label="请选择参与人群:"
|
prop="aattendPeople"
|
v-if="isJinHui"
|
>
|
<el-radio-group
|
v-model="form.aattendPeople"
|
@change="jhCrowdCheckChange"
|
>
|
<el-radio label="居民">居民</el-radio>
|
<el-radio label="志愿者">志愿者</el-radio>
|
<el-radio label="党员">党员</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
|
<el-form-item label="请选择参与人群:" prop="aattendPeople" v-else>
|
<el-checkbox-group
|
v-model="crowdListValue"
|
@change="crowdCheckChange"
|
>
|
<el-checkbox label="居民">居民</el-checkbox>
|
<el-checkbox label="志愿者">志愿者</el-checkbox>
|
<el-checkbox label="党员">党员</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
|
<div v-if="crowdListValue.indexOf('居民') !== -1">
|
<div class="fc-999">居民</div>
|
<div class="fl-co">
|
<div class="fl-fw">
|
<el-form-item prop="participantMax" label="居民参与人数限制:">
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的整数"
|
size="small"
|
v-model.trim="form.participantMax"
|
:disabled="form.participantMax === -1"
|
></el-input>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="juMingMax"
|
@change="juMingChange"
|
>不限</el-checkbox
|
>
|
</el-form-item>
|
<el-form-item label="积分奖励方式:" prop="participantRewardWay">
|
<el-radio v-model="form.participantRewardWay" :label="1"
|
>按参与次数</el-radio
|
>
|
<el-radio v-model="form.participantRewardWay" :label="2"
|
>按参与时长</el-radio
|
>
|
</el-form-item>
|
</div>
|
<el-form-item
|
v-if="form.participantRewardWay && !isJinHui"
|
:label="
|
form.participantRewardWay == 1
|
? '每次奖励' + (isJinHui ? '金汇币:' : '积分:')
|
: '每小时奖励' + (isJinHui ? '金汇币:' : '积分:')
|
"
|
prop="participantRewardIntegral"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.participantRewardIntegral"
|
:min="0"
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
{{ "填0表示不奖励" + (isJinHui ? "金汇币" : "积分") }}
|
</div>
|
</el-form-item>
|
</div>
|
</div>
|
<div v-if="crowdListValue.indexOf('志愿者') !== -1">
|
<div class="fc-999">志愿者</div>
|
<div class="fl-co">
|
<div class="fl-fw">
|
<el-form-item
|
prop="volunteerMax"
|
label="志愿者参与人数限制:"
|
required
|
>
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的整数"
|
size="small"
|
v-model.trim="form.volunteerMax"
|
:disabled="form.volunteerMax === -1"
|
></el-input>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="volunteerMax"
|
@change="volunteerChange"
|
>不限</el-checkbox
|
>
|
</el-form-item>
|
<el-form-item label="积分奖励方式:" prop="volunteerRewardWay">
|
<el-radio v-model="form.volunteerRewardWay" :label="1"
|
>按参与次数</el-radio
|
>
|
<el-radio v-model="form.volunteerRewardWay" :label="2"
|
>按参与时长</el-radio
|
>
|
</el-form-item>
|
</div>
|
<el-form-item
|
v-if="form.volunteerRewardWay && !isJinHui"
|
:label="
|
form.volunteerRewardWay == 1
|
? '每次奖励' + (isJinHui ? '金汇币:' : '积分:')
|
: '每小时奖励' + (isJinHui ? '金汇币:' : '积分:')
|
"
|
prop="volunteerRewardIntegral"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.volunteerRewardIntegral"
|
:min="0"
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
{{ "填0表示不奖励" + (isJinHui ? "金汇币" : "积分") }}
|
</div>
|
</el-form-item>
|
</div>
|
</div>
|
<div v-if="crowdListValue.indexOf('党员') !== -1">
|
<div class="fc-999">党员</div>
|
<div class="fl-co">
|
<div class="fl-fw">
|
<el-form-item
|
prop="partyMemberMax"
|
label="党员参与人数限制:"
|
required
|
>
|
<el-input
|
class="input-width2"
|
placeholder="请输入大于0的整数"
|
size="small"
|
v-model.trim="form.partyMemberMax"
|
:disabled="form.partyMemberMax === -1"
|
></el-input>
|
<el-checkbox
|
:true-label="1"
|
:false-label="0"
|
class="mr-l-10"
|
v-model="partyMemberMax"
|
@change="ispartyMemberMaxC"
|
>不限</el-checkbox
|
>
|
</el-form-item>
|
<el-form-item prop="duration" label="服务时长:" required>
|
<el-input
|
class="input-width2"
|
placeholder="请输入服务时长"
|
size="small"
|
v-model.trim="form.duration"
|
></el-input>
|
</el-form-item>
|
<el-form-item prop="pbRewardWay" label="积分奖励方式:">
|
<el-radio v-model="form.pbRewardWay" :label="1"
|
>按参与次数</el-radio
|
>
|
<el-radio v-model="form.pbRewardWay" :label="2"
|
>按参与时长</el-radio
|
>
|
</el-form-item>
|
</div>
|
<el-form-item
|
v-if="form.pbRewardWay && !isJinHui"
|
:label="
|
form.pbRewardWay == 1
|
? '每次奖励' + (isJinHui ? '金汇币:' : '积分:')
|
: '每小时奖励' + (isJinHui ? '金汇币:' : '积分:')
|
"
|
prop="pbRewardIntegral"
|
>
|
<el-input-number
|
class="input-width2"
|
v-model="form.pbRewardIntegral"
|
:min="0"
|
></el-input-number>
|
<div class="fc-999" style="width: 500px; line-height: 1.5">
|
{{ "填0表示不奖励" + (isJinHui ? "金汇币" : "积分") }}
|
</div>
|
</el-form-item>
|
</div>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
<el-form-item label="">
|
<el-button
|
size="small"
|
type="primary"
|
@click="send(2, 'form')"
|
v-if="!add"
|
>保存并发布</el-button
|
>
|
<el-button
|
size="small"
|
type="primary"
|
@click="send(3, 'form')"
|
v-if="!add"
|
>保存</el-button
|
>
|
<el-button
|
size="small"
|
type="primary"
|
@click="send(1, 'form')"
|
v-if="add"
|
>保存编辑</el-button
|
>
|
<el-button size="small" @click="$router.go(-1)">取消</el-button>
|
</el-form-item>
|
</el-form>
|
<el-dialog
|
title="选择封面"
|
:visible.sync="dialogVisible"
|
:before-close="handleClose"
|
append-to-body
|
class="fm"
|
width="54%"
|
>
|
<div class="fl-f">
|
<el-tabs
|
tab-position="left"
|
style="width: 125px"
|
v-model="tabsName"
|
@tab-click="tabCheckHandle"
|
>
|
<el-tab-pane label="上传"></el-tab-pane>
|
<el-tab-pane label="节日"></el-tab-pane>
|
<el-tab-pane label="党建"></el-tab-pane>
|
<el-tab-pane label="疫苗"></el-tab-pane>
|
<el-tab-pane label="天气预报"></el-tab-pane>
|
<el-tab-pane label="灾害预警"></el-tab-pane>
|
<el-tab-pane label="志愿者"></el-tab-pane>
|
</el-tabs>
|
<div class="fl-fw" style="width: 100%">
|
<el-upload
|
v-if="tabsName == '0'"
|
class="mr-r-10"
|
action
|
:http-request="uploadFileHandle"
|
:before-upload="beforeAvatarUploadImg"
|
:show-file-list="false"
|
>
|
<div class="update-img">
|
<i class="el-icon-plus fz-15"></i>
|
</div>
|
</el-upload>
|
<div
|
class="img-list-item mr-r-10"
|
v-for="(item, index) in checkImgList"
|
:key="index"
|
>
|
<img
|
v-if="item.type"
|
class="check-img"
|
src="../../../assets/image/check-img.png"
|
@click="checkImgHandle(index)"
|
/>
|
<img
|
v-else
|
class="check-img"
|
src="../../../assets/image/no-check.png"
|
@click="checkImgHandle(index)"
|
/>
|
<el-image
|
class="img-shwo-item"
|
:style="{
|
border: item.type ? '1px solid red' : '1px solid #fff'
|
}"
|
:src="item.uploadPicture"
|
@click="checkImgHandle(index)"
|
fit="cover"
|
></el-image>
|
</div>
|
</div>
|
</div>
|
<div style="text-align: center; margin-top: 20px">
|
<el-button @click="handleClose">取 消</el-button>
|
<el-button type="primary" @click="storeListConfirm">确 定</el-button>
|
</div>
|
<!-- 裁剪图片 -->
|
<el-dialog
|
title="图片裁剪"
|
:visible.sync="dialogVisibleCover"
|
:before-close="handleCloseCover"
|
:close-on-click-modal="false"
|
append-to-body
|
>
|
<div class="cropper-content">
|
<div class="cropper" style="text-align: center">
|
<vueCropper
|
ref="cropper"
|
:img="option.img"
|
:outputSize="option.size"
|
:outputType="option.outputType"
|
:info="true"
|
:full="option.full"
|
:canMove="option.canMove"
|
:canMoveBox="option.canMoveBox"
|
:autoCropWidth="500"
|
:autoCropHeight="296"
|
:original="option.original"
|
:autoCrop="option.autoCrop"
|
:fixedBox="option.fixedBox"
|
:fixed="option.fixed"
|
:fixedNumber="[500, 296]"
|
></vueCropper>
|
</div>
|
</div>
|
<div style="text-align: center; margin-top: 20px">
|
<el-button @click="handleCloseCover">取 消</el-button>
|
<el-button type="primary" :loading="btnLoading" @click="finishCofirm"
|
>确 定</el-button
|
>
|
</div>
|
</el-dialog>
|
</el-dialog>
|
<el-dialog
|
title="设置活动地址"
|
:visible.sync="dialogVisibleMap"
|
:before-close="handleCloseMap"
|
append-to-body
|
>
|
<MapBox ref="mapContent" @setLocation="setLocation" />
|
<div style="text-align: center; margin-top: 20px">
|
<el-button @click="handleCloseMap">取 消</el-button>
|
<el-button type="primary" @click="mapComfirm">确 定</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import EditorBar from "com/wangEnduit/index"; //富文本组件
|
import UpdateCover from "../../../components/upload/updateCover.vue";
|
import MapBox from "../../../components/map/map.vue";
|
import { PHONE } from "../../../utils/validation";
|
export default {
|
props: {
|
add: { type: Boolean, default: false },
|
aid: { type: [String, Number], default: 0 }
|
},
|
components: { EditorBar, UpdateCover, MapBox },
|
data() {
|
var range = (rule, value, callback) => {
|
if (!value && this.isrange !== 1) {
|
return callback(new Error("请输入签到范围"));
|
}
|
var regNumber = /^\+?[1-9][0-9]*$/;
|
if (
|
regNumber.test(value) == false &&
|
this.isrange !== 1 &&
|
value !== -1
|
) {
|
return callback(new Error("请输入大于0的整数"));
|
} else {
|
callback();
|
}
|
};
|
var validatorlimit = (rule, value, callback) => {
|
if (!value && this.islimit !== 1) {
|
return callback(new Error("请输入参与奖励次数上限"));
|
}
|
var regNumber = /^\+?[1-9][0-9]*$/;
|
if (
|
regNumber.test(value) == false &&
|
this.islimit !== 1 &&
|
value !== -1
|
) {
|
return callback(new Error("请输入大于0的整数"));
|
} else {
|
callback();
|
}
|
};
|
return {
|
isJinHui: false, //是否是金汇社区
|
activeName: "first",
|
tabsName: "0",
|
btnLoading: false,
|
win: true,
|
item: [],
|
inputNumber: [], //人数区间提示
|
startnum1: false,
|
endnum1: false,
|
startnum2: false,
|
endnum2: false,
|
leader: [], // 活动负责人
|
leaderId: "", // 活动负责人Id
|
form: {
|
activityName: "", // 活动名字
|
activityAddr: "", // 活动地址
|
prizeRemark: "", // 奖品备注
|
rewardDesc: "", // 奖品详情
|
sponsorId: "", // 负责人
|
sponsorName: "", // 负责人id
|
participantMax: "", // 参与人数
|
partyMemberMax: "", // 党员参与人数
|
signUpBegin: "", // 报名时间
|
signUpEnd: "", // 报名时间
|
beginAt: "", // 活动时间
|
endAt: "", // 活动时间
|
cover: "", // 封面
|
content: "", // 活动内容
|
hasPrize: 0, // 是否有奖品
|
status: "", // 状态
|
isQrCode: 1, // 是否扫码签到
|
isTop: 0, // 是否顶部
|
contactName: "", // 联系人姓名
|
contactPhone: "", // 联系人电话
|
lat: 0,
|
lng: 0,
|
range: "", //签到范围
|
signOutRange: "", //签退范围
|
limit: "",
|
duration: "", // 单次活动时长
|
rewardIntegral: "",
|
haveIntegralReward: 1,
|
rewardWay: 1,
|
canCancel: 1,
|
cancelDeduct: "",
|
activityType: "",
|
participantRewardWay: "", // 居民积分奖励方式
|
participantRewardIntegral: "", // 居民参与签到/打卡奖励积分
|
volunteerRewardWay: "", // 志愿者积分奖励方式
|
volunteerRewardIntegral: "", // 志愿者参与签到/打卡奖励积分
|
pbRewardWay: "", // 党员积分奖励方式
|
pbRewardIntegral: "", // 党员参与签到/打卡奖励积分
|
aattendPeople: "",
|
volunteerMax: ""
|
},
|
radioList: [],
|
inputType: "",
|
isparticipantMax: "",
|
islimit: "",
|
isrange: "",
|
israngeOut: "",
|
checkCountPeople: "",
|
juMingMax: "",
|
volunteerMax: "",
|
partyMemberMax: "",
|
rules: {
|
participantMax: [
|
{
|
required: true,
|
message: "请输入居民参与次数",
|
trigger: "blur"
|
}
|
],
|
participantRewardIntegral: [
|
{
|
required: true,
|
message: "请输入奖励积分",
|
trigger: "blur"
|
}
|
],
|
duration: [
|
{
|
required: true,
|
message: "请输入服务时长",
|
trigger: "blur"
|
}
|
],
|
participantRewardWay: [
|
{
|
required: true,
|
message: "请选择奖励方式",
|
trigger: "change"
|
}
|
],
|
volunteerMax: [
|
{
|
required: true,
|
message: "请输入志愿者参与次数",
|
trigger: "blur"
|
}
|
],
|
volunteerRewardIntegral: [
|
{
|
required: true,
|
message: "请输入奖励积分",
|
trigger: "blur"
|
}
|
],
|
volunteerRewardWay: [
|
{
|
required: true,
|
message: "请选择奖励方式",
|
trigger: "change"
|
}
|
],
|
partyMemberMax: [
|
{
|
required: true,
|
message: "请输入党员参与次数",
|
trigger: "blur"
|
}
|
],
|
pbRewardIntegral: [
|
{
|
required: true,
|
message: "请输入奖励积分",
|
trigger: "blur"
|
}
|
],
|
pbRewardWay: [
|
{
|
required: true,
|
message: "请选择奖励方式",
|
trigger: "change"
|
}
|
],
|
aattendPeople: [
|
{
|
required: true,
|
message: "请选择人员标签",
|
trigger: "change"
|
}
|
],
|
activityName: [
|
{
|
required: true,
|
message: "请输入活动名称",
|
trigger: "blur"
|
}
|
],
|
activityAddr: [
|
{
|
required: true,
|
message: "请输入活动地点",
|
trigger: "blur"
|
}
|
],
|
range: [
|
{
|
validator: range,
|
trigger: "blur"
|
}
|
],
|
signOutRange: [
|
{
|
validator: range,
|
trigger: "blur"
|
}
|
],
|
limit: [
|
{
|
validator: validatorlimit,
|
trigger: "blur"
|
}
|
],
|
// partyMemberMax: [
|
// {
|
// validator: validatoraattendPeople2,
|
// trigger: "blur",
|
// },
|
// ],
|
contactPhone: [
|
{
|
required: true,
|
validator: PHONE,
|
trigger: "blur"
|
}
|
]
|
},
|
min: { a: 0, b: 0 },
|
max: { a: 0, b: 0 },
|
activetime: [],
|
signtime: [],
|
content: "",
|
isC: false,
|
isCr: false,
|
minmax: false,
|
isClear: false,
|
detail: "",
|
dialogVisible: false,
|
dialogVisibleCover: false,
|
dialogVisibleMap: false,
|
option: {
|
img: "",
|
outputSize: 1, // 剪切后的图片质量（0.1-1）
|
full: true, // 输出原图比例截图 props名full
|
outputType: "png",
|
canMove: false,
|
original: false,
|
canMoveBox: true,
|
autoCrop: true,
|
fixedBox: false,
|
fixed: true,
|
maxImgSize: 3000 // 图片最大像素
|
}, // 截图配置
|
positionData: {},
|
checkImgList: [],
|
listCheckImg: "",
|
crowdListValue: []
|
};
|
},
|
computed: {
|
pickerOptions() {
|
return {
|
disabledDate(time) {
|
// return time.getTime() < Date.now();
|
let date = new Date(new Date().toLocaleDateString()).getTime();
|
// return time.getTime() < date;
|
return;
|
}
|
};
|
}
|
},
|
watch: {
|
minmax(n) {
|
this.max.a = n ? -1 : 0;
|
},
|
isCr(n) {
|
this.max.b = n ? -1 : 0;
|
},
|
aid(n) {
|
// 编辑 获取数据
|
if (!this.add) {
|
this.getData(n);
|
}
|
},
|
// 选择负责人
|
leaderId(n) {
|
let v = this.leader.filter(k => {
|
return k.managerId === n;
|
});
|
if (v && v[0]) {
|
this.form.sponsorId = n;
|
this.form.sponsorName = v[0].name;
|
} else {
|
this.form.sponsorName = "";
|
this.form.sponsorId = "";
|
}
|
},
|
// 时间
|
time: {
|
handler(n) {
|
if (n.a && n.a.length && n.a[1]) {
|
// this.form.signUpBegin = 'n.a[0]';
|
this.form.signUpEnd = n.a[1];
|
}
|
if (n.b && n.b.length && n.b[1]) {
|
this.form.beginAt = n.b[0];
|
this.form.endAt = n.b[1];
|
}
|
},
|
deep: true
|
},
|
win(n) {
|
if (n) {
|
this.form.comActActPrizeVOList = this.item = [];
|
this.form.prizeRemark = "";
|
this.form.rewardDesc = "";
|
}
|
},
|
isC(n) {}
|
},
|
methods: {
|
crowdCheckChange(arrValue) {
|
if (arrValue.indexOf("居民") == -1) {
|
this.form.participantMax = "";
|
this.juMingMax = "";
|
this.form.participantRewardWay = "";
|
this.form.participantRewardIntegral = "";
|
}
|
if (arrValue.indexOf("志愿者") == -1) {
|
this.form.volunteerMax = "";
|
this.volunteerMax = "";
|
this.form.volunteerRewardWay = "";
|
this.form.volunteerRewardIntegral = "";
|
}
|
if (arrValue.indexOf("党员") == -1) {
|
this.form.partyMemberMax = "";
|
this.partyMemberMax = "";
|
this.form.pbRewardWay = "";
|
this.form.pbRewardIntegral = "";
|
}
|
this.form.aattendPeople = arrValue.join(",");
|
this.$refs["form"].validateField("aattendPeople");
|
},
|
jhCrowdCheckChange(value) {
|
console.log(value);
|
this.crowdListValue = [value];
|
if (value.indexOf("居民") == -1) {
|
this.form.participantMax = "";
|
this.juMingMax = "";
|
this.form.participantRewardWay = "";
|
this.form.participantRewardIntegral = "";
|
}
|
if (value.indexOf("志愿者") == -1) {
|
this.form.volunteerMax = "";
|
this.volunteerMax = "";
|
this.form.volunteerRewardWay = "";
|
this.form.volunteerRewardIntegral = "";
|
}
|
if (value.indexOf("党员") == -1) {
|
this.form.partyMemberMax = "";
|
this.partyMemberMax = "";
|
this.form.pbRewardWay = "";
|
this.form.pbRewardIntegral = "";
|
}
|
this.$refs["form"].validateField("aattendPeople");
|
},
|
|
getactivity() {
|
this.$api.get("communityactivity/activity/type/list", { type: 1 }, e => {
|
this.radioList = e.map(d => {
|
return {
|
label: d.name,
|
value: d.id
|
};
|
});
|
});
|
},
|
addtype() {
|
if (this.inputType) {
|
// var num = this.radioList ? this.radioList[this.radioList.length-1].value : 1;
|
let newlist = {
|
id: "",
|
name: this.inputType,
|
type: 1
|
};
|
this.$api.post("communityactivity/activity/type/add", newlist, e => {
|
this.inputType = "";
|
this.getactivity();
|
});
|
}
|
},
|
ispartyMemberMaxC(val) {
|
if (val) {
|
this.form.partyMemberMax = -1;
|
} else {
|
this.form.partyMemberMax = "";
|
}
|
},
|
israngeC(val) {
|
if (val) {
|
this.form.range = -1;
|
} else {
|
this.form.range = "";
|
}
|
},
|
israngeO(val) {
|
if (val) {
|
this.form.signOutRange = -1;
|
} else {
|
this.form.signOutRange = "";
|
}
|
},
|
checkImgHandle(i) {
|
this.checkImgList[i].type = !this.checkImgList[i].type;
|
this.checkImgList.forEach((im, ix) => {
|
if (ix !== i) {
|
im.type = false;
|
}
|
});
|
if (this.checkImgList[i].type) {
|
this.listCheckImg = this.checkImgList[i].uploadPicture;
|
} else {
|
this.listCheckImg = "";
|
}
|
},
|
storeListConfirm() {
|
this.form.cover = this.listCheckImg;
|
this.tabsName = "0";
|
this.dialogVisible = false;
|
},
|
mapCheck() {
|
this.dialogVisibleMap = true;
|
this.$nextTick(() => {
|
this.$refs.mapContent.getLocation({
|
val: this.form.activityAddr,
|
l: this.form.lat,
|
r: this.form.lng
|
});
|
});
|
},
|
mapComfirm() {
|
if (this.positionData.addr) {
|
this.form.activityAddr = this.positionData.addr;
|
this.form.lat = this.positionData.lat;
|
this.form.lng = this.positionData.lng;
|
}
|
this.dialogVisibleMap = false;
|
this.positionData = {};
|
},
|
setLocation(data) {
|
this.positionData = data;
|
},
|
handleCloseMap() {
|
this.dialogVisibleMap = false;
|
this.positionData = {};
|
},
|
tabCheckHandle() {
|
this.checkImgList = [];
|
switch (this.tabsName) {
|
case "0": {
|
this.listCheck();
|
break;
|
}
|
case "1": {
|
this.listSysCheck(2);
|
break;
|
}
|
case "2": {
|
this.listSysCheck(1);
|
break;
|
}
|
case "3": {
|
this.listSysCheck(4);
|
break;
|
}
|
case "4": {
|
this.listSysCheck(3);
|
break;
|
}
|
case "5": {
|
this.listSysCheck(5);
|
break;
|
}
|
case "6": {
|
this.listSysCheck(6);
|
break;
|
}
|
default: {
|
break;
|
}
|
}
|
},
|
dataURLtoFile(dataurl, filename) {
|
var arr = dataurl.split(","),
|
mime = arr[0].match(/:(.*?);/)[1],
|
bstr = atob(arr[1]),
|
n = bstr.length,
|
u8arr = new Uint8Array(n);
|
while (n--) {
|
u8arr[n] = bstr.charCodeAt(n);
|
}
|
return new File([u8arr], filename, { type: mime });
|
},
|
finishCofirm() {
|
this.$refs.cropper.getCropData(obj => {
|
const timer = new Date().getTime();
|
const urldata = this.dataURLtoFile(obj, timer + ".png");
|
let formData = new FormData();
|
formData.append("file", urldata);
|
this.btnLoading = true;
|
this.$api.post("communitypartybuilding/uploadimage", formData, e => {
|
this.btnLoading = false;
|
this.form.cover = e;
|
this.dialogVisible = false;
|
this.dialogVisibleCover = false;
|
});
|
});
|
},
|
updateBackImg(val) {
|
this.form.cover = val;
|
},
|
handleClose() {
|
this.dialogVisible = false;
|
this.tabsName = "0";
|
},
|
handleCloseCover() {
|
this.dialogVisibleCover = false;
|
},
|
uploadFileHandle(f) {
|
this.dialogVisibleCover = true;
|
this.option.img = URL.createObjectURL(f.file);
|
},
|
beforeAvatarUploadImg(file) {
|
const imgType = ["image/png", "image/jpeg", "video/mp4"];
|
if (imgType.indexOf(file.type) === -1) {
|
showToast("只能上传 png jpeg jpg 格式图片或者视频文件!", "error");
|
return false;
|
} else {
|
return true;
|
}
|
},
|
menberChange(val) {
|
if (val === 1) {
|
this.form.limit = -1;
|
} else {
|
this.form.limit = "";
|
}
|
},
|
juMingChange(val) {
|
if (val === 1) {
|
this.form.participantMax = -1;
|
} else {
|
this.form.participantMax = "";
|
}
|
},
|
volunteerChange(val) {
|
if (val === 1) {
|
this.form.volunteerMax = -1;
|
} else {
|
this.form.volunteerMax = "";
|
}
|
},
|
listCheck() {
|
this.dialogVisible = true;
|
this.$api.get("communityactivity/picture/getList", {}, arr => {
|
arr.forEach(item => {
|
item.type = false;
|
});
|
this.checkImgList = arr;
|
});
|
},
|
listSysCheck(t) {
|
this.$api.get(
|
"communityactivity/sysPicture/getList",
|
{ type: t },
|
arr => {
|
arr.forEach(item => {
|
item.type = false;
|
});
|
this.checkImgList = arr;
|
}
|
);
|
},
|
nBlur() {
|
this.endnum1 = false;
|
this.endnum2 = false;
|
this.startnum1 = false;
|
this.startnum2 = false;
|
this.minmax = +this.max.a === -1;
|
this.isCr = +this.max.b === -1;
|
},
|
// 取消
|
reset() {
|
for (let k in this.form) {
|
this.form[k] = "";
|
}
|
this.win = { a: 0, b: 0 };
|
this.max = { a: 0, b: 0 };
|
this.time = { a: ["", ""], b: ["", ""] };
|
this.content = "";
|
this.leaderId = "";
|
this.item = [];
|
},
|
// 获取数据-编辑
|
getData(id) {
|
this.$api.get("communityactivity/detailactivity", { id }, e => {
|
this.form.activityName = e.activityName;
|
this.form.activityAddr = e.activityAddr;
|
this.form.prizeRemark = e.prizeRemark;
|
this.form.range = e.range;
|
this.form.rewardDesc = e.rewardDesc;
|
this.leaderId = this.form.sponsorId = +e.sponsorId;
|
this.form.sponsorName = e.sponsorName;
|
this.form.contactName = e.contactName;
|
this.form.contactPhone = e.contactPhone;
|
this.form.isTop = e.isTop;
|
this.form.id = e.id;
|
this.form.lat = e.lat;
|
this.form.lng = e.lng;
|
this.form.isQrCode = e.isQrCode;
|
this.form.volunteerMin = e.volunteerMin;
|
this.form.activityType = e.activityType;
|
this.form.signOutRange = e.signOutRange;
|
this.form.aattendPeople = e.aattendPeople;
|
this.form.pbRewardWay = e.pbRewardWay;
|
this.form.volunteerRewardWay = e.volunteerRewardWay;
|
this.form.participantRewardWay = e.participantRewardWay;
|
this.form.participantRewardIntegral = e.participantRewardIntegral;
|
this.form.volunteerMax = e.volunteerMax;
|
this.form.volunteerRewardIntegral = e.volunteerRewardIntegral;
|
this.form.pbRewardIntegral = e.pbRewardIntegral;
|
this.crowdListValue = e.aattendPeople.split(",");
|
if (e.range == -1) {
|
this.isrange = 1;
|
} else {
|
this.form.range = e.range;
|
}
|
if (e.signOutRange == -1) {
|
this.israngeOut = 1;
|
} else {
|
this.form.signOutRange = e.signOutRange;
|
}
|
if (e.participantMax == -1) {
|
this.isparticipantMax = 1;
|
}
|
this.form.participantMax = e.participantMax || -1;
|
if (e.partyMemberMax == -1) {
|
this.partyMemberMax = 1;
|
}
|
this.form.partyMemberMax = e.partyMemberMax;
|
if (this.form.partyMemberMax == -1) {
|
this.partyMemberMax = true;
|
}
|
if (this.form.volunteerMax == -1) {
|
this.volunteerMax = true;
|
}
|
if (this.form.participantMax == -1) {
|
this.juMingMax = true;
|
}
|
if (this.form.limit == -1) {
|
this.checkCountPeople = true;
|
}
|
if (e.limit == -1) {
|
this.islimit = 1;
|
}
|
this.form.limit = e.limit;
|
(this.signtime = [e.signUpBegin, e.signUpEnd]),
|
(this.activetime = [e.beginAt, e.endAt]),
|
(this.form.haveIntegralReward = e.haveIntegralReward);
|
this.form.rewardWay = 1; //默认选中
|
this.form.rewardIntegral = e.rewardIntegral;
|
this.form.canCancel = e.canCancel;
|
this.form.cancelDeduct = e.cancelDeduct;
|
this.form.signUpEnd = e.signUpEnd;
|
this.form.beginAt = e.beginAt;
|
this.form.endAt = e.endAt;
|
|
this.form.cover = e.cover;
|
this.content = this.form.content = e.content;
|
this.hasPrize = e.hasPrize;
|
this.form.status = e.status;
|
this.win = !(+e.hasPrize === 1);
|
this.isC = +e.participantMax === 0;
|
this.nBlur();
|
this.item = [];
|
this.$nextTick(() => {
|
this.item = (e.comActActPrizeVOList || []).map(k => {
|
return {
|
name: k.prizeName,
|
pic: k.prizePhoto,
|
type: !!k.type,
|
id: k.id,
|
aid: k.activityId
|
};
|
});
|
});
|
});
|
},
|
//编辑富文本
|
change(val) {
|
this.form.content = val;
|
},
|
// 保存
|
send(v, f) {
|
this.$refs[f].validate(valid => {
|
if (valid) {
|
if (!this.signtime.length) {
|
return demo.toast("请选择报名时间");
|
}
|
if (!this.activetime.length) {
|
return demo.toast("请选择活动时间");
|
}
|
if (this.signtime[1] > this.activetime[1]) {
|
return demo.toast("活动结束时间不能早于报名结束时间");
|
}
|
if (this.signtime[0] > this.activetime[0]) {
|
return demo.toast("活动开始时间不能早于报名开始时间");
|
}
|
if (!this.form.cover) {
|
return demo.toast("请上传活动封面");
|
}
|
if (!this.form.content) {
|
return demo.toast("请输入活动详情");
|
}
|
if (!this.form.activityType) {
|
return demo.toast("请输入活动类型");
|
}
|
(this.form.signUpBegin = this.signtime[0]),
|
(this.form.signUpEnd = this.signtime[1]),
|
(this.form.beginAt = this.activetime[0]),
|
(this.form.endAt = this.activetime[1]);
|
if (this.isrange == 1) {
|
this.form.range = -1;
|
}
|
if (this.israngeOut == 1) {
|
this.form.signOutRange = -1;
|
}
|
if (this.isparticipantMax == 1) {
|
this.form.participantMax = -1;
|
}
|
if (this.partyMemberMax == 1) {
|
this.form.partyMemberMax = -1;
|
}
|
if (this.islimit == 1) {
|
this.form.limit = -1;
|
}
|
if (this.form.haveIntegralReward == 2) {
|
this.form.rewardWay = null;
|
}
|
this.form.type = 1;
|
|
// jin_hui / add / activity;
|
let url = this.isJinHui
|
? "Jinhui/add/activity"
|
: "communityactivity/activity";
|
// let url = "communityactivity/activity";
|
//保存
|
if (v == 3) {
|
this.form.status = 1;
|
this.$api.post(url, this.form, e => {
|
demo.toast("保存活动成功");
|
this.reset();
|
this.$nextTick(() => {
|
this.$router.go(-1);
|
});
|
});
|
}
|
//保存发布
|
if (v == 2) {
|
this.form.status = 2;
|
this.$api.post(url, this.form, e => {
|
demo.toast("保存并发布成功");
|
this.reset();
|
this.$nextTick(() => {
|
this.$router.go(-1);
|
});
|
});
|
}
|
//保存/保存编辑
|
if (v == 1) {
|
this.form.status = 1;
|
this.$api.put("communityactivity/activity", this.form, e => {
|
demo.toast("编辑活动成功");
|
this.reset();
|
this.$nextTick(() => {
|
this.$router.go(-1);
|
});
|
});
|
}
|
} else {
|
return demo.toast("请补全信息再发布");
|
}
|
});
|
}
|
},
|
mounted() {
|
let user = demo.$session.get("user") || {};
|
console.log(user);
|
|
if (user.communityId == "10133") {
|
this.isJinHui = true;
|
}
|
// 当前活动负责人使用了缓存 [可接入接口 搜索]
|
if (this.$route.query.id) {
|
this.getData(this.$route.query.id);
|
this.add = true;
|
} else {
|
this.add = false;
|
}
|
this.$api.leader(e => {
|
this.leader = e;
|
});
|
this.getactivity();
|
}
|
};
|
</script>
|
<style lang="less" scoped>
|
.fm {
|
/deep/.el-dialog {
|
height: 50%;
|
overflow: auto;
|
}
|
}
|
.number-title {
|
// height: 10px;
|
// font-size: 14px;
|
// padding-top: 10px;
|
// color: #a5a8af;
|
}
|
.act_add {
|
overflow-y: auto;
|
.edit {
|
margin-bottom: 10px;
|
padding: 0 40px;
|
}
|
.sec:last-child {
|
margin-bottom: 0;
|
}
|
.up {
|
margin-top: 8px;
|
}
|
.sec {
|
.label {
|
width: 120px;
|
}
|
article {
|
width: calc(~"100% - 120px");
|
max-width: 300px;
|
&.more {
|
max-width: 100%;
|
}
|
.label {
|
text-align: left;
|
}
|
.item {
|
display: flex;
|
flex-wrap: wrap;
|
article {
|
margin: 0 10px 10px 0;
|
width: 140px;
|
box-sizing: border-box;
|
padding: 5px 20px 5px 0;
|
text-align: center;
|
.avatar {
|
margin: 0 auto 5px;
|
}
|
.el-input {
|
margin-bottom: 5px;
|
}
|
}
|
.btn {
|
display: flex;
|
justify-content: space-between;
|
width: 120px;
|
.add,
|
.del {
|
width: 40px;
|
height: 40px;
|
line-height: 40px;
|
text-align: center;
|
font-size: 28px;
|
font-weight: 700;
|
display: block;
|
border-radius: 50%;
|
border: 1px solid #ccc;
|
color: #666;
|
cursor: pointer;
|
}
|
}
|
}
|
}
|
}
|
}
|
.update-img {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 260px;
|
height: 154px;
|
border: 1px dashed #999;
|
}
|
.fz-15 {
|
font-size: 30px;
|
}
|
.img-shwo-item {
|
cursor: pointer;
|
width: 260px;
|
height: 154px;
|
}
|
.img-list-item {
|
margin-bottom: 10px;
|
width: 260px;
|
height: 154px;
|
position: relative;
|
border: 1px dashed #fff;
|
}
|
.check-img {
|
cursor: pointer;
|
z-index: 999;
|
position: absolute;
|
right: 0;
|
top: 0;
|
width: 20px;
|
height: 20px;
|
}
|
.fl-f {
|
display: flex;
|
}
|
.fl-fw {
|
display: flex;
|
flex-wrap: wrap;
|
}
|
.mr-r-10 {
|
margin-right: 10px;
|
}
|
.cropper-content .cropper {
|
width: auto;
|
height: 500px !important;
|
}
|
.fl-al {
|
display: flex;
|
align-items: center;
|
}
|
.el-dialog {
|
width: 800px !important;
|
}
|
.input-width {
|
width: 300px;
|
}
|
.input-width2 {
|
width: 200px;
|
}
|
</style>
|
