change
This commit is contained in:
@@ -0,0 +1,203 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<el-card shadow="never">
|
||||
<search :is-search-button="false">
|
||||
<search-item label="内容标题">
|
||||
<el-input v-model="pageForm.title" clearable placeholder="请输入标题" @keyup.enter.native="doSearch"></el-input>
|
||||
</search-item>
|
||||
<search-item label="所属栏目">
|
||||
<el-cascader v-model="pageForm.categoryId" :options="categoryOptions"
|
||||
:props="{value:'id',label:'name',children:'children',emitPath:false,checkStrictly:true}"
|
||||
clearable filterable style="width: 100%"></el-cascader>
|
||||
</search-item>
|
||||
<search-item label="发布状态">
|
||||
<el-select v-model="pageForm.isPublished" clearable placeholder="请选择">
|
||||
<el-option label="草稿" :value="0"></el-option>
|
||||
<el-option label="已发布" :value="1"></el-option>
|
||||
</el-select>
|
||||
</search-item>
|
||||
<search-item label="创建时间">
|
||||
<el-date-picker v-model="pageForm.createTime" type="datetimerange"
|
||||
start-placeholder="开始时间" end-placeholder="结束时间"
|
||||
value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%"></el-date-picker>
|
||||
</search-item>
|
||||
<div class="search-query">
|
||||
<el-button type="primary" size="medium" icon="el-icon-search" @click="doSearch">搜索</el-button>
|
||||
<el-button size="medium" @click="resetSearch">重置</el-button>
|
||||
</div>
|
||||
</search>
|
||||
</el-card>
|
||||
|
||||
<el-card class="mt10" shadow="never">
|
||||
<table-tool :app="this" label="风采内容列表">
|
||||
<el-button type="primary" size="medium" icon="el-icon-plus" @click="goCreate">发布内容</el-button>
|
||||
</table-tool>
|
||||
<el-table v-loading="tableLoading" :data="tableData" :size="tableSize" border>
|
||||
<el-table-column :index="indexMethod" type="index" label="序号" width="70" align="center"></el-table-column>
|
||||
<el-table-column prop="title" label="标题" min-width="240" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="categoryName" label="栏目" min-width="180">
|
||||
<template slot-scope="{row}">
|
||||
<span>{{row.categoryName}}</span>
|
||||
<el-tag v-if="categorySliderEnabled(row.categoryId)" type="success" size="mini"
|
||||
effect="plain" style="margin-left: 6px">轮播</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="unionName" label="所属工会" min-width="150" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="isTop" label="置顶" width="100" align="center">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.isTop === 1 ? 'success' : 'info'" size="mini">
|
||||
{{row.isTop === 1 ? '置顶' : '未置顶'}}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="viewCount" label="浏览量" width="100" align="center"></el-table-column>
|
||||
<el-table-column prop="sortOrder" label="排序" width="90" align="center"></el-table-column>
|
||||
<el-table-column label="状态" width="100" align="center">
|
||||
<template slot-scope="{row}">
|
||||
<el-tag :type="row.isPublished === 1 ? 'success' : 'info'" size="mini">
|
||||
{{row.isPublished === 1 ? '已发布' : '草稿'}}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="发布时间" width="170" align="center">
|
||||
<template slot-scope="{row}">{{formatTime(row.publishedAt)}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="270" align="center" fixed="right">
|
||||
<template slot-scope="{row}">
|
||||
<el-button size="mini" type="primary" @click="goEdit(row)">编辑</el-button>
|
||||
<el-button size="mini" :type="row.isPublished === 1 ? 'warning' : 'success'"
|
||||
@click="togglePublish(row)">
|
||||
{{row.isPublished === 1 ? '撤回' : '发布'}}
|
||||
</el-button>
|
||||
<el-button size="mini" type="danger" @click="remove(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</guava>
|
||||
</div>
|
||||
|
||||
<script nonce="${cspNonce!}">
|
||||
new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
apiBase: "/platform/spread/manage",
|
||||
categoryOptions: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 组装分页查询参数，将时间范围拆成后端字段。
|
||||
buildPageParams() {
|
||||
const params = Object.assign({}, this.pageForm)
|
||||
params.beginTime = params.createTime && params.createTime.length ? params.createTime[0] : ""
|
||||
params.endTime = params.createTime && params.createTime.length ? params.createTime[1] : ""
|
||||
delete params.createTime
|
||||
return params
|
||||
},
|
||||
// 加载内容管理分页数据。
|
||||
pageData() {
|
||||
this.tableLoading = true
|
||||
this.$axios.post(this.apiBase + "/pageData", this.buildPageParams()).then(resp => {
|
||||
if (resp.code === 0) {
|
||||
this.tableData = resp.data.list || []
|
||||
this.pageForm.totalCount = resp.data.totalCount || 0
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
}).finally(() => this.tableLoading = false)
|
||||
},
|
||||
// 加载可筛选的栏目树。
|
||||
loadCategories() {
|
||||
return this.$axios.post(this.apiBase + "/categoryTree").then(resp => {
|
||||
if (resp.code === 0) this.categoryOptions = resp.data || []
|
||||
})
|
||||
},
|
||||
// 判断内容所属栏目及其全部上级栏目是否都已开启轮播。
|
||||
categorySliderEnabled(categoryId) {
|
||||
const findPath = (nodes, parents) => {
|
||||
for (const node of nodes || []) {
|
||||
const path = parents.concat(node)
|
||||
if (node.id === categoryId) return path
|
||||
const childPath = findPath(node.children, path)
|
||||
if (childPath) return childPath
|
||||
}
|
||||
return null
|
||||
}
|
||||
const categoryPath = findPath(this.categoryOptions, [])
|
||||
return !!categoryPath && categoryPath.every(item => Number(item.slider) === 1)
|
||||
},
|
||||
// 清空筛选条件并重新查询。
|
||||
resetSearch() {
|
||||
this.pageForm.title = ""
|
||||
this.pageForm.categoryId = ""
|
||||
this.pageForm.isPublished = ""
|
||||
this.pageForm.createTime = []
|
||||
this.doSearch()
|
||||
},
|
||||
// 跳转到独立发布页面。
|
||||
goCreate() {
|
||||
this.navigate("/platform/spread/creation")
|
||||
},
|
||||
// 跳转到发布页面并携带编辑 ID。
|
||||
goEdit(row) {
|
||||
this.navigate("/platform/spread/creation?id=" + encodeURIComponent(row.id))
|
||||
},
|
||||
// 兼容 pjax 与普通页面跳转。
|
||||
navigate(url) {
|
||||
if (window.commonUtil && commonUtil.pjaxPush) {
|
||||
commonUtil.pjaxPush(url)
|
||||
} else {
|
||||
window.location.href = url
|
||||
}
|
||||
},
|
||||
// 发布已保存的草稿，或撤回已发布内容。
|
||||
togglePublish(row) {
|
||||
const status = row.isPublished === 1 ? 0 : 1
|
||||
const action = status === 1 ? "发布" : "撤回"
|
||||
this.$confirm("确定" + action + "“" + row.title + "”吗？", "提示", {type: "warning"}).then(() => {
|
||||
this.$axios.post(this.apiBase + "/doPublish", {id: row.id, status}).then(resp => {
|
||||
if (resp.code === 0) {
|
||||
this.$message.success(action + "成功")
|
||||
this.pageData()
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 删除内容前进行二次确认。
|
||||
remove(row) {
|
||||
this.$confirm("删除后无法恢复，确定删除该内容吗？", "提示", {type: "warning"}).then(() => {
|
||||
this.$axios.post(this.apiBase + "/doDelete", {id: row.id}).then(resp => {
|
||||
if (resp.code === 0) {
|
||||
this.$message.success("删除成功")
|
||||
this.pageData()
|
||||
} else {
|
||||
this.$message.warning(resp.msg)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 将毫秒时间戳格式化为日期时间。
|
||||
formatTime(value) {
|
||||
return value ? this.$moment(Number(value)).format("YYYY-MM-DD HH:mm:ss") : ""
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$set(this.pageForm, "title", "")
|
||||
this.$set(this.pageForm, "categoryId", "")
|
||||
this.$set(this.pageForm, "isPublished", "")
|
||||
this.$set(this.pageForm, "createTime", [])
|
||||
this.loadCategories().then(() => this.pageData())
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user