Skip to content

W
WebPublic
提交 5e75fe20 authored 作者: 钟是志's avatar 钟是志
浏览文件
操作

将流程详情页面搬入iframe

上级 d7644a83
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 1112 行增加 和 0 行删除
one_stop_public/DetailForAudit/ChildTaskModel.jsx 0 → 100644
浏览文件 @ 5e75fe20
/**
* @file 加签人列表展示
*/
import React, { Component } from 'react';
import styles from './styles.less';
import { Tag } from 'antd';
export default class ChildTaskModel extends Component {
constructor(props) {
super(props);
this.state = {
isShow: false,
};
}
/**
* @function 加签展开状态
* @event click
*/
onStatusClick = () => {
this.setState({
isShow: !this.state.isShow,
});
};
render() {
const { isShow } = this.state;
const { data } = this.props;
return (
<>
<div className={styles.title_div}>
<span className={styles.left_title_span}>加签人:</span>
<a onClick={this.onStatusClick} className={styles.right_title_span}>
{isShow ? '收起' : '展开'}
</a>
</div>
{isShow && data && Array.isArray(data) ? (
<div className={styles.ani_div}>
{data.map((item, index) => {
return (
<div className={styles.card_div} key={index}>
<div>
加签人: <Tag color="#f50">{item.assignee}</Tag>
</div>
<div>审批状态: {item.status}</div>
{item.taskVariable && item.taskVariable.reason && (
<div>审批原因: {item.taskVariable.reason}</div>
)}
</div>
);
})}
</div>
) : null}
</>
);
}
}
one_stop_public/DetailForAudit/DetailSplit.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/DetailForAudit/IframeForDetail.js 0 → 100644
浏览文件 @ 5e75fe20
/**
* 钟是志
* 2019年12月11日 17:30:41
* 查看详情页面的iframe嵌套到中医大里面
*/
import React, {Component} from 'react';
import { setToken } from '@/webPublic/one_stop_public/utils/token';
import {getUrlInfo} from './utils';
import DetailSplit from './DetailSplit';
import styles from './styles.less';
import {getOneStopConfigList} from '@/webPublic/one_stop_public/publicServices';
export default class GetDetail extends Component {
constructor(props) {
super(props);
const token = getUrlInfo().token;
if(token && token.length > 10){
setToken(token);
}
getOneStopConfigList();
this.state = {
id: getUrlInfo().id || props.id,
};
}
componentDidMount() {
}
/***
* 需要加入跳转功能;
* 钟是志
* 在iframe中打开时 直接返回一个postMessage;
* */
render() {
const {id} = this.state;
let {location} = this.props.history;
location = {
...location,
state: {
id,
fromIframe: true,
},
};
return (
<div className={styles.detail_div}
id={'detailInfoDiv'}
style={{
backgroundColor: '#FFFFFF',
// overflow: isFromIframe() ? 'hidden' : 'unset',
overflow: 'auto',
height: '100%',
}}
>
<DetailSplit history={{...this.props.history, location}}
showPrint={getUrlInfo().showPrint === 'true'}
/>
</div>
);
}
}
one_stop_public/DetailForAudit/components/Card/index.jsx 0 → 100644
浏览文件 @ 5e75fe20
/**
* 徐立
* 2019年9月19日
* 查看详情底层模板，内容不做添加
*/
import React, { Component } from 'react'
import styles from './index.less'
export default class Card extends Component {
render() {
return (
<div className={styles.div}>
<div className={styles.card}>
{this.props.children}
</div>
</div>
)
}
}
one_stop_public/DetailForAudit/components/Card/index.less 0 → 100644
浏览文件 @ 5e75fe20
.div{
.card{
position: relative;
left: 50%;
transform: translateX(-50%);
width: 1200px;
min-height: 319px;
margin-bottom: 16px;
padding:36px 35px 24px 24px;
background-color: #fff;
border-top: 4px solid #0F91FF;
}
}
\ No newline at end of file
one_stop_public/DetailForAudit/components/Countersign/index.jsx 0 → 100644
浏览文件 @ 5e75fe20
/**
* @file 加签功能
*/
import React, { Component } from 'react';
import { Modal, Input, Table, Row, Col, Tooltip, Spin, Tag } from 'antd';
import styles from './style.less';
import { openToast } from '../Notification';
import { connect } from 'dva';
const { Search } = Input;
@connect()
export default class Countersign extends Component {
constructor(props) {
super(props);
this.state = {
data: [], // 表格参数
textAreaValue: '', // 用户转发理由
current: 1, // 当前页数
pageSize: 10, // 每页条数
total: 0, // 数据总数
realname: '', // 姓名输入框输入值
username: '', // 账号输入框输入值
isLoading: false, // 请求状态
visible: false,
selectUserData: [],
btnLoading: false, // 提交状态
};
this.columns = [
{
title: '用户名',
fixed: 'left',
dataIndex: 'realname',
width: 170,
},
{
title: '工号',
dataIndex: 'stuNo',
width: 170,
},
{
title: '邮箱',
dataIndex: 'email',
width: 200,
render: text => {
return (
<Tooltip title={text}>
<div className={styles.table_post_name}>{text}</div>
</Tooltip>
);
},
},
{
title: '职位',
dataIndex: 'mainPostName',
render: text => {
return (
<Tooltip title={text}>
<div className={styles.table_post_name}>{text}</div>
</Tooltip>
);
},
},
{
title: '操作',
key: '操作',
fixed: 'right',
render: record => {
return (
<a
onClick={() => {
this.addUserSelect(record);
}}
>
选择
</a>
);
},
},
];
}
componentDidMount() {
this.props.updateCountersignModal(this.showModal);
this.setState(
{
isLoading: true,
},
() => {
this.getInit();
},
);
}
/**
* @function 进行用户添加
* @event click
*/
addUserSelect = val => {
const { selectUserData } = this.state;
let array = selectUserData.filter(item => item.id === val.id);
if (array.length > 0) {
openToast('warning', '请勿重复添加用户');
return;
}
let ary = [
...selectUserData,
{
id: val.id,
name: val.realname,
},
];
this.setState({
selectUserData: ary,
});
};
/**
* @function 进行用户删除
* @param { string } id 需要删除的ID
*/
removeUserSelect = id => {
const { selectUserData } = this.state;
let ary = selectUserData.filter(item => item.id !== id);
this.setState({
selectUserData: ary,
});
};
getInit = async () => {
const {
dispatch,
data: {
addSignSql,
id,
},
} = this.props;
// 用户名列表
this.getData();
await this.setState({
isLoading: false,
});
};
getData = async (params = {
pageNo: 1,
pageSize: 5,
}) => {
const {
dispatch,
data,
} = this.props;
await dispatch({
type: 'uaa_User/fetch',
payload: {
...params,
},
callback: val => {
this.setState({
data: val.rows,
current: val.pageNo,
total: val.totalPage,
pageSize: val.pageSize,
});
},
});
};
userPaginationChange = value => {
const { dispatch } = this.props;
const {
realname,
username,
} = this.state;
this.getData({
pageNo: value,
pageSize: 5,
realname,
username,
});
};
/**
* 根据名字查询
* @param { string } value 用户输入值
*/
searchNameChange = value => {
const { dispatch } = this.props;
this.getData({
realname: value,
pageNo: 1,
pageSize: 5,
});
};
/**
* 名字输入事件
* @param { stirng } e 用户输入事件
*/
onNameChange = e => {
this.setState({
realname: e.target.value,
username: '',
});
};
/**
* 根据账号查询
* @param { stirng } value 用户输入值
*/
serachStuNoChange = value => {
const { dispatch } = this.props;
this.setState({
username: value,
});
this.getData({
username: value,
pageNo: 1,
pageSize: 5,
});
};
/**
* 账号输入数据
* @param { stirng } e 用户输入事件
*/
onStuNoChange = e => {
this.setState({
username: e.target.value,
realname: '',
});
};
showModal = () => {
this.setState({
visible: true,
});
};
handleOk = e => {
const { selectUserData } = this.state;
const { dispatch } = this.props;
let ary = [];
selectUserData.map(item => {
ary.push(item.id);
});
if (ary.length === 0) {
openToast('info', '并未选择加签用户,请选择');
return;
}
this.setState(
{
btnLoading: true,
},
() => {
dispatch({
type: 'countersign/countersignHandle',
payload: {
taskId: this.props.taskId,
userIds: ary,
},
callback: () => {
openToast('success', '加签成功');
this.props.getInit();
this.setState({
visible: false,
btnLoading: false,
});
},
});
},
);
};
handleCancel = e => {
this.setState({
visible: false,
});
};
render() {
const {
data,
current,
total,
pageSize,
realname,
username,
isLoading,
selectUserData,
btnLoading,
} = this.state;
let allWidth = 0;
// 计算滑动总长度
if (Array.isArray(this.columns)) {
this.columns.map((item, index) => {
if (this.columns.length - 1 === index) {
// 为最后一个元素时跳过
allWidth += 270; // 自适应200宽度
return item;
}
if (item.width) {
// 存在默认宽度
allWidth += item.width;
} else {
// 不存在
allWidth += 170;
}
return item;
});
}
return (
<Modal
title='加签'
visible={this.state.visible}
onOk={this.handleOk}
onCancel={this.handleCancel}
width={800}
confirmLoading={btnLoading}
destroyOnClose
>
{!isLoading ? (
<>
<Row>
<Col span={12}>
<Row>
<Col
span={4}
style={{
minHeight: 32,
textAlign: 'right',
lineHeight: '32px',
}}
>
姓名 &nbsp;
</Col>
<Col span={20}>
<Search
placeholder='姓名'
value={realname}
onSearch={this.searchNameChange}
onChange={this.onNameChange}
enterButton
/>
</Col>
</Row>
</Col>
<Col span={12}>
<Col
span={4}
style={{
minHeight: 32,
textAlign: 'right',
lineHeight: '32px',
}}
>
账号 &nbsp;
</Col>
<Col span={20}>
<Search
placeholder='账号'
value={username}
onSearch={this.serachStuNoChange}
onChange={this.onStuNoChange}
enterButton
/>
</Col>
</Col>
</Row>
<div id='trun_to_table' className={styles.trun_to_table_div}>
<Table
columns={this.columns}
dataSource={data}
scroll={{ x: allWidth }}
pagination={{
hideOnSinglePage: true,
pageSize,
total,
current,
onChange: this.userPaginationChange,
}}
/>
</div>
<div className={styles.title_name_div}>已选择加签人</div>
<div className={styles.tag_div}>
{selectUserData &&
Array.isArray(selectUserData) &&
selectUserData.length > 0 &&
selectUserData.map(item => {
return (
<Tag
color='#108ee9'
onClose={() => {
this.removeUserSelect(item.id);
}}
closable
key={item.id}
>
{item.name}
</Tag>
);
})}
</div>
</>
) : (
<div className={styles.spin_div}>
<Spin />
</div>
)}
</Modal>
);
}
}
one_stop_public/DetailForAudit/components/Countersign/style.less 0 → 100644
浏览文件 @ 5e75fe20
.table_post_name {
cursor: initial;
width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.trun_to_table_div {
margin-top: 12px;
}
.spin_div {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.title_name_div {
font-size: 16px;
font-weight: bold;
color: #333333;
}
.tag_div {
width: 100%;
min-height: 80px;
}
:global {
#trun_to_table .ant-table-thead tr th {
background-color: #fff;
}
}
one_stop_public/DetailForAudit/components/FlowExamineModal/Content.js 0 → 100644
浏览文件 @ 5e75fe20
import React from 'react';
import { Col, Row } from 'antd';
import classNames from 'classnames/bind';
import PortalFlowExamineModalImage from './Image';
import { connect } from 'dva';
import { queryApiActionPath } from '@/webPublic/one_stop_public/utils/queryConfig';
const names = classNames.bind(require('./style.less'));
const Body = ({
className,
...props
}) => <div className={names('body', className)} {...props} />;
@connect()
export default class PortalFlowExamineModalContent extends React.Component {
constructor() {
super();
this.state = {
data: {}, // 事务所有数据
arr: [], // 事务流程
};
}
render() {
let {
id,
affairId,
code,
} = this.props;
return (
<Row className={names('warp')}>
<Col span={24}>
<Body>
{id % 2 === 1 ? (
<PortalFlowExamineModalImage
appid={id}
code={code}
src={
!!affairId
? `${queryApiActionPath()}/UnifiedAppFormApi/getProcessImg?appId=${id}&id=${affairId}`
: `${queryApiActionPath()}/UnifiedAppFormApi/getProcessImg?appId=${id}`
}
/>
) : (
<PortalFlowExamineModalImage
appid={id}
code={code}
src={
!!affairId
? `${queryApiActionPath()}/UnifiedAppFormApi/getProcessImg?appId=${id}&id=${affairId}`
: `${queryApiActionPath()}/UnifiedAppFormApi/getProcessImg?appId=${id}`
}
/>
)}
</Body>
</Col>
</Row>
);
}
}
one_stop_public/DetailForAudit/components/FlowExamineModal/Image.js 0 → 100644
浏览文件 @ 5e75fe20
import React from 'react';
import Loading from '../loadThree';
import { Slider, Row, Col } from 'antd';
import { connect } from 'dva';
import classNames from 'classnames/bind';
const names = classNames.bind(require('./style.less'));
let width;
let sliNum = 0;
const GetEditor = () => {
const GgEditor = require('../ggEditor');
return GgEditor;
}
@connect()
export default class PortalFlowExamineModalImage extends React.Component {
state = {
visible: true,
slider: 0,
isImgLoading: true,
canvasIMg: '', // canvas转换的图片
configValue: false, // 配置信息
flowInfo: '', // 获取流程图的信息
};
handleCancel = () => this.setState({ visible: false });
handlePreview = () => {
// const {width} = this.img;
// this.setState({visible: true, width})
};
sliderChange = num => {
if (sliNum === 0) {
width = document.querySelector('.img').width;
// console.log(document.querySelector('.img').width)
}
sliNum++;
if (num == 0 && sliNum != 0) {
document.querySelector('.img').width = width;
return;
}
if (num > 0) {
document.querySelector('.img').width = width * `${1}.${num}`;
} else {
document.querySelector('.img').width = width * `${0}.${Math.abs(num + 10)}`;
}
};
getCanvasImg = imgSrc => {
this.setState(
{
canvasIMg: imgSrc,
},
() => {
this.setState({
visible: false,
});
},
);
};
componentDidMount = () => {
const { appid, code } = this.props;
this.props.dispatch({
// 获取配置信息
type: 'DataGgEditor/getNewProcessImg',
payload: {
appid,
code,
},
callback: val => {
this.setState({
flowInfo: val,
});
},
});
this.props.dispatch({
// 获取配置信息
type: 'emailorphone/GetLogo',
payload: {
configKeys: 'IsOldFlow',
},
callback: val => {
this.setState({
configValue: val[0].configValue == 'true',
});
},
});
};
onLoad = () => {
this.setState({
isImgLoading: false,
visible: false,
});
};
render() {
const { src, appid } = this.props;
const { visible, width, isImgLoading, canvasIMg, configValue, flowInfo } = this.state;
return (
<>
{configValue ? (
<div
className={names('image-warp')}
style={{ overflow: 'hidden', width: '1300px', height: '630px' }}
>
{flowInfo?.model?.id ? (
<>
<div
style={{
width: '100%',
height: '630px',
textAlign: 'center',
overflow: 'auto',
}}
>
<img onLoad={this.onLoad} src={canvasIMg}></img>
</div>
{flowInfo?.model?.id && isImgLoading ? (
<div
style={{
width: '1600px',
height: '670px',
visibility: 'hidden',
position: 'relative',
}}
>
<GetEditor
flowModelId={flowInfo.model.id}
taskKeys={flowInfo.taskKeys}
getCanvasImg={this.getCanvasImg}
isShow={false}
/>
</div>
) : null}
</>
) : (
<div style={{ marginTop: '350px' }}>
{' '}
<Loading />
</div>
)}
</div>
) : (
<div className={names('image-warp')}>
<Row>
<Col span={6} style={{ paddingLeft: 24, lineHeight: '36px' }}>
图片展示比例:
</Col>
<Col span={6}>
<Slider defaultValue={0} max={5} min={-5} onChange={this.sliderChange} />
</Col>
</Row>
<div
style={{
display: isImgLoading ? 'none' : 'block',
}}
>
<img
onLoad={this.onLoad}
className="img"
src={src}
style={{ overflow: 'auto', transition: 'all 0.5s', position: 'relative' }}
ref={node => (this.img = node)}
alt=""
onClick={this.handlePreview}
/>
</div>
{isImgLoading ? (
<div
style={{
width: '90%',
height: '610px',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
paddingLeft: '10%',
}}
>
<Loading />
</div>
) : null}
{/* <Modal
width={width >= 1200 ? 1200 : width}
wrapClassName={names("image-modal-warp")}
visible={visible} footer={null}
onCancel={this.handleCancel}
destroyOnClose
>
<img alt="example" style={{ width: '100%' }} src={src} />
</Modal> */}
</div>
)}
</>
);
}
}
one_stop_public/DetailForAudit/components/FlowExamineModal/index.js 0 → 100644
浏览文件 @ 5e75fe20
import React from 'react';
import { Modal } from 'antd';
import classNames from 'classnames/bind';
import PortalFlowExamineModalContent from './Content';
const names = classNames.bind(require('./style.less'));
export default class PortalFlowExamineModal extends React.Component {
state = { visible: false };
showModal = () => {
this.setState({ visible: true });
};
handleCancel = () => {
this.setState({ visible: false });
};
render() {
const { visible } = this.state;
const { isShow, id, affairId } = this.props;
const code = this.props?.code ? this.props?.code : '';
// console.log(this.props)
return (
<Modal
title="事务流程"
visible={visible}
onCancel={this.handleCancel}
footer={null}
width={1300}
wrapClassName={names('modal-warp')}
destroyOnClose
>
<PortalFlowExamineModalContent affairId={affairId} id={id} code={code} isShow={isShow} />
</Modal>
);
}
}
one_stop_public/DetailForAudit/components/FlowExamineModal/style.less 0 → 100644
浏览文件 @ 5e75fe20
.warp {
position: relative;
&:before {
display: block;
height: 100%;
width: 1px;
background: #e8e8e8;
position: absolute;
top: 0;
left: 50%;
}
.title {
font-weight: bold;
color: #333333;
margin-bottom: 16px;
}
.body {
max-width: 100%;
min-height: 480px;
overflow: auto;
background-color: #fff;
}
.step {
background: #F5F5F5;
padding: 16px 16px 16px 80px;
.step-title {
font-weight: normal;
.name {
color: #0F91FF;
}
.date {
font-size: 12px;
color: #999999;
display: inline-block;
float: right;
margin-top: 2px;
}
}
.description {
font-size: 12px;
line-height: 20px;
.date {
font-size: 12px;
color: #999999;
display: inline-block;
margin-top: 2px;
}
}
:global {
.ant-steps-item-content {
//width: unset;
}
.ant-steps-item-title {
display: block;
font-size: 14px;
}
.ant-steps-dot .ant-steps-item-icon {
width: 12px;
height: 12px;
}
.ant-steps-item-finish .ant-steps-item-icon > .ant-steps-icon .ant-steps-icon-dot {
background: -moz-linear-gradient(to right, #1C89E0 0%, #B53CED 100%);
background: -webkit-gradient(to right, #1C89E0 0%, #B53CED 100%);
background: -webkit-linear-gradient(to right, #1C89E0 0%, #B53CED 100%);
background: -o-linear-gradient(to right, #1C89E0 0%, #B53CED 100%);
background: -ms-linear-gradient(to right, #1C89E0 0%, #B53CED 100%);
background: linear-gradient(to left, #1C89E0 0%, #B53CED 100%);
}
.ant-steps-item-icon > .ant-steps-icon {
right: 2px;
}
}
}
}
.modal-warp {
:global {
.ant-modal-header {
background: #EAF5FF;
}
.ant-modal-body{
padding-left: 0;
padding-right: 0;
}
}
}
.image-warp{
text-align: center;
position: relative;
}
.image-modal-warp {
img {
max-width: 100%;
}
}
one_stop_public/DetailForAudit/components/Notification/index.tsx 0 → 100644
浏览文件 @ 5e75fe20
/**
* 徐立
* 2019年9月11日
* 通知提醒框二次封装
*/
import React from 'react'
import { notification,Modal } from 'antd';
/**
*
* @param {string} type 'success 成功 info 注意 warning 警告 error 错误'
* @param {string} title '提示标题'
* @param {string} content '主要内容'
* @param {string} placement '弹出位置 topLeft topRight bottomLeft bottomRight'
* @param {pbject} style '使用style 自定义弹出框样式
*/
export const openToast = (type:string,title:string,content:string,placement?:string,style?:object):void => {
notification[type]({
message: title,
description:content,
placement,
style
});
};
/**
* 点击提示,执行信息展示,只提供一个按钮用于关闭
* @param {string} title 成功提示信息标题
* @param {any} content 成功提示信息内容(可为html标签)
* @param {Function} handleOk 点击确定回调
*/
export const success = (title:string,content:any,handleOk:()=>{}):void => {
Modal.success({
title: title,
content: (
<div>
{content}
</div>),
onOk:handleOk,
});
}
/**
* 点击提示,执行信息展示,只提供一个按钮用于关闭
* @param {string} title 错误提示信息标题
* @param {any} content 错误提示信息内容(可为html标签)
* @param {Function} handleOk 点击确定回调
*/
export const error = (title:string,content:any,handleOk:()=>{}):void => {
Modal.error({
title: title,
content: (
<div>
{content}
</div>),
onOk:handleOk,
});
}
/**
* 点击提示,执行信息展示,只提供一个按钮用于关闭
* @param {string} title 普通提示信息标题
* @param {any} content 普通提示信息内容(可为html标签)
* @param {Function} handleOk 点击确定回调
*/
export const info = (title:string,content:any,handleOk:()=>{}):void => {
Modal.info({
title: title,
content: (
<div>
{content}
</div>
),
onOk:handleOk,
});
}
/**
* 点击提示,执行信息展示,只提供一个按钮用于关闭
* @param {string} title 警告提示信息标题
* @param {any} content 警告提示信息内容(可为html标签)
* @param {Function} handleOk 点击确定回调
*/
export const warning = (title:string,content:any,handleOk:()=>{}):void => {
Modal.warning({
title: title,
content: (
<div>
{content}
</div>),
onOk:handleOk,
});
}
/**
* 含有确认取消按钮的消息确认框
* @param {string} title 消息提示框标题
* @param {any} content 消息提示框内容
* @param {Function} handleOk 点击确认回调
* @param {Function} handleCancel 点击取消回调
* @param {string} okText 确定按钮文本内容默认确定
* @param {string} cancelText 取消按钮文本内容默认取消
*/
export const confirm = (title:string,content:any,handleOk:()=>{},handleCancel:()=>{},okText:string='确定',cancelText:string='取消'):void => {
Modal.confirm({
title: title,
content: content,
okText:okText,
cancelText:cancelText,
onOk:handleOk,
onCancel:handleCancel,
});
}
\ No newline at end of file
one_stop_public/DetailForAudit/components/SVG/index.tsx 0 → 100644
浏览文件 @ 5e75fe20
This source diff could not be displayed because it is too large. You can view the blob instead.
one_stop_public/DetailForAudit/styles.less 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/DetailForAudit/utils.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/Countersign.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/DataGgEditor.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/TrunTo.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/emailOrPhone.ts 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/uaa_User.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/urge.ts 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
one_stop_public/models/userSetCenterApi.js 0 → 100644
浏览文件 @ 5e75fe20
差异被折叠。
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论