elink-star
/
epdc-admin-yushan
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

社区讲坛vue页面

feature/yujt_analysis_pc
zhangyuan 5 years ago
parent
4cb6fb0e63
commit
b4dc0b9248
9 changed files with 1734 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      src/views/modules/activity/actinfo.vue
  2. 761
      src/views/modules/activity/activityinfo-add-or-update.vue
  3. 95
      src/views/modules/activity/activityinfo.vue
  4. 201
      src/views/modules/activity/activityparticipant-add-or-update.vue
  5. 83
      src/views/modules/activity/activityparticipant.vue
  6. 52
      src/views/modules/activity/address-check.vue
  7. 253
      src/views/modules/activity/map-select.vue
  8. 167
      src/views/modules/section/sectioncategory-add-or-update.vue
  9. 94
      src/views/modules/section/sectioncategory.vue

28
src/views/modules/activity/actinfo.vue
View File

@ -0,0 +1,28 @@
<template>
<keep-alive include="actInfoList">
<component :is="selectComponent"></component>
</keep-alive>
</template>
<script>
import ActInfoList from './activityinfo'
import ActInfoAdd from './activityinfo-add-or-update'
export default {
data () {
return {
selectComponent: ActInfoList
}
},
components: {
ActInfoList,
ActInfoAdd
},
methods: {
init () {
this.selectComponent = ActInfoList
}
}
}
</script>
<style lang="scss" scoped>
</style>

761
src/views/modules/activity/activityinfo-add-or-update.vue
View File

@ -0,0 +1,761 @@
<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="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="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"
@change="dateChangeTime"
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-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-row>
<el-form-item label="已报名人数" prop="signupNum">
<el-input v-model="dataForm.signupNum" placeholder="已报名人数"></el-input>
</el-form-item>
<el-form-item label="活动下架原因" prop="cancelReason">
<el-input v-model="dataForm.cancelReason" placeholder="活动下架原因"></el-input>
</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: '',
signinStartTime: '',
signinEndTime: '',
signinAddress: '',
signinLongitude: '',
signinLatitude: '',
clockRadius: 200,
actQuota: '',
contacts: '',
tel: '',
requirement: '',
actContent: '',
actStatus: '',
publishTime: '',
sponsor: '',
deptId: '',
punishmentPoints: '',
reward: '',
isBanner: '1',
actUserDefaultState: '1',
bannerUrl: ''
},
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()
}
}
},
pickerBeginSignInDateAfter: {
disabledDate: (time) => {
let EndDateVal = this.dataForm.signinEndTime
if (EndDateVal) {
return time.getTime() < new Date(EndDateVal).getTime()
}
}
},
pickerBeginDateAfter: {
disabledDate: (time) => {
let EndDateVal = this.dataForm.actEndTime
if (EndDateVal) {
return time.getTime() < new Date(EndDateVal).getTime()
}
}
}
}
},
created () {
this.$http
.get(`/sys/user/deptOptions/getByLoginUser`)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data.options
})
.catch(() => { })
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
})
},
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' }
],
signinStartTime: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
signinEndTime: [
{ 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' }
],
signinAddress: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
signinLongitude: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
signinLatitude: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
clockRadius: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
actQuota: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
signupNum: [
{ 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' }
],
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: {
dateChangeTime () {
this.dataForm.signinStartTime = this.dataForm.actStartTime
},
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
this.dataForm.signinAddress = position.address
this.dataForm.signinLatitude = position.latitude
this.dataForm.signinLongitude = position.longitude
} else {
this.dataForm.signinAddress = position.address
this.dataForm.signinLatitude = position.latitude
this.dataForm.signinLongitude = 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.actEndTime > this.dataForm.signinEndTime) {
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))
var signinEndTime = new Date(Date.parse(this.dataForm.signinEndTime))
if (signUpEndTime > actStarTime) {
return this.$message.error('活动开始时间必须大于报名截止时间.')
}
if (actEndTime < actStarTime) {
return this.$message.error('活动结束时间必须大于活动开始时间.')
}
if (signinEndTime < actEndTime) {
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>

95
src/views/modules/activity/activityinfo.vue
View File

@ -0,0 +1,95 @@
<template>
<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>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission('activity:activityinfo:save')" type="primary" @click="addAction()">{{ $t('add') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission('activity:activityinfo:delete')" type="danger" @click="deleteHandle()">{{ $t('deleteBatch') }}</el-button>
</el-form-item>
</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="title" label="标题" header-align="center" align="center"></el-table-column>
<el-table-column prop="headPic" label="活动头图" header-align="center" align="center"></el-table-column>
<el-table-column prop="sectionCode" label="所属版块编码" header-align="center" align="center"></el-table-column>
<el-table-column prop="categoryCode" label="所属类别编码" header-align="center" align="center"></el-table-column>
<el-table-column prop="categoryName" label="所属类别名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="signupStartTime" label="报名开始时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="signupEndTime" label="报名截止时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="actStartTime" label="活动开始时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="actEndTime" label="活动结束时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="actAddress" label="活动地点" header-align="center" align="center"></el-table-column>
<el-table-column prop="actLongitude" label="活动位置经度" header-align="center" align="center"></el-table-column>
<el-table-column prop="actLatitude" label="活动位置纬度" header-align="center" align="center"></el-table-column>
<el-table-column prop="actQuotaFlag" label="是否限制名额(0-不限名额，1-固定名额)" header-align="center" align="center"></el-table-column>
<el-table-column prop="actQuota" label="活动名额" header-align="center" align="center"></el-table-column>
<el-table-column prop="signupNum" label="已报名人数" header-align="center" align="center"></el-table-column>
<el-table-column prop="contacts" label="联系人" header-align="center" align="center"></el-table-column>
<el-table-column prop="tel" label="联系电话" header-align="center" align="center"></el-table-column>
<el-table-column prop="requirement" label="招募要求" header-align="center" align="center"></el-table-column>
<el-table-column prop="actContent" label="活动内容" header-align="center" align="center"></el-table-column>
<el-table-column prop="actStatus" label="活动发布状态（0-下架，1上架）" header-align="center" align="center"></el-table-column>
<el-table-column prop="cancelReason" label="活动下架原因" header-align="center" align="center"></el-table-column>
<el-table-column prop="publishTime" label="活动发布时间" header-align="center" align="center"></el-table-column>
<el-table-column prop="sponsor" 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('activity:activityinfo:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</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>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './activityinfo-add-or-update'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/property/activityinfo/page',
getDataListIsPage: true,
deleteURL: '/property/activityinfo',
deleteIsBatch: true
},
dataForm: {
id: ''
}
}
},
components: {
AddOrUpdate
},
methods: {
addAction () {
this.$parent.selectComponent = 'ActInfoAdd'
this.$router.push(
{ path: '/activity-actinfo'}
)
}
}
}
</script>

