151 lines
5.1 KiB
Vue
151 lines
5.1 KiB
Vue
<template>
|
|
<div class="default-main">
|
|
<TableHeader select ref="TableHeaderRef">
|
|
<template #operation>
|
|
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
|
|
</template>
|
|
</TableHeader>
|
|
<Table ref="tableRef" />
|
|
<formTab ref="formTabRef" v-if="show" @Cancels=";(show = false), tableStore.index()" />
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { ref, onMounted, provide, nextTick } from 'vue'
|
|
import TableStore from '@/utils/tableStore'
|
|
import Table from '@/components/table/index.vue'
|
|
import TableHeader from '@/components/table/header/index.vue'
|
|
import { activateTheme, deleteTheme } from '@/api/system/subject/index'
|
|
import formTab from './form/index.vue'
|
|
import { ElMessage } from 'element-plus'
|
|
import { useConfig } from '@/stores/config'
|
|
import { getTheme } from '@/api/systerm'
|
|
const configStore = useConfig()
|
|
defineOptions({
|
|
name: 'user-boot/function/functionTree'
|
|
})
|
|
|
|
const formTabRef = ref()
|
|
const TableHeaderRef = ref()
|
|
const show = ref(false)
|
|
const tableStore: any = new TableStore({
|
|
url: '/system-boot/theme/getAllThemes',
|
|
method: 'GET',
|
|
column: [
|
|
{
|
|
field: 'index',
|
|
title: '序号',
|
|
width: '80',
|
|
formatter: (row: any) => {
|
|
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
|
|
}
|
|
},
|
|
{ field: 'name', title: '主题名称' },
|
|
{ field: 'remark', title: '描述' },
|
|
{ field: 'logoUrl', title: '主题图标', render: 'image' },
|
|
|
|
{
|
|
title: '操作',fixed: 'right',
|
|
width: '180',
|
|
render: 'buttons',
|
|
buttons: [
|
|
{
|
|
name: 'edit',
|
|
title: '激活 ',
|
|
type: 'primary',
|
|
icon: 'el-icon-Plus',
|
|
render: 'basicButton',
|
|
disabled: row => {
|
|
return row.active == 1
|
|
},
|
|
click: row => {
|
|
activateTheme({ id: row.id }).then(res => {
|
|
ElMessage({
|
|
message: '激活成功!',
|
|
type: 'success'
|
|
})
|
|
tableStore.index()
|
|
})
|
|
}
|
|
},
|
|
{
|
|
name: 'edit',
|
|
title: '修改 ',
|
|
type: 'primary',
|
|
icon: 'el-icon-Plus',
|
|
render: 'basicButton',
|
|
click: row => {
|
|
show.value = true
|
|
setTimeout(() => {
|
|
formTabRef.value.open({
|
|
text: '修改主题',
|
|
row: row
|
|
})
|
|
}, 10)
|
|
}
|
|
},
|
|
{
|
|
name: 'edit',
|
|
title: '删除',
|
|
type: 'danger',
|
|
icon: 'el-icon-Delete',
|
|
render: 'confirmButton',
|
|
popconfirm: {
|
|
confirmButtonText: '确认',
|
|
cancelButtonText: '取消',
|
|
confirmButtonType: 'danger',
|
|
title: '确定删除吗？'
|
|
},
|
|
click: row => {
|
|
deleteTheme({ id: row.id }).then(res => {
|
|
ElMessage({
|
|
message: '删除成功!',
|
|
type: 'success'
|
|
})
|
|
tableStore.index()
|
|
})
|
|
}
|
|
}
|
|
]
|
|
}
|
|
],
|
|
|
|
loadCallback: () => {
|
|
getTheme().then(res => {
|
|
let list: any = [
|
|
'elementUiPrimary',
|
|
'tableHeaderBackground',
|
|
'tableHeaderColor',
|
|
'tableCurrent',
|
|
'menuBackground',
|
|
'menuColor',
|
|
'menuTopBarBackground',
|
|
'menuActiveBackground',
|
|
'menuActiveColor',
|
|
'headerBarTabColor',
|
|
'headerBarBackground'
|
|
]
|
|
|
|
window.localStorage.setItem('getTheme', JSON.stringify(res.data))
|
|
for (let i = 0; i < list.length; i++) {
|
|
configStore.setLayout(list[i], JSON.parse(res.data[list[i]]))
|
|
}
|
|
configStore.setLayout('elementUiPrimary', JSON.parse(res.data['elementUiPrimary']))
|
|
})
|
|
}
|
|
})
|
|
|
|
provide('tableStore', tableStore)
|
|
// 新增主题
|
|
const add = () => {
|
|
show.value = true
|
|
setTimeout(() => {
|
|
formTabRef.value.open({
|
|
text: '新增主题'
|
|
})
|
|
}, 10)
|
|
}
|
|
onMounted(() => {
|
|
tableStore.index()
|
|
})
|
|
</script>
|