mirror of https://github.com/halo-dev/halo-admin
删除主题按钮
ruibaby
parent
4f4cab98be
commit
5db6073634
|
|
@ -0,0 +1,29 @@
|
|||
import service from '@/utils/service'
|
||||
|
||||
const baseUrl = '/admin/api/menus'
|
||||
|
||||
const menuApi = {}
|
||||
|
||||
menuApi.listAll = () => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
menuApi.create = menu => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
data: menu,
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
menuApi.delete = menuId => {
|
||||
return service({
|
||||
url: `${baseUrl}/${menuId}`,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
export default menuApi
|
||||
|
|
@ -1,20 +1,14 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row :gutter="12">
|
||||
<a-col
|
||||
:xl="10"
|
||||
:lg="10"
|
||||
:md="10"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
:style="{ 'padding-bottom': '12px' }">
|
||||
<a-col :xl="10" :lg="10" :md="10" :sm="24" :xs="24" :style="{ 'padding-bottom': '12px' }">
|
||||
<a-card title="添加菜单">
|
||||
<a-form layout="horizontal">
|
||||
<a-form-item label="名称：" help="*页面上所显示的名称">
|
||||
<a-input />
|
||||
<a-input v-model="menuToCreate.name" />
|
||||
</a-form-item>
|
||||
<a-form-item label="路径：" help="*菜单的路径">
|
||||
<a-input />
|
||||
<a-input v-model="menuToCreate.url" />
|
||||
</a-form-item>
|
||||
<a-form-item label="上级菜单：">
|
||||
<a-select>
|
||||
|
|
@ -22,32 +16,42 @@
|
|||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="排序编号：">
|
||||
<a-input type="number" />
|
||||
<a-input type="number" v-model="menuToCreate.sort" />
|
||||
</a-form-item>
|
||||
<a-form-item label="图标：" help="*请根据主题的支持选填">
|
||||
<a-input />
|
||||
<a-input v-model="menuToCreate.icon" />
|
||||
</a-form-item>
|
||||
<a-form-item label="打开方式：">
|
||||
<a-select defaultValue="_self">
|
||||
<a-select defaultValue="_self" v-model="menuToCreate.target">
|
||||
<a-select-option value="_self">当前窗口</a-select-option>
|
||||
<a-select-option value="_blank">新窗口</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary">保存</a-button>
|
||||
<a-button type="primary" @click="createMenu">保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col
|
||||
:xl="14"
|
||||
:lg="14"
|
||||
:md="14"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
:style="{ 'padding-bottom': '12px' }">
|
||||
<a-col :xl="14" :lg="14" :md="14" :sm="24" :xs="24" :style="{ 'padding-bottom': '12px' }">
|
||||
<a-card title="所有菜单">
|
||||
<a-table :columns="columns" :dataSource="data" :loading="loading"> </a-table>
|
||||
<a-table :columns="columns" :dataSource="menus" :loading="loading">
|
||||
<ellipsis :length="10" tooltip slot="name" slot-scope="text">
|
||||
{{ text }}
|
||||
</ellipsis>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="editMenu(record.id)">编辑</a>
|
||||
<a-divider type="vertical" />
|
||||
<a-popconfirm
|
||||
:title="'你确定要删除【' + record.name + '】菜单？'"
|
||||
@confirm="deleteMenu(record.id)"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
|
@ -55,10 +59,13 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { Ellipsis } from '@/components/Ellipsis'
|
||||
import menuApi from '@/api/menu'
|
||||
const columns = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name'
|
||||
dataIndex: 'name',
|
||||
scopedSlots: { customRender: 'name' }
|
||||
},
|
||||
{
|
||||
title: '路径',
|
||||
|
|
@ -71,14 +78,49 @@ const columns = [
|
|||
{
|
||||
title: '图标',
|
||||
dataIndex: 'icon'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
]
|
||||
export default {
|
||||
components: {
|
||||
Ellipsis
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
loading: false,
|
||||
columns
|
||||
loading: true,
|
||||
columns,
|
||||
menus: [],
|
||||
menuToCreate: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadMenus()
|
||||
},
|
||||
methods: {
|
||||
loadMenus() {
|
||||
menuApi.listAll().then(response => {
|
||||
this.menus = response.data.data
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
createMenu() {
|
||||
menuApi.create(this.menuToCreate).then(response => {
|
||||
this.loadMenus()
|
||||
})
|
||||
},
|
||||
editMenu(id) {
|
||||
this.$message.success('编辑' + id)
|
||||
},
|
||||
deleteMenu(id) {
|
||||
menuApi.delete(id).then(response => {
|
||||
this.$message.success('删除成功！')
|
||||
this.loadMenus()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,8 @@
|
|||
:sm="12"
|
||||
:xs="24"
|
||||
v-for="(theme, index) in themes"
|
||||
:key="index">
|
||||
:key="index"
|
||||
>
|
||||
<a-card :bodyStyle="{ padding: '14px' }">
|
||||
<img
|
||||
:alt="theme.properties.name"
|
||||
|
|
@ -22,19 +23,18 @@
|
|||
{{ theme.properties.name }}
|
||||
</span>
|
||||
<a-button-group class="theme-button">
|
||||
<a-button type="primary" v-if="activatedTheme==theme.key" disabled>已启用</a-button>
|
||||
<a-button type="primary" v-if="activatedTheme == theme.key" disabled>已启用</a-button>
|
||||
<a-button type="primary" @click="activeTheme(theme.key)" v-else>启用</a-button>
|
||||
<a-button @click="optionModal(theme.key)">设置</a-button>
|
||||
<a-button @click="optionModal(theme.key)" v-if="activatedTheme == theme.key">设置</a-button>
|
||||
<a-popconfirm :title="'确定删除【'+theme.properties.name+'】主题？'" @confirm="deleteTheme(theme.key)" okText="确定" cancelText="取消" v-else>
|
||||
<a-button type="dashed">删除</a-button>
|
||||
</a-popconfirm>
|
||||
</a-button-group>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-modal
|
||||
:title="optionTheme+' 主题设置'"
|
||||
width="90%"
|
||||
v-model="visible"
|
||||
>
|
||||
<a-modal :title="optionTheme + ' 主题设置'" width="90%" v-model="visible">
|
||||
<iframe :src="optionUrl" height="560" width="100%" frameborder="0" scrolling="auto"></iframe>
|
||||
</a-modal>
|
||||
</div>
|
||||
|
|
@ -71,13 +71,16 @@ export default {
|
|||
this.$message.success('设置成功！')
|
||||
this.loadThemes()
|
||||
})
|
||||
},
|
||||
deleteTheme(theme) {
|
||||
this.$message.success('删除' + theme)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ant-divider-horizontal{
|
||||
.ant-divider-horizontal {
|
||||
margin: 14px 0;
|
||||
}
|
||||
|
||||
|
|
@ -85,11 +88,11 @@ export default {
|
|||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.theme-item .theme-control .theme-title{
|
||||
.theme-item .theme-control .theme-title {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.theme-item .theme-control .theme-button{
|
||||
.theme-item .theme-control .theme-button {
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@ export default {
|
|||
})
|
||||
)
|
||||
}
|
||||
return h('p', 'No files')
|
||||
return h('p', '没有文件')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -42,7 +42,8 @@
|
|||
</router-link>
|
||||
<a-dropdown>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1"> <a-icon type="delete" />回收站 </a-menu-item>
|
||||
<a-menu-item key="1" v-if="postStatus==0 || postStatus==1"> <a-icon type="delete" />移到回收站 </a-menu-item>
|
||||
<a-menu-item key="1" v-else-if="postStatus==2"> <a-icon type="delete" />永久删除 </a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px;">
|
||||
批量操作
|
||||
|
|
@ -122,7 +123,8 @@ export default {
|
|||
selectedRows: [],
|
||||
options: {},
|
||||
optionAlertShow: false,
|
||||
categories: []
|
||||
categories: [],
|
||||
postStatus: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
|
|||
Loading…
Reference in New Issue