Merge branch 'master' of gitee.com:SKYID/osredm-comp-custom into lwh

package.json

@@ -18,7 +18,9 @@
     "node-sass": "^4.14.1",
     "sass-loader": "^7.3.1",
     "vue": "^2.6.11",
-    "vue-router": "3.5.2"
+    "vue-router": "3.5.2",
+    "echarts": "^5.3.2",
+    "moment": "^2.29.1"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.4.5",

src/assets/css/common.css

@@ -7,22 +7,23 @@
 .breadcrumb {
     margin: 2vw 0;
     font-size: 1.1rem;
-
 }
+
 .edit-content {
     display: flex;
     flex-direction: column;
     justify-content: center;
-    margin: 0 17vw 3vw;
     text-align: center;
+    margin: 0vw 17vw 3vw;    
 }
+
 /* 面板 */
 .content {
     display: flex;
-    flex-direction: column; 
+    flex-direction: column;     /* 纵向排列 */
-    justify-content: center;
+    justify-content: center;    /* 垂直居中 */
-    align-items: center;
+    align-items: center;        /* 水平居中 */
-    margin: 0 6vw 3vw;
+    margin: 0vw 6vw 3vw;
 }
 .content ul {
     list-style-type: none;
@@ -30,9 +31,9 @@
 
 /* 卡片内容 */
 .card {
-    background-color: white;
     width: 66vw;
-    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.15);
+    background-color: white;
+    box-shadow: 0px 4px 10px 0 rgba(0,0,0,0.15);
     margin-bottom: 3vw;
 }
 .card-content {
@@ -42,10 +43,10 @@
     margin: 2vw;
 }
 .card-content-left {
-    text-align: left;
     display: block;
     position: relative;
     float: left;
+    text-align: left;
     margin: 1vw 1.5vw;
 }
 .card-img {
@@ -55,9 +56,3 @@
     height: auto; 
   }
 
-/* 分割线 */
-.el-divider {
-    width: 95%;
-    height: 2px;
-    margin: 1vw auto;
-  }

src/components/404.vue

@@ -72,9 +72,6 @@ export default {
       color: #ee8145;
     }
   }
-  .not-found-btn-gohome {
-
-  }
 }
 
 .el-button--primary {

src/components/AdminHeader.vue

@@ -14,6 +14,7 @@
 <script>
 export default {
   name: "AdminHeader",
+
   data(){
     return {
       osredmLogo: require("@/assets/logo/osredmLogo.svg"),
@@ -21,14 +22,19 @@ export default {
       activeIndex2: '1'
     };
   },
+
   methods:{
+
     handleSelect(key, keyPath) {
       console.log(key, keyPath);
     },
+
     backOsredm(){
       window.location.href='https://www.osredm.com'
     }
-  }
+    
+  },
+
 }
 </script>
 

src/components/Footer.vue

@@ -28,11 +28,13 @@
 <script>
 export default {
   name: "Footer",
+
   data(){
     return{
      osredmLogo: require("@/assets/logo/osredmLogo-white.svg")
     }
-  }
+  },
+  
 }
 </script>
 

src/components/Header.vue

@@ -123,7 +123,6 @@ export default {
 
     // 获取路由path 得到当前页
     getPath(){
-
       var path = this.$route.path
       this.activeIndex = path.split("/")[2]
     }
@@ -134,7 +133,6 @@ export default {
       this.userName = sessionStorage.getItem("name");
       this.userPass = sessionStorage.getItem("pass");
       this.userAvatar = require("@/assets/logo/user.jpg");     
-      this.getPath()
       /* var userRank = sessionStorage.getItem("rank");
       if (userRank == 1) {
         this.rankIf = true;
@@ -142,8 +140,9 @@ export default {
         this.rankIf = false;
       } */
 
-  },
+      this.getPath();
 
+  },
 
 
 }

src/components/Login.vue

@@ -1,4 +1,5 @@
 <template>
+
   <div class="loginWraper">
     <!-- v-bind:model的缩写 绑定登录表格 
        表单验证规则  自己设定
