22 changed files with 439 additions and 49 deletions
@ -0,0 +1,52 @@ |
|||
/* eslint-disable*/ |
|||
'use strict'; |
|||
|
|||
module.exports = dc => { |
|||
const DataTypes = dc.ORM; |
|||
const sequelize = dc.orm; |
|||
const CameraRemark = sequelize.define("cameraRemark", { |
|||
id: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
defaultValue: null, |
|||
comment: null, |
|||
primaryKey: true, |
|||
field: "id", |
|||
autoIncrement: true, |
|||
unique: "camera_remark_id_uindex" |
|||
}, |
|||
cameraId: { |
|||
type: DataTypes.INTEGER, |
|||
allowNull: false, |
|||
defaultValue: null, |
|||
comment: null, |
|||
primaryKey: false, |
|||
field: "camera_id", |
|||
autoIncrement: false, |
|||
references: { |
|||
key: "id", |
|||
model: "camera" |
|||
} |
|||
}, |
|||
remark: { |
|||
type: DataTypes.STRING, |
|||
allowNull: false, |
|||
defaultValue: null, |
|||
comment: null, |
|||
primaryKey: false, |
|||
field: "remark", |
|||
autoIncrement: false |
|||
} |
|||
}, { |
|||
tableName: "camera_remark", |
|||
comment: "", |
|||
indexes: [] |
|||
}); |
|||
dc.models.CameraRemark = CameraRemark; |
|||
|
|||
const Camera = dc.models.Camera; |
|||
CameraRemark.belongsTo(Camera, { foreignKey: 'cameraId', targetKey: 'id' }); |
|||
Camera.hasMany(CameraRemark, { foreignKey: 'cameraId', sourceKey: 'id' }); |
|||
|
|||
return CameraRemark; |
|||
}; |
|||
Binary file not shown.
@ -0,0 +1,137 @@ |
|||
import React, { useState, useRef, useEffect } from "react"; |
|||
import { connect } from "react-redux"; |
|||
import { Modal, Spin,Input } from "@douyinfe/semi-ui"; |
|||
import TextScroll from "../../../components/textScroll"; |
|||
|
|||
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' |
|||
// ]) |
|||
// }, []); |
|||
|
|||
function handleOk () { |
|||
//点击弹框确定 右边按钮 |
|||
dispatch( |
|||
equipmentWarehouse.postCameraRemark({ |
|||
cameraId:rowId, |
|||
remark:showScrollList |
|||
}) |
|||
).then((res) => { |
|||
close(); |
|||
}) |
|||
} |
|||
function handleAfterClose () { |
|||
//在关闭之后 |
|||
} |
|||
function handleCancel () { |
|||
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 |
|||
title="备注管理" |
|||
okText="确定" |
|||
cancelText="取消" |
|||
visible={visible} |
|||
onOk={handleOk} |
|||
width={763} |
|||
afterClose={handleAfterClose} |
|||
onCancel={handleCancel} |
|||
> |
|||
<div style={{margin:"2px 14px 18px 29px",display:'flex'}}> |
|||
<div style={{width:394}}> |
|||
<div style={{display:'flex'}}> |
|||
<div style={{color:'#1859C1',fontWeight: 600}}>请添加备注信息</div> |
|||
<div>（{showValueNum}/3）</div> |
|||
</div> |
|||
<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={{ 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> |
|||
</> |
|||
); |
|||
} |
|||
function mapStateToProps (state) { |
|||
const { auth, global, members, CameraKind, CameraAbility } = state; |
|||
return { |
|||
loading: members.isRequesting, |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
CameraKind: CameraKind.data || [], |
|||
CameraAbility: CameraAbility.data || [], |
|||
}; |
|||
} |
|||
|
|||
export default connect(mapStateToProps)(remarksModal); |
|||
Loading…
Reference in new issue