Skip to content

W
WebPublic
提交 5b9097e7 authored 作者: ch's avatar ch
浏览文件
操作

Merge remote-tracking branch 'origin/master'

上级 8f3c68bc fccb60ca
显示空白字符变更
内嵌 并排
正在显示 包含 419 行增加 和 50 行删除
FormInsertDiy/AffairPage/component/TableSelect.js
浏览文件 @ 5b9097e7
......@@ -248,6 +248,7 @@ export default class TableSelect extends Component {
value: one[valueName],
});
}
return (
<Fragment>
{!showModal ? (
......
one_stop_public/libs/TableSelect.js
浏览文件 @ 5b9097e7
import React from 'react';
import { Button, message, Modal, Tag, Table } from 'antd';
import FormList from './formList/index';
import { connect } from 'dva';
import React from "react";
import { Button, message, Modal, Table, Tag } from "antd";
import FormList from "./formList/index";
import { connect } from "dva";
@connect(({ DataColumn, SqlManageEntity, loading }) => ({
DataColumn,
......@@ -74,7 +74,35 @@ export default class TableSelect extends React.Component {
selects[kk] = obj;
selects[kk].selectKey = kk;
}
if (!('value' in this.props)) {
this.setState({ selects });
}
this.triggerChange({ selects });
};
selectAll = () => {
let { selects } = this.state;
const { dataSource, json } = this.props;
let { valueName, optionType } = json;
const { list } = dataSource;
if (optionType == 'reference' && this.props.dataColumn.referenceObjId) {
valueName = this.props.dataColumn.referenceCodeName;
}
if (list && Array.isArray(list)) {
for (let item of list) {
let kk = item[valueName];
selects[kk] = item;
selects[kk].selectKey = kk;
}
}
if (!('value' in this.props)) {
this.setState({ selects });
}
this.triggerChange({ selects });
};
cancelAll = () => {
let selects = {};
if (!('value' in this.props)) {
this.setState({ selects });
}
......@@ -107,6 +135,31 @@ export default class TableSelect extends React.Component {
this.triggerChange({ visiable: false });
};
cancelOne = (record) => {
var { selects } = this.state;
const {
json: { isMultiple, optionType },
} = this.props;
let valueName = this.props.json.valueName;
if (optionType == 'reference' && this.props.dataColumn.referenceObjId) {
valueName = this.props.dataColumn.referenceCodeName;
}
const kk = record[valueName];
if (kk == null) {
message.error('指定的取值字段不存在或者值为空');
return;
}
if (selects[kk]) {
delete selects[kk];
}
if (!('value' in this.props)) {
this.setState({ selects });
}
this.triggerChange({ selects });
};
render() {
const {
json: { isMultiple, sql, optionType, showTable },
......@@ -114,6 +167,7 @@ export default class TableSelect extends React.Component {
sqlModel,
columns,
dataSource,
disabled,
} = this.props;
let { valueName, labelName } = this.props.json;
if (optionType == 'reference' && referenceObjId) {
......@@ -141,7 +195,12 @@ export default class TableSelect extends React.Component {
title: '操作',
render: (val, record) =>
keys.includes(record[valueName]) ? (
<span>已选择</span>
<a
onClick={() => {
this.cancelOne(record);
}}>
已选择
</a>
) : (
<a onClick={this.select.bind(this, record)}>选择</a>
),
......@@ -157,8 +216,8 @@ export default class TableSelect extends React.Component {
columns3.map((item, index) => {
if (index === columns3.length - 1) {
item.fixed = 'right';
item.width = 50;
allWidth += 50;
item.width = 90;
allWidth += 90;
return item;
}
if (index === columns3.length - 2) {
......@@ -175,6 +234,9 @@ export default class TableSelect extends React.Component {
});
}
console.log(this.props);
console.log(this.state);
console.log('-0000 TableSelect000');
return (
<div>
{Object.keys(selects).length > 0 ? (
......@@ -188,7 +250,7 @@ export default class TableSelect extends React.Component {
/>
) : (
Object.keys(selects).map((k) => (
<Tag key={k} closable onClose={this.remove.bind(this, k)}>
<Tag key={k} closable={!disabled} onClose={this.remove.bind(this, k)}>
{selects[k][labelName]}
</Tag>
))
......@@ -196,9 +258,12 @@ export default class TableSelect extends React.Component {
) : (
''
)}
{!disabled && (
<Button type="primary" onClick={this.open}>
选择
</Button>
)}
{visiable && (
<Modal
width={this.props.get === 'mobile' ? '100%' : '60%'}
......@@ -238,6 +303,25 @@ export default class TableSelect extends React.Component {
sql={sql}
/>
) : (
<>
{isMultiple && (
<>
{' '}
<Button
type={'primary'}
style={{ margin: '0 10px 10px 0' }}
onClick={this.selectAll}>
全选
</Button>
<Button
type={'primary'}
style={{ marginBottom: '10px' }}
onClick={this.cancelAll}>
取消全选
</Button>
</>
)}
<Table
rowKey={valueName}
size="small"
......@@ -245,6 +329,7 @@ export default class TableSelect extends React.Component {
columns={columns3}
scroll={{ x: allWidth }}
/>
</>
)}
</Modal>
)}
......
one_stop_public/libs/UploadCom.js
浏览文件 @ 5b9097e7
import React from 'react';
import { Tree, Upload, Icon, Button, message } from 'antd';
import { queryApiActionPath } from '../utils/queryConfig';
import config from '@/webPublic/one_stop_public/config';
import React from "react";
import { Button, Icon, message, Modal, Upload } from "antd";
import { queryApiActionPath } from "../utils/queryConfig";
import config from "@/webPublic/one_stop_public/config";
import styles from "./style.less";
import UploadComDiyForQnZy from "@/webPublic/one_stop_public/libs/UploadComDiyForQnZy";
export default class UploadCom extends React.Component {
export function checkIsImage(path){
if(!path){
return false;
}
let p = path.toLowerCase();
let find = ['.jpg','.png', '.jpeg', '.bmp', '.gif'].find((x) => {
return path.indexOf(x) > -1;
});
return !!find;
}
export default function index(props) {
if (window.location.href.indexOf("jy/geren/subsidy") > -1) {
return (<UploadComDiyForQnZy {...props} />);
} else {
return <UploadCom {...props} />;
}
}
class UploadCom extends React.Component {
constructor(props) {
super(props);
const value = props.value || {};
this.state = {
files: value.files,
previewVisible: false,
previewImage: ""
};
}
......@@ -19,23 +43,25 @@ export default class UploadCom extends React.Component {
onChange(Object.assign({}, this.state, changedValue));
}
};
componentWillReceiveProps(nextProps) {
// Should be a controlled component.
if ('value' in nextProps) {
if ("value" in nextProps) {
const value = nextProps.value;
this.setState(value);
}
}
changeUrl = (info) => {
if (info.file.status === 'done') {
if (info.file.status === "done") {
message.success(`${info.file.name} 上传成功`);
const files = this.state.files;
files.push({ path: info.file.response, name: info.file.name });
if (!('value' in this.props)) {
if (!("value" in this.props)) {
this.setState({ files });
}
this.triggerChange({ files });
} else if (info.file.status === 'error') {
} else if (info.file.status === "error") {
message.error(`${info.file.name} 上传失败`);
}
};
......@@ -47,43 +73,64 @@ export default class UploadCom extends React.Component {
break;
}
}
if (!('value' in this.props)) {
if (!("value" in this.props)) {
this.setState({ files });
}
this.triggerChange({ files });
};
render() {
const { files } = this.state;
const { isMultiple, accept, btnName } = this.props;
const { files, previewVisible, previewImage } = this.state;
const { isMultiple, accept, btnName, disabled } = this.props;
const props = {
name: 'file',
name: "file",
multiple: isMultiple,
accept: accept,
action: config.uploadUrl,
showUploadList: false,
onChange: this.changeUrl,
onChange: this.changeUrl
};
return (
<div>
{' '}
<Upload {...props}>
{" "}
<Upload {...props} disabled={disabled}>
{!disabled && (
<Button>
<Icon type="upload" />
{btnName ? btnName : '上传附件'}
{btnName ? btnName : "上传附件"}
</Button>
)}
</Upload>
<ul style={{ paddingLeft: 8 }}>
{files.map((f) => {
if ((f.path && f.path.indexOf('.png') != -1) || f.path.indexOf('.jpg') != -1) {
<ul style={{ paddingLeft: 8, display: "flex" }}>
{(files || []).map((f) => {
if (f.path && checkIsImage(f.path)) {
return (
<li key={f.path}>
<img style={{ width: 100, height: 100 }} src={queryApiActionPath() + f.path} />
<li key={f.path} className={styles.preview_img}>
<div className={styles.preview_div}>
<img
style={{ width: 150, height: 'auto' }}
className={styles.img}
src={queryApiActionPath() + f.path}
/>
<div
className={styles.mask}
onClick={() => {
// window.open(queryApiActionPath() + f.path);
this.setState({
previewVisible: true,
previewImage: queryApiActionPath() + f.path
});
}}>
<Icon type="eye" className={styles.icon_eye} />
</div>
</div>
{!disabled && (
<Icon
style={{ marginLeft: 10 }}
type="delete"
onClick={this.remove.bind(this, f.path)}
/>
)}
</li>
);
}
......@@ -91,16 +138,26 @@ export default class UploadCom extends React.Component {
<li key={f.path}>
<a target="_blank" key={f.path} href={queryApiActionPath() + f.path}>
{f.name}
</a>{' '}
</a>{" "}
{!disabled && (
<Icon
style={{ marginLeft: 10 }}
type="delete"
onClick={this.remove.bind(this, f.path)}
/>
)}
</li>
);
})}
</ul>
<Modal
visible={previewVisible}
footer={null}
onCancel={() => this.setState({ previewVisible: false })}
width={'90vw'}
>
<img alt="example" style={{ width: "100%", height:'auto' }} src={previewImage} />
</Modal>
</div>
);
}
......
one_stop_public/libs/UploadComDiyForQnZy.js 0 → 100644
浏览文件 @ 5b9097e7
import React from "react";
import { Button, Icon, message, Modal, Upload } from "antd";
import { queryApiActionPath } from "../utils/queryConfig";
import config from "@/webPublic/one_stop_public/config";
import styles from "./style.less";
import { checkIsImage } from "./UploadCom";
// 为黔南职院单独写的 上传组件 用于 bug 20576 个人就业信息/求职创业补贴申报，201801010006 119242 上传图片加限制，跟签约派遣上传图片加限制一样
// 后续考虑修改 一站式组件 让组件支持所有功能
export default class UploadComDiyForQnZy extends React.Component {
constructor(props) {
super(props);
const value = props.value || {};
this.state = {
files: value.files,
previewVisible: false,
previewImage: ""
};
}
//图片上传之前进行判断
beforeUpload = (file) => {
return this.isSize(file).then((res) => {
message.info("正在上传中,请等待");
return true;
});
};
//检测尺寸
isSize = (file) => {
return new Promise((resolve, reject) => {
let width = 1080; //宽高限制为1080 * 1080 原来为2400 * 2400
let height = 1080;
let _URL = window.URL || window.webkitURL;
let img = new Image();
img.onload = function() {
let valid = img.width >= width && img.height >= height;
valid ? resolve() : reject();
};
img.src = _URL.createObjectURL(file);
}).then(() => {
return file;
},
() => {
message.error(file.name + "图片尺寸不符合要求，需要上传高清图像 1080像素及以上,请修改后重新上传！");
return Promise.reject();
}
);
};
triggerChange = (changedValue) => {
// Should provide an event to pass value to Form.
const onChange = this.props.onChange;
if (onChange) {
onChange(Object.assign({}, this.state, changedValue));
}
};
componentWillReceiveProps(nextProps) {
// Should be a controlled component.
if ("value" in nextProps) {
const value = nextProps.value;
this.setState(value);
}
}
changeUrl = (info) => {
if (info.file.status === "done") {
message.success(`${info.file.name} 上传成功`);
const files = this.state.files;
files.push({ path: info.file.response, name: info.file.name });
if (!("value" in this.props)) {
this.setState({ files });
}
this.triggerChange({ files });
} else if (info.file.status === "error") {
message.error(`${info.file.name} 上传失败`);
}
};
remove = (path) => {
const files = this.state.files;
for (var i = 0; i < files.length; i++) {
if (files[i].path == path) {
files.splice(i, 1);
break;
}
}
if (!("value" in this.props)) {
this.setState({ files });
}
this.triggerChange({ files });
};
render() {
const { files, previewVisible, previewImage } = this.state;
const { isMultiple, accept, btnName, disabled } = this.props;
const props = {
name: "file",
multiple: isMultiple,
accept: accept,
action: config.uploadUrl,
showUploadList: false,
onChange: this.changeUrl,
beforeUpload: this.beforeUpload
};
return (
<div>
{" "}
<Upload {...props} disabled={disabled}>
{!disabled && (
<>
<Button>
<Icon type="upload" />
{btnName ? btnName : "上传附件"}
</Button>
<div>
（注：必须上传高清扫描件,图像高至少是1080px，宽至少是1080px）
</div>
</>
)}
</Upload>
<ul style={{ paddingLeft: 8, display: "flex" }}>
{(files || []).map((f) => {
if (f.path && checkIsImage(f.path)) {
return (
<li key={f.path} className={styles.preview_img}>
<div className={styles.preview_div}>
<img
style={{ width: 100, height: 100 }}
className={styles.img}
src={queryApiActionPath() + f.path}
/>
<div
className={styles.mask}
onClick={() => {
// window.open(queryApiActionPath() + f.path);
this.setState({
previewVisible: true,
previewImage: queryApiActionPath() + f.path
});
}}>
<Icon type="eye" className={styles.icon_eye} />
</div>
</div>
{!disabled && (
<Icon
style={{ marginLeft: 10 }}
type="delete"
onClick={this.remove.bind(this, f.path)}
/>
)}
</li>
);
}
return (
<li key={f.path}>
<a target="_blank" key={f.path} href={queryApiActionPath() + f.path}>
{f.name}
</a>{" "}
{!disabled && (
<Icon
style={{ marginLeft: 10 }}
type="delete"
onClick={this.remove.bind(this, f.path)}
/>
)}
</li>
);
})}
</ul>
<Modal
visible={previewVisible}
footer={null}
width={'90vw'}
onCancel={() => this.setState({ previewVisible: false })}>
<img alt="example" style={{ width: "100%" }} src={previewImage} />
</Modal>
</div>
);
}
}
one_stop_public/libs/formList/TreeList.js
浏览文件 @ 5b9097e7
......@@ -828,7 +828,7 @@ class TreeList extends React.Component {
);
};
getItem = (isQuery, form, item, isAdd, formData, labelCol, wrapperCol) => {
const { groups } = this.state;
const { groups, isView } = this.state;
if (item.isPrimaryKey) {
if (isAdd) {
return <></>;
......@@ -893,7 +893,7 @@ class TreeList extends React.Component {
? JSON.parse(formData[item.name])
: null,
rules: [{ required: !item.isNull }],
})(<UploadCom />)}
})(<UploadCom disabled={isView} />)}
</FormItem>
);
} else if (isQuery && item.isGroupQuery != null && item.isGroupQuery) {
......
one_stop_public/libs/style.less
浏览文件 @ 5b9097e7
......@@ -237,3 +237,33 @@
visibility: hidden;
}
}
.preview_img {
margin: 5px;
display: flex;
align-items: center;
.preview_div {
position: relative;
&:hover {
.mask {
display: block;
}
}
.mask {
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .5);
position: absolute;
top: 0;
left: 0;
display: none;
.icon_eye {
position: absolute;
top: 50%;
left: 50%;
color: #fff;
transform: translate(-50%, -50%);
}
}
}
}
one_stop_public/tableCompon/index.jsx
浏览文件 @ 5b9097e7
......@@ -7,28 +7,28 @@ import React, { Component } from 'react';
import md5 from 'js-md5';
import FormModal from './FormModal';
import {
message,
Icon,
Input,
InputNumber,
Button,
Cascader,
Checkbox,
Col,
DatePicker,
Form,
Icon,
Input,
InputNumber,
message,
Radio,
Switch,
Row,
Col,
Select,
Form,
Switch,
Table,
Cascader,
} from 'antd';
import UUID from 'react-native-uuid';
import QRCode from 'qrcode.react';
import { EditorState, Editor } from 'draft-js';
import { Editor } from 'draft-js';
import MyBlockRenderer from '../App/MyBlockRender';
import CronEditor from 'antd-cron-editor';
import { List as MobileList, Flex, Card, Switch as MobileSwitch } from 'antd-mobile';
import { Card, Flex, List as MobileList, Switch as MobileSwitch } from 'antd-mobile';
import ReactEcharts from 'echarts-for-react';
import ZdyTable from '../Table/index';
import { connect } from 'dva';
......@@ -45,7 +45,7 @@ import router from 'umi/router';
import TableList from '../libs/TableList';
import styles from './style.less';
import config from '@/webPublic/one_stop_public/config';
import { isEmpty, isNaN, cloneDeep } from 'lodash';
import { cloneDeep, isEmpty, isNaN } from 'lodash';
import { queryApiActionPath } from '../utils/queryConfig';
import { extend } from 'umi-request';
import Highlighter from 'react-highlight-words';
......@@ -137,6 +137,7 @@ export default class tableCom extends Component {
};
this.excludeKeys = ['defaultValues', ''];
}
closeModal = (fk, callback) => {
const { dispatch } = this.props;
const x = this.props.DataColumn.isShowModal;
......@@ -903,18 +904,26 @@ export default class tableCom extends Component {
mode: 'cors',
...options,
});
if (url.indexOf('localhost') > -1) {
url = url.replace(window.location.origin, window.specialImportantSystemConfig.gateWayPort);
}
umiRequest(url, {
data: requestParams,
method: method,
requestType: 'form',
}).then((data) => {
// if (!data || !Array.isArray(data)) {
// data = [];
// }
const { reqUrls } = this.state;
if(reqUrls && reqUrls[url]){
reqUrls[url].data = data;
}
this.setState({ res: data, reqUrls }, () => {
if (callback) {
if (json.optionType && json.optionType == 'func') {
const res = callback(data);
// console.error(res)
if (res != null && !(typeof res === 'function')) {
this.setState({ options: res, selectDis: false }, () => {
if (orgCallback) orgCallback();
......@@ -2859,6 +2868,7 @@ export default class tableCom extends Component {
<TableSelect
get={get}
json={json}
disabled={!isEdit}
dataColumn={dataColumn}
columns={this.state.columns}
dataSource={this.state.dataSource}
......@@ -3011,6 +3021,8 @@ export default class tableCom extends Component {
if (initValue != null && !isEmpty(initValue.files)) {
files = initValue.files;
}
cm = getFieldDecorator(dataColumn.base52, {
initialValue: { files: files },
rules: [
......@@ -3027,7 +3039,11 @@ export default class tableCom extends Component {
},
],
})(
<UploadCom isMultiple={json.isMultiple} accept={json.accept} btnName={json.btnName} />,
<UploadCom isMultiple={json.isMultiple}
accept={json.accept}
btnName={json.btnName}
disabled={disabled || isPreview}
/>,
);
if (
get === 'mobile' &&
......@@ -3115,9 +3131,6 @@ export default class tableCom extends Component {
}
break;
case 'ChildForm':
// console.log(dataColumn.base52, '----key-ChildForm--'); // KUSyCzEhdCJ
// console.log(JSON.stringify(this.props.form.getFieldsValue()), '----formValue----');
// console.log(JSON.stringify(initValue)); // undefined
cm = getFieldDecorator(dataColumn.base52, { initialValue: initValue || {} })(
<ChildForm
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论