Skip to content

E
ems3.3
Commit 8dd3ab07 authored by 左玲玲's avatar 左玲玲 😬
Browse files
Options

左右样式修改

parent 107b7d55
Hide whitespace changes
Inline Side-by-side
Showing with 281 additions and 243 deletions
src/components/TreeRender/index.jsx
View file @ 8dd3ab07
...@@ -448,7 +448,7 @@ function TreeRender({ ...@@ -448,7 +448,7 @@ function TreeRender({
onChange={onChange} onChange={onChange}
/> />
<div style={{ overflow: 'auto' }}> <div className='boxcontianbox'>
<Tree <Tree
onSelect={(selectedKeys, e) => { onSelect={(selectedKeys, e) => {
cselectedKeys(selectedKeys); cselectedKeys(selectedKeys);
......
src/pages/device/account/index.jsx
View file @ 8dd3ab07
...@@ -12,6 +12,7 @@ import AutoTable from '@/components/AutoTable'; ...@@ -12,6 +12,7 @@ import AutoTable from '@/components/AutoTable';
import PremButton from '@/components/PremButton'; import PremButton from '@/components/PremButton';
import getcolumns from './columns'; import getcolumns from './columns';
import { doFetch } from '@/utils/doFetch'; import { doFetch } from '@/utils/doFetch';
import styles from "./index.less";
import { import {
message, message,
Dropdown, Dropdown,
...@@ -2287,8 +2288,8 @@ function Model(props) { ...@@ -2287,8 +2288,8 @@ function Model(props) {
}; };
const containderef = useRef(); const containderef = useRef();
return ( return (<div className={styles.ledgerbox}>
<div> <div className={styles.ledgerheader}>
<div className="ant-card-head" style={{ backgroundColor: 'white' }}> <div className="ant-card-head" style={{ backgroundColor: 'white' }}>
<div className="ant-card-head-wrapper"> <div className="ant-card-head-wrapper">
<div className="ant-card-head-title"> <div className="ant-card-head-title">
...@@ -2296,170 +2297,153 @@ function Model(props) { ...@@ -2296,170 +2297,153 @@ function Model(props) {
</div> </div>
</div> </div>
</div> </div>
<Layout style={{ height: '100%' }} ref={containderef}> </div>
<Sider theme="light" width={300}> <div className={styles.ledgercontent}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} /> <div className={`${styles.ledgerleft} boxcontianbox`}>
</Sider> <TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
<Content> </div>
<AutoTable <div className={`${styles.ledgerright} boxcontianbox`} ref={containderef}>
pagetitle={<h3 style={{ marginBottom: 0, fontWeight: 400 }}>设备台账</h3>} <AutoTable
columns={columns} pagetitle={<h3 style={{ marginBottom: 0, fontWeight: 400 }}>设备台账</h3>}
path={urlParams.list} columns={columns}
actionRef={actionRef} path={urlParams.list}
pageextra={'add'} actionRef={actionRef}
resizeable={false} pageextra={'add'}
addconfig={{ resizeable={false}
// access: 'sysDepartment_save', addconfig={{
btn: { // access: 'sysDepartment_save',
disabled: false, btn: {
type: 'primary', disabled: false,
onClick: () => { type: 'primary',
setDrawer((s) => ({ onClick: () => {
...s, setDrawer((s) => ({
visible: true, ...s,
item: null, visible: true,
title: '新增', item: null,
val: 'only', title: '新增',
type: 'add', val: 'only',
// onFinish: async (vals) => { type: 'add'
// //console.log(vals); }));
// let params = {
// ...vals,
// };
// let res = await doFetch({
// url: urlParams.save,
// params,
// });
// if (res.code === '0000') {
// message.success('新增成功！');
// setDrawer((s) => ({
// ...s,
// visible: false,
// }));
// actionRef.current.reload();
// }
// },
}));
},
}, },
}}
x={1500}
extraparams={extraparams}
/>
</Content>
</Layout>
<DrawerPro
fields={columns}
formRef={formRef}
placement="right"
onClose={() => {
setDrawer((s) => ({
...s,
visible: false,
}));
}}
{...drawer}
colProps={{
span: 8,
}}
>
{drawer?.visible && selectMoreDrawerType(drawer?.type)}
</DrawerPro>
<DrawerPro
placement="right"
onClose={async () => {
await setactiveTab(3);
await setCurrDrawer((s) => ({
...s,
visible: false,
item: null,
}));
}}
{...currDrawer}
colProps={{
span: 8,
}}
>
<ProDescriptions
title="设备信息"
request={async () => {
const { data } = await doFetch({
url: urlParams.detail,
params: { id: drawer?.item?.id },
});
return {
success: true,
data: data?.data,
};
}}
columns={[
{
title: '设备编号',
dataIndex: 'equipmentNo',
key: 'equipmentNo',
},
{
title: '设备名称',
dataIndex: 'equipmentName',
key: 'equipmentName',
},
{
title: '位置号',
dataIndex: 'positionNo',
key: 'positionNo',
},
{
title: '公司名称',
dataIndex: 'organizationName',
key: 'organizationId',
},
{
title: '部门名称',
dataIndex: 'departmentName',
key: 'departmentId',
}, },
{
title: '工厂名称',
dataIndex: 'factoryName',
key: 'factoryId',
},
{
title: '车间名称',
dataIndex: 'shopName',
key: 'shopId',
},
{
title: '工段名称',
dataIndex: 'sectionName',
key: 'sectionId',
},
{
title: '产线名称',
dataIndex: 'productLineName',
key: 'productLineName',
},
]}
/>
<Divider />
<ProDescriptions
title={currDrawer?.item?.logTypeName + '信息'}
column={2}
request={async () => {
const { data } = await doFetch({
url: urlParams_resume.detail,
params: { id: currDrawer?.item?.id },
});
return {
success: true,
data: data?.data?.resume,
};
}} }}
columns={currfields[currDrawer?.item?.logType]} x={1500}
extraparams={extraparams}
/> />
</DrawerPro> </div>
</div> </div>
<DrawerPro
fields={columns}
formRef={formRef}
placement="right"
onClose={() => {
setDrawer((s) => ({
...s,
visible: false,
}));
}}
{...drawer}
colProps={{
span: 8,
}}
>
{drawer?.visible && selectMoreDrawerType(drawer?.type)}
</DrawerPro>
<DrawerPro
placement="right"
onClose={async () => {
await setactiveTab(3);
await setCurrDrawer((s) => ({
...s,
visible: false,
item: null,
}));
}}
{...currDrawer}
colProps={{
span: 8,
}}
>
<ProDescriptions
title="设备信息"
request={async () => {
const { data } = await doFetch({
url: urlParams.detail,
params: { id: drawer?.item?.id },
});
return {
success: true,
data: data?.data,
};
}}
columns={[
{
title: '设备编号',
dataIndex: 'equipmentNo',
key: 'equipmentNo',
},
{
title: '设备名称',
dataIndex: 'equipmentName',
key: 'equipmentName',
},
{
title: '位置号',
dataIndex: 'positionNo',
key: 'positionNo',
},
{
title: '公司名称',
dataIndex: 'organizationName',
key: 'organizationId',
},
{
title: '部门名称',
dataIndex: 'departmentName',
key: 'departmentId',
},
{
title: '工厂名称',
dataIndex: 'factoryName',
key: 'factoryId',
},
{
title: '车间名称',
dataIndex: 'shopName',
key: 'shopId',
},
{
title: '工段名称',
dataIndex: 'sectionName',
key: 'sectionId',
},
{
title: '产线名称',
dataIndex: 'productLineName',
key: 'productLineName',
},
]}
/>
<Divider />
<ProDescriptions
title={currDrawer?.item?.logTypeName + '信息'}
column={2}
request={async () => {
const { data } = await doFetch({
url: urlParams_resume.detail,
params: { id: currDrawer?.item?.id },
});
return {
success: true,
data: data?.data?.resume,
};
}}
columns={currfields[currDrawer?.item?.logType]}
/>
</DrawerPro>
</div>
); );
} }
......
src/pages/device/account/index.less 0 → 100644
View file @ 8dd3ab07
.ledgerbox {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.ledgerheader {
width: 100%;
border-bottom: 1px solid #f0f0f0;
flex-shrink: 0;
}
.ledgercontent {
background-color: #fff;
flex: 1;
width: 100%;
overflow: hidden;
display: flex;
justify-content: space-between;
.ledgerleft {
width: 300px;
display: flex;
flex-direction: column;
height: 100%;
overflow-y: auto;
padding: 0 16px;
flex-shrink: 0;
}
.ledgerright {
padding: 0 16px;
flex: 1;
border-left: 1px solid #f0f0f0;
overflow: hidden;
overflow-y: auto;
}
}
}
\ No newline at end of file
src/pages/lease/contract/Devices.jsx
View file @ 8dd3ab07
...@@ -3,6 +3,12 @@ import { Tooltip, Tabs } from 'antd'; ...@@ -3,6 +3,12 @@ import { Tooltip, Tabs } from 'antd';
import Filedetail from "@/components/Filedetail"; import Filedetail from "@/components/Filedetail";
import DetailPro from '@/components/DetailPro'; import DetailPro from '@/components/DetailPro';
import AutoTable from '@/components/AutoTable/mtable'; import AutoTable from '@/components/AutoTable/mtable';
const statusColors = {
1: '#7ac143',
2: 'orange',
3: '#6a737b',
4: '#fa4659'
};
const columns = [ const columns = [
{ {
title: '设备编号', title: '设备编号',
...@@ -58,7 +64,10 @@ const columns = [ ...@@ -58,7 +64,10 @@ const columns = [
{ label: '待机', value: 2 }, { label: '待机', value: 2 },
{ label: '关机', value: 3 }, { label: '关机', value: 3 },
{ label: '报警', value: 4 } { label: '报警', value: 4 }
] ],
render: (_, row) => {
return <span style={{ color: statusColors[row.collectStatus] }}>{row.collectStatusName}</span>
}
}, },
]; ];
const Devices = ({ drawer }) => { const Devices = ({ drawer }) => {
......
src/pages/lease/devicedata/Basemsg.jsx
View file @ 8dd3ab07
...@@ -14,12 +14,7 @@ const Basemsg = ({ drawer, activeKey, setdrawer }) => { ...@@ -14,12 +14,7 @@ const Basemsg = ({ drawer, activeKey, setdrawer }) => {
return res?.data?.data ?? {}; return res?.data?.data ?? {};
}, { }, {
refreshDeps: [drawer?.item?.id] refreshDeps: [drawer?.item?.id]
}) });
return <DetailPro return <DetailPro
fields={columns} fields={columns}
detailData={detailData?.data ?? {}} detailData={detailData?.data ?? {}}
......
src/pages/lease/devicedata/columns.js
View file @ 8dd3ab07
...@@ -2,7 +2,7 @@ import { Tooltip, Image, Tag } from 'antd'; ...@@ -2,7 +2,7 @@ import { Tooltip, Image, Tag } from 'antd';
import { doFetch } from '@/utils/doFetch'; import { doFetch } from '@/utils/doFetch';
const statusColors = { const statusColors = {
1: '#7ac143', 1: '#7ac143',
2: '#00bce4', 2: 'orange',
3: '#6a737b', 3: '#6a737b',
4: '#fa4659' 4: '#fa4659'
}; };
......
src/pages/lease/devicedata/index.jsx
View file @ 8dd3ab07
...@@ -158,10 +158,10 @@ const Devicedata = () => { ...@@ -158,10 +158,10 @@ const Devicedata = () => {
</div> </div>
</div> </div>
<div className={styles.ledgercontent}> <div className={styles.ledgercontent}>
<div className={styles.ledgerleft}> <div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} /> <TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
</div> </div>
<div className={`${styles.ledgerright} ledgerf`}> <div className={`${styles.ledgerright} ledgerf boxcontianbox`}>
<Tabs destroyInactiveTabPane activeKey={activeKey} onChange={(key) => { <Tabs destroyInactiveTabPane activeKey={activeKey} onChange={(key) => {
catk(key); catk(key);
}} items={tableItems} /> }} items={tableItems} />
......
src/pages/lease/devicedata/index.less
View file @ 8dd3ab07
.ledgerbox { .ledgerbox {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden;
background-color: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
.ledgerheader { .ledgerheader {
width: 100%; width: 100%;
...@@ -14,6 +11,7 @@ ...@@ -14,6 +11,7 @@
} }
.ledgercontent { .ledgercontent {
background-color: #fff;
flex: 1; flex: 1;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
...@@ -25,7 +23,7 @@ ...@@ -25,7 +23,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
overflow-y: hidden; overflow-y: auto;
padding: 0 16px; padding: 0 16px;
flex-shrink: 0; flex-shrink: 0;
} }
...@@ -35,6 +33,7 @@ ...@@ -35,6 +33,7 @@
flex: 1; flex: 1;
border-left: 1px solid #f0f0f0; border-left: 1px solid #f0f0f0;
overflow: hidden; overflow: hidden;
overflow-y: auto;
} }
} }
} }
\ No newline at end of file
src/pages/lease/leasedevice/index.jsx
View file @ 8dd3ab07
...@@ -92,7 +92,7 @@ const columnsa = [ ...@@ -92,7 +92,7 @@ const columnsa = [
key: 'standbyRate', key: 'standbyRate',
search: false, search: false,
render: (_, row) => { render: (_, row) => {
return <span style={{ color: "#00bce4" }}>{row.standbyRate}%</span> return <span style={{ color: "orange" }}>{row.standbyRate}%</span>
} }
}, },
{ {
......
src/pages/lease/ledger/Devicestatus.jsx
View file @ 8dd3ab07
...@@ -221,17 +221,23 @@ const Devicestatus = ({ drawer }) => { ...@@ -221,17 +221,23 @@ const Devicestatus = ({ drawer }) => {
return option; return option;
}, [chartdata?.data]); }, [chartdata?.data]);
const optionbData = useMemo(() => { const optionbData = useMemo(() => {
let colors = []; let colors = [], allData = chartdata?.data?.data?.datalist ?? [], tableData = [];
let data = chartdata?.data?.data?.datalist?.length > 0 ? [{ let data = allData?.length > 0 ? [{
name: '', name: '',
value: chartdata?.data?.data?.datalist?.map(it => { value: allData?.map(it => {
return { return {
name: it.status, name: it.status,
value: [it.start, it.end] value: [it.start, it.end]
} }
}) ?? [] }) ?? []
}] : []; }] : [];
tableData = allData?.sort(compareTimeDesc);
tableData = tableData?.map((it, i) => {
return {
...it,
id: i
}
}) ?? [];
for (let i in statusColors) { for (let i in statusColors) {
colors.push({ colors.push({
type: i, type: i,
...@@ -241,68 +247,75 @@ const Devicestatus = ({ drawer }) => { ...@@ -241,68 +247,75 @@ const Devicestatus = ({ drawer }) => {
}; };
return { return {
statusData: data, statusData: data,
statusColorList: colors statusColorList: colors,
tableData
} }
}, [chartdata?.data]); }, [chartdata?.data]);
return <div style={{ display: "flex", justifyContent: "space-between", position: "relative" }}> function compareTimeDesc(a, b) {
<div style={{ width: 300, padding: '0 16px', flexShrink: 0 }}> const timeA = dayjs(a.start).valueOf();
<TreeRender dataSource={device?.data} onselected={onselecteTree} noaction={true} isSelectFirst={true} maxWidth={240} /> const timeB = dayjs(b.start).valueOf();
</div> return timeB - timeA;
<div style={{ padding: 16, flex: 1, borderLeft: '1px solid #f0f0f0' }}> }
<div style={{ marginBottom: 30 }}> return <div className={styles.ledgerbox}>
<RangePicker <div className={styles.ledgercontent}>
showTime={{ <div className={`${styles.ledgerleft} boxcontianbox`}>
format: 'HH:mm:ss', <TreeRender dataSource={device?.data} onselected={onselecteTree} noaction={true} isSelectFirst={true} maxWidth={215} />
}}
format={format}
onChange={(val, dateString) => {
}}
value={dateTimeRange?.length > 0 ? [dayjs(dateTimeRange?.[0]), dayjs(dateTimeRange?.[1])] : []}
/>
<Button onClick={() => {
chartdata.run()
}} type="primary" style={{ marginLeft: 15 }}>查询</Button>
</div> </div>
<div style={{ display: 'flex' }}> <div className={`${styles.ledgerright} boxcontianbox`} style={{ padding: 16, flex: 1, borderLeft: '1px solid #f0f0f0' }}>
<div className='statuspage' style={{ flex: 1, marginRight: 30 }}> <div style={{ marginBottom: 30 }}>
<AutoTable <RangePicker
columns={[ showTime={{
{ format: 'HH:mm:ss',
title: '采集时间', }}
dataIndex: 'start', format={format}
key: 'start', onChange={(val, dateString) => {
search: false cdate(dateString)
}, }}
{ value={dateTimeRange?.length > 0 ? [dayjs(dateTimeRange?.[0]), dayjs(dateTimeRange?.[1])] : []}
title: '采集状态',
dataIndex: 'name',
key: 'name',
search: false
},
]}
dataSource={chartdata?.data?.data?.datalist?.map((it, i) => {
return {
...it,
id: i
}
}) ?? []}
resizeable={false}
pageextra="none"
options={false}
/> />
<Button onClick={() => {
chartdata.run()
}} type="primary" style={{ marginLeft: 15 }}>查询</Button>
</div> </div>
<div style={{ flex: 2 }}> <div style={{ display: 'flex' }}>
<ReactEcharts <div className='statuspage' style={{ flex: 1, marginRight: 30 }}>
style={{ height: 300, width: '100%' }} <AutoTable
option={optionsa} columns={[
/> {
<div style={{ height: 200, width: '100%' }}> title: '采集时间',
<Statuschart statusData={optionbData.statusData} statusColorList={optionbData.statusColorList} /> dataIndex: 'start',
key: 'start',
search: false
},
{
title: '采集状态',
dataIndex: 'name',
key: 'name',
search: false,
render: (_, row) => {
return <span style={{ color: statusColors[row.status]?.color }}>{row.name}</span>
}
},
]}
dataSource={optionbData?.tableData}
resizeable={false}
pageextra="none"
options={false}
/>
</div>
<div style={{ flex: 2 }}>
<ReactEcharts
style={{ height: 300, width: '100%' }}
option={optionsa}
/>
<div style={{ height: 200, width: '100%' }}>
<Statuschart statusData={optionbData.statusData} statusColorList={optionbData.statusColorList} />
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
} }
export default Devicestatus; export default Devicestatus;
\ No newline at end of file
src/pages/lease/ledger/index.jsx
View file @ 8dd3ab07
...@@ -341,10 +341,10 @@ const Ledger = () => { ...@@ -341,10 +341,10 @@ const Ledger = () => {
</div> </div>
</div> </div>
<div className={styles.ledgercontent}> <div className={styles.ledgercontent}>
<div className={styles.ledgerleft}> <div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={240} /> <TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
</div> </div>
<div className={styles.ledgerright}> <div className={`${styles.ledgerright} boxcontianbox`}>
<AutoTable <AutoTable
pagetitle={'设备列表'} pagetitle={'设备列表'}
columns={columns} columns={columns}
......
src/pages/lease/ledger/index.less
View file @ 8dd3ab07
.ledgerbox { .ledgerbox {
width: 100%; width: 100%;
height: 100%; height: 100%;
// overflow: hidden;
background-color: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// position: relative;
.ledgerheader { .ledgerheader {
width: 100%; width: 100%;
...@@ -14,9 +11,10 @@ ...@@ -14,9 +11,10 @@
} }
.ledgercontent { .ledgercontent {
background-color: #fff;
flex: 1; flex: 1;
width: 100%; width: 100%;
// overflow: hidden; overflow: hidden;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
...@@ -25,12 +23,13 @@ ...@@ -25,12 +23,13 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
overflow-y: hidden; overflow-y: auto;
padding: 0 16px; padding: 0 16px;
flex-shrink: 0; flex-shrink: 0;
} }
.ledgerright { .ledgerright {
padding: 0 16px;
flex: 1; flex: 1;
border-left: 1px solid #f0f0f0; border-left: 1px solid #f0f0f0;
overflow: hidden; overflow: hidden;
......
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