Merge branch 'master' of https://git.cocorobo.cn/CocoRoboLabs/ssti-CollegeManage

src/router/index.js

@@ -249,7 +249,7 @@ const routes = [{
             { //成果展示
                 name: 'echarts',
                 path: '/echarts',
-                component: () =>import ('@/views/echarts.vue'),
+                component: () =>import ('@/views/echarts/echarts.vue'),
                 meta: { isAuth: true }
             },
         ]

src/views/activityManage/makerActvity.vue

@@ -52,8 +52,9 @@
         <div class="selectLabel">状态</div>
         <el-select v-model="pavalues.value3" @change="getData" placeholder="请选择">
           <el-option label="所有状态" value=""/>
-          <el-option label="未报销" :value="0"/>
-          <el-option label="已报销" :value="1"/>  
+          <el-option label="未审核" :value="0"/>
+          <el-option label="未报销" :value="1"/> 
+          <el-option label="已报销" :value="2"/>
         </el-select>
       </div>
 
@@ -112,8 +113,9 @@
           align="center"
           min-width="7%">
           <template #default="scope">
-                <span v-if="scope.row.state==0">未报销</span>
-                <span v-if="scope.row.state==1">已报销</span>
+                <span v-if="scope.row.state==0">未审核</span>
+                <span v-if="scope.row.state==1">未报销</span>
+                <span v-if="scope.row.state==2">已报销</span>
           </template>
         </el-table-column>
         <el-table-column
@@ -133,16 +135,15 @@
           >
           <template #default="scope">
               <div class="operations">
-                  <!-- <el-button type="primary" > -->
                         <el-button type="primary"  @click="MADetails(scope.row.acId)" size="mini">查看详情</el-button>
 
                         <el-button type="primary" v-if="scope.row.state==0"  @click="audi(scope.row)" size="mini">审核</el-button>
-                        <el-button type="info" disabled v-show="scope.row.state==1" size="mini">审核</el-button>
+                        <el-button type="info" disabled v-show="scope.row.state==1 || scope.row.state==2" size="mini">审核</el-button>
                         
                         <el-button type="primary"  size="mini" @click="edit(scope)">申请表</el-button>
-                        <el-button type="primary" v-show="scope.row.reportFile==''||scope.row.reportFile==null" size="mini" @click="end(scope.row)" >完结</el-button>
-                        <el-button type="info" v-show="scope.row.reportFile!=''&&scope.row.reportFile!=null" size="mini" disabled>完结</el-button>
-                  <!-- </el-button> -->
+                        <el-button type="primary" v-show="scope.row.state==1" size="mini" @click="end(scope.row)" >完结</el-button>
+                        <el-button type="info" v-show="scope.row.state==2||scope.row.state==0" size="mini" disabled>完结</el-button>
+
               </div>
           </template>
         </el-table-column>
@@ -408,15 +409,26 @@ import beUpload from '../../components/tool/beUpload'
             file:JSON.stringify(this.endTable.file),
           }).then(res=>{
             if(res.data==1){
-              this.$message.success("结项成功");
-              this.endDialog = false;
-
+              this.ajax.post(this.$store.state.api+"/UpdateActivityState",{
+                uid:this.$store.state.userInfo.userid,
+                aid:this.endTable.Id,
+                st:2,
+              }).then(res2=>{
+                if(res2.data==1){
+                  this.$message.success("结项成功");
+                  this.endDialog = false;
+                  this.getData()
+                }else{
+                  this.$message.error("结项失败")
+                }
+                this.getData();
+              }).catch(err2=>{
+                console.log(err2)
+              })
             }else{
               this.$message.error("结项失败")
             }
-            this.getData();
           })
