@meethive/components 0.0.2 → 0.0.4

package/lib/EditTable/Group.js

@@ -1,204 +1,171 @@
- function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
-import { defineComponent, ref, reactive, computed, watch, onMounted } from 'vue'
-import {
-  Tabs as ATabs,
-  TabPane as ATabPane,
-  Dropdown as ADropdown,
-  Menu as AMenu,
-  MenuItem as AMenuItem,
-  Tooltip as ATooltip,
-  Modal as AModal,
-  Form as AForm,
-  FormItem as AFormItem,
-  Input as AInput,
-  Button as AButton,
-  Modal
-} from 'ant-design-vue'
-import { randomNumber } from '@meethive/utils'
-import { isFullScreen } from './utils'
-import { useTableGroupError, useTableWrapper } from './context'
-import { useLocaleReceiver } from '../LocaleReciver'
-import genEditTableStyle from './style'
-
-export default defineComponent({
-  name: 'JEditTableGroup',
-  components: {
-    ATabs,
-    ATabPane,
-    ADropdown,
-    AMenu,
-    AMenuItem,
-    ATooltip,
-    AModal,
-    AForm,
-    AFormItem,
-    AInput,
-    AButton
-  },
-  props: {
-    options: {
-      type: Array ,
-      default: () => []
-    },
-    activeKey: {
-      type: String,
-      default: undefined
-    },
-    readonly: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ['delete', 'edit', 'add', 'change', 'update:activeKey'],
-  setup(props, { emit }) {
-    const [contextLocale] = useLocaleReceiver('EditTable')
-
-    const myActiveKey = ref(props.activeKey)
-    const visible = ref(false)
-    const type = ref(contextLocale.value.Group.addGroup)
-    const errorMap = useTableGroupError()
-    const tableWrapperRef = useTableWrapper()
-    const addIndex = ref(0)
-    const formRef = ref()
-    const formData = reactive({
-      label: undefined
-    })
-
-    const prefixCls = computed(() => 'jetlinks-edit-table')
-    const [wrapSSR, hashId] = genEditTableStyle(prefixCls)
-
-    const onAdd = (targetKey, action) => {
-      if (action === 'add') {
-        type.value = 'add'
-        const groupName = props.options.filter((item) =>
-          item.label.includes(contextLocale.value.Group.one)
-        )
-        let index = addIndex.value + 1
-        let findStatus = false
-
-        while (!findStatus) {
-          const status = groupName.some((item) => {
-            const [_, _index] = item.label.split('_')
-            if (index === Number(_index)) {
-              index = Number(_index) + 1
-              return true
-            }
-            return false
-          })
-          findStatus = !status
-        }
-
-        addIndex.value = index
-        formData.label = contextLocale.value.Group.one + index
-        onOk()
-      }
-    }
-
-    const onEdit = (record) => {
-      visible.value = true
-      type.value = 'edit'
-      formData.label = record.label
-    }
-
-    const onCancel = () => {
-      formRef.value.resetFields()
-      visible.value = false
-    }
-
-    const onOk = () => {
-      const data = { ...formData }
-      if (type.value === 'add') {
-        data.value = 'group_' + randomNumber()
-        myActiveKey.value = data.value
-        emit(type.value, data)
-        emit('change', data.value, data.label)
-        emit('update:activeKey', data.value)
-        visible.value = false
-      } else {
-        formRef.value.validate().then(() => {
-          data.value = myActiveKey.value
-          emit(type.value, data)
-          emit('change', data.value, data.label)
-          visible.value = false
-        })
-      }
-    }
-
-    const change = () => {
-      const item = props.options.find((item) => item.value === myActiveKey.value)
-      emit('change', myActiveKey.value, item.label)
-      emit('update:activeKey', myActiveKey.value)
-    }
-
-    const menuClick = (e, record) => {
-      if (props.readonly) return
-      if (e.key === 'edit') {
-        onEdit(record)
-      } else {
-        Modal.confirm({
-          title: contextLocale.value.Group.deleteMessage,
-          onOk: () => {
-            const index = props.options.findIndex((item) => item.value === record.value)
-            let label = ''
-
-            if (index !== 0 && index === props.options.length - 1) {
-              myActiveKey.value = props.options[index - 1].value
-              label = props.options[index - 1].label
-            } else if (index === 0 && props.options.length === 1) {
-              myActiveKey.value = props.options[0].value
-              label = props.options[0].label
-            } else {
-              myActiveKey.value = props.options[index + 1].value
-              label = props.options[index + 1].label
-            }
-
-            emit('delete', record.value, index)
-            emit('change', myActiveKey.value, label)
-          }
-        })
-      }
-    }
-
-    const popContainer = (e) => {
-      return tableWrapperRef.value || e
-    }
-
-    const modalContainer = () => {
-      if (isFullScreen()) {
-        return tableWrapperRef.value || document.body
-      }
-      return document.body
-    }
-
-    onMounted(() => {
-      myActiveKey.value = _optionalChain([props, 'access', _2 => _2.options, 'access', _3 => _3[0], 'optionalAccess', _4 => _4.value])
-      emit('change', myActiveKey.value, _optionalChain([props, 'access', _5 => _5.options, 'access', _6 => _6[0], 'optionalAccess', _7 => _7.label]))
-      emit('update:activeKey', myActiveKey.value)
-    })
-
-    watch(
-      () => props.activeKey,
-      (val) => {
-        myActiveKey.value = val
-      }
-    )
-
-    return {
-      hashId,
-      contextLocale,
-      myActiveKey,
-      visible,
-      errorMap,
-      tableWrapperRef,
-      formRef,
-      formData,
-      onAdd,
-      onCancel,
-      onOk,
-      change,
-      menuClick,
-      popContainer,
-      modalContainer
-    }
-  }
-})
+import { defineComponent, ref, reactive, computed, watch, onMounted } from 'vue';
+import { Tabs as ATabs, TabPane as ATabPane, Dropdown as ADropdown, Menu as AMenu, MenuItem as AMenuItem, Tooltip as ATooltip, Modal as AModal, Form as AForm, FormItem as AFormItem, Input as AInput, Button as AButton, Modal } from 'ant-design-vue';
+import { randomNumber } from '@meethive/utils';
+import { isFullScreen } from './utils';
+import { useTableGroupError, useTableWrapper } from './context';
+import { useLocaleReceiver } from '../LocaleReciver';
+import genEditTableStyle from './style';
+export default defineComponent({
+  name: 'JEditTableGroup',
+  components: {
+    ATabs,
+    ATabPane,
+    ADropdown,
+    AMenu,
+    AMenuItem,
+    ATooltip,
+    AModal,
+    AForm,
+    AFormItem,
+    AInput,
+    AButton
+  },
+  props: {
+    options: {
+      type: Array,
+      default: () => []
+    },
+    activeKey: {
+      type: String,
+      default: undefined
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['delete', 'edit', 'add', 'change', 'update:activeKey'],
+  setup(props, {
+    emit
+  }) {
+    const [contextLocale] = useLocaleReceiver('EditTable');
+    const myActiveKey = ref(props.activeKey);
+    const visible = ref(false);
+    const type = ref(contextLocale.value.Group.addGroup);
+    const errorMap = useTableGroupError();
+    const tableWrapperRef = useTableWrapper();
+    const addIndex = ref(0);
+    const formRef = ref();
+    const formData = reactive({
+      label: undefined
+    });
+    const prefixCls = computed(() => 'jetlinks-edit-table');
+    const [wrapSSR, hashId] = genEditTableStyle(prefixCls);
+    const onAdd = (targetKey, action) => {
+      if (action === 'add') {
+        type.value = 'add';
+        const groupName = props.options.filter(item => item.label.includes(contextLocale.value.Group.one));
+        let index = addIndex.value + 1;
+        let findStatus = false;
+        while (!findStatus) {
+          const status = groupName.some(item => {
+            const [_, _index] = item.label.split('_');
+            if (index === Number(_index)) {
+              index = Number(_index) + 1;
+              return true;
+            }
+            return false;
+          });
+          findStatus = !status;
+        }
+        addIndex.value = index;
+        formData.label = contextLocale.value.Group.one + index;
+        onOk();
+      }
+    };
+    const onEdit = record => {
+      visible.value = true;
+      type.value = 'edit';
+      formData.label = record.label;
+    };
+    const onCancel = () => {
+      formRef.value.resetFields();
+      visible.value = false;
+    };
+    const onOk = () => {
+      const data = {
+        ...formData
+      };
+      if (type.value === 'add') {
+        data.value = 'group_' + randomNumber();
+        myActiveKey.value = data.value;
+        emit(type.value, data);
+        emit('change', data.value, data.label);
+        emit('update:activeKey', data.value);
+        visible.value = false;
+      } else {
+        formRef.value.validate().then(() => {
+          data.value = myActiveKey.value;
+          emit(type.value, data);
+          emit('change', data.value, data.label);
+          visible.value = false;
+        });
+      }
+    };
+    const change = () => {
+      const item = props.options.find(item => item.value === myActiveKey.value);
+      emit('change', myActiveKey.value, item.label);
+      emit('update:activeKey', myActiveKey.value);
+    };
+    const menuClick = (e, record) => {
+      if (props.readonly) return;
+      if (e.key === 'edit') {
+        onEdit(record);
+      } else {
+        Modal.confirm({
+          title: contextLocale.value.Group.deleteMessage,
+          onOk: () => {
+            const index = props.options.findIndex(item => item.value === record.value);
+            let label = '';
+            if (index !== 0 && index === props.options.length - 1) {
+              myActiveKey.value = props.options[index - 1].value;
+              label = props.options[index - 1].label;
+            } else if (index === 0 && props.options.length === 1) {
+              myActiveKey.value = props.options[0].value;
+              label = props.options[0].label;
+            } else {
+              myActiveKey.value = props.options[index + 1].value;
+              label = props.options[index + 1].label;
+            }
+            emit('delete', record.value, index);
+            emit('change', myActiveKey.value, label);
+          }
+        });
+      }
+    };
+    const popContainer = e => {
+      return tableWrapperRef.value || e;
+    };
+    const modalContainer = () => {
+      if (isFullScreen()) {
+        return tableWrapperRef.value || document.body;
+      }
+      return document.body;
+    };
+    onMounted(() => {
+      myActiveKey.value = props.options[0]?.value;
+      emit('change', myActiveKey.value, props.options[0]?.label);
+      emit('update:activeKey', myActiveKey.value);
+    });
+    watch(() => props.activeKey, val => {
+      myActiveKey.value = val;
+    });
+    return {
+      hashId,
+      contextLocale,
+      myActiveKey,
+      visible,
+      errorMap,
+      tableWrapperRef,
+      formRef,
+      formData,
+      onAdd,
+      onCancel,
+      onOk,
+      change,
+      menuClick,
+      popContainer,
+      modalContainer
+    };
+  }
+});

package/lib/EditTable/Header.js

@@ -1,63 +1,57 @@
-
-import { defineComponent, reactive, computed } from 'vue'
-import { SearchModal, Sort } from './components/Search'
-import { useHScroll, useTableTool } from './hooks'
-import HeaderItemRender from './HeaderRender.js'
-import useEditTableStyle from './style'
-import AIcon from '../Icon'
-
-export default defineComponent({
-  name: 'JEditTableHeader',
-  components: {
-    SearchModal,
-    Sort,
-    HeaderItemRender,
-    AIcon
-  },
-  props: {
-    columns: {
-      type: Array,
-      default: () => []
-    },
-    searchColumns: {
-      type: Array,
-      default: undefined
-    },
-    serial: {
-      type: Boolean,
-      default: false
-    },
-    style: {
-      type: Object,
-      default: undefined
-    }
-  },
-  setup(props) {
-    const prefixCls = computed(() => 'jetlinks-edit-table')
-    const [wrapSSR, hashId] = useEditTableStyle(prefixCls)
-    const tableTool = useTableTool()
-    const hScroll = useHScroll()
-
-    const searchData = reactive({
-      visible: false,
-      key: undefined
-    })
-
-    const showFilter = (key) => {
-      searchData.visible = true
-      searchData.key = key
-    }
-
-    const sortClick = () => {
-      searchData.visible = false
-    }
-
-    return {
-      hashId,
-      tableTool,
-      searchData,
-      showFilter,
-      sortClick
-    }
-  }
-})
+import { defineComponent, reactive, computed } from 'vue';
+import { SearchModal, Sort } from './components/Search';
+import { useHScroll, useTableTool } from './hooks';
+import HeaderItemRender from './HeaderRender.js';
+import useEditTableStyle from './style';
+import AIcon from '../Icon';
+export default defineComponent({
+  name: 'JEditTableHeader',
+  components: {
+    SearchModal,
+    Sort,
+    HeaderItemRender,
+    AIcon
+  },
+  props: {
+    columns: {
+      type: Array,
+      default: () => []
+    },
+    searchColumns: {
+      type: Array,
+      default: undefined
+    },
+    serial: {
+      type: Boolean,
+      default: false
+    },
+    style: {
+      type: Object,
+      default: undefined
+    }
+  },
+  setup(props) {
+    const prefixCls = computed(() => 'jetlinks-edit-table');
+    const [wrapSSR, hashId] = useEditTableStyle(prefixCls);
+    const tableTool = useTableTool();
+    const hScroll = useHScroll();
+    const searchData = reactive({
+      visible: false,
+      key: undefined
+    });
+    const showFilter = key => {
+      searchData.visible = true;
+      searchData.key = key;
+    };
+    const sortClick = () => {
+      searchData.visible = false;
+    };
+    return {
+      hashId,
+      tableTool,
+      searchData,
+      showFilter,
+      sortClick
+    };
+  }
+});

package/lib/EditTable/HeaderRender.js

@@ -1,12 +1,10 @@
-
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: 'HeaderItemRender',
-  props: ['renderFn', 'value'],
-  setup(props) {
-    return () => {
-      return props.renderFn(props.value)
-    }
-  }
-})
+import { defineComponent } from 'vue';
+export default defineComponent({
+  name: 'HeaderItemRender',
+  props: ['renderFn', 'value'],
+  setup(props) {
+    return () => {
+      return props.renderFn(props.value);
+    };
+  }
+});