liang.cheng
/
trunk
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

快捷搜索

This commit is contained in:
Chengliang 2023-08-09 14:54:37 +08:00
parent 37e6757110
commit 72e58d764c
8 changed files with 690 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
pc4mobx/organization/apis/quickSearch.js Normal file
View File

@ -0,0 +1,19 @@
import {
WeaTools
} from 'ecCom';
export const saveFieldDefinedInfo = (moduleName,params) => {
return fetch(`/api/bs/hrmorganization/fieldDefined/${moduleName}/saveFields`, {
method: 'POST',
mode: 'cors',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(params)
})
}
export const getQuickSearchInfo = (params) => WeaTools.callApi(`/api/cube/list/getQuickSearchInfo`, 'GET', params);
export const getQuickSearchDetailInfo = (params) => WeaTools.callApi(`/api/cube/list/getQuickSearchDetailInfo`, 'GET', params);

249
pc4mobx/organization/components/fieldDefinedSet/QuickSearch.js Normal file
View File

@ -0,0 +1,249 @@
import React from 'react'
import * as mobx from 'mobx'
import {
inject,
observer
} from 'mobx-react'
import {
WeaTop, WeaFormItem, WeaTable, WeaRightMenu,
WeaNewScroll, WeaSearchGroup, WeaLocaleProvider, WeaTab
} from 'ecCom'
import {
Row, Col, Button, Modal, message, Input, Dropdown, Icon, Menu
} from 'antd'
import { WeaSwitch } from 'comsMobx'
import {
i18n
} from '../../public/i18n';
import QuickSearchTableEdit from './QuickSearchTableEdit';
import QuickSearchDetail from './QuickSearchDetail';
const getLabel = WeaLocaleProvider.getLabel;
const toJS = mobx.toJS;
const confirm = Modal.confirm;
@inject('quickSearch')
@observer
export default class QuickSearch extends React.Component {
constructor(props) {
super(props);
}
componentWillMount() {
}
componentDidMount() {
const {
quickSearch
} = this.props;
quickSearch.initList();
}
componentWillUnmount() {
}
componentWillReceiveProps(nextProps) {
const {
quickSearch
} = this.props;
if (this.props.location.key !== nextProps.location.key) {
quickSearch.initList();
}
}
getDropMenuDatas() {
const {
quickSearch
} = this.props,{
rightMenu
} = quickSearch
let menus = [];
toJS(rightMenu).map((item, index) => {
let obj = {
key: item.menuFun,
icon: <i className={`${item.menuIcon}`} />,
content: item.menuName,
}
menus.push(obj);
})
return menus;
}
getTopMenuBtns() {
const {
quickSearch
} = this.props,{
topMenu
} = quickSearch
let btns = [];
topMenu.map((item, i) => {
btns.push(<Button type='primary' onClick={() => {this[item.menuFun] && this[item.menuFun]();}}>{item.menuName}</Button>);
});
return btns;
}
save = () => {
const {
quickSearch
} = this.props;
quickSearch.saveQuickSearchInfo();
}
getFormItems = () => {
const { quickSearch } = this.props;
const { quickSearchFields, quickSearchForm } = quickSearch;
const arr = [];
const formParams = quickSearchForm.getFormParams();
const { isFormInit } = quickSearchForm;
isFormInit && quickSearchFields.map((field, index) => {
arr.push(<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@4cc308@${index}`} offset={1}>
<div style={{ marginTop: 20 }}>
<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@u6ex85@${index}`}
label={`${field.label}`}
labelCol={{ span: `${field.labelcol}` }}
wrapperCol={{ span: `${field.fieldcol}` }}>
{<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@p7d3td@${index}`} fieldConfig={field} form={quickSearchForm} formParams={formParams} />}
</WeaFormItem>
</div>
</Col>)
})
return <Row>{arr}</Row>
}
getSearchButton = () => {
return [
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@7xw5i9@addRow`} type="primary" shape="circle" title={getLabel(611, '添加')} size="small" disabled={0} onClick={() => {
this.addRow();
}}><i className="anticon anticon-plus"></i></Button>),
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@lzrtmm@delRow`} shape="circle" title={getLabel(126371, '删除')} size="small" onClick={() => {
this.delRow();
}} ><i className="anticon anticon-minus"></i></Button>
]
}
addRow = () => {
// const { CubeListStore } = this.props;
// let { quickSearchData } = CubeListStore;
// let datas = quickSearchData.datas;
// if(datas.length>=6){
// message.error(getLabel('387795',"最多只能添加6项"));
// return;
// }
// let time = new Date().getTime();
// let type = quickSearchData.options.length > 0 ? quickSearchData.options[0].type : '2';
// let fieldid = quickSearchData.options.length > 0 ? quickSearchData.options[0].key : '';
// let customname = quickSearchData.options.length > 0 ? quickSearchData.options[0].showname : '';
// let isdetailtable = quickSearchData.options.length > 0 ? quickSearchData.options[0].isdetailtable : '0';
// let obj = {
// key: "new_" + time,
// fieldid: fieldid,
// customname: customname,
// range: type == '1' ? getLabel('387636', "内容自定义") : getLabel('387637', "字段本身值"),
// condition: type == '1' ? getLabel('68', "设置") : '',
// orderid: 0,
// type: type,
// isdetailtable: isdetailtable
// }
// datas = toJS(datas);
// datas.push(obj);
// CubeListStore.setQuickSearchData(datas);
}
delRow = () => {
// const { CubeListStore } = this.props;
// let { qcSelectedRowKeys } = CubeListStore;
// if (qcSelectedRowKeys.length <= 0) {
// message.error(getLabel(22346, '请选择要删除的信息', 'label'));
// return;
// }
// const that = this;
// Modal.confirm({
// title: getLabel(83601, '您确认要删除选中的记录吗？'),
// onOk() {
// let { datas } = CubeListStore.quickSearchData;
// datas = toJS(datas);
// datas = that.delFromArray(datas, qcSelectedRowKeys);
// CubeListStore.qcSelectedRowKeys = [];
// CubeListStore.setQuickSearchData(datas);
// },
// onCancel() {},
// });
}
onSelectChange = (keys, rows) => {
let keyarr = [];
rows.map(row => {
keyarr.push(row.key);
});
const { quickSearch } = this.props;
quickSearch.qcSelectedRowKeys = keyarr;
}
onChange = (data) => {
const { quickSearch } = this.props;
quickSearch.setQuickSearchData(data);
}
render() {
const { quickSearch: store } = this.props;
const { qcSelectedRowKeys } = store;
const rowSelection = {
selectedRowKeys: qcSelectedRowKeys,
onChange: this.onSelectChange,
}
return (
<div ref='page' style={{ height: '100%' }}>
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@k6oc4u`}
datas={this.getDropMenuDatas()}
onClick={key => {this[key] && this[key]()}}
>
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@bj98s7`}
title={"快捷搜索自定义"}
icon={<i className='icon-coms-hrm' />}
iconBgcolor='#217346'
loading={true}
buttons={this.getTopMenuBtns()}
showDropIcon={true}
dropMenuDatas={this.getDropMenuDatas()}
onDropMenuClick={(key) => {this[key] && this[key]()}}
>
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@weabdm`}>
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@ddy3vv`} needTigger={false} showGroup={true} title={getLabel(82751, "基础设置")}>
{this.getFormItems()}
</WeaSearchGroup>
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@s8pupj`} needTigger={false} showGroup={true} title={getLabel(384165, "条件字段")}>
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@sxnhjh`}
keyParam="key" //主键
buttons={this.getSearchButton()}
/>
<QuickSearchTableEdit ecId={`${this && this.props && this.props.ecId || ''}_QuickSearchTableEdit@1xviqu`}
datas={toJS(store.quickSearchData.datas)}
options={toJS(store.quickSearchData.options)}
onChange={this.onChange}
rowSelection={rowSelection}
ListProps={this.props}
/>
</WeaSearchGroup>
</WeaNewScroll>
<QuickSearchDetail ecId={`${this && this.props && this.props.ecId || ''}_QuickSearchDetail@plu05u`} {...this.props}/>
</WeaTop>
</WeaRightMenu>
</div>
)
}
}

0
pc4mobx/organization/components/fieldDefinedSet/QuickSearchDetail.js Normal file
View File

233
pc4mobx/organization/components/fieldDefinedSet/QuickSearchTableEdit.js Normal file
View File

@ -0,0 +1,233 @@
import React from 'react'
import * as mobx from 'mobx'
import {
inject,
observer
} from 'mobx-react'
import {
WeaTable, WeaLocaleProvider, WeaSelect, WeaInput, WeaInputNumber
} from 'ecCom'
import {
Row, Col, Button, Modal, message, Input, Dropdown, Icon, Menu
} from 'antd'
import {
i18n
} from '../../public/i18n';
const getLabel = WeaLocaleProvider.getLabel;
import jQuery from "jquery";
const toJS = mobx.toJS;
export default class QuickSearchTableEdit extends React.Component {
/**========================table字段类型=====================*/
getColumns = () => {
let columnArray = [
{
title: getLabel(261, "字段"), dataIndex: "fieldid", key: "fieldid", width: "18%",
com: [{ label: '', type: 'SELECT', isLink: true, key: 'fieldid', options: [] }]
},
{
title: getLabel(195, "名称"), dataIndex: "customname", key: "customname", width: "18%",
com: [{
label: '', type: 'INPUT', key: 'customname', viewAttr: 2, otherParams: { isBase64: true, inputType: "multilang" }
}]
},
{
title: getLabel(389518, "查询范围"), dataIndex: "range", key: "range", width: "8%",
com: [{ label: '', type: 'INPUT', key: 'range', viewAttr: 1 }]
},
{
title: getLabel(387588, "内容自定义条件"), dataIndex: "condition", key: "condition", width: "15%",
com: [{ label: '', type: 'BUTTON', key: 'condition', viewAttr: 1 }]
}, {
title: getLabel(21657, "显示模式"), dataIndex: "showmodel", key: "showmodel", width: "15%",
com: [{
label: '',
type: 'SELECT',
key: 'showmodel',
viewAttr: 2,
options: [{ key: '0', showname: getLabel(149, '默认') }, { key: '1', showname: getLabel(19852, '平铺') },]
}]
}
];
columnArray = columnArray.map((col) => {
let _col = { ...col };
_col.render = (text, record, index) => {
return this.getColRender(_col, text, record, index);
}
return _col
});
return columnArray;
}
getColRender = (_col, text, record, index) => {
const {
quickSearch: store
} = this.props;
const { com } = _col;
let _com = [];
com.map((c, idn) => {
if (typeof c.props === 'object') {
_com.push(<span></span>);
} else {
const { key, isLink = false, viewAttr = 2, type = 'INPUT', width, otherParams = {}, detailtype = 1, options = [] } = c;
const _type = type.toUpperCase();
record.range = record.type == '1' ? getLabel('387636', "内容自定义") : getLabel('387637', "字段本身值");
record.condition = record.type == '1' ? getLabel('68', "设置") : '';
if (_type === 'INPUT') {
_com.push(<WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@gedh14@${idn}`}
style={{ minWidth: 60 }}
value={record[key]}
viewAttr={viewAttr}
onChange={(value) => this.onEdit(record, index, key, value)}
{...otherParams}
length={100}
/>)
} else if (_type === 'BUTTON') {
_com.push(<a onClick={() => this.onClick(record)}
style={{ width, display: 'inline-block' }}>{record[key]}</a>);
} else if (_type === 'INPUTNUMBER') {
_com.push(<WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@9qqytl@${idn}`}
value={record[key]}
style={{ width, display: 'inline-block' }}
viewAttr={viewAttr}
onChange={(value) => this.onEdit(record, index, key, value)}
{...otherParams}
/>)
} else if (_type === 'SELECT') {
if (isLink) {
_com.push(<WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@h3f5u2@${idn}`}
style={{ width, display: 'inline-block', minWidth: 173 }}
options={toJS(this.props.options)}
viewAttr={viewAttr}
value={record[key]}
detailtype={detailtype}
onChange={(value) => {
this.onEdit(record, index, key, value)
}}
showSearch
filterOption={(inputValue, option) => this.selectFilterOption(inputValue, option)}
/>);
}else if (key === 'showmodel') {//可以设置平铺的类型
const opt = this.props.options.filter(item => item.fieldid === record.fieldid);
const isShowModel = opt[0] ? opt[0].isShowModel : false;
if (isShowModel) {
if (!record[key]) {
record[key] = '0'
}
_com.push(<WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@ffcq2z@${idn}`}
style={{ width, display: 'inline-block' }}
options={options}
viewAttr={viewAttr}
value={record[key]}
detailtype={detailtype}
onChange={(value) => {
this.onEdit(record, index, key, value)
}}
filterOption={(inputValue, option) => selectFilterOption(inputValue, option)}
/>);
}
}
}
}
});
return (
<div className="cube-quicksearch-list-form">{_com}</div>
)
};
onDropChange = (data) => {
typeof this.props.onChange === 'function' && this.props.onChange(data);
}
onClick = (record) => {
const { ListProps } = this.props;
const { quickSearch } = ListProps;
let key = record.key;
if (key.indexOf("new") >= 0 || record.fieldid != record.orifieldid) {
message.error(getLabel(82228, "请先保存再设置条件"));
return;
}
quickSearch.openQuickSearchDetail(record);
};
onEdit = (record, index, key, value, name, data) => {
const { datas } = this.props;
let _datas = [...datas];
_datas[index][key] = value;
if (key == 'fieldid') {
let opt = this.getType(value);
if (opt != null) {
_datas[index].type = opt['type'];
_datas[index].customname = opt['showname'];
_datas[index].range = _datas[index].type == '1' ? getLabel('387636', "内容自定义") : getLabel('387637', "字段本身值");
_datas[index].condition = _datas[index].type == '1' ? getLabel('68', "设置") : '';
_datas[index].isdetailtable = opt['isdetailtable'];
}
}
typeof this.props.onChange === 'function' && this.props.onChange(_datas);
}
getType = (key) => {
let option = null;
this.props.options.map(f => {
if (f.key == key) {
option = f;
}
});
return option;
}
/**
* 根据选择框的名称，搜索过滤选项
* @param inputValue
* @param option
*/
selectFilterOption = (inputValue, option) => {
if (inputValue != "") {
const { children } = option["props"];
if (children) {
if ((typeof children) == "string") {
return children.toLowerCase().indexOf(inputValue.toLowerCase()) != -1;
} else if ((typeof children) == "object" && children.length > 0) {
const childrenNew = children[0]["props"]["children"];
if (childrenNew) {
return childrenNew.toLowerCase().indexOf(inputValue.toLowerCase()) != -1;
} else {
return false;
}
} else {
const childrenNew = children["props"]["children"];
if (childrenNew) {
return childrenNew.toLowerCase().indexOf(inputValue.toLowerCase()) != -1;
} else {
return false;
}
}
} else {
return false;
}
}
return true;
}
render() {
const { datas, rowSelection } = this.props;
return (
<div className="wev-cube-table-inner-warp">
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@ofga8g`}
rowSelection={rowSelection}
columns={this.getColumns()}
dataSource={datas}
pagination={false}
draggable={true}
onDrop={this.onDropChange}
/>
</div>
)
}
}

