Merge remote-tracking branch 'origin/feature/v1.3_营销资产中台' into feature/v1.3_营销资产中台

This commit is contained in:
林志军
2025-07-10 14:24:11 +08:00
35 changed files with 525 additions and 252 deletions

View File

@ -21,7 +21,7 @@ export function configAutoImport() {
'@vueuse/core', '@vueuse/core',
{ {
dayjs: [['default', 'dayjs']], dayjs: [['default', 'dayjs']],
'lodash-es': ['cloneDeep', 'omit', 'pick', 'union', 'isNumber', 'isEmpty'], 'lodash-es': ['cloneDeep', 'omit', 'pick', 'union', 'uniq', 'isNumber', 'uniqBy', 'isEmpty'],
'@/hooks': ['useModal'], '@/hooks': ['useModal'],
}, },
], ],

View File

@ -7,7 +7,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { useUserStore } from '@/stores'; import { useUserStore } from '@/stores';
import { getUserEnterpriseInfo } from '@/utils/user';
import zhCN from '@arco-design/web-vue/es/locale/lang/zh-cn'; import zhCN from '@arco-design/web-vue/es/locale/lang/zh-cn';
const userStore = useUserStore(); const userStore = useUserStore();
const redTheme = { const redTheme = {
@ -16,11 +20,14 @@ const redTheme = {
colorLink: '#f5222d', // 链接色 colorLink: '#f5222d', // 链接色
}, },
}; };
// 初始化企业信息
const init = async () => {
const { isLogin, getUserInfo } = userStore;
const init = () => {
const { isLogin, fetchUserInfo } = userStore;
if (isLogin) { if (isLogin) {
fetchUserInfo(); await getUserInfo(); // 初始化用户信息
await getUserEnterpriseInfo();
} }
}; };

View File

