✨ feat(ID1000928): 【领取色卡】新增色卡只能购买5种色卡

【【领取色卡】新增色卡只能购买5种色卡】 https://www.tapd.cn/53459131/prong/stories/view/1153459131001000928

config/dev.js

@@ -22,10 +22,10 @@ module.exports = {
             args: [
               {
                 terserOptions: {
-                  compress: true, // 默认使用terser压缩
-                  // compress: {
-                  //   drop_console: true, // 去掉打印
-                  // }, // 默认使用terser压缩
+                  // compress: true, // 默认使用terser压缩
+                  compress: {
+                    drop_console: false, // 去掉打印
+                  }, // 默认使用terser压缩
                   // mangle: false,
                   keep_classnames: true, // 不改变class名称
                   keep_fnames: true, // 不改变函数名称

config/pre.js

@@ -24,7 +24,7 @@ module.exports = {
                 terserOptions: {
                   // compress: true, // 默认使用terser压缩
                   compress: {
-                    // drop_console: true, // 去掉打印
+                    drop_console: false, // 去掉打印
                   }, // 默认使用terser压缩
                   // mangle: false,
                   keep_classnames: true, // 不改变class名称

src/components/checkbox/index.module.scss

@@ -37,7 +37,7 @@
   }
 }
 .checkbox_main_no_selected {
-  border: 0 !important;
+  border-color: #c2c2c2;
 }
 .checkbox_item {
   display: flex;
@@ -45,7 +45,7 @@
   justify-content: center;
 }
 .no_checkbox_item {
-  border: 0 !important;
+  border-color: #c2c2c2;
   background-color: #dddddd !important;
 }
 .checkbox_item_select {

src/components/checkbox/index.tsx

@@ -44,6 +44,7 @@ const Checkbox = (props: params, ref) => {
   })
 
   const onSelectEven = () => {
+    console.log('disabled', disabled)
     if (disabled) { return false }
     const res = !selected
     if (res) {

src/pages/colorCardClipping/components/productItem/index.tsx

@@ -66,7 +66,7 @@ export default (props: Param) => {
         </View>
         <View className={styles.item_con_tag}>
           {
-            value.color_card_info?.[0].affiliation_product?.map((item) => {
+            value.color_card_info?.[0]?.affiliation_product?.map((item) => {
               return <View className={styles.tag} key={item.id}>{formatRemoveHashTag(item.code)}</View>
             })
           }

src/pages/colorCardList/components/productItem/index.tsx

@@ -3,6 +3,7 @@ import { memo, useCallback, useMemo, useState } from 'react'
 import styles from './index.module.scss'
 import LabAndImg from '@/components/LabAndImg'
 import Checkbox from '@/components/checkbox'
+import { alert } from '@/common/common'
 
 interface ProductItemParamType {
   code: string
@@ -19,13 +20,22 @@ export interface ParamType {
   is_add: boolean
   onSelect?: (val: ParamType, status: boolean) => void
   count?: number
+  selectList?: any[]
 }
 
+// 限制5个
+const limit = 5
+
 export default memo((props: ParamType) => {
-  const { affiliation_product, color_card_name = '', texture_url = '', lab, rgb } = props
+  const { affiliation_product, color_card_name = '', texture_url = '', lab, rgb, selectList } = props
   const [checkStatus, setCheckStatus] = useState(false)
   const changeSelect = () => {
+    console.log('isDisabled', isDisabled)
     if (props.is_add) { return false }
+    if (isDisabled) {
+      alert.none('每次最多申请5种面料')
+      return false
+    }
     setCheckStatus(!checkStatus)
     props.onSelect?.(props, !checkStatus)
   }
@@ -38,6 +48,20 @@ export default memo((props: ParamType) => {
     props.onSelect?.(props, false)
     setCheckStatus(false)
   }
+
+  const isDisabled = useMemo(() => {
+    const set = new Set(selectList?.map(item => item.id))
+    if (selectList) {
+      if (set.has(props.id)) {
+        return false
+      }
+      return set.size >= limit
+    }
+    else {
+      return false
+    }
+  }, [selectList])
+
   const labAndImgObj = useMemo(
     () => {
       return { lab: props.lab, rgb: props.rgb, texture_url: props.texture_url }
@@ -56,7 +80,7 @@ export default memo((props: ParamType) => {
       </View>
     </View>
     <View className={styles.checkBox} onClick={e => e.stopPropagation()}>
-      <Checkbox status={props.is_add ? true : checkStatus} disabled={props.is_add} onSelect={onSelect} onClose={onClose} />
+      <Checkbox status={props.is_add ? true : checkStatus} disabled={props.is_add || isDisabled} onSelect={onSelect} onClose={onClose} />
     </View>
   </View>
 })

src/pages/colorCardList/index.tsx

@@ -104,6 +104,8 @@ export default () => {
   const multipleSelection = useRef<any[]>([])
 
   const onSelectData = (val, status) => {
+    console.log('onSelectData', val, status)
+    console.log('selectList', selectList)
     if (status) {
       multipleSelection.current.push(val)
       setSelectList(e => [val, ...e])
@@ -133,7 +135,7 @@ export default () => {
         {colorCardData.list?.map((item) => {
           return (
             <View className={styles.get_card_list} key={item.id}>
-              <ProductItem {...item} onSelect={onSelectData} />
+              <ProductItem selectList={selectList} {...item} onSelect={onSelectData} />
             </View>
           )
         })}

src/pages/cutSampleListOrder/index.config.ts

@@ -1,6 +1,5 @@
 export default {
   navigationBarTitleText: '领取剪样',
-  enableShareAppMessage: true,
   disableSwipeBack: true,
   navigationStyle: 'custom',
 }