@ditari/bsui 1.0.4 → 1.0.6

package/src/components/select/Select.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { watch, ref } from "vue";
-import { useDic } from "@dth-doned/hooks";
+import { useDataDicStore } from "../../store/modules/DataDictionary";
 
 interface Props {
   value: any;
@@ -18,43 +18,74 @@ const props = withDefaults(defineProps<Props>(), {
 
 interface Emits {
   (e: "update:value", value: any): void;
+  (e: "change", value: any): void;
 }
 const emits = defineEmits<Emits>();
+const { getDicByKey, list } = useDataDicStore();
 
 const { modelValue, data, onSearch, onSelect } = useSelect();
-function useSelect() {
-  const { getDic } = useDic();
-  const dicData = getDic(props.name);
 
+function useSelect() {
+  // 保存worker启动状态
+  let workerStatus = true;
+  let dicData: any[] = [];
   const data = ref(dicData);
+  // 取值
   const modelValue = ref(props.value);
+  // 创建worker
+  const worker = new Worker(new URL("./dic-worker", import.meta.url), {
+    type: "module"
+  });
+  /**
+   * web worker 启动失败
+   */
+  worker.onerror = () => {
+    workerStatus = false;
+    // 启动失败使用store
+    dicData = getDicByKey(props.name);
+  };
+  /**
+   * 监听web worker发送的数据
+   * @param e
+   */
+  worker.onmessage = (e) => {
+    // 赋值给下拉选择数据变量
+    data.value = [...e.data];
+  };
+
+  // 首次创建的时候发送
+  sendWorkerSearch(modelValue.value);
 
   //监听用户搜索事件
-  const onSearch = (value: string) => {
-    data.value = dicData.filter((item: any) => {
-      return (
-        item.value.toLowerCase().indexOf(value.toLowerCase()) !== -1 ||
-        item.label.toLowerCase().includes(value.toLowerCase())
-      );
-    });
+  const onSearch = (keywords: string) => {
+    if (workerStatus) {
+      sendWorkerSearch(keywords);
+    } else {
+      data.value = dicData
+        .filter((item: any) => {
+          return (
+            item.value.toLowerCase().indexOf(keywords.toLowerCase()) !== -1 ||
+            item.label.toLowerCase().includes(keywords.toLowerCase())
+          );
+        })
+        .splice(0, 10);
+    }
   };
 
+  function sendWorkerSearch(keywords: string) {
+    worker.postMessage({
+      list: JSON.stringify(list[props.name]),
+      keywords: keywords
+    });
+  }
+
   //监听下拉选择事件
   const onSelect = (value: any) => {
     // 发射选择的数据
     emits("update:value", value);
+    emits("change", value);
   };
 
-  //监听数据变化
-  watch(
-    () => props.value,
-    (val) => {
-      modelValue.value = val;
-      if (!val) {
-        data.value = dicData;
-      }
-    }
-  );
   return {
     data,
     modelValue,

package/src/components/select/dic-worker.ts

@@ -0,0 +1,23 @@
+/**
+ * 字典处理worker
+ */
+
+self.addEventListener(
+  "message",
+  function (e) {
+    const keyword = e.data.keywords || "";
+    const parseData = JSON.parse(e.data.list);
+    const filterRs = parseData.filter((item: any) => {
+      return (
+        item.value.toLowerCase().indexOf(keyword.toLowerCase()) !== -1 ||
+        item.label.toLowerCase().includes(keyword.toLowerCase())
+      );
+    });
+    if (filterRs.length === 0) {
+      self.postMessage(parseData.splice(0, 10));
+    } else {
+      self.postMessage(filterRs.splice(0, 10));
+    }
+  },
+  false
+);

package/src/components/select/index.ts

@@ -0,0 +1,5 @@
+import { withInstall } from "../../utils/index";
+import Select from "./Select.vue";
+
+export const DSelect = withInstall(Select);
+export default DSelect;

package/src/components/table/Table.vue

@@ -11,6 +11,7 @@ type Key = string | number;
 interface Props {
   bordered?: boolean;
   keys?: Ref<Key[]>;
+  size?: string;
   columns: any; //表格配置
   data: any; //数据源
   rowKey?: string; //主键id
@@ -25,6 +26,7 @@ interface Props {
 const props = withDefaults(defineProps<Props>(), {
   bordered: false,
   keys: undefined,
+  size: "small",
   columns: [],
   data: [],
   rowKey: "id",
@@ -345,6 +347,7 @@ export default {
     :custom-row="customRow"
     :loading="loading"
     :row-selection="rowSelection"
+    :size="size ?? 'small'"
     :scroll="{
       scrollToFirstRowOnChange: true,
       x: '100%',
@@ -374,6 +377,7 @@ export default {
     class="xi-pagination"
     :disabled="loading"
     show-size-changer
+    :size="configProvider.componentSize ?? 'middle '"
     :hide-on-single-page="paginationConfig.hideOnSinglePage"
     :show-quick-jumper="paginationConfig.showQuickJumper"
     :default-page-size="paginationConfig.defaultPageSize"

package/src/components/theme/variable.scss

@@ -15,7 +15,7 @@ $grid-input-error-border-color: #ff4d4f !default;
 $grid-input-border-width: 2px !default;
 // 网格边框宽度
 $gird-border-width: 1px !default;
-
+$gird-error-display: block !default;
 // show头部阴影
 $box-shadow-color: #e0e0e0 !default;
 

package/src/store/modules/NavTab.ts

@@ -50,9 +50,7 @@ export const useNavTabsStore = defineStore(NAV_TAB_ID, {
      * @param route
      */
     save(route: RouteLocationNormalized) {
-      const flag = this.list.some(
-        (item: INavTab) => item.fullPath === route.fullPath
-      );
+      const flag = this.list.some((item: INavTab) => item.path === route.path);
       if (flag) {
         return;
       }

package/src/store/modules/test/index.ts

@@ -0,0 +1,3 @@
+import { defineStore } from "pinia";
+
+export const useTestStore = defineStore("testid", {});

package/src/tsconfig.json

@@ -7,7 +7,8 @@
     "module": "ESNext",
     "skipLibCheck": true,
     "esModuleInterop": true,
-    "moduleResolution": "Node",
+    "declaration": true,
+    "moduleResolution": "node",
     "allowJs": true,
     "lib": ["esnext", "dom"],
     "types": ["pinia-plugin-persistedstate"],