Browse Source

表格勾选,弹窗

dev
wenlele 2 years ago
parent
commit
8ddf7b9b07
  1. BIN
      web/client/assets/images/problem/bitmap.png
  2. BIN
      web/client/assets/images/problem/keyboard.png
  3. 21
      web/client/src/sections/problem/components/statistics.jsx
  4. 16
      web/client/src/sections/problem/components/tableData.jsx
  5. 4
      web/client/src/sections/problem/containers/dataAlarm.jsx

BIN
web/client/assets/images/problem/bitmap.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 591 KiB

BIN
web/client/assets/images/problem/keyboard.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

21
web/client/src/sections/problem/components/statistics.jsx

@ -8,7 +8,7 @@ const Statistics = ({ dispatch, actions, close, modalName, visible, appData }) =
return (
<div style={{ width: '100%', height: 180, backgroundColor: 'white', marginBottom: 20 }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div>数据异常统计</div>
<div style={{ width: 190, fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', }}><span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 10px" }}></span>数据异常统计</div>
{/* <DatePicker
type="dateTimeRange"
style={{ width: 405 }}
@ -17,18 +17,23 @@ const Statistics = ({ dispatch, actions, close, modalName, visible, appData }) =
prefix='统计时段:'
onChange={console.log}
/> */}
<div style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#BDDBFC' }}><img src="/assets/images/problem/keyboard.png" style={{ width: 30, height: 17, marginRight: 10 }} />开发中敬请期待</div>
</div>
{/* <div style={{ width: '100%', display: 'flex', justifyContent: 'space-around', marginTop: 8 }}>
<div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
<div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
{/* <div style={{ width: '100%', display: 'flex', justifyContent: 'space-around', marginTop: 8 }}> */}
{/* <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}></div>
<div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
<div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
<div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div> */}
</div> */}
<div style={{ fontSize: 32, fontFamily: 'YouSheBiaoTiHei', fontWeight: 500, color: '#005ABD', textIndent:60, lineHeight: '156px', background: 'url(/assets/images/problem/await.png)', backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', width: 'calc(100% - 40px)', height: '156', margin: '0 0 0 10px' }}>
{/* </div> */}
{/* <div style={{ fontSize: 32, fontFamily: 'YouSheBiaoTiHei', fontWeight: 500, color: '#005ABD', textIndent:60, lineHeight: '156px', background: 'url(/assets/images/problem/await.png)', backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', width: 'calc(100% - 40px)', height: 156, margin: '0 0 0 10px' }}>
暂未开放 敬请期待
</div>
</div>
</div> */}
<img src="/assets/images/problem/bitmap.png" style={{ width: 'calc(100% - 20px)', height: 156, margin: '0 0 0 10px' }} />
</div >
)
}

16
web/client/src/sections/problem/components/tableData.jsx

@ -38,7 +38,7 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
maxLength="16"
placeholder="搜索项目名称、结构物名称、或告警源名称"
labelPosition="left"
style={{ width: 292, marginRight: 10, }}
style={{ width: 292, marginRight: 10, marginBottom: 16 }}
/>)
} else {
frame.push(<Form.Select
@ -76,7 +76,7 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
</Form>
<div
style={{
width: 100,
width: 170,
display: "flex",
justifyContent: "space-between",
alignItems: "flex-end",
@ -84,6 +84,13 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
}}
>
<img src="/assets/images/problem/setup.png" style={{ width: 24, height: 24 }} onClick={() => setSetup(true)} />
<Button
theme="solid"
type="primary"
style={{ width: 65, height: 30, borderRadius: 3, }}
>
导出
</Button>
<Button
theme="solid"
type="primary"
@ -128,6 +135,7 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
},
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
setSelected(selectedRows.map(v => v.key))
},
}}
/>
@ -140,8 +148,8 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
}}
>
<div>
<div style={{ display: 'inline-block', lineHeight: '30px' }}>勾选<span style={{ fontWeight: 400, color: '#0F7EFB', }}>0</span>问题</div>
<Button style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#0F7EFB', fontWeight: 400, margin: '0 10px' }}>全选</Button>
<div style={{ display: 'inline-block', lineHeight: '30px' }}>勾选<span style={{ fontWeight: 400, color: '#0F7EFB', }}>{selected.length}</span>问题</div>
<Button onClick={() => setSelected(["156468", "257425"])} style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#0F7EFB', fontWeight: 400, margin: '0 10px' }}>全选</Button>
<Button type='primary' theme='solid' style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#FFFFFF', fontWeight: 400, }}>批量确认</Button>
</div>
<div style={{ display: 'flex', }}>

4
web/client/src/sections/problem/containers/dataAlarm.jsx

@ -261,13 +261,13 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
<div>
{abnormalLenght > 0 ? <div style={{ height: 30, fontSize: 12, display: 'flex' }}><IconAlertCircle /><div>当前滞留5个工单即将超时请尽快处理</div></div> : ""}
</div>
{/* <Statistics />
<Statistics />
<TableData
route={route}
collectData={collectData}
setSetup={setSetup}
exhibition={exhibition}
/> */}
/>
{setup ? (
<Setup
tableType={tableType[route] || []}

Loading…
Cancel
Save