201
src/views/modules/activity/activityparticipant-add-or-update.vue
View File

@ -0,0 +1,201 @@
<template>
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
<el-form-item label="活动ID" prop="actId">
<el-input v-model="dataForm.actId" placeholder="活动ID"></el-input>
</el-form-item>
<el-form-item label="用户ID" prop="userId">
<el-input v-model="dataForm.userId" placeholder="用户ID"></el-input>
</el-form-item>
<el-form-item label="用户昵称" prop="nickname">
<el-input v-model="dataForm.nickname" placeholder="用户昵称"></el-input>
</el-form-item>
<el-form-item label="用户头像" prop="faceImg">
<el-input v-model="dataForm.faceImg" placeholder="用户头像"></el-input>
</el-form-item>
<el-form-item label="党员标识（0-否，1-是）" prop="partyFlag">
<el-input v-model="dataForm.partyFlag" placeholder="党员标识（0-否，1-是）"></el-input>
</el-form-item>
<el-form-item label="报名人真实姓名" prop="realName">
<el-input v-model="dataForm.realName" placeholder="报名人真实姓名"></el-input>
</el-form-item>
<el-form-item label="性别(0-女，1-男)" prop="sex">
<el-input v-model="dataForm.sex" placeholder="性别(0-女，1-男)"></el-input>
</el-form-item>
<el-form-item label="年龄" prop="age">
<el-input v-model="dataForm.age" placeholder="年龄"></el-input>
</el-form-item>
<el-form-item label="联系电话" prop="mobile">
<el-input v-model="dataForm.mobile" placeholder="联系电话"></el-input>
</el-form-item>
<el-form-item label="身份证号" prop="identityNo">
<el-input v-model="dataForm.identityNo" placeholder="身份证号"></el-input>
</el-form-item>
<el-form-item label="未通过原因（仅当未通过时录入，并读取）" prop="failureReason">
<el-input v-model="dataForm.failureReason" placeholder="未通过原因（仅当未通过时录入，并读取）"></el-input>
</el-form-item>
<el-form-item label="报名时间" prop="signUpTime">
<el-input v-model="dataForm.signUpTime" placeholder="报名时间"></el-input>
</el-form-item>
<el-form-item label="乐观锁" prop="revision">
<el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input>
</el-form-item>
<el-form-item label="创建人" prop="createdBy">
<el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input>
</el-form-item>
<el-form-item label="创建时间" prop="createdTime">
<el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input>
</el-form-item>
<el-form-item label="更新人" prop="updatedBy">
<el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input>
</el-form-item>
<el-form-item label="更新时间" prop="updatedTime">
<el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input>
</el-form-item>
<el-form-item label="删除标记" prop="delFlag">
<el-input v-model="dataForm.delFlag" placeholder="删除标记"></el-input>
</el-form-item>
</el-form>
<template slot="footer">
<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button>
</template>
</el-dialog>
</template>
<script>
import debounce from 'lodash/debounce'
export default {
data () {
return {
visible: false,
dataForm: {
id: '',
actId: '',
userId: '',
nickname: '',
faceImg: '',
partyFlag: '',
realName: '',
sex: '',
age: '',
mobile: '',
identityNo: '',
failureReason: '',
signUpTime: '',
revision: '',
createdBy: '',
createdTime: '',
updatedBy: '',
updatedTime: '',
delFlag: ''
}
}
},
computed: {
dataRule () {
return {
actId: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
userId: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
nickname: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
faceImg: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
partyFlag: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
realName: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
sex: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
age: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
mobile: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
identityNo: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
failureReason: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
signUpTime: [
{ 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' }
],
delFlag: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
]
}
}
},
methods: {
init () {
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
// 获取信息
getInfo () {
this.$http.get(`//activityparticipant/${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 () {
this.$refs['dataForm'].validate((valid) => {
if (!valid) {
return false
}
this.$http[!this.dataForm.id ? 'post' : 'put']('//activityparticipant/', this.dataForm).then(({ data: res }) => {
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')
}
})
}).catch(() => {})
})
}, 1000, { 'leading': true, 'trailing': false })
}
}
</script>

83
src/views/modules/activity/activityparticipant.vue
View File

@ -0,0 +1,83 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<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>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission(':activityparticipant:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission(':activityparticipant:delete')" type="danger" @click="deleteHandle()">{{ $t('deleteBatch') }}</el-button>
</el-form-item>
</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>
<el-table-column prop="realName" label="报名人真实姓名" header-align="center" align="center"></el-table-column>
<el-table-column prop="sex" label="性别(0-女，1-男)" header-align="center" align="center"></el-table-column>
<el-table-column prop="age" label="年龄" header-align="center" align="center"></el-table-column>
<el-table-column prop="mobile" label="联系电话" header-align="center" align="center"></el-table-column>
<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>
<el-button v-if="$hasPermission(':activityparticipant:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './activityparticipant-add-or-update'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '//activityparticipant/page',
getDataListIsPage: true,
deleteURL: '//activityparticipant',
deleteIsBatch: true
},
dataForm: {
id: ''
}
}
},
components: {
AddOrUpdate
}
}
</script>

52
src/views/modules/activity/address-check.vue
View File

@ -0,0 +1,52 @@
<template>
<el-dialog
:visible.sync="visible"
title="地址确认"
:append-to-body="true"
:modal-append-to-body="false"
:close-on-click-modal="false"
:close-on-press-escape="false"
>
<el-form :model="dataForm" :label-width="$i18n.locale === 'en-US' ? '180px' : '140px'">
<el-form-item label="地址:">
<div>{{dataForm.address}}</div>
</el-form-item>
<el-form-item label="经度:">
<div>{{dataForm.longitude}}</div>
</el-form-item>
<el-form-item label="纬度:">
<div>{{dataForm.latitude}}</div>
</el-form-item>
</el-form>
<template slot="footer">
<el-button @click="checkOk()" type="primary">{{$t("confirm")}}</el-button>
</template>
</el-dialog>
</template>
<script>
export default {
data () {
return {
visible: false,
dataForm: {
address: '',
longitude: 0,//经度
latitude: 0,//纬度
city: ''
}
}
},
methods: {
init (dataForm) {
this.visible = true
this.$nextTick(() => {
this.dataForm = dataForm
})
},
checkOk () {
this.$emit('checkOk', true)
this.visible = false
}
}
}
</script>

253
src/views/modules/activity/map-select.vue
View File

@ -0,0 +1,253 @@
<template>
<el-dialog :visible.sync="visible" :close-on-click-modal="false" :close-on-press-escape="false">
<el-form
:inline="true"
:model="dataForm"
:label-width="$i18n.locale === 'en-US' ? '120px' : '120px'"
>
<el-row>
<el-form-item label="活动地点：" prop="address">
<el-input v-model="dataForm.address" type="text" clearable style="width:400px"></el-input>&emsp;
<el-button type="primary" @click="searchKeyword()">搜索</el-button>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="map">
<div>
<div id="container" style="width:500px;height:400px;"></div>
</div>
</el-form-item>
</el-row>
</el-form>
<address-check v-if="addressCheckVisible" ref="addressCheck" v-on:checkOk="checkOk"></address-check>
</el-dialog>
</template>
<script>
import jsonp from 'jsonp'
import AddressCheck from './address-check'
var searchService
export default {
name: 'maps',
data () {
return {
dataForm: {
address: '',
longitude: 0, // 经度
latitude: 0, // 纬度
city: '',
type: 1,
radius: 200
},
visible: false,
addressCheckVisible: false
}
},
methods: {
init (type, radius) {
this.visible = true
this.dataForm.address = ''
this.dataForm.type = type
this.dataForm.radius = radius
this.getMyLocation()
},
getAddress (lat, lng) {
this.dataForm.longitude = lng
this.dataForm.latitude = lat
var url3 =
'https://apis.map.qq.com/ws/geocoder/v1/?location=' +
lat +
',' +
lng +
'&key=MQFBZ-LTWW6-R7XSK-MFXUQ-DVSIE-BGB4M&output=jsonp'
jsonp(url3, null, (err, data) => {
if (err) {
console.log(err)
}
console.log(data)
this.dataForm.address = data.result.address
})
},
getMyLocation () {
var geolocation = new qq.maps.Geolocation(
'MQFBZ-LTWW6-R7XSK-MFXUQ-DVSIE-BGB4M',
'e家党群-管理端'
)
geolocation.getIpLocation(this.showPosition, this.showErr)
},
showPosition (position) {
console.log(position)
this.dataForm.latitude = position.lat
this.dataForm.longitude = position.lng
this.dataForm.city = position.city
this.getAddress(position.lat,position.lng)
this.setMap()
},
showErr () {
console.log('定位失败')
this.getMyLocation() // 定位失败再请求定位，测试使用
},
setMap () {
const that = this
var markerList = []
var radiusList = []
// 步骤：定义map变量 调用 qq.maps.Map() 构造函数 获取地图显示容器
// 设置地图中心点
var myLatlng = new qq.maps.LatLng(
this.dataForm.latitude,
this.dataForm.longitude
)
// 定义工厂模式函数
var zoom = this.capacity()
var myOptions = {
zoom: zoom, // 设置地图缩放级别
center: myLatlng, // 设置中心点样式
mapTypeId: qq.maps.MapTypeId.ROADMAP // 设置地图样式详情参见MapType
}
// 获取dom元素添加地图信息
var map = new qq.maps.Map(
document.getElementById('container'),
myOptions
)
// 设置圆形
var radius = new qq.maps.Circle({
center: new qq.maps.LatLng(
this.dataForm.latitude,
this.dataForm.longitude
),
radius: this.dataForm.radius,
map: map
})
radiusList.push(radius)
var marker = new qq.maps.Marker({
position: myLatlng,
map: map
})
qq.maps.event.addListener(marker,'click',function (event) {
that.addressCheckHandle()
})
markerList.push(marker)
// 添加监听事件 获取鼠标单击事件
qq.maps.event.addListener(map, 'click', function (event) {
that.cleanMarkRadius(markerList, radiusList)
that.getAddress(event.latLng.lat, event.latLng.lng)
var myLatlng = new qq.maps.LatLng(event.latLng.lat, event.latLng.lng)
map.setCenter(myLatlng)
var marker = new qq.maps.Marker({
position: event.latLng,
map: map
})
// 设置圆形
var radius = new qq.maps.Circle({
center: new qq.maps.LatLng(event.latLng.lat, event.latLng.lng),
radius: that.dataForm.radius,
map: map
})
radiusList.push(radius)
markerList.push(marker)
qq.maps.event.addListener(map, 'click', function (event) {
that.cleanMarkRadius(markerList, radiusList)
})
qq.maps.event.addListener(marker, 'click', function (event) {
that.addressCheckHandle()
})
})
// 调用地址解析类
searchService = new qq.maps.SearchService({
complete: function (result) {
var pois = result.detail.pois
if (pois == null || pois.length <= 0) {
alert('未找到地址!')
that.getAddress(that.dataForm.latitude, that.dataForm.longitude)
return
}
map.setCenter(pois[0].latLng)
that.getAddress(pois[0].latLng.lat, pois[0].latLng.lng)
var marker = new qq.maps.Marker({
map: map,
position: pois[0].latLng
})
// 设置圆形
var radius = new qq.maps.Circle({
center: new qq.maps.LatLng(pois[0].latLng.lat, pois[0].latLng.lng),
radius: that.dataForm.radius,
map: map
})
radiusList.push(radius)
markerList.push(marker)
that.cleanMarkRadius(markerList, radiusList)
qq.maps.event.addListener(marker, 'click', function (event) {
that.addressCheckHandle()
})
}
})
},
searchKeyword () {
searchService.setLocation(this.dataForm.city)
searchService.search(this.dataForm.address)
},
addressCheckHandle () {
if (this.dataForm.address === '' || !(this.dataForm.latitude > 0)) {
alert('请选择地址!')
return
}
this.addressCheckVisible = true
this.$nextTick(() => {
this.$refs.addressCheck.init(this.dataForm)
})
},
checkOk (checkOk) {
if (checkOk) {
this.$emit('position', this.dataForm)
this.visible = false
}
},
cleanMarkRadius (markerList, radiusList) {
if (markerList) {
if (markerList.length > 1) {
for (var i4 = 0; i4 < markerList.length - 1; i4++) {
markerList[i4].setMap(null)
}
} else {
for (var i3 = 0; i3 < markerList.length; i3++) {
markerList[i3].setMap(null)
}
}
}
if (radiusList) {
if (radiusList.length > 1) {
for (var i2 = 0; i2 < radiusList.length - 1; i2++) {
radiusList[i2].setMap(null)
}
} else {
for (var i1 = 0; i1 < markerList.length; i1++) {
radiusList[i1].setMap(null)
}
}
}
},
capacity () {
if (this.dataForm.radius > 0 && this.dataForm.radius <= 25) {
return 18
} else if (this.dataForm.radius > 25 && this.dataForm.radius <= 50) {
return 17
} else if (this.dataForm.radius > 50 && this.dataForm.radius <= 100) {
return 16
} else if (this.dataForm.radius > 100 && this.dataForm.radius <= 200) {
return 15
} else if (this.dataForm.radius > 200 && this.dataForm.radius <= 500) {
return 14
} else if (this.dataForm.radius > 500 && this.dataForm.radius <= 1000) {
return 13
} else if (this.dataForm.radius > 1000 && this.dataForm.radius <= 2000) {
return 12
} else if (this.dataForm.radius > 2000 && this.dataForm.radius <= 5000) {
return 11
}
}
},
components: {
AddressCheck
}
}
</script>

167
src/views/modules/section/sectioncategory-add-or-update.vue
View File

@ -0,0 +1,167 @@
<template>
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '160px' : '120px'">
<el-form-item label="分类名称" prop="name">
<el-input v-model="dataForm.name" placeholder="分类名称"></el-input>
</el-form-item>
<el-form-item label="分类编码" prop="code">
<el-input v-model="dataForm.code" placeholder="分类编码"></el-input>
</el-form-item>
<el-form-item label="所属版块"
prop="sectionCode">
<el-select v-model="dataForm.sectionCode"
placeholder="所属版块" style="width: 100%">
<el-option v-for="item in options"
:key="item.dictValue"
:label="item.dictName"
:value="item.dictValue">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="前端样式" prop="frontStyle">
<el-input v-model="dataForm.frontStyle" placeholder="前端样式"></el-input>
</el-form-item>
<el-form-item label="排序" prop="sort">
<el-input-number v-model="dataForm.sort" controls-position="right" :min="0" :label="$t('dict.sort')" placeholder="排序 从小到大"></el-input-number>
</el-form-item>
<el-form-item label="扩展字段" prop="extend">
<el-input type="textarea" maxlength="200" show-word-limit v-model="dataForm.extend" placeholder="扩展字段"></el-input>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input type="textarea" maxlength="200" :rows="4" show-word-limit v-model="dataForm.remark" placeholder="备注"></el-input>
</el-form-item>
</el-form>
<template slot="footer">
<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button>
</template>
</el-dialog>
</template>
<script>
import debounce from 'lodash/debounce'
export default {
data () {
return {
visible: false,
dataForm: {
id: '',
name: '',
code: '',
sectionCode: '',
frontStyle: '',
sort: '',
extend: '',
remark: '',
delFlag: '',
revision: '',
createdBy: '',
createdTime: '',
updatedBy: '',
updatedTime: '',
},
options:[]
}
},
computed: {
dataRule () {
return {
name: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
code: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
sectionCode: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
frontStyle: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
sort: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
extend: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
remark: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
],
delFlag: [
{ 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' }
]
}
}
},
methods: {
init () {
this.visible = true;
this.getOptions();
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
this.getInfo()
}
})
},
// 获取信息
getInfo () {
this.$http.get(`/property/sectioncategory/${this.dataForm.id}`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.dataForm = {
...this.dataForm,
...res.data
}
}).catch(() => {})
},
getOptions () {
this.$http.get(`/sys/dict/listSimple/function_setcion`).then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data
console.log(this.options)
}).catch(() => {})
},
// 表单提交
dataFormSubmitHandle: debounce(function () {
this.$refs['dataForm'].validate((valid) => {
if (!valid) {
return false
}
this.$http[!this.dataForm.id ? 'post' : 'put']('/property/sectioncategory/', this.dataForm).then(({ data: res }) => {
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')
}
})
}).catch(() => {})
})
}, 1000, { 'leading': true, 'trailing': false })
}
}
</script>

94
src/views/modules/section/sectioncategory.vue
View File

@ -0,0 +1,94 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-__sectioncategory}">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()" clearable>
<el-form-item label="分类名称">
<el-input v-model="dataForm.name" clearable></el-input>
</el-form-item>
<el-form-item label="所属版块"
prop="sectionCode">
<el-select v-model="dataForm.sectionCode"
placeholder="所属版块" style="width: 100%" clearable>
<el-option v-for="item in options"
:key="item.dictValue"
:label="item.dictName"
:value="item.dictValue">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission('section:sectioncategory:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
</el-form-item>
<el-form-item>
<el-button v-if="$hasPermission('section:sectioncategory:delete')" type="danger" @click="deleteHandle()">{{ $t('deleteBatch') }}</el-button>
</el-form-item>
</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="name" label="分类名称" header-align="center" align="center"></el-table-column>
<el-table-column prop="code" label="分类编码" header-align="center" align="center"></el-table-column>
<el-table-column prop="sectionCode" label="所属版块编码" header-align="center" align="center"></el-table-column>
<el-table-column prop="frontStyle" 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('section:sectioncategory:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
<el-button v-if="$hasPermission('section:sectioncategory:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
:current-page="page"
:page-sizes="[10, 20, 50, 100]"
:page-size="limit"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="pageSizeChangeHandle"
@current-change="pageCurrentChangeHandle">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</el-card>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './sectioncategory-add-or-update'
export default {
mixins: [mixinViewModule],
data () {
return {
mixinViewModuleOptions: {
getDataListURL: '/property/sectioncategory/page',
getDataListIsPage: true,
deleteURL: '/property/sectioncategory',
deleteIsBatch: true
},
dataForm: {
id: ''
},
options: []
}
},
components: {
AddOrUpdate
},
mounted () {
this.getOptions()
},
methods: {
getOptions () {
this.$http.get('/sys/dict/listSimple/function_setcion').then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
}
this.options = res.data
console.log(this.options)
}).catch(() => {})
}
}
}
</script>
Write Preview
Loading…
Cancel
Save