Browse Source

增加众测工具页面

wangJJ 4 years ago
parent
commit
237b28bd59

+ 0 - 14
src/components/report/ReportList.vue

@@ -1,20 +1,6 @@
 <template>
   <div class="report-container">
-    <!-- <el-row :gutter="2" v-for="report,index in reportList" :key="index">
-      <el-col :span="6">
-        <span>{{report.name}}</span>
-      </el-col>
-      <el-col :span="10">
-        <span>{{report.file}}</span>
-      </el-col>
-    </el-row>-->
-
     <el-table :showHeader="true" :data="reportList" style="width: 100%">
-<!--      <el-table-column-->
-<!--        prop="userName"-->
-<!--        label="提交用户"-->
-<!--      >-->
-<!--      </el-table-column>-->
       <el-table-column
         prop="name"
         label="报告名称"

+ 1 - 1
src/pages/Statistics/StatisticsReport.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="statistics-container container">
-    <el-card shadow="hover" class="project-statistics-card" v-for="item in agencyList">
+    <el-card shadow="hover" class="project-statistics-card" v-for="item in agencyList" :key="item.id">
       <div class="project-statistics-card-title">{{Object.keys(item)[0]}}</div>
       <div class="project-statistics-card-number">{{item[Object.keys(item)[0]]}}</div>
     </el-card>

