|
@@ -2,14 +2,18 @@
|
|
<div class="menusContainer">
|
|
<div class="menusContainer">
|
|
<div class="top-search">
|
|
<div class="top-search">
|
|
<div class="title">
|
|
<div class="title">
|
|
- <section v-if="typeIndex == null">
|
|
|
|
|
|
+ <section v-if="typeIndex == null && !isSearch">
|
|
<span>热门服务</span>
|
|
<span>热门服务</span>
|
|
</section>
|
|
</section>
|
|
<section v-else>
|
|
<section v-else>
|
|
- <div class="tabs">
|
|
|
|
|
|
+ <div v-if="!isSearch" class="tabs">
|
|
<div class="tab" @click="changeHot">热门服务</div>
|
|
<div class="tab" @click="changeHot">热门服务</div>
|
|
<div class="tab tab1">{{ trees[typeIndex].name }}</div>
|
|
<div class="tab tab1">{{ trees[typeIndex].name }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ <div v-else class="tabs">
|
|
|
|
+ <div class="tab" @click="changeHot">热门服务</div>
|
|
|
|
+ <div class="tab tab1">搜索结果</div>
|
|
|
|
+ </div>
|
|
</section>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<div class="search">
|
|
<div class="search">
|
|
@@ -17,11 +21,12 @@
|
|
<input
|
|
<input
|
|
type="text"
|
|
type="text"
|
|
placeholder="请输入要办理的业务名"
|
|
placeholder="请输入要办理的业务名"
|
|
|
|
+ v-model="searchText"
|
|
@focus="focus"
|
|
@focus="focus"
|
|
@blur="blur"
|
|
@blur="blur"
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
- <div class="searchBtn btnActive">
|
|
|
|
|
|
+ <div class="searchBtn btnActive" @click="search">
|
|
<img src="@/assets/menu/sou.png" />
|
|
<img src="@/assets/menu/sou.png" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -63,8 +68,8 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bottom">
|
|
<div class="bottom">
|
|
- <div class="tip">业务列表 {{ tree }}{{ hot }}</div>
|
|
|
|
- <div class="menu-type">
|
|
|
|
|
|
+ <div v-if="!isSearch" class="tip">业务列表 {{ tree }}{{ hot }}</div>
|
|
|
|
+ <div v-if="!isSearch" class="menu-type">
|
|
<div
|
|
<div
|
|
class="type btnActive"
|
|
class="type btnActive"
|
|
v-for="(item, index) in trees"
|
|
v-for="(item, index) in trees"
|
|
@@ -123,6 +128,9 @@ export default {
|
|
|
|
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ searchText: "",
|
|
|
|
+ isSearch: false,
|
|
|
|
+
|
|
pageNum: 1,
|
|
pageNum: 1,
|
|
|
|
|
|
nowMenus: [],
|
|
nowMenus: [],
|
|
@@ -170,12 +178,16 @@ export default {
|
|
typeEvent(e, i) {
|
|
typeEvent(e, i) {
|
|
this.typeIndex = i;
|
|
this.typeIndex = i;
|
|
this.nowMenus = e.menus;
|
|
this.nowMenus = e.menus;
|
|
|
|
+ this.searchText = "";
|
|
|
|
+ this.isSearch = false;
|
|
this.pageReset();
|
|
this.pageReset();
|
|
},
|
|
},
|
|
|
|
|
|
changeHot() {
|
|
changeHot() {
|
|
this.typeIndex = null;
|
|
this.typeIndex = null;
|
|
this.nowMenus = this.hotMenus;
|
|
this.nowMenus = this.hotMenus;
|
|
|
|
+ this.searchText = "";
|
|
|
|
+ this.isSearch = false;
|
|
this.pageReset();
|
|
this.pageReset();
|
|
},
|
|
},
|
|
|
|
|
|
@@ -271,6 +283,37 @@ export default {
|
|
saveLog(form).then((res) => {});
|
|
saveLog(form).then((res) => {});
|
|
},
|
|
},
|
|
|
|
|
|
|
|
+ search() {
|
|
|
|
+ const treeData = this.treeData;
|
|
|
|
+ if (treeData && treeData.children) {
|
|
|
|
+ const text = this.searchText;
|
|
|
|
+ this.typeIndex = null;
|
|
|
|
+ this.isSearch = true;
|
|
|
|
+ this.pageReset();
|
|
|
|
+ const all = new Array();
|
|
|
|
+ const tree = treeData.children;
|
|
|
|
+ for (let i = 0; i < tree.length; i++) {
|
|
|
|
+ const item = tree[i];
|
|
|
|
+ all.push(...item.children);
|
|
|
|
+ }
|
|
|
|
+ const searchRes = all.filter((item) => {
|
|
|
|
+ if (item.menuName) {
|
|
|
|
+ return item.menuName.includes(text);
|
|
|
|
+ } else if (item.name) {
|
|
|
|
+ return item.name.includes(text);
|
|
|
|
+ }
|
|
|
|
+ return false;
|
|
|
|
+ });
|
|
|
|
+ if (searchRes.length > 0) {
|
|
|
|
+ this.nowMenus = this.customPager(searchRes);
|
|
|
|
+ } else {
|
|
|
|
+ const searchMap = new Map();
|
|
|
|
+ searchMap.set(1, []);
|
|
|
|
+ this.nowMenus = searchMap;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
focus() {
|
|
focus() {
|
|
var data = {
|
|
var data = {
|
|
funcId: "openDwInput",
|
|
funcId: "openDwInput",
|