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

Merge remote-tracking branch 'origin/master'

...@@ -38,7 +38,7 @@ export default class WebModal extends Component { ...@@ -38,7 +38,7 @@ export default class WebModal extends Component {
} }
render() { render() {
let {visible, handleCancel, title, width} = this.props; let {visible, handleCancel, title, width, getContainer} = this.props;
const {top} = this.state; const {top} = this.state;
const style = { const style = {
borderRadius: 4, borderRadius: 4,
...@@ -55,9 +55,7 @@ export default class WebModal extends Component { ...@@ -55,9 +55,7 @@ export default class WebModal extends Component {
closable={false} closable={false}
visible={visible} visible={visible}
footer={null} footer={null}
getContainer={() => { getContainer={getContainer !== undefined ? getContainer : undefined}
return getContainer(dom);
}}
destroyOnClose={true} destroyOnClose={true}
width={!!width ? width : 800} width={!!width ? width : 800}
handleCancel={handleCancel} handleCancel={handleCancel}
......
...@@ -167,6 +167,7 @@ export default class userButton extends Component { ...@@ -167,6 +167,7 @@ export default class userButton extends Component {
{/* <Btn get='2' btnOne={()=>{this.showModal('不同意')}} btnTwo={()=>{this.showModal('驳回')}} btnThree={()=>{this.showModal('通过')}}/> */} {/* <Btn get='2' btnOne={()=>{this.showModal('不同意')}} btnTwo={()=>{this.showModal('驳回')}} btnThree={()=>{this.showModal('通过')}}/> */}
<MyModal <MyModal
visible={visibleOk} visible={visibleOk}
getContainer={false}
title={isSecond ? '重新发起' : '通过审批'} title={isSecond ? '重新发起' : '通过审批'}
width={600} width={600}
handleCancel={this.handleCancelOk}> handleCancel={this.handleCancelOk}>
......
/**
* 徐立
* 2019年9月25日
* 自定义表单表格
*/
import React, { Component } from 'react';
import { Form, Row, Col, Input, message } from 'antd';
import UUID from 'react-native-uuid';
import { Toast } from 'antd-mobile';
import router from 'umi/router';
import moment from 'moment';
import { HyperFormula } from 'hyperformula';
import TableCom from '../tableCompon';
import IsNewTable from './isNewMobileTable';
import maintain from '../assets/maintain.png';
import { isJSON } from '@/webPublic/one_stop_public/copy';
// import moment2 from 'moment-timezone'
export default class ZdyTable extends Component {
constructor(props) {
super(props);
this.state = {
objRealTime: {},
isChange: false,
selects: new Map(),
left: 0,
top: 0,
max: 4,
formId: null,
formCode: null,
width: 100,
mapData: {},
defaultBinds: {},
sqlData: {},
defaultValues: {},
currentFormKey: null,
currentFormTitle: null,
items: [],
init: this.props.init || {},
datas: {},
isEdit: true,
isRowCol: false,
isReady: false,
formConfig: {},
};
}
componentDidMount() {
const {
postData, // 数据源
isCg, // 用户点击草稿页面进入
isForm,
isPreview, // 是否为预览模式
isChild, // 是否为子表单
isQRCode = false, // 是否为二维码快捷发起
formDeafault = '', // 为二维码快捷发起默认值
} = this.props;
// if(this.props.currentFormKey === 'aa20cdbd-2019-45ea-8cdf-715aa46e132e'){
// debugger;
// }
if (isPreview || isChild) {
this.initExcel({ datas: this.props.datas, trees: this.props.trees }, () => {
this.setState({
...this.state,
...this.props,
formConfig: { ...this.state.formConfig, style: this.props.style },
isReady: true,
viewMode:
this.props.currentFormKey &&
this.props.datas &&
this.props.datas[this.props.currentFormKey]
? this.props.datas[this.props.currentFormKey].viewMode
: null,
});
});
return;
}
const val = postData;
try {
/**
* 数据源不同进行以下区别处理
* this.props.table有传入值表明需要渲染流程中最新表单
*/
if (isForm) {
// 由表格的操作按钮进入
const mapData = {};
const sqlData = {};
const dataObjs = val.form.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const sqls = val.form.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.form.content);
const xxx = obj.datas[obj.init];
const fk = this.props.table ? val.formKey : obj.init;
this.initExcel(obj, () => {
this.setState({
datas: obj.datas,
width: this.props.table ? obj.datas[val.formKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.formKey].isBorder : xxx.isBorder,
viewMode: this.props.table ? obj.datas[val.formKey].viewMode : xxx.viewMode,
isRowCol: this.props.table ? obj.datas[val.formKey].isRowCol : xxx.isRowCol,
mapData,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
sqlData,
isEdit: !this.props.formKey,
items: this.props.table ? obj.datas[val.formKey].items : xxx.items,
defaultValues: val.form.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
});
});
return;
}
if (isCg === 'yes') {
// 用户从编辑按钮进入
if (
val.unifiedServicePatternModel.isDefaultError != null &&
val.unifiedServicePatternModel.isDefaultError
) {
if (this.props.get == 'web') {
message.error('当前办理人数较多,服务繁忙,请稍后再试!');
} else {
Toast.fail('当前办理人数较多,服务繁忙,请稍后再试!');
}
router.goBack();
return;
}
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
items: xxx.items,
init: { ...this.state.init, ...JSON.parse(val.content) },
datas: obj.datas,
isEdit: !this.props.formKey,
currentFormKey: obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, obj.init),
width: xxx.width,
isBorder: xxx.isBorder,
viewMode: xxx.viewMode,
isRowCol: xxx.isRowCol,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
});
});
return;
}
if (
val.unifiedServicePatternModel.isDefaultError != null &&
val.unifiedServicePatternModel.isDefaultError
) {
if (this.props.get == 'web') {
message.error('当前办理人数较多,服务繁忙,请稍后再试!');
} else {
Toast.fail('当前办理人数较多,服务繁忙,请稍后再试!');
}
router.goBack();
return;
}
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
if (!isJSON(val.unifiedServicePatternModel.content)) {
console.error('unifiedServicePatternModel.content 不是一个JSON字符串 请查看配置');
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[this.props.formKey ? this.props.formKey : obj.init]; // 是否是存在历史表单传入值
const fk = this.props.formKey
? this.props.formKey
: val.taskFormKey
? val.taskFormKey
: obj.init;
// console.log('231--------');
this.initExcel(obj, () =>
this.setState(
{
appId: val.id,
formId: val.id,
formCode: val.code,
datas: obj.datas,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
isEdit: !this.props.formKey,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
width: this.props.table ? obj.datas[val.taskFormKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.taskFormKey].isBorder : xxx.isBorder,
isRowCol: this.props.table ? obj.datas[val.taskFormKey].isRowCol : xxx.isRowCol,
viewMode: this.props.table ? obj.datas[val.taskFormKey].viewMode : xxx.viewMode,
items: this.props.table ? obj.datas[val.taskFormKey].items : xxx.items,
isReady: true,
init: { ...this.state.init, ...(val.isSecond ? this.props.obj : {}) }, // 重新发起就拿obj 里面的值给初始值
formConfig: xxx,
// init:this.props.get==="mobile"?!!val.content?JSON.parse(val.content):'':{},// 移动端默认值设置
},
() => {
/**
* 为二维码快捷发起时自动设置新默认值
*/
if (isQRCode) {
this.props.form.setFieldsValue(formDeafault);
}
this.initExcel(obj);
},
),
);
} catch (e) {
console.log('公式配置有误/Table/index-262', e);
}
}
importExcel = (res, callback) => {
if(this.props.importExcel) {
this.props.importExcel(res,callback);
return }
const { datas, trees } = this.configs;
const sheets = res.sheets;
for (var s = 0; s < sheets.length; s++) {
const uuid = sheets[s].key;
const items = [];
const cc = sheets[s].cells;
for (var i = 0; i < cc.length; i++) {
const rows = [];
const rr = cc[i];
for (var j = 0; j < rr.length; j++) {
const c = rr[j];
if (c.value == null || c.value == '') {
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
row: c.rowSpan,
col: c.colSpan,
content: { comName: 'Excel', cwidth: c.width, cheight: c.height },
});
} else {
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
row: c.rowSpan,
col: c.colSpan,
content: {
comName: 'Excel',
initialValue: c.value,
cwidth: c.width,
cheight: c.height,
},
});
}
}
items.push(rows);
}
const charts = sheets[s].charts;
if (charts && charts.length > 0) {
const rows = [];
for (var j = 0; j < charts.length; j++) {
const chartModel = charts[j];
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
content: {
comName: 'Echart',
columnIds: { c1: [] },
labelSpan: 24,
wrapperSpan: 24,
isLabel: false,
formula: 'return ' + JSON.stringify(chartModel.option),
},
});
items.push(rows);
}
}
if (datas[uuid] == null) {
trees.push({ title: sheets[s].name, key: uuid });
}
datas[uuid] = {
width: 400,
max: 1,
isBorder: true,
items: items,
};
}
this.initExcel(
{
datas,
trees,
},
() => {
this.setState({ isChange: !this.state.isChange }, () => {
if (callback) callback();
});
console.log('公式导入excel成功');
},
);
};
hfInstance;
childExcel = (sheetData, datas, tr) => {
if (tr.children == null || tr.children.length == 0) {
} else {
for (var c = 0; c < tr.children.length; c++) {
this.childExcel(sheetData, datas, tr.children[c]);
}
}
const data = datas[tr.key];
const all = [];
for (var i = 0; i < data.items.length; i++) {
const row = data.items[i];
const r = [];
for (var j = 0; j < row.length; j++) {
const col = row[j];
if (col.content?.comName == 'Excel') {
r.push(col.content.initialValue);
} else {
r.push('');
}
}
all.push(r);
}
sheetData[tr.title] = all;
};
configs;
initExcel = (configs, callback) => {
this.configs = configs;
// console.log(configs);
if (configs == null || configs.trees == null) {
if (callback) callback();
return;
}
const sheetData = {};
for (var key in configs.trees) {
const tr = configs.trees[key];
this.childExcel(sheetData, configs.datas, tr);
}
const hfInstance = HyperFormula.buildFromSheets(sheetData, {});
this.hfInstance = hfInstance;
if (callback) callback();
};
getCellValue = (i, j, currentTitle) => {
let hfInstance = this.props.hfInstance ? this.props.hfInstance : this.hfInstance;
if (hfInstance && currentTitle) {
let x = hfInstance.getCellValue({
col: j,
row: i,
sheet: hfInstance.getSheetId(currentTitle),
});
if (x && x.value != null) {
x = x.value;
}
return x;
}
};
componentWillReceiveProps(nextProps) {
const {
postData, // 数据源
isCg, // 用户点击草稿页面进入
isForm,
isPreview, // 是否为预览模式
isChild, // 是否为子表单
} = nextProps;
if (isPreview || isChild) {
this.setState(
{
...this.state,
...nextProps,
isReady: true,
viewMode:
nextProps.currentFormKey && nextProps.datas && nextProps.datas[nextProps.currentFormKey]
? nextProps.datas[nextProps.currentFormKey].viewMode
: null,
formConfig: { ...this.state.formConfig, style: nextProps.style },
},
() => this.initExcel({ datas: nextProps.datas, trees: nextProps.trees }),
);
return;
}
try {
const val = postData;
/**
* 数据源不同进行以下区别处理
* this.props.table有传入值表明需要渲染流程中最新表单
*/
if (isForm) {
// 由表格的操作按钮进入
const mapData = {};
const sqlData = {};
const dataObjs = val.form.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const sqls = val.form.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.form.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
datas: obj.datas,
width: this.props.table ? obj.datas[val.formKey].width : xxx.width,
isRowCol: this.props.table ? obj.datas[val.formKey].isRowCol : xxx.isRowCol,
isBorder: this.props.table ? obj.datas[val.formKey].isBorder : xxx.isBorder,
mapData,
currentFormKey: this.props.table ? val.formKey : obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
sqlData,
isEdit: !this.props.formKey,
items: this.props.table ? obj.datas[val.formKey].items : xxx.items,
defaultValues: val.form.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
});
});
return;
}
if (isCg === 'yes') {
// 用户从编辑按钮进入
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
items: xxx.items,
init: { ...this.state.init, ...JSON.parse(val.content) },
datas: obj.datas,
isEdit: !this.props.formKey,
currentFormKey: obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, obj.init),
width: xxx.width,
isBorder: xxx.isBorder,
isRowCol: xxx.isRowCol,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
});
});
return;
}
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[this.props.formKey ? this.props.formKey : obj.init]; // 是否是存在历史表单传入值
if (this.props.isQuery) return;
const fk = this.props.formKey
? this.props.formKey
: val.taskFormKey
? val.taskFormKey
: obj.init;
this.initExcel(obj, () => {
this.setState({
appId: val.id,
datas: obj.datas,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
isEdit: !this.props.formKey,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
width: this.props.table ? obj.datas[val.taskFormKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.taskFormKey].isBorder : xxx.isBorder,
isRowCol: this.props.table ? obj.datas[val.taskFormKey].isRowCol : xxx.isRowCol,
items: this.props.table ? obj.datas[val.taskFormKey].items : xxx.items,
isReady: true,
init: {
...this.state.init,
...(val.isSecond ? this.props.obj : {}),
},
formConfig: xxx,
// init:this.props.get==="mobile"?!!val.content?JSON.parse(val.content):'':{},// 移动端默认值设置
});
});
} catch (e) {
console.log('公式配置有误Table/index.jsx/572', e);
}
}
checkAllHidden = (row) => {
for (var i = 0; i < row.length; i++) {
if (row[i].hidden == null || !row[i].hidden) {
return false;
}
}
for (var i = 0; i < row.length; i++) {
delete row[i].hidden;
}
return true;
};
countMax = (items) => {
let max = 0;
items.forEach((r) => {
if (r.length > max) {
max = r.length;
}
});
return max;
};
getCurrentFormTitle = (obj, key) => {
if (obj == null) return;
const { trees } = obj;
if (trees == null) return;
return this.getT(trees, key);
};
getCurrentFormTitle2 = (key) => {
if (this.configs == null) return;
const trees = this.configs&&this.configs.trees?this.configs.trees:this.props.trees;
if (trees == null) return;
return this.getT(trees, key);
};
setRealTimeValues = (obj) => {
this.setState({ objRealTime: obj });
};
getT = (trees, key) => {
for (var i in trees) {
if (trees[i].key == key) {
return trees[i].title;
}
if (trees[i].children != null&& trees[i].children.length> 0) {
const x = this.getT(trees[i].children, key);
if(x!=null) return x
}
}
return null;
};
render() {
const {
width,
isRowCol,
isBorder,
sqlData,
mapData,
defaultBinds,
defaultValues,
items,
init,
modalTitle,
currentFormKey,
currentFormTitle,
isEdit,
datas,
isReady,
formConfig,
formCode,
formId,
viewMode,
} = this.state;
const {
border,
obj,
index,
fatherCode,
routerState, // 场景设计器共享路由参数
messageData, // 场景设计器共享变量参数 设计器监听到参数发生变化后会重新渲染组件
postData,
modalInit,
concealModel, // 场景设计器内置跳转函数
paddingBottom,
taskAssignee,
userId,
isDynamic, // 是否为大数据页面
isWebPrint, // 打印界面
isWebPrintEnd,
isPreview,
} = this.props;
const trees = this.configs&&this.configs.trees?this.configs.trees:this.props.trees;
let get;
if (viewMode != null && viewMode != '') {
get = viewMode;
} else {
get = this.props.get;
}
let style = {};
if (formConfig.style != null) {
try {
style = JSON.parse(formConfig.style);
} catch (e) {
//console.log(e);
style = {};
}
}
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 24 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 24 },
},
};
const max = this.countMax(items);
const borderStyle = {
borderRight: '1px solid gray',
borderTop: '1px solid gray',
borderLeft: '1px solid gray',
borderBottom: '1px solid gray',
};
const borderStyleTwo = {
// 处理隐藏组件边框样式问题
borderRight: '1px solid gray',
borderLeft: '1px solid gray',
borderTop: '1px solid gray',
};
let updateTime;
const styleDiv = this.props.height
? {
overflow: isDynamic ? 'hidden' : 'auto',
// overflowY: isDynamic && 'auto',
width: '100%',
height: this.props.height,
paddingBottom: paddingBottom != null ? paddingBottom : isWebPrint ? 0 : '10px',
}
: {
overflow: isDynamic ? 'hidden' : 'auto',
// overflowY: isDynamic && 'auto',
width: '100%',
paddingBottom: paddingBottom != null ? paddingBottom : isWebPrint ? 0 : '10px',
};
if (!isReady) return <></>;
if (this.props.postData?.isUpdate) {
updateTime = moment(+this.props.postData?.updateTime).format('llll');
}
if (this.props.currentFormKey === 'aa20cdbd-2019-45ea-8cdf-715aa46e132e') {
console.log(this);
}
switch (get) {
case 'web':
return (
<>
{this.props.postData?.isUpdate ? (
<div style={{ margin: '100px 24px 24px' }}>
<div style={{ textAlign: 'center' }}>
<img style={{ marginRight: 30 }} src={maintain} />
</div>
<p
style={{
textAlign: 'center',
width: '100%',
fontSize: '16px',
fontWeight: 'bold',
color: '#666666',
}}>
{updateTime !== 'Invalid date'
? `升级维护中,预计${updateTime ?? '一万年'}恢复使用,请耐心等待。`
: '请耐心等待'}
</p>
</div>
) : (
<div id="web_table">
<Form className="login-form">
{isEdit && defaultBinds
? Object.keys(defaultBinds).map((k) => {
const r = defaultBinds[k];
if (
r.columnIds == null ||
r.columnIds.length < 2 ||
r.sqls == null ||
r.sqls.length < 2
) {
return '';
}
const name = r.columnIds[r.columnIds.length - 1];
const key = r.sqls[r.sqls.length - 1];
const value = defaultValues[key];
if (value === null || value === undefined) {
return '';
}
return this.props.form.getFieldDecorator(name, {
initialValue: value,
})(<Input type="hidden" />);
})
: ''}
<Row>
<Col span={24}>
<div
style={styleDiv}
ref={(ref) => {
this.root = ref;
}}>
<table
style={{
overflow: 'auto',
margin: max * width > 550 ? 'auto' : '',
marginBottom: isWebPrint ? (isWebPrintEnd ? '5px' : 0) : '1px',
...style,
}}
border={border}
cellSpacing="0"
cellPadding="0">
<tbody>
{items.map((row, i) => {
const allhidden = this.checkAllHidden(row);
return (
<tr key={i}>
{row.map((cell, j) => {
if (!cell.content) {
return;
}
let styles = {};
if (cell.content && cell.content.styles) {
try {
styles = JSON.parse(cell.content.styles);
} catch (e) {
console.log(`第${i}行第${j}列样式配置有误,${e}`);
}
}
return !allhidden && cell.hidden ? (
''
) : (
<td
width={
i == 0
? (cell.content != null && cell.content.cwidth != null
? cell.content.cwidth
: width) * (cell.col ? cell.col : 1)
: width * (cell.col ? cell.col : 1)
}
rowSpan={cell.row}
colSpan={cell.col}
key={j}
style={{
overflow: 'auto',
textAlign:
cell.content && cell.content.calign
? cell.content.calign
: 'left',
...(isBorder
? cell?.content?.comName == 'InputHidden' ||
!cell?.content?.comName
? {}
: borderStyle
: {}),
// position: cell.content&&cell.content.comName ==="InputHidden"&&'absolute',
...styles,
display:
cell.content &&
(cell.content.comName === 'InputHidden' ||
cell.content.isHidden) &&
'none',
}}>
<TableCom
taskId={this.props.taskId}
importExcel={this.importExcel}
getCellValue={this.getCellValue}
getCurrentFormTitle={this.getCurrentFormTitle2}
hfInstance={this.hfInstance}
isWebPrintEnd={isWebPrintEnd}
isWebPrint={isWebPrint}
isPrint={this.props.isPrint}
formCode={formCode} // 当前表单code
modalInit={modalInit}
taskAssignee={taskAssignee} // 提交人
userId={userId}
formId={formId} // 当前表单Id
i={i} // 当前组件下标
j={j} // 当前行数下班
isPreview={isPreview}
fatherCode={fatherCode}
index={index}
fatherObj={this.props.fatherObj}
datas={datas}
uuid={cell.uuid}
setRealTimeValues={this.setRealTimeValues}
isEdit={isEdit}
formKey={currentFormKey}
currentFormTitle={currentFormTitle}
init={init}
get={get} // 区分移动端或wen端
json={cell.content}
obj={{ ...obj, ...this.state.objRealTime } || {}} // 是否存在默认值
mapData={mapData}
form={this.props.form} // antd form控件
sqlData={sqlData}
defaultValues={defaultValues || {}} // 接口中的默认值
routerState={routerState} // 兼容表单设计器路由传参
messageData={messageData} // 场景设计器共享变量参数
concealModel={concealModel || {}} // 场景设计器内置路由跳转函数
isDynamic={isDynamic} // 是否为场景配置器调用
trees={trees}
/>
</td>
);
})}
</tr>
);
})}
</tbody>
</table>
{style.pageBreakAfter != null ? (
<div style={{ pageBreakAfter: style.pageBreakAfter }} />
) : (
''
)}
</div>
</Col>
</Row>
</Form>
</div>
)}
</>
);
case 'mobile':
return (
<>
{this.props.postData?.isUpdate ? (
<div style={{ margin: '100px 24px 24px' }}>
<div style={{ textAlign: 'center' }}>
<img style={{ width: '100%' }} src={maintain} />
</div>
<p
style={{
textAlign: 'center',
width: '100%',
fontSize: '16px',
fontWeight: 'bold',
color: '#666666',
}}>
{updateTime !== 'Invalid date'
? `升级维护中,预计${updateTime ?? '一万年'}恢复使用,请耐心等待。`
: '请耐心等待'}
</p>
</div>
) : (
<Form {...formItemLayout} id="mobile_table" className="login-form">
{defaultBinds
? Object.keys(defaultBinds).map((k) => {
const r = defaultBinds[k];
if (
r.columnIds == null ||
r.columnIds.length < 2 ||
r.sqls == null ||
r.sqls.length < 2
) {
return '';
}
const name = r.columnIds[r.columnIds.length - 1];
const key = r.sqls[r.sqls.length - 1];
const value = defaultValues[key];
if (value === null || value === undefined) {
return '';
}
return this.props.form.getFieldDecorator(name, {
initialValue: value,
})(<Input type="hidden" />);
})
: ''}
<IsNewTable
taskId={this.props.taskId}
getCellValue={this.getCellValue}
hfInstance={this.hfInstance}
getCurrentFormTitle={this.getCurrentFormTitle2}
taskAssignee={taskAssignee} // 提交人
userId={userId}
importExcel={this.importExcel}
isPreview={isPreview}
trees={trees}
setRealTimeValues={this.setRealTimeValues}
isRowCol={isRowCol}
modalInit={modalInit}
items={items}
checkAllHidden={this.checkAllHidden}
isBorder={isBorder}
borderStyle={borderStyle}
fatherCode={fatherCode}
index={index}
datas={datas}
isEdit={isEdit}
currentFormKey={currentFormKey}
currentFormTitle={currentFormTitle}
init={init}
get={get}
obj={{ ...obj, ...this.state.objRealTime }}
mapData={mapData}
form={this.props.form}
sqlData={sqlData}
defaultValues={defaultValues}
width={width}
formCode={formCode}
style={style}
routerState={routerState} // 兼容表单设计器路由传参
messageData={messageData} // 场景设计器共享变量参数
formId={formId}
fatherObj={this.props.fatherObj}
concealModel={concealModel || {}} // 场景设计器内置路由跳转函数
isDynamic={isDynamic} // 是否为场景配置器调用
/>
</Form>
)}
</>
);
}
}
}
/** import React, {useEffect, useState, useRef, memo} from 'react';
* 徐立 import ZdyTable from './ZdyTable';
* 2019年9月25日 import {isJSON} from '@/webPublic/one_stop_public/copy';
* 自定义表单表格 import {uaaRequest} from '@/webPublic/one_stop_public/utils/request';
*/ import {Modal, message, Spin} from 'antd';
import React, { Component } from 'react';
import { Form, Row, Col, Input, message } from 'antd'; export default function PrentIndex(props) {
import UUID from 'react-native-uuid';
import { Toast } from 'antd-mobile'; const [prepareShow, setPrepareShow] = useState(false);
import router from 'umi/router';
import moment from 'moment'; useEffect(() => {
import { HyperFormula } from 'hyperformula'; let data = props?.postData?.unifiedServicePatternModel?.content;
import TableCom from '../tableCompon'; if (data && isJSON(data)) { // 模板挂载时公式执行
import IsNewTable from './isNewMobileTable'; let g = JSON.parse(data)?.templateWillMount;
import maintain from '../assets/maintain.png'; if (g && typeof g === 'string' && g.length > 10) {
import { isJSON } from '@/webPublic/one_stop_public/copy'; let p = {
// import moment2 from 'moment-timezone' message,
export default class ZdyTable extends Component { Modal,
constructor(props) { uaaRequest,
super(props); userNowInfo:
this.state = { (isJSON(localStorage.getItem('user')) && JSON.parse(localStorage.getItem('user'))) ||
objRealTime: {}, {},
isChange: false, templateData: props.postData,
selects: new Map(), routerState: props?.routerState,
left: 0, };
top: 0, let newFunc = new Function('props', g);
max: 4,
formId: null,
formCode: null,
width: 100,
mapData: {},
defaultBinds: {},
sqlData: {},
defaultValues: {},
currentFormKey: null,
currentFormTitle: null,
items: [],
init: this.props.init || {},
datas: {},
isEdit: true,
isRowCol: false,
isReady: false,
formConfig: {},
};
}
componentDidMount() {
const {
postData, // 数据源
isCg, // 用户点击草稿页面进入
isForm,
isPreview, // 是否为预览模式
isChild, // 是否为子表单
isQRCode = false, // 是否为二维码快捷发起
formDeafault = '', // 为二维码快捷发起默认值
} = this.props;
// if(this.props.currentFormKey === 'aa20cdbd-2019-45ea-8cdf-715aa46e132e'){
// debugger;
// }
if (isPreview || isChild) {
this.initExcel({ datas: this.props.datas, trees: this.props.trees }, () => {
this.setState({
...this.state,
...this.props,
formConfig: { ...this.state.formConfig, style: this.props.style },
isReady: true,
viewMode:
this.props.currentFormKey &&
this.props.datas &&
this.props.datas[this.props.currentFormKey]
? this.props.datas[this.props.currentFormKey].viewMode
: null,
});
});
return;
}
const val = postData;
try {
/**
* 数据源不同进行以下区别处理
* this.props.table有传入值表明需要渲染流程中最新表单
*/
if (isForm) {
// 由表格的操作按钮进入
const mapData = {};
const sqlData = {};
const dataObjs = val.form.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const sqls = val.form.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.form.content);
const xxx = obj.datas[obj.init];
const fk = this.props.table ? val.formKey : obj.init;
this.initExcel(obj, () => {
this.setState({
datas: obj.datas,
width: this.props.table ? obj.datas[val.formKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.formKey].isBorder : xxx.isBorder,
viewMode: this.props.table ? obj.datas[val.formKey].viewMode : xxx.viewMode,
isRowCol: this.props.table ? obj.datas[val.formKey].isRowCol : xxx.isRowCol,
mapData,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
sqlData,
isEdit: !this.props.formKey,
items: this.props.table ? obj.datas[val.formKey].items : xxx.items,
defaultValues: val.form.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
});
});
return;
}
if (isCg === 'yes') {
// 用户从编辑按钮进入
if (
val.unifiedServicePatternModel.isDefaultError != null &&
val.unifiedServicePatternModel.isDefaultError
) {
if (this.props.get == 'web') {
message.error('当前办理人数较多,服务繁忙,请稍后再试!');
} else {
Toast.fail('当前办理人数较多,服务繁忙,请稍后再试!');
}
router.goBack();
return;
}
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
items: xxx.items,
init: { ...this.state.init, ...JSON.parse(val.content) },
datas: obj.datas,
isEdit: !this.props.formKey,
currentFormKey: obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, obj.init),
width: xxx.width,
isBorder: xxx.isBorder,
viewMode: xxx.viewMode,
isRowCol: xxx.isRowCol,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
});
});
return;
}
if (
val.unifiedServicePatternModel.isDefaultError != null &&
val.unifiedServicePatternModel.isDefaultError
) {
if (this.props.get == 'web') {
message.error('当前办理人数较多,服务繁忙,请稍后再试!');
} else {
Toast.fail('当前办理人数较多,服务繁忙,请稍后再试!');
}
router.goBack();
return;
}
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
if (!isJSON(val.unifiedServicePatternModel.content)) {
console.error('unifiedServicePatternModel.content 不是一个JSON字符串 请查看配置');
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[this.props.formKey ? this.props.formKey : obj.init]; // 是否是存在历史表单传入值
const fk = this.props.formKey
? this.props.formKey
: val.taskFormKey
? val.taskFormKey
: obj.init;
// console.log('231--------');
this.initExcel(obj, () =>
this.setState(
{
appId: val.id,
formId: val.id,
formCode: val.code,
datas: obj.datas,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
isEdit: !this.props.formKey,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
width: this.props.table ? obj.datas[val.taskFormKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.taskFormKey].isBorder : xxx.isBorder,
isRowCol: this.props.table ? obj.datas[val.taskFormKey].isRowCol : xxx.isRowCol,
viewMode: this.props.table ? obj.datas[val.taskFormKey].viewMode : xxx.viewMode,
items: this.props.table ? obj.datas[val.taskFormKey].items : xxx.items,
isReady: true,
init: { ...this.state.init, ...(val.isSecond ? this.props.obj : {}) }, // 重新发起就拿obj 里面的值给初始值
formConfig: xxx,
// init:this.props.get==="mobile"?!!val.content?JSON.parse(val.content):'':{},// 移动端默认值设置
},
() => {
/**
* 为二维码快捷发起时自动设置新默认值
*/
if (isQRCode) {
this.props.form.setFieldsValue(formDeafault);
}
this.initExcel(obj);
},
),
);
} catch (e) {
console.log('公式配置有误/Table/index-262', e);
}
}
importExcel = (res, callback) => {
if(this.props.importExcel) {
this.props.importExcel(res,callback);
return }
const { datas, trees } = this.configs;
const sheets = res.sheets;
for (var s = 0; s < sheets.length; s++) {
const uuid = sheets[s].key;
const items = [];
const cc = sheets[s].cells;
for (var i = 0; i < cc.length; i++) {
const rows = [];
const rr = cc[i];
for (var j = 0; j < rr.length; j++) {
const c = rr[j];
if (c.value == null || c.value == '') {
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
row: c.rowSpan,
col: c.colSpan,
content: { comName: 'Excel', cwidth: c.width, cheight: c.height },
});
} else {
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
row: c.rowSpan,
col: c.colSpan,
content: {
comName: 'Excel',
initialValue: c.value,
cwidth: c.width,
cheight: c.height,
},
});
}
}
items.push(rows);
}
const charts = sheets[s].charts;
if (charts && charts.length > 0) {
const rows = [];
for (var j = 0; j < charts.length; j++) {
const chartModel = charts[j];
rows.push({
uuid: 'id_' + UUID.v4().replace(/-/g, '2'),
content: {
comName: 'Echart',
columnIds: { c1: [] },
labelSpan: 24,
wrapperSpan: 24,
isLabel: false,
formula: 'return ' + JSON.stringify(chartModel.option),
},
});
items.push(rows);
}
}
if (datas[uuid] == null) {
trees.push({ title: sheets[s].name, key: uuid });
}
datas[uuid] = {
width: 400,
max: 1,
isBorder: true,
items: items,
};
}
this.initExcel(
{
datas,
trees,
},
() => {
this.setState({ isChange: !this.state.isChange }, () => {
if (callback) callback();
});
console.log('公式导入excel成功');
},
);
};
hfInstance;
childExcel = (sheetData, datas, tr) => {
if (tr.children == null || tr.children.length == 0) {
} else {
for (var c = 0; c < tr.children.length; c++) {
this.childExcel(sheetData, datas, tr.children[c]);
}
}
const data = datas[tr.key];
const all = [];
for (var i = 0; i < data.items.length; i++) {
const row = data.items[i];
const r = [];
for (var j = 0; j < row.length; j++) {
const col = row[j];
if (col.content?.comName == 'Excel') {
r.push(col.content.initialValue);
} else {
r.push('');
}
}
all.push(r);
}
sheetData[tr.title] = all;
};
configs;
initExcel = (configs, callback) => {
this.configs = configs;
// console.log(configs);
if (configs == null || configs.trees == null) {
if (callback) callback();
return;
}
const sheetData = {};
for (var key in configs.trees) {
const tr = configs.trees[key];
this.childExcel(sheetData, configs.datas, tr);
}
const hfInstance = HyperFormula.buildFromSheets(sheetData, {});
this.hfInstance = hfInstance;
if (callback) callback();
};
getCellValue = (i, j, currentTitle) => {
let hfInstance = this.props.hfInstance ? this.props.hfInstance : this.hfInstance;
if (hfInstance && currentTitle) {
let x = hfInstance.getCellValue({
col: j,
row: i,
sheet: hfInstance.getSheetId(currentTitle),
});
if (x && x.value != null) {
x = x.value;
}
return x;
}
};
componentWillReceiveProps(nextProps) {
const {
postData, // 数据源
isCg, // 用户点击草稿页面进入
isForm,
isPreview, // 是否为预览模式
isChild, // 是否为子表单
} = nextProps;
if (isPreview || isChild) {
this.setState(
{
...this.state,
...nextProps,
isReady: true,
viewMode:
nextProps.currentFormKey && nextProps.datas && nextProps.datas[nextProps.currentFormKey]
? nextProps.datas[nextProps.currentFormKey].viewMode
: null,
formConfig: { ...this.state.formConfig, style: nextProps.style },
},
() => this.initExcel({ datas: nextProps.datas, trees: nextProps.trees }),
);
return;
}
try { try {
const val = postData; newFunc(p)
/** .then(res => {
* 数据源不同进行以下区别处理 if (res) {
* this.props.table有传入值表明需要渲染流程中最新表单 window.zdyTableTemplateWillMountProps = res;
*/ setPrepareShow(true);
if (isForm) {
// 由表格的操作按钮进入
const mapData = {};
const sqlData = {};
const dataObjs = val.form.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const sqls = val.form.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.form.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
datas: obj.datas,
width: this.props.table ? obj.datas[val.formKey].width : xxx.width,
isRowCol: this.props.table ? obj.datas[val.formKey].isRowCol : xxx.isRowCol,
isBorder: this.props.table ? obj.datas[val.formKey].isBorder : xxx.isBorder,
mapData,
currentFormKey: this.props.table ? val.formKey : obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
sqlData,
isEdit: !this.props.formKey,
items: this.props.table ? obj.datas[val.formKey].items : xxx.items,
defaultValues: val.form.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
});
});
return;
}
if (isCg === 'yes') {
// 用户从编辑按钮进入
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[obj.init];
this.initExcel(obj, () => {
this.setState({
items: xxx.items,
init: { ...this.state.init, ...JSON.parse(val.content) },
datas: obj.datas,
isEdit: !this.props.formKey,
currentFormKey: obj.init,
currentFormTitle: this.getCurrentFormTitle(obj, obj.init),
width: xxx.width,
isBorder: xxx.isBorder,
isRowCol: xxx.isRowCol,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
appId: val.appId,
isReady: true,
formConfig: xxx,
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
});
});
return;
} }
const mapData = {};
const sqlData = {};
const sqls = val.unifiedServicePatternModel.sqlModels;
for (var i = 0; i < sqls.length; i++) {
const dob = sqls[i].dataObjModel;
for (var j = 0; j < dob.columnModels.length; j++) {
sqlData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const dataObjs = val.unifiedServicePatternModel.dataObjModels;
for (var i = 0; i < dataObjs.length; i++) {
const dob = dataObjs[i];
for (var j = 0; j < dob.columnModels.length; j++) {
mapData[dob.columnModels[j].base52] = dob.columnModels[j];
}
}
const obj = JSON.parse(val.unifiedServicePatternModel.content);
const xxx = obj.datas[this.props.formKey ? this.props.formKey : obj.init]; // 是否是存在历史表单传入值
if (this.props.isQuery) return;
const fk = this.props.formKey
? this.props.formKey
: val.taskFormKey
? val.taskFormKey
: obj.init;
this.initExcel(obj, () => {
this.setState({
appId: val.id,
datas: obj.datas,
mapData,
sqlData,
defaultValues: val.unifiedServicePatternModel.defaultValues,
isEdit: !this.props.formKey,
currentFormKey: fk,
currentFormTitle: this.getCurrentFormTitle(obj, fk),
defaultBinds: this.props.table
? obj.datas[val.taskFormKey].defaultBinds
: xxx.defaultBinds,
width: this.props.table ? obj.datas[val.taskFormKey].width : xxx.width,
isBorder: this.props.table ? obj.datas[val.taskFormKey].isBorder : xxx.isBorder,
isRowCol: this.props.table ? obj.datas[val.taskFormKey].isRowCol : xxx.isRowCol,
items: this.props.table ? obj.datas[val.taskFormKey].items : xxx.items,
isReady: true,
init: {
...this.state.init,
...(val.isSecond ? this.props.obj : {}),
},
formConfig: xxx,
// init:this.props.get==="mobile"?!!val.content?JSON.parse(val.content):'':{},// 移动端默认值设置
});
});
} catch (e) {
console.log('公式配置有误Table/index.jsx/572', e);
}
}
checkAllHidden = (row) => {
for (var i = 0; i < row.length; i++) {
if (row[i].hidden == null || !row[i].hidden) {
return false;
}
}
for (var i = 0; i < row.length; i++) {
delete row[i].hidden;
}
return true;
};
countMax = (items) => {
let max = 0;
items.forEach((r) => {
if (r.length > max) {
max = r.length;
}
});
return max;
};
getCurrentFormTitle = (obj, key) => {
if (obj == null) return;
const { trees } = obj;
if (trees == null) return;
return this.getT(trees, key);
};
getCurrentFormTitle2 = (key) => {
if (this.configs == null) return;
const trees = this.configs&&this.configs.trees?this.configs.trees:this.props.trees;
if (trees == null) return;
return this.getT(trees, key);
};
setRealTimeValues = (obj) => {
this.setState({ objRealTime: obj });
};
getT = (trees, key) => {
for (var i in trees) {
if (trees[i].key == key) {
return trees[i].title;
}
if (trees[i].children != null&& trees[i].children.length> 0) {
const x = this.getT(trees[i].children, key);
if(x!=null) return x
}
}
return null;
};
render() {
const {
width,
isRowCol,
isBorder,
sqlData,
mapData,
defaultBinds,
defaultValues,
items,
init,
modalTitle,
currentFormKey,
currentFormTitle,
isEdit,
datas,
isReady,
formConfig,
formCode,
formId,
viewMode,
} = this.state;
const {
border,
obj,
index,
fatherCode,
routerState, // 场景设计器共享路由参数
messageData, // 场景设计器共享变量参数 设计器监听到参数发生变化后会重新渲染组件
postData,
modalInit,
concealModel, // 场景设计器内置跳转函数
paddingBottom,
taskAssignee,
userId,
isDynamic, // 是否为大数据页面
isWebPrint, // 打印界面
isWebPrintEnd,
isPreview,
} = this.props;
const trees = this.configs&&this.configs.trees?this.configs.trees:this.props.trees;
let get;
if (viewMode != null && viewMode != '') {
get = viewMode;
} else {
get = this.props.get;
}
let style = {};
if (formConfig.style != null) {
try {
style = JSON.parse(formConfig.style);
} catch (e) {
//console.log(e);
style = {};
}
}
const formItemLayout = {
labelCol: {
xs: { span: 24 },
sm: { span: 24 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 24 },
},
};
const max = this.countMax(items);
const borderStyle = {
borderRight: '1px solid gray',
borderTop: '1px solid gray',
borderLeft: '1px solid gray',
borderBottom: '1px solid gray',
};
const borderStyleTwo = {
// 处理隐藏组件边框样式问题
borderRight: '1px solid gray',
borderLeft: '1px solid gray',
borderTop: '1px solid gray',
};
let updateTime;
const styleDiv = this.props.height
? {
overflow: isDynamic ? 'hidden' : 'auto',
// overflowY: isDynamic && 'auto',
width: '100%',
height: this.props.height,
paddingBottom: paddingBottom != null ? paddingBottom : isWebPrint ? 0 : '10px',
}
: {
overflow: isDynamic ? 'hidden' : 'auto',
// overflowY: isDynamic && 'auto',
width: '100%',
paddingBottom: paddingBottom != null ? paddingBottom : isWebPrint ? 0 : '10px',
};
if (!isReady) return <></>;
if (this.props.postData?.isUpdate) {
updateTime = moment(+this.props.postData?.updateTime).format('llll');
}
if (this.props.currentFormKey === 'aa20cdbd-2019-45ea-8cdf-715aa46e132e') {
console.log(this);
}
switch (get) {
case 'web':
return (
<>
{this.props.postData?.isUpdate ? (
<div style={{ margin: '100px 24px 24px' }}>
<div style={{ textAlign: 'center' }}>
<img style={{ marginRight: 30 }} src={maintain} />
</div>
<p
style={{
textAlign: 'center',
width: '100%',
fontSize: '16px',
fontWeight: 'bold',
color: '#666666',
}}>
{updateTime !== 'Invalid date'
? `升级维护中,预计${updateTime ?? '一万年'}恢复使用,请耐心等待。`
: '请耐心等待'}
</p>
</div>
) : (
<div id="web_table">
<Form className="login-form">
{isEdit && defaultBinds
? Object.keys(defaultBinds).map((k) => {
const r = defaultBinds[k];
if (
r.columnIds == null ||
r.columnIds.length < 2 ||
r.sqls == null ||
r.sqls.length < 2
) {
return '';
}
const name = r.columnIds[r.columnIds.length - 1];
const key = r.sqls[r.sqls.length - 1];
const value = defaultValues[key];
if (value === null || value === undefined) {
return '';
}
return this.props.form.getFieldDecorator(name, {
initialValue: value,
})(<Input type="hidden" />);
}) })
: ''} .catch(error => {
<Row> window.zdyTableTemplateWillMountProps = undefined;
<Col span={24}> setPrepareShow(true);
<div console.log('模板挂载时公式执行失败', error);
style={styleDiv} });
ref={(ref) => {
this.root = ref;
}}>
<table
style={{
overflow: 'auto',
margin: max * width > 550 ? 'auto' : '',
marginBottom: isWebPrint ? (isWebPrintEnd ? '5px' : 0) : '1px',
...style,
}}
border={border}
cellSpacing="0"
cellPadding="0">
<tbody>
{items.map((row, i) => {
const allhidden = this.checkAllHidden(row);
return (
<tr key={i}>
{row.map((cell, j) => {
if (!cell.content) {
return;
}
let styles = {};
if (cell.content && cell.content.styles) {
try {
styles = JSON.parse(cell.content.styles);
} catch (e) { } catch (e) {
console.log(`第${i}行第${j}列样式配置有误,${e}`); console.log(e);
} setPrepareShow(true);
} }
return !allhidden && cell.hidden ? (
''
) : (
<td
width={
i == 0
? (cell.content != null && cell.content.cwidth != null
? cell.content.cwidth
: width) * (cell.col ? cell.col : 1)
: width * (cell.col ? cell.col : 1)
} }
rowSpan={cell.row}
colSpan={cell.col}
key={j}
style={{
overflow: 'auto',
textAlign:
cell.content && cell.content.calign
? cell.content.calign
: 'left',
...(isBorder
? cell?.content?.comName == 'InputHidden' ||
!cell?.content?.comName
? {}
: borderStyle
: {}),
// position: cell.content&&cell.content.comName ==="InputHidden"&&'absolute',
...styles,
display:
cell.content &&
(cell.content.comName === 'InputHidden' ||
cell.content.isHidden) &&
'none',
}}>
<TableCom
taskId={this.props.taskId}
importExcel={this.importExcel}
getCellValue={this.getCellValue}
getCurrentFormTitle={this.getCurrentFormTitle2}
hfInstance={this.hfInstance}
isWebPrintEnd={isWebPrintEnd}
isWebPrint={isWebPrint}
isPrint={this.props.isPrint}
formCode={formCode} // 当前表单code
modalInit={modalInit}
taskAssignee={taskAssignee} // 提交人
userId={userId}
formId={formId} // 当前表单Id
i={i} // 当前组件下标
j={j} // 当前行数下班
isPreview={isPreview}
fatherCode={fatherCode}
index={index}
fatherObj={this.props.fatherObj}
datas={datas}
uuid={cell.uuid}
setRealTimeValues={this.setRealTimeValues}
isEdit={isEdit}
formKey={currentFormKey}
currentFormTitle={currentFormTitle}
init={init}
get={get} // 区分移动端或wen端
json={cell.content}
obj={{ ...obj, ...this.state.objRealTime } || {}} // 是否存在默认值
mapData={mapData}
form={this.props.form} // antd form控件
sqlData={sqlData}
defaultValues={defaultValues || {}} // 接口中的默认值
routerState={routerState} // 兼容表单设计器路由传参
messageData={messageData} // 场景设计器共享变量参数
concealModel={concealModel || {}} // 场景设计器内置路由跳转函数
isDynamic={isDynamic} // 是否为场景配置器调用
trees={trees}
/>
</td>
);
})}
</tr>
);
})}
</tbody>
</table>
{style.pageBreakAfter != null ? (
<div style={{ pageBreakAfter: style.pageBreakAfter }} />
) : (
''
)}
</div>
</Col>
</Row>
</Form>
</div>
)}
</>
);
case 'mobile':
return (
<>
{this.props.postData?.isUpdate ? (
<div style={{ margin: '100px 24px 24px' }}>
<div style={{ textAlign: 'center' }}>
<img style={{ width: '100%' }} src={maintain} />
</div>
<p
style={{
textAlign: 'center',
width: '100%',
fontSize: '16px',
fontWeight: 'bold',
color: '#666666',
}}>
{updateTime !== 'Invalid date'
? `升级维护中,预计${updateTime ?? '一万年'}恢复使用,请耐心等待。`
: '请耐心等待'}
</p>
</div>
) : (
<Form {...formItemLayout} id="mobile_table" className="login-form">
{defaultBinds
? Object.keys(defaultBinds).map((k) => {
const r = defaultBinds[k];
if (
r.columnIds == null ||
r.columnIds.length < 2 ||
r.sqls == null ||
r.sqls.length < 2
) {
return '';
} }
const name = r.columnIds[r.columnIds.length - 1]; else{
const key = r.sqls[r.sqls.length - 1]; setPrepareShow(true);
const value = defaultValues[key];
if (value === null || value === undefined) {
return '';
} }
}, []);
return this.props.form.getFieldDecorator(name, { return prepareShow ? <ZdyTable {...props} /> : <Spin size={'large'}/>;
initialValue: value,
})(<Input type="hidden" />);
})
: ''}
<IsNewTable
taskId={this.props.taskId}
getCellValue={this.getCellValue}
hfInstance={this.hfInstance}
getCurrentFormTitle={this.getCurrentFormTitle2}
taskAssignee={taskAssignee} // 提交人
userId={userId}
importExcel={this.importExcel}
isPreview={isPreview}
trees={trees}
setRealTimeValues={this.setRealTimeValues}
isRowCol={isRowCol}
modalInit={modalInit}
items={items}
checkAllHidden={this.checkAllHidden}
isBorder={isBorder}
borderStyle={borderStyle}
fatherCode={fatherCode}
index={index}
datas={datas}
isEdit={isEdit}
currentFormKey={currentFormKey}
currentFormTitle={currentFormTitle}
init={init}
get={get}
obj={{ ...obj, ...this.state.objRealTime }}
mapData={mapData}
form={this.props.form}
sqlData={sqlData}
defaultValues={defaultValues}
width={width}
formCode={formCode}
style={style}
routerState={routerState} // 兼容表单设计器路由传参
messageData={messageData} // 场景设计器共享变量参数
formId={formId}
fatherObj={this.props.fatherObj}
concealModel={concealModel || {}} // 场景设计器内置路由跳转函数
isDynamic={isDynamic} // 是否为场景配置器调用
/>
</Form>
)}
</>
);
}
}
} }
...@@ -115,6 +115,7 @@ export default class index extends Component { ...@@ -115,6 +115,7 @@ export default class index extends Component {
<div <div
style={{ style={{
height: 650, height: 650,
maxWidth: 1200,
}}> }}>
<a target={'_blank'} href={path} download={pathName}> <a target={'_blank'} href={path} download={pathName}>
下载文件 下载文件
......
...@@ -5,13 +5,11 @@ ...@@ -5,13 +5,11 @@
*/ */
import React, { Component } from 'react'; import React, { Component } from 'react';
import styles from './style.less'; import styles from './style.less';
import { Icon, Alert, Select, Button } from 'antd'; import { Icon } from 'antd';
import AceEditor from 'react-ace';
import AllImg from '../assets/AllFuc.png'; import AllImg from '../assets/AllFuc.png';
import All2Img from '../assets/AllFuc2.png'; import All2Img from '../assets/AllFuc2.png';
import ExcelBtn from '../excelInitFuc'; import ExcelBtn from '../excelInitFuc';
import RollTab from './rollTab'; import RollTab from './rollTab';
const { Option } = Select;
export default class FormulaForm extends Component { export default class FormulaForm extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -149,27 +147,6 @@ export default class FormulaForm extends Component { ...@@ -149,27 +147,6 @@ export default class FormulaForm extends Component {
this.refs.rolltab.setCloseAll(); this.refs.rolltab.setCloseAll();
}}> }}>
{this.props.editor} {this.props.editor}
{/* <AceEditor height={600} width={1200}
placeholder='"请输入js语句"'
mode={"javascript"}
theme={"textmate"}
fontSize={12}
value={aceValue}
onChange={this.onAceChange.bind(this)}
showPrintMargin={true}
showGutter={true}
highlightActiveLine={true}
name="UNIQUE_ID_OF_DIV"
// keyboardHandler="vim"
setOptions={{
enableBasicAutocompletion: true,
enableLiveAutocompletion: true,
enableSnippets: true,
showLineNumbers: true,
tabSize: 2,
}}
editorProps={{ $blockScrolling: true }}
/> */}
</div> </div>
</div> </div>
......
import React, {useState, useEffect, useRef} from 'react'; import React, { useState, useEffect, useRef } from 'react';
import styles from './styles.less'; import styles from './styles.less';
import {Modal, Button, Icon, message} from 'antd'; import { Modal, Button, Icon, message } from 'antd';
import ShowItem, {dragEventList, zipImage} from './ShowItem'; import ShowItem, { dragEventList, zipImage } from './ShowItem';
import {apiRequest} from "../../utils/request"; import { apiRequest } from '../../utils/request';
import {deepCopy} from "@/webPublic/one_stop_public/utils/myutils"; import { deepCopy } from '@/webPublic/one_stop_public/utils/myutils';
let fakeFileInfo = { let fakeFileInfo = {
path: '/u/202112/25143111x0ki.jpg', // 超大的图片 path: '/u/202112/25143111x0ki.jpg', // 超大的图片
name: '摇摇后摇.jpg', name: '摇摇后摇.jpg',
}; };
const getContent = (signConfig = [], ratioX) => { const getContent = (signConfig = [], ratioX) => {
let data = deepCopy(signConfig); let data = deepCopy(signConfig);
return JSON.stringify({ return JSON.stringify({
objs: data.map((g) => { objs: data.map(g => {
// 1200 的 x => 1500的 x // 1200 的 x => 1500的 x
// //
g.x = Math.ceil(g.x * ratioX, 10); g.x = Math.ceil(g.x * ratioX, 10);
...@@ -25,7 +24,7 @@ const getContent = (signConfig = [], ratioX) => { ...@@ -25,7 +24,7 @@ const getContent = (signConfig = [], ratioX) => {
g.y = g.y + 20; g.y = g.y + 20;
// g.x = g.x + 20; // g.x = g.x + 20;
} }
if(g.type === 'image'){ if (g.type === 'image') {
g.w = Math.ceil(g.w * ratioX); g.w = Math.ceil(g.w * ratioX);
g.h = Math.ceil(g.h * ratioX); g.h = Math.ceil(g.h * ratioX);
} }
...@@ -35,7 +34,6 @@ const getContent = (signConfig = [], ratioX) => { ...@@ -35,7 +34,6 @@ const getContent = (signConfig = [], ratioX) => {
}); });
}; };
export default function PictureSignature({ export default function PictureSignature({
json, json,
disabled, disabled,
...@@ -45,18 +43,18 @@ export default function PictureSignature({ ...@@ -45,18 +43,18 @@ export default function PictureSignature({
form, form,
// fileInfo, // fileInfo,
...others ...others
}) { }) {
let imageRef = useRef(); let imageRef = useRef();
const [fileInfo, setFileInfo] = useState({...others?.fileInfo}); const [fileInfo, setFileInfo] = useState({ ...others?.fileInfo });
// const [fileInfo, setFileInfo] = useState(fakeFileInfo); // const [fileInfo, setFileInfo] = useState(fakeFileInfo);
const [openEdit, setOpenEdit] = useState(false); const [openEdit, setOpenEdit] = useState(false);
const [showModal, setShowModal] = useState(false); const [showModal, setShowModal] = useState(false);
const [otherProps, setOtherProps] = useState({}); const [otherProps, setOtherProps] = useState({});
const [imageInfo, setImageInfo] = useState(null); const [imageInfo, setImageInfo] = useState(null);
const changeShowModal = () => { const changeShowModal = () => {
if(!showModal){ if (!showModal) {
if (!imageInfo && !disabled) { if (!imageInfo && !disabled) {
zipImage(fileInfo.path, fileInfo.name, otherProps?.backgroundImageWidth).then((res) => { zipImage(fileInfo.path, fileInfo.name, otherProps?.backgroundImageWidth).then(res => {
let image = new Image(); //新建一个img标签(还没嵌入DOM节点) let image = new Image(); //新建一个img标签(还没嵌入DOM节点)
image.src = basicUrl + res; image.src = basicUrl + res;
image.onload = () => { image.onload = () => {
...@@ -83,7 +81,6 @@ export default function PictureSignature({ ...@@ -83,7 +81,6 @@ export default function PictureSignature({
imageRef.current = true; imageRef.current = true;
dragEventList(setOtherProps, otherProps); dragEventList(setOtherProps, otherProps);
} }
}, [otherProps]); }, [otherProps]);
useEffect(() => { useEffect(() => {
...@@ -100,21 +97,28 @@ export default function PictureSignature({ ...@@ -100,21 +97,28 @@ export default function PictureSignature({
} }
}, [json.otherProps]); }, [json.otherProps]);
const {ModalProps, signConfig, footerButtons, originButtons, backgroundImageWidth, saveSignConfigValue = ''} = otherProps; const {
ModalProps,
signConfig,
footerButtons,
originButtons,
backgroundImageWidth,
saveSignConfigValue = '',
showImageWidth = 1200,
} = otherProps;
const handleClickButton = (clickType) => { const handleClickButton = clickType => {
switch (clickType) { switch (clickType) {
case 'startEdit': // 开始签章 case 'startEdit': // 开始签章
// console.log(imageInfo); // console.log(imageInfo);
setOpenEdit(true); setOpenEdit(true);
break; break;
case 'confirm': // 确定 case 'confirm': // 确定
onChangeFile({ ...fileInfo }, imageIndex);
onChangeFile({...fileInfo}, imageIndex);
changeShowModal(); changeShowModal();
break; break;
case 'save': // 保存签章 case 'save': // 保存签章
let ratioX = backgroundImageWidth / 1200; // 本来是 1500 的 图片 宽度变成了 1200 高度变成了 1200/1500 * imageInfo.height; let ratioX = backgroundImageWidth / showImageWidth; // 本来是 1500 的 图片 宽度变成了 1200 高度变成了 1200/1500 * imageInfo.height;
// let ratioY = 1200 / backgroundImageWidth * imageInfo.height; // let ratioY = 1200 / backgroundImageWidth * imageInfo.height;
// console.log(ratioX); // console.log(ratioX);
// return ; // return ;
...@@ -122,33 +126,33 @@ export default function PictureSignature({ ...@@ -122,33 +126,33 @@ export default function PictureSignature({
apiRequest('/ImageLibApi/merge', { apiRequest('/ImageLibApi/merge', {
background: fileInfo?.path, background: fileInfo?.path,
content, content,
}).then((res) => { }).then(res => {
if(form && saveSignConfigValue){ if (form && saveSignConfigValue) {
form.setFieldsValue({ form.setFieldsValue({
[saveSignConfigValue]: content, [saveSignConfigValue]: content,
}) });
} }
if (res && res.path) { if (res && res.path) {
message.success('操作成功'); message.success('操作成功');
let newPath = res.path; let newPath = res.path;
fileInfo.originPath = fileInfo.path; fileInfo.originPath = fileInfo.path;
fileInfo.path = newPath; fileInfo.path = newPath;
setFileInfo({...fileInfo}); setFileInfo({ ...fileInfo });
setOpenEdit(false); setOpenEdit(false);
} }
}) });
break; break;
case 'restore': // 还原图片 case 'restore': // 还原图片
if (fileInfo.originPath) { if (fileInfo.originPath) {
fileInfo.path = fileInfo.originPath; fileInfo.path = fileInfo.originPath;
setFileInfo({...fileInfo}); setFileInfo({ ...fileInfo });
setOpenEdit(false); setOpenEdit(false);
} }
break; break;
default: default:
return true; return true;
} }
} };
const Footer = () => { const Footer = () => {
if (disabled) { if (disabled) {
...@@ -157,10 +161,11 @@ export default function PictureSignature({ ...@@ -157,10 +161,11 @@ export default function PictureSignature({
if (openEdit) { if (openEdit) {
return footerButtons.map(g => { return footerButtons.map(g => {
return ( return (
<Button type={g.type} <Button
type={g.type}
key={g.key} key={g.key}
onClick={() => { onClick={() => {
handleClickButton(g.clickType) handleClickButton(g.clickType);
}} }}
> >
{g.name} {g.name}
...@@ -170,10 +175,11 @@ export default function PictureSignature({ ...@@ -170,10 +175,11 @@ export default function PictureSignature({
} else { } else {
return originButtons.map(g => { return originButtons.map(g => {
return ( return (
<Button type={g.type} <Button
type={g.type}
key={g.key} key={g.key}
onClick={() => { onClick={() => {
handleClickButton(g.clickType) handleClickButton(g.clickType);
}} }}
> >
{g.name} {g.name}
...@@ -187,8 +193,7 @@ export default function PictureSignature({ ...@@ -187,8 +193,7 @@ export default function PictureSignature({
} }
// console.log(imageInfo, fileInfo); // console.log(imageInfo, fileInfo);
return ( return (
<div className={styles.outSideDiv} <div className={styles.outSideDiv}>
>
{fileInfo && fileInfo?.path && ( {fileInfo && fileInfo?.path && (
<img <img
className={styles.onePic} className={styles.onePic}
...@@ -205,9 +210,9 @@ export default function PictureSignature({ ...@@ -205,9 +210,9 @@ export default function PictureSignature({
onCancel={changeShowModal} onCancel={changeShowModal}
getContainer={false} getContainer={false}
className={styles.ModalClass} className={styles.ModalClass}
footer={<Footer/>} footer={<Footer />}
title={'图片签章'} title={'图片签章'}
width={'1250px'} width={showImageWidth + 50 + 'px'}
bodyStyle={{ bodyStyle={{
minHeight: '700px', minHeight: '700px',
overflow: 'auto', overflow: 'auto',
...@@ -223,8 +228,8 @@ export default function PictureSignature({ ...@@ -223,8 +228,8 @@ export default function PictureSignature({
className={styles.modalDiv} className={styles.modalDiv}
style={{ style={{
backgroundImage: `url(${basicUrl + fileInfo?.path})`, backgroundImage: `url(${basicUrl + fileInfo?.path})`,
width: 1200, width: showImageWidth,
height: (imageInfo.height / (imageInfo.width / 1200)), height: imageInfo.height / (imageInfo.width / showImageWidth),
}} }}
alt={'拖拽区域'} alt={'拖拽区域'}
draggable={false} draggable={false}
...@@ -243,14 +248,10 @@ export default function PictureSignature({ ...@@ -243,14 +248,10 @@ export default function PictureSignature({
left: g.x, left: g.x,
}} }}
> >
<div className={styles.draggableIcon} <div className={styles.draggableIcon} data-mes={g.key} draggable={true}>
data-mes={g.key}
draggable={true}>
<Icon type="scissor" /> <Icon type="scissor" />
</div> </div>
<ShowItem {...g} <ShowItem {...g} basicUrl={basicUrl} />
basicUrl={basicUrl}
/>
</div> </div>
); );
})} })}
...@@ -261,6 +262,9 @@ export default function PictureSignature({ ...@@ -261,6 +262,9 @@ export default function PictureSignature({
<img <img
src={basicUrl + fileInfo?.path} src={basicUrl + fileInfo?.path}
alt={fileInfo.name} alt={fileInfo.name}
style={{
width: `${showImageWidth}px`,
}}
/> />
</div> </div>
)} )}
...@@ -272,29 +276,31 @@ export default function PictureSignature({ ...@@ -272,29 +276,31 @@ export default function PictureSignature({
} }
export function SignArray(props) { export function SignArray(props) {
const {value, onChange, basicUrl, json, form} = props; const { value, onChange, basicUrl, json, form } = props;
// console.log(props); // console.log(props);
let files = value?.files || []; let files = value?.files || [];
const onChangeFile = (newFielInfo, imageIndex) => { const onChangeFile = (newFielInfo, imageIndex) => {
if(newFielInfo && newFielInfo.path){ if (newFielInfo && newFielInfo.path) {
files[imageIndex] = newFielInfo; files[imageIndex] = newFielInfo;
value.files = files; value.files = files;
onChange(value); onChange(value);
} }
} };
// console.log(value, '222222222222222') // console.log(value, '222222222222222')
return <div> return (
{ <div>
files.map((g, index) => { {files.map((g, index) => {
return <PictureSignature json={json} return (
<PictureSignature
json={json}
basicUrl={basicUrl} basicUrl={basicUrl}
fileInfo={g} fileInfo={g}
form={form} form={form}
imageIndex={index} imageIndex={index}
onChangeFile={onChangeFile} onChangeFile={onChangeFile}
/> />
}) );
} })}
</div> </div>
);
} }
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
place-items: center; place-items: center;
//min-height: 800px; //min-height: 800px;
img{ img{
width: 1200px; //width: 1200px;
height: auto; height: auto;
} }
} }
......
...@@ -6,6 +6,10 @@ import styles from './style.less'; ...@@ -6,6 +6,10 @@ import styles from './style.less';
import UploadComDiyForQnZy from '@/webPublic/one_stop_public/libs/UploadComDiyForQnZy'; import UploadComDiyForQnZy from '@/webPublic/one_stop_public/libs/UploadComDiyForQnZy';
import {getContainer} from "@/webPublic/one_stop_public/utils/utils"; import {getContainer} from "@/webPublic/one_stop_public/utils/utils";
message.config({
top: 300,
})
export function checkIsImage(path) { export function checkIsImage(path) {
if (!path) { if (!path) {
return false; return false;
...@@ -239,7 +243,16 @@ class UploadCom extends React.Component { ...@@ -239,7 +243,16 @@ class UploadCom extends React.Component {
onCancel={() => this.setState({previewVisible: false})} onCancel={() => this.setState({previewVisible: false})}
width={'90vw'} width={'90vw'}
> >
<img alt="example" style={{width: '100%', height: 'auto'}} src={previewImage}/> <div style={{
textAlign: 'center',
width: '100%',
}}>
<img alt="example" style={{
maxWidth: '1200px',
maxHeight: '700px',
height: 'auto',
}} src={previewImage}/>
</div>
</Modal> </Modal>
</div> </div>
); );
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论