crowd-test-service-frontend/src/components/commons/SearchBar.vue

<template>
  <div class="nav" stype="height:500px">
    <!--搜索框-->
    <el-row class="search-nav" style="padding: 30px 0 20px 0">
      <el-col :span="6">
        <div class="pull-left">
          <img class="logo-img" src="../../assets/img/logo-blue.png"/>
          <span class="logo-title">群智众测平台</span>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="search-nav">
          <div id="search-block " class="">
            <el-tabs v-model="searchType" type="card" @tab-click="handleTypeClick" v-if="tabArr">
              <el-tab-pane v-for="item in tabArr" :label="item.label" :name="item.name" :key="item.label"></el-tab-pane>
            </el-tabs>
            <div class="search-input">
              <el-input placeholder="请输入内容" v-model="searchVal" class="input-with-select">
                <el-button class="search-button" slot="append"  type="primary" @click="handleSearchData()">搜索</el-button>
              </el-input>
            </div>
          </div>
        </div>
      </el-col>
      <el-col :span="6">
        <el-button type="primary pull-right" class="releaseBtn" @click="checkLogin()">免费发布众测需求</el-button>
      </el-col>
    </el-row>
    <!--TabNav-->
    <el-tabs :value="currTab" @tab-click="handleTabClick" class="square-tab" v-if="menuArr">
      <el-tab-pane v-if="!menuArr.menuArr1" v-for="item in menuArr" :name="item.name" :key="item.name" class="tab-menu1">
        <span slot="label" style="font-size: 18px">{{item.label}}</span>
      </el-tab-pane>
      <el-tab-pane v-if="menuArr.menuArr1" v-for="item in menuArr.menuArr1" :label="item.label" :name="item.name" :key="item.name"></el-tab-pane>
      <el-tab-pane v-if="menuArr.menuArr1" v-for="item in menuArr.menuArr2" :label="item.label" :name="item.name" :key="item.name"></el-tab-pane>
      <el-tab-pane v-if="menuArr.menuArr1" v-for="item in menuArr.menuArr3" :label="item.label" :name="item.name" :key="item.name"></el-tab-pane>
    </el-tabs>
    <div>
    </div>
  </div>
</template>


<script>
  import Http from '@/js/http.js'

  export default {
    name: 'SearchBar',
    // components:{},
    props: ['tabArr', 'menuArr'],
    data() {
      return {
        searchType: 'project',
        searchVal: '',
        // currTab:''
      }
    },

    methods: {
      checkLogin() {
        this.checkCreateProjectAuth();
      },
      checkCreateProjectAuth() {
        if (!this.isLogin) {
          console.log("请登录后访问");
          notify('warning', '请登录后访问');
        } else if (this.isLogin) {
          Http.get(Apis.USER.IS_PART.replace('{userId}', this.user.id)).then((res) => {
            this.$router.push('/project/create');
          }).catch((error) => {
            notify('error', error.data)
          })
        }
      },
    }
  }

</script>


<style>

</style>