register.js 注册文件
ecodeSDK.rewriteRouteQueue.push({
fn: (params) => {
const {Com, Route, nextState} = params
const cpParams = {
path: 'main/cs/app', // 路由地址,不可变更
appId: '${appId}',
name: 'index', // 具体页面应用模块名称
node: 'app', // 渲染的路由节点,这里渲染的是 app 这个节点
Route,
nextState
}
if (ecodeSDK.checkPath(cpParams)) { // 判断地址是否是要注入的地址
// 异步加载应用 ${cpParams.appId} 下的模块 ${cpParams.name}
return ecodeSDK.getAsyncCom({
appId: cpParams.appId,
name: cpParams.name, // 模块名称
props: params, // 参数
isPage: true, // 是否是路由页面
noCss: true // 是否禁止单独加载css,通常为了减少css数量,css默认前置加载
});
}
return null // 这里一定要返回空,不然会干扰到其它新页面
},
order: 10,
desc: '绩效管理-发起季度月度绩效考核流程'
})
index.js,入口文件
/**
* 门户主页访问:/wui/index.html#/main/cs/app/14b2647ea40742828bdffb8345cab39a_index
* 单独访问:/spa/custom/static/index.html#/main/cs/app/14b2647ea40742828bdffb8345cab39a_index
*/
const { WeaBrowser, WeaFormItem, WeaRangePicker, WeaSelect, WeaTableEdit} = ecCom
const { Button, message } = antd
class Index extends React.Component {
constructor(props) {
super(props)
this.state = {
datas: [], // 人员列表数据
khqj: [] // 考核期间
}
// 人员列表列信息
// 注:com 中必须写 key,需与 dataIndex 相同,否则更新表格数据会有问题
this.columns = [
{title: '序号', dataIndex: 'seq', com: [{type: 'custom', key: 'seq', render: (text) => (<div>{text}</div>)}]},
{title: '部门名称', dataIndex: 'deptname', com: [{type: 'custom', key: 'deptname', render: (text) => (<div>{text}</div>)}]},
{title: '姓名', dataIndex: 'lastname', com: [{type: 'custom', key: 'lastname', render: (text) => (<div>{text}</div>)}]},
{title: '工号', dataIndex: 'workcode', com: [{type: 'custom', key: 'workcode', render: (text) => (<div>{text}</div>)}]},
{title: '操作', dataIndex: 'custom', com: [{type: 'custom', key: 'custom',
render: (text, record, index) => (
<Button type="primary" onClick={() => {this.clickEvent_delRow(text, record, index)}}>删除</Button>)}
]}
]
this.browserParams = {isSingle: false} // 被考核人浏览框
this.options_nd = [ // 年度选项
{key: "2020", selected: true, showname: "2020"}
]
this.options_sjzq = [ // 时间周期选项
{key: "S", showname: "季度"},
{key: "M", showname: "月度"}
]
}
callback_empInfos(resp) { // 处理服务器返回来的数据
for (i = 0; i < resp.length; i++) {
resp[i]['seq'] = i + 1
}
// 更新人员列表
this.setState({
datas: resp
})
}
clickEvent_create() { // 单件事件_创建季度/月度绩效考核
const nd = $('#nd').val()
const sjzq = $('#sjzq').val()
if (!this.common_checkInput(nd, '请选择年度!')) return
if (!this.common_checkInput(sjzq, '请选择时间周期!')) return
if (!this.common_checkInput(this.state.khqj, '请选择考核期间!')) return
if (!this.common_checkInput(this.state.khqj[0], '请选择考核期间!')) return
if (!this.common_checkInput(this.state.khqj[1], '请选择考核期间!')) return
if (!this.common_checkInput(this.state.datas, '请选择被考核对象!')) return
// TODO 做自己想做的事情
console.log(nd, sjzq, this.state.khqj, this.state.datas)
}
clickEvent_delRow(text, record, index) { // 单击事件_在列表行中点删除
console.log(text, record, index)
const {datas} = this.state
datas.splice(index, 1)
this.setState({datas: datas})
}
changeEvent_khqj(khqj) { // 更新受控组件_考核期间
this.setState({khqj: khqj})
}
changeEvent_bkhdx(ids, names, datas) { // 更新事件_被考核人
// 此处需要修改为从服务器获取数据
const resp = [
{workcode: "M001234", deptid: "897", id: "4318", lastname: "吕布", deptname: "IT与信息安全部"},
{workcode: "M001234", deptid: "897", id: "4318", lastname: "赵云", deptname: "IT与信息安全部"},
{workcode: "M001234", deptid: "897", id: "4318", lastname: "典韦", deptname: "IT与信息安全部"},
{workcode: "M001234", deptid: "897", id: "4318", lastname: "关羽", deptname: "IT与信息安全部"},
]
this.callback_empInfos(resp)
}
changeEvent_table(datas) { // 更新事件_人员列表
this.setState({ datas })
}
common_checkInput(val, msg) { // 公共逻辑_检查输入
if (val === undefined || val + '' === '') {
message.info(msg)
return false
}
const jsonStr = JSON.stringify(val)
if (['{}', '[]'].indexOf(jsonStr) >= 0) {
message.info(msg)
return false
}
return true
}
render() {
return (
<div style={{width: '100%'}}>
<div style={{height: '56px', paddingLeft: '5px', paddingRight: '5px', paddingTop: '5px', paddingBottom: '5px'}}>
<WeaFormItem label="年度" ratio1to2="true" style={{width: '50%', float: 'left'}}>
<WeaSelect fieldName="nd" options={this.options_nd} style={{width: '70px'}}/>
</WeaFormItem>
<WeaFormItem label="时间周期" ratio1to2="true" style={{width: '50%', float: 'left'}}>
<WeaSelect fieldName="sjzq" options={this.options_sjzq} style={{width: '70px'}}/>
</WeaFormItem>
<WeaFormItem label="考核期间" ratio1to2="true" style={{width: '50%', float: 'left'}}>
<WeaRangePicker fieldName="khqj" style={{width: '220px'}} onChange={this.changeEvent_khqj.bind(this)}></WeaRangePicker>
</WeaFormItem>
<WeaFormItem label="被考核对象" ratio1to2="true" style={{width: '50%', float: 'left'}}>
<WeaBrowser fieldName="bkhdx" type={17} {...this.browserParams} title="多人力资源" style={{width: '100%'}}
onChange={this.changeEvent_bkhdx.bind(this)} />
</WeaFormItem>
</div>
<div style={{textAlign: 'left'}}>
<WeaTableEdit
showTitle={false}
columns={this.columns}
datas={this.state.datas}
onChange={this.changeEvent_table.bind(this)}
/>
</div>
<div style={{textAlign: 'center', marginTop: '10px'}}>
<Button type="primary" onClick={this.clickEvent_create.bind(this)}>创建季度/月度绩效考核</Button>
</div>
</div>
)
}
}
ecodeSDK.setCom('${appId}', 'index', Index)