@ -1,8 +1,8 @@
/* /*
* @Author: 田鑫 * @Author: 田鑫
* @Date: 2023-02-17 11:58:44 * @Date: 2023-02-17 11:58:44
* @LastEditors: Please set LastEditors * @LastEditors: rd 1344903914@qq.com
* @LastEditTime: 2025-07-05 17:59:59 * @LastEditTime: 2025-07-08 14:50:57
* @Description: * @Description:
*/ */
@ -42,13 +42,12 @@ export class Request {
this.instance.interceptors.request.use( this.instance.interceptors.request.use(
(config: AxiosRequestConfig) => { (config: AxiosRequestConfig) => {
const store = useEnterpriseStore(pinia); const store = useEnterpriseStore(pinia);
const enterprise = store.getEnterpriseInfo();
const token = localStorage.getItem('accessToken') as string; const token = localStorage.getItem('accessToken') as string;
config.headers!.Authorization = token; config.headers!.Authorization = token;
if (enterprise) { if (store.enterpriseInfo) {
config.headers!['enterprise-id'] = enterprise.id; config.headers!['enterprise-id'] = store.enterpriseInfo.id;
} }
return config; return config;

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -67,7 +67,8 @@ export default defineComponent({
}; };
listenerRouteChange((newRoute) => { listenerRouteChange((newRoute) => {
const { requiresAuth, activeMenu, hideInMenu } = newRoute.meta; const { requiresAuth, activeMenu, hideInMenu } = newRoute.meta;
if (requiresAuth && (!hideInMenu || activeMenu)) { // if (requiresAuth && (!hideInMenu || activeMenu)) {
if (!hideInMenu || activeMenu) {
const menuOpenKeys = findMenuOpenKeys((activeMenu || newRoute.name) as string); const menuOpenKeys = findMenuOpenKeys((activeMenu || newRoute.name) as string);
const keySet = new Set([...menuOpenKeys, ...openKeys.value]); const keySet = new Set([...menuOpenKeys, ...openKeys.value]);
openKeys.value = [...keySet]; openKeys.value = [...keySet];

View File

@ -12,7 +12,7 @@ export default function useMenuTree() {
// const appStore = useAppStore(); // const appStore = useAppStore();
const sidebarStore = useSidebarStore(); const sidebarStore = useSidebarStore();
const appRoute = computed(() => { const appRoute = computed(() => {
const _filterRoutes = appRoutes.filter((v) => v.meta.id === sidebarStore.activeMenuId); const _filterRoutes = appRoutes.filter((v) => v.meta?.id === sidebarStore.activeMenuId);
return _filterRoutes; return _filterRoutes;
}); });
const menuTree = computed(() => { const menuTree = computed(() => {

View File

@ -1,88 +1,42 @@
<script lang="ts" setup> <script setup>
import { useAppStore } from '@/stores'; import { useAppStore } from '@/stores';
import { IconExport, IconFile, IconCaretDown } from '@arco-design/web-vue/es/icon'; import { useEnterpriseStore } from '@/stores/modules/enterprise';
import { fetchMenusTree } from '@/api/all'; // import { IconExport, IconFile, IconCaretDown } from '@arco-design/web-vue/es/icon';
import { handleUserLogout } from '@/utils/user'; // import { handleUserLogout } from '@/utils/user';
import { fetchLogOut } from '@/api/all/login'; // import { fetchLogOut } from '@/api/all/login';
import { useSidebarStore } from '@/stores/modules/side-bar'; import { useSidebarStore } from '@/stores/modules/side-bar';
import { MENU_GROUP_IDS } from '@/router/constants'; import { MENU_GROUP_IDS } from '@/router/constants';
import router from '@/router'; import router from '@/router';
import { useRoute } from 'vue-router'; // import { useRoute } from 'vue-router';
import ExitAccountModal from '@/components/_base/exit-account-modal/index.vue'; import ExitAccountModal from '@/components/_base/exit-account-modal/index.vue';
import { appRoutes } from '@/router/routes'; // import { appRoutes } from '@/router/routes';
// import { MENU_LIST } from './constants';
interface MenuItem {
name: string;
id: number;
children: Array<{
name: string;
}>;
}
const lists = ref<MenuItem[]>([]);
const sidebarStore = useSidebarStore(); const sidebarStore = useSidebarStore();
const route = useRoute(); // const enterpriseStore = useEnterpriseStore();
// const route = useRoute();
const exitAccountModalRef = ref(null); const exitAccountModalRef = ref(null);
// const selectedKey = ref([]);
const selectedKey = computed(() => { const selectedKey = computed(() => {
// 判断是否为工作台页面(假设路由名为 'Home' 或 path 为 '/'
if (route.name === 'Home' || route.path === '/') {
return [`${MENU_GROUP_IDS.WORK_BENCH_ID}`];
}
// 其他页面activeMenuId 作为 key
return [String(sidebarStore.activeMenuId)]; return [String(sidebarStore.activeMenuId)];
}); });
const menuList = computed(() => {
return sidebarStore.menuList;
});
const clickExit = async () => { const clickExit = async () => {
exitAccountModalRef.value?.open(); exitAccountModalRef.value?.open();
}; };
const getMenus = async () => {
const res = await fetchMenusTree(); // const appStore = useAppStore();
if (res.code === 200) {
lists.value = res.data;
}
};
onMounted(() => {
getMenus();
});
const appStore = useAppStore();
const setServerMenu = () => { const setServerMenu = () => {
router.push('/management/person'); router.push('/management/person');
}; };
const handleSelect = (index: any) => {
if (index === 0) {
router.push('/');
} else {
router.push('/dataEngine/hotTranslation');
}
};
const flattenRoutes = (routes: any, parentPath = ''): any[] => { const handleDopdownClick = (item) => {
let result: any[] = []; router.push({ name: item.routeName });
for (const route of routes) {
const fullPath = route.path.startsWith('/') ? route.path : parentPath.replace(/\/$/, '') + '/' + route.path;
if (route.children && route.children.length) {
result = result.concat(flattenRoutes(route.children, fullPath));
} else {
result.push({ ...route, fullPath });
}
}
return result;
};
const handleDopdownClick = (index: any, ind: any) => {
const { children } = lists.value[index];
const indPath = children[ind];
const allChildren = flattenRoutes(appRoutes);
const target = allChildren.find((item) => item.meta && item.meta.menuId === indPath.id);
if (target) {
router.push(target.fullPath);
} else {
console.warn('未找到对应的菜单路由', indPath.id);
}
}; };
</script> </script>
@ -95,26 +49,26 @@ const handleDopdownClick = (index: any, ind: any) => {
</div> </div>
<div class="center-side"> <div class="center-side">
<div class="menu-demo h-100%"> <div class="menu-demo h-100%">
<a-menu <a-menu mode="horizontal" :selected-keys="selectedKey">
mode="horizontal" <a-menu-item v-for="item in menuList" :key="String(item.id)">
:selected-keys="selectedKey" <template v-if="item.children">
:default-selected-keys="[`${MENU_GROUP_IDS.WORK_BENCH_ID}`]"
>
<a-menu-item :key="`${MENU_GROUP_IDS.WORK_BENCH_ID}`" @click="handleSelect(0)">
<span class="menu-item-text">工作台</span>
</a-menu-item>
<a-menu-item v-for="(item, index) in lists" :key="String(item.id)">
<a-dropdown :popup-max-height="false" class="layout-menu-item-dropdown"> <a-dropdown :popup-max-height="false" class="layout-menu-item-dropdown">
<a-button> <a-button>
<span class="menu-item-text mr-2px"> {{ item.name }}</span> <span class="menu-item-text mr-2px"> {{ item.name }}</span>
<icon-caret-down size="16" class="arco-icon-down !mr-0" /> <icon-caret-down size="16" class="arco-icon-down !mr-0" />
</a-button> </a-button>
<template #content> <template #content>
<a-doption v-for="(child, ind) in item.children" :key="ind" @click="handleDopdownClick(index, ind)"> <a-doption v-for="(child, ind) in item.children" :key="ind" @click="handleDopdownClick(child)">
<span class="menu-item-text"> {{ child.name }}</span> <span class="menu-item-text"> {{ child.name }}</span>
</a-doption> </a-doption>
</template> </template>
</a-dropdown> </a-dropdown>
</template>
<template v-else>
<a-menu-item :key="String(item.id)" @click="handleDopdownClick(item)">
<span class="menu-item-text"> {{ item.name }}</span>
</a-menu-item>
</template>
</a-menu-item> </a-menu-item>
</a-menu> </a-menu>
</div> </div>

View File

@ -0,0 +1,10 @@
import { useUserStore } from '@/stores/modules/user';
export function checkRoutePermission(routeName: string) {
const userStore = useUserStore();
const allowAccessRoutes = userStore.allowAccessRoutes;
if (!routeName) return false;
return allowAccessRoutes.includes(routeName);
}

View File

@ -5,6 +5,8 @@
import type { Router } from 'vue-router'; import type { Router } from 'vue-router';
import NProgress from 'nprogress'; import NProgress from 'nprogress';
import { goUserLogin } from '@/utils/user'; import { goUserLogin } from '@/utils/user';
// import router from '@/router';
import { checkRoutePermission } from '@/permission/permission';
import { useUserStore } from '@/stores/modules/user'; import { useUserStore } from '@/stores/modules/user';
@ -13,15 +15,27 @@ export default function setupUserLoginInfoGuard(router: Router) {
NProgress.start(); NProgress.start();
const userStore = useUserStore(); const userStore = useUserStore();
const routeName = to?.name as string;
const requiresAuth = to?.meta?.requiresAuth || false; const requiresAuth = to?.meta?.requiresAuth || false;
const isLogin = !!userStore.isLogin; const requireLogin = to?.meta?.requireLogin || false;
if (requiresAuth && !isLogin) { if (requireLogin && !userStore.isLogin) {
goUserLogin(); goUserLogin();
next(); next();
return; return;
} }
if (requiresAuth) {
const hasPermission = checkRoutePermission(routeName);
if (!hasPermission) {
AMessage.error('您没有权限访问该页面');
next('/');
return;
}
next();
return;
}
next(); next();
}); });
router.afterEach((to) => { router.afterEach((to) => {

View File

@ -4,15 +4,15 @@
*/ */
import { createRouter, createWebHistory } from 'vue-router'; import { createRouter, createWebHistory } from 'vue-router';
import { appRoutes } from './routes'; import { appRoutes } from './routes';
import { REDIRECT_MAIN, NOT_FOUND_ROUTE } from './routes/base'; import { NOT_FOUND_ROUTE } from './routes/base';
import NProgress from 'nprogress'; import NProgress from 'nprogress';
import 'nprogress/nprogress.css'; import 'nprogress/nprogress.css';
import { MENU_GROUP_IDS } from './constants';
import createRouteGuard from './guard'; import createRouteGuard from './guard';
NProgress.configure({ showSpinner: false }); // NProgress Configuration NProgress.configure({ showSpinner: false }); // NProgress Configuration
// console.log({ appRoutes });
const router = createRouter({ export const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
routes: [ routes: [
{ {
@ -21,6 +21,7 @@ const router = createRouter({
component: () => import('@/views/components/login'), component: () => import('@/views/components/login'),
meta: { meta: {
requiresAuth: false, requiresAuth: false,
requireLogin: false,
}, },
}, },
{ {
@ -29,27 +30,31 @@ const router = createRouter({
component: () => import('@/views/components/workplace'), component: () => import('@/views/components/workplace'),
meta: { meta: {
hideSidebar: true, hideSidebar: true,
requiresAuth: true, requiresAuth: false,
requireLogin: true,
id: MENU_GROUP_IDS.WORK_BENCH_ID,
}, },
}, },
{ {
path: '/permission', path: '/permission',
name: 'permission', name: 'permission',
component: () => import('@/views/components/permission/choose-enterprise.vue'), component: () => import('@/views/components/permission/choose-enterprise.vue'),
meta: {
requiresAuth: true,
},
},
{
path: '/auth',
name: 'auth',
component: () => import('@/views/components/permission/auth.vue'),
meta: { meta: {
requiresAuth: false, requiresAuth: false,
requireLogin: true,
}, },
}, },
// {
// path: '/auth',
// name: 'auth',
// component: () => import('@/views/components/permission/auth.vue'),
// meta: {
// requiresAuth: false,
// requireLogin: true,
// },
// },
...appRoutes, ...appRoutes,
REDIRECT_MAIN, // REDIRECT_MAIN,
NOT_FOUND_ROUTE, NOT_FOUND_ROUTE,
], ],
scrollBehavior() { scrollBehavior() {

View File

@ -1,28 +1,35 @@
import type { RouteRecordRaw } from 'vue-router'; import type { RouteRecordRaw } from 'vue-router';
import { REDIRECT_ROUTE_NAME } from '@/router/constants'; import { REDIRECT_ROUTE_NAME } from '@/router/constants';
export const REDIRECT_MAIN: RouteRecordRaw = { // export const REDIRECT_MAIN: RouteRecordRaw = {
path: '/redirect', // path: '/redirect',
name: 'redirect', // name: 'redirect',
meta: { // meta: {
requiresAuth: true, // requiresAuth: false,
hideInMenu: true, // requireLogin: false,
}, // hideInMenu: true,
children: [ // },
{ // children: [
path: '/redirect/:path', // {
name: REDIRECT_ROUTE_NAME, // path: '/redirect/:path',
component: () => import('@/layouts/Basic.vue'), // name: REDIRECT_ROUTE_NAME,
meta: { // component: () => import('@/layouts/Basic.vue'),
requiresAuth: true, // meta: {
hideInMenu: true, // requiresAuth: false,
}, // requireLogin: false,
}, // hideInMenu: true,
], // },
}; // },
// ],
// };
export const NOT_FOUND_ROUTE: RouteRecordRaw = { export const NOT_FOUND_ROUTE: RouteRecordRaw = {
path: '/:pathMatch(.*)*', path: '/:pathMatch(.*)*',
name: 'notFound', name: 'notFound',
component: () => import('@/layouts/NotFound.vue'), component: () => import('@/layouts/NotFound.vue'),
meta: {
requiresAuth: false,
hideInMenu: true,
hideSidebar: true,
},
}; };

View File

@ -1,4 +1,6 @@
import type { RouteRecordNormalized } from 'vue-router'; import type { RouteRecordNormalized } from 'vue-router';
// import { REDIRECT_MAIN, NOT_FOUND_ROUTE } from './base';
import { MENU_GROUP_IDS } from '@/router/constants';
const modules = import.meta.glob('./modules/*.ts', { eager: true }); const modules = import.meta.glob('./modules/*.ts', { eager: true });
// const externalModules = import.meta.glob('./externalModules/*.ts', { // const externalModules = import.meta.glob('./externalModules/*.ts', {

View File

@ -15,8 +15,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
locale: '全域数据引擎', locale: '全域数据引擎',
icon: IconBookmark, icon: IconBookmark,
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.DATA_ENGINE_ID, id: MENU_GROUP_IDS.DATA_ENGINE_ID,
}, },
children: [ children: [
@ -26,8 +26,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '行业热门话题洞察', locale: '行业热门话题洞察',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 2,
}, },
component: () => import('@/views/components/dataEngine/hotTranslation.vue'), component: () => import('@/views/components/dataEngine/hotTranslation.vue'),
}, },
@ -37,8 +37,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '行业词云', locale: '行业词云',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 3,
}, },
component: () => import('@/views/components/dataEngine/hotCloud.vue'), component: () => import('@/views/components/dataEngine/hotCloud.vue'),
}, },
@ -48,8 +48,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '行业关键词动向', locale: '行业关键词动向',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 4,
}, },
component: () => import('@/views/components/dataEngine/keyWord.vue'), component: () => import('@/views/components/dataEngine/keyWord.vue'),
}, },
@ -59,8 +59,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '用户痛点观察', locale: '用户痛点观察',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 5,
}, },
component: () => import('@/views/components/dataEngine/userPainPoints.vue'), component: () => import('@/views/components/dataEngine/userPainPoints.vue'),
}, },
@ -70,8 +70,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '重点品牌动向', locale: '重点品牌动向',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 6,
}, },
component: () => import('@/views/components/dataEngine/keyBrandMovement.vue'), component: () => import('@/views/components/dataEngine/keyBrandMovement.vue'),
}, },
@ -81,8 +81,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '用户画像', locale: '用户画像',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 7,
}, },
component: () => import('@/views/components/dataEngine/userPersona.vue'), component: () => import('@/views/components/dataEngine/userPersona.vue'),
}, },

View File

@ -14,9 +14,9 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '管理中心', locale: '管理中心',
icon: IconBookmark, icon: IconBookmark,
requiresAuth: true, requiresAuth: false,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.MANAGEMENT_ID, id: MENU_GROUP_IDS.MANAGEMENT_ID,
}, },
children: [ children: [
@ -26,7 +26,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
component: () => import('@/views/components/management/person'), component: () => import('@/views/components/management/person'),
meta: { meta: {
locale: '个人信息', locale: '个人信息',
requiresAuth: true, requiresAuth: false,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
}, },
@ -36,7 +37,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
component: () => import('@/views/components/management/enterprise'), component: () => import('@/views/components/management/enterprise'),
meta: { meta: {
locale: '企业信息', locale: '企业信息',
requiresAuth: true, requiresAuth: false,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
}, },
@ -46,7 +48,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
component: () => import('@/views/components/management/account'), component: () => import('@/views/components/management/account'),
meta: { meta: {
locale: '账号管理', locale: '账号管理',
requiresAuth: true, requiresAuth: false,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
}, },

View File

@ -19,8 +19,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
locale: '品牌资产管理', locale: '品牌资产管理',
icon: IconRepository, icon: IconRepository,
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.PROPERTY_ID, id: MENU_GROUP_IDS.PROPERTY_ID,
}, },
children: [ children: [
@ -30,8 +30,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '品牌信息', locale: '品牌信息',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 11,
}, },
component: () => import('@/views/property-marketing/brands/brand-materials/index.vue'), component: () => import('@/views/property-marketing/brands/brand-materials/index.vue'),
}, },
@ -45,8 +45,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
locale: '账号资源中心', locale: '账号资源中心',
icon: IconMediaAccount, icon: IconMediaAccount,
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.PROPERTY_ID, id: MENU_GROUP_IDS.PROPERTY_ID,
}, },
children: [ children: [
@ -56,8 +56,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '账号管理', locale: '账号管理',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 12,
}, },
component: () => import('@/views/property-marketing/media-account/account-manage'), component: () => import('@/views/property-marketing/media-account/account-manage'),
}, },
@ -67,6 +67,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '账号数据看板', locale: '账号数据看板',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
component: () => import('@/views/property-marketing/media-account/account-dashboard'), component: () => import('@/views/property-marketing/media-account/account-dashboard'),
@ -77,6 +78,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '账号详情', locale: '账号详情',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
hideInMenu: true, hideInMenu: true,
activeMenu: 'MediaAccountAccountDashboard', activeMenu: 'MediaAccountAccountDashboard',
@ -93,8 +95,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
locale: '投放资源中心', locale: '投放资源中心',
icon: IconPutAccount, icon: IconPutAccount,
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.PROPERTY_ID, id: MENU_GROUP_IDS.PROPERTY_ID,
}, },
children: [ children: [
@ -104,8 +106,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '账户管理', locale: '账户管理',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 13,
}, },
component: () => import('@/views/property-marketing/put-account/account-manage'), component: () => import('@/views/property-marketing/put-account/account-manage'),
}, },
@ -115,6 +117,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '账户数据', locale: '账户数据',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
component: () => import('@/views/property-marketing/put-account/account-data'), component: () => import('@/views/property-marketing/put-account/account-data'),
@ -125,6 +128,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '投放表现分析', locale: '投放表现分析',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
component: () => import('@/views/property-marketing/put-account/account-dashboard'), component: () => import('@/views/property-marketing/put-account/account-dashboard'),
@ -135,6 +139,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '投放指南', locale: '投放指南',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
component: () => import('@/views/property-marketing/put-account/investment-guidelines'), component: () => import('@/views/property-marketing/put-account/investment-guidelines'),
@ -161,8 +166,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
locale: '智能方案管理', locale: '智能方案管理',
icon: IconIntelligentSolution, icon: IconIntelligentSolution,
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
requiresSidebar: true,
id: MENU_GROUP_IDS.PROPERTY_ID, id: MENU_GROUP_IDS.PROPERTY_ID,
}, },
children: [ children: [
@ -172,8 +177,8 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '业务洞察报告', locale: '业务洞察报告',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
menuId: 14,
}, },
component: () => import('@/views/property-marketing/intelligent-solution/businessAnalysisReport'), component: () => import('@/views/property-marketing/intelligent-solution/businessAnalysisReport'),
}, },
@ -183,6 +188,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
meta: { meta: {
locale: '竟品对比报告', locale: '竟品对比报告',
requiresAuth: true, requiresAuth: true,
requireLogin: true,
roles: ['*'], roles: ['*'],
}, },
component: () => import('@/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport'), component: () => import('@/views/property-marketing/intelligent-solution/competitiveProductAnalysisReport'),