-          // this.endDialog=false;
         },
         
         edit(){ // 申请表按钮

src/views/echarts.vue

@@ -1,428 +0,0 @@
-<template>
-    <!-- 创业公司登记 -->
-    <div class="firm">
-      <div class="pAHeader">
-        <div class="pAHeader1">数据监测</div>
-      </div>
-      <hr />
-      <!-- 顶部展示信息区开始 -->
-      <div class="topDataBlock">    
-        <div class="topData">
-          <div class="DataTitle">创客项目人数</div>
-          <div class="topData_value">
-            <span>{{HeaderData.people}}</span>
-            <span><img src="@/assets/img/upIcon.png"></span>
-          </div>
-        </div>
-        <div class="topData">
-          <div class="DataTitle">目前积累创客项目数量</div>
-          <div class="topData_value">
-            <span>{{ HeaderData.project }}</span>
-          </div>
-        </div>
-        <div class="topData">
-          <div class="DataTitle">创客活动数量</div>
-          <div class="topData_value">
-            <span>{{ HeaderData.activity }}</span>
-          </div>
-        </div>
-        <div class="topData">
-          <div class="DataTitle">学院目前资金总预算</div>
-          <div class="topData_value">
-            <span>{{ HeaderData.budget }}</span>
-            <span>（千万）</span>
-          </div>
-        </div>
-        <div class="topData">
-          <div class="DataTitle">已支出预算</div>
-          <div class="topData_value">
-            <span>{{ HeaderData.isPay }}</span>
-            <span>（千万）</span>
-          </div>
-        </div>
-        
-      </div>
-      <!-- 顶部展示信息区结束 -->
-
-      <!-- 中部大饼区开始 -->
-     <div class="midBlock">
-        <div ref="Circular" class="mid"></div>
-        <div ref="Horizontal" class="mid"></div>
-     </div>
-      <!-- 中部大饼区结束 -->
-
-      <!-- 柱状图区域开始 -->
-      <div ref="Columnar" class="histogram"></div>
-      <!-- 柱状图区域结束 -->
-
-      <!-- 底部表格区域开始 -->
-      <div class="tabTit">
-          <div>
-              <p>项目排名</p>
-          </div>
-      </div>
-
-      <div class="projectBlock" style="padding-bottom: 60px;">
-      <el-table
-      :data="tableData"
-      tooltip-effect="dark"
-      stripe
-      class="fontSize"
-      :header-cell-style="{ background: '#3867d6',color:'#fff' }"
-      >
-     
-      <el-table-column
-        type="index"
-        label="排名"
-        align="center"
-        width="100">
-      </el-table-column>
-
-      <el-table-column
-        prop="title"
-        label="项目名称"
-        align="center">
-      </el-table-column>
-
-      <el-table-column
-        prop="pro_leader"
-        label="项目负责人"
-        align="center">
-      </el-table-column>
-
-      <el-table-column
-        prop="TypeName"
-        label="创客类型"
-        align="center">
-      </el-table-column>
-
-      <el-table-column
-        prop="Activity"
-        label="活跃度"
-        align="center">
-      </el-table-column>
-
-      <el-table-column
-        prop="ClassName"
-        label="所属学院"
-        align="center">
-      </el-table-column>
-     
-    </el-table>
-    </div>
-<!-- 通知表格结束-->
-      <!-- 底部表格区域结束 -->
-
-
-    </div>
-  </template>
-    
-  <script>
- import * as echarts from 'echarts';
-  export default {
-   
-    data() {
-      return {
-        //头部区域数据
-        HeaderData:{
-          people:329,
-          project:40,
-          activity:25,
-          budget:100,
-          isPay:25
-        },
-        //圆形
-        CircularData:[
-          {value:30,name:"个人创客"},
-          {value:70,name:"创客活动"}
-        ],
-        //横行的柱状
-        HorizontalData:[
-            [ '物联网激光切割器',0],
-            [ '人工智能领跑马拉松',1000, ],
-            [ '3D演奏智能工具', 2000],
-            [ '人工智能分链机器',3000],
-        ],
-        // 柱状
-        ColumnarData:[
-              ['3D智能分链机器', 2000],
-              ['3D智能分链机器1',3000],
-              ['3D智能分链机器2', 2500],
-              ['3D智能分链机器3', 1000],
-              ['3D智能分链机器4', 2000],
-              ['3D智能分链机器5',3000],
-              ['3D智能分链机器6', 2500],
-              ['3D智能分链机器7', 1000],
-              ['3D智能分链机器8', 2000],
-              ['3D智能分链机器9',3000],
-              ['3D智能分链机器10', 2500],
-              ['3D智能分链机器11', 1000],
-              ['3D智能分链机器12', 2000],
-              ['3D智能分链机器13',3000],
-              ['3D智能分链机器14', 2500],
-              ['3D智能分链机器15', 1000],
-            ],
-        tableData: [
-          {title:"人工智能分链机器",pro_leader:"覃罡彤",TypeName:"个人创客",Activity:"286",ClassName:"信息与通讯学院"},
-          {title:"3D演奏智能工具",pro_leader:"袁一鸣",TypeName:"个人创客",Activity:"225",ClassName:"信息与通讯学院"},
-          {title:"物联网切割机器",pro_leader:"张晓分",TypeName:"个人创客",Activity:"169",ClassName:"中德制造"},
-          {title:"人工智能领航AI马拉松",pro_leader:"林子夏",TypeName:"创客活动",Activity:"121",ClassName:"中德制造"},
-        ]
-      };
-    },
-    methods: {
-      //圆形饼图
-      setCircularData(){
-        const Circular = echarts.init(this.$refs['Circular']);
-        let option = {
-          title:{
-            text:"创新创业项目类型"
-          },
-          legend: {
-            orient: 'vertical',
-            top:"10%",
-            left:"left"
-          },
-          series: [
-            {
-              type: 'pie',
-              label: {
-                show:true,
-                position:"inner",
-                formatter:'{d}%'
-              },
-              data: this.CircularData
-            }
-          ]
-        }
-        Circular.setOption(option)
-      },
-      //横向柱状图
-      setHorizontalData(){
-        const Horizontal = echarts.init(this.$refs['Horizontal']);
-        let option = {
-          grid: {
-            top: 80, // 设置网格顶部的边距为 50px 
-            left:10,
-            bottom:0,
-            right:"100px"
-            // left:'-10px'
-          },
-          title:{
-            text:"创客活动资金"
-          },
-          dataset: {
-            source: [
-              [ 'product', 'amount'],
-              ...this.HorizontalData
-            ],
-          },
-          xAxis: { 
-            position:"top",
-            name:"单位：万元",
-            nameTextStyle:{
-              fontSize:14,
-              align:"left",
-              verticalAlign:"bottom",
-              padding:[0,0,7,10],
-            }
-          },
-          yAxis: {
-            type: 'category',
-            zlevel:1,
-            axisLabel:{
-              inside:true,
-              margin:4,
-              formatter: function (value) {
-                const vl = Math.floor(value.length/2);
-                let newText = value.slice(0,vl)+'\n'+value.slice(vl)
-                return newText;
-            },
-            color:function(value,index){
-              console.log(option)
-              const textWidth = option['dataset']['source'][option['dataset']['source'].length-1][1]/6/2;
-              const vl = option['dataset']['source'][index+1][1]
-              return vl >= textWidth ? 'white' : '#3c4654';
-            }
-            },
-          },
-          series: [
-            {
-              type: 'bar',
-              barWidth:55,
-              label:{
-                show:true,
-                position:"right"
-              },
-              encode: {
-                x: 'amount',
-                y: 'product'
-              },
-              itemStyle:{
-                color:"#3eb370"
-              }
-            }
-          ]
-        }
-        Horizontal.setOption(option)
-      },
-      setColumnarData(){
-        const Columnar = echarts.init(this.$refs['Columnar']);
-        let option ={
-          grid: {
-            top: 80,
-          },
-          title:{
-            text:"个人创客资金",
-            top:0
-          },
-          dataset: {
-            // 提供一份数据。
-            source:this.ColumnarData
-          },
-          // 声明一个 X 轴，类目轴（category）。默认情况下，类目轴对应到 dataset 第一列。
-          xAxis: { 
-            type: 'category',
-            axisLabel: {
-              formatter: function (value) {
-                // 设置每行显示的最大字符数
-                var maxLength = 4;
-                // 计算文本需要换行的行数
-                var rowNumber = Math.ceil(value.length / maxLength);
-                // 拼接换行后的文本
-                var newText = '';
-                for (var i = 0; i < rowNumber; i++) {
-                  var start = i * maxLength;
-                  var end = start + maxLength;
-                  newText += value.slice(start, end) + '\n';
-                }
-                return newText;
-              }
-            }
-          },
-          // 声明一个 Y 轴，数值轴。
-          yAxis: {
-            name:"单位：万元",
-            nameTextStyle:{
-              fontSize:14,
-              align:"center",
-            }
-          },
-          // 声明多个 bar 系列，默认情况下，每个系列会自动对应到 dataset 的每一列。
-          series: [{ type: 'bar' ,itemStyle:{color:"#5aaef3"}}]
-        }
-        Columnar.setOption(option)
-      }
-    },
-    mounted() {
-      this.setCircularData();
-      this.setHorizontalData();
-      this.setColumnarData();
-    },
-  };
-  </script>
-    
-<style lang="less">
-  .topDataBlock{
-    margin-top: 20px;
-    width: 100%;
-    height: 130px;
-    // background: #b65f5f;
-    display: flex;
-    justify-content:space-between;
-    align-items: center;
-    .topData{
-      width: 19%;
-      height: 94%;
-      border-radius: 5px;
-      box-sizing: border-box;
-      // padding: 15px 10px 10px 35px;
-      .DataTitle{
-        margin: 15px 10px 10px 35px;
-        color: white;
-        font-size: 18px;
-        position: relative;
-        &::after{
-          content: '';
-          display: block;
-          position: absolute;
-          width: 7px;
-          height: 86%;
-          top: 7%;
-          left: -15px;
-          background-color: white;
-        }
-      }
-      .topData_value{
-        width: auto;
-        height: 40%;
-        margin: 15px 20px 10px 20px;
-        display: flex;
-        align-items: center;
-        color: white;
-        span{
-          height: 100%;
-          display: flex;
-          // align-items: flex-end;
-        }
-        span:nth-of-type(1){
-          font-size: 2.8em;
-        }
-        span:nth-of-type(2){
-          align-items: flex-end;
-          img{
-            height: 32px;
-            margin-left: 5px;
-          }
-        }
-      }
-    }
-    .topData:nth-child(1){
-      background-image: linear-gradient(100deg, #3caef5 60%,#497df5);
-    }
-    .topData:nth-child(2){
-      background-image: linear-gradient(100deg, #fcb871 60%,#f77c5f);
-    }
-    .topData:nth-child(3){
-      background-image: linear-gradient(100deg, #3ce0ea 60%,#29bfa3);
-    }
-    .topData:nth-child(4){
-      background-image: linear-gradient(100deg, #3caef5 60%,#497df5);
-    }
-    .topData:nth-child(5){
-      background-image: linear-gradient(100deg, #fcb871 60%,#f77c5f);
-    }
-  }
-  .midBlock{     //中部大饼
-    width: 100%;
-    height: 400px;
-    margin-top: 20px;
-    // background: #ce7070;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    .mid{
-      height: 95%;
-      width: 49%;
-      padding: 20px;
-      box-sizing: border-box;
-      background: #f3f6f7;
-    }
-  }
-
-  .histogram{       //柱状图
-    margin-top: 20px;
-    box-sizing: border-box;
-    padding: 20px;
-    width: 100%;
-    height: 400px;
-    background: #f3f6f7;
-  }
-
-  .el-table__header{
-    height:60px;
-  }
-  .el-table__row{
-    height: 60px;
-  }
-</style>

src/views/echarts/components/CircularChart.vue

@@ -0,0 +1,44 @@
+<template>
+    <div ref="Circular" class="mid"></div>
+</template>
+
+<script>
+ import * as echarts from 'echarts';
+    export default {
+        props:['data'],
+        methods:{
+            setCircularData(){
+              const Circular = echarts.init(this.$refs['Circular']);
+              let option = {
+                title:{
+                  text:"创新创业项目类型"
+                },
+                legend: {
+                  orient: 'vertical',
+                  top:"10%",
+                  left:"left"
+                },
+                series: [
+                  {
+                    type: 'pie',
+                    label: {
+                      show:true,
+                      position:"inner",
+                      formatter:'{d}%'
+                    },
+                    data: this.data
+                  }
+                ]
+              }
+              Circular.setOption(option)
+            },
+        },
+        mounted(){
+            this.setCircularData();
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/views/echarts/components/ColumnarChart.vue

@@ -0,0 +1,67 @@
+<template>
+    <div ref="Columnar" class="histogram"></div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+    export default {
+        props:['data'],
+        methods:{
+            //横向柱状图
+            setColumnarData(){
+              const Columnar = echarts.init(this.$refs['Columnar']);
+              let option ={
+                grid: {
+                  top: 80,
+                },
+                title:{
+                  text:"个人创客资金",
+                  top:0
+                },
+                dataset: {
+                  // 提供一份数据。
+                  source:this.data
+                },
+                // 声明一个 X 轴，类目轴（category）。默认情况下，类目轴对应到 dataset 第一列。
+                xAxis: { 
+                  type: 'category',
+                  axisLabel: {
+                    formatter: function (value) {
+                      // 设置每行显示的最大字符数
+                      var maxLength = 4;
+                      // 计算文本需要换行的行数
+                      var rowNumber = Math.ceil(value.length / maxLength);
+                      // 拼接换行后的文本
+                      var newText = '';
+                      for (var i = 0; i < rowNumber; i++) {
+                        var start = i * maxLength;
+                        var end = start + maxLength;
+                        newText += value.slice(start, end) + '\n';
+                      }
+                      return newText;
+                    }
+                  }
+                },
+                // 声明一个 Y 轴，数值轴。
+                yAxis: {
+                  name:"单位：万元",
+                  nameTextStyle:{
+                    fontSize:14,
+                    align:"center",
+                  }
+                },
+                // 声明多个 bar 系列，默认情况下，每个系列会自动对应到 dataset 的每一列。
+                series: [{ type: 'bar' ,itemStyle:{color:"#5aaef3"}}]
+              }
+              Columnar.setOption(option)
+            }
+        },
+        mounted(){
+            this.setColumnarData();
+        }
+    }
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/views/echarts/components/HorizontalChart.vue

@@ -0,0 +1,87 @@
+<template>
+    <div ref="Horizontal" class="mid"></div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+    export default {
+        props:['data'],
+        methods:{
+            setHorizontalData(){
+              const Horizontal = echarts.init(this.$refs['Horizontal']);
+              let option = {
+                grid: {
+                  top: 80, // 设置网格顶部的边距为 50px 
+                  left:10,
+                  bottom:0,
+                  right:"100px"
+                  // left:'-10px'
+                },
+                title:{
+                  text:"创客活动资金"
+                },
+                dataset: {
+                  source: [
+                    [ 'product', 'amount'],
+                    ...this.data
+                  ],
+                },
+                xAxis: { 
+                  position:"top",
+                  name:"单位：万元",
+                  nameTextStyle:{
+                    fontSize:14,
+                    align:"left",
+                    verticalAlign:"bottom",
+                    padding:[0,0,7,10],
+                  }
+                },
+                yAxis: {
+                  type: 'category',
+                  zlevel:1,
+                  axisLabel:{
+                    inside:true,
+                    margin:4,
+                    formatter: function (value) {
+                      const vl = Math.floor(value.length/2);
+                      let newText = value.slice(0,vl)+'\n'+value.slice(vl)
+                      return newText;
+                  },
+                  color:function(value,index){
+                    const textWidth = option['dataset']['source'][option['dataset']['source'].length-1][1]/6/2;
+                    const vl = option['dataset']['source'][index+1][1]
+                    return vl >= textWidth ? 'white' : '#3c4654';
+                  }
+                  },
+                },
+                series: [
+                  {
+                    type: 'bar',
+                    barWidth:55,
+                    label:{
+                      show:true,
+                      position:"right"
+                    },
+                    encode: {
+                      x: 'amount',
+                      y: 'product'
+                    },
+                    itemStyle:{
+                      color:"#3eb370"
+                    }
+                  }
+                ]
+              }
+              Horizontal.setOption(option)
+            },
+        },
+        mounted(){
+            this.setHorizontalData();
+        }
+
+    }
+</script>
+
+<style lang="less" scoped>
+
+</style>

src/views/echarts/components/RankingTable.vue

@@ -0,0 +1,73 @@
+<template>
+    <div>
+        <div class="tabTit">
+          <div>
+              <p>项目排名</p>
+          </div>
+          </div>
+
+          <div class="projectBlock" style="padding-bottom: 60px;">
+          <el-table
+          :data="tableData"
+          tooltip-effect="dark"
+          stripe
+          class="fontSize"
+          :header-cell-style="{ background: '#3867d6',color:'#fff' }"
+          >
+        
+          <el-table-column
+            type="index"
+            label="排名"
+            align="center"
+            width="100">
+          </el-table-column>
+
+          <el-table-column
+            prop="title"
+            label="项目名称"
+            align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="pro_leader"
+            label="项目负责人"
+            align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="TypeName"
+            label="创客类型"
+            align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="Activity"
+            label="活跃度"
+            align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="ClassName"
+            label="所属学院"
+            align="center">
+          </el-table-column>
+      
+        </el-table>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        props:['tableData'],
+    }
+</script>
+
+<style lang="less">
+  .el-table__header{
+    height:60px;
+  }
+  .el-table__row{
+    height: 60px;
+  }
+</style>

src/views/echarts/components/topData.vue

@@ -0,0 +1,125 @@
+<template>
+    <div class="topDataBlock">    
+        <div class="topData">
+          <div class="DataTitle">创客项目人数</div>
+          <div class="topData_value">
+            <span>{{data.people}}</span>
+            <span><img src="@/assets/img/upIcon.png"></span>
+          </div>
+        </div>
+        <div class="topData">
+          <div class="DataTitle">目前积累创客项目数量</div>
+          <div class="topData_value">
+            <span>{{ data.project }}</span>
+          </div>
+        </div>
+        <div class="topData">
+          <div class="DataTitle">创客活动数量</div>
+          <div class="topData_value">
+            <span>{{ data.activity }}</span>
+          </div>
+        </div>
+        <div class="topData">
+          <div class="DataTitle">学院目前资金总预算</div>
+          <div class="topData_value">
+            <span>{{ data.budget }}</span>
+            <span>（千万）</span>
+          </div>
+        </div>
+        <div class="topData">
+          <div class="DataTitle">已支出预算</div>
+          <div class="topData_value">
+            <span>{{ data.isPay }}</span>
+            <span>（千万）</span>
+          </div>
+        </div>
+        
+      </div>
+</template>
+
+<script>
+    export default {
+        props:['data']
+    }
+</script>
+
+<style lang="less" scoped>
+  .topDataBlock{
+    margin-top: 20px;
+    width: 100%;
+    height: 130px;
+    // background: #b65f5f;
+    display: flex;
+    justify-content:space-between;
+    align-items: center;
+    .topData{
+      width: 19%;
+      height: 94%;
+      border-radius: 5px;
+      box-sizing: border-box;
+      position: relative;
+      // padding: 15px 10px 10px 35px;
+      .DataTitle{
+        margin: 15px 10px 10px 0px;
+        color: white;
+        font-size: 18px;
+        position: relative;
+        box-sizing: border-box;
+        padding-left: 35px;
+        width: 100%;
+        text-overflow: ellipsis;
+        display: flex;
+        overflow: hidden;
+        white-space: nowrap;
+        &::after{
+          content: '';
+          display: block;
+          position: absolute;
+          width: 7px;
+          height: 86%;
+          top: 7%;
+          left: 23px;
+          background-color: white;
+        }
+      }
+      .topData_value{
+        width: auto;
+        height: 40%;
+        margin: 15px 20px 10px 20px;
+        display: flex;
+        align-items: center;
+        color: white;
+        span{
+          height: 100%;
+          display: flex;
+          // align-items: flex-end;
+        }
+        span:nth-of-type(1){
+          font-size: 2.8em;
+        }
+        span:nth-of-type(2){
+          align-items: flex-end;
+          img{
+            height: 32px;
+            margin-left: 5px;
+          }
+        }
+      }
+    }
+    .topData:nth-child(1){
+      background-image: linear-gradient(100deg, #3caef5 60%,#497df5);
+    }
+    .topData:nth-child(2){
+      background-image: linear-gradient(100deg, #fcb871 60%,#f77c5f);
+    }
+    .topData:nth-child(3){
+      background-image: linear-gradient(100deg, #3ce0ea 60%,#29bfa3);
+    }
+    .topData:nth-child(4){
+      background-image: linear-gradient(100deg, #3caef5 60%,#497df5);
+    }
+    .topData:nth-child(5){
+      background-image: linear-gradient(100deg, #fcb871 60%,#f77c5f);
+    }
+  }
+</style>

src/views/echarts/echarts.vue

@@ -0,0 +1,126 @@
+<template>
+    <!-- 创业公司登记 -->
+    <div class="firm">
+      <div class="pAHeader">
+        <div class="pAHeader1">数据监测</div>
+      </div>
+      <hr />
+      <!-- 顶部展示信息区开始 -->
+      <topData :data="HeaderData"/>
+      <!-- 顶部展示信息区结束 -->
+      <!-- 中部大饼区开始 -->
+     <div class="midBlock">
+      <!-- 圆形图开始 -->
+      <CircularChart :data="CircularData"/>
+      <!-- 圆形图结束 -->
+      <!-- 横向柱状图开始 -->
+      <HorizontalChart :data="HorizontalData"/>
+      <!-- 横向柱状图结束 -->
+     </div>
+      <!-- 中部大饼区结束 -->
+
+      <!-- 柱状图区域开始 -->
+      <ColumnarChart :data="ColumnarData"/>
+      <!-- 柱状图区域结束 -->
+
+      <!-- 底部表格区域开始 -->
+      <RankingTable :tableData="tableData"/>
+<!-- 通知表格结束-->
+      <!-- 底部表格区域结束 -->
+
+
+    </div>
+  </template>
+    
+  <script>
+ //顶部数据
+ import topData from './components/topData.vue'
+ //圆形图
+ import CircularChart from './components/CircularChart.vue';
+ //横向柱状图
+ import HorizontalChart from './components/HorizontalChart.vue';
+ //竖向柱状图
+ import ColumnarChart from './components/ColumnarChart.vue';
+ //排名表格
+ import RankingTable from './components/RankingTable.vue';
+  export default {
+   components:{topData,CircularChart,HorizontalChart,ColumnarChart,RankingTable},
+    data() {
+      return {
+        //头部区域数据
+        HeaderData:{
+          people:329,
+          project:40,
+          activity:25,
+          budget:100,
+          isPay:25
+        },
+        //圆形
+        CircularData:[
+          {value:30,name:"个人创客"},
+          {value:70,name:"创客活动"}
+        ],
+        //横行的柱状
+        HorizontalData:[
+            [ '物联网激光切割器',0],
+            [ '人工智能领跑马拉松',1000, ],
+            [ '3D演奏智能工具', 2000],
+            [ '人工智能分链机器',3000],
+        ],
+        // 柱状
+        ColumnarData:[
+              ['3D智能分链机器', 2000],
+              ['3D智能分链机器1',3000],
+              ['3D智能分链机器2', 2500],
+              ['3D智能分链机器3', 1000],
+              ['3D智能分链机器4', 2000],
+              ['3D智能分链机器5',3000],
+              ['3D智能分链机器6', 2500],
+              ['3D智能分链机器7', 1000],
+              ['3D智能分链机器8', 2000],
+              ['3D智能分链机器9',3000],
+              ['3D智能分链机器10', 2500],
+              ['3D智能分链机器11', 1000],
+              ['3D智能分链机器12', 2000],
+              ['3D智能分链机器13',3000],
+              ['3D智能分链机器14', 2500],
+              ['3D智能分链机器15', 1000],
+            ],
+        tableData: [
+          {title:"人工智能分链机器",pro_leader:"覃罡彤",TypeName:"个人创客",Activity:"286",ClassName:"信息与通讯学院"},
+          {title:"3D演奏智能工具",pro_leader:"袁一鸣",TypeName:"个人创客",Activity:"225",ClassName:"信息与通讯学院"},
+          {title:"物联网切割机器",pro_leader:"张晓分",TypeName:"个人创客",Activity:"169",ClassName:"中德制造"},
+          {title:"人工智能领航AI马拉松",pro_leader:"林子夏",TypeName:"创客活动",Activity:"121",ClassName:"中德制造"},
+        ]
+      };
+    },
+  };
+  </script>
+    
+<style lang="less">
+  .midBlock{     //中部大饼
+    width: 100%;
+    height: 400px;
+    margin-top: 20px;
+    // background: #ce7070;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .mid{
+      height: 95%;
+      width: 49%;
+      padding: 20px;
+      box-sizing: border-box;
+      background: #f3f6f7;
+    }
+  }
+
+  .histogram{       //柱状图
+    margin-top: 20px;
+    box-sizing: border-box;
+    padding: 20px;
+    width: 100%;
+    height: 400px;
+    background: #f3f6f7;
+  }
+</style>

src/views/home.vue

@@ -77,13 +77,15 @@
               .btns{
                 display: flex;
                 width: 100%;
-                height: 80px;
+                height: 70px;
                 align-items: center;  
                 font-size: 16px;
                 cursor: pointer;
                 box-sizing: border-box;
                 padding-left: 20%;
-                
+                &:hover{
+                  background-color: #cccccc;
+                }
 
                 span{
                   align-items: center;

src/views/projectSettlement/projectSettlement.vue

@@ -299,8 +299,8 @@
               })  
         },
         edit(rowId){
-          console.log(rowId)
-          this.$router.push(`/resultShowDetail?Id=${rowId}`)
+          // console.log(rowId)
+          window.open(`/#/resultShowDetail?Id=${rowId}`)
         },
         details(val){
           localStorage.setItem('pid',JSON.stringify(val))

src/views/resultShow/resultShowDetail.vue

@@ -22,7 +22,7 @@
                     </div>
                 </div>
             </div>
-            <el-button class="backBtn" type="primary" @click="$router.back()">返回</el-button>
+            <!-- <el-button class="backBtn" type="primary" @click="$router.back()">返回</el-button> -->
         </div>
         <!-- 头部展示区结束 -->
         <!--导航栏区域开始-->
@@ -545,7 +545,7 @@
                 let scrollTop = e.target.scrollTop;
                 if(scrollTop>=200){
                     Nav.style = `width:100%;padding:0 20%;box-sizing: border-box;border-radius:0;display:flex;justify-content: space-around;position: fixed;top:calc(60px - 20px);z-index:99;align-items: center;box-shadow: 0 0 5px gray;`
-                }else{
+                }else if(scrollTop<=100){
                     Nav.style = ``
                 }
             });

src/views/resultShow/resultsShow.vue

@@ -158,7 +158,7 @@
           this.getData()
         },
         rsBtn(Id){
-          this.$router.push(`/resultShowDetail?Id=${Id}`)
+          window.open(`/#/resultShowDetail?Id=${Id}`)
         },
         getData(){        //获取渲染数据
           let param={

src/views/resultShow/resultsShow1废弃.vue

@@ -1,554 +0,0 @@
-<template>
-    <div class="rs1apply">
-        <!-- 头部展示区开始 -->
-        <div class="header">
-            <div class="imgBlock">
-                <img src="@/assets/img/login-bg-autumn.jpg" alt="">
-            </div>
-            <div class="headerConcent">
-                <div class="rsHead2Tit" style="font-size: 22px;font-weight: bold;">人脸检测与人脸识别创意互联项目</div>
-                <div class="rsHead2Tit">负责人:张紫林</div>
-                <div class="rsHead2Tit rsHead2Tits">
-                    <div>单位:深圳技师学院</div>
-                    <div>学科:个人创客</div>
-                </div>
-                <div class="rsHead2Tit">
-                    <i class="iconfont icon-duoren1" style="margin-right: 10px;"></i>
-                    12人
-                </div>
-            </div>
-            <div class="backBtn" @click="$router.back()">返回</div>
-        </div>
-        <!-- 头部展示区结束 -->
-
-    <!-- 内容展示区域开始 -->
-    <div class="rsMid">
-
-        <!-- 顶部主要简介开始 -->
-          <div class="topIntro" >
-            <div>
-                <i class="iconStyle iconfont icon-cubelifangti"></i>
-                项目基本内容
-            </div>
-            <div>
-                <i class="iconStyle iconfont icon-biaodan1"></i>
-                项目详情
-            </div>
-            <div>
-                <i class="iconStyle iconfont icon-jiegou"></i>
-                活动开展
-            </div>
-            <div>
-                <i class="iconStyle iconfont icon-wenjian"></i>
-                项目附件
-            </div>
-            <div>
-                <i class="iconStyle iconfont icon-baogao"></i>
-                项目中期工作报告
-            </div>
-          </div>
-        <!-- 顶部主要简介结束 -->
-
-        <!-- 项目基本内容区域开始 -->
-          <div class="projectBasicContent">
-            <div class="rsMidTit"><div>项目基本内容</div></div>
-            <div class="rsMidText"><p>你好你好你好你好你好你好你好你好你好你好你好你好
-                你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好
-                你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你好你
-                好你好你好你好你好你好你好你好</p></div>
-          </div>
-        <!-- 项目基本内容区域结束 -->
-
-        <!-- 项目详情内容区域开始 -->
-          <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">项目详情</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="bigBlockLeftImg"><img src="@/assets/img/login-bg-autumn.jpg" alt=""></div>
-                        <div class="bigBlockLeftTextBlock">
-                            <p>
-                                人生就是这样意外和惊喜，不知哪个先来临，没有太多准备好的离别，
-                                很多人一转身就是一辈子，连再见都没机会说一声，请珍惜不期而遇的缘分，
-                                无论亲情。友情还是爱情，
-                            </p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-        <!-- 项目详情内容区域结束 -->
-      
-        <!-- 取得成果区域开始 -->
-          <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">取得成果</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="bigBlockLeftImg"><img src="@/assets/img/login-bg-autumn.jpg" alt=""></div>
-                        <div class="bigBlockLeftTextBlock">
-                            <p>
-                                人生就是这样充满了大起大落，你永远不会知道下一刻会发生什么，
-                                也不会明白命运为何这样待你。只有在你经历了人生种种变故之后，
-                                你才会褪尽了最初的浮华。
-                            </p>
-                        </div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-        <!-- 取得成果区域结束 -->
-
-
-        <!-- 项目实施计划区域开始 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">项目实施计划</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="bigBlockLeftTextBlock rsMid3LCon4"><p>你好</p></div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-        <!-- 项目实施计划区域结束 -->
-
-        <!-- 活动开展区域开始 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">活动开展</div>
-                    <div class="bigBlockLeftContent ">
-                        <div class="bigBlockLeftTextBlock rsMid3LCon4" style="background:none"><p>你好</p></div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-        <!-- 活动开展区域结束 -->
-
-        <!-- 活动内容区域开始 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">活动内容</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="bigBlockLeftTextBlock rsMid3LCon4" style="background:none"><p>你好</p></div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-        <!-- 活动内容区域结束 -->
-
-        <!-- 活动一 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft" style="padding:0;">
-                    <div class="rsClassify">活动一:腾讯未来探索课堂</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="activityIMgBlock">
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                        </div>
-                        <div class="activityTextBlock">
-                            <p>
-                                之所以潸然泪下，那是因为人生充满了太多的喜悲，大起大落，
-                                跌宕起伏。过山车一样摇摆不定。而说到底，这世界平坦如砥，
-                                波伏摇摆的，不过是我们成长过程中的感受。
-                            </p>
-                        </div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-           <!-- 活动一-->
-
-           <!-- 活动二 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft" style="padding: 0;">
-                    <div class="rsClassify">活动二:"未来教室"再次落地北大</div>
-                    <div class="bigBlockLeftContent">
-                        <!-- 可以进行循环 -->
-                        <div class="activityIMgBlock">   
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                            <div class="activityIMg">
-                                <img src="@/assets/img/jj.jpg" alt="">
-                            </div>
-                        </div>
-                        <div class="activityTextBlock">
-                            <p>
-                                人不可能是全能的，有得必有失，月有圆缺，人无完人。
-                                人生就是这样，不可能会一帆风顺，到处都有坎坷，
-                                弯路让我们走得更长，更苦，但是让我们懂得更多。
-                            </p>
-                        </div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-           <!-- 活动二 -->
-
-           <!-- 项目中期报告 -->
-           <div class=" bigBlock">
-                <div class="bigBlockLeft">
-                    <div class="rsMidTit">项目中期报告</div>
-                    <div class="bigBlockLeftContent">
-                        <div class="bigBlockLeftTextBlock rsMid3LCon4"><p>你好</p></div>
-                    </div>
-                </div>
-                <div class="bigBlockRight">
-                    <div class="rsMid3r1">
-                        <div>
-                            <i class="iconfont iconfont icon--zuozhengcailiao"></i>
-                            材料
-                        </div>
-                    </div>
-                    <div class="rsMid3r2"></div>
-                </div>
-           </div>
-           <!-- 项目中期报告 -->
-
-           <div class="rsMid3rFoot">
-                    <div class="rsMid3r1"><div>附件材料</div></div>
-                    <div class="rsMid3rFoot2"></div>
-            </div>
-        </div>
-      <!-- 内容展示区域结束 -->
-    </div>
-  </template>
-  
-  <script>
-  
-      export default {
-        data() {
-          return {
-
-          }
-        },
-        methods:{
-         
-        }
-      }
-  </script>
-  
-  <style lang="less" scoped>
-
-  .rs1apply{
-        width: 100%;
-        background: #dee7ee;
-
-    .iconStyle{   //矢量图样式
-        margin-right: 10px;color: #30b8ff;
-        font-size: 27px;
-    }
-    .topIntro{//顶部导航栏样式
-        width: 100%;
-        height: 80px;
-        background: #ffffff;
-        border-radius: 10px;
-        margin-top: 15px;
-        display: flex;
-        font-size: 18px;
-        font-weight: bold;
-        justify-content: space-around;
-        align-items: center;
-        i{
-            font-size: 18px;
-        }
-    }
-    .activityIMgBlock{
-        width: 45%;
-        display: flex;
-        flex-wrap: wrap;
-        box-sizing: border-box;
-        padding: 10px;
-        justify-content: space-around;
-        .activityIMg{
-            width: 49%;
-            height: 49%;
-            img{
-                width: 100%;
-                height: 100%;
-            }
-        }
-    }
-
-    .activityTextBlock{
-        background: #f6f9ff;
-        width: 480px;
-        box-sizing: border-box;
-        padding: 10px 10px;
-        font-size: 16px;
-    }
-    p{
-        text-indent: 2em;
-    }
-
-    .header{  //顶部区域
-        width: 100%;
-        height: 200px;
-        background: #ffffff;
-        display: flex;
-        box-sizing: border-box;
-        // justify-content: center;
-        align-items: center;
-        padding-left: 4%;
-        position: relative;
-        // background: red;
-        .imgBlock{  //图片框
-            width: 350px;
-            height: 200px;
-            box-sizing: border-box;
-            padding: 20px 30px;
-            flex-shrink: 0;
-            img{
-                width: 100%;
-                height: 100%;
-            }
-        }
-        .headerConcent{  //内容展示
-            width: 450px;
-            height: 200px;
-            font-size: 14px;
-            flex-shrink: 0;
-            box-sizing: border-box;
-            padding: 20px 0;
-            .rsHead2Tit{ 
-                margin-bottom: 10px;
-                font-size: 16px;
-            }
-            .rsHead2Tits{
-                display: flex;
-                div{
-                    margin-right: 30px;
-                }
-                margin-bottom: 30px;
-            }
-        }
-    }
-    .rsMidTit{  //变色标题框
-        width: 150px;
-        height: 45px;
-        background-image: linear-gradient(to right, #56c4ff , #c47ff5);
-        border-radius: 15px;
-        text-align: center;
-        line-height: 45px;
-        color: #fff;
-        display: flex;
-        position: relative;
-        font-size: 18px;
-        box-sizing: border-box;
-        padding-left: 25px;
-    }
-    .rsMidTit::before{//变色标题框黄点
-            content: "";
-            display: block;
-            width: 11px;
-            height:11px;
-            position: absolute;
-            left: 10px;
-            top:calc(50% - 5px);
-            background-color: yellow;
-            border-radius: 50%;
-    
-        }
-
-    .rsMid{ //详情展示的大盒子
-        width: 85%;
-        margin: auto;
-        box-sizing: border-box;
-        padding-bottom: 60px;
-        .projectBasicContent{ //项目基本内容区域
-            width: 100%;
-            height: 220px;
-            background: #ffffff;
-            border-radius: 10px;
-            margin-top: 15px;
-            box-sizing: border-box;
-            padding: 20px 15px; 
-            .rsMidText{  //项目基本内容
-                margin-top: 15px;
-                font-size: 16px;
-                p{
-                    text-indent: 2em;
-                }
-            }
-        }
-        .bigBlock{  //详情模块的大盒子，使详情和佐证材料分开
-            height: 400px;
-            margin-top: 15px;
-            display: flex;
-            justify-content: space-between;
-            .bigBlockLeft{    //详情模块的大盒子，使详情和佐证材料分开
-                box-sizing: border-box;
-                padding: 20px 30px;
-                border-radius: 10px;
-                overflow: hidden;
-                width: 67%;
-                background: #fff;
-                .bigBlockLeftContent{ 
-                    height: 300px;
-                    display: flex;
-                    margin-top: 10px;
-                    .bigBlockLeftImg{ //图片框架
-                        width: 400px;
-                        height: 100%;
-                        background: #fff;
-                        img{
-                            width: 100%;
-                            height: 100%;
-                        }
-                    }
-                    .bigBlockLeftTextBlock{  //文字介绍
-                        width: 500px;
-                        height: 100%;
-                        background: #f6f9ff;
-                        box-sizing: border-box;
-                        padding: 10px;
-                    }
-                    .rsMid3LCon4{
-                        width: 100%;
-                    }
-                }
-            }
-
-            .rsClassify{   //活动一，活动二标题
-                width: 100%;
-                height: 50px;
-                line-height: 50px;
-                color: #fff;
-                background: #17adff;
-                text-align: left;
-                box-sizing: border-box;
-                padding-left: 15px;
-                font-size: 18px;
-            }
-            .bigBlockRight{    //佐证材料区域
-                width: 30%;
-                height: 100%;
-                background: #fff;
-                border-radius: 10px;
-                overflow: hidden;
-                .rsMid3r1{
-                    width: 100%;
-                    height: 50px;
-                    line-height: 50px;
-                    color: #fff;
-                    background: #388fc0;
-                    div{   //文字不靠边
-                        margin-left: 15px;
-                    }
-                }
-                .rsMid3r2{
-                    width: 100%;
-                    height: 310px;
-                    background: #f6f9ff;
-                }
-            }
-        }
-    }
-    .rsMid3rFoot{   //底部附件材料
-        width: 100%;
-        height: 350px;
-        margin-top: 20px;
-        background: #fff;
-        border-radius: 10px;
-        overflow: hidden;
-        .rsMid3r1{
-            width: 100%;
-            height: 50px;
-            line-height: 50px;
-            color: #fff;
-            background: #388fc0;
-            text-align: left;
-            box-sizing: border-box;
-            padding-left: 15px;
-            font-size: 18px;
-        }
-        .rsMid3rFoot2{
-            width: 95%;
-            margin-left: 30px;
-            background: #f6f9ff;
-            height: 250px;
-        }
-    }
-}
-    .backBtn{   //返回键
-        position: absolute;
-        right: 10%;
-        top: 10%;
-        box-sizing: border-box;
-        padding: 20px 0 !important;
-        font-size: 16px !important;
-        cursor: pointer;
-
-    }
-  </style>