组织架构快照0

pc4mobx/organization/apis/snapshot.js

@@ -0,0 +1,7 @@
+import {
+    WeaTools
+} from 'ecCom'
+
+export const getSearchList = (date) => {
+    return WeaTools.callApi(`/api/bs/hrmorganization/danikorresource/listPage?syncDate=${date}`, 'GET');
+}

pc4mobx/organization/components/snapshot/Snapshot.js

@@ -0,0 +1,225 @@
+import React from 'react'
+import * as mobx from 'mobx'
+import {
+    inject,
+    observer
+} from 'mobx-react'
+import {
+    WeaTop,
+    WeaTab,
+    WeaFormItem,
+    WeaRightMenu,
+    WeaAlertPage,
+    WeaDatePicker
+} from 'ecCom'
+import {
+    Row,
+    Col,
+    Spin,
+    Modal,
+    Button,
+    message,
+    Switch
+} from 'antd'
+import {
+    WeaSwitch,
+    WeaTableNew
+} from 'comsMobx'
+import {
+    i18n
+} from '../../public/i18n';
+import { renderNoright } from '../../util';
+
+const toJS = mobx.toJS;
+const confirm = Modal.confirm;
+const WeaTable = WeaTableNew.WeaTable;
+
+
+@inject('snapshot')
+@observer
+export default class Snapshot extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+
+    componentWillMount() {
+    }
+
+    componentDidMount() {
+          this.init();
+    }
+
+    componentWillUnmount() {
+    }
+
+
+    componentWillReceiveProps(nextProps) {
+        const {
+            snapshot
+        } = this.props;
+
+        if (this.props.location.key !== nextProps.location.key) {
+            this.init();
+        }
+    }
+
+    init() {
+        const {
+            snapshot
+        } = this.props;
+        snapshot.getDatas();
+        snapshot.getTableInfo();
+    }
+
+    getTopMenuBtns() {
+        const {
+            snapshot
+        } = this.props;
+        const {
+            topMenu,
+        } = snapshot;
+
+        let btns = [];
+        topMenu.map((item, i) => {
+            btns.push(<Button type='primary' onClick={() => this.handleClick(item)}>{item.menuName}</Button>);
+        });
+
+        return btns;
+    }
+
+    handleClick(item) {
+        this[item.menuFun] && this[item.menuFun]();
+    }
+
+
+
+    getDropMenuDatas() {
+        const {
+            snapshot
+        } = this.props;
+        const {
+            rightMenu
+        } = snapshot;
+
+        let menus = [];
+        toJS(rightMenu).map((item, index) => {
+            let obj = {
+                key: item.menuFun,
+                icon: <i className={`${item.menuIcon}`} />,
+                content: item.menuName,
+            }
+            if (item.menuFun == 'collection' || item.menuFun == 'help' || item.menuFun == 'pageAddress') {
+                obj.disabled = true;
+            }
+            menus.push(obj);
+        })
+        return menus;
+    }
+
+    handleMenuClick(key) {
+        this[key] && this[key]();
+    }
+
+    custom = () => {
+        const {
+            snapshot
+        } = this.props, {
+            tableStore,
+        } = snapshot;
+
+        tableStore.setColSetVisible(true);
+        tableStore.tableColSet(true);
+    }
+
+
+    reRenderColumns(columns) {
+        columns.forEach((c, index) => {
+            
+        })
+    }
+
+
+    //非空判断
+    isEmptyObject(obj) {
+        for (let key in obj) {
+            return false;
+        }
+        return true;
+    }
+
+
+
+
+    render() {
+
+        const {
+            snapshot
+        } = this.props;
+        const {
+            tableStore, date, hasRight,datas
+        } = snapshot;
+
+        if (hasRight === false) {
+             return renderNoright();
+        }
+
+        const tabStyle = {
+            height: "40px",
+            textAlign: "center",
+            lineHeight: "40px",
+            color: "#4472c4",
+            fontWeight: 900,
+            fontSize: "16px"
+        }
+        const width = tableStore.columns.filter(c => c.display === "true").length * 50;
+
+        return (
+             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)}
+                >
+                    <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={(e) => this.handleMenuClick(e)}
+                    >   
+                        <div  style={{ height: '40px',lineHeight:'40px' }}>
+                            <h6 style={{float:'left',marginLeft:'20px'}}>日期选择:</h6>
+                            <WeaDatePicker
+                                value={date}
+                                viewAttr={2}
+                                style={{marginLeft:'20px'}}
+                                onChange={value => snapshot.changeDate(value)}
+                                endValue={new Date()}
+                            />
+                        </div>
+                        <Row type="flex" justify="space-around" style={tabStyle}>
+                            <Col span={8}>
+                                员工总数: {datas.person}
+                            </Col>
+                            <Col span={8}>
+                                分部总数: {datas.subcompany}
+                            </Col>
+                            <Col span={8}>
+                                部门总数: {datas.department}
+                            </Col>
+                        </Row>
+                        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@pgmg3x`}
+                            comsWeaTableStore={tableStore}
+                            hasOrder={true}
+                            needScroll={true}
+                            getColumns={c => this.reRenderColumns(c)}
+                            tableWidth={width}
+                        />
+                    </WeaTop>
+                </WeaRightMenu>
+            </div>
+    )
+    }
+}

pc4mobx/organization/index.js

@@ -34,7 +34,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 Snapshot from "./components/snapshot/Snapshot";
 
 import stores from "./stores";
 import "./style/index";
@@ -102,7 +103,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="snapshot" path="snapshot" component={Snapshot} />
   </Route>
 );
 

pc4mobx/organization/stores/index.js

@@ -28,7 +28,9 @@ 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 { SnapshotStore } from "./snapshot";
+
 
 
 module.exports = {
@@ -62,5 +64,6 @@ module.exports = {
   resourceCard:new ResourceCardStore(),
   managerDetach: new ManagerDetachStore(),
   columnSetting: new ColumnSetting(),
-  personnelResume:new PersonnelResumeStore()
+  personnelResume:new PersonnelResumeStore(),
+  snapshot:new SnapshotStore()
 };

pc4mobx/organization/stores/snapshot.js

@@ -0,0 +1,84 @@
+import {
+    observable,
+    action
+} from 'mobx';
+import * as mobx from 'mobx';
+import * as Api from '../apis/snapshot';
+import {
+    WeaForm
+} from 'comsMobx';
+import {
+    WeaTableNew
+} from 'comsMobx';
+import {
+    Modal,
+    message,
+} from 'antd'
+import {
+    i18n
+} from '../public/i18n';
+import moment from 'moment';
+
+const toJS = mobx.toJS;
+const {
+    TableStore
+} = WeaTableNew;
+
+export class SnapshotStore {
+
+    /***************************buttons**************/
+    topMenu = [
+        {
+            "isBatch": "0",
+            "isTop": "1",
+            "menuFun": "custom",
+            "menuIcon": "icon-coms-task-list",
+            "menuName": "显示列定制",
+            "type": "BTN_COLUMN"
+          }
+    ]
+    rightMenu = [
+        {
+            "isBatch": "0",
+            "isTop": "0",
+            "menuFun": "custom",
+            "menuIcon": "icon-coms-task-list",
+            "menuName": "显示列定制",
+            "type": "BTN_COLUMN"
+        }
+    ]
+
+
+    @observable tableStore = new TableStore();
+    @observable datas = {
+        subcompany:0,
+        department:0,
+        person:0
+    };
+    @observable date = moment(new Date()).format('YYYY-MM-DD');
+    @observable hasRight = true;
+
+    @action("获取table接口") getTableInfo() {
+        Api.getSearchList(this.date).then(res => {
+            if (res.code === 200) {
+                this.tableStore.getDatas(res.data.datas,1)
+            } else {
+                message.warning(res.msg);
+            }
+        }, error => {
+            message.warning(error.msg);
+        })
+
+    }
+
+
+    @action("数据统计") getDatas() {
+        
+    }
+
+    changeDate  = (value) => {
+        this.date = value;
+        this.getTableInfo();
+    }
+
+}