提交 d610672e authored 作者: 钟是志's avatar 钟是志

增加申请组件

上级 19e28f73
/**
* 徐立
* 2019年9月19日
* 事务发起提交多次弹框
*/
import React, {Component} from 'react'
import { getModal } from '@/webPublic/one_stop_public/utils/utils';
const Modal = getModal();
export default class AddModal extends Component {
constructor(props) {
super(props);
this.state = {
top: 0,
}
}
componentDidMount() {
setTimeout(() => {
let dom = document.getElementById('tabsTableFromIframe');
if (dom && dom.offsetHeight) {
let height = dom.offsetHeight;
if (height > 700) {
this.setState({
top: height - 700,
})
}
// console.log(height, 'Iframe页面的高度');
}
}, 1500);
}
render() {
let {visible, handleCancel, handleOk, loading} = this.props;
const { top } = this.state;
const style = {
};
if(top){
style.top = top;
}
return (
<Modal
title="提交申请"
visible={visible}
onOk={handleOk}
confirmLoading={loading}
onCancel={handleCancel}
width={400}
style={style}
>
<p style={{width: '100%', textAlign: 'center', fontSize: 14, color: '#666666'}}>确定要提交申请吗?</p>
</Modal>
)
}
}
/*表单样式*/
.form{
padding: 60px 0;
width: 100%;
padding-top: 0px;
text-align: center;
.form_input{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
.form_span{
float: right;
margin-bottom: 24px;
margin-right: 15px;
color: #666666;
font-size: 14px;
}
.icon_div{
margin-left: -117px;
}
}
.form_people{
width: 100%;
display: flex;
justify-content: center;
span{
float: right;
margin-bottom: 24px;
margin-right: 19px;
color: #666666;
font-size: 14px;
}
.form_people_div{
margin-left: -10px;
>div{
margin-top: -12px;
width: 380px;
height: 100%;
display: flex;
flex-wrap: wrap;
}
.add_people_add_img{
margin-top: 12px;
width: 20%;
height: 68px;
text-align: center;
img{
width: 36px;
height: 36px;
}
}
}
}
}
/*添加任务list组件样式*/
.list_div{
height: 89px;
width: 25%;
margin-top: 12px;
display: flex;
text-align: center;
>div:nth-child(1){
>div{
width: 100%;
height: 36px;
position: relative;
img{
width: 36px;
height: 100%;
}
.img_remove{
width: 12px;
height: 12px;
position: absolute;
right: 12px;
top:0px;
}
}
>p:nth-child(2){
font-size: 12px;
color: #333333;
font-weight: 400;
}
>p:nth-child(3){
font-size: 11px;
color: #cccccc;
font-weight: 400;
}
}
>div:nth-child(2){
margin:0 4px;
flex:1;
color:#cccccc;
}
}
.body_hea{
h3{
font-weight: bold;
color: #333333;
font-size: 16px;
margin-bottom: 28px;
text-align: left;
margin-left: 24px;
}
.hea_title{
font-size: 14px;
color: #666666;
margin-left: 41px;
width: 20%;
text-align: right;
display: inline-block;
}
.hew_content{
color: #333333;
font-size: 14px;
margin-left: 23px;
}
/*事项理由样式*/
.title{
text-align: right;
font-size: 14px;
color: #666666;
}
.body{
padding-left:24px;
color: #333333;
font-size: 14px;
}
/*附件样式*/
.file{
margin-bottom: 16px;
img{
width: 14px;
height: 16px;
margin-right: 9px;
margin-top: -5px;
}
}
.row{
margin-bottom: 28px;
}
}
.header{
width: 100%;
text-align: center;
font-size: 20px;
font-weight: bold;
color: #333333;
padding: 32px 0 32px 0;
}
\ No newline at end of file
/**
钟是志
学工里面的流程申请页面不再使用iframe
2022年5月26日 13:41:08
* */
import React from 'react';
import classNames from 'classnames/bind';
import { connect } from 'dva';
import SponsorForm from './SponsorForm/index';
import { isJSON } from '@/webPublic/one_stop_public/copy';
import { getUrlInfo } from '@/webPublic/one_stop_public/DetailForAudit/utils';
import { setToken } from '@/webPublic/one_stop_public/utils/token';
const names = classNames.bind(require('./style.less'));
/**
* props:{
* id, // 流程id
init, // 表单的初始化数据 用于发起时传入默认值 需要转码 详见 constructor
noNeedApply, // 不需要申请提交按钮
noNeedTitle, // 不需要标题
* }
* */
@connect(({
affair,
modileHome,
}) => ({
affair,
modileHome,
}))
export default class IframeForApply extends React.Component {
constructor(props) {
super(props);
const { token } = getUrlInfo();
if (token) {
setToken(token);
}
const {
id,
init,
noNeedApply,
noNeedTitle,
} = props;
this.state = {
id, // 传入id
init: init && isJSON(init) ? JSON.parse(decodeURIComponent(init)) : undefined,
value: '', // 紧急度选择
btnList: [], // 紧急度按钮返回数据
noNeedApply,
noNeedTitle,
};
this.nodeChild = null;
}
componentDidMount() {
this.props.dispatch({
type: 'urge/GetMyBtn',
payload: {},
callback: val => {
this.setState({
btnList: val,
value: val[val.length - 1].id,
});
},
});
// document.getElementById('root').style.backgroundColor = '#fff';
}
onChange = e => {
this.setState({
value: e.target.value,
});
};
setRadio = value => {
this.setState({
value,
});
};
render() {
const {
id,
value,
init,
noNeedApply,
noNeedTitle,
} = this.state;
const { modileHome } = this.props;
return (
<div
className={names('warp IframeDiy')}
id='tabsTableFromIframe'
style={{
overflowY: 'auto',
height: '100%',
}}
>
{!noNeedTitle && (
<h1 style={{
fontWeight: 'bold',
textAlign: 'center',
}}>
{modileHome?.affair?.name ? modileHome?.affair.name : modileHome?.affair?.appName}
</h1>
)}
<div className={names('content-container')}>
<div style={{ padding: '0 24px 24px' }}>
<div style={{ minHeight: 569 }}>
<SponsorForm
id={id}
setRadio={this.setRadio}
radioValue={value}
noNeedApplyButton={noNeedApply}
init={init} // 表单的初始化数据 用于发起时传入默认值
history={{
...this.props.history,
location: {
...this.props.history.location,
state: {
id,
noNeedCaoGao: true,
app: {},
},
},
}}
/>
</div>
</div>
</div>
</div>
);
}
}
.warp {
padding: 0 24px 60px;
.breadcrumb-row {
padding: 16px 0;
& > div {
display: inline;
}
}
.content-container {
width: 1200px;
margin: 0 auto;
background: #ffffff;
.top-border{
height: 4px;
background: @primary-color;
}
h1{
text-align: center;
font-size: 20px;
line-height: 108px;
}
}
}
.top-radio-div{
position: relative;
.radio-check{
position: absolute;
left:20px;
top:76%;
}
}
.content {
height: 400px;
margin: 130px 24px 24px 24px;
div{
text-align: center;
img{
margin: 0 30px 0 0;
}
}
>.fostSizeP{
text-align: center;
width: 100%;
font-size: 16px;
font-weight: bold;
color: #666666;
}
}
.IframeDiy{
:global(.antd-pro-pages-portal-pages-sponsor-style-content-container) {
width: 100% !important;
}
}
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论