-
-
+
@@ -34,13 +40,13 @@ export default {
options: [],
searchPool: [],
show: false,
- fuse: undefined
+ fuse: undefined,
}
},
computed: {
routes() {
return this.$store.getters.permission_routes
- }
+ },
},
watch: {
routes() {
@@ -55,7 +61,7 @@ export default {
} else {
document.body.removeEventListener('click', this.close)
}
- }
+ },
},
mounted() {
this.searchPool = this.generateRoutes(this.routes)
@@ -73,15 +79,15 @@ export default {
this.show = false
},
change(val) {
- const path = val.path;
- const query = val.query;
- if(this.ishttp(val.path)) {
+ const path = val.path
+ const query = val.query
+ if (this.ishttp(val.path)) {
// http(s):// 路径新窗口打开
- const pindex = path.indexOf("http");
- window.open(path.substr(pindex, path.length), "_blank");
+ const pindex = path.indexOf('http')
+ window.open(path.substr(pindex, path.length), '_blank')
} else {
if (query) {
- this.$router.push({ path: path, query: JSON.parse(query) });
+ this.$router.push({ path: path, query: JSON.parse(query) })
} else {
this.$router.push(path)
}
@@ -99,13 +105,16 @@ export default {
location: 0,
distance: 100,
minMatchCharLength: 1,
- keys: [{
- name: 'title',
- weight: 0.7
- }, {
- name: 'path',
- weight: 0.3
- }]
+ keys: [
+ {
+ name: 'title',
+ weight: 0.7,
+ },
+ {
+ name: 'path',
+ weight: 0.3,
+ },
+ ],
})
},
// Filter out the routes that can be displayed in the sidebar
@@ -115,11 +124,13 @@ export default {
for (const router of routes) {
// skip hidden router
- if (router.hidden) { continue }
+ if (router.hidden) {
+ continue
+ }
const data = {
path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,
- title: [...prefixTitle]
+ title: [...prefixTitle],
}
if (router.meta && router.meta.title) {
@@ -155,8 +166,8 @@ export default {
},
ishttp(url) {
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
- }
- }
+ },
+ },
}
@@ -166,7 +177,7 @@ export default {
.search-icon {
cursor: pointer;
- font-size: 18px;
+ font-size: 14px;
vertical-align: middle;
}
@@ -189,15 +200,19 @@ export default {
// border-bottom: 1px solid #d9d9d9;
// vertical-align: middle;
border: none;
- background: rgba(255,255,255,0.2);
+ background: rgba(255, 255, 255, 0.2);
border-radius: 4px 4px 4px 4px;
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
- font-size: 12px;
- color: #EBEBEB;
+ font-size: 14px;
+ color: #ebebeb;
text-align: left;
font-style: normal;
text-transform: none;
+ padding-left: 30px;
+ }
+ ::v-deep .el-input__inner::placeholder {
+ color: #C9E7F7;
}
}
@@ -208,4 +223,24 @@ export default {
}
}
}
+
+.header-search-wrapper {
+ position: relative;
+ display: inline-block;
+}
+
+/* 放大镜图标 */
+.search-icon {
+ position: absolute;
+ left: 8px;
+ top: 46%;
+ transform: translateY(-50%);
+ z-index: 3;
+ pointer-events: none; /* 不挡点击 */
+}
+
+/* 给输入框让出图标位置 */
+:deep(.header-search-select .el-input__inner) {
+ padding-left: 32px !important;
+}
+
+
+