mirror of https://github.com/halo-dev/halo-admin
Link page.
parent
dfa4879d57
commit
d95ed4e6b4
|
@ -0,0 +1,29 @@
|
|||
import service from '@/utils/service'
|
||||
|
||||
const baseUrl = '/admin/api/links'
|
||||
|
||||
const linkApi = {}
|
||||
|
||||
linkApi.listAll = () => {
|
||||
return service({
|
||||
url: `${baseUrl}`,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
linkApi.create = (link) => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
data: link,
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
linkApi.delete = linkId => {
|
||||
return service({
|
||||
url: `${baseUrl}/${linkId}`,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
export default linkApi
|
|
@ -2,13 +2,9 @@
|
|||
<div class="setting-drawer" ref="settingDrawer">
|
||||
<a-drawer
|
||||
width="300"
|
||||
placement="right"
|
||||
:closable="true"
|
||||
closable
|
||||
@close="onClose"
|
||||
:visible="visible"
|
||||
:getContainer="() => $refs.settingDrawer"
|
||||
:style="{}"
|
||||
:mask="false"
|
||||
:zIndex="9999"
|
||||
>
|
||||
<div class="setting-drawer-index-content">
|
||||
|
@ -168,17 +164,13 @@ export default {
|
|||
mixins: [mixin, mixinDevice],
|
||||
data() {
|
||||
return {
|
||||
visible: true,
|
||||
visible: false,
|
||||
colorList,
|
||||
baseConfig: Object.assign({}, config)
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
mounted() {
|
||||
const vm = this
|
||||
setTimeout(() => {
|
||||
vm.visible = false
|
||||
}, 16)
|
||||
// 当主题色不是默认色时,才进行主题编译
|
||||
if (this.primaryColor !== config.primaryColor) {
|
||||
updateTheme(this.primaryColor)
|
||||
|
|
|
@ -10,10 +10,10 @@
|
|||
:style="{ 'padding-bottom': '12px' }">
|
||||
<a-card title="添加菜单">
|
||||
<a-form layout="horizontal">
|
||||
<a-form-item label="名称:" help="*页面上所显示的名称">
|
||||
<a-form-item label="名称:" help="* 页面上所显示的名称">
|
||||
<a-input v-model="menuToCreate.name" />
|
||||
</a-form-item>
|
||||
<a-form-item label="路径:" help="*菜单的路径">
|
||||
<a-form-item label="路径:" help="* 菜单的路径">
|
||||
<a-input v-model="menuToCreate.url" />
|
||||
</a-form-item>
|
||||
<a-form-item label="上级菜单:">
|
||||
|
@ -24,7 +24,7 @@
|
|||
<a-form-item label="排序编号:">
|
||||
<a-input type="number" v-model="menuToCreate.sort" />
|
||||
</a-form-item>
|
||||
<a-form-item label="图标:" help="*请根据主题的支持选填">
|
||||
<a-form-item label="图标:" help="* 请根据主题的支持选填">
|
||||
<a-input v-model="menuToCreate.icon" />
|
||||
</a-form-item>
|
||||
<a-form-item label="打开方式:">
|
||||
|
|
|
@ -5,11 +5,20 @@
|
|||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane tab="内置页面" key="internal">
|
||||
内置页面
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="自定义页面" key="custom">
|
||||
自定义页面
|
||||
<a-table :columns="internalColumns" :dataSource="internalPages" :pagination="false">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="viewPage(record.id)">查看</a>
|
||||
<a-divider type="vertical"/>
|
||||
<router-link :to="{name:'LinkList'}" v-if="record.id==1">
|
||||
<a href="javascript:void(0);">编辑</a>
|
||||
</router-link>
|
||||
<router-link :to="{name:'GalleryList'}" v-if="record.id==2">
|
||||
<a href="javascript:void(0);">编辑</a>
|
||||
</router-link>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="自定义页面" key="custom">自定义页面</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</a-col>
|
||||
|
@ -18,7 +27,50 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
const internalColumns = [
|
||||
{
|
||||
title: '页面名称',
|
||||
dataIndex: 'name'
|
||||
},
|
||||
{
|
||||
title: '访问路径',
|
||||
dataIndex: 'url'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
width: '150px',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
]
|
||||
const internalPages = [
|
||||
{
|
||||
id: '1',
|
||||
name: '友情链接',
|
||||
url: '/links'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '图库页面',
|
||||
url: '/galleries'
|
||||
}
|
||||
]
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
internalColumns,
|
||||
internalPages
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
editPage(id) {
|
||||
this.$message.success('编辑' + id)
|
||||
},
|
||||
viewPage(id) {
|
||||
this.$message.success('查看' + id)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
|
|
@ -1,9 +1,128 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">Link List</div>
|
||||
<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-card title="添加友情链接">
|
||||
<a-form layout="horizontal">
|
||||
<a-form-item label="网站名称:">
|
||||
<a-input v-model="linkToCreate.name"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="网站地址:" help="* 需要加上 http://">
|
||||
<a-input v-model="linkToCreate.url"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="Logo:">
|
||||
<a-input v-model="linkToCreate.logo"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="分组:" help="* 非必填">
|
||||
<a-input v-model="linkToCreate.team"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="描述:">
|
||||
<a-input
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 5 }"
|
||||
v-model="linkToCreate.description"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" @click="createLink">保存</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-card title="所有友情链接">
|
||||
<a-table :columns="columns" :dataSource="links" :loading="loading">
|
||||
<template slot="url" slot-scope="text">
|
||||
<a target="_blank" :href="text">{{ text }}</a>
|
||||
</template>
|
||||
<ellipsis :length="30" tooltip slot="name" slot-scope="text">{{ text }}</ellipsis>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="editLink(record.id)">编辑</a>
|
||||
<a-divider type="vertical"/>
|
||||
<a-popconfirm
|
||||
:title="'你确定要删除【' + record.name + '】链接?'"
|
||||
@confirm="deleteLink(record.id)"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
>
|
||||
<a href="javascript:;">删除</a>
|
||||
</a-popconfirm>
|
||||
</span>
|
||||
</a-table>
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
import { Ellipsis } from '@/components'
|
||||
import linkApi from '@/api/link'
|
||||
const columns = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
scopedSlots: { customRender: 'name' }
|
||||
},
|
||||
{
|
||||
title: '网址',
|
||||
dataIndex: 'url',
|
||||
scopedSlots: { customRender: 'url' }
|
||||
},
|
||||
{
|
||||
title: '分组',
|
||||
dataIndex: 'team'
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
]
|
||||
export default {
|
||||
components: {
|
||||
Ellipsis
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
loading: true,
|
||||
columns,
|
||||
links: [],
|
||||
linkToCreate: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadLinks()
|
||||
},
|
||||
methods: {
|
||||
loadLinks() {
|
||||
linkApi.listAll().then(response => {
|
||||
this.links = response.data.data
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
createLink() {
|
||||
linkApi.create(this.linkToCreate).then(response => {
|
||||
this.loadLinks()
|
||||
this.linkToCreate = {}
|
||||
})
|
||||
},
|
||||
editLink(id) {
|
||||
this.$message.success('编辑' + id)
|
||||
},
|
||||
deleteLink(id) {
|
||||
linkApi.delete(id).then(response => {
|
||||
this.$message.success('删除成功!')
|
||||
this.loadLinks()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
@ -13,13 +13,13 @@
|
|||
<a-form layout="horizontal">
|
||||
<a-form-item
|
||||
label="名称:"
|
||||
help="*页面上所显示的名称"
|
||||
help="* 页面上所显示的名称"
|
||||
>
|
||||
<a-input v-model="categoryToCreate.name" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="路径名称:"
|
||||
help="*这是文章路径上显示的名称,最好为英文"
|
||||
help="* 这是文章路径上显示的名称,最好为英文"
|
||||
>
|
||||
<a-input v-model="categoryToCreate.slugNames" />
|
||||
</a-form-item>
|
||||
|
@ -31,7 +31,7 @@
|
|||
</a-form-item>
|
||||
<a-form-item
|
||||
label="描述:"
|
||||
help="*分类描述,部分主题可显示"
|
||||
help="* 分类描述,部分主题可显示"
|
||||
>
|
||||
<a-input
|
||||
type="textarea"
|
||||
|
|
|
@ -10,10 +10,10 @@
|
|||
:style="{ 'padding-bottom': '12px' }">
|
||||
<a-card title="添加标签">
|
||||
<a-form layout="horizontal">
|
||||
<a-form-item label="名称:" help="*页面上所显示的名称">
|
||||
<a-form-item label="名称:" help="* 页面上所显示的名称">
|
||||
<a-input v-model="tagToCreate.name" />
|
||||
</a-form-item>
|
||||
<a-form-item label="路径名称:" help="*这是文章路径上显示的名称,最好为英文">
|
||||
<a-form-item label="路径名称:" help="* 这是文章路径上显示的名称,最好为英文">
|
||||
<a-input v-model="tagToCreate.slugName" />
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
|
|
Loading…
Reference in New Issue