|
|
|
@ -7,21 +7,34 @@ function remarksModal (props) { |
|
|
|
const { |
|
|
|
close, |
|
|
|
visible, |
|
|
|
rowId, |
|
|
|
dispatch, |
|
|
|
actions |
|
|
|
} = props; |
|
|
|
const { equipmentWarehouse } = actions; |
|
|
|
const [ScrollList, setScrollList] = useState([{num:'01',value:''},{num:'02',value:''},{num:'03',value:''}]); //显示 |
|
|
|
const [showScrollList, setShowScrollList] = useState([]); //显示 |
|
|
|
const [roll,setroll] = useState(false); |
|
|
|
const [showValueNum,setShowValueNum] = useState(0); |
|
|
|
const valueNum = useRef(0); |
|
|
|
|
|
|
|
// useEffect(() => { |
|
|
|
// setShowScrollList([ |
|
|
|
// '周杰伦7月6日出专辑，请大家多多捧场备注', |
|
|
|
// '111111111111111111111111111111111111111111111111111111' |
|
|
|
// ]) |
|
|
|
// }, []); |
|
|
|
|
|
|
|
const [videoObj, setVideoObj] = useState(); //播放条件 |
|
|
|
useEffect(() => { |
|
|
|
setVideoObj({ |
|
|
|
type: 'remarks', |
|
|
|
// serialNo: row.serialNo, |
|
|
|
// yingshiToken: row.secretYingshi?.token, |
|
|
|
// playUrlSd: row.gbCamera?.playUrl?.liveUrl?.sd?.ezopen, |
|
|
|
// playUrlHd: row.gbCamera?.playUrl?.liveUrl?.hd?.ezopen, |
|
|
|
}) |
|
|
|
}, []); |
|
|
|
function handleOk () { |
|
|
|
//点击弹框确定 右边按钮 |
|
|
|
close(); |
|
|
|
dispatch( |
|
|
|
equipmentWarehouse.postCameraRemark({ |
|
|
|
cameraId:rowId, |
|
|
|
remark:showScrollList |
|
|
|
}) |
|
|
|
).then((res) => { |
|
|
|
close(); |
|
|
|
}) |
|
|
|
} |
|
|
|
function handleAfterClose () { |
|
|
|
//在关闭之后 |
|
|
|
@ -30,6 +43,34 @@ function remarksModal (props) { |
|
|
|
close(); |
|
|
|
//点击弹框取消 左边按钮 |
|
|
|
} |
|
|
|
function onChange(value,num){ |
|
|
|
valueNum.current=0 |
|
|
|
let myScrollList=ScrollList |
|
|
|
myScrollList[num].value=value |
|
|
|
setScrollList(myScrollList); |
|
|
|
setShowScrollList([value]) |
|
|
|
for (let index = 0; index < myScrollList.length; index++) { |
|
|
|
if(myScrollList[index].value){ |
|
|
|
valueNum.current=valueNum.current+1 |
|
|
|
} |
|
|
|
} |
|
|
|
setShowValueNum(valueNum.current); |
|
|
|
} |
|
|
|
function onFocus(num){ |
|
|
|
setShowScrollList([ScrollList[num].value]) |
|
|
|
setroll(true) |
|
|
|
} |
|
|
|
function onBlur(){ |
|
|
|
setShowScrollList([]) |
|
|
|
let myScrollList = [] |
|
|
|
for (let index = 0; index < ScrollList.length; index++) { |
|
|
|
if(ScrollList[index].value){ |
|
|
|
myScrollList.push(ScrollList[index].value) |
|
|
|
} |
|
|
|
} |
|
|
|
setShowScrollList(myScrollList) |
|
|
|
setroll(false) |
|
|
|
} |
|
|
|
return ( |
|
|
|
<> |
|
|
|
<Modal |
|
|
|
@ -46,31 +87,36 @@ function remarksModal (props) { |
|
|
|
<div style={{width:394}}> |
|
|
|
<div style={{display:'flex'}}> |
|
|
|
<div style={{color:'#1859C1',fontWeight: 600}}>请添加备注信息</div> |
|
|
|
<div>（3/3）</div> |
|
|
|
</div> |
|
|
|
<div style={{marginTop:20}}> |
|
|
|
<Input prefix={<div style={{color: 'rgba(0, 0, 0, 0.75)',margin:'0px 12px'}}>01</div>} showClear></Input> |
|
|
|
<div>（{showValueNum}/3）</div> |
|
|
|
</div> |
|
|
|
<div style={{marginTop:12}}> |
|
|
|
<Input prefix={<div style={{color: 'rgba(0, 0, 0, 0.75)',margin:'0px 12px'}}>02</div>} showClear></Input> |
|
|
|
</div> |
|
|
|
<div style={{marginTop:12}}> |
|
|
|
<Input prefix={<div style={{color: 'rgba(0, 0, 0, 0.75)',margin:'0px 12px'}}>03</div>} showClear></Input> |
|
|
|
<div style={{marginTop:8}}> |
|
|
|
{ScrollList.map((item, index) => ( |
|
|
|
<div key={index} style={{marginTop:12}}> |
|
|
|
<Input |
|
|
|
prefix={<div style={{color: 'rgba(0, 0, 0, 0.75)',margin:'0px 12px'}}>{item.num}</div>} |
|
|
|
value={item.value} |
|
|
|
onChange={(value)=>onChange(value,index)} |
|
|
|
onFocus={()=>onFocus(index)} |
|
|
|
onBlur={onBlur} |
|
|
|
maxLength={25} |
|
|
|
showClear></Input> |
|
|
|
</div> |
|
|
|
))} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{width:306,marginLeft:20,position: ""}}> |
|
|
|
<div style={{ paddingRight: 12,position: "absolute",width: 306,color:'#F9F9F9',background:'rgba(24, 89, 193, 0.8)' }}> |
|
|
|
<TextScroll content={['周杰伦7月6日出专辑，请大家多多捧场备注周杰伦7月6日出专辑，请大家多多捧场备注，请大家多多捧场备注','assdasdasdasdss']} duration={6} /> |
|
|
|
</div> |
|
|
|
<video |
|
|
|
id="cameraBanner" |
|
|
|
autoPlay |
|
|
|
loop |
|
|
|
muted |
|
|
|
style={{ width: 306,height:185, objectFit: "cover", }} |
|
|
|
src="/assets/video/remarks.mp4" |
|
|
|
type="video/mp4" |
|
|
|
/> |
|
|
|
<div style={{ position: "absolute",background:'rgba(0, 0, 0, 0.15)',width:306}}> |
|
|
|
<TextScroll content={showScrollList} roll={roll} duration={6} /> |
|
|
|
</div> |
|
|
|
<video |
|
|
|
id="cameraBanner" |
|
|
|
autoPlay |
|
|
|
loop |
|
|
|
muted |
|
|
|
style={{ width: 306,height:185, objectFit: "cover", }} |
|
|
|
src="/assets/video/remarks.mp4" |
|
|
|
type="video/mp4" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</Modal> |
|
|
|
|
deartibers
2 years ago