mirror of
https://github-proxy.zxj.im/abearxiong/app-show-list
synced 2025-11-04 11:58:34 +08:00
temp
This commit is contained in:
@@ -24,6 +24,6 @@
|
||||
<body>
|
||||
<div id="ai-root"></div>
|
||||
</body>
|
||||
<script src="./src/main.ts" type="module"></script>
|
||||
<script src="./src/main.tsx" type="module"></script>
|
||||
|
||||
</html>
|
||||
2084
package-lock.json
generated
Normal file
2084
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
11
package.json
11
package.json
@@ -15,16 +15,25 @@
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@emotion/react": "^11.14.0",
|
||||
"@emotion/styled": "^11.14.0",
|
||||
"@kevisual/query": "0.0.7-alpha.3",
|
||||
"@kevisual/system-ui": "^0.0.3",
|
||||
"@mui/material": "^6.3.0",
|
||||
"dayjs": "^1.11.13",
|
||||
"lodash-es": "^4.17.21"
|
||||
"lodash-es": "^4.17.21",
|
||||
"react-dom": "^19.0.0",
|
||||
"zustand": "^5.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@emotion/css": "^11.13.5",
|
||||
"@kevisual/router": "0.0.6-alpha-4",
|
||||
"@kevisual/store": "0.0.1-alpha.9",
|
||||
"@kevisual/types": "^0.0.5",
|
||||
"@types/react": "^19.0.2",
|
||||
"@types/react-dom": "^19.0.2",
|
||||
"@vitejs/plugin-basic-ssl": "^1.2.0",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"cross-env": "^7.0.3",
|
||||
"react": "^19.0.0",
|
||||
"vite": "^6.0.6"
|
||||
|
||||
1921
pnpm-lock.yaml
generated
1921
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
10
src/ReactApp.tsx
Normal file
10
src/ReactApp.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { createRoot } from 'react-dom/client';
|
||||
export const App = () => {
|
||||
return (
|
||||
<div className='flex justify-center items-center h-screen bg-gray-200'>
|
||||
<h1 className='text-4xl font-bold text-gray-800'>Hello Vite + React!</h1>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
createRoot(document.getElementById('root')!).render(<App />);
|
||||
44
src/app/List.tsx
Normal file
44
src/app/List.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import { useStore } from '@/store/app';
|
||||
import { useEffect } from 'react';
|
||||
import { css } from '@emotion/css';
|
||||
|
||||
const containerStyle = css`
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
`;
|
||||
|
||||
const itemStyle = css`
|
||||
display: flex;
|
||||
min-width: 240px;
|
||||
flex-direction: column;
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
background-color: #fff;
|
||||
`;
|
||||
|
||||
export const List = () => {
|
||||
const store = useStore();
|
||||
useEffect(() => {
|
||||
store.init();
|
||||
}, []);
|
||||
return (
|
||||
<div className={containerStyle}>
|
||||
<div>
|
||||
{store.list.map((item) => {
|
||||
return (
|
||||
<div className={itemStyle} key={item.key}>
|
||||
<span>{item.key}</span>
|
||||
<span>{item.description}</span>
|
||||
<span>{item.status}</span>
|
||||
<span>{item.type}</span>
|
||||
<span>{item.version}</span>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@@ -1,10 +1,15 @@
|
||||
import { useContextKey } from '@kevisual/store/config';
|
||||
import { Page } from '@kevisual/store/page';
|
||||
import { QueryRouterServer } from '@kevisual/router';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import { List } from './app/List';
|
||||
export const render = ({ renderRoot }) => {
|
||||
renderRoot.innerHTML = `
|
||||
<h1>Hello, World!</h1>
|
||||
`;
|
||||
// renderRoot.innerHTML = `
|
||||
// <h1>Hello, World!</h1>
|
||||
// `;
|
||||
const root = createRoot(renderRoot);
|
||||
// @ts-ignore
|
||||
root.render(<List />);
|
||||
};
|
||||
|
||||
const page = useContextKey('page', () => {
|
||||
@@ -46,5 +51,6 @@ if (app) {
|
||||
render({
|
||||
renderRoot,
|
||||
});
|
||||
}).addTo(app);
|
||||
})
|
||||
.addTo(app);
|
||||
}
|
||||
3
src/modules/message.ts
Normal file
3
src/modules/message.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import { message } from '@kevisual/system-ui/dist/message';
|
||||
|
||||
export { message };
|
||||
86
src/store/app.ts
Normal file
86
src/store/app.ts
Normal file
@@ -0,0 +1,86 @@
|
||||
import { create } from 'zustand';
|
||||
import { query } from '@/modules/query';
|
||||
|
||||
type Store = {
|
||||
list: any[];
|
||||
setList: (list: any[]) => void;
|
||||
data: any;
|
||||
setData: (data: any) => void;
|
||||
loading: boolean;
|
||||
setLoading: (loading: boolean) => void;
|
||||
formData: any;
|
||||
setFormData: (data: any) => void;
|
||||
getList: () => Promise<any>;
|
||||
init: () => Promise<void>;
|
||||
getData: (id: number) => Promise<any>;
|
||||
updateData: (data: any, opts?: { refresh?: boolean }) => Promise<any>;
|
||||
deleteData: (id: number, opts?: { refresh?: boolean }) => Promise<any>;
|
||||
};
|
||||
export const useStore = create<Store>((set, get) => ({
|
||||
list: [],
|
||||
setList: (list) => set({ list }),
|
||||
data: null,
|
||||
setData: (data) => set({ data }),
|
||||
loading: false,
|
||||
setLoading: (loading) => set({ loading }),
|
||||
formData: null,
|
||||
setFormData: (formData) => set({ formData }),
|
||||
getList: async () => {
|
||||
set({ loading: true });
|
||||
const res = await query.post({ path: 'local-apps', key: 'list' });
|
||||
set({ loading: false });
|
||||
if (res.code === 200) {
|
||||
set({ list: res.data });
|
||||
}
|
||||
return res;
|
||||
},
|
||||
init: async () => {
|
||||
await get().getList();
|
||||
},
|
||||
getData: async (id) => {
|
||||
set({ loading: true });
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'get',
|
||||
id,
|
||||
});
|
||||
set({ loading: false });
|
||||
if (res.code === 200) {
|
||||
const data = res.data;
|
||||
set({ data });
|
||||
}
|
||||
return res;
|
||||
},
|
||||
updateData: async (data, opts = { refresh: true }) => {
|
||||
set({ loading: true });
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'update',
|
||||
data,
|
||||
});
|
||||
set({ loading: false });
|
||||
if (res.code === 200) {
|
||||
set({ data: res.data });
|
||||
}
|
||||
if (opts.refresh) {
|
||||
await get().getList();
|
||||
}
|
||||
return res;
|
||||
},
|
||||
deleteData: async (id, opts = { refresh: true }) => {
|
||||
set({ loading: true });
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'delete',
|
||||
id,
|
||||
});
|
||||
set({ loading: false });
|
||||
if (res.code === 200) {
|
||||
set({ data: null });
|
||||
}
|
||||
if (opts.refresh) {
|
||||
await get().getList();
|
||||
}
|
||||
return res;
|
||||
},
|
||||
}));
|
||||
54
src/store/operate.ts
Normal file
54
src/store/operate.ts
Normal file
@@ -0,0 +1,54 @@
|
||||
import { create } from 'zustand';
|
||||
import { query } from '@/modules/query';
|
||||
import { message } from '@/modules/message';
|
||||
interface OperateStore {
|
||||
updateStatus: () => Promise<void>;
|
||||
detect: () => Promise<void>;
|
||||
download: () => Promise<void>;
|
||||
|
||||
/**
|
||||
* 微应用的上传和卸载和部署
|
||||
*/
|
||||
upload: () => Promise<void>;
|
||||
unload: () => Promise<void>;
|
||||
deploy: () => Promise<void>;
|
||||
}
|
||||
|
||||
export const useOperateStore = create<OperateStore>((set) => ({
|
||||
updateStatus: async () => {
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'updateStatus',
|
||||
});
|
||||
},
|
||||
detect: async () => {
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'detect',
|
||||
});
|
||||
},
|
||||
download: async () => {
|
||||
const res = await query.post({
|
||||
path: 'local-apps',
|
||||
key: 'download',
|
||||
});
|
||||
},
|
||||
upload: async () => {
|
||||
const res = await query.post({
|
||||
path: 'micro-apps',
|
||||
key: 'upload',
|
||||
});
|
||||
},
|
||||
unload: async () => {
|
||||
const res = await query.post({
|
||||
path: 'micro-apps',
|
||||
key: 'unload',
|
||||
});
|
||||
},
|
||||
deploy: async () => {
|
||||
const res = await query.post({
|
||||
path: 'micro-apps',
|
||||
key: 'deploy',
|
||||
});
|
||||
},
|
||||
}));
|
||||
@@ -16,8 +16,8 @@
|
||||
"isolatedModules": true,
|
||||
"moduleDetection": "force",
|
||||
"noEmit": true,
|
||||
"jsxFragmentFactory": "Fragment",
|
||||
"jsxFactory": "h",
|
||||
// "jsxFragmentFactory": "Fragment",
|
||||
// "jsxFactory": "h",
|
||||
"baseUrl": "./",
|
||||
"typeRoots": [
|
||||
"node_modules/@types",
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react'
|
||||
// import basicSsl from '@vitejs/plugin-basic-ssl';
|
||||
import dayjs from 'dayjs';
|
||||
import path from 'path';
|
||||
@@ -8,6 +9,7 @@ const BUILD_TIME = dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
console.log('process', isDev, process.env.WEB_DEV)
|
||||
export default defineConfig({
|
||||
// plugins: [basicSsl()],
|
||||
plugins: [react()],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': path.resolve(__dirname, './src'),
|
||||
@@ -18,7 +20,7 @@ export default defineConfig({
|
||||
BUILD_TIME: JSON.stringify(BUILD_TIME),
|
||||
},
|
||||
optimizeDeps: {
|
||||
exclude: ['react'], // 排除 react 和 react-dom 以避免打包
|
||||
// exclude: ['react'], // 排除 react 和 react-dom 以避免打包
|
||||
},
|
||||
// esbuild: {
|
||||
// jsxFactory: 'h',
|
||||
|
||||
Reference in New Issue
Block a user