From 2d045c58bef364ff9ea966e7987cf64fbe014420 Mon Sep 17 00:00:00 2001
From: zhangyuan <zhangyuan@sarnasea.com>
Date: Mon, 22 Jun 2020 17:58:23 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A4=BE=E5=8C=BA=E8=AE=B2=E5=9D=9B=E6=8A=A5?=
 =?UTF-8?q?=E5=90=8D=E6=83=85=E5=86=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/modules/activity/actinfo.vue        |   2 +-
 .../modules/activity/activityinfo-add.vue     | 779 ++++++++++++++++++
 src/views/modules/activity/activityinfo.vue   |  55 +-
 .../modules/activity/activityparticipant.vue  |  40 +-
 4 files changed, 855 insertions(+), 21 deletions(-)
 create mode 100644 src/views/modules/activity/activityinfo-add.vue

diff --git a/src/views/modules/activity/actinfo.vue b/src/views/modules/activity/actinfo.vue
index 0519d71..26de3da 100644
--- a/src/views/modules/activity/actinfo.vue
+++ b/src/views/modules/activity/actinfo.vue
@@ -5,7 +5,7 @@
 </template>
 <script>
 import ActInfoList from './activityinfo'
-import ActInfoAdd from './activityinfo-add-or-update'
+import ActInfoAdd from './activityinfo-add'
 import ActInfoDetailView from './actinfo-detail-view'
 export default {
   data () {
diff --git a/src/views/modules/activity/activityinfo-add.vue b/src/views/modules/activity/activityinfo-add.vue
new file mode 100644
index 0000000..7d80bd0
--- /dev/null
+++ b/src/views/modules/activity/activityinfo-add.vue
@@ -0,0 +1,779 @@
+<template>
+    <el-card shadow="never"
+             class="aui-card--fill">
+        <div class="mod-news__news}">
+            <el-form :inline="true"
+                     :rules="dataRule"
+                     :model="dataForm"
+                     ref="dataForm"
+                     :label-width="$i18n.locale === 'en-US' ? '120px' : '120px'">
+                <el-row>
+                    <el-form-item label="活动头图："
+                                  v-loading="loading"
+                                  prop="headPic">
+                        <el-upload class="avatar-uploader"
+                                   :action="uploadUrl"
+                                   :show-file-list="false"
+                                   :on-success="handleAvatarActSuccess"
+                                   :on-error="handelError"
+                                   :before-upload="beforeAvatarUpload">
+                            <img v-if="dataForm.headPic"
+                                 :src="dataForm.headPic"
+                                 class="avatar">
+                            <i v-else
+                               class="el-icon-plus avatar-uploader-icon"></i>
+                            <div slot="tip"
+                                 class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+                        </el-upload>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动标题："
+                                  prop="title">
+                        <el-input v-model="dataForm.title"
+                                  type="text"
+                                  maxlength="40"
+                                  show-word-limit
+                                  placeholder="请输入标题，40字以内"
+                                  clearable
+                                  style="width:500px">
+                        </el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="所属类别："
+                                  prop="categoryCode">
+                        <el-select v-model="dataForm.categoryCode"
+                                   placeholder="所属类别" style="width: 100%">
+                            <el-option v-for="item in options"
+                                       :key="item.code"
+                                       :label="item.name"
+                                       :value="item.code">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="报名要求："
+                                  prop="requirement">
+                        <el-input v-model="dataForm.requirement"
+                                  placeholder="请输入报名要求，200字以内"
+                                  type="textarea"
+                                  style="width:500px"
+                                  maxlength="200"
+                                  clearable>
+                        </el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="报名时间："
+                                  prop="signUpStartTime">
+                        <el-date-picker v-model="dataForm.signUpStartTime"
+                                        type="datetime"
+                                        value-format="yyyy-MM-dd HH:mm"
+                                        format="yyyy-MM-dd HH:mm"
+                                        placeholder="选择日期时间">
+                        </el-date-picker>
+                    </el-form-item>
+                    <el-form-item label="至"
+                                  label-width="40px"
+                                  prop="signUpEndTime">
+                        <el-date-picker v-model="dataForm.signUpEndTime"
+                                        type="datetime"
+                                        value-format="yyyy-MM-dd HH:mm"
+                                        format="yyyy-MM-dd HH:mm"
+                                        :picker-options="issignUpEndTime"
+                                        placeholder="选择日期时间">
+                        </el-date-picker>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动名额："
+                                  prop="actQuota">
+                        <template>
+                            <el-radio v-model="dataForm.actQuotaFlag"
+                                      label="1">固定名额</el-radio>&emsp;&emsp;
+                            <el-input-number v-enter-number
+                                             type="number"
+                                             :min="1"
+                                             v-model="dataForm.actQuota"
+                                             placeholder="固定名额"
+                                             style="width:150px"></el-input-number>&emsp; 人&emsp;&emsp;
+                            <el-radio v-model="dataForm.actQuotaFlag"
+                                      label="0">不限名额</el-radio>
+                        </template>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动时间："
+                                  prop="actStartTime">
+                        <el-date-picker v-model="dataForm.actStartTime"
+                                        type="datetime"
+                                        value-format="yyyy-MM-dd HH:mm"
+                                        format="yyyy-MM-dd HH:mm"
+                                        placeholder="选择日期时间">
+                        </el-date-picker>
+                    </el-form-item>
+                    <el-form-item label="至"
+                                  label-width="40px"
+                                  prop="actEndTime">
+                        <el-date-picker v-model="dataForm.actEndTime"
+                                        type="datetime"
+                                        value-format="yyyy-MM-dd HH:mm"
+                                        format="yyyy-MM-dd HH:mm"
+                                        placeholder="选择日期时间">
+                        </el-date-picker>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动地点："
+                                  prop="actAddress">
+                        <el-input v-model="dataForm.actAddress"
+                                  :disabled="signInIsAble"
+                                  type="text"
+                                  clearable
+                                  style="width:400px">
+                        </el-input>&emsp;
+                        <el-button type="primary"
+                                   @click="mapSelectHandle(1)">地图选择</el-button>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="联系人："
+                                  prop="contacts">
+                        <el-input v-model="dataForm.contacts"
+                                  maxlength="5"
+                                  style="width:150px"></el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="联系电话："
+                                  prop="tel">
+                        <el-input v-model="dataForm.tel"
+                                  maxlength="20"
+                                  style="width:200px"></el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动主办方："
+                                  prop="sponsor">
+                        <el-input v-model="dataForm.sponsor"
+                                  type="text"
+                                  maxlength="30"
+                                  show-word-limit
+                                  placeholder="请输入主办方，30字以内"
+                                  clearable
+                                  style="width:500px">
+                        </el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item prop="actContent"
+                                  label="活动内容：">
+                        <div style="width:1000px">
+                            <!-- 富文本编辑器, 容器 -->
+                            <div id="J_quillEditor" class="ql-editor"></div>
+                            <!-- 自定义上传图片功能 (使用element upload组件) -->
+                            <el-upload :action="uploadUrl"
+                                       :show-file-list="false"
+                                       :before-upload="uploadBeforeUploadHandle"
+                                       :on-success="uploadSuccessHandle"
+                                       style="display: none;">
+                                <el-button ref="uploadBtn"
+                                           type="primary"
+                                           size="small">{{ $t('upload.button') }}</el-button>
+                            </el-upload>
+                        </div>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动发布状态" prop="actStatus">
+                        <el-radio-group v-model="dataForm.actStatus">
+                            <el-radio :label="'1'">上架</el-radio>
+                            <el-radio :label="'0'">下架</el-radio>
+                        </el-radio-group>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动发布时间："
+                                  prop="publishTime">
+                        <el-date-picker v-model="dataForm.publishTime"
+                                        type="datetime"
+                                        value-format="yyyy-MM-dd HH:mm"
+                                        format="yyyy-MM-dd HH:mm"
+                                        placeholder="选择日期时间">
+                        </el-date-picker>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="已报名人数" prop="signUpNum">
+                        <el-input v-model="dataForm.signUpNum" disabled placeholder="已报名人数"></el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label="活动下架原因" prop="cancelReason">
+                        <el-input v-model="dataForm.cancelReason"
+                                  placeholder="活动下架原因，1000字以内"
+                                  type="textarea"
+                                  style="width:500px"
+                                  maxlength="1000"
+                                  :rows="4"
+                                  clearable>
+                        </el-input>
+                    </el-form-item>
+                </el-row>
+                <el-row>
+                    <el-form-item label-width="500px">
+                        <el-button type="primary"
+                                   :disabled="isAble"
+                                   @click="dataFormSubmitHandle()">{{$t("confirm")}}</el-button>
+                        <el-button @click="backToActList">返回</el-button>
+                    </el-form-item>
+                </el-row>
+            </el-form>
+            <map-select v-if="mapSelectVisible"
+                        ref="mapSelect"
+                        v-on:position="position"></map-select>
+        </div>
+    </el-card>
+</template>
+<script>
+    import Cookies from 'js-cookie'
+    import MapSelect from './map-select'
+    import debounce from 'lodash/debounce'
+    import 'quill/dist/quill.snow.css'
+    import Quill from 'quill'
+    export default {
+        name: 'ActInfoAdd',
+        data () {
+            return {
+                visible: false,
+                dataForm: {
+                    id: '',
+                    title: '',
+                    headPic: '',
+                    signUpStartTime: '',
+                    signUpEndTime: '',
+                    actQuotaFlag: '1',
+                    actStartTime: '',
+                    actEndTime: '',
+                    actAddress: '',
+                    actLongitude: '',
+                    actLatitude: '',
+                    clockRadius: 200,
+                    actQuota: '',
+                    contacts: '',
+                    tel: '',
+                    requirement: '',
+                    actContent: '',
+                    actStatus: '1',
+                    publishTime: '',
+                    sponsor: '',
+                    deptId: '',
+                    punishmentPoints: '',
+                    reward: '',
+                    isBanner: '1',
+                    actUserDefaultState: '1',
+                    bannerUrl: '',
+                    cancelReason: '',
+                    signUpNum: 0,
+                    sectionCode: '',
+                    categoryCode: '',
+                    categoryName: ''
+                },
+                options: [],
+                issignUpEndTime: {
+                    disabledDate (time) {
+                        return time < Date.now() - 8.64e7 // 8.64e7=1000*60*60*24一天
+                    }
+                },
+                isImgRequired: true,
+                mapSelectVisible: false,
+                signInIsAble: true,
+                isAble: false,
+                loading: false,
+                // 富文本
+                quillEditor: null,
+                quillEditorToolbarOptions: [
+                    ['bold', 'italic', 'underline', 'strike'],
+                    ['blockquote', 'code-block', 'image'],
+                    [{ 'header': 1 }, { 'header': 2 }],
+                    [{ 'list': 'ordered' }, { 'list': 'bullet' }],
+                    [{ 'script': 'sub' }, { 'script': 'super' }],
+                    [{ 'indent': '-1' }, { 'indent': '+1' }],
+                    [{ 'direction': 'rtl' }],
+                    [{ 'size': ['small', false, 'large', 'huge'] }],
+                    [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
+                    [{ 'color': [] }, { 'background': [] }],
+                    [{ 'font': [] }],
+                    [{ 'align': [] }],
+                    ['clean']
+                ],
+                uploadUrl: '',
+                pickerBeginDateBefore: {
+                    disabledDate: (time) => {
+                        let beginDateVal = this.dataForm.actStartTime
+                        if (beginDateVal) {
+                            return time.getTime() > new Date(beginDateVal).getTime()
+                        }
+                    }
+                },
+                pickerBeginDateAfter: {
+                    disabledDate: (time) => {
+                        let EndDateVal = this.dataForm.actEndTime
+                        if (EndDateVal) {
+                            return time.getTime() < new Date(EndDateVal).getTime()
+                        }
+                    }
+                }
+            }
+        },
+        created () {
+            this.visible = true
+            this.$nextTick(() => {
+                // 富文本
+                this.hideUpload = false
+                this.uploadUrl = `${window.SITE_CONFIG['apiURL']}/oss/file/upload?token=${Cookies.get('token')}`
+                if (this.quillEditor) {
+                    this.quillEditor.deleteText(0, this.quillEditor.getLength())
+                } else {
+                    this.quillEditorHandle()
+                }
+                // 富文本end
+            })
+        },
+        mounted() {
+            this.getOptions()
+        },
+        computed: {
+            dataRule () {
+                return {
+                    title: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    headPic: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    signUpStartTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    signUpEndTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actStartTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actEndTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actAddress: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actLongitude: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actLatitude: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    clockRadius: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actQuotaFlag: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actQuota: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    clockNum: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actShareNum: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actBrowseNum: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    contacts: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    tel: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    requirement: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actContent: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    actStatus: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    publishTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    sponsor: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    deptId: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    categoryCode: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    punishmentPoints: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    reward: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    revision: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    createdBy: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    createdTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    updatedBy: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    updatedTime: [
+                        { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+                    ],
+                    bannerUrl: [
+                        { required: this.isImgRequired, message: this.$t('validate.required'), trigger: 'blur' }
+                    ]
+                }
+            }
+        },
+        methods: {
+            getOptions () {
+                this.$http
+                    .get(`/property/sectioncategory/list`, { params: { sectionCode: 'community_forum' } }).then(({ data: res }) => {
+                        if (res.code !== 0) {
+                            return this.$message.error(res.msg)
+                        }
+                        this.options = res.data
+                    })
+                    .catch(() => { })
+            },
+            changeHandler (value) {
+                if (value === 1) {
+                    this.isImgRequired = true
+                } else {
+                    this.isImgRequired = false
+                }
+            },
+            backToActList () {
+                this.$emit('refreshDataList')
+                this.$parent.selectComponent = 'ActInfoList'
+                this.$router.push({ path: '/activity-actinfo' })
+            },
+            init () {
+                this.visible = true
+                this.$nextTick(() => {
+                    this.$refs['dataForm'].resetFields()
+                    if (this.dataForm.id) {
+                        this.getInfo()
+                    }
+                })
+            },
+            position (position) {
+                if (position.type === 1) {
+                    this.dataForm.actAddress = position.address
+                    this.dataForm.actLatitude = position.latitude
+                    this.dataForm.actLongitude = position.longitude
+                }
+            },
+            // 富文本编辑器
+            quillEditorHandle () {
+                this.quillEditor = new Quill('#J_quillEditor', {
+                    modules: {
+                        toolbar: this.quillEditorToolbarOptions
+                    },
+                    theme: 'snow'
+                })
+                this.quillEditor.container.style.height = `${300}px`
+                // // 自定义上传图片功能 (使用element upload组件)
+                this.quillEditor.getModule('toolbar').addHandler('image', () => {
+                    this.$refs.uploadBtn.$el.click()
+                })
+                // 监听内容变化，动态赋值
+                this.quillEditor.on('text-change', () => {
+                    this.dataForm.actContent = this.quillEditor.root.innerHTML
+                    if ((this.dataForm.actContent).length > 10000) {
+                        return this.$message.error('您输入的的内容已超过字数')
+                    }
+                })
+            },
+            // 上传图片之前 (富文本)
+            uploadBeforeUploadHandle (file) {
+                if (file.type !== 'image/jpg' && file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
+                    this.$message.error(this.$t('upload.tip', { 'format': 'jpg、png、gif' }))
+                    return false
+                }
+            },
+            // 上传图片成功 (富文本)
+            uploadSuccessHandle (res, file, fileList) {
+                if (res.code !== 0) {
+                    return this.$message.error(res.msg)
+                }
+                this.quillEditor.insertEmbed(this.quillEditor.getSelection().index, 'image', res.data.url)
+            },
+            setRegistTime () {
+                this.dataForm.newsReleaseStartTime = this.time[0]
+                this.dataForm.newsReleaseEndTime = this.time[1]
+            },
+            // 上传图片ends
+            // 获取信息
+            getInfo () {
+                this.$http.get(`/property/activityinfo/${this.dataForm.id}`).then(({ data: res }) => {
+                    if (res.code !== 0) {
+                        return this.$message.error(res.msg)
+                    }
+                    this.dataForm = {
+                        ...this.dataForm,
+                        ...res.data
+                    }
+                }).catch(() => { })
+            },
+            // 表单提交
+            dataFormSubmitHandle: debounce(function () {
+                if (new Date() >= new Date(this.dataForm.signUpEndTime)) {
+                    return this.$message.error('报名截止时间必须大于当前时间')
+                }
+                if (this.dataForm.actStartTime >= this.dataForm.actEndTime) {
+                    return this.$message.error('活动结束时间必须大于活动开始时间')
+                }
+                if (this.dataForm.actStartTime <= this.dataForm.signUpEndTime) {
+                    return this.$message.error('活动开始时间必须大于报名截止时间')
+                }
+                if ((this.dataForm.actContent).length > 10000) {
+                    return this.$message.error('您输入的的内容已超过字数')
+                }
+                if (this.dataForm.isActQuota === 0) {
+                    this.dataForm.actQuota = 0
+                }
+                this.$refs['dataForm'].validate((valid) => {
+                    if (!valid) {
+                        return false
+                    }
+                    var signUpEndTime = new Date(Date.parse(this.dataForm.signUpEndTime))
+                    var actStarTime = new Date(Date.parse(this.dataForm.actStartTime))
+                    var actEndTime = new Date(Date.parse(this.dataForm.actEndTime))
+                    if (signUpEndTime > actStarTime) {
+                        return this.$message.error('活动开始时间必须大于报名截止时间.')
+                    }
+                    if (actEndTime < actStarTime) {
+                        return this.$message.error('活动结束时间必须大于活动开始时间.')
+                    }
+                    this.isAble = true
+                    this.$http[!this.dataForm.id ? 'post' : 'put']('/property/activityinfo/', this.dataForm).then(({ data: res }) => {
+                        this.isAble = false
+                        if (res.code !== 0) {
+                            return this.$message.error(res.msg)
+                        }
+                        this.$message({
+                            message: this.$t('prompt.success'),
+                            type: 'success',
+                            duration: 500,
+                            onClose: () => {
+                                this.visible = false
+                                this.$emit('refreshDataList')
+                            }
+                        })
+                        this.$parent.selectComponent = 'ActInfoList'
+                        this.$router.push({
+                            path: '/activity-actinfo'
+                        })
+                    }).catch(() => { })
+                })
+            }, 1000, { 'leading': true, 'trailing': false }),
+            handleAvatarActSuccess (res, file) {
+                this.loading = false
+                this.dataForm.headPic = res.data.url
+            },
+            handleAvatarBannerSuccess (res, file) {
+                this.loading = false
+                this.dataForm.bannerUrl = res.data.url
+            },
+            beforeAvatarUpload (file) {
+                this.loading = true
+            },
+            handelError () {
+                this.loading = false
+            },
+            mapSelectHandle (type) {
+                this.mapSelectVisible = true
+                this.$nextTick(() => {
+                    this.$refs.mapSelect.init(type, this.dataForm.clockRadius)
+                })
+            }
+        },
+        components: {
+            MapSelect
+        }
+    }
+</script>
+<style>
+    .avatar-uploader .el-upload {
+        border: 1px dashed #d9d9d9;
+        border-radius: 6px;
+        cursor: pointer;
+        position: relative;
+        overflow: hidden;
+    }
+    .avatar-uploader .el-upload:hover {
+        border-color: #409eff;
+    }
+    .avatar-uploader-icon {
+        font-size: 28px;
+        color: #8c939d;
+        width: 178px;
+        height: 178px;
+        line-height: 178px;
+        text-align: center;
+    }
+    .avatar {
+        width: 178px;
+        height: 178px;
+        display: block;
+    }
+</style>
+<style lang="scss">
+    .project-handle {
+        .el-timeline {
+            padding-left: 9px;
+            font-size: 13px;
+        }
+        .el-textarea {
+            width: 600px !important;
+        }
+        .el-input {
+            width: 600px !important;
+        }
+    }
+    .el-form-item__label {
+        font-weight: bold;
+    }
+</style>
+
+<style lang="scss" scoped>
+    .project-handle {
+        width: 100%;
+        height: calc(100vh - 120px);
+        background: #ffffff;
+        box-sizing: border-box;
+        padding: 10px;
+        .project-detail {
+            width: 100%;
+            height: 49%;
+            border: 2px solid #ccc;
+            box-sizing: border-box;
+            padding: 10px;
+            padding-top: 20px;
+            float: left;
+            margin-bottom: 1%;
+            position: relative;
+            .project-detail-tip {
+                position: absolute;
+                top: 0;
+                left: 0;
+                width: 80px;
+                height: 30px;
+                line-height: 30px;
+                color: #ffffff;
+                background: #4ac38b;
+                text-align: center;
+            }
+            .el-form {
+                width: 58%;
+                height: 100%;
+                float: left;
+                overflow-y: auto;
+                &::-webkit-scrollbar {
+                    width: 5px;
+                    height: 1px;
+                }
+                &::-webkit-scrollbar-thumb {
+                    border-radius: 5px;
+                    background: #ccc;
+                }
+                &::-webkit-scrollbar-track {
+                    border-radius: 10px;
+                    background: #fff;
+                }
+            }
+            .container {
+                width: 40%;
+                height: 100%;
+                float: right;
+                .location {
+                    height: 30px;
+                    line-height: 30px;
+                }
+                #map {
+                    width: 100%;
+                    height: calc(100% - 30px);
+                }
+            }
+        }
+        .project-progress {
+            width: 20%;
+            height: 100%;
+            float: right;
+            border: 2px solid #ccc;
+            box-sizing: border-box;
+            margin-left: 1%;
+            padding-top: 20px;
+            overflow-y: auto;
+            &::-webkit-scrollbar {
+                width: 5px;
+                height: 1px;
+            }
+            &::-webkit-scrollbar-thumb {
+                border-radius: 5px;
+                background: #aaa;
+            }
+            &::-webkit-scrollbar-track {
+                border-radius: 10px;
+                background: #ccc;
+            }
+        }
+        .handle-operation {
+            padding-top: 30px;
+            box-sizing: border-box;
+            width: 100%;
+            height: 49%;
+            box-sizing: border-box;
+            border: 2px solid #ccc;
+            float: left;
+            position: relative;
+            overflow-y: auto;
+            &::-webkit-scrollbar {
+                width: 5px;
+                height: 1px;
+            }
+            &::-webkit-scrollbar-thumb {
+                border-radius: 5px;
+                background: #aaa;
+            }
+            &::-webkit-scrollbar-track {
+                border-radius: 10px;
+                background: #ccc;
+            }
+            .handle-operation-tip {
+                position: absolute;
+                top: 0;
+                left: 0;
+                width: 80px;
+                height: 30px;
+                line-height: 30px;
+                color: #ffffff;
+                background: #ff7600;
+                text-align: center;
+            }
+        }
+    }
+</style>
diff --git a/src/views/modules/activity/activityinfo.vue b/src/views/modules/activity/activityinfo.vue
index af01c3f..0001f93 100644
--- a/src/views/modules/activity/activityinfo.vue
+++ b/src/views/modules/activity/activityinfo.vue
@@ -2,8 +2,32 @@
   <el-card shadow="never" class="aui-card--fill">
     <div class="mod-__activityinfo}">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
-        <el-form-item>
-          <el-input v-model="dataForm.id" placeholder="id" clearable></el-input>
+        <el-form-item label="状态">
+          <el-select v-model="dataForm.actStatus" placeholder="状态" clearable>
+            <el-option label="上架" :value="1"></el-option>
+            <el-option label="下架" :value="0"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="活动时间"
+                      prop="actStartTime">
+          <el-date-picker v-model="dataForm.actStartTime"
+                          type="date"
+                          :picker-options="pickerBeginDateBefore"
+                          value-format="yyyy-MM-dd"
+                          format="yyyy-MM-dd"
+                          placeholder="选择日期时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="至"
+                      label-width="25px"
+                      prop="actEndTime">
+          <el-date-picker v-model="dataForm.actEndTime"
+                          type="date"
+                          :picker-options="pickerBeginDateAfter"
+                          value-format="yyyy-MM-dd"
+                          format="yyyy-MM-dd"
+                          placeholder="选择日期时间">
+          </el-date-picker>
         </el-form-item>
         <el-form-item>
           <el-button @click="getDataList()">{{ $t('query') }}</el-button>
@@ -57,6 +81,7 @@
         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
           <template slot-scope="scope">
             <el-button v-if="$hasPermission('activity:activityinfo:update')" type="text" size="small" @click="detailAction(scope.row.id)">查看详情</el-button>
+            <el-button v-if="$hasPermission('activity:activityinfo:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">报名情况</el-button>
             <el-button v-if="$hasPermission('activity:activityinfo:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
           </template>
         </el-table-column>
@@ -78,7 +103,8 @@
 
 <script>
 import mixinViewModule from '@/mixins/view-module'
-import AddOrUpdate from './activityinfo-add-or-update'
+import Add from './activityinfo-add'
+import AddOrUpdate from './activityparticipant'
 export default {
   mixins: [mixinViewModule],
   data () {
@@ -90,11 +116,32 @@ export default {
         deleteIsBatch: true
       },
       dataForm: {
-        id: ''
+        id: '',
+        title: '',
+        actStatus: '',
+        actStartTime: '',
+        actEndTime: ''
+      },
+      pickerBeginDateBefore: {
+        disabledDate: (time) => {
+          let beginDateVal = this.dataForm.actStartTime
+          if (beginDateVal) {
+            return time.getTime() > new Date(beginDateVal).getTime()
+          }
+        }
+      },
+      pickerBeginDateAfter: {
+        disabledDate: (time) => {
+          let EndDateVal = this.dataForm.actEndTime
+          if (EndDateVal) {
+            return time.getTime() < new Date(EndDateVal).getTime()
+          }
+        }
       }
     }
   },
   components: {
+    Add,
     AddOrUpdate
   },
   mounted() {
diff --git a/src/views/modules/activity/activityparticipant.vue b/src/views/modules/activity/activityparticipant.vue
index 02f8a34..d9f78c4 100644
--- a/src/views/modules/activity/activityparticipant.vue
+++ b/src/views/modules/activity/activityparticipant.vue
@@ -1,9 +1,15 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
+  <el-dialog :visible.sync="visible" title="报名详情" :close-on-click-modal="false" width="85%" :close-on-press-escape="false">
     <div class="mod-__activityparticipant}">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
-        <el-form-item>
-          <el-input v-model="dataForm.id" placeholder="id" clearable></el-input>
+        <el-form-item label="真实姓名">
+          <el-input v-model="dataForm.realName" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="联系电话">
+          <el-input v-model="dataForm.mobile" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="身份证号">
+          <el-input v-model="dataForm.identityNo" clearable></el-input>
         </el-form-item>
         <el-form-item>
           <el-button @click="getDataList()">{{ $t('query') }}</el-button>
@@ -17,9 +23,6 @@
       </el-form>
       <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
         <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
-        <el-table-column prop="id" label="主键" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="actId" label="活动ID" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="userId" label="用户ID" header-align="center" align="center"></el-table-column>
         <el-table-column prop="nickname" label="用户昵称" header-align="center" align="center"></el-table-column>
         <el-table-column prop="faceImg" label="用户头像" header-align="center" align="center"></el-table-column>
         <el-table-column prop="partyFlag" label="党员标识（0-否，1-是）" header-align="center" align="center"></el-table-column>
@@ -30,12 +33,6 @@
         <el-table-column prop="identityNo" label="身份证号" header-align="center" align="center"></el-table-column>
         <el-table-column prop="failureReason" label="未通过原因（仅当未通过时录入，并读取）" header-align="center" align="center"></el-table-column>
         <el-table-column prop="signUpTime" label="报名时间" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="revision" label="乐观锁" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="createdBy" label="创建人" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="createdTime" label="创建时间" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="updatedBy" label="更新人" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="updatedTime" label="更新时间" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="delFlag" label="删除标记" header-align="center" align="center"></el-table-column>
         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
           <template slot-scope="scope">
             <el-button v-if="$hasPermission(':activityparticipant:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
@@ -55,7 +52,7 @@
       <!-- 弹窗, 新增 / 修改 -->
       <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
     </div>
-  </el-card>
+  </el-dialog>
 </template>
 
 <script>
@@ -66,18 +63,29 @@ export default {
   data () {
     return {
       mixinViewModuleOptions: {
-        getDataListURL: '//activityparticipant/page',
+        getDataListURL: '/property/activityparticipant/page',
         getDataListIsPage: true,
-        deleteURL: '//activityparticipant',
+        deleteURL: '/property/activityparticipant',
         deleteIsBatch: true
       },
+      visible: false,
       dataForm: {
-        id: ''
+        id: '',
+        realName: '',
+        mobile: '',
+        identityNo: ''
       }
     }
   },
   components: {
     AddOrUpdate
+  },
+  methods: {
+    init () {
+      this.visible = true
+      this.getDataList();
+    },
   }
 }
 </script>
+