andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-07 16:29:51 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #561 from proddy/dev

Browse Source 
table resizing fix
This commit is contained in:
Proddy
2022-06-25 14:28:07 +02:00
committed by GitHub
parent 8a05e11297 6298fab94f
commit 84f643e461
13 changed files with 283 additions and 381 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG_LATEST.md
View File

@@ -14,8 +14,12 @@
## Fixed
- fix Table resizing in WebUI [#519](https://github.com/emsesp/EMS-ESP32/issues/519)
## Changed
- Shorten "friendly names" in Home Assistant [#555](https://github.com/emsesp/EMS-ESP32/issues/555)
- platformio 2.3.0 (IDF 4, Arduino 2)
- remove master-thermostat, support multiple thermostats

102
interface/package-lock.json generated
View File

@@ -12,14 +12,14 @@
"@emotion/styled": "^11.9.3",
"@msgpack/msgpack": "^2.7.2",
"@mui/icons-material": "^5.8.4",
"@mui/material": "^5.8.4",
"@table-library/react-table-library": "^3.1.5",
"@mui/material": "^5.8.5",
"@table-library/react-table-library": "3.2.0-beta.1",
"@types/lodash": "^4.14.182",
"@types/node": "^18.0.0",
"@types/react": "^18.0.14",
"@types/react-dom": "^18.0.5",
"@types/react-router-dom": "^5.3.3",
"async-validator": "^4.1.1",
"async-validator": "^4.2.5",
"axios": "^0.27.2",
"http-proxy-middleware": "^2.0.6",
"jwt-decode": "^3.1.2",
@@ -34,10 +34,10 @@
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"sockette": "^2.0.6",
"typescript": "^4.7.3"
"typescript": "^4.7.4"
},
"devDependencies": {
"nodemon": "^2.0.16",
"nodemon": "^2.0.18",
"npm-run-all": "^4.1.5"
}
},
@@ -3028,9 +3028,9 @@
}
},
"node_modules/@mui/base": {
"version": "5.0.0-alpha.85",
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.85.tgz",
"integrity": "sha512-ONlQJOmQrxmR+pYF9AqH69FOG4ofwzVzNltwb2xKAQIW3VbsNZahcHIpzhFd70W6EIU+QHzB9TzamSM+Fg/U7w==",
"version": "5.0.0-alpha.86",
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.86.tgz",
"integrity": "sha512-0vi/Nni1mizrgrzKeyksEjw5JVSrgT8Vr2NhxzFtYxqpMgtdSrBvcmcuzBf9kE/ECMPbgpSIcqv0nLbLZUYkOQ==",
"dependencies": {
"@babel/runtime": "^7.17.2",
"@emotion/is-prop-valid": "^1.1.2",
@@ -3085,13 +3085,13 @@
}
},
"node_modules/@mui/material": {
"version": "5.8.4",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.4.tgz",
"integrity": "sha512-KlOJS1JGhwuhdoF4fulmz41h/YxyMdZSc+ncz+HAah0GKn8ovAs5774f1w0lIasxbtI1Ziunwvmnu9PvvUKdMw==",
"version": "5.8.5",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.5.tgz",
"integrity": "sha512-wngPXlOI9BurLSGlObQM/2L0QFFaIcvJnDK5A+ALxuUyuQnPviVWfC1l/r8rPlxQ4PCbSYpq3gzLlgnLoWcO/g==",
"dependencies": {
"@babel/runtime": "^7.17.2",
"@mui/base": "5.0.0-alpha.85",
"@mui/system": "^5.8.4",
"@mui/base": "5.0.0-alpha.86",
"@mui/system": "^5.8.5",
"@mui/types": "^7.1.4",
"@mui/utils": "^5.8.4",
"@types/react-transition-group": "^4.4.4",
@@ -3184,9 +3184,9 @@
}
},
"node_modules/@mui/system": {
"version": "5.8.4",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.4.tgz",
"integrity": "sha512-eeYZXlOn4p+tYwqqDlci6wW4knJ68aGx5A24YU9ubYZ5o0IwveoNP3LC9sHAMxigk/mUTqL4bpSMJ2HbTn2aQg==",
"version": "5.8.5",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.5.tgz",
"integrity": "sha512-1bhITHp5sX/CVEf1QwtBWvW+kNnH+GU7lKz0CeAL1RyH9dWvoL9Yt/+i/L8hJ6jVZB/7Au2F6MsyDPt8V1jfdA==",
"dependencies": {
"@babel/runtime": "^7.17.2",
"@mui/private-theming": "^5.8.4",
@@ -3725,9 +3725,9 @@
}
},
"node_modules/@table-library/react-table-library": {
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@table-library/react-table-library/-/react-table-library-3.1.5.tgz",
"integrity": "sha512-yJXR+RaP3Wt3vqe34PXjKZMsce9ZApkwdhvsgJ/39QicSnPx4cYSJ1/mCrGfkYYRcXzIkvsX38ElCZcp8uTl1A==",
"version": "3.2.0-beta.1",
"resolved": "https://registry.npmjs.org/@table-library/react-table-library/-/react-table-library-3.2.0-beta.1.tgz",
"integrity": "sha512-WKSf0n8GQxCikTxwxjHLplG9xTsSxlu1INe6bW9/CgcJab04NyA03pvTDUU0J1C0xxDhdxtcoM8dFrHnP2XpwQ==",
"dependencies": {
"clsx": "1.1.1",
"react-virtualized-auto-sizer": "1.0.6",
@@ -4872,9 +4872,9 @@
"integrity": "sha512-spZRyzKL5l5BZQrr/6m/SqFdBN0q3OCI0f9rjfBzCMBIP4p75P620rR3gTmaksNOhmzgdxcaxdNfMy6anrbM0g=="
},
"node_modules/async-validator": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.1.1.tgz",
"integrity": "sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA=="
"version": "4.2.5",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz",
"integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg=="
},
"node_modules/asynckit": {
"version": "0.4.0",
@@ -12489,9 +12489,9 @@
"integrity": "sha512-U9h1NLROZTq9uE1SNffn6WuPDg8icmi3ns4rEl/oTfIle4iLjTliCzgTsbaIFMq/Xn078/lfY/BL0GWZ+psK4Q=="
},
"node_modules/nodemon": {
"version": "2.0.16",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.16.tgz",
"integrity": "sha512-zsrcaOfTWRuUzBn3P44RDliLlp263Z/76FPoHFr3cFFkOz0lTPAcIw8dCzfdVIx/t3AtDYCZRCDkoCojJqaG3w==",
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.18.tgz",
"integrity": "sha512-uAvrKipi2zAz8E7nkSz4qW4F4zd5fs2wNGsTx+xXlP8KXqd9ucE0vY9wankOsPboeDyuUGN9vsXGV1pLn80l/A==",
"dev": true,
"hasInstallScript": true,
"dependencies": {
@@ -16801,9 +16801,9 @@
}
},
"node_modules/typescript": {
"version": "4.7.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.3.tgz",
"integrity": "sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==",
"version": "4.7.4",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
"integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==",
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -20090,9 +20090,9 @@
"integrity": "sha512-rYEi46+gIzufyYUAoHDnRzkWGxajpD9vVXFQ3g1vbjrBm6P7MBmm+s/fqPa46sxa+8FOUdEuRQKaugo5a4JWpw=="
},
"@mui/base": {
"version": "5.0.0-alpha.85",
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.85.tgz",
"integrity": "sha512-ONlQJOmQrxmR+pYF9AqH69FOG4ofwzVzNltwb2xKAQIW3VbsNZahcHIpzhFd70W6EIU+QHzB9TzamSM+Fg/U7w==",
"version": "5.0.0-alpha.86",
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.86.tgz",
"integrity": "sha512-0vi/Nni1mizrgrzKeyksEjw5JVSrgT8Vr2NhxzFtYxqpMgtdSrBvcmcuzBf9kE/ECMPbgpSIcqv0nLbLZUYkOQ==",
"requires": {
"@babel/runtime": "^7.17.2",
"@emotion/is-prop-valid": "^1.1.2",
@@ -20113,13 +20113,13 @@
}
},
"@mui/material": {
"version": "5.8.4",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.4.tgz",
"integrity": "sha512-KlOJS1JGhwuhdoF4fulmz41h/YxyMdZSc+ncz+HAah0GKn8ovAs5774f1w0lIasxbtI1Ziunwvmnu9PvvUKdMw==",
"version": "5.8.5",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.8.5.tgz",
"integrity": "sha512-wngPXlOI9BurLSGlObQM/2L0QFFaIcvJnDK5A+ALxuUyuQnPviVWfC1l/r8rPlxQ4PCbSYpq3gzLlgnLoWcO/g==",
"requires": {
"@babel/runtime": "^7.17.2",
"@mui/base": "5.0.0-alpha.85",
"@mui/system": "^5.8.4",
"@mui/base": "5.0.0-alpha.86",
"@mui/system": "^5.8.5",
"@mui/types": "^7.1.4",
"@mui/utils": "^5.8.4",
"@types/react-transition-group": "^4.4.4",
@@ -20151,9 +20151,9 @@
}
},
"@mui/system": {
"version": "5.8.4",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.4.tgz",
"integrity": "sha512-eeYZXlOn4p+tYwqqDlci6wW4knJ68aGx5A24YU9ubYZ5o0IwveoNP3LC9sHAMxigk/mUTqL4bpSMJ2HbTn2aQg==",
"version": "5.8.5",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-5.8.5.tgz",
"integrity": "sha512-1bhITHp5sX/CVEf1QwtBWvW+kNnH+GU7lKz0CeAL1RyH9dWvoL9Yt/+i/L8hJ6jVZB/7Au2F6MsyDPt8V1jfdA==",
"requires": {
"@babel/runtime": "^7.17.2",
"@mui/private-theming": "^5.8.4",
@@ -20472,9 +20472,9 @@
}
},
"@table-library/react-table-library": {
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@table-library/react-table-library/-/react-table-library-3.1.5.tgz",
"integrity": "sha512-yJXR+RaP3Wt3vqe34PXjKZMsce9ZApkwdhvsgJ/39QicSnPx4cYSJ1/mCrGfkYYRcXzIkvsX38ElCZcp8uTl1A==",
"version": "3.2.0-beta.1",
"resolved": "https://registry.npmjs.org/@table-library/react-table-library/-/react-table-library-3.2.0-beta.1.tgz",
"integrity": "sha512-WKSf0n8GQxCikTxwxjHLplG9xTsSxlu1INe6bW9/CgcJab04NyA03pvTDUU0J1C0xxDhdxtcoM8dFrHnP2XpwQ==",
"requires": {
"clsx": "1.1.1",
"react-virtualized-auto-sizer": "1.0.6",
@@ -21393,9 +21393,9 @@
"integrity": "sha512-spZRyzKL5l5BZQrr/6m/SqFdBN0q3OCI0f9rjfBzCMBIP4p75P620rR3gTmaksNOhmzgdxcaxdNfMy6anrbM0g=="
},
"async-validator": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.1.1.tgz",
"integrity": "sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA=="
"version": "4.2.5",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.2.5.tgz",
"integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg=="
},
"asynckit": {
"version": "0.4.0",
@@ -26949,9 +26949,9 @@
"integrity": "sha512-U9h1NLROZTq9uE1SNffn6WuPDg8icmi3ns4rEl/oTfIle4iLjTliCzgTsbaIFMq/Xn078/lfY/BL0GWZ+psK4Q=="
},
"nodemon": {
"version": "2.0.16",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.16.tgz",
"integrity": "sha512-zsrcaOfTWRuUzBn3P44RDliLlp263Z/76FPoHFr3cFFkOz0lTPAcIw8dCzfdVIx/t3AtDYCZRCDkoCojJqaG3w==",
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.18.tgz",
"integrity": "sha512-uAvrKipi2zAz8E7nkSz4qW4F4zd5fs2wNGsTx+xXlP8KXqd9ucE0vY9wankOsPboeDyuUGN9vsXGV1pLn80l/A==",
"dev": true,
"requires": {
"chokidar": "^3.5.2",
@@ -29957,9 +29957,9 @@
}
},
"typescript": {
"version": "4.7.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.3.tgz",
"integrity": "sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA=="
"version": "4.7.4",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz",
"integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ=="
},
"unbox-primitive": {
"version": "1.0.2",

10
interface/package.json
View File

@@ -8,14 +8,14 @@
"@emotion/styled": "^11.9.3",
"@msgpack/msgpack": "^2.7.2",
"@mui/icons-material": "^5.8.4",
"@mui/material": "^5.8.4",
"@table-library/react-table-library": "^3.1.5",
"@mui/material": "^5.8.5",
"@table-library/react-table-library": "3.2.0-beta.1",
"@types/lodash": "^4.14.182",
"@types/node": "^18.0.0",
"@types/react": "^18.0.14",
"@types/react-dom": "^18.0.5",
"@types/react-router-dom": "^5.3.3",
"async-validator": "^4.1.1",
"async-validator": "^4.2.5",
"axios": "^0.27.2",
"http-proxy-middleware": "^2.0.6",
"jwt-decode": "^3.1.2",
@@ -30,7 +30,7 @@
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"sockette": "^2.0.6",
"typescript": "^4.7.3"
"typescript": "^4.7.4"
},
"scripts": {
"start": "react-app-rewired start",
@@ -97,7 +97,7 @@
]
},
"devDependencies": {
"nodemon": "^2.0.16",
"nodemon": "^2.0.18",
"npm-run-all": "^4.1.5"
}
}

