2227 lines
81 KiB
JavaScript
2227 lines
81 KiB
JavaScript
import { defineComponent, ref, reactive, computed, withAsyncContext, resolveDirective, unref, mergeProps, withCtx, createVNode, createBlock, openBlock, withDirectives, Fragment, renderList, watch, createTextVNode, toDisplayString, isVNode, useSSRContext } from 'vue';
|
|
import { ssrRenderComponent, ssrRenderAttrs, ssrInterpolate, ssrGetDirectiveProps, ssrRenderAttr, ssrRenderList, ssrRenderClass } from 'vue/server-renderer';
|
|
import { u as useRouter, a as useConfigStore, p as useCartStore, b as useUserStore, aS as getOneProduct, x as getSupabaseStorageUrl, q as APP_TYPE, t as reactiveProjectName, aJ as useProduct, a1 as Button, o as getToken, e as api$1, P as PropTypes, C as useConfigInject, D as genComponentStyleHook, aT as filterEmptyWithUndefined, H as flattenChildren, aB as devWarning, aU as customRenderSlot, Z as merge, J as initDefaultProps, F as classNames, aV as isEmptyElement, N as resetComponent, a7 as clearFix, O as textEllipsis, $ as Keyframe, E as omit, aW as vNodeType, a4 as getPropsSlot } from './server.mjs';
|
|
import { _ as _imports_0, a as _imports_1 } from './cart-DMkYna66.mjs';
|
|
import { B as BasicIconOld, u as usePrefix } from './BasicIconOld-I4c2ShMu.mjs';
|
|
import { i as img_gif } from './post_loading-BiySI7bp.mjs';
|
|
import { Swiper, SwiperSlide } from 'swiper/vue';
|
|
import { Zoom, Navigation, Pagination } from 'swiper/modules';
|
|
import { e as empty_user } from './empty_user-BaUNCdgf.mjs';
|
|
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
import { T as Tabs } from './index-lRQ2uHIp.mjs';
|
|
import isPlainObject from 'lodash-es/isPlainObject.js';
|
|
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
import { cloneDeep } from 'lodash-es';
|
|
import { u as usePrice } from './usePrice-B-5-jXKQ.mjs';
|
|
import { _ as _sfc_main$8 } from './BasicSelect-DsjcJY9Q.mjs';
|
|
import { _ as _sfc_main$7 } from './BasicButton-BAlnoE_w.mjs';
|
|
import { _ as __nuxt_component_1 } from './FormItem-DY7uTw8_.mjs';
|
|
import { T as Tag } from './index-BLBX3jXD.mjs';
|
|
import { _ as __nuxt_component_4 } from './index-_EOUO1YE.mjs';
|
|
import { _ as _sfc_main$6 } from './moreOptionProduct-DIWh2yKL.mjs';
|
|
import { u as useAsyncData } from './asyncData-C9E5x-0d.mjs';
|
|
import { B as Badge } from './index-CjBj1lyG.mjs';
|
|
import { S as Spin } from './index-DqCYDGJX.mjs';
|
|
import { _ as _export_sfc } from './_plugin-vue_export-helper-1tPrXgE0.mjs';
|
|
import '../_/nitro.mjs';
|
|
import 'node:http';
|
|
import 'node:https';
|
|
import 'node:events';
|
|
import 'node:buffer';
|
|
import 'node:fs';
|
|
import 'node:url';
|
|
import 'consola';
|
|
import 'ipx';
|
|
import 'node:path';
|
|
import 'node:crypto';
|
|
import 'pinia';
|
|
import 'vue-router';
|
|
import '@supabase/supabase-js';
|
|
import '@ant-design/colors';
|
|
import '@ctrl/tinycolor';
|
|
import 'stylis';
|
|
import 'vue-types';
|
|
import 'axios';
|
|
import '@ant-design/icons-vue';
|
|
import 'vue3-lazyload';
|
|
import '../routes/renderer.mjs';
|
|
import 'vue-bundle-renderer/runtime';
|
|
import 'unhead/server';
|
|
import 'devalue';
|
|
import 'unhead/utils';
|
|
import 'unhead/plugins';
|
|
import './raf-ruCY1ktO.mjs';
|
|
import './index-BlNIpVst.mjs';
|
|
import './shallowequal-DbdDzF9p.mjs';
|
|
import 'lodash-es/uniq.js';
|
|
import './Overflow-Blz4Z5FW.mjs';
|
|
import './BaseInput-_gwhwanN.mjs';
|
|
import 'resize-observer-polyfill';
|
|
import './index-Dxyzjwb5.mjs';
|
|
import 'dom-align';
|
|
import './collapseMotion-cQ2SGjCA.mjs';
|
|
import './slide-Bfj4jnqX.mjs';
|
|
import './useRefs-BHKrVg4I.mjs';
|
|
import 'lodash-es/pick.js';
|
|
import './useMergedState-BZEfJ8Fl.mjs';
|
|
import './move-BSi4LOZX.mjs';
|
|
import '../_/CheckOutlined.mjs';
|
|
import '../_/SearchOutlined.mjs';
|
|
import './FormItemContext-CDDW52IT.mjs';
|
|
import './statusUtils-C3ZNzkeD.mjs';
|
|
import 'lodash-es/cloneDeep.js';
|
|
import 'async-validator';
|
|
import 'lodash-es/find.js';
|
|
import './index-DVD7vSfp.mjs';
|
|
import '@vueuse/gesture';
|
|
import '@headlessui/vue';
|
|
import 'framesync';
|
|
import 'popmotion';
|
|
import 'style-value-types';
|
|
import './useDateTime-D8RCoGwW.mjs';
|
|
import 'moment';
|
|
import 'moment-timezone';
|
|
import 'moment-jalaali';
|
|
import 'date-fns';
|
|
import 'date-fns/locale';
|
|
import './like-BhIOg3YL.mjs';
|
|
import 'vue-content-loader';
|
|
import './product-DaDj7A6D.mjs';
|
|
import './handle-Bvvl_htN.mjs';
|
|
import 'throttle-debounce';
|
|
|
|
const genCardHeadStyle = (token) => {
|
|
const {
|
|
antCls,
|
|
componentCls,
|
|
cardHeadHeight,
|
|
cardPaddingBase,
|
|
cardHeadTabsMarginBottom
|
|
} = token;
|
|
return _extends(_extends({
|
|
display: "flex",
|
|
justifyContent: "center",
|
|
flexDirection: "column",
|
|
minHeight: cardHeadHeight,
|
|
marginBottom: -1,
|
|
padding: `0 ${cardPaddingBase}px`,
|
|
color: token.colorTextHeading,
|
|
fontWeight: token.fontWeightStrong,
|
|
fontSize: token.fontSizeLG,
|
|
background: "transparent",
|
|
borderBottom: `${token.lineWidth}px ${token.lineType} ${token.colorBorderSecondary}`,
|
|
borderRadius: `${token.borderRadiusLG}px ${token.borderRadiusLG}px 0 0`
|
|
}, clearFix()), {
|
|
"&-wrapper": {
|
|
width: "100%",
|
|
display: "flex",
|
|
alignItems: "center"
|
|
},
|
|
"&-title": _extends(_extends({
|
|
display: "inline-block",
|
|
flex: 1
|
|
}, textEllipsis), {
|
|
[`
|
|
> ${componentCls}-typography,
|
|
> ${componentCls}-typography-edit-content
|
|
`]: {
|
|
insetInlineStart: 0,
|
|
marginTop: 0,
|
|
marginBottom: 0
|
|
}
|
|
}),
|
|
[`${antCls}-tabs-top`]: {
|
|
clear: "both",
|
|
marginBottom: cardHeadTabsMarginBottom,
|
|
color: token.colorText,
|
|
fontWeight: "normal",
|
|
fontSize: token.fontSize,
|
|
"&-bar": {
|
|
borderBottom: `${token.lineWidth}px ${token.lineType} ${token.colorBorderSecondary}`
|
|
}
|
|
}
|
|
});
|
|
};
|
|
const genCardGridStyle = (token) => {
|
|
const {
|
|
cardPaddingBase,
|
|
colorBorderSecondary,
|
|
cardShadow,
|
|
lineWidth
|
|
} = token;
|
|
return {
|
|
width: "33.33%",
|
|
padding: cardPaddingBase,
|
|
border: 0,
|
|
borderRadius: 0,
|
|
boxShadow: `
|
|
${lineWidth}px 0 0 0 ${colorBorderSecondary},
|
|
0 ${lineWidth}px 0 0 ${colorBorderSecondary},
|
|
${lineWidth}px ${lineWidth}px 0 0 ${colorBorderSecondary},
|
|
${lineWidth}px 0 0 0 ${colorBorderSecondary} inset,
|
|
0 ${lineWidth}px 0 0 ${colorBorderSecondary} inset;
|
|
`,
|
|
transition: `all ${token.motionDurationMid}`,
|
|
"&-hoverable:hover": {
|
|
position: "relative",
|
|
zIndex: 1,
|
|
boxShadow: cardShadow
|
|
}
|
|
};
|
|
};
|
|
const genCardActionsStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
iconCls,
|
|
cardActionsLiMargin,
|
|
cardActionsIconSize,
|
|
colorBorderSecondary
|
|
} = token;
|
|
return _extends(_extends({
|
|
margin: 0,
|
|
padding: 0,
|
|
listStyle: "none",
|
|
background: token.colorBgContainer,
|
|
borderTop: `${token.lineWidth}px ${token.lineType} ${colorBorderSecondary}`,
|
|
display: "flex",
|
|
borderRadius: `0 0 ${token.borderRadiusLG}px ${token.borderRadiusLG}px `
|
|
}, clearFix()), {
|
|
"& > li": {
|
|
margin: cardActionsLiMargin,
|
|
color: token.colorTextDescription,
|
|
textAlign: "center",
|
|
"> span": {
|
|
position: "relative",
|
|
display: "block",
|
|
minWidth: token.cardActionsIconSize * 2,
|
|
fontSize: token.fontSize,
|
|
lineHeight: token.lineHeight,
|
|
cursor: "pointer",
|
|
"&:hover": {
|
|
color: token.colorPrimary,
|
|
transition: `color ${token.motionDurationMid}`
|
|
},
|
|
[`a:not(${componentCls}-btn), > ${iconCls}`]: {
|
|
display: "inline-block",
|
|
width: "100%",
|
|
color: token.colorTextDescription,
|
|
lineHeight: `${token.fontSize * token.lineHeight}px`,
|
|
transition: `color ${token.motionDurationMid}`,
|
|
"&:hover": {
|
|
color: token.colorPrimary
|
|
}
|
|
},
|
|
[`> ${iconCls}`]: {
|
|
fontSize: cardActionsIconSize,
|
|
lineHeight: `${cardActionsIconSize * token.lineHeight}px`
|
|
}
|
|
},
|
|
"&:not(:last-child)": {
|
|
borderInlineEnd: `${token.lineWidth}px ${token.lineType} ${colorBorderSecondary}`
|
|
}
|
|
}
|
|
});
|
|
};
|
|
const genCardMetaStyle = (token) => _extends(_extends({
|
|
margin: `-${token.marginXXS}px 0`,
|
|
display: "flex"
|
|
}, clearFix()), {
|
|
"&-avatar": {
|
|
paddingInlineEnd: token.padding
|
|
},
|
|
"&-detail": {
|
|
overflow: "hidden",
|
|
flex: 1,
|
|
"> div:not(:last-child)": {
|
|
marginBottom: token.marginXS
|
|
}
|
|
},
|
|
"&-title": _extends({
|
|
color: token.colorTextHeading,
|
|
fontWeight: token.fontWeightStrong,
|
|
fontSize: token.fontSizeLG
|
|
}, textEllipsis),
|
|
"&-description": {
|
|
color: token.colorTextDescription
|
|
}
|
|
});
|
|
const genCardTypeInnerStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
cardPaddingBase,
|
|
colorFillAlter
|
|
} = token;
|
|
return {
|
|
[`${componentCls}-head`]: {
|
|
padding: `0 ${cardPaddingBase}px`,
|
|
background: colorFillAlter,
|
|
"&-title": {
|
|
fontSize: token.fontSize
|
|
}
|
|
},
|
|
[`${componentCls}-body`]: {
|
|
padding: `${token.padding}px ${cardPaddingBase}px`
|
|
}
|
|
};
|
|
};
|
|
const genCardLoadingStyle = (token) => {
|
|
const {
|
|
componentCls
|
|
} = token;
|
|
return {
|
|
overflow: "hidden",
|
|
[`${componentCls}-body`]: {
|
|
userSelect: "none"
|
|
}
|
|
};
|
|
};
|
|
const genCardStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
cardShadow,
|
|
cardHeadPadding,
|
|
colorBorderSecondary,
|
|
boxShadow,
|
|
cardPaddingBase
|
|
} = token;
|
|
return {
|
|
[componentCls]: _extends(_extends({}, resetComponent(token)), {
|
|
position: "relative",
|
|
background: token.colorBgContainer,
|
|
borderRadius: token.borderRadiusLG,
|
|
[`&:not(${componentCls}-bordered)`]: {
|
|
boxShadow
|
|
},
|
|
[`${componentCls}-head`]: genCardHeadStyle(token),
|
|
[`${componentCls}-extra`]: {
|
|
// https://stackoverflow.com/a/22429853/3040605
|
|
marginInlineStart: "auto",
|
|
color: "",
|
|
fontWeight: "normal",
|
|
fontSize: token.fontSize
|
|
},
|
|
[`${componentCls}-body`]: _extends({
|
|
padding: cardPaddingBase,
|
|
borderRadius: ` 0 0 ${token.borderRadiusLG}px ${token.borderRadiusLG}px`
|
|
}, clearFix()),
|
|
[`${componentCls}-grid`]: genCardGridStyle(token),
|
|
[`${componentCls}-cover`]: {
|
|
"> *": {
|
|
display: "block",
|
|
width: "100%"
|
|
},
|
|
img: {
|
|
borderRadius: `${token.borderRadiusLG}px ${token.borderRadiusLG}px 0 0`
|
|
}
|
|
},
|
|
[`${componentCls}-actions`]: genCardActionsStyle(token),
|
|
[`${componentCls}-meta`]: genCardMetaStyle(token)
|
|
}),
|
|
[`${componentCls}-bordered`]: {
|
|
border: `${token.lineWidth}px ${token.lineType} ${colorBorderSecondary}`,
|
|
[`${componentCls}-cover`]: {
|
|
marginTop: -1,
|
|
marginInlineStart: -1,
|
|
marginInlineEnd: -1
|
|
}
|
|
},
|
|
[`${componentCls}-hoverable`]: {
|
|
cursor: "pointer",
|
|
transition: `box-shadow ${token.motionDurationMid}, border-color ${token.motionDurationMid}`,
|
|
"&:hover": {
|
|
borderColor: "transparent",
|
|
boxShadow: cardShadow
|
|
}
|
|
},
|
|
[`${componentCls}-contain-grid`]: {
|
|
[`${componentCls}-body`]: {
|
|
display: "flex",
|
|
flexWrap: "wrap"
|
|
},
|
|
[`&:not(${componentCls}-loading) ${componentCls}-body`]: {
|
|
marginBlockStart: -token.lineWidth,
|
|
marginInlineStart: -token.lineWidth,
|
|
padding: 0
|
|
}
|
|
},
|
|
[`${componentCls}-contain-tabs`]: {
|
|
[`> ${componentCls}-head`]: {
|
|
[`${componentCls}-head-title, ${componentCls}-extra`]: {
|
|
paddingTop: cardHeadPadding
|
|
}
|
|
}
|
|
},
|
|
[`${componentCls}-type-inner`]: genCardTypeInnerStyle(token),
|
|
[`${componentCls}-loading`]: genCardLoadingStyle(token),
|
|
[`${componentCls}-rtl`]: {
|
|
direction: "rtl"
|
|
}
|
|
};
|
|
};
|
|
const genCardSizeStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
cardPaddingSM,
|
|
cardHeadHeightSM
|
|
} = token;
|
|
return {
|
|
[`${componentCls}-small`]: {
|
|
[`> ${componentCls}-head`]: {
|
|
minHeight: cardHeadHeightSM,
|
|
padding: `0 ${cardPaddingSM}px`,
|
|
fontSize: token.fontSize,
|
|
[`> ${componentCls}-head-wrapper`]: {
|
|
[`> ${componentCls}-extra`]: {
|
|
fontSize: token.fontSize
|
|
}
|
|
}
|
|
},
|
|
[`> ${componentCls}-body`]: {
|
|
padding: cardPaddingSM
|
|
}
|
|
},
|
|
[`${componentCls}-small${componentCls}-contain-tabs`]: {
|
|
[`> ${componentCls}-head`]: {
|
|
[`${componentCls}-head-title, ${componentCls}-extra`]: {
|
|
minHeight: cardHeadHeightSM,
|
|
paddingTop: 0,
|
|
display: "flex",
|
|
alignItems: "center"
|
|
}
|
|
}
|
|
}
|
|
};
|
|
};
|
|
const useStyle$1 = genComponentStyleHook("Card", (token) => {
|
|
const cardToken = merge(token, {
|
|
cardShadow: token.boxShadowCard,
|
|
cardHeadHeight: token.fontSizeLG * token.lineHeightLG + token.padding * 2,
|
|
cardHeadHeightSM: token.fontSize * token.lineHeight + token.paddingXS * 2,
|
|
cardHeadPadding: token.padding,
|
|
cardPaddingBase: token.paddingLG,
|
|
cardHeadTabsMarginBottom: -token.padding - token.lineWidth,
|
|
cardActionsLiMargin: `${token.paddingSM}px 0`,
|
|
cardActionsIconSize: token.fontSize,
|
|
cardPaddingSM: 12
|
|
// Fixed padding.
|
|
});
|
|
return [
|
|
// Style
|
|
genCardStyle(cardToken),
|
|
// Size
|
|
genCardSizeStyle(cardToken)
|
|
];
|
|
});
|
|
const skeletonTitleProps = () => ({
|
|
prefixCls: String,
|
|
width: {
|
|
type: [Number, String]
|
|
}
|
|
});
|
|
const SkeletonTitle = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "SkeletonTitle",
|
|
props: skeletonTitleProps(),
|
|
setup(props) {
|
|
return () => {
|
|
const {
|
|
prefixCls,
|
|
width
|
|
} = props;
|
|
const zWidth = typeof width === "number" ? `${width}px` : width;
|
|
return createVNode("h3", {
|
|
"class": prefixCls,
|
|
"style": {
|
|
width: zWidth
|
|
}
|
|
}, null);
|
|
};
|
|
}
|
|
});
|
|
const skeletonParagraphProps = () => ({
|
|
prefixCls: String,
|
|
width: {
|
|
type: [Number, String, Array]
|
|
},
|
|
rows: Number
|
|
});
|
|
const SkeletonParagraph = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "SkeletonParagraph",
|
|
props: skeletonParagraphProps(),
|
|
setup(props) {
|
|
const getWidth = (index) => {
|
|
const {
|
|
width,
|
|
rows = 2
|
|
} = props;
|
|
if (Array.isArray(width)) {
|
|
return width[index];
|
|
}
|
|
if (rows - 1 === index) {
|
|
return width;
|
|
}
|
|
return void 0;
|
|
};
|
|
return () => {
|
|
const {
|
|
prefixCls,
|
|
rows
|
|
} = props;
|
|
const rowList = [...Array(rows)].map((_, index) => {
|
|
const width = getWidth(index);
|
|
return createVNode("li", {
|
|
"key": index,
|
|
"style": {
|
|
width: typeof width === "number" ? `${width}px` : width
|
|
}
|
|
}, null);
|
|
});
|
|
return createVNode("ul", {
|
|
"class": prefixCls
|
|
}, [rowList]);
|
|
};
|
|
}
|
|
});
|
|
const skeletonElementProps = () => ({
|
|
prefixCls: String,
|
|
size: [String, Number],
|
|
shape: String,
|
|
active: {
|
|
type: Boolean,
|
|
default: void 0
|
|
}
|
|
});
|
|
const Element = (props) => {
|
|
const {
|
|
prefixCls,
|
|
size,
|
|
shape
|
|
} = props;
|
|
const sizeCls = classNames({
|
|
[`${prefixCls}-lg`]: size === "large",
|
|
[`${prefixCls}-sm`]: size === "small"
|
|
});
|
|
const shapeCls = classNames({
|
|
[`${prefixCls}-circle`]: shape === "circle",
|
|
[`${prefixCls}-square`]: shape === "square",
|
|
[`${prefixCls}-round`]: shape === "round"
|
|
});
|
|
const sizeStyle = typeof size === "number" ? {
|
|
width: `${size}px`,
|
|
height: `${size}px`,
|
|
lineHeight: `${size}px`
|
|
} : {};
|
|
return createVNode("span", {
|
|
"class": classNames(prefixCls, sizeCls, shapeCls),
|
|
"style": sizeStyle
|
|
}, null);
|
|
};
|
|
Element.displayName = "SkeletonElement";
|
|
const skeletonClsLoading = new Keyframe(`ant-skeleton-loading`, {
|
|
"0%": {
|
|
transform: "translateX(-37.5%)"
|
|
},
|
|
"100%": {
|
|
transform: "translateX(37.5%)"
|
|
}
|
|
});
|
|
const genSkeletonElementCommonSize = (size) => ({
|
|
height: size,
|
|
lineHeight: `${size}px`
|
|
});
|
|
const genSkeletonElementAvatarSize = (size) => _extends({
|
|
width: size
|
|
}, genSkeletonElementCommonSize(size));
|
|
const genSkeletonColor = (token) => ({
|
|
position: "relative",
|
|
// fix https://github.com/ant-design/ant-design/issues/36444
|
|
// https://monshin.github.io/202109/css/safari-border-radius-overflow-hidden/
|
|
/* stylelint-disable-next-line property-no-vendor-prefix,value-no-vendor-prefix */
|
|
zIndex: 0,
|
|
overflow: "hidden",
|
|
background: "transparent",
|
|
"&::after": {
|
|
position: "absolute",
|
|
top: 0,
|
|
insetInlineEnd: "-150%",
|
|
bottom: 0,
|
|
insetInlineStart: "-150%",
|
|
background: token.skeletonLoadingBackground,
|
|
animationName: skeletonClsLoading,
|
|
animationDuration: token.skeletonLoadingMotionDuration,
|
|
animationTimingFunction: "ease",
|
|
animationIterationCount: "infinite",
|
|
content: '""'
|
|
}
|
|
});
|
|
const genSkeletonElementInputSize = (size) => _extends({
|
|
width: size * 5,
|
|
minWidth: size * 5
|
|
}, genSkeletonElementCommonSize(size));
|
|
const genSkeletonElementAvatar = (token) => {
|
|
const {
|
|
skeletonAvatarCls,
|
|
color,
|
|
controlHeight,
|
|
controlHeightLG,
|
|
controlHeightSM
|
|
} = token;
|
|
return {
|
|
[`${skeletonAvatarCls}`]: _extends({
|
|
display: "inline-block",
|
|
verticalAlign: "top",
|
|
background: color
|
|
}, genSkeletonElementAvatarSize(controlHeight)),
|
|
[`${skeletonAvatarCls}${skeletonAvatarCls}-circle`]: {
|
|
borderRadius: "50%"
|
|
},
|
|
[`${skeletonAvatarCls}${skeletonAvatarCls}-lg`]: _extends({}, genSkeletonElementAvatarSize(controlHeightLG)),
|
|
[`${skeletonAvatarCls}${skeletonAvatarCls}-sm`]: _extends({}, genSkeletonElementAvatarSize(controlHeightSM))
|
|
};
|
|
};
|
|
const genSkeletonElementInput = (token) => {
|
|
const {
|
|
controlHeight,
|
|
borderRadiusSM,
|
|
skeletonInputCls,
|
|
controlHeightLG,
|
|
controlHeightSM,
|
|
color
|
|
} = token;
|
|
return {
|
|
[`${skeletonInputCls}`]: _extends({
|
|
display: "inline-block",
|
|
verticalAlign: "top",
|
|
background: color,
|
|
borderRadius: borderRadiusSM
|
|
}, genSkeletonElementInputSize(controlHeight)),
|
|
[`${skeletonInputCls}-lg`]: _extends({}, genSkeletonElementInputSize(controlHeightLG)),
|
|
[`${skeletonInputCls}-sm`]: _extends({}, genSkeletonElementInputSize(controlHeightSM))
|
|
};
|
|
};
|
|
const genSkeletonElementImageSize = (size) => _extends({
|
|
width: size
|
|
}, genSkeletonElementCommonSize(size));
|
|
const genSkeletonElementImage = (token) => {
|
|
const {
|
|
skeletonImageCls,
|
|
imageSizeBase,
|
|
color,
|
|
borderRadiusSM
|
|
} = token;
|
|
return {
|
|
[`${skeletonImageCls}`]: _extends(_extends({
|
|
display: "flex",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
verticalAlign: "top",
|
|
background: color,
|
|
borderRadius: borderRadiusSM
|
|
}, genSkeletonElementImageSize(imageSizeBase * 2)), {
|
|
[`${skeletonImageCls}-path`]: {
|
|
fill: "#bfbfbf"
|
|
},
|
|
[`${skeletonImageCls}-svg`]: _extends(_extends({}, genSkeletonElementImageSize(imageSizeBase)), {
|
|
maxWidth: imageSizeBase * 4,
|
|
maxHeight: imageSizeBase * 4
|
|
}),
|
|
[`${skeletonImageCls}-svg${skeletonImageCls}-svg-circle`]: {
|
|
borderRadius: "50%"
|
|
}
|
|
}),
|
|
[`${skeletonImageCls}${skeletonImageCls}-circle`]: {
|
|
borderRadius: "50%"
|
|
}
|
|
};
|
|
};
|
|
const genSkeletonElementButtonShape = (token, size, buttonCls) => {
|
|
const {
|
|
skeletonButtonCls
|
|
} = token;
|
|
return {
|
|
[`${buttonCls}${skeletonButtonCls}-circle`]: {
|
|
width: size,
|
|
minWidth: size,
|
|
borderRadius: "50%"
|
|
},
|
|
[`${buttonCls}${skeletonButtonCls}-round`]: {
|
|
borderRadius: size
|
|
}
|
|
};
|
|
};
|
|
const genSkeletonElementButtonSize = (size) => _extends({
|
|
width: size * 2,
|
|
minWidth: size * 2
|
|
}, genSkeletonElementCommonSize(size));
|
|
const genSkeletonElementButton = (token) => {
|
|
const {
|
|
borderRadiusSM,
|
|
skeletonButtonCls,
|
|
controlHeight,
|
|
controlHeightLG,
|
|
controlHeightSM,
|
|
color
|
|
} = token;
|
|
return _extends(_extends(_extends(_extends(_extends({
|
|
[`${skeletonButtonCls}`]: _extends({
|
|
display: "inline-block",
|
|
verticalAlign: "top",
|
|
background: color,
|
|
borderRadius: borderRadiusSM,
|
|
width: controlHeight * 2,
|
|
minWidth: controlHeight * 2
|
|
}, genSkeletonElementButtonSize(controlHeight))
|
|
}, genSkeletonElementButtonShape(token, controlHeight, skeletonButtonCls)), {
|
|
[`${skeletonButtonCls}-lg`]: _extends({}, genSkeletonElementButtonSize(controlHeightLG))
|
|
}), genSkeletonElementButtonShape(token, controlHeightLG, `${skeletonButtonCls}-lg`)), {
|
|
[`${skeletonButtonCls}-sm`]: _extends({}, genSkeletonElementButtonSize(controlHeightSM))
|
|
}), genSkeletonElementButtonShape(token, controlHeightSM, `${skeletonButtonCls}-sm`));
|
|
};
|
|
const genBaseStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
skeletonAvatarCls,
|
|
skeletonTitleCls,
|
|
skeletonParagraphCls,
|
|
skeletonButtonCls,
|
|
skeletonInputCls,
|
|
skeletonImageCls,
|
|
controlHeight,
|
|
controlHeightLG,
|
|
controlHeightSM,
|
|
color,
|
|
padding,
|
|
marginSM,
|
|
borderRadius,
|
|
skeletonTitleHeight,
|
|
skeletonBlockRadius,
|
|
skeletonParagraphLineHeight,
|
|
controlHeightXS,
|
|
skeletonParagraphMarginTop
|
|
} = token;
|
|
return {
|
|
[`${componentCls}`]: {
|
|
display: "table",
|
|
width: "100%",
|
|
[`${componentCls}-header`]: {
|
|
display: "table-cell",
|
|
paddingInlineEnd: padding,
|
|
verticalAlign: "top",
|
|
// Avatar
|
|
[`${skeletonAvatarCls}`]: _extends({
|
|
display: "inline-block",
|
|
verticalAlign: "top",
|
|
background: color
|
|
}, genSkeletonElementAvatarSize(controlHeight)),
|
|
[`${skeletonAvatarCls}-circle`]: {
|
|
borderRadius: "50%"
|
|
},
|
|
[`${skeletonAvatarCls}-lg`]: _extends({}, genSkeletonElementAvatarSize(controlHeightLG)),
|
|
[`${skeletonAvatarCls}-sm`]: _extends({}, genSkeletonElementAvatarSize(controlHeightSM))
|
|
},
|
|
[`${componentCls}-content`]: {
|
|
display: "table-cell",
|
|
width: "100%",
|
|
verticalAlign: "top",
|
|
// Title
|
|
[`${skeletonTitleCls}`]: {
|
|
width: "100%",
|
|
height: skeletonTitleHeight,
|
|
background: color,
|
|
borderRadius: skeletonBlockRadius,
|
|
[`+ ${skeletonParagraphCls}`]: {
|
|
marginBlockStart: controlHeightSM
|
|
}
|
|
},
|
|
// paragraph
|
|
[`${skeletonParagraphCls}`]: {
|
|
padding: 0,
|
|
"> li": {
|
|
width: "100%",
|
|
height: skeletonParagraphLineHeight,
|
|
listStyle: "none",
|
|
background: color,
|
|
borderRadius: skeletonBlockRadius,
|
|
"+ li": {
|
|
marginBlockStart: controlHeightXS
|
|
}
|
|
}
|
|
},
|
|
[`${skeletonParagraphCls}> li:last-child:not(:first-child):not(:nth-child(2))`]: {
|
|
width: "61%"
|
|
}
|
|
},
|
|
[`&-round ${componentCls}-content`]: {
|
|
[`${skeletonTitleCls}, ${skeletonParagraphCls} > li`]: {
|
|
borderRadius
|
|
}
|
|
}
|
|
},
|
|
[`${componentCls}-with-avatar ${componentCls}-content`]: {
|
|
// Title
|
|
[`${skeletonTitleCls}`]: {
|
|
marginBlockStart: marginSM,
|
|
[`+ ${skeletonParagraphCls}`]: {
|
|
marginBlockStart: skeletonParagraphMarginTop
|
|
}
|
|
}
|
|
},
|
|
// Skeleton element
|
|
[`${componentCls}${componentCls}-element`]: _extends(_extends(_extends(_extends({
|
|
display: "inline-block",
|
|
width: "auto"
|
|
}, genSkeletonElementButton(token)), genSkeletonElementAvatar(token)), genSkeletonElementInput(token)), genSkeletonElementImage(token)),
|
|
// Skeleton Block Button, Input
|
|
[`${componentCls}${componentCls}-block`]: {
|
|
width: "100%",
|
|
[`${skeletonButtonCls}`]: {
|
|
width: "100%"
|
|
},
|
|
[`${skeletonInputCls}`]: {
|
|
width: "100%"
|
|
}
|
|
},
|
|
// With active animation
|
|
[`${componentCls}${componentCls}-active`]: {
|
|
[`
|
|
${skeletonTitleCls},
|
|
${skeletonParagraphCls} > li,
|
|
${skeletonAvatarCls},
|
|
${skeletonButtonCls},
|
|
${skeletonInputCls},
|
|
${skeletonImageCls}
|
|
`]: _extends({}, genSkeletonColor(token))
|
|
}
|
|
};
|
|
};
|
|
const useStyle = genComponentStyleHook("Skeleton", (token) => {
|
|
const {
|
|
componentCls
|
|
} = token;
|
|
const skeletonToken = merge(token, {
|
|
skeletonAvatarCls: `${componentCls}-avatar`,
|
|
skeletonTitleCls: `${componentCls}-title`,
|
|
skeletonParagraphCls: `${componentCls}-paragraph`,
|
|
skeletonButtonCls: `${componentCls}-button`,
|
|
skeletonInputCls: `${componentCls}-input`,
|
|
skeletonImageCls: `${componentCls}-image`,
|
|
imageSizeBase: token.controlHeight * 1.5,
|
|
skeletonTitleHeight: token.controlHeight / 2,
|
|
skeletonBlockRadius: token.borderRadiusSM,
|
|
skeletonParagraphLineHeight: token.controlHeight / 2,
|
|
skeletonParagraphMarginTop: token.marginLG + token.marginXXS,
|
|
borderRadius: 100,
|
|
skeletonLoadingBackground: `linear-gradient(90deg, ${token.color} 25%, ${token.colorGradientEnd} 37%, ${token.color} 63%)`,
|
|
skeletonLoadingMotionDuration: "1.4s"
|
|
});
|
|
return [genBaseStyle(skeletonToken)];
|
|
}, (token) => {
|
|
const {
|
|
colorFillContent,
|
|
colorFill
|
|
} = token;
|
|
return {
|
|
color: colorFillContent,
|
|
colorGradientEnd: colorFill
|
|
};
|
|
});
|
|
const skeletonProps = () => ({
|
|
active: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
loading: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
prefixCls: String,
|
|
avatar: {
|
|
type: [Boolean, Object],
|
|
default: void 0
|
|
},
|
|
title: {
|
|
type: [Boolean, Object],
|
|
default: void 0
|
|
},
|
|
paragraph: {
|
|
type: [Boolean, Object],
|
|
default: void 0
|
|
},
|
|
round: {
|
|
type: Boolean,
|
|
default: void 0
|
|
}
|
|
});
|
|
function getComponentProps(prop) {
|
|
if (prop && typeof prop === "object") {
|
|
return prop;
|
|
}
|
|
return {};
|
|
}
|
|
function getAvatarBasicProps(hasTitle, hasParagraph) {
|
|
if (hasTitle && !hasParagraph) {
|
|
return {
|
|
size: "large",
|
|
shape: "square"
|
|
};
|
|
}
|
|
return {
|
|
size: "large",
|
|
shape: "circle"
|
|
};
|
|
}
|
|
function getTitleBasicProps(hasAvatar, hasParagraph) {
|
|
if (!hasAvatar && hasParagraph) {
|
|
return {
|
|
width: "38%"
|
|
};
|
|
}
|
|
if (hasAvatar && hasParagraph) {
|
|
return {
|
|
width: "50%"
|
|
};
|
|
}
|
|
return {};
|
|
}
|
|
function getParagraphBasicProps(hasAvatar, hasTitle) {
|
|
const basicProps = {};
|
|
if (!hasAvatar || !hasTitle) {
|
|
basicProps.width = "61%";
|
|
}
|
|
if (!hasAvatar && hasTitle) {
|
|
basicProps.rows = 3;
|
|
} else {
|
|
basicProps.rows = 2;
|
|
}
|
|
return basicProps;
|
|
}
|
|
const Skeleton = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ASkeleton",
|
|
props: initDefaultProps(skeletonProps(), {
|
|
avatar: false,
|
|
title: true,
|
|
paragraph: true
|
|
}),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const {
|
|
prefixCls,
|
|
direction
|
|
} = useConfigInject("skeleton", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
return () => {
|
|
var _a;
|
|
const {
|
|
loading,
|
|
avatar,
|
|
title,
|
|
paragraph,
|
|
active,
|
|
round
|
|
} = props;
|
|
const pre = prefixCls.value;
|
|
if (loading || props.loading === void 0) {
|
|
const hasAvatar = !!avatar || avatar === "";
|
|
const hasTitle = !!title || title === "";
|
|
const hasParagraph = !!paragraph || paragraph === "";
|
|
let avatarNode;
|
|
if (hasAvatar) {
|
|
const avatarProps2 = _extends(_extends({
|
|
prefixCls: `${pre}-avatar`
|
|
}, getAvatarBasicProps(hasTitle, hasParagraph)), getComponentProps(avatar));
|
|
avatarNode = createVNode("div", {
|
|
"class": `${pre}-header`
|
|
}, [createVNode(Element, avatarProps2, null)]);
|
|
}
|
|
let contentNode;
|
|
if (hasTitle || hasParagraph) {
|
|
let $title;
|
|
if (hasTitle) {
|
|
const titleProps = _extends(_extends({
|
|
prefixCls: `${pre}-title`
|
|
}, getTitleBasicProps(hasAvatar, hasParagraph)), getComponentProps(title));
|
|
$title = createVNode(SkeletonTitle, titleProps, null);
|
|
}
|
|
let paragraphNode;
|
|
if (hasParagraph) {
|
|
const paragraphProps = _extends(_extends({
|
|
prefixCls: `${pre}-paragraph`
|
|
}, getParagraphBasicProps(hasAvatar, hasTitle)), getComponentProps(paragraph));
|
|
paragraphNode = createVNode(SkeletonParagraph, paragraphProps, null);
|
|
}
|
|
contentNode = createVNode("div", {
|
|
"class": `${pre}-content`
|
|
}, [$title, paragraphNode]);
|
|
}
|
|
const cls = classNames(pre, {
|
|
[`${pre}-with-avatar`]: hasAvatar,
|
|
[`${pre}-active`]: active,
|
|
[`${pre}-rtl`]: direction.value === "rtl",
|
|
[`${pre}-round`]: round,
|
|
[hashId.value]: true
|
|
});
|
|
return wrapSSR(createVNode("div", {
|
|
"class": cls
|
|
}, [avatarNode, contentNode]));
|
|
}
|
|
return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots);
|
|
};
|
|
}
|
|
});
|
|
const skeletonButtonProps = () => {
|
|
return _extends(_extends({}, skeletonElementProps()), {
|
|
size: String,
|
|
block: Boolean
|
|
});
|
|
};
|
|
const SkeletonButton = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ASkeletonButton",
|
|
props: initDefaultProps(skeletonButtonProps(), {
|
|
size: "default"
|
|
}),
|
|
setup(props) {
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("skeleton", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const cls = computed(() => classNames(prefixCls.value, `${prefixCls.value}-element`, {
|
|
[`${prefixCls.value}-active`]: props.active,
|
|
[`${prefixCls.value}-block`]: props.block
|
|
}, hashId.value));
|
|
return () => {
|
|
return wrapSSR(createVNode("div", {
|
|
"class": cls.value
|
|
}, [createVNode(Element, _objectSpread(_objectSpread({}, props), {}, {
|
|
"prefixCls": `${prefixCls.value}-button`
|
|
}), null)]));
|
|
};
|
|
}
|
|
});
|
|
const SkeletonInput = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ASkeletonInput",
|
|
props: _extends(_extends({}, omit(skeletonElementProps(), ["shape"])), {
|
|
size: String,
|
|
block: Boolean
|
|
}),
|
|
setup(props) {
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("skeleton", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const cls = computed(() => classNames(prefixCls.value, `${prefixCls.value}-element`, {
|
|
[`${prefixCls.value}-active`]: props.active,
|
|
[`${prefixCls.value}-block`]: props.block
|
|
}, hashId.value));
|
|
return () => {
|
|
return wrapSSR(createVNode("div", {
|
|
"class": cls.value
|
|
}, [createVNode(Element, _objectSpread(_objectSpread({}, props), {}, {
|
|
"prefixCls": `${prefixCls.value}-input`
|
|
}), null)]));
|
|
};
|
|
}
|
|
});
|
|
const path = "M365.714286 329.142857q0 45.714286-32.036571 77.677714t-77.677714 32.036571-77.677714-32.036571-32.036571-77.677714 32.036571-77.677714 77.677714-32.036571 77.677714 32.036571 32.036571 77.677714zM950.857143 548.571429l0 256-804.571429 0 0-109.714286 182.857143-182.857143 91.428571 91.428571 292.571429-292.571429zM1005.714286 146.285714l-914.285714 0q-7.460571 0-12.873143 5.412571t-5.412571 12.873143l0 694.857143q0 7.460571 5.412571 12.873143t12.873143 5.412571l914.285714 0q7.460571 0 12.873143-5.412571t5.412571-12.873143l0-694.857143q0-7.460571-5.412571-12.873143t-12.873143-5.412571zM1097.142857 164.571429l0 694.857143q0 37.741714-26.843429 64.585143t-64.585143 26.843429l-914.285714 0q-37.741714 0-64.585143-26.843429t-26.843429-64.585143l0-694.857143q0-37.741714 26.843429-64.585143t64.585143-26.843429l914.285714 0q37.741714 0 64.585143 26.843429t26.843429 64.585143z";
|
|
const SkeletonImage = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ASkeletonImage",
|
|
props: omit(skeletonElementProps(), ["size", "shape", "active"]),
|
|
setup(props) {
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("skeleton", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const cls = computed(() => classNames(prefixCls.value, `${prefixCls.value}-element`, hashId.value));
|
|
return () => {
|
|
return wrapSSR(createVNode("div", {
|
|
"class": cls.value
|
|
}, [createVNode("div", {
|
|
"class": `${prefixCls.value}-image`
|
|
}, [createVNode("svg", {
|
|
"viewBox": "0 0 1098 1024",
|
|
"xmlns": "http://www.w3.org/2000/svg",
|
|
"class": `${prefixCls.value}-image-svg`
|
|
}, [createVNode("path", {
|
|
"d": path,
|
|
"class": `${prefixCls.value}-image-path`
|
|
}, null)])])]));
|
|
};
|
|
}
|
|
});
|
|
const avatarProps = () => {
|
|
return _extends(_extends({}, skeletonElementProps()), {
|
|
shape: String
|
|
});
|
|
};
|
|
const SkeletonAvatar = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ASkeletonAvatar",
|
|
props: initDefaultProps(avatarProps(), {
|
|
size: "default",
|
|
shape: "circle"
|
|
}),
|
|
setup(props) {
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("skeleton", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const cls = computed(() => classNames(prefixCls.value, `${prefixCls.value}-element`, {
|
|
[`${prefixCls.value}-active`]: props.active
|
|
}, hashId.value));
|
|
return () => {
|
|
return wrapSSR(createVNode("div", {
|
|
"class": cls.value
|
|
}, [createVNode(Element, _objectSpread(_objectSpread({}, props), {}, {
|
|
"prefixCls": `${prefixCls.value}-avatar`
|
|
}), null)]));
|
|
};
|
|
}
|
|
});
|
|
Skeleton.Button = SkeletonButton;
|
|
Skeleton.Avatar = SkeletonAvatar;
|
|
Skeleton.Input = SkeletonInput;
|
|
Skeleton.Image = SkeletonImage;
|
|
Skeleton.Title = SkeletonTitle;
|
|
Skeleton.install = function(app) {
|
|
app.component(Skeleton.name, Skeleton);
|
|
app.component(Skeleton.Button.name, SkeletonButton);
|
|
app.component(Skeleton.Avatar.name, SkeletonAvatar);
|
|
app.component(Skeleton.Input.name, SkeletonInput);
|
|
app.component(Skeleton.Image.name, SkeletonImage);
|
|
app.component(Skeleton.Title.name, SkeletonTitle);
|
|
return app;
|
|
};
|
|
const {
|
|
TabPane
|
|
} = Tabs;
|
|
const cardProps = () => ({
|
|
prefixCls: String,
|
|
title: PropTypes.any,
|
|
extra: PropTypes.any,
|
|
bordered: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
bodyStyle: {
|
|
type: Object,
|
|
default: void 0
|
|
},
|
|
headStyle: {
|
|
type: Object,
|
|
default: void 0
|
|
},
|
|
loading: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
hoverable: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
type: {
|
|
type: String
|
|
},
|
|
size: {
|
|
type: String
|
|
},
|
|
actions: PropTypes.any,
|
|
tabList: {
|
|
type: Array
|
|
},
|
|
tabBarExtraContent: PropTypes.any,
|
|
activeTabKey: String,
|
|
defaultActiveTabKey: String,
|
|
cover: PropTypes.any,
|
|
onTabChange: {
|
|
type: Function
|
|
}
|
|
});
|
|
const Card = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ACard",
|
|
inheritAttrs: false,
|
|
props: cardProps(),
|
|
slots: Object,
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
attrs
|
|
} = _ref;
|
|
const {
|
|
prefixCls,
|
|
direction,
|
|
size
|
|
} = useConfigInject("card", props);
|
|
const [wrapSSR, hashId] = useStyle$1(prefixCls);
|
|
const getAction = (actions) => {
|
|
const actionList = actions.map((action, index) => isVNode(action) && !isEmptyElement(action) || !isVNode(action) ? createVNode("li", {
|
|
"style": {
|
|
width: `${100 / actions.length}%`
|
|
},
|
|
"key": `action-${index}`
|
|
}, [createVNode("span", null, [action])]) : null);
|
|
return actionList;
|
|
};
|
|
const triggerTabChange = (key) => {
|
|
var _a;
|
|
(_a = props.onTabChange) === null || _a === void 0 ? void 0 : _a.call(props, key);
|
|
};
|
|
const isContainGrid = function() {
|
|
let obj = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
|
|
let containGrid;
|
|
obj.forEach((element) => {
|
|
if (element && isPlainObject(element.type) && element.type.__ANT_CARD_GRID) {
|
|
containGrid = true;
|
|
}
|
|
});
|
|
return containGrid;
|
|
};
|
|
return () => {
|
|
var _a, _b, _c, _d, _e, _f;
|
|
const {
|
|
headStyle = {},
|
|
bodyStyle = {},
|
|
loading,
|
|
bordered = true,
|
|
type,
|
|
tabList,
|
|
hoverable,
|
|
activeTabKey,
|
|
defaultActiveTabKey,
|
|
tabBarExtraContent = filterEmptyWithUndefined((_a = slots.tabBarExtraContent) === null || _a === void 0 ? void 0 : _a.call(slots)),
|
|
title = filterEmptyWithUndefined((_b = slots.title) === null || _b === void 0 ? void 0 : _b.call(slots)),
|
|
extra = filterEmptyWithUndefined((_c = slots.extra) === null || _c === void 0 ? void 0 : _c.call(slots)),
|
|
actions = filterEmptyWithUndefined((_d = slots.actions) === null || _d === void 0 ? void 0 : _d.call(slots)),
|
|
cover = filterEmptyWithUndefined((_e = slots.cover) === null || _e === void 0 ? void 0 : _e.call(slots))
|
|
} = props;
|
|
const children = flattenChildren((_f = slots.default) === null || _f === void 0 ? void 0 : _f.call(slots));
|
|
const pre = prefixCls.value;
|
|
const classString = {
|
|
[`${pre}`]: true,
|
|
[hashId.value]: true,
|
|
[`${pre}-loading`]: loading,
|
|
[`${pre}-bordered`]: bordered,
|
|
[`${pre}-hoverable`]: !!hoverable,
|
|
[`${pre}-contain-grid`]: isContainGrid(children),
|
|
[`${pre}-contain-tabs`]: tabList && tabList.length,
|
|
[`${pre}-${size.value}`]: size.value,
|
|
[`${pre}-type-${type}`]: !!type,
|
|
[`${pre}-rtl`]: direction.value === "rtl"
|
|
};
|
|
const loadingBlock = createVNode(Skeleton, {
|
|
"loading": true,
|
|
"active": true,
|
|
"paragraph": {
|
|
rows: 4
|
|
},
|
|
"title": false
|
|
}, {
|
|
default: () => [children]
|
|
});
|
|
const hasActiveTabKey = activeTabKey !== void 0;
|
|
const tabsProps = {
|
|
size: "large",
|
|
[hasActiveTabKey ? "activeKey" : "defaultActiveKey"]: hasActiveTabKey ? activeTabKey : defaultActiveTabKey,
|
|
onChange: triggerTabChange,
|
|
class: `${pre}-head-tabs`
|
|
};
|
|
let head;
|
|
const tabs = tabList && tabList.length ? createVNode(Tabs, tabsProps, {
|
|
default: () => [tabList.map((item) => {
|
|
const {
|
|
tab: temp,
|
|
slots: itemSlots
|
|
} = item;
|
|
const name = itemSlots === null || itemSlots === void 0 ? void 0 : itemSlots.tab;
|
|
devWarning(!itemSlots, "Card", `tabList slots is deprecated, Please use \`customTab\` instead.`);
|
|
let tab = temp !== void 0 ? temp : slots[name] ? slots[name](item) : null;
|
|
tab = customRenderSlot(slots, "customTab", item, () => [tab]);
|
|
return createVNode(TabPane, {
|
|
"tab": tab,
|
|
"key": item.key,
|
|
"disabled": item.disabled
|
|
}, null);
|
|
})],
|
|
rightExtra: tabBarExtraContent ? () => tabBarExtraContent : null
|
|
}) : null;
|
|
if (title || extra || tabs) {
|
|
head = createVNode("div", {
|
|
"class": `${pre}-head`,
|
|
"style": headStyle
|
|
}, [createVNode("div", {
|
|
"class": `${pre}-head-wrapper`
|
|
}, [title && createVNode("div", {
|
|
"class": `${pre}-head-title`
|
|
}, [title]), extra && createVNode("div", {
|
|
"class": `${pre}-extra`
|
|
}, [extra])]), tabs]);
|
|
}
|
|
const coverDom = cover ? createVNode("div", {
|
|
"class": `${pre}-cover`
|
|
}, [cover]) : null;
|
|
const body = createVNode("div", {
|
|
"class": `${pre}-body`,
|
|
"style": bodyStyle
|
|
}, [loading ? loadingBlock : children]);
|
|
const actionDom = actions && actions.length ? createVNode("ul", {
|
|
"class": `${pre}-actions`
|
|
}, [getAction(actions)]) : null;
|
|
return wrapSSR(createVNode("div", _objectSpread(_objectSpread({
|
|
"ref": "cardContainerRef"
|
|
}, attrs), {}, {
|
|
"class": [classString, attrs.class]
|
|
}), [head, coverDom, children && children.length ? body : null, actionDom]));
|
|
};
|
|
}
|
|
});
|
|
const cardMetaProps = () => ({
|
|
prefixCls: String,
|
|
title: vNodeType(),
|
|
description: vNodeType(),
|
|
avatar: vNodeType()
|
|
});
|
|
const Meta = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ACardMeta",
|
|
props: cardMetaProps(),
|
|
slots: Object,
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("card", props);
|
|
return () => {
|
|
const classString = {
|
|
[`${prefixCls.value}-meta`]: true
|
|
};
|
|
const avatar = getPropsSlot(slots, props, "avatar");
|
|
const title = getPropsSlot(slots, props, "title");
|
|
const description = getPropsSlot(slots, props, "description");
|
|
const avatarDom = avatar ? createVNode("div", {
|
|
"class": `${prefixCls.value}-meta-avatar`
|
|
}, [avatar]) : null;
|
|
const titleDom = title ? createVNode("div", {
|
|
"class": `${prefixCls.value}-meta-title`
|
|
}, [title]) : null;
|
|
const descriptionDom = description ? createVNode("div", {
|
|
"class": `${prefixCls.value}-meta-description`
|
|
}, [description]) : null;
|
|
const MetaDetail = titleDom || descriptionDom ? createVNode("div", {
|
|
"class": `${prefixCls.value}-meta-detail`
|
|
}, [titleDom, descriptionDom]) : null;
|
|
return createVNode("div", {
|
|
"class": classString
|
|
}, [avatarDom, MetaDetail]);
|
|
};
|
|
}
|
|
});
|
|
const cardGridProps = () => ({
|
|
prefixCls: String,
|
|
hoverable: {
|
|
type: Boolean,
|
|
default: true
|
|
}
|
|
});
|
|
const Grid = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "ACardGrid",
|
|
__ANT_CARD_GRID: true,
|
|
props: cardGridProps(),
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const {
|
|
prefixCls
|
|
} = useConfigInject("card", props);
|
|
const classNames2 = computed(() => {
|
|
return {
|
|
[`${prefixCls.value}-grid`]: true,
|
|
[`${prefixCls.value}-grid-hoverable`]: props.hoverable
|
|
};
|
|
});
|
|
return () => {
|
|
var _a;
|
|
return createVNode("div", {
|
|
"class": classNames2.value
|
|
}, [(_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)]);
|
|
};
|
|
}
|
|
});
|
|
Card.Meta = Meta;
|
|
Card.Grid = Grid;
|
|
Card.install = function(app) {
|
|
app.component(Card.name, Card);
|
|
app.component(Meta.name, Meta);
|
|
app.component(Grid.name, Grid);
|
|
return app;
|
|
};
|
|
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
__name: "StepNumber",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
value: { default: 0 },
|
|
countAdd: { default: 1 },
|
|
min: {},
|
|
max: {}
|
|
},
|
|
emits: ["update:value", "change"],
|
|
setup(__props, { emit: __emit }) {
|
|
const { prefixCls } = usePrefix("steper-number");
|
|
const props = __props;
|
|
const _value = computed({
|
|
get: () => {
|
|
return parseInt(props.value.toString());
|
|
},
|
|
set: (val) => {
|
|
emit("update:value", val);
|
|
emit("change", val);
|
|
}
|
|
});
|
|
const emit = __emit;
|
|
function handleAdd() {
|
|
if (props.max) {
|
|
if (_value.value + props.countAdd <= props.max) _value.value += props.countAdd;
|
|
} else _value.value += props.countAdd;
|
|
}
|
|
function handleMinus() {
|
|
if (props.min) {
|
|
if (_value.value - props.countAdd >= props.min) _value.value -= props.countAdd;
|
|
} else {
|
|
_value.value -= props.countAdd;
|
|
}
|
|
}
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
_push(`<div${ssrRenderAttrs(mergeProps({
|
|
class: [[unref(prefixCls)], "select-none"]
|
|
}, _attrs))}>`);
|
|
_push(ssrRenderComponent(unref(Card), { class: "card-padding-4 bg-gray-50 border border-1 border-solid border-gray-200 stepNumber py-1px" }, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<div class="flex justify-between items-center"${_scopeId}>`);
|
|
_push2(ssrRenderComponent(BasicIconOld, {
|
|
key: _value.value,
|
|
icon: "vuesax-linear:add",
|
|
class: "w-7 !h-7 cursor-pointer items-center",
|
|
onClick: handleAdd
|
|
}, null, _parent2, _scopeId));
|
|
_push2(`<span class="text-center w-10 font-semibold select-none"${_scopeId}>${ssrInterpolate(_value.value)}</span>`);
|
|
_push2(ssrRenderComponent(BasicIconOld, {
|
|
key: _value.value,
|
|
icon: _value.value === 1 ? "vuesax-linear:trash" : "vuesax-linear:minus",
|
|
class: ["w-7 !h-7 cursor-pointer items-center justify-end", [{ "text-red-600": _value.value == 1 }]],
|
|
size: "20",
|
|
onClick: handleMinus
|
|
}, null, _parent2, _scopeId));
|
|
_push2(`</div>`);
|
|
} else {
|
|
return [
|
|
createVNode("div", { class: "flex justify-between items-center" }, [
|
|
(openBlock(), createBlock(BasicIconOld, {
|
|
key: _value.value,
|
|
icon: "vuesax-linear:add",
|
|
class: "w-7 !h-7 cursor-pointer items-center",
|
|
onClick: handleAdd
|
|
})),
|
|
createVNode("span", { class: "text-center w-10 font-semibold select-none" }, toDisplayString(_value.value), 1),
|
|
(openBlock(), createBlock(BasicIconOld, {
|
|
key: _value.value,
|
|
icon: _value.value === 1 ? "vuesax-linear:trash" : "vuesax-linear:minus",
|
|
class: ["w-7 !h-7 cursor-pointer items-center justify-end", [{ "text-red-600": _value.value == 1 }]],
|
|
size: "20",
|
|
onClick: handleMinus
|
|
}, null, 8, ["icon", "class"]))
|
|
])
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
_push(`</div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$5 = _sfc_main$5.setup;
|
|
_sfc_main$5.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/StepNumber.vue");
|
|
return _sfc_setup$5 ? _sfc_setup$5(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
__name: "ProductInf",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
inf: {}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const router = useRouter();
|
|
const config = useConfigStore();
|
|
const userStore = useUserStore();
|
|
const _product = computed(() => {
|
|
return useProduct(props.inf, variantSelected.value);
|
|
});
|
|
const cartStore = useCartStore();
|
|
const variantPrice = ref(0);
|
|
const variantPriceWithDiscount = ref(0);
|
|
const variantStock = ref(0);
|
|
const variantSelected = ref(void 0);
|
|
const variantAllSelected = ref(false);
|
|
computed(() => {
|
|
var _a, _b;
|
|
return (_product.value.priceWithDiscount.value && _product.value.price.value) <= 0 ? 0 : (100 - ((_a = _product.value.priceWithDiscount.value) != null ? _a : 0) * 100 / ((_b = _product.value.price.value) != null ? _b : 0)).toFixed(0);
|
|
});
|
|
computed(() => {
|
|
var _a, _b;
|
|
return (variantPriceWithDiscount.value && variantPrice.value) <= 0 ? 0 : (100 - ((_a = variantPriceWithDiscount.value) != null ? _a : 0) * 100 / ((_b = variantPrice.value) != null ? _b : 0)).toFixed(0);
|
|
});
|
|
const showBuyBtn = computed(() => {
|
|
var _a, _b;
|
|
let available = false;
|
|
if (((_a = props.inf) == null ? void 0 : _a.type) === "variant") {
|
|
if (variantStock.value > 0) {
|
|
available = true;
|
|
}
|
|
} else {
|
|
if (((_b = props == null ? void 0 : props.inf) == null ? void 0 : _b.count) > 0) {
|
|
available = true;
|
|
}
|
|
}
|
|
return available;
|
|
});
|
|
computed(() => {
|
|
var _a2;
|
|
var _a, _b;
|
|
return (_a2 = (_b = (_a = _product.value) == null ? void 0 : _a.attributesUsedInVariants) == null ? void 0 : _b.value) != null ? _a2 : [];
|
|
});
|
|
const variantsAttrsToShow = ref([]);
|
|
const variantsSelected = ref([]);
|
|
const variantsAttrsToShowPrimary = ref([]);
|
|
let wholeVariantsArrayHasThisVal;
|
|
const lastIndex = ref(-1);
|
|
function doNullValue(index) {
|
|
for (let i = index; i < variantsSelected.value.length; i++) {
|
|
variantsSelected.value[i].selected_variant = void 0;
|
|
}
|
|
}
|
|
watch(variantsSelected, () => {
|
|
handleChange();
|
|
}, { deep: true });
|
|
function checkPrice() {
|
|
var _a;
|
|
let isFull = true;
|
|
variantsSelected.value.every((x, index) => {
|
|
var _a2;
|
|
if (((_a2 = variantsAttrsToShow.value[index].attribute_values_arr) == null ? void 0 : _a2.length) != 0 && !(x == null ? void 0 : x.selected_variant)) {
|
|
isFull = false;
|
|
return false;
|
|
} else {
|
|
return true;
|
|
}
|
|
});
|
|
if (isFull) {
|
|
(_a = _product.value.variants.value) == null ? void 0 : _a.forEach((x) => {
|
|
var _a2;
|
|
let isEqual = true;
|
|
(_a2 = x.variant_attribute_values) == null ? void 0 : _a2.forEach((y, index) => {
|
|
if (!variantsSelected.value.some((val) => val.selected_variant == y.attribute_values.id)) {
|
|
isEqual = false;
|
|
}
|
|
});
|
|
if (isEqual) {
|
|
variantPrice.value = x.price;
|
|
variantPriceWithDiscount.value = x.price_with_discount;
|
|
variantStock.value = x.stock;
|
|
variantSelected.value = x;
|
|
variantAllSelected.value = true;
|
|
}
|
|
});
|
|
} else {
|
|
variantPrice.value = 0;
|
|
variantPriceWithDiscount.value = 0;
|
|
variantStock.value = 0;
|
|
variantSelected.value = void 0;
|
|
variantAllSelected.value = false;
|
|
}
|
|
}
|
|
function variantsArrayHasThisVal(val) {
|
|
const oldWholeVariantsArrayHasThisVal = cloneDeep(wholeVariantsArrayHasThisVal);
|
|
wholeVariantsArrayHasThisVal = oldWholeVariantsArrayHasThisVal == null ? void 0 : oldWholeVariantsArrayHasThisVal.filter((z) => {
|
|
var _a;
|
|
return (_a = z.variant_attribute_values) == null ? void 0 : _a.some((j) => j.attribute_values.id === val);
|
|
});
|
|
}
|
|
function handleChange(val, index) {
|
|
variantsAttrsToShowPrimary.value.push(variantsAttrsToShow.value);
|
|
wholeVariantsArrayHasThisVal = cloneDeep(_product.value.variants.value);
|
|
variantsAttrsToShow.value.forEach((x) => {
|
|
var _a;
|
|
const itemSelected = (_a = variantsSelected.value.find((y) => y.attribute_id == x.attribute_id)) == null ? void 0 : _a.selected_variant;
|
|
if (itemSelected) {
|
|
lastIndex.value++;
|
|
variantsArrayHasThisVal(itemSelected);
|
|
}
|
|
variantsAttrsToShow.value.forEach((x2) => {
|
|
if (x2.attribute_id !== (val == null ? void 0 : val.attribute_id)) {
|
|
x2.attribute_values_arr = [];
|
|
x2.attribute_values = [];
|
|
wholeVariantsArrayHasThisVal == null ? void 0 : wholeVariantsArrayHasThisVal.forEach((y) => {
|
|
var _a2;
|
|
(_a2 = y == null ? void 0 : y.variant_attribute_values) == null ? void 0 : _a2.forEach((z) => {
|
|
var _a3, _b, _c;
|
|
if (z.attribute_values.attributes.id === x2.attribute_id && !((_a3 = x2.attribute_values) == null ? void 0 : _a3.includes(z.attribute_values.id))) {
|
|
(_b = x2.attribute_values_arr) == null ? void 0 : _b.push({
|
|
attribute_id: z.attribute_values.attributes.id,
|
|
id: z.attribute_values.id,
|
|
value: z.attribute_values.value
|
|
});
|
|
(_c = x2.attribute_values) == null ? void 0 : _c.push(z.attribute_values.id);
|
|
}
|
|
});
|
|
});
|
|
}
|
|
});
|
|
});
|
|
checkPrice();
|
|
}
|
|
const goToMessage = () => {
|
|
if (getToken()) {
|
|
router.push({ name: "message-detail_message", query: { user_id: props.inf.owner_id } });
|
|
} else {
|
|
api$1.warn(config.useString("pleaseLoginOrRegister"));
|
|
router.push({ name: "auth-login" });
|
|
}
|
|
};
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
var _a2, _b2;
|
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
|
|
const _component_AFormItem = __nuxt_component_1;
|
|
_push(`<div${ssrRenderAttrs(_attrs)}><div class="mx-4 mt-5"><div class="font-bold text-lg font-azar">${ssrInterpolate(_product.value.title)}</div><div class="flex justify-between items-center w-full gap-5 mt-3"><div class="flex gap-4"><div class="items-center gap-1 flex md:hidden"><div class="font-semibold text-xl">${ssrInterpolate(unref(usePrice)((_a2 = _product.value.price.value) != null ? _a2 : 0, true, ""))}</div><div>${ssrInterpolate(unref(config).priceUnit)}</div></div>`);
|
|
if (_product.value.hasDiscount.value) {
|
|
_push(`<div class="flex items-center gap-1"><div class="slanted-strike text-xs">${ssrInterpolate(unref(usePrice)((_b2 = (_a = _product.value) == null ? void 0 : _a.originalPrice.value) != null ? _b2 : 0, true, ""))}</div><div class="mr-1 text-xs">${ssrInterpolate(unref(config).priceUnit)}</div><div class="mr-2 text-xs bg-primary text-white px-2 py-1px rounded">${ssrInterpolate((_c = (_b = _product.value) == null ? void 0 : _b.discountPercent) == null ? void 0 : _c.value)}% </div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div></div>`);
|
|
if (_ctx.inf.owner_id !== ((_d = unref(userStore).user) == null ? void 0 : _d.id) && (("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "single" && !unref(config).isSeller || ("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "multi")) {
|
|
_push(`<div class="mt-3">`);
|
|
if (((_e = _ctx.inf) == null ? void 0 : _e.type) === "variant" && variantAllSelected.value || ((_f = _ctx.inf) == null ? void 0 : _f.type) === "simple") {
|
|
_push(`<!--[-->`);
|
|
if (showBuyBtn.value) {
|
|
_push(`<!--[-->`);
|
|
if (_product.value.qty.value > 0) {
|
|
_push(ssrRenderComponent(_sfc_main$5, {
|
|
countAdd: ((_g = props.inf) == null ? void 0 : _g.sell_type) === "box" ? (_h = props.inf) == null ? void 0 : _h.box_size : 1,
|
|
value: _product.value.qty.value,
|
|
"onUpdate:value": ($event) => _product.value.qty.value = $event,
|
|
onClick: () => {
|
|
},
|
|
class: ""
|
|
}, null, _parent));
|
|
} else {
|
|
_push(ssrRenderComponent(_sfc_main$7, {
|
|
size: "large",
|
|
block: "",
|
|
type: "primary",
|
|
onClick: ($event) => unref(cartStore).addToCart(props.inf, props.inf.sell_type === "box" ? props.inf.box_size : 1, variantSelected.value)
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`${ssrInterpolate(unref(config).useString("addToCart"))}`);
|
|
} else {
|
|
return [
|
|
createTextVNode(toDisplayString(unref(config).useString("addToCart")), 1)
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
}
|
|
_push(`<!--]-->`);
|
|
} else {
|
|
_push(`<div class="w-full text-center bg-gray-200 p-2 rounded-lg">${ssrInterpolate(unref(config).useString("outOfStock"))}</div>`);
|
|
}
|
|
_push(`<!--]-->`);
|
|
} else {
|
|
_push(`<div class="text-primary bg-gray-100 p-2 text-center rounded-lg">${ssrInterpolate(unref(config).useString("pleaseCompleteAllSelects"))}</div>`);
|
|
}
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (_ctx.inf.owner_id !== ((_i = unref(userStore).user) == null ? void 0 : _i.id) && (("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "single" && !unref(config).isSeller || ("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "multi")) {
|
|
_push(`<div class="w-full mt-2">`);
|
|
_push(ssrRenderComponent(_sfc_main$7, {
|
|
class: "w-full",
|
|
size: "large",
|
|
onClick: goToMessage
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`${ssrInterpolate(unref(config).useString("messageSeller"))}`);
|
|
} else {
|
|
return [
|
|
createTextVNode(toDisplayString(unref(config).useString("messageSeller")), 1)
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (((_j = _ctx.inf) == null ? void 0 : _j.type) === "variant" && variantsAttrsToShow.value.length > 0 && _ctx.inf.owner_id !== ((_k = unref(userStore).user) == null ? void 0 : _k.id) && (("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "single" && !unref(config).isSeller || ("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "multi")) {
|
|
_push(`<div class="w-full mt5"><!--[-->`);
|
|
ssrRenderList(variantsAttrsToShow.value, (val, index) => {
|
|
var _a22, _b22, _c2;
|
|
_push(`<div class="w-full">`);
|
|
if (val.attribute_values_arr.length != 0 && (index == 0 ? true : variantsSelected.value[index - 1].selected_variant)) {
|
|
_push(`<div class="flex py-1">`);
|
|
_push(ssrRenderComponent(_component_AFormItem, {
|
|
label: (_a22 = val.attribute) == null ? void 0 : _a22.name,
|
|
class: "flex-1 attrCustomCss"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(ssrRenderComponent(_sfc_main$8, {
|
|
items: val.attribute_values_arr,
|
|
showSearch: false,
|
|
placeholder: unref(config).useString("pleaseSelectAnOption"),
|
|
value: variantsSelected.value[index].selected_variant,
|
|
"onUpdate:value": ($event) => variantsSelected.value[index].selected_variant = $event,
|
|
onChange: ($event) => handleChange($event),
|
|
"key-name": "id",
|
|
"allow-clear": false,
|
|
"value-name": "value",
|
|
class: "attrCustomCss"
|
|
}, null, _parent2, _scopeId));
|
|
} else {
|
|
return [
|
|
createVNode(_sfc_main$8, {
|
|
items: val.attribute_values_arr,
|
|
showSearch: false,
|
|
placeholder: unref(config).useString("pleaseSelectAnOption"),
|
|
value: variantsSelected.value[index].selected_variant,
|
|
"onUpdate:value": ($event) => variantsSelected.value[index].selected_variant = $event,
|
|
onChange: ($event) => handleChange($event),
|
|
"key-name": "id",
|
|
"allow-clear": false,
|
|
"value-name": "value",
|
|
class: "attrCustomCss"
|
|
}, null, 8, ["items", "placeholder", "value", "onUpdate:value", "onChange"])
|
|
];
|
|
}
|
|
}),
|
|
_: 2
|
|
}, _parent));
|
|
_push(`<div class="relative flex-self-end mb10px"><div class="${ssrRenderClass([variantsSelected.value[index].selected_variant ? "cursor-pointer border-red" : "cursor-not-allowed border-gray-3", "border-2px border-solid border-1 rounded-e-lg p-2px bg-gray-50"])}">`);
|
|
_push(ssrRenderComponent(BasicIconOld, {
|
|
icon: "vuesax-linear:add",
|
|
color: ((_b22 = variantsSelected.value[index]) == null ? void 0 : _b22.selected_variant) ? "red" : "gray",
|
|
class: [((_c2 = variantsSelected.value[index]) == null ? void 0 : _c2.selected_variant) ? "cursor-pointer" : "cursor-not-allowed", "rotate-45"],
|
|
onClick: () => {
|
|
variantsSelected.value[index].selected_variant = void 0;
|
|
doNullValue(index);
|
|
}
|
|
}, null, _parent));
|
|
_push(`</div></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
});
|
|
_push(`<!--]--></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (_ctx.inf.owner_id !== ((_l = unref(userStore).user) == null ? void 0 : _l.id)) {
|
|
_push(`<div class="text-gray-6 mt-3 text-xs text-center px-1">${ssrInterpolate(unref(config).useString("addToCartWillPlaceYourOrderIntoCartAndYouCanCompleteOrderInCartMenu"))}</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div></div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$4 = _sfc_main$4.setup;
|
|
_sfc_main$4.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/product/components/ProductInf.vue");
|
|
return _sfc_setup$4 ? _sfc_setup$4(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
__name: "ProductDetail",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
attrs: {},
|
|
description: {},
|
|
category: {},
|
|
brand: {},
|
|
weight: {},
|
|
fee: {}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const config = useConfigStore();
|
|
const filteredParams = computed(() => {
|
|
var _a;
|
|
return ((_a = props.attrs) == null ? void 0 : _a.filter((x) => x.use_in_product_page)) || [];
|
|
});
|
|
const showAll = ref(false);
|
|
const visibleParams = computed(() => {
|
|
return showAll.value ? filteredParams.value : filteredParams.value.slice(0, 1);
|
|
});
|
|
const toggleShowAll = () => {
|
|
showAll.value = !showAll.value;
|
|
};
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
|
|
const _component_ATag = Tag;
|
|
const _component_a_button = Button;
|
|
const _component_a_divider = __nuxt_component_4;
|
|
if (((_a = filteredParams.value) == null ? void 0 : _a.length) > 0 || _ctx.description || _ctx.weight || _ctx.fee) {
|
|
_push(`<div${ssrRenderAttrs(mergeProps({ class: "rounded-xl md:overflow-y-auto mt-5 md:mt-0 md:flex-1 max-h-30rem md:max-h-unset mx-4" }, _attrs))}><div class="font-bold text-lg">${ssrInterpolate(unref(config).useString("aboutProduct"))}</div>`);
|
|
if (((_b = filteredParams.value) == null ? void 0 : _b.length) > 0 || _ctx.weight || _ctx.fee || _ctx.category) {
|
|
_push(`<!--[-->`);
|
|
if ((_c = _ctx.category) == null ? void 0 : _c.title) {
|
|
_push(`<div class="flex mt-3 items-center gap-2 font-azar"><div class="bg-emerald-950 w-2 h-2 rounded-full"></div><div class="flex gap-3 items-center md:text-base text-sm"><div class="text-gray-400 font-semibold text-xs">${ssrInterpolate(unref(config).useString("category"))}:</div><div class="flex mr-2 justify-center items-center gap-1 text-xs">${ssrInterpolate((_d = _ctx.category) == null ? void 0 : _d.title)}</div></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if ((_e = _ctx.brand) == null ? void 0 : _e.title) {
|
|
_push(`<div class="flex mt-3 items-center gap-2 font-azar"><div class="bg-emerald-950 w-2 h-2 rounded-full"></div><div class="flex gap-3 items-center md:text-base text-sm"><div class="text-gray-400 font-semibold text-xs">${ssrInterpolate(unref(config).useString("brands"))}:</div><div class="flex mr-2 justify-center items-center gap-1 text-xs">${ssrInterpolate((_f = _ctx.brand) == null ? void 0 : _f.title)}</div></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (((_g = _ctx.category) == null ? void 0 : _g.id) === 1 || ((_h = _ctx.category) == null ? void 0 : _h.id) === 2) {
|
|
_push(`<div class="flex mt-3 items-center gap-2 font-azar"><div class="bg-emerald-950 w-2 h-2 rounded-full"></div><div class="flex gap-3 items-center md:text-base text-sm"><div class="text-gray-400 font-semibold text-xs">${ssrInterpolate(unref(config).useString("weight"))}:</div><div class="flex mr-2 justify-center items-center gap-1 text-xs">${ssrInterpolate(_ctx.weight)} ${ssrInterpolate(unref(config).useString("gram"))}</div></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (((_i = _ctx.category) == null ? void 0 : _i.id) === 1 || ((_j = _ctx.category) == null ? void 0 : _j.id) === 2) {
|
|
_push(`<div class="flex mt-3 items-center gap-2 font-azar"><div class="bg-emerald-950 w-2 h-2 rounded-full"></div><div class="flex gap-3 items-center md:text-base text-sm"><div class="text-gray-400 font-semibold text-xs">${ssrInterpolate(unref(config).useString("percentFee"))}:</div><div class="flex mr-2 justify-center items-center gap-1 text-xs">${ssrInterpolate(_ctx.fee)} % </div></div></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<!--[-->`);
|
|
ssrRenderList(visibleParams.value, (item, index) => {
|
|
var _a2;
|
|
_push(`<div class="flex mt-3 items-center gap-2 font-azar"><div class="bg-emerald-950 w-2 h-2 rounded-full"></div><div class="flex gap-3 items-center md:text-base text-sm font-azar"><div class="text-gray-400 font-semibold text-xs">${ssrInterpolate((_a2 = item.attributes) == null ? void 0 : _a2.name)}:</div><div class="flex mr-2 justify-center items-center gap-1 text-xs"><!--[-->`);
|
|
ssrRenderList(item == null ? void 0 : item.attribute_values_arr, (val, i) => {
|
|
_push(ssrRenderComponent(_component_ATag, {
|
|
key: i,
|
|
class: "font-azar text-gray-400 p2px"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`${ssrInterpolate(val.value)}`);
|
|
} else {
|
|
return [
|
|
createTextVNode(toDisplayString(val.value), 1)
|
|
];
|
|
}
|
|
}),
|
|
_: 2
|
|
}, _parent));
|
|
});
|
|
_push(`<!--]--></div></div></div>`);
|
|
});
|
|
_push(`<!--]-->`);
|
|
if (filteredParams.value.length > 1) {
|
|
_push(`<div class="mt-2">`);
|
|
_push(ssrRenderComponent(_component_a_button, {
|
|
type: "link",
|
|
onClick: toggleShowAll,
|
|
class: "!h-1rem"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`${ssrInterpolate(showAll.value ? unref(config).useString("less") : unref(config).useString("more"))}`);
|
|
} else {
|
|
return [
|
|
createTextVNode(toDisplayString(showAll.value ? unref(config).useString("less") : unref(config).useString("more")), 1)
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<!--]-->`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (_ctx.description) {
|
|
_push(`<!--[-->`);
|
|
if (((_k = filteredParams.value) == null ? void 0 : _k.length) > 0) {
|
|
_push(ssrRenderComponent(_component_a_divider, null, null, _parent));
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<div class="mt-2 text-justify text-xs font-azar">${ssrInterpolate(_ctx.description)}</div><!--]-->`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$3 = _sfc_main$3.setup;
|
|
_sfc_main$3.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/product/components/ProductDetail.vue");
|
|
return _sfc_setup$3 ? _sfc_setup$3(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
__name: "ProductSeller",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
seller: {}
|
|
},
|
|
setup(__props) {
|
|
const config = useConfigStore();
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
var _a2;
|
|
var _a, _b, _c, _d, _e;
|
|
const _directive_lazy = resolveDirective("lazy");
|
|
let _temp0;
|
|
_push(`<div${ssrRenderAttrs(mergeProps({ class: "mx-4 mt-5" }, _attrs))}><div class="font-bold text-lg">${ssrInterpolate(unref(config).useString("aboutSeller"))}</div><div class="mt-3 flex"><img${ssrRenderAttrs(_temp0 = mergeProps({
|
|
class: "w-4rem h-4rem rounded-full border-1 border-solid border-gray",
|
|
alt: "instagram"
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)((_a = _ctx.seller) == null ? void 0 : _a.avatar), loading: unref(empty_user), error: unref(empty_user) })))}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a2 = _temp0.innerHTML) != null ? _a2 : ""}<div class="ms-5 w-full"><div class="text-sm font-bold">${ssrInterpolate((_b = _ctx.seller) == null ? void 0 : _b.name)}</div><div class="text-gray-6 truncate text-xs w-7/8 mt-1 font-azar">${ssrInterpolate((_c = _ctx.seller) == null ? void 0 : _c.bio)}</div><div class="text-xs text-gray-6 font-bold mt-1">${ssrInterpolate(unref(config).useString("followedByNUsers", (_e = (_d = _ctx.seller) == null ? void 0 : _d.stats) == null ? void 0 : _e.total_customer))}</div></div></div></div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$2 = _sfc_main$2.setup;
|
|
_sfc_main$2.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/product/components/ProductSeller.vue");
|
|
return _sfc_setup$2 ? _sfc_setup$2(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
__name: "index",
|
|
__ssrInlineRender: true,
|
|
async setup(__props) {
|
|
let __temp, __restore;
|
|
const router = useRouter();
|
|
const stateNextButton = ref(true);
|
|
const statePreButton = ref(false);
|
|
const images = ref([]);
|
|
const modules = [Zoom, Navigation, Pagination];
|
|
const config = useConfigStore();
|
|
const cartStore = useCartStore();
|
|
const userStore = useUserStore();
|
|
reactive({
|
|
visible: false,
|
|
position: 0
|
|
});
|
|
const optionVisible = ref(false);
|
|
const optionPostId = ref();
|
|
const id = computed(() => router.currentRoute.value.params.id);
|
|
function openOption(id2) {
|
|
optionPostId.value = id2;
|
|
optionVisible.value = true;
|
|
}
|
|
const { data } = ([__temp, __restore] = withAsyncContext(async () => useAsyncData("product", async () => {
|
|
var _a;
|
|
return (await getOneProduct((_a = id.value) != null ? _a : "")).product;
|
|
})), __temp = await __temp, __restore(), __temp);
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
var _a2;
|
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
|
const _component_a_badge = Badge;
|
|
const _component_a_spin = Spin;
|
|
const _directive_lazy = resolveDirective("lazy");
|
|
let _temp0, _temp1;
|
|
_push(`<div${ssrRenderAttrs(_attrs)} data-v-aeec7125><div class="absolute top-0 w-inherit right-0 left-0" data-v-aeec7125><div class="flex justify-between items-center w-full p4" data-v-aeec7125><div class="flex items-center gap-2" data-v-aeec7125>`);
|
|
_push(ssrRenderComponent(BasicIconOld, {
|
|
icon: unref(config).isRTL ? "vuesax-linear:arrow-right" : "vuesax-linear:arrow-left",
|
|
onClick: ($event) => unref(router).back()
|
|
}, null, _parent));
|
|
if (unref(data)) {
|
|
_push(`<div class="font-semibold flex items-center gap-3" data-v-aeec7125><img${ssrRenderAttrs(_temp0 = mergeProps({
|
|
alt: "instagram",
|
|
class: "rounded-full w-2rem h-2rem"
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)((_b = (_a = unref(data)) == null ? void 0 : _a.users) == null ? void 0 : _b.avatar), loading: unref(empty_user), error: unref(empty_user) })))} data-v-aeec7125>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a2 = _temp0.innerHTML) != null ? _a2 : ""} ${ssrInterpolate((_d = (_c = unref(data)) == null ? void 0 : _c.users) == null ? void 0 : _d.name)}</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
if (unref(data)) {
|
|
_push(`<div class="flex items-center" data-v-aeec7125>`);
|
|
if (((_e = unref(userStore).user) == null ? void 0 : _e.id) === unref(data).owner_id) {
|
|
_push(ssrRenderComponent(BasicIconOld, {
|
|
icon: "vuesax-linear:more",
|
|
class: "rotate-90",
|
|
size: "18",
|
|
onClick: ($event) => openOption(id.value)
|
|
}, null, _parent));
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
if (unref(config).isSeller && ("APP_TYPE" in _ctx ? _ctx.APP_TYPE : unref(APP_TYPE)) === "multi") {
|
|
_push(ssrRenderComponent(_component_a_badge, {
|
|
count: unref(cartStore).count,
|
|
dir: "ltr"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<div data-v-aeec7125${_scopeId}>`);
|
|
if (unref(config).isNightStore) {
|
|
_push2(`<img${ssrRenderAttr("src", _imports_0)} class="w-1.8rem -mt1" alt="" data-v-aeec7125${_scopeId}>`);
|
|
} else {
|
|
_push2(`<img${ssrRenderAttr("src", _imports_1)}${ssrRenderAttr("alt", unref(reactiveProjectName))} class="w-1.8rem -mt1" data-v-aeec7125${_scopeId}>`);
|
|
}
|
|
_push2(`</div>`);
|
|
} else {
|
|
return [
|
|
createVNode("div", {
|
|
onClick: ($event) => unref(router).push({ name: "cart" })
|
|
}, [
|
|
unref(config).isNightStore ? (openBlock(), createBlock("img", {
|
|
key: 0,
|
|
src: _imports_0,
|
|
class: "w-1.8rem -mt1",
|
|
alt: ""
|
|
})) : (openBlock(), createBlock("img", {
|
|
key: 1,
|
|
src: _imports_1,
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-1.8rem -mt1"
|
|
}, null, 8, ["alt"]))
|
|
], 8, ["onClick"])
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
_push(ssrRenderComponent(_component_a_spin, {
|
|
spinning: !unref(data),
|
|
class: "w-full h-60vh"
|
|
}, null, _parent));
|
|
if (unref(data)) {
|
|
_push(`<div class="h-90vh overflow-y-auto pb-10vh" data-v-aeec7125>`);
|
|
if (images.value) {
|
|
_push(ssrRenderComponent(unref(Swiper), {
|
|
class: "!flex !flex-row !gab-15 md:mt-2",
|
|
"slides-per-view": 1,
|
|
freeMode: false,
|
|
watchSlidesProgress: true,
|
|
loop: true,
|
|
"space-between": 0,
|
|
modules,
|
|
pagination: { el: ".custom-pagination", clickable: true },
|
|
zoom: true,
|
|
navigation: {
|
|
nextEl: ".goCategoryNext",
|
|
prevEl: ".goCategoryBack"
|
|
},
|
|
onReachEnd: () => {
|
|
statePreButton.value = true;
|
|
},
|
|
onReachBeginning: () => {
|
|
stateNextButton.value = true;
|
|
},
|
|
onFromEdge: () => {
|
|
stateNextButton.value = false;
|
|
statePreButton.value = false;
|
|
}
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<!--[-->`);
|
|
ssrRenderList(images.value, (item) => {
|
|
_push2(ssrRenderComponent(unref(SwiperSlide), null, {
|
|
default: withCtx((_2, _push3, _parent3, _scopeId2) => {
|
|
var _a3;
|
|
if (_push3) {
|
|
_push3(`<div class="swiper-zoom-container" data-v-aeec7125${_scopeId2}>`);
|
|
if (item.type === "video") {
|
|
_push3(`<div class="video-container" data-v-aeec7125${_scopeId2}><video${ssrRenderAttr("src", unref(getSupabaseStorageUrl)(item.url))} playsinline muted loop class="video" data-v-aeec7125${_scopeId2}></video></div>`);
|
|
} else {
|
|
_push3(`<div class="w-full aspect-square flex items-center" data-v-aeec7125${_scopeId2}><img${ssrRenderAttrs(_temp1 = mergeProps({
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full h-full object-contain"
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)(item.url), loading: unref(img_gif), error: unref(img_gif) })))} data-v-aeec7125${_scopeId2}>${"textContent" in _temp1 ? ssrInterpolate(_temp1.textContent) : (_a3 = _temp1.innerHTML) != null ? _a3 : ""}</div>`);
|
|
}
|
|
_push3(`</div>`);
|
|
} else {
|
|
return [
|
|
createVNode("div", { class: "swiper-zoom-container" }, [
|
|
item.type === "video" ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: "video-container"
|
|
}, [
|
|
createVNode("video", {
|
|
ref_for: true,
|
|
ref: "videos",
|
|
src: unref(getSupabaseStorageUrl)(item.url),
|
|
playsinline: "",
|
|
muted: "",
|
|
loop: "",
|
|
class: "video"
|
|
}, null, 8, ["src"])
|
|
])) : (openBlock(), createBlock("div", {
|
|
key: 1,
|
|
class: "w-full aspect-square flex items-center"
|
|
}, [
|
|
withDirectives(createVNode("img", {
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full h-full object-contain"
|
|
}, null, 8, ["alt"]), [
|
|
[_directive_lazy, { src: unref(getSupabaseStorageUrl)(item.url), loading: unref(img_gif), error: unref(img_gif) }]
|
|
])
|
|
]))
|
|
])
|
|
];
|
|
}
|
|
}),
|
|
_: 2
|
|
}, _parent2, _scopeId));
|
|
});
|
|
_push2(`<!--]-->`);
|
|
} else {
|
|
return [
|
|
(openBlock(true), createBlock(Fragment, null, renderList(images.value, (item) => {
|
|
return openBlock(), createBlock(unref(SwiperSlide), null, {
|
|
default: withCtx(() => [
|
|
createVNode("div", { class: "swiper-zoom-container" }, [
|
|
item.type === "video" ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: "video-container"
|
|
}, [
|
|
createVNode("video", {
|
|
ref_for: true,
|
|
ref: "videos",
|
|
src: unref(getSupabaseStorageUrl)(item.url),
|
|
playsinline: "",
|
|
muted: "",
|
|
loop: "",
|
|
class: "video"
|
|
}, null, 8, ["src"])
|
|
])) : (openBlock(), createBlock("div", {
|
|
key: 1,
|
|
class: "w-full aspect-square flex items-center"
|
|
}, [
|
|
withDirectives(createVNode("img", {
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full h-full object-contain"
|
|
}, null, 8, ["alt"]), [
|
|
[_directive_lazy, { src: unref(getSupabaseStorageUrl)(item.url), loading: unref(img_gif), error: unref(img_gif) }]
|
|
])
|
|
]))
|
|
])
|
|
]),
|
|
_: 2
|
|
}, 1024);
|
|
}), 256))
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<div class="custom-pagination" data-v-aeec7125></div>`);
|
|
_push(ssrRenderComponent(_sfc_main$4, { inf: unref(data) }, null, _parent));
|
|
_push(`<div class="${ssrRenderClass([unref(config).isNightStore ? "bg-zinc-9" : "bg-gray-100", "h-2 mt-5 w-full bg-gray-100"])}" data-v-aeec7125></div>`);
|
|
_push(ssrRenderComponent(_sfc_main$3, {
|
|
class: "md:w-full",
|
|
brand: (_f = unref(data)) == null ? void 0 : _f.brands,
|
|
category: (_g = unref(data)) == null ? void 0 : _g.collections,
|
|
attrs: (_h = unref(data)) == null ? void 0 : _h.product_attributes,
|
|
description: (_i = unref(data)) == null ? void 0 : _i.description,
|
|
weight: (_j = unref(data)) == null ? void 0 : _j.weight,
|
|
fee: (_k = unref(data)) == null ? void 0 : _k.percent_fee
|
|
}, null, _parent));
|
|
if (((_m = (_l = unref(data)) == null ? void 0 : _l.product_attributes) == null ? void 0 : _m.filter((x) => x.use_in_product_page)) || ((_n = unref(data)) == null ? void 0 : _n.description)) {
|
|
_push(`<div class="${ssrRenderClass([unref(config).isNightStore ? "bg-zinc-9" : "bg-gray-100", "h-2 mt-5 w-full bg-gray-100"])}" data-v-aeec7125></div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(ssrRenderComponent(_sfc_main$2, {
|
|
seller: unref(data).users
|
|
}, null, _parent));
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
_push(ssrRenderComponent(_sfc_main$6, {
|
|
id: optionPostId.value,
|
|
open: optionVisible.value,
|
|
"onUpdate:open": ($event) => optionVisible.value = $event
|
|
}, null, _parent));
|
|
_push(`</div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$1 = _sfc_main$1.setup;
|
|
_sfc_main$1.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/product/index.vue");
|
|
return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
|
|
};
|
|
const Index = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-aeec7125"]]);
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
__name: "[id]",
|
|
__ssrInlineRender: true,
|
|
setup(__props) {
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
_push(ssrRenderComponent(Index, _attrs, null, _parent));
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup = _sfc_main.setup;
|
|
_sfc_main.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("pages/product_detail/[id].vue");
|
|
return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
|
|
};
|
|
|
|
export { _sfc_main as default };
|
|
//# sourceMappingURL=_id_-B9OXtrWF.mjs.map
|