feat:完成h5banner

src/modules/store-manage/StoreDecorationPage.less

@@ -26,6 +26,11 @@
     width: 230px;
     height: 79px;
   }
+  .web-banner-thumbnail {
+    width: 389px;
+    height: 67px;
+  }
+
   .index-num {
     width: 30px;
     height: 33px;
@@ -88,5 +93,9 @@
       width: 500px;
       height: 73px;
     }
+    #H5-preview-url-box {
+      width: 500px;
+      height: 172px;
+    }
   }
 }

src/modules/store-manage/StoreDecorationPage.tsx

@@ -2,7 +2,7 @@
  * @Author: wufan
  * @Date: 2020-11-30 10:47:38
  * @LastEditors: wufan
- * @LastEditTime: 2020-12-21 14:12:44
+ * @LastEditTime: 2020-12-22 11:52:56
  * @Description: 员工管理页面
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -26,7 +26,7 @@ interface StoreDecoprationProps {
 }
 
 function StoreDecorationPage(props: StoreDecoprationProps) {
-  const [currentTab, setCurrentTab] = useState("web");
+  const [currentTab, setCurrentTab] = useState("h5");
   const { match } = props;
 
   return (
@@ -52,17 +52,6 @@ function StoreDecorationPage(props: StoreDecoprationProps) {
             currentTab === 'web' && <StoreWebDecorationTab/>
           }
           
-          {/* <Switch>
-            <Route
-              path="/store-decoration/h5"
-              component={StoreH5DecorationTab}
-            ></Route>
-
-            <Route
-              path="/store-decoration/web"
-              component={StoreWebDecorationTab}
-            ></Route>
-          </Switch> */}
         </div>
       </div>
     </div>

src/modules/store-manage/StoreWebDecorationTab.jsx

@@ -2,7 +2,7 @@
  * @Author: wufan
  * @Date: 2020-11-30 10:47:38
  * @LastEditors: wufan
- * @LastEditTime: 2020-12-22 10:17:11
+ * @LastEditTime: 2020-12-22 13:49:20
  * @Description: web店铺banner页面
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -41,28 +41,7 @@ class StoreWebDecoration extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      storeDecorationlist: [
-        // {
-        //   id: "1111",
-        //   bannerPath: "https://image.xiaomaiketang.com/xm/rJeQaZxtc7.png",
-        //   index: 0,
-        //   key: "0",
-        //   name: "https://image.xiaomaiketang.com/xm/rJeQaZxtc7.png",
-        // },
-        // {
-        //   id: "222",
-        //   bannerPath: "https://image.xiaomaiketang.com/xm/CMyWNaDxbM.jpg",
-        //   index: 1,
-        //   key: "1",
-        //   name: "校长",
-        // },
-        // {
-        //   id: "333",
-        //   bannerPath: "https://image.xiaomaiketang.com/xm/pBcJdYkmNN.jpg",
-        //   index: 2,
-        //   key: "2",
-        // },
-      ],
+      storeDecorationlist: [],
       query: {
         storeId: User.getStoreId(),
         termType: "WEB_ADMIN",
@@ -115,7 +94,7 @@ class StoreWebDecoration extends React.Component {
         key: "bannerPath",
         className: "drag-visible",
         render: (val) => {
-          return <img src={val} alt="banner" className="banner-thumbnail" />;
+          return <img src={val} alt="banner" className="web-banner-thumbnail" />;
         },
       },
       {
@@ -299,16 +278,15 @@ class StoreWebDecoration extends React.Component {
   };
 
   editStoreBanner = () => {
-    const { previewUrl, addBannerPath, choosedBannerId } = this.state;
+    const { addBannerPath, choosedBannerId } = this.state;
     const params = {
       bannerPath: addBannerPath,
       storeBannerId: choosedBannerId,
       termType: "WEB_ADMIN",
     };
     StoreService.editStoreBanner(params).then((res) => {
-      message.success("替换成功");
+      message.success("设置成功");
       this.getStoreDecorationList();
-      // this.state.photoclip.destroy();
     });
   };
 
@@ -317,7 +295,6 @@ class StoreWebDecoration extends React.Component {
     const params = {
       sequence: newSequence,
       storeBannerId: storeBannerId,
-      // storeId: User.getStoreId(),
       termType: "WEB_ADMIN",
     };
     StoreService.moveBannerSequence(params).then((res) => {
@@ -332,7 +309,7 @@ class StoreWebDecoration extends React.Component {
       termType: "WEB_ADMIN",
     };
     StoreService.addStoreBanner(params).then((res) => {
-      message.success("添加成功");
+      message.success("设置成功");
       this.getStoreDecorationList();
     });
   };
@@ -353,7 +330,6 @@ class StoreWebDecoration extends React.Component {
       storeDecorationlist,
       showSelectFileModal,
       diskList,
-      previewUrl,
       visible,
     } = this.state;
     const DraggableContainer = (props) => (
@@ -370,7 +346,7 @@ class StoreWebDecoration extends React.Component {
           <div className="banner-setting">
             <div className="title">banner设置</div>
             <div className="tip">
-              图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸750x252像素。
+              图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸1232x212像素。
             </div>
           </div>
           <Button
@@ -459,7 +435,6 @@ class StoreWebDecoration extends React.Component {
             <div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
             <div className="preview-img">
               <div className="title">效果预览</div>
-              {/* <img src={previewUrl} alt="图片预览" className="preview-url" /> */}
               <div id="preview-url-box"></div>
             </div>
           </div>