@fmdevui/fm-dev
Version:
Page level components developed based on Element Plus.
242 lines (237 loc) • 8.02 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var svg = require('@element-plus/icons-vue');
const _hoisted_1 = { class: "inside_box" };
const _hoisted_2 = { class: "inside_box_title" };
const _hoisted_3 = { class: "check-box" };
const _hoisted_4 = { class: "more_dropdown_icon" };
const _hoisted_5 = { class: "out_box" };
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
...{
name: "MoreChoose"
},
__name: "moreChoose",
props: {
// 以下拉方式展示更多条件---数据源
moreCheckList: {
type: Array,
default: () => []
},
popoverAttrsBind: {
type: Object,
default: () => ({})
}
},
emits: ["getCheckList"],
setup(__props, { emit: __emit }) {
const props = __props;
const checkList = vue.ref([]);
const isCheckList = vue.ref([]);
const allcheckList = vue.ref(props.moreCheckList);
const emit = __emit;
vue.watch(
() => props.moreCheckList,
(list) => {
allcheckList.value = list;
},
{ deep: true }
);
vue.watch(
() => checkList,
(nval, oval) => {
let list = [];
oval.value.forEach((ele) => {
if (!nval.value.some((val) => val == ele)) {
list.push(ele);
}
});
isCheckList.value.forEach((ele, j) => {
if (list.filter((val) => val == ele.label)[0]) {
delete isCheckList.value[j];
}
});
},
{ deep: true }
);
const handlecheckAll = () => {
const allList = JSON.parse(JSON.stringify(allcheckList.value));
checkList.value = allList.map((item) => item.label);
isCheckList.value = allList;
const checkObj = analysisObj(isCheckList.value);
emit("getCheckList", checkObj);
};
const handleReverseCheck = () => {
const deepCheckList = JSON.parse(JSON.stringify(checkList.value));
checkList.value = [];
isCheckList.value = [];
allcheckList.value.forEach((ele) => {
if (!deepCheckList.filter((item1) => item1 == ele.label)[0]) {
checkList.value.push(ele.label);
isCheckList.value.push(ele);
}
});
const checkObj = analysisObj(isCheckList.value);
emit("getCheckList", checkObj);
};
const handleReset = () => {
checkList.value = [];
isCheckList.value = [];
emit("getCheckList", {});
};
const getcheck = (val) => {
isCheckList.value = [];
allcheckList.value.forEach((ele, j) => {
if (val.filter((item1) => item1 == ele.label)[0]) {
isCheckList.value.push(ele);
}
});
const checkObj = analysisObj(isCheckList.value);
emit("getCheckList", checkObj);
};
const analysisObj = (val) => {
return val.reduce((obj, item) => {
obj[item.prop] = {
label: item?.label,
comp: item.comp,
bind: item?.bind,
list: item?.list,
eventHandle: item?.eventHandle,
changeEvent: item?.changeEvent,
listTypeInfo: item?.listTypeInfo,
arrLabel: item?.arrLabel,
arrKey: item?.arrKey,
slotName: item?.slotName,
span: item?.span,
type: item?.type,
isSelfCom: item && item.isSelfCom || false,
defaultVal: item?.defaultVal,
placeholder: item?.placeholder,
event: item?.event
};
return obj;
}, {});
};
return (_ctx, _cache) => {
const _component_el_button = vue.resolveComponent("el-button");
const _component_el_checkbox = vue.resolveComponent("el-checkbox");
const _component_el_checkbox_group = vue.resolveComponent("el-checkbox-group");
const _component_el_icon = vue.resolveComponent("el-icon");
const _component_el_popover = vue.resolveComponent("el-popover");
return allcheckList.value.length > 0 ? (vue.openBlock(), vue.createBlock(_component_el_popover, {
key: 0,
"popper-class": "fm_query_condition_more",
bind: __props.popoverAttrsBind,
trigger: "click",
width: "auto",
ref: "popover"
}, {
reference: vue.withCtx(() => [
vue.createElementVNode("div", _hoisted_4, [
vue.createElementVNode(
"span",
_hoisted_5,
vue.toDisplayString(__props.popoverAttrsBind.showTxt || "\u66F4\u591A"),
1
/* TEXT */
),
vue.createVNode(_component_el_icon, null, {
default: vue.withCtx(() => [
vue.createVNode(vue.unref(svg.ArrowDown))
]),
_: 1
/* STABLE */
})
])
]),
default: vue.withCtx(() => [
vue.createElementVNode("div", _hoisted_1, [
vue.createElementVNode("div", _hoisted_2, [
vue.createElementVNode(
"div",
null,
vue.toDisplayString(__props.popoverAttrsBind.title || "\u6240\u6709\u6761\u4EF6"),
1
/* TEXT */
),
vue.createElementVNode("div", _hoisted_3, [
vue.createVNode(_component_el_button, {
size: "small",
link: "",
onClick: handlecheckAll
}, {
default: vue.withCtx(() => [
vue.createTextVNode(
vue.toDisplayString(__props.popoverAttrsBind.allTxt || "\u5168\u9009"),
1
/* TEXT */
)
]),
_: 1
/* STABLE */
}),
vue.createVNode(_component_el_button, {
size: "small",
link: "",
onClick: handleReset
}, {
default: vue.withCtx(() => [
vue.createTextVNode(
vue.toDisplayString(__props.popoverAttrsBind.clearTxt || "\u6E05\u7A7A"),
1
/* TEXT */
)
]),
_: 1
/* STABLE */
}),
vue.createVNode(_component_el_button, {
size: "small",
link: "",
onClick: handleReverseCheck
}, {
default: vue.withCtx(() => [
vue.createTextVNode(
vue.toDisplayString(__props.popoverAttrsBind.reverseTxt || "\u53CD\u9009"),
1
/* TEXT */
)
]),
_: 1
/* STABLE */
})
])
]),
vue.createVNode(_component_el_checkbox_group, {
modelValue: checkList.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => checkList.value = $event),
class: "inside_box_main",
onChange: getcheck
}, {
default: vue.withCtx(() => [
(vue.openBlock(true), vue.createElementBlock(
vue.Fragment,
null,
vue.renderList(allcheckList.value, (item, index) => {
return vue.openBlock(), vue.createBlock(_component_el_checkbox, {
key: index,
label: item.label,
value: item.label
}, null, 8, ["label", "value"]);
}),
128
/* KEYED_FRAGMENT */
))
]),
_: 1
/* STABLE */
}, 8, ["modelValue"])
])
]),
_: 1
/* STABLE */
}, 8, ["bind"])) : vue.createCommentVNode("v-if", true);
};
}
});
exports.default = _sfc_main;