Merge branch 'dev' of http://10.0.0.22:3000/lingxi/lingxi-business-paltform into dev

src/pages/home/components/Centers/Container.tsx

@@ -2,9 +2,18 @@ import React, { ReactNode } from 'react';
 import styles from './Container.less';
 
 interface Iprops {
+  /**
+   * 标题
+   */
   title: string,
+  /**
+   * 标题下面的一行字
+   */
   tips: string,
-  extra?: ReactNode
+  /**
+   * 主要用在header 右边连接ReactNode
+   */
+  extra?: ReactNode 
 };
 
 const AbilityContainer: React.FC<Iprops> = (props) => {

src/pages/home/components/CustomWorkBench/Draggable.tsx

+import React, {useState, useCallback, useMemo, useEffect} from 'react';
+
+const POSITION = {x: 0, y: 0};
+
+const Draggable = ({children, id, onDrag, onDragEnd}) => {
+  const [state, setState] = useState({
+    isDragging: false,
+    origin: POSITION,
+    translation: POSITION
+  });
+    
+  const handleMouseDown = useCallback(({clientX, clientY}) => {
+    setState(state => ({
+      ...state,
+      isDragging: true,
+      origin: {x: clientX, y: clientY}
+    }));
+  }, []);
+    
+  const handleMouseMove = useCallback(({clientX, clientY}) => {
+    const translation = {x: clientX - state.origin.x, y: clientY - state.origin.y};
+        
+    setState(state => ({
+      ...state,
+      translation
+    }));
+        
+    onDrag({translation, id});
+  }, [state.origin, onDrag, id]);
+    
+  const handleMouseUp = useCallback(() => {
+    setState(state => ({
+      ...state,
+      isDragging: false
+    }));
+        
+    onDragEnd();
+  }, [onDragEnd]);
+    
+  useEffect(() => {
+    if (state.isDragging) {
+      window.addEventListener('mousemove', handleMouseMove);
+      window.addEventListener('mouseup', handleMouseUp);
+    } else {
+      window.removeEventListener('mousemove', handleMouseMove);
+      window.removeEventListener('mouseup', handleMouseUp);
+
+      setState(state => ({...state, translation: {x: 0, y: 0}}));
+    }
+  }, [state.isDragging, handleMouseMove, handleMouseUp]);
+    
+  const styles = useMemo(() => ({
+    cursor: state.isDragging ? '-webkit-grabbing' : '-webkit-grab',
+    transform: `translate(${state.translation.x}px, ${state.translation.y}px)`,
+    transition: state.isDragging ? 'none' : 'transform 500ms',
+    zIndex: state.isDragging ? 2 : 1,
+    
+    position: state.isDragging ? 'absolute' : 'static'
+  }), [state.isDragging, state.translation]);
+    
+  return (
+    <div style={styles} onMouseDown={handleMouseDown}>
+      {children}
+    </div>
+  );
+};
+
+export default Draggable;
\ No newline at end of file

src/pages/home/components/CustomWorkBench/SortedList.tsx

+import React, {useState, useCallback} from 'react';
+import styled from 'styled-components';
+import {range, inRange} from 'lodash';
+import Draggable from './Draggable';
+import { Checkbox } from 'antd';
+
+const MAX = 11;
+const HEIGHT = 40;
+
+const SortedList = () => {
+  const items = range(MAX);
+  const [state, setState] = useState({
+    order: items,
+    dragOrder: items, 
+    draggedIndex: null
+  });
+    
+  const handleDrag = useCallback(({translation, id}) => {
+    const delta = Math.round(translation.y / HEIGHT);
+    const index = state.order.indexOf(id);
+    const dragOrder = state.order.filter(index => index !== id);
+        
+    if (!inRange(index + delta, 0, items.length)) {
+      return;
+    }
+        
+    dragOrder.splice(index + delta, 0, id);
+        
+    setState(state => ({
+      ...state,
+      draggedIndex: id,
+      dragOrder
+    }));
+  }, [state.order, items.length]);
+    
+  const handleDragEnd = useCallback(() => {
+    setState(state => ({
+      ...state,
+      order: state.dragOrder,
+      draggedIndex: null
+    }));
+  }, []);
+    
+  return (
+    <Container>
+      {items.map(index => {
+        const isDragging = state.draggedIndex === index;
+        const top = state.dragOrder.indexOf(index) * (HEIGHT + 10);
+        const draggedTop = state.order.indexOf(index) * (HEIGHT + 10);
+                
+        return (
+          <Draggable
+            key={index}
+            id={index}
+            onDrag={handleDrag}
+            onDragEnd={handleDragEnd}
+          >
+            <Rect
+              isDragging={isDragging}
+              top={isDragging ? draggedTop : top}
+            >
+              <div>交易能力-{`${index}`}</div>
+              <div><Checkbox /></div>
+            </Rect>
+          </Draggable>
+        );
+      })}
+    </Container>
+  );
+};
+
+export default SortedList;
+
+const Container = styled.div`
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  position: relative;
+  height: 522px;
+`;
+
+const Rect = styled.div.attrs(props => ({
+  style: {
+    transition: props.isDragging ? 'none' : 'all 500ms'
+  }
+}))`
+  width: 352px;
+  user-select: none;
+  height: ${HEIGHT}px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;  
+  border: 1px solid #EEF0F3;
+  padding: 14px 16px;
+  margin-bottom: 12px;
+  background: #fff;
+  position: absolute;
+  top: ${({top}) => top}px;
+  left: 0
+`;
\ No newline at end of file

src/pages/home/components/CustomWorkBench/index.tsx

@@ -3,6 +3,7 @@ import { Modal, Button, Checkbox } from 'antd';
 import { AppstoreOutlined } from '@ant-design/icons';
 import styles from './index.less';
 import { CloseOutlined } from '@ant-design/icons';
+import SortedList from './SortedList';
 
 interface Iprops {}
 
@@ -41,16 +42,7 @@ const CustomWorkBench: React.FC<Iprops> = () => {
             </div>
           </div>
           <div className={styles.content}>
-            {
-              [1,2,3,4,5,6,7,8,9,10].map((item) => {
-                return (
-                  <div className={styles.item} key={item}>
-                    <div className={styles.name}>交易能力</div>
-                    <div><Checkbox /></div>
-                  </div>
-                )
-              })
-            }
+            <SortedList />
           </div>
           <div className={styles.footer}>
             <div className={styles.sortTips}>

src/pages/home/components/UseGuaid/index.less

@@ -84,25 +84,3 @@
   }
 }
 
