blog的后端代码
view | history | commit | commitdiff
inleft
2022-02-09 9bcb19959eeb9da9bde2561e7278f6d0a55eb151
commit | author | age
9bcb19 1 <template>
I 2   <div>
3     <x-card v-if="hasPerm('sysNotice:page')">
4       <div slot="content" class="table-page-search-wrapper">
5         <a-form layout="inline">
6           <a-row :gutter="48">
7             <a-col :md="8" :sm="24">
8               <a-form-item label="关键词" >
9                 <a-input v-model="queryParam.searchValue" allow-clear placeholder="请输入标题、内容"/>
10               </a-form-item>
11             </a-col>
12             <a-col :md="8" :sm="24">
13               <a-form-item label="类型" >
14                 <a-select v-model="queryParam.type" placeholder="请选择类型" allow-clear >
15                   <a-select-option v-for="(item,index) in typeDictTypeDropDown" :key="index" :value="item.code" >{{ item.name }}</a-select-option>
16                 </a-select>
17               </a-form-item>
18             </a-col>
19             <a-col :md="8" :sm="24">
20               <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
21               <a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
22             </a-col>
23           </a-row>
24         </a-form>
25       </div>
26     </x-card>
27     <a-card :bordered="false">
28       <s-table
29         ref="table"
30         :columns="columns"
31         :data="loadData"
32         :alert="false"
33         :rowKey="(record) => record.id"
34         :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
35       >
36         <template slot="operator" v-if="hasPerm('sysNotice:add')">
37           <a-button @click="$refs.addForm.add()" icon="plus" type="primary" v-if="hasPerm('sysNotice:add')" >新增公告</a-button>
38         </template>
39         <span slot="status" slot-scope="text">
40           {{ 'notice_status' | dictType(text) }}
41         </span>
42         <span slot="type" slot-scope="text">
43           {{ 'notice_type' | dictType(text) }}
44         </span>
45         <span slot="action" slot-scope="text, record">
46           <div v-if="record.status == 0">
47             <a v-if="hasPerm('sysNotice:detail')" @click="$refs.detailForm.detail(record)">查看</a>
48             <a-divider type="vertical" v-if="hasPerm('sysNotice:detail') & hasPerm('sysNotice:edit')"/>
49             <a v-if="hasPerm('sysNotice:edit')" @click="$refs.editForm.edit(record)">编辑</a>
50             <a-divider type="vertical" v-if="hasPerm('sysNotice:edit') & hasPerm('sysNotice:changeStatus')"/>
51             <a-popconfirm v-if="hasPerm('sysNotice:changeStatus')" placement="topRight" title="确认发布该信息？" @confirm="() => editNoticeStatus(1,record)">
52               <a>发布</a>
53             </a-popconfirm>
54           </div>
55           <div v-if="record.status == 1">
56             <a v-if="hasPerm('sysNotice:detail')" @click="$refs.detailForm.detail(record)">查看</a>
57             <a-divider type="vertical" v-if="hasPerm('sysNotice:detail') & hasPerm('sysNotice:changeStatus')"/>
58             <a-popconfirm v-if="hasPerm('sysNotice:changeStatus')" placement="topRight" title="确认撤回该信息？" @confirm="() => editNoticeStatus(2,record)">
59               <a>撤回</a>
60             </a-popconfirm>
61           </div>
62           <div v-if="record.status == 2">
63             <a v-if="hasPerm('sysNotice:detail')" @click="$refs.detailForm.detail(record)">查看</a>
64             <a-divider type="vertical" v-if="hasPerm('sysNotice:detail') & hasPerm('sysNotice:delete')"/>
65             <a-popconfirm v-if="hasPerm('sysNotice:delete')" placement="topRight" title="确认删除？" @confirm="() => sysNoticeDelete(record)">
66               <a>删除</a>
67             </a-popconfirm>
68           </div>
69         </span>
70       </s-table>
71       <add-form ref="addForm" @ok="handleOk" v-if="hasPerm('sysNotice:add')"/>
72       <edit-form ref="editForm" @ok="handleOk" v-if="hasPerm('sysNotice:edit')"/>
73       <detail-form ref="detailForm" @ok="handleOk" v-if="hasPerm('sysNotice:detail')"/>
74       <div ref="editor"></div>
75     </a-card>
76   </div>
77 </template>
78 <script>
79   import { STable, XCard } from '@/components'
80   import { sysNoticePage, sysNoticeDelete, sysNoticeChangeStatus } from '@/api/modular/system/noticeManage'
81   import addForm from './addForm'
82   import editForm from './editForm'
83   import detailForm from './detailForm'
84   export default {
85     components: {
86       XCard,
87       STable,
88       addForm,
89       editForm,
90       detailForm
91     },
92     data () {
93       return {
94         // 高级搜索 展开/关闭
95         advanced: false,
96         // 查询参数
97         queryParam: {},
98         // 表头
99         columns: [
100           {
101             title: '标题',
102             dataIndex: 'title'
103           },
104           {
105             title: '类型',
106             dataIndex: 'type',
107             scopedSlots: { customRender: 'type' }
108           },
109           {
110             title: '状态',
111             dataIndex: 'status',
112             scopedSlots: { customRender: 'status' }
113           }
114         ],
115         // 加载数据方法 必须为 Promise 对象
116         loadData: parameter => {
117           return sysNoticePage(Object.assign(parameter, this.queryParam)).then((res) => {
118             return res.data
119           })
120         },
121         selectedRowKeys: [],
122         selectedRows: [],
123         statusDictTypeDropDown: [], // 0草稿 1发布 2撤回 3删除
124         typeDictTypeDropDown: []// 0通知 1公告
125       }
126     },
127     created () {
128       this.sysDictTypeDropDown()// 先注释
129       if (this.hasPerm('sysNotice:changeStatus') || this.hasPerm('sysNotice:edit') || this.hasPerm('sysNotice:delete')) {
130         this.columns.push({
131           title: '操作',
132           width: '300px',
133           dataIndex: 'action',
134           scopedSlots: { customRender: 'action' }
135         })
136       }
137     },
138     methods: {
139       /**
140        * 获取字典数据
141        */
142       sysDictTypeDropDown () {
143         this.statusDictTypeDropDown = this.$options.filters['dictData']('notice_status')
144         this.typeDictTypeDropDown = this.$options.filters['dictData']('notice_type')
145       },
146       /**
147        * 修改状态
148        */
149       editNoticeStatus (code, record) {
150         sysNoticeChangeStatus({ id: record.id, status: code.toString() }).then(res => {
151           if (res.success) {
152             this.$message.success('操作成功')
153             this.$refs.table.refresh()
154           } else {
155             this.$message.error('操作失败：' + res.message)
156           }
157         })
158       },
159       /**
160        * 提交
161        */
162       sysNoticeDelete (record) {
163         sysNoticeDelete(record).then((res) => {
164           if (res.success) {
165             this.$message.success('删除成功')
166             this.$refs.table.refresh()
167           } else {
168             this.$message.error('删除失败：' + res.message)
169           }
170         }).catch((err) => {
171           this.$message.error('删除错误：' + err.message)
172         })
173       },
174       handleOk () {
175         this.$refs.table.refresh()
176       },
177       onSelectChange (selectedRowKeys, selectedRows) {
178         this.selectedRowKeys = selectedRowKeys
179         this.selectedRows = selectedRows
180       }
181     }
182   }
183 </script>
184 <style lang="less">
185   .table-operator {
186     margin-bottom: 18px;
187   }
188   button {
189     margin-right: 8px;
190   }
191 </style>