@jname/vue-mobile-components
Version:
基于 Vue 3 + Vant 4 的移动端组件库
1,084 lines (1,083 loc) • 39 kB
JavaScript
import { defineComponent, computed, createElementBlock, openBlock, createElementVNode, createBlock, createCommentVNode, toDisplayString, Fragment, renderList, unref, renderSlot, normalizeClass, createVNode, createTextVNode, useSlots, ref, watch, mergeProps, createSlots, withCtx, normalizeProps, guardReactiveProps, reactive, nextTick, normalizeStyle, TransitionGroup, onMounted, onUpdated } from "vue";
import { Image, Icon, Uploader, showToast, showImagePreview, Popup, Button, Search, List, Checkbox, PullRefresh } from "vant";
const _hoisted_1$4 = { class: "jname-content-card" };
const _hoisted_2$3 = { class: "jname-content-card__content" };
const _hoisted_3$3 = { class: "jname-content-card__title" };
const _hoisted_4$2 = {
key: 0,
class: "jname-content-card__description"
};
const _hoisted_5$2 = {
key: 1,
class: "jname-content-card__images"
};
const _hoisted_6$1 = {
key: 2,
class: "jname-content-card__meta"
};
const _hoisted_7$1 = {
key: 1,
class: "jname-content-card__time"
};
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
...{
name: "JContentCard"
},
__name: "index",
props: {
title: {},
desc: {},
images: {},
meta: {},
maxImages: { default: 3 }
},
setup(__props) {
const props = __props;
const displayMode = computed(() => {
var _a;
if (!((_a = props.images) == null ? void 0 : _a.length)) return "text";
if (props.images.length === 1) return "single";
return "multi";
});
return (_ctx, _cache) => {
var _a, _b;
return openBlock(), createElementBlock("div", _hoisted_1$4, [
createElementVNode("div", _hoisted_2$3, [
createElementVNode("div", _hoisted_3$3, toDisplayString(_ctx.title), 1),
_ctx.desc ? (openBlock(), createElementBlock("div", _hoisted_4$2, toDisplayString(_ctx.desc), 1)) : createCommentVNode("", true),
displayMode.value === "multi" ? (openBlock(), createElementBlock("div", _hoisted_5$2, [
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.images.slice(0, _ctx.maxImages), (image, index2) => {
return openBlock(), createBlock(unref(Image), {
key: index2,
src: image,
fit: "cover",
"lazy-load": "",
radius: "10",
class: "jname-content-card__image"
}, null, 8, ["src"]);
}), 128))
])) : createCommentVNode("", true),
_ctx.$slots.meta || ((_a = _ctx.meta) == null ? void 0 : _a.tagText) || ((_b = _ctx.meta) == null ? void 0 : _b.timeText) ? (openBlock(), createElementBlock("div", _hoisted_6$1, [
renderSlot(_ctx.$slots, "meta", {}, () => {
var _a2, _b2, _c;
return [
((_a2 = _ctx.meta) == null ? void 0 : _a2.tagText) ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(["jname-content-card__tag", `jname-content-card__tag--${((_b2 = _ctx.meta) == null ? void 0 : _b2.tagStatus) || "info"}`])
}, toDisplayString(_ctx.meta.tagText), 3)) : createCommentVNode("", true),
((_c = _ctx.meta) == null ? void 0 : _c.timeText) ? (openBlock(), createElementBlock("div", _hoisted_7$1, [
createVNode(unref(Icon), {
name: "clock-o",
size: "16"
}),
createTextVNode(" " + toDisplayString(_ctx.meta.timeText), 1)
])) : createCommentVNode("", true)
];
}, true)
])) : createCommentVNode("", true)
]),
displayMode.value === "single" ? (openBlock(), createBlock(unref(Image), {
key: 0,
src: _ctx.images[0],
fit: "cover",
"lazy-load": "",
radius: "10",
class: "jname-content-card__image-single"
}, null, 8, ["src"])) : createCommentVNode("", true)
]);
};
}
});
const _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
const ContentCard = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-1b240819"]]);
const _hoisted_1$3 = {
key: 0,
class: "jname-upload-error"
};
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
...{
name: "JImgUploader"
},
__name: "index",
props: {
modelValue: {},
multiple: { type: Boolean, default: false },
maxCount: { default: Infinity },
maxSize: { default: Infinity },
formats: { default: () => ["jpg", "jpeg", "png", "gif", "webp"] },
deletable: { type: Boolean, default: true },
disabled: { type: Boolean, default: false },
readonly: { type: Boolean, default: false },
preview: { type: Boolean, default: true },
uploadText: { default: "上传图片" },
previewOptions: { default: () => ({}) },
formatErrorMsg: { default: "" },
compression: { default: () => ({ enabled: false }) }
},
emits: [
"update:modelValue",
"oversize",
"delete",
"error",
"success",
"preview"
],
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = useSlots();
const computedSlots = computed(() => {
const slotNames = Object.keys(slots);
return slotNames.filter((name) => name !== "preview-cover");
});
const innerFileList = ref([]);
const errorMsg = ref("");
const formattedFormatErrorMsg = computed(() => {
if (props.formatErrorMsg) return props.formatErrorMsg;
return `文件格式不正确,请上传${props.formats.join("/")}格式的图片`;
});
const convertToFileList = (value) => {
return value.map((item) => {
if (typeof item === "string") {
return { url: item };
}
return item;
});
};
watch(
() => props.modelValue,
(newVal) => {
innerFileList.value = convertToFileList(newVal);
},
{ immediate: true, deep: true }
);
watch(
innerFileList,
(newVal) => {
const currentModelValue = convertToFileList(props.modelValue);
if (JSON.stringify(newVal) !== JSON.stringify(currentModelValue)) {
emit("update:modelValue", newVal);
}
},
{ deep: true }
);
const compressImage = async (file) => {
try {
const { default: Compressor } = await import("compressorjs");
const defaultOptions = {
quality: 0.8,
maxWidth: 1920,
maxHeight: 1920,
convertSize: 1e6
// 1MB以上才转换格式
};
const options = { ...defaultOptions, ...props.compression };
return new Promise((resolve) => {
new Compressor(file, {
...options,
success: (compressedFile) => {
resolve(compressedFile);
},
error: (err) => {
console.warn("图片压缩失败,使用原图:", err);
resolve(file);
}
});
});
} catch (error) {
console.error("压缩功能需要安装 compressorjs 依赖包。请运行: npm install compressorjs 或 pnpm add compressorjs");
console.warn("compressorjs 未找到,使用原图:", error);
return file;
}
};
const handleBeforeRead = async (file) => {
var _a, _b;
errorMsg.value = "";
const files = Array.isArray(file) ? file : [file];
for (const file2 of files) {
const extension = ((_a = file2.name.split(".").pop()) == null ? void 0 : _a.toLowerCase()) || "";
if (!props.formats.includes(extension)) {
errorMsg.value = formattedFormatErrorMsg.value;
showToast(errorMsg.value);
emit("error", { file: file2, message: errorMsg.value });
return;
}
}
if ((_b = props.compression) == null ? void 0 : _b.enabled) {
const compressedFiles = await Promise.all(files.map(compressImage));
emit("success", compressedFiles.length === 1 ? compressedFiles[0] : compressedFiles);
return compressedFiles.length === 1 ? compressedFiles[0] : compressedFiles;
}
emit("success", files.length === 1 ? files[0] : files);
return files.length === 1 ? files[0] : files;
};
const handleDelete = (file, detail) => {
emit("delete", file, detail);
};
const handlePreview = (file, detail) => {
if (!props.preview) return;
const images = innerFileList.value.map((item) => item.url || "");
const options = {
images,
startPosition: detail.index,
showIndex: true,
closeable: true,
showIndicators: images.length > 1,
// 允许图片旋转
swipeDuration: 300,
...props.previewOptions
};
showImagePreview(options);
emit("preview", file, detail);
};
__expose({
// 清空上传列表
clear: () => {
innerFileList.value = [];
},
// 手动触发图片预览
preview: (index2 = 0) => {
if (innerFileList.value[index2]) {
handlePreview(innerFileList.value[index2], { index: index2 });
}
}
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
createVNode(unref(Uploader), mergeProps({
modelValue: innerFileList.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => innerFileList.value = $event)
}, _ctx.$attrs, {
"max-count": _ctx.maxCount,
"max-size": _ctx.maxSize,
multiple: _ctx.multiple,
disabled: _ctx.disabled,
readonly: _ctx.readonly,
deletable: _ctx.deletable,
"before-read": handleBeforeRead,
onOversize: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("oversize", $event)),
onDelete: handleDelete,
onClickPreview: handlePreview
}), createSlots({
"preview-cover": withCtx(({ file, index: index2 }) => [
renderSlot(_ctx.$slots, "preview-cover", {
file,
index: index2
}, void 0, true)
]),
_: 2
}, [
renderList(computedSlots.value, (name) => {
return {
name,
fn: withCtx((slotData) => [
renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(slotData || {})), void 0, true)
])
};
})
]), 1040, ["modelValue", "max-count", "max-size", "multiple", "disabled", "readonly", "deletable"]),
errorMsg.value ? (openBlock(), createElementBlock("div", _hoisted_1$3, toDisplayString(errorMsg.value), 1)) : createCommentVNode("", true)
], 64);
};
}
});
const ImgUploader = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-49c439e7"]]);
const useRefreshList = ({
api,
extraParams = ref({})
}) => {
const dataSource = ref([]);
const state = reactive({
finished: false,
isLoading: false,
loading: false,
error: false,
pageable: {
pageNum: 1,
pageSize: 20,
totalRow: 0
},
// 总参数(包含分页和查询参数)
totalParam: {},
searchParam: {}
});
const pageParam = computed(() => ({
pageNum: state.pageable.pageNum,
pageSize: state.pageable.pageSize
}));
const getList = async () => {
try {
state.totalParam = {};
Object.assign(state.totalParam, unref(extraParams), state.searchParam, pageParam.value);
const { data } = await api(state.totalParam);
const { records, total } = data;
state.pageable.totalRow = total;
const currentPageNum = state.pageable.pageNum;
const noMoreData = records.length < state.pageable.pageSize || currentPageNum * state.pageable.pageSize >= total;
if (currentPageNum === 1) {
dataSource.value = records;
} else {
dataSource.value = [...dataSource.value, ...records];
}
state.finished = noMoreData;
state.pageable.pageNum++;
state.error = false;
} catch (err) {
console.error("API Error:", err);
state.finished = true;
state.error = true;
} finally {
state.loading = false;
}
};
const onLoad = async () => {
if (state.isLoading) {
dataSource.value = [];
state.isLoading = false;
}
try {
await getList();
} finally {
state.loading = false;
}
};
const onRefresh = async () => {
state.pageable.pageNum = 1;
dataSource.value = [];
state.finished = false;
state.error = false;
state.loading = true;
onLoad();
};
const onSearch = (searchParams = {}) => {
state.searchParam = searchParams;
state.pageable.pageNum = 1;
dataSource.value = [];
state.finished = false;
state.error = false;
state.loading = true;
onLoad();
};
const onReset = () => {
onSearch({});
};
return {
dataSource,
state,
onLoad,
onRefresh,
onSearch,
onReset
};
};
const useOrganizationActions = ({
multiple = true,
maxSelected = 10,
organizationCache,
searchState,
onRefreshList
}) => {
const selectedPersonnel = ref([]);
const selectedCount = computed(() => selectedPersonnel.value.length);
const handlePersonSelection = (person) => {
if (isPersonDisabled(person)) return;
const isAlreadySelected = selectedPersonnel.value.some((selected) => selected.id === person.id);
if (isAlreadySelected) {
selectedPersonnel.value = selectedPersonnel.value.filter((selected) => selected.id !== person.id);
} else {
if (multiple) {
if (selectedPersonnel.value.length >= maxSelected) {
showToast(`最多选择${maxSelected}人`);
return;
}
selectedPersonnel.value.push({ ...person, checked: true });
} else {
selectedPersonnel.value = [{ ...person, checked: true }];
}
}
};
const isPersonDisabled = (person) => {
if (!multiple && selectedPersonnel.value.length > 0) {
return !selectedPersonnel.value.some((item) => item.id === person.id);
}
if (selectedPersonnel.value.length >= maxSelected) {
return !selectedPersonnel.value.some((item) => item.id === person.id);
}
return false;
};
const executeSearch = (keyword) => {
if (keyword !== void 0) {
searchState.value.xm = keyword;
}
if (!searchState.value.xm) {
organizationCache.value.clear();
}
onRefreshList == null ? void 0 : onRefreshList();
};
const clearAllSelections = () => {
selectedPersonnel.value = [];
};
const syncListSelectionState = (dataList) => {
if (!dataList) return;
dataList.forEach((item) => {
if (!item.isParent) {
item.checked = selectedPersonnel.value.some((selected) => selected.id === item.id);
}
});
};
return {
selectedCount,
selectedPersonnel,
handlePersonSelection,
executeSearch,
clearAllSelections,
isPersonDisabled,
syncListSelectionState
};
};
const createOrganizationApi = (config) => {
const { baseUrl, getToken } = config;
const fetchData = async (url, params) => {
let fullUrl = `${baseUrl}${url}`;
if (params) {
const searchParams = new URLSearchParams();
Object.keys(params).forEach((key) => {
const value = params[key];
if (value !== null && value !== void 0 && value !== "") {
searchParams.append(key, String(value));
}
});
const queryString = searchParams.toString();
if (queryString) {
fullUrl += `?${queryString}`;
}
}
const headers = {
"Content-Type": "application/json"
};
try {
const token = getToken();
if (token) {
headers.Authorization = `Bearer ${token}`;
}
} catch (error) {
console.warn("获取token失败:", error);
}
try {
const response = await fetch(fullUrl, {
method: "GET",
headers
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return { data: data.data || data };
} catch (error) {
console.error("请求失败:", error);
throw error;
}
};
return {
// 获取组织架构接口
getOrganizations: () => {
return fetchData("/sfzt/select/dept/topNodes");
},
// 获取人员列表接口
getPersonnelList: (params) => {
return fetchData("/sfzt/select/dept/user/list", params);
},
// 获取组织架构子节点接口
getOrganizationsSubNodes: (params) => {
return fetchData("/sfzt/select/dept/subNodes", params);
},
// 测试 - 获取区域树
getAreaTree: () => {
return fetchData("/school/area/tree");
}
};
};
const useOrganizationApi = ({
apiConfig
}) => {
const api = createOrganizationApi(apiConfig);
const organizationCatch = ref(/* @__PURE__ */ new Map());
const getOrganizationList = async (params) => {
if (params.xm) {
return await getPersonnelBySearch(params);
}
if (!params.dwh) {
return await getTopLevelOrganizations();
}
return await getSubOrganizationsAndPersonnel(params);
};
const getTopLevelOrganizations = async () => {
const { data } = await api.getOrganizations();
return {
data: {
records: data,
total: data.length
}
};
};
const getPersonnelBySearch = async (searchParams) => {
const personRecords = await api.getPersonnelList(searchParams);
return {
data: {
records: personRecords.data.list || [],
total: personRecords.data.total
}
};
};
const getSubOrganizationsAndPersonnel = async (params) => {
let orgList = [];
if (!organizationCatch.value.has(params.dwh)) {
const { data } = await api.getOrganizationsSubNodes(params);
orgList = data || [];
organizationCatch.value.set(params.dwh, true);
}
const { data: personRecords } = await api.getPersonnelList(params);
const personnelList = personRecords.list || [];
return {
data: {
records: [...orgList, ...personnelList],
total: orgList.length + personRecords.total
}
};
};
return {
organizationCatch,
getOrganizationList
};
};
const useOrganizationState = () => {
const searchState = ref({
xm: "",
dwh: ""
});
const breadcrumbRef = ref();
const breadcrumbs = ref([
{ name: "全部" }
]);
const addBreadcrumb = (item) => {
breadcrumbs.value.push(item);
searchState.value.dwh = item.dwh || "";
};
const navigateToBreadcrumb = (index2) => {
if (index2 >= breadcrumbs.value.length) return;
breadcrumbs.value = breadcrumbs.value.slice(0, index2 + 1);
const current = breadcrumbs.value[index2];
searchState.value.dwh = current.dwh || "";
};
const scrollBreadcrumbToEnd = async () => {
await nextTick();
if (breadcrumbRef.value) {
breadcrumbRef.value.scrollLeft = breadcrumbRef.value.scrollWidth;
}
};
watch(breadcrumbs, scrollBreadcrumbToEnd, { deep: true });
const resetState = () => {
searchState.value = { xm: "", dwh: "" };
breadcrumbs.value = [{ name: "全部" }];
};
return {
searchState,
breadcrumbs,
breadcrumbRef,
addBreadcrumb,
navigateToBreadcrumb,
resetState
};
};
const _hoisted_1$2 = { class: "jname-organization-popup" };
const _hoisted_2$2 = { class: "jname-popup-header" };
const _hoisted_3$2 = { class: "jname-popup-title" };
const _hoisted_4$1 = {
key: 0,
class: "jname-header-actions"
};
const _hoisted_5$1 = { class: "jname-selected-count" };
const _hoisted_6 = {
key: 0,
class: "jname-breadcrumb-nav"
};
const _hoisted_7 = ["onClick"];
const _hoisted_8 = { class: "jname-search-section" };
const _hoisted_9 = {
key: 1,
class: "jname-popup-content"
};
const _hoisted_10 = { class: "jname-org-list" };
const _hoisted_11 = ["onClick"];
const _hoisted_12 = { class: "jname-item-content" };
const _hoisted_13 = { class: "jname-org-info" };
const _hoisted_14 = { class: "jname-org-name" };
const _hoisted_15 = ["onClick"];
const _hoisted_16 = { class: "jname-item-content" };
const _hoisted_17 = { class: "jname-person-info" };
const _hoisted_18 = { class: "jname-person-details" };
const _hoisted_19 = { class: "jname-person-name" };
const _hoisted_20 = { class: "jname-person-id" };
const _hoisted_21 = { class: "jname-popup-footer" };
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
...{
name: "JOrganization"
},
__name: "index",
props: {
multiple: { type: Boolean, default: true },
maxSelected: { default: 10 },
apiConfig: {},
modelValue: { type: Boolean, default: false },
popupTitle: { default: "选择人员" },
popupHeight: { default: "80%" }
},
emits: ["update:modelValue", "confirm", "cancel", "close"],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const popupVisible = computed({
get: () => props.modelValue,
set: (value) => emit("update:modelValue", value)
});
const { organizationCatch, getOrganizationList } = useOrganizationApi({
apiConfig: props.apiConfig
});
const { searchState, breadcrumbRef, breadcrumbs, addBreadcrumb, navigateToBreadcrumb, resetState } = useOrganizationState();
const { dataSource, state, onRefresh, onLoad } = useRefreshList({
api: getOrganizationList,
extraParams: searchState
});
const {
selectedCount,
selectedPersonnel,
handlePersonSelection,
executeSearch,
clearAllSelections,
isPersonDisabled,
syncListSelectionState
} = useOrganizationActions({
multiple: props.multiple,
maxSelected: props.maxSelected,
organizationCache: organizationCatch,
searchState,
onRefreshList: () => onRefresh()
});
watch(selectedPersonnel, () => {
syncListSelectionState(dataSource.value);
}, { deep: true });
const handleOrganizationNavigation = async (org) => {
addBreadcrumb({
id: org.id,
name: org.name || org.xm,
dwh: org.dwh || org.id
});
organizationCatch.value.clear();
onRefresh();
};
const handleBreadcrumbClick = async (index2) => {
if (index2 === breadcrumbs.value.length - 1) return;
navigateToBreadcrumb(index2);
organizationCatch.value.clear();
onRefresh();
};
const handlePopupConfirm = () => {
emit("confirm", selectedPersonnel.value);
popupVisible.value = false;
};
const handlePopupCancel = () => {
emit("cancel");
popupVisible.value = false;
};
const handlePopupClose = () => emit("close");
watch(popupVisible, (newVal) => {
if (newVal) {
resetState();
clearAllSelections();
organizationCatch.value.clear();
onRefresh();
}
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(Popup), {
show: popupVisible.value,
"onUpdate:show": _cache[3] || (_cache[3] = ($event) => popupVisible.value = $event),
position: "bottom",
style: normalizeStyle({ height: _ctx.popupHeight }),
round: "",
closeable: "",
"destroy-on-close": true,
"close-icon-position": "top-right",
onClose: handlePopupClose
}, {
default: withCtx(() => [
createElementVNode("div", _hoisted_1$2, [
createElementVNode("div", _hoisted_2$2, [
createElementVNode("h3", _hoisted_3$2, toDisplayString(_ctx.popupTitle), 1),
unref(selectedCount) > 0 ? (openBlock(), createElementBlock("div", _hoisted_4$1, [
createElementVNode("div", _hoisted_5$1, " 已选择" + toDisplayString(unref(selectedCount)) + "人 ", 1),
createVNode(unref(Button), {
size: "mini",
onClick: unref(clearAllSelections)
}, {
default: withCtx(() => [..._cache[4] || (_cache[4] = [
createTextVNode(" 清空 ", -1)
])]),
_: 1
}, 8, ["onClick"])
])) : createCommentVNode("", true)
]),
unref(breadcrumbs).length > 1 ? (openBlock(), createElementBlock("div", _hoisted_6, [
createElementVNode("div", {
ref_key: "breadcrumbRef",
ref: breadcrumbRef,
class: "jname-breadcrumb-content"
}, [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(breadcrumbs), (item, index2) => {
return openBlock(), createElementBlock("span", {
key: item.id || "root",
class: normalizeClass(["jname-breadcrumb-item", { active: index2 === unref(breadcrumbs).length - 1 }]),
onClick: ($event) => handleBreadcrumbClick(index2)
}, [
createTextVNode(toDisplayString(item.name) + " ", 1),
index2 < unref(breadcrumbs).length - 1 ? (openBlock(), createBlock(unref(Icon), {
key: 0,
name: "arrow"
})) : createCommentVNode("", true)
], 10, _hoisted_7);
}), 128))
], 512)
])) : createCommentVNode("", true),
createElementVNode("div", _hoisted_8, [
createVNode(unref(Search), {
modelValue: unref(searchState).xm,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(searchState).xm = $event),
placeholder: "请输入姓名搜索",
clearable: "",
onSearch: unref(executeSearch),
onClear: unref(executeSearch)
}, null, 8, ["modelValue", "onSearch", "onClear"])
]),
popupVisible.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
createVNode(unref(List), mergeProps({
loading: unref(state).loading,
"onUpdate:loading": _cache[1] || (_cache[1] = ($event) => unref(state).loading = $event),
error: unref(state).error,
"onUpdate:error": _cache[2] || (_cache[2] = ($event) => unref(state).error = $event),
finished: unref(state).finished,
"immediate-check": false,
offset: 50,
"finished-text": "没有更多了",
"loading-text": "加载中..."
}, _ctx.$attrs, { onLoad: unref(onLoad) }), {
default: withCtx(() => [
createElementVNode("div", _hoisted_10, [
unref(dataSource).length > 0 ? (openBlock(), createBlock(TransitionGroup, {
key: 0,
name: "jname-list",
tag: "div"
}, {
default: withCtx(() => [
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(dataSource), (item) => {
return openBlock(), createElementBlock(Fragment, {
key: item.id
}, [
item.isParent ? (openBlock(), createElementBlock("div", {
key: 0,
class: "jname-org-item",
onClick: ($event) => handleOrganizationNavigation(item)
}, [
createElementVNode("div", _hoisted_12, [
createElementVNode("div", _hoisted_13, [
createVNode(unref(Icon), {
name: "friends-o",
class: "jname-org-icon"
}),
createElementVNode("span", _hoisted_14, toDisplayString(item.name), 1)
]),
createVNode(unref(Icon), {
name: "arrow",
class: "jname-arrow-icon"
})
])
], 8, _hoisted_11)) : (openBlock(), createElementBlock("div", {
key: 1,
class: "jname-person-item",
onClick: ($event) => unref(handlePersonSelection)(item)
}, [
createElementVNode("div", _hoisted_16, [
createElementVNode("div", _hoisted_17, [
createVNode(unref(Icon), {
name: "contact",
class: "jname-person-icon"
}),
createElementVNode("div", _hoisted_18, [
createElementVNode("div", _hoisted_19, toDisplayString(item.xm), 1),
createElementVNode("div", _hoisted_20, toDisplayString(item.xgh), 1)
])
]),
createVNode(unref(Checkbox), {
"model-value": item.checked,
disabled: unref(isPersonDisabled)(item)
}, null, 8, ["model-value", "disabled"])
])
], 8, _hoisted_15))
], 64);
}), 128))
]),
_: 1
})) : createCommentVNode("", true)
])
]),
_: 1
}, 16, ["loading", "error", "finished", "onLoad"])
])) : createCommentVNode("", true),
createElementVNode("div", _hoisted_21, [
createVNode(unref(Button), {
size: "large",
onClick: handlePopupCancel
}, {
default: withCtx(() => [..._cache[5] || (_cache[5] = [
createTextVNode(" 取消 ", -1)
])]),
_: 1
}),
createVNode(unref(Button), {
type: "primary",
size: "large",
disabled: unref(selectedCount) === 0,
onClick: handlePopupConfirm
}, {
default: withCtx(() => [
createTextVNode(" 确定 " + toDisplayString(unref(selectedCount) > 0 ? `(${unref(selectedCount)})` : ""), 1)
]),
_: 1
}, 8, ["disabled"])
])
])
]),
_: 1
}, 8, ["show", "style"]);
};
}
});
const Organization = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-473e52f3"]]);
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
...{
name: "JPullToRefreshList"
},
__name: "index",
props: {
extraParams: { default: () => ({}) },
apiFn: {},
immediate: { type: Boolean, default: true },
disablePullRefresh: { type: Boolean, default: false }
},
setup(__props, { expose: __expose }) {
const props = __props;
const extraParams = computed(() => props.extraParams);
const { dataSource, state, onRefresh, onLoad, onSearch, onReset } = useRefreshList({
api: props.apiFn,
extraParams
});
onMounted(() => {
props.immediate && onLoad();
});
__expose({
onRefresh,
onLoad,
onSearch,
onReset,
dataSource
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock(Fragment, null, [
!_ctx.disablePullRefresh ? (openBlock(), createBlock(unref(PullRefresh), mergeProps({
key: 0,
modelValue: unref(state).isLoading,
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => unref(state).isLoading = $event),
"pulling-text": "下拉释放刷新",
"loosing-text": "下拉释放刷新",
"loading-text": "刷新中..."
}, _ctx.$attrs, { onRefresh: unref(onRefresh) }), {
default: withCtx(() => [
createVNode(unref(List), mergeProps({
loading: unref(state).loading,
"onUpdate:loading": _cache[0] || (_cache[0] = ($event) => unref(state).loading = $event),
error: unref(state).error,
"onUpdate:error": _cache[1] || (_cache[1] = ($event) => unref(state).error = $event),
finished: unref(state).finished,
"immediate-check": false,
offset: 50,
"finished-text": "没有更多了",
"loading-text": "加载中..."
}, _ctx.$attrs, { onLoad: unref(onLoad) }), {
default: withCtx(() => [
renderSlot(_ctx.$slots, "default", {
data: unref(dataSource) || []
})
]),
_: 3
}, 16, ["loading", "error", "finished", "onLoad"])
]),
_: 3
}, 16, ["modelValue", "onRefresh"])) : createCommentVNode("", true),
_ctx.disablePullRefresh ? (openBlock(), createBlock(unref(List), mergeProps({
key: 1,
loading: unref(state).loading,
"onUpdate:loading": _cache[3] || (_cache[3] = ($event) => unref(state).loading = $event),
error: unref(state).error,
"onUpdate:error": _cache[4] || (_cache[4] = ($event) => unref(state).error = $event),
finished: unref(state).finished,
"immediate-check": false,
offset: 50,
"finished-text": "没有更多了",
"loading-text": "加载中..."
}, _ctx.$attrs, { onLoad: unref(onLoad) }), {
default: withCtx(() => [
renderSlot(_ctx.$slots, "default", {
data: unref(dataSource) || []
})
]),
_: 3
}, 16, ["loading", "error", "finished", "onLoad"])) : createCommentVNode("", true)
], 64);
};
}
});
const _hoisted_1$1 = { class: "jname-steps-card" };
const _hoisted_2$1 = { class: "jname-steps-card__timeline" };
const _hoisted_3$1 = { class: "jname-steps-card__timeline-container" };
const _hoisted_4 = { class: "jname-steps-card__content" };
const _hoisted_5 = {
key: 0,
class: "jname-steps-card__content-header"
};
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
...{
name: "JStepsCard"
},
__name: "index",
setup(__props) {
const slots = useSlots();
const hasBodyContent = computed(() => !!slots.default);
const bodyRef = ref(null);
const bodyHeight = ref(0);
const updateHeight = () => {
if (bodyRef.value) {
bodyHeight.value = bodyRef.value.offsetHeight;
}
};
onMounted(updateHeight);
onUpdated(updateHeight);
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1$1, [
createElementVNode("div", _hoisted_2$1, [
createElementVNode("div", _hoisted_3$1, [
_cache[0] || (_cache[0] = createElementVNode("div", { class: "jname-steps-card__dot-container" }, [
createElementVNode("div", { class: "jname-steps-card__outer-dot" }),
createElementVNode("div", { class: "jname-steps-card__inner-dot" })
], -1)),
hasBodyContent.value ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(["jname-steps-card__line", [bodyHeight.value > 0 ? "jname-steps-card__line--visible" : "jname-steps-card__line--hidden"]])
}, null, 2)) : createCommentVNode("", true)
])
]),
createElementVNode("div", _hoisted_4, [
unref(slots).header ? (openBlock(), createElementBlock("div", _hoisted_5, [
renderSlot(_ctx.$slots, "header", {}, void 0, true)
])) : createCommentVNode("", true),
unref(slots).default ? (openBlock(), createElementBlock("div", {
key: 1,
ref_key: "bodyRef",
ref: bodyRef,
class: "jname-steps-card__content-body"
}, [
renderSlot(_ctx.$slots, "default", {}, void 0, true)
], 512)) : createCommentVNode("", true)
])
]);
};
}
});
const StepsCard = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-af2389e6"]]);
const _hoisted_1 = { class: "jname-tabs-container" };
const _hoisted_2 = ["onClick"];
const _hoisted_3 = {
key: 0,
class: "jname-tab-count"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
...{
name: "JTabs"
},
__name: "index",
props: {
modelValue: {
type: String,
default: ""
},
tabOptions: {
type: Array,
default: () => []
}
},
emits: ["change", "update:modelValue"],
setup(__props, { emit: __emit }) {
const emit = __emit;
const handleClick = (value) => {
emit("update:modelValue", value);
emit("change", value);
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabOptions, (item) => {
return openBlock(), createElementBlock("div", {
key: item.value,
class: normalizeClass(["jname-tab-item", { active: __props.modelValue === item.value }]),
onClick: ($event) => handleClick(item.value)
}, [
createTextVNode(toDisplayString(item.label) + " ", 1),
!!item.count ? (openBlock(), createElementBlock("span", _hoisted_3, "(" + toDisplayString(item.count) + ")", 1)) : createCommentVNode("", true),
createElementVNode("div", {
class: normalizeClass(["jname-tab-indicator", { active: __props.modelValue === item.value }])
}, null, 2)
], 10, _hoisted_2);
}), 128))
]);
};
}
});
const components = [StepsCard, _sfc_main, ContentCard, ImgUploader, _sfc_main$2, Organization];
const install = (app) => {
components.forEach((component) => {
if (component.name) {
app.component(component.name, component);
}
});
};
const index = {
install,
version: "1.3.13"
};
if (typeof window !== "undefined" && window.Vue) {
install(window.Vue);
}
export {
ContentCard as JContentCard,
ImgUploader as JImgUploader,
Organization as JOrganization,
_sfc_main$2 as JPullToRefreshList,
StepsCard as JStepsCard,
_sfc_main as JTabs,
index as default,
useRefreshList
};
//# sourceMappingURL=index.mjs.map