Skip to content

N
netdisc
Commit cbc06c75 authored by rocosen's avatar rocosen
Browse files
Options

feat：基础功能

parent ca022326
Hide whitespace changes
Inline Side-by-side
Showing with 597 additions and 154 deletions
package.json
View file @ cbc06c75
...@@ -145,6 +145,7 @@ ...@@ -145,6 +145,7 @@
"chalk": "^4.1.2", "chalk": "^4.1.2",
"concurrently": "^7.3.0", "concurrently": "^7.3.0",
"core-js": "^3.24.1", "core-js": "^3.24.1",
"moment": "^2.22.2",
"cross-env": "^7.0.3", "cross-env": "^7.0.3",
"css-loader": "^6.7.1", "css-loader": "^6.7.1",
"css-minimizer-webpack-plugin": "^4.0.0", "css-minimizer-webpack-plugin": "^4.0.0",
......
src/commons/assets/img/no_message.svg 0 → 100644
View file @ cbc06c75
<?xml version="1.0" encoding="UTF-8"?>
<svg width="192px" height="120px" viewBox="0 0 192 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 5</title>
<defs>
<linearGradient x1="33.6183035%" y1="100%" x2="33.6183035%" y2="5.98826544e-13%" id="linearGradient-1">
<stop stop-color="#EBEDF2" stop-opacity="0" offset="0%"></stop>
<stop stop-color="#E5E8EF" offset="53.8662878%"></stop>
<stop stop-color="#D8DCE6" offset="100%"></stop>
</linearGradient>
<linearGradient x1="50%" y1="0%" x2="50%" y2="95.5415697%" id="linearGradient-2">
<stop stop-color="#CDD3E1" offset="0%"></stop>
<stop stop-color="#CDD3E1" stop-opacity="0.397399476" offset="31.1672026%"></stop>
<stop stop-color="#CDD3E1" stop-opacity="0" offset="100%"></stop>
</linearGradient>
<linearGradient x1="79.5210868%" y1="36.502654%" x2="43.538716%" y2="68.2268762%" id="linearGradient-3">
<stop stop-color="#F3F4F6" offset="0%"></stop>
<stop stop-color="#DEE2EB" offset="100%"></stop>
</linearGradient>
<linearGradient x1="87.6946467%" y1="100%" x2="12.3053533%" y2="30.8681882%" id="linearGradient-4">
<stop stop-color="#D8DCE6" offset="0%"></stop>
<stop stop-color="#EDF0F5" offset="100%"></stop>
</linearGradient>
<linearGradient x1="79.6103369%" y1="25.4995301%" x2="13.5823999%" y2="81.9840829%" id="linearGradient-5">
<stop stop-color="#F5F7FA" offset="0%"></stop>
<stop stop-color="#F2F3F5" offset="100%"></stop>
</linearGradient>
<linearGradient x1="85.3345299%" y1="44.0928232%" x2="21.7248806%" y2="51.8002766%" id="linearGradient-6">
<stop stop-color="#E8EAEF" offset="0%"></stop>
<stop stop-color="#F2F4F7" offset="100%"></stop>
</linearGradient>
<linearGradient x1="55.2719939%" y1="6.12010442e-13%" x2="45.6676211%" y2="95.6587127%" id="linearGradient-7">
<stop stop-color="#E8EBF2" offset="0%"></stop>
<stop stop-color="#D6DCEB" offset="100%"></stop>
</linearGradient>
<linearGradient x1="98.3245421%" y1="-10.6552489%" x2="-32.0634654%" y2="161.063163%" id="linearGradient-8">
<stop stop-color="#F2F6FA" offset="0%"></stop>
<stop stop-color="#E8EAED" stop-opacity="0.946978802" offset="29.7382561%"></stop>
<stop stop-color="#FFFFFF" offset="100%"></stop>
</linearGradient>
</defs>
<g id="最新版本" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="消息与设置备份-2" transform="translate(-858.000000, -577.000000)">
<g id="编组-19备份" transform="translate(779.000000, 434.000000)">
<g id="编组-5" transform="translate(79.000000, 143.000000)">
<rect id="矩形" x="0" y="0" width="192" height="120"></rect>
<g id="编组-2" transform="translate(35.670000, 13.684411)">
<g id="编组-79" transform="translate(7.000000, 21.000000)">
<rect id="矩形" fill="url(#linearGradient-1)" x="52.90675" y="54.9146341" width="11.5437566" height="24.0853659"></rect>
<rect id="矩形" fill="url(#linearGradient-2)" x="58.678629" y="54.9146341" width="5.77187831" height="24.0853659"></rect>
<path d="M31.2036023,10.597561 L72.8036023,10.597561 C83.4074695,10.597561 92.0036023,19.1936938 92.0036023,29.797561 L92.0036023,52.9946341 C92.0036023,54.0550209 91.143989,54.9146341 90.0836023,54.9146341 L12.0036023,54.9146341 L12.0036023,54.9146341 L12.0036023,29.797561 C12.0036023,19.1936938 20.5997351,10.597561 31.2036023,10.597561 Z" id="矩形" fill="url(#linearGradient-3)"></path>
<path d="M31.2431966,10.597561 C41.8689312,10.597561 50.482791,19.2114208 50.482791,29.8371553 L50.482791,54.9146341 L50.482791,54.9146341 L12.0036023,54.9146341 L12.0036023,29.8371553 C12.0036023,19.2114208 20.6174621,10.597561 31.2431966,10.597561 Z" id="矩形" fill="url(#linearGradient-4)"></path>
<path d="M31.2431966,11.097561 C36.4179927,11.097561 41.1028913,13.1950615 44.4940909,16.5862611 C47.8852905,19.9774607 49.982791,24.6623592 49.982791,29.8371553 L49.982791,29.8371553 L49.982791,54.4146341 L12.5036023,54.4146341 L12.5036023,29.8371553 C12.5036023,24.6623592 14.6011028,19.9774607 17.9923024,16.5862611 C21.383502,13.1950615 26.0684006,11.097561 31.2431966,11.097561 Z" id="矩形" stroke="url(#linearGradient-5)"></path>
<path d="M12.0036023,54.9146341 L50.482791,54.9146341 L47.9266253,58.6097302 C42.0101161,67.1624115 32.2727367,72.2665862 21.8730521,72.2665862 L19.2395944,72.2665862 C13.6697585,72.2665862 9.15451443,67.7513421 9.15451443,62.1815062 C9.15451443,60.131401 9.77931307,58.1299822 10.9456433,56.4439795 L12.0036023,54.9146341 L12.0036023,54.9146341 Z" id="矩形" fill="url(#linearGradient-6)"></path>
<g id="编组-78" transform="translate(69.722385, 0.000000)">
<path d="M16.3536552,0 L12.5757118,4.81707317 L16.3536552,9.63414634 L4.04,9.634 L4.04089203,27.0528311 C5.57743267,27.4101434 6.73385803,28.9651341 6.73385803,30.8292683 C6.73385803,32.9575851 5.22643256,34.6829268 3.36692901,34.6829268 C1.50742547,34.6829268 0,32.9575851 0,30.8292683 C0,29.043411 1.06134547,27.5412798 2.50147148,27.1041124 L2.501,9.634 L1.92395944,9.63414634 L1.92395944,0 L16.3536552,0 Z" id="形状结合备份" fill="#CDD3E1"></path>
<path d="M17.3156349,0 L13.5376916,4.81707317 L17.3156349,9.63414634 L5.00197972,9.634 L5.00287174,27.0528311 C6.53941238,27.4101434 7.69583774,28.9651341 7.69583774,30.8292683 C7.69583774,32.9575851 6.18841228,34.6829268 4.32890873,34.6829268 C2.46940518,34.6829268 0.961979718,32.9575851 0.961979718,30.8292683 C0.961979718,29.043411 2.02332519,27.5412798 3.4634512,27.1041124 L3.46297972,9.634 L2.88593915,9.63414634 L2.88593915,0 L17.3156349,0 Z" id="形状结合" fill="url(#linearGradient-7)"></path>
</g>
</g>
<g id="编组" transform="translate(20.239203, 21.189052) scale(-1, 1) translate(-20.239203, -21.189052) ">
<path d="M35.6058653,4.23314168 C26.9123119,19.2246172 19.5240882,27.7403326 13.441194,29.7802879 C10.2433104,31.00036 4.95099184,29.2438597 8.28870142,24.819926 C10.0267969,22.4145379 13.4412504,23.7181562 13.4412205,26.925986 C13.4411907,30.1338158 13.7734299,36.1753923 4.87253976,38.1449626" id="路径-22备份-2" stroke="url(#linearGradient-8)" stroke-width="1.06" stroke-linecap="round" transform="translate(20.239203, 21.189052) scale(-1, 1) rotate(20.000000) translate(-20.239203, -21.189052) "></path>
<path d="M30.0861271,3.91792961 C29.2669238,6.00459208 28.857319,7.75580113 28.8573126,9.17155674 C28.8573031,11.2951902 26.2902016,15.6373612 18.9532695,14.8733441 C18.7711127,15.185291 20.6752726,13.0989907 21.1429743,11.1352899 C21.610676,9.17158915 24.8561334,8.07912635 26.4174296,7.70764118 C27.4582937,7.4599844 28.6811929,6.19674721 30.0861271,3.91792961 Z" id="路径-23备份-2" fill="#EBECED" transform="translate(24.513579, 9.440178) scale(-1, 1) rotate(9.000000) translate(-24.513579, -9.440178) "></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/commons/utils/ajaxOption.js
View file @ cbc06c75
import API from './api_manager'; import API from './api_manager';
import { getCurrentZone } from './publicMethod'; import { getCurrentZone, getUserInfo } from './publicMethod';
// 获取用户基础信息 // 获取用户基础信息
export const userInfo = () => { export const userInfo = () => {
...@@ -30,3 +30,17 @@ export const getAccountBalance = () => { ...@@ -30,3 +30,17 @@ export const getAccountBalance = () => {
actions: true, actions: true,
}; };
}; };
//获取通知消息
export const messageData = (page, size) => {
return {
url:
API.API_USER_MESSAGEALL +
`?receiver=${
getUserInfo().name
}&msgType=USER&page=${page}&size=${size}`,
type: 'get',
param: {},
actions: true,
};
};
src/commons/utils/api_manager.js
View file @ cbc06c75
...@@ -4,5 +4,6 @@ const API = { ...@@ -4,5 +4,6 @@ const API = {
API_USER_CURRENT: `${BACKEND_API_URI_PREFIX}/accounts/current`, //获取账号信息 API_USER_CURRENT: `${BACKEND_API_URI_PREFIX}/accounts/current`, //获取账号信息
API_USER_LOGOUT: `${BACKEND_API_URI_PREFIX}/uaa/users/token`, //退出登录 API_USER_LOGOUT: `${BACKEND_API_URI_PREFIX}/uaa/users/token`, //退出登录
API_DASHBOARD_ACCOUNT: `${BACKEND_API_URI_PREFIX}/accounts/dashboard/account`, //获取余额 API_DASHBOARD_ACCOUNT: `${BACKEND_API_URI_PREFIX}/accounts/dashboard/account`, //获取余额
API_USER_MESSAGEALL: `${BACKEND_API_URI_PREFIX}/imapp/querymessage`, //查询全部信息
}; };
export default API; export default API;
src/commons/utils/publicMethod.js
View file @ cbc06c75
import { Constants } from '../utils/constants'; import { Constants } from '../utils/constants';
import moment from 'moment';
export const getUserInfo = () => { export const getUserInfo = () => {
return ( return (
...@@ -35,3 +36,7 @@ export const getCurrentZone = () => { ...@@ -35,3 +36,7 @@ export const getCurrentZone = () => {
} }
return timezone; return timezone;
}; };
export const convert_timer = (item) => {
return moment(item).format('YYYY-MM-DD HH:mm:ss');
};
src/main/main.ts
View file @ cbc06c75
...@@ -35,8 +35,8 @@ ipcMain.on('createNewWindow-site', (event, arg) => { ...@@ -35,8 +35,8 @@ ipcMain.on('createNewWindow-site', (event, arg) => {
return; return;
} }
win = new BrowserWindow({ win = new BrowserWindow({
width: 546, width: 620,
height: 298, height: 482,
minWidth: 100, minWidth: 100,
minHeight: 100, minHeight: 100,
frame: true, frame: true,
......
src/renderer/App.css
View file @ cbc06c75
...@@ -6,6 +6,7 @@ body { ...@@ -6,6 +6,7 @@ body {
position: relative; position: relative;
color: #1e2633; color: #1e2633;
height: 100vh; height: 100vh;
margin: 0;
/* background: linear-gradient( /* background: linear-gradient(
200.96deg, 200.96deg,
#fedc2a -29.09%, #fedc2a -29.09%,
......
src/renderer/components/head.jsx
View file @ cbc06c75
...@@ -36,7 +36,7 @@ const useStyles = makeStyles()((theme) => { ...@@ -36,7 +36,7 @@ const useStyles = makeStyles()((theme) => {
justifyContent: 'space-between', justifyContent: 'space-between',
width: '300px', width: '300px',
margin: '0 auto', margin: '0 auto',
marginTop: '2%', marginTop: '4%',
}, },
leftBox: { leftBox: {
display: 'flex', display: 'flex',
...@@ -97,7 +97,6 @@ const list = [ ...@@ -97,7 +97,6 @@ const list = [
]; ];
export default (props) => { export default (props) => {
console.log('props: ', props);
const { classes } = useStyles(); const { classes } = useStyles();
const { render, navigate } = public(); const { render, navigate } = public();
......
src/renderer/components/message.jsx 0 → 100644
View file @ cbc06c75
import React, { useEffect, useState, useRef } from 'react';
//ui
import Tabs from '@mui/material/Tabs';
import Tab from '@mui/material/Tab';
import { Grid } from '@mui/material';
import { makeStyles } from 'tss-react/mui';
import no_message from '../../commons/assets/img/no_message.svg';
import fileIcon from '../../commons/assets/img/fileData.svg';
import suc from '../../commons/assets/img/suc.svg';
import CloseIcon from '@mui/icons-material/Close';
import CircularProgress from '@mui/material/CircularProgress';
// js
import Axios from '../../commons/axios/Axios';
import API from '../../commons/utils/api_manager';
import { messageData } from '../../commons/utils/ajaxOption';
import { convert_timer } from '../../commons/utils/publicMethod';
const useStyles = makeStyles()((theme) => {
return {
no_data: {
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
marginTop: '30px',
},
listBox: {
display: 'flex',
flexDirection: 'column',
paddingTop: '16px',
overflow: 'auto',
overflowX: 'hidden',
height: '274px',
alignItems: 'center',
},
messageBox: {
width: '322px',
// height: '122px',
background: '#FFFFFF',
boxShadow: '0px 1px 5px 0px rgba(0,20,46,0.18)',
// border: '1px solid',
borderRadius: '8px',
padding: '16px 20px',
marginBottom: '16px',
// minHeight: '122px',
},
messageTitle: {
color: '#1E2633',
fontSize: '14px',
fontWeight: '600',
},
messageTime: {
fontSize: '12px',
color: '#C2C6CC',
marginRight: '18px',
},
boxHead: {
display: 'flex',
justifyContent: 'space-between',
},
boxBody: {
marginTop: '8px',
},
fold: {
overflow: 'hidden',
textOverflow: 'ellipsis',
display: '-webkit-box',
position: 'relative',
'-webkit-line-clamp': '3',
'-webkit-box-orient': 'vertical',
},
open: {
// overflow: 'hidden',
textOverflow: 'ellipsis',
display: '-webkit-box',
position: 'relative',
paddingBottom: '20px',
'-webkit-box-orient': 'vertical',
},
messageText: {
color: '#565C66',
fontSize: '12px',
lineHeight: '20px',
},
messageOpen: {
whiteSpace: 'nowrap',
color: '#1370FF',
fontSize: '12px',
cursor: 'pointer',
position: 'absolute',
bottom: '0px',
right: '0px',
lineHeight: '20px',
background:
'linear-gradient(90deg, transparent 10%, rgba(255, 255, 255) 70%)',
paddingLeft: '60px',
},
};
});
export default (props) => {
const { classes } = useStyles();
const refs = useRef([]);
const [domOver, setDomOver] = useState(false);
const [fold, isFold] = useState(true);
const [page, setPage] = useState(0);
const [list, setList] = useState([]);
useEffect(() => {
getMessage(0);
}, []);
useEffect(() => {
if (list.length > 0) {
setDomOver(true);
}
}, [list]);
const getMessage = async (page) => {
let data = await Axios.request(messageData(page, 10));
if (data && data.code === 200) {
let arr = [...list];
let newarr = [];
data.res.content.map((item, index) => {
newarr.push(Object.assign(item, { view: false }));
});
arr.push(...newarr);
setList(arr);
}
};
const isOverflow = (id) => {
let height = refs.current[id].scrollHeight;
if (height > 60) {
return true;
} else {
return false;
}
};
const viewCallBack = (e) => {
setList((p) => {
let prev = [...p];
prev.filter((item) => item.id === e.id)[0]['view'] = e.view
? false
: true;
return prev;
});
};
const scrollEvent = (e) => {
if (
e.target.clientHeight + e.target.scrollTop ===
e.target.scrollHeight
) {
setPage(page + 1);
getMessage(page + 1);
setDomOver(false);
}
};
return (
<Grid sx={{ width: '100%' }}>
{list.length === 0 && (
<Grid className={classes.no_data}>
<img src={no_message} alt="" />
<Grid sx={{ fontSize: '14px', color: '#B7B9BD' }}>
暂无消息
</Grid>
</Grid>
)}
<Grid className={classes.listBox} onScroll={scrollEvent}>
{list.map((e, key) => {
return (
<Grid
className={classes.messageBox}
key={key}
style={{
marginLeft: list.length > 3 ? '8px' : '0px',
}}
>
<Grid className={classes.boxHead}>
<Grid className={classes.messageTitle}>
{e.title}
</Grid>
<Grid
sx={{
display: 'flex',
alignItems: 'center',
}}
>
<Grid className={classes.messageTime}>
{convert_timer(e.msgConsumerAt)}
</Grid>
<CloseIcon
style={{
color: '#979797',
fontSize: '20px',
cursor: 'pointer',
}}
/>
</Grid>
</Grid>
<Grid className={classes.boxBody}>
<Grid
className={
e.view ? classes.open : classes.fold
}
>
<Grid
className={classes.messageText}
ref={(element) => {
refs.current[key] = element;
}}
>
{e.text}
</Grid>
{domOver && isOverflow(key) && (
<span
className={classes.messageOpen}
onClick={() => {
viewCallBack(e);
}}
>
{e.view ? '收起' : '展开'}
</span>
)}
</Grid>
</Grid>
</Grid>
);
})}
<Grid
sx={{
padding: '4px 0px 20px 0px',
display: list.length > 0 ? 'flex' : 'none',
alignItems: 'center',
}}
>
<CircularProgress
style={{
color: '#1370FF',
width: '12px',
height: '12px',
}}
/>
<Grid
sx={{
fontSize: '12px',
color: '#565C66',
marginLeft: '4px',
}}
>
加载更多…
</Grid>
</Grid>
</Grid>
</Grid>
);
};
src/renderer/components/mount.jsx
View file @ cbc06c75
...@@ -5,7 +5,7 @@ import public from 'commons/public'; ...@@ -5,7 +5,7 @@ import public from 'commons/public';
//ui //ui
import TextField from '@mui/material/TextField'; import TextField from '@mui/material/TextField';
import { Grid } from '@mui/material'; import { Grid, Button } from '@mui/material';
import FormControlLabel from '@mui/material/FormControlLabel'; import FormControlLabel from '@mui/material/FormControlLabel';
import Checkbox from '@mui/material/Checkbox'; import Checkbox from '@mui/material/Checkbox';
import { makeStyles } from 'tss-react/mui'; import { makeStyles } from 'tss-react/mui';
...@@ -21,10 +21,11 @@ const useStyles = makeStyles()((theme) => { ...@@ -21,10 +21,11 @@ const useStyles = makeStyles()((theme) => {
display: 'flex', display: 'flex',
alignItems: 'flex-start', alignItems: 'flex-start',
flexDirection: 'column', flexDirection: 'column',
width: '300px', width: '100%',
// margin: '0 auto', borderRadius: '4px',
marginTop: '1.5%', border: '1px solid #EBEDF0',
marginLeft: '24px', marginLeft: '24px',
marginRight: '24px',
}, },
title: { title: {
fontSize: '16px', fontSize: '16px',
...@@ -39,6 +40,26 @@ const useStyles = makeStyles()((theme) => { ...@@ -39,6 +40,26 @@ const useStyles = makeStyles()((theme) => {
input: { input: {
padding: '6.5px 14px', padding: '6.5px 14px',
}, },
buttonGroup: {
borderTop: '1px solid #EBEDF0',
height: '63px',
display: 'flex',
alignItems: 'center',
width: '100%',
justifyContent: 'space-between',
},
rootButton: {
backgroundColor: '#1370FF',
boxShadow: 'none !important',
color: '#ffffff',
'&:hover': { backgroundColor: '#0055D9', transform: 'inherit' },
},
rootButton2: {
backgroundColor: '#F0F2F5',
boxShadow: 'none !important',
color: '#1E2633',
'&:hover': { backgroundColor: '#F0F2F5', transform: 'inherit' },
},
}; };
}); });
...@@ -68,118 +89,224 @@ export default (props) => { ...@@ -68,118 +89,224 @@ export default (props) => {
const [mountValue, setMountValue] = useState('localDisk'); const [mountValue, setMountValue] = useState('localDisk');
const [currency, setCurrency] = useState('EUR'); const [currency, setCurrency] = useState('EUR');
const [change, setChange] = useState(false);
const handleChange = (event) => { const handleChange = (event) => {
setChange(true);
event.stopPropagation(); event.stopPropagation();
setMountValue(event.target.value); setMountValue(event.target.value);
}; };
const handleSelectChange = (event) => { const handleSelectChange = (event) => {
setChange(true);
setCurrency(event.target.value); setCurrency(event.target.value);
}; };
return ( return (
<Grid className={classes.mountBody}> <Grid className={classes.mountBody}>
<Grid className={classes.title}>挂载位置</Grid> <Grid sx={{ padding: '16px 24px' }}>
<Grid className={classes.title}>挂载位置</Grid>
<RadioGroup value={mountValue} onChange={handleChange}> <RadioGroup
<FormControlLabel value={mountValue}
value="localDisk" onChange={handleChange}
control={<Radio size="small" />} sx={{ marginBottom: '29px' }}
sx={{ alignItems: 'flex-start', display: 'flex' }} >
label={ <FormControlLabel
<Grid sx={{ marginTop: '8px' }}> value="localDisk"
<Grid control={<Radio size="small" />}
sx={{ sx={{ alignItems: 'flex-start', display: 'flex' }}
color: '#1E2633', label={
fontSize: '14px', <Grid sx={{ marginTop: '8px' }}>
marginBottom: '10px', <Grid
}} sx={{
> color: '#1E2633',
将云文件挂载到本地磁盘 fontSize: '14px',
</Grid> marginBottom: '10px',
<TextField }}
select >
value={currency} 将云文件挂载到本地磁盘
onChange={handleSelectChange} </Grid>
InputProps={{ <TextField
classes: { select
root: classes.root, value={currency}
input: classes.input, onChange={handleSelectChange}
}, InputProps={{
}} classes: {
> root: classes.root,
{currencies.map((option) => ( input: classes.input,
<MenuItem },
key={option.value} }}
value={option.value} >
> {currencies.map((option) => (
{option.label} <MenuItem
</MenuItem> key={option.value}
))} value={option.value}
</TextField> >
</Grid> {option.label}
} </MenuItem>
/> ))}
<FormControlLabel </TextField>
value="localFolder"
control={<Radio size="small" />}
sx={{
alignItems: 'flex-start',
display: 'flex',
marginTop: '20px',
}}
label={
<Grid
sx={{ marginTop: '8px' }}
onClick={(event) => {
event.stopPropagation();
}}
>
<Grid
sx={{
color: '#1E2633',
fontSize: '14px',
marginBottom: '10px',
}}
>
将云盘挂载到本地文件夹
</Grid> </Grid>
}
/>
<FormControlLabel
value="localFolder"
control={<Radio size="small" />}
sx={{
alignItems: 'flex-start',
display: 'flex',
marginTop: '20px',
}}
label={
<Grid <Grid
sx={{ sx={{ marginTop: '8px' }}
display: 'flex', onClick={(event) => {
alignItems: 'center', event.stopPropagation();
}} }}
> >
<img src={file} alt="" />
<Grid <Grid
sx={{ sx={{
color: '#8A9099', color: '#1E2633',
fontSize: '14px', fontSize: '14px',
marginLeft: '10px', marginBottom: '10px',
}} }}
> >
C:\Users\…\Desktopopsjw 将云盘挂载到本地文件夹
</Grid> </Grid>
<Grid <Grid
sx={{ sx={{
color: '#1370FF', display: 'flex',
fontSize: '14px', alignItems: 'center',
marginLeft: '16px',
cursor: 'pointer',
}}
onClick={(event) => {
event.stopPropagation();
console.log('222222222');
}} }}
> >
更改 <img src={file} alt="" />
<Grid
sx={{
color: '#8A9099',
fontSize: '14px',
marginLeft: '10px',
}}
>
C:\Users\…\Desktopopsjw
</Grid>
<Grid
sx={{
color: '#1370FF',
fontSize: '14px',
marginLeft: '16px',
cursor: 'pointer',
}}
onClick={(event) => {
event.stopPropagation();
console.log('222222222');
}}
>
更改
</Grid>
</Grid> </Grid>
</Grid> </Grid>
}
/>
</RadioGroup>
<Grid className={classes.title}>缓存位置</Grid>
<Grid>
<Grid
sx={{
color: '#1E2633',
fontSize: '14px',
marginBottom: '10px',
}}
>
本地缓存的文件目录
</Grid>
<Grid
sx={{
display: 'flex',
alignItems: 'center',
}}
>
<img src={file} alt="" />
<Grid
sx={{
color: '#8A9099',
fontSize: '14px',
marginLeft: '10px',
}}
>
C:\Users\…\Desktopopsjw
</Grid> </Grid>
} <Grid
/> sx={{
</RadioGroup> color: '#1370FF',
fontSize: '14px',
marginLeft: '16px',
cursor: 'pointer',
}}
onClick={(event) => {
event.stopPropagation();
console.log('222222222');
}}
>
更改
</Grid>
<Grid
sx={{
color: '#1370FF',
fontSize: '14px',
marginLeft: '16px',
cursor: 'pointer',
}}
onClick={(event) => {
event.stopPropagation();
console.log('222222222');
}}
>
清除
</Grid>
</Grid>
</Grid>
</Grid>
<Grid className={classes.buttonGroup}>
<Grid
sx={{
fontSize: '14px',
color: '#8A9099',
marginLeft: '24px',
opacity: change ? '1' : '0',
}}
>
未保存修改
</Grid>
<Grid sx={{ display: 'flex' }}>
<Button
variant="contained"
sx={{ width: '68px' }}
disabled={!change}
classes={{
root: classes.rootButton2,
}}
onClick={() => {
setChange(false);
}}
>
取消
</Button>
<Button
variant="contained"
sx={{ width: '68px', margin: '0px 24px 0px 12px' }}
disabled={!change}
classes={{
root: classes.rootButton,
}}
onClick={() => {}}
>
保存
</Button>
</Grid>
</Grid>
</Grid> </Grid>
); );
}; };
src/renderer/components/preference.jsx
View file @ cbc06c75
...@@ -18,9 +18,12 @@ const useStyles = makeStyles()((theme) => { ...@@ -18,9 +18,12 @@ const useStyles = makeStyles()((theme) => {
display: 'flex', display: 'flex',
alignItems: 'flex-start', alignItems: 'flex-start',
flexDirection: 'column', flexDirection: 'column',
width: '300px', width: '100%',
marginTop: '1.5%', borderRadius: '4px',
border: '1px solid #EBEDF0',
marginLeft: '24px', marginLeft: '24px',
marginRight: '24px',
height: '100%',
}, },
title: { title: {
fontSize: '16px', fontSize: '16px',
...@@ -43,64 +46,23 @@ export default (props) => { ...@@ -43,64 +46,23 @@ export default (props) => {
return ( return (
<Grid className={classes.preferenceBody}> <Grid className={classes.preferenceBody}>
<Grid className={classes.title}>偏好设置</Grid> <Grid sx={{ padding: '16px 24px' }}>
<Grid className={classes.title}>偏好设置</Grid>
<FormControlLabel <FormControlLabel
control={ control={
<Checkbox <Checkbox
checked={selfStart} checked={selfStart}
onChange={handleChange} onChange={handleChange}
size="small" size="small"
/> />
} }
label={ label={
<Grid sx={{ color: '#1E2633', fontSize: '14px' }}> <Grid sx={{ color: '#1E2633', fontSize: '14px' }}>
开机时运行北鲲云盘 开机时运行北鲲云盘
</Grid> </Grid>
} }
/> />
<Grid sx={{ marginTop: '8px' }}>
<Grid
sx={{
color: '#1E2633',
fontSize: '14px',
marginBottom: '10px',
}}
>
本地缓存的文件目录
</Grid>
<Grid
sx={{
display: 'flex',
alignItems: 'center',
}}
>
<img src={file} alt="" />
<Grid
sx={{
color: '#8A9099',
fontSize: '14px',
marginLeft: '10px',
}}
>
C:\Users\…\Desktopopsjw
</Grid>
<Grid
sx={{
color: '#1370FF',
fontSize: '14px',
marginLeft: '16px',
cursor: 'pointer',
}}
onClick={(event) => {
event.stopPropagation();
console.log('222222222');
}}
>
更改
</Grid>
</Grid>
</Grid> </Grid>
</Grid> </Grid>
); );
......
src/renderer/console/home.jsx
View file @ cbc06c75
...@@ -4,6 +4,8 @@ import Head from '../components/head'; ...@@ -4,6 +4,8 @@ import Head from '../components/head';
import Trans from '../components/trans'; import Trans from '../components/trans';
import Tab from '../components/tab'; import Tab from '../components/tab';
import BottomTip from '../components/buttomTip.jsx'; import BottomTip from '../components/buttomTip.jsx';
import Message from '../components/message.jsx';
import { Button, Grid } from '@mui/material'; import { Button, Grid } from '@mui/material';
import { makeStyles } from 'tss-react/mui'; import { makeStyles } from 'tss-react/mui';
...@@ -20,7 +22,7 @@ const useStyles = makeStyles()((theme) => { ...@@ -20,7 +22,7 @@ const useStyles = makeStyles()((theme) => {
export default (props) => { export default (props) => {
const { classes } = useStyles(); const { classes } = useStyles();
const { render, navigate } = public(); const { render, navigate } = public();
const [value, setValue] = useState('one'); const [value, setValue] = useState('two');
const handleChange = (event, newValue) => { const handleChange = (event, newValue) => {
setValue(newValue); setValue(newValue);
...@@ -32,6 +34,7 @@ export default (props) => { ...@@ -32,6 +34,7 @@ export default (props) => {
<Tab level={false} value={value} handleChange={handleChange} /> <Tab level={false} value={value} handleChange={handleChange} />
{value === 'one' && <Trans />} {value === 'one' && <Trans />}
{value === 'two' && <Message />}
<BottomTip /> <BottomTip />
</Grid> </Grid>
......
src/renderer/console/site.jsx
View file @ cbc06c75
...@@ -12,7 +12,7 @@ const useStyles = makeStyles()((theme) => { ...@@ -12,7 +12,7 @@ const useStyles = makeStyles()((theme) => {
siteBody: { siteBody: {
display: 'flex', display: 'flex',
marginLeft: '-8px', marginLeft: '-8px',
marginTop: '19px', marginTop: '23px',
// flexDirection: 'column', // flexDirection: 'column',
// alignItems: 'center', // alignItems: 'center',
}, },
...@@ -32,7 +32,7 @@ const useStyles = makeStyles()((theme) => { ...@@ -32,7 +32,7 @@ const useStyles = makeStyles()((theme) => {
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
color: '#1370FF', color: '#1370FF',
width: '126px', width: '138px',
height: '36px', height: '36px',
background: '#E8F0FE', background: '#E8F0FE',
borderRadius: '0px 100px 100px 0px', borderRadius: '0px 100px 100px 0px',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment