Skip to content

P
project-road-admin
提交 dd218558 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

update

上级 0f3e8c1c
隐藏空白字符变更
内嵌 并排
正在显示 包含 371 行增加 和 45 行删除
src/modules/banner/views/Update.vue
浏览文件 @ dd218558
......@@ -67,6 +67,7 @@
<pages v-if="ruleForm.type == '2'" @selectionConfirm="pagesSelectionConfirm" :selectData="pagesList"></pages>
<div style="padding: 0 20px">
<el-input v-if="ruleForm.type == '3'" v-model="ruleForm.url" placeholder="请输入链接"></el-input>
<el-button style="margin-top: 20px;" @click="drawer = false" type="primary">确认</el-button>
</div>
</el-drawer>
</div>
......
src/modules/menu/api.js
浏览文件 @ dd218558
......@@ -35,42 +35,16 @@ export function deleteMenu(data) {
return httpRequest.post('/api/road/v1/backend/menu/delete', data)
}
// /**
// * 获取应用列表
// */
// export function getAppList(params) {
// return httpRequest.get('/api/register/v1/activity/index', { params })
// }
// /**
// * 新建报名
// */
// export function createRegister(data) {
// return httpRequest.post('/api/register/v1/activity/create', data)
// }
// /**
// * 报名详情
// */
// export function getRegisterDetail(params) {
// return httpRequest.get('/api/register/v1/activity/view', { params })
// }
// /**
// * 更新报名
// */
// export function updateRegister(data) {
// return httpRequest.post('/api/register/v1/activity/update', data)
// }
/**
* 获取应用列表
*/
export function getEssayList(params) {
return httpRequest.get('/api/road/v1/backend/doc/list', { params })
}
// /**
// * 删除报名
// */
// export function deleteRegister(data) {
// return httpRequest.post('/api/register/v1/activity/delete', data)
// }
// /**
// * 停止活动
// */
// export function stopRegister(data) {
// return httpRequest.post('/api/register/v1/activity/drop', data)
// }
/**
* 获pages列表
*/
export function getPagesList(params) {
return httpRequest.get('/api/road/v1/backend/page/list', { params })
}
src/modules/menu/components/essay.vue 0 → 100644
浏览文件 @ dd218558
<template>
<app-card class="register-box">
<app-list highlight-current-row @current-change="selectionChange" v-bind="tableOptions" ref="list">
<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:200px;height:100px;`"></div>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getEssayList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getEssayList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '封面图', slots: 'picture', align: 'center', width: '170px' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '摘要', prop: 'remark', align: 'center' },
{ label: '备注', prop: 'comment', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
console.log(111, selection)
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/menu/components/pages.vue 0 → 100644
浏览文件 @ dd218558
<template>
<app-card class="register-box">
<app-list highlight-current-row @current-change="selectionChange" v-bind="tableOptions" ref="list">
<!-- <div class="line"></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>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getPagesList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getPagesList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/menu/views/Update.vue
浏览文件 @ dd218558
......@@ -7,7 +7,7 @@
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
style="width: 40%; margin: 0 auto"
style="width: 80%; margin: 0 auto"
>
<el-form-item label="菜单名称" prop="title">
<el-input v-model="ruleForm.title"></el-input>
......@@ -23,6 +23,32 @@
</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>{{ ruleForm.type == '1' ? '关联图文' : ruleForm.type == '2' ? '关联页面' : '跳转链接' }}</span>
</div>
<app-list v-if="ruleForm.type == '1'" v-bind="essayTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleEssayDelete(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>
<app-list v-if="ruleForm.type == '2'" 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>
<div v-if="ruleForm.type == '3'">{{ ruleForm.url }}</div>
</el-card>
</el-form-item>
<el-form-item>
<div style="padding-top: 20px">
......@@ -32,28 +58,39 @@
</el-form-item>
</el-form>
</app-card>
<el-drawer size="40%" :visible.sync="drawer" :direction="direction">
<el-drawer size="60%" :visible.sync="drawer" :direction="direction">
<div style="padding: 0 20px">
<el-tabs v-model="activeName">
<el-tabs v-model="ruleForm.type">
<el-tab-pane label="关联图文" name="1"></el-tab-pane>
<el-tab-pane label="关联页面" name="2"></el-tab-pane>
<el-tab-pane label="跳转链接" name="3"></el-tab-pane>
</el-tabs>
</div>
<essay v-if="ruleForm.type == '1'" @selectionConfirm="essaySelectionConfirm" :selectData="essayList"></essay>
<pages v-if="ruleForm.type == '2'" @selectionConfirm="pagesSelectionConfirm" :selectData="pagesList"></pages>
<div style="padding: 0 20px">
<el-input v-if="ruleForm.type == '3'" v-model="ruleForm.url" placeholder="请输入链接"></el-input>
<el-button style="margin-top: 20px;" @click="drawer = false" type="primary">确认</el-button>
</div>
</el-drawer>
</div>
</template>
<script>
import essay from '../components/essay.vue'
import pages from '../components/pages.vue'
import UploadImage from '@/components/upload/UploadImage.vue'
import { createMenu, getDetails, updateMenu } from '../api'
export default {
components: {
UploadImage
UploadImage,
essay,
pages
},
data() {
return {
activeName: '1',
essayList: [],
pagesList: [],
status: true,
drawer: false,
direction: 'rtl',
......@@ -61,7 +98,7 @@ export default {
title: '',
url: '',
picture: '',
type: '',
type: '1',
status: true,
relations_id: '',
comment: ''
......@@ -76,12 +113,70 @@ export default {
computed: {
id() {
return this.$route.query.id
},
essayTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '封面图', slots: 'picture', align: 'center', width: '170px' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '摘要', prop: 'remark', align: 'center' },
{ label: '备注', prop: 'comment', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.essayList
}
},
pagesTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.pagesList
}
}
},
methods: {
// 删除essay关联
handleEssayDelete(row) {
const findIndex = this.essayList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.essayList.splice(findIndex, 1)
}
},
// 删除pages关联
handlePagesDelete(row) {
const findIndex = this.pagesList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.pagesList.splice(findIndex, 1)
}
},
// 图文选择
essaySelectionConfirm(value) {
this.drawer = false
this.essayList = [value]
},
// 页面关联
pagesSelectionConfirm(value) {
this.drawer = false
this.pagesList = [value]
},
// 提交
submitForm() {
this.ruleForm.type = this.activeName
if (this.ruleForm.type === '1') {
this.ruleForm.relations_id = this.essayList.length ? this.essayList[0].id : ''
}
if (this.ruleForm.type === '2') {
this.ruleForm.relations_id = this.pagesList.length ? this.pagesList[0].id : ''
}
this.ruleForm.status = this.status ? 1 : 0
if (this.id) {
updateMenu(this.ruleForm).then(res => {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论