-.controller {
-  background-color: @main-color;
-  width: 181px;
-  height: 48px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  border-radius: 8px;
-  color: #fff;
-  display: flex;
-  flex-direction: row;
-  margin-top: 24px;
-  margin-left: auto;
-  cursor: pointer;
-
-  .icon {
-    font-size: 24px;
-  }
-  .text {
-    margin-left: 8px;
-  }
-}
\ No newline at end of file

src/pages/lxMall/commodityDetail/index.tsx

@@ -348,7 +348,7 @@ const CommodityDetail = (props) => {
           postFn = PublicApi.postSearchShopPurchaseSaveOrUpdatePurchase
           break;
       }
-      PublicApi.postOrderDirectPayment({ productId: selectCommodityId }).then(res => {
+      PublicApi.postOrderDirectPayment({ productId: selectCommodityId, memberId }).then(res => {
         if (res.code === 1000) {
           message.destroy()
           postFn && postFn(param).then(res => {
@@ -362,6 +362,8 @@ const CommodityDetail = (props) => {
             clickFlag = true
           })
         }
+      }).catch(() => {
+        clickFlag = true
       })
     }
   }
@@ -468,7 +470,7 @@ const CommodityDetail = (props) => {
             category: commodityDetail.customerCategory.name,
             brand: commodityDetail.brand.name,
             stockCount: stockCount,
-            commodityPic: attrAndValList.commodityPic ? attrAndValList.commodityPic[0] : '',
+            commodityPic: attrAndValList.commodityPic ? attrAndValList.commodityPic[0] : commodityDetail.mainPic,
             attribute: attrAndValList.attributeAndValueList
           }
 
@@ -480,6 +482,7 @@ const CommodityDetail = (props) => {
             supplyMembersName: commodityDetail.memberName,
             supplyMembersId: commodityDetail.memberId,
             supplyMembersRoleId: commodityDetail.memberRoleId,
+            isInvoice: commodityDetail.isInvoice,
             orderList: [{
               id: shopInfo.id,
               shopname: shopInfo.company,
@@ -497,6 +500,8 @@ const CommodityDetail = (props) => {
         } else {
           clickFlag = true
         }
+      }).catch(() => {
+        clickFlag = true
       })
     }
 

src/pages/lxMall/order/index.tsx

@@ -423,7 +423,9 @@ const Order: React.FC<OrderPropsType> = (props) => {
               }
               <PayWay supplyMembersId={orderInfo.supplyMembersId} supplyMembersRoleId={orderInfo.supplyMembersRoleId}  selectItem={selectPayWay} payWayList={orderInfo.payWayList} onChange={(val) => setSelectPayWay(val)} />
               {/* <Delivery /> */}
-              <Invoice state={needTheInvoice} onChange={(val) => setNeedTheInvoice(val)} onSelect={(val) => setSelectInvoiceInfo(val)} />
+              {
+                orderInfo.isInvoice && <Invoice state={needTheInvoice} onChange={(val) => setNeedTheInvoice(val)} onSelect={(val) => setSelectInvoiceInfo(val)} />
+              }
               {
                 isElectronicContract && <Contract contractInfo={contractInfo} state={needTheContract} onChange={(val) => setneedTheContract(val)} />
               }

src/pages/lxMall/purchaseOrder/index.tsx

@@ -548,7 +548,7 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
       setConfirmLoading(false)
       if (res.code === 1000) {
         message.destroy()
-        PublicApi.postOrderDirectPayment({ productId: productIds[0] }).then(res => {
+        PublicApi.postOrderDirectPayment({ productId: productIds[0], memberId: selectItem.memberId }).then(res => {
           if (res.code === 1000) {
             message.destroy()
             let sessionKey = `${selectItem.id}${new Date().getTime()}`