237 lines
8.3 KiB
Vue
237 lines
8.3 KiB
Vue
<script>
|
||
/** CPU/内存等资源档位选择器：离散资源显示卡片，区间资源显示范围选择和数值输入。 */
|
||
import "~/assets/styles/OsIcon.CAi4Iz2S.css";
|
||
import "~/assets/styles/ConfigResourceOption.Dj4VopnA.css";
|
||
import { toDisplayString } from "vue";
|
||
import { createBlock } from "vue";
|
||
import { createCommentVNode } from "vue";
|
||
import { computed } from "vue";
|
||
import { createElementBlock } from "vue";
|
||
import { Fragment } from "vue";
|
||
import { createTextVNode } from "vue";
|
||
import { unref } from "vue";
|
||
import { defineComponent } from "vue";
|
||
import { createVNode } from "vue";
|
||
import { openBlock } from "vue";
|
||
import { t as _plugin_vue_export_helper_t } from "~/lib/_plugin-vue_export-helper.js";
|
||
import select from "primevue/select";
|
||
import inputnumber from "primevue/inputnumber";
|
||
import ConfigChoiceGrid from "~/components/config/ConfigChoiceGrid.vue";
|
||
var h = {
|
||
key: 1,
|
||
class: `resource-range`,
|
||
},
|
||
g = {
|
||
key: 1,
|
||
class: `hint`,
|
||
},
|
||
_ = Object.assign(
|
||
_plugin_vue_export_helper_t(
|
||
defineComponent({
|
||
__name: `ConfigResourceOption`,
|
||
props: {
|
||
modelValue: {},
|
||
options: {},
|
||
label: {},
|
||
unit: {},
|
||
disabled: {
|
||
type: Boolean,
|
||
},
|
||
},
|
||
emits: [`update:modelValue`, `change`],
|
||
setup(c, { emit: d }) {
|
||
let _ = c,
|
||
v = d,
|
||
y = computed(() =>
|
||
_.options
|
||
.map((e, t) => {
|
||
let n = e.type === `step` || e.type === `total`,
|
||
r = Number(n ? (e.min_value ?? e.value) : e.value),
|
||
i = Number(
|
||
n ? (e.max_value ?? e.min_value ?? e.value) : e.value,
|
||
);
|
||
return {
|
||
value: t,
|
||
min: r,
|
||
max: i,
|
||
step: Number(e.step) > 0 ? Number(e.step) : 1,
|
||
label: e.desc || `${r}${i > r ? `–${i}` : ``} ${_.unit}`,
|
||
};
|
||
})
|
||
.filter(
|
||
(e) =>
|
||
Number.isFinite(e.min) &&
|
||
Number.isFinite(e.max) &&
|
||
e.max >= e.min,
|
||
),
|
||
),
|
||
b = computed(() => y.value.some((e) => e.max > e.min)),
|
||
x = computed(
|
||
() =>
|
||
y.value.find((e) => {
|
||
let t =
|
||
_.modelValue === null ||
|
||
_.modelValue === void 0 ||
|
||
_.modelValue === ``
|
||
? NaN
|
||
: Number(_.modelValue);
|
||
return (
|
||
t >= e.min &&
|
||
t <= e.max &&
|
||
Math.abs(
|
||
(t - e.min) / e.step - Math.round((t - e.min) / e.step),
|
||
) < 1e-7
|
||
);
|
||
}) ?? y.value[0],
|
||
),
|
||
S = computed(() =>
|
||
_.modelValue === null ||
|
||
_.modelValue === void 0 ||
|
||
_.modelValue === ``
|
||
? null
|
||
: Number(_.modelValue),
|
||
);
|
||
function C(e) {
|
||
// 在当前区间按步长吸附，并将最大值收敛到实际可达档位后再通知父级。
|
||
if (_.disabled || e === null || !Number.isFinite(e) || !x.value)
|
||
return;
|
||
let { min: t, max: n, step: r } = x.value,
|
||
i = t + Math.floor((n - t) / r + 1e-7) * r,
|
||
a = Number(
|
||
Math.min(
|
||
i,
|
||
Math.max(t, t + Math.round((e - t) / r) * r),
|
||
).toFixed(8),
|
||
);
|
||
Number(_.modelValue) !== a &&
|
||
(v(`update:modelValue`, a), v(`change`));
|
||
}
|
||
function w(e) {
|
||
// 选择新的范围时使用该范围最小值；当前值仍属于同一合法档位时不重复发事件。
|
||
if (_.disabled) return;
|
||
let t = y.value.find((t) => t.value === e);
|
||
if (!t) return;
|
||
let n = S.value;
|
||
(x.value === t &&
|
||
n !== null &&
|
||
n >= t.min &&
|
||
n <= t.max &&
|
||
Math.abs(
|
||
(n - t.min) / t.step - Math.round((n - t.min) / t.step),
|
||
) < 1e-7) ||
|
||
(v(`update:modelValue`, t.min), v(`change`));
|
||
}
|
||
return (r, d) => {
|
||
let _ = ConfigChoiceGrid,
|
||
v = select,
|
||
T = inputnumber;
|
||
return unref(b)
|
||
? (openBlock(),
|
||
createElementBlock(`div`, h, [
|
||
unref(y).length > 1
|
||
? (openBlock(),
|
||
createBlock(
|
||
v,
|
||
{
|
||
key: 0,
|
||
"aria-label": `${c.label}范围`,
|
||
disabled: c.disabled,
|
||
"model-value": unref(x)?.value,
|
||
options: unref(y),
|
||
"option-label": `label`,
|
||
"option-value": `value`,
|
||
"onUpdate:modelValue": w,
|
||
},
|
||
null,
|
||
8,
|
||
[`aria-label`, `disabled`, `model-value`, `options`],
|
||
))
|
||
: createCommentVNode(``, !0),
|
||
createVNode(
|
||
T,
|
||
{
|
||
"aria-label": c.label,
|
||
disabled: c.disabled || unref(x)?.min === unref(x)?.max,
|
||
"model-value": unref(S),
|
||
min: unref(x)?.min,
|
||
max: unref(x)?.max,
|
||
step: unref(x)?.step,
|
||
suffix: ` ${c.unit}`,
|
||
"show-buttons": ``,
|
||
"button-layout": `horizontal`,
|
||
"onUpdate:modelValue": C,
|
||
},
|
||
null,
|
||
8,
|
||
[
|
||
`aria-label`,
|
||
`disabled`,
|
||
`model-value`,
|
||
`min`,
|
||
`max`,
|
||
`step`,
|
||
`suffix`,
|
||
],
|
||
),
|
||
unref(x)
|
||
? (openBlock(),
|
||
createElementBlock(`small`, g, [
|
||
createTextVNode(
|
||
toDisplayString(unref(x).min) +
|
||
`–` +
|
||
toDisplayString(unref(x).max) +
|
||
` ` +
|
||
toDisplayString(c.unit),
|
||
1,
|
||
),
|
||
unref(x).max > unref(x).min
|
||
? (openBlock(),
|
||
createElementBlock(
|
||
Fragment,
|
||
{
|
||
key: 0,
|
||
},
|
||
[
|
||
createTextVNode(
|
||
`，步长 ` +
|
||
toDisplayString(unref(x).step) +
|
||
` ` +
|
||
toDisplayString(c.unit),
|
||
1,
|
||
),
|
||
],
|
||
64,
|
||
))
|
||
: createCommentVNode(``, !0),
|
||
]))
|
||
: createCommentVNode(``, !0),
|
||
]))
|
||
: (openBlock(),
|
||
createBlock(
|
||
_,
|
||
{
|
||
key: 0,
|
||
label: c.label,
|
||
disabled: c.disabled,
|
||
"model-value": unref(x)?.value,
|
||
options: unref(y),
|
||
compact: ``,
|
||
"onUpdate:modelValue": w,
|
||
},
|
||
null,
|
||
8,
|
||
[`label`, `disabled`, `model-value`, `options`],
|
||
));
|
||
};
|
||
},
|
||
}),
|
||
[[`__scopeId`, `data-v-5a04c843`]],
|
||
),
|
||
{
|
||
__name: `ConfigResourceOption`,
|
||
},
|
||
);
|
||
export {};
|
||
export default _;
|
||
</script>
|