57
interface/src/framework/security/ManageUsersForm.tsx
View File

@@ -35,43 +35,44 @@ const ManageUsersForm: FC = () => {
const authenticatedContext = useContext(AuthenticatedContext);
const table_theme = useTheme({
Table: `
--data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 90px 120px;
`,
BaseRow: `
font-size: 14px;
color: white;
padding-left: 8px;
`,
HeaderRow: `
text-transform: uppercase;
background-color: black;
color: #90CAF9;
font-weight: 500;
border-bottom: 1px solid #e0e0e0;
.th {
padding: 8px;
height: 42px;
font-weight: 500;
border-bottom: 1px solid #565656;
}
`,
Row: `
&:nth-of-type(odd) {
.td {
padding: 8px;
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
}
&:nth-of-type(odd) .td {
background-color: #303030;
}
&:nth-of-type(even) {
&:nth-of-type(even) .td {
background-color: #1e1e1e;
}
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
position: relative;
z-index: 1;
&:not(:last-of-type) {
margin-bottom: -1px;
}
&:not(:first-of-type) {
margin-top: -1px;
}
&:hover {
color: white;
}
`,
BaseCell: `
border-top: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 1px solid transparent;
&:nth-of-type(2) {
text-align: center;
}
&:last-of-type {
text-align: right;
}
`
});
@@ -130,22 +131,22 @@ const ManageUsersForm: FC = () => {
return (
<>
<Table data={{ nodes: user_table }} theme={table_theme}>
<Table data={{ nodes: user_table }} theme={table_theme} layout={{ custom: true }}>
{(tableList: any) => (
<>
<Header>
<HeaderRow>
<HeaderCell>USERNAME</HeaderCell>
<HeaderCell>IS ADMIN</HeaderCell>
<HeaderCell />
<HeaderCell resize>USERNAME</HeaderCell>
<HeaderCell stiff>IS ADMIN</HeaderCell>
<HeaderCell stiff />
</HeaderRow>
</Header>
<Body>
{tableList.map((u: any) => (
<Row key={u.id} item={u}>
<Cell>{u.username}</Cell>
<Cell>{u.admin ? <CheckIcon /> : <CloseIcon />}</Cell>
<Cell>
<Cell stiff>{u.admin ? <CheckIcon /> : <CloseIcon />}</Cell>
<Cell stiff>
<IconButton
size="small"
disabled={!authenticatedContext.me.admin}

275
interface/src/project/DashboardData.tsx
View File

@@ -88,185 +88,121 @@ const DashboardData: FC = () => {
const [deviceDialog, setDeviceDialog] = useState<number>(-1);
const [onlyFav, setOnlyFav] = useState(false);
const device_theme = useTheme({
const common_theme = useTheme({
BaseRow: `
font-size: 14px;
color: white;
height: 46px;
&:focus {
z-index: 2;
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
}
`,
HeaderRow: `
text-transform: uppercase;
background-color: black;
color: #90CAF9;
border-bottom: 1px solid #e0e0e0;
font-weight: 500;
.th {
border-bottom: 1px solid #565656;
}
`,
Row: `
background-color: #1e1e1e;
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
position: relative;
z-index: 1;
&:not(:last-of-type) {
margin-bottom: -1px;
cursor: pointer;
.td {
padding: 8px;
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
}
&:not(:first-of-type) {
margin-top: -1px;
}
&:hover {
z-index: 2;
color: white;
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
},
&.tr.tr-body.row-select.row-select-single-selected, &.tr.tr-body.row-select.row-select-selected {
&.tr.tr-body.row-select.row-select-single-selected {
background-color: #3d4752;
color: white;
font-weight: normal;
z-index: 2;
}
&:hover .td {
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
}
`,
BaseCell: `
border-top: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 1px solid transparent;
&:not(.stiff) > div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:nth-of-type(1) {
padding-left: 8px;
min-width: 42px;
width: 42px;
div {
width: 100%;
}
}
&:nth-of-type(2) {
min-width: 100px;
width: 100px;
}
&:nth-of-type(3) {
flex: 1;
}
&:nth-of-type(4) {
text-align: center;
max-width: 100px;
}
Cell: `
&:last-of-type {
padding-left: 0px;
text-align: center;
width: 32px;
min-width: 32px;
max-width: 32px;
}
text-align: right;
},
`
});
const data_theme = useTheme({
BaseRow: `
font-size: 14px;
color: white;
min-height: 32px;
`,
HeaderRow: `
text-transform: uppercase;
background-color: black;
color: #90CAF9;
border-bottom: 1px solid #e0e0e0;
font-weight: 500;
`,
Row: `
&:nth-of-type(odd) {
background-color: #303030;
}
&:nth-of-type(even) {
background-color: #1e1e1e;
}
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
position: relative;
z-index: 1;
&:not(:last-of-type) {
margin-bottom: -1px;
}
&:not(:first-of-type) {
margin-top: -1px;
}
&:hover {
z-index: 2;
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
color: white;
}
`,
BaseCell: `
padding-left: 16px;
cursor: pointer;
border-top: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 1px solid transparent;
&:not(.stiff) > div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:nth-of-type(1) {
width: 260px;
}
&:nth-of-type(2) {
flex: 1;
text-align: right;
}
&:last-of-type {
padding-left: 0px;
text-align: center;
width: 32px;
min-width: 32px;
max-width: 32px;
}
`,
HeaderCell: `
&:not(:last-of-type) {
padding-left: 8px;
border-left: 1px solid #565656;
}
&:first-of-type {
border-left: 0px;
}
`
});
const device_theme = useTheme([
common_theme,
{
Table: `
--data-table-library_grid-template-columns: 40px 100px repeat(1, minmax(0, 1fr)) 80px 40px;
`,
BaseRow: `
.td {
height: 42px;
}
`,
BaseCell: `
&:nth-of-type(2) {
text-align: left;
},
&:nth-of-type(4) {
text-align: center;
}
`,
HeaderRow: `
.th {
padding: 8px;
height: 42px;
font-weight: 500;
`
}
]);
const data_theme = useTheme([
common_theme,
{
Table: `
--data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 200px 40px;
`,
BaseRow: `
.td {
height: 32px;
}
`,
BaseCell: `
&:nth-of-type(2) {
text-align: right;
},
`,
HeaderRow: `
.th {
height: 32px;
}
`,
Row: `
&:nth-of-type(odd) .td {
background-color: #303030;
}
`
}
]);
const temperature_theme = useTheme([data_theme]);
const analog_theme = useTheme([
data_theme,
{
Table: `
--data-table-library_grid-template-columns: 80px repeat(1, minmax(0, 1fr)) 120px 100px 40px;
`,
BaseCell: `
&:nth-of-type(1) {
width: 100px;
min-width: 100px;
}
&:nth-of-type(2) {
text-align: left;
}
&:nth-of-type(3) {
width: 100px;
min-width: 100px;
}
},
&:nth-of-type(4) {
text-align: right;
flex: 1;
}
`
`
}
]);
@@ -536,6 +472,7 @@ const DashboardData: FC = () => {
label={deviceValue.id.slice(2)}
value={deviceValue.u ? numberValue(deviceValue.v) : deviceValue.v}
autoFocus
multiline
sx={{ width: '30ch' }}
type={deviceValue.u ? 'number' : 'text'}
onChange={updateValue(setDeviceValue)}
@@ -709,23 +646,23 @@ const DashboardData: FC = () => {
<>
<Header>
<HeaderRow>
<HeaderCell />
<HeaderCell>TYPE</HeaderCell>
<HeaderCell>DESCRIPTION</HeaderCell>
<HeaderCell>ENTITIES</HeaderCell>
<HeaderCell />
<HeaderCell stiff />
<HeaderCell stiff>TYPE</HeaderCell>
<HeaderCell resize>DESCRIPTION</HeaderCell>
<HeaderCell stiff>ENTITIES</HeaderCell>
<HeaderCell stiff />
</HeaderRow>
</Header>
<Body>
{tableList.map((device: Device, index: number) => (
<Row key={device.id} item={device}>
<Cell>
<Cell stiff>
<DeviceIcon type={device.t} />
</Cell>
<Cell>{device.t}</Cell>
<Cell stiff>{device.t}</Cell>
<Cell>{device.n}</Cell>
<Cell>{device.e}</Cell>
<Cell>
<Cell stiff>{device.e}</Cell>
<Cell stiff>
<IconButton size="small" onClick={() => setDeviceDialog(index)}>
<InfoOutlinedIcon color="info" sx={{ fontSize: 16, verticalAlign: 'middle' }} />
</IconButton>
@@ -778,7 +715,7 @@ const DashboardData: FC = () => {
return (
<>
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="primary">
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="secondary">
{deviceData.label}
</Typography>
<FormControlLabel
@@ -814,7 +751,7 @@ const DashboardData: FC = () => {
ENTITY NAME
</Button>
</HeaderCell>
<HeaderCell>
<HeaderCell reszie>
<Button
fullWidth
style={{ fontSize: '14px', justifyContent: 'flex-end' }}
@@ -824,7 +761,7 @@ const DashboardData: FC = () => {
VALUE
</Button>
</HeaderCell>
<HeaderCell />
<HeaderCell stiff />
</HeaderRow>
</Header>
<Body>
@@ -832,7 +769,7 @@ const DashboardData: FC = () => {
<Row key={dv.id} item={dv} onClick={() => sendCommand(dv)}>
<Cell>{renderNameCell(dv)}</Cell>
<Cell>{formatValue(dv.v, dv.u)}</Cell>
<Cell>
<Cell stiff>
{dv.c && me.admin && !hasMask(dv.id, DeviceEntityMask.DV_READONLY) && (
<IconButton size="small" onClick={() => sendCommand(dv)}>
{isCmdOnly(dv) ? (
@@ -867,7 +804,7 @@ const DashboardData: FC = () => {
const renderDallasData = () => (
<>
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="primary">
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="secondary">
Temperature Sensors
</Typography>
<Table
@@ -890,7 +827,7 @@ const DashboardData: FC = () => {
NAME
</Button>
</HeaderCell>
<HeaderCell>
<HeaderCell stiff>
<Button
fullWidth
style={{ fontSize: '14px', justifyContent: 'flex-end' }}
@@ -900,7 +837,7 @@ const DashboardData: FC = () => {
TEMPERATURE
</Button>
</HeaderCell>
<HeaderCell />
<HeaderCell stiff />
</HeaderRow>
</Header>
<Body>
@@ -926,7 +863,7 @@ const DashboardData: FC = () => {
const renderAnalogData = () => (
<>
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="primary">
<Typography sx={{ pt: 2, pb: 1 }} variant="h6" color="secondary">
Analog Sensors
</Typography>
@@ -935,7 +872,7 @@ const DashboardData: FC = () => {
<>
<Header>
<HeaderRow>
<HeaderCell resize>
<HeaderCell stiff>
<Button
fullWidth
style={{ fontSize: '14px', justifyContent: 'flex-start' }}
@@ -955,7 +892,7 @@ const DashboardData: FC = () => {
NAME
</Button>
</HeaderCell>
<HeaderCell resize>
<HeaderCell stiff>
<Button
fullWidth
style={{ fontSize: '14px', justifyContent: 'flex-start' }}
@@ -965,18 +902,18 @@ const DashboardData: FC = () => {
TYPE
</Button>
</HeaderCell>
<HeaderCell>VALUE</HeaderCell>
<HeaderCell />
<HeaderCell stiff>VALUE</HeaderCell>
<HeaderCell stiff />
</HeaderRow>
</Header>
<Body>
{tableList.map((a: Analog) => (
<Row key={a.id} item={a} onClick={() => updateAnalog(a)}>
<Cell>{a.g}</Cell>
<Cell stiff>{a.g}</Cell>
<Cell>{a.n}</Cell>
<Cell>{AnalogTypeNames[a.t]} </Cell>
<Cell>{a.t ? formatValue(a.v, a.u) : ''}</Cell>
<Cell>
<Cell stiff>{AnalogTypeNames[a.t]} </Cell>
<Cell stiff>{a.t ? formatValue(a.v, a.u) : ''}</Cell>
<Cell stiff>
{me.admin && (
<IconButton onClick={() => updateAnalog(a)}>
<EditIcon color="primary" sx={{ fontSize: 16 }} />

77
interface/src/project/DashboardStatus.tsx
View File

@@ -88,65 +88,40 @@ const DashboardStatus: FC = () => {
const { me } = useContext(AuthenticatedContext);
const stats_theme = tableTheme({
Table: `
--data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 90px 90px 80px;
`,
BaseRow: `
font-size: 14px;
color: white;
height: 32px;
`,
HeaderRow: `
text-transform: uppercase;
background-color: black;
color: #90CAF9;
font-weight: 500;
border-bottom: 1px solid #e0e0e0;
padding-left: 8px;
.th {
height: 42px;
font-weight: 500;
border-bottom: 1px solid #565656;
}
`,
Row: `
&:nth-of-type(odd) {
.td {
padding: 8px;
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
}
&:nth-of-type(odd) .td {
background-color: #303030;
}
&:nth-of-type(even) {
&:nth-of-type(even) .td {
background-color: #1e1e1e;
}
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
position: relative;
z-index: 1;
&:not(:last-of-type) {
margin-bottom: -1px;
}
&:not(:first-of-type) {
margin-top: -1px;
}
&:hover {
color: white;
}
`,
BaseCell: `
border-top: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 1px solid transparent;
&:not(.stiff) > div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:nth-of-type(1) {
padding-left: 8px;
flex: 1;
}
&:nth-of-type(2) {
width: 70px;
text-align: right;
}
&:nth-of-type(3) {
width: 40px;
text-align: right;
}
&:last-of-type {
width: 75px;
text-align: right;
padding-right: 8px;
&:not(:first-of-type) {
text-align: center;
}
`
});
@@ -224,19 +199,19 @@ const DashboardStatus: FC = () => {
<>
<Header>
<HeaderRow>
<HeaderCell></HeaderCell>
<HeaderCell>SUCCESS</HeaderCell>
<HeaderCell>FAIL</HeaderCell>
<HeaderCell>QUALITY</HeaderCell>
<HeaderCell resize></HeaderCell>
<HeaderCell stiff>SUCCESS</HeaderCell>
<HeaderCell stiff>FAIL</HeaderCell>
<HeaderCell stiff>QUALITY</HeaderCell>
</HeaderRow>
</Header>
<Body>
{tableList.map((stat: Stat) => (
<Row key={stat.id} item={stat}>
<Cell>{stat.id}</Cell>
<Cell>{Intl.NumberFormat().format(stat.s)}</Cell>
<Cell>{Intl.NumberFormat().format(stat.f)}</Cell>
<Cell>{showQuality(stat)}</Cell>
<Cell stiff>{Intl.NumberFormat().format(stat.s)}</Cell>
<Cell stiff>{Intl.NumberFormat().format(stat.f)}</Cell>
<Cell stiff>{showQuality(stat)}</Cell>
</Row>
))}
</Body>

95
interface/src/project/SettingsCustomization.tsx
View File

@@ -63,80 +63,65 @@ const SettingsCustomization: FC = () => {
const [masks, setMasks] = useState(() => ['']);
const entities_theme = useTheme({
Table: `
--data-table-library_grid-template-columns: 120px repeat(1, minmax(0, 1fr)) 120px;
`,
BaseRow: `
font-size: 14px;
color: white;
height: 32px;
min-height: 32px;
.td {
height: 32px;
}
`,
BaseCell: `
&:last-of-type {
text-align: right;
}
`,
HeaderRow: `
text-transform: uppercase;
background-color: black;
border-bottom: 1px solid #e0e0e0;
color: #90CAF9;
font-weight: 500;
.th {
border-bottom: 1px solid #565656;
font-weight: 500;
}
&:nth-of-type(1) .th {
text-align: center;
}
`,
Row: `
background-color: #1e1e1e;
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
position: relative;
z-index: 1;
&:not(:last-of-type) {
margin-bottom: -1px;
cursor: pointer;
.td {
border-top: 1px solid #565656;
border-bottom: 1px solid #565656;
}
&:not(:first-of-type) {
margin-top: -1px;
}
&:hover {
z-index: 2;
color: white;
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
},
&.tr.tr-body.row-select.row-select-single-selected, &.tr.tr-body.row-select.row-select-selected {
&.tr.tr-body.row-select.row-select-single-selected {
background-color: #3d4752;
color: white;
font-weight: normal;
z-index: 2;
}
&:hover .td {
border-top: 1px solid #177ac9;
border-bottom: 1px solid #177ac9;
}
&:nth-of-type(odd) .td {
background-color: #303030;
}
`,
BaseCell: `
border-top: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 1px solid transparent;
&:not(.stiff) > div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:nth-of-type(1) {
width: 120px;
min-width: 120px;
max-width: 120px;
}
Cell: `
&:nth-of-type(2) {
padding-left: 8px;
flex: 1;
padding: 8px;
}
&:nth-of-type(3) {
&:last-of-type {
padding-right: 8px;
text-align: right;
width: 120px;
min-width: 120px;
}
`,
HeaderCell: `
&:nth-of-type(1) {
padding-left: 24px;
}
&:nth-of-type(2) {
padding-left: 0px;
}
&:not(:last-of-type) {
border-right: 1px solid #565656;
}
`
});
@@ -451,7 +436,7 @@ const SettingsCustomization: FC = () => {
<>
<Header>
<HeaderRow>
<HeaderCell>OPTIONS</HeaderCell>
<HeaderCell stiff>OPTIONS</HeaderCell>
<HeaderCell resize>
<Button
fullWidth
@@ -462,13 +447,13 @@ const SettingsCustomization: FC = () => {
NAME
</Button>
</HeaderCell>
<HeaderCell>VALUE</HeaderCell>
<HeaderCell resize>VALUE</HeaderCell>
</HeaderRow>
</Header>
<Body>
{tableList.map((de: DeviceEntity) => (
<Row key={de.id} item={de}>
<Cell>
<Cell stiff>
<ToggleButtonGroup
size="small"
color="secondary"

28
mock-api/package-lock.json generated
View File

@@ -13,8 +13,8 @@
"compression": "^1.7.4",
"express": "^4.18.1",
"express-sse": "^0.5.3",
"nodemon": "^2.0.16",
"ws": "^8.7.0"
"nodemon": "^2.0.18",
"ws": "^8.8.0"
}
},
"node_modules/@msgpack/msgpack": {
@@ -1153,9 +1153,9 @@
}
},
"node_modules/nodemon": {
"version": "2.0.16",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.16.tgz",
"integrity": "sha512-zsrcaOfTWRuUzBn3P44RDliLlp263Z/76FPoHFr3cFFkOz0lTPAcIw8dCzfdVIx/t3AtDYCZRCDkoCojJqaG3w==",
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.18.tgz",
"integrity": "sha512-uAvrKipi2zAz8E7nkSz4qW4F4zd5fs2wNGsTx+xXlP8KXqd9ucE0vY9wankOsPboeDyuUGN9vsXGV1pLn80l/A==",
"hasInstallScript": true,
"dependencies": {
"chokidar": "^3.5.2",
@@ -1811,9 +1811,9 @@
}
},
"node_modules/ws": {
"version": "8.7.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.7.0.tgz",
"integrity": "sha512-c2gsP0PRwcLFzUiA8Mkr37/MI7ilIlHQxaEAtd0uNMbVMoy8puJyafRlm0bV9MbGSabUPeLrRRaqIBcFcA2Pqg==",
"version": "8.8.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.0.tgz",
"integrity": "sha512-JDAgSYQ1ksuwqfChJusw1LSJ8BizJ2e/vVu5Lxjq3YvNJNlROv1ui4i+c/kUUrPheBvQl4c5UbERhTwKa6QBJQ==",
"engines": {
"node": ">=10.0.0"
},
@@ -2672,9 +2672,9 @@
"integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg=="
},
"nodemon": {
"version": "2.0.16",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.16.tgz",
"integrity": "sha512-zsrcaOfTWRuUzBn3P44RDliLlp263Z/76FPoHFr3cFFkOz0lTPAcIw8dCzfdVIx/t3AtDYCZRCDkoCojJqaG3w==",
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.18.tgz",
"integrity": "sha512-uAvrKipi2zAz8E7nkSz4qW4F4zd5fs2wNGsTx+xXlP8KXqd9ucE0vY9wankOsPboeDyuUGN9vsXGV1pLn80l/A==",
"requires": {
"chokidar": "^3.5.2",
"debug": "^3.2.7",
@@ -3169,9 +3169,9 @@
}
},
"ws": {
"version": "8.7.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.7.0.tgz",
"integrity": "sha512-c2gsP0PRwcLFzUiA8Mkr37/MI7ilIlHQxaEAtd0uNMbVMoy8puJyafRlm0bV9MbGSabUPeLrRRaqIBcFcA2Pqg==",
"version": "8.8.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.0.tgz",
"integrity": "sha512-JDAgSYQ1ksuwqfChJusw1LSJ8BizJ2e/vVu5Lxjq3YvNJNlROv1ui4i+c/kUUrPheBvQl4c5UbERhTwKa6QBJQ==",
"requires": {}
},
"xdg-basedir": {

4
mock-api/package.json
View File

@@ -15,7 +15,7 @@
"compression": "^1.7.4",
"express": "^4.18.1",
"express-sse": "^0.5.3",
"nodemon": "^2.0.16",
"ws": "^8.7.0"
"nodemon": "^2.0.18",
"ws": "^8.8.0"
}
}

2
src/analogsensor.h
View File

@@ -45,7 +45,7 @@ class AnalogSensor {
std::string name() const;
void set_name(const std::string & name) {
name_ = name;
name_ = name;
}
uint8_t gpio() const {

2
src/dallassensor.h
View File

@@ -57,7 +57,7 @@ class DallasSensor {
std::string name() const;
void set_name(const std::string & name) {
name_ = name;
name_ = name;
}
bool apply_customization();

2
src/system.h
View File

@@ -191,7 +191,7 @@ class System {
#ifndef EMSESP_STANDALONE
return (ethernet_connected() || WiFi.isConnected());
#else
return true;
return true;
#endif
}

2
src/version.h
View File

@@ -1 +1 @@
#define EMSESP_APP_VERSION "3.4.2b2"
#define EMSESP_APP_VERSION "3.4.2b3"