{"remainingRequest":"/Users/kang/Gitea/vue-element-admin/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/kang/Gitea/vue-element-admin/src/components/HeaderSearch/index.vue?vue&type=style&index=0&id=032bd1f0&lang=scss&scoped=true","dependencies":[{"path":"/Users/kang/Gitea/vue-element-admin/src/components/HeaderSearch/index.vue","mtime":1754409279862},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/css-loader/dist/cjs.js","mtime":1754409278208},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":1754409279720},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/postcss-loader/src/index.js","mtime":1754409279211},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/sass-loader/dist/cjs.js","mtime":1754409279493},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/cache-loader/dist/cjs.js","mtime":1754409278035},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/vue-loader/lib/index.js","mtime":1754409279720}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgouaGVhZGVyLXNlYXJjaCB7CiAgZm9udC1zaXplOiAwICFpbXBvcnRhbnQ7CiAgLnNlYXJjaC1pY29uIHsKICAgIGN1cnNvcjogcG9pbnRlcjsKICAgIGZvbnQtc2l6ZTogMThweDsKICAgIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7CiAgfQogIC5oZWFkZXItc2VhcmNoLXNlbGVjdCB7CiAgICBmb250LXNpemU6IDE4cHg7CiAgICB0cmFuc2l0aW9uOiB3aWR0aCAwLjJzOwogICAgd2lkdGg6IDA7CiAgICBvdmVyZmxvdzogaGlkZGVuOwogICAgYmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7CiAgICBib3JkZXItcmFkaXVzOiAwOwogICAgZGlzcGxheTogaW5saW5lLWJsb2NrOwogICAgdmVydGljYWwtYWxpZ246IG1pZGRsZTsKCiAgICA6OnYtZGVlcCAuZWwtaW5wdXRfX2lubmVyIHsKICAgICAgYm9yZGVyLXJhZGl1czogMDsKICAgICAgYm9yZGVyOiAwOwogICAgICBwYWRkaW5nLWxlZnQ6IDA7CiAgICAgIHBhZGRpbmctcmlnaHQ6IDA7CiAgICAgIGJveC1zaGFkb3c6IG5vbmUgIWltcG9ydGFudDsKICAgICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICNkOWQ5ZDk7CiAgICAgIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7CiAgICB9CiAgfQogICYuc2hvdyB7CiAgICAuaGVhZGVyLXNlYXJjaC1zZWxlY3QgewogICAgICB3aWR0aDogMjEwcHg7CiAgICAgIG1hcmdpbi1sZWZ0OiAxMHB4OwogICAgfQogIH0KfQo="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6KA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/HeaderSearch","sourcesContent":["<template>\n  <div :class=\"{'show':show}\" class=\"header-search\">\n    <svg-icon class-name=\"search-icon\" icon-class=\"search\" @click.stop=\"click\" />\n    <el-select\n      ref=\"headerSearchSelect\"\n      v-model=\"search\"\n      :remote-method=\"querySearch\"\n      filterable\n      default-first-option\n      remote\n      placeholder=\"Search\"\n      class=\"header-search-select\"\n      @change=\"change\"\n    >\n      <el-option v-for=\"item in options\" :key=\"item.path\" :value=\"item\" :label=\"item.title.join(' > ')\" />\n    </el-select>\n  </div>\n</template>\n\n<script>\n// fuse is a lightweight fuzzy-search module\n// make search results more in line with expectations\nimport Fuse from 'fuse.js'\nimport path from 'path'\nimport i18n from '@/lang'\n\nexport default {\n  name: 'HeaderSearch',\n  data() {\n    return {\n      search: '',\n      options: [],\n      searchPool: [],\n      show: false,\n      fuse: undefined\n    }\n  },\n  computed: {\n    routes() {\n      return this.$store.getters.permission_routes\n    },\n    lang() {\n      return this.$store.getters.language\n    },\n    supportPinyinSearch() {\n      return this.$store.state.settings.supportPinyinSearch\n    }\n  },\n  watch: {\n    lang() {\n      this.searchPool = this.generateRoutes(this.routes)\n    },\n    routes() {\n      this.searchPool = this.generateRoutes(this.routes)\n    },\n    searchPool(list) {\n      // Support pinyin search\n      if (this.lang === 'zh' && this.supportPinyinSearch) {\n        this.addPinyinField(list)\n      }\n      this.initFuse(list)\n    },\n    show(value) {\n      if (value) {\n        document.body.addEventListener('click', this.close)\n      } else {\n        document.body.removeEventListener('click', this.close)\n      }\n    }\n  },\n  mounted() {\n    this.searchPool = this.generateRoutes(this.routes)\n  },\n  methods: {\n    async addPinyinField(list) {\n      const { default: pinyin } = await import('pinyin')\n      if (Array.isArray(list)) {\n        list.forEach(element => {\n          const title = element.title\n          if (Array.isArray(title)) {\n            title.forEach(v => {\n              v = pinyin(v, {\n                style: pinyin.STYLE_NORMAL\n              }).join('')\n              element.pinyinTitle = v\n            })\n          }\n        })\n        return list\n      }\n    },\n    click() {\n      this.show = !this.show\n      if (this.show) {\n        this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()\n      }\n    },\n    close() {\n      this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()\n      this.options = []\n      this.show = false\n    },\n    change(val) {\n      this.$router.push(val.path)\n      this.search = ''\n      this.options = []\n      this.$nextTick(() => {\n        this.show = false\n      })\n    },\n    initFuse(list) {\n      this.fuse = new Fuse(list, {\n        shouldSort: true,\n        threshold: 0.4,\n        location: 0,\n        distance: 100,\n        maxPatternLength: 32,\n        minMatchCharLength: 1,\n        keys: [{\n          name: 'title',\n          weight: 0.7\n        }, {\n          name: 'pinyinTitle',\n          weight: 0.3\n        }, {\n          name: 'path',\n          weight: 0.3\n        }]\n      })\n    },\n    // Filter out the routes that can be displayed in the sidebar\n    // And generate the internationalized title\n    generateRoutes(routes, basePath = '/', prefixTitle = []) {\n      let res = []\n      for (const router of routes) {\n        // skip hidden router\n        if (router.hidden) { continue }\n        const data = {\n          path: path.resolve(basePath, router.path),\n          title: [...prefixTitle]\n        }\n        if (router.meta && router.meta.title) {\n          // generate internationalized title\n          const i18ntitle = i18n.t(`route.${router.meta.title}`)\n          data.title = [...data.title, i18ntitle]\n          if (router.redirect !== 'noRedirect') {\n            // only push the routes with title\n            // special case: need to exclude parent router without redirect\n            res.push(data)\n          }\n        }\n        // recursive child routes\n        if (router.children) {\n          const tempRoutes = this.generateRoutes(router.children, data.path, data.title)\n          if (tempRoutes.length >= 1) {\n            res = [...res, ...tempRoutes]\n          }\n        }\n      }\n      return res\n    },\n    querySearch(query) {\n      if (query !== '') {\n        this.options = this.fuse.search(query)\n      } else {\n        this.options = []\n      }\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.header-search {\n  font-size: 0 !important;\n  .search-icon {\n    cursor: pointer;\n    font-size: 18px;\n    vertical-align: middle;\n  }\n  .header-search-select {\n    font-size: 18px;\n    transition: width 0.2s;\n    width: 0;\n    overflow: hidden;\n    background: transparent;\n    border-radius: 0;\n    display: inline-block;\n    vertical-align: middle;\n\n    ::v-deep .el-input__inner {\n      border-radius: 0;\n      border: 0;\n      padding-left: 0;\n      padding-right: 0;\n      box-shadow: none !important;\n      border-bottom: 1px solid #d9d9d9;\n      vertical-align: middle;\n    }\n  }\n  &.show {\n    .header-search-select {\n      width: 210px;\n      margin-left: 10px;\n    }\n  }\n}\n</style>\n"]}]}