🦄 refactor:搜索历史加入购物车100%

project.private.config.json

@@ -77,6 +77,13 @@
           "query": "id=27651",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "",
+          "pathName": "pages/submitOrder/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }

src/api/addressList.ts

@@ -39,3 +39,10 @@ export const mppurchaseraddressput = () => {
         method: "put",
     })
 }
+//删除收货地址信息
+export const mppurchaseraddressdelect = () => {
+    return useRequest({
+        url: `/v1/mp/purchaser/address`,
+        method: "delete",
+    })
+}

src/api/order.ts

@@ -123,3 +123,17 @@ export const mpsaleOrderaddress = () => {
         method: "put",
     })
 }
+//关键字搜索历史
+export const mpsearchHistorylist = () => {
+    return useRequest({
+        url: `/v1/mp/searchHistory/list`,
+        method: "get",
+    })
+}
+//添加关键字搜索
+export const mpsearchHistory = () => {
+    return useRequest({
+        url: `/v1/mp/searchHistory`,
+        method: "post",
+    })
+}

src/app.config.ts

@@ -88,5 +88,11 @@ export default defineAppConfig({
         "index"
       ]
     },
+    {
+      root: "pages/submitOrder",
+      pages: [
+        "index"
+      ]
+    },
   ],
 })

src/components/AddressList/index.tsx

