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.
220 lines
7.7 KiB
220 lines
7.7 KiB
<template> |
|
<div class="page"> |
|
<div class="tool"> |
|
<div class="search-wrap"> |
|
<el-select v-model="field" @change="initData"> |
|
<el-option |
|
v-for="(item, i) in keywords" |
|
:key="i" |
|
:label="item.name" |
|
:value="item.id"> |
|
</el-option> |
|
</el-select> |
|
<el-input class="keyword" :placeholder="'请输入' + keywords.find(e => e.id === field).name" v-model.trim="keyword" clearable></el-input> |
|
</div> |
|
<div class="actions"> |
|
<el-button v-auth="'/site/list:内容管理:文章管理:删除'" @click="batchDel">批量删除</el-button> |
|
<el-button v-auth="'/site/list:内容管理:文章管理:新增'" type="primary" @click="add" >新增文章</el-button> |
|
</div> |
|
</div> |
|
<el-table :data="list" class="table" ref="table" header-align="center" @selection-change="handleSelectionChange" row-key="id" @sort-change="sortChange"> |
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
|
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column> |
|
<el-table-column show-overflow-tooltip prop="title" label="标题" align="center" min-width="150"></el-table-column> |
|
<el-table-column prop="classificationName" label="所属分类" align="center" min-width="120" sortable="custom"></el-table-column> |
|
<el-table-column prop="founderName" label="录入人" align="center" min-width="80"></el-table-column> |
|
<el-table-column prop="editorName" label="修改人" align="center" min-width="80"></el-table-column> |
|
<el-table-column prop="updateTime" label="修改日期" align="center" min-width="150" sortable="custom"></el-table-column> |
|
<el-table-column prop="createTime" label="发布日期" align="center" min-width="100" sortable="custom"></el-table-column> |
|
<el-table-column prop="workNumber" label="状态" align="center" min-width="80"> |
|
<template slot-scope="scope"> |
|
{{ scope.row.isRelease ? '已发布' : '草稿' }} |
|
</template> |
|
</el-table-column> |
|
<el-table-column label="操作" align="center" width="170"> |
|
<template slot-scope="scope"> |
|
<el-button v-auth="'/site/list:内容管理:文章管理:编辑'" type="text" @click="edit(scope.row)">编辑</el-button> |
|
<el-button v-auth="'/site/list:内容管理:文章管理:删除'" type="text" @click="handleDelete(scope.row)">删除</el-button> |
|
<el-switch |
|
v-if="scope.row.isRelease" |
|
class="m-l-10" |
|
v-model="scope.row.isDisable" |
|
:active-value="0" |
|
:inactive-value="1" |
|
@change="switchOff($event, scope.row, scope.$index)"> |
|
</el-switch> |
|
</template> |
|
</el-table-column> |
|
</el-table> |
|
<div class="pagination"> |
|
<el-pagination background @current-change="currentChange" :current-page="page" layout="total, prev, pager, next" :total="total"></el-pagination> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import util from '@/libs/util' |
|
export default { |
|
data() { |
|
return { |
|
field: 'title', |
|
keywords: [ |
|
{ |
|
id: 'title', |
|
name: '标题' |
|
}, |
|
{ |
|
id: 'founder', |
|
name: '录入人' |
|
}, |
|
{ |
|
id: 'editor', |
|
name: '修改人' |
|
} |
|
], |
|
keyword: '', |
|
list: [], |
|
page: 1, |
|
pageSize: 10, |
|
total: 0, |
|
modifiedTimeSort: '', |
|
releaseDateSort: 'desc', |
|
classificationNameSort: '', |
|
editTimeSort: '', |
|
multipleSelection: [], |
|
}; |
|
}, |
|
watch: { |
|
keyword: function(val) { |
|
clearTimeout(this.searchTimer) |
|
this.searchTimer = setTimeout(() => { |
|
this.initData() |
|
}, 500) |
|
} |
|
}, |
|
mounted() { |
|
this.getData() |
|
}, |
|
methods: { |
|
// 文章列表 |
|
getData() { |
|
const { keyword } = this |
|
const data = { |
|
pageNum: this.page, |
|
pageSize: this.pageSize, |
|
querySource: 3, //查询来源(3.中台 4.合伙人平台) |
|
classificationNameSort: this.classificationNameSort, |
|
editTimeSort: this.editTimeSort, |
|
createTimeSort: this.releaseDateSort, |
|
title: this.field === 'title' ? keyword : '', |
|
founderName: this.field === 'founder' ? keyword : '', |
|
editorName: this.field === 'editor' ? keyword : '' |
|
} |
|
this.$post(this.api.schemeList, data).then(({ data }) => { |
|
this.list = data.records |
|
this.total = +data.total |
|
}).catch(err => {}) |
|
}, |
|
currentChange(val) { |
|
this.page = val |
|
this.getData() |
|
}, |
|
handleSelectionChange(val) { |
|
this.multipleSelection = val |
|
}, |
|
initData() { |
|
this.$refs.table.clearSelection() |
|
this.page = 1 |
|
this.getData() |
|
}, |
|
// 批量删除 |
|
batchDel() { |
|
const list = this.multipleSelection |
|
if (list.length) { |
|
this.$confirm('确定要删除吗?', '提示', { |
|
type: 'warning' |
|
}).then(() => { |
|
const data = [] |
|
list.map(e => { |
|
data.push('ids=' + e.id) |
|
}) |
|
this.$post(`${this.api.batchDeletionScheme}?${data.join('&')}`).then(res => { |
|
this.$refs.table.clearSelection() |
|
util.successMsg("删除成功") |
|
this.getData() |
|
}).catch(res => {}) |
|
}).catch(() => {}) |
|
} else { |
|
util.errorMsg('请先选择数据 !') |
|
} |
|
}, |
|
// 删除 |
|
handleDelete(row) { |
|
this.$confirm('确定要删除吗?', '提示', { |
|
type: 'warning' |
|
}).then(() => { |
|
this.$post(`${this.api.batchDeletionScheme}?ids=${row.id}`).then(res => { |
|
util.successMsg('删除成功') |
|
this.getData() |
|
}).catch(res => {}) |
|
}).catch(() => {}) |
|
}, |
|
// 禁用启用 |
|
switchOff(val, row) { |
|
this.$post(`${this.api.enableOrDisableScheme}?id=${row.id}&isDisable=${val}`).then(res => {}).catch((res) => {}) |
|
}, |
|
// 新增 |
|
add() { |
|
this.$router.push(`/schemeSet`) |
|
}, |
|
// 排序回调 |
|
sortChange(column) { |
|
const { order } = column |
|
// 三个排序只能同时传1个,所以点了一个排序的时候要清除掉其余两个 |
|
if (column.prop === 'classificationName') { |
|
this.classificationNameSort = order ? order === 'ascending' ? 'asc' : 'desc' : '' |
|
if (order) { |
|
this.editTimeSort = '' |
|
this.releaseDateSort = '' |
|
this.sequenceSort = '' |
|
} |
|
} |
|
if (column.prop === 'updateTime') { |
|
this.editTimeSort = order ? order === 'ascending' ? 'asc' : 'desc' : '' |
|
if (order) { |
|
this.classificationNameSort = '' |
|
this.releaseDateSort = '' |
|
this.sequenceSort = '' |
|
} |
|
} |
|
if (column.prop === 'createTime') { |
|
this.releaseDateSort = order ? order === 'ascending' ? 'asc' : 'desc' : '' |
|
if (order) { |
|
this.editTimeSort = '' |
|
this.classificationNameSort = '' |
|
this.sequenceSort = '' |
|
} |
|
} |
|
if (column.prop === 'sequence') { |
|
this.sequenceSort = order ? order === 'ascending' ? 'asc' : 'desc' : '' |
|
if (order) { |
|
this.editTimeSort = '' |
|
this.releaseDateSort = '' |
|
this.classificationNameSort = '' |
|
} |
|
} |
|
this.getData() |
|
}, |
|
// 编辑 |
|
edit(row) { |
|
this.$router.push(`/schemeSet?id=${row.id}`) |
|
}, |
|
} |
|
}; |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.m-l-10 { |
|
margin-left: 10px; |
|
} |
|
</style> |