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({
onChange={onChange}
/>
<div style={{ overflow: 'auto' }}>
<div className='boxcontianbox'>
<Tree
onSelect={(selectedKeys, e) => {
cselectedKeys(selectedKeys);
......
src/pages/device/account/index.jsx
View file @ 8dd3ab07
......@@ -12,6 +12,7 @@ import AutoTable from '@/components/AutoTable';
import PremButton from '@/components/PremButton';
import getcolumns from './columns';
import { doFetch } from '@/utils/doFetch';
import styles from "./index.less";
import {
message,
Dropdown,
......@@ -2287,8 +2288,8 @@ function Model(props) {
};
const containderef = useRef();
return (
<div>
return (<div className={styles.ledgerbox}>
<div className={styles.ledgerheader}>
<div className="ant-card-head" style={{ backgroundColor: 'white' }}>
<div className="ant-card-head-wrapper">
<div className="ant-card-head-title">
......@@ -2296,170 +2297,153 @@ function Model(props) {
</div>
</div>
</div>
<Layout style={{ height: '100%' }} ref={containderef}>
<Sider theme="light" width={300}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} />
</Sider>
<Content>
<AutoTable
pagetitle={<h3 style={{ marginBottom: 0, fontWeight: 400 }}>设备台账</h3>}
columns={columns}
path={urlParams.list}
actionRef={actionRef}
pageextra={'add'}
resizeable={false}
addconfig={{
// access: 'sysDepartment_save',
btn: {
disabled: false,
type: 'primary',
onClick: () => {
setDrawer((s) => ({
...s,
visible: true,
item: null,
title: '新增',
val: 'only',
type: 'add',
// onFinish: async (vals) => {
// //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();
// }
// },
}));
},
</div>
<div className={styles.ledgercontent}>
<div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
</div>
<div className={`${styles.ledgerright} boxcontianbox`} ref={containderef}>
<AutoTable
pagetitle={<h3 style={{ marginBottom: 0, fontWeight: 400 }}>设备台账</h3>}
columns={columns}
path={urlParams.list}
actionRef={actionRef}
pageextra={'add'}
resizeable={false}
addconfig={{
// access: 'sysDepartment_save',
btn: {
disabled: false,
type: 'primary',
onClick: () => {
setDrawer((s) => ({
...s,
visible: true,
item: null,
title: '新增',
val: 'only',
type: 'add'
}));
},
}}
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>
<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';
import Filedetail from "@/components/Filedetail";
import DetailPro from '@/components/DetailPro';
import AutoTable from '@/components/AutoTable/mtable';
const statusColors = {
1: '#7ac143',
2: 'orange',
3: '#6a737b',
4: '#fa4659'
};
const columns = [
{
title: '设备编号',
......@@ -58,7 +64,10 @@ const columns = [
{ label: '待机', value: 2 },
{ label: '关机', value: 3 },
{ label: '报警', value: 4 }
]
],
render: (_, row) => {
return <span style={{ color: statusColors[row.collectStatus] }}>{row.collectStatusName}</span>
}
},
];
const Devices = ({ drawer }) => {
......
src/pages/lease/devicedata/Basemsg.jsx
View file @ 8dd3ab07
......@@ -14,12 +14,7 @@ const Basemsg = ({ drawer, activeKey, setdrawer }) => {
return res?.data?.data ?? {};
}, {
refreshDeps: [drawer?.item?.id]
})
});
return <DetailPro
fields={columns}
detailData={detailData?.data ?? {}}
......
src/pages/lease/devicedata/columns.js
View file @ 8dd3ab07
......@@ -2,7 +2,7 @@ import { Tooltip, Image, Tag } from 'antd';
import { doFetch } from '@/utils/doFetch';
const statusColors = {
1: '#7ac143',
2: '#00bce4',
2: 'orange',
3: '#6a737b',
4: '#fa4659'
};
......
src/pages/lease/devicedata/index.jsx
View file @ 8dd3ab07
......@@ -158,10 +158,10 @@ const Devicedata = () => {
</div>
</div>
<div className={styles.ledgercontent}>
<div className={styles.ledgerleft}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} />
<div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
</div>
<div className={`${styles.ledgerright} ledgerf`}>
<div className={`${styles.ledgerright} ledgerf boxcontianbox`}>
<Tabs destroyInactiveTabPane activeKey={activeKey} onChange={(key) => {
catk(key);
}} items={tableItems} />
......
src/pages/lease/devicedata/index.less
View file @ 8dd3ab07
.ledgerbox {
width: 100%;
height: 100%;
overflow: hidden;
background-color: #fff;
display: flex;
flex-direction: column;
position: relative;
.ledgerheader {
width: 100%;
......@@ -14,6 +11,7 @@
}
.ledgercontent {
background-color: #fff;
flex: 1;
width: 100%;
overflow: hidden;
......@@ -25,7 +23,7 @@
display: flex;
flex-direction: column;
height: 100%;
overflow-y: hidden;
overflow-y: auto;
padding: 0 16px;
flex-shrink: 0;
}
......@@ -35,6 +33,7 @@
flex: 1;
border-left: 1px solid #f0f0f0;
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 = [
key: 'standbyRate',
search: false,
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 }) => {
return option;
}, [chartdata?.data]);
const optionbData = useMemo(() => {
let colors = [];
let data = chartdata?.data?.data?.datalist?.length > 0 ? [{
let colors = [], allData = chartdata?.data?.data?.datalist ?? [], tableData = [];
let data = allData?.length > 0 ? [{
name: '',
value: chartdata?.data?.data?.datalist?.map(it => {
value: allData?.map(it => {
return {
name: it.status,
value: [it.start, it.end]
}
}) ?? []
}] : [];
tableData = allData?.sort(compareTimeDesc);
tableData = tableData?.map((it, i) => {
return {
...it,
id: i
}
}) ?? [];
for (let i in statusColors) {
colors.push({
type: i,
......@@ -241,68 +247,75 @@ const Devicestatus = ({ drawer }) => {
};
return {
statusData: data,
statusColorList: colors
statusColorList: colors,
tableData
}
}, [chartdata?.data]);
return <div style={{ display: "flex", justifyContent: "space-between", position: "relative" }}>
<div style={{ width: 300, padding: '0 16px', flexShrink: 0 }}>
<TreeRender dataSource={device?.data} onselected={onselecteTree} noaction={true} isSelectFirst={true} maxWidth={240} />
</div>
<div style={{ padding: 16, flex: 1, borderLeft: '1px solid #f0f0f0' }}>
<div style={{ marginBottom: 30 }}>
<RangePicker
showTime={{
format: 'HH:mm:ss',
}}
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>
function compareTimeDesc(a, b) {
const timeA = dayjs(a.start).valueOf();
const timeB = dayjs(b.start).valueOf();
return timeB - timeA;
}
return <div className={styles.ledgerbox}>
<div className={styles.ledgercontent}>
<div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender dataSource={device?.data} onselected={onselecteTree} noaction={true} isSelectFirst={true} maxWidth={215} />
</div>
<div style={{ display: 'flex' }}>
<div className='statuspage' style={{ flex: 1, marginRight: 30 }}>
<AutoTable
columns={[
{
title: '采集时间',
dataIndex: 'start',
key: 'start',
search: false
},
{
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}
<div className={`${styles.ledgerright} boxcontianbox`} style={{ padding: 16, flex: 1, borderLeft: '1px solid #f0f0f0' }}>
<div style={{ marginBottom: 30 }}>
<RangePicker
showTime={{
format: 'HH:mm:ss',
}}
format={format}
onChange={(val, dateString) => {
cdate(dateString)
}}
value={dateTimeRange?.length > 0 ? [dayjs(dateTimeRange?.[0]), dayjs(dateTimeRange?.[1])] : []}
/>
<Button onClick={() => {
chartdata.run()
}} type="primary" style={{ marginLeft: 15 }}>查询</Button>
</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 style={{ display: 'flex' }}>
<div className='statuspage' style={{ flex: 1, marginRight: 30 }}>
<AutoTable
columns={[
{
title: '采集时间',
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>
}
export default Devicestatus;
\ No newline at end of file
src/pages/lease/ledger/index.jsx
View file @ 8dd3ab07
......@@ -341,10 +341,10 @@ const Ledger = () => {
</div>
</div>
<div className={styles.ledgercontent}>
<div className={styles.ledgerleft}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={240} />
<div className={`${styles.ledgerleft} boxcontianbox`}>
<TreeRender url="/auth/sysFactory/getTree" onselected={onselecteTree} noaction={true} maxWidth={215} />
</div>
<div className={styles.ledgerright}>
<div className={`${styles.ledgerright} boxcontianbox`}>
<AutoTable
pagetitle={'设备列表'}
columns={columns}
......
src/pages/lease/ledger/index.less
View file @ 8dd3ab07
.ledgerbox {
width: 100%;
height: 100%;
// overflow: hidden;
background-color: #fff;
display: flex;
flex-direction: column;
// position: relative;
.ledgerheader {
width: 100%;
......@@ -14,9 +11,10 @@
}
.ledgercontent {
background-color: #fff;
flex: 1;
width: 100%;
// overflow: hidden;
overflow: hidden;
display: flex;
justify-content: space-between;
......@@ -25,12 +23,13 @@
display: flex;
flex-direction: column;
height: 100%;
overflow-y: hidden;
overflow-y: auto;
padding: 0 16px;
flex-shrink: 0;
}
.ledgerright {
padding: 0 16px;
flex: 1;
border-left: 1px solid #f0f0f0;
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