View File

@ -14,5 +14,6 @@ declare module 'vue-router' {
noAffix?: boolean; // if set true, the tag will not affix in the tab-bar noAffix?: boolean; // if set true, the tag will not affix in the tab-bar
ignoreCache?: boolean; // if set true, the page will not be cached ignoreCache?: boolean; // if set true, the page will not be cached
hideSidebar?: boolean; hideSidebar?: boolean;
requireLogin?: boolean; // 是否需要登陆才能访问
} }
} }

View File

@ -1,4 +1,7 @@
import { fetchEnterpriseInfo } from '@/api/all/login'; import { fetchEnterpriseInfo } from '@/api/all/login';
import { useSidebarStore } from '@/stores/modules/side-bar';
import { useUserStore } from '@/stores/modules/user';
import { glsWithCatch, slsWithCatch, rlsWithCatch } from '@/utils/stroage';
interface EnterpriseInfo { interface EnterpriseInfo {
id: number; id: number;
@ -7,6 +10,7 @@ interface EnterpriseInfo {
used_update_name_count: number; used_update_name_count: number;
sub_account_quota: number; sub_account_quota: number;
used_sub_account_count: number; used_sub_account_count: number;
permissions: string[];
} }
interface EnterpriseState { interface EnterpriseState {
@ -15,24 +19,14 @@ interface EnterpriseState {
export const useEnterpriseStore = defineStore('enterprise', { export const useEnterpriseStore = defineStore('enterprise', {
state: (): EnterpriseState => ({ state: (): EnterpriseState => ({
enterpriseInfo: (() => { enterpriseInfo: (glsWithCatch('enterpriseInfo') && JSON.parse(glsWithCatch('enterpriseInfo') as string)) || null,
const stored = localStorage.getItem('enterpriseInfo');
if (stored) {
try {
return JSON.parse(stored) as EnterpriseInfo;
} catch {
return null;
}
}
return null;
})(),
}), }),
actions: { actions: {
setEnterpriseInfo(enterpriseInfo: EnterpriseInfo) { setEnterpriseInfo(enterpriseInfo: EnterpriseInfo) {
this.enterpriseInfo = enterpriseInfo; this.enterpriseInfo = enterpriseInfo;
localStorage.setItem('enterpriseInfo', JSON.stringify(enterpriseInfo)); slsWithCatch('enterpriseInfo', JSON.stringify(enterpriseInfo));
}, },
clearEnterpriseInfo() { clearUserEnterpriseInfo() {
this.enterpriseInfo = null; this.enterpriseInfo = null;
localStorage.removeItem('enterpriseInfo'); localStorage.removeItem('enterpriseInfo');
}, },
@ -51,15 +45,13 @@ export const useEnterpriseStore = defineStore('enterprise', {
this.enterpriseInfo.used_sub_account_count++; this.enterpriseInfo.used_sub_account_count++;
} }
}, },
getEnterpriseInfo(): EnterpriseInfo | null { async getEnterpriseInfo() {
return this.enterpriseInfo; if (this.enterpriseInfo) {
}, const { code, data } = await fetchEnterpriseInfo(this.enterpriseInfo!.id);
async updateEnterpriseInfo() {
const res = await fetchEnterpriseInfo(this.enterpriseInfo!.id);
const { code, data } = res;
if (code === 200) { if (code === 200) {
this.setEnterpriseInfo(data); this.setEnterpriseInfo(data);
} }
}
}, },
}, },
}); });

View File

@ -0,0 +1,90 @@
import { MENU_GROUP_IDS } from '@/router/constants';
export const MENU_LIST = [
{
id: MENU_GROUP_IDS.WORK_BENCH_ID,
name: '工作台',
routeName: 'Home',
includeRouteNames: ['Home'],
requiresAuth: false,
permissionKey: '', // 权限key如果为空则表示该菜单不需要权限与后端约定
},
{
id: MENU_GROUP_IDS.DATA_ENGINE_ID,
name: '全域数据分析',
permissionKey: 'data_analysis',
requiresAuth: true,
children: [
{
name: '行业热门话题洞察',
routeName: 'DataEngineHotTranslation',
includeRouteNames: ['DataEngineHotTranslation'],
},
{
name: '行业词云',
routeName: 'DataEngineHotCloud',
includeRouteNames: ['DataEngineHotCloud'],
},
{
name: '行业关键词动向',
routeName: 'DataEngineKeyWord',
includeRouteNames: ['DataEngineKeyWord'],
},
{
name: '用户痛点观察',
routeName: 'DataEngineUserPainPoints',
includeRouteNames: ['DataEngineUserPainPoints'],
},
{
name: '重点品牌动向',
routeName: 'DataEngineKeyBrandMovement',
includeRouteNames: ['DataEngineKeyBrandMovement'],
},
{
name: '用户画像',
routeName: 'DataEngineUserPersona',
includeRouteNames: ['DataEngineUserPersona'],
},
],
},
{
id: MENU_GROUP_IDS.PROPERTY_ID,
name: '营销资产中台',
permissionKey: 'marketing_asset',
requiresAuth: true,
children: [
{
name: '品牌资产管理',
routeName: 'RepositoryBrandMaterials',
includeRouteNames: ['RepositoryBrandMaterials'],
},
{
name: '账号资源中心',
routeName: 'MediaAccountAccountManagement',
includeRouteNames: [
'MediaAccountAccountManagement',
'MediaAccountAccountDashboard',
'MediaAccountAccountDetails',
],
},
{
name: '投放资源中心',
routeName: 'PutAccountAccountManagement',
includeRouteNames: [
'PutAccountAccountManagement',
'PutAccountAccountData',
'PutAccountAccountDashboard',
'PutAccountInvestmentGuidelines',
'guideDetail',
],
},
{
name: '智能方案管理',
routeName: 'IntelligentSolutionBusinessAnalysisReport',
includeRouteNames: [
'IntelligentSolutionBusinessAnalysisReport',
'IntelligentSolutionCompetitiveProductAnalysisReport',
],
},
],
},
];

View File

@ -3,19 +3,23 @@
* @Date: 2025-06-23 22:13:30 * @Date: 2025-06-23 22:13:30
*/ */
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { MENU_GROUP_IDS } from '@/router/constants'; import router from '@/router';
import { appRoutes } from '@/router/routes';
import type { RouteLocationNormalized } from 'vue-router'; import type { RouteLocationNormalized } from 'vue-router';
import { MENU_LIST } from './constants';
const { DATA_ENGINE_ID, MANAGEMENT_ID } = MENU_GROUP_IDS; import { useEnterpriseStore } from '@/stores/modules/enterprise';
interface sidebarState { interface sidebarState {
activeMenuId: number | null; activeMenuId: number | null;
menuList: any[];
allowAccessRoutes: any[];
} }
export const useSidebarStore = defineStore('sidebar', { export const useSidebarStore = defineStore('sidebar', {
state: (): sidebarState => ({ state: (): sidebarState => ({
activeMenuId: null, activeMenuId: null,
menuList: [],
allowAccessRoutes: [], // 允许访问的路由列表
}), }),
actions: { actions: {
clearActiveMenuId() { clearActiveMenuId() {
@ -24,14 +28,25 @@ export const useSidebarStore = defineStore('sidebar', {
setActiveMenuId(id: number) { setActiveMenuId(id: number) {
this.activeMenuId = id; this.activeMenuId = id;
}, },
clearUserNavbarMenuList() {
this.menuList = [];
},
// navbar菜单列表由企业对应权限决定
getUserNavbarMenuList() {
const enterpriseStore = useEnterpriseStore();
this.menuList = MENU_LIST.filter(
(item) => !item.permissionKey || enterpriseStore.enterpriseInfo?.permissions?.includes(item.permissionKey),
);
},
// 根据当前路由自动设置 activeMenuId // 根据当前路由自动设置 activeMenuId
setActiveMenuIdByRoute(route: RouteLocationNormalized) { setActiveMenuIdByRoute(route: RouteLocationNormalized) {
// console.log('setActiveMenuIdByRoute '); const appRoutes = router.options?.routes ?? [];
// 查找当前路由所属的菜单组 // 查找当前路由所属的菜单组
const findMenuGroup = (routes: any[]): number | null => { const findMenuGroup = (routes: any[]): number | null => {
for (const routeItem of routes) { for (const routeItem of routes) {
// 检查子路由 // 检查子路由
if (routeItem.children && routeItem.children.length > 0) { if (routeItem.children?.length > 0) {
// 检查当前路由是否是这个父路由的子路由 // 检查当前路由是否是这个父路由的子路由
const isChildRoute = routeItem.children.some((child: any) => child.name === route.name); const isChildRoute = routeItem.children.some((child: any) => child.name === route.name);
if (isChildRoute) { if (isChildRoute) {
@ -42,12 +57,16 @@ export const useSidebarStore = defineStore('sidebar', {
if (childResult !== null) { if (childResult !== null) {
return routeItem.meta?.id || childResult; return routeItem.meta?.id || childResult;
} }
} else {
if (routeItem.name === route.name) {
return routeItem.meta?.id || null;
}
} }
} }
return null; return null;
}; };
const menuId = findMenuGroup(appRoutes); const menuId = findMenuGroup(appRoutes as any);
if (menuId !== null) { if (menuId !== null) {
this.activeMenuId = menuId; this.activeMenuId = menuId;
} }

View File

@ -1,5 +1,10 @@
import type { RouteRecordNormalized } from 'vue-router';
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { fetchProfileInfo } from '@/api/all/login'; import { fetchProfileInfo } from '@/api/all/login';
import { useSidebarStore } from '@/stores/modules/side-bar';
import router from '@/router';
import { glsWithCatch, slsWithCatch, rlsWithCatch } from '@/utils/stroage';
interface UserInfo { interface UserInfo {
id: number; id: number;
@ -10,16 +15,10 @@ interface UserInfo {
// 添加其他用户属性... // 添加其他用户属性...
} }
interface CompanyInfo {
id: number;
name: string;
// 添加其他公司属性...
}
interface UserState { interface UserState {
token: string; token: string;
userInfo: UserInfo | null; userInfo: UserInfo | null;
companyInfo: CompanyInfo | null; allowAccessRoutes: string[];
// isLogin: boolean; // isLogin: boolean;
} }
@ -31,9 +30,10 @@ interface UserInfo {
export const useUserStore = defineStore('user', { export const useUserStore = defineStore('user', {
state: (): UserState => ({ state: (): UserState => ({
token: localStorage.getItem('accessToken') || '', token: glsWithCatch('accessToken') || '',
userInfo: null, userInfo: (glsWithCatch('userInfo') && JSON.parse(glsWithCatch('userInfo') as string)) || null,
companyInfo: null, allowAccessRoutes:
(glsWithCatch('allowAccessRoutes') && JSON.parse(glsWithCatch('allowAccessRoutes') as string)) || [], // 允许访问的路由列表
}), }),
getters: { getters: {
isLogin(): boolean { isLogin(): boolean {
@ -44,12 +44,12 @@ export const useUserStore = defineStore('user', {
// 设置 Token // 设置 Token
setToken(token: string) { setToken(token: string) {
this.token = `Bearer ${token}`; this.token = `Bearer ${token}`;
localStorage.setItem('accessToken', this.token); slsWithCatch('accessToken', this.token);
}, },
deleteToken() { deleteToken() {
this.token = ''; this.token = '';
localStorage.removeItem('accessToken'); rlsWithCatch('accessToken');
}, },
// 获取 Token // 获取 Token
@ -60,14 +60,54 @@ export const useUserStore = defineStore('user', {
// 设置用户信息 // 设置用户信息
setUserInfo(userInfo: UserInfo | null) { setUserInfo(userInfo: UserInfo | null) {
this.userInfo = userInfo; this.userInfo = userInfo;
slsWithCatch('userInfo', JSON.stringify(userInfo));
},
clearUserInfo() {
this.userInfo = null;
rlsWithCatch('userInfo');
}, },
// 获取用户信息 // 获取用户信息
async fetchUserInfo() { async getUserInfo() {
const { code, data } = await fetchProfileInfo(); const { code, data } = await fetchProfileInfo();
if (code === 200) { if (code === 200) {
this.setUserInfo(data); this.setUserInfo(data);
} }
}, },
clearUserAllowAccessRoutes() {
this.allowAccessRoutes = [];
rlsWithCatch('allowAccessRoutes');
},
getUserAllowAccessRoutes() {
const sidebarStore = useSidebarStore();
const menuList = sidebarStore.menuList;
const appRoutes = router.getRoutes();
appRoutes.forEach((route: any) => {
if (!route.meta?.requiresAuth) {
this.allowAccessRoutes.push(route.name);
}
});
const pushAllowAccessRoutes = (includeRouteNames: string[]) => {
const matchedRoute = appRoutes
.filter((route: any) => includeRouteNames.includes(route.name))
.map((route: any) => route.name);
this.allowAccessRoutes.push(...matchedRoute);
};
menuList.forEach((item) => {
if (item.children && item.children.length > 0) {
item.children.forEach((child: any) => {
pushAllowAccessRoutes(child.includeRouteNames);
});
} else {
pushAllowAccessRoutes(item.includeRouteNames);
}
});
this.allowAccessRoutes = uniq(this.allowAccessRoutes);
slsWithCatch('allowAccessRoutes', JSON.stringify(this.allowAccessRoutes));
},
}, },
}); });

View File

@ -1,24 +1,30 @@
@font-face { @font-face {
font-family: 'PuHuiTi-Medium'; font-family: 'PuHuiTi-Regular';
src: url('@/assets/fonts/Alibaba-PuHuiTi-Medium.otf'); src: url('@/assets/fonts/Alibaba-PuHuiTi-Regular.woff2') format('woff2');
font-display: swap;
} }
@font-face { @font-face {
font-family: 'PuHuiTi-Regular'; font-family: 'PuHuiTi-Medium';
src: url('@/assets/fonts/Alibaba-PuHuiTi-Regular.otf'); src: url('@/assets/fonts/Alibaba-PuHuiTi-Medium.woff2') format('woff2');
font-display: swap;
} }
@font-face { @font-face {
font-family: 'PuHuiTi-Bold'; font-family: 'PuHuiTi-Bold';
src: url('@/assets/fonts/Alibaba-PuHuiTi-Bold.otf'); src: url('@/assets/fonts/Alibaba-PuHuiTi-Bold.woff2') format('woff2');
font-display: swap;
}
// 使用统一的字体族名
.font-family-puhui-regular {
font-family: 'PuHuiTi-Regular' !important;
}
.font-family-puhui-medium {
font-family: 'PuHuiTi-Medium' !important;
} }
.font-family-puhui-bold { .font-family-puhui-bold {
font-family: PuHuiTi-Bold !important; font-family: 'PuHuiTi-Bold' !important;
}
.font-family-puhui-medium {
font-family: PuHuiTi-Medium !important;
}
.font-family-puhui-regular {
font-family: PuHuiTi-Regular !important;
} }

47
src/utils/stroage.ts Normal file
View File

@ -0,0 +1,47 @@
export const glsWithCatch = (key: string) => {
try {
return localStorage?.getItem(key);
} catch (error) {
console.log(error);
}
};
export const slsWithCatch = (key: string, value: any) => {
try {
localStorage?.setItem(key, value);
} catch (error) {
console.log(error);
}
};
export const rlsWithCatch = (key: string) => {
try {
localStorage?.removeItem(key);
} catch (error) {
console.log(error);
}
};
export const gssWithCatch = (key: string) => {
try {
return sessionStorage?.getItem(key);
} catch (error) {
console.log(error);
}
};
export const sssWithCatch = (key: string, value: any) => {
try {
sessionStorage?.setItem(key, value);
} catch (error) {
console.log(error);
}
};
export const rssWithCatch = (key: string) => {
try {
sessionStorage?.removeItem(key);
} catch (error) {
console.log(error);
}
};

View File

@ -12,9 +12,24 @@ import { useSidebarStore } from '@/stores/modules/side-bar';
export function goUserLogin(query?: any) { export function goUserLogin(query?: any) {
router.push({ name: 'UserLogin', query }); router.push({ name: 'UserLogin', query });
} }
// 初始化企业信息、navbar菜单、允许访问的路由
export const getUserEnterpriseInfo = async () => {
const enterpriseStore = useEnterpriseStore();
const sidebarStore = useSidebarStore();
const userStore = useUserStore();
await enterpriseStore.getEnterpriseInfo();
sidebarStore.getUserNavbarMenuList(); // 初始化navbar菜单
userStore.getUserAllowAccessRoutes(); // 初始化允许访问的路由
};
// 登录处理 // 登录处理
export async function handleUserLogin() { export async function handleUserLogin() {
const userStore = useUserStore();
await userStore.getUserInfo(); // 初始化用户信息
await getUserEnterpriseInfo();
handleUserHome(); handleUserHome();
} }
@ -28,9 +43,13 @@ export function handleUserLogout() {
const enterpriseStore = useEnterpriseStore(); const enterpriseStore = useEnterpriseStore();
const sidebarStore = useSidebarStore(); const sidebarStore = useSidebarStore();
userStore.deleteToken(); userStore.clearUserInfo();
enterpriseStore.clearEnterpriseInfo(); enterpriseStore.clearUserEnterpriseInfo();
sidebarStore.clearUserNavbarMenuList();
userStore.clearUserAllowAccessRoutes();
sidebarStore.clearActiveMenuId(); sidebarStore.clearActiveMenuId();
userStore.deleteToken();
goUserLogin(); goUserLogin();
} }

View File

@ -225,7 +225,6 @@ const clearError = (field: string) => {
const handleOk = async () => { const handleOk = async () => {
visible.value = false; visible.value = false;
await enterpriseStore.updateEnterpriseInfo();
handleUserLogin(); handleUserLogin();
}; };
@ -269,11 +268,9 @@ const getProfileInfo = async () => {
mobileNumber.value = data['mobile']; mobileNumber.value = data['mobile'];
accounts.value = enterprises; accounts.value = enterprises;
enterpriseStore.setEnterpriseInfo(data); enterpriseStore.setEnterpriseInfo(data);
userStore.setUserInfo(data);
if (enterprises.length > 0) { if (enterprises.length > 0) {
if (enterprises.length === 1) { if (enterprises.length === 1) {
await enterpriseStore.updateEnterpriseInfo();
handleUserLogin(); handleUserLogin();
} else { } else {
// 多个企业时候需要弹窗让用户选择企业 // 多个企业时候需要弹窗让用户选择企业

View File

@ -99,7 +99,7 @@ const addAccountVisible = ref(false);
const deleteVisible = ref(false); const deleteVisible = ref(false);
const deleteTitle = ref(''); const deleteTitle = ref('');
const enterpriseInfo = store.getEnterpriseInfo(); const enterpriseInfo = store.enterpriseInfo;
const okText = computed(() => { const okText = computed(() => {
if (!canAddAccount.value) { if (!canAddAccount.value) {

View File

@ -48,7 +48,7 @@ const form = reactive({
name: '', name: '',
}); });
const enterpriseInfo = store.getEnterpriseInfo(); const enterpriseInfo = store.enterpriseInfo;
const columns = [ const columns = [
{ {

View File

@ -26,7 +26,7 @@
v-if="props.product.status === Status.Enable || props.product.status === Status.ON_TRIAL" v-if="props.product.status === Status.Enable || props.product.status === Status.ON_TRIAL"
class="primary-button" class="primary-button"
type="primary" type="primary"
@click="gotoModule(props.product.menu_id)" @click="gotoModule(props.product.id)"
> >
进入模块 进入模块
</a-button> </a-button>
@ -70,13 +70,16 @@ import { trialProduct } from '@/api/all';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import CustomerServiceModal from '@/components/customer-service-modal.vue'; import CustomerServiceModal from '@/components/customer-service-modal.vue';
import { appRoutes } from '@/router/routes'; import { appRoutes } from '@/router/routes';
import { useSidebarStore } from '@/stores/modules/side-bar'; import { useSidebarStore } from '@/stores/modules/side-bar';
import { useEnterpriseStore } from '@/stores/modules/enterprise';
import { useUserStore } from '@/stores';
import { getUserEnterpriseInfo } from '@/utils/user';
const props = defineProps<{ const props = defineProps<{
product: Product; product: Product;
}>(); }>();
const emit = defineEmits(['refresh']); const emit = defineEmits(['refresh']);
const sidebarStore = useSidebarStore();
enum Status { enum Status {
Disable = 0, // 禁用 Disable = 0, // 禁用
@ -87,30 +90,37 @@ enum Status {
} }
interface Product { interface Product {
id: number;
status: Status; status: Status;
name: string; name: string;
image: string; image: string;
desc: string; desc: string;
menu_id: number; id: number;
expired_at?: number; expired_at?: number;
} }
const visible = ref(false); const visible = ref(false);
const router = useRouter(); const router = useRouter();
const enterpriseStore = useEnterpriseStore();
const userStore = useUserStore();
const sidebarStore = useSidebarStore();
const handleTrial = async (id: any) => { const handleTrial = async (id: any) => {
await trialProduct(id); const { code } = await trialProduct(id);
if (code === 200) {
getUserEnterpriseInfo();
AMessage.success('试用成功!'); AMessage.success('试用成功!');
emit('refresh'); emit('refresh');
}
}; };
const gotoModule = (menuId: number) => { const gotoModule = (menuId: number) => {
const _target = appRoutes.find((v) => v.meta.id === menuId); const routeMap: Record<number, string> = {
if (_target) { '1': 'DataEngineHotTranslation',
console.log({ _target }); '2': 'RepositoryBrandMaterials',
router.push({ name: _target.name }); };
} console.log(routeMap[menuId]);
router.push({ name: routeMap[menuId] });
}; };
</script> </script>
<style scoped lang="less"> <style scoped lang="less">

View File

@ -87,15 +87,12 @@
</a-form-item> </a-form-item>
</template> </template>
<a-form-item label="手机号" field="mobile" required> <a-form-item label="手机号" field="mobile" required>
<a-input v-model="form.mobile" placeholder="请输入..." size="large" /> <a-input v-model="form.mobile" placeholder="请输入..." size="large" />
</a-form-item> </a-form-item>
<a-form-item label="运营人员" field="operator_name" required> <a-form-item label="运营人员" field="operator_name" required>
<a-input v-model="form.operator_name" placeholder="请输入..." class="w-240px" size="large" /> <a-input v-model="form.operator_name" placeholder="请输入..." class="w-240px" size="large" />
</a-form-item> </a-form-item>
<a-form-item label="号码持有人" field="holder_name" required>
<a-input v-model="form.holder_name" placeholder="请输入..." class="w-240px" size="large" />
</a-form-item>
<a-form-item label="运营平台" :required="!isEdit"> <a-form-item label="运营平台" :required="!isEdit">
<img v-if="isEdit" :src="form.platform === 0 ? icon3 : icon4" width="24" height="24" /> <img v-if="isEdit" :src="form.platform === 0 ? icon3 : icon4" width="24" height="24" />
<a-radio-group v-else v-model="form.platform"> <a-radio-group v-else v-model="form.platform">
@ -103,6 +100,9 @@
<a-radio :value="1">小红书</a-radio> <a-radio :value="1">小红书</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item label="号码持有人" field="holder_name">
<a-input v-model="form.holder_name" placeholder="请输入..." class="w-240px" size="large" />
</a-form-item>
<a-form-item label="选择分组"> <a-form-item label="选择分组">
<GroupSelect <GroupSelect
v-model="form.group_id" v-model="form.group_id"
@ -130,6 +130,26 @@
:auto-size="{ minRows: 3, maxRows: 5 }" :auto-size="{ minRows: 3, maxRows: 5 }"
/> />
</a-form-item> </a-form-item>
<template v-if="!isEdit">
<a-form-item label="Cookie值">
<template #label>
<span class="label">Cookie值</span>
<a-tooltip content="开启后可直接填写 Cookie无需扫码授权">
<icon-question-circle size="14" class="ml-4px color-#737478" />
</a-tooltip>
</template>
<a-switch v-model="isCustomCookie" size="large" />
</a-form-item>
<a-form-item v-if="isCustomCookie" label="" field="cookie">
<a-textarea
v-model="form.cookie"
placeholder="请输入..."
size="large"
max-length="72"
:auto-size="{ minRows: 3, maxRows: 5 }"
/>
</a-form-item>
</template>
</template> </template>
</a-form> </a-form>
<template #footer> <template #footer>
@ -181,7 +201,8 @@ const INITIAL_FORM = {
platform: 0, platform: 0,
group_id: undefined, group_id: undefined,
tag_ids: [], tag_ids: [],
end_work_link: '', end_work_link: undefined,
cookie: undefined,
}; };
const groupOptions = ref([]); const groupOptions = ref([]);
@ -197,6 +218,7 @@ const file = ref(null);
const authorizedAccountModalRef = ref(null); const authorizedAccountModalRef = ref(null);
const importPromptModalRef = ref(null); const importPromptModalRef = ref(null);
const uploadRef = ref(null); const uploadRef = ref(null);
const isCustomCookie = ref(false);
const form = ref(cloneDeep(INITIAL_FORM)); const form = ref(cloneDeep(INITIAL_FORM));
const rules = { const rules = {
@ -218,7 +240,7 @@ const rules = {
}, },
], ],
operator_name: [{ required: true, message: '请输入运营人员' }], operator_name: [{ required: true, message: '请输入运营人员' }],
holder_name: [{ required: true, message: '请输入号码持有人' }], // holder_name: [{ required: true, message: '请输入号码持有人' }],
}; };
const isBatchImport = computed(() => uploadType.value === 'batch'); const isBatchImport = computed(() => uploadType.value === 'batch');
@ -266,6 +288,7 @@ const reset = () => {
fileName.value = ''; fileName.value = '';
file.value = null; file.value = null;
isEdit.value = false; isEdit.value = false;
isCustomCookie.value = false;
uploadStatus.value = UploadStatus.DEFAULT; uploadStatus.value = UploadStatus.DEFAULT;
uploadType.value = 'manual'; uploadType.value = 'manual';
}; };
@ -320,6 +343,30 @@ const handleBatchImport = async () => {
} }
}; };
const handleAddAccount = async () => {
const _isCustomCookie = isCustomCookie.value;
const { code, data } = await postMediaAccounts({
...form.value,
cookie: _isCustomCookie ? form.value.cookie : undefined,
});
if (code === 200) {
emits('update');
onClose();
const { id, platform } = data;
!_isCustomCookie && startAuthorized(id, platform);
}
};
const handleEditAccount = async () => {
const { code } = await putMediaAccounts({ id: id.value, ...form.value });
if (code === 200) {
AMessage.success('修改成功');
emits('update');
onClose();
}
};
async function onSubmit() { async function onSubmit() {
if (isBatchImport.value) { if (isBatchImport.value) {
handleBatchImport(); handleBatchImport();
@ -328,17 +375,7 @@ async function onSubmit() {
formRef.value.validate(async (errors) => { formRef.value.validate(async (errors) => {
if (!errors) { if (!errors) {
const _fn = id.value ? putMediaAccounts : postMediaAccounts; isEdit.value ? handleEditAccount() : handleAddAccount();
const _params = id.value ? { id: id.value, ...form.value } : form.value;
const { code, data } = await _fn(_params);
if (code === 200) {
isEdit.value && AMessage.success('修改成功');
emits('update');
onClose();
if (!isEdit.value) {
startAuthorized(data?.id, data?.platform);
}
}
} }
}); });
} }

View File

@ -34,7 +34,7 @@
<div class="img-box"> <div class="img-box">
<template v-if="qrCodeLoading || isFailLoadQrCode"> <template v-if="qrCodeLoading || isFailLoadQrCode">
<div class="relative w-160px h-160px"> <div class="relative w-160px h-160px">
<a-image v-if="qrCodeLoading" :src="icon1" width="160" height="160" /> <a-image :src="icon1" width="160" height="160" />
<div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center"> <div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
<img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" /> <img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" />
<icon-loading v-else size="24" class="color-#6D4CFE mb-13px" /> <icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
@ -49,7 +49,7 @@
</template> </template>
<a-image v-else :src="qrCodeUrl" width="160" height="160" /> <a-image v-else :src="qrCodeUrl" width="160" height="160" />
<div v-if="isOverdue" class="mask cursor-pointer" @click="getAuthorizedQrCode"> <div v-if="isOverdue" class="mask cursor-pointer" @click="handleRefreshQrCode">
<icon-refresh size="24" class="mb-13px" /> <icon-refresh size="24" class="mb-13px" />
<p class="s1">二维码失效</p> <p class="s1">二维码失效</p>
<p class="s1">请点击刷新</p> <p class="s1">请点击刷新</p>
@ -225,11 +225,15 @@ const clearOverdueTimer = () => {
overdueTimer = null; overdueTimer = null;
} }
}; };
// 重新扫码
const handleRefreshQrCode = () => {
resetTaskFields();
getAuthorizedQrCode();
};
const handleOk = () => { const handleOk = () => {
if (isFailLoadQrCode.value) { if (isFailLoadQrCode.value) {
resetTaskFields(); handleRefreshQrCode();
getAuthorizedQrCode();
return; return;
} }
@ -249,8 +253,7 @@ const handleOk = () => {
if (isSuccess.value) { if (isSuccess.value) {
close(); close();
} else { } else {
resetTaskFields(); handleRefreshQrCode();
getAuthorizedQrCode();
} }
} else { } else {
startLoading(); startLoading();

View File

@ -34,7 +34,7 @@
<div class="img-box"> <div class="img-box">
<template v-if="qrCodeLoading || isFailLoadQrCode"> <template v-if="qrCodeLoading || isFailLoadQrCode">
<div class="relative w-160px h-160px"> <div class="relative w-160px h-160px">
<a-image v-if="qrCodeLoading" :src="icon1" width="160" height="160" /> <a-image :src="icon1" width="160" height="160" />
<div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center"> <div class="absolute top-0 left-0 z-2 w-full h-full flex flex-col items-center justify-center">
<img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" /> <img v-if="isFailLoadQrCode" :src="icon4" width="24" height="24" class="mb-13px" />
<icon-loading v-else size="24" class="color-#6D4CFE mb-13px" /> <icon-loading v-else size="24" class="color-#6D4CFE mb-13px" />
@ -49,7 +49,7 @@
</template> </template>
<a-image v-else :src="qrCodeUrl" width="160" height="160" /> <a-image v-else :src="qrCodeUrl" width="160" height="160" />
<div v-if="isOverdue" class="mask cursor-pointer" @click="getAuthorizedQrCode"> <div v-if="isOverdue" class="mask cursor-pointer" @click="handleRefreshQrCode">
<icon-refresh size="24" class="mb-13px" /> <icon-refresh size="24" class="mb-13px" />
<p class="s1">二维码失效</p> <p class="s1">二维码失效</p>
<p class="s1">请点击刷新</p> <p class="s1">请点击刷新</p>
@ -277,11 +277,16 @@ const clearStatusPollingTimer = () => {
} }
}; };
// 重新扫码
const handleRefreshQrCode = () => {
resetTaskFields();
getAuthorizedQrCode();
};
const handleOk = () => { const handleOk = () => {
if (taskStep.value === TASK_STEP.default) { if (taskStep.value === TASK_STEP.default) {
if (isFailLoadQrCode.value) { if (isFailLoadQrCode.value) {
resetTaskFields(); handleRefreshQrCode();
getAuthorizedQrCode();
return; return;
} }
@ -308,8 +313,7 @@ const handleOk = () => {
if (isSuccess.value) { if (isSuccess.value) {
close(); close();
} else { } else {
resetTaskFields(); handleRefreshQrCode();
getAuthorizedQrCode();
} }
} }
} }