UNPKG

el-plus-powerful-table

Version:

## [DOCS](https://peng-xiao-shuai.github.io/vite-vue-admin-docs/zh-CN/component_directive/component/powerful-table-doc.html)

1 lines 15.3 kB
{"version":3,"file":"btn-plus.mjs","sources":["../../../packages/btn-plus/src/btn-plus.tsx"],"sourcesContent":["import './style.css'\nimport {\n ElButton,\n ElButtonGroup,\n ElCheckbox,\n ElPopover,\n ElScrollbar,\n ElTooltip,\n} from 'element-plus'\nimport { SizeSymbol } from '../../keys'\nimport type { BtnConfig, PowerfulTableHeader } from '~/index'\nimport { LangKey, t } from '~/locale/lang'\n\nconst PTBtnPlus = defineComponent({\n name: 'PTBtnPlus',\n props: {\n // 按钮的配置数据\n btnConfig: {\n type: Object as PropType<BtnConfig.Config<any>>,\n // required: true,\n },\n // 表格的配置数据\n headerList: Array as PropType<PowerfulTableHeader[]>,\n // 表格当前选择的数据集合\n multipleSelection: {\n type: Array as PropType<any[]>,\n default: () => [],\n },\n // 判断是否为移动端\n isTable: Boolean,\n },\n emits: ['update:isTable', 'refresh', 'change'],\n setup(props, { emit, slots }) {\n const size = inject(SizeSymbol)\n\n type State = {\n headerData: PowerfulTableHeader[]\n isPC: boolean\n }\n const state: State = reactive({\n headerData: [],\n // isPC: store.state.isPC.isPC,\n isPC: true,\n })\n\n /**\n * 判断左侧操作按钮是否禁用\n * @param item 当前按钮数据\n * item.operateType 操作类型:none(默认) => 不需要选择数据;single => 有且只能操作一条数据;batch => 批量操作数据(至少选择一条数据以上)\n */\n const btnDisabled = (\n operateType?: 'none' | 'single' | 'batch'\n ): boolean => {\n // 默认不需要操作数据\n if (operateType === 'single' && props.multipleSelection.length !== 1)\n return true\n if (operateType === 'batch' && props.multipleSelection.length < 1)\n return true\n return false\n }\n\n const functionBtnChange = () => {\n // proxy.$parent.anewRender()\n }\n const batchOperate = (type: string, btnItem: BtnConfig.BtnList) => {\n if (typeof btnItem.click === 'function') {\n btnItem.click({\n btnItem,\n rows: props.multipleSelection,\n })\n return\n }\n\n const cb = () => {\n if (type === 'left') {\n emit('change', {\n effect: btnItem.effect,\n rows: props.multipleSelection,\n })\n } else {\n switch (btnItem.effect) {\n case 'refresh':\n emit('refresh')\n break\n case 'switch':\n emit('update:isTable', !props.isTable)\n break\n case 'columns':\n break\n default:\n emit('change', {\n effect: btnItem.effect,\n rows: props.multipleSelection,\n })\n break\n }\n }\n }\n\n if (typeof btnItem.beforeClick !== 'function') {\n cb()\n return false\n }\n\n // 是否显示提示\n new Promise((resolve) => {\n btnItem.beforeClick!(\n {\n btnItem,\n rows: props.multipleSelection,\n },\n resolve\n )\n }).then((res) => {\n if (!res) return false\n cb()\n })\n }\n const stop = watch(\n () => props.headerList,\n (newHeaderList) => {\n if (newHeaderList) {\n state.headerData = newHeaderList\n state.headerData.forEach((item) => {\n item.defaultFilter =\n typeof item.defaultFilter == 'boolean'\n ? item.defaultFilter\n : item.isShowOrFilterColumn == 'filter'\n item.defaultShow =\n typeof item.defaultShow == 'undefined' ? true : item.defaultShow\n })\n }\n },\n { immediate: true, deep: true }\n )\n\n /**\n * 判断是否弹出提示\n */\n const tipBtnNode = (\n item: BtnConfig.BtnList,\n key: string | number,\n direction: 'left' | 'right' = 'left'\n ) => {\n const btn = (\n <ElButton\n class={[\n item.text ? '' : 'no-margin',\n direction === 'left' ? 'btn-plus-left-item' : 'btn-plus-right-item',\n ]}\n size={size}\n style={item.style || {}}\n disabled={item.disabled || btnDisabled(item.operateType)}\n {...item.property}\n onClick={() => batchOperate(direction, item)}\n v-slots={\n item.text\n ? {\n default: () => item.text,\n }\n : {}\n }\n ></ElButton>\n )\n return item.tip ? (\n <ElTooltip\n key={key}\n content={item.tip}\n class=\"each\"\n effect=\"dark\"\n placement=\"top\"\n >\n {btn}\n </ElTooltip>\n ) : (\n btn\n )\n }\n\n /**\n * 过滤按钮数组\n */\n const filterButtons = (buttons?: BtnConfig.BtnList[]) => {\n return buttons\n ? buttons.filter((item) =>\n typeof item.showBtn === 'function'\n ? item.showBtn()\n : item.showBtn === undefined\n ? true\n : item.showBtn\n )\n : []\n }\n\n /**\n * 气泡框渲染函数\n */\n const popoverSlots = (item: BtnConfig.BtnList, index: number) => {\n return {\n default: () => (\n <div class=\"popover-table\">\n <div class=\"popover-table-row popover-table-header\">\n <div class=\"popover-table-row-label\">{t(LangKey.ColumnName)}</div>\n <div class=\"checkbox\">{t(LangKey.Hidden)}</div>\n <div class=\"checkbox\">{t(LangKey.Filter)}</div>\n </div>\n <ElScrollbar style=\"height: 300px\">\n {state.headerData\n .filter((row) => row.isShowOrFilterColumn !== false)\n .map((row, index) => (\n <div key={index} class=\"popover-table-row\">\n <div class=\"popover-table-row-label\">\n <span class=\"line-1\">{row.label}</span>\n </div>\n <div class=\"checkbox\">\n <ElCheckbox\n v-model={row.defaultShow}\n class=\"checkbox\"\n disabled={\n !(\n row.isShowOrFilterColumn === 'show' ||\n row.isShowOrFilterColumn === undefined\n )\n }\n size={size}\n onChange={() => functionBtnChange()}\n />\n </div>\n <div class=\"checkbox\">\n <ElCheckbox\n v-model={row.defaultFilter}\n class=\"checkbox\"\n disabled={\n !(\n row.isShowOrFilterColumn === 'filter' ||\n row.isShowOrFilterColumn === undefined\n )\n }\n size={size}\n onChange={() => functionBtnChange()}\n />\n </div>\n </div>\n ))}\n </ElScrollbar>\n </div>\n ),\n reference: () => <div>{tipBtnNode(item, index)}</div>,\n }\n }\n\n /**\n * 右侧按钮渲染\n */\n const rightBtnRender = () => {\n return filterButtons(props.btnConfig?.btnRightList).map((item, index) => {\n switch (item.effect) {\n case 'columns':\n return (\n <ElPopover\n placement=\"bottom\"\n trigger=\"click\"\n width=\"250\"\n hide-after={0}\n popper-style=\"padding: 0\"\n v-slots={popoverSlots(item, index)}\n />\n )\n default:\n return tipBtnNode(item, index, 'right')\n }\n })\n }\n\n onBeforeUnmount(() => {\n stop()\n })\n\n return () => (\n <>\n <div\n class={[\n 'pt-btn-plus',\n state.isPC ? 'cl-btn-plus' : 'cl-btn-plus-mobile',\n ]}\n >\n {slots['btn-left'] ? (\n slots['btn-left']()\n ) : filterButtons(props.btnConfig?.btnList).length > 1 ? (\n // /* 左侧操作按钮 */\n <ElButtonGroup class=\"filter-item btn-plus-left\">\n {filterButtons(props.btnConfig?.btnList).map((item, index) =>\n tipBtnNode(item, index)\n )}\n </ElButtonGroup>\n ) : (\n <div class=\"filter-item btn-plus-left\">\n {tipBtnNode(filterButtons(props.btnConfig?.btnList)[0], 0)}\n </div>\n )}\n\n {slots['btn-right'] ? (\n slots['btn-right']()\n ) : filterButtons(props.btnConfig?.btnRightList).length > 1 ? (\n <ElButtonGroup class=\"filter-item btn-plus-right\">\n {rightBtnRender()}\n </ElButtonGroup>\n ) : (\n <div class=\"filter-item btn-plus-right\">{rightBtnRender()}</div>\n )}\n </div>\n </>\n )\n },\n})\n\nexport default PTBtnPlus\n"],"names":["_isSlot","s","_isVNode","PTBtnPlus","defineComponent","props","emit","slots","size","inject","SizeSymbol","state","reactive","btnDisabled","operateType","functionBtnChange","batchOperate","type","btnItem","cb","resolve","res","stop","watch","newHeaderList","item","tipBtnNode","key","direction","btn","_createVNode","ElButton","_mergeProps","ElTooltip","filterButtons","buttons","popoverSlots","index","_slot","t","LangKey","ElScrollbar","row","ElCheckbox","$event","rightBtnRender","_a","ElPopover","onBeforeUnmount","_slot2","_slot3","_Fragment","ElButtonGroup","_b","_c","_d"],"mappings":"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"}