|
@@ -1,186 +1,190 @@
|
|
<template>
|
|
<template>
|
|
- <view class="narBarCon">
|
|
|
|
- <view class="topBarCon">
|
|
|
|
- <view class="itemCon">
|
|
|
|
- <view class="leftIcon">
|
|
|
|
- <u-icon
|
|
|
|
- v-if="isBack"
|
|
|
|
- @click.once="leftClick"
|
|
|
|
- name="arrow-left"
|
|
|
|
- size="23"
|
|
|
|
- color="#fff"
|
|
|
|
- ></u-icon>
|
|
|
|
- </view>
|
|
|
|
- <view class="title">
|
|
|
|
- <span v-if="!searchShow">{{title}}</span>
|
|
|
|
- <u-search bgColor="#fff" shape="square" :showAction="false" v-if="searchShow" placeholder="请输入关键字" v-model="keyword" @change="onSearchInput"></u-search>
|
|
|
|
- </view>
|
|
|
|
- <view class="rightIcon" v-if="isAdd||isSearch">
|
|
|
|
- <view class="yuan" v-if="!searchShow">
|
|
|
|
- <u-icon
|
|
|
|
- v-if="isSearch"
|
|
|
|
- name="search"
|
|
|
|
- size="24"
|
|
|
|
- color="#eb5a10"
|
|
|
|
- @click="openSearch"
|
|
|
|
- ></u-icon>
|
|
|
|
- <u-icon
|
|
|
|
- v-if="isAdd"
|
|
|
|
- @click="addMenuShow=true"
|
|
|
|
- name="plus"
|
|
|
|
- size="16"
|
|
|
|
- color="#eb5a10"
|
|
|
|
- ></u-icon>
|
|
|
|
- </view>
|
|
|
|
- <view v-if="searchShow" style="font-size: 28rpx;margin-left: 20rpx;" @click="clsoeSearch">取消</view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="searchOptions" v-if="searchToolList.length>0&&searchShow">
|
|
|
|
- <view class="myList" v-for="(item, index) in searchToolList" :key="index" @click="chooseItem(item)">
|
|
|
|
- <u--image
|
|
|
|
- radius="4"
|
|
|
|
- :src="item.icon"
|
|
|
|
- width="32px"
|
|
|
|
- height="32px"
|
|
|
|
- ></u--image>
|
|
|
|
- <view class="name">{{item.funcName}}</view>
|
|
|
|
- <u-icon
|
|
|
|
- name="arrow-right"
|
|
|
|
- size="21"
|
|
|
|
- color="#ccc"
|
|
|
|
- ></u-icon>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <view class="addMenuCon column y-center flex-around" v-if="addMenuShow">
|
|
|
|
- <view class="row wid-80 flex-around" @click="eventUp(1)">
|
|
|
|
- <u-icon name="minus-circle-fill" size="16" color="#fff"></u-icon>
|
|
|
|
- <text>{{toolStatus?'停用':'启用'}}工具</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="row wid-80 flex-around" @click="eventUp(2)">
|
|
|
|
- <u-icon name="file-text-fill" size="20" color="#fff"></u-icon>
|
|
|
|
- <text>申请开放</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="row wid-80 flex-around" @click="eventUp(3)">
|
|
|
|
- <u-icon name="share-square" size="18" color="#fff"></u-icon>
|
|
|
|
- <text>账号授权</text>
|
|
|
|
- </view>
|
|
|
|
- <view class="row wid-80 flex-around" @click="eventUp(4)">
|
|
|
|
- <u-icon name="trash-fill" size="18" color="#fff"></u-icon>
|
|
|
|
- <text>删除工具</text>
|
|
|
|
- </view>
|
|
|
|
-
|
|
|
|
- </view>
|
|
|
|
- <view class="addMenuConZhe" v-if="addMenuShow" v-on:touchstart="addMenuShow=false;searchToolList=[]"/>
|
|
|
|
-<!-- <u-icon class="close-icon" name="close-circle" size="22" color="#fff"></u-icon>-->
|
|
|
|
- </view>
|
|
|
|
|
|
+ <view class="narBarCon">
|
|
|
|
+ <view class="topBarCon">
|
|
|
|
+ <view class="itemCon">
|
|
|
|
+ <view class="leftIcon">
|
|
|
|
+ <u-icon
|
|
|
|
+ v-if="isBack"
|
|
|
|
+ @click.once="leftClick"
|
|
|
|
+ name="arrow-left"
|
|
|
|
+ size="23"
|
|
|
|
+ color="#fff"
|
|
|
|
+ ></u-icon>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="title">
|
|
|
|
+ <span v-if="!searchShow">{{ title }}</span>
|
|
|
|
+ <u-search bgColor="#fff" shape="square" :showAction="false" v-if="searchShow" placeholder="请输入关键字"
|
|
|
|
+ v-model="keyword" @change="onSearchInput"></u-search>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="rightIcon" v-if="isAdd||isSearch">
|
|
|
|
+ <view class="yuan" v-if="!searchShow">
|
|
|
|
+ <u-icon
|
|
|
|
+ v-if="isSearch"
|
|
|
|
+ name="search"
|
|
|
|
+ size="24"
|
|
|
|
+ color="#eb5a10"
|
|
|
|
+ @click="openSearch"
|
|
|
|
+ ></u-icon>
|
|
|
|
+ <u-icon
|
|
|
|
+ v-if="isAdd"
|
|
|
|
+ @click="addMenuShow=true"
|
|
|
|
+ name="plus"
|
|
|
|
+ size="16"
|
|
|
|
+ color="#eb5a10"
|
|
|
|
+ ></u-icon>
|
|
|
|
+ </view>
|
|
|
|
+ <view v-if="searchShow" style="font-size: 28rpx;margin-left: 20rpx;" @click="clsoeSearch">取消</view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="searchOptions" v-if="searchToolList.length>0&&searchShow">
|
|
|
|
+ <view class="myList" v-for="(item, index) in searchToolList" :key="index" @click="chooseItem(item)">
|
|
|
|
+ <u--image
|
|
|
|
+ radius="4"
|
|
|
|
+ :src="item.icon"
|
|
|
|
+ width="32px"
|
|
|
|
+ height="32px"
|
|
|
|
+ ></u--image>
|
|
|
|
+ <view class="name">{{ item.funcName }}</view>
|
|
|
|
+ <u-icon
|
|
|
|
+ name="arrow-right"
|
|
|
|
+ size="21"
|
|
|
|
+ color="#ccc"
|
|
|
|
+ ></u-icon>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="addMenuCon column y-center flex-around" v-if="addMenuShow">
|
|
|
|
+ <view class="row wid-80 flex-around" @click="eventUp(1)">
|
|
|
|
+ <u-icon name="minus-circle-fill" size="16" color="#fff"></u-icon>
|
|
|
|
+ <text>{{ toolStatus ? '停用' : '启用' }}工具</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="row wid-80 flex-around" @click="eventUp(2)">
|
|
|
|
+ <u-icon name="file-text-fill" size="20" color="#fff"></u-icon>
|
|
|
|
+ <text>申请开放</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="row wid-80 flex-around" @click="eventUp(3)">
|
|
|
|
+ <u-icon name="share-square" size="18" color="#fff"></u-icon>
|
|
|
|
+ <text>账号授权</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="row wid-80 flex-around" @click="eventUp(4)">
|
|
|
|
+ <u-icon name="trash-fill" size="18" color="#fff"></u-icon>
|
|
|
|
+ <text>删除工具</text>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+ <view class="addMenuConZhe" v-if="addMenuShow" v-on:touchstart="addMenuShow=false;searchToolList=[]"/>
|
|
|
|
+ <u-icon class="close-icon" name="close-circle" size="22" color="#fff" @click="onClose"></u-icon>
|
|
|
|
+ </view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import {getFuncListApi} from 'common/api.js'
|
|
|
|
- export default {
|
|
|
|
- name:"yx-navbar",
|
|
|
|
- props:{
|
|
|
|
- isBack:{
|
|
|
|
- type: Boolean,
|
|
|
|
- default: true
|
|
|
|
- },
|
|
|
|
- title:{
|
|
|
|
- type: String,
|
|
|
|
- default: ''
|
|
|
|
- },
|
|
|
|
- isSearch:{
|
|
|
|
- type: Boolean,
|
|
|
|
- default: false
|
|
|
|
- },
|
|
|
|
- isAdd:{
|
|
|
|
- type: Boolean,
|
|
|
|
- default: false
|
|
|
|
- },
|
|
|
|
- toolStatus:{
|
|
|
|
- type: Boolean,
|
|
|
|
- default: true
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- addMenuShow:false,
|
|
|
|
- searchShow:false,
|
|
|
|
- timer:'',
|
|
|
|
- indexList:[
|
|
|
|
- // {url:'https://cdn.uviewui.com/uview/album/1.jpg'},
|
|
|
|
- // {url:'https://cdn.uviewui.com/uview/album/2.jpg'},
|
|
|
|
- ],
|
|
|
|
- keyword:'',
|
|
|
|
- searchToolList:[]
|
|
|
|
- };
|
|
|
|
- },
|
|
|
|
- methods:{
|
|
|
|
- eventUp(e){
|
|
|
|
- this.$emit('eventUp',e)
|
|
|
|
- this.addMenuShow=false
|
|
|
|
- },
|
|
|
|
- // 点击左侧区域
|
|
|
|
- leftClick() {
|
|
|
|
- // 如果配置了autoBack,自动返回上一页
|
|
|
|
- // this.$emit('leftClick')
|
|
|
|
- // if(this.$props.isBack) {
|
|
|
|
- uni.navigateBack()
|
|
|
|
- uni.$emit('refreshPage')
|
|
|
|
- // }
|
|
|
|
- },
|
|
|
|
- // 点击右侧区域
|
|
|
|
- rightClick() {
|
|
|
|
- this.$emit('rightClick')
|
|
|
|
- },
|
|
|
|
- openSearch(){
|
|
|
|
- console.log("2222")
|
|
|
|
- this.searchShow=true
|
|
|
|
- },
|
|
|
|
- clsoeSearch(){
|
|
|
|
- this.keyword=''
|
|
|
|
- this.searchToolList=[]
|
|
|
|
- this.searchShow=false
|
|
|
|
- },
|
|
|
|
- onSearchInput(v){
|
|
|
|
- console.log('onSearchInput',v)
|
|
|
|
- // if(v.length>0)uni.$u.throttle(this.$emit('search',v), 600)
|
|
|
|
- clearTimeout(this.timer)
|
|
|
|
- if(v.length==0)return
|
|
|
|
- this.timer=setTimeout(()=>{
|
|
|
|
- this.allSearch(v)
|
|
|
|
- },1000)
|
|
|
|
- },
|
|
|
|
- async allSearch(e){
|
|
|
|
- console.log('search',e)
|
|
|
|
- let params={
|
|
|
|
- listType:0,
|
|
|
|
- pageIndex:1,
|
|
|
|
- pageSize:9999,
|
|
|
|
- funcName:e,
|
|
|
|
- }
|
|
|
|
- const res = await getFuncListApi(params)
|
|
|
|
- if(res.data.toolList){
|
|
|
|
- this.searchToolList=res.data.toolList
|
|
|
|
- }else{
|
|
|
|
- this.searchToolList=[]
|
|
|
|
- uni.showToast({
|
|
|
|
- title:'搜索无结果',
|
|
|
|
- icon:'none'
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- chooseItem(item){
|
|
|
|
- console.log(item)
|
|
|
|
- this.searchShow=false
|
|
|
|
- this.keyword=''
|
|
|
|
- this.searchToolList=[]
|
|
|
|
- uni.navigateTo({
|
|
|
|
- url:"/pages/detail/detail?id="+item.id
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+import {getFuncListApi} from 'common/api.js'
|
|
|
|
+export default {
|
|
|
|
+ name: "yx-navbar",
|
|
|
|
+ props: {
|
|
|
|
+ isBack: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: true
|
|
|
|
+ },
|
|
|
|
+ title: {
|
|
|
|
+ type: String,
|
|
|
|
+ default: ''
|
|
|
|
+ },
|
|
|
|
+ isSearch: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: false
|
|
|
|
+ },
|
|
|
|
+ isAdd: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: false
|
|
|
|
+ },
|
|
|
|
+ toolStatus: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: true
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ addMenuShow: false,
|
|
|
|
+ searchShow: false,
|
|
|
|
+ timer: '',
|
|
|
|
+ indexList: [
|
|
|
|
+ // {url:'https://cdn.uviewui.com/uview/album/1.jpg'},
|
|
|
|
+ // {url:'https://cdn.uviewui.com/uview/album/2.jpg'},
|
|
|
|
+ ],
|
|
|
|
+ keyword: '',
|
|
|
|
+ searchToolList: []
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ onClose() {
|
|
|
|
+ window.close()
|
|
|
|
+ },
|
|
|
|
+ eventUp(e) {
|
|
|
|
+ this.$emit('eventUp', e)
|
|
|
|
+ this.addMenuShow = false
|
|
|
|
+ },
|
|
|
|
+ // 点击左侧区域
|
|
|
|
+ leftClick() {
|
|
|
|
+ // 如果配置了autoBack,自动返回上一页
|
|
|
|
+ // this.$emit('leftClick')
|
|
|
|
+ // if(this.$props.isBack) {
|
|
|
|
+ uni.navigateBack()
|
|
|
|
+ uni.$emit('refreshPage')
|
|
|
|
+ // }
|
|
|
|
+ },
|
|
|
|
+ // 点击右侧区域
|
|
|
|
+ rightClick() {
|
|
|
|
+ this.$emit('rightClick')
|
|
|
|
+ },
|
|
|
|
+ openSearch() {
|
|
|
|
+ console.log("2222")
|
|
|
|
+ this.searchShow = true
|
|
|
|
+ },
|
|
|
|
+ clsoeSearch() {
|
|
|
|
+ this.keyword = ''
|
|
|
|
+ this.searchToolList = []
|
|
|
|
+ this.searchShow = false
|
|
|
|
+ },
|
|
|
|
+ onSearchInput(v) {
|
|
|
|
+ console.log('onSearchInput', v)
|
|
|
|
+ // if(v.length>0)uni.$u.throttle(this.$emit('search',v), 600)
|
|
|
|
+ clearTimeout(this.timer)
|
|
|
|
+ if (v.length == 0) return
|
|
|
|
+ this.timer = setTimeout(() => {
|
|
|
|
+ this.allSearch(v)
|
|
|
|
+ }, 1000)
|
|
|
|
+ },
|
|
|
|
+ async allSearch(e) {
|
|
|
|
+ console.log('search', e)
|
|
|
|
+ let params = {
|
|
|
|
+ listType: 0,
|
|
|
|
+ pageIndex: 1,
|
|
|
|
+ pageSize: 9999,
|
|
|
|
+ funcName: e,
|
|
|
|
+ }
|
|
|
|
+ const res = await getFuncListApi(params)
|
|
|
|
+ if (res.data.toolList) {
|
|
|
|
+ this.searchToolList = res.data.toolList
|
|
|
|
+ } else {
|
|
|
|
+ this.searchToolList = []
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: '搜索无结果',
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ chooseItem(item) {
|
|
|
|
+ console.log(item)
|
|
|
|
+ this.searchShow = false
|
|
|
|
+ this.keyword = ''
|
|
|
|
+ this.searchToolList = []
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: "/pages/detail/detail?id=" + item.id
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
<style lang="less">
|