|
|
|
@ -1,42 +1,79 @@ |
|
|
|
import React, { useState, useRef, useEffect } from "react"; |
|
|
|
import { connect } from "react-redux"; |
|
|
|
import { Modal, Spin,Input,TagInput } from "@douyinfe/semi-ui"; |
|
|
|
|
|
|
|
import { Modal, Spin,Input,TagInput ,Select} from "@douyinfe/semi-ui"; |
|
|
|
function programmeModal (props) { |
|
|
|
const { |
|
|
|
close, |
|
|
|
rowId, |
|
|
|
dispatch, |
|
|
|
actions, |
|
|
|
nodesAll |
|
|
|
nodesAll,//是否批量 |
|
|
|
tableNews,//表格行全数据 |
|
|
|
} = props; |
|
|
|
const { equipmentWarehouse } = actions; |
|
|
|
const { offline } = actions; |
|
|
|
|
|
|
|
const [notesValue, setNotesValue] = useState('');//释义 |
|
|
|
const [codeList, setCodeList] = useState([]);//状态码列表 |
|
|
|
const [codeIdList, setcodeIdList] = useState([]);//选中的状态码id |
|
|
|
const [platform, setPlatform] = useState(['yingshi']);//选中的平台 |
|
|
|
|
|
|
|
const [notesValue, setNotesValue] = useState('');//表格设置弹框 |
|
|
|
//初始化 |
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
setNotesValue(tableNews.paraphraseCustom||'') |
|
|
|
dispatch( |
|
|
|
offline.getStatusSimpleAll() |
|
|
|
).then((res) => { |
|
|
|
let mycodeList=[]; |
|
|
|
if(res.payload&&res.payload.data){ |
|
|
|
for (let index = 0; index < res.payload.data.length; index++) { |
|
|
|
mycodeList.push({id:res.payload.data[index].id,status:res.payload.data[index].status+' '+res.payload.data[index].describe,platform:res.payload.data[index].platform}) |
|
|
|
} |
|
|
|
} |
|
|
|
setCodeList(mycodeList) |
|
|
|
}) |
|
|
|
}, []); |
|
|
|
|
|
|
|
function handleOk () { |
|
|
|
//点击弹框确定 右边按钮 |
|
|
|
// dispatch( |
|
|
|
// equipmentWarehouse.postCameraRemark({ |
|
|
|
// cameraId:rowId, |
|
|
|
// remark:showScrollList |
|
|
|
// }) |
|
|
|
// ).then((res) => { |
|
|
|
// close(); |
|
|
|
// }) |
|
|
|
if(nodesAll){ |
|
|
|
dispatch( |
|
|
|
offline.postStatusCustom({ |
|
|
|
statusId:codeIdList, |
|
|
|
paraphrase:notesValue |
|
|
|
}) |
|
|
|
).then((res) => { |
|
|
|
close(); |
|
|
|
}) |
|
|
|
} |
|
|
|
else{ |
|
|
|
dispatch( |
|
|
|
offline.postStatusCustom({ |
|
|
|
statusId:[rowId], |
|
|
|
paraphrase:notesValue |
|
|
|
}) |
|
|
|
).then((res) => { |
|
|
|
close(); |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
function handleCancel () { |
|
|
|
close(); |
|
|
|
//点击弹框取消 左边按钮 |
|
|
|
} |
|
|
|
function onChange(value){ |
|
|
|
console.log('value',value); |
|
|
|
function onChange(value){//输入自定义释义 |
|
|
|
if(value!==''){ |
|
|
|
setNotesValue(value) |
|
|
|
} |
|
|
|
else{ |
|
|
|
setNotesValue(null) |
|
|
|
} |
|
|
|
} |
|
|
|
function onSelect(value){//选择状态码 |
|
|
|
setcodeIdList(value) |
|
|
|
} |
|
|
|
function oneSelect(value){//切换平台 |
|
|
|
setPlatform(value) |
|
|
|
} |
|
|
|
return ( |
|
|
|
<> |
|
|
|
<Modal |
|
|
|
@ -48,26 +85,43 @@ function programmeModal (props) { |
|
|
|
width={607} |
|
|
|
onCancel={handleCancel} |
|
|
|
> |
|
|
|
{/* <div style={{margin:"17px 56px 18px 31px"}}> |
|
|
|
<div style={{color:'rgba(0, 0, 0, 0.65)',}}> |
|
|
|
解决方案设置： |
|
|
|
{nodesAll?( |
|
|
|
<div style={{margin:"17px 32px 28px 32px"}}> |
|
|
|
<div style={{display: 'flex',alignItems: 'center'}}> |
|
|
|
<div style={{width:84,textAlign:'right',color: 'rgba(0,0,0,0.65)'}}>状态码：</div> |
|
|
|
<div> |
|
|
|
<Select defaultValue='yingshi' onChange={oneSelect} style={{ width: 108 }}> |
|
|
|
<Select.Option value='yingshi'>萤石云</Select.Option> |
|
|
|
<Select.Option value='gb'>国标摄像头</Select.Option> |
|
|
|
</Select> |
|
|
|
</div> |
|
|
|
<div style={{color:'rgba(0, 0, 0, 0.45)',fontSize:12,marginTop:4}}> |
|
|
|
敲击回车键后，输入内容将成为标签 |
|
|
|
<div style={{marginLeft:12}}> |
|
|
|
<Select filter multiple style={{ width: 300 }} onChange={onSelect} placeholder='请选择状态码' maxTagCount={1} autoClearSearchValue={false}> |
|
|
|
{codeList.map((item) => { |
|
|
|
return( |
|
|
|
item.platform==platform ? ( |
|
|
|
<Select.Option key={item.id} value={item.id}> |
|
|
|
{item.status} |
|
|
|
</Select.Option> |
|
|
|
) : ( |
|
|
|
"" |
|
|
|
) |
|
|
|
) |
|
|
|
})} |
|
|
|
</Select> |
|
|
|
</div> |
|
|
|
<div style={{marginTop:10}}> |
|
|
|
<TagInput |
|
|
|
defaultValue={['设备是否接触良好','刷新重试，检测设备网络，重启设备']} |
|
|
|
placeholder='请输入解决方案' |
|
|
|
size='large' |
|
|
|
</div> |
|
|
|
<div style={{display: 'flex',alignItems: 'center',marginTop:21}}> |
|
|
|
<div style={{width:84,textAlign:'right',color: 'rgba(0,0,0,0.65)'}}>修改释义：</div> |
|
|
|
<div style={{width:'100%'}}><Input |
|
|
|
style={{width:'100%'}} |
|
|
|
value={notesValue} |
|
|
|
onChange={onChange} |
|
|
|
maxLength={18} |
|
|
|
onChange={v => console.log(v)} |
|
|
|
/> |
|
|
|
placeholder="请输入自定义释义" |
|
|
|
showClear> |
|
|
|
</Input></div> |
|
|
|
</div> |
|
|
|
</div> */} |
|
|
|
{nodesAll?( |
|
|
|
<div style={{margin:"17px 32px 28px 32px"}}> |
|
|
|
|
|
|
|
</div> |
|
|
|
):( |
|
|
|
<div style={{margin:"17px 32px 28px 32px"}}> |
|
|
|
@ -84,12 +138,12 @@ function programmeModal (props) { |
|
|
|
</div> |
|
|
|
)} |
|
|
|
<div style={{display:'flex',margin:'0px 20px',alignItems: 'center',justifyContent: 'space-between'}}> |
|
|
|
<div> |
|
|
|
<img |
|
|
|
src="/assets/images/background/codeBefore.png" |
|
|
|
alt="设置" |
|
|
|
style={{ width: 240, height: 146 }} |
|
|
|
/> |
|
|
|
<div style={{display:'flex',justifyContent: 'center', |
|
|
|
alignItems:'center', width: 240, height: 146 , |
|
|
|
background: "url(/assets/images/background/codeBefore.png)",backgroundSize: "100% 100%",}}> |
|
|
|
<div style={{color: 'rgba(255,255,255,0.8)',textShadow: '0px 1px 1px rgba(0,0,0,0)',textAlign: 'center',width: 130}}> |
|
|
|
{tableNews.paraphrase||'初始化释义'} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<img |
|
|
|
@ -98,12 +152,12 @@ function programmeModal (props) { |
|
|
|
style={{ width: 18, height: 15 }} |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<img |
|
|
|
src="/assets/images/background/codeAfter.png" |
|
|
|
alt="设置" |
|
|
|
style={{ width: 240, height: 146 }} |
|
|
|
/> |
|
|
|
<div style={{ display:'flex',justifyContent: 'center', |
|
|
|
alignItems:'center', width: 240, height: 146 , |
|
|
|
background: "url(/assets/images/background/codeAfter.png)",backgroundSize: "100% 100%",}}> |
|
|
|
<div style={{color: 'rgba(255,255,255,1)',textShadow: '0px 1px 1px #001969',textAlign: 'center',width: 130}}> |
|
|
|
{notesValue} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</Modal> |
|
|
|
|
deartibers
3 years ago