You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
270 lines
10 KiB
270 lines
10 KiB
<template>
|
|
<div class="app-container">
|
|
<!--工具栏-->
|
|
<div class="head-container">
|
|
<div v-if="crud.props.searchToggle">
|
|
<!-- 搜索 -->
|
|
<el-form
|
|
:inline="true"
|
|
class="demo-form-inline"
|
|
label-position="right"
|
|
label-width="90px"
|
|
label-suffix=":"
|
|
>
|
|
<el-form-item label="信息标题">
|
|
<el-input
|
|
v-model="query.notice_title"
|
|
clearable
|
|
size="mini"
|
|
placeholder="请输入标题"
|
|
@keyup.enter.native="crud.toQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="信息类型">
|
|
<el-select
|
|
v-model="query.notice_type"
|
|
clearable
|
|
size="mini"
|
|
placeholder="信息类型"
|
|
class="filter-item"
|
|
@change="hand"
|
|
>
|
|
<el-option
|
|
v-for="item in dict.notice_type"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="读取状态">
|
|
<el-select
|
|
v-model="query.have_read"
|
|
clearable
|
|
size="mini"
|
|
placeholder="读取状态"
|
|
class="filter-item"
|
|
@change="hand"
|
|
>
|
|
<el-option
|
|
v-for="item in dict.have_read_type"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="处理情况">
|
|
<el-select
|
|
v-model="query.deal_status"
|
|
clearable
|
|
size="mini"
|
|
placeholder="处理情况"
|
|
class="filter-item"
|
|
@change="hand"
|
|
>
|
|
<el-option
|
|
v-for="item in dict.deal_status"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<rrOperation />
|
|
</el-form>
|
|
</div>
|
|
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
|
|
<crudOperation :permission="permission">
|
|
<el-button
|
|
slot="right"
|
|
class="filter-item"
|
|
size="mini"
|
|
type="success"
|
|
icon="el-icon-circle-check"
|
|
:disabled="crud.selections.length === 0"
|
|
@click="changeRead(crud.selections)"
|
|
>
|
|
批量已读
|
|
</el-button>
|
|
</crudOperation>
|
|
<!--表单组件-->
|
|
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
|
|
<el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px">
|
|
<el-form-item label="信息标题" prop="notice_title">
|
|
<el-input v-model="form.notice_title" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="信息内容" prop="notice_content">
|
|
<el-input v-model="form.notice_content" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="信息类型" prop="notice_type">
|
|
<el-input v-model="form.notice_type" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="读取状态" prop="have_read">
|
|
<el-input v-model="form.have_read" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="读取时间">
|
|
<el-input v-model="form.read_time" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="处理状态" prop="deal_status">
|
|
<el-input v-model="form.deal_status" style="width: 370px;" />
|
|
</el-form-item>
|
|
<el-form-item label="创建时间" prop="create_time">
|
|
<el-input v-model="form.create_time" style="width: 370px;" />
|
|
</el-form-item>
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
|
<el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
<!--表格渲染-->
|
|
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
|
|
<el-table-column type="selection" width="55" />
|
|
<el-table-column prop="notice_title" label="信息标题" :min-width="flexWidth('notice_title',crud.data,'信息标题')" />
|
|
<el-table-column prop="notice_content" label="信息内容" :min-width="flexWidth('notice_content',crud.data,'信息内容')" />
|
|
<el-table-column prop="notice_type" label="信息类型" :min-width="flexWidth('notice_type',crud.data,'信息类型')">
|
|
<template slot-scope="scope">
|
|
<el-tag v-if="scope.row.notice_type == 1" type="danger">{{ dict.label.notice_type[scope.row.notice_type] }}</el-tag>
|
|
<el-tag v-else type="warning">{{ dict.label.notice_type[scope.row.notice_type] }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="have_read" label="读取状态" :min-width="flexWidth('have_read',crud.data,'读取状态')" >
|
|
<template slot-scope="scope">
|
|
<el-tag v-if="scope.row.have_read == 1" type="danger">{{ dict.label.have_read_type[scope.row.have_read] }}</el-tag>
|
|
<el-tag v-else type="success">{{ dict.label.have_read_type[scope.row.have_read] }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="read_time" label="读取时间" :min-width="flexWidth('read_time',crud.data,'读取时间')" />
|
|
<el-table-column prop="deal_status" label="处理状态" :min-width="flexWidth('deal_status',crud.data,'处理状态')" >
|
|
<template slot-scope="scope">
|
|
<el-tag v-if="scope.row.deal_status == 1" type="info">{{ dict.label.deal_status[scope.row.deal_status] }}</el-tag>
|
|
<el-tag v-else>{{ dict.label.deal_status[scope.row.deal_status] }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="create_time" label="创建时间" :min-width="flexWidth('create_time',crud.data,'创建时间')" />
|
|
<el-table-column v-permission="[]" label="操作" width="230px" align="center" fixed="right">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="text"
|
|
slot="left"
|
|
icon="el-icon-view"
|
|
@click="show(scope.row)">
|
|
查看
|
|
</el-button>
|
|
<el-button
|
|
type="text"
|
|
slot="left"
|
|
icon="el-icon-help"
|
|
@click="deal(scope.row)">
|
|
处理
|
|
</el-button>
|
|
<udOperation
|
|
:data="scope.row"
|
|
:permission="permission"
|
|
:is-visiable-edit="false"
|
|
style="display: inline"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<!--分页组件-->
|
|
<pagination />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import CRUD, { crud, form, header, presenter } from '@crud/crud'
|
|
import crudNotice from './sysNotice'
|
|
import rrOperation from '@crud/RR.operation.vue'
|
|
import crudOperation from '@crud/CRUD.operation.vue'
|
|
import udOperation from '@crud/UD.operation.vue'
|
|
import pagination from '@crud/Pagination.vue'
|
|
import { NOTICE_SHOW_MESSAGE, NOTICE_MESSAGE_UPDATE } from './VueBaseCode'
|
|
|
|
const defaultForm = { notice_id: null, notice_title: null, notice_content: null, notice_type: null, have_read: null, read_time: null, deal_status: null, create_time: null }
|
|
export default {
|
|
name: 'Notice',
|
|
dicts: ['deal_status', 'have_read_type', 'notice_type'],
|
|
components: { pagination, crudOperation, rrOperation, udOperation },
|
|
mixins: [presenter(), header(), form(defaultForm), crud()],
|
|
cruds() {
|
|
return CRUD({
|
|
title: '消息通知',
|
|
url: 'api/notice',
|
|
idField: 'notice_id',
|
|
sort: 'notice_id,desc',
|
|
crudMethod: { ...crudNotice },
|
|
optShow: {
|
|
add: false,
|
|
edit: false,
|
|
del: true,
|
|
download: false,
|
|
reset: true
|
|
}
|
|
})
|
|
},
|
|
data() {
|
|
return {
|
|
permission: {},
|
|
rules: {
|
|
notice_title: [
|
|
{ required: true, message: '信息标题不能为空', trigger: 'blur' }
|
|
],
|
|
notice_content: [
|
|
{ required: true, message: '信息内容不能为空', trigger: 'blur' }
|
|
],
|
|
notice_type: [
|
|
{ required: true, message: '信息类型不能为空', trigger: 'blur' }
|
|
],
|
|
have_read: [
|
|
{ required: true, message: '读取状态不能为空', trigger: 'blur' }
|
|
],
|
|
deal_status: [
|
|
{ required: true, message: '处理状态不能为空', trigger: 'blur' }
|
|
],
|
|
create_time: [
|
|
{ required: true, message: '创建时间不能为空', trigger: 'blur' }
|
|
]
|
|
}}
|
|
},
|
|
methods: {
|
|
// 钩子：在获取表格数据之前执行，false 则代表不获取数据
|
|
[CRUD.HOOK.beforeRefresh]() {
|
|
return true
|
|
},
|
|
show(record) {
|
|
if (record.have_read == '1') {
|
|
crudNotice.read(record.notice_id).then(() => {
|
|
record.have_read = '2'
|
|
this.$bus.emit(NOTICE_MESSAGE_UPDATE)
|
|
this.crud.toQuery()
|
|
})
|
|
}
|
|
this.$bus.emit(NOTICE_SHOW_MESSAGE, record)
|
|
},
|
|
hand(value) {
|
|
this.crud.toQuery()
|
|
},
|
|
deal(row) {
|
|
crudNotice.deal(row.notice_id).then(() => {
|
|
row.have_read = '2'
|
|
this.$bus.emit(NOTICE_MESSAGE_UPDATE)
|
|
})
|
|
this.crud.toQuery()
|
|
},
|
|
changeRead(data) {
|
|
const param = {}
|
|
param.data = data
|
|
param.have_read = '2'
|
|
crudNotice.changeRead(param).then(() => {
|
|
this.$bus.emit(NOTICE_MESSAGE_UPDATE)
|
|
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
|
|
this.crud.toQuery()
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|
|
|