+ 75 - 0
src/pages/Technology/CrowdCase.vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="technology-card">
+    <div class="card-wrapper" v-if="true">
+      <el-card  v-for="item in [1,2,3]" :key="item"  style="margin-bottom: 15px">
+        <el-row >
+          <el-col :span="6">
+            <img :src="item.photoUrl" alt="technology-img" class="pull-left technology-img">
+          </el-col>
+          <el-col :span="18" class="technology-detail">
+            <div class="technology-title" @click="gotoDetail(item)">
+              众测知识图谱辅助生成工具
+            </div>
+            <div class="technology-info">
+              <div>简介:xxxxx</div>
+              <div>开发:课题一</div>
+            </div>
+          </el-col>
+        </el-row>
+      </el-card>
+    </div>
+    <div v-else>
+      暂无内容
+    </div>
+  </div>
+</template>
+
+<script>
+  import Http from '@/js/http.js'
+
+  export default {
+    name: 'CrowdCase',
+    // props:['caseList'],
+    methods:{
+      // gotoDetail(item){
+      //   //增加访问量
+      //   Http.get(`/api/technical/updateranking/${item.id}`).then(()=>{
+      //     this.$emit('refreshList');
+      //     window.open(item.articlesUrl);
+      //   })
+      // }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .technology-card {
+    .card-wrapper {
+      .technology-img {
+        width: 100%;
+        height: 130px;
+      }
+      .technology-detail {
+        padding-left: 15px;
+        height: 130px;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        .technology-title{
+          cursor:pointer;
+          font-size:22px;
+          font-family:Source Han Sans CN;
+          font-weight:500;
+          color:rgba(0,0,0,1);
+        }
+        .technology-info {
+          font-size:16px;
+          font-family:Source Han Sans CN;
+          font-weight:400;
+          color:rgba(0,0,0,1);
+        }
+      }
+
+    }
+  }
+</style>

+ 93 - 0
src/pages/Technology/CrowdTool.vue

@@ -0,0 +1,93 @@
+<template>
+  <div class="technology-card">
+    <div class="card-wrapper" v-if="true">
+      <el-card v-for="item in toolList" :key="item.id" style="margin-bottom: 15px">
+        <el-row>
+          <el-col :span="6">
+            <img :src="item.photoUrl" alt="tool-img" class="pull-left technology-img">
+          </el-col>
+          <el-col :span="15" class="technology-detail">
+            <div class="technology-title" >
+              {{item.name}}
+            </div>
+            <div class="technology-info">
+              <div>简介:{{item.description}}</div>
+              <div>开发:{{item.owner}}</div>
+            </div>
+          </el-col>
+          <el-col :span="3">
+            <div @click="gotoDetail(item)">
+              <span style="font-size: 14px">查看详情</span>
+              <i class="el-icon-arrow-right get-info-btn"></i>
+            </div>
+          </el-col>
+        </el-row>
+      </el-card>
+    </div>
+    <div v-else>
+      暂无内容
+    </div>
+  </div>
+</template>
+
+<script>
+  import Http from '@/js/http.js'
+
+  export default {
+    name: 'CrowdTool',
+    props: ['toolList'],
+    methods: {
+      gotoDetail(item) {
+        window.open(item.linkUrl);
+      }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .technology-card {
+    .card-wrapper {
+      .technology-img {
+        width: 100%;
+        height: 130px;
+      }
+
+      .technology-detail {
+        padding-left: 15px;
+        height: 130px;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+
+        .technology-title {
+          cursor: pointer;
+          font-size: 22px;
+          font-family: Source Han Sans CN;
+          font-weight: 500;
+          color: rgba(0, 0, 0, 1);
+        }
+
+        .technology-info {
+          font-size: 16px;
+          font-family: Source Han Sans CN;
+          font-weight: 400;
+          color: rgba(0, 0, 0, 1);
+        }
+      }
+
+      .get-info-btn {
+        display: inline-block;
+        color: white;
+        background-color: #0076cb;
+        border-radius: 50%;
+        width: 18px;
+        height: 18px;
+        margin-left: 5px;
+        font-size: 16px;
+        i {
+          margin: 1px;
+        }
+      }
+    }
+  }
+</style>

+ 30 - 9
src/pages/Technology/Technology2.0.vue

@@ -37,6 +37,12 @@
     <div class="container" style="margin: 15px auto">
       <el-row>
         <el-col :span="18" class="project-task">
+          <CrowdTool
+            :toolList = techArticleList.content v-if="searchType=='2'">
+          </CrowdTool>
+          <CrowdCase
+            :toolList = techArticleList.content v-if="searchType=='3'" @refreshList="loadTechnologyArticles(activePage)">
+          </CrowdCase>
           <TechnologyCard
             :techArticleList = techArticleList.content v-if="searchType=='0'" @refreshList="loadTechnologyArticles(activePage)">
           </TechnologyCard>
@@ -66,6 +72,8 @@
   import SearchBar from '../../components/commons/SearchBar'
   import TechnologyCard from './TechnologyCard'
   import TechnologyMG from './TechnologyMG'
+  import CrowdCase from './CrowdCase'
+  import CrowdTool from './CrowdTool'
   import HotActicle from './HotActicle'
   import PopularProject from '../Square/PopularProject'
   import {storageGet} from '@/js/index.js'
@@ -78,16 +86,28 @@
       TechnologyCard,
       TechnologyMG,
       PopularProject,
-      HotActicle
+      HotActicle,
+      CrowdCase,
+      CrowdTool
     },
     data(){
       return {
         loading: false,
         isLogin: false,
         searchVal: '',
-        searchType:'',
+        searchType:'2',
         searchTypeArr:[
           {
+            "name": "众测工具",
+            "value": "2",
+            "label":'工具'
+          },
+          {
+            "name": "众测案例",
+            "value": "3",
+            "label":'案例'
+          },
+          {
             "name": "技术文章",
             "value": "0",
             "label":'文章'
@@ -115,7 +135,6 @@
       },
       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) => {
@@ -143,8 +162,6 @@
         })
       },
       loadTechnologyArticles(index){
-        // let url=`/api/technical/articles?searchCondition={"keyword":"${this.keyword}","activePage":${this.activePage}}`;
-        // Http.get(encodeURI(url))
         let url = '/api/technical/articles';
         this.activePage = index;
         let params = {
@@ -157,17 +174,21 @@
               "enums": this.searchTypeArr,
               "value": this.searchType//展示技术文章value为0
             }
-          ]
-        }
+          ],
+          "sortType":this.searchType === '2' ? 'id' :null
+        };
         Http.post(url,params)
           .then(res=>{
+            console.log(res.data)
             if(res.data.technicalArticlesPage){
               this.techArticleList = res.data.technicalArticlesPage;
-              this.searchType = '0';
+              // this.searchType = '0';
             }
             else if(res.data.publicationsPage){
               this.techArticleList = res.data.publicationsPage;
-              this.searchType = '1';
+              // this.searchType = '1';
+            }else if(res.data.toolVOPage){
+              this.techArticleList = res.data.toolVOPage;
             }
           })
       },