znyg-frontend-common 1.1.13 → 1.1.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import{defineComponent as e,ref as l,getCurrentInstance as t,watch as a,nextTick as o,onUnmounted as n,resolveComponent as r,createElementBlock as s,openBlock as i,Fragment as d,createCommentVNode as u,createVNode as c,withCtx as m,createElementVNode as p,unref as f,normalizeClass as h,renderSlot as v}from"vue";import g from"../assets/notData.png.mjs";import b from"sortablejs";import{DCaret as y}from"@element-plus/icons-vue";var w=Object.defineProperty,S=(e,l)=>w(e,"name",{value:l,configurable:!0});const U={class:"col-setting-header",style:{display:"flex","align-items":"center"}},C=["id"],V={style:{display:"flex","align-items":"center"}},_={class:"table-main"};var x=e({__name:"ColSetting",props:{colSetting:{type:Array,required:!0}},emits:["update:colSetting","updateColumns"],setup(e,{expose:w,emit:x}){const O=e,T=x,k=l(!1),I=l();let J=null;const N=t(),j=l([]),A=l(!1);let E=null;const $=S(((e,l)=>{if(N&&!N.isUnmounted)try{T(e,l)}catch(l){console.warn(`发送事件 ${e} 时出错:`,l)}else console.warn("组件已销毁,跳过事件发送",{hasInstance:!!N,isUnmounted:N?.isUnmounted})}),"safeEmit"),q=S((e=>{E&&clearTimeout(E),E=window.setTimeout((()=>{if(N&&!N.isUnmounted)try{const l=JSON.parse(JSON.stringify(e));$("updateColumns",l)}catch(e){console.warn("更新数据时出错:",e)}}),100)}),"debouncedUpdate");a((()=>O.colSetting),(e=>{if(!e||!Array.isArray(e))return;A.value=!0;let l=e.filter((e=>e.isShow));try{j.value=JSON.parse(JSON.stringify(l))}catch(e){console.warn("更新本地列设置时出错:",e),j.value=[...l]}o((()=>{setTimeout((()=>{A.value=!1}),50)}))}),{immediate:!0,deep:!0});const D=S((()=>{N&&!N.isUnmounted&&o((()=>{if(N&&!N.isUnmounted&&I.value)try{const e=I.value.$el?.querySelector("tbody");if(!e)return void console.warn("未找到tbody元素");if(J){try{J.destroy()}catch(e){console.warn("销毁sortable实例时出错:",e)}J=null}J=b.create(e,{handle:".drag-handle",animation:300,ghostClass:"sortable-ghost",chosenClass:"sortable-chosen",dragClass:"sortable-drag",forceFallback:!0,fallbackTolerance:3,
1
+ import{defineComponent as e,ref as l,getCurrentInstance as t,watch as a,nextTick as o,onUnmounted as n,resolveComponent as r,createElementBlock as s,openBlock as i,Fragment as d,createCommentVNode as u,createVNode as c,withCtx as m,createElementVNode as p,unref as f,normalizeClass as h,renderSlot as v}from"vue";import g from"../assets/notData.png.mjs";import b from"sortablejs";import{DCaret as y}from"@element-plus/icons-vue";var w=Object.defineProperty,S=(e,l)=>w(e,"name",{value:l,configurable:!0});const U={class:"col-setting-header",style:{display:"flex","align-items":"center"}},C=["id"],V={style:{display:"flex","align-items":"center"}},_={class:"table-main"};var x=e({__name:"ColSetting",props:{colSetting:{type:Array,required:!0}},emits:["update:colSetting","updateColumns"],setup(e,{expose:w,emit:x}){const O=e,T=x,k=l(!1),I=l();let J=null;const N=t(),j=l([]),A=l(!1);let E=null;const $=S(((e,l)=>{if(N&&!N.isUnmounted)try{T(e,l)}catch(l){console.warn(`发送事件 ${e} 时出错:`,l)}else console.warn("组件已销毁,跳过事件发送",{hasInstance:!!N,isUnmounted:N?.isUnmounted})}),"safeEmit"),q=S((e=>{E&&clearTimeout(E),E=window.setTimeout((()=>{if(N&&!N.isUnmounted)try{const l=JSON.parse(JSON.stringify(e));$("updateColumns",l)}catch(e){console.warn("更新数据时出错:",e)}}),100)}),"debouncedUpdate");a((()=>O.colSetting),(e=>{if(e&&Array.isArray(e)){A.value=!0;try{j.value=JSON.parse(JSON.stringify(e))}catch(l){console.warn("更新本地列设置时出错:",l),j.value=[...e]}o((()=>{setTimeout((()=>{A.value=!1}),50)}))}}),{immediate:!0,deep:!0});const D=S((()=>{N&&!N.isUnmounted&&o((()=>{if(N&&!N.isUnmounted&&I.value)try{const e=I.value.$el?.querySelector("tbody");if(!e)return void console.warn("未找到tbody元素");if(J){try{J.destroy()}catch(e){console.warn("销毁sortable实例时出错:",e)}J=null}J=b.create(e,{handle:".drag-handle",animation:300,ghostClass:"sortable-ghost",chosenClass:"sortable-chosen",dragClass:"sortable-drag",forceFallback:!0,fallbackTolerance:3,
2
2
  // 禁用原生HTML5拖拽
3
3
  dragoverBubble:!1,removeCloneOnHide:!0,onStart:S((e=>{if(!e.item||!e.from||!N||N.isUnmounted)return!1}),"onStart"),onEnd:S((e=>{if(!N||N.isUnmounted)return;if(A.value)return;const{oldIndex:l,newIndex:t}=e;if(void 0!==l&&void 0!==t&&l!==t&&!(l<0||t<0||l>=j.value.length||t>=j.value.length))try{const e=[...j.value],a=e.splice(l,1)[0];a&&(e.splice(t,0,a),j.value=e,q(e))}catch(e){console.warn("拖拽排序时出错:",e)}}),"onEnd")})}catch(e){console.warn("初始化sortable时出错:",e)}}))}),"initSortable"),H=S((()=>{N&&!N.isUnmounted&&(k.value=!0,setTimeout((()=>{N&&!N.isUnmounted&&D()}),200))}),"openColSetting"),z=S((()=>{N&&!N.isUnmounted&&(k.value=!1)}),"closeColSetting"),B=S((()=>{if(N&&!N.isUnmounted&&!A.value)try{q(j.value)}catch(e){console.warn("开关切换时出错:",e)}}),"handleSwitchChange");return a(k,(e=>{if(!e&&J)try{J.destroy(),J=null}catch(e){console.warn("关闭抽屉时销毁sortable实例出错:",e)}})),n((()=>{if(E&&(clearTimeout(E),E=null),J)try{J.destroy(),J=null}catch(e){console.warn("组件销毁时清理sortable实例出错:",e)}})),w({openColSetting:H,closeColSetting:z}),(e,l)=>{const t=r("el-icon"),a=r("el-table-column"),o=r("el-switch"),n=r("el-table"),b=r("el-drawer");return i(),s(d,null,[u(" 列设置 "),c(b,{modelValue:k.value,"onUpdate:modelValue":l[0]||(l[0]=e=>k.value=e),title:"列设置",size:"450px"},{header:m((({close:l,titleId:t,titleClass:a})=>[p("div",U,[p("h4",{id:t,class:h(a)},"列设置",10,C),p("div",V,[u(" 列设置头部插槽 "),v(e.$slots,"colSettingHeader")])])])),default:m((()=>[p("div",_,[c(n,{ref_key:"tableRef",ref:I,data:j.value,border:!0,"row-key":"prop","default-expand-all":"","tree-props":{children:"_children"}},{empty:m((()=>l[1]||(l[1]=[p("div",{class:"table-empty"},[p("img",{src:g,alt:"notData"}),p("div",null,"暂无可配置列")],-1
4
4
  /* HOISTED */)]))),default:m((()=>[c(a,{align:"center",label:"拖拽",width:"60"},{default:m((()=>[c(t,{class:"drag-handle",style:{color:"#409eff",cursor:"move"}},{default:m((()=>[c(f(y))])),_:1
@@ -1 +1 @@
1
- {"version":3,"file":"ColSetting.vue2.mjs","sources":["../../../../../../../packages/components/znTable/src/components/ColSetting.vue"],"sourcesContent":["<template>\n <!-- 列设置 -->\n <el-drawer v-model=\"drawerVisible\" title=\"列设置\" size=\"450px\">\n <!-- 自定义头部 -->\n <template #header=\"{ close, titleId, titleClass }\">\n <div class=\"col-setting-header\" style=\"display: flex; align-items: center;\">\n <h4 :id=\"titleId\" :class=\"titleClass\">列设置</h4>\n <div style=\"display: flex; align-items: center;\">\n <!-- 列设置头部插槽 -->\n <slot name=\"colSettingHeader\"></slot>\n </div>\n </div>\n </template>\n\n <div class=\"table-main\">\n <el-table ref=\"tableRef\" :data=\"localColSetting\" :border=\"true\" row-key=\"prop\" default-expand-all :tree-props=\"{ children: '_children' }\">\n <el-table-column align=\"center\" label=\"拖拽\" width=\"60\">\n <template #default>\n <el-icon class=\"drag-handle\" style=\" color: #409eff;cursor: move\">\n <DCaret />\n </el-icon>\n </template>\n </el-table-column>\n <el-table-column prop=\"label\" align=\"center\" label=\"列名\" />\n <el-table-column v-slot=\"scope\" prop=\"isShow\" align=\"center\" label=\"显示\">\n <el-switch v-model=\"scope.row.isShow\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <el-table-column v-slot=\"scope\" prop=\"sortable\" align=\"center\" label=\"排序\">\n <el-switch v-model=\"scope.row.sortable\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <template #empty>\n <div class=\"table-empty\">\n <img src=\"../assets/notData.png\" alt=\"notData\" />\n <div>暂无可配置列</div>\n </div>\n </template>\n </el-table>\n </div>\n </el-drawer>\n</template>\n\n<script setup lang=\"ts\" name=\"ColSetting\">\n import { nextTick, onMounted, onUnmounted, ref, watch, getCurrentInstance } from 'vue'\n import Sortable from 'sortablejs'\n\n import { ColumnProps } from '../interface'\n import { DCaret } from '@element-plus/icons-vue'\n\n const props = defineProps({\n colSetting: { type: Array, required: true }\n})\n const emit = defineEmits(['update:colSetting', 'updateColumns'])\n\n const drawerVisible = ref<boolean>(false)\n const tableRef = ref()\n let sortableInstance: Sortable | null = null\n\n // 获取当前组件实例,用于检查组件是否已销毁\n const instance = getCurrentInstance()\n\n // 添加本地状态\n const localColSetting = ref<ColumnProps[]>([])\n\n // 添加更新标志,防止循环更新\n const isUpdatingFromParent = ref(false)\n\n // 防抖标志\n let updateTimer: number | null = null\n\n // 安全的emit函数\n const safeEmit = (eventName: string, data: any) => {\n // console.log('safeEmit调用:', {\n // eventName,\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // dataLength: Array.isArray(data) ? data.length : 'not array'\n // })\n\n // 检查组件实例是否还存在\n if (!instance || instance.isUnmounted) {\n console.warn('组件已销毁,跳过事件发送', {\n hasInstance: !!instance,\n isUnmounted: instance?.isUnmounted\n })\n return\n }\n\n try {\n // console.log('正在发送事件:', eventName)\n emit(eventName as any, data)\n // console.log('事件发送成功:', eventName)\n } catch (error) {\n console.warn(`发送事件 ${eventName} 时出错:`, error)\n }\n }\n\n // 防抖的更新函数\n const debouncedUpdate = (data: ColumnProps[]) => {\n // console.log('debouncedUpdate调用:', {\n // hasData: !!data,\n // dataLength: Array.isArray(data) ? data.length : 'not array',\n // hasTimer: !!updateTimer\n // })\n\n if (updateTimer) {\n // console.log('清除之前的定时器')\n clearTimeout(updateTimer)\n }\n\n updateTimer = window.setTimeout(() => {\n // console.log('防抖定时器执行:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('防抖更新时组件已销毁')\n return\n }\n\n try {\n // 深拷贝数据避免响应式问题\n const clonedData = JSON.parse(JSON.stringify(data))\n // console.log('开始发送防抖更新事件')\n // safeEmit('update:colSetting', clonedData) // 移除这个事件,避免双重更新\n safeEmit('updateColumns', clonedData)\n } catch (error) {\n console.warn('更新数据时出错:', error)\n }\n }, 100) // 100ms防抖\n }\n\n // 监听 props 变化,更新本地状态\n watch(\n () => props.colSetting,\n (newVal) => {\n if (!newVal || !Array.isArray(newVal)) return\n\n // 设置标志,表示正在从父组件更新\n isUpdatingFromParent.value = true\n let filterData=newVal.filter(item=>item.isShow)\n try {\n localColSetting.value = JSON.parse(JSON.stringify(filterData))\n } catch (error) {\n console.warn('更新本地列设置时出错:', error)\n localColSetting.value = [...filterData]\n }\n\n // 延迟重置标志,确保本次更新完成\n nextTick(() => {\n setTimeout(() => {\n isUpdatingFromParent.value = false\n }, 50)\n })\n },\n { immediate: true, deep: true }\n )\n\n // 初始化拖拽排序\n const initSortable = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n nextTick(() => {\n if (!instance || instance.isUnmounted || !tableRef.value) {\n return\n }\n\n try {\n const tbody = tableRef.value.$el?.querySelector('tbody')\n if (!tbody) {\n console.warn('未找到tbody元素')\n return\n }\n\n // 销毁之前的实例\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n } catch (error) {\n console.warn('销毁sortable实例时出错:', error)\n }\n sortableInstance = null\n }\n\n sortableInstance = Sortable.create(tbody, {\n handle: '.drag-handle',\n animation: 300,\n ghostClass: 'sortable-ghost',\n chosenClass: 'sortable-chosen',\n dragClass: 'sortable-drag',\n forceFallback: true,\n fallbackTolerance: 3,\n // 禁用原生HTML5拖拽\n dragoverBubble: false,\n removeCloneOnHide: true,\n onStart: (evt) => {\n if (!evt.item || !evt.from || !instance || instance.isUnmounted) {\n return false\n }\n },\n onEnd: (evt) => {\n // 检查组件状态\n if (!instance || instance.isUnmounted) {\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n const { oldIndex, newIndex } = evt\n\n if (oldIndex === undefined || newIndex === undefined || oldIndex === newIndex) {\n return\n }\n\n if (oldIndex < 0 || newIndex < 0 || oldIndex >= localColSetting.value.length || newIndex >= localColSetting.value.length) {\n return\n }\n\n try {\n const newData = [...localColSetting.value]\n const movedItem = newData.splice(oldIndex, 1)[0]\n\n if (movedItem) {\n newData.splice(newIndex, 0, movedItem)\n localColSetting.value = newData\n\n // 使用防抖更新\n debouncedUpdate(newData)\n }\n } catch (error) {\n console.warn('拖拽排序时出错:', error)\n }\n }\n })\n } catch (error) {\n console.warn('初始化sortable时出错:', error)\n }\n })\n }\n\n const openColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = true\n\n // 延迟初始化拖拽\n setTimeout(() => {\n if (!instance || instance.isUnmounted) {\n return\n }\n initSortable()\n }, 200)\n }\n\n const closeColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = false\n }\n\n const handleSwitchChange = () => {\n // console.log('handleSwitchChange调用:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // localColSettingLength: localColSetting.value.length\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('开关切换时组件已销毁')\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n try {\n // console.log('开关切换,准备防抖更新')\n // 使用防抖更新\n debouncedUpdate(localColSetting.value)\n } catch (error) {\n console.warn('开关切换时出错:', error)\n }\n }\n\n // 监听抽屉关闭,清理拖拽实例\n watch(drawerVisible, (newVal) => {\n if (!newVal && sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('关闭抽屉时销毁sortable实例出错:', error)\n }\n }\n })\n\n // 组件销毁时清理\n onUnmounted(() => {\n if (updateTimer) {\n clearTimeout(updateTimer)\n updateTimer = null\n }\n\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('组件销毁时清理sortable实例出错:', error)\n }\n }\n })\n\n defineExpose({\n openColSetting,\n closeColSetting\n })\n</script>\n"],"names":["props","__props","emit","__emit","drawerVisible","ref","tableRef","sortableInstance","instance","getCurrentInstance","localColSetting","isUpdatingFromParent","updateTimer","safeEmit","__name","eventName","data","isUnmounted","error","console","warn","hasInstance","debouncedUpdate","clearTimeout","window","setTimeout","clonedData","JSON","parse","stringify","watch","colSetting","newVal","Array","isArray","value","filterData","filter","item","isShow","nextTick","immediate","deep","initSortable","tbody","$el","querySelector","destroy","Sortable","create","handle","animation","ghostClass","chosenClass","dragClass","forceFallback","fallbackTolerance","dragoverBubble","removeCloneOnHide","onStart","evt","from","onEnd","oldIndex","newIndex","length","newData","movedItem","splice","openColSetting","closeColSetting","handleSwitchChange","onUnmounted","__expose"],"mappings":"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"}
1
+ {"version":3,"file":"ColSetting.vue2.mjs","sources":["../../../../../../../packages/components/znTable/src/components/ColSetting.vue"],"sourcesContent":["<template>\n <!-- 列设置 -->\n <el-drawer v-model=\"drawerVisible\" title=\"列设置\" size=\"450px\">\n <!-- 自定义头部 -->\n <template #header=\"{ close, titleId, titleClass }\">\n <div class=\"col-setting-header\" style=\"display: flex; align-items: center;\">\n <h4 :id=\"titleId\" :class=\"titleClass\">列设置</h4>\n <div style=\"display: flex; align-items: center;\">\n <!-- 列设置头部插槽 -->\n <slot name=\"colSettingHeader\"></slot>\n </div>\n </div>\n </template>\n\n <div class=\"table-main\">\n <el-table ref=\"tableRef\" :data=\"localColSetting\" :border=\"true\" row-key=\"prop\" default-expand-all :tree-props=\"{ children: '_children' }\">\n <el-table-column align=\"center\" label=\"拖拽\" width=\"60\">\n <template #default>\n <el-icon class=\"drag-handle\" style=\" color: #409eff;cursor: move\">\n <DCaret />\n </el-icon>\n </template>\n </el-table-column>\n <el-table-column prop=\"label\" align=\"center\" label=\"列名\" />\n <el-table-column v-slot=\"scope\" prop=\"isShow\" align=\"center\" label=\"显示\">\n <el-switch v-model=\"scope.row.isShow\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <el-table-column v-slot=\"scope\" prop=\"sortable\" align=\"center\" label=\"排序\">\n <el-switch v-model=\"scope.row.sortable\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <template #empty>\n <div class=\"table-empty\">\n <img src=\"../assets/notData.png\" alt=\"notData\" />\n <div>暂无可配置列</div>\n </div>\n </template>\n </el-table>\n </div>\n </el-drawer>\n</template>\n\n<script setup lang=\"ts\" name=\"ColSetting\">\n import { nextTick, onMounted, onUnmounted, ref, watch, getCurrentInstance } from 'vue'\n import Sortable from 'sortablejs'\n\n import { ColumnProps } from '../interface'\n import { DCaret } from '@element-plus/icons-vue'\n\n const props = defineProps({\n colSetting: { type: Array, required: true }\n})\n const emit = defineEmits(['update:colSetting', 'updateColumns'])\n\n const drawerVisible = ref<boolean>(false)\n const tableRef = ref()\n let sortableInstance: Sortable | null = null\n\n // 获取当前组件实例,用于检查组件是否已销毁\n const instance = getCurrentInstance()\n\n // 添加本地状态\n const localColSetting = ref<ColumnProps[]>([])\n\n // 添加更新标志,防止循环更新\n const isUpdatingFromParent = ref(false)\n\n // 防抖标志\n let updateTimer: number | null = null\n\n // 安全的emit函数\n const safeEmit = (eventName: string, data: any) => {\n // console.log('safeEmit调用:', {\n // eventName,\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // dataLength: Array.isArray(data) ? data.length : 'not array'\n // })\n\n // 检查组件实例是否还存在\n if (!instance || instance.isUnmounted) {\n console.warn('组件已销毁,跳过事件发送', {\n hasInstance: !!instance,\n isUnmounted: instance?.isUnmounted\n })\n return\n }\n\n try {\n // console.log('正在发送事件:', eventName)\n emit(eventName as any, data)\n // console.log('事件发送成功:', eventName)\n } catch (error) {\n console.warn(`发送事件 ${eventName} 时出错:`, error)\n }\n }\n\n // 防抖的更新函数\n const debouncedUpdate = (data: ColumnProps[]) => {\n // console.log('debouncedUpdate调用:', {\n // hasData: !!data,\n // dataLength: Array.isArray(data) ? data.length : 'not array',\n // hasTimer: !!updateTimer\n // })\n\n if (updateTimer) {\n // console.log('清除之前的定时器')\n clearTimeout(updateTimer)\n }\n\n updateTimer = window.setTimeout(() => {\n // console.log('防抖定时器执行:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('防抖更新时组件已销毁')\n return\n }\n\n try {\n // 深拷贝数据避免响应式问题\n const clonedData = JSON.parse(JSON.stringify(data))\n // console.log('开始发送防抖更新事件')\n // safeEmit('update:colSetting', clonedData) // 移除这个事件,避免双重更新\n safeEmit('updateColumns', clonedData)\n } catch (error) {\n console.warn('更新数据时出错:', error)\n }\n }, 100) // 100ms防抖\n }\n\n // 监听 props 变化,更新本地状态\n watch(\n () => props.colSetting,\n (newVal) => {\n if (!newVal || !Array.isArray(newVal)) return\n\n // 设置标志,表示正在从父组件更新\n isUpdatingFromParent.value = true\n // 不要过滤 isShow 为 false 的列,否则用户无法再将其设置为显示\n try {\n localColSetting.value = JSON.parse(JSON.stringify(newVal))\n } catch (error) {\n console.warn('更新本地列设置时出错:', error)\n localColSetting.value = [...newVal]\n }\n\n // 延迟重置标志,确保本次更新完成\n nextTick(() => {\n setTimeout(() => {\n isUpdatingFromParent.value = false\n }, 50)\n })\n },\n { immediate: true, deep: true }\n )\n\n // 初始化拖拽排序\n const initSortable = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n nextTick(() => {\n if (!instance || instance.isUnmounted || !tableRef.value) {\n return\n }\n\n try {\n const tbody = tableRef.value.$el?.querySelector('tbody')\n if (!tbody) {\n console.warn('未找到tbody元素')\n return\n }\n\n // 销毁之前的实例\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n } catch (error) {\n console.warn('销毁sortable实例时出错:', error)\n }\n sortableInstance = null\n }\n\n sortableInstance = Sortable.create(tbody, {\n handle: '.drag-handle',\n animation: 300,\n ghostClass: 'sortable-ghost',\n chosenClass: 'sortable-chosen',\n dragClass: 'sortable-drag',\n forceFallback: true,\n fallbackTolerance: 3,\n // 禁用原生HTML5拖拽\n dragoverBubble: false,\n removeCloneOnHide: true,\n onStart: (evt) => {\n if (!evt.item || !evt.from || !instance || instance.isUnmounted) {\n return false\n }\n },\n onEnd: (evt) => {\n // 检查组件状态\n if (!instance || instance.isUnmounted) {\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n const { oldIndex, newIndex } = evt\n\n if (oldIndex === undefined || newIndex === undefined || oldIndex === newIndex) {\n return\n }\n\n if (oldIndex < 0 || newIndex < 0 || oldIndex >= localColSetting.value.length || newIndex >= localColSetting.value.length) {\n return\n }\n\n try {\n const newData = [...localColSetting.value]\n const movedItem = newData.splice(oldIndex, 1)[0]\n\n if (movedItem) {\n newData.splice(newIndex, 0, movedItem)\n localColSetting.value = newData\n\n // 使用防抖更新\n debouncedUpdate(newData)\n }\n } catch (error) {\n console.warn('拖拽排序时出错:', error)\n }\n }\n })\n } catch (error) {\n console.warn('初始化sortable时出错:', error)\n }\n })\n }\n\n const openColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = true\n\n // 延迟初始化拖拽\n setTimeout(() => {\n if (!instance || instance.isUnmounted) {\n return\n }\n initSortable()\n }, 200)\n }\n\n const closeColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = false\n }\n\n const handleSwitchChange = () => {\n // console.log('handleSwitchChange调用:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // localColSettingLength: localColSetting.value.length\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('开关切换时组件已销毁')\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n try {\n // console.log('开关切换,准备防抖更新')\n // 使用防抖更新\n debouncedUpdate(localColSetting.value)\n } catch (error) {\n console.warn('开关切换时出错:', error)\n }\n }\n\n // 监听抽屉关闭,清理拖拽实例\n watch(drawerVisible, (newVal) => {\n if (!newVal && sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('关闭抽屉时销毁sortable实例出错:', error)\n }\n }\n })\n\n // 组件销毁时清理\n onUnmounted(() => {\n if (updateTimer) {\n clearTimeout(updateTimer)\n updateTimer = null\n }\n\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('组件销毁时清理sortable实例出错:', error)\n }\n }\n })\n\n defineExpose({\n openColSetting,\n closeColSetting\n })\n</script>\n"],"names":["props","__props","emit","__emit","drawerVisible","ref","tableRef","sortableInstance","instance","getCurrentInstance","localColSetting","isUpdatingFromParent","updateTimer","safeEmit","__name","eventName","data","isUnmounted","error","console","warn","hasInstance","debouncedUpdate","clearTimeout","window","setTimeout","clonedData","JSON","parse","stringify","watch","colSetting","newVal","Array","isArray","value","nextTick","immediate","deep","initSortable","tbody","$el","querySelector","destroy","Sortable","create","handle","animation","ghostClass","chosenClass","dragClass","forceFallback","fallbackTolerance","dragoverBubble","removeCloneOnHide","onStart","evt","item","from","onEnd","oldIndex","newIndex","length","newData","movedItem","splice","openColSetting","closeColSetting","handleSwitchChange","onUnmounted","__expose"],"mappings":"6yBAgDE,MAAMA,EAAQC,EAGRC,EAAOC,EAEPC,EAAgBC,GAAa,GAC7BC,EAAWD,IACjB,IAAIE,EAAoC,KAGxC,MAAMC,EAAWC,IAGXC,EAAkBL,EAAmB,IAGrCM,EAAuBN,GAAI,GAGjC,IAAIO,EAA6B,KAG3B,MAAAC,EAAYC,GAAA,CAAAC,EAAmBC,KAS/B,GAACR,IAAYA,EAASS,YAQtB,IAEFf,EAAKa,EAAkBC,SAEhBE,GACPC,QAAQC,KAAK,QAAQL,SAAkBG,EAAK,MAZ5CC,QAAQC,KAAK,eAAgB,CAC3BC,cAAeb,EACfS,YAAaT,GAAUS,aAUmB,GAtB/B,YA2BXK,KAAmBN,IAOnBJ,GAEFW,aAAaX,GAGDA,EAAAY,OAAOC,YAAW,KAM1B,GAACjB,IAAYA,EAASS,YAKtB,IAEF,MAAMS,EAAaC,KAAKC,MAAMD,KAAKE,UAAUb,IAG7CH,EAAS,gBAAiBa,SACnBR,GACCC,QAAAC,KAAK,WAAYF,EAAK,IAE/B,IAAG,GAhCgB,mBAoCxBY,GACE,IAAM9B,EAAM+B,aACXC,IACC,GAAKA,GAAWC,MAAMC,QAAQF,GAA9B,CAGArB,EAAqBwB,OAAQ,EAEzB,IACFzB,EAAgByB,MAAQR,KAAKC,MAAMD,KAAKE,UAAUG,UAC3Cd,GACCC,QAAAC,KAAK,cAAeF,GACZR,EAAAyB,MAAQ,IAAIH,EAAM,CAIpCI,GAAS,KACPX,YAAW,KACTd,EAAqBwB,OAAQ,CAAA,GAC5B,GAAE,GAhBgC,CAiBtC,GAEH,CAAEE,WAAW,EAAMC,MAAM,IAI3B,MAAMC,EAAqBzB,GAAA,KACpBN,IAAYA,EAASS,aAI1BmB,GAAS,KACP,GAAK5B,IAAYA,EAASS,aAAgBX,EAAS6B,MAI/C,IACF,MAAMK,EAAQlC,EAAS6B,MAAMM,KAAKC,cAAc,SAChD,IAAKF,EAEH,YADArB,QAAQC,KAAK,cAKf,GAAIb,EAAkB,CAChB,IACFA,EAAiBoC,gBACVzB,GACCC,QAAAC,KAAK,mBAAoBF,EAAK,CAErBX,EAAA,IAAA,CAGFA,EAAAqC,EAASC,OAAOL,EAAO,CACxCM,OAAQ,eACRC,UAAW,IACXC,WAAY,iBACZC,YAAa,kBACbC,UAAW,gBACXC,eAAe,EACfC,kBAAmB;;AAEnBC,gBAAgB,EAChBC,mBAAmB,EACnBC,WAAUC,IACJ,IAACA,EAAIC,OAASD,EAAIE,OAASlD,GAAYA,EAASS,YAC3C,OAAA,CAAA,GAFF,WAKT0C,SAAQH,IAEF,IAAChD,GAAYA,EAASS,YACxB,OAIF,GAAIN,EAAqBwB,MACvB,OAGI,MAAAyB,SAAEA,EAAUC,SAAAA,GAAaL,EAE/B,QAAiB,IAAbI,QAAuC,IAAbC,GAA0BD,IAAaC,KAIjED,EAAW,GAAKC,EAAW,GAAKD,GAAYlD,EAAgByB,MAAM2B,QAAUD,GAAYnD,EAAgByB,MAAM2B,QAI9G,IACF,MAAMC,EAAU,IAAIrD,EAAgByB,OAC9B6B,EAAYD,EAAQE,OAAOL,EAAU,GAAG,GAE1CI,IACMD,EAAAE,OAAOJ,EAAU,EAAGG,GAC5BtD,EAAgByB,MAAQ4B,EAGxBzC,EAAgByC,UAEX7C,GACCC,QAAAC,KAAK,WAAYF,EAAK,IAjC3B,iBAqCFA,GACCC,QAAAC,KAAK,kBAAmBF,EAAK,IAExC,GAnFkB,gBAsFfgD,EAAuBpD,GAAA,KACtBN,IAAYA,EAASS,cAI1Bb,EAAc+B,OAAQ,EAGtBV,YAAW,KACJjB,IAAYA,EAASS,aAGbsB,GAAA,GACZ,KAAG,GAbe,kBAgBjB4B,EAAwBrD,GAAA,KACvBN,IAAYA,EAASS,cAI1Bb,EAAc+B,OAAQ,EAAA,GALA,mBAQlBiC,EAA2BtD,GAAA,KAO3B,GAACN,IAAYA,EAASS,cAMtBN,EAAqBwB,MAIrB,IAGFb,EAAgBZ,EAAgByB,aACzBjB,GACCC,QAAAC,KAAK,WAAYF,EAAK,IAtBP,6BA2BrBY,EAAA1B,GAAgB4B,IAChB,IAACA,GAAUzB,EACT,IACFA,EAAiBoC,UACEpC,EAAA,WACZW,GACCC,QAAAC,KAAK,uBAAwBF,EAAK,CAC5C,IAKJmD,GAAY,KAMV,GALIzD,IACFW,aAAaX,GACCA,EAAA,MAGZL,EACE,IACFA,EAAiBoC,UACEpC,EAAA,WACZW,GACCC,QAAAC,KAAK,uBAAwBF,EAAK,CAC5C,IAISoD,EAAA,CACXJ,iBACAC;;;;;;;;"}
@@ -1,6 +1,6 @@
1
- import{defineComponent as e,ref as t,onBeforeMount as l,nextTick as a,watch as r,resolveComponent as d,createElementBlock as u,openBlock as i,normalizeStyle as n,createCommentVNode as o,createElementVNode as s,createVNode as c,toDisplayString as p,createBlock as f,renderSlot as y,withCtx as h,unref as m,resolveDynamicComponent as k,normalizeProps as v,mergeProps as x,guardReactiveProps as g,createTextVNode as q}from"vue";import{ElTree as C}from"element-plus";import"../../../functions/index.mjs";import b from"../../../functions/modules/uitls.mjs";var V=Object.defineProperty,w=(e,t)=>V(e,"name",{value:t,configurable:!0});const A={key:0,class:"title sle"},K={class:"flex gap-10"},S={key:1,class:"el-tree-node__label"};var T=e({name:"ZnTreeFilter",__name:"index",props:{requestApi:{type:Function,required:!1},requestParams:{required:!1,default:w((()=>({})),"default")},data:{type:Array,required:!1},title:{type:String,required:!1},id:{type:String,required:!1,default:"id"},label:{type:String,required:!1,default:"label"},multiple:{type:Boolean,required:!1,default:!1},defaultValue:{required:!1},transformDataToTree:{type:Boolean,required:!1,default:!0},width:{type:String,required:!1,default:"460px"},height:{type:String,required:!1,default:"calc(100vh - 200px)"},defaultExpandAll:{type:Boolean,required:!1,default:!0},defaultExpandKeys:{type:Array,required:!1,default:w((()=>[]),"default")},expandOnClickNode:{type:Boolean,required:!1,default:!1},render:{type:Function,required:!1},showFilterText:{type:Boolean,required:!1,default:!0}},emits:["dataReady","change"],setup(e,{expose:V,emit:T}){const _=e,B={children:"children",label:_.label},N=t(),F=t([]),$=t([]),D=T,E=t(),L=w((()=>{_.multiple?E.value=Array.isArray(_.defaultValue)?_.defaultValue:[_.defaultValue]:E.value="string"==typeof _.defaultValue?_.defaultValue:""}),"setSelected"),O=w((async()=>{if(_.requestApi){const e=await _.requestApi(_.requestParams);let t=e.result.list??e.result;t.map(((e,t)=>{e.id||(e.id=`${e.treeLevel}-${t}`)})),_.transformDataToTree?F.value=b.treeListUtil(t):F.value=t,$.value=[...F.value],D("dataReady",t)}}),"getList");l((async()=>{await O(),!_.multiple&&_.defaultValue&&(Z(_.defaultValue),await a(),N.value?.$el.querySelector(".is-current").firstChild.click())})),r((()=>_.requestParams),(e=>{e&&O()}),{deep:!0}),r((()=>_.defaultValue),(()=>a((()=>L()))),{deep:!0,immediate:!0}),r((()=>_.data),(()=>{_.data?.length&&(F.value=_.data,$.value=[..._.data])}),{deep:!0,immediate:!0});const P=t("");r(P,(e=>{N.value.filter(e)}));const R=w(((e,t,l)=>{if(!e)return!0;let a=l.parent,r=[l.label],d=1;for(;d<l.level;)r=[...r,a.label],a=a.parent,d++;return r.some((t=>-1!==t.indexOf(e)))}),"filterNode"),j=w((e=>{_.multiple||D("change",e[_.id],e)}),"handleNodeClick"),U=w((()=>{D("change",N.value?.getCheckedNodes())}),"handleCheckChange"),z=w((e=>{N.value?.setCheckedKeys(e)}),"setCheckedKeys"),Z=w((e=>{N.value?.setCurrentKey(e)}),"setCurrentKey");return V({treeData:F,treeAllData:$,treeRef:N,setCheckedKeys:z,getList:O,setCurrentKey:Z}),(t,l)=>{const a=d("el-input"),r=d("el-scrollbar");return i(),u("div",{class:"zn-tree-filter",style:n({width:e.width,height:e.height})},[e.title?(i(),u("h4",A,p(e.title),1
2
- /* TEXT */)):o("v-if",!0),s("div",K,[e.showFilterText?(i(),f(a,{key:0,modelValue:P.value,"onUpdate:modelValue":l[0]||(l[0]=e=>P.value=e),placeholder:"输入关键字进行过滤",clearable:""},null,8,["modelValue"])):o("v-if",!0),y(t.$slots,"toolButton")]),c(r,{style:n({height:e.title?"calc(100% - 95px)":"calc(100% - 56px)"})},{default:h((()=>[c(m(C),{ref_key:"treeRef",ref:N,"default-expand-all":e.defaultExpandAll,"node-key":e.id,data:e.multiple?F.value:$.value,"show-checkbox":e.multiple,"check-strictly":!1,"current-node-key":e.multiple?"":E.value,"highlight-current":!e.multiple,"expand-on-click-node":e.expandOnClickNode,"check-on-click-node":e.multiple,props:B,"filter-node-method":R,"default-checked-keys":e.multiple?E.value:[],"default-expanded-keys":e.defaultExpandKeys,onNodeClick:j,onCheck:U},{default:h((e=>[_.render?(i(),f(k(_.render),v(x({key:0},e)),null,16
3
- /* FULL_PROPS */)):(i(),u("span",S,[y(t.$slots,"default",v(g(e)),(()=>[q(p(e.node.label),1
1
+ import{defineComponent as e,ref as t,onBeforeMount as l,nextTick as a,watch as r,resolveComponent as d,createElementBlock as u,openBlock as i,normalizeStyle as n,createCommentVNode as s,createElementVNode as o,renderSlot as c,createVNode as p,toDisplayString as f,createBlock as y,withCtx as h,unref as m,resolveDynamicComponent as k,normalizeProps as v,mergeProps as x,guardReactiveProps as g,createTextVNode as q}from"vue";import{ElTree as C}from"element-plus";import"../../../functions/index.mjs";import b from"../../../functions/modules/uitls.mjs";var V=Object.defineProperty,w=(e,t)=>V(e,"name",{value:t,configurable:!0});const A={key:0,class:"title sle"},K={class:"flex gap-10"},S={key:1,class:"el-tree-node__label"};var T=e({name:"ZnTreeFilter",__name:"index",props:{requestApi:{type:Function,required:!1},requestParams:{required:!1,default:w((()=>({})),"default")},data:{type:Array,required:!1},title:{type:String,required:!1},id:{type:String,required:!1,default:"id"},label:{type:String,required:!1,default:"label"},multiple:{type:Boolean,required:!1,default:!1},defaultValue:{required:!1},transformDataToTree:{type:Boolean,required:!1,default:!0},width:{type:String,required:!1,default:"460px"},height:{type:String,required:!1,default:"calc(100vh - 200px)"},defaultExpandAll:{type:Boolean,required:!1,default:!0},defaultExpandKeys:{type:Array,required:!1,default:w((()=>[]),"default")},expandOnClickNode:{type:Boolean,required:!1,default:!1},render:{type:Function,required:!1},showFilterText:{type:Boolean,required:!1,default:!0}},emits:["dataReady","change"],setup(e,{expose:V,emit:T}){const _=e,B={children:"children",label:_.label},N=t(),$=t([]),F=t([]),D=T,E=t(),L=w((()=>{_.multiple?E.value=Array.isArray(_.defaultValue)?_.defaultValue:[_.defaultValue]:E.value="string"==typeof _.defaultValue?_.defaultValue:""}),"setSelected"),O=w((async()=>{if(_.requestApi){const e=await _.requestApi(_.requestParams);let t=e.result.list??e.result;t.map(((e,t)=>{e.id||(e.id=`${e.treeLevel}-${t}`)})),_.transformDataToTree?$.value=b.treeListUtil(t):$.value=t,F.value=[...$.value],D("dataReady",t)}}),"getList");l((async()=>{await O(),!_.multiple&&_.defaultValue&&(H(_.defaultValue),await a(),N.value?.$el.querySelector(".is-current").firstChild.click())})),r((()=>_.requestParams),(e=>{e&&O()}),{deep:!0}),r((()=>_.defaultValue),(()=>a((()=>L()))),{deep:!0,immediate:!0}),r((()=>_.data),(()=>{_.data?.length&&($.value=_.data,F.value=[..._.data])}),{deep:!0,immediate:!0});const P=t("");r(P,(e=>{N.value.filter(e)}));const R=w(((e,t,l)=>{if(!e)return!0;let a=l.parent,r=[l.label],d=1;for(;d<l.level;)r=[...r,a.label],a=a.parent,d++;return r.some((t=>-1!==t.indexOf(e)))}),"filterNode"),j=w((e=>{_.multiple||D("change",e[_.id],e)}),"handleNodeClick"),U=w((()=>{D("change",N.value?.getCheckedNodes())}),"handleCheckChange"),z=w((e=>{N.value?.setCheckedKeys(e)}),"setCheckedKeys"),H=w((e=>{N.value?.setCurrentKey(e)}),"setCurrentKey");return V({treeData:$,treeAllData:F,treeRef:N,setCheckedKeys:z,getList:O,setCurrentKey:H}),(t,l)=>{const a=d("el-input"),r=d("el-scrollbar");return i(),u("div",{class:"zn-tree-filter",style:n({width:e.width,height:e.height})},[e.title?(i(),u("h4",A,f(e.title),1
2
+ /* TEXT */)):s("v-if",!0),o("div",K,[e.showFilterText?(i(),y(a,{key:0,modelValue:P.value,"onUpdate:modelValue":l[0]||(l[0]=e=>P.value=e),placeholder:"输入关键字进行过滤",clearable:""},null,8,["modelValue"])):s("v-if",!0),c(t.$slots,"toolButton")]),c(t.$slots,"treeHeader"),p(r,{style:n({height:e.title?"calc(100% - 95px)":"calc(100% - 56px)"})},{default:h((()=>[p(m(C),{ref_key:"treeRef",ref:N,"default-expand-all":e.defaultExpandAll,"node-key":e.id,data:e.multiple?$.value:F.value,"show-checkbox":e.multiple,"check-strictly":!1,"current-node-key":e.multiple?"":E.value,"highlight-current":!e.multiple,"expand-on-click-node":e.expandOnClickNode,"check-on-click-node":e.multiple,props:B,"filter-node-method":R,"default-checked-keys":e.multiple?E.value:[],"default-expanded-keys":e.defaultExpandKeys,onNodeClick:j,onCheck:U},{default:h((e=>[_.render?(i(),y(k(_.render),v(x({key:0},e)),null,16
3
+ /* FULL_PROPS */)):(i(),u("span",S,[c(t.$slots,"default",v(g(e)),(()=>[q(f(e.node.label),1
4
4
  /* TEXT */)]))]))])),_:3
5
5
  /* FORWARDED */},8,["default-expand-all","node-key","data","show-checkbox","current-node-key","highlight-current","expand-on-click-node","check-on-click-node","default-checked-keys","default-expanded-keys"])])),_:3
6
6
  /* FORWARDED */},8,["style"])],4
@@ -1 +1 @@
1
- {"version":3,"file":"index.vue2.mjs","sources":["../../../../../../packages/components/znTreeFilter/src/index.vue"],"sourcesContent":["<template>\n <div class=\"zn-tree-filter\" :style=\"{ width, height }\">\n <h4 v-if=\"title\" class=\"title sle\">\n {{ title }}\n </h4>\n <div class=\"flex gap-10\">\n <el-input v-if=\"showFilterText\" v-model=\"filterText\" placeholder=\"输入关键字进行过滤\" clearable />\n <slot name=\"toolButton\"></slot>\n </div>\n <el-scrollbar :style=\"{ height: title ? `calc(100% - 95px)` : `calc(100% - 56px)` }\">\n <el-tree\n ref=\"treeRef\"\n :default-expand-all=\"defaultExpandAll\"\n :node-key=\"id\"\n :data=\"multiple ? treeData : treeAllData\"\n :show-checkbox=\"multiple\"\n :check-strictly=\"false\"\n :current-node-key=\"!multiple ? selected : ''\"\n :highlight-current=\"!multiple\"\n :expand-on-click-node=\"expandOnClickNode\"\n :check-on-click-node=\"multiple\"\n :props=\"defaultProps\"\n :filter-node-method=\"filterNode\"\n :default-checked-keys=\"multiple ? selected : []\"\n :default-expanded-keys=\"defaultExpandKeys\"\n @node-click=\"handleNodeClick\"\n @check=\"handleCheckChange\">\n <template #default=\"scope\">\n <component v-if=\"props.render\" :is=\"props.render\" v-bind=\"scope\" />\n <span v-else class=\"el-tree-node__label\">\n <slot v-bind=\"scope\">\n {{ scope.node.label }}\n </slot>\n </span>\n </template>\n </el-tree>\n </el-scrollbar>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTreeFilter\">\n import { nextTick, onBeforeMount, ref, watch, VNode } from 'vue'\n\n import { ElTree } from 'element-plus'\n import { utils } from '../../../functions'\n defineOptions({ name: 'ZnTreeFilter' })\n // 接收父组件参数并设置默认值\n interface TreeFilterProps {\n requestApi?: (data?: any) => Promise<any> /** 请求分类数据的 api ==> 非必传 */\n requestParams?: any /** 请求分类数据的参数 ==> 非必传 */\n data?: { [key: string]: any }[] /** 分类数据,如果有分类数据,则不会执行 api 请求 ==> 非必传 */\n title?: string /** treeFilter 标题 ==> 非必传 */\n id?: string /** 选择的id ==> 非必传,默认为 “id” */\n label?: string /** 显示的label ==> 非必传,默认为 “label” */\n multiple?: boolean /** 是否为多选 ==> 非必传,默认为 false */\n defaultValue?: any /** 默认选中的值 ==> 非必传 */\n transformDataToTree?: boolean /** 是否将数据转换为树形结构 ==> 非必传,默认为 true */\n width?: string /** 默认460px */\n height?: string /** 默认calc(100vh - 200px) */\n defaultExpandAll?: boolean /** 默认全部展开 */\n defaultExpandKeys?: any[]\n expandOnClickNode?: boolean\n render?: (scope: any) => VNode\n showFilterText?: boolean /** 是否显示过滤文本框 ==> 非必传,默认为 true */\n }\n const props = defineProps({\n requestApi: { type: Function, required: false },\n requestParams: { required: false, default: () => ({}) },\n data: { type: Array, required: false },\n title: { type: String, required: false },\n id: { type: String, required: false, default: 'id' },\n label: { type: String, required: false, default: 'label' },\n multiple: { type: Boolean, required: false, default: false },\n defaultValue: { required: false },\n transformDataToTree: { type: Boolean, required: false, default: true },\n width: { type: String, required: false, default: '460px' },\n height: { type: String, required: false, default: 'calc(100vh - 200px)' },\n defaultExpandAll: { type: Boolean, required: false, default: true },\n defaultExpandKeys: { type: Array, required: false, default: () => [] },\n expandOnClickNode: { type: Boolean, required: false, default: false },\n render: { type: Function, required: false },\n showFilterText: { type: Boolean, required: false, default: true }\n})\n\n const defaultProps = {\n children: 'children',\n label: props.label\n }\n\n const treeRef = ref<InstanceType<typeof ElTree>>()\n const treeData = ref<{ [key: string]: any }[]>([])\n const treeAllData = ref<{ [key: string]: any }[]>([])\n\n const emits = defineEmits(['dataReady', 'change'])\n\n const selected = ref()\n const setSelected = () => {\n if (props.multiple) selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]\n else selected.value = typeof props.defaultValue === 'string' ? props.defaultValue : ''\n }\n\n const getList = async () => {\n if (props.requestApi) {\n const res = await props.requestApi!(props.requestParams)\n let list = res.result.list ?? res.result\n // 后端说第六层没有id,所以补上 转树形的时候要用到\n list.map((item: any, index: number) => {\n if (!item.id) {\n item.id = `${item.treeLevel}-${index}`\n }\n })\n if (props.transformDataToTree) {\n treeData.value = utils.treeListUtil(list)\n } else {\n treeData.value = list\n }\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...treeData.value]\n treeAllData.value = [...treeData.value]\n emits('dataReady', list)\n }\n }\n\n onBeforeMount(async () => {\n await getList()\n if (!props.multiple && props.defaultValue) {\n setCurrentKey(props.defaultValue)\n await nextTick()\n treeRef.value?.$el.querySelector('.is-current').firstChild.click()\n }\n })\n\n watch(\n () => props.requestParams,\n (val) => {\n if (val) {\n getList()\n }\n },\n {\n deep: true\n }\n )\n\n // 使用 nextTick 防止打包后赋值不生效,开发环境是正常的\n watch(\n () => props.defaultValue,\n () => nextTick(() => setSelected()),\n { deep: true, immediate: true }\n )\n\n watch(\n () => props.data,\n () => {\n if (props.data?.length) {\n treeData.value = props.data\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...props.data]\n treeAllData.value = [...props.data]\n }\n },\n { deep: true, immediate: true }\n )\n\n const filterText = ref('')\n watch(filterText, (val) => {\n treeRef.value!.filter(val)\n })\n\n // 过滤\n const filterNode = (value: string, data: { [key: string]: any }, node: any) => {\n if (!value) return true\n let parentNode = node.parent\n let labels = [node.label]\n let level = 1\n while (level < node.level) {\n labels = [...labels, parentNode.label]\n parentNode = parentNode.parent\n level++\n }\n return labels.some((label) => label.indexOf(value) !== -1)\n }\n\n // emit\n // const emit = defineEmits<{\n // change: [value: any],\n // }>()\n\n // 单选\n const handleNodeClick = (data: { [key: string]: any }) => {\n if (props.multiple) return\n emits('change', data[props.id], data)\n }\n\n // 多选\n const handleCheckChange = () => {\n emits('change', treeRef.value?.getCheckedNodes())\n }\n\n const setCheckedKeys = (keys) => {\n treeRef.value?.setCheckedKeys(keys)\n }\n\n const setCurrentKey = (key) => {\n treeRef.value?.setCurrentKey(key)\n }\n\n // 暴露给父组件使用\n defineExpose({ treeData, treeAllData, treeRef, setCheckedKeys, getList, setCurrentKey })\n</script>\n"],"names":["props","__props","defaultProps","children","label","treeRef","ref","treeData","treeAllData","emits","__emit","selected","setSelected","__name","multiple","value","Array","isArray","defaultValue","getList","async","requestApi","res","requestParams","list","result","map","item","index","id","treeLevel","transformDataToTree","utils","treeListUtil","onBeforeMount","setCurrentKey","nextTick","$el","querySelector","firstChild","click","watch","val","deep","immediate","data","length","filterText","filter","filterNode","node","parentNode","parent","labels","level","some","indexOf","handleNodeClick","handleCheckChange","getCheckedNodes","setCheckedKeys","keys","key","__expose"],"mappings":"6jDAiEE,MAAMA,EAAQC,EAmBRC,EAAe,CACnBC,SAAU,WACVC,MAAOJ,EAAMI,OAGTC,EAAUC,IACVC,EAAWD,EAA8B,IACzCE,EAAcF,EAA8B,IAE5CG,EAAQC,EAERC,EAAWL,IACXM,EAAoBC,GAAA,KACpBb,EAAMc,SAAmBH,EAAAI,MAAQC,MAAMC,QAAQjB,EAAMkB,cAAgBlB,EAAMkB,aAAe,CAAClB,EAAMkB,gBACvFH,MAAsC,iBAAvBf,EAAMkB,aAA4BlB,EAAMkB,aAAe,EAAA,GAFlE,eAKdC,EAAsBN,GAAAO,UAC1B,GAAIpB,EAAMqB,WAAY,CACpB,MAAMC,QAAYtB,EAAMqB,WAAYrB,EAAMuB,eAC1C,IAAIC,EAAOF,EAAIG,OAAOD,MAAQF,EAAIG,OAE7BD,EAAAE,KAAI,CAACC,EAAWC,KACdD,EAAKE,KACRF,EAAKE,GAAK,GAAGF,EAAKG,aAAaF,IAAK,IAGpC5B,EAAM+B,oBACCxB,EAAAQ,MAAQiB,EAAMC,aAAaT,GAEpCjB,EAASQ,MAAQS,EAGnBhB,EAAYO,MAAQ,IAAIR,EAASQ,OACjCN,EAAM,YAAae,EAAI,IAjBX,WAqBhBU,GAAcd,gBACND,KACDnB,EAAMc,UAAYd,EAAMkB,eAC3BiB,EAAcnC,EAAMkB,oBACdkB,IACN/B,EAAQU,OAAOsB,IAAIC,cAAc,eAAeC,WAAWC,QAAM,IAIrEC,GACE,IAAMzC,EAAMuB,gBACXmB,IACKA,GACMvB,GAAA,GAGZ,CACEwB,MAAM,IAKVF,GACE,IAAMzC,EAAMkB,eACZ,IAAMkB,GAAS,IAAMxB,OACrB,CAAE+B,MAAM,EAAMC,WAAW,IAG3BH,GACE,IAAMzC,EAAM6C,OACZ,KACM7C,EAAM6C,MAAMC,SACdvC,EAASQ,MAAQf,EAAM6C,KAEvBrC,EAAYO,MAAQ,IAAIf,EAAM6C,MAAI,GAGtC,CAAEF,MAAM,EAAMC,WAAW,IAGrB,MAAAG,EAAazC,EAAI,IACjBmC,EAAAM,GAAaL,IACTrC,EAAAU,MAAOiC,OAAON,EAAG,IAI3B,MAAMO,EAAapC,GAAA,CAACE,EAAe8B,EAA8BK,KAC3D,IAACnC,EAAc,OAAA,EACnB,IAAIoC,EAAaD,EAAKE,OAClBC,EAAS,CAACH,EAAK9C,OACfkD,EAAQ,EACL,KAAAA,EAAQJ,EAAKI,OAClBD,EAAS,IAAIA,EAAQF,EAAW/C,OAChC+C,EAAaA,EAAWC,OACxBE,IAEK,OAAAD,EAAOE,MAAMnD,IAAqC,IAA3BA,EAAMoD,QAAQzC,IAAa,GAVxC,cAmBb0C,KAAmBZ,IACnB7C,EAAMc,UACVL,EAAM,SAAUoC,EAAK7C,EAAM6B,IAAKgB,EAAI,GAFd,mBAMlBa,EAA0B7C,GAAA,KAC9BJ,EAAM,SAAUJ,EAAQU,OAAO4C,kBAAiB,GADxB,qBAIpBC,KAAkBC,IACdxD,EAAAU,OAAO6C,eAAeC,EAAI,GADb,kBAIjB1B,KAAiB2B,IACbzD,EAAAU,OAAOoB,cAAc2B,EAAG,GADZ,wBAKtBC,EAAa,CAAExD,WAAUC,cAAaH,UAASuD,iBAAgBzC,UAASgB;;;;;;"}
1
+ {"version":3,"file":"index.vue2.mjs","sources":["../../../../../../packages/components/znTreeFilter/src/index.vue"],"sourcesContent":["<template>\n <div class=\"zn-tree-filter\" :style=\"{ width, height }\">\n <h4 v-if=\"title\" class=\"title sle\">\n {{ title }}\n </h4>\n <div class=\"flex gap-10\">\n <el-input v-if=\"showFilterText\" v-model=\"filterText\" placeholder=\"输入关键字进行过滤\" clearable />\n <slot name=\"toolButton\"></slot>\n </div>\n <slot name=\"treeHeader\"></slot>\n <el-scrollbar :style=\"{ height: title ? `calc(100% - 95px)` : `calc(100% - 56px)` }\">\n <el-tree\n ref=\"treeRef\"\n :default-expand-all=\"defaultExpandAll\"\n :node-key=\"id\"\n :data=\"multiple ? treeData : treeAllData\"\n :show-checkbox=\"multiple\"\n :check-strictly=\"false\"\n :current-node-key=\"!multiple ? selected : ''\"\n :highlight-current=\"!multiple\"\n :expand-on-click-node=\"expandOnClickNode\"\n :check-on-click-node=\"multiple\"\n :props=\"defaultProps\"\n :filter-node-method=\"filterNode\"\n :default-checked-keys=\"multiple ? selected : []\"\n :default-expanded-keys=\"defaultExpandKeys\"\n @node-click=\"handleNodeClick\"\n @check=\"handleCheckChange\">\n <template #default=\"scope\">\n <component v-if=\"props.render\" :is=\"props.render\" v-bind=\"scope\" />\n <span v-else class=\"el-tree-node__label\">\n <slot v-bind=\"scope\">\n {{ scope.node.label }}\n </slot>\n </span>\n </template>\n </el-tree>\n </el-scrollbar>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTreeFilter\">\n import { nextTick, onBeforeMount, ref, watch, VNode } from 'vue'\n\n import { ElTree } from 'element-plus'\n import { utils } from '../../../functions'\n defineOptions({ name: 'ZnTreeFilter' })\n // 接收父组件参数并设置默认值\n interface TreeFilterProps {\n requestApi?: (data?: any) => Promise<any> /** 请求分类数据的 api ==> 非必传 */\n requestParams?: any /** 请求分类数据的参数 ==> 非必传 */\n data?: { [key: string]: any }[] /** 分类数据,如果有分类数据,则不会执行 api 请求 ==> 非必传 */\n title?: string /** treeFilter 标题 ==> 非必传 */\n id?: string /** 选择的id ==> 非必传,默认为 “id” */\n label?: string /** 显示的label ==> 非必传,默认为 “label” */\n multiple?: boolean /** 是否为多选 ==> 非必传,默认为 false */\n defaultValue?: any /** 默认选中的值 ==> 非必传 */\n transformDataToTree?: boolean /** 是否将数据转换为树形结构 ==> 非必传,默认为 true */\n width?: string /** 默认460px */\n height?: string /** 默认calc(100vh - 200px) */\n defaultExpandAll?: boolean /** 默认全部展开 */\n defaultExpandKeys?: any[]\n expandOnClickNode?: boolean\n render?: (scope: any) => VNode\n showFilterText?: boolean /** 是否显示过滤文本框 ==> 非必传,默认为 true */\n }\n const props = defineProps({\n requestApi: { type: Function, required: false },\n requestParams: { required: false, default: () => ({}) },\n data: { type: Array, required: false },\n title: { type: String, required: false },\n id: { type: String, required: false, default: 'id' },\n label: { type: String, required: false, default: 'label' },\n multiple: { type: Boolean, required: false, default: false },\n defaultValue: { required: false },\n transformDataToTree: { type: Boolean, required: false, default: true },\n width: { type: String, required: false, default: '460px' },\n height: { type: String, required: false, default: 'calc(100vh - 200px)' },\n defaultExpandAll: { type: Boolean, required: false, default: true },\n defaultExpandKeys: { type: Array, required: false, default: () => [] },\n expandOnClickNode: { type: Boolean, required: false, default: false },\n render: { type: Function, required: false },\n showFilterText: { type: Boolean, required: false, default: true }\n})\n\n const defaultProps = {\n children: 'children',\n label: props.label\n }\n\n const treeRef = ref<InstanceType<typeof ElTree>>()\n const treeData = ref<{ [key: string]: any }[]>([])\n const treeAllData = ref<{ [key: string]: any }[]>([])\n\n const emits = defineEmits(['dataReady', 'change'])\n\n const selected = ref()\n const setSelected = () => {\n if (props.multiple) selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]\n else selected.value = typeof props.defaultValue === 'string' ? props.defaultValue : ''\n }\n\n const getList = async () => {\n if (props.requestApi) {\n const res = await props.requestApi!(props.requestParams)\n let list = res.result.list ?? res.result\n // 后端说第六层没有id,所以补上 转树形的时候要用到\n list.map((item: any, index: number) => {\n if (!item.id) {\n item.id = `${item.treeLevel}-${index}`\n }\n })\n if (props.transformDataToTree) {\n treeData.value = utils.treeListUtil(list)\n } else {\n treeData.value = list\n }\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...treeData.value]\n treeAllData.value = [...treeData.value]\n emits('dataReady', list)\n }\n }\n\n onBeforeMount(async () => {\n await getList()\n if (!props.multiple && props.defaultValue) {\n setCurrentKey(props.defaultValue)\n await nextTick()\n treeRef.value?.$el.querySelector('.is-current').firstChild.click()\n }\n })\n\n watch(\n () => props.requestParams,\n (val) => {\n if (val) {\n getList()\n }\n },\n {\n deep: true\n }\n )\n\n // 使用 nextTick 防止打包后赋值不生效,开发环境是正常的\n watch(\n () => props.defaultValue,\n () => nextTick(() => setSelected()),\n { deep: true, immediate: true }\n )\n\n watch(\n () => props.data,\n () => {\n if (props.data?.length) {\n treeData.value = props.data\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...props.data]\n treeAllData.value = [...props.data]\n }\n },\n { deep: true, immediate: true }\n )\n\n const filterText = ref('')\n watch(filterText, (val) => {\n treeRef.value!.filter(val)\n })\n\n // 过滤\n const filterNode = (value: string, data: { [key: string]: any }, node: any) => {\n if (!value) return true\n let parentNode = node.parent\n let labels = [node.label]\n let level = 1\n while (level < node.level) {\n labels = [...labels, parentNode.label]\n parentNode = parentNode.parent\n level++\n }\n return labels.some((label) => label.indexOf(value) !== -1)\n }\n\n // emit\n // const emit = defineEmits<{\n // change: [value: any],\n // }>()\n\n // 单选\n const handleNodeClick = (data: { [key: string]: any }) => {\n if (props.multiple) return\n emits('change', data[props.id], data)\n }\n\n // 多选\n const handleCheckChange = () => {\n emits('change', treeRef.value?.getCheckedNodes())\n }\n\n const setCheckedKeys = (keys) => {\n treeRef.value?.setCheckedKeys(keys)\n }\n\n const setCurrentKey = (key) => {\n treeRef.value?.setCurrentKey(key)\n }\n\n // 暴露给父组件使用\n defineExpose({ treeData, treeAllData, treeRef, setCheckedKeys, getList, setCurrentKey })\n</script>\n"],"names":["props","__props","defaultProps","children","label","treeRef","ref","treeData","treeAllData","emits","__emit","selected","setSelected","__name","multiple","value","Array","isArray","defaultValue","getList","async","requestApi","res","requestParams","list","result","map","item","index","id","treeLevel","transformDataToTree","utils","treeListUtil","onBeforeMount","setCurrentKey","nextTick","$el","querySelector","firstChild","click","watch","val","deep","immediate","data","length","filterText","filter","filterNode","node","parentNode","parent","labels","level","some","indexOf","handleNodeClick","handleCheckChange","getCheckedNodes","setCheckedKeys","keys","key","__expose"],"mappings":"6jDAkEE,MAAMA,EAAQC,EAmBRC,EAAe,CACnBC,SAAU,WACVC,MAAOJ,EAAMI,OAGTC,EAAUC,IACVC,EAAWD,EAA8B,IACzCE,EAAcF,EAA8B,IAE5CG,EAAQC,EAERC,EAAWL,IACXM,EAAoBC,GAAA,KACpBb,EAAMc,SAAmBH,EAAAI,MAAQC,MAAMC,QAAQjB,EAAMkB,cAAgBlB,EAAMkB,aAAe,CAAClB,EAAMkB,gBACvFH,MAAsC,iBAAvBf,EAAMkB,aAA4BlB,EAAMkB,aAAe,EAAA,GAFlE,eAKdC,EAAsBN,GAAAO,UAC1B,GAAIpB,EAAMqB,WAAY,CACpB,MAAMC,QAAYtB,EAAMqB,WAAYrB,EAAMuB,eAC1C,IAAIC,EAAOF,EAAIG,OAAOD,MAAQF,EAAIG,OAE7BD,EAAAE,KAAI,CAACC,EAAWC,KACdD,EAAKE,KACRF,EAAKE,GAAK,GAAGF,EAAKG,aAAaF,IAAK,IAGpC5B,EAAM+B,oBACCxB,EAAAQ,MAAQiB,EAAMC,aAAaT,GAEpCjB,EAASQ,MAAQS,EAGnBhB,EAAYO,MAAQ,IAAIR,EAASQ,OACjCN,EAAM,YAAae,EAAI,IAjBX,WAqBhBU,GAAcd,gBACND,KACDnB,EAAMc,UAAYd,EAAMkB,eAC3BiB,EAAcnC,EAAMkB,oBACdkB,IACN/B,EAAQU,OAAOsB,IAAIC,cAAc,eAAeC,WAAWC,QAAM,IAIrEC,GACE,IAAMzC,EAAMuB,gBACXmB,IACKA,GACMvB,GAAA,GAGZ,CACEwB,MAAM,IAKVF,GACE,IAAMzC,EAAMkB,eACZ,IAAMkB,GAAS,IAAMxB,OACrB,CAAE+B,MAAM,EAAMC,WAAW,IAG3BH,GACE,IAAMzC,EAAM6C,OACZ,KACM7C,EAAM6C,MAAMC,SACdvC,EAASQ,MAAQf,EAAM6C,KAEvBrC,EAAYO,MAAQ,IAAIf,EAAM6C,MAAI,GAGtC,CAAEF,MAAM,EAAMC,WAAW,IAGrB,MAAAG,EAAazC,EAAI,IACjBmC,EAAAM,GAAaL,IACTrC,EAAAU,MAAOiC,OAAON,EAAG,IAI3B,MAAMO,EAAapC,GAAA,CAACE,EAAe8B,EAA8BK,KAC3D,IAACnC,EAAc,OAAA,EACnB,IAAIoC,EAAaD,EAAKE,OAClBC,EAAS,CAACH,EAAK9C,OACfkD,EAAQ,EACL,KAAAA,EAAQJ,EAAKI,OAClBD,EAAS,IAAIA,EAAQF,EAAW/C,OAChC+C,EAAaA,EAAWC,OACxBE,IAEK,OAAAD,EAAOE,MAAMnD,IAAqC,IAA3BA,EAAMoD,QAAQzC,IAAa,GAVxC,cAmBb0C,KAAmBZ,IACnB7C,EAAMc,UACVL,EAAM,SAAUoC,EAAK7C,EAAM6B,IAAKgB,EAAI,GAFd,mBAMlBa,EAA0B7C,GAAA,KAC9BJ,EAAM,SAAUJ,EAAQU,OAAO4C,kBAAiB,GADxB,qBAIpBC,KAAkBC,IACdxD,EAAAU,OAAO6C,eAAeC,EAAI,GADb,kBAIjB1B,KAAiB2B,IACbzD,EAAAU,OAAOoB,cAAc2B,EAAG,GADZ,wBAKtBC,EAAa,CAAExD,WAAUC,cAAaH,UAASuD,iBAAgBzC,UAASgB;;;;;;"}
package/es/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import o from"./installer.mjs";export{install}from"./installer.mjs";import"./functions/index.mjs";import"./hooks/index.mjs";export{copyText,formatValue,treeListUtil,treeToList}from"./utils/index.mjs";import"./directives/index.mjs";import"./components/index.mjs";import e from"./functions/modules/log.mjs";export{useDialogV2}from"./hooks/useDialogV2/index.mjs";export{useDrawerV2}from"./hooks/useDrawerV2/index.mjs";export{closeAllDrawers}from"./hooks/useDrawerV2/src/index.mjs";export{closePopWindowById,closePopWindowByTag,getAllPopWindows,showPopWindow}from"./hooks/usePopWindow/src/index.mjs";export{usePopWindow}from"./hooks/usePopWindow/index.mjs";export{closePopWindowByIdV2,closePopWindowByTagV2,getAllPopWindowsV2,showPopWindowV2}from"./hooks/usePopWindowV2/src/index.mjs";export{usePopWindowV2}from"./hooks/usePopWindowV2/index.mjs";export{useDialog}from"./hooks/useDialog/index.mjs";export{default as ImageViewer}from"./hooks/useImageViewer/src/index.vue2.mjs";export{useImageViewer}from"./hooks/useImageViewer/index.mjs";export{useDrawer}from"./hooks/useDrawer/index.mjs";export{withInstall,withInstallDirectives}from"./utils/install.mjs";export{default as vCopy}from"./directives/modules/copy.mjs";export{default as vDrag}from"./directives/modules/drag.mjs";export{default as vAutoScroll}from"./directives/modules/autoScroll.mjs";export{default as vTooltip}from"./directives/modules/tooltip.mjs";export{default as vConfirm}from"./directives/modules/confirm.mjs";export{default as vCountTo}from"./directives/modules/countTo.mjs";export{default as utils}from"./functions/modules/uitls.mjs";import*as s from"./functions/modules/is.mjs";export{s as is};export{useZnForm}from"./components/znForm/src/hooks/useZnForm.mjs";export{useZnFormV2}from"./components/znFormV2/src/hooks/useZnFormV2.mjs";export{useZnSearch}from"./components/znSearch/src/hooks/useProSearch.mjs";export{ZnChart}from"./components/znChart/index.mjs";export{ZnCountTo}from"./components/znCountTo/index.mjs";export{default as ZnFormItem}from"./components/znForm/src/components/ZnFormItem.vue2.mjs";export{ZnForm}from"./components/znForm/index.mjs";export{batchExecute,camelCaseToHyphen,checkFeatureSupport,createUniqueId,debounce,delay,executeInIdle,getElementOffsetTop,getMemoryUsage,getObjectHash,isDeepEqual,isElementInViewport,isShallowEqual,throttle}from"./components/znFormV2/src/helper/index.mjs";export{default as ZnFormV2Item}from"./components/znFormV2/src/components/ZnFormV2Item.vue2.mjs";export{ZnFormV2}from"./components/znFormV2/index.mjs";export{ZnGrid,ZnGridItem}from"./components/znGrid/index.mjs";export{ZnNumberScroll}from"./components/znNumberScroll/index.mjs";export{ZnSearch}from"./components/znSearch/index.mjs";export{ZnTable}from"./components/znTable/index.mjs";export{ZnTest}from"./components/znTest/index.mjs";export{ZnTimeline}from"./components/znTimeLine/index.mjs";export{ZnTreeFilter}from"./components/znTreeFilter/index.mjs";export{ZnTreeSelect}from"./components/znTreeSelect/index.mjs";export{initVXETable,isVXETableInitialized}from"./components/znVirtualTable/src/utils/vxe-setup.mjs";export{ZnWorkGrid}from"./components/znWorkGrid/index.mjs";export{default as ZnVirtualTable}from"./components/znVirtualTable/src/index.vue2.mjs";globalThis.log=e;"function"==typeof globalThis?.log?.success&&globalThis.log.primary("1.1.13","欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/");export{o as default,e as log};
1
+ import o from"./installer.mjs";export{install}from"./installer.mjs";import"./functions/index.mjs";import"./hooks/index.mjs";export{copyText,formatValue,treeListUtil,treeToList}from"./utils/index.mjs";import"./directives/index.mjs";import"./components/index.mjs";import e from"./functions/modules/log.mjs";export{useDialogV2}from"./hooks/useDialogV2/index.mjs";export{useDrawerV2}from"./hooks/useDrawerV2/index.mjs";export{closeAllDrawers}from"./hooks/useDrawerV2/src/index.mjs";export{closePopWindowById,closePopWindowByTag,getAllPopWindows,showPopWindow}from"./hooks/usePopWindow/src/index.mjs";export{usePopWindow}from"./hooks/usePopWindow/index.mjs";export{closePopWindowByIdV2,closePopWindowByTagV2,getAllPopWindowsV2,showPopWindowV2}from"./hooks/usePopWindowV2/src/index.mjs";export{usePopWindowV2}from"./hooks/usePopWindowV2/index.mjs";export{useDialog}from"./hooks/useDialog/index.mjs";export{default as ImageViewer}from"./hooks/useImageViewer/src/index.vue2.mjs";export{useImageViewer}from"./hooks/useImageViewer/index.mjs";export{useDrawer}from"./hooks/useDrawer/index.mjs";export{withInstall,withInstallDirectives}from"./utils/install.mjs";export{default as vCopy}from"./directives/modules/copy.mjs";export{default as vDrag}from"./directives/modules/drag.mjs";export{default as vAutoScroll}from"./directives/modules/autoScroll.mjs";export{default as vTooltip}from"./directives/modules/tooltip.mjs";export{default as vConfirm}from"./directives/modules/confirm.mjs";export{default as vCountTo}from"./directives/modules/countTo.mjs";export{default as utils}from"./functions/modules/uitls.mjs";import*as s from"./functions/modules/is.mjs";export{s as is};export{useZnForm}from"./components/znForm/src/hooks/useZnForm.mjs";export{useZnFormV2}from"./components/znFormV2/src/hooks/useZnFormV2.mjs";export{useZnSearch}from"./components/znSearch/src/hooks/useProSearch.mjs";export{ZnChart}from"./components/znChart/index.mjs";export{ZnCountTo}from"./components/znCountTo/index.mjs";export{default as ZnFormItem}from"./components/znForm/src/components/ZnFormItem.vue2.mjs";export{ZnForm}from"./components/znForm/index.mjs";export{batchExecute,camelCaseToHyphen,checkFeatureSupport,createUniqueId,debounce,delay,executeInIdle,getElementOffsetTop,getMemoryUsage,getObjectHash,isDeepEqual,isElementInViewport,isShallowEqual,throttle}from"./components/znFormV2/src/helper/index.mjs";export{default as ZnFormV2Item}from"./components/znFormV2/src/components/ZnFormV2Item.vue2.mjs";export{ZnFormV2}from"./components/znFormV2/index.mjs";export{ZnGrid,ZnGridItem}from"./components/znGrid/index.mjs";export{ZnNumberScroll}from"./components/znNumberScroll/index.mjs";export{ZnSearch}from"./components/znSearch/index.mjs";export{ZnTable}from"./components/znTable/index.mjs";export{ZnTest}from"./components/znTest/index.mjs";export{ZnTimeline}from"./components/znTimeLine/index.mjs";export{ZnTreeFilter}from"./components/znTreeFilter/index.mjs";export{ZnTreeSelect}from"./components/znTreeSelect/index.mjs";export{initVXETable,isVXETableInitialized}from"./components/znVirtualTable/src/utils/vxe-setup.mjs";export{ZnWorkGrid}from"./components/znWorkGrid/index.mjs";export{default as ZnVirtualTable}from"./components/znVirtualTable/src/index.vue2.mjs";globalThis.log=e;"function"==typeof globalThis?.log?.success&&globalThis.log.primary("1.1.15","欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/");export{o as default,e as log};
2
2
  //# sourceMappingURL=index.mjs.map
package/es/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../../packages/index.ts"],"sourcesContent":["import installer from './installer'\nimport { log } from './functions'\nexport * from './hooks'\nexport * from './utils'\nexport * from './installer'\nexport * from './directives'\nexport * from './functions'\nexport * from './components'\n\nexport default installer\nglobalThis.log = log\nconst version = '1.1.13'\nif (typeof globalThis?.log?.success === 'function') {\n globalThis.log.primary(version, '欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/')\n}\n"],"names":["globalThis","log","success","primary"],"mappings":"sqGAUAA,WAAWC,IAAMA,EAEuB,mBAA7BD,YAAYC,KAAKC,SACfF,WAAAC,IAAIE,QAFD,SAEkB"}
1
+ {"version":3,"file":"index.mjs","sources":["../../../packages/index.ts"],"sourcesContent":["import installer from './installer'\nimport { log } from './functions'\nexport * from './hooks'\nexport * from './utils'\nexport * from './installer'\nexport * from './directives'\nexport * from './functions'\nexport * from './components'\n\nexport default installer\nglobalThis.log = log\nconst version = '1.1.15'\nif (typeof globalThis?.log?.success === 'function') {\n globalThis.log.primary(version, '欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/')\n}\n"],"names":["globalThis","log","success","primary"],"mappings":"sqGAUAA,WAAWC,IAAMA,EAEuB,mBAA7BD,YAAYC,KAAKC,SACfF,WAAAC,IAAIE,QAFD,SAEkB"}
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../assets/notData.png.js"),l=require("sortablejs"),o=require("@element-plus/icons-vue"),a=Object.defineProperty,n=(e,t)=>a(e,"name",{value:t,configurable:!0});const r={class:"col-setting-header",style:{display:"flex","align-items":"center"}},s=["id"],d={style:{display:"flex","align-items":"center"}},i={class:"table-main"};var c=e.defineComponent({__name:"ColSetting",props:{colSetting:{type:Array,required:!0}},emits:["update:colSetting","updateColumns"],setup(a,{expose:c,emit:u}){const m=a,p=u,f=e.ref(!1),h=e.ref();let v=null;const w=e.getCurrentInstance(),g=e.ref([]),C=e.ref(!1);let b=null;const y=n(((e,t)=>{if(w&&!w.isUnmounted)try{p(e,t)}catch(t){console.warn(`发送事件 ${e} 时出错:`,t)}else console.warn("组件已销毁,跳过事件发送",{hasInstance:!!w,isUnmounted:w?.isUnmounted})}),"safeEmit"),V=n((e=>{b&&clearTimeout(b),b=window.setTimeout((()=>{if(w&&!w.isUnmounted)try{const t=JSON.parse(JSON.stringify(e));y("updateColumns",t)}catch(e){console.warn("更新数据时出错:",e)}}),100)}),"debouncedUpdate");e.watch((()=>m.colSetting),(t=>{if(!t||!Array.isArray(t))return;C.value=!0;let l=t.filter((e=>e.isShow));try{g.value=JSON.parse(JSON.stringify(l))}catch(e){console.warn("更新本地列设置时出错:",e),g.value=[...l]}e.nextTick((()=>{setTimeout((()=>{C.value=!1}),50)}))}),{immediate:!0,deep:!0});const N=n((()=>{w&&!w.isUnmounted&&e.nextTick((()=>{if(w&&!w.isUnmounted&&h.value)try{const e=h.value.$el?.querySelector("tbody");if(!e)return void console.warn("未找到tbody元素");if(v){try{v.destroy()}catch(e){console.warn("销毁sortable实例时出错:",e)}v=null}v=l.create(e,{handle:".drag-handle",animation:300,ghostClass:"sortable-ghost",chosenClass:"sortable-chosen",dragClass:"sortable-drag",forceFallback:!0,fallbackTolerance:3,
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("../assets/notData.png.js"),l=require("sortablejs"),o=require("@element-plus/icons-vue"),a=Object.defineProperty,n=(e,t)=>a(e,"name",{value:t,configurable:!0});const r={class:"col-setting-header",style:{display:"flex","align-items":"center"}},s=["id"],d={style:{display:"flex","align-items":"center"}},i={class:"table-main"};var c=e.defineComponent({__name:"ColSetting",props:{colSetting:{type:Array,required:!0}},emits:["update:colSetting","updateColumns"],setup(a,{expose:c,emit:u}){const m=a,p=u,f=e.ref(!1),h=e.ref();let v=null;const w=e.getCurrentInstance(),g=e.ref([]),C=e.ref(!1);let b=null;const y=n(((e,t)=>{if(w&&!w.isUnmounted)try{p(e,t)}catch(t){console.warn(`发送事件 ${e} 时出错:`,t)}else console.warn("组件已销毁,跳过事件发送",{hasInstance:!!w,isUnmounted:w?.isUnmounted})}),"safeEmit"),V=n((e=>{b&&clearTimeout(b),b=window.setTimeout((()=>{if(w&&!w.isUnmounted)try{const t=JSON.parse(JSON.stringify(e));y("updateColumns",t)}catch(e){console.warn("更新数据时出错:",e)}}),100)}),"debouncedUpdate");e.watch((()=>m.colSetting),(t=>{if(t&&Array.isArray(t)){C.value=!0;try{g.value=JSON.parse(JSON.stringify(t))}catch(e){console.warn("更新本地列设置时出错:",e),g.value=[...t]}e.nextTick((()=>{setTimeout((()=>{C.value=!1}),50)}))}}),{immediate:!0,deep:!0});const N=n((()=>{w&&!w.isUnmounted&&e.nextTick((()=>{if(w&&!w.isUnmounted&&h.value)try{const e=h.value.$el?.querySelector("tbody");if(!e)return void console.warn("未找到tbody元素");if(v){try{v.destroy()}catch(e){console.warn("销毁sortable实例时出错:",e)}v=null}v=l.create(e,{handle:".drag-handle",animation:300,ghostClass:"sortable-ghost",chosenClass:"sortable-chosen",dragClass:"sortable-drag",forceFallback:!0,fallbackTolerance:3,
2
2
  // 禁用原生HTML5拖拽
3
3
  dragoverBubble:!1,removeCloneOnHide:!0,onStart:n((e=>{if(!e.item||!e.from||!w||w.isUnmounted)return!1}),"onStart"),onEnd:n((e=>{if(!w||w.isUnmounted)return;if(C.value)return;const{oldIndex:t,newIndex:l}=e;if(void 0!==t&&void 0!==l&&t!==l&&!(t<0||l<0||t>=g.value.length||l>=g.value.length))try{const e=[...g.value],o=e.splice(t,1)[0];o&&(e.splice(l,0,o),g.value=e,V(e))}catch(e){console.warn("拖拽排序时出错:",e)}}),"onEnd")})}catch(e){console.warn("初始化sortable时出错:",e)}}))}),"initSortable"),S=n((()=>{w&&!w.isUnmounted&&(f.value=!0,setTimeout((()=>{w&&!w.isUnmounted&&N()}),200))}),"openColSetting"),U=n((()=>{w&&!w.isUnmounted&&(f.value=!1)}),"closeColSetting"),x=n((()=>{if(w&&!w.isUnmounted&&!C.value)try{V(g.value)}catch(e){console.warn("开关切换时出错:",e)}}),"handleSwitchChange");return e.watch(f,(e=>{if(!e&&v)try{v.destroy(),v=null}catch(e){console.warn("关闭抽屉时销毁sortable实例出错:",e)}})),e.onUnmounted((()=>{if(b&&(clearTimeout(b),b=null),v)try{v.destroy(),v=null}catch(e){console.warn("组件销毁时清理sortable实例出错:",e)}})),c({openColSetting:S,closeColSetting:U}),(l,a)=>{const c=e.resolveComponent("el-icon"),u=e.resolveComponent("el-table-column"),m=e.resolveComponent("el-switch"),p=e.resolveComponent("el-table"),v=e.resolveComponent("el-drawer");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createCommentVNode(" 列设置 "),e.createVNode(v,{modelValue:f.value,"onUpdate:modelValue":a[0]||(a[0]=e=>f.value=e),title:"列设置",size:"450px"},{header:e.withCtx((({close:t,titleId:o,titleClass:a})=>[e.createElementVNode("div",r,[e.createElementVNode("h4",{id:o,class:e.normalizeClass(a)},"列设置",10,s),e.createElementVNode("div",d,[e.createCommentVNode(" 列设置头部插槽 "),e.renderSlot(l.$slots,"colSettingHeader")])])])),default:e.withCtx((()=>[e.createElementVNode("div",i,[e.createVNode(p,{ref_key:"tableRef",ref:h,data:g.value,border:!0,"row-key":"prop","default-expand-all":"","tree-props":{children:"_children"}},{empty:e.withCtx((()=>a[1]||(a[1]=[e.createElementVNode("div",{class:"table-empty"},[e.createElementVNode("img",{src:t.default,alt:"notData"}),e.createElementVNode("div",null,"暂无可配置列")],-1
4
4
  /* HOISTED */)]))),default:e.withCtx((()=>[e.createVNode(u,{align:"center",label:"拖拽",width:"60"},{default:e.withCtx((()=>[e.createVNode(c,{class:"drag-handle",style:{color:"#409eff",cursor:"move"}},{default:e.withCtx((()=>[e.createVNode(e.unref(o.DCaret))])),_:1
@@ -1 +1 @@
1
- {"version":3,"file":"ColSetting.vue2.js","sources":["../../../../../../../packages/components/znTable/src/components/ColSetting.vue"],"sourcesContent":["<template>\n <!-- 列设置 -->\n <el-drawer v-model=\"drawerVisible\" title=\"列设置\" size=\"450px\">\n <!-- 自定义头部 -->\n <template #header=\"{ close, titleId, titleClass }\">\n <div class=\"col-setting-header\" style=\"display: flex; align-items: center;\">\n <h4 :id=\"titleId\" :class=\"titleClass\">列设置</h4>\n <div style=\"display: flex; align-items: center;\">\n <!-- 列设置头部插槽 -->\n <slot name=\"colSettingHeader\"></slot>\n </div>\n </div>\n </template>\n\n <div class=\"table-main\">\n <el-table ref=\"tableRef\" :data=\"localColSetting\" :border=\"true\" row-key=\"prop\" default-expand-all :tree-props=\"{ children: '_children' }\">\n <el-table-column align=\"center\" label=\"拖拽\" width=\"60\">\n <template #default>\n <el-icon class=\"drag-handle\" style=\" color: #409eff;cursor: move\">\n <DCaret />\n </el-icon>\n </template>\n </el-table-column>\n <el-table-column prop=\"label\" align=\"center\" label=\"列名\" />\n <el-table-column v-slot=\"scope\" prop=\"isShow\" align=\"center\" label=\"显示\">\n <el-switch v-model=\"scope.row.isShow\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <el-table-column v-slot=\"scope\" prop=\"sortable\" align=\"center\" label=\"排序\">\n <el-switch v-model=\"scope.row.sortable\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <template #empty>\n <div class=\"table-empty\">\n <img src=\"../assets/notData.png\" alt=\"notData\" />\n <div>暂无可配置列</div>\n </div>\n </template>\n </el-table>\n </div>\n </el-drawer>\n</template>\n\n<script setup lang=\"ts\" name=\"ColSetting\">\n import { nextTick, onMounted, onUnmounted, ref, watch, getCurrentInstance } from 'vue'\n import Sortable from 'sortablejs'\n\n import { ColumnProps } from '../interface'\n import { DCaret } from '@element-plus/icons-vue'\n\n const props = defineProps({\n colSetting: { type: Array, required: true }\n})\n const emit = defineEmits(['update:colSetting', 'updateColumns'])\n\n const drawerVisible = ref<boolean>(false)\n const tableRef = ref()\n let sortableInstance: Sortable | null = null\n\n // 获取当前组件实例,用于检查组件是否已销毁\n const instance = getCurrentInstance()\n\n // 添加本地状态\n const localColSetting = ref<ColumnProps[]>([])\n\n // 添加更新标志,防止循环更新\n const isUpdatingFromParent = ref(false)\n\n // 防抖标志\n let updateTimer: number | null = null\n\n // 安全的emit函数\n const safeEmit = (eventName: string, data: any) => {\n // console.log('safeEmit调用:', {\n // eventName,\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // dataLength: Array.isArray(data) ? data.length : 'not array'\n // })\n\n // 检查组件实例是否还存在\n if (!instance || instance.isUnmounted) {\n console.warn('组件已销毁,跳过事件发送', {\n hasInstance: !!instance,\n isUnmounted: instance?.isUnmounted\n })\n return\n }\n\n try {\n // console.log('正在发送事件:', eventName)\n emit(eventName as any, data)\n // console.log('事件发送成功:', eventName)\n } catch (error) {\n console.warn(`发送事件 ${eventName} 时出错:`, error)\n }\n }\n\n // 防抖的更新函数\n const debouncedUpdate = (data: ColumnProps[]) => {\n // console.log('debouncedUpdate调用:', {\n // hasData: !!data,\n // dataLength: Array.isArray(data) ? data.length : 'not array',\n // hasTimer: !!updateTimer\n // })\n\n if (updateTimer) {\n // console.log('清除之前的定时器')\n clearTimeout(updateTimer)\n }\n\n updateTimer = window.setTimeout(() => {\n // console.log('防抖定时器执行:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('防抖更新时组件已销毁')\n return\n }\n\n try {\n // 深拷贝数据避免响应式问题\n const clonedData = JSON.parse(JSON.stringify(data))\n // console.log('开始发送防抖更新事件')\n // safeEmit('update:colSetting', clonedData) // 移除这个事件,避免双重更新\n safeEmit('updateColumns', clonedData)\n } catch (error) {\n console.warn('更新数据时出错:', error)\n }\n }, 100) // 100ms防抖\n }\n\n // 监听 props 变化,更新本地状态\n watch(\n () => props.colSetting,\n (newVal) => {\n if (!newVal || !Array.isArray(newVal)) return\n\n // 设置标志,表示正在从父组件更新\n isUpdatingFromParent.value = true\n let filterData=newVal.filter(item=>item.isShow)\n try {\n localColSetting.value = JSON.parse(JSON.stringify(filterData))\n } catch (error) {\n console.warn('更新本地列设置时出错:', error)\n localColSetting.value = [...filterData]\n }\n\n // 延迟重置标志,确保本次更新完成\n nextTick(() => {\n setTimeout(() => {\n isUpdatingFromParent.value = false\n }, 50)\n })\n },\n { immediate: true, deep: true }\n )\n\n // 初始化拖拽排序\n const initSortable = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n nextTick(() => {\n if (!instance || instance.isUnmounted || !tableRef.value) {\n return\n }\n\n try {\n const tbody = tableRef.value.$el?.querySelector('tbody')\n if (!tbody) {\n console.warn('未找到tbody元素')\n return\n }\n\n // 销毁之前的实例\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n } catch (error) {\n console.warn('销毁sortable实例时出错:', error)\n }\n sortableInstance = null\n }\n\n sortableInstance = Sortable.create(tbody, {\n handle: '.drag-handle',\n animation: 300,\n ghostClass: 'sortable-ghost',\n chosenClass: 'sortable-chosen',\n dragClass: 'sortable-drag',\n forceFallback: true,\n fallbackTolerance: 3,\n // 禁用原生HTML5拖拽\n dragoverBubble: false,\n removeCloneOnHide: true,\n onStart: (evt) => {\n if (!evt.item || !evt.from || !instance || instance.isUnmounted) {\n return false\n }\n },\n onEnd: (evt) => {\n // 检查组件状态\n if (!instance || instance.isUnmounted) {\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n const { oldIndex, newIndex } = evt\n\n if (oldIndex === undefined || newIndex === undefined || oldIndex === newIndex) {\n return\n }\n\n if (oldIndex < 0 || newIndex < 0 || oldIndex >= localColSetting.value.length || newIndex >= localColSetting.value.length) {\n return\n }\n\n try {\n const newData = [...localColSetting.value]\n const movedItem = newData.splice(oldIndex, 1)[0]\n\n if (movedItem) {\n newData.splice(newIndex, 0, movedItem)\n localColSetting.value = newData\n\n // 使用防抖更新\n debouncedUpdate(newData)\n }\n } catch (error) {\n console.warn('拖拽排序时出错:', error)\n }\n }\n })\n } catch (error) {\n console.warn('初始化sortable时出错:', error)\n }\n })\n }\n\n const openColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = true\n\n // 延迟初始化拖拽\n setTimeout(() => {\n if (!instance || instance.isUnmounted) {\n return\n }\n initSortable()\n }, 200)\n }\n\n const closeColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = false\n }\n\n const handleSwitchChange = () => {\n // console.log('handleSwitchChange调用:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // localColSettingLength: localColSetting.value.length\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('开关切换时组件已销毁')\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n try {\n // console.log('开关切换,准备防抖更新')\n // 使用防抖更新\n debouncedUpdate(localColSetting.value)\n } catch (error) {\n console.warn('开关切换时出错:', error)\n }\n }\n\n // 监听抽屉关闭,清理拖拽实例\n watch(drawerVisible, (newVal) => {\n if (!newVal && sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('关闭抽屉时销毁sortable实例出错:', error)\n }\n }\n })\n\n // 组件销毁时清理\n onUnmounted(() => {\n if (updateTimer) {\n clearTimeout(updateTimer)\n updateTimer = null\n }\n\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('组件销毁时清理sortable实例出错:', error)\n }\n }\n })\n\n defineExpose({\n openColSetting,\n closeColSetting\n })\n</script>\n"],"names":["props","__props","emit","__emit","drawerVisible","ref","tableRef","sortableInstance","instance","getCurrentInstance","localColSetting","isUpdatingFromParent","updateTimer","safeEmit","__name","eventName","data","isUnmounted","error","console","warn","hasInstance","debouncedUpdate","clearTimeout","window","setTimeout","clonedData","JSON","parse","stringify","watch","colSetting","newVal","Array","isArray","value","filterData","filter","item","isShow","nextTick","immediate","deep","initSortable","tbody","$el","querySelector","destroy","Sortable","create","handle","animation","ghostClass","chosenClass","dragClass","forceFallback","fallbackTolerance","dragoverBubble","removeCloneOnHide","onStart","evt","from","onEnd","oldIndex","newIndex","length","newData","movedItem","splice","openColSetting","closeColSetting","handleSwitchChange","onUnmounted","__expose"],"mappings":"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"}
1
+ {"version":3,"file":"ColSetting.vue2.js","sources":["../../../../../../../packages/components/znTable/src/components/ColSetting.vue"],"sourcesContent":["<template>\n <!-- 列设置 -->\n <el-drawer v-model=\"drawerVisible\" title=\"列设置\" size=\"450px\">\n <!-- 自定义头部 -->\n <template #header=\"{ close, titleId, titleClass }\">\n <div class=\"col-setting-header\" style=\"display: flex; align-items: center;\">\n <h4 :id=\"titleId\" :class=\"titleClass\">列设置</h4>\n <div style=\"display: flex; align-items: center;\">\n <!-- 列设置头部插槽 -->\n <slot name=\"colSettingHeader\"></slot>\n </div>\n </div>\n </template>\n\n <div class=\"table-main\">\n <el-table ref=\"tableRef\" :data=\"localColSetting\" :border=\"true\" row-key=\"prop\" default-expand-all :tree-props=\"{ children: '_children' }\">\n <el-table-column align=\"center\" label=\"拖拽\" width=\"60\">\n <template #default>\n <el-icon class=\"drag-handle\" style=\" color: #409eff;cursor: move\">\n <DCaret />\n </el-icon>\n </template>\n </el-table-column>\n <el-table-column prop=\"label\" align=\"center\" label=\"列名\" />\n <el-table-column v-slot=\"scope\" prop=\"isShow\" align=\"center\" label=\"显示\">\n <el-switch v-model=\"scope.row.isShow\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <el-table-column v-slot=\"scope\" prop=\"sortable\" align=\"center\" label=\"排序\">\n <el-switch v-model=\"scope.row.sortable\" @change=\"handleSwitchChange\"></el-switch>\n </el-table-column>\n <template #empty>\n <div class=\"table-empty\">\n <img src=\"../assets/notData.png\" alt=\"notData\" />\n <div>暂无可配置列</div>\n </div>\n </template>\n </el-table>\n </div>\n </el-drawer>\n</template>\n\n<script setup lang=\"ts\" name=\"ColSetting\">\n import { nextTick, onMounted, onUnmounted, ref, watch, getCurrentInstance } from 'vue'\n import Sortable from 'sortablejs'\n\n import { ColumnProps } from '../interface'\n import { DCaret } from '@element-plus/icons-vue'\n\n const props = defineProps({\n colSetting: { type: Array, required: true }\n})\n const emit = defineEmits(['update:colSetting', 'updateColumns'])\n\n const drawerVisible = ref<boolean>(false)\n const tableRef = ref()\n let sortableInstance: Sortable | null = null\n\n // 获取当前组件实例,用于检查组件是否已销毁\n const instance = getCurrentInstance()\n\n // 添加本地状态\n const localColSetting = ref<ColumnProps[]>([])\n\n // 添加更新标志,防止循环更新\n const isUpdatingFromParent = ref(false)\n\n // 防抖标志\n let updateTimer: number | null = null\n\n // 安全的emit函数\n const safeEmit = (eventName: string, data: any) => {\n // console.log('safeEmit调用:', {\n // eventName,\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // dataLength: Array.isArray(data) ? data.length : 'not array'\n // })\n\n // 检查组件实例是否还存在\n if (!instance || instance.isUnmounted) {\n console.warn('组件已销毁,跳过事件发送', {\n hasInstance: !!instance,\n isUnmounted: instance?.isUnmounted\n })\n return\n }\n\n try {\n // console.log('正在发送事件:', eventName)\n emit(eventName as any, data)\n // console.log('事件发送成功:', eventName)\n } catch (error) {\n console.warn(`发送事件 ${eventName} 时出错:`, error)\n }\n }\n\n // 防抖的更新函数\n const debouncedUpdate = (data: ColumnProps[]) => {\n // console.log('debouncedUpdate调用:', {\n // hasData: !!data,\n // dataLength: Array.isArray(data) ? data.length : 'not array',\n // hasTimer: !!updateTimer\n // })\n\n if (updateTimer) {\n // console.log('清除之前的定时器')\n clearTimeout(updateTimer)\n }\n\n updateTimer = window.setTimeout(() => {\n // console.log('防抖定时器执行:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('防抖更新时组件已销毁')\n return\n }\n\n try {\n // 深拷贝数据避免响应式问题\n const clonedData = JSON.parse(JSON.stringify(data))\n // console.log('开始发送防抖更新事件')\n // safeEmit('update:colSetting', clonedData) // 移除这个事件,避免双重更新\n safeEmit('updateColumns', clonedData)\n } catch (error) {\n console.warn('更新数据时出错:', error)\n }\n }, 100) // 100ms防抖\n }\n\n // 监听 props 变化,更新本地状态\n watch(\n () => props.colSetting,\n (newVal) => {\n if (!newVal || !Array.isArray(newVal)) return\n\n // 设置标志,表示正在从父组件更新\n isUpdatingFromParent.value = true\n // 不要过滤 isShow 为 false 的列,否则用户无法再将其设置为显示\n try {\n localColSetting.value = JSON.parse(JSON.stringify(newVal))\n } catch (error) {\n console.warn('更新本地列设置时出错:', error)\n localColSetting.value = [...newVal]\n }\n\n // 延迟重置标志,确保本次更新完成\n nextTick(() => {\n setTimeout(() => {\n isUpdatingFromParent.value = false\n }, 50)\n })\n },\n { immediate: true, deep: true }\n )\n\n // 初始化拖拽排序\n const initSortable = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n nextTick(() => {\n if (!instance || instance.isUnmounted || !tableRef.value) {\n return\n }\n\n try {\n const tbody = tableRef.value.$el?.querySelector('tbody')\n if (!tbody) {\n console.warn('未找到tbody元素')\n return\n }\n\n // 销毁之前的实例\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n } catch (error) {\n console.warn('销毁sortable实例时出错:', error)\n }\n sortableInstance = null\n }\n\n sortableInstance = Sortable.create(tbody, {\n handle: '.drag-handle',\n animation: 300,\n ghostClass: 'sortable-ghost',\n chosenClass: 'sortable-chosen',\n dragClass: 'sortable-drag',\n forceFallback: true,\n fallbackTolerance: 3,\n // 禁用原生HTML5拖拽\n dragoverBubble: false,\n removeCloneOnHide: true,\n onStart: (evt) => {\n if (!evt.item || !evt.from || !instance || instance.isUnmounted) {\n return false\n }\n },\n onEnd: (evt) => {\n // 检查组件状态\n if (!instance || instance.isUnmounted) {\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n const { oldIndex, newIndex } = evt\n\n if (oldIndex === undefined || newIndex === undefined || oldIndex === newIndex) {\n return\n }\n\n if (oldIndex < 0 || newIndex < 0 || oldIndex >= localColSetting.value.length || newIndex >= localColSetting.value.length) {\n return\n }\n\n try {\n const newData = [...localColSetting.value]\n const movedItem = newData.splice(oldIndex, 1)[0]\n\n if (movedItem) {\n newData.splice(newIndex, 0, movedItem)\n localColSetting.value = newData\n\n // 使用防抖更新\n debouncedUpdate(newData)\n }\n } catch (error) {\n console.warn('拖拽排序时出错:', error)\n }\n }\n })\n } catch (error) {\n console.warn('初始化sortable时出错:', error)\n }\n })\n }\n\n const openColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = true\n\n // 延迟初始化拖拽\n setTimeout(() => {\n if (!instance || instance.isUnmounted) {\n return\n }\n initSortable()\n }, 200)\n }\n\n const closeColSetting = () => {\n if (!instance || instance.isUnmounted) {\n return\n }\n\n drawerVisible.value = false\n }\n\n const handleSwitchChange = () => {\n // console.log('handleSwitchChange调用:', {\n // hasInstance: !!instance,\n // isUnmounted: instance?.isUnmounted,\n // localColSettingLength: localColSetting.value.length\n // })\n\n if (!instance || instance.isUnmounted) {\n // console.warn('开关切换时组件已销毁')\n return\n }\n\n // 如果正在从父组件更新,跳过事件发送\n if (isUpdatingFromParent.value) {\n return\n }\n\n try {\n // console.log('开关切换,准备防抖更新')\n // 使用防抖更新\n debouncedUpdate(localColSetting.value)\n } catch (error) {\n console.warn('开关切换时出错:', error)\n }\n }\n\n // 监听抽屉关闭,清理拖拽实例\n watch(drawerVisible, (newVal) => {\n if (!newVal && sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('关闭抽屉时销毁sortable实例出错:', error)\n }\n }\n })\n\n // 组件销毁时清理\n onUnmounted(() => {\n if (updateTimer) {\n clearTimeout(updateTimer)\n updateTimer = null\n }\n\n if (sortableInstance) {\n try {\n sortableInstance.destroy()\n sortableInstance = null\n } catch (error) {\n console.warn('组件销毁时清理sortable实例出错:', error)\n }\n }\n })\n\n defineExpose({\n openColSetting,\n closeColSetting\n })\n</script>\n"],"names":["props","__props","emit","__emit","drawerVisible","ref","tableRef","sortableInstance","instance","getCurrentInstance","localColSetting","isUpdatingFromParent","updateTimer","safeEmit","__name","eventName","data","isUnmounted","error","console","warn","hasInstance","debouncedUpdate","clearTimeout","window","setTimeout","clonedData","JSON","parse","stringify","watch","colSetting","newVal","Array","isArray","value","nextTick","immediate","deep","initSortable","tbody","$el","querySelector","destroy","Sortable","create","handle","animation","ghostClass","chosenClass","dragClass","forceFallback","fallbackTolerance","dragoverBubble","removeCloneOnHide","onStart","evt","item","from","onEnd","oldIndex","newIndex","length","newData","movedItem","splice","openColSetting","closeColSetting","handleSwitchChange","onUnmounted","__expose"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("element-plus");require("../../../functions/index.js");var l=require("../../../functions/modules/uitls.js"),a=Object.defineProperty,r=(e,t)=>a(e,"name",{value:t,configurable:!0});const d={key:0,class:"title sle"},u={class:"flex gap-10"},n={key:1,class:"el-tree-node__label"};var i=e.defineComponent({name:"ZnTreeFilter",__name:"index",props:{requestApi:{type:Function,required:!1},requestParams:{required:!1,default:r((()=>({})),"default")},data:{type:Array,required:!1},title:{type:String,required:!1},id:{type:String,required:!1,default:"id"},label:{type:String,required:!1,default:"label"},multiple:{type:Boolean,required:!1,default:!1},defaultValue:{required:!1},transformDataToTree:{type:Boolean,required:!1,default:!0},width:{type:String,required:!1,default:"460px"},height:{type:String,required:!1,default:"calc(100vh - 200px)"},defaultExpandAll:{type:Boolean,required:!1,default:!0},defaultExpandKeys:{type:Array,required:!1,default:r((()=>[]),"default")},expandOnClickNode:{type:Boolean,required:!1,default:!1},render:{type:Function,required:!1},showFilterText:{type:Boolean,required:!1,default:!0}},emits:["dataReady","change"],setup(a,{expose:i,emit:o}){const c=a,s={children:"children",label:c.label},p=e.ref(),f=e.ref([]),y=e.ref([]),h=o,m=e.ref(),k=r((()=>{c.multiple?m.value=Array.isArray(c.defaultValue)?c.defaultValue:[c.defaultValue]:m.value="string"==typeof c.defaultValue?c.defaultValue:""}),"setSelected"),v=r((async()=>{if(c.requestApi){const e=await c.requestApi(c.requestParams);let t=e.result.list??e.result;t.map(((e,t)=>{e.id||(e.id=`${e.treeLevel}-${t}`)})),c.transformDataToTree?f.value=l.default.treeListUtil(t):f.value=t,y.value=[...f.value],h("dataReady",t)}}),"getList");e.onBeforeMount((async()=>{await v(),!c.multiple&&c.defaultValue&&(B(c.defaultValue),await e.nextTick(),p.value?.$el.querySelector(".is-current").firstChild.click())})),e.watch((()=>c.requestParams),(e=>{e&&v()}),{deep:!0}),e.watch((()=>c.defaultValue),(()=>e.nextTick((()=>k()))),{deep:!0,immediate:!0}),e.watch((()=>c.data),(()=>{c.data?.length&&(f.value=c.data,y.value=[...c.data])}),{deep:!0,immediate:!0});const x=e.ref("");e.watch(x,(e=>{p.value.filter(e)}));const g=r(((e,t,l)=>{if(!e)return!0;let a=l.parent,r=[l.label],d=1;for(;d<l.level;)r=[...r,a.label],a=a.parent,d++;return r.some((t=>-1!==t.indexOf(e)))}),"filterNode"),q=r((e=>{c.multiple||h("change",e[c.id],e)}),"handleNodeClick"),C=r((()=>{h("change",p.value?.getCheckedNodes())}),"handleCheckChange"),V=r((e=>{p.value?.setCheckedKeys(e)}),"setCheckedKeys"),B=r((e=>{p.value?.setCurrentKey(e)}),"setCurrentKey");return i({treeData:f,treeAllData:y,treeRef:p,setCheckedKeys:V,getList:v,setCurrentKey:B}),(l,r)=>{const i=e.resolveComponent("el-input"),o=e.resolveComponent("el-scrollbar");return e.openBlock(),e.createElementBlock("div",{class:"zn-tree-filter",style:e.normalizeStyle({width:a.width,height:a.height})},[a.title?(e.openBlock(),e.createElementBlock("h4",d,e.toDisplayString(a.title),1
2
- /* TEXT */)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",u,[a.showFilterText?(e.openBlock(),e.createBlock(i,{key:0,modelValue:x.value,"onUpdate:modelValue":r[0]||(r[0]=e=>x.value=e),placeholder:"输入关键字进行过滤",clearable:""},null,8,["modelValue"])):e.createCommentVNode("v-if",!0),e.renderSlot(l.$slots,"toolButton")]),e.createVNode(o,{style:e.normalizeStyle({height:a.title?"calc(100% - 95px)":"calc(100% - 56px)"})},{default:e.withCtx((()=>[e.createVNode(e.unref(t.ElTree),{ref_key:"treeRef",ref:p,"default-expand-all":a.defaultExpandAll,"node-key":a.id,data:a.multiple?f.value:y.value,"show-checkbox":a.multiple,"check-strictly":!1,"current-node-key":a.multiple?"":m.value,"highlight-current":!a.multiple,"expand-on-click-node":a.expandOnClickNode,"check-on-click-node":a.multiple,props:s,"filter-node-method":g,"default-checked-keys":a.multiple?m.value:[],"default-expanded-keys":a.defaultExpandKeys,onNodeClick:q,onCheck:C},{default:e.withCtx((t=>[c.render?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(c.render),e.normalizeProps(e.mergeProps({key:0},t)),null,16
2
+ /* TEXT */)):e.createCommentVNode("v-if",!0),e.createElementVNode("div",u,[a.showFilterText?(e.openBlock(),e.createBlock(i,{key:0,modelValue:x.value,"onUpdate:modelValue":r[0]||(r[0]=e=>x.value=e),placeholder:"输入关键字进行过滤",clearable:""},null,8,["modelValue"])):e.createCommentVNode("v-if",!0),e.renderSlot(l.$slots,"toolButton")]),e.renderSlot(l.$slots,"treeHeader"),e.createVNode(o,{style:e.normalizeStyle({height:a.title?"calc(100% - 95px)":"calc(100% - 56px)"})},{default:e.withCtx((()=>[e.createVNode(e.unref(t.ElTree),{ref_key:"treeRef",ref:p,"default-expand-all":a.defaultExpandAll,"node-key":a.id,data:a.multiple?f.value:y.value,"show-checkbox":a.multiple,"check-strictly":!1,"current-node-key":a.multiple?"":m.value,"highlight-current":!a.multiple,"expand-on-click-node":a.expandOnClickNode,"check-on-click-node":a.multiple,props:s,"filter-node-method":g,"default-checked-keys":a.multiple?m.value:[],"default-expanded-keys":a.defaultExpandKeys,onNodeClick:q,onCheck:C},{default:e.withCtx((t=>[c.render?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(c.render),e.normalizeProps(e.mergeProps({key:0},t)),null,16
3
3
  /* FULL_PROPS */)):(e.openBlock(),e.createElementBlock("span",n,[e.renderSlot(l.$slots,"default",e.normalizeProps(e.guardReactiveProps(t)),(()=>[e.createTextVNode(e.toDisplayString(t.node.label),1
4
4
  /* TEXT */)]))]))])),_:3
5
5
  /* FORWARDED */},8,["default-expand-all","node-key","data","show-checkbox","current-node-key","highlight-current","expand-on-click-node","check-on-click-node","default-checked-keys","default-expanded-keys"])])),_:3
@@ -1 +1 @@
1
- {"version":3,"file":"index.vue2.js","sources":["../../../../../../packages/components/znTreeFilter/src/index.vue"],"sourcesContent":["<template>\n <div class=\"zn-tree-filter\" :style=\"{ width, height }\">\n <h4 v-if=\"title\" class=\"title sle\">\n {{ title }}\n </h4>\n <div class=\"flex gap-10\">\n <el-input v-if=\"showFilterText\" v-model=\"filterText\" placeholder=\"输入关键字进行过滤\" clearable />\n <slot name=\"toolButton\"></slot>\n </div>\n <el-scrollbar :style=\"{ height: title ? `calc(100% - 95px)` : `calc(100% - 56px)` }\">\n <el-tree\n ref=\"treeRef\"\n :default-expand-all=\"defaultExpandAll\"\n :node-key=\"id\"\n :data=\"multiple ? treeData : treeAllData\"\n :show-checkbox=\"multiple\"\n :check-strictly=\"false\"\n :current-node-key=\"!multiple ? selected : ''\"\n :highlight-current=\"!multiple\"\n :expand-on-click-node=\"expandOnClickNode\"\n :check-on-click-node=\"multiple\"\n :props=\"defaultProps\"\n :filter-node-method=\"filterNode\"\n :default-checked-keys=\"multiple ? selected : []\"\n :default-expanded-keys=\"defaultExpandKeys\"\n @node-click=\"handleNodeClick\"\n @check=\"handleCheckChange\">\n <template #default=\"scope\">\n <component v-if=\"props.render\" :is=\"props.render\" v-bind=\"scope\" />\n <span v-else class=\"el-tree-node__label\">\n <slot v-bind=\"scope\">\n {{ scope.node.label }}\n </slot>\n </span>\n </template>\n </el-tree>\n </el-scrollbar>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTreeFilter\">\n import { nextTick, onBeforeMount, ref, watch, VNode } from 'vue'\n\n import { ElTree } from 'element-plus'\n import { utils } from '../../../functions'\n defineOptions({ name: 'ZnTreeFilter' })\n // 接收父组件参数并设置默认值\n interface TreeFilterProps {\n requestApi?: (data?: any) => Promise<any> /** 请求分类数据的 api ==> 非必传 */\n requestParams?: any /** 请求分类数据的参数 ==> 非必传 */\n data?: { [key: string]: any }[] /** 分类数据,如果有分类数据,则不会执行 api 请求 ==> 非必传 */\n title?: string /** treeFilter 标题 ==> 非必传 */\n id?: string /** 选择的id ==> 非必传,默认为 “id” */\n label?: string /** 显示的label ==> 非必传,默认为 “label” */\n multiple?: boolean /** 是否为多选 ==> 非必传,默认为 false */\n defaultValue?: any /** 默认选中的值 ==> 非必传 */\n transformDataToTree?: boolean /** 是否将数据转换为树形结构 ==> 非必传,默认为 true */\n width?: string /** 默认460px */\n height?: string /** 默认calc(100vh - 200px) */\n defaultExpandAll?: boolean /** 默认全部展开 */\n defaultExpandKeys?: any[]\n expandOnClickNode?: boolean\n render?: (scope: any) => VNode\n showFilterText?: boolean /** 是否显示过滤文本框 ==> 非必传,默认为 true */\n }\n const props = defineProps({\n requestApi: { type: Function, required: false },\n requestParams: { required: false, default: () => ({}) },\n data: { type: Array, required: false },\n title: { type: String, required: false },\n id: { type: String, required: false, default: 'id' },\n label: { type: String, required: false, default: 'label' },\n multiple: { type: Boolean, required: false, default: false },\n defaultValue: { required: false },\n transformDataToTree: { type: Boolean, required: false, default: true },\n width: { type: String, required: false, default: '460px' },\n height: { type: String, required: false, default: 'calc(100vh - 200px)' },\n defaultExpandAll: { type: Boolean, required: false, default: true },\n defaultExpandKeys: { type: Array, required: false, default: () => [] },\n expandOnClickNode: { type: Boolean, required: false, default: false },\n render: { type: Function, required: false },\n showFilterText: { type: Boolean, required: false, default: true }\n})\n\n const defaultProps = {\n children: 'children',\n label: props.label\n }\n\n const treeRef = ref<InstanceType<typeof ElTree>>()\n const treeData = ref<{ [key: string]: any }[]>([])\n const treeAllData = ref<{ [key: string]: any }[]>([])\n\n const emits = defineEmits(['dataReady', 'change'])\n\n const selected = ref()\n const setSelected = () => {\n if (props.multiple) selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]\n else selected.value = typeof props.defaultValue === 'string' ? props.defaultValue : ''\n }\n\n const getList = async () => {\n if (props.requestApi) {\n const res = await props.requestApi!(props.requestParams)\n let list = res.result.list ?? res.result\n // 后端说第六层没有id,所以补上 转树形的时候要用到\n list.map((item: any, index: number) => {\n if (!item.id) {\n item.id = `${item.treeLevel}-${index}`\n }\n })\n if (props.transformDataToTree) {\n treeData.value = utils.treeListUtil(list)\n } else {\n treeData.value = list\n }\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...treeData.value]\n treeAllData.value = [...treeData.value]\n emits('dataReady', list)\n }\n }\n\n onBeforeMount(async () => {\n await getList()\n if (!props.multiple && props.defaultValue) {\n setCurrentKey(props.defaultValue)\n await nextTick()\n treeRef.value?.$el.querySelector('.is-current').firstChild.click()\n }\n })\n\n watch(\n () => props.requestParams,\n (val) => {\n if (val) {\n getList()\n }\n },\n {\n deep: true\n }\n )\n\n // 使用 nextTick 防止打包后赋值不生效,开发环境是正常的\n watch(\n () => props.defaultValue,\n () => nextTick(() => setSelected()),\n { deep: true, immediate: true }\n )\n\n watch(\n () => props.data,\n () => {\n if (props.data?.length) {\n treeData.value = props.data\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...props.data]\n treeAllData.value = [...props.data]\n }\n },\n { deep: true, immediate: true }\n )\n\n const filterText = ref('')\n watch(filterText, (val) => {\n treeRef.value!.filter(val)\n })\n\n // 过滤\n const filterNode = (value: string, data: { [key: string]: any }, node: any) => {\n if (!value) return true\n let parentNode = node.parent\n let labels = [node.label]\n let level = 1\n while (level < node.level) {\n labels = [...labels, parentNode.label]\n parentNode = parentNode.parent\n level++\n }\n return labels.some((label) => label.indexOf(value) !== -1)\n }\n\n // emit\n // const emit = defineEmits<{\n // change: [value: any],\n // }>()\n\n // 单选\n const handleNodeClick = (data: { [key: string]: any }) => {\n if (props.multiple) return\n emits('change', data[props.id], data)\n }\n\n // 多选\n const handleCheckChange = () => {\n emits('change', treeRef.value?.getCheckedNodes())\n }\n\n const setCheckedKeys = (keys) => {\n treeRef.value?.setCheckedKeys(keys)\n }\n\n const setCurrentKey = (key) => {\n treeRef.value?.setCurrentKey(key)\n }\n\n // 暴露给父组件使用\n defineExpose({ treeData, treeAllData, treeRef, setCheckedKeys, getList, setCurrentKey })\n</script>\n"],"names":["props","__props","defaultProps","children","label","treeRef","ref","treeData","treeAllData","emits","__emit","selected","setSelected","__name","multiple","value","Array","isArray","defaultValue","getList","async","requestApi","res","requestParams","list","result","map","item","index","id","treeLevel","transformDataToTree","utils","treeListUtil","onBeforeMount","setCurrentKey","nextTick","$el","querySelector","firstChild","click","watch","val","deep","immediate","data","length","filterText","filter","filterNode","node","parentNode","parent","labels","level","some","indexOf","handleNodeClick","handleCheckChange","getCheckedNodes","setCheckedKeys","keys","key","__expose"],"mappings":"gvCAiEE,MAAMA,EAAQC,EAmBRC,EAAe,CACnBC,SAAU,WACVC,MAAOJ,EAAMI,OAGTC,EAAUC,EAAAA,MACVC,EAAWD,EAA8BA,IAAA,IACzCE,EAAcF,EAA8BA,IAAA,IAE5CG,EAAQC,EAERC,EAAWL,EAAAA,MACXM,EAAoBC,GAAA,KACpBb,EAAMc,SAAmBH,EAAAI,MAAQC,MAAMC,QAAQjB,EAAMkB,cAAgBlB,EAAMkB,aAAe,CAAClB,EAAMkB,gBACvFH,MAAsC,iBAAvBf,EAAMkB,aAA4BlB,EAAMkB,aAAe,EAAA,GAFlE,eAKdC,EAAsBN,GAAAO,UAC1B,GAAIpB,EAAMqB,WAAY,CACpB,MAAMC,QAAYtB,EAAMqB,WAAYrB,EAAMuB,eAC1C,IAAIC,EAAOF,EAAIG,OAAOD,MAAQF,EAAIG,OAE7BD,EAAAE,KAAI,CAACC,EAAWC,KACdD,EAAKE,KACRF,EAAKE,GAAK,GAAGF,EAAKG,aAAaF,IAAK,IAGpC5B,EAAM+B,oBACCxB,EAAAQ,MAAQiB,UAAMC,aAAaT,GAEpCjB,EAASQ,MAAQS,EAGnBhB,EAAYO,MAAQ,IAAIR,EAASQ,OACjCN,EAAM,YAAae,EAAI,IAjBX,WAqBhBU,EAAAA,eAAcd,gBACND,KACDnB,EAAMc,UAAYd,EAAMkB,eAC3BiB,EAAcnC,EAAMkB,oBACdkB,aACN/B,EAAQU,OAAOsB,IAAIC,cAAc,eAAeC,WAAWC,QAAM,IAIrEC,EAAAA,OACE,IAAMzC,EAAMuB,gBACXmB,IACKA,GACMvB,GAAA,GAGZ,CACEwB,MAAM,IAKVF,EAAAA,OACE,IAAMzC,EAAMkB,eACZ,IAAMkB,EAAAA,UAAS,IAAMxB,OACrB,CAAE+B,MAAM,EAAMC,WAAW,IAG3BH,EAAAA,OACE,IAAMzC,EAAM6C,OACZ,KACM7C,EAAM6C,MAAMC,SACdvC,EAASQ,MAAQf,EAAM6C,KAEvBrC,EAAYO,MAAQ,IAAIf,EAAM6C,MAAI,GAGtC,CAAEF,MAAM,EAAMC,WAAW,IAGrB,MAAAG,EAAazC,MAAI,IACjBmC,QAAAM,GAAaL,IACTrC,EAAAU,MAAOiC,OAAON,EAAG,IAI3B,MAAMO,EAAapC,GAAA,CAACE,EAAe8B,EAA8BK,KAC3D,IAACnC,EAAc,OAAA,EACnB,IAAIoC,EAAaD,EAAKE,OAClBC,EAAS,CAACH,EAAK9C,OACfkD,EAAQ,EACL,KAAAA,EAAQJ,EAAKI,OAClBD,EAAS,IAAIA,EAAQF,EAAW/C,OAChC+C,EAAaA,EAAWC,OACxBE,IAEK,OAAAD,EAAOE,MAAMnD,IAAqC,IAA3BA,EAAMoD,QAAQzC,IAAa,GAVxC,cAmBb0C,KAAmBZ,IACnB7C,EAAMc,UACVL,EAAM,SAAUoC,EAAK7C,EAAM6B,IAAKgB,EAAI,GAFd,mBAMlBa,EAA0B7C,GAAA,KAC9BJ,EAAM,SAAUJ,EAAQU,OAAO4C,kBAAiB,GADxB,qBAIpBC,KAAkBC,IACdxD,EAAAU,OAAO6C,eAAeC,EAAI,GADb,kBAIjB1B,KAAiB2B,IACbzD,EAAAU,OAAOoB,cAAc2B,EAAG,GADZ,wBAKtBC,EAAa,CAAExD,WAAUC,cAAaH,UAASuD,iBAAgBzC,UAASgB;;;;;;"}
1
+ {"version":3,"file":"index.vue2.js","sources":["../../../../../../packages/components/znTreeFilter/src/index.vue"],"sourcesContent":["<template>\n <div class=\"zn-tree-filter\" :style=\"{ width, height }\">\n <h4 v-if=\"title\" class=\"title sle\">\n {{ title }}\n </h4>\n <div class=\"flex gap-10\">\n <el-input v-if=\"showFilterText\" v-model=\"filterText\" placeholder=\"输入关键字进行过滤\" clearable />\n <slot name=\"toolButton\"></slot>\n </div>\n <slot name=\"treeHeader\"></slot>\n <el-scrollbar :style=\"{ height: title ? `calc(100% - 95px)` : `calc(100% - 56px)` }\">\n <el-tree\n ref=\"treeRef\"\n :default-expand-all=\"defaultExpandAll\"\n :node-key=\"id\"\n :data=\"multiple ? treeData : treeAllData\"\n :show-checkbox=\"multiple\"\n :check-strictly=\"false\"\n :current-node-key=\"!multiple ? selected : ''\"\n :highlight-current=\"!multiple\"\n :expand-on-click-node=\"expandOnClickNode\"\n :check-on-click-node=\"multiple\"\n :props=\"defaultProps\"\n :filter-node-method=\"filterNode\"\n :default-checked-keys=\"multiple ? selected : []\"\n :default-expanded-keys=\"defaultExpandKeys\"\n @node-click=\"handleNodeClick\"\n @check=\"handleCheckChange\">\n <template #default=\"scope\">\n <component v-if=\"props.render\" :is=\"props.render\" v-bind=\"scope\" />\n <span v-else class=\"el-tree-node__label\">\n <slot v-bind=\"scope\">\n {{ scope.node.label }}\n </slot>\n </span>\n </template>\n </el-tree>\n </el-scrollbar>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTreeFilter\">\n import { nextTick, onBeforeMount, ref, watch, VNode } from 'vue'\n\n import { ElTree } from 'element-plus'\n import { utils } from '../../../functions'\n defineOptions({ name: 'ZnTreeFilter' })\n // 接收父组件参数并设置默认值\n interface TreeFilterProps {\n requestApi?: (data?: any) => Promise<any> /** 请求分类数据的 api ==> 非必传 */\n requestParams?: any /** 请求分类数据的参数 ==> 非必传 */\n data?: { [key: string]: any }[] /** 分类数据,如果有分类数据,则不会执行 api 请求 ==> 非必传 */\n title?: string /** treeFilter 标题 ==> 非必传 */\n id?: string /** 选择的id ==> 非必传,默认为 “id” */\n label?: string /** 显示的label ==> 非必传,默认为 “label” */\n multiple?: boolean /** 是否为多选 ==> 非必传,默认为 false */\n defaultValue?: any /** 默认选中的值 ==> 非必传 */\n transformDataToTree?: boolean /** 是否将数据转换为树形结构 ==> 非必传,默认为 true */\n width?: string /** 默认460px */\n height?: string /** 默认calc(100vh - 200px) */\n defaultExpandAll?: boolean /** 默认全部展开 */\n defaultExpandKeys?: any[]\n expandOnClickNode?: boolean\n render?: (scope: any) => VNode\n showFilterText?: boolean /** 是否显示过滤文本框 ==> 非必传,默认为 true */\n }\n const props = defineProps({\n requestApi: { type: Function, required: false },\n requestParams: { required: false, default: () => ({}) },\n data: { type: Array, required: false },\n title: { type: String, required: false },\n id: { type: String, required: false, default: 'id' },\n label: { type: String, required: false, default: 'label' },\n multiple: { type: Boolean, required: false, default: false },\n defaultValue: { required: false },\n transformDataToTree: { type: Boolean, required: false, default: true },\n width: { type: String, required: false, default: '460px' },\n height: { type: String, required: false, default: 'calc(100vh - 200px)' },\n defaultExpandAll: { type: Boolean, required: false, default: true },\n defaultExpandKeys: { type: Array, required: false, default: () => [] },\n expandOnClickNode: { type: Boolean, required: false, default: false },\n render: { type: Function, required: false },\n showFilterText: { type: Boolean, required: false, default: true }\n})\n\n const defaultProps = {\n children: 'children',\n label: props.label\n }\n\n const treeRef = ref<InstanceType<typeof ElTree>>()\n const treeData = ref<{ [key: string]: any }[]>([])\n const treeAllData = ref<{ [key: string]: any }[]>([])\n\n const emits = defineEmits(['dataReady', 'change'])\n\n const selected = ref()\n const setSelected = () => {\n if (props.multiple) selected.value = Array.isArray(props.defaultValue) ? props.defaultValue : [props.defaultValue]\n else selected.value = typeof props.defaultValue === 'string' ? props.defaultValue : ''\n }\n\n const getList = async () => {\n if (props.requestApi) {\n const res = await props.requestApi!(props.requestParams)\n let list = res.result.list ?? res.result\n // 后端说第六层没有id,所以补上 转树形的时候要用到\n list.map((item: any, index: number) => {\n if (!item.id) {\n item.id = `${item.treeLevel}-${index}`\n }\n })\n if (props.transformDataToTree) {\n treeData.value = utils.treeListUtil(list)\n } else {\n treeData.value = list\n }\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...treeData.value]\n treeAllData.value = [...treeData.value]\n emits('dataReady', list)\n }\n }\n\n onBeforeMount(async () => {\n await getList()\n if (!props.multiple && props.defaultValue) {\n setCurrentKey(props.defaultValue)\n await nextTick()\n treeRef.value?.$el.querySelector('.is-current').firstChild.click()\n }\n })\n\n watch(\n () => props.requestParams,\n (val) => {\n if (val) {\n getList()\n }\n },\n {\n deep: true\n }\n )\n\n // 使用 nextTick 防止打包后赋值不生效,开发环境是正常的\n watch(\n () => props.defaultValue,\n () => nextTick(() => setSelected()),\n { deep: true, immediate: true }\n )\n\n watch(\n () => props.data,\n () => {\n if (props.data?.length) {\n treeData.value = props.data\n // treeAllData.value = [{ id: '', [props.label]: '全部' }, ...props.data]\n treeAllData.value = [...props.data]\n }\n },\n { deep: true, immediate: true }\n )\n\n const filterText = ref('')\n watch(filterText, (val) => {\n treeRef.value!.filter(val)\n })\n\n // 过滤\n const filterNode = (value: string, data: { [key: string]: any }, node: any) => {\n if (!value) return true\n let parentNode = node.parent\n let labels = [node.label]\n let level = 1\n while (level < node.level) {\n labels = [...labels, parentNode.label]\n parentNode = parentNode.parent\n level++\n }\n return labels.some((label) => label.indexOf(value) !== -1)\n }\n\n // emit\n // const emit = defineEmits<{\n // change: [value: any],\n // }>()\n\n // 单选\n const handleNodeClick = (data: { [key: string]: any }) => {\n if (props.multiple) return\n emits('change', data[props.id], data)\n }\n\n // 多选\n const handleCheckChange = () => {\n emits('change', treeRef.value?.getCheckedNodes())\n }\n\n const setCheckedKeys = (keys) => {\n treeRef.value?.setCheckedKeys(keys)\n }\n\n const setCurrentKey = (key) => {\n treeRef.value?.setCurrentKey(key)\n }\n\n // 暴露给父组件使用\n defineExpose({ treeData, treeAllData, treeRef, setCheckedKeys, getList, setCurrentKey })\n</script>\n"],"names":["props","__props","defaultProps","children","label","treeRef","ref","treeData","treeAllData","emits","__emit","selected","setSelected","__name","multiple","value","Array","isArray","defaultValue","getList","async","requestApi","res","requestParams","list","result","map","item","index","id","treeLevel","transformDataToTree","utils","treeListUtil","onBeforeMount","setCurrentKey","nextTick","$el","querySelector","firstChild","click","watch","val","deep","immediate","data","length","filterText","filter","filterNode","node","parentNode","parent","labels","level","some","indexOf","handleNodeClick","handleCheckChange","getCheckedNodes","setCheckedKeys","keys","key","__expose"],"mappings":"gvCAkEE,MAAMA,EAAQC,EAmBRC,EAAe,CACnBC,SAAU,WACVC,MAAOJ,EAAMI,OAGTC,EAAUC,EAAAA,MACVC,EAAWD,EAA8BA,IAAA,IACzCE,EAAcF,EAA8BA,IAAA,IAE5CG,EAAQC,EAERC,EAAWL,EAAAA,MACXM,EAAoBC,GAAA,KACpBb,EAAMc,SAAmBH,EAAAI,MAAQC,MAAMC,QAAQjB,EAAMkB,cAAgBlB,EAAMkB,aAAe,CAAClB,EAAMkB,gBACvFH,MAAsC,iBAAvBf,EAAMkB,aAA4BlB,EAAMkB,aAAe,EAAA,GAFlE,eAKdC,EAAsBN,GAAAO,UAC1B,GAAIpB,EAAMqB,WAAY,CACpB,MAAMC,QAAYtB,EAAMqB,WAAYrB,EAAMuB,eAC1C,IAAIC,EAAOF,EAAIG,OAAOD,MAAQF,EAAIG,OAE7BD,EAAAE,KAAI,CAACC,EAAWC,KACdD,EAAKE,KACRF,EAAKE,GAAK,GAAGF,EAAKG,aAAaF,IAAK,IAGpC5B,EAAM+B,oBACCxB,EAAAQ,MAAQiB,UAAMC,aAAaT,GAEpCjB,EAASQ,MAAQS,EAGnBhB,EAAYO,MAAQ,IAAIR,EAASQ,OACjCN,EAAM,YAAae,EAAI,IAjBX,WAqBhBU,EAAAA,eAAcd,gBACND,KACDnB,EAAMc,UAAYd,EAAMkB,eAC3BiB,EAAcnC,EAAMkB,oBACdkB,aACN/B,EAAQU,OAAOsB,IAAIC,cAAc,eAAeC,WAAWC,QAAM,IAIrEC,EAAAA,OACE,IAAMzC,EAAMuB,gBACXmB,IACKA,GACMvB,GAAA,GAGZ,CACEwB,MAAM,IAKVF,EAAAA,OACE,IAAMzC,EAAMkB,eACZ,IAAMkB,EAAAA,UAAS,IAAMxB,OACrB,CAAE+B,MAAM,EAAMC,WAAW,IAG3BH,EAAAA,OACE,IAAMzC,EAAM6C,OACZ,KACM7C,EAAM6C,MAAMC,SACdvC,EAASQ,MAAQf,EAAM6C,KAEvBrC,EAAYO,MAAQ,IAAIf,EAAM6C,MAAI,GAGtC,CAAEF,MAAM,EAAMC,WAAW,IAGrB,MAAAG,EAAazC,MAAI,IACjBmC,QAAAM,GAAaL,IACTrC,EAAAU,MAAOiC,OAAON,EAAG,IAI3B,MAAMO,EAAapC,GAAA,CAACE,EAAe8B,EAA8BK,KAC3D,IAACnC,EAAc,OAAA,EACnB,IAAIoC,EAAaD,EAAKE,OAClBC,EAAS,CAACH,EAAK9C,OACfkD,EAAQ,EACL,KAAAA,EAAQJ,EAAKI,OAClBD,EAAS,IAAIA,EAAQF,EAAW/C,OAChC+C,EAAaA,EAAWC,OACxBE,IAEK,OAAAD,EAAOE,MAAMnD,IAAqC,IAA3BA,EAAMoD,QAAQzC,IAAa,GAVxC,cAmBb0C,KAAmBZ,IACnB7C,EAAMc,UACVL,EAAM,SAAUoC,EAAK7C,EAAM6B,IAAKgB,EAAI,GAFd,mBAMlBa,EAA0B7C,GAAA,KAC9BJ,EAAM,SAAUJ,EAAQU,OAAO4C,kBAAiB,GADxB,qBAIpBC,KAAkBC,IACdxD,EAAAU,OAAO6C,eAAeC,EAAI,GADb,kBAIjB1B,KAAiB2B,IACbzD,EAAAU,OAAOoB,cAAc2B,EAAG,GADZ,wBAKtBC,EAAa,CAAExD,WAAUC,cAAaH,UAASuD,iBAAgBzC,UAASgB;;;;;;"}
package/lib/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./installer.js");require("./functions/index.js"),require("./hooks/index.js");var o=require("./utils/index.js");require("./directives/index.js"),require("./components/index.js");var r=require("./functions/modules/log.js"),s=require("./hooks/useDialogV2/index.js"),t=require("./hooks/useDrawerV2/index.js"),n=require("./hooks/useDrawerV2/src/index.js"),i=require("./hooks/usePopWindow/src/index.js"),u=require("./hooks/usePopWindow/index.js"),l=require("./hooks/usePopWindowV2/src/index.js"),p=require("./hooks/usePopWindowV2/index.js"),d=require("./hooks/useDialog/index.js"),a=require("./hooks/useImageViewer/src/index.vue2.js"),x=require("./hooks/useImageViewer/index.js"),c=require("./hooks/useDrawer/index.js"),m=require("./utils/install.js"),q=require("./directives/modules/copy.js"),j=require("./directives/modules/drag.js"),h=require("./directives/modules/autoScroll.js"),w=require("./directives/modules/tooltip.js"),V=require("./directives/modules/confirm.js"),T=require("./directives/modules/countTo.js"),Z=require("./functions/modules/uitls.js"),g=require("./functions/modules/is.js"),f=require("./components/znForm/src/hooks/useZnForm.js"),I=require("./components/znFormV2/src/hooks/useZnFormV2.js"),W=require("./components/znSearch/src/hooks/useProSearch.js"),F=require("./components/znChart/index.js"),P=require("./components/znCountTo/index.js"),z=require("./components/znForm/src/components/ZnFormItem.vue2.js"),v=require("./components/znForm/index.js"),b=require("./components/znFormV2/src/helper/index.js"),y=require("./components/znFormV2/src/components/ZnFormV2Item.vue2.js"),k=require("./components/znFormV2/index.js"),D=require("./components/znGrid/index.js"),S=require("./components/znNumberScroll/index.js"),E=require("./components/znSearch/index.js"),C=require("./components/znTable/index.js"),B=require("./components/znTest/index.js"),G=require("./components/znTimeLine/index.js"),A=require("./components/znTreeFilter/index.js"),U=require("./components/znTreeSelect/index.js"),L=require("./components/znVirtualTable/src/utils/vxe-setup.js"),O=require("./components/znWorkGrid/index.js"),H=require("./components/znVirtualTable/src/index.vue2.js");globalThis.log=r.default;"function"==typeof globalThis?.log?.success&&globalThis.log.primary("1.1.13","欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/"),exports.default=e.default,exports.install=e.install,exports.copyText=o.copyText,exports.formatValue=o.formatValue,exports.treeListUtil=o.treeListUtil,exports.treeToList=o.treeToList,exports.log=r.default,exports.useDialogV2=s.useDialogV2,exports.useDrawerV2=t.useDrawerV2,exports.closeAllDrawers=n.closeAllDrawers,exports.closePopWindowById=i.closePopWindowById,exports.closePopWindowByTag=i.closePopWindowByTag,exports.getAllPopWindows=i.getAllPopWindows,exports.showPopWindow=i.showPopWindow,exports.usePopWindow=u.usePopWindow,exports.closePopWindowByIdV2=l.closePopWindowByIdV2,exports.closePopWindowByTagV2=l.closePopWindowByTagV2,exports.getAllPopWindowsV2=l.getAllPopWindowsV2,exports.showPopWindowV2=l.showPopWindowV2,exports.usePopWindowV2=p.usePopWindowV2,exports.useDialog=d.useDialog,exports.ImageViewer=a.default,exports.useImageViewer=x.useImageViewer,exports.useDrawer=c.useDrawer,exports.withInstall=m.withInstall,exports.withInstallDirectives=m.withInstallDirectives,exports.vCopy=q.default,exports.vDrag=j.default,exports.vAutoScroll=h.default,exports.vTooltip=w.default,exports.vConfirm=V.default,exports.vCountTo=T.default,exports.utils=Z.default,exports.is=g,exports.useZnForm=f.useZnForm,exports.useZnFormV2=I.useZnFormV2,exports.useZnSearch=W.useZnSearch,exports.ZnChart=F.ZnChart,exports.ZnCountTo=P.ZnCountTo,exports.ZnFormItem=z.default,exports.ZnForm=v.ZnForm,exports.batchExecute=b.batchExecute,exports.camelCaseToHyphen=b.camelCaseToHyphen,exports.checkFeatureSupport=b.checkFeatureSupport,exports.createUniqueId=b.createUniqueId,exports.debounce=b.debounce,exports.delay=b.delay,exports.executeInIdle=b.executeInIdle,exports.getElementOffsetTop=b.getElementOffsetTop,exports.getMemoryUsage=b.getMemoryUsage,exports.getObjectHash=b.getObjectHash,exports.isDeepEqual=b.isDeepEqual,exports.isElementInViewport=b.isElementInViewport,exports.isShallowEqual=b.isShallowEqual,exports.throttle=b.throttle,exports.ZnFormV2Item=y.default,exports.ZnFormV2=k.ZnFormV2,exports.ZnGrid=D.ZnGrid,exports.ZnGridItem=D.ZnGridItem,exports.ZnNumberScroll=S.ZnNumberScroll,exports.ZnSearch=E.ZnSearch,exports.ZnTable=C.ZnTable,exports.ZnTest=B.ZnTest,exports.ZnTimeline=G.ZnTimeline,exports.ZnTreeFilter=A.ZnTreeFilter,exports.ZnTreeSelect=U.ZnTreeSelect,exports.initVXETable=L.initVXETable,exports.isVXETableInitialized=L.isVXETableInitialized,exports.ZnWorkGrid=O.ZnWorkGrid,exports.ZnVirtualTable=H.default;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./installer.js");require("./functions/index.js"),require("./hooks/index.js");var o=require("./utils/index.js");require("./directives/index.js"),require("./components/index.js");var r=require("./functions/modules/log.js"),s=require("./hooks/useDialogV2/index.js"),t=require("./hooks/useDrawerV2/index.js"),n=require("./hooks/useDrawerV2/src/index.js"),i=require("./hooks/usePopWindow/src/index.js"),u=require("./hooks/usePopWindow/index.js"),l=require("./hooks/usePopWindowV2/src/index.js"),p=require("./hooks/usePopWindowV2/index.js"),d=require("./hooks/useDialog/index.js"),a=require("./hooks/useImageViewer/src/index.vue2.js"),x=require("./hooks/useImageViewer/index.js"),c=require("./hooks/useDrawer/index.js"),m=require("./utils/install.js"),q=require("./directives/modules/copy.js"),j=require("./directives/modules/drag.js"),h=require("./directives/modules/autoScroll.js"),w=require("./directives/modules/tooltip.js"),V=require("./directives/modules/confirm.js"),T=require("./directives/modules/countTo.js"),Z=require("./functions/modules/uitls.js"),g=require("./functions/modules/is.js"),f=require("./components/znForm/src/hooks/useZnForm.js"),I=require("./components/znFormV2/src/hooks/useZnFormV2.js"),W=require("./components/znSearch/src/hooks/useProSearch.js"),F=require("./components/znChart/index.js"),P=require("./components/znCountTo/index.js"),z=require("./components/znForm/src/components/ZnFormItem.vue2.js"),v=require("./components/znForm/index.js"),b=require("./components/znFormV2/src/helper/index.js"),y=require("./components/znFormV2/src/components/ZnFormV2Item.vue2.js"),k=require("./components/znFormV2/index.js"),D=require("./components/znGrid/index.js"),S=require("./components/znNumberScroll/index.js"),E=require("./components/znSearch/index.js"),C=require("./components/znTable/index.js"),B=require("./components/znTest/index.js"),G=require("./components/znTimeLine/index.js"),A=require("./components/znTreeFilter/index.js"),U=require("./components/znTreeSelect/index.js"),L=require("./components/znVirtualTable/src/utils/vxe-setup.js"),O=require("./components/znWorkGrid/index.js"),H=require("./components/znVirtualTable/src/index.vue2.js");globalThis.log=r.default;"function"==typeof globalThis?.log?.success&&globalThis.log.primary("1.1.15","欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/"),exports.default=e.default,exports.install=e.install,exports.copyText=o.copyText,exports.formatValue=o.formatValue,exports.treeListUtil=o.treeListUtil,exports.treeToList=o.treeToList,exports.log=r.default,exports.useDialogV2=s.useDialogV2,exports.useDrawerV2=t.useDrawerV2,exports.closeAllDrawers=n.closeAllDrawers,exports.closePopWindowById=i.closePopWindowById,exports.closePopWindowByTag=i.closePopWindowByTag,exports.getAllPopWindows=i.getAllPopWindows,exports.showPopWindow=i.showPopWindow,exports.usePopWindow=u.usePopWindow,exports.closePopWindowByIdV2=l.closePopWindowByIdV2,exports.closePopWindowByTagV2=l.closePopWindowByTagV2,exports.getAllPopWindowsV2=l.getAllPopWindowsV2,exports.showPopWindowV2=l.showPopWindowV2,exports.usePopWindowV2=p.usePopWindowV2,exports.useDialog=d.useDialog,exports.ImageViewer=a.default,exports.useImageViewer=x.useImageViewer,exports.useDrawer=c.useDrawer,exports.withInstall=m.withInstall,exports.withInstallDirectives=m.withInstallDirectives,exports.vCopy=q.default,exports.vDrag=j.default,exports.vAutoScroll=h.default,exports.vTooltip=w.default,exports.vConfirm=V.default,exports.vCountTo=T.default,exports.utils=Z.default,exports.is=g,exports.useZnForm=f.useZnForm,exports.useZnFormV2=I.useZnFormV2,exports.useZnSearch=W.useZnSearch,exports.ZnChart=F.ZnChart,exports.ZnCountTo=P.ZnCountTo,exports.ZnFormItem=z.default,exports.ZnForm=v.ZnForm,exports.batchExecute=b.batchExecute,exports.camelCaseToHyphen=b.camelCaseToHyphen,exports.checkFeatureSupport=b.checkFeatureSupport,exports.createUniqueId=b.createUniqueId,exports.debounce=b.debounce,exports.delay=b.delay,exports.executeInIdle=b.executeInIdle,exports.getElementOffsetTop=b.getElementOffsetTop,exports.getMemoryUsage=b.getMemoryUsage,exports.getObjectHash=b.getObjectHash,exports.isDeepEqual=b.isDeepEqual,exports.isElementInViewport=b.isElementInViewport,exports.isShallowEqual=b.isShallowEqual,exports.throttle=b.throttle,exports.ZnFormV2Item=y.default,exports.ZnFormV2=k.ZnFormV2,exports.ZnGrid=D.ZnGrid,exports.ZnGridItem=D.ZnGridItem,exports.ZnNumberScroll=S.ZnNumberScroll,exports.ZnSearch=E.ZnSearch,exports.ZnTable=C.ZnTable,exports.ZnTest=B.ZnTest,exports.ZnTimeline=G.ZnTimeline,exports.ZnTreeFilter=A.ZnTreeFilter,exports.ZnTreeSelect=U.ZnTreeSelect,exports.initVXETable=L.initVXETable,exports.isVXETableInitialized=L.isVXETableInitialized,exports.ZnWorkGrid=O.ZnWorkGrid,exports.ZnVirtualTable=H.default;
2
2
  //# sourceMappingURL=index.js.map
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../packages/index.ts"],"sourcesContent":["import installer from './installer'\nimport { log } from './functions'\nexport * from './hooks'\nexport * from './utils'\nexport * from './installer'\nexport * from './directives'\nexport * from './functions'\nexport * from './components'\n\nexport default installer\nglobalThis.log = log\nconst version = '1.1.13'\nif (typeof globalThis?.log?.success === 'function') {\n globalThis.log.primary(version, '欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/')\n}\n"],"names":["globalThis","log","default","success","primary"],"mappings":"6sEAUAA,WAAWC,IAAMA,EAAAC,QAEuB,mBAA7BF,YAAYC,KAAKE,SACfH,WAAAC,IAAIG,QAFD,SAEkB"}
1
+ {"version":3,"file":"index.js","sources":["../../../packages/index.ts"],"sourcesContent":["import installer from './installer'\nimport { log } from './functions'\nexport * from './hooks'\nexport * from './utils'\nexport * from './installer'\nexport * from './directives'\nexport * from './functions'\nexport * from './components'\n\nexport default installer\nglobalThis.log = log\nconst version = '1.1.15'\nif (typeof globalThis?.log?.success === 'function') {\n globalThis.log.primary(version, '欢迎使用znyg-frontend-common,在线文档:http://192.168.99.34:10000/znyg-frontend-common-docs/')\n}\n"],"names":["globalThis","log","default","success","primary"],"mappings":"6sEAUAA,WAAWC,IAAMA,EAAAC,QAEuB,mBAA7BF,YAAYC,KAAKE,SACfH,WAAAC,IAAIG,QAFD,SAEkB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "znyg-frontend-common",
3
- "version": "1.1.13",
3
+ "version": "1.1.15",
4
4
  "description": "前端公用库",
5
5
  "license": "MIT",
6
6
  "keywords": [