feat(Sku): add disable-soldout-sku prop (#7759)

* feat(Sku): 售罄sku支持点击

* feat(Sku): add disable-soldout-sku prop

Co-authored-by: zhanglin_0715 <zhanglin_0715@youzan.com>

packages/vant-cli/site/desktop/App.vue

@@ -39,7 +39,7 @@ export default {
 
     langConfigs() {
       const { locales = {} } = config.site;
-      return Object.keys(locales).map(key => ({
+      return Object.keys(locales).map((key) => ({
         lang: key,
         label: locales[key].langLabel || '',
       }));

packages/vant-cli/site/desktop/components/Header.vue

@@ -90,7 +90,7 @@ export default {
     },
 
     anotherLang() {
-      const items = this.langConfigs.filter(item => item.lang !== this.lang);
+      const items = this.langConfigs.filter((item) => item.lang !== this.lang);
       if (items.length) {
         return items[0];
       }

packages/vant-cli/src/common/css.ts

@@ -39,7 +39,7 @@ const IMPORT_STYLE_RE = /import\s+?(?:(?:".*?")|(?:'.*?'))[\s]*?(?:;|$|)/g;
 
 // "import 'a.less';" => "import 'a.css';"
 export function replaceCssImportExt(code: string) {
-  return code.replace(IMPORT_STYLE_RE, str =>
+  return code.replace(IMPORT_STYLE_RE, (str) =>
     str.replace(`.${CSS_LANG}`, '.css')
   );
 }

packages/vant-cli/src/compiler/get-deps.ts

@@ -62,8 +62,8 @@ export function getDeps(filePath: string) {
   const code = readFileSync(filePath, 'utf-8');
   const imports = matchImports(code);
   const paths = imports
-    .map(item => getPathByImport(item, filePath))
-    .filter(item => !!item) as string[];
+    .map((item) => getPathByImport(item, filePath))
+    .filter((item) => !!item) as string[];
 
   depsMap[filePath] = paths;
 
@@ -76,7 +76,7 @@ export function getDeps(filePath: string) {
 export function replaceScriptImportExt(code: string, from: string, to: string) {
   const importLines = matchImports(code);
 
-  importLines.forEach(importLine => {
+  importLines.forEach((importLine) => {
     const result = importLine.replace(from, to);
     code = code.replace(importLine, result);
   });

packages/vant-markdown-vetur/src/parser.ts

@@ -27,7 +27,7 @@ function readLine(input: string) {
 function splitTableLine(line: string) {
   line = line.replace('\\|', 'JOIN');
 
-  const items = line.split('|').map(item => item.trim().replace('JOIN', '|'));
+  const items = line.split('|').map((item) => item.trim().replace('JOIN', '|'));
 
   // remove pipe character on both sides
   items.pop();

src/locale/lang/nb-NO.ts

@@ -75,4 +75,3 @@ export default {
     add: 'Legg til ny adresse',
   },
 };
-  

src/pagination/test/index.spec.js

@@ -1,16 +1,16 @@
 import { mount } from '../../../test';
-import Paginaion from '..'
+import Paginaion from '..';
 
 test('render prev-text & next-text slot', () => {
   const wrapper = mount(Paginaion, {
     propsData: {
       totalItems: 50,
-      showPageSize: 5
+      showPageSize: 5,
     },
     scopedSlots: {
       'prev-text': () => 'Custom PrevText',
       'next-text': () => 'Custom NextText',
-    }
+    },
   });
 
   expect(wrapper).toMatchSnapshot();
@@ -20,11 +20,11 @@ test('render page slot', () => {
   const wrapper = mount(Paginaion, {
     propsData: {
       totalItems: 50,
-      showPageSize: 5
+      showPageSize: 5,
     },
     scopedSlots: {
-      'page': ({ text }) => `${text}`,
-    }
+      page: ({ text }) => `${text}`,
+    },
   });
 
   expect(wrapper).toMatchSnapshot();

src/sku/README.md

@@ -134,6 +134,7 @@ export default {
 | stepper-title | Quantity title | _string_ | `Quantity` |
 | custom-stepper-config | Custom stepper related config | _object_ | `{}` |
 | message-config | Message related config | _object_ | `{}` |
+| disable-soldout-sku | Whether to disable soldout sku | _boolean_ | `true` |
 | get-container | Return the mount node for sku | _string \| () => Element_ | - |
 | safe-area-inset-bottom | Whether to enable bottom safe area adaptation | _boolean_ | `true` |
 | start-sale-num `v2.3.0` | Minimum quantity | _number_ | `1` |

src/sku/README.zh-CN.md

@@ -140,6 +140,7 @@ export default {
 | get-container | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | _string \| () => Element_ | - |
 | initial-sku | 默认选中的 sku，具体参考高级用法 | _object_ | `{}` |
 | show-soldout-sku | 是否展示售罄的 sku，默认展示并置灰 | _boolean_ | `true` |
+| disable-soldout-sku | 是否禁用售罄的 sku | _boolean_ | `true` |
 | safe-area-inset-bottom | 是否开启[底部安全区适配](#/zh-CN/advanced-usage#di-bu-an-quan-qu-gua-pei) | _boolean_ | `true` |
 | start-sale-num `v2.3.0` | 起售数量 | _number_ | `1` |
 | properties `v2.4.2` | 商品属性 | _array_ | - |

src/sku/Sku.js

@@ -73,6 +73,10 @@ export default createComponent({
       type: Boolean,
       default: true,
     },
+    disableSoldoutSku: {
+      type: Boolean,
+      default: true,
+    },
     customStepperConfig: {
       type: Object,
       default: () => ({}),
@@ -655,6 +659,7 @@ export default createComponent({
       stepperTitle,
       selectedSkuComb,
       showHeaderImage,
+      disableSoldoutSku,
     } = this;
 
     const slotsProps = {
@@ -720,6 +725,7 @@ export default createComponent({
                   skuKeyStr={skuTreeItem.k_s}
                   selectedSku={selectedSku}
                   skuEventBus={skuEventBus}
+                  disableSoldoutSku={disableSoldoutSku}
                   largeImageMode={skuTreeItem.largeImageMode}
                 />
               ))}

src/sku/components/SkuRowItem.js

@@ -16,6 +16,7 @@ export default createComponent({
     skuEventBus: Object,
     selectedSku: Object,
     largeImageMode: Boolean,
+    disableSoldoutSku: Boolean,
     skuList: {
       type: Array,
       default: () => [],
@@ -32,6 +33,10 @@ export default createComponent({
     },
 
     choosable() {
+      if (!this.disableSoldoutSku) {
+        return true;
+      }
+
       return isSkuChoosable(this.skuList, this.selectedSku, {
         key: this.skuKeyStr,
         valueId: this.skuValue.id,

types/swipe.d.ts

@@ -6,7 +6,10 @@ export type SwipeToOptions = {
 
 export class Swipe extends VanComponent {
   prev(): void;
+
   next(): void;
+
   swipeTo(index: number, options?: SwipeToOptions): void;
+
   resize(): void;
 }