share operation alpha

src/pages/matter/List.tsx

@@ -27,6 +27,8 @@ import Sun from "../../common/model/global/Sun";
 import { UserRole } from "../../common/model/user/UserRole";
 import StringUtil from "../../common/util/StringUtil";
 import MoveBatchModal from "./widget/MoveBatchModal";
+import ShareOperationModal from "./widget/ShareOperationModal";
+import Share from "../../common/model/share/Share";
 
 interface IProps extends RouteComponentProps {}
 
@@ -50,12 +52,7 @@ export default class List extends TankComponent<IProps, IState> {
   user = Moon.getSingleton().user;
   preference = Moon.getSingleton().preference;
   director = new Director();
-
-  // todo
-  // share: Share =  new Share();
-
-  //分享的弹框
-  shareDialogVisible = false;
+  share =  new Share();
 
   newMatterRef = React.createRef<MatterPanel>();
 
@@ -205,8 +202,10 @@ export default class List extends TankComponent<IProps, IState> {
     this.uploadMatters.push(m);
   };
 
-  share = () => {
-    console.log("share");
+  shareBatch = () => {
+    ShareOperationModal.open(() => {
+
+    });
   };
 
   searchFile = (value?: string) => {
@@ -317,7 +316,7 @@ export default class List extends TankComponent<IProps, IState> {
                     移动
                   </Button>
 
-                  <Button type="primary" className="mb10" onClick={this.share}>
+                  <Button type="primary" className="mb10" onClick={this.shareBatch}>
                     分享
                   </Button>
                 </>

src/pages/matter/widget/ShareOperationModal.less

@@ -0,0 +1,21 @@
+.widget-share-modal {
+
+  .share-block {
+
+    .share-icon {
+      width: 30px;
+      height: 30px;
+    }
+
+    .name {
+      font-size: 18px;
+      margin-left: 10px;
+      line-height: 30px;
+    }
+
+  }
+
+}
+.share-modal {
+  max-width: 1000px;
+}

src/pages/matter/widget/ShareOperationModal.tsx

@@ -0,0 +1,63 @@
+import React from "react";
+import TankComponent from "../../../common/component/TankComponent";
+import { Modal, Button, Col, Row, Select } from "antd";
+import "./ShareOperationModal.less";
+import Share from "../../../common/model/share/Share";
+import { ShareExpireOptionList } from "../../../common/model/share/ShareExpireOption";
+
+interface IProps {
+  onSuccess: () => any;
+  onClose: () => any;
+}
+
+interface IState {}
+
+export default class ShareOperationModal extends TankComponent<IProps, IState> {
+  share = new Share();
+
+  constructor(props: IProps) {
+    super(props);
+  }
+
+  static open = (confirmCallback: () => any) => {
+    const modal = Modal.confirm({
+      className: "share-modal",
+      title: "分享",
+      width: "90vw",
+      okCancel: false,
+      okButtonProps: {
+        className: "display-none",
+      },
+      content: (
+        <ShareOperationModal
+          onSuccess={() => {
+            confirmCallback();
+            modal.destroy();
+          }}
+          onClose={() => {
+            modal.destroy();
+          }}
+        />
+      ),
+    });
+  };
+
+  render() {
+    return (
+      <div className="widget-share-modal">
+        <Row>
+          <Col span={8}>有效期</Col>
+          <Col span={16}>
+            <Select>
+              {ShareExpireOptionList.map((option) => (
+                <Select.Option value={option.value} onChange={() => {}}>
+                  {option.name}
+                </Select.Option>
+              ))}
+            </Select>
+          </Col>
+        </Row>
+      </div>
+    );
+  }
+}

src/pages/share/List.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { RouteComponentProps } from "react-router-dom";
 import { Pagination } from "antd";
+import TankTitle from "../widget/TankTitle";
 import TankComponent from "../../common/component/TankComponent";
 import Pager from "../../common/model/base/Pager";
 import Share from "../../common/model/share/Share";
@@ -38,7 +39,9 @@ export default class List extends TankComponent<IProps, IState> {
     const { pager } = this;
 
     return (
-      <div className="page-share-list">
+      <div className="share-list">
+        <TankTitle name={"我的分享"} />
+
         {pager.data.map((share) => (
           <ShareBar key={share.uuid!} share={share} onDeleteSuccess={this.refresh} />
         ))}