199 lines
6.3 KiB
Vue
199 lines
6.3 KiB
Vue
<script>
|
|
/** 商品配置的占位骨架；busy 仅表示加载状态，真实配置/报价仍由对应产品组件负责。 */
|
|
import { renderList } from "vue";
|
|
import { renderSlot } from "vue";
|
|
import { createElementBlock } from "vue";
|
|
import { Fragment } from "vue";
|
|
import { createElementVNode } from "vue";
|
|
import { defineComponent } from "vue";
|
|
import { createVNode } from "vue";
|
|
import { openBlock } from "vue";
|
|
import skeleton from "primevue/skeleton";
|
|
var l = [`aria-busy`, `aria-label`],
|
|
u = {
|
|
class: `config-layout`,
|
|
},
|
|
d = {
|
|
class: `config-options`,
|
|
},
|
|
f = {
|
|
class: `section-title`,
|
|
},
|
|
p = {
|
|
class: `config-loading-fields`,
|
|
},
|
|
m = {
|
|
class: `config-choices`,
|
|
},
|
|
h = {
|
|
class: `config-summary-wrap`,
|
|
"aria-hidden": `true`,
|
|
},
|
|
g = {
|
|
class: `panel config-checkout config-loading-summary`,
|
|
},
|
|
_ = Object.assign(
|
|
defineComponent({
|
|
__name: `ConfigLoadingShell`,
|
|
props: {
|
|
busy: {
|
|
type: Boolean,
|
|
default: !0,
|
|
},
|
|
},
|
|
setup(a) {
|
|
return (_, v) => {
|
|
let y = skeleton;
|
|
return (
|
|
openBlock(),
|
|
createElementBlock(
|
|
`div`,
|
|
{
|
|
class: `config-page config-loading-shell`,
|
|
"aria-busy": a.busy,
|
|
"aria-label": a.busy ? `正在加载产品配置` : `产品配置`,
|
|
},
|
|
[
|
|
createElementVNode(`div`, u, [
|
|
createElementVNode(`div`, d, [
|
|
renderSlot(_.$slots, `catalog`),
|
|
(openBlock(),
|
|
createElementBlock(
|
|
Fragment,
|
|
null,
|
|
renderList(3, (t) =>
|
|
createElementVNode(
|
|
`section`,
|
|
{
|
|
key: t,
|
|
class: `panel`,
|
|
"aria-hidden": `true`,
|
|
},
|
|
[
|
|
createElementVNode(`h2`, f, [
|
|
createVNode(y, {
|
|
width: `6rem`,
|
|
height: `1.429rem`,
|
|
}),
|
|
]),
|
|
createElementVNode(`div`, p, [
|
|
createVNode(y, {
|
|
width: `4rem`,
|
|
height: `1.429rem`,
|
|
}),
|
|
createElementVNode(`div`, m, [
|
|
(openBlock(),
|
|
createElementBlock(
|
|
Fragment,
|
|
null,
|
|
renderList(4, (e) =>
|
|
createVNode(y, {
|
|
key: e,
|
|
height: `60px`,
|
|
}),
|
|
),
|
|
64,
|
|
)),
|
|
]),
|
|
createVNode(y, {
|
|
width: `4rem`,
|
|
height: `1.429rem`,
|
|
}),
|
|
createVNode(y, {
|
|
width: `70%`,
|
|
height: `36px`,
|
|
}),
|
|
]),
|
|
],
|
|
),
|
|
),
|
|
64,
|
|
)),
|
|
]),
|
|
createElementVNode(`div`, h, [
|
|
(v[3] ||= createElementVNode(
|
|
`h2`,
|
|
{
|
|
class: `config-column-title`,
|
|
},
|
|
`所选配置`,
|
|
-1,
|
|
)),
|
|
createElementVNode(`aside`, g, [
|
|
(v[0] ||= createElementVNode(
|
|
`h3`,
|
|
{
|
|
class: `section-title`,
|
|
},
|
|
`配置详情`,
|
|
-1,
|
|
)),
|
|
(openBlock(),
|
|
createElementBlock(
|
|
Fragment,
|
|
null,
|
|
renderList(6, (e) =>
|
|
createVNode(y, {
|
|
key: e,
|
|
height: `1.429rem`,
|
|
}),
|
|
),
|
|
64,
|
|
)),
|
|
(v[1] ||= createElementVNode(
|
|
`div`,
|
|
{
|
|
class: `checkout-divider`,
|
|
},
|
|
null,
|
|
-1,
|
|
)),
|
|
createVNode(y, {
|
|
height: `36px`,
|
|
}),
|
|
createVNode(y, {
|
|
height: `36px`,
|
|
}),
|
|
(v[2] ||= createElementVNode(
|
|
`div`,
|
|
{
|
|
class: `checkout-divider`,
|
|
},
|
|
null,
|
|
-1,
|
|
)),
|
|
createVNode(y, {
|
|
width: `5rem`,
|
|
height: `1.714rem`,
|
|
}),
|
|
createVNode(y, {
|
|
height: `2.275rem`,
|
|
}),
|
|
createVNode(y, {
|
|
height: `100px`,
|
|
}),
|
|
createVNode(y, {
|
|
height: `36px`,
|
|
}),
|
|
createVNode(y, {
|
|
height: `36px`,
|
|
}),
|
|
]),
|
|
]),
|
|
]),
|
|
],
|
|
8,
|
|
l,
|
|
)
|
|
);
|
|
};
|
|
},
|
|
}),
|
|
{
|
|
__name: `ConfigLoadingShell`,
|
|
},
|
|
);
|
|
export {};
|
|
export default _;
|
|
</script>
|