@@ -58,52 +58,37 @@ const AddressList = memo((props: Params) => {
   // 列表选择
   const { fetchData: selectFetch } = mpsaleOrderaddress()
   const handleSelect = async (item: any, index: number) => {
-    Taro.showLoading({
+    if (router.params.orderId) {
-      title: '请稍等...',
+      Taro.showLoading({
-      mask: true
+        title: '请稍等...',
-    })
+        mask: true
-    const res = await selectFetch({ address_id: item.id, id: Number(router.params.orderId), shipment_mode: 2 })
-    if (res.msg === 'success') {
-      Taro.hideLoading()
-      Taro.showToast({
-        title: '成功',
-        icon: 'success'
-      })
-      Taro.navigateBack({
-        delta: 1
-      })
-    } else {
-      Taro.hideLoading()
-      Taro.showToast({
-        title: res.msg,
-        icon: 'error'
       })
+      const res = await selectFetch({ address_id: item.id, id: Number(router.params.orderId), shipment_mode: 2 })
+      if (res.msg === 'success') {
+        Taro.hideLoading()
+        Taro.showToast({
+          title: '成功',
+          icon: 'success'
+        })
+        Taro.navigateBack({
+          delta: 1
+        })
+      } else {
+        Taro.hideLoading()
+        Taro.showToast({
+          title: res.msg,
+          icon: 'error'
+        })
+      }
     }
 
+
     props.onSelect && props.onSelect(item, index);
     if (focusBorderEnabled) {
       setFocusId(item?.id);
     }
   }
-  // 删除地址
+
-  // const { fetchData: deleteFetch } = addressDeleteApi()
-  // const handleDelete = (item: any) => {
-  //   showModal(({
-  //     title: "提示",
-  //     content: "是否删除地址？",
-  //     async success(ev) {
-  //       if (ev.confirm) {
-  //         const result = await deleteFetch({ id: item.id });
-  //         if (result.success) {
-  //           alert.success("删除成功");
-  //           getData();
-  //         } else {
-  //           alert.success(result.msg);
-  //         }
-  //       }
-  //     }
-  //   }))
-  // }
   return (
     <View className="address-scroll-view">
       <ScrollView scrollY refresherEnabled={props.refresherEnabled} enhanced refresherTriggered={refreshState} onRefresherRefresh={handleRefresh}>
@@ -114,7 +99,7 @@ const AddressList = memo((props: Params) => {
                 // data.length>0?
                 // data.map((item,index)=>{
                 return (
-                  <View onLongPress={() => handleDelete(item)} onClick={() => handleSelect(item, index)} className={`address-list ${focusId == item.id && 'address-active'}`}>
+                  <View onClick={() => handleSelect(item, index)} className={`address-list ${focusId == item.id && 'address-active'}`}>
                     <View className="address-user">
                       {item.name}
                       {

src/components/goodsItem/index.tsx

@@ -20,7 +20,10 @@ interface props {
         name?: string,
         roll?: number | string,
         buyNums?: number | string,
-    }
+        id?: number
+    },
+    goodList?: any[],
+    onBlur?: (a: any, c: any) => void
 }
 
 
@@ -28,7 +31,6 @@ export default memo((props: props) => {
     const [value, setValue] = useState<any>({ count: props.value.nums })
 
     const onInputEven = (e) => {
-
         let res = e.detail.value
         if (props.modeFont !== 2) {
             if (Number(res) == 0 || Number(res) < 1) {
@@ -59,7 +61,7 @@ export default memo((props: props) => {
             }
             <View className={styles.rightGoodbox}>
                 <View className={styles.leftFontsbox}>
-                    <View className={styles.title}>{props.value?.code} {props.value?.name}环保黑</View>
+                    <View className={styles.title}>{props.value?.code} {props.value?.name}</View>
                     {/* <View className={styles.productName}>0681# 26S全棉平纹</View> */}
                     <View className={styles.productNums}>剩:{props.value?.roll}件</View>
                 </View>
@@ -72,7 +74,7 @@ export default memo((props: props) => {
                                 </View>
                             </View>
                             <View className={styles.numsBox}>
-                                <Input type={type as any} value={value.count} onInput={onInputEven}></Input>
+                                <Input type={type as any} value={value.count} onInput={onInputEven} onBlur={(e) => props.onBlur?.(e, props.value.id)}></Input>
 
                                 {/* <Input type={type as any} value={value.count} onInput={($event) => onInputEven($event, props.value)}></Input> */}
                             </View>
@@ -89,3 +91,4 @@ export default memo((props: props) => {
         </View>
     )
 })
+// ($event) => onInputEven($event, props.value)

src/components/shoppingCart/index.module.scss

@@ -138,4 +138,11 @@
         z-index: 999;
         bottom: calc($customTabBarHeight + env(safe-area-inset-bottom));
     }
+
+    .noBottom {
+        width: 100%;
+        position: fixed;
+        z-index: 999;
+        bottom: env(safe-area-inset-bottom);
+    }
 }

src/components/shoppingCart/index.tsx

@@ -8,7 +8,6 @@ import Goods from "@/components/goodsItem"
 import BottomCustomer from "@/components/BottomCustomer"
 import VirtualList from '@tarojs/components/virtual-list'
 import DotLoading from "@/components/dotLoading"
-
 interface prosObj {
     showPopup?: false | true,
     closePopup?: () => void,
@@ -17,7 +16,7 @@ interface prosObj {
     handCheck?: (any) => void,
     addNums?: (any) => void
     reduceNums?: (any) => void
-    oninputEvent?: (e: string, res: object) => void,
+    // oninputEvent?: (e: string, res: object) => void,
     getSearchData: (any) => void,
     handPlus: (any) => void,
     handSure: () => void,
@@ -28,7 +27,9 @@ interface prosObj {
     },
     modeFont: Number | string,
     clientName: string,
-    clientId: Number
+    clientId: Number,
+    hasBottom?: true | false, //默认不占位底部
+    onBlur?: (e: string, res: object) => void
 }
 export default memo(forwardRef((props: prosObj, ref) => {
     const {
@@ -39,14 +40,16 @@ export default memo(forwardRef((props: prosObj, ref) => {
         handCheck,
         addNums,
         reduceNums,
-        oninputEvent,
+        // oninputEvent,
         getSearchData,
         handPlus,
         obj = {},
         modeFont = 0,
         clientName = '',
         clientId = -1,
-        handSure
+        handSure,
+        hasBottom = true,
+        onBlur
     } = props
 
     useImperativeHandle(ref, () => ({
@@ -78,26 +81,39 @@ export default memo(forwardRef((props: prosObj, ref) => {
 
     //选择的条数或者米数
     const selectNums = useMemo(() => {
-        var s = 0;
+        let arr: any = []
-        goodList.forEach(function (val, idx, arr) {
+        goodList.forEach(item => {
-            if (val.showInput) {
+            if (item.showInput) {
-                s += val.nums;
+                arr.push(Number(item.nums))
             }
-        }, 0);
+        })
-
+        let hate = sum(arr)
-        return s;
+        return hate
     }, [goodList])
-    // onInputEven={(e, obj) => oninputEvent?.(e, obj)}
+    // onInputEven={(e, item) => oninputEvent?.(e, item)}
+
+    function sum(arr) {
+        var s = 0;
+        for (var i = arr.length - 1; i >= 0; i--) {
+            s += arr[i];
+        }
+        return s;
+    }
+
 
     const rows = memo(({ id, index, style, data }: any) => {
         let item = data[index]
         return (
             <>
-                <Goods modeFont={(modeFont as number)}
+                <Goods
+                    onBlur={(e, id) => onBlur?.(e, id)}
+                    modeFont={(modeFont as number)}
                     handPlus={(item) => handPlus?.(item)}
                     value={item || {}}
                     clickAdd={(item) => addNums?.(item)}
-                    clickReduce={(item) => { reduceNums?.(item) }}></Goods>
+                    clickReduce={(item) => { reduceNums?.(item) }}
+                    goodList={goodList}
+                ></Goods>
             </>
         )
     })
@@ -151,7 +167,10 @@ export default memo(forwardRef((props: prosObj, ref) => {
                             <View className={styles.loading_more}>加载中<DotLoading /></View>
                         </>
                     }
-                    <View className={styles.posBox}>
+                    {
+                        !hasBottom && <View style={{ height: '100rpx' }}></View>
+                    }
+                    <View className={classnames(hasBottom === true ? styles.posBox : styles.noBottom)}>
                         <BottomCustomer clientName={clientName} clientId={clientId} isDisabled={selectTotal > 0 && clientName !== '' ? false : true} handSure={() => { handSure() }}></BottomCustomer>
                     </View>
                 </View>

src/pages/addAddress/index.tsx

@@ -1,15 +1,13 @@
-import { alert, retrieval } from "@/common/common"
+import { alert } from "@/common/common"
 import Address from "@/components/address"
 import FromList from "@/components/FromList"
 import { Button, Input, Text, Textarea, View, Switch } from "@tarojs/components"
-import Taro, { setNavigationBarTitle, useDidShow, useRouter, showToast } from "@tarojs/taro"
+import Taro, { setNavigationBarTitle, useDidShow, useRouter } from "@tarojs/taro"
 import { useEffect, useMemo, useState } from "react"
 import styles from "./index.module.scss"
 import classnames from "classnames";
-import { mppurchaseraddress, mppurchaseraddressget, mppurchaseraddressput } from '@/api/addressList'
+import { mppurchaseraddress, mppurchaseraddressget, mppurchaseraddressput, mppurchaseraddressdelect } from '@/api/addressList'
 import { getFilterData } from '@/common/util'
-import search from "@/components/search"
-
 export default () => {
 
     const [itemList, setItemList] = useState<any[]>(
@@ -234,6 +232,31 @@ export default () => {
             })
         }
     }
+    // 删除地址
+    const { fetchData: deleteFetch } = mppurchaseraddressdelect()
+    const handleDelete = async () => {
+        Taro.showModal(({
+            title: "提示",
+            content: "是否删除地址？",
+            async success(ev) {
+                if (ev.confirm) {
+                    Taro.showLoading({
+                        title: '请稍等...'
+                    })
+                    const result = await deleteFetch({ id: Number(router.params.purchaser_id) });
+                    if (result.success) {
+                        alert.success("删除成功");
+                        Taro.hideLoading()
+                        Taro.navigateBack({
+                            delta: 1
+                        })
+                    } else {
+                        alert.error(result.msg);
+                    }
+                }
+            }
+        }))
+    }
     return (
         <>
             <View className={styles.main}>
@@ -278,7 +301,7 @@ export default () => {
             {
                 router.params.type === 'edit' &&
                 <View className={styles.bottomBox}>
-                    <Button className={styles.delectBox} >删除</Button>
+                    <Button className={styles.delectBox} onClick={() => handleDelete()}>删除</Button>
                     <Button onClick={() => handEdit()} disabled={btnDisabled} className={classnames(btnDisabled ? styles.nobtn : styles.sureBox)} >确认</Button>
                 </View>
             }

src/pages/index/index.tsx

@@ -9,12 +9,10 @@ import styles from './index.module.scss'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { kindListApi, ProductListApi } from '@/api/index'
 // import useLogin from '@/use/useLogin'
-import { mpproductcolorlist, mpsaleOrderpreView } from "@/api/order"
+import { mpproductcolorlist, mpshoppingCartproductColorlist } from "@/api/order"
 import { dataLoadingStatus } from '@/common/util'
 import Taro, { useDidShow } from '@tarojs/taro'
-import goodsItem from '@/components/goodsItem'
+import { getFilterData } from '@/common/util'
-import { WX_APPID } from '@/common/constant'
-import { debounce } from "@/common/util";
 export default () => {
     useEffect(() => {
         categoryList()
@@ -205,7 +203,7 @@ export default () => {
     })
 
     //加入购物车
-    const { fetchData: preViewFetch, } = mpsaleOrderpreView()
+    const { fetchData: preViewFetch, } = mpshoppingCartproductColorlist()
     const handSure = async () => {
         const arr = goodList.filter(item => {
             return item.showInput
@@ -213,16 +211,18 @@ export default () => {
         const list: any[] = []
         arr.forEach(it => {
             list.push({
-                shopping_cart_product_color_id: Number(it.id),
+                roll: search.modeId === 0 ? it.nums : 0,
-                sale_price: 0
+                length: search.modeId !== 0 ? it.nums * 100 : 0,
+                product_color_id: Number(it.id)
             })
         })
         const query = {
             purchaser_id: clientObj.clientId,
             sale_mode: search.modeId,
-            shopping_cart_product_color_list: list
+            color_list: list,
+            sale_offect: 0
         }
-        let res = await preViewFetch(query)
+        let res = await preViewFetch(getFilterData(query))
         Taro.showLoading({
             mask: true,
             title: '请稍等...'
@@ -248,6 +248,17 @@ export default () => {
             });
         }
     }
+    //输入框失焦
+    const onBlur = (e, id) => {
+        goodList.map((item) => {
+            if (item.id == id) {
+                item.nums = e.detail.value
+            }
+            return item
+        })
+        setGoodlist([...goodList])
+    }
+
     return (
         // <MoveBtn onClick={() => setShowShopCart(showShopCart)}>
         <View className={styles.main}>
@@ -283,7 +294,7 @@ export default () => {
                 obj={goodObj}
                 ref={ShopCartRef}
                 getSearchData={(e) => { getSearchData(e) }}
-
+                onBlur={(e, id) => onBlur(e, id)}
                 reduceNums={(item) => { reduceNums(item) }}
                 addNums={(item) => { handAdd(item) }}
                 showPopup={showShopCart}

src/pages/orderDetails/index.tsx

@@ -21,7 +21,8 @@ import {
     orderPaymentorderPaymentSubmission,
     orderPaymentpreCollectOrderorderPaymentSubmission,
     mpsaleOrdercancel,
-    GetPayCode
+    GetPayCode,
+    mpsaleOrderaddress
 } from '@/api/order'
 import { alert, goLink } from '@/common/common'
 import { formatPriceDiv, formatDateTime, formatWeightDiv } from '@/common/format'
@@ -44,13 +45,36 @@ export default () => {
     //收货方法,1:自提，2物流
     const [receivingStatus, setReceivingStatus] = useState(null)
     //切换自提或者物流
-    const onReceivingStatus = debounce((e, value) => {
+    const { fetchData: selectFetch } = mpsaleOrderaddress()
+    const onReceivingStatus = debounce(async (e, value) => {
         if (infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5) {
             alert.error('不允许更改')
             return false
         }
         e.stopPropagation()
-        setReceivingStatus(value)
+        if (receivingStatus === value) {
+            alert.error('不能选择相同的方式')
+            return false
+        }
+        Taro.showLoading({
+            title: '请稍等...',
+            mask: true
+        })
+        const res = await selectFetch({ id: Number(infoObj.id), shipment_mode: value })
+        if (res.msg === 'success') {
+            Taro.hideLoading()
+            Taro.showToast({
+                title: '成功',
+                icon: 'success'
+            })
+            setReceivingStatus(value)
+        } else {
+            Taro.hideLoading()
+            Taro.showToast({
+                title: res.msg,
+                icon: 'error'
+            })
+        }
     }, 300)
 
     const { fetchData: infoFetch } = mpsaleOrder()

src/pages/searchPage/components/goods/index.tsx

@@ -2,6 +2,8 @@ import { View, Image } from '@tarojs/components'
 import React, { useCallback, memo, useEffect, useMemo, useRef, useState } from 'react'
 import styles from "../goods/index.module.scss"
 import LabAndImg from "@/components/LabAndImg"
+
+
 export default memo((props: any) => {
 
 
@@ -9,7 +11,7 @@ export default memo((props: any) => {
         return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
     }, [])
     return (
-        <View className={styles.itemBox}>
+        <View className={styles.itemBox} onClick={() => props?.clickItem?.()}>
             {
                 props.data?.texture_url === '' && <>
 

src/pages/searchPage/index.tsx

@@ -4,18 +4,223 @@ import Search from '@/components/search'
 import styles from "./index.module.scss"
 import classnames from "classnames";
 import Empty from './components/empty'
-import Taro from '@tarojs/taro';
+import Taro, { useDidShow } from '@tarojs/taro';
 import Goods from './components/goods'
 import { mpproductlist } from "@/api/search"
+import { debounce } from "@/common/util";
+import ShopCart from '@/components/shoppingCart'
+import {
+    mpproductcolorlist,
+    mpshoppingCartproductColorlist,
+    mpsearchHistorylist,
+    mpsearchHistory
+} from "@/api/order"
+import { getFilterData } from '@/common/util'
+
 
 export default memo(() => {
-    //获取数据
+
-    const [histroyList, setHistroyList] = useState<any[]>(['a','b'])
+
+
+    const [clientObj, setclientObj] = useState({
+        clientId: -1,
+        clientName: ''
+    })
+    useDidShow(() => {
+
+        //获取选择的客户
+        let pages = Taro.getCurrentPages();
+        let currPage = pages[pages.length - 1]; // 获取当前页面
+        setclientObj({
+            clientId: currPage.data?.clientId,
+            clientName: currPage.data?.clientName,
+        })
+    })
+
+
+    //选择的类型
+    const [typeList, setTypeList] = useState<any[]>([{ id: 0, name: '大货', checked: true }, { id: 1, name: '剪版', checked: false }, { id: 2, name: '散剪', checked: false }])
+    const [goodList, setGoodlist] = useState<any[]>([])
+    const [search, setSearchObj] = useState({
+        modeId: 0,
+        goodsId: null,
+        code_or_name: '',
+        physical_warehouse: 1
+    })
+    const [showShopCart, setShowShopCart] = useState(false)
+
+
+    //监听选择的类型
+    useEffect(() => {
+        setSearchObj(search)
+        if (search.goodsId) getGoodList()
+    }, [search])
+
+
+    //获取商品
+    const { fetchData: colorlistFetch } = mpproductcolorlist()
+    const getGoodList = async () => {
+        const res = await colorlistFetch({ product_id: search.goodsId, sale_mode: search.modeId, code_or_name: search.code_or_name, physical_warehouse: 1 })
+        res.data.list.map((item) => {
+            item.showInput = false
+            if (search.modeId !== 2) {
+                item.nums = 1
+                item.buyNums = 1
+            } else {
+                item.nums = 3
+                item.buyNums = 3
+            }
+            return item
+        })
+        setGoodlist([...res.data.list])
+    }
+
+    //加入购物车
+    const { fetchData: preViewFetch, } = mpshoppingCartproductColorlist()
+    const handSure = async () => {
+        const arr = goodList.filter(item => {
+            return item.showInput
+        })
+        const list: any[] = []
+        arr.forEach(it => {
+            list.push({
+                roll: search.modeId === 0 ? it.nums : 0,
+                length: search.modeId !== 0 ? it.nums * 100 : 0,
+                product_color_id: Number(it.id)
+            })
+        })
+        const query = {
+            purchaser_id: clientObj.clientId,
+            sale_mode: search.modeId,
+            color_list: list,
+            sale_offect: 0
+        }
+        let res = await preViewFetch(getFilterData(query))
+        Taro.showLoading({
+            mask: true,
+            title: '请稍等...'
+        })
+        if (res.data) {
+            Taro.showToast({
+                title: "加入成功",
+                duration: 2000,
+            });
+            setShowShopCart(false)
+            goodList.map(item => {
+                item.showInput = false
+                return item
+            })
+            setGoodlist([...goodList])
+            console.log(search, '000000.0.0.')
+            Taro.hideLoading()
+        } else {
+            Taro.hideLoading()
+            Taro.showToast({
+                title: res.msg,
+                duration: 2000,
+            });
+        }
+    }
+
+    //点击输入框的加
+    const handPlus = useCallback((item) => {
+        goodList.map((it) => {
+            if (item.id === it.id) {
+                // if (it.nums > item.buyNums) {
+                it.nums++
+                // }
+            }
+            return item
+        })
+        setGoodlist([...goodList])
+    }, [goodList])
+
+
+    //输入了搜索关键字
+    const getSearchDataInput = useCallback((eq) => {
+        setSearchObj((e) => ({ ...e, code_or_name: eq }))
+    }, [])
+
+    const [goodObj, setGoodsobj] = useState({})
+    //点击对应商品显示购物车
+    const showCart = async (item) => {
+        console.log(item, 6666)
+        setSearchObj((e) => ({ ...e, goodsId: item.id }))
+        setShowShopCart(true)
+        setGoodsobj(item)
+    }
+
+    //点击加展示输入框
+    const handAdd = useCallback((item) => {
+        goodList.map((it) => {
+            if (item.id === it.id) {
+                it.showInput = true
+            }
+            return item
+        })
+        setGoodlist([...goodList])
+    }, [goodList])
+
+
+    //点击减
+    const reduceNums = useCallback((item) => {
+        goodList.map((it) => {
+            if (item.id === it.id) {
+                item.nums--
+                if (search.modeId !== 2) {
+                    if (item.nums < 1) it.showInput = false, it.nums = 1
+                } else {
+                    if (item.nums < 3) it.showInput = false, it.nums = 3
+                }
+
+            }
+            return item
+        })
+        setGoodlist([...goodList])
+    }, [goodList])
+
+    //选择类型
+    const handCheckMode = (item) => {
+        typeList.map(it => {
+            if (it.id === item.id) {
+                it.checked = true
+                setSearchObj((e) => ({ ...e, modeId: it.id }))
+            } else {
+                it.checked = false
+            }
+            return it
+        })
+        setTypeList([...typeList])
+        setGoodlist([])
+    }
+
+    //关闭弹窗
+    const closePoup = () => {
+        setShowShopCart(false)
+    }
+
+    //获取关键字数据
+    const [histroyList, setHistroyList] = useState<any[]>([])
+    const { fetchData: historyFetch } = mpsearchHistorylist()
+    const getHistory = async () => {
+        Taro.showLoading({
+            title: '加载中...',
+            mask: true
+        })
+        const res = await historyFetch()
+        if (res.data) {
+            setHistroyList([...res.data.list])
+            Taro.hideLoading()
+        }
+    }
+
     //搜索商品的数组
-    const [searchList, setSearchList] = useState<any[]>(['a'])
+    const [searchList, setSearchList] = useState<any[]>([])
     //是否有值输入框
     const [hasFonts, setHasFonts] = useState(false)
-
+    useEffect(() => {
+        getHistory()
+    }, [])
     //输入了搜索关键字
     const getSearchData = useCallback((e) => {
         if (e) {
@@ -25,21 +230,27 @@ export default memo(() => {
             setHasFonts(false)
             setSearchList([])
         }
-        // pageNum.current.page = 1
-        // setOrderData(() => ({ list: [], total: 0 }))
-        // setSearchField((val) => ({ ...val, name: e, size: 10 }))
     }, [])
     //搜索获取商品数据
     const { fetchData: productFetch } = mpproductlist()
-    const getProduct = async (e) => {
+    const { fetchData: historyputFetch } = mpsearchHistory()
-        const res = await productFetch({ code_or_name: e })
+    const getProduct = debounce(async (e) => {
-        // res.data.list.map(item=>{
+        Taro.showLoading({
-        //     if(item.texture_url !==''){
+            title: '加载中...',
-
+            mask: true
-        //     }
+        })
-        // })
+        await historyputFetch({ key: e, scene: 0 }).then((res) => {
-        setSearchList([...res.data.list])
+            if (res.data) {
-    }
+                getHistory()
+            }
+        })
+        productFetch({ code_or_name: e }).then((res) => {
+            if (res.data) {
+                Taro.hideLoading()
+                setSearchList([...res.data.list])
+            }
+        })
+    }, 300)
     //返回
     const back = () => {
         Taro.navigateBack({
@@ -47,6 +258,17 @@ export default memo(() => {
         })
     }
 
+    //输入框失焦
+    const onBlur = (e, id) => {
+        goodList.map((item) => {
+            if (item.id == id) {
+                item.nums = e.detail.value
+            }
+            return item
+        })
+        setGoodlist([...goodList])
+    }
+
     return (
         <View className={styles.main}>
             <Search placeholder='请输入搜索布料' showBtn={false} changeOnSearch={getSearchData} debounceTime={300} >
@@ -63,7 +285,7 @@ export default memo(() => {
                         <View className={styles.bigBox}>
                             {histroyList.map((item, index) => {
                                 return (
-                                    <View key={index} className={styles.itemBox}>{item}</View>
+                                    <View key={index} className={styles.itemBox}>{item.search_key}</View>
                                 )
                             })}
                         </View>
@@ -81,7 +303,7 @@ export default memo(() => {
                     {
                         !!searchList.length && searchList.map((item, index) => {
                             return (
-                                <Goods key={index} data={item}></Goods>
+                                <Goods clickItem={() => showCart(item)} key={index} data={item}></Goods>
                             )
                         })
                     }
@@ -90,9 +312,26 @@ export default memo(() => {
                     }
                 </>
             }
-
+            <ShopCart handSure={() => handSure()}
+                clientName={clientObj?.clientName}
+                clientId={clientObj?.clientId}
+                modeFont={search.modeId}
+                handPlus={(item) => handPlus(item)}
+                obj={goodObj}
+                getSearchData={(e) => { getSearchDataInput(e) }}
+                hasBottom={false}
+                reduceNums={(item) => { reduceNums(item) }}
+                addNums={(item) => { handAdd(item) }}
+                showPopup={showShopCart}
+                handCheck={(item) => { handCheckMode(item) }}
+                closePopup={() => closePoup()}
+                goodList={goodList}
+                typeList={typeList}
+                onBlur={(e, id) => onBlur(e, id)}
+            ></ShopCart>
 
         </View>
 
     )
 })
+// oninputEvent={(e, item) => { onInputEven?.(e, item) }}

src/pages/submitOrder/index.config.ts

@@ -0,0 +1,4 @@
+export default {
+    navigationBarTitleText: '确认订单',
+    
+}

src/pages/submitOrder/index.module.scss

@@ -0,0 +1,383 @@
+page {
+    background: #f7f7f7;
+}
+
+.mainBox {
+    .pussBox {
+        margin-top: 24px;
+        display: flex;
+        align-items: center;
+
+        .pussName {
+            font-size: 28px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+        }
+
+        .pussPhone {
+            margin-left: 88px;
+            font-size: 28px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+        }
+    }
+
+    .total {
+        margin-top: 44px;
+        font-size: 24px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #000000;
+        margin-left: 32px;
+        margin-bottom: 8px;
+    }
+
+    .productBox {
+        width: 702px;
+        background: #FFFFFF;
+        border-radius: 16px;
+        margin-left: 24px;
+        padding-bottom: 36px;
+        overflow: hidden;
+
+        .flexMoney {
+            display: flex;
+            margin-top: 32px;
+            align-items: center;
+            justify-content: space-between;
+
+            .flexTotalBox {
+                display: flex;
+                align-items: center;
+
+                .totalFont {
+                    margin-left: 32px;
+                    margin-right: 8px;
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+
+                .tishi {
+                    font-size: 28px;
+                }
+            }
+
+            .shoudPay {
+                font-size: 28px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: #F64861;
+                margin-right: 32px;
+            }
+        }
+    }
+}
+
+
+.defaltBox {
+    margin: 24px;
+    padding: 24px 32px 24px 24px;
+    background: #FFFFFF;
+    border-radius: 16px;
+
+    .titleBox {
+        width: 638px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        .title {
+            font-size: 28px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #000000;
+        }
+
+        .modeName {
+            font-size: 28px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #337FFF;
+        }
+    }
+
+    .modeLine {
+        margin-top: 24px;
+        width: 638px;
+        height: 1px;
+        background: #000000;
+        opacity: 0.1;
+    }
+
+}
+
+.goodsBox {
+    margin-top: 24px;
+    overflow: hidden;
+    border-bottom: 8px solid #F7F7F7;
+
+    .goodsProduct {
+        font-size: 28px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #000000;
+        margin-left: 32px;
+    }
+
+    .goodsLine {
+        width: 638px;
+        height: 1px;
+        background: #000000;
+        opacity: 0.1;
+        margin-left: 32px;
+        margin-top: 24px;
+    }
+
+    .itemGoods {
+        margin-top: 24px;
+        display: flex;
+
+        .itemPic {
+            margin-left: 32px;
+            margin-right: 42px;
+            width: 108px;
+            height: 108px;
+            background: #322F2F;
+            border-radius: 8px;
+        }
+
+        .itemRight {
+            padding-bottom: 24px;
+            width: 495px;
+            border-bottom: 1px solid #f7f7f7;
+
+            .item_right_top {
+                margin-bottom: 41px;
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+
+                .itemName {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+
+                .itemNums {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+            }
+
+            .item_right_Bottom {
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+
+                .itemMoney {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+
+                .itemMoneyOne {
+                    font-size: 28px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: #000000;
+                }
+            }
+        }
+
+
+    }
+
+    .itemGoods:last-child {
+        margin-top: 24px;
+        display: flex;
+
+        .itemPic {
+            margin-left: 32px;
+            margin-right: 42px;
+            width: 108px;
+            height: 108px;
+            background: #322F2F;
+            border-radius: 8px;
+        }
+
+        .itemRight {
+            padding-bottom: 24px;
+            width: 495px;
+            border-bottom: none;
+
+            .item_right_top {
+                margin-bottom: 41px;
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+
+                .itemName {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+
+                .itemNums {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+            }
+
+            .item_right_Bottom {
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+
+                .itemMoney {
+                    font-size: 28px;
+                    font-family: PingFangSC-Regular, PingFang SC;
+                    font-weight: 400;
+                    color: #000000;
+                }
+
+                .itemMoneyOne {
+                    font-size: 28px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: #000000;
+                }
+            }
+        }
+
+
+    }
+}
+
+.goodsBox:last-child {
+    border-bottom: none;
+}
+
+.detailBox {
+    display: flex;
+    margin-top: 24px;
+    align-items: center;
+    justify-content: space-between;
+
+    .detailRightFlex {
+        display: flex;
+        align-items: center;
+
+        .detailRight {
+
+            font-size: 28px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+        }
+
+        .detailBtn {
+            margin-left: 16px;
+            width: 65px;
+            height: 32px;
+            border-radius: 8px;
+            border: 1PX solid #337FFF;
+            font-size: 24px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #337FFF;
+            text-align: center;
+            line-height: 32px;
+        }
+    }
+
+    .detailFont {
+        font-size: 28px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #000000;
+    }
+}
+
+.remarkFont {
+    margin-top: 24px;
+    font-size: 28px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #000000;
+}
+
+.safeBottom {
+    height: 300px;
+}
+
+.bottomBox {
+    width: 750px;
+    height: 160px;
+    background: #FFFFFF;
+    display: flex;
+    // padding-top: 16px;
+    position: fixed;
+    bottom: 0;
+    justify-content: space-between;
+
+    .leftBottom {
+        margin-top: 22px;
+
+        .topFlex {
+            margin-left: 48px;
+            display: flex;
+            align-items: center;
+            margin-bottom: 14px;
+
+            .topFont {
+                font-size: 28px;
+                font-family: PingFangSC-Regular, PingFang SC;
+                font-weight: 400;
+                color: #000000;
+                margin-right: 10px;
+            }
+
+            .topTotal {
+                font-size: 24px;
+                font-family: PingFangSC-Medium, PingFang SC;
+                font-weight: 500;
+                color: #F64861;
+            }
+        }
+
+        .bottomFlex {
+            margin-left: 48px;
+            font-size: 24px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            font-weight: 400;
+            color: #000000;
+        }
+    }
+
+
+    .rightBottom {
+        margin-top: 16px;
+        width: 224px;
+        height: 80px;
+        background: #4581FF;
+        border-radius: 40px;
+        font-size: 32px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #FFFFFF;
+        text-align: center;
+        line-height: 80px;
+        margin-right: 24px;
+    }
+}

src/pages/submitOrder/index.tsx

@@ -0,0 +1,230 @@
+import { View } from '@tarojs/components'
+import React, { useCallback, memo, useEffect, useMemo, useRef, useState, ReactNode } from 'react'
+import styles from "./index.module.scss"
+import classnames from "classnames";
+import Taro, { usePullDownRefresh, useRouter, useDidShow } from '@tarojs/taro';
+import AddressDetailBox from '../orderDetails/components/addressDetailBox'
+import Remark from '../orderDetails/components//remark'
+import Popup from '@/components/popup'
+import { debounce } from '@/common/util'
+import {
+    mpsaleOrder,
+    mpsaleOrderput,
+    mpsaleOrderaddress
+} from '@/api/order'
+import { alert } from '@/common/common'
+import { formatPriceDiv, formatDateTime, formatWeightDiv } from '@/common/format'
+
+export default () => {
+    const router = useRouter()
+
+    useDidShow(() => {
+        getDetail()
+    })
+    //页面下拉刷新
+    usePullDownRefresh(() => {
+        getDetail()
+    })
+
+
+    //收货方法,1:自提，2物流
+    const [receivingStatus, setReceivingStatus] = useState(null)
+    //切换自提或者物流
+    const { fetchData: selectFetch } = mpsaleOrderaddress()
+    const onReceivingStatus = debounce(async (e, value) => {
+        if (infoObj.status === 8 || infoObj.status === 9 || infoObj.status === 4 || infoObj.status === 5) {
+            alert.error('不允许更改')
+            return false
+        }
+        e.stopPropagation()
+        if (receivingStatus === value) {
+            alert.error('不能选择相同的方式')
+            return false
+        }
+        Taro.showLoading({
+            title: '请稍等...',
+            mask: true
+        })
+        const res = await selectFetch({ id: Number(infoObj.id), shipment_mode: value })
+        if (res.msg === 'success') {
+            Taro.hideLoading()
+            Taro.showToast({
+                title: '成功',
+                icon: 'success'
+            })
+            setReceivingStatus(value)
+        } else {
+            Taro.hideLoading()
+            Taro.showToast({
+                title: res.msg,
+                icon: 'error'
+            })
+        }
+    }, 300)
+
+    const { fetchData: infoFetch } = mpsaleOrder()
+    const [infoObj, setInfoObj] = useState<any>({})
+    //获取订单详情
+    const getDetail = async () => {
+        const res = await infoFetch({ id: 27708 })
+        setInfoObj(res.data)
+        setReceivingStatus(res.data.shipment_mode)
+    }
+
+    //备注操作
+    const [showDesc, setShowDesc] = useState(false)
+    const { fetchData: remarkFetch } = mpsaleOrderput()
+    const getRemark = useCallback(async (e) => {
+        const res = await remarkFetch({ remark: e, id: Number(router.params.id) })
+        if (res.msg === 'success') {
+            Taro.showToast({
+                title: '成功',
+                icon: 'success'
+            })
+            setShowDesc(false)
+            getDetail()
+        }
+    }, [])
+
+
+
+
+    const handSelect = (obj) => {
+        Taro.navigateTo({
+            url: '/pages/addressManager/index?orderId=' + obj.id + '&purchaser_id=' + obj.purchaser_id
+        })
+    }
+
+    return (
+        <View className={styles.mainBox}>
+            <AddressDetailBox
+                navSelect={(obj) => handSelect(obj)}
+                obj={infoObj}
+                receivingStatus={receivingStatus}
+                onReceivingStatus={(e, value) => onReceivingStatus(e, value)}
+            ></AddressDetailBox>
+            <DefaultBox
+                showMode={true}
+                title={'客户信息'}
+                modeName={infoObj.sale_mode_name}
+            >
+                <View className={styles.pussBox}>
+                    <View className={styles.pussName}>{infoObj.purchaser_name}</View>
+                    <View className={styles.pussPhone}>{infoObj.purchaser_phone}</View>
+                </View>
+            </DefaultBox>
+            <View className={styles.total}> {infoObj.total_fabrics} 种面料，{infoObj.total_colors} 个颜色，共 {infoObj.sale_mode === 0 ? infoObj.total_number : infoObj.total_number / 100} {infoObj.sale_mode === 0 ? '条' : 'm'}</View>
+            <View className={styles.productBox}>
+                <GoodsItem list={infoObj?.product_list} obj={infoObj}></GoodsItem>
+                <View className={styles.flexMoney}>
+                    <View className={styles.flexTotalBox}>
+                        <View className={styles.totalFont}>合计金额</View>
+                        <View className={classnames('iconfont', 'icon-tishi', styles.tishi)}></View>
+                    </View>
+                    <View className={styles.shoudPay}>{formatPriceDiv(infoObj.total_should_collect_money)}</View>
+                </View>
+            </View>
+            <DefaultBox title={'备注信息'} showMode={true} modeName={`${'填写/修改备注'} >`} clickNode={() => setShowDesc(true)}>
+                <View className={styles.remarkFont}>{infoObj.remark === '' ? '暂无' : infoObj.remark}</View>
+            </DefaultBox>
+            <Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
+                <Remark onSave={(e) => getRemark(e)} defaultValue={infoObj.remark} />
+            </Popup>
+            <View className={styles.safeBottom}></View>
+            <View className={styles.bottomBox}>
+                <View className={styles.leftBottom}>
+                    <View className={styles.topFlex}>
+                        <View className={styles.topFont}>预估金额:</View>
+                        <View className={styles.topTotal}>¥3564.00</View>
+                    </View>
+                    <View className={styles.bottomFlex}>3 种面料，3 种颜色，共 3 M</View>
+                </View>
+                <View className={styles.rightBottom}>提交订单</View>
+            </View>
+        </View>
+    )
+}
+
+
+
+//卡片盒子元素
+interface Obs {
+    title?: string,
+    modeName?: string,
+    showMode?: boolean,
+    children?: ReactNode,
+    clickNode?: () => void
+}
+
+const DefaultBox = memo((props: Obs) => {
+    const {
+        title = '标题',
+        modeName = '大货',
+        showMode = false,
+        children,
+        clickNode
+    } = props
+
+    return (
+        <View className={styles.defaltBox}>
+            <View className={styles.titleBox}>
+                <View className={styles.title}>{title}</View>
+                {
+                    showMode && <View className={styles.modeName} onClick={() => clickNode?.()}>{modeName}</View>
+                }
+            </View>
+            <View className={styles.modeLine}></View>
+            {children}
+        </View>
+    )
+})
+
+
+//产品商品元素
+interface PropGoods {
+    // item?: {
+    //     code?: string | number
+    // }
+    list: any[],
+    obj: {
+        sale_mode?: number | string
+    },
+}
+const GoodsItem = memo((porps: PropGoods) => {
+    const { list = [], obj = {} } = porps
+    return (
+        <>
+            {
+                list.map((item, index) => {
+                    return (
+                        <View className={styles.goodsBox} key={index}>
+                            <View className={styles.goodsProduct}>{item.code}# {item.name}</View>
+                            <View className={styles.goodsLine}></View>
+                            {
+                                item.product_colors.map((it, inx) => {
+                                    return (
+                                        <View className={styles.itemGoods}>
+                                            <View className={styles.itemPic} style={{ backgroundColor: `rgb(${it?.rgb?.r} ${it?.rgb?.g} ${it?.rgb?.b})` }}></View>
+                                            <View className={styles.itemRight}>
+                                                <View className={styles.item_right_top}>
+                                                    <View className={styles.itemName}>{it.code}# {it.name}</View>
+                                                    <View className={styles.itemNums}>x{obj?.sale_mode === 0 ? it.roll : it.length / 100}{obj?.sale_mode === 0 ? '条' : 'm'}</View>
+                                                </View>
+                                                <View className={styles.item_right_Bottom}>
+                                                    <View className={styles.itemMoney}>¥{it.sale_price / 100}/{obj?.sale_mode === 0 ? '条' : 'm'}</View>
+                                                    <View className={styles.itemMoneyOne}>¥{formatPriceDiv(it.total_sale_price)}</View>
+                                                </View>
+                                            </View>
+                                        </View>
+                                    )
+                                })
+                            }
+                        </View>
+                    )
+                })
+            }
+        </>
+
+    )
+})
+