@@ -51,9 +52,12 @@
     <div style="color: #2f2f2f">
       版权所有：红山开源社区    <a href="https://beian.miit.gov.cn/#/Integrated/index"> 京ICP备2021005060号</a>
     </div>
+   
   </div>
+
 </template>
 
+
 <script>
 
 
@@ -173,6 +177,7 @@ a{
   bottom: 0;
   right: 0;
   /*background: url(../../assets/Pic/loginPic.jpg) no-repeat;*/
+
   background-size: cover;
 }
 .login-container .el-input { 

src/components/Video.vue

@@ -27,10 +27,13 @@ export default {
     }
   },
   name: "Video",
+
   data(){
     return {}
   },
+
   mounted(){
+
     var mp = new MuiPlayer({
       container: '#mui-player',
       title: this.title,
@@ -42,12 +45,16 @@ export default {
         })
       ]
     })
+
     // 音量调节时触发
     mp.on('volume-change', function(e){
       mp.video().volume = e.size;
     });
+
   },
+
   methods:{}
+
 }
 </script>
 

src/main.js

@@ -7,6 +7,7 @@ import 'element-ui/lib/theme-chalk/index.css'
 
 import Axios from "axios"
 import api from './utils/http/index'
+
 import mavonEditor from 'mavon-editor'
 import 'mavon-editor/dist/css/index.css'
 
@@ -14,10 +15,10 @@ import 'mavon-editor/dist/css/index.css'
 import md5 from 'js-md5'
 // 图标
 import "/src/assets/icon/iconfont.css"
-/* // echarts
+// echarts
-import * as echarts from 'echarts';
+import * as echarts from 'echarts'
 // 时间
-import moment from "moment"; */
+import moment from "moment"
 Vue.prototype.$md5 = md5;
 
 Vue.use(api)
@@ -25,8 +26,8 @@ Vue.prototype.$axios = Axios
 
 
 Vue.use(mavonEditor)
-/* Vue.prototype.$echarts = echarts
+Vue.prototype.$echarts = echarts
-Vue.prototype.$moment = moment; */
+Vue.prototype.$moment = moment;
 Vue.config.productionTip = false
 
 

src/pages/Chat/Chat.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- 加载等待 -->
   <div v-loading="contentLoading" element-loading-background="rgb(255, 255, 255)">
 
     <div class="content-button">
@@ -8,9 +9,7 @@
     <div class="content">
       <div class="white"></div>
       <div class="card">
-
         <el-image :src="chat" class="flot-img"/>
-
         <div class="card-content-left">
           <h3>交流互动</h3>
           <div>dadasdadsad</div>
@@ -39,36 +38,41 @@
   </div>
 </template>
 
