143 lines
4.4 KiB
Vue
143 lines
4.4 KiB
Vue
<script>
|
|
/** 通用配置单选卡片组:父级提供 options,点击新值同时发出 v-model 更新与 change。 */
|
|
import "~/assets/styles/OsIcon.CAi4Iz2S.css";
|
|
import { toDisplayString } from "vue";
|
|
import { renderList } from "vue";
|
|
import { normalizeClass } from "vue";
|
|
import { createBlock } from "vue";
|
|
import { createCommentVNode } from "vue";
|
|
import { createElementBlock } from "vue";
|
|
import { Fragment } from "vue";
|
|
import { createElementVNode } from "vue";
|
|
import { defineComponent } from "vue";
|
|
import { openBlock } from "vue";
|
|
import OsIcon from "~/components/OsIcon.vue";
|
|
var d = [`aria-label`],
|
|
f = [`aria-pressed`, `disabled`, `onClick`],
|
|
p = {
|
|
key: 1,
|
|
},
|
|
m = Object.assign(
|
|
defineComponent({
|
|
__name: `ConfigChoiceGrid`,
|
|
props: {
|
|
modelValue: {},
|
|
options: {},
|
|
disabled: {
|
|
type: Boolean,
|
|
},
|
|
compact: {
|
|
type: Boolean,
|
|
},
|
|
images: {
|
|
type: Boolean,
|
|
},
|
|
label: {},
|
|
},
|
|
emits: [`update:modelValue`, `change`],
|
|
setup(c, { emit: m }) {
|
|
let h = c,
|
|
g = m;
|
|
function _(e) {
|
|
// 禁用或重复点击当前选项均不触发重算,避免无效报价请求。
|
|
h.disabled ||
|
|
h.modelValue === e ||
|
|
(g(`update:modelValue`, e), g(`change`));
|
|
}
|
|
return (m, h) => {
|
|
let g = OsIcon;
|
|
return (
|
|
openBlock(),
|
|
createElementBlock(
|
|
`div`,
|
|
{
|
|
class: normalizeClass([
|
|
`config-choices`,
|
|
{
|
|
compact: c.compact && !c.images,
|
|
"image-groups": c.images,
|
|
},
|
|
]),
|
|
role: `group`,
|
|
"aria-label": c.label,
|
|
},
|
|
[
|
|
(openBlock(!0),
|
|
createElementBlock(
|
|
Fragment,
|
|
null,
|
|
renderList(
|
|
c.options,
|
|
(t) => (
|
|
openBlock(),
|
|
createElementBlock(
|
|
`button`,
|
|
{
|
|
key: t.value,
|
|
type: `button`,
|
|
class: normalizeClass([
|
|
c.images ? `image-group` : `config-choice`,
|
|
{
|
|
active: c.modelValue === t.value,
|
|
},
|
|
]),
|
|
"aria-pressed": c.modelValue === t.value,
|
|
disabled: c.disabled,
|
|
onClick: (e) => _(t.value),
|
|
},
|
|
[
|
|
c.images
|
|
? (openBlock(),
|
|
createBlock(
|
|
g,
|
|
{
|
|
key: 0,
|
|
name: t.label,
|
|
url: t.iconUrl,
|
|
icon: t.icon,
|
|
size: 36,
|
|
},
|
|
null,
|
|
8,
|
|
[`name`, `url`, `icon`],
|
|
))
|
|
: createCommentVNode(``, !0),
|
|
createElementVNode(
|
|
`span`,
|
|
null,
|
|
toDisplayString(t.label),
|
|
1,
|
|
),
|
|
t.description
|
|
? (openBlock(),
|
|
createElementBlock(
|
|
`small`,
|
|
p,
|
|
toDisplayString(t.description),
|
|
1,
|
|
))
|
|
: createCommentVNode(``, !0),
|
|
],
|
|
10,
|
|
f,
|
|
)
|
|
),
|
|
),
|
|
128,
|
|
)),
|
|
],
|
|
10,
|
|
d,
|
|
)
|
|
);
|
|
};
|
|
},
|
|
}),
|
|
{
|
|
__name: `ConfigChoiceGrid`,
|
|
},
|
|
);
|
|
export {};
|
|
export default m;
|
|
</script>
|