diff --git a/admin-frontend/src/app/store.ts b/admin-frontend/src/app/store.ts index be6dd3c..4d52bfd 100644 --- a/admin-frontend/src/app/store.ts +++ b/admin-frontend/src/app/store.ts @@ -17,7 +17,7 @@ import globalConfReducer from '../features/globalConf/globalConfSlice'; import { subscribeApi } from '../features/subsribeConfigManager/subscribeConfigSlice'; import { targetNameApi } from '../features/targetName/targetNameSlice'; import { weightApi } from '../features/weightConfig/weightConfigSlice'; -import { cookieApi } from '../features/cookieManager/cookieConfigSlice'; +import { cookieApi, cookieTargetApi } from '../features/cookieManager/cookieConfigSlice'; const rootReducer = combineReducers({ auth: authReducer, @@ -26,6 +26,7 @@ const rootReducer = combineReducers({ [weightApi.reducerPath]: weightApi.reducer, [targetNameApi.reducerPath]: targetNameApi.reducer, [cookieApi.reducerPath]: cookieApi.reducer, + [cookieTargetApi.reducerPath]: cookieTargetApi.reducer, }); const persistConfig = { @@ -46,7 +47,9 @@ export const store = configureStore({ .concat(subscribeApi.middleware) .concat(weightApi.middleware) .concat(targetNameApi.middleware) - .concat(cookieApi.middleware), + .concat(cookieApi.middleware) + .concat(cookieTargetApi.middleware), + }); export const persistor = persistStore(store); diff --git a/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts b/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts index f7a9949..c4a8e85 100644 --- a/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts +++ b/admin-frontend/src/features/cookieManager/cookieConfigSlice.ts @@ -40,23 +40,21 @@ export const cookieTargetApi = createApi({ baseQuery: baseQueryWithAuth, tagTypes: ['CookieTarget'], endpoints: (builder) => ({ - getCookieTargets: builder.query({ - query: () => '/cookie_target?site_name=site_name&cookie_id=cookie_id', + getCookieTargets: builder.query({ + query: (cookieId) => `/cookie_target?cookie_id=${cookieId}`, providesTags: ['CookieTarget'], }), newCookieTarget: builder.mutation({ query: ({ platformName, target, cookieId }) => ({ method: 'POST', - url: '/cookie_target', - body: { platform_name: platformName, target, cookie_id: cookieId }, + url: `/cookie_target?platform_name=${platformName}&target=${encodeURIComponent(target)}&cookie_id=${cookieId}`, }), invalidatesTags: ['CookieTarget'], }), deleteCookieTarget: builder.mutation({ query: ({ platformName, target, cookieId }) => ({ method: 'DELETE', - url: '/cookie_target', - body: { platform_name: platformName, target, cookie_id: cookieId }, + url: `/cookie_target?platform_name=${platformName}&target=${encodeURIComponent(target)}&cookie_id=${cookieId}`, }), invalidatesTags: ['CookieTarget'], }), diff --git a/admin-frontend/src/features/cookieTargetManager/CookieTargetManager.tsx b/admin-frontend/src/features/cookieTargetManager/CookieTargetManager.tsx index 7e81792..80378b7 100644 --- a/admin-frontend/src/features/cookieTargetManager/CookieTargetManager.tsx +++ b/admin-frontend/src/features/cookieTargetManager/CookieTargetManager.tsx @@ -1,7 +1,65 @@ -import React from 'react'; +import React, { useState } from 'react'; +import { useParams } from 'react-router-dom'; +import { + Button, Empty, Table, Typography, +} from '@arco-design/web-react'; +import { useGetCookieTargetsQuery } from '../cookieManager/cookieConfigSlice'; +import { SubscribeConfig } from '../../utils/type'; +import { useDeleteSubMutation } from '../subsribeConfigManager/subscribeConfigSlice'; +import CookieTargetModal from './CookieTargetModal'; export default function () { - return ( -

再等等

- ); + const { cookieId } = useParams(); + const { data: cookieTargets } = useGetCookieTargetsQuery(cookieId); + + console.log(cookieTargets); + const [{ isLoading: deleteIsLoading }] = useDeleteSubMutation(); + const isLoading = deleteIsLoading; + const [showModal, setShowModal] = useState(false); + const handleAdd = () => { + setShowModal(true); + }; + const columns = [ + { + title: '平台名称', + dataIndex: 'target.platform_name', + }, + { + title: '订阅名称', + dataIndex: 'target.target_name', + + }, + { + title: 'Cookie ID', + dataIndex: 'cookie_id', + }, + ]; + if (cookieId) { + return ( + <> + + {`Cookie ${cookieId}`} + + + `${record.platformName}-${record.target}`} + loading={isLoading} + scroll={{ x: true }} + /> + { + cookieTargets && cookieTargets.length > 0 + && ( + + ) + } + + ); + } + return ; } diff --git a/admin-frontend/src/features/cookieTargetManager/CookieTargetModal.tsx b/admin-frontend/src/features/cookieTargetManager/CookieTargetModal.tsx new file mode 100644 index 0000000..607ed66 --- /dev/null +++ b/admin-frontend/src/features/cookieTargetManager/CookieTargetModal.tsx @@ -0,0 +1,59 @@ +import React + from 'react'; +import { Modal, Select } from '@arco-design/web-react'; +import { SubscribeGroupDetail } from '../../utils/type'; +import { useNewCookieTargetMutation } from '../cookieManager/cookieConfigSlice'; +import { useGetSubsQuery } from '../subsribeConfigManager/subscribeConfigSlice'; + +interface SubscribeModalProp { + visible: boolean; + setVisible: (arg0: boolean) => void; + cookieId: number; +} + +export default function ({ visible, setVisible, cookieId }: SubscribeModalProp) { + const [newCookieTarget] = useNewCookieTargetMutation(); + + const { data: subs } = useGetSubsQuery(); + const pureSubs = subs ? Object.values(subs) + .reduce((pv:Array, cv:SubscribeGroupDetail) => pv.concat(cv.subscribes), []) : []; + const [index, setIndex] = React.useState(-1); + const handleSubmit = (idx:number) => { + const postPromise: ReturnType = newCookieTarget({ + cookieId, + platformName: pureSubs[idx].platformName, + target: pureSubs[idx].target, + }); + postPromise.then(() => { + setVisible(false); + }); + }; + const { Option } = Select; + return ( + setVisible(false)} + onOk={() => handleSubmit(index)} + > + + + + ); +}