Ver código fonte

add:工具more界面和数据对接

guo00guo 5 anos atrás
pai
commit
ca2158fbed

+ 9 - 2
src/pages/Homepage/ResourceAndTool.vue

@@ -2,7 +2,7 @@
   <el-card class="test-card">
     <div slot="header" class="clearfix test-card-header">
       <span>众测资源和工具</span>
-      <a class="pull-right" style="color: rgba(0, 118, 203, 1)" href="#">more>></a>
+      <el-button style="float: right; padding: 3px 0;line-height: 25px" type="text"  @click="getMore()">more>></el-button>
     </div>
     <div>
       <div v-for="item in resourceList" :key="item.code">{{item.name}}</div>
@@ -13,7 +13,14 @@
 <script>
   export default {
     name: "ResourceAndTool",
-    props:['resourceList']
+    props:['resourceList'],
+    methods:{
+        getMore(){
+            this.$router.push({
+                name: 'ResourceList',
+            });
+        },
+    }
   }
 </script>
 

+ 177 - 0
src/pages/HomepageSearch/ResourceList.vue

@@ -0,0 +1,177 @@
+<template>
+  <div class="home-wrapper">
+    <!--    <TopSearch :searchVal="searchVal" :searchType="searchType" :searchTypeArr="searchTypeArr"/>-->
+    <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" @click="gotoHome" style="cursor: pointer">
+            <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 ">
+              <el-tabs v-model="searchType" type="card" @tab-click="handleTypeClick">
+                <el-tab-pane v-for="item in searchTypeArr" v-if="item.value!=='all'" :label="item.name"
+                             :name="item.value"
+                             :key="item.value"></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>
+    </div>
+    <div class="container" style="margin: 20px auto;">
+      <div class="create-body" v-if="!isModifyMode">
+        <div class="title h2">众测资源</div>
+        <el-collapse accordion style="margin: 0 30px">
+          <el-collapse-item v-for="(item,index) in reourceList" :key="item.id" class="item-template">
+            <template slot="title">
+              <el-row style="width: 100%;font-size: 16px">
+                <el-col :span="2"><img :src="item.photoUrl" style="width: 50px; height: 50px;"></el-col>
+                <el-col :span="8">{{item.name}}</el-col>
+<!--                <el-col :span="5">{{item.gender}}性别无</el-col>-->
+<!--                <el-col :span="5">{{item.county}}省市无</el-col>-->
+<!--                <el-col :span="4">{{item.taskCount}}</el-col>-->
+              </el-row>
+            </template>
+          </el-collapse-item>
+          <el-pagination
+            v-if="reourceList&&reourceList.length"
+            :page-size="9"
+            layout="prev, pager, next"
+            :total="totalElements"
+            :current-page="activePage"
+            @current-change="handlePageChange"
+            class="pull-right"
+          >
+          </el-pagination>
+        </el-collapse>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+    import Http from '@/js/http.js';
+    import TopSearch from "../../components/commons/TopSearch";
+    import {storageGet} from '@/js/index.js'
+    import {notify} from "../../constants";
+
+    export default {
+        name: "ReourceList",
+        props: ['searchVal', 'reourceList'],
+        components: {TopSearch},
+        data() {
+            return {
+                isLogin: false,
+                // searchVal: '',
+                searchType: '2',
+                searchTypeArr: [
+                    {
+                        "name": "全部",
+                        "value": "all"
+                    },
+                    {
+                        "name": "项目",
+                        "value": "0"
+                    },
+                    {
+                        "name": "机构",
+                        "value": "1"
+                    },
+                    {
+                        "name": "工具",
+                        "value": "2"
+                    },
+                    {
+                        "name": "专家",
+                        "value": "3"
+                    }],
+                expertList: [],
+                activePage: 1,
+                totalElements: 0
+            }
+        },
+        methods: {
+            loadData() {
+                if (storageGet('user') != null) {
+                    this.isLogin = true;
+                }
+                let url = '/api/common/index/resource';
+                let params = {
+                    "keyword": this.searchVal,
+                    "activePage": this.activePage,
+                    "columnFilters": [
+                        {
+                            "field": "type",
+                            "type": "enums",
+                            "enums": this.searchTypeArr,
+                            "value": this.searchType
+                        }
+                    ]
+                }
+                Http.post(url, params).then((res) => {
+                    console.log(res.data)
+                    this.reourceList = res.data.content;
+                })
+            },
+            checkLogin() {
+                if (!this.isLogin) {
+                    console.log("请登录后访问");
+                    notify('warning', '请登录后访问');
+                } else {
+                    console.log("已登录");
+                    this.$router.push('/project/create');
+                }
+            },
+            handleSearchData() {
+                let url = '/api/common/index/page';
+                let params = {
+                    "keyword": this.searchVal,
+                    "activePage": 1,
+                    "columnFilters": [
+                        {
+                            "field": "type",
+                            "type": "enums",
+                            "enums": this.searchTypeArr,
+                            "value": this.searchType
+                        }
+                    ]
+                }
+                Http.post(url, params).then((res) => {
+                    this.reourceList = res.data.resourcePage.content;
+                })
+            },
+            gotoHome() {
+                this.$router.push('/home');
+            },
+            handleTypeClick(tab) {
+                this.searchType = tab.name
+            },
+            handlePageChange(index) {
+                this.activePage = index;
+                this.searchData();
+            }
+        },
+        mounted() {
+            this.loadData();
+        }
+    }
+</script>
+
+<style scoped>
+  .item-template {
+    height: 80px;
+  }
+</style>

+ 9 - 0
src/router/index.js

@@ -316,6 +316,15 @@ export default new Router({
         requireAuth: false,
       }
     },
+    {
+      path: '/resource/list',
+      name: 'ResourceList',
+      component: resolve => require(['@/pages/HomepageSearch/ResourceList.vue'], resolve),
+      meta: {
+        title: '',
+        requireAuth: false,
+      }
+    },
 
   ]
 })