🐳 chore(eslint): 修正所有文件的eslint 错误❌

2022-11-28 11:06:15 +08:00
parent 99a920975f
commit cc99111b4f
149 changed files with 3270 additions and 3252 deletions
@@ -11,8 +11,7 @@ interface PropsType {
  disabled?: boolean
  isSelectAll?: boolean
 }
-
-export default (props: PropsType) => {
+const BottomEditBar = (props: PropsType) => {
  const { onDelete, onSelectCheckbox, disabled = false, isSelectAll: selectAll = false } = props
  const dispatch = useShoppingDispatch()
  console.log('isSelectAll==>', selectAll)
@@ -57,3 +56,5 @@ export default (props: PropsType) => {
    </View>
  )
 }
+
+export default BottomEditBar
@@ -8,8 +8,7 @@ interface PropsType {
  amount?: number
  onSettleAccount?: Function
 }
-
-export default (props: PropsType) => {
+const BottomSettleBar = (props: PropsType) => {
  const { onSettleAccount, amount = 0 } = props

  const handleSettle = () => {
@@ -36,3 +35,5 @@ export default (props: PropsType) => {
    </View>
  )
 }
+
+export default BottomSettleBar
@@ -43,11 +43,6 @@ const ColorKindItem: FC<PropsType> = (props) => {
    return itemData.sale_mode == EnumSaleMode.Bulk ? itemData.roll : formatMeterDiv(itemData.length)
  }

-  useEffect(() => {
-    console.log('itemData==>', itemData)
-    setCount(formatCount(itemData))
-  }, [itemData.roll, itemData.length])
-
  const [count, setCount] = useState(formatCount(itemData))

  // 格式化金额
@@ -111,7 +106,10 @@ const ColorKindItem: FC<PropsType> = (props) => {
  const labAndImgObj = useCallback((item) => {
    return { lab: item.lab, rgb: item.rgb, texture_url: item.product_color_texture_url }
  }, [])
-
+  useEffect(() => {
+    console.log('itemData==>', itemData)
+    setCount(formatCount(itemData))
+  }, [itemData.roll, itemData.length])
  return (
    <MCheckbox
      status={isChecked}
@@ -23,6 +23,11 @@ import LoadingCard from '@/components/loadingCard'
 import { ShoppingCartListApi } from '@/api'
 import { usePropsValue } from '@/use/useCommon'

+enum BackEndSaleModeListFieldMap {
+  bulk_color_list = 0,
+  length_cut_color_list = 1,
+  weight_cut_color_list = 2,
+}
 interface ButtonPropsType {
  isActive: boolean
  onClick?: Function
@@ -43,19 +48,138 @@ const SaleModeButton: FC<ButtonPropsType> = (props) => {
  )
 }

-const DrawerButton = memo<{ isOpen: boolean }>(({ isOpen }) => {
+const DrawerButton = ({ isOpen }: { isOpen: boolean }) => {
  return (
    <View className={styles.drawerButton}>
      {isOpen ? <IconFont name="icon-shouqi" size={52}></IconFont> : <IconFont name="icon-zhankai" size={52}></IconFont>}
    </View>
  )
-})
-
-enum BackEndSaleModeListFieldMap {
-  bulk_color_list = 0,
-  length_cut_color_list = 1,
-  weight_cut_color_list = 2,
 }
+const DrawerButtonWithMemo = memo(DrawerButton)
+
+interface GoodsListPropType {
+  itemData?: ShoppingCartData
+  multipleSelection?: GoodsMeta['multipleSelection']
+  selected: EnumSaleMode
+  isPending: boolean
+  startTransition: React.TransitionStartFunction
+}
+const GoodsList = (props: GoodsListPropType) => {
+  const { itemData, selected, isPending, startTransition, multipleSelection } = props
+  const prevMultipleSelection = useRef(multipleSelection)
+  const currentSelected = useRef<EnumSaleMode | null>(null)
+
+  const dispatch = useShoppingDispatch()
+
+  const [component, setComponent] = useState<JSX.Element | null>(null)
+  // 使用 produce 更新特定的 ColorKindItem
+  const updateSpecifiedComponent = () => {
+    let newId
+    if (multipleSelection && prevMultipleSelection.current !== multipleSelection) {
+      for (const key in multipleSelection) {
+        if (!prevMultipleSelection.current?.hasOwnProperty(key)) {
+          newId = key
+          break
+        }
+      }
+    }
+    console.log('multipleSelection==+>', multipleSelection)
+    console.log('currentSelected', currentSelected.current, selected)
+    console.log('component', component)
+    if (component) {
+      if (itemData?.[BackEndSaleModeListFieldMap[selected]].length !== 0) {
+        setComponent(produce(component, (draft) => {
+          console.log('prev', component)
+          const index = (draft as unknown as any[]).findIndex(item => item.key === newId)
+          console.log('index', index)
+          if (index !== -1) {
+            const item = itemData?.[BackEndSaleModeListFieldMap[selected]].find((item) => {
+              return item.id === Number(newId)
+            })
+            console.log('item', item, newId)
+            draft![index] = <ColorKindItem checked={multipleSelection?.hasOwnProperty(newId)} purchaserId={itemData?.purchaser_id} key={newId} itemData={item}></ColorKindItem>
+          }
+        }))
+      }
+      else {
+        setComponent(<View className={styles.noList}>暂无数据</View>)
+      }
+    }
+    prevMultipleSelection.current = multipleSelection
+  }
+  // 更新 GoodsList 组件
+  const updateComponent = () => {
+    setComponent(
+      () => itemData?.[BackEndSaleModeListFieldMap[selected]].length !== 0
+        ? (
+          itemData?.[BackEndSaleModeListFieldMap[selected]].map((item) => {
+            console.log('item===>', item, multipleSelection?.hasOwnProperty(item.id))
+            return <ColorKindItem checked={multipleSelection?.hasOwnProperty(item.id)} purchaserId={itemData.purchaser_id} key={item.id} itemData={item}></ColorKindItem>
+          })
+        )
+        : (
+          <View className={styles.noList}>暂无数据</View>
+        ),
+    )
+    prevMultipleSelection.current = multipleSelection
+  }
+
+  useEffect(() => {
+    const newGoodsKind = Object.fromEntries(
+      itemData?.[BackEndSaleModeListFieldMap[selected]].map(item => [
+        item?.id,
+        {
+          id: item?.id,
+          estimate_amount: item.estimate_amount,
+          product_code: item.product_code,
+          product_color_code: item.product_color_code,
+          sale_mode: item.sale_mode,
+          count: selected === EnumSaleMode.Bulk ? item.roll : Number(formatMeterDiv(item.length)),
+        },
+      ]),
+    )
+    // 这里做一层比较是为了 重新渲染的时候如果没有切换订单类型的话就不让面料的选中状态初始化
+    if (currentSelected.current === selected) {
+      dispatch({
+        type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
+        data: {
+          purchaserId: itemData?.purchaser_id as number,
+          goodsKind: newGoodsKind,
+          multipleSelection,
+        },
+      })
+      updateComponent()
+    }
+    else {
+      currentSelected.current = selected
+      // 重新把当前的选中状态赋值给ref 作为下一次比较的旧状态
+      dispatch({
+        type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
+        data: {
+          purchaserId: itemData?.purchaser_id as number,
+          goodsKind: newGoodsKind,
+          multipleSelection: {},
+        },
+      })
+      startTransition(updateComponent)
+    }
+  }, [itemData, selected, multipleSelection])
+
+  return (
+    <>
+      {isPending
+        ? (
+          <View className={styles.noList} style={{ margin: '60rpx 0' }}>
+            <LoadingCard />
+          </View>
+        )
+        : (
+          component
+        )}
+    </>
+  )
+}
+const GoodsListWithMemo = memo<GoodsListPropType>(GoodsList)

 interface PropsType {
  itemData?: ShoppingCartData
@@ -79,13 +203,9 @@ const ShoppingCartItem: FC<PropsType> = (props) => {

  const [openDetail, setOpenDetail] = useState(false)

-  const handleOpenDetail = () => {
-    setOpenDetail(isOpen => !isOpen)
-    handleClickLayout()
-  }
-
  const [selected, setSelect] = useState<EnumSaleMode>(0)

+  const [isPending, startTransition] = useTransition()
  const onSelectOrderType = (type: EnumSaleMode) => {
    if (isPending) { return }
    setSelect(type)
@@ -107,7 +227,10 @@ const ShoppingCartItem: FC<PropsType> = (props) => {
    })
    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS, data: false })
  }
-
+  const handleOpenDetail = () => {
+    setOpenDetail(isOpen => !isOpen)
+    handleClickLayout()
+  }
  // 统计已选面料
  const materialChecked = useMemo(() => {
    if (!multipleSelection || isEmptyObject(multipleSelection)) { return 0 }
@@ -146,7 +269,6 @@ const ShoppingCartItem: FC<PropsType> = (props) => {
    )
  }, [multipleSelection, currentCheckedPurchaserId, selected, itemData])

-  const [isPending, startTransition] = useTransition()
  const { fetchData } = ShoppingCartListApi()
  // 更新当前客户的多选项
  const updatePurchaserMultipleSelection = (purchaserId, payload, operationType: OperationType, goodsId: number) => {
@@ -268,7 +390,7 @@ const ShoppingCartItem: FC<PropsType> = (props) => {
            </Text>
          </View>
        </View>
-        <DrawerButton isOpen={openDetail} />
+        <DrawerButtonWithMemo isOpen={openDetail} />
      </View>
      {/* 减少节点渲染 */}
      {openDetail && (
@@ -313,7 +435,7 @@ const ShoppingCartItem: FC<PropsType> = (props) => {
              </View>
            </View>
            <View className={styles.orderContainer}>
-              <GoodsList
+              <GoodsListWithMemo
                multipleSelection={multipleSelection}
                itemData={itemData}
                selected={selected}
@@ -328,128 +450,6 @@ const ShoppingCartItem: FC<PropsType> = (props) => {
  )
 }

-interface GoodsListPropType {
-  itemData?: ShoppingCartData
-  multipleSelection?: GoodsMeta['multipleSelection']
-  selected: EnumSaleMode
-  isPending: boolean
-  startTransition: React.TransitionStartFunction
-}
-const GoodsList = memo<GoodsListPropType>((props) => {
-  const { itemData, selected, isPending, startTransition, multipleSelection } = props
-  const prevMultipleSelection = useRef(multipleSelection)
-  const currentSelected = useRef<EnumSaleMode | null>(null)
-
-  const dispatch = useShoppingDispatch()
-
-  const [component, setComponent] = useState<JSX.Element | null>(null)
-  // 使用 produce 更新特定的 ColorKindItem
-  const updateSpecifiedComponent = () => {
-    let newId
-    if (multipleSelection && prevMultipleSelection.current !== multipleSelection) {
-      for (const key in multipleSelection) {
-        if (!prevMultipleSelection.current?.hasOwnProperty(key)) {
-          newId = key
-          break
-        }
-      }
-    }
-    console.log('multipleSelection==+>', multipleSelection)
-    console.log('currentSelected', currentSelected.current, selected)
-    console.log('component', component)
-    if (component) {
-      if (itemData?.[BackEndSaleModeListFieldMap[selected]].length !== 0) {
-        setComponent(produce(component, (draft) => {
-          console.log('prev', component)
-          const index = (draft as unknown as any[]).findIndex(item => item.key === newId)
-          console.log('index', index)
-          if (index !== -1) {
-            const item = itemData?.[BackEndSaleModeListFieldMap[selected]].find((item) => {
-              return item.id === Number(newId)
-            })
-            console.log('item', item, newId)
-            draft![index] = <ColorKindItem checked={multipleSelection?.hasOwnProperty(newId)} purchaserId={itemData?.purchaser_id} key={newId} itemData={item}></ColorKindItem>
-          }
-        }))
-      }
-      else {
-        setComponent(<View className={styles.noList}>暂无数据</View>)
-      }
-    }
-    prevMultipleSelection.current = multipleSelection
-  }
-  // 更新 GoodsList 组件
-  const updateComponent = () => {
-    setComponent(
-      () => itemData?.[BackEndSaleModeListFieldMap[selected]].length !== 0
-        ? (
-          itemData?.[BackEndSaleModeListFieldMap[selected]].map((item) => {
-            console.log('item===>', item, multipleSelection?.hasOwnProperty(item.id))
-            return <ColorKindItem checked={multipleSelection?.hasOwnProperty(item.id)} purchaserId={itemData.purchaser_id} key={item.id} itemData={item}></ColorKindItem>
-          })
-        )
-        : (
-          <View className={styles.noList}>暂无数据</View>
-        ),
-    )
-    prevMultipleSelection.current = multipleSelection
-  }
-
-  useEffect(() => {
-    const newGoodsKind = Object.fromEntries(
-      itemData?.[BackEndSaleModeListFieldMap[selected]].map(item => [
-        item?.id,
-        {
-          id: item?.id,
-          estimate_amount: item.estimate_amount,
-          product_code: item.product_code,
-          product_color_code: item.product_color_code,
-          sale_mode: item.sale_mode,
-          count: selected === EnumSaleMode.Bulk ? item.roll : Number(formatMeterDiv(item.length)),
-        },
-      ]),
-    )
-    // 这里做一层比较是为了 重新渲染的时候如果没有切换订单类型的话就不让面料的选中状态初始化
-    if (currentSelected.current === selected) {
-      dispatch({
-        type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
-        data: {
-          purchaserId: itemData?.purchaser_id!,
-          goodsKind: newGoodsKind,
-          multipleSelection,
-        },
-      })
-      updateComponent()
-    }
-    else {
-      currentSelected.current = selected
-      // 重新把当前的选中状态赋值给ref 作为下一次比较的旧状态
-      dispatch({
-        type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
-        data: {
-          purchaserId: itemData?.purchaser_id!,
-          goodsKind: newGoodsKind,
-          multipleSelection: {},
-        },
-      })
-      startTransition(updateComponent)
-    }
-  }, [itemData, selected, multipleSelection])
-
-  return (
-    <>
-      {isPending
-        ? (
-          <View className={styles.noList} style={{ margin: '60rpx 0' }}>
-            <LoadingCard />
-          </View>
-        )
-        : (
-          component
-        )}
-    </>
-  )
-})
 // State 分割组件 思路就是把 context 直接通过 props 的形式传给组件，这样的话就解决了 context 强制刷新 memo 的问题了
 // 那么当 context 内的 value 被更新的时候，react 只会强制渲染 Wrapper
 const withStateSlice = (comp, slice) => {
@@ -18,29 +18,6 @@ import IconText from '@/components/iconText'
 import Search from '@/components/search'
 import { alert, goLink, isEmptyObject } from '@/common/common'

-export const Shopping: FC = memo(() => {
-  // 计算总的预估金额
-  const handleTriggerCheckbox = ({ multipleSelection, setSelectedAmount }) => {
-    console.log('handleTriggerCheckbox==>', multipleSelection)
-
-    if (multipleSelection) {
-      const result = Object.values(multipleSelection).reduce((prev: number, value: Goods) => {
-        return prev + Number(formatPriceDiv(value.estimate_amount))
-      }, 0) as number
-      // 同步修改上下文的 预估金额
-      setSelectedAmount(result)
-    }
-    else {
-      setSelectedAmount(0)
-    }
-  }
-  return (
-    <ShoppingProvider onTriggerCheckbox={handleTriggerCheckbox}>
-      <ShoppingCartContainer />
-    </ShoppingProvider>
-  )
-})
-
 interface SearchOptions {
  short_name_or_phone?: string
 }
@@ -272,5 +249,27 @@ const ShoppingCartContainer: FC = () => {
    </View>
  )
 }
+export const Shopping: FC = () => {
+  // 计算总的预估金额
+  const handleTriggerCheckbox = ({ multipleSelection, setSelectedAmount }) => {
+    console.log('handleTriggerCheckbox==>', multipleSelection)

-export default Shopping
+    if (multipleSelection) {
+      const result = Object.values(multipleSelection).reduce((prev: number, value: Goods) => {
+        return prev + Number(formatPriceDiv(value.estimate_amount))
+      }, 0) as number
+      // 同步修改上下文的 预估金额
+      setSelectedAmount(result)
+    }
+    else {
+      setSelectedAmount(0)
+    }
+  }
+  return (
+    <ShoppingProvider onTriggerCheckbox={handleTriggerCheckbox}>
+      <ShoppingCartContainer />
+    </ShoppingProvider>
+  )
+}
+
+export default memo(Shopping)