282 lines
10 KiB
HTML
282 lines
10 KiB
HTML
|
{{template "header" }}
|
||
|
|
<style>
|
||
|
|
.el-form-item__content{
|
||
|
|
line-height: unset;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div id="app" style="width:100%">
|
||
|
|
<template>
|
||
|
|
<el-container>
|
||
|
|
|
||
|
|
<el-main class="mainMain">
|
||
|
|
<div style="margin-bottom: 10px;">
|
||
|
|
<el-button @click="cateForm.id='';cateForm.cate_name='';showNewsForm=false;showCateForm=true;" type="primary" size="small">添加分类</el-button>
|
||
|
|
<el-button @click="initNewsForm()" type="primary" size="small">添加文章</el-button>
|
||
|
|
</div>
|
||
|
|
<el-form v-show="showCateForm" label-width="80px" style="width: 500px;border-radius: 4px;padding: 30px 20px 0px 20px;border: 1px dashed #ccc">
|
||
|
|
<el-form-item label="分类名称">
|
||
|
|
<el-input v-model="cateForm.cate_name"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
|
||
|
|
<el-form-item>
|
||
|
|
<el-button @click="addCate()" type="primary" size="small">保存</el-button>
|
||
|
|
<el-button @click="showCateForm=false;" type="info" size="small">关闭</el-button>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
|
||
|
|
|
||
|
|
<el-form v-show="showNewsForm" label-width="80px" style="width: 880px;border-radius: 4px;padding: 30px 20px 0px 20px;border: 1px dashed #ccc">
|
||
|
|
|
||
|
|
<el-form-item label="标题">
|
||
|
|
<el-input v-model="newsForm.title"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
|
||
|
|
<el-form-item label="分类">
|
||
|
|
<el-select v-model="newsForm.cat_id" style="width: 300px">
|
||
|
|
<el-option :label="item.cat_name" :value="item.id" v-for="item in cateList" v-bind:key="item.id"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
|
||
|
|
|
||
|
|
<el-form-item label="内容">
|
||
|
|
<script id="container" name="content" style="height: 380px" type="text/plain"></script>
|
||
|
|
<el-input rows="15" type="textarea" v-model="newsForm.content" style="display: none"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item>
|
||
|
|
<el-button @click="addCmsNews" type="primary" size="small">保存</el-button>
|
||
|
|
<el-button @click="showNewsForm=false;" type="info" size="small">关闭</el-button>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
|
||
|
|
|
||
|
|
<div style="margin-top: 20px">
|
||
|
|
<el-tag type="warning" style="margin-right: 10px;cursor: pointer;"
|
||
|
|
:effect="allType"
|
||
|
|
@click="selectAll"
|
||
|
|
>所有</el-tag>
|
||
|
|
<el-tag
|
||
|
|
type="warning"
|
||
|
|
style="margin-right: 10px;cursor: pointer;"
|
||
|
|
v-for="item in cateList"
|
||
|
|
:key="item.id"
|
||
|
|
closable
|
||
|
|
@close="delCmsCate(item)"
|
||
|
|
@click="selectCate(item)"
|
||
|
|
>
|
||
|
|
<{item.cat_name}>
|
||
|
|
</el-tag>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<el-table
|
||
|
|
:data="newsList.list"
|
||
|
|
border
|
||
|
|
style="width: 100%;margin-top: 10px;">
|
||
|
|
<el-table-column
|
||
|
|
prop="id"
|
||
|
|
label="ID">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column
|
||
|
|
prop="title"
|
||
|
|
label="标题">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column
|
||
|
|
prop="created_at"
|
||
|
|
label="时间">
|
||
|
|
</el-table-column>
|
||
|
|
|
||
|
|
<el-table-column
|
||
|
|
prop="id"
|
||
|
|
label="操作">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<el-button @click="editCmsNews(scope.row)" type="primary" size="small" icon="el-icon-edit" circle></el-button>
|
||
|
|
<el-button @click="deleteNews(scope.row.id)" type="primary" size="small" icon="el-icon-delete" circle></el-button>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
|
||
|
|
<el-pagination
|
||
|
|
background
|
||
|
|
@current-change="getCmsNews"
|
||
|
|
:current-page="newsList.page"
|
||
|
|
layout="prev,pager, next"
|
||
|
|
:page-size="newsList.pagesize"
|
||
|
|
:total="newsList.count">
|
||
|
|
</el-pagination>
|
||
|
|
</el-main>
|
||
|
|
|
||
|
|
</el-container>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
<script src="/static/js/ueditor/ueditor.config.js"></script>
|
||
|
|
<script src="/static/js/ueditor/ueditor.all.min.js"></script>
|
||
|
|
<script>
|
||
|
|
var LANG=checkLang();
|
||
|
|
new Vue({
|
||
|
|
el: '#app',
|
||
|
|
delimiters:["<{","}>"],
|
||
|
|
data: {
|
||
|
|
flyLang:KEFU_LANG[LANG],
|
||
|
|
window:window,
|
||
|
|
host:getBaseUrl(),
|
||
|
|
newsList:{},
|
||
|
|
cateForm:{
|
||
|
|
id:"",
|
||
|
|
cate_name:""
|
||
|
|
},
|
||
|
|
newsForm:{
|
||
|
|
id:"",
|
||
|
|
title:"",
|
||
|
|
content:'',
|
||
|
|
cat_id:"",
|
||
|
|
},
|
||
|
|
cateList:[],
|
||
|
|
showCateForm:false,
|
||
|
|
showNewsForm:false,
|
||
|
|
allType:'dark',
|
||
|
|
selectCateId:"",
|
||
|
|
ue:{},
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
//添加分类
|
||
|
|
addCate(){
|
||
|
|
var _this=this;
|
||
|
|
sendAjax("/system/cmsCate","post",{
|
||
|
|
cate_name:_this.cateForm.cate_name,
|
||
|
|
id:_this.cateForm.id
|
||
|
|
},function(res) {
|
||
|
|
_this.$message({
|
||
|
|
message: res.msg,
|
||
|
|
type: 'success'
|
||
|
|
});
|
||
|
|
_this.getCate();
|
||
|
|
});
|
||
|
|
},
|
||
|
|
//分类列表
|
||
|
|
getCate(){
|
||
|
|
var _this=this;
|
||
|
|
sendAjax("/system/cmsCate","get",{
|
||
|
|
},function(res) {
|
||
|
|
_this.cateList=res.result;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
//删除分类
|
||
|
|
delCmsCate(item){
|
||
|
|
var _this=this;
|
||
|
|
this.$confirm('此操作将进行删除, 是否继续?', '提示', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning'
|
||
|
|
}).then(function(){
|
||
|
|
sendAjax("/system/delCmsCate","get",{
|
||
|
|
id:item.id
|
||
|
|
},function(res) {
|
||
|
|
_this.$message({
|
||
|
|
message: res.msg,
|
||
|
|
type: 'success'
|
||
|
|
});
|
||
|
|
_this.getCate();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
},
|
||
|
|
//选中分类
|
||
|
|
selectCate(item){
|
||
|
|
this.allType='light';
|
||
|
|
this.showCateForm=true;
|
||
|
|
this.showNewsForm=false;
|
||
|
|
this.cateForm={
|
||
|
|
id:item.id,
|
||
|
|
cate_name:item.cat_name,
|
||
|
|
};
|
||
|
|
this.selectCateId=item.id;
|
||
|
|
this.getCmsNews();
|
||
|
|
},
|
||
|
|
//选择全部
|
||
|
|
selectAll(){
|
||
|
|
this.allType='dark';
|
||
|
|
this.selectCateId='';
|
||
|
|
this.getCmsNews();
|
||
|
|
this.showCateForm=false;
|
||
|
|
this.showNewsForm=false;
|
||
|
|
},
|
||
|
|
//内容列表
|
||
|
|
getCmsNews(page){
|
||
|
|
var _this=this;
|
||
|
|
if(!page) page=1;
|
||
|
|
var params={
|
||
|
|
pagesize:10,
|
||
|
|
page:page,
|
||
|
|
cat_id:_this.selectCateId,
|
||
|
|
};
|
||
|
|
sendAjax("/system/cmsNews","get",params,function(res) {
|
||
|
|
_this.newsList=res.result;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
initNewsForm(){
|
||
|
|
this.newsForm={
|
||
|
|
id:"",
|
||
|
|
title:"",
|
||
|
|
content:'',
|
||
|
|
cat_id:"",
|
||
|
|
};
|
||
|
|
this.showNewsForm=true;
|
||
|
|
this.showCateForm=false;
|
||
|
|
this.ue.setContent('');
|
||
|
|
},
|
||
|
|
//新增内容
|
||
|
|
addCmsNews(){
|
||
|
|
var _this=this;
|
||
|
|
this.newsForm.content=this.ue.getContent();
|
||
|
|
sendAjax("/system/cmsNews","post",this.newsForm,function(res) {
|
||
|
|
_this.$message({
|
||
|
|
message: res.msg,
|
||
|
|
type: 'success'
|
||
|
|
});
|
||
|
|
_this.initNewsForm();
|
||
|
|
_this.showNewsForm=false;
|
||
|
|
_this.getCmsNews();
|
||
|
|
});
|
||
|
|
},
|
||
|
|
//编辑内容
|
||
|
|
editCmsNews(row){
|
||
|
|
this.showNewsForm=true;
|
||
|
|
this.showCateForm=false;
|
||
|
|
this.newsForm.id=row.id;
|
||
|
|
this.newsForm.title=row.title;
|
||
|
|
this.newsForm.content=row.content;
|
||
|
|
this.ue.setContent(row.content);
|
||
|
|
this.newsForm.cat_id=parseInt(row.cat_id);
|
||
|
|
},
|
||
|
|
//删除内容
|
||
|
|
deleteNews(id){
|
||
|
|
var _this=this;
|
||
|
|
this.$confirm('此操作将进行删除, 是否继续?', '提示', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning'
|
||
|
|
}).then(function(){
|
||
|
|
sendAjax("/system/delCmsNews","get",{
|
||
|
|
id:id
|
||
|
|
},function(res) {
|
||
|
|
_this.$message({
|
||
|
|
message: res.msg,
|
||
|
|
type: 'success'
|
||
|
|
});
|
||
|
|
_this.getCmsNews();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted:function(){
|
||
|
|
},
|
||
|
|
created: function () {
|
||
|
|
this.getCate();
|
||
|
|
this.getCmsNews('');
|
||
|
|
this.ue = UE.getEditor('container');
|
||
|
|
}
|
||
|
|
})
|
||
|
|
</script>
|