woker

src/router/modules/web.ts

@@ -12,12 +12,12 @@ export default {
     {
       path: 'list',
       name: '4f6dd2ea-7c0a-4923-9a57-932ef42235f6',
-      component: () => import('@/views/web/list/index.vue'),
+      component: () => import('@/views/web/list/index-worker.vue'),
     },
     {
       path: 'archive',
       name: '2a9583dc-94ed-430e-baa7-b61af9723a0c',
-      component: () => import('@/views/web/archive/index.vue'),
+      component: () => import('@/views/web/archive/index-worker.vue'),
     }
   ]
 }

src/views/web/archive/index-worker.vue

@@ -0,0 +1,770 @@
+<template>
+  <div class="archive-main">
+    <HeadMenu/>
+    <div class="archive-content">
+      <div class="archive-basic" v-if="themeConfigCpt.main.indexStyle" v-loading="state.mainObj.loading">
+        <div class="archive-basic-title">
+          <SvgIcon class="flag" name="flag_1" color="var(--cus-main-color)"/>
+          <span class="main">{{state.mainObj.data[themeConfigCpt.main.indexStyle.mainParam]}}</span>
+          <template v-for="k in themeConfigCpt.main.indexStyle.tagParams">
+            <span class="tag" v-if="state.mainObj.data[k]">{{ state.mainObj.data[k] }}</span>
+          </template>
+        </div>
+        <div class="archive-basic-sub" v-if="themeConfigCpt.main.indexStyle.subParams?.length > 0">
+          <template v-for="(k, i) in themeConfigCpt.main.indexStyle.subParams">
+            <span>{{ state.mainObj.data[k] }}</span>
+            <span class="line" v-if="i < themeConfigCpt.main.indexStyle.subParams.length - 1"/>
+          </template>
+        </div>
+        <div class="archive-basic-avatar" v-if="themeConfigCpt.main.indexStyle.imgParam">
+          <el-image
+            :src="state.mainObj.data[themeConfigCpt.main.indexStyle.imgParam]"
+            :zoom-rate="1.2"
+            :max-scale="7"
+            :min-scale="0.2"
+            :preview-src-list="[state.mainObj.data[themeConfigCpt.main.indexStyle.imgParam]]"
+            :preview-teleported="true"
+          >
+            <template #error>
+              <div class="image-slot">
+                <img src="../../../assets/images/web/archive-main-img.png" alt="暂无图片"/>
+              </div>
+            </template>
+          </el-image>
+        </div>
+        <div class="archive-basic-cols" v-if="themeConfigCpt.main.indexStyle.otherParams?.length > 0">
+          <template v-for="item in themeConfigCpt.main.indexStyle.otherParams">
+            <div class="cols-item">
+              <div class="label">{{ item.label }}</div>
+              <div class="value">{{ state.mainObj.data[item.value] }}</div>
+            </div>
+          </template>
+        </div>
+      </div>
+      <div class="archive-list">
+        <el-tabs v-model="state.activeTab" class="archive-list-tabs">
+          <el-tab-pane label="首页" name="首页"/>
+          <template v-for="([key, value], index) in themeConfigCpt.tabs">
+            <el-tab-pane :label="value.indexName" :name="key"/>
+          </template>
+        </el-tabs>
+        <template v-if="state.activeTab === '首页'">
+          <div class="archive-list-block">
+            <div class="archive-list-block-title">
+              <SvgIcon class="flag" name="flag_1" color="var(--cus-main-color)"/>关系图谱
+              <div class="layout-select">
+                <CusFormColumn
+                  :span="24"
+                  v-model:param="state.chartData.layout"
+                  link="select"
+                  :options="DictionaryStore.relationChartLayoutList"
+                />
+              </div>
+            </div>
+            <div class="archive-list-block-page" v-loading="state.chartData.loading">
+              <RelationChart :data="state.chartData.data" :layout="state.chartData.layout" @chartPage="onChartPage"/>
+            </div>
+          </div>
+          <div class="archive-list-block" v-if="state.chartTable.chartId">
+            <div class="archive-list-block-title">
+              <SvgIcon class="flag" name="flag_1" color="var(--cus-main-color)"/>
+              {{ themeConfigCpt.chart.nodes.filter(v => v.id == state.chartTable.chartId)?.[0]?.name }}
+            </div>
+            <div class="archive-list-block-page" v-loading="state.chartTable.loading">
+              <CusTable
+                :page-num="state.chartTable.page.pageNum"
+                :page-size="state.chartTable.page.pageSize"
+                :total="state.chartTable.result.total"
+                :data="state.chartTable.result.data"
+                :table-head="state.chartTable.tableHead"
+                @handlePage="onPageChart"
+              >
+              </CusTable>
+            </div>
+          </div>
+        </template>
+        <template v-else>
+          <div class="archive-list-block">
+            <div class="archive-list-block-title">
+              <SvgIcon class="flag" name="flag_1" color="var(--cus-main-color)"/>
+              {{ themeConfigCpt.tabs.get(state.activeTab)?.indexName }}
+            </div>
+            <div class="archive-list-block-page" v-loading="state.tabTable.loading">
+              <CusTable
+                :page-num="state.tabTable.page.pageNum"
+                :page-size="state.tabTable.page.pageSize"
+                :total="state.tabTable.result.total"
+                :data="state.tabTable.result.data"
+                :table-head="state.tabTable.tableHead"
+                @handlePage="onPage"
+                :page-sizes="[20, 40, 60, 80, 100]"
+              >
+              </CusTable>
+            </div>
+          </div>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {computed, getCurrentInstance, onMounted, reactive, watch} from "vue";
+import RelationChart from "./relation-chart.vue";
+import {ElLoading, ElMessage} from "element-plus";
+import {useAppStore, useDictionaryStore, useThemeStore} from "@/stores";
+import {frontGetThemeByThemeId, searchLogsSaveSearchLog} from "@/api/modules/web/list";
+import {useRoute} from "vue-router";
+import WorkerWebsocket from "@/worker/worker-websocket?sharedworker";
+
+const ThemeStore = useThemeStore()
+const DictionaryStore = useDictionaryStore()
+const AppStore = useAppStore()
+const route = useRoute()
+const {proxy} = getCurrentInstance()
+const state: any = reactive({
+  activeTab: '',
+  tabTable: {
+    loading: false,
+    page: {
+      pageNum: 1,
+      pageSize: 20
+    },
+    tableHead: [],
+    result: {
+      total: 0,
+      data: []
+    },
+  },
+  chartTable: {
+    chartId: '',
+    loading: false,
+    page: {
+      pageNum: 1,
+      pageSize: 10
+    },
+    tableHead: [],
+    result: {
+      total: 0,
+      data: []
+    },
+  },
+  chartData: {
+    loading: false,
+    data: {
+      nodes: [],
+      edges: []
+    },
+    layout: 'radial'
+  },
+  ws: {
+    getMain: () => {},
+    tabPage: () => {},
+    getChart: () => {},
+    chartPage: () => {},
+    loading: null,
+    loadingTimer: null
+  },
+  themeDetail: {},
+  mainObj: {
+    loading: false,
+    data: {}
+  }
+})
+const themeConfigCpt = computed(() => {
+  const getSearchParam = (item) => {
+    // es查询参数
+    const param = {}
+    if (item.type === 'inner_index') {
+      param.indexCode = item.indexTableName
+      if (item.indexOrder) {
+        const obj = {}
+        JSON.parse(item.indexOrder).forEach(s => {
+          obj[s.sortParam] = s.sortType
+        })
+        param.orderBy = obj
+      }
+      if (item.indexCondition) {
+        const arr: any = []
+        JSON.parse(item.indexCondition).forEach(s => {
+          arr.push({
+            fieldCode: s.indexParam,
+            fieldQueryType: s.condition,
+            fieldQueryValue: route.query[s.themeParam]
+          })
+        })
+        param.datas = arr
+      }
+    } else {
+      param.serviceId = item.indexId
+      if (item.indexCondition) {
+        const obj: any = {}
+        JSON.parse(item.indexCondition).forEach(s => {
+          obj[s.indexParam] = route.query[s.themeParam] || ''
+        })
+        param.serviceMap = obj
+      }
+    }
+    return param
+  }
+  const getTableHead = (item) => {
+    const arr: any = []
+    item.indexFields.forEach(v => {
+      arr.push({value: v.fieldKey, label: v.fieldName})
+    })
+    return arr
+  }
+  const res = {
+    main: <any>{
+      indexStyle: {}
+    },
+    tabs: new Map(),
+    chart: {
+      nodes: <any>[],
+      edges: <any>[],
+    }
+  }
+  state.themeDetail.indexDtos?.forEach(v => {
+    if (v.isMain == 1) {
+      state.chartData.layout = v.chartLayout
+      res.main = {
+        __type: v.type,
+        indexTableName: v.indexTableName,
+        indexId: v.indexId,
+        indexStyle: v.indexStyle ? JSON.parse(v.indexStyle) : '',
+        searchParam: getSearchParam(v),
+        tableHead: getTableHead(v),
+      }
+      res.chart.nodes.unshift({
+        id: String(v.id),
+        iconSrc: v.url,
+        weight: v.weight || 100,
+        num: 0,
+        name: v.indexNameShort,
+        __type: v.type,
+        indexTableName: v.indexTableName,
+        indexId: v.indexId,
+        searchParam: getSearchParam(v),
+        tableHead: getTableHead(v),
+      })
+    } else if (v.relateIndexId) {
+      res.chart.nodes.push({
+        id: String(v.id),
+        iconSrc: v.url,
+        weight: v.weight,
+        num: 0,
+        name: v.indexNameShort,
+        __type: v.type,
+        indexTableName: v.indexTableName,
+        indexId: v.indexId,
+        searchParam: getSearchParam(v),
+        tableHead: getTableHead(v),
+      })
+      res.chart.edges.push({source: String(v.relateIndexId), target: String(v.id), labelText: v.description || '关系描述'})
+    } else {
+      res.tabs.set(v.indexTableName, {
+        __type: v.type,
+        indexName: v.indexName,
+        indexTableName: v.indexTableName,
+        indexId: v.indexId,
+        searchParam: getSearchParam(v),
+        tableHead: getTableHead(v),
+      })
+    }
+  })
+  console.log(res)
+  return res
+})
+const onPage = (pageNum, pageSize) => {
+  state.tabTable.page = {
+    pageNum: pageNum,
+    pageSize: pageSize
+  }
+  state.ws.tabPage()
+}
+const onPageChart = (pageNum, pageSize) => {
+  state.chartTable.page = {
+    pageNum: pageNum,
+    pageSize: pageSize
+  }
+  state.ws.chartPage()
+}
+const onChartPage = (id) => {
+  state.chartTable = {
+    chartId: id,
+    loading: false,
+    page: {
+      pageNum: 1,
+      pageSize: 10
+    },
+    tableHead: themeConfigCpt.value.chart.nodes.filter(v => v.id == id)?.[0]?.tableHead,
+    result: {
+      total: 0,
+      data: []
+    },
+  }
+  state.ws.chartPage()
+}
+const initTheme = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: '获取主题中……',
+    background: ThemeStore.loadingBg
+  })
+  frontGetThemeByThemeId(route.query.themeId).then(res => {
+    state.themeDetail = res.data
+    loading.close()
+    initWorker()
+  })
+}
+watch(() => state.activeTab, (n) => {
+  if (n === '首页') {
+    state.chartTable.chartId = ''
+    state.ws.getChart()
+  } else {
+    state.tabTable = {
+      loading: false,
+      page: {
+        pageNum: 1,
+        pageSize: 20
+      },
+      tableHead: themeConfigCpt.value.tabs.get(n).tableHead,
+      result: {
+        total: 0,
+        data: []
+      },
+    }
+    state.ws.tabPage()
+  }
+})
+const initWorker = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: '搜索服务连接中……',
+    background: ThemeStore.loadingBg
+  })
+  let sessionId = ''
+  let lastTabParams = ''
+  let lastMainParams = ''
+  let lastChartParams = ''
+  let lastChartPageParams = ''
+  const worker = new WorkerWebsocket()
+  worker.port.onmessage = (e) => {
+    const data = JSON.parse(e.data)
+    switch (data.type) {
+      case 'load': {
+        worker.port.postMessage(JSON.stringify({type: 'init', userId: AppStore.userInfo.id}))
+      } break
+      case 'onopen': {
+        loading.close()
+        state.ws.loading?.close()
+        state.ws.loading = null
+        state.ws.getMain = () => {
+          // 如果有的话，终止上一次请求
+          if (lastMainParams) {
+            const p = JSON.parse(lastMainParams)
+            p.flag = 'stop'
+            worker.port.postMessage(JSON.stringify({type: 'send', data: p}))
+            lastMainParams = ''
+          }
+          const params = {
+            __type: themeConfigCpt.value.main.__type,
+            pageNumber: 1,
+            pageSize: 1,
+            type: 'list-fix',
+            sessionId: sessionId,
+            timestamp: new Date().getTime(),
+            flag: 'run',
+            orderBy: {},
+            builder:[
+              {
+                tagCode: '',
+                datas:[
+                  {
+                    typeCode: '',
+                    datas: [themeConfigCpt.value.main.searchParam]
+                  }
+                ]
+              }
+            ],
+          }
+          lastMainParams = JSON.stringify(params)
+          state.mainObj.loading = true
+          worker.port.postMessage(JSON.stringify({type: 'send', data: lastMainParams}))
+        }
+        state.ws.tabPage = () => {
+          // 如果有的话，终止上一次请求
+          if (lastTabParams) {
+            const p = JSON.parse(lastTabParams)
+            p.flag = 'stop'
+            worker.port.postMessage(JSON.stringify({type: 'send', data: p}))
+            lastTabParams = ''
+          }
+          const params = {
+            __type: themeConfigCpt.value.tabs.get(state.activeTab).__type,
+            pageNumber: state.tabTable.page.pageNum,
+            pageSize: state.tabTable.page.pageSize,
+            type: 'list-fix',
+            sessionId: sessionId,
+            timestamp: new Date().getTime(),
+            flag: 'run',
+            builder:[
+              {
+                tagCode: '',
+                datas:[
+                  {
+                    typeCode: '',
+                    datas: [themeConfigCpt.value.tabs.get(state.activeTab).searchParam]
+                  }
+                ]
+              }
+            ],
+          }
+          lastTabParams = JSON.stringify(params)
+          state.tabTable.loading = true
+          worker.port.postMessage(JSON.stringify({type: 'send', data: lastTabParams}))
+        }
+        state.ws.getChart = () => {
+          // 如果有的话，终止上一次请求
+          if (lastChartParams) {
+            const p = JSON.parse(lastChartParams)
+            p.flag = 'stop'
+            worker.port.postMessage(JSON.stringify({type: 'send', data: p}))
+            lastChartParams = ''
+          }
+          const params = {
+            pageNumber: state.tabTable.page.pageNum,
+            pageSize: state.tabTable.page.pageSize,
+            type: 'count-fix',
+            sessionId: sessionId,
+            timestamp: new Date().getTime(),
+            flag: 'run',
+            builder:[
+              {
+                tagCode: '',
+                datas:[
+                  {
+                    typeCode: '',
+                    datas: themeConfigCpt.value.chart.nodes.map(v => v.searchParam)
+                  }
+                ]
+              }
+            ]
+          }
+          lastChartParams = JSON.stringify(params)
+          state.chartData.loading = true
+          worker.port.postMessage(JSON.stringify({type: 'send', data: lastChartParams}))
+        }
+        state.ws.chartPage = () => {
+          // 如果有的话，终止上一次请求
+          if (lastChartPageParams) {
+            const p = JSON.parse(lastChartPageParams)
+            p.flag = 'stop'
+            worker.port.postMessage(JSON.stringify({type: 'send', data: p}))
+            lastChartPageParams = ''
+          }
+          const params = {
+            __type: themeConfigCpt.value.chart.nodes.filter(v => v.id == state.chartTable.chartId)[0].__type,
+            pageNumber: state.chartTable.page.pageNum,
+            pageSize: state.chartTable.page.pageSize,
+            type: 'list-fix',
+            sessionId: sessionId,
+            timestamp: new Date().getTime(),
+            flag: 'run',
+            builder:[
+              {
+                tagCode: '',
+                datas:[
+                  {
+                    typeCode: '',
+                    datas: [themeConfigCpt.value.chart.nodes.filter(v => v.id == state.chartTable.chartId)[0].searchParam]
+                  }
+                ]
+              }
+            ],
+          }
+          lastChartPageParams = JSON.stringify(params)
+          state.chartTable.loading = true
+          worker.port.postMessage(JSON.stringify({type: 'send', data: lastChartPageParams}))
+        }
+      } break
+      case 'onmessage': {
+        try {
+          const json = JSON.parse(data.data)
+          console.log(json)
+          if (json.respCode == -1) {
+            ElMessage.error(json.respMsg)
+            return
+          }
+          if (json.type === 'session') {
+            sessionId = json.sessionId
+            // 左侧
+            if (data.init) {
+              state.ws.getMain()
+              state.activeTab = '首页'
+            }
+          } else {
+            switch (json.type) {
+              case 'list-fix': {
+                if (lastMainParams) {
+                  const pMain = JSON.parse(lastMainParams)
+                  // 返回为最新批次的
+                  if (json.timestamp == pMain.timestamp) {
+                    if (pMain.__type === 'inner_index') {
+                      state.mainObj.data = json.datas?.[0] || {}
+                    } else {
+                      state.mainObj.data = json.datas.data?.[0] || {}
+                    }
+                    state.mainObj.loading = false
+                    lastMainParams = ''
+                  }
+                }
+                if (lastTabParams) {
+                  const pTab = JSON.parse(lastTabParams)
+                  // 返回为最新批次的
+                  if (json.timestamp == pTab.timestamp) {
+                    if (pTab.__type === 'inner_index') {
+                      state.tabTable.result.data = json.datas
+                      state.tabTable.result.total = json.records
+                    } else {
+                      state.tabTable.result.data = json.datas.data
+                      state.tabTable.result.total = json.datas.pathForm.total
+                    }
+                    state.tabTable.loading = false
+                    lastTabParams = ''
+                  }
+                }
+                if (lastChartPageParams) {
+                  const pChartPage = JSON.parse(lastChartPageParams)
+                  // 返回为最新批次的
+                  if (json.timestamp == pChartPage.timestamp) {
+                    if (pChartPage.__type === 'inner_index') {
+                      state.chartTable.result.data = json.datas
+                      state.chartTable.result.total = json.records
+                    } else {
+                      state.chartTable.result.data = json.datas.data
+                      state.chartTable.result.total = json.datas.pathForm.total
+                    }
+                    state.chartTable.loading = false
+                    lastChartPageParams = ''
+                  }
+                }
+              } break
+              case 'count-fix': {
+                if (lastChartParams) {
+                  const pChart = JSON.parse(lastChartParams)
+                  // 返回为最新批次的
+                  if (json.timestamp == pChart.timestamp) {
+                    const obj = {
+                      edges: [...themeConfigCpt.value.chart.edges],
+                      nodes: themeConfigCpt.value.chart.nodes.map(v => {
+                        if (v.__type === 'inner_index') {
+                          v.num = json.datas.filter(s => s.indexCode == v.indexTableName)?.[0]?.data || 0
+                        } else {
+                          v.num = json.datas.filter(s => s.serviceId == v.indexId)?.[0]?.data || 0
+                        }
+                        return v
+                      })
+                    }
+                    state.chartData.data = obj
+                    state.chartData.loading = false
+                    lastChartParams = ''
+                  }
+                }
+              } break
+            }
+          }
+        } catch (e) {
+          console.log(e)
+        }
+      } break
+      case 'onclose': {
+        state.ws.loading = ElLoading.service({
+          lock: true,
+          text: '智搜服务重新连接中……',
+          background: ThemeStore.loadingBg,
+        })
+      } break
+      case 'onconnect': {
+        state.ws.loading.close()
+        state.ws.loading = null
+      } break
+    }
+  }
+}
+onMounted(() => {
+  initTheme()
+  DictionaryStore.initDict('relation_chart_layout')
+})
+</script>
+
+<style lang="scss" scoped>
+.archive-main {
+  width: 100%;
+  height: 100%;
+  background-color: #F6F7FB;
+  display: flex;
+  flex-direction: column;
+  .archive-content {
+    flex: 1;
+    padding: 24px;
+    display: flex;
+    gap: 16px;
+    overflow: hidden;
+    .archive-basic {
+      width: 362px;
+      height: 100%;
+      background: linear-gradient( 180deg, rgba(var(--cus-main-color-rgb), 0.2) 0%, rgba(var(--cus-main-color-rgb),0) 100%), #FFFFFF;
+      box-shadow: 0px 2px 4px 0px rgba(46,129,255,0.2);
+      border-radius: 4px;
+      padding: 16px;
+      display: flex;
+      flex-direction: column;
+      gap: 10px;
+      .archive-basic-title {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        .main {
+          font-weight: bold;
+          font-size: 21px;
+          color: var(--cus-main-color);
+        }
+        .tag {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          padding: 0 8px;
+          background: #f8e5e5;
+          border-radius: 2px;
+          border: 1px solid #FF5454;
+          font-size: 12px;
+          color: #FF5454;
+        }
+      }
+      .archive-basic-sub {
+        display: flex;
+        align-items: center;
+        font-size: 14px;
+        color: var(--cus-text-color-2);
+        line-height: 16px;
+        gap: 10px;
+        .line {
+          width: 1px;
+          height: 10px;
+          background-color: var(--cus-text-color-4);
+        }
+      }
+      .archive-basic-avatar {
+        width: 100%;
+        .el-image {
+          width: 100%;
+          .image-slot {
+            width: 100%;
+            >img {
+              width: 100%;
+            }
+          }
+        }
+      }
+      .archive-basic-cols {
+        display: flex;
+        flex-wrap: wrap;
+        row-gap: 12px;
+        .cols-item {
+          font-size: 14px;
+          min-width: 50%;
+          .label {
+            font-weight: bold;
+            color: var(--cus-text-color-1);
+          }
+          .value {
+            margin-top: 2px;
+            color: var(--cus-text-color-2);
+            text-align: justify;
+          }
+        }
+      }
+    }
+    .archive-list {
+      flex: 1;
+      overflow: hidden;
+      display: flex;
+      flex-direction: column;
+      :deep(.archive-list-tabs) {
+        width: 100%;
+        .el-tabs__header {
+          margin: 0;
+          height: 45px;
+          .el-tabs__nav-wrap {
+            height: 100%;
+            &:after {
+              display: none;
+            }
+            .el-tabs__nav-prev, .el-tabs__nav-next {
+              height: 100%;
+              display: flex;
+              justify-content: center;
+              align-items: center;
+            }
+            .el-tabs__nav-scroll {
+              height: 100%;
+              .el-tabs__nav {
+                height: 100%;
+                .el-tabs__item {
+                  height: 100%;
+                  font-size: 16px;
+                  color: var(--cus-text-color-2);
+                  padding: 0 16px;
+                  &.is-active {
+                    background-color: #FFFFFF;
+                    box-shadow: 0px 4px 10px 0px rgba(62,123,250,0.1);
+                    border-radius: 8px 8px 0px 0px;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+      .archive-list-block {
+        flex: 1;
+        background-color: #FFFFFF;
+        padding: 16px;
+        display: flex;
+        flex-direction: column;
+        gap: 15px;
+        overflow: hidden;
+        &:first-child {
+          border-top-right-radius: 8px;
+        }
+        &:last-child {
+          border-bottom-left-radius: 8px;
+          border-bottom-right-radius: 8px;
+        }
+        .archive-list-block-title {
+          display: flex;
+          align-items: center;
+          font-weight: bold;
+          font-size: 16px;
+          color: var(--cus-text-color-1);
+          .svg-icon {
+            margin-right: 8px;
+          }
+          :deep(.layout-select) {
+            margin-left: auto;
+            .el-form-item {
+              width: 150px;
+              margin-bottom: 0;
+            }
+          }
+        }
+        .archive-list-block-page {
+          flex: 1;
+          overflow: hidden;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/web/list/index.vue

@@ -1,5 +1,4 @@
 <template>
-<!--  <el-button @click="state.worker.port.postMessage(JSON.stringify({type: 'send', data: {type: 'return', pp: 123123}}))">调用ws</el-button>-->
   <div class="list">
     <HeadMenu class="list-head">
       <div class="list-head-search">
@@ -229,7 +228,6 @@ import {useAppStore, useDictionaryStore, useThemeStore, useWebStore, useIndexDBS
 import {ElLoading, ElMessage} from "element-plus";
 import {frontGetIndexAndFieldInfo, searchLogsSaveSearchLog} from "@/api/modules/web/list";
 import DetailCom from './detail.vue'
-import WorkerWebsocket from "@/worker/worker-websocket?sharedworker";
 
 const {proxy} = getCurrentInstance()
 const AppStore = useAppStore()
@@ -285,7 +283,6 @@ const state: any = reactive({
     transfer: {},
     show: false
   },
-  worker: null
 })
 const ref_area = ref()
 const isSelectAllCpt = computed(() => {
@@ -681,262 +678,7 @@ const initWS = () => {
           } break
         }
       }
-    } catch (e) {
-
-    }
-  }
-  ws.onclose = function (){
-    state.ws.loading = ElLoading.service({
-      lock: true,
-      text: '智搜服务重新连接中……',
-      background: ThemeStore.loadingBg,
-    })
-    setTimeout(initWS, 5000);
-  }
-  state.ws.instance = ws
-}
-const initWorker = () => {
-  const worker = new WorkerWebsocket()
-  worker.port.onmessage = (e) => {
-    const data = JSON.parse(e.data)
-    switch (data.type) {
-      case 'load': {
-        worker.port.postMessage(JSON.stringify({type: 'init'}))
-      } break
-      case 'message': {
-        console.log(data)
-      } break
-    }
-  }
-  state.worker = worker
-  const loading = ElLoading.service({
-    lock: true,
-    text: '搜索服务连接中……',
-    background: ThemeStore.loadingBg
-  })
-  const ws: any = new WebSocket(`ws://${location.host}/ws-api/smart-ws?userId=${AppStore.userInfo.id}`)
-  let sessionId = ''
-  let lastCountParams = ''
-  let lastCountStep = 0
-  let lastCountStep_ = 0
-  let countLoading: any = null
-  let lastListParams = ''
-  let lastDetailParams = ''
-  ws.onopen = (e) => {
-    loading.close()
-    state.ws.loading?.close()
-    state.ws.loading = null
-    state.ws.count = () => {
-      state.ws.countPercent = 0
-      // 如果有的话，终止上一次请求
-      if (lastCountParams) {
-        const p = JSON.parse(lastCountParams)
-        p.flag = 'stop'
-        ws.send(JSON.stringify(p))
-        countLoading?.close()
-        countLoading = null
-      }
-      // 如果有的话，终止上一次请求
-      if (lastListParams) {
-        const p = JSON.parse(lastListParams)
-        p.flag = 'stop'
-        ws.send(JSON.stringify(p))
-        lastListParams = ''
-      }
-      // 执行新的请求
-      let step = 0
-      const builder = state.resultParams.tree.map(tag => ({
-        tagCode: tag.treeId,
-        datas: tag.children.map(type => {
-          step++
-          return {
-            typeCode: type.treeId,
-            datas: type.children.map(index => ({
-              indexCode: index.treeId,
-            }))
-          }
-        })
-      }))
-      lastCountStep = step
-      lastCountStep_ = step
-      const params = {
-        builder: builder,
-        keyData: state.searchParams.text,
-        type: 'count',
-        sessionId: sessionId,
-        timestamp: new Date().getTime(),
-        flag: 'run',
-        orderBy: {}
-      }
-      lastCountParams = JSON.stringify(params)
-      countLoading = ElLoading.service({
-        lock: true,
-        text: '数据查询中',
-        background: useThemeStore().loadingBg,
-      })
-      ws.send(lastCountParams)
-    }
-    state.ws.list = (init = true) => {
-      // 如果有的话，终止上一次请求
-      if (lastListParams) {
-        const p = JSON.parse(lastListParams)
-        p.flag = 'stop'
-        ws.send(JSON.stringify(p))
-        lastListParams = ''
-      }
-      if (init) {
-        state.tableParams = {
-          model: state.tableParams.model,
-          pageNum: 1,
-          pageSize: 10,
-          total: 0,
-          data: [],
-          loading: true
-        }
-      }
-      const params = {
-        keyData: state.searchParams.text,
-        pageNumber: state.tableParams.pageNum,
-        pageSize: state.tableParams.pageSize,
-        indexCode: state.resultParams.activeIndex,
-        type: 'list',
-        sessionId: sessionId,
-        timestamp: new Date().getTime(),
-        flag: 'run',
-        orderBy: {}
-      }
-      lastListParams = JSON.stringify(params)
-      state.tableParams.loading = true
-      ws.send(lastListParams)
-      searchLogsSaveSearchLog({keyword: params.keyData})
-    }
-    state.ws.detail = (esId) => {
-      const params = {
-        indexCode: state.resultParams.activeIndex,
-        id: esId,
-        type: 'detail',
-        sessionId: sessionId,
-        timestamp: new Date().getTime(),
-        flag: 'run',
-        orderBy: {}
-      }
-      lastDetailParams = JSON.stringify(params)
-      ws.send(lastDetailParams)
-      state.ws.loading = ElLoading.service({
-        lock: true,
-        text: '详情信息获取中……',
-        background: ThemeStore.loadingBg,
-      })
-      if (state.ws.loadingTimer) {
-        clearTimeout(state.ws.loadingTimer)
-      }
-      state.ws.loadingTimer = setTimeout(() => {
-        const errorParams = JSON.parse(JSON.stringify(lastDetailParams))
-        errorParams.flag = 'stop'
-        ws.send(errorParams)
-        lastDetailParams = ''
-        ElMessage.error('详情信息获取失败！')
-        state.ws.loading?.close()
-        state.ws.loadingTimer = null
-      }, 10000)
-    }
-  }
-  ws.onmessage = (e) => {
-    try {
-      const json = JSON.parse(e.data)
-      if (json.type === 'session') {
-        sessionId = json.sessionId
-        if (state.cascaderParams.options.length === 0) {
-          initArea()
-        }
-      } else {
-        switch (json.type) {
-          case 'count': {
-            const p = JSON.parse(lastCountParams)
-            // 返回为最新批次的
-            if (json.timestamp == p.timestamp) {
-              countLoading?.close()
-              countLoading = null
-              const resTag = json.datas
-              const resType = resTag.datas[0]
-              state.resultParams.tree.forEach(tag => {
-                if (tag.treeId == resTag.tagCode) {
-                  tag.children.forEach(type => {
-                    if (type.treeId == resType.typeCode) {
-                      resType.datas.forEach((index, indexI) => {
-                        type.children.forEach(v => {
-                          if (v.treeId == index.indexCode) {
-                            v.__count = index.data
-                            type.__count = type.__count ? (type.__count + index.data) : index.data
-                            tag.__count = tag.__count ? (tag.__count + index.data) : index.data
-                          }
-                        })
-                      })
-                      type.children.sort((a, b) => b.__count - a.__count)
-                    }
-                  })
-                }
-              })
-              for (let tagI = 0; tagI < state.resultParams.tree.length; tagI++) {
-                const tag = state.resultParams.tree[tagI]
-                if (tag.__count > 0 && !state.resultParams.activeTab) {
-                  state.resultParams.activeTab = tag.treeId
-                  for (let typeI = 0; typeI < tag.children.length; typeI++) {
-                    const type = tag.children[typeI]
-                    if (type.__count > 0) {
-                      type.__expend = true
-                      for (let indexI = 0; indexI < type.children.length; indexI++) {
-                        const index = type.children[indexI]
-                        if (index.__count > 0 && !state.resultParams.activeIndex) {
-                          state.resultParams.activeIndex = index.treeId
-                          state.resultParams.activeKey = index.__id
-                          break
-                        }
-                      }
-                      break
-                    }
-                  }
-                  break
-                }
-              }
-              lastCountStep--
-              state.ws.countPercent = ((lastCountStep_ - lastCountStep) / lastCountStep_ * 100).toFixed(0)
-              if (lastCountStep === 0) {
-                lastCountParams = ''
-              }
-            }
-          } break
-          case 'list': {
-            const p = JSON.parse(lastListParams)
-            // 返回为最新批次的
-            if (json.timestamp == p.timestamp) {
-              state.tableParams.total = json.records
-              state.tableParams.data = json.datas
-              state.tableParams.loading = false
-              lastListParams = ''
-            }
-          } break
-          case 'detail': {
-            const p = JSON.parse(lastDetailParams)
-            // 返回为最新批次的
-            if (json.timestamp == p.timestamp) {
-              clearTimeout(state.ws.loadingTimer)
-              state.ws.loadingTimer = null
-              state.ws.loading?.close()
-              lastDetailParams = ''
-              state.detail.transfer = {
-                indexName: currentIndexCpt.value.treeName,
-                row: json.datas?.[0],
-                config: tableConfigCpt.value.detailConfig
-              }
-              state.detail.show = true
-            }
-          } break
-        }
-      }
-    } catch (e) {
-
-    }
+    } catch (e) {}
   }
   ws.onclose = function (){
     state.ws.loading = ElLoading.service({

src/worker/worker-websocket.js

@@ -1,3 +1,5 @@
+import {ElLoading} from "element-plus";
+
 self.window = self;
 window = self;
 
@@ -5,8 +7,8 @@ const ws = null
 const ports = []
 
 self.onconnect = (event) => {
-  console.log('哈哈哈')
   const port = event.ports[0]
+  port.sessionRes = ''
   ports.push(port)
   console.log(ports)
   port.postMessage(JSON.stringify({type: 'load'}))
@@ -15,19 +17,12 @@ self.onconnect = (event) => {
     switch (data.type) {
       case 'init': {
         if (ports[0]?.ws) {
-          port.postMessage(JSON.stringify({type: 'ready'}))
+          port.postMessage(JSON.stringify({type: 'onopen'}))
           port.ws = ports[0].ws
+          port.sessionRes = ports[0].sessionRes
+          port.postMessage(JSON.stringify({type: 'onmessage', init: true, data: port.sessionRes}))
         } else {
-          port.ws = new WebSocket('ws://localhost:18375')
-          port.ws.onopen = (e) => {
-            console.log(4444)
-            port.postMessage(JSON.stringify({type: 'ready'}))
-          }
-          port.ws.onmessage = (e) => {
-            console.log(555)
-            console.log(e)
-            ports.forEach((p) => p.postMessage(JSON.stringify({type: 'message', data: e.data})))
-          }
+          initWS(port, true, data)
         }
       } break
       case 'send': {
@@ -35,4 +30,33 @@ self.onconnect = (event) => {
       } break
     }
   }
-};
+};
+
+const initWS = (port, init, data) => {
+  port.sessionRes = ''
+  port.ws = new WebSocket(`ws://${location.host}/ws-api/smart-ws?userId=${data.userId}`)
+  port.ws.onopen = (e) => {
+    port.postMessage(JSON.stringify({type: init ? 'onopen' : 'onconnect'}))
+  }
+  port.ws.onmessage = (e) => {
+    const json = JSON.parse(e.data)
+    if (json.type === 'session') {
+      port.sessionRes = e.data
+    }
+    ports.forEach((p) => {
+      p.postMessage(JSON.stringify({type: 'onmessage', init: init, data: e.data}))
+    })
+  }
+  port.ws.onclose = () => {
+    ports.forEach((p) => {
+      p.postMessage(JSON.stringify({type: 'onclose'}))
+    })
+    setTimeout(initWS(port, false, data), 5000);
+  }
+  port.ws.onerror = () => {
+    ports.forEach((p) => {
+      p.postMessage(JSON.stringify({type: 'onclose'}))
+    })
+    setTimeout(initWS(port, false, data), 5000);
+  }
+}