提交 636817fe authored 作者: lihuihui's avatar lihuihui

update

上级 0ee2605e
...@@ -27,7 +27,8 @@ export default { ...@@ -27,7 +27,8 @@ export default {
{ name: 'Banner管理', path: '/banner/list', icon: 'el-icon-picture' }, { name: 'Banner管理', path: '/banner/list', icon: 'el-icon-picture' },
{ name: '功能区管理', path: '/menu/list', icon: 'el-icon-menu' }, { name: '功能区管理', path: '/menu/list', icon: 'el-icon-menu' },
{ name: '图文管理', path: '/essay/list', icon: 'el-icon-connection' }, { name: '图文管理', path: '/essay/list', icon: 'el-icon-connection' },
{ name: '页面管理', path: '/pages/list', icon: 'el-icon-postcard' } { name: '页面管理', path: '/pages/list', icon: 'el-icon-postcard' },
{ name: '通知管理', path: '/notice/list', icon: 'el-icon-chat-line-square' }
] ]
} }
}, },
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
<el-switch v-model="row.status" @change="updateStatus(row)"> </el-switch> <el-switch v-model="row.status" @change="updateStatus(row)"> </el-switch>
</template> </template>
<template v-slot:sort-select="{ row }"> <template v-slot:sort-select="{ row }">
<el-select style="width: 70px;" v-model="row.sort" placeholder="请选择" @change="updateStatus(row)"> <el-select style="width: px;" v-model="row.sort" placeholder="请选择" @change="updateStatus(row)">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select> </el-select>
</template> </template>
......
...@@ -50,7 +50,7 @@ export function getMenuList(params) { ...@@ -50,7 +50,7 @@ export function getMenuList(params) {
} }
/** /**
* 获pages列表 * 获取应用列表
*/ */
export function getPagesList(params) { export function getPagesList(params) {
return httpRequest.get('/api/road/v1/backend/page/list', { params }) return httpRequest.get('/api/road/v1/backend/page/list', { params })
......
...@@ -84,54 +84,6 @@ ...@@ -84,54 +84,6 @@
</template> </template>
</app-list> </app-list>
</el-form-item> </el-form-item>
<!-- <el-form-item label="关联选择">
<el-button type="primary" @click="drawer = true">点击选择</el-button>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>Banner列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="bannerTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleBannerDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
</el-card>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>功能区列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="menuTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleMenuDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:50px;height:40px;`"
></div>
</template>
</app-list>
</el-card>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>页面列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="pagesTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handlePagesDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
</el-card>
</el-form-item> -->
<el-form-item label="是否启用" prop="status"> <el-form-item label="是否启用" prop="status">
<el-switch v-model="status"></el-switch> <el-switch v-model="status"></el-switch>
</el-form-item> </el-form-item>
......
import httpRequest from '@/utils/axios'
/**
* 新建通知
*/
export function createNotice(data) {
return httpRequest.post('/api/road/v1/backend/message/create', data)
}
/**
* 获取应用列表
*/
export function getAppList(params) {
return httpRequest.get('/api/road/v1/backend/message/list', { params })
}
/**
* 更新通知
*/
export function updateNotice(data) {
return httpRequest.post('/api/road/v1/backend/message/update', data)
}
/**
* 获取通知详情
*/
export function getDetails(params) {
return httpRequest.get('/api/road/v1/backend/message/view', { params })
}
/**
* 删除通知
*/
export function deleteNotice(data) {
return httpRequest.post('/api/road/v1/backend/message/delete', data)
}
import AppLayout from '@/components/layout/Index.vue'
const routes = [
{
path: '/notice',
component: AppLayout,
children: [
{ path: 'list', component: () => import('./views/List.vue') },
{ path: 'update', component: () => import('./views/Update.vue') }
]
}
]
export { routes }
<template>
<div>
<div class="breadcrumb">图文管理</div>
<app-card class="register-box">
<app-list v-bind="tableOptions" ref="list">
<div class="line"></div>
<div class="btn-box">
<el-button type="primary" @click="$router.push({ path: '/notice/update' })">发布通知</el-button>
</div>
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
<template v-slot:picture="{ row }">
<div :style="`background-image:url(${row.picture});background-size: cover;width:170px;height:80px;`"></div>
</template>
<template v-slot:release-status="{ row }">
<el-switch v-model="row.status" @change="updateStatus(row)"> </el-switch>
</template>
<template v-slot:sort-select="{ row }">
<el-select style="width: 70px" v-model="row.sort" placeholder="请选择" @change="updateStatus(row)">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</template>
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleEdit(row)">编辑</el-button>
<el-button type="text" @click="handleDelete(row)">删除</el-button>
</template>
</app-list>
</app-card>
</div>
</template>
<script>
// 接口
import { getAppList, deleteNotice } from '../api'
export default {
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: ''
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getAppList,
params: {
title: '',
status: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
res.map(item => {
item.status = !!parseInt(item.status)
return item
})
return res
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '发布时间:'
}
],
columns: [
{ label: '标题', prop: 'title' },
{ label: '摘要', prop: 'remark' },
{ label: 'id', prop: 'id' },
{ label: '创建时间', prop: 'created_time' },
{ label: '操作', slots: 'table-x' }
]
}
}
},
methods: {
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
// this.$refs.list.refetch(true)
}
},
handleEdit(row) {
this.$router.push({ path: '/notice/update', query: { id: row.id } })
},
handleDelete(row) {
deleteNotice({ id: row.id }).then(res => {
if (res.code === 0) {
this.$message({
message: '删除成功',
type: 'success'
})
this.$refs.list.refetch(true)
}
})
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
// border-top: 1px solid #D6D6D6;
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
<template>
<div class="create-box">
<div class="breadcrumb">
{{ !$route.query.id ? '新建通知' : '编辑通知' }}
</div>
<app-card>
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
style="width: 700px"
>
<el-form-item label="封面图" prop="picture">
<div class="upload-img-box">
<upload-image v-model="ruleForm.picture"></upload-image>
<div class="upload-img-tips">
<div>只能上传jpg/png文件,且不超过500kb</div>
<div>建议竖图上传尺寸 96×120</div>
<div>建议横图上传尺寸 311×120</div>
</div>
</div>
</el-form-item>
<el-form-item label="标题" prop="title">
<el-input v-model="ruleForm.title"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="ruleForm.url"></el-input>
</el-form-item>
<el-form-item label="摘要">
<el-input v-model="ruleForm.remark"></el-input>
</el-form-item>
<el-form-item label="正文" prop="content">
<v-editor v-model="ruleForm.content"></v-editor>
</el-form-item>
<el-form-item>
<div style="padding-top: 20px; width: 200px; margin: 0 auto">
<el-button type="primary" @click="submitForm">确认</el-button>
<el-button @click="drawer = true">取消</el-button>
</div>
</el-form-item>
</el-form>
</app-card>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
import { createNotice, getDetails, updateNotice } from '../api'
import UploadImage from '@/components/upload/UploadImage.vue'
export default {
components: {
VEditor,
UploadImage
},
data() {
return {
ruleForm: {
title: '',
url: '',
picture: '',
remark: '',
content: ''
},
rules: {
title: [{ required: true, message: '请填写标题', trigger: 'blur' }],
picture: [{ required: true, message: '请上传封面', trigger: 'blur' }],
content: [{ required: true, message: '请输入正文', trigger: 'blur' }]
}
}
},
computed: {
id() {
return this.$route.query.id
}
},
methods: {
// 提交
submitForm() {
if (this.id) {
updateNotice(this.ruleForm).then(res => {
if (res.code === 0) {
this.$message({
message: '编辑成功',
type: 'success'
})
this.$router.go(-1)
}
})
} else {
createNotice(this.ruleForm).then(res => {
if (res.code === 0) {
this.$message({
message: '提交成功',
type: 'success'
})
this.$router.go(-1)
}
})
}
},
// 获取详情
getDetails() {
getDetails({ id: this.id }).then(res => {
this.status = !!parseInt(res.data.status)
this.ruleForm = res.data
this.bannerList = res.data.banners
this.menuList = res.data.menus
this.pagesList = res.data.pages
})
}
},
mounted() {
if (this.id) {
this.getDetails()
}
}
}
</script>
<style lang="scss" scoped>
.upload-img-box {
display: flex;
.upload-img-tips {
margin-left: 20px;
// padding-top: 10px;
div {
font-size: 12px;
line-height: 23px;
color: #606266;
}
}
}
.select-btn {
display: flex;
justify-content: space-between;
align-items: center;
height: 32px;
border: 1px solid rgba(0, 0, 0, 0.15);
padding: 0 17px;
width: fit-content;
cursor: pointer;
i {
color: #363636;
}
.text {
font-size: 14px;
color: #161616;
margin-left: 5px;
}
}
.tabs-nav {
display: flex;
padding: 10px 0;
.li {
line-height: 40px;
box-sizing: border-box;
font-size: 14px;
color: #161616;
margin-right: 50px;
cursor: pointer;
&.active {
font-weight: 600;
color: #1655b2;
border-bottom: 1px solid #1655b2;
}
}
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论