100 lines
3.3 KiB
Vue
100 lines
3.3 KiB
Vue
<!--
|
||
* Copyright (c) 2013-Now https://jeesite.com All rights reserved.
|
||
* No deletion without permission, or be held responsible to law.
|
||
* @author ThinkGem
|
||
-->
|
||
<template>
|
||
<PageWrapper :sidebarWidth="200">
|
||
<template #sidebar>
|
||
<BasicTree
|
||
:title="t('栏目')"
|
||
:search="true"
|
||
:toolbar="true"
|
||
:showIcon="true"
|
||
:api="categoryTreeData"
|
||
:params="apiParams"
|
||
:immediate="immediate"
|
||
:defaultExpandLevel="2"
|
||
:selectedKeys="treeCodes"
|
||
@click="handleSelectedKeys"
|
||
>
|
||
<template #headerTitle>
|
||
<Dropdown class="cursor-pointer" :trigger="['hover']" :dropMenuList="dropMenuList">
|
||
{{ siteName }} <DownOutlined />
|
||
</Dropdown>
|
||
</template>
|
||
</BasicTree>
|
||
</template>
|
||
<ArticleList
|
||
v-if="!treeData.module || treeData.module === 'article'"
|
||
v-model:treeCodes="treeCodes"
|
||
:siteCode="siteCode"
|
||
/>
|
||
<div class="p-4" v-else>{{ t('内容') }} {{ treeData.module }} {{ t('模型暂未实现') }}</div>
|
||
</PageWrapper>
|
||
</template>
|
||
<script lang="ts" setup name="ViewsCmsIndex">
|
||
import { onMounted, ref } from 'vue';
|
||
import { useI18n } from '@jeesite/core/hooks/web/useI18n';
|
||
import { PageWrapper } from '@jeesite/core/components/Page';
|
||
import { BasicTree } from '@jeesite/core/components/Tree';
|
||
import { Site, siteSelect } from '@jeesite/cms/api/cms/site';
|
||
import { Category, categoryIndex, categoryTreeData } from '@jeesite/cms/api/cms/category';
|
||
import { Dropdown, DropMenu } from '@jeesite/core/components/Dropdown';
|
||
import { DownOutlined } from '@ant-design/icons-vue';
|
||
import { useGo } from '@jeesite/core/hooks/web/usePage';
|
||
|
||
import ArticleList from './article/list.vue';
|
||
|
||
const { t } = useI18n('cms.category');
|
||
const treeData = ref<Category>({} as Category);
|
||
const treeCodes = ref<string[]>([]);
|
||
const apiParams = ref<Recordable>({ siteCode: 'main' });
|
||
const immediate = ref(false);
|
||
|
||
const dropMenuList = ref<Array<DropMenu>>([]);
|
||
const siteCode = ref<string>('main');
|
||
const siteName = ref<string>(t('JeeSite'));
|
||
|
||
const go = useGo();
|
||
|
||
onMounted(async () => {
|
||
const res = await categoryIndex();
|
||
const currentSite = (res.currentSite || {}) as Site;
|
||
siteCode.value = currentSite.siteCode || 'main';
|
||
siteName.value = currentSite.siteName || 'main';
|
||
apiParams.value.siteCode = currentSite.siteCode;
|
||
immediate.value = true;
|
||
await loadSiteCode(res);
|
||
});
|
||
|
||
async function loadSiteCode(res: Recordable) {
|
||
dropMenuList.value = (res.siteList || []).map((item) => {
|
||
if (item.value == siteCode.value) {
|
||
siteName.value = item.name;
|
||
}
|
||
return {
|
||
text: item.siteName,
|
||
event: item.siteCode,
|
||
icon: 'i-radix-icons:dot',
|
||
onClick: () => {
|
||
siteCode.value = item.siteCode;
|
||
siteName.value = item.siteName;
|
||
apiParams.value.siteCode = item.siteCode;
|
||
siteSelect({ siteCode: siteCode.value });
|
||
treeCodes.value = [];
|
||
},
|
||
};
|
||
});
|
||
}
|
||
|
||
function handleSelectedKeys(_e: any, tree: any) {
|
||
// 展现方式：1 自动识别；2 栏目内容列表；3 栏目第一条内容
|
||
// if (tree.module === 'article' && tree.showModes == '3') {
|
||
// go('/cms/article/form?id=' + tree.id);
|
||
// }
|
||
treeData.value = tree.dataRef;
|
||
treeCodes.value = [tree.id];
|
||
}
|
||
</script>
|