b2894lxlx/guofu-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化：把网站设置、参数配置、域名管理放到概览页面

Browse Source
This commit is contained in:
赵忠林
2024-09-04 00:25:55 +08:00
parent aa85c133e3
commit 4b2c4bd9e6
9 changed files with 176 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/cms/link/model/index.ts
View File

@@ -10,6 +10,7 @@ export interface Link {
url?: string;
linkType?: string;
appId?: number;
categoryId?: number;
userId?: number;
comments?: string;
recommend?: number;
@@ -25,5 +26,6 @@ export interface Link {
export interface LinkParam extends PageParam {
id?: number;
linkType?: string;
categoryId?: number;
name?: string;
}

8
src/utils/common.ts
View File

@@ -70,6 +70,7 @@ export function openUrl(url: string, params?: any): void {
*/
export function openSpmUrl(path: string, d?: any, id = 0): void {
const domain = getSiteDomain();
console.log(domain);
const spm = ref<string>('');
const token = ref<string>();
const url = ref<string>();
@@ -97,8 +98,7 @@ export function openSpmUrl(path: string, d?: any, id = 0): void {
// 跳转页面
url.value = `${domain}${path}${spm.value}${token.value}`;
console.log(url.value);
window.open(url.value);
window.open(`https://${url.value}`);
}
/**
@@ -152,6 +152,10 @@ export function navTo(url: string): void {
window.location.href = url;
}
export function push(path: string) {
router.push(path);
}
// 手机号脱敏
export function getMobile(tel: string) {
const reg = /^(\d{3})\d{4}(\d{4})$/;

29
src/views/cms/link/components/link-edit.vue
View File

@@ -34,8 +34,21 @@
v-model:value="form.url"
/>
</a-form-item>
<a-form-item label="选择栏目" name="categoryId">
<a-tree-select
allow-clear
:tree-data="navigationList"
tree-default-expand-all
placeholder="请选择栏目"
:value="form.categoryId || undefined"
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }"
@update:value="(value?: number) => (form.categoryId = value)"
@change="onCategoryId"
/>
</a-form-item>
<a-form-item label="类型" name="linkType">
<a-select
allow-clear
optionFilterProp="label"
placeholder="请选择链接类型"
:options="linkType"
@@ -88,11 +101,11 @@
import useFormData from '@/utils/use-form-data';
import { addLink, updateLink } from '@/api/cms/link';
import type { Link } from '@/api/cms/link/model';
import { urlReg } from 'ele-admin-pro';
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
import { uploadFile } from '@/api/system/file';
import { getDictionaryOptions } from '@/utils/common';
import { FileRecord } from '@/api/system/file/model';
import { Navigation } from '@/api/cms/navigation/model';
// 是否开启响应式布局
const themeStore = useThemeStore();
@@ -108,6 +121,7 @@
visible: boolean;
// 修改回显的数据
data?: Link | null;
navigationList?: Navigation[];
}>();
//
@@ -128,6 +142,7 @@
url: '',
sortNumber: 100,
linkType: undefined,
categoryId: undefined,
comments: undefined
});
@@ -140,13 +155,6 @@
trigger: 'blur'
}
],
linkType: [
{
required: true,
type: 'string',
trigger: 'blur'
}
],
url: [
{
required: true,
@@ -203,6 +211,11 @@
form.icon = '';
};
// 选择栏目
const onCategoryId = (id: number) => {
form.categoryId = id;
};
/* 保存编辑 */
const save = () => {
if (!formRef.value) {

41
src/views/cms/link/components/link-search.vue
View File

@@ -8,13 +8,24 @@
</template>
<span>添加网址</span>
</a-button>
<DictSelect
dict-code="linkType"
v-model:value="where.linkType"
:placeholder="`选择分类`"
<a-tree-select
allow-clear
:tree-data="navigationList"
tree-default-expand-all
style="width: 200px"
@change="search"
placeholder="请选择栏目"
:value="where.categoryId || undefined"
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }"
@update:value="(value?: number) => (where.categoryId = value)"
@change="onCategoryId"
/>
<!-- <DictSelect-->
<!-- dict-code="linkType"-->
<!-- v-model:value="where.linkType"-->
<!-- :placeholder="`选择分类`"-->
<!-- style="width: 200px"-->
<!-- @change="search"-->
<!-- />-->
<a-input-search
allow-clear
placeholder="搜索关键词"
@@ -23,11 +34,11 @@
@search="search"
/>
<a-button @click="reset">重置</a-button>
<a-button
v-if="hasRole('superAdmin')"
@click="openUrl(`/website/link/dict`)"
>设置分类</a-button
>
<!-- <a-button-->
<!-- v-if="hasRole('superAdmin')"-->
<!-- @click="openUrl(`/website/link/dict`)"-->
<!-- >设置分类</a-button-->
<!-- >-->
</a-space>
<a-space :size="10" style="flex-wrap: wrap; margin-right: 20px">
<a-button
@@ -49,15 +60,13 @@
import { DeleteOutlined, PlusOutlined } from '@ant-design/icons-vue';
import useSearch from '@/utils/use-search';
import { watch } from 'vue';
import DictSelect from '@/components/DictSelect/index.vue';
import { LinkParam } from '@/api/cms/link/model';
import { openUrl } from '@/utils/common';
import { hasRole } from '@/utils/permission';
const props = withDefaults(
defineProps<{
// 选中的角色
selection?: [];
navigationList?: Navigator[];
}>(),
{}
);
@@ -88,6 +97,12 @@
emit('add');
};
// 按分类查询
const onCategoryId = (id: number) => {
where.categoryId = id;
emit('search', where);
};
// 批量删除
const removeBatch = () => {
emit('remove');

72
src/views/cms/link/index.vue
View File

@@ -12,17 +12,34 @@
cache-key="proSystemLinkTable"
>
<template #toolbar>
<LinkSearch @add="openEdit" @search="reload" />
<LinkSearch
@add="openEdit"
:navigationList="navigationList"
@search="reload"
/>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'link'">
<span class="cursor-pointer" @click="openSpmUrl(record.url)">{{
record.name
}}</span>
</template>
<template v-if="column.key === 'icon'">
<a-avatar
shape="square"
:width="40"
:width="30"
:src="record.icon"
style="margin-right: 5px"
/>
<a @click="openSpmUrl(record.url)">{{ record.name }}</a>
</template>
<template v-if="column.key === 'url'">
<span class="cursor-pointer" @click="openSpmUrl(record.url)">{{
record.url
}}</span>
</template>
<template v-if="column.key === 'status'">
<a-tag v-if="record.status === 0" color="green">显示</a-tag>
<a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
</template>
<template v-if="column.key === 'action'">
<a-space>
@@ -41,7 +58,12 @@
</ele-pro-table>
</a-card>
<!-- 编辑弹窗 -->
<link-edit v-model:visible="showEdit" :data="current" @done="reload" />
<link-edit
v-model:visible="showEdit"
:navigationList="navigationList"
:data="current"
@done="reload"
/>
</div>
</template>
@@ -57,10 +79,12 @@
import { messageLoading } from 'ele-admin-pro/es';
import LinkEdit from './components/link-edit.vue';
import { pageLink, removeLink } from '@/api/cms/link';
import { toTreeData } from 'ele-admin-pro';
import type { Link, LinkParam } from '@/api/cms/link/model';
import { Menu } from '@/api/system/menu/model';
import { openNew, openSpmUrl, openUrl } from '@/utils/common';
import { openSpmUrl, openUrl } from '@/utils/common';
import LinkSearch from './components/link-search.vue';
import { listNavigation } from '@/api/cms/navigation';
import { Navigation } from '@/api/cms/navigation/model';
// 表格实例
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
@@ -76,10 +100,20 @@
// customRender: ({ index }) => index + (tableRef.value?.tableIndex ?? 0)
// },
{
title: '名称',
title: '链接名称',
dataIndex: 'link',
key: 'link'
},
{
title: '链接地址',
dataIndex: 'url',
key: 'url'
},
{
title: '图标',
dataIndex: 'icon',
key: 'icon'
},
{
title: '备注',
dataIndex: 'comments'
@@ -103,12 +137,12 @@
// 表格选中数据
const selection = ref<Link[]>([]);
// 当前编辑数据
const current = ref<Link | null>(null);
// 是否显示编辑弹窗
const showEdit = ref(false);
// 栏目数据
const navigationList = ref<Navigation[]>();
// 表格数据源
const datasource: DatasourceFunction = ({ page, limit, where, orders }) => {
@@ -127,6 +161,24 @@
showEdit.value = true;
};
// 加载栏目数据
if (!navigationList.value) {
listNavigation({}).then((res) => {
navigationList.value = toTreeData({
data: res?.map((d) => {
d.value = d.navigationId;
d.label = d.title;
if (d.model != 'links') {
d.disabled = true;
}
return d;
}),
idField: 'navigationId',
parentIdField: 'parentId'
});
});
}
/* 自定义行属性 */
const customRow = (record: Link) => {
return {
@@ -136,7 +188,7 @@
},
// 行双击事件
onDblclick: () => {
openUrl(`${record.url}`);
openEdit(record);
}
};
};

3
src/views/cms/navigation/components/design-edit.vue
View File

@@ -14,7 +14,7 @@
>
<template #extra>
<a-button type="primary" style="margin-right: 8px" @click="save">保存</a-button>
<a-button @click="onPreview">预览</a-button>
<a-button @click="openSpmUrl(`${form.path}`)">预览</a-button>
</template>
<a-form
ref="formRef"
@@ -166,6 +166,7 @@ import TinymceEditor from "@/components/TinymceEditor/index.vue";
import useFormData from "@/utils/use-form-data";
import {removeSiteInfoCache} from "@/api/cms/website";
import {FileRecord} from "@/api/system/file/model";
import { openSpmUrl } from "@/utils/common";
// 是否是修改
const isUpdate = ref(false);

11
src/views/cms/navigation/components/navigation-edit.vue
View File

@@ -162,6 +162,7 @@
import { removeSiteInfoCache } from '@/api/cms/website';
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
import { FileRecord } from '@/api/system/file/model';
import { uuid } from '@/components/TinymceEditor/util';
// 是否开启响应式布局
const themeStore = useThemeStore();
@@ -197,9 +198,9 @@
// 表单数据
const { form, resetFields, assignFields } = useFormData<Navigation>({
navigationId: undefined,
model: 'custom',
model: undefined,
code: undefined,
modelName: '单页模型',
modelName: undefined,
type: 0,
title: '',
parentId: 0,
@@ -312,7 +313,6 @@
});
const chooseModel = (item: any) => {
console.log(item);
form.model = `${item.value}`;
form.modelName = `${item.label}`;
if (item.value == 'custom') {
@@ -325,6 +325,11 @@
form.component = `/pages/${item.value}/index.vue`;
return;
}
if (!isUpdate.value) {
form.path = undefined;
form.component = `/pages/${item.value}/index.vue`;
return;
}
form.path = `/${item.value}/${form.navigationId}`;
form.component = `/pages/${item.value}/index.vue`;
};

48
src/views/cms/website/components/search.vue
View File

@@ -1,51 +1,51 @@
<!-- 搜索表单 -->
<template>
<a-space style="flex-wrap: wrap">
<!-- <a-button type="primary" class="ele-btn-icon" @click="add">-->
<!-- <template #icon>-->
<!-- <PlusOutlined />-->
<!-- </template>-->
<!-- <span>添加</span>-->
<!-- </a-button>-->
<!-- <a-button class="ele-btn-icon" @click="openUrl(`/mp-pages`)">-->
<!-- <span>页面管理</span>-->
<!-- </a-button>-->
<!-- <a-button class="ele-btn-icon" @click="openUrl(`/mp-field/0`)">-->
<!-- <span>参数配置</span>-->
<!-- </a-button>-->
<!-- <a-button class="ele-btn-icon" @click="openUrl(`/mp-ad`)">-->
<!-- <span>广告管理</span>-->
<!-- </a-button>-->
<!-- <a-button class="ele-btn-icon" @click="openUrl(`/mp-group`)">-->
<!-- <span>卡片管理</span>-->
<!-- </a-button>-->
<!-- <a-button class="ele-btn-icon" @click="navigator(`/website/domain`)">-->
<!-- <span>域名管理</span>-->
<!-- </a-button>-->
<a-space style="flex-wrap: wrap" v-if="website">
<a-button class="ele-btn-icon" @click="edit">
<span>网站设置</span>
</a-button>
<a-button
class="ele-btn-icon"
@click="push(`/website/field/${website.websiteId}`)"
>
<span>参数配置</span>
</a-button>
<a-button
class="ele-btn-icon"
@click="push(`/website/domain/${website?.websiteId}`)"
>
<span>域名管理</span>
</a-button>
</a-space>
</template>
<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue';
import { watch } from 'vue';
import { Website } from '@/api/cms/website/model';
import { push } from '@/utils/common';
const props = withDefaults(
defineProps<{
// 选中的角色
selection?: [];
website?: Website;
count?: 0;
}>(),
{}
);
const emit = defineEmits<{
(e: 'add'): void;
(e: 'add', data: Website): void;
}>();
const add = () => {
emit('add');
};
const edit = () => {
emit('add', props.website);
};
watch(
() => props.selection,
() => {}

51
src/views/cms/website/index.vue
View File

@@ -7,6 +7,7 @@
row-key="websiteId"
:columns="columns"
:datasource="datasource"
:parse-data="parseData"
:customRow="customRow"
:need-page="false"
tool-class="ele-toolbar-form"
@@ -16,6 +17,7 @@
<search
@search="reload"
:selection="selection"
:website="website"
@add="openEdit"
@remove="removeBatch"
@batchMove="openMove"
@@ -26,19 +28,6 @@
<a-image :src="record.websiteLogo" :width="50" />
</template>
<template v-if="column.key === 'domain'">
<!-- <a-button-->
<!-- type="link"-->
<!-- v-if="record.domain"-->
<!-- @click="-->
<!-- openSpmUrl(-->
<!-- `https://${record.domain}`,-->
<!-- record,-->
<!-- record.websiteId-->
<!-- )-->
<!-- "-->
<!-- >-->
<!-- {{ record.domain }}-->
<!-- </a-button>-->
<a-button
type="link"
@click="
@@ -76,9 +65,6 @@
</template>
<template v-if="column.key === 'action'">
<a-space>
<a @click="openUrl(`/website/domain/${record.websiteId}`)"
>域名管理</a
>
<a-divider type="vertical" />
<a @click="openEdit(record)">编辑</a>
</a-space>
@@ -112,8 +98,8 @@
updateWebsite
} from '@/api/cms/website';
import type { Website, WebsiteParam } from '@/api/cms/website/model';
import { openPreview, openSpmUrl, openUrl } from '@/utils/common';
import { getSiteDomain } from '@/utils/domain';
import { openSpmUrl } from '@/utils/common';
import { PageResult } from '@/api';
// 表格实例
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
@@ -128,7 +114,8 @@
const showMove = ref(false);
// 加载状态
const loading = ref(true);
const domain = getSiteDomain();
// 当前网站项目
const website = ref<Website>();
// 表格数据源
const datasource: DatasourceFunction = ({
@@ -152,7 +139,7 @@
// 表格列配置
const columns = ref<ColumnItem[]>([
{
title: 'ID',
title: '租户ID',
dataIndex: 'tenantId',
key: 'tenantId',
width: 80
@@ -201,17 +188,25 @@
sorter: true,
ellipsis: true,
customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
},
{
title: '操作',
key: 'action',
width: 180,
fixed: 'right',
align: 'center',
hideInSetting: true
}
// {
// title: '操作',
// key: 'action',
// width: 180,
// fixed: 'right',
// align: 'center',
// hideInSetting: true
// }
]);
// 整理数据
const parseData = (data: PageResult<Website>) => {
if (data?.count > 0) {
website.value = data.list[0];
}
return data;
};
/* 搜索 */
const reload = (where?: WebsiteParam) => {
selection.value = [];