yuang-framework-ui-pc
Version:
yuang-framework-ui-pc Library
259 lines (258 loc) • 11.6 kB
JavaScript
;
const vue = require("vue");
const icons = require("../../icons");
const UserList = require("./user-list");
const objectUtils = require("yuang-framework-ui-common/lib/utils/objectUtils");
const iconsVue = require("@element-plus/icons-vue");
const uuidUtils = require("yuang-framework-ui-common/lib/utils/uuidUtils");
const httpConfig = require("yuang-framework-ui-common/lib/config/httpConfig");
const _hoisted_1 = { style: { "padding": "0 16px 12px 0" } };
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
...{ name: "UimsUserV2" },
__name: "user-dialog",
props: /* @__PURE__ */ vue.mergeModels({
param: {}
}, {
"modelValue": { type: Boolean },
"modelModifiers": {}
}),
emits: /* @__PURE__ */ vue.mergeModels(["change"], ["update:modelValue"]),
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const isOpenDialog = vue.useModel(__props, "modelValue");
const splitRef = vue.ref(null);
const treeRef = vue.ref(null);
const treeId = vue.ref(`tree-${uuidUtils.getShortUuid()}`);
const userListRef = vue.ref(null);
const isLoading = vue.ref(true);
const isShowTree = vue.ref(true);
const uimsOrganization = vue.ref(null);
const orgName = vue.ref("");
const selectionList = vue.ref([]);
vue.onMounted(() => {
selectionList.value = objectUtils.deepClone(props.param.initList ?? []);
});
const loadTreeNode = async (node, resolve) => {
var _a, _b;
let data = {};
if (!queryCondition) {
data = { parentIdForEqual: ((_a = node == null ? void 0 : node.data) == null ? void 0 : _a.id) || "0" };
} else {
data = objectUtils.deepClone(queryCondition);
data.parentId = ((_b = node == null ? void 0 : node.data) == null ? void 0 : _b.id) || "0";
}
if (node.level == 0) {
isLoading.value = true;
}
const res = await httpConfig.http.post(`/uims-api/admin/uims-organization/selectPage`, data);
if (node.level == 0) {
isLoading.value = false;
}
let listData = res.data.data.records;
listData.forEach((organization) => {
organization.isLeaf = !organization.isHasChildren;
});
vue.nextTick(() => {
if (node.level == 0) {
handleNodeClick(listData[0] || { id: "0" });
}
if (listData.length == 1 && listData[0].isHasChildren) {
vue.nextTick(() => {
const nodeList = document.querySelectorAll(`#${treeId.value}.el-tree [data-key='${listData[0].id}'] .el-tree-node__expand-icon`);
for (let i = 0; i < nodeList.length; i++) {
if (!nodeList[i].classList.contains("expanded")) {
nodeList[i] && nodeList[i].click();
} else {
if (queryCondition) {
queryCondition.parentId = listData[0].id || "0";
queryCondition.levelNum = listData[0].levelNum + 1;
httpConfig.http.post(`/uims-api/admin/uims-organization/selectPage`, queryCondition).then((res2) => {
var _a2;
(_a2 = treeRef == null ? void 0 : treeRef.value) == null ? void 0 : _a2.updateKeyChildren(queryCondition == null ? void 0 : queryCondition.parentId, res2.data.data.records);
});
}
}
}
});
}
});
return resolve(listData);
};
const handleNodeClick = (row) => {
var _a, _b;
if (row && row.id) {
uimsOrganization.value = row;
(_b = (_a = treeRef.value) == null ? void 0 : _a.setCurrentKey) == null ? void 0 : _b.call(_a, row.id);
} else {
uimsOrganization.value = null;
}
};
let queryCondition = null;
const initQueryPage = async () => {
queryCondition = orgName.value ? { queryForMode: "treePart", parentIdForEqual: "0", nameForLike: orgName.value } : null;
reloadTree();
};
const reloadTree = () => {
isShowTree.value = false;
vue.nextTick(() => {
isShowTree.value = true;
});
};
const handleCancel = () => {
isOpenDialog.value = false;
};
const handleSure = () => {
handleCancel();
emit("change", selectionList.value);
};
vue.watch(
() => selectionList.value,
() => {
console.log("selectionList.value", selectionList.value);
},
{ deep: true }
);
return (_ctx, _cache) => {
const _component_el_input = vue.resolveComponent("el-input");
const _component_el_icon = vue.resolveComponent("el-icon");
const _component_el_tree = vue.resolveComponent("el-tree");
const _component_ele_loading = vue.resolveComponent("ele-loading");
const _component_ele_split_panel = vue.resolveComponent("ele-split-panel");
const _component_ele_card = vue.resolveComponent("ele-card");
const _component_ele_page = vue.resolveComponent("ele-page");
const _component_el_button = vue.resolveComponent("el-button");
const _component_ele_dialog = vue.resolveComponent("ele-dialog");
return vue.openBlock(), vue.createBlock(_component_ele_dialog, {
form: "",
width: "85%",
modelValue: isOpenDialog.value,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isOpenDialog.value = $event),
title: "选择用户",
class: "yu-big-dialog"
}, {
footer: vue.withCtx(() => [
vue.createVNode(_component_el_button, {
icon: vue.unref(iconsVue.Close),
onClick: handleCancel
}, {
default: vue.withCtx(() => _cache[3] || (_cache[3] = [
vue.createTextVNode("取消")
])),
_: 1,
__: [3]
}, 8, ["icon"]),
vue.createVNode(_component_el_button, {
type: "primary",
icon: vue.unref(iconsVue.Check),
loading: isLoading.value,
onClick: handleSure
}, {
default: vue.withCtx(() => _cache[4] || (_cache[4] = [
vue.createTextVNode(" 确认 ")
])),
_: 1,
__: [4]
}, 8, ["icon", "loading"])
]),
default: vue.withCtx(() => [
vue.createVNode(_component_ele_page, {
"flex-table": "",
"multi-card": false,
"hide-footer": "",
style: { "min-height": "720px" }
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_ele_card, {
"flex-table": "",
"body-style": { padding: "0 0 0 16px", overflow: "hidden" }
}, {
default: vue.withCtx(() => [
vue.createVNode(_component_ele_split_panel, {
ref_key: "splitRef",
ref: splitRef,
"flex-table": "",
size: "256px",
"allow-collapse": "",
"custom-style": { borderWidth: "0 1px 0 0", padding: "16px 0" },
"body-style": { padding: "16px 16px 0 0", overflow: "hidden" },
style: { height: "100%", overflow: "visible" }
}, {
body: vue.withCtx(() => [
uimsOrganization.value && uimsOrganization.value.id ? (vue.openBlock(), vue.createBlock(UserList, {
key: 0,
ref_key: "userListRef",
ref: userListRef,
param: props.param,
uimsOrganization: uimsOrganization.value,
selectionList: selectionList.value,
"onUpdate:selectionList": _cache[1] || (_cache[1] = ($event) => selectionList.value = $event)
}, null, 8, ["param", "uimsOrganization", "selectionList"])) : vue.createCommentVNode("", true)
]),
default: vue.withCtx(() => [
vue.createElementVNode("div", _hoisted_1, [
vue.createVNode(_component_el_input, {
modelValue: orgName.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => orgName.value = $event),
placeholder: "输入机构名称后按回车搜索",
"prefix-icon": vue.unref(icons.SearchOutlined),
clearable: "",
maxlength: 20,
onKeyup: vue.withKeys(initQueryPage, ["enter"]),
onClear: initQueryPage
}, null, 8, ["modelValue", "prefix-icon"])
]),
vue.createVNode(_component_ele_loading, {
loading: isLoading.value,
style: { flex: 1, paddingRight: "16px", overflow: "auto" }
}, {
default: vue.withCtx(() => [
isShowTree.value ? (vue.openBlock(), vue.createBlock(_component_el_tree, {
key: 0,
ref_key: "treeRef",
ref: treeRef,
id: treeId.value,
"node-key": "id",
lazy: "",
load: loadTreeNode,
"highlight-current": "",
props: { label: "name", children: "children", isLeaf: "isLeaf" },
"expand-on-click-node": false,
style: { "--ele-tree-item-height": "34px" },
onNodeClick: handleNodeClick
}, {
default: vue.withCtx(({ data }) => [
vue.createElementVNode("span", null, [
vue.createVNode(_component_el_icon, {
size: 15,
style: { "margin-right": "8px", "vertical-align": "-2px" }
}, {
default: vue.withCtx(() => [
data.parentId == "0" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(icons.ClusterOutlined)), { key: 0 })) : data.type == "org" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(icons.OrganizationOrg)), { key: 1 })) : data.type == "unit" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(icons.OrganizationUnit)), { key: 2 })) : data.type == "dept" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(icons.OrganizationDept)), { key: 3 })) : vue.createCommentVNode("", true)
]),
_: 2
}, 1024),
vue.createElementVNode("span", null, vue.toDisplayString(data.name), 1)
])
]),
_: 1
}, 8, ["id"])) : vue.createCommentVNode("", true)
]),
_: 1
}, 8, ["loading"])
]),
_: 1
}, 512)
]),
_: 1
})
]),
_: 1
})
]),
_: 1
}, 8, ["modelValue"]);
};
}
});
module.exports = _sfc_main;