1914 lines
91 KiB
HTML
1914 lines
91 KiB
HTML
<!--#
|
|
layout("/layouts/platform.html"){
|
|
#-->
|
|
<style>
|
|
.el-loading-mask {
|
|
z-index: 99999999 !important;
|
|
}
|
|
|
|
.amap-logo, .amap-copyright {
|
|
display: none !important;
|
|
}
|
|
|
|
#xlMap .amap-icon img {
|
|
position: absolute !important;
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
top: 0 !important;
|
|
left: 0 !important;
|
|
}
|
|
|
|
#dwMap .amap-icon img {
|
|
position: absolute !important;
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
top: 0 !important;
|
|
left: 0 !important;
|
|
}
|
|
|
|
#viewXlMap .amap-icon img {
|
|
width: 25px;
|
|
height: 34px;
|
|
}
|
|
|
|
.mapInfo {
|
|
padding: .75rem 1.25rem;
|
|
border-radius: .25rem;
|
|
background-color: white;
|
|
width: auto;
|
|
min-width: 0rem;
|
|
border-width: 0;
|
|
box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5);
|
|
}
|
|
|
|
.amap-marker-label {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
|
|
.el-select-dropdown {
|
|
z-index: 99999999 !important;
|
|
}
|
|
|
|
.el-loading-mask {
|
|
z-index: 99999999 !important;
|
|
}
|
|
|
|
.el-picker-panel {
|
|
z-index: 99999999 !important;
|
|
}
|
|
</style>
|
|
|
|
<div id="app" v-cloak>
|
|
<guava ref="guava">
|
|
<template>
|
|
<el-card shadow="never">
|
|
<div class="search">
|
|
<div class="search-item">
|
|
<div class="search-item-label">年份：</div>
|
|
<div class="search-item-option">
|
|
<el-date-picker
|
|
v-model="pageForm.year"
|
|
:clearable="false"
|
|
type="year"
|
|
style="width: 100%"
|
|
value-format="yyyy">
|
|
</el-date-picker>
|
|
</div>
|
|
</div>
|
|
<div class="search-item">
|
|
<div class="search-item-label">活动：</div>
|
|
<div class="search-item-option">
|
|
<el-input placeholder="请输入内容" clearable v-model="pageForm.searchKeyword"
|
|
@keyup.enter.native="doSearch">
|
|
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型"
|
|
style="width: 100px;">
|
|
<el-option label="活动名称" value="name"></el-option>
|
|
</el-select>
|
|
</el-input>
|
|
</div>
|
|
</div>
|
|
<div class="search-item">
|
|
<div class="search-item-label">所属工会：</div>
|
|
<div class="search-item-option">
|
|
<el-select @change="pageData" clearable filterable
|
|
placeholder="请选择所属工会" style="width: 100%" v-model="pageForm.unionId">
|
|
<el-option
|
|
:key="item.id"
|
|
:label="item.unionname"
|
|
:value="item.id"
|
|
v-for="item in unionOptions">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
</div>
|
|
<div class="search-query">
|
|
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
<el-card shadow="never" class="mt10">
|
|
<table-tool :app="this" label="活动列表">
|
|
<template #func>
|
|
<el-button icon="el-icon-plus" type="primary" size="small" @click="openAdd">创建活动</el-button>
|
|
</template>
|
|
</table-tool>
|
|
<el-table :data="tableData" style="width: 100%" row-key="_id" @sort-change="pageOrder"
|
|
v-loading="tabLoading">
|
|
<el-table-column align="center" header-align="center" label="序号" type="index">
|
|
<template scope="scope">
|
|
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
|
</template>
|
|
</el-table-column>
|
|
<template></template>
|
|
<el-table-column label="主活动名称" prop="masterActivityName"></el-table-column>
|
|
<el-table-column label="组织单位" prop="masterActivityName"></el-table-column>
|
|
<el-table-column label="分活动名称" prop="branchActivityName"></el-table-column>
|
|
<el-table-column label="奖品名称" prop="gift_name"></el-table-column>
|
|
<el-table-column label="活动地址" prop="address"></el-table-column>
|
|
<el-table-column label="报名时间">
|
|
<template scope="scope">
|
|
{{moment(scope.row.applyStartTime).format('YYYY-MM-DD HH:mm:ss')}} -
|
|
{{moment(scope.row.applyEndTime).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="活动时间">
|
|
<template scope="scope">
|
|
{{moment(scope.row.startTime).format('YYYY-MM-DD HH:mm:ss')}} -
|
|
{{moment(scope.row.endTime).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="操作" fixed="right" width="120px">
|
|
<template scope="scope">
|
|
<el-dropdown @command="dropdownCommand">
|
|
<el-button size="mini">
|
|
<i class="ti-settings"></i>
|
|
<span class="ti-angle-down"></span>
|
|
</el-button>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item :command="{type:'sendMsg',data:scope.row}">
|
|
通知
|
|
</el-dropdown-item>
|
|
<el-dropdown-item :command="{type:'view',data:scope.row}">
|
|
查看
|
|
</el-dropdown-item>
|
|
<el-dropdown-item :command="{type:'edit',data:scope.row}">
|
|
编辑
|
|
</el-dropdown-item>
|
|
<el-dropdown-item :command="{type:'delete',data:scope.row}">
|
|
删除
|
|
</el-dropdown-item>
|
|
<el-dropdown-item :command="{type:'backups',data:scope.row}">
|
|
备份数据
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-row class="el-pagination-container">
|
|
<el-pagination
|
|
@size-change="pageSizeChange"
|
|
@current-change="pageNumberChange"
|
|
:current-page="pageForm.pageNumber"
|
|
:page-sizes="[10, 20, 30, 50]"
|
|
:page-size="pageForm.pageSize"
|
|
layout="total, sizes, prev, pager, next"
|
|
:total="pageForm.totalCount">
|
|
</el-pagination>
|
|
</el-row>
|
|
</el-card>
|
|
</template>
|
|
<template #edit>
|
|
<el-steps :active="stepActive" v-if="formData.activityModel === 'punch'" simple finish-status="success">
|
|
<el-step title="活动信息" description=""></el-step>
|
|
<el-step title="点位信息" description=""></el-step>
|
|
<el-step title="线路规划" description=""></el-step>
|
|
</el-steps>
|
|
<transition name="el-zoom-in-top">
|
|
<div v-show="stepActive==0" class="transition-box" style="margin-top: 20px;">
|
|
<el-form :model="formData" ref="form" :rules="formRules"
|
|
label-width="150px">
|
|
<vi-title title="填写活动信息"></vi-title>
|
|
|
|
<el-row v-if="isEdit() && !formData._id" type="flex" :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否沿用之前活动" prop="use">
|
|
<el-radio-group v-model="use">
|
|
<el-radio border :label="true">沿用之前活动</el-radio>
|
|
<el-radio border :label="false">不沿用之前活动</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12" v-if="use">
|
|
<el-form-item label="往期活动" prop="historicalAct">
|
|
<el-select v-model="historicalAct" placeholder="请选择"
|
|
style="width: 100%" @change="historicalActChange">
|
|
<el-option
|
|
v-for="item in historicalActList"
|
|
:key="item._id"
|
|
:label="item.fullName"
|
|
:value="item._id">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" type="flex">
|
|
<el-col :span="12">
|
|
<el-form-item label="活动模式" prop="activityModel">
|
|
<el-radio-group v-model="formData.activityModel">
|
|
<el-radio border label="punch">打卡模式</el-radio>
|
|
<el-radio border label="stepCount">计步模式</el-radio>
|
|
<!-- <el-radio border label="GPS">GPS模式</el-radio>-->
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="主活动名称" prop="masterActivityName"
|
|
:rules="[{ required:true, message: '请填写主活动名称' }]">
|
|
<el-input type="text" v-model="formData.masterActivityName" maxlength="20"
|
|
placeholder="请填写主活动名称"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="分活动名称" prop="branchActivityName">
|
|
<el-input type="text" v-model="formData.branchActivityName" maxlength="20"
|
|
placeholder="请填写分活动名称"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-form-item label="活动地址" prop="address">
|
|
<el-input type="text" v-model="formData.address" maxlength="200"
|
|
placeholder="请填写活动地址"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="奖品名称" prop="giftName">
|
|
<el-input type="text" v-model="formData.giftName" maxlength="50"
|
|
placeholder="请填写奖品名称"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item prop="groupId" label="参加人员范围">
|
|
<div style="display: flex; justify-content: space-between">
|
|
<div style="width: 99%">
|
|
<el-select prop="groupId" placeholder="参加人员范围"
|
|
v-model="formData.groupId"
|
|
style="width: 99%;"
|
|
clearable
|
|
filterable>
|
|
<el-option v-for="item in activityGroupList"
|
|
:label="item.groupName"
|
|
:value="item.groupId"></el-option>
|
|
</el-select>
|
|
</div>
|
|
<div>
|
|
<el-button @click="$refs.drawerUserScope.userScopeDialog = true"
|
|
type="primary">设置
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</el-form-item>
|
|
|
|
<el-row :gutter="20" type="flex" v-if="formData.activityModel=='punch'">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否按点位顺序签到" prop="isOrderSignIn">
|
|
<el-radio-group v-model="formData.isOrderSignIn">
|
|
<el-radio border :label="false">否</el-radio>
|
|
<el-radio border :label="true">是</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="是否有多条线路" prop="isMultipleLines">
|
|
<el-radio-group v-model="formData.isMultipleLines">
|
|
<el-radio border :label="false">否</el-radio>
|
|
<el-radio border :label="true">是</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20" type="flex" v-if="formData.activityModel=='punch'">
|
|
<el-col :span="12">
|
|
<el-form-item label="点位答题" prop="isQuestion">
|
|
<el-radio-group v-model="formData.isQuestion">
|
|
<el-radio border :label="false">否</el-radio>
|
|
<el-radio border :label="true">是</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12" v-if="formData.isQuestion">
|
|
<el-form-item label="答题试卷" prop="questionId">
|
|
<el-select v-model="formData.questionId" filterable style="width: 100%"
|
|
clearable
|
|
placeholder="选择答题试卷">
|
|
<el-option
|
|
v-for="item in questionOptions"
|
|
:label="item.qtitle"
|
|
:key="item.qid"
|
|
:value="item.qid">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row :gutter="20" type="flex" v-if="formData.activityModel=='punch'">
|
|
<el-col :span="12">
|
|
<el-form-item label="速度控制" prop="checkControl">
|
|
<el-select v-model="formData.checkControl">
|
|
<el-option :value="1" label="不控制速度"></el-option>
|
|
<el-option :value="2" label="设置配速"></el-option>
|
|
<el-option :value="3" label="设置两点签到时间"></el-option>
|
|
</el-select>
|
|
<span v-if="formData.checkControl==3" class="ml5 text-warning">
|
|
两点签到时间请在点位信息中设置
|
|
</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="配速" prop="pace" v-if="formData.checkControl==2">
|
|
<el-input-number v-model="formData.pace" :precision="2" :step="0.1"
|
|
:min="0.01" style="width: 100%"></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" v-if="formData.activityModel=='punch'">
|
|
<el-col :span="12">
|
|
<el-form-item label="打卡完成"
|
|
prop="punchFinishAfter"
|
|
:rules="[{ required:true, message: '必填' }]">
|
|
<el-radio-group v-model="formData.punchFinishAfter">
|
|
<el-radio border label="gift_voucher">礼品券</el-radio>
|
|
<el-radio border label="cert">完赛证书</el-radio>
|
|
<el-radio border label="none">无</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row type="flex"
|
|
v-if="formData.activityModel==='punch' && formData.punchFinishAfter==='cert'">
|
|
<el-col :span="12">
|
|
<el-form-item label="完赛证书" prop="tempCompletionCertificateCover">
|
|
<el-upload
|
|
class="pictureUpload"
|
|
:auto-upload="false"
|
|
:limit="1"
|
|
list-type="picture-card"
|
|
:on-change="certificatePictureChange"
|
|
:on-remove="certificatePictureRemove"
|
|
:file-list="certificatePictureList">
|
|
<i class="el-icon-plus"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" :gutter="20" v-if="formData.activityModel==='punch' && formData.punchFinishAfter==='cert'">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否抽奖"
|
|
:rules="[{ required:true, message: '必填' }]">
|
|
<el-radio-group v-model="formData.isLottery">
|
|
<el-radio border :label="true">是</el-radio>
|
|
<el-radio border :label="false">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" :gutter="20" v-if="formData.isLottery && formData.activityModel=='punch'">
|
|
<el-col :span="24">
|
|
<el-form-item label="奖品列表" prop="punchLotteryPrizes">
|
|
<el-table :data="formData.punchLotteryPrizes">
|
|
<el-table-column label="奖品名称">
|
|
<template scope="scope">
|
|
<el-input v-model="scope.row.name" max="20" clearable></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="奖品图片">
|
|
<template scope="scope">
|
|
<el-input v-model="scope.row.url" max="20" clearable></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="奖品份数">
|
|
<template scope="scope">
|
|
<el-input-number v-model="scope.row.num" clearable></el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作">
|
|
<template slot="header" slot-scope="scope">
|
|
<el-button @click="formData.punchLotteryPrizes.push({})"
|
|
icon="el-icon-plus" size="mini" type="primary"></el-button>
|
|
</template>
|
|
<template scope="scope">
|
|
<el-button @click="formData.punchLotteryPrizes.splice(scope.$index,1)"
|
|
icon="el-icon-delete" size="mini" type="danger"></el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row type="flex" gutter="20">
|
|
<el-col :span="12" v-if="formData.activityModel === 'punch'">
|
|
<el-form-item label="报名时间" prop="applyTime"
|
|
:rules="[{ required:true, message: '请选择报名时间' }]">
|
|
<el-date-picker
|
|
style="width: 100%"
|
|
v-model="formData.applyTime"
|
|
type="datetimerange"
|
|
align="right"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
value-format="timestamp">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="活动时间" prop="time"
|
|
:rules="[{ required:true, message: '请选择活动时间' }]">
|
|
<el-date-picker
|
|
style="width: 100%"
|
|
v-model="formData.time"
|
|
type="datetimerange"
|
|
align="right"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
value-format="timestamp">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<template v-if="formData.isLottery && formData.activityModel=='stepCount'">
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="抽奖模式"
|
|
prop="lotteryMode"
|
|
:rules="[{required:true,message:'必填',trigger:['change','blur']}]">
|
|
<el-radio-group v-model="formData.lotteryMode" size="small">
|
|
<el-radio label="none" border>无</el-radio>
|
|
<el-radio label="everyday" border>每日</el-radio>
|
|
<!-- <el-radio label="monthly" border>每月</el-radio>-->
|
|
<el-radio label="custom" border>自定义</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12" v-if="formData.lotteryMode!=='none'">
|
|
<el-form-item label="抽奖时间"
|
|
v-if="formData.lotteryMode==='everyday'"
|
|
:rules="[{required:true,message:'必填',trigger:['change','blur']}]">
|
|
<el-time-picker
|
|
style="width: 100%"
|
|
v-model="formData.lotteryTime"
|
|
value-format="HH:mm:ss"
|
|
clearable
|
|
placeholder="抽奖时间">
|
|
</el-time-picker>
|
|
<span class="text-info">
|
|
提示：为空则每日0点抽奖
|
|
</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-form-item label="抽奖时间" prop="customLotteryRules"
|
|
v-if="formData.lotteryMode==='custom'">
|
|
<el-table :data="formData.customLotteryRules">
|
|
<el-table-column label="抽奖时间">
|
|
<template scope="scope">
|
|
<el-date-picker type="datetime" style="width: 100%"
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
v-model="scope.row.lotteryTime"></el-date-picker>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="开始日期">
|
|
<template scope="scope">
|
|
<el-date-picker type="date" style="width: 100%" value-format="yyyy-MM-dd"
|
|
v-model="scope.row.startDate"></el-date-picker>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="结束日期">
|
|
<template scope="scope">
|
|
<el-date-picker type="date" style="width: 100%" value-format="yyyy-MM-dd"
|
|
v-model="scope.row.endDate"></el-date-picker>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="奖项名称">
|
|
<template scope="scope">
|
|
<el-input v-model="scope.row.awardName" max="20"></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="抽奖人数">
|
|
<template scope="scope">
|
|
<el-input-number v-model="scope.row.lotteryUserNum"
|
|
style="width: 100%"></el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="抽奖资格步数">
|
|
<template scope="scope">
|
|
<el-input-number
|
|
v-model="scope.row.lotteryQualificationStep"
|
|
style="width: 100%"></el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="抽奖资格天数">
|
|
<template scope="scope">
|
|
<el-input-number
|
|
v-model="scope.row.lotteryQualificationDay"
|
|
style="width: 100%"></el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="操作">
|
|
<template slot="header" slot-scope="scope">
|
|
<el-button @click="formData.customLotteryRules.push({})"
|
|
icon="el-icon-plus" size="mini" type="primary"></el-button>
|
|
</template>
|
|
<template scope="scope">
|
|
<el-button @click="formData.customLotteryRules.splice(scope.$index,1)"
|
|
icon="el-icon-delete" size="mini" type="danger"></el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-form-item>
|
|
|
|
<template v-if="formData.lotteryMode==='everyday'">
|
|
<el-row :gutter="20" v-if="formData.lotteryMode!=='none'">
|
|
<el-col :span="12">
|
|
<el-form-item label="抽奖资格步数"
|
|
:rules="[{required:true,message:'必填',trigger:['change','blur']}]">
|
|
<el-input-number v-model="formData.dayLotteryRule.lotteryQualificationStep"
|
|
style="width: 100%"
|
|
:min="1"
|
|
placeholder="抽奖资格步数"
|
|
label="抽奖资格步数"></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="抽奖人数"
|
|
:rules="[{required:true,message:'必填',trigger:['change','blur']}]">
|
|
<el-input-number v-model="formData.dayLotteryRule.lotteryUserNum"
|
|
style="width: 100%"
|
|
:min="1"
|
|
placeholder="抽奖人数"
|
|
label="抽奖人数"></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</template>
|
|
</template>
|
|
|
|
<template v-if="formData.activityModel=='stepCount'">
|
|
<el-row type="flex">
|
|
<el-col :span="12">
|
|
<el-form-item label="是否通知" prop="sendNotify">
|
|
<el-switch
|
|
v-model="formData.sendNotify"
|
|
active-color="#13ce66"
|
|
inactive-color="#ff4949">
|
|
</el-switch>
|
|
<div class="text-primary">
|
|
开启后会根据活动时间在指定时间内提醒用户登录小程序上传步数
|
|
</div>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</template>
|
|
|
|
<el-form-item label="距离限制" prop="enableDistance"
|
|
v-if="formData.activityModel=='punch'"
|
|
:rules="[{ required:true, message: '必填' }]">
|
|
<el-radio-group v-model="formData.enableDistance">
|
|
<el-radio border :label="true">是</el-radio>
|
|
<el-radio border :label="false">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="完成点位数" prop="finishPointNum"
|
|
v-if="formData.activityModel=='punch'"
|
|
:rules="[{ required:true, message: '必填' }]">
|
|
<el-input-number v-model="formData.finishPointNum" :min="2"></el-input-number>
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="外链地址" prop="externalLinkAddress">
|
|
<el-input v-model="formData.externalLinkAddress"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="活动介绍" prop="note"
|
|
:rules="[{ required:true, message: '请填写活动介绍' }]">
|
|
<div id="noteEditor"></div>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="学习卡" prop="stepPics">
|
|
<el-upload
|
|
list-type="picture-card"
|
|
multiple
|
|
class="pictureUpload"
|
|
:on-change="stepPictureChange"
|
|
:on-remove="stepPictureRemove"
|
|
:file-list="stepPictureList"
|
|
:auto-upload="false">
|
|
<i class="el-icon-plus"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="活动封面图" prop="tempCover">
|
|
<el-upload
|
|
class="pictureUpload"
|
|
:auto-upload="false"
|
|
:limit="1"
|
|
list-type="picture-card"
|
|
:on-change="pictureChange"
|
|
:on-remove="pictureRemove"
|
|
:file-list="pictureList">
|
|
<i class="el-icon-plus"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<div style="float: right;margin: 20px 0">
|
|
<el-button @click="next" type="primary" v-if="formData.activityModel=='punch'">下一步
|
|
</el-button>
|
|
<el-button :disabled="subDis" @click="next" type="primary"
|
|
v-else>
|
|
提 交
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</transition>
|
|
<transition name="el-zoom-in-top">
|
|
<div v-show="stepActive==1" class="transition-box" style="margin-top: 20px;">
|
|
<el-form label-width="120px" label-position="left">
|
|
<vi-title title="创建点位坐标"></vi-title>
|
|
</el-form>
|
|
<el-table :data="formData.pts" size="medium">
|
|
<el-table-column type="index" label=""></el-table-column>
|
|
|
|
<el-table-column label="点位编号" prop="code" width="200px">
|
|
<template scope="scope">
|
|
<el-input type="text" v-model="scope.row.code" maxlength="20"
|
|
placeholder="请填写点位编号"></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="点位名称" prop="name">
|
|
<template scope="scope">
|
|
<el-input type="text" v-model="scope.row.name" maxlength="50"
|
|
placeholder="请填写点位名称"></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="点位半径" prop="radius">
|
|
<template scope="scope">
|
|
<el-input-number type="text" v-model="scope.row.radius"
|
|
:min="0"
|
|
:max="9999999"
|
|
placeholder="请填写点位半径">
|
|
<temnplate slot="append">m</temnplate>
|
|
</el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column v-if="formData.checkControl==3" label="时间间隔" prop="interval">
|
|
<template scope="scope">
|
|
<el-input :disabled="scope.$index==0" placeholder="请输入时间间隔"
|
|
v-model="scope.row.interval">
|
|
<template slot="append">min</template>
|
|
</el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column v-if="formData.isQuestion" label="答题题目" prop="issueIds">
|
|
<template scope="scope">
|
|
<el-select v-model="scope.row.issueIds" filterable multiple
|
|
style="width: 100%" placeholder="选择答题题目" @change="issueChange">
|
|
<el-option
|
|
v-for="item in issueOptions"
|
|
:label="getSimpleText(item.iname)"
|
|
:value="item.iid">
|
|
</el-option>
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="点位坐标" prop="location" width="120px">
|
|
<template scope="scope">
|
|
<el-button @click="openDw(scope.$index)" type="primary" size="small"
|
|
icon="el-icon-location-information"
|
|
circle></el-button>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="领取点位" prop="receivePoint" width="120px">
|
|
<template scope="scope">
|
|
<el-switch
|
|
v-model="scope.row.receivePoint"
|
|
active-color="#13ce66"
|
|
inactive-color="#ff4949">
|
|
</el-switch>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="点位描述" prop="ms" width="120px">
|
|
<template scope="scope">
|
|
<span v-if="scope.$index==0" class="text-warning">起点</span>
|
|
<span v-else-if="scope.$index>0&&scope.$index<formData.pts.length-1"
|
|
class="text-info">经过点</span>
|
|
<span v-else-if="scope.$index==formData.pts.length-1&&formData.pts.length>1"
|
|
class="text-success">终点</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="操作" width="120px">
|
|
<template scope="scope">
|
|
<el-button type="danger"
|
|
size="mini"
|
|
@click="formData.pts.splice(scope.$index,1)"
|
|
icon="el-icon-delete"></el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<el-button style="width: 100%;margin-top: 5px" plain type="primary" icon="el-icon-plus"
|
|
size="small" @click="formData.pts.push({is_dt:false,issueIds:[]})">添加点位
|
|
</el-button>
|
|
|
|
<div style="float: right;margin: 20px 0">
|
|
<el-button @click="stepActive=0">上一步</el-button>
|
|
<el-button type="primary" @click="next">下一步</el-button>
|
|
</div>
|
|
</div>
|
|
</transition>
|
|
<transition name="el-zoom-in-top">
|
|
<div v-show="stepActive==2" class="transition-box" style="margin-top: 20px;">
|
|
|
|
<div style="width: 100%;height: 600px" id="xlMap"></div>
|
|
|
|
<div style="float: right;margin: 20px 0">
|
|
<el-button @click="previousStep()" v-if="formData.activityModel=='punch'">上一步
|
|
</el-button>
|
|
<el-button type="primary" :disabled="subDis" @click="next">提
|
|
交
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
</transition>
|
|
</template>
|
|
</guava>
|
|
|
|
<el-dialog
|
|
title="点位坐标"
|
|
:visible.sync="dwDialogVisible" custom-class="ViewDialogClass"
|
|
:close-on-click-modal="false" width="60%" top="2%">
|
|
|
|
<div style="margin-bottom: 10px">
|
|
<el-autocomplete
|
|
v-model="addressValue" style="width: 100%"
|
|
:fetch-suggestions="querySearchAsync"
|
|
placeholder="请输入关键词查询地址"
|
|
@select="handleSelect"></el-autocomplete>
|
|
</div>
|
|
<div style="width: 100%;height: 600px" id="dwMap"></div>
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="dwDialogVisible = false">确 定</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
|
|
<el-dialog
|
|
title="活动详细信息"
|
|
:visible.sync="viewDialogVisible" custom-class="ViewDialogClass"
|
|
:close-on-click-modal="false" width="60%">
|
|
|
|
<el-tabs tab-position="top" v-model="activeName" v-loading="loading" style="margin-top: -30px">
|
|
<el-tab-pane label="活动信息" name="1">
|
|
<el-form label-width="130px" style="padding: 20px 0">
|
|
|
|
<!-- <el-form-item label="基础信息 " label-width="135px" class="view-header">-->
|
|
<!-- </el-form-item>-->
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="活动名称：">
|
|
{{viewData.name}}
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="活动地址：">
|
|
{{viewData.address}}
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="开始报名时间：">
|
|
{{moment(viewData.apply_start_time).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="结束报名时间：">
|
|
{{moment(viewData.apply_end_time).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="活动开始时间：">
|
|
{{moment(viewData.start_time).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="活动结束时间：">
|
|
{{moment(viewData.end_time).format('YYYY-MM-DD HH:mm:ss')}}
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item label="活动模式：">
|
|
<span v-if="viewData.activityModel=='punch'">打卡模式</span>
|
|
<span v-if="viewData.activityModel=='stepCount'">计步模式</span>
|
|
<span v-if="viewData.activityModel=='GPS'">GPS模式</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="每日抽奖名额：" v-if="viewData.activityModel=='stepCount'">
|
|
{{viewData.dailyLottery?viewData.dailyLottery:'暂无'}}
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="健步步数：" v-if="viewData.activityModel=='stepCount'">
|
|
{{viewData.walkingStepCount?viewData.walkingStepCount:'暂无'}}
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="24">
|
|
<el-form-item label="活动介绍：">
|
|
<div v-if="!viewData.note">暂无</div>
|
|
<div else v-html="viewData.note"></div>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row gutter="20">
|
|
<el-col :span="24">
|
|
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="24">
|
|
<el-form-item label="活动封面：">
|
|
<el-image style="width: 100px; height: 100px" :src="picSrc" fit="cover"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
</el-form>
|
|
</el-tab-pane>
|
|
|
|
<el-tab-pane label="线路规划" name="2" v-if="viewData.activityModel == 'punch'">
|
|
<div id="viewXlMap" style="width: 100%;height: 600px"></div>
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="viewDialogVisible = false">关 闭</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
|
|
<drawer-user-scope
|
|
@group_change="getActivityGroup"
|
|
ref="drawerUserScope"
|
|
:group_id.sync="formData.groupId"
|
|
></drawer-user-scope>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
let E = window.wangEditor
|
|
let noteEditor = null
|
|
let icon = new AMap.Icon({
|
|
size: new AMap.Size(25, 34),
|
|
image: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
|
|
imageSize: new AMap.Size(140, 30),
|
|
imageOffset: new AMap.Pixel(-95, -3)
|
|
});
|
|
let map = null
|
|
let marker = null
|
|
|
|
|
|
const vue = new Vue({
|
|
el: '#app',
|
|
mixins: [initTableMixins],
|
|
data() {
|
|
return {
|
|
userScopeDialog: false,
|
|
activityGroupList: [],
|
|
hasChildrenAct: false,
|
|
issueOptions2: [],
|
|
questionOptions: [],
|
|
issueOptions: [],
|
|
stepActive: 0,
|
|
activeName: '1',
|
|
viewDialogVisible: false,
|
|
dwDialogVisible: false,
|
|
tabLoading: false,
|
|
formData: {},
|
|
tableData: [],
|
|
pageForm: {
|
|
searchName: "name",
|
|
searchKeyword: "",
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
totalCount: 0,
|
|
pageOrderName: "",
|
|
pageOrderBy: "",
|
|
year: ''
|
|
},
|
|
formRules: {
|
|
tag: [{required: true, message: '请填写主活动名称', trigger: ['blur', 'change']}],
|
|
name: [{required: true, message: '请填写分活动名称', trigger: ['blur', 'change']}],
|
|
address: [{required: true, message: '请填写活动地址', trigger: ['blur', 'change']}],
|
|
bmsj: [{required: true, message: '请选择报名时间', trigger: ['blur', 'change']}],
|
|
hdsj: [{required: true, message: '请选择活动时间', trigger: ['blur', 'change']}],
|
|
hasAnswer: [{required: true, message: '请选择是否有答题', trigger: ['blur', 'change']}],
|
|
questionId: [{required: true, message: '请选择答题试卷', trigger: ['blur', 'change']}],
|
|
activityModel: [{required: true, message: '请选择活动模式', trigger: ['blur', 'change']}],
|
|
groupId: [{required: true, message: '请选择参加人员范围', trigger: ['blur', 'change']}],
|
|
// dailyLottery: [{required: true, message: '请选择每日抽奖名额', trigger: ['blur', 'change']}],
|
|
// leaderboardNum: [{required: true, message: '请选择排行榜显示人数', trigger: ['blur', 'change']}],
|
|
// drawTime: [{required: true, message: '请选择自动抽奖时间', trigger: ['blur', 'change']}],
|
|
// lotteryTime: [{required: true, message: '请选择自动抽奖时间', trigger: ['blur', 'change']}],
|
|
},
|
|
subDis: false,
|
|
fileList: [],
|
|
loading: false,
|
|
userOptions: [],
|
|
userLoading: false,
|
|
dw: {
|
|
index: 0,
|
|
},
|
|
polyEditor: {},
|
|
polyEditor2: {},
|
|
viewData: {},
|
|
pictureList: [],
|
|
picSrc: "",
|
|
picType: ['png', 'jpg', 'jpeg', 'tiff', 'raw', 'bmp', 'gif'],
|
|
getSimpleText(html) {
|
|
if (!html) return
|
|
let msg = html.replace(new RegExp("<.+?>", "g"), '');
|
|
return msg.substr(0, 8) + "..." + msg.substr(msg.length - 5, 5);
|
|
},
|
|
use: false,
|
|
historicalActList: [],
|
|
historicalAct: '',
|
|
placeSearchComponent: null,
|
|
addressValue: '',
|
|
|
|
unionOptions: [],
|
|
stepPictureList: [],
|
|
certificatePictureList: []
|
|
}
|
|
},
|
|
components: {
|
|
'user-scope': httpVueLoader('/components/plugins/UserScope.vue'),
|
|
'drawer-user-scope': httpVueLoader('/components/plugins/DrawerUserScope.vue'),
|
|
},
|
|
methods: {
|
|
pictureRemove() {
|
|
this.pictureList = []
|
|
},
|
|
pictureChange(file, fileList) {
|
|
let fileType = file.name.substring(file.name.lastIndexOf(".") + 1)
|
|
if (!this.picType.includes(fileType.toLowerCase())) {
|
|
this.$message.info('请上传图片格式的文件')
|
|
this.pictureList = []
|
|
} else {
|
|
this.pictureList = fileList
|
|
}
|
|
},
|
|
|
|
stepPictureChange(file, fileList) {
|
|
console.log(file)
|
|
console.log(fileList)
|
|
let fileType = file.name.substring(file.name.lastIndexOf(".") + 1)
|
|
if (!this.picType.includes(fileType.toLowerCase())) {
|
|
this.$message.info('请上传图片格式的文件')
|
|
this.stepPictureList = this.stepPictureList.filter(item => item.uid !== file.uid)
|
|
} else {
|
|
this.stepPictureList = fileList
|
|
// document.getElementsByClassName('el-upload--picture-card')[0].style.display = 'none'
|
|
}
|
|
},
|
|
stepPictureRemove(file) {
|
|
// document.getElementsByClassName('el-upload--picture-card')[0].style.display = 'inline-block'
|
|
// this.pictureList = []
|
|
console.log(file);
|
|
this.stepPictureList = this.stepPictureList.filter(item => item.uid !== file.uid)
|
|
},
|
|
|
|
certificatePictureChange(file, fileList) {
|
|
let fileType = file.name.substring(file.name.lastIndexOf(".") + 1)
|
|
if (!this.picType.includes(fileType.toLowerCase())) {
|
|
this.$message.info('请上传图片格式的文件')
|
|
this.certificatePictureList = this.certificatePictureList.filter(item => item.uid !== file.uid)
|
|
} else {
|
|
this.certificatePictureList = fileList
|
|
}
|
|
},
|
|
certificatePictureRemove(file) {
|
|
this.certificatePictureList = this.certificatePictureList.filter(item => item.uid !== file.uid)
|
|
},
|
|
|
|
previousStep() {
|
|
this.stepActive = 1;
|
|
// this.polyEditor.close();
|
|
// if (this.formData.isMultipleLines) {
|
|
// this.polyEditor2.close();
|
|
// }
|
|
},
|
|
handleSelect(item) {
|
|
if (item.location) {
|
|
//定位到中心点
|
|
map.setCenter(item.location);
|
|
//TODO 获取数据，对数据进行操作如：添加marker等
|
|
this.clearMarker()
|
|
this.createMarker(item.location)
|
|
this.formData.pts[this.dw.index].lng = item.location.lng
|
|
this.formData.pts[this.dw.index].lat = item.location.lat
|
|
}
|
|
},
|
|
clearMarker() {
|
|
if (marker) {
|
|
map.remove(marker)
|
|
}
|
|
},
|
|
createMarker(position) {
|
|
marker = new AMap.Marker({
|
|
position: position,
|
|
offset: new AMap.Pixel(-13, -30)
|
|
})
|
|
map.add(marker)
|
|
map.setFitView(null, false, [150, 60, 100, 60]);
|
|
},
|
|
querySearchAsync(queryString, cb) {
|
|
if (!queryString) {
|
|
return
|
|
}
|
|
this.placeSearchComponent.search(queryString, function (status, result) {
|
|
// 查询成功时，result即对应匹配的POI信息
|
|
if (status !== 'error') {
|
|
result.poiList.pois.forEach(item => {
|
|
item.value = item.name + '【详细地址：' + item.address + '】'
|
|
})
|
|
cb(result.poiList.pois)
|
|
}
|
|
})
|
|
},
|
|
openUserScope() {
|
|
this.userScopeDialog = true
|
|
},
|
|
async getActivityGroup() {
|
|
const resp = await $.get('/platform/activity/basic/scope/getActivityUserScopeGroup')
|
|
resp.data.forEach(v => {
|
|
v.groupId = v.groupId.toString()
|
|
})
|
|
this.activityGroupList = resp.data
|
|
},
|
|
repeatedlyLotteryChange() {
|
|
this.$set(this.formData, "drawTime", 0)
|
|
this.$set(this.formData, "lotteryTime", "")
|
|
},
|
|
isEdit() {
|
|
if (this.$refs.guava) {
|
|
return this.$refs.guava.v === 'edit'
|
|
}
|
|
return false
|
|
},
|
|
async getActivityData() {
|
|
// const {data} = await $.get("/platform/jsz/hdMange/getActivityData")
|
|
// const {data} = await $.get("/platform/jsz/hdMange/getFitnessData")
|
|
// data.map(v => {
|
|
// v.fullName = (v.tag ? v.tag + "(" + v.name + ")" : v.name) + '——' + (v.activityModel === 'punch' ? '打卡模式' : v.activityModel === 'stepCount' ? '计步模式' : v.activityModel === 'GPS' ? 'GPS模式' : '暂无模式')
|
|
// })
|
|
// this.historicalActList = data;
|
|
},
|
|
historicalActChange(val) {
|
|
const activityList = clone(this.historicalActList)
|
|
const data = activityList.find(v => v._id === this.historicalAct)
|
|
this.getFile(data.pic)
|
|
data.bmsj = [moment(data.apply_start_time).format('YYYY-MM-DD HH:mm:ss'), moment(data.apply_end_time).format('YYYY-MM-DD HH:mm:ss')]
|
|
data.hdsj = [moment(data.start_time).format('YYYY-MM-DD HH:mm:ss'), moment(data.end_time).format('YYYY-MM-DD HH:mm:ss')]
|
|
data.drawTime = moment(data.drawTime).format('YYYY-MM-DD HH:mm:ss')
|
|
|
|
data.pts.map(v => {
|
|
v.lng = v.location.coordinates[0]
|
|
v.lat = v.location.coordinates[1]
|
|
})
|
|
|
|
data.linePoints = data.linePoints.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
|
|
if (data.linePoints2) {
|
|
data.linePoints2 = data.linePoints2.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
}
|
|
|
|
const historyAct = this.historicalActList.find(v => v._id === val)
|
|
if (historyAct.tag) {
|
|
this.hasChildrenAct = true
|
|
} else {
|
|
this.hasChildrenAct = false
|
|
|
|
}
|
|
|
|
if (noteEditor) {
|
|
noteEditor.txt.html(data.note)
|
|
}
|
|
data._id = null
|
|
this.formData = data
|
|
},
|
|
|
|
issueChange(val) {
|
|
|
|
},
|
|
async getInfo(id) {
|
|
const {data} = await $.get(loc() + "/findOne", {id: id})
|
|
return data
|
|
},
|
|
async openView(row) {
|
|
this.viewDialogVisible = true
|
|
this.loading = true
|
|
|
|
this.getFile(row.pic)
|
|
|
|
this.viewData = await this.getInfo(row._id)
|
|
|
|
if (this.viewData) {
|
|
this.activeName = '1'
|
|
|
|
this.$nextTick(() => {
|
|
let path = this.viewData.linePoints.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
let path2 = this.viewData.linePoints2.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
let points = this.viewData.pts.map(v => {
|
|
return v.location.coordinates
|
|
})
|
|
|
|
let map = new AMap.Map("viewXlMap", {
|
|
resizeEnable: true,
|
|
center: [AppMapCenterPointX, AppMapCenterPointY],
|
|
zoom: 16
|
|
});
|
|
|
|
let polyline = new AMap.Polyline({
|
|
path: path,
|
|
isOutline: true,
|
|
outlineColor: '#ffeeff',
|
|
borderWeight: 3,
|
|
strokeColor: "#3366FF",
|
|
strokeOpacity: 1,
|
|
strokeWeight: 6,
|
|
// 折线样式还支持 'dashed'
|
|
strokeStyle: "solid",
|
|
// strokeStyle是dashed时有效
|
|
strokeDasharray: [10, 5],
|
|
lineJoin: 'round',
|
|
lineCap: 'round',
|
|
zIndex: 50,
|
|
showDir: true,
|
|
})
|
|
|
|
polyline.setMap(map)
|
|
let polyline2;
|
|
if (this.viewData.isMultipleLines) {
|
|
polyline2 = new AMap.Polyline({
|
|
path: path2,
|
|
isOutline: true,
|
|
outlineColor: '#ffeeff',
|
|
borderWeight: 3,
|
|
strokeColor: "#FF0000",
|
|
strokeOpacity: 1,
|
|
strokeWeight: 6,
|
|
// 折线样式还支持 'dashed'
|
|
strokeStyle: "solid",
|
|
// strokeStyle是dashed时有效
|
|
strokeDasharray: [10, 5],
|
|
lineJoin: 'round',
|
|
lineCap: 'round',
|
|
zIndex: 100,
|
|
showDir: true,
|
|
draggable: true
|
|
})
|
|
|
|
polyline2.setMap(map)
|
|
}
|
|
// 缩放地图到合适的视野级别
|
|
map.setFitView([polyline])
|
|
|
|
let startIcon = new AMap.Icon({
|
|
size: new AMap.Size(25, 34),
|
|
image: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-marker.png',
|
|
imageSize: new AMap.Size(135, 40),
|
|
imageOffset: new AMap.Pixel(-9, -3)
|
|
});
|
|
|
|
let viaIcon = new AMap.Icon({
|
|
size: new AMap.Size(25, 34),
|
|
image: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png',
|
|
imageSize: new AMap.Size(0, 0),
|
|
imageOffset: new AMap.Pixel(0, 0)
|
|
})
|
|
|
|
let endIcon = new AMap.Icon({
|
|
size: new AMap.Size(25, 34),
|
|
image: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-marker.png',
|
|
imageSize: new AMap.Size(135, 40),
|
|
imageOffset: new AMap.Pixel(-95, -3)
|
|
});
|
|
|
|
|
|
for (let i = 0; i < points.length; i++) {
|
|
let point = points[i]
|
|
let iii
|
|
|
|
if (i === 0) {
|
|
iii = startIcon
|
|
} else if (i < points.length - 1) {
|
|
iii = viaIcon
|
|
} else {
|
|
iii = endIcon
|
|
}
|
|
|
|
let marker = new AMap.Marker({
|
|
position: [point[0], point[1]],
|
|
icon: iii,
|
|
offset: new AMap.Pixel(-13, -30)
|
|
})
|
|
|
|
marker.setMap(map)
|
|
marker.setLabel({
|
|
offset: new AMap.Pixel(-20, 40), //设置文本标注偏移量
|
|
content: "<div class='mapInfo'>" + this.viewData.pts[i].name + "</div>", //设置文本标注内容
|
|
direction: 'right' //设置文本标注方位
|
|
});
|
|
}
|
|
})
|
|
|
|
} else {
|
|
this.viewData = {}
|
|
this.$message({
|
|
message: "获取详细信息失败",
|
|
type: 'error'
|
|
});
|
|
this.viewDialogVisible = false
|
|
}
|
|
|
|
this.loading = false
|
|
},
|
|
|
|
openDw(index) {
|
|
this.dw = {
|
|
index: index
|
|
}
|
|
this.dwDialogVisible = true
|
|
this.$nextTick(() => {
|
|
map = new AMap.Map("dwMap", {
|
|
resizeEnable: true,
|
|
center: [AppMapCenterPointX, AppMapCenterPointY],
|
|
zoom: 16
|
|
});
|
|
this.placeSearchComponent = new AMap.PlaceSearch({
|
|
// city 指定搜索所在城市，支持传入格式有：城市名、citycode和adcode
|
|
city: ''
|
|
})
|
|
|
|
const {lng, lat} = this.formData.pts[index]
|
|
|
|
if (lng && lat) {
|
|
marker = new AMap.Marker({
|
|
icon: icon,
|
|
position: [lng, lat],
|
|
offset: new AMap.Pixel(-13, -30)
|
|
});
|
|
marker.setMap(map);
|
|
map.setZoomAndCenter(18, [lng, lat])
|
|
} else {
|
|
let lastdw
|
|
|
|
this.formData.pts.map(v => {
|
|
if (v.lng && v.lat) {
|
|
lastdw = v
|
|
}
|
|
})
|
|
|
|
if (lastdw) {
|
|
map.setZoomAndCenter(18, [lastdw.lng, lastdw.lat])
|
|
}
|
|
}
|
|
|
|
//为地图注册click事件获取鼠标点击出的经纬度坐标
|
|
map.on('click', (e) => {
|
|
if (marker) {
|
|
marker.setMap(null);
|
|
marker = null;
|
|
}
|
|
|
|
marker = new AMap.Marker({
|
|
icon: icon,
|
|
position: [e.lnglat.getLng(), e.lnglat.getLat()],
|
|
offset: new AMap.Pixel(-13, -30)
|
|
});
|
|
|
|
marker.setMap(map)
|
|
|
|
this.formData.pts[index]['location'] = {
|
|
type: 'Point',
|
|
coordinates: [e.lnglat.getLng(), e.lnglat.getLat()]
|
|
}
|
|
|
|
this.formData.pts[index].lng = e.lnglat.getLng()
|
|
this.formData.pts[index].lat = e.lnglat.getLat()
|
|
});
|
|
})
|
|
},
|
|
next() {
|
|
if (this.formData.activityModel !== 'punch') {
|
|
this.$refs["form"].validate(async (valid) => {
|
|
if (valid) {
|
|
this.formData._id ? this.doEdit() : this.doAdd()
|
|
// return
|
|
}
|
|
})
|
|
}
|
|
if (this.formData.activityModel === 'punch' && this.stepActive === 0) {
|
|
this.$refs["form"].validate(async (valid) => {
|
|
if (valid) {
|
|
// this.issueOptions = await Jsz.getIssueById(this.formData.questionId)
|
|
this.stepActive = 1
|
|
}
|
|
})
|
|
} else if (this.formData.activityModel === 'punch' && this.stepActive === 1) {
|
|
if (this.formData.pts.length < 2) {
|
|
this.$message({
|
|
message: '请至少添加2个点位！',
|
|
type: 'warning'
|
|
});
|
|
return
|
|
}
|
|
let b = this.formData.pts.some(v => {
|
|
return !v.code || !v.name || !v.lng || !v.lat
|
|
})
|
|
if (b) {
|
|
this.$message({
|
|
message: '请检查是否具有未填写的项或未选择点位坐标！',
|
|
type: 'warning'
|
|
});
|
|
return
|
|
}
|
|
|
|
let codeSet = new Set();
|
|
this.formData.pts.map(v => {
|
|
codeSet.add(v.code)
|
|
})
|
|
if (codeSet.size < this.formData.pts.length) {
|
|
this.$message({
|
|
message: '请检查点位编号是否重复！',
|
|
type: 'warning'
|
|
});
|
|
return
|
|
}
|
|
|
|
this.stepActive = 2
|
|
const that = this
|
|
this.$nextTick(() => {
|
|
this.xlMap()
|
|
if (this.polyEditor.open) {
|
|
this.polyEditor.open()
|
|
}
|
|
if (that.formData.isMultipleLines) {
|
|
if (that.polyEditor2.open) {
|
|
that.polyEditor2.open()
|
|
}
|
|
}
|
|
})
|
|
} else if (this.formData.activityModel === 'punch' && this.stepActive === 2) {
|
|
this.polyEditor.close()
|
|
if (this.formData.isMultipleLines) {
|
|
this.polyEditor2.close()
|
|
}
|
|
// this.v === 'add' ? this.doAdd() : this.doEdit()
|
|
this.formData._id ? this.doEdit() : this.doAdd()
|
|
}
|
|
},
|
|
xlMap() {
|
|
let map = new AMap.Map("xlMap", {
|
|
resizeEnable: true,
|
|
center: [AppMapCenterPointX, AppMapCenterPointY],
|
|
zoom: 16
|
|
});
|
|
|
|
let path = this.formData.linePoints ? this.formData.linePoints : []
|
|
let path2 = this.formData.linePoints2 ? this.formData.linePoints2 : []
|
|
|
|
if (!path.length) {
|
|
this.formData.pts.map(v => {
|
|
path.push([v.lng, v.lat])
|
|
})
|
|
}
|
|
if (!path2.length) {
|
|
this.formData.pts.map(v => {
|
|
path2.push([v.lng, v.lat])
|
|
})
|
|
}
|
|
|
|
let polyline = new AMap.Polyline({
|
|
path: path,
|
|
isOutline: true,
|
|
outlineColor: '#ffeeff',
|
|
borderWeight: 3,
|
|
strokeColor: "#3366FF",
|
|
strokeOpacity: 1,
|
|
strokeWeight: 6,
|
|
// 折线样式还支持 'dashed'
|
|
strokeStyle: "solid",
|
|
// strokeStyle是dashed时有效
|
|
strokeDasharray: [10, 5],
|
|
lineJoin: 'round',
|
|
lineCap: 'round',
|
|
zIndex: 50,
|
|
showDir: true,
|
|
})
|
|
|
|
polyline.setMap(map)
|
|
let polyline2;
|
|
if (this.formData.isMultipleLines) {
|
|
polyline2 = new AMap.Polyline({
|
|
path: path2,
|
|
isOutline: true,
|
|
outlineColor: '#ffeeff',
|
|
borderWeight: 3,
|
|
strokeColor: "#11ea40",
|
|
strokeOpacity: 1,
|
|
strokeWeight: 6,
|
|
// 折线样式还支持 'dashed'
|
|
strokeStyle: "solid",
|
|
// strokeStyle是dashed时有效
|
|
strokeDasharray: [10, 5],
|
|
lineJoin: 'round',
|
|
lineCap: 'round',
|
|
zIndex: 100,
|
|
showDir: true,
|
|
draggable: true
|
|
})
|
|
|
|
polyline2.setMap(map)
|
|
|
|
}
|
|
|
|
// 缩放地图到合适的视野级别
|
|
map.setFitView([polyline])
|
|
|
|
this.polyEditor = new AMap.PolyEditor(map, polyline)
|
|
this.polyEditor.open()
|
|
this.polyEditor.on('end', (event) => {
|
|
let points = event.target.getPath()
|
|
// this.formData.linePoints = points.map(v => {
|
|
// return [v.lng, v.lat]
|
|
// })
|
|
// this.formData.linePoints = points.map(p => {
|
|
// return {
|
|
// type: '',
|
|
// coordinates: []
|
|
// }
|
|
// })
|
|
|
|
// this.formData.linePoints = {
|
|
// type: 'LineString',
|
|
// coordinates: points.map(p => [p.lng, p.lat])
|
|
// }
|
|
|
|
this.formData.linePoints = points.map(p => {
|
|
return {
|
|
type: 'Point',
|
|
coordinates: [p.lng, p.lat]
|
|
}
|
|
})
|
|
})
|
|
|
|
if (this.formData.isMultipleLines) {
|
|
this.polyEditor2 = new AMap.PolyEditor(map, polyline2)
|
|
this.polyEditor2.open()
|
|
this.polyEditor2.on('end', (event) => {
|
|
let points = event.target.getPath()
|
|
this.formData.linePoints2 = points.map(p => {
|
|
return {
|
|
type: 'Point',
|
|
coordinates: [p.lng, p.lat]
|
|
}
|
|
})
|
|
})
|
|
}
|
|
|
|
let points = this.formData.pts.map(v => {
|
|
return [v.lng, v.lat]
|
|
})
|
|
|
|
for (let i = 0; i < points.length; i++) {
|
|
let point = points[i]
|
|
|
|
let marker = new AMap.Marker({
|
|
position: [point[0], point[1]],
|
|
offset: new AMap.Pixel(-13, -30)
|
|
})
|
|
|
|
marker.setMap(map)
|
|
marker.setLabel({
|
|
offset: new AMap.Pixel(-20, 40), //设置文本标注偏移量
|
|
content: "<div class='mapInfo'>" + this.formData.pts[i].name + "</div>", //设置文本标注内容
|
|
direction: 'right' //设置文本标注方位
|
|
});
|
|
}
|
|
|
|
},
|
|
doDelete(row) {
|
|
this.$confirm('是否删除该活动！', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning',
|
|
callback: (a, b) => {
|
|
if ("confirm" == a) {//确认后再执行
|
|
$.post(base + "/platform/fitnessWalk/activityManage/delete", {id: row._id}, (data) => {
|
|
if (data.code == 0) {
|
|
this.$message({
|
|
message: data.msg,
|
|
type: 'success'
|
|
});
|
|
this.pageData();
|
|
} else {
|
|
this.$message({
|
|
message: data.msg,
|
|
type: 'error'
|
|
});
|
|
}
|
|
}, "json");
|
|
}
|
|
}
|
|
});
|
|
},
|
|
dropdownCommand: function (command) {
|
|
const {type, data} = command
|
|
if (type == 'view') {
|
|
this.openView(data)
|
|
} else if (type == 'edit') {
|
|
this.openEdit(data)
|
|
} else if (type == 'delete') {
|
|
this.doDelete(data)
|
|
} else if (type == 'sendMsg') {
|
|
this.sendMsg(data)
|
|
} else if (type == 'backups') {
|
|
|
|
}
|
|
},
|
|
sendMsg(row) {
|
|
this.$refs.sendMsg.openDialog(row.groupId)
|
|
},
|
|
async doEdit() {
|
|
if (this.pictureList.length === 0) {
|
|
this.$message.info('请上传封面图')
|
|
return
|
|
}
|
|
const valid = await this.$refs['form'].validate()
|
|
if (!valid) return
|
|
|
|
if (this.formData.lotteryMode && !this.formData.customLotteryRules) {
|
|
this.$message.info('请填写自定义抽奖模式内容！')
|
|
}
|
|
|
|
if (!this.formData.isMultipleLines) {
|
|
this.formData.linePoints2 = []
|
|
}
|
|
|
|
let formData = new FormData()
|
|
formData.append("file", this.pictureList[0].raw)
|
|
formData.append("fitnessWalkActivity", JSON.stringify(this.formData))
|
|
for (let f of this.stepPictureList) {
|
|
formData.append("stepFiles", f.raw)
|
|
}
|
|
if (this.certificatePictureList && this.certificatePictureList.length >> 0) {
|
|
formData.append("certificateFile", this.certificatePictureList[0].raw)
|
|
}
|
|
|
|
const loading = this.$loading({
|
|
lock: true,
|
|
text: '数据提交中...',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
})
|
|
const {code, msg} = await $.ajax({
|
|
url: '/platform/fitnessWalk/activityManage/doEdit',
|
|
type: "post",
|
|
data: formData,
|
|
processData: false,
|
|
contentType: false,
|
|
})
|
|
if (code === 0) {
|
|
this.$message.success(msg)
|
|
this.$refs.guava.index()
|
|
this.pageData()
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
loading.close()
|
|
},
|
|
async openEdit(row) {
|
|
const loading = this.$loading({
|
|
lock: true,
|
|
text: '数据加载中...',
|
|
spinner: 'el-icon-loading',
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
});
|
|
|
|
this.stepActive = 0
|
|
if (this.$refs['form']) {
|
|
this.$refs['form'].resetFields()
|
|
}
|
|
const {code, msg, data} = await $.get(loc() + "/findOne", {id: row._id})
|
|
loading.close()
|
|
if (code === 0) {
|
|
if (data.dayLotteryRule == null) {
|
|
data.dayLotteryRule = {}
|
|
}
|
|
if (data.punchLotteryPrizes == null) {
|
|
data.punchLotteryPrizes = []
|
|
}
|
|
if (data.finishPointNum == null) {
|
|
data.finishPointNum = undefined
|
|
}
|
|
|
|
if (data.customLotteryRules && data.customLotteryRules.length > 0) {
|
|
data.customLotteryRules.forEach(v => {
|
|
if (v.lotteryQualificationDay == null) {
|
|
v.lotteryQualificationDay = undefined
|
|
}
|
|
})
|
|
}
|
|
|
|
|
|
this.pictureList = [{url: data.tempCover}]
|
|
this.stepPictureList = []
|
|
if (data.templateRandomPics) {
|
|
data.templateRandomPics.forEach(item => {
|
|
this.stepPictureList.push({url: item})
|
|
})
|
|
}
|
|
this.certificatePictureList = [{url: data.tempCompletionCertificateCover}]
|
|
|
|
if (data.pts && data.pts.length > 0) {
|
|
data.pts.map(v => {
|
|
v.lng = v.location.coordinates[0]
|
|
v.lat = v.location.coordinates[1]
|
|
})
|
|
}
|
|
if (data.linePoints && data.linePoints.length > 0) {
|
|
data.linePoints = data.linePoints.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
}
|
|
if (data.linePoints2 && data.linePoints2.length > 0) {
|
|
data.linePoints2 = data.linePoints2.map(v => {
|
|
return [v.coordinates[0], v.coordinates[1]]
|
|
})
|
|
}
|
|
|
|
this.$nextTick(() => {
|
|
$("#noteEditor").html("")
|
|
noteEditor = new E("#noteEditor")
|
|
noteEditor.config.onchange = (html) => {
|
|
this.formData.note = html
|
|
}
|
|
noteEditor.config.uploadImgShowBase64 = true // 使用 base64 保存图片
|
|
noteEditor.create()
|
|
noteEditor.txt.html(data.note)
|
|
})
|
|
if (data.tag !== "") {
|
|
this.hasChildrenAct = true
|
|
}
|
|
this.formData = data
|
|
this.$refs.guava.edit()
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
},
|
|
async doAdd() {
|
|
if (this.pictureList.length === 0) {
|
|
this.$message.info('请上传封面图')
|
|
return
|
|
}
|
|
|
|
const valid = await this.$refs['form'].validate()
|
|
if (!valid) return
|
|
|
|
if (this.formData.lotteryMode && !this.formData.customLotteryRules) {
|
|
this.$message.info('请填写自定义抽奖模式内容！')
|
|
}
|
|
|
|
if (!this.formData.isMultipleLines) {
|
|
this.formData.linePoints2 = []
|
|
}
|
|
|
|
let formData = new FormData()
|
|
formData.append("file", this.pictureList[0].raw)
|
|
formData.append("data", JSON.stringify(this.formData))
|
|
formData.append("fitnessWalkActivity", JSON.stringify(this.formData))
|
|
for (let f of this.stepPictureList) {
|
|
formData.append("stepFiles", f.raw)
|
|
}
|
|
console.log(formData)
|
|
// const loading = this.$loading({
|
|
// lock: true,
|
|
// text: '数据提交中...',
|
|
// spinner: 'el-icon-loading',
|
|
// background: 'rgba(0, 0, 0, 0.7)'
|
|
// });
|
|
|
|
const {code, msg} = await $.ajax({
|
|
url: '/platform/fitnessWalk/activityManage/doAdd',
|
|
type: "post",
|
|
data: formData,
|
|
processData: false,
|
|
contentType: false,
|
|
})
|
|
if (code === 0) {
|
|
this.$message.success(msg)
|
|
this.$refs.guava.index()
|
|
this.pageData()
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
|
|
// $.ajax({
|
|
// url: '/platform/fitnessWalk/activityManage/doAdd',
|
|
// type: "post",
|
|
// data: formData,
|
|
// processData: false,
|
|
// contentType: false,
|
|
// }).then((msg, code) => {
|
|
// if (code === 0) {
|
|
// this.$message.success(msg)
|
|
// this.pageData();
|
|
// this.$refs.guava.index()
|
|
// } else {
|
|
// this.$message.error(msg)
|
|
// }
|
|
// })
|
|
|
|
// loading.close()
|
|
},
|
|
async openAdd() {
|
|
this.$refs.guava.edit()
|
|
document.getElementsByClassName('el-upload--picture-card')[0].style.display = 'inline-block'
|
|
if (this.$refs['form']) {
|
|
this.$refs['form'].resetFields()
|
|
}
|
|
this.fileList = []
|
|
this.formData = {
|
|
pts: [],
|
|
customLotteryRules: [],
|
|
dayLotteryRule: {},
|
|
punchLotteryPrizes: []
|
|
}
|
|
this.pictureList = []
|
|
this.stepActive = 0
|
|
|
|
await this.getActivityData()
|
|
this.$nextTick(() => {
|
|
$("#noteEditor").html("")
|
|
noteEditor = new E("#noteEditor")
|
|
noteEditor.config.onchange = (html) => {
|
|
this.formData.note = html
|
|
}
|
|
noteEditor.config.uploadImgShowBase64 = true // 使用 base64 保存图片
|
|
noteEditor.create()
|
|
})
|
|
},
|
|
pictureRemove() {
|
|
// document.getElementsByClassName('el-upload--picture-card')[0].style.display = 'inline-block'
|
|
this.pictureList = []
|
|
},
|
|
pictureChange(file, fileList) {
|
|
let fileType = file.name.substring(file.name.lastIndexOf(".") + 1)
|
|
if (!this.picType.includes(fileType.toLowerCase())) {
|
|
this.$message.info('请上传图片格式的文件')
|
|
this.pictureList = []
|
|
} else {
|
|
this.pictureList = fileList
|
|
// document.getElementsByClassName('el-upload--picture-card')[0].style.display = 'none'
|
|
}
|
|
},
|
|
async pageData() {
|
|
this.tabLoading = true
|
|
const resp_data = await $.post(loc() + "/pageData", this.pageForm)
|
|
this.tabLoading = false
|
|
if (resp_data.code === 0) {
|
|
this.tableData = resp_data.data.list;
|
|
this.pageForm.totalCount = resp_data.data.totalCount;
|
|
} else {
|
|
this.$message.error(resp_data.msg)
|
|
}
|
|
},
|
|
getFile(pic) {
|
|
$.post('/platform/fitnessWalk/activityManage/getFile', {pic: pic}).then(res => {
|
|
if (res.code === 0) {
|
|
this.pictureList = []
|
|
this.pictureList = [res.data.img]
|
|
this.picSrc = res.data.img.url
|
|
}
|
|
})
|
|
},
|
|
|
|
|
|
getQuestion(){
|
|
$.get('/platform/fitnessWalk/common/getQuestion').then(res=>{
|
|
this.questionOptions = res.data
|
|
})
|
|
},
|
|
getIssueByQuestionId(id){
|
|
$.get('/platform/fitnessWalk/common/getIssueById',{id}).then(res=>{
|
|
this.issueOptions = res.data
|
|
})
|
|
},
|
|
|
|
},
|
|
watch: {
|
|
'formData.questionId': {
|
|
async handler(newVal, oldVal) {
|
|
if(newVal){
|
|
this.getIssueByQuestionId(newVal)
|
|
// this.formData.pts.map(v => v.issueIds = [])
|
|
}else{
|
|
this.formData.pts.map(v => v.issueIds = [])
|
|
}
|
|
},
|
|
deep: true,
|
|
immediate:true
|
|
},
|
|
'formData.groupId': {
|
|
async handler(newVal, oldVal) {
|
|
this.getActivityGroup()
|
|
this.userScopeDialog = false
|
|
},
|
|
deep: true
|
|
},
|
|
hasChildrenAct(newVal) {
|
|
if (!newVal) {
|
|
delete this.formData.tag
|
|
}
|
|
}
|
|
},
|
|
async created() {
|
|
this.getActivityGroup()
|
|
this.getQuestion()
|
|
// this.questionOptions = await Jsz.getQuestion()
|
|
this.pageForm.year = (new Date().getFullYear()).toString()
|
|
|
|
const hasAdminRole = ${@shiro.hasAnyRoles('sysadmin','A06')}
|
|
if (hasAdminRole) {
|
|
this.unionOptions = await getUnionList(null)
|
|
} else {
|
|
this.unionOptions = await getUnionList("${@shiro.getPrincipalProperty('unit').getUnionid()}")
|
|
}
|
|
|
|
await this.pageData();
|
|
|
|
}
|
|
})
|
|
</script>
|
|
<!--#
|
|
}
|
|
#-->
|