parent
8ba50079cc
commit
e0cbcb37d0
18 changed files with 2466 additions and 2073 deletions
@ -1,237 +1,283 @@ |
|||||||
<template> |
<template> |
||||||
<div class="page"> |
<div class="page"> |
||||||
<div class="tool"> |
<div class="tool"> |
||||||
<ul class="filter"> |
<ul class="filter"> |
||||||
<li> |
<li> |
||||||
<label>站点选择</label> |
<label>站点选择</label> |
||||||
<el-select v-model="form.site" @change="initData"> |
<el-select v-model="form.site" |
||||||
<el-option label="不限" value=""></el-option> |
@change="initData"> |
||||||
<el-option |
<el-option label="不限" |
||||||
v-for="item in sites" |
value=""></el-option> |
||||||
:key="item.id" |
<el-option v-for="item in sites" |
||||||
:label="item.siteName" |
:key="item.id" |
||||||
:value="item.siteName"> |
:label="item.siteName" |
||||||
</el-option> |
:value="item.siteName"> |
||||||
</el-select> |
</el-option> |
||||||
</li> |
</el-select> |
||||||
<li> |
</li> |
||||||
<label>文件类型</label> |
<li> |
||||||
<el-select v-model="form.type" @change="initData"> |
<label>文件类型</label> |
||||||
<el-option |
<el-select v-model="form.type" |
||||||
v-for="item in types" |
@change="initData"> |
||||||
:key="item.name" |
<el-option v-for="item in types" |
||||||
:label="item.name" |
:key="item.name" |
||||||
:value="item.name"> |
:label="item.name" |
||||||
</el-option> |
:value="item.name"> |
||||||
</el-select> |
</el-option> |
||||||
</li> |
</el-select> |
||||||
</ul> |
</li> |
||||||
|
</ul> |
||||||
</div> |
</div> |
||||||
<div class="tool"> |
<div class="tool"> |
||||||
<div class="search-wrap"> |
<div class="search-wrap"> |
||||||
<el-select v-model="field" @change="initData"> |
<el-select v-model="field" |
||||||
<el-option |
@change="initData"> |
||||||
v-for="(item, i) in keywords" |
<el-option v-for="(item, i) in keywords" |
||||||
:key="i" |
:key="i" |
||||||
:label="item.name" |
:label="item.name" |
||||||
:value="item.id"> |
:value="item.id"> |
||||||
</el-option> |
</el-option> |
||||||
</el-select> |
</el-select> |
||||||
<el-input class="keyword" :placeholder="'请输入' + keywords.find(e => e.id === field).name" v-model.trim="keyword" clearable></el-input> |
<el-input class="keyword" |
||||||
|
:placeholder="'请输入' + keywords.find(e => e.id === field).name" |
||||||
|
v-model.trim="keyword" |
||||||
|
clearable></el-input> |
||||||
</div> |
</div> |
||||||
<div class="actions"> |
<div class="actions"> |
||||||
<el-button v-auth @click="batchDel">删除</el-button> |
<el-button v-auth |
||||||
|
@click="batchDel">删除</el-button> |
||||||
</div> |
</div> |
||||||
</div> |
</div> |
||||||
|
|
||||||
<el-table ref="table" :data="list" class="table" header-align="center" @selection-change="handleSelectionChange" row-key="id"> |
<el-table ref="table" |
||||||
<el-table-column type="selection" width="50" align="center" :reserve-selection="true" :selectable="row => !row.quote"></el-table-column> |
:data="list" |
||||||
<el-table-column type="index" width="60" label="ID"></el-table-column> |
class="table" |
||||||
<el-table-column prop="site" label="站点" min-width="180"></el-table-column> |
header-align="center" |
||||||
<el-table-column prop="quote" label="文章名称" min-width="180" show-overflow-tooltip> |
@selection-change="handleSelectionChange" |
||||||
|
row-key="id"> |
||||||
|
<el-table-column type="selection" |
||||||
|
width="50" |
||||||
|
align="center" |
||||||
|
:reserve-selection="true" |
||||||
|
:selectable="row => !row.quote"></el-table-column> |
||||||
|
<el-table-column type="index" |
||||||
|
width="60" |
||||||
|
label="ID"></el-table-column> |
||||||
|
<el-table-column prop="site" |
||||||
|
label="站点" |
||||||
|
min-width="180"></el-table-column> |
||||||
|
<el-table-column prop="quote" |
||||||
|
label="文章名称" |
||||||
|
min-width="180" |
||||||
|
show-overflow-tooltip> |
||||||
<template slot-scope="scope"> |
<template slot-scope="scope"> |
||||||
{{ scope.row.quote || '--' }} |
{{ scope.row.quote || '--' }} |
||||||
</template> |
</template> |
||||||
</el-table-column> |
</el-table-column> |
||||||
<el-table-column prop="fileName" label="名称" min-width="180" show-overflow-tooltip></el-table-column> |
<el-table-column prop="fileName" |
||||||
<el-table-column prop="type" label="文件类型" min-width="80"></el-table-column> |
label="名称" |
||||||
<el-table-column prop="format" label="格式" min-width="80"></el-table-column> |
min-width="180" |
||||||
<el-table-column prop="fileSize" label="大小" min-width="80"> |
show-overflow-tooltip></el-table-column> |
||||||
|
<el-table-column prop="type" |
||||||
|
label="文件类型" |
||||||
|
min-width="80"></el-table-column> |
||||||
|
<el-table-column prop="format" |
||||||
|
label="格式" |
||||||
|
min-width="80"></el-table-column> |
||||||
|
<el-table-column prop="fileSize" |
||||||
|
label="大小" |
||||||
|
min-width="80"> |
||||||
<template slot-scope="scope"> |
<template slot-scope="scope"> |
||||||
{{ (scope.row.fileSize / 1000).toFixed(2) }}kb |
{{ (scope.row.fileSize / 1000).toFixed(2) }}kb |
||||||
</template> |
</template> |
||||||
</el-table-column> |
</el-table-column> |
||||||
<el-table-column prop="createDate" label="上传时间" min-width="150"></el-table-column> |
<el-table-column prop="createDate" |
||||||
<el-table-column prop="uploader" label="上传人" min-width="100"></el-table-column> |
label="上传时间" |
||||||
<el-table-column prop="deleted" label="是否使用" min-width="100"> |
min-width="150"></el-table-column> |
||||||
|
<el-table-column prop="uploader" |
||||||
|
label="上传人" |
||||||
|
min-width="100"></el-table-column> |
||||||
|
<el-table-column prop="deleted" |
||||||
|
label="是否使用" |
||||||
|
min-width="100"> |
||||||
<template slot-scope="scope"> |
<template slot-scope="scope"> |
||||||
{{ scope.row.quote ? '是' : '否' }} |
{{ scope.row.quote ? '是' : '否' }} |
||||||
</template> |
</template> |
||||||
</el-table-column> |
</el-table-column> |
||||||
<el-table-column label="操作" width="150"> |
<el-table-column label="操作" |
||||||
|
width="150"> |
||||||
<template slot-scope="scope"> |
<template slot-scope="scope"> |
||||||
<el-button type="text" @click="show(scope.row, 'edit')">查看</el-button> |
<el-button type="text" |
||||||
<el-button v-auth type="text" :disabled="scope.row.quote !== ''" @click="del(scope.row)">删除</el-button> |
@click="show(scope.row, 'edit')">查看</el-button> |
||||||
<el-button v-auth type="text" @click="download(scope.row)">下载</el-button> |
<el-button v-auth |
||||||
|
type="text" |
||||||
|
:disabled="scope.row.quote !== ''" |
||||||
|
@click="del(scope.row)">删除</el-button> |
||||||
|
<el-button v-auth |
||||||
|
type="text" |
||||||
|
@click="download(scope.row)">下载</el-button> |
||||||
</template> |
</template> |
||||||
</el-table-column> |
</el-table-column> |
||||||
</el-table> |
</el-table> |
||||||
<div class="pagination"> |
<div class="pagination"> |
||||||
<el-pagination background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" :current-page="page"></el-pagination> |
<el-pagination background |
||||||
|
layout="total, prev, pager, next" |
||||||
|
:total="total" |
||||||
|
@current-change="handleCurrentChange" |
||||||
|
:current-page="page"></el-pagination> |
||||||
</div> |
</div> |
||||||
</div> |
</div> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import { mapState } from 'vuex' |
import { mapState } from 'vuex' |
||||||
import util from '@/libs/util' |
import Util from '@/libs/util' |
||||||
export default { |
export default { |
||||||
data() { |
data () { |
||||||
return { |
return { |
||||||
sites: [], |
sites: [], |
||||||
types: [ |
types: [ |
||||||
{ |
{ |
||||||
name: '不限' |
name: '不限' |
||||||
}, |
}, |
||||||
{ |
{ |
||||||
name: '图片' |
name: '图片' |
||||||
}, |
}, |
||||||
{ |
|
||||||
name: '视频' |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: '文档' |
|
||||||
} |
|
||||||
], |
|
||||||
field: 'fileName', |
|
||||||
keywords: [ |
|
||||||
{ |
|
||||||
id: 'fileName', |
|
||||||
name: '文件名称' |
|
||||||
}, |
|
||||||
{ |
|
||||||
id: 'uploader', |
|
||||||
name: '上传人' |
|
||||||
}, |
|
||||||
{ |
|
||||||
id: 'quote', |
|
||||||
name: '文章名称' |
|
||||||
} |
|
||||||
], |
|
||||||
keyword: '', |
|
||||||
form: { |
|
||||||
site: '', |
|
||||||
type: '不限' |
|
||||||
}, |
|
||||||
page: +this.$route.query.page || 1, |
|
||||||
pageSize: 10, |
|
||||||
total: 0, |
|
||||||
list: [], |
|
||||||
multipleSelection: [], |
|
||||||
}; |
|
||||||
}, |
|
||||||
computed: { |
|
||||||
...mapState('auth', [ |
|
||||||
'btns' |
|
||||||
]) |
|
||||||
}, |
|
||||||
watch: { |
|
||||||
keyword: function(val) { |
|
||||||
clearTimeout(this.searchTimer) |
|
||||||
this.searchTimer = setTimeout(() => { |
|
||||||
this.initData() |
|
||||||
}, 500) |
|
||||||
} |
|
||||||
}, |
|
||||||
mounted() { |
|
||||||
this.$store.commit('user/setCrumbs', [ |
|
||||||
{ |
{ |
||||||
name: '附件管理' |
name: '视频' |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: '文档' |
||||||
|
} |
||||||
|
], |
||||||
|
field: 'fileName', |
||||||
|
keywords: [ |
||||||
|
{ |
||||||
|
id: 'fileName', |
||||||
|
name: '文件名称' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 'uploader', |
||||||
|
name: '上传人' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 'quote', |
||||||
|
name: '文章名称' |
||||||
} |
} |
||||||
]) |
], |
||||||
|
keyword: '', |
||||||
|
form: { |
||||||
|
site: '', |
||||||
|
type: '不限' |
||||||
|
}, |
||||||
|
page: +this.$route.query.page || 1, |
||||||
|
pageSize: 10, |
||||||
|
total: 0, |
||||||
|
list: [], |
||||||
|
multipleSelection: [], |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapState('auth', [ |
||||||
|
'btns' |
||||||
|
]) |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
keyword: function (val) { |
||||||
|
clearTimeout(this.searchTimer) |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.initData() |
||||||
|
}, 500) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.$store.commit('user/setCrumbs', [ |
||||||
|
{ |
||||||
|
name: '附件管理' |
||||||
|
} |
||||||
|
]) |
||||||
|
this.getData() |
||||||
|
this.getSite() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData () { |
||||||
|
const { form } = this |
||||||
|
this.$post(this.api.listByPage, { |
||||||
|
page: this.page, |
||||||
|
limit: this.pageSize, |
||||||
|
quote: this.field === 'quote' ? this.keyword : '', |
||||||
|
fileName: this.field === 'fileName' ? this.keyword : '', |
||||||
|
uploader: this.field === 'uploader' ? this.keyword : '', |
||||||
|
site: form.site, |
||||||
|
type: form.type === '不限' ? '' : form.type |
||||||
|
}).then(({ data }) => { |
||||||
|
this.list = data.records |
||||||
|
this.total = +data.total |
||||||
|
}).catch(err => { }) |
||||||
|
}, |
||||||
|
// 获取站点列表 |
||||||
|
getSite () { |
||||||
|
this.$post(this.api.site, { |
||||||
|
page: 1, |
||||||
|
limit: 1000, |
||||||
|
siteName: '' |
||||||
|
}).then(({ data }) => { |
||||||
|
this.sites = Util.getSite(data.records) |
||||||
|
}).catch(e => { }) |
||||||
|
}, |
||||||
|
initData () { |
||||||
|
this.$refs.table.clearSelection() |
||||||
|
this.page = 1 |
||||||
this.getData() |
this.getData() |
||||||
this.getSite() |
|
||||||
}, |
}, |
||||||
methods: { |
// 查看 |
||||||
getData() { |
show (row) { |
||||||
const { form } = this |
const format = row.format |
||||||
this.$post(this.api.listByPage, { |
window.open((Util.isDoc(format) ? 'https://view.officeapps.live.com/op/view.aspx?src=' : '') + row.url) |
||||||
page: this.page, |
}, |
||||||
limit: this.pageSize, |
// 下载 |
||||||
quote: this.field === 'quote' ? this.keyword : '', |
download (row) { |
||||||
fileName: this.field === 'fileName' ? this.keyword : '', |
Util.downloadFile(row.fileName, row.url) |
||||||
uploader: this.field === 'uploader' ? this.keyword : '', |
}, |
||||||
site: form.site, |
// 删除 |
||||||
type: form.type === '不限' ? '' : form.type |
del (row) { |
||||||
}).then(({ data }) => { |
this.$confirm('确定要删除吗？', '提示', { |
||||||
this.list = data.records |
type: 'warning' |
||||||
this.total = +data.total |
}).then(() => { |
||||||
}).catch(err => {}) |
this.$post(this.api.delFile, Util.rsa([row.id])).then(res => { |
||||||
}, |
Util.successMsg('删除成功') |
||||||
// 获取站点列表 |
this.getData() |
||||||
getSite() { |
}).catch(res => { }) |
||||||
this.$post(this.api.site, { |
}).catch(() => { }) |
||||||
page: 1, |
}, |
||||||
limit: 1000, |
// 批量删除 |
||||||
siteName: '' |
batchDel () { |
||||||
}).then(({ data }) => { |
const list = this.multipleSelection |
||||||
this.sites = util.getSite(data.records) |
if (list.length) { |
||||||
}).catch(e => {}) |
|
||||||
}, |
|
||||||
initData() { |
|
||||||
this.$refs.table.clearSelection() |
|
||||||
this.page = 1 |
|
||||||
this.getData() |
|
||||||
}, |
|
||||||
// 查看 |
|
||||||
show(row) { |
|
||||||
const format = row.format |
|
||||||
window.open((util.isDoc(format) ? 'https://view.officeapps.live.com/op/view.aspx?src=' : '') + row.url) |
|
||||||
}, |
|
||||||
// 下载 |
|
||||||
download(row) { |
|
||||||
util.downloadFile(row.fileName, row.url) |
|
||||||
}, |
|
||||||
// 删除 |
|
||||||
del(row) { |
|
||||||
this.$confirm('确定要删除吗？', '提示', { |
this.$confirm('确定要删除吗？', '提示', { |
||||||
type: 'warning' |
type: 'warning' |
||||||
}).then(() => { |
}).then(() => { |
||||||
this.$del(`${this.api.delFile}`, [row.id]).then(res => { |
this.$del(this.api.delFile, Util.rsa(list.map(e => e.id))).then(res => { |
||||||
util.successMsg('删除成功') |
this.$refs.table.clearSelection() |
||||||
|
Util.successMsg('删除成功') |
||||||
this.getData() |
this.getData() |
||||||
}).catch(res => {}) |
}).catch(res => { }) |
||||||
}).catch(() => {}) |
}).catch(() => { }) |
||||||
}, |
} else { |
||||||
// 批量删除 |
Util.errorMsg('请先选择数据 ！') |
||||||
batchDel() { |
} |
||||||
const list = this.multipleSelection |
}, |
||||||
if (list.length) { |
handleSelectionChange (val) { |
||||||
this.$confirm('确定要删除吗？', '提示', { |
this.multipleSelection = val |
||||||
type: 'warning' |
}, |
||||||
}).then(() => { |
handleCurrentChange (val) { |
||||||
this.$del(`${this.api.delFile}`, list.map(e => e.id)).then(res => { |
this.page = val |
||||||
this.$refs.table.clearSelection() |
this.$router.push(`list?page=${val}`) |
||||||
util.successMsg('删除成功') |
this.getData() |
||||||
this.getData() |
}, |
||||||
}).catch(res => {}) |
} |
||||||
}).catch(() => {}) |
|
||||||
} else { |
|
||||||
util.errorMsg('请先选择数据 ！') |
|
||||||
} |
|
||||||
}, |
|
||||||
handleSelectionChange(val) { |
|
||||||
this.multipleSelection = val |
|
||||||
}, |
|
||||||
handleCurrentChange(val) { |
|
||||||
this.page = val |
|
||||||
this.$router.push(`list?page=${val}`) |
|
||||||
this.getData() |
|
||||||
}, |
|
||||||
} |
|
||||||
}; |
}; |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||||
|
|
||||||
</style> |
</style> |
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue