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.
314 lines
14 KiB
314 lines
14 KiB
<template>
|
|
<div>
|
|
<div class="dialog-h-content scroll-h">
|
|
<div v-if="initLoading" class="m-detail-main">
|
|
<div class="m-info">
|
|
|
|
<div style="display: flex;">
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">活动类型: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.typeName || "--" }}</span>
|
|
</div>
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">活动名称: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.activityName || "--" }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="display: flex;">
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">活动时间: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.startTime || "--" }}至<span>{{ formData.endTime || "--" }}</span></span>
|
|
</div>
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">协办方: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.assistingParty || "--" }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="m-info-prop">
|
|
<span class="u-info-title-2" style="display: inline-block;white-space: nowrap;">活动内容: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<!-- <span>{{ formData.content || "--" }}</span> -->
|
|
<p class="text_p" v-html="formData.content"></p>
|
|
</div>
|
|
|
|
<div class="m-info-prop">
|
|
<span class="u-info-title-2">活动地点: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.address || "--" }}</span>
|
|
</div>
|
|
<div class="m-info-prop">
|
|
<span class="u-info-title-2"></span>
|
|
<div class="div_map">
|
|
<div id="app_detail_unit"></div>
|
|
</div>
|
|
</div>
|
|
<div class="m-info-prop">
|
|
<span class="u-info-title-2">线上报名: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<el-switch :value="formData.online === 1 ? true : false" :disabled="true"></el-switch>
|
|
</div>
|
|
|
|
<div style="display: flex;">
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">报名截止时间：</span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.cutOffTime || "--" }}</span>
|
|
</div>
|
|
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">活动积分：</span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.points || "--" }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="display: flex;" v-if="formData.online==0 && formData.status==2">
|
|
<div class="m-info-prop" style="flex: 0 0 50%;">
|
|
<span class="u-info-title-2">活动人数: </span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<span>{{ formData.participants || "--" }}</span>
|
|
</div>
|
|
</div>
|
|
<!-- 总结 -->
|
|
<div class="m-info-prop" v-if="formData.status!==0&&formData.status!==1&&formData.status!==3">
|
|
<span class="u-info-title-2" style="display: inline-block;white-space: nowrap;">活动总结：</span>
|
|
<span style="margin-right: 10px;"> </span>
|
|
<!-- <span>{{ formData.sumUp || "--" }}</span> -->
|
|
<p class="text_p" v-html="formData.sumUp"></p>
|
|
</div>
|
|
<!-- 活动图片 -->
|
|
<div v-if="formData.status!==0&&formData.status!==1&&formData.status!==3" class="m-info-prop" style="display: flex; flex-wrap: wrap; align-items: flex-start;">
|
|
<span class="u-info-title-2" style="display: inline-block;white-space: nowrap;">活动图片：</span>
|
|
<div v-for="(image, index) in formData.activityImgs" :key="index">
|
|
<img style="width: 200px; height: 160px; margin-right: 30px;margin-bottom: 10px;"
|
|
:src="image" alt="Image" />
|
|
</div>
|
|
</div>
|
|
<!-- 报名名单 -->
|
|
<div v-if="formData.status!==0 && formData.online == 1" style="margin-top: 20px;">
|
|
<div style="font-size: 15px; color: black; margin-left: -30px;margin-bottom: 10px;">
|
|
报名名单
|
|
</div>
|
|
<el-table class="table" border style="width: 100%" :data="NameList">
|
|
<el-table-column label="序号" header-align="center" align="center" type="index"
|
|
width="50"></el-table-column>
|
|
|
|
<el-table-column prop="name" header-align="center" align="center" label="姓名"
|
|
min-width="80">
|
|
</el-table-column>
|
|
<el-table-column prop="mobile" header-align="center" align="center" label="联系电话"
|
|
min-width="100">
|
|
</el-table-column>
|
|
<el-table-column prop="createdTime" header-align="center" align="center" label="报名时间"
|
|
min-width="80">
|
|
</el-table-column>
|
|
<el-table-column prop="remark" header-align="center" align="center"
|
|
label="备注说明" show-overflow-tooltip min-width="120">
|
|
|
|
</el-table-column>
|
|
<el-table-column prop="signFlag" header-align="center" align="center" label="签到" width="80">
|
|
</el-table-column>
|
|
<el-table-column prop="address" header-align="center" align="center" label="签到地点"
|
|
width="120">
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<div>
|
|
<el-pagination v-if="formData.status!==0 && formData.online == 1" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="pageNo"
|
|
:page-sizes="[5, 10, 20]" :page-size="pageSize" layout="sizes, prev, pager, next, total" :total="total">
|
|
</el-pagination>
|
|
</div>
|
|
|
|
<!-- 活动实况 -->
|
|
<div style="margin-top: 20px;" v-if="formData.status!==0&&formData.online==1">
|
|
<div style="font-size: 15px; color: black; margin-left: -30px; margin-bottom: 10px;">
|
|
活动实况
|
|
</div>
|
|
<el-table class="table" border style="width: 100%" :data="actList">
|
|
<el-table-column label="序号" header-align="center" align="center" type="index"
|
|
width="50"></el-table-column>
|
|
|
|
<el-table-column prop="nickname" header-align="center" align="center" label="姓名"
|
|
min-width="100">
|
|
</el-table-column>
|
|
<el-table-column prop="createdTime" header-align="center" align="center" label="联系电话"
|
|
min-width="80">
|
|
</el-table-column>
|
|
<el-table-column prop="desc" header-align="center" align="center" label="实况内容"
|
|
min-width="280">
|
|
</el-table-column>
|
|
<el-table-column prop="images" header-align="center" align="center"
|
|
label="活动照片" show-overflow-tooltip min-width="120">
|
|
<template slot-scope="scope">
|
|
<div v-for="(item, index) in scope.row.images" :key="index"
|
|
style="display: flex;">
|
|
<img :src="item.url"
|
|
style="max-width: 20px; max-height: 20px; margin-right: 10px;" />
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="m-detail-btn">
|
|
<el-button size="small" @click="handleCancle">关 闭</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { Loading } from "element-ui"; // 引入Loading服务
|
|
import nextTick from "dai-js/tools/nextTick";
|
|
import daiMap from "@/utils/dai-map";
|
|
import { requestPost,requestGet } from "@/js/dai/request";
|
|
|
|
var map;
|
|
var search;
|
|
var markers;
|
|
var infoWindowList;
|
|
var geocoder; // 新建一个正逆地址解析类
|
|
|
|
let loading; // 加载动画
|
|
export default {
|
|
data() {
|
|
return {
|
|
formData: {},
|
|
initLoading: false,
|
|
NameList:[],
|
|
actList:[],
|
|
activityId:"",
|
|
pageSize: 5,
|
|
pageNo: 1,
|
|
total:0
|
|
};
|
|
},
|
|
components: {},
|
|
created() {
|
|
|
|
},
|
|
|
|
mounted () {
|
|
|
|
},
|
|
|
|
methods: {
|
|
handleCurrentChange (val) {
|
|
this.pageNo = val
|
|
// this.loadTable()
|
|
this.communityActivityApplicationRecord()
|
|
},
|
|
|
|
handleSizeChange (val) {
|
|
this.pageSize = val
|
|
this.pageNo = 1
|
|
// this.loadTable()
|
|
this.communityActivityApplicationRecord()
|
|
},
|
|
async communityActivityApplicationRecord () {
|
|
const url = "/actual/base/communityActivityApplicationRecord/page"
|
|
let params = {
|
|
pageSize: this.pageSize,
|
|
pageNo: this.pageNo,
|
|
activityId:this.activityId
|
|
}
|
|
console.log("df ");
|
|
const { data, code, msg } = await requestGet(url, params)
|
|
if (code === 0) {
|
|
|
|
this.NameList=data.list
|
|
console.log( this.NameList);
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
},
|
|
async livereclist () {
|
|
const url = "/heart/resi/act/livereclist"
|
|
let params = {
|
|
pageSize: 20,
|
|
pageNo: 1,
|
|
actId:this.formData.id
|
|
}
|
|
const { data, code, msg } = await requestPost(url, params)
|
|
if (code === 0) {
|
|
this.actList=data.actLives
|
|
console.log(data);
|
|
} else {
|
|
this.$message.error(msg)
|
|
}
|
|
},
|
|
handleCancle() {
|
|
this.diaDestroy();
|
|
this.$emit("diaDetailClose");
|
|
},
|
|
|
|
diaDestroy() {
|
|
if (map) {
|
|
// map.destroy()
|
|
}
|
|
},
|
|
|
|
async initForm(row) {
|
|
this.startLoading();
|
|
this.formData = JSON.parse(JSON.stringify(row));
|
|
console.log(this.formData,"this.formData");
|
|
this.activityId=this.formData.id
|
|
console.log( this.activityId,"this.activ");
|
|
this.initLoading = true;
|
|
|
|
// console.log('this.formData,',this.formData);
|
|
|
|
let { latitude, longitude } = this.$store.state.user;
|
|
console.log("lat" + latitude + ",lon" + longitude);
|
|
if (this.formData.latitude && this.formData.longitude) {
|
|
latitude = this.formData.latitude;
|
|
longitude = this.formData.longitude;
|
|
}
|
|
if (!latitude || latitude == "" || latitude == "0") {
|
|
latitude = 39.9088810666821;
|
|
longitude = 116.39743841556731;
|
|
}
|
|
this.endLoading();
|
|
this.communityActivityApplicationRecord()
|
|
this.livereclist()
|
|
},
|
|
|
|
// 开启加载动画
|
|
startLoading() {
|
|
loading = Loading.service({
|
|
lock: true, // 是否锁定
|
|
text: "正在加载……", // 加载中需要显示的文字
|
|
background: "rgba(0,0,0,.7)", // 背景颜色
|
|
});
|
|
},
|
|
// 结束加载动画
|
|
endLoading() {
|
|
// clearTimeout(timer);
|
|
if (loading) {
|
|
loading.close();
|
|
}
|
|
},
|
|
},
|
|
computed: {},
|
|
props: {},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
@import "@/assets/scss/modules/management/detail-main.scss";
|
|
|
|
// span {
|
|
// display: inline-block;
|
|
// white-space: nowrap; /* 避免换行 */
|
|
// }
|
|
|
|
</style>
|
|
<style scoped></style>
|
|
|