asp-smart-ui-plus-test
Version:
A Component Library for Vue 3
304 lines (301 loc) • 14.4 kB
JavaScript
import { createElementVNode, defineComponent, ref, onMounted, resolveComponent, openBlock, createBlock, mergeProps, withCtx, createVNode, createElementBlock, Fragment, renderList, toDisplayString, createCommentVNode, withModifiers, createTextVNode, withDirectives, vModelSelect, unref } from 'vue';
import { aspDebounce } from '../../../../../utils/utils/common.mjs';
import _export_sfc from '../../../../../_virtual/plugin-vue_export-helper.mjs';
const _hoisted_1 = {
key: 0,
class: "title selector-item"
};
const _hoisted_2 = {
key: 0,
class: "custom"
};
const _hoisted_3 = {
key: 0,
class: "text"
};
const _hoisted_4 = {
key: 1,
class: "selector"
};
const _hoisted_5 = /* @__PURE__ */ createElementVNode("i", { class: "el-icon-arrow-down" }, null, -1);
const _hoisted_6 = ["onUpdate:modelValue"];
const _hoisted_7 = ["value"];
const _hoisted_8 = {
key: 0,
class: "selector"
};
const _hoisted_9 = /* @__PURE__ */ createElementVNode("i", { class: "el-icon-arrow-down" }, null, -1);
const _hoisted_10 = ["onUpdate:modelValue"];
const _hoisted_11 = ["value"];
const _hoisted_12 = {
key: 1,
class: "text"
};
const _hoisted_13 = {
key: 2,
class: "selector"
};
const _hoisted_14 = /* @__PURE__ */ createElementVNode("i", { class: "el-icon-arrow-down" }, null, -1);
const _hoisted_15 = ["onUpdate:modelValue"];
const _hoisted_16 = ["value"];
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "radio-group-select",
props: {
selectAttributes: { type: null, required: false },
radioGroups: { type: Array, required: true }
},
emits: [
"visibleChange",
"radioChange",
"input",
"cusclearable"
],
setup(__props, { expose, emit }) {
const props = __props;
const selectRadioValue = ref("");
const initSelectRadioValue = () => {
selectRadioValue.value = "";
props.radioGroups.forEach((item, index) => {
var _a, _b, _c, _d, _e, _f;
const radioItem = props.radioGroups[index].options.find(
(subItem) => subItem.value === item.radioValue
);
if (!radioItem)
return;
let label = "";
if (radioItem.custom) {
if (!radioItem.inputValue && (radioItem.type === "first" || !radioItem.type) || !radioItem.inputLeftValue && !radioItem.inputRightValue && radioItem.type === "second") {
label = radioItem.label;
} else {
if (radioItem.type === "second") {
const tmpLeftValue = radioItem.selectLeftValue;
const LeftLabel = radioItem.inputLeftValue ? radioItem.inputLeftValue + ((_b = (_a = radioItem.selectLeftOptions) == null ? void 0 : _a.find(
(item2) => item2.value === tmpLeftValue
)) == null ? void 0 : _b.label) : "";
const rightLabel = radioItem.inputRightValue ? ((_d = (_c = radioItem.selectRightOptions) == null ? void 0 : _c.find(
(item2) => item2.value === radioItem.selectRightValue
)) == null ? void 0 : _d.label) + radioItem.inputRightValue : "";
label = LeftLabel + (radioItem.text || "") + rightLabel;
} else {
label = (radioItem.text || "") + ((_f = (_e = radioItem.selectOptions) == null ? void 0 : _e.find(
(item2) => item2.value === radioItem.selectValue
)) == null ? void 0 : _f.label) + radioItem.inputValue;
}
}
} else {
label = radioItem.label;
}
selectRadioValue.value += label + (index === props.radioGroups.length - 1 ? "" : "\uFF1B");
});
};
const visibleChange = (value) => {
emit("visibleChange", value);
};
const radioChange = (value) => {
initSelectRadioValue();
emit("radioChange", value);
emit("input", selectRadioValue.value);
};
const selectChange = (value) => {
initSelectRadioValue();
emit("radioChange", value);
emit("input", selectRadioValue.value);
};
let inputChange = (value) => {
initSelectRadioValue();
emit("radioChange", value);
emit("input", selectRadioValue.value);
};
const setValue = (value) => {
selectRadioValue.value = value;
};
const getModel = () => {
if (!props.radioGroups)
return [];
const model = [];
props.radioGroups.forEach((item) => {
const params = {
radioValue: "",
selectLeftValue: "",
selectRightValue: "",
inputLeftValue: "",
inputRightValue: "",
selectValue: "",
inputValue: ""
};
params.radioValue = item.radioValue;
const radioItem = item.options.find(
(subItem) => subItem.value === item.radioValue
);
if (radioItem && radioItem.custom) {
if (radioItem.type === "second") {
params.selectLeftValue = radioItem.selectLeftValue;
params.selectRightValue = radioItem.selectRightValue;
params.inputLeftValue = radioItem.inputLeftValue;
params.inputRightValue = radioItem.inputRightValue;
} else if (radioItem.type === "first") {
params.selectValue = radioItem.selectValue;
params.inputValue = radioItem.inputValue;
}
}
model.push(params);
});
return model;
};
expose({
setValue,
getModel
});
const cusclearable = () => {
emit("cusclearable");
};
inputChange = aspDebounce(inputChange, 500, false);
onMounted(() => {
initSelectRadioValue();
});
return (_ctx, _cache) => {
const _component_asp_option = resolveComponent("asp-option");
const _component_asp_radio = resolveComponent("asp-radio");
const _component_asp_input = resolveComponent("asp-input");
const _component_asp_radio_group = resolveComponent("asp-radio-group");
const _component_asp_select = resolveComponent("asp-select");
return openBlock(), createBlock(_component_asp_select, mergeProps({ ref: "select" }, __props.selectAttributes, {
modelValue: selectRadioValue.value,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => selectRadioValue.value = $event),
class: "asp-radio-group-select",
multiple: false,
"popper-class": "query-form-selector query-form-selector-radio",
"popper-append-to-body": false,
onClear: cusclearable,
onVisibleChange: visibleChange
}), {
default: withCtx(() => [
createVNode(_component_asp_option, {
label: "\u9690\u85CF",
class: "display-none",
style: { "display": "none" },
value: "0"
}),
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.radioGroups, (item, index) => {
return openBlock(), createBlock(_component_asp_radio_group, mergeProps(item.radioGroupAttributes, {
key: index,
modelValue: item.radioValue,
"onUpdate:modelValue": ($event) => item.radioValue = $event,
onChange: radioChange
}), {
default: withCtx(() => [
item.title ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(item.title), 1)) : createCommentVNode("v-if", true),
(openBlock(true), createElementBlock(Fragment, null, renderList(item.options, (cell, index2) => {
return openBlock(), createElementBlock("div", {
key: cell.label + index2,
class: "selector-item",
onClick: _cache[0] || (_cache[0] = withModifiers(() => {
}, ["stop"]))
}, [
createVNode(_component_asp_radio, mergeProps({
label: cell.value
}, cell.radioAttributes), {
default: withCtx(() => [
createTextVNode(toDisplayString(cell.label), 1)
]),
_: 2
}, 1040, ["label"]),
cell.custom ? (openBlock(), createElementBlock("div", _hoisted_2, [
cell.type === void 0 || cell.type === "first" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
cell.text ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(cell.text || ""), 1)) : createCommentVNode("v-if", true),
cell.selectOptions ? (openBlock(), createElementBlock("div", _hoisted_4, [
_hoisted_5,
withDirectives(createElementVNode("select", {
ref_for: true,
ref: "select",
"onUpdate:modelValue": ($event) => cell.selectValue = $event,
onChange: selectChange
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(cell.selectOptions, (item2) => {
return openBlock(), createElementBlock("option", {
key: String(item2.value),
value: item2.value
}, toDisplayString(item2.label), 9, _hoisted_7);
}), 128))
], 40, _hoisted_6), [
[vModelSelect, cell.selectValue]
])
])) : createCommentVNode("v-if", true),
createVNode(_component_asp_input, {
modelValue: cell.inputValue,
"onUpdate:modelValue": ($event) => cell.inputValue = $event,
type: cell.inputType || "number",
placeholder: "\u8BF7\u8F93\u5165",
onInput: unref(inputChange)
}, null, 8, ["modelValue", "onUpdate:modelValue", "type", "onInput"]),
createElementVNode("div", null, toDisplayString(cell.unit || ""), 1)
], 64)) : createCommentVNode("v-if", true),
cell.type === "second" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
createVNode(_component_asp_input, {
modelValue: cell.inputLeftValue,
"onUpdate:modelValue": ($event) => cell.inputLeftValue = $event,
type: cell.inputType || "number",
placeholder: "\u8BF7\u8F93\u5165",
onInput: unref(inputChange)
}, null, 8, ["modelValue", "onUpdate:modelValue", "type", "onInput"]),
cell.selectLeftOptions ? (openBlock(), createElementBlock("div", _hoisted_8, [
_hoisted_9,
withDirectives(createElementVNode("select", {
ref_for: true,
ref: "select",
"onUpdate:modelValue": ($event) => cell.selectLeftValue = $event,
onChange: selectChange
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(cell.selectLeftOptions, (item2) => {
return openBlock(), createElementBlock("option", {
key: String(item2.value),
value: item2.value
}, toDisplayString(item2.label), 9, _hoisted_11);
}), 128))
], 40, _hoisted_10), [
[vModelSelect, cell.selectLeftValue]
])
])) : createCommentVNode("v-if", true),
cell.text ? (openBlock(), createElementBlock("div", _hoisted_12, toDisplayString(cell.text || ""), 1)) : createCommentVNode("v-if", true),
cell.selectRightOptions ? (openBlock(), createElementBlock("div", _hoisted_13, [
_hoisted_14,
withDirectives(createElementVNode("select", {
ref_for: true,
ref: "select",
"onUpdate:modelValue": ($event) => cell.selectRightValue = $event,
onChange: selectChange
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(cell.selectRightOptions, (item2) => {
return openBlock(), createElementBlock("option", {
key: String(item2.value),
value: item2.value
}, toDisplayString(item2.label), 9, _hoisted_16);
}), 128))
], 40, _hoisted_15), [
[vModelSelect, cell.selectRightValue]
])
])) : createCommentVNode("v-if", true),
createVNode(_component_asp_input, {
modelValue: cell.inputRightValue,
"onUpdate:modelValue": ($event) => cell.inputRightValue = $event,
type: cell.inputType || "number",
placeholder: "\u8BF7\u8F93\u5165",
onInput: unref(inputChange)
}, null, 8, ["modelValue", "onUpdate:modelValue", "type", "onInput"]),
createElementVNode("div", null, toDisplayString(cell.unit || ""), 1)
], 64)) : createCommentVNode("v-if", true)
])) : createCommentVNode("v-if", true)
]);
}), 128))
]),
_: 2
}, 1040, ["modelValue", "onUpdate:modelValue"]);
}), 128))
]),
_: 1
}, 16, ["modelValue"]);
};
}
});
var RadioGroupSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "E:\\code\\SmartUIPlus\\asp-packages\\components\\pc\\advanced\\radio-group-select\\src\\radio-group-select.vue"]]);
export { RadioGroupSelect as default };