+
 <script>
 import pageUtils from "@/utils/pageUtils";
 import { Message } from "element-ui";
 
 export default {
   name: "Chat",
+
   data(){
     return{
-      chat:'/api/files/chat-img.png',
+      chat: "/api/files/chat-img.png",
-      chat_link1:'/api/files/chat-icon.png',
+      chat_link1: "/api/files/chat-icon.png",
-      chat_link2:'/api/files/chat-icon.png',
+      chat_link2: "/api/files/chat-icon.png",
-      chat_link3:'/api/files/chat-icon.png',
+      chat_link3: "/api/files/chat-icon.png",
+
       contentLoading: true,
-      loadingBg:'#FFF'
+      loadingBg: "#FFF",
     }
   },
+
   methods:{
+
     initPage(){
-      pageUtils.checkComp(this.$router,this.$route.params.compId,this.$api)
+      pageUtils.checkComp(this.$router,this.$route.params.compId,this.$api);
       this.$api.getPageData(this.$route.params.compId,'chat').then((res) => {
-        console.log(res)
+        console.log(res);
         //先判断 该页面是否展示
         if (res.data.show) {
-          this.chat_link1 = res.data.logoOne
+          this.chat_link1 = res.data.logoOne;
-          this.chat_link2 = res.data.logoTwo
+          this.chat_link2 = res.data.logoTwo;
-          this.chat_link3 = res.data.logoThree
+          this.chat_link3 = res.data.logoThree;
-          this.chat = res.data.imgUrl
+          this.chat = res.data.imgUrl;
-          this.contentLoading = false
+          this.contentLoading = false;
         }else {
-          Message.warning("该页面不存在")
+          Message.warning("该页面不存在");
           this.$router.push({
             path: '/404'
           });
@@ -76,44 +80,45 @@ export default {
 
       })
     },
-    goToEdit(){
+
     // 跳转至编辑页面
-      pageUtils.openPage(this.$router,"/" + this.$route.params.compId + "/chatEdit")
+    goToEdit(){     
+      pageUtils.openPage(this.$router,"/" + this.$route.params.compId + "/chatEdit");
     }
+
   },
+
   mounted() {
     this.initPage()
   },
-  created() {
 
-  }
+
 }
 </script>
 
-<style scoped>
-.flot-img{
-  /*margin-top: -50px;*/
-  padding: 1vw;
-  position: relative;
-  float: left;
-  margin-top: -70px;
-  margin-left: 20px;
-  margin-bottom: 20px;
-  width:35vw;
-  height: auto;
-  box-shadow: inset 0 3px 8px rgba(219,227,255,.7)
 
-}
+<style scoped>
 
 .white {
   height: 66px;
 }
 
+.flot-img {
+  position: relative;
+  float: left;
+  width:35vw;
+  height: auto;
+  margin-top: -70px;
+  margin-left: 20px;
+  margin-bottom: 20px;
+  padding: 1vw;
+  box-shadow: inset 0 3px 8px rgba(219,227,255,.7)
+}
+
 .chat-link {
   display: flex;
   margin: 1vw auto;
   align-items: center;
-
 }
 .img-link {
   width: auto;

src/pages/Chat/ChatEdit.vue

@@ -1,4 +1,5 @@
 <template>
+
   <div class="edit-content">
     <el-breadcrumb class="breadcrumb" separator="/">
       <el-breadcrumb-item :to="{ path: '/' + this.$route.params.compId + '/chat' }">交流互动</el-breadcrumb-item>
@@ -10,37 +11,42 @@
       <el-button>取消</el-button>
     </div>
   </div>
+
 </template>
 
 <script>
 export default {
   name: "ChatEdit",
+
   data(){
     return{
       data: "",
-      html:""
+      html: "",
     }
   },
+
   methods:{
     change(value,render){
-      this.html = render
+      this.html = render;
     },
+
     submit(){
-      console.log(this.data)
+      console.log(this.data);
-      console.log(this.html)
+      console.log(this.html);
 
     }
   }
 }
+
 </script>
 
-<style src="@/assets/css/common.css" scoped>
 
-
-</style>
 <style>
+
 .button-group{
   margin-top: 50px;
 }
 
 </style>
+
+<style src="@/assets/css/common.css" scoped/>

src/pages/ContactUs/ContactUs.vue

@@ -20,7 +20,22 @@
 
 <script>
 export default {
-  name: "ContactUs"
+  name: "ContactUs",
+
+  data(){
+    return {
+
+    };
+  },
+
+  methods:{
+
+  },
+
+  mounted(){
+
+  },
+
 }
 </script>
 

src/pages/Data/Chart.vue

@@ -1,16 +1,221 @@
 <template>
   <div class="content">
-    数据统计
+
+    <div class="chart-content">
+
+      <div class="statistics">
+        <div class="chart-card1">
+          <el-image :src="apply_total_img" class="total-img" />
+          <div class="chart-total">
+            <div class="total-num">{{ apply_total_num }}</div>
+            <el-divider></el-divider>
+            <div class="total-text">竞赛总报名数</div>
+          </div>
+        </div>
+        <div class="chart-card1">
+          <el-image :src="submit_total_img" class="total-img" />
+          <div class="chart-total">
+            <div class="total-num">{{ submit_total_num }}</div>
+            <el-divider></el-divider>
+            <div class="total-text">竞赛总作品提交数</div>
+          </div>
+        </div>
+      </div>
+
+      <div class="chart">
+        <div class="chart-card2">
+          <div class="chart-title">{{ chart_title }}</div>
+          <!-- 可视化界面 -->
+          <div>
+            <div
+              v-loading="loading"
+              element-loading-text="拼命生成中..."
+              element-loading-spinner="el-icon-loading"
+              element-loading-custom-class="loading_style"
+              empty-text="没有记录哦~"
+              id="main"
+              class="Echarts"
+            ></div>
+          </div>
+        </div>
+      </div>
+
+    </div>
+    
   </div>
 </template>
 
+
 <script>
 export default {
-  name: "Chart"
+  name: "Chart",
+
+  data(){
+    return {
+      apply_total_img: require("@/assets/logo/apply_total_img.png"),
+      apply_total_num: "",
+
+      submit_total_img: require("@/assets/logo/submit_total_img.png"),
+      submit_total_num: "",
+
+      chart_title: "",
+    };
+  },
+
+  methods:{
+
+    makeEcharts() {
+      //加载等待
+      setTimeout(() => {
+        var myChart = this.$echarts.init(document.getElementById("main"));
+
+        //避免上一个面板残留在新面板上
+        if (myChart != null && myChart != "" && myChart != undefined) {
+          myChart.dispose();
+          console.log("上一个面板已经清除，生成新面板");
+        }
+
+        myChart = this.$echarts.init(document.getElementById("main"));
+
+        var option = {
+          tooltip: {
+            trigger: "item",
+          },
+          legend: {
+            top: "5%",
+            left: "center",
+          },
+          series: [
+            {
+              name: "Access From",
+              type: "pie",
+              radius: ["40%", "70%"],
+              avoidLabelOverlap: false,
+              itemStyle: {
+                borderRadius: 10,
+                borderColor: "#fff",
+                borderWidth: 2,
+              },
+              label: {
+                show: false,
+                position: "center",
+              },
+              emphasis: {
+                label: {
+                  show: true,
+                  fontSize: "40",
+                  fontWeight: "bold",
+                },
+              },
+              labelLine: {
+                show: false,
+              },
+              data: [
+                { value: 1048, name: "Search Engine" },
+                { value: 735, name: "Direct" },
+                { value: 580, name: "Email" },
+                { value: 484, name: "Union Ads" },
+                { value: 300, name: "Video Ads" },
+              ],
+            },
+          ],
+        };
+
+        myChart.setOption(option);
+
+        this.loading = false;
+      }, 1000);
+      this.loading = true;
+    },
+
+  },
+
+  mounted(){
+    this.apply_total_num = 666;
+    this.submit_total_num = 777;
+    this.chart_title = "地方分赛区";
+
+    this.makeEcharts();
+  },
+
 }
 </script>
 
+
 <style scoped>
 
+.chart-content {
+  position: relative;
+  width: 66vw;
+  height: 24vw;
+  margin: 3vw;
+}
+
+.statistics {
+  position: absolute;
+  width: 22vw;
+  height: 100%;
+}
+.chart-card1 {
+  width: 22vw;
+  height: 12vw;
+  background-color: white;
+  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15);
+  margin-bottom: 2vw;
+}
+
+.total-img {
+  position: relative;
+  float: left;
+  width: 80px;
+  height: 80px;
+  margin: 3vw 1.5vw 0vw 3vw;
+}
+.chart-total {
+  padding-top: 3vw;
+  padding-right: 3vw;
+  text-align: left;
+}
+.total-num {
+  font-weight: 700;
+  font-size: 2.5rem;
+  line-height: 1.5em;
+  padding: auto;
+}
+.el-divider {
+  width: 50%;
+  height: 1px;
+  margin: auto 9.5vw;
+}
+.total-text {
+  font-size: 0.9rem;
+}
+
+.chart {
+  margin-left: 24vw;
+  height: 100%;
+}
+.chart-card2 {
+  width: 44vw;
+  height: 26vw;
+  background-color: white;
+  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.15);
+}
+
+.chart-title {
+  font-weight: 500;
+  font-size: 1rem;
+  line-height: 3rem;
+  border-bottom: 1px solid rgba(153, 153, 153, 0.4);
+  box-sizing: border-box;
+}
+
+.Echarts {
+  width: 40vw;
+  height: 20vw;
+  margin: 1.5vw auto;
+}
+
 </style>
+
 <style src="@/assets/css/common.css" scoped/>

src/pages/Guide/Guide.vue

@@ -19,14 +19,25 @@
 <script>
 export default {
   name: "Guide",
+
   data(){
     return{
       content:'赛事指南赛事指南赛事指南赛事指南赛事指南赛事指南',
     }
-  }
+  },
+
+  methods:{
+
+  },
+
+  mounted() {
+    
+  },
+
 }
 </script>
 
+
 <style scoped>
 
 </style>

src/pages/Home/Home.vue

@@ -28,34 +28,40 @@
 // import 'mavon-editor/dist/css/index.css'
 import Video from "@/components/Video";
 import pageUtils from "@/utils/pageUtils";
+
 export default {
   name: "Home",
+
   components:{
-    Video
+    Video,
   },
+
   data(){
     return{
       data: "",
       videoTitle: "标题",
       videoSrc: "https://outin-396971199eed11e991a100163e1c7426.oss-cn-shanghai.aliyuncs.com/sv/34277901-180465b8b73/34277901-180465b8b73.mp4",
       videoWidth: "100%",
-      content:'测试内容测试内容测试内容'
+      content: "测试内容测试内容测试内容",
     }
   },
+
   methods:{
+
     checkComp(){
-
+      pageUtils.checkComp( this.$router,this.$route.params.compId,this.$api );
-
-      pageUtils.checkComp(this.$router,this.$route.params.compId,this.$api)
-
     }
+
   },
+
   mounted() {
     this.checkComp()
   }
+
 }
 </script>
 
+
 <style scoped>
 
 .video {

src/pages/Home/HomeEdit.vue

@@ -1,4 +1,5 @@
 <template>
+
   <div class="edit-content">
     <el-breadcrumb class="breadcrumb" separator="/">
       <el-breadcrumb-item :to="{ path: '/' + this.$route.params.compId + '/home' }">赛事首页</el-breadcrumb-item>
@@ -6,23 +7,28 @@
     </el-breadcrumb>
     <mavon-editor :ishljs="true" v-model="data" @save="save"/>
   </div>
+
 </template>
 
 <script>
 export default {
   name: "HomeEdit",
+
   data(){
     return{
-      data: ""
+      data: "",
     }
   },
+
   methods:{
+
     save(value,render){
       // value是markdown格式
       // render是html格式
-      console.log(value)
+      console.log(value);
-      console.log(render)
+      console.log(render);
     }
+
   }
 }
 </script>

src/pages/Notice/Notice.vue

@@ -63,10 +63,14 @@ export default {
 
   },
 
+  mounted() {
+    
+  },
 
 }
 </script>
 
+
 <style scoped>
 
 .notice-content-top {
@@ -74,6 +78,12 @@ export default {
     text-align: left;
 }
 
+.el-divider {
+    width: 95%;
+    height: 2px;
+    margin: 1vw auto;
+  }
+
 .notice-content-bottom {
     padding: 0vw 2vw 1vw;
     text-align: right;

src/utils/pageUtils.js

@@ -1,8 +1,6 @@
-
 import { Message } from 'element-ui'
 
 // Header导航栏页面更改
-
 function openPage(router, path){
     router.push({
         path: path
@@ -22,7 +20,7 @@ function checkComp(router,compId, http){
                 //正式上线 可以显示页面
             }else {
                 // 未正式上线，需要拦截等操作，跳转404
-                Message.warning("该竞赛还未上线")
+                Message.warning("该竞赛还未上线");
                 //TODO: 可添加判断是否为白名单用户进行测试工作
                 router.push({
                     path: '/404'
@@ -31,7 +29,7 @@ function checkComp(router,compId, http){
 
         }else {
             // 不存在该竞赛 提示 并跳转404
-            Message.warning("不存在该竞赛")
+            Message.warning("不存在该竞赛");
             router.push({
                 path: '/404'
             });