146 lines
4.2 KiB
TypeScript
146 lines
4.2 KiB
TypeScript
import { Component } from '@uni-helper/uni-app-types'
|
||
|
||
/** SKU 弹出层 */
|
||
export type SkuPopup = Component<SkuPopupProps>
|
||
|
||
/** SKU 弹出层实例 */
|
||
export type SkuPopupInstance = InstanceType<SkuPopup>
|
||
|
||
/** SKU 弹出层属性 */
|
||
export type SkuPopupProps = {
|
||
/** 双向绑定，true 为打开组件，false 为关闭组件 */
|
||
modelValue: boolean
|
||
/** 商品信息本地数据源 */
|
||
localdata: SkuPopupLocaldata
|
||
/** 按钮模式 1:都显示 2:只显示购物车 3:只显示立即购买 */
|
||
mode?: 1 | 2 | 3
|
||
/** 该商品已抢完时的按钮文字 */
|
||
noStockText?: string
|
||
/** 库存文字 */
|
||
stockText?: string
|
||
/** 点击遮罩是否关闭组件 */
|
||
maskCloseAble?: boolean
|
||
/** 顶部圆角值 */
|
||
borderRadius?: string | number
|
||
/** 最小购买数量 */
|
||
minBuyNum?: number
|
||
/** 最大购买数量 */
|
||
maxBuyNum?: number
|
||
/** 每次点击后的数量 */
|
||
stepBuyNum?: number
|
||
/** 是否只能输入 step 的倍数 */
|
||
stepStrictly?: boolean
|
||
/** 是否隐藏库存的显示 */
|
||
hideStock?: false
|
||
/** 主题风格 */
|
||
theme?: 'default' | 'red-black' | 'black-white' | 'coffee' | 'green'
|
||
/** 默认金额会除以100（即100=1元），若设置为0，则不会除以100（即1=1元） */
|
||
amountType?: 1 | 0
|
||
/** 自定义获取商品信息的函数（已知支付宝不支持，支付宝请改用localdata属性） */
|
||
customAction?: () => void
|
||
/** 是否显示右上角关闭按钮 */
|
||
showClose?: boolean
|
||
/** 关闭按钮的图片地址 */
|
||
closeImage?: string
|
||
/** 价格的字体颜色 */
|
||
priceColor?: string
|
||
/** 立即购买 - 按钮的文字 */
|
||
buyNowText?: string
|
||
/** 立即购买 - 按钮的字体颜色 */
|
||
buyNowColor?: string
|
||
/** 立即购买 - 按钮的背景颜色 */
|
||
buyNowBackgroundColor?: string
|
||
/** 加入购物车 - 按钮的文字 */
|
||
addCartText?: string
|
||
/** 加入购物车 - 按钮的字体颜色 */
|
||
addCartColor?: string
|
||
/** 加入购物车 - 按钮的背景颜色 */
|
||
addCartBackgroundColor?: string
|
||
/** 商品缩略图背景颜色 */
|
||
goodsThumbBackgroundColor?: string
|
||
/** 样式 - 不可点击时,按钮的样式 */
|
||
disableStyle?: object
|
||
/** 样式 - 按钮点击时的样式 */
|
||
activedStyle?: object
|
||
/** 样式 - 按钮常态的样式 */
|
||
btnStyle?: object
|
||
/** 字段名 - 商品表id的字段名 */
|
||
goodsIdName?: string
|
||
/** 字段名 - sku表id的字段名 */
|
||
skuIdName?: string
|
||
/** 字段名 - 商品对应的sku列表的字段名 */
|
||
skuListName?: string
|
||
/** 字段名 - 商品规格名称的字段名 */
|
||
specListName?: string
|
||
/** 字段名 - sku库存的字段名 */
|
||
stockName?: string
|
||
/** 字段名 - sku组合路径的字段名 */
|
||
skuArrName?: string
|
||
/** 字段名 - 商品缩略图字段名(未选择sku时) */
|
||
goodsThumbName?: string
|
||
/** 被选中的值 */
|
||
selectArr?: string[]
|
||
|
||
/** 打开弹出层 */
|
||
open: () => void
|
||
/** 关闭弹出层 */
|
||
close: () => void
|
||
/** 点击加入购物车时（需选择完SKU才会触发）*/
|
||
cart: (event: SkuPopupEvent) => void
|
||
/** 点击立即购买时（需选择完SKU才会触发）*/
|
||
buy: (event: SkuPopupEvent) => void
|
||
}
|
||
|
||
/** 商品信息本地数据源 */
|
||
export type SkuPopupLocaldata = {
|
||
/** 商品 ID */
|
||
_id: string
|
||
/** 商品名称 */
|
||
name: string
|
||
/** 商品图片 */
|
||
goods_thumb: string
|
||
/** 商品规格列表 */
|
||
spec_list: SkuPopupSpecItem[]
|
||
/** 商品SKU列表 */
|
||
sku_list: SkuPopupSkuItem[]
|
||
}
|
||
|
||
/** 商品规格名称的集合 */
|
||
export type SkuPopupSpecItem = {
|
||
/** 规格名称 */
|
||
name: string
|
||
/** 规格集合 */
|
||
list: { name: string }[]
|
||
}
|
||
|
||
/** 商品SKU列表 */
|
||
export type SkuPopupSkuItem = {
|
||
/** SKU ID */
|
||
_id: string
|
||
/** 商品 ID */
|
||
goods_id: string
|
||
/** 商品名称 */
|
||
goods_name: string
|
||
/** 商品图片 */
|
||
image: string
|
||
/** SKU 价格 * 100, 注意：需要乘以 100 */
|
||
price: number
|
||
/** SKU 规格组成, 注意：需要与 spec_list 数组顺序对应 */
|
||
sku_name_arr: string[]
|
||
/** SKU 库存 */
|
||
stock: number
|
||
}
|
||
|
||
/** 当前选择的sku数据 */
|
||
export type SkuPopupEvent = SkuPopupSkuItem & {
|
||
/** 商品购买数量 */
|
||
buy_num: number
|
||
}
|
||
|
||
/** 全局组件类型声明 */
|
||
declare module 'vue' {
|
||
export interface GlobalComponents {
|
||
'vk-data-goods-sku-popup': SkuPopup
|
||
}
|
||
}
|