14
pc4mobx/organization/components/postionrank/RankScheme.js
View File

@ -51,7 +51,7 @@ export default class RankScheme extends React.Component {
}
componentDidMount() {
this.init();
this.init();
}
componentWillUnmount() {
@ -201,8 +201,8 @@ export default class RankScheme extends React.Component {
const btn = [
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@bx87i8`} type="primary" onClick={() => {
rankScheme.getTableInfo(); rankScheme.setPanelStatus(false)
}}>{i18n.button.search()}</Button>),
rankScheme.getTableInfo(); rankScheme.setPanelStatus(false)
}}>{i18n.button.search()}</Button>),
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@218ju6`} onClick={() => form2.reset()}>{i18n.button.reset()}</Button>),
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@5u9mfz`} onClick={() => rankScheme.setPanelStatus(false)}>{i18n.button.cancel()}</Button>),
];
@ -260,7 +260,7 @@ export default class RankScheme extends React.Component {
return false;
},
});
}
onOperatesClick(record, rowIndex, operate) {
@ -383,11 +383,11 @@ export default class RankScheme extends React.Component {
} = rankScheme;
if (hasRight === false) {
return renderNoright();
return renderNoright();
}
return (
hasRight && <div ref='page' style={{ height: '100%' }}>
hasRight && <div ref='page' style={{ height: '100%' }}>
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@k6oc4u`}
datas={this.getDropMenuDatas()}
onClick={key => this.handleMenuClick(key)}
@ -438,6 +438,6 @@ export default class RankScheme extends React.Component {
onCancel={() => rankScheme.setVisible(false)}
/>
</div>
)
)
}
}

