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.
290 lines
8.9 KiB
290 lines
8.9 KiB
<template>
|
|
<div class="main flex-1">
|
|
<a-spin :spinning="showEdit">
|
|
<div style="width:100%" v-if="lists && lists.length > 0">
|
|
<a-table
|
|
:columns="columns"
|
|
:data-source="lists"
|
|
:loading="loading"
|
|
:pagination="pagination"
|
|
:row-key="record => record.activityId"
|
|
:scroll="{ y: height }"
|
|
@change="handleTableChange"
|
|
@expand="getDetail"
|
|
bordered
|
|
class="white"
|
|
>
|
|
<template slot="id" slot-scope="text, record, index">
|
|
<span>{{ index + 1 }}</span>
|
|
</template>
|
|
|
|
<template slot="time" slot-scope="text, record">
|
|
<span v-if="record.releaseTime">{{ record.releaseTime}}</span>
|
|
<span v-if="record.closeTime">-{{record.closeTime}}</span>
|
|
</template>
|
|
|
|
<template slot="auditStatus" slot-scope="text, record">
|
|
<a-tag
|
|
:color="record.auditStatus === 2 ? 'green' : record.auditStatus === 1 ? 'red' : 'blue'"
|
|
>{{ record.auditStatus === 2 ? '已通过' : record.auditStatus === 1 ? '未通过' : '审核中' }}</a-tag>
|
|
</template>
|
|
|
|
<template slot="examine" slot-scope="text, record">
|
|
<div class="d-flex flex-column align-center">
|
|
<a-button
|
|
@click="handleApply(record, 2)"
|
|
size="small"
|
|
type="primary"
|
|
v-if="record.auditStatus !== 2"
|
|
>通过</a-button>
|
|
<a-button @click="handleApply(record, 1)" size="small" type="danger" v-else>不通过</a-button>
|
|
<a-textarea class="fill-width mt-3" placeholder="备注" v-model="record.remark" />
|
|
</div>
|
|
</template>
|
|
|
|
<template slot="edit" slot-scope="text, record">
|
|
<a-icon
|
|
@click="showEditModal(record)"
|
|
class="pointer mr-5"
|
|
theme="twoTone"
|
|
type="edit"
|
|
/>
|
|
<a-button @click="openEnroll(record.activityId)" size="small" type="primary">活动报名</a-button>
|
|
</template>
|
|
|
|
<div
|
|
class="d-flex flex-column"
|
|
slot="expandedRowRender"
|
|
slot-scope="record"
|
|
style="margin: 0"
|
|
>
|
|
<a-spin :spinning="spinning" tip="详情加载中...">
|
|
<div class="d-flex flex-nowrap justify-space-between mb-3">
|
|
<div class="d-flex flex-row">
|
|
<span class="font-bold-14">主讲人：</span>
|
|
<span v-if="record.info && record.info.name">{{ record.info.name }}</span>
|
|
<span v-else>暂无</span>
|
|
</div>
|
|
<div class="d-flex flex-row">
|
|
<span class="font-bold-14">
|
|
活动类型：
|
|
<a-tag
|
|
color="blue"
|
|
v-if="record.info && record.info.activityType !== null"
|
|
>{{ record.info.activityType === 0 ? '路演' : record.info.activityType === 1 ? '讲座' : record.info.activityType === 2 ? '沙龙' : '' }}</a-tag>
|
|
</span>
|
|
</div>
|
|
<div class="d-flex flex-row">
|
|
<span class="font-bold-14">培训对象：</span>
|
|
<span v-if="record.info && record.info.trainees">{{ record.info.trainees }}</span>
|
|
<span v-else>暂无</span>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex flex-nowrap justify-space-between mb-3">
|
|
<div class="d-flex flex-row">
|
|
<span class="font-bold-14">组织单位：</span>
|
|
<span
|
|
v-if="record.info && record.info.organization"
|
|
>{{ record.info.organization }}</span>
|
|
<span v-else>暂无</span>
|
|
</div>
|
|
<div class="d-flex flex-row">
|
|
<span class="font-bold-14">
|
|
发布平台：
|
|
<a-tag
|
|
color="green"
|
|
v-if="record.info && record.info.publishPlatform !== null"
|
|
>{{ record.info.publishPlatform === 0 ? '绿谷' : record.info.publishPlatform === 1 ? '创时代' : '' }}</a-tag>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="font-bold-14">活动结束内容：</span>
|
|
<br />
|
|
<span v-if="record.info && record.info.endContent">{{ record.info.endContent }}</span>
|
|
<span v-else>暂无内容</span>
|
|
</div>
|
|
<div class="mb-3">
|
|
<span class="font-bold-14">公告简介：</span>
|
|
<br />
|
|
<span v-if="record.intro">{{ record.intro }}</span>
|
|
<span v-else>暂无内容</span>
|
|
</div>
|
|
<div>
|
|
<span class="font-bold-14">详情：</span>
|
|
<span v-dompurify-html="record.info.content" v-if="record.info.content"></span>
|
|
<span v-else>暂无内容</span>
|
|
</div>
|
|
</a-spin>
|
|
</div>
|
|
</a-table>
|
|
</div>
|
|
<a-empty v-else />
|
|
|
|
<!-- 编辑 -->
|
|
<activity-edit
|
|
:editItem="editItem"
|
|
:editVisible="editVisible"
|
|
@closeModal="closeModal"
|
|
@getDetail="getDetail"
|
|
/>
|
|
</a-spin>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import ActivityEdit from 'components/Activity/ActivityEdit.vue';
|
|
import { getQueryDetail, auditApply } from 'config/api';
|
|
|
|
const columns = [
|
|
{
|
|
title: '序号',
|
|
align: 'center',
|
|
dataIndex: 'id',
|
|
key: 'id',
|
|
width: 80,
|
|
scopedSlots: { customRender: 'id' },
|
|
},
|
|
{
|
|
title: '标题',
|
|
align: 'center',
|
|
dataIndex: 'title',
|
|
key: 'title',
|
|
},
|
|
{
|
|
title: '地点',
|
|
align: 'center',
|
|
dataIndex: 'address',
|
|
key: 'address',
|
|
},
|
|
{
|
|
title: '活动时间',
|
|
align: 'center',
|
|
dataIndex: 'time',
|
|
key: 'time',
|
|
scopedSlots: { customRender: 'time' },
|
|
},
|
|
{
|
|
title: '审批状态',
|
|
align: 'center',
|
|
dataIndex: 'auditStatus',
|
|
key: 'auditStatus',
|
|
width: 100,
|
|
scopedSlots: { customRender: 'auditStatus' },
|
|
},
|
|
{
|
|
title: '审核',
|
|
align: 'center',
|
|
dataIndex: 'examine',
|
|
key: 'examine',
|
|
scopedSlots: { customRender: 'examine' },
|
|
},
|
|
{
|
|
title: '编辑',
|
|
align: 'center',
|
|
dataIndex: 'edit',
|
|
key: 'edit',
|
|
scopedSlots: { customRender: 'edit' },
|
|
},
|
|
];
|
|
|
|
export default {
|
|
name: 'ActivityDate',
|
|
components: {
|
|
ActivityEdit,
|
|
},
|
|
|
|
props: { lists: { type: Array, default: () => [] }, pagination: { type: Object, default: () => {} } },
|
|
|
|
data() {
|
|
return {
|
|
columns,
|
|
loading: false,
|
|
height: '',
|
|
editVisible: false,
|
|
editItem: null, // 修改的那条
|
|
spinning: false,
|
|
showEdit: false,
|
|
};
|
|
},
|
|
|
|
mounted() {
|
|
let th = 250;
|
|
let wh = window.innerHeight;
|
|
this.height = wh - th;
|
|
window.onresize = () => {
|
|
return (() => {
|
|
wh = window.innerHeight;
|
|
this.height = wh - th;
|
|
})();
|
|
};
|
|
},
|
|
|
|
methods: {
|
|
async showEditModal(record) {
|
|
this.showEdit = true;
|
|
await this.getDetail(true, record);
|
|
this.showEdit = false;
|
|
this.editItem = record;
|
|
this.editVisible = true;
|
|
},
|
|
|
|
async closeModal() {
|
|
this.editVisible = false;
|
|
await this.$emit('getSelectTeam');
|
|
},
|
|
|
|
// 换页
|
|
handleTableChange(pagination) {
|
|
const { current, pageSize } = pagination;
|
|
const condition = { current, pageSize };
|
|
this.$emit('getSelectTeam', condition);
|
|
},
|
|
|
|
// 详情查询
|
|
async getDetail(expanded, record) {
|
|
if (!expanded) return;
|
|
try {
|
|
this.spinning = true;
|
|
const params = { param: { activityId: record.activityId } };
|
|
const res = await getQueryDetail(params);
|
|
const { data, msg, code } = res.data;
|
|
this.spinning = false;
|
|
if (code === 200) {
|
|
const item = this.lists.find(item => item.activityId === record.activityId);
|
|
item.info = data;
|
|
} else {
|
|
throw msg;
|
|
}
|
|
} catch (error) {
|
|
this.$message.error(error || '查询失败');
|
|
}
|
|
},
|
|
|
|
// 审核
|
|
async handleApply(record, auditStatus) {
|
|
try {
|
|
const params = { param: { applyId: record.activityId, auditStatus, remark: record.remark } };
|
|
const res = await auditApply(params);
|
|
const { data, msg, code } = res.data;
|
|
if (code === 200) {
|
|
this.$message.success('审核成功');
|
|
this.$emit('getSelectTeam');
|
|
} else {
|
|
throw msg;
|
|
}
|
|
} catch (error) {
|
|
this.$message.error(error || '审核失败');
|
|
}
|
|
},
|
|
|
|
// 活动报名
|
|
openEnroll(id) {
|
|
const { query } = this.$route;
|
|
this.$router.push({ path: `/event-registration?activityId=${id}`, query });
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="stylus"></style>
|
|
|