diff --git a/pc4mobx/organization/apis/columnPermission.js b/pc4mobx/organization/apis/columnPermission.js
new file mode 100644
index 0000000..9d00988
--- /dev/null
+++ b/pc4mobx/organization/apis/columnPermission.js
@@ -0,0 +1,8 @@
+import { WeaTools } from 'ecCom'
+
+export const getTableEdit = (params) => {
+  return WeaTools.callApi('/api/hrm/carddisplay/getCustomCardTable', 'GET', params);
+}
+export const userDefineCardItemSave = (params) => {
+  return WeaTools.callApi('/api/hrm/carddisplay/saveCustomCard', 'POST', params);
+}
diff --git a/pc4mobx/organization/components/columnPermission/components/defineShowItems.js b/pc4mobx/organization/components/columnPermission/components/defineShowItems.js
new file mode 100644
index 0000000..74a5e84
--- /dev/null
+++ b/pc4mobx/organization/components/columnPermission/components/defineShowItems.js
@@ -0,0 +1,50 @@
+import { inject, observer } from "mobx-react";
+import React, { Component } from "react";
+import { WeaTableEdit } from "ecCom";
+import * as mobx from "mobx";
+
+const toJS = mobx.toJS;
+
+@inject("columnPermission")
+@observer
+export default class DefineShowItems extends Component {
+  constructor(props) {
+    super(props);
+  }
+
+  componentDidMount() {
+    this.init();
+  }
+
+  init = () => {
+    const { columnPermission } = this.props;
+    columnPermission.loadTabTwoRelatedData();
+  };
+
+  onRowSelect = (sRowKeys, rows, dataIndex, selectedDatas) => {
+    const { columnPermission } = this.props;
+    if (dataIndex === undefined || selectedDatas === undefined) {
+      return;
+    }
+    columnPermission.setEnableRows(selectedDatas.isused);
+  };
+
+  render() {
+    const { columnPermission } = this.props, { tabTwoRelatedData } = columnPermission;
+    const { datas, columns, selectedData, loading } = tabTwoRelatedData;
+    return (
+      <WeaTableEdit
+        ecId={`${this && this.props && this.props.ecId || ""}_WeaTableEdit@7rorir`}
+        draggable
+        deleteConfirm
+        title=""
+        columns={toJS(columns)}
+        datas={toJS(datas)}
+        copyFilterProps={["id"]}
+        selectedData={!loading && toJS(selectedData)}
+        onChange={e => columnPermission.setTableEditDatas(e)}
+        onRowSelect={(sRowKeys, rows, dataIndex, selectedDatas) => this.onRowSelect(sRowKeys, rows, dataIndex, selectedDatas)}
+      />
+    );
+  }
+}
diff --git a/pc4mobx/organization/components/columnPermission/components/permissionItem.js b/pc4mobx/organization/components/columnPermission/components/permissionItem.js
new file mode 100644
index 0000000..44dc123
--- /dev/null
+++ b/pc4mobx/organization/components/columnPermission/components/permissionItem.js
@@ -0,0 +1,95 @@
+import React, { Component } from "react";
+import { WeaTableEdit } from "ecCom";
+
+class PermissionItem extends Component {
+  render() {
+    const columns = [
+      {
+        title: "栏目",
+        dataIndex: "column",
+        key: "column",
+        com: [
+          { label: "", type: "TEXT", viewAttr: 1, key: "column" }
+        ]
+      },
+      {
+        title: "是否启用",
+        dataIndex: "isused",
+        key: "isused",
+        com: [
+          {
+            type: "CHECKBOX",
+            key: "isused",
+            viewAttr: 1
+          }
+        ]
+      },
+      {
+        title: "所有人可见",
+        dataIndex: "all",
+        key: "all",
+        com: [
+          {
+            type: "CHECKBOX",
+            key: "all"
+          }
+        ]
+      },
+      {
+        title: "上级可见",
+        dataIndex: "highVisible",
+        key: "highVisible",
+        com: [
+          {
+            type: "CHECKBOX",
+            key: "highVisible"
+          }
+        ]
+      },
+      {
+        title: "所有上级可见",
+        dataIndex: "allVisible",
+        key: "allVisible",
+        com: [
+          {
+            type: "CHECKBOX",
+            key: "allVisible"
+          }
+        ]
+      },
+      {
+        title: "查看自定义",
+        dataIndex: "customRole",
+        key: "customRole",
+        com: [
+          { label: "", type: "TEXT", viewAttr: 1, key: "customRole" }
+        ]
+      }
+    ];
+    const datas = [
+      {
+        id: "1",
+        column: "基本信息",
+        isused: false,
+        all: false,
+        highVisible: true,
+        allVisible: false,
+        customRole: "角色1"
+      }
+    ];
+    return (
+      <div>
+        <WeaTableEdit
+          columns={columns}
+          datas={datas}
+          showAdd={false}
+          showCopy={false}
+          showDelete={false}
+          showTitle={false}
+        />
+      </div>
+    );
+  }
+}
+
+export default PermissionItem;
diff --git a/pc4mobx/organization/components/columnPermission/index.js b/pc4mobx/organization/components/columnPermission/index.js
index 958f8b2..e3d374e 100644
--- a/pc4mobx/organization/components/columnPermission/index.js
+++ b/pc4mobx/organization/components/columnPermission/index.js
@@ -1,99 +1,46 @@
 import React, { Component } from "react";