5
pc4mobx/organization/index.js
View File

@ -32,7 +32,8 @@ import ResourceBasicInfo from "./components/resource/ResourceBasicInfo";
import ResourceCard from "./components/resource/ResourceCard";
import ManagerDetach from "./components/detach/ManagerDetach";
import ColumnSetting from "./components/columnSetting";
import PersonnelResume from "./components/resource/PersonnelResume"
import PersonnelResume from "./components/resource/PersonnelResume";
import QuickSearch from "./components/fieldDefinedSet/QuickSearch";
import stores from "./stores";
import "./style/index";
@ -98,7 +99,7 @@ const Routes = (
<Route key="managerDetach" path="managerDetach" component={ManagerDetach} />
<Route key="columnSetting" path="columnSetting" component={ColumnSetting} />
<Route key="personnelResume" path="personnelResume/:id" component={PersonnelResume} />
<Route key="quickSearch" path="quickSearch" component={QuickSearch} />
</Route>
);

6
pc4mobx/organization/stores/index.js
View File

@ -26,7 +26,8 @@ import {ImportDialogStore} from "./importDialog";
import {ResourceCardStore} from "./resourceCard";
import {ManagerDetachStore} from "./managerDetach";
import {ColumnSetting} from './columnSetting';
import {PersonnelResumeStore} from './personnelResume'
import {PersonnelResumeStore} from './personnelResume';
import { QuickSearchStore } from "./quickSearch";
module.exports = {
@ -58,5 +59,6 @@ module.exports = {
resourceCard:new ResourceCardStore(),
managerDetach: new ManagerDetachStore(),
columnSetting: new ColumnSetting(),
personnelResume:new PersonnelResumeStore()
personnelResume:new PersonnelResumeStore(),
quickSearch:new QuickSearchStore()
};

175
pc4mobx/organization/stores/quickSearch.js Normal file
View File

@ -0,0 +1,175 @@
import {
observable,
action
} from 'mobx';
import * as mobx from 'mobx';
import * as API from '../apis/quickSearch';
import {
WeaForm
} from 'comsMobx';
import {
Modal,
message,
} from 'antd'
import {
i18n
} from '../public/i18n';
import { WeaLocaleProvider } from 'ecCom';
const toJS = mobx.toJS;
const getLabel = WeaLocaleProvider.getLabel;
export class QuickSearchStore {
@observable quickSearchForm = new WeaForm();
@observable qcSelectedRowKeys = [];
@observable quickSearchData = {
datas: [],//表格记录record
setting: {},
options: [],
};
@observable quickSearchDetailVisable = false;
@observable qcData = { qcType: '', cid: '', fieldid: '' };//快速查询明细type
@observable quickSearchDetailData = [];
@observable precision = 0;
/**** ==============quickSearchForm ===============*/
@observable quickSearchFields = [
{
domkey: ['isquicksearch'],
conditionType: 'SWITCH',
label: getLabel('387493', "快捷搜索条件"),
labelcol: 5,
fieldcol: 19,
viewAttr: 3,
}
]
@action("初始化页面") initList = () => {
this.quickSearchForm.initFormFields([{ items: this.quickSearchFields.slice() }]);
this.getQuickSearchInfo();
}
@action clearQuciSearchData = () => {
this.quickSearchData.setting = {};
this.quickSearchData.datas = [];
this.quickSearchData.options = [];
}
@action("数据获取") getQuickSearchInfo = () => {
this.clearQuciSearchData();
API.getQuickSearchInfo({ customid: 382 }).then(action(({ status, errorCode, error, setting, datas, options, groupidOptions }) => {
if (status == '1') {
this.quickSearchData.setting = setting;
this.quickSearchData.datas = datas.map(d => {
return { ...d, visible: false }
});
this.quickSearchData.groupidOptions = groupidOptions;
this.quickSearchData.options = options;
this.quickSearchForm.updateFields({
isquicksearch: setting.isquicksearch,
});
} else {
message.error(`[${getLabel(127353, "错误") + errorCode}]:${error}`);
}
}));
}
@action("保存页面") saveQuickSearchInfo = (params) => {
// let datas = this.quickSearchData.datas;
// datas.map((data, index) => {
// data.orderid = index
// });
// let formparm = this.quickSearchForm.getFormParams();
// if (!this.checkQuickSearchData()) {
// message.error(getLabel('387954', "条件字段不能重复"));
// return;
// }
// let id = this.quickSearchData.setting.id;
// if (id == null) {
// return;
// }
// if (params) {
// formparm = params;
// }
// API.saveQuickSearchInfo({
// id: id,
// customid: this.customid,
// data: JSON.stringify(datas), ...formparm
// }).then(({ status, errorCode, error, setting, datas, options }: any) => {
// if (status == '1') {
// message.success(getLabel(83551, '保存成功!'));
// this.qcSelectedRowKeys = [];
// this.getQuickSearchInfo();
// } else {
// message.error(`[${getLabel(127353, "错误") + errorCode}]:${error}`);
// }
// });
// this.quickSearchData.setting.id = null;
}
@action setQuickSearchData = (datas) => {
this.quickSearchData.datas = datas;
}
/**============================quickdetail===================== */
@action("设置") openQuickSearchDetail = (record) => {
this.quickSearchDetailVisable = true;
this.qcData.qcType = record.type;
this.qcData.cid = record.cid;
this.qcData.fieldid = record.fieldid;
this.getQuickSearchDetailInfo(record.cid);
}
@action getQuickSearchDetailInfo = (cid) => {
API.getQuickSearchDetailInfo({ cid: cid }).then(({ status, errorCode, error, setting, datas, precision }) => {
if (status == '1') {
this.quickSearchDetailData = datas;
this.precision = precision;
} else {
message.error(`[${getLabel(127353, "错误") + errorCode}]:${error}`);
}
});
}
/**===========================buttons=========================== */
rightMenu = [
{
"isBatch": "0",
"isTop": "1",
"menuFun": "save",
"menuIcon": "icon-coms-Preservation",
"menuName": "保存",
"type": "BTN_save"
},
// {
// "isBatch": "0",
// "isTop": "0",
// "menuFun": "log",
// "menuIcon": "icon-coms-Print-log",
// "menuName": "日志",
// "type": "BTN_log"
// }
];
topMenu = [
{
"isBatch": "1",
"isTop": "1",
"menuFun": "save",
"menuIcon": "icon-coms-Preservation",
"menuName": "保存",
"type": "BTN_save"
}
]
}