parent
1c3e0d5aaf
commit
81046c919f
@ -0,0 +1,45 @@
|
|||||||
|
import httpService from "@/request"
|
||||||
|
|
||||||
|
// 资讯
|
||||||
|
export function newsList(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/information/list`,
|
||||||
|
method: 'get',
|
||||||
|
params: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsInfo(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/information/findById`,
|
||||||
|
method: 'get',
|
||||||
|
params: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function itemSelect(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/informationCategory/allList`,
|
||||||
|
method: 'get',
|
||||||
|
params: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsUpdate(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/information/update`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsDel(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/information/delete`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsInsert(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/information/insert`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
@ -0,0 +1,31 @@
|
|||||||
|
import httpService from "@/request"
|
||||||
|
|
||||||
|
// 资讯分类
|
||||||
|
export function newsItemList(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/informationCategory/list`,
|
||||||
|
method: 'get',
|
||||||
|
params: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsItemUpdate(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/informationCategory/update`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsItemDel(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/informationCategory/delete`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function newsItemInsert(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/informationCategory/insert`,
|
||||||
|
method: 'post',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
@ -0,0 +1,50 @@
|
|||||||
|
export const formItem = [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label:'分类名称',
|
||||||
|
prop:'name',
|
||||||
|
placeholder:'请输入'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const columns = [
|
||||||
|
{
|
||||||
|
title: "分类名称",
|
||||||
|
dataIndex: "name",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "资讯数",
|
||||||
|
dataIndex: "informationNum",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "是否显示在app上",
|
||||||
|
dataIndex: "isShow",
|
||||||
|
customRender: function (isShow) {
|
||||||
|
switch (isShow) {
|
||||||
|
case true:
|
||||||
|
return '是'
|
||||||
|
break;
|
||||||
|
case false:
|
||||||
|
return '否'
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
dataIndex: "action",
|
||||||
|
key: "action",
|
||||||
|
width: "180",
|
||||||
|
fixed: "right",
|
||||||
|
scopedSlots: { customRender: "action" },
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const pagination = {
|
||||||
|
current: 1,
|
||||||
|
total: 0,
|
||||||
|
pageSize: 10,
|
||||||
|
showTotal: (total) => `共 ${total} 条`,
|
||||||
|
showSizeChanger: true,
|
||||||
|
showQuickJumper: true,
|
||||||
|
}
|
@ -0,0 +1,8 @@
|
|||||||
|
export const form = {
|
||||||
|
id:undefined,
|
||||||
|
name: undefined,
|
||||||
|
isShow:false,
|
||||||
|
}
|
||||||
|
export const rules = {
|
||||||
|
name:[{required:true,message:'请输入标题',trigger:'blur'}],
|
||||||
|
}
|
@ -0,0 +1,113 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<a-drawer
|
||||||
|
:title="title"
|
||||||
|
:width="720"
|
||||||
|
:visible="show"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
@close="addClose"
|
||||||
|
>
|
||||||
|
<div class="drawer-content">
|
||||||
|
基本信息
|
||||||
|
<a-divider></a-divider>
|
||||||
|
<a-form-model
|
||||||
|
ref="ruleForm"
|
||||||
|
:model="form"
|
||||||
|
:rules="rules"
|
||||||
|
layout="vertical"
|
||||||
|
>
|
||||||
|
<a-form-model-item prop="name" label="分类名称">
|
||||||
|
<a-input
|
||||||
|
v-model="form.name"
|
||||||
|
placeholder="请输入名称"
|
||||||
|
style="width: 50%"
|
||||||
|
></a-input>
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item prop="isShow" label="是否在app上显示">
|
||||||
|
<a-switch checked-children="开" un-checked-children="关" v-model="form.isShow"></a-switch>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-form-model>
|
||||||
|
</div>
|
||||||
|
<div class="drawer-footer">
|
||||||
|
<a-button :style="{ marginRight: '8px' }" @click="addClose">
|
||||||
|
关闭
|
||||||
|
</a-button>
|
||||||
|
<a-button type="primary" @click="submit"> 提交 </a-button>
|
||||||
|
</div>
|
||||||
|
</a-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { form, rules } from "./form.js";
|
||||||
|
import {
|
||||||
|
newsItemInsert,
|
||||||
|
newsItemUpdate,
|
||||||
|
} from "@/api/operation/news/item";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
editData: Object,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
title: "新增分类",
|
||||||
|
form,
|
||||||
|
rules,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addClose() {
|
||||||
|
this.$refs.ruleForm.resetFields();
|
||||||
|
this.$emit("addClose");
|
||||||
|
},
|
||||||
|
success() {
|
||||||
|
this.$emit("success");
|
||||||
|
this.addClose();
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs.ruleForm.validate(async (valid) => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.editData.id === null) {
|
||||||
|
let res = await newsItemInsert(this.form);
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(res.msg);
|
||||||
|
this.success();
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log(this.form);
|
||||||
|
let res = await newsItemUpdate(this.form);
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(res.msg);
|
||||||
|
this.success();
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
editData: {
|
||||||
|
handler(obj){
|
||||||
|
if(obj.id === null){
|
||||||
|
this.title = '新增分类'
|
||||||
|
}else{
|
||||||
|
this.form = obj
|
||||||
|
this.title = '修改分类'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
deep:true,
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style></style>
|
@ -0,0 +1,166 @@
|
|||||||
|
export const formItem = [
|
||||||
|
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label:'状态',
|
||||||
|
prop:'status',
|
||||||
|
option:[{ id:1,name:'报名未开始'},{ id:2,name:'报名进行中'},{ id:3,name:'活动未开始'},{ id:4,name:'活动进行中'},{ id:5,name:'活动已结束'}],
|
||||||
|
placeholder:'请选择状态'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'time',
|
||||||
|
label:'报名时间',
|
||||||
|
start: 'registrationStartTime',
|
||||||
|
end:'registrationEndTime',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'time',
|
||||||
|
label:'活动时间',
|
||||||
|
start: 'activityStartTime',
|
||||||
|
end:'activityEndTime',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label:'活动标题',
|
||||||
|
prop:'title',
|
||||||
|
placeholder:'请输入'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label:'主办方',
|
||||||
|
prop:'organizerName',
|
||||||
|
placeholder:'请输入'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label:'活动联系人',
|
||||||
|
prop:'activityContact',
|
||||||
|
placeholder:'请输入'
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
export const columns = [
|
||||||
|
{
|
||||||
|
title: "发布时间",
|
||||||
|
dataIndex: "createDate",
|
||||||
|
width: "12%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "图片",
|
||||||
|
dataIndex: "imgpic",
|
||||||
|
width: "10%",
|
||||||
|
scopedSlots: { customRender: "imgpic"}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "活动状态",
|
||||||
|
dataIndex: "status",
|
||||||
|
width: "6%",
|
||||||
|
customRender: function (status) {
|
||||||
|
switch (status) {
|
||||||
|
case 1:
|
||||||
|
return '报名未开始'
|
||||||
|
case 2:
|
||||||
|
return '报名进行中'
|
||||||
|
case 3:
|
||||||
|
return '活动未开始'
|
||||||
|
case 4:
|
||||||
|
return '活动进行中'
|
||||||
|
case 5:
|
||||||
|
return '活动已结束'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "活动标题",
|
||||||
|
dataIndex: "title",
|
||||||
|
width: "8%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "活动地点",
|
||||||
|
dataIndex: "activityAddress",
|
||||||
|
width: "8%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "是否显示在app",
|
||||||
|
dataIndex: "isShow",
|
||||||
|
width: "5%",
|
||||||
|
customRender: function (isShow) {
|
||||||
|
switch (isShow) {
|
||||||
|
case true:
|
||||||
|
return '显示'
|
||||||
|
case false:
|
||||||
|
return '不显示'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "主办方",
|
||||||
|
dataIndex: "organizerName",
|
||||||
|
width: "8%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "活动内容",
|
||||||
|
dataIndex: "content",
|
||||||
|
width: "8%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "报名人数",
|
||||||
|
dataIndex: "registrationNum",
|
||||||
|
width: "5%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "报名时间",
|
||||||
|
width: "12%",
|
||||||
|
customRender: function (data) {
|
||||||
|
return (data.registrationStartTime + '——' + data.registrationEndTime)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "活动时间",
|
||||||
|
width: "12%",
|
||||||
|
customRender: function (data) {
|
||||||
|
return (data.activityStartTime + '——' + data.activityEndTime)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
dataIndex: "action",
|
||||||
|
key: "action",
|
||||||
|
width: "180",
|
||||||
|
fixed: "right",
|
||||||
|
scopedSlots: { customRender: "action" },
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const detailColumns = [
|
||||||
|
{
|
||||||
|
title: "报名人",
|
||||||
|
dataIndex: "name",
|
||||||
|
width: "22%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "报名联系方式",
|
||||||
|
dataIndex: "tel",
|
||||||
|
width: "32%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "报名时间",
|
||||||
|
dataIndex: "createDate",
|
||||||
|
width: "32%",
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const pagination = {
|
||||||
|
current: 1,
|
||||||
|
total: 0,
|
||||||
|
pageSize: 10,
|
||||||
|
showTotal: (total) => `共 ${total} 条`,
|
||||||
|
showSizeChanger: true,
|
||||||
|
showQuickJumper: true,
|
||||||
|
}
|
||||||
|
export const detailpagination = {
|
||||||
|
current: 1,
|
||||||
|
total: 0,
|
||||||
|
pageSize: 10,
|
||||||
|
showTotal: (total) => `共 ${total} 条`,
|
||||||
|
showSizeChanger: true,
|
||||||
|
showQuickJumper: true,
|
||||||
|
}
|
@ -0,0 +1,173 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<a-drawer
|
||||||
|
title="活动-详情"
|
||||||
|
:width="720"
|
||||||
|
:visible="show"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
@close="detailClose"
|
||||||
|
>
|
||||||
|
<div class="drawer-content">
|
||||||
|
<div class="content-title">
|
||||||
|
{{ detailData.title }}
|
||||||
|
</div>
|
||||||
|
<img v-for="item,index in detailData.imgList" :key='index' :src="$ImgUrl(item.url)" class="content-img">
|
||||||
|
<a-descriptions>
|
||||||
|
<a-descriptions-item label="创建时间">
|
||||||
|
{{ detailData.createDate }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="是否显示在app上">
|
||||||
|
{{ detailData.isShow ? "是" : "否" }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动对象">
|
||||||
|
{{ detailData.activityObject | activityObject }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动内容">
|
||||||
|
{{ detailData.content }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动主办方">
|
||||||
|
{{ detailData.organizerName }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
</a-descriptions>
|
||||||
|
<a-descriptions title="报名设置">
|
||||||
|
<a-descriptions-item label="报名开始时间">
|
||||||
|
{{ detailData.registrationStartTime }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="报名结束时间">
|
||||||
|
{{ detailData.registrationEndTime }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="报名人数上限">
|
||||||
|
{{ detailData.registrationNumMax }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动地点">
|
||||||
|
{{ detailData.activityAddress }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
</a-descriptions>
|
||||||
|
<a-descriptions title="活动设置">
|
||||||
|
<a-descriptions-item label="活动开始时间">
|
||||||
|
{{ detailData.activityStartTime }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动结束时间">
|
||||||
|
{{ detailData.activityEndTime }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动联系人">
|
||||||
|
{{ detailData.activityContact }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
<a-descriptions-item label="活动联系方式">
|
||||||
|
{{ detailData.activityTel }}
|
||||||
|
</a-descriptions-item>
|
||||||
|
</a-descriptions>
|
||||||
|
报名记录
|
||||||
|
<a-divider></a-divider>
|
||||||
|
<a-table
|
||||||
|
:columns="detailColumns"
|
||||||
|
:data-source="tableData"
|
||||||
|
:pagination="pagination"
|
||||||
|
:scroll="{ x: 600 }"
|
||||||
|
@change="handleTableChange"
|
||||||
|
:row-key="
|
||||||
|
(record, index) => {
|
||||||
|
return record.id;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
></a-table>
|
||||||
|
</div>
|
||||||
|
<div class="drawer-footer">
|
||||||
|
<a-button :style="{ marginRight: '8px' }" @click="detailClose">
|
||||||
|
关闭
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
</a-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { activityInfo, registrationList } from "@/api/operation/activity";
|
||||||
|
import { detailColumns, detailpagination } from "./config";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
detailId: Number,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tableData: [],
|
||||||
|
detailData: {},
|
||||||
|
detailColumns,
|
||||||
|
pagination: detailpagination,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
filters: {
|
||||||
|
activityObject(value) {
|
||||||
|
switch (value) {
|
||||||
|
case 1:
|
||||||
|
return "全部";
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
return "住户";
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
return "业主";
|
||||||
|
break;
|
||||||
|
case 4:
|
||||||
|
return "租户";
|
||||||
|
break;
|
||||||
|
case 5:
|
||||||
|
return "管家";
|
||||||
|
break;
|
||||||
|
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
detailClose() {
|
||||||
|
this.$emit("detailClose");
|
||||||
|
},
|
||||||
|
handleTableChange(pagination) {
|
||||||
|
console.log(pagination);
|
||||||
|
const pager = { ...this.pagination };
|
||||||
|
pager.current = pagination.current;
|
||||||
|
pager.pageSize = pagination.pageSize;
|
||||||
|
this.pagination = pager;
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
detailId: {
|
||||||
|
handler(id) {
|
||||||
|
if (id !== null && id !== undefined) {
|
||||||
|
console.log(id);
|
||||||
|
Promise.all([
|
||||||
|
activityInfo({ activityId: id }),
|
||||||
|
registrationList({ activityId: id }),
|
||||||
|
]).then((res) => {
|
||||||
|
this.detailData = res[0].data;
|
||||||
|
this.tableData = res[1].data.rows;
|
||||||
|
this.pagination.total = res[1].data.total;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.content-title {
|
||||||
|
color: #000000d9;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 25px;
|
||||||
|
}
|
||||||
|
.content-img{
|
||||||
|
width: 108px;
|
||||||
|
height: 86px;
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,48 @@
|
|||||||
|
export const form = {
|
||||||
|
id:undefined,
|
||||||
|
title:undefined,
|
||||||
|
organizerId:undefined,
|
||||||
|
isShow:false,
|
||||||
|
activityObject:undefined,
|
||||||
|
content:undefined,
|
||||||
|
registrationStartTime:undefined,
|
||||||
|
registrationEndTime:undefined,
|
||||||
|
activityStartTime:undefined,
|
||||||
|
activityEndTime:undefined,
|
||||||
|
activityAddress:undefined,
|
||||||
|
registrationNumMax:undefined,
|
||||||
|
registrationCost:undefined,
|
||||||
|
activityContact:undefined,
|
||||||
|
activityTel:undefined,
|
||||||
|
imgUrls:[]
|
||||||
|
}
|
||||||
|
export const rules = {
|
||||||
|
title:[{required:true,message:'请输入标题',trigger:'blur'}],
|
||||||
|
organizerId:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
isShow:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
activityObject:[{required:true,message:'请选择活动对象',trigger:'change'}],
|
||||||
|
content:[{required:true,message:'请输入内容',trigger:'blur'}],
|
||||||
|
registrationStartTime:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
registrationEndTime:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
activityStartTime:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
activityEndTime:[{required:true,message:'请选择',trigger:'change'}],
|
||||||
|
activityAddress:[{required:true,message:'请输入活动地址',trigger:'blur'}],
|
||||||
|
registrationNumMax:[{required:true,message:'请输入人数上限',trigger:'blur'}],
|
||||||
|
registrationCost:[{required:true,message:'请输入报名费用',trigger:'blur'}],
|
||||||
|
activityContact:[{required:true,message:'请输入活动联系人',trigger:'blur'}],
|
||||||
|
activityTel:[{required:true,message:'请输入活动联系方式',trigger:'blur'}],
|
||||||
|
}
|
||||||
|
export const options = {
|
||||||
|
isShow:[
|
||||||
|
{ id:true, name:'显示' },
|
||||||
|
{ id:false, name:'不显示' },
|
||||||
|
],
|
||||||
|
activityObject: [
|
||||||
|
{ id:1, name:'全部' },
|
||||||
|
{ id:2, name:'住户' },
|
||||||
|
{ id:3, name:'业主' },
|
||||||
|
{ id:4, name:'租户' },
|
||||||
|
{ id:5, name:'管家' },
|
||||||
|
],
|
||||||
|
organizer:[]
|
||||||
|
}
|
@ -0,0 +1,296 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<a-drawer
|
||||||
|
:title="title"
|
||||||
|
:width="720"
|
||||||
|
:visible="show"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
@close="addClose"
|
||||||
|
>
|
||||||
|
<div class="drawer-content">
|
||||||
|
基本信息
|
||||||
|
<a-divider></a-divider>
|
||||||
|
<a-form-model
|
||||||
|
ref="ruleForm"
|
||||||
|
:model="form"
|
||||||
|
:rules="rules"
|
||||||
|
layout="vertical"
|
||||||
|
>
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="title" label="标题">
|
||||||
|
<a-input
|
||||||
|
v-model="form.title"
|
||||||
|
placeholder="请输入标题"
|
||||||
|
style="width: 80%"
|
||||||
|
></a-input>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="organizerId" label="主办方">
|
||||||
|
<a-select
|
||||||
|
v-model="form.organizerId"
|
||||||
|
placeholder="请选择"
|
||||||
|
style="width: 80%"
|
||||||
|
>
|
||||||
|
<a-select-option
|
||||||
|
v-for="item in options.organizer"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
>{{ item.unit }}</a-select-option
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="isShow" label="是否显示">
|
||||||
|
<a-switch
|
||||||
|
checked-children="开"
|
||||||
|
un-checked-children="关"
|
||||||
|
v-model="form.isShow"
|
||||||
|
style="margin-left: 20px"
|
||||||
|
>
|
||||||
|
</a-switch>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityObject" label="活动对象">
|
||||||
|
<a-select
|
||||||
|
v-model="form.activityObject"
|
||||||
|
placeholder="请选择"
|
||||||
|
style="width: 80%"
|
||||||
|
>
|
||||||
|
<a-select-option
|
||||||
|
v-for="item in options.activityObject"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
>{{ item.name }}</a-select-option
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
<a-form-model-item prop="content" label="内容">
|
||||||
|
<a-textarea
|
||||||
|
v-model="form.content"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
style="width: 80%"
|
||||||
|
></a-textarea>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item
|
||||||
|
prop="registrationStartTime"
|
||||||
|
label="报名开始时间"
|
||||||
|
>
|
||||||
|
<a-date-picker
|
||||||
|
v-model="form.registrationStartTime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item
|
||||||
|
prop="registrationEndTime"
|
||||||
|
label="报名结束时间"
|
||||||
|
>
|
||||||
|
<a-date-picker
|
||||||
|
v-model="form.registrationEndTime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityStartTime" label="活动开始时间">
|
||||||
|
<a-date-picker
|
||||||
|
v-model="form.activityStartTime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityEndTime" label="活动结束时间">
|
||||||
|
<a-date-picker
|
||||||
|
v-model="form.activityEndTime"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
/>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="registrationNumMax" label="报名人数上限">
|
||||||
|
<a-input-number
|
||||||
|
v-model="form.registrationNumMax"
|
||||||
|
placeholder="请输入人数"
|
||||||
|
:min="0"
|
||||||
|
style="width: 30%"
|
||||||
|
></a-input-number>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityAddress" label="活动地址">
|
||||||
|
<a-input
|
||||||
|
v-model="form.activityAddress"
|
||||||
|
placeholder="请输入活动地址"
|
||||||
|
style="width: 80%"
|
||||||
|
></a-input>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="registrationCost" label="报名费用">
|
||||||
|
<a-input-number
|
||||||
|
v-model="form.registrationCost"
|
||||||
|
placeholder="请输入费用"
|
||||||
|
:min="0"
|
||||||
|
style="width: 30%"
|
||||||
|
></a-input-number>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityContact" label="活动联系人">
|
||||||
|
<a-input
|
||||||
|
v-model="form.activityContact"
|
||||||
|
placeholder="请输入活动联系人"
|
||||||
|
style="width: 80%"
|
||||||
|
></a-input>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-model-item prop="activityTel" label="活动联系方式">
|
||||||
|
<a-input
|
||||||
|
v-model="form.activityTel"
|
||||||
|
placeholder="请输入活动联系人"
|
||||||
|
style="width: 80%"
|
||||||
|
></a-input>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="24">
|
||||||
|
活动图片
|
||||||
|
<commonUpload
|
||||||
|
:fileList="fileList"
|
||||||
|
@handleChange="handleChange"
|
||||||
|
></commonUpload>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form-model>
|
||||||
|
</div>
|
||||||
|
<div class="drawer-footer">
|
||||||
|
<a-button :style="{ marginRight: '8px' }" @click="addClose">
|
||||||
|
关闭
|
||||||
|
</a-button>
|
||||||
|
<a-button type="primary" @click="submit"> 提交 </a-button>
|
||||||
|
</div>
|
||||||
|
</a-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { form, rules, options } from "./form.js";
|
||||||
|
import {
|
||||||
|
activityInsert,
|
||||||
|
activityUpdate,
|
||||||
|
activityInfo,
|
||||||
|
organizerSelect,
|
||||||
|
} from "@/api/operation/activity";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
editId: Number,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
title: "新增活动",
|
||||||
|
form,
|
||||||
|
rules,
|
||||||
|
options,
|
||||||
|
fileList: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getOrganizer();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getOrganizer() {
|
||||||
|
let res = await organizerSelect();
|
||||||
|
this.options.organizer = res.data;
|
||||||
|
},
|
||||||
|
addClose() {
|
||||||
|
this.$refs.ruleForm.resetFields();
|
||||||
|
this.fileList = [];
|
||||||
|
this.$emit("addClose");
|
||||||
|
},
|
||||||
|
success() {
|
||||||
|
this.$emit("success");
|
||||||
|
this.addClose();
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs.ruleForm.validate(async (valid) => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.editId === null) {
|
||||||
|
let res = await activityInsert(this.form);
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(res.msg);
|
||||||
|
this.success();
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log(this.form);
|
||||||
|
let res = await activityUpdate(this.form);
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(res.msg);
|
||||||
|
this.success();
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleChange(data) {
|
||||||
|
this.fileList = data;
|
||||||
|
if (data[0].status === "done") {
|
||||||
|
console.log("-------done-------");
|
||||||
|
this.form.imgUrls.push(data[0].response.data);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
editId: {
|
||||||
|
handler(val) {
|
||||||
|
if (val !== null) {
|
||||||
|
this.title = "修改活动";
|
||||||
|
this.form.id = val;
|
||||||
|
activityInfo({ activityId: val }).then((res) => {
|
||||||
|
this.form = res.data;
|
||||||
|
if (res.data.imgList.length > 0) {
|
||||||
|
console.log(res.data.imgList);
|
||||||
|
const pic = [];
|
||||||
|
for (let item of res.data.imgList) {
|
||||||
|
let obj = {
|
||||||
|
name: item.url.split("_")[0] + "." + item.url.split(".")[1],
|
||||||
|
url: this.$ImgUrl(item.url),
|
||||||
|
uid: item.url.split("_")[1],
|
||||||
|
status: "done",
|
||||||
|
thumbUrl: this.$ImgUrl(item.url),
|
||||||
|
};
|
||||||
|
pic.push(obj);
|
||||||
|
}
|
||||||
|
this.fileList = pic;
|
||||||
|
} else {
|
||||||
|
this.form.imgUrls = [];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.title = "新增活动";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style></style>
|
@ -1,15 +1,201 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
|
<div class="cardTitle">活动管理</div>
|
||||||
</div>
|
<searchForm :formItem="formItem" @getSearch="getData($event)" @changeTime='changeTime'></searchForm>
|
||||||
|
<a-button style="margin: 10px" class="add-btn" @click="drawer.show = true"
|
||||||
|
>新增活动</a-button
|
||||||
|
>
|
||||||
|
<a-table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="tableData"
|
||||||
|
:pagination="pagination"
|
||||||
|
:scroll="{ x: 2600 }"
|
||||||
|
@change="handleTableChange"
|
||||||
|
:row-selection="{
|
||||||
|
selectedRowKeys: selectedRowKeys,
|
||||||
|
onChange: selectionChoosed,
|
||||||
|
}"
|
||||||
|
:row-key="
|
||||||
|
(record, index) => {
|
||||||
|
return record.id;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<span slot="action" slot-scope="text, row">
|
||||||
|
<a-space>
|
||||||
|
<a class="ant-dropdown-link" @click="detail(row.id)">查看详情</a>
|
||||||
|
<a class="ant-dropdown-link" @click="edit(row.id)">修改</a>
|
||||||
|
<a class="ant-dropdown-link" @click="del([row.id])">删除</a>
|
||||||
|
</a-space>
|
||||||
|
</span>
|
||||||
|
<span slot="imgpic" slot-scope="text, row">
|
||||||
|
<img
|
||||||
|
v-if="row.imgList.length > 0"
|
||||||
|
:src="$ImgUrl(row.imgList[0].url)"
|
||||||
|
class="table-img"
|
||||||
|
alt=""
|
||||||
|
/>
|
||||||
|
<span v-else>无图片</span>
|
||||||
|
</span>
|
||||||
|
<span slot="switch" slot-scope="switchV, row">
|
||||||
|
<a-switch
|
||||||
|
checked-children="开" un-checked-children="关"
|
||||||
|
:checked="switchV === 1"
|
||||||
|
@change="handleEnable(row)"
|
||||||
|
></a-switch>
|
||||||
|
</span>
|
||||||
|
</a-table>
|
||||||
|
<div class="action">
|
||||||
|
<a-dropdown :disabled="!hasSelected">
|
||||||
|
<a-menu slot="overlay" @click="handleMenuClick">
|
||||||
|
<a-menu-item key="del"> 批量删除 </a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
<a-button> 批量操作 <a-icon type="down" /> </a-button>
|
||||||
|
</a-dropdown>
|
||||||
|
<span style="margin-left: 8px">
|
||||||
|
<template v-if="hasSelected">
|
||||||
|
{{ `已选择 ${selectedRowKeys.length} 条` }}
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<addForm
|
||||||
|
:show="drawer.show"
|
||||||
|
@success="success"
|
||||||
|
@addClose="addClose"
|
||||||
|
:editId="editId"
|
||||||
|
></addForm>
|
||||||
|
<detailForm :detailId="detailId" :show="drawer.detail" @detailClose="detailClose"></detailForm>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { activityList, activityDel } from "@/api/operation/activity";
|
||||||
|
import { formItem, columns, pagination } from "./depend/config";
|
||||||
|
import addForm from "./depend/form.vue";
|
||||||
|
import detailForm from "./depend/detail.vue";
|
||||||
export default {
|
export default {
|
||||||
|
components: {
|
||||||
}
|
addForm,
|
||||||
|
detailForm
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
drawer: {
|
||||||
|
show: false,
|
||||||
|
detail:false
|
||||||
|
},
|
||||||
|
editId: null,
|
||||||
|
detailId:null,
|
||||||
|
tableData: [],
|
||||||
|
searchForm: {
|
||||||
|
activityAddress: undefined,
|
||||||
|
organizerName: undefined,
|
||||||
|
activityContact: undefined,
|
||||||
|
activityTel: undefined,
|
||||||
|
title: undefined,
|
||||||
|
status: undefined,
|
||||||
|
registrationStartTime: undefined,
|
||||||
|
registrationEndTime: undefined,
|
||||||
|
activityStartTime: undefined,
|
||||||
|
activityEndTime: undefined,
|
||||||
|
},
|
||||||
|
formItem,
|
||||||
|
columns,
|
||||||
|
pagination,
|
||||||
|
// 选择的index
|
||||||
|
selectedRowKeys: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getData(data) {
|
||||||
|
if (data !== undefined) {
|
||||||
|
console.log(data);
|
||||||
|
this.searchForm = data;
|
||||||
|
console.log(this.searchForm);
|
||||||
|
}
|
||||||
|
let res = await activityList({
|
||||||
|
pageNum: this.pagination.current,
|
||||||
|
size: this.pagination.pageSize,
|
||||||
|
...this.searchForm
|
||||||
|
});
|
||||||
|
this.tableData = res.data.rows;
|
||||||
|
this.pagination.total = res.data.total;
|
||||||
|
this.selectedRowKeys=[]
|
||||||
|
},
|
||||||
|
changeTime(data,start,end){
|
||||||
|
console.log(start);
|
||||||
|
this.searchForm[start] = data[0]
|
||||||
|
this.searchForm[end] = data[1]
|
||||||
|
console.log(this.searchForm);
|
||||||
|
},
|
||||||
|
edit(id) {
|
||||||
|
this.editId = id;
|
||||||
|
this.drawer.show = true;
|
||||||
|
},
|
||||||
|
del(ids) {
|
||||||
|
console.log(ids);
|
||||||
|
this.$confirm({
|
||||||
|
title: "是否删除",
|
||||||
|
// okText:'删除',
|
||||||
|
// cancelText:'取消',
|
||||||
|
icon: "delete",
|
||||||
|
onOk: async () => {
|
||||||
|
let res = await activityDel({ activityIds: ids });
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(res.msg);
|
||||||
|
this.getData();
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.msg);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
selectionChoosed(data) {
|
||||||
|
this.selectedRowKeys = data;
|
||||||
|
},
|
||||||
|
handleMenuClick(data) {
|
||||||
|
console.log(data);
|
||||||
|
if (data.key === "del") {
|
||||||
|
this.del(this.selectedRowKeys);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleTableChange(pagination) {
|
||||||
|
console.log(pagination);
|
||||||
|
const pager = { ...this.pagination };
|
||||||
|
pager.current = pagination.current;
|
||||||
|
pager.pageSize = pagination.pageSize;
|
||||||
|
this.pagination = pager;
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
addClose() {
|
||||||
|
this.drawer.show = false;
|
||||||
|
this.editId = null;
|
||||||
|
},
|
||||||
|
success() {
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
detail(id){
|
||||||
|
this.drawer.detail = true;
|
||||||
|
this.detailId = id;
|
||||||
|
},
|
||||||
|
detailClose(){
|
||||||
|
this.detailId = null;
|
||||||
|
this.drawer.detail = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
hasSelected() {
|
||||||
|
return this.selectedRowKeys.length > 0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
<style>
|
.table-img {
|
||||||
|
width: 40px;
|
||||||
</style>
|
height: 40px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
Loading…
Reference in new issue