-import { WeaRightMenu, WeaTableEdit, WeaTop } from "ecCom";
+import { WeaRightMenu, WeaTab, WeaTop } from "ecCom";
+import { inject, observer } from "mobx-react";
 import { Button } from "antd";
+import PermissionItem from "./components/permissionItem";
+import DefineShowItems from "./components/defineShowItems";
 import { i18n } from "../../public/i18n";
 
+@inject("columnPermission")
+@observer
 class ColumnPermission extends Component {
   getTopMenuBtns = () => {
     return [
-      <Button type="primary">调整</Button>
+      <Button type="primary" onClick={this.save}>保存</Button>
     ];
   };
   getDropMenuDatas = () => {
     return [
       {
-        key: "add",
-        icon: <i className="icon-search"/>,
-        content: "调整"
+        key: "save",
+        icon: <i className="icon-coms-Preservation"/>,
+        content: "保存"
       }
     ];
   };
+  getTabName = () => {
+    return [{
+      key: "0",
+      title: i18n.label.permissionManagement()
+    }, {
+      key: "1",
+      title: i18n.label.defineShowItems()
+    }];
+  };
+  save = () => {
+    const { columnPermission } = this.props;
+    const { selectedKey } = columnPermission;
+    selectedKey === "0" ? columnPermission.columnPermissionSave() : columnPermission.userDefineCardItemSave();
+  };
 
   render() {
-    const columns = [
-      {
-        title: "栏目",
-        dataIndex: "column",
-        key: "column",
-        com: [
-          { label: "", type: "TEXT", viewAttr: 1, key: "column" }
-        ]
-      },
-      {
-        title: "是否启用",
-        dataIndex: "isused",
-        key: "isused",
-        com: [
-          {
-            type: "CHECKBOX",
-            key: "isused",
-            viewAttr: 1,
-          }
-        ]
-      },
-      {
-        title: "所有人可见",
-        dataIndex: "all",
-        key: "all",
-        com: [
-          {
-            type: "CHECKBOX",
-            key: "all"
-          }
-        ]
-      },
-      {
-        title: "上级可见",
-        dataIndex: "highVisible",
-        key: "highVisible",
-        com: [
-          {
-            type: "CHECKBOX",
-            key: "highVisible"
-          }
-        ]
-      },
-      {
-        title: "所有上级可见",
-        dataIndex: "allVisible",
-        key: "allVisible",
-        com: [
-          {
-            type: "CHECKBOX",
-            key: "allVisible"
-          }
-        ]
-      },
-      {
-        title: "查看自定义",
-        dataIndex: "customRole",
-        key: "customRole",
-        com: [
-          { label: "", type: "TEXT", viewAttr: 1, key: "customRole" }
-        ]
-      }
-    ];
-    const datas = [
-      {
-        id: "1",
-        column: "基本信息",
-        isused: false,
-        all: false,
-        highVisible: true,
-        allVisible: false,
-        customRole: "角色1",
-      }
-    ];
+    const { columnPermission } = this.props;
+    const { selectedKey } = columnPermission;
     return (
       <div style={{ height: "100%" }}>
         <WeaRightMenu
@@ -110,16 +57,21 @@ class ColumnPermission extends Component {
             buttons={this.getTopMenuBtns()}
             showDropIcon={true}
             dropMenuDatas={this.getDropMenuDatas()}
-            onDropMenuClick={(e) => console.log(e)}
+            onDropMenuClick={(e) => (e && this[e]())}
           />
-          <WeaTableEdit
-            columns={columns}
-            datas={datas}
-            showAdd={false}
-            showCopy={false}
-            showDelete={false}
-            showTitle={false}
+          <WeaTab
+            ecId={`${this && this.props && this.props.ecId || ""}_WeaTab@8mmoen`}
+            selectedKey={selectedKey}
+            datas={this.getTabName()}
+            keyParam="key"
+            onChange={(key) => columnPermission.setSelectedKey(key)}
           />
+          {
+            selectedKey === "0" ?
+              <PermissionItem
+                ecId={`${this && this.props && this.props.ecId || ""}_SysShowItems@0wqtjk`}/> :
+              <DefineShowItems ecId={`${this && this.props && this.props.ecId || ""}_DefineShowItems@q1hmoj`}/>
+          }
         </WeaRightMenu>
       </div>
     );
diff --git a/pc4mobx/organization/public/i18n.js b/pc4mobx/organization/public/i18n.js
index e4e6362..d919584 100644
--- a/pc4mobx/organization/public/i18n.js
+++ b/pc4mobx/organization/public/i18n.js
@@ -564,6 +564,7 @@ export const i18n = {
 		newEducation: () => getLabel(386229, '新建学历'),
 		editEducation: () => getLabel(386230, '编辑学历'),
 		sysShowItems: () => getLabel(32980, '系统显示栏目'),
+		permissionManagement: () => getLabel(32980, '权限管理'),
 		defineShowItems: () => getLabel(32744, '自定义显示栏目'),
 		childItems: () => getLabel(32749, '子栏目'),
 		sysadminRemind: () => getLabel(386231, '管理员提醒'),
diff --git a/pc4mobx/organization/stores/columnPermission.js b/pc4mobx/organization/stores/columnPermission.js
new file mode 100644
index 0000000..ae0bd0f
--- /dev/null
+++ b/pc4mobx/organization/stores/columnPermission.js
@@ -0,0 +1,333 @@
+import { observable, action, computed, extendObservable } from 'mobx';
+import { message } from 'antd'
+import { WeaHelpfulTip } from 'ecCom';
+import {isEmpty} from "lodash";
+import { i18n } from '../public/i18n';
+import * as mobx from 'mobx';
+import * as Api from '../apis/columnPermission';
+const toJS = mobx.toJS;
+
+export class ColumnPermission {
+  @observable weaTopTitle = i18n.module.staffCardDisplay();
+  @observable btnMenu = [];
+  @observable selectedKey = '0';
+  @observable authorized = false;
+  @observable loading = true;
+  @observable tabOneRelatedData = {
+    data: [],
+    loading: true
+  };
+  @observable tabTwoRelatedData = {
+    datas: [], //datas受控
+    columns: [],
+    loading: true,
+    selectedData: {}, //selectedData受控
+    authorized: false,
+  };
+
+  @computed get cardItemsLength() {
+    let arr = [];
+    for (let i = 0; i < this.tabOneRelatedData.data.length; i++) {
+      let cardItemsLength = 0;
+      this.tabOneRelatedData.data[i].children.map(s => {
+        if (s.children.length > 0) {
+          cardItemsLength += s.children.length;
+        } else {
+          cardItemsLength += 1;
+        }
+      });
+      arr.push(cardItemsLength);
+    }
+    return arr;
+  }
+
+  @computed get menu() {
+    let topMenu = [];
+    let rightMenu = [];
+    this.btnMenu.map(item => {
+      (item.isTop == '1' || item.isBatch == '1') && topMenu.push(item);
+      !item.isBatch && rightMenu.push(item);
+    });
+    return {
+      topMenu,
+      rightMenu
+    }
+  }
+
+  @computed get checkedItems() {
+    let arr = [];
+    toJS(this.tabOneRelatedData.data).map(f => {
+      let fArr = [];
+      if (f.value) {
+        fArr.push(f.id);
+        f.children.map(s => {
+          if (s.value) {
+            fArr.push(
+              s.id,
+            )
+            s.children.map(t => {
+              t.value && fArr.push(
+                t.id
+              )
+            })
+          }
+        });
+        arr.push(fArr.toString());
+      }
+    });
+    return arr.toString();
+  }
+
+  @computed get tabTwoSaveParams() {
+    let datas = this.tabTwoRelatedData.datas;
+    let selectedData = this.tabTwoRelatedData.selectedData.isused;
+
+    let params = this.arrToJson(toJS(datas), toJS(selectedData));
+    params.rownum = datas.length;
+
+    return params;
+  }
+
+  @action
+  getRight() {
+    this.loading = true;
+    Api.getRight().then(res => {
+      let {
+        api_status,
+        btnMenu,
+        hasRight
+      } = res;
+      if (api_status) {
+        if (hasRight) {
+          this.setRight(true);
+          btnMenu !== undefined && this.setBtnMenu(btnMenu);
+        }
+        this.loading = false;
+      } else {
+        message.error(res.message);
+      }
+    }).catch(error => {
+      message.error(error);
+    });
+  }
+
+  loadTabOneRelatedData() {
+    this.tabOneRelatedData.loading = true;
+    Promise.all(
+      [
+        Api.getCardItemsData(),
+      ]
+    ).then(res => {
+      res.map((rs, index) => {
+        if (index == 0) {
+          let {
+            api_status,
+            data
+          } = rs;
+
+          if (api_status) {
+            data !== undefined && extendObservable(this.tabOneRelatedData, {
+              data: data
+            });
+            extendObservable(this.tabOneRelatedData, {
+              loading: false
+            });
+          } else {
+            message.error(rs.message);
+          }
+        }
+      });
+    }).catch(error => {
+      message.error(error);
+    });
+  }
+
+  loadTabTwoRelatedData() {
+    this.tabTwoRelatedData.loading = true;
+    Promise.all(
+      [
+        Api.getTableEdit(),
+      ]
+    ).then(res => {
+      res.map((rs, index) => {
+        if (index == 0) {
+          let {
+            api_status,
+            datas,
+            columns,
+            selectedData
+          } = rs;
+
+          if (api_status) {
+            if (!columns || !datas) {
+              this.tabTwoRelatedData.authorized = false;
+              return;
+            }
+            this.tabTwoRelatedData.authorized = true;
+            columns.map((c, index) => {
+              if (c.key === 'itemurl') {
+                c.title = <span>
+					                        <span>{c.title}</span>
+					                        <span style={{marginLeft: 10}}>
+						                        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@4vdvfp@${index}`} title='自定义页面链接地址可以为外网地址，如：http://www.baidu.com
+								            		也可以是内部地址，如：/test.jsp，可以带上参数传参，像这样：/test.jsp?a=1&b=2
+								            		也可以写占位符{#id}传人员id，像这样：/test.jsp?a=1&b={#id}&mypara2={#id}
+								            		即使不写占位符，默认也会收到1个固定的参数：hrmResourceID=人员id'/>
+								            </span>
+							            </span>
+              } else if (c.key === 'itemnum') {
+                c.title = <span>
+					                        <span>{c.title}</span>
+					                        <span style={{marginLeft: 10}}>
+						                        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@wotuuk@${index}`} title='填写类的全路径例如：com.engine.hrm.cmd.hrmcarditem.GetTabNumDemoCmd,类中包含execute方法返回int型数据。
+								            		填写不正确的路径并启用，对应tab页title将会出现（error）字样。'/>
+								            </span>
+							           </span>
+              }
+            });
+
+            extendObservable(this.tabTwoRelatedData, {
+              datas: datas,
+              columns: columns
+            });
+
+            selectedData && extendObservable(this.tabTwoRelatedData, {
+              selectedData: selectedData
+            });
+            extendObservable(this.tabTwoRelatedData, {
+              loading: false
+            });
+          } else {
+            message.error(rs.message);
+          }
+        }
+      });
+    }).catch(error => {
+      message.error(error);
+    });
+  }
+
+  columnPermissionSave() {
+    let params = {
+      data: toJS(this.checkedItems)
+    }
+    Api.cardItemsSettingSave(params).then(res => {
+      let {
+        api_status,
+        sign,
+      } = res;
+
+      if (api_status) {
+        if (sign == '1') {
+          res.message && message.success(res.message);
+        } else {
+          res.message && message.warning(res.message);
+        }
+      } else {
+        message.error(res.message);
+      }
+    }).catch(error => {
+      message.error(error);
+    });
+  }
+
+  userDefineCardItemSave() {
+    if (!this.verify(toJS(this.tabTwoRelatedData.datas))) return;
+    let params = this.tabTwoSaveParams;
+
+    Api.userDefineCardItemSave(params).then(res => {
+      let {
+        api_status,
+        sign,
+      } = res;
+
+      if (api_status) {
+        if (sign == '1') {
+          res.message && message.success(res.message);
+        } else {
+          res.message && message.warning(res.message);
+        }
+      } else {
+        message.error(res.message);
+      }
+    }).catch(error => {
+      message.error(error);
+    });
+  }
+
+  arrToJson(arr, rows) {
+    let json = {};
+
+    const _rows = isEmpty(arr) ? [] : rows;
+
+    _rows && _rows.map(index => {
+      arr[index].isused = '1';
+    });
+    arr.map((item, index) => {
+      if (!item.isused) item.isused = '0';
+      for (let key in item) {
+        json[key + '_' + index] = item[key];
+      }
+    })
+
+    return json;
+  }
+
+  verify(arr) {
+    for (let i = 0; i < arr.length; i++) {
+      if (!arr[i].itemname || !arr[i].itemurl) {
+        const temp = i18n.message.requiredInfoIsNotFull().replace('{param}', i + 1);
+        message.warning(temp);
+        return false;
+      }
+    }
+    return true;
+  }
+
+  setRight(right) {
+    this.authorized = right;
+  }
+
+  setBtnMenu(btnMenu) {
+    this.btnMenu = btnMenu;
+  }
+
+  setSelectedKey(key) {
+    this.selectedKey = key;
+  }
+
+  setCardItemsData(data) {
+    this.data = data;
+  }
+
+  setEnableRows(e) {
+    extendObservable(this.tabTwoRelatedData, {
+      selectedData: {
+        isused: e
+      }
+    });
+  }
+
+  setTableEditDatas(e) {
+    e.map(item => {
+      for (let key in item) {
+        if (key == 'undefined') {
+          delete item[key];
+        }
+        if (!item['isused']) {
+          item['isused'] = '';
+        }
+      }
+    });
+    extendObservable(this.tabTwoRelatedData, {
+      datas: e
+    });
+  }
+
+  mobxDataReset() {
+    this.selectedKey = '0';
+    extendObservable(this.tabOneRelatedData, {
+      loading: true
+    });
+  }
+}
diff --git a/pc4mobx/organization/stores/index.js b/pc4mobx/organization/stores/index.js
index 6e300ed..d43c62b 100644
--- a/pc4mobx/organization/stores/index.js
+++ b/pc4mobx/organization/stores/index.js
@@ -27,6 +27,7 @@ import {ResourceBasicInfoStore} from "./reserouseBasicInfo";
 import {ImportDialogStore} from "./importDialog";
 import {ResourceCardStore} from "./resourceCard";
 import {ManagerDetachStore} from "./managerDetach";
+import {ColumnPermission} from './columnPermission';
 
 
 module.exports = {
@@ -58,5 +59,6 @@ module.exports = {
   resourceBasicInfo: new ResourceBasicInfoStore(),
   importDialog: new ImportDialogStore(),
   resourceCard:new ResourceCardStore(),
-  managerDetach: new ManagerDetachStore()
+  managerDetach: new ManagerDetachStore(),
+  columnPermission: new ColumnPermission(),
 };