[新增]新增计分规则

4 years ago · 9ef910c12c
4 changed files with 165 additions and 4 deletions
--- a/src/app/tabbar/tabbar.component.html
+++ b/src/app/tabbar/tabbar.component.html
@ -6,9 +6,9 @@
    <div class="grade" *ngIf="grade" onmouseover="xiangqing.style.display='block';" onmouseout="xiangqing.style.display='none';">
        <a class="active"><span ><a></a>{{grade}} 分</span></a>
    </div>
-    <div class="uploadFile">
+    <!-- <div class="uploadFile">
        <a href="http://139.9.106.124:8088/ExaminationLauncher.zip"><span>指挥员指挥能力考评系统（练习版）</span></a>
-    </div>
+    </div> -->
    <!--详情框 -->
    <div class="integrityDetails" id="xiangqing">
      <div class="integrityDetailsTop">
@ -35,7 +35,80 @@
      </div>
    </div>
    <p style="font-size: 16px;position: absolute; right: 170px;">欢迎您, {{realName}}</p>
-                
+
+
+
+    <div class="scoringRule"  *ngIf="grade">
+      <span class="name"  (click)="scoringRule()">
+          计分规则
+      </span> 
+      <div class="scoringRuleImg" *ngIf="scoringRuleImg">
+          <div class="topbox">
+              <span style="font-size: 18px;margin-left: 20px;font-weight: 600;">计分规则 &nbsp;</span>
+              <span style="font-size: 12px;">单位基本信息部分共计100分</span>
+              <span class="imgbox">
+                  <img src="../../assets/images/ruletopimg.png" alt="">
+              </span>
+              <span class="close" (click)="closebtn()">
+                  <mat-icon>clear</mat-icon>
+              </span>
+          </div>
+          <div class="tablebox">
+              <table>
+                  <tr>
+                      <td>名称</td>
+                      <td>分值</td>
+                      <td>规则说明</td>
+                  </tr>
+                  <tr>
+                      <td>单位名称</td>
+                      <td class="bulecolor">5</td>
+                      <td>按填录入内容评判</td>
+                  </tr>
+                  <tr>
+                      <td>建筑信息</td>
+                      <td class="bulecolor">10</td>
+                      <td>根据创建的建筑个数平分该分值，每个建筑根据实际填写的完整度再进行评判</td>
+                  </tr>
+                  <tr>
+                      <td>四周毗邻</td>
+                      <td class="bulecolor">10</td>
+                      <td>按<span class="bulecolor">4</span>个方向均分，每个方向的属性信息要填写完整才能得分</td>
+                  </tr>
+                  <tr>
+                      <td>消防设施</td>
+                      <td class="bulecolor">25</td>
+                      <td>消防水源占<span class="bulecolor">30%</span>  &nbsp;&nbsp;&nbsp;   安全疏散占<span class="bulecolor">30%</span> <br> 消防水系统占<span class="bulecolor">30%</span>   &nbsp;&nbsp;&nbsp;   内部消防力量占<span class="bulecolor">10%</span></td>
+                  </tr>
+                  <tr>
+                      <td>重点部位</td>
+                      <td class="bulecolor">10</td>
+                      <td><span>根据耐火等级做区分</span>:一级:添加<span class="bulecolor">3</span>个重点部位（1个50%，2个80%，3个满分）<span class="bulecolor">二级</span>:添加<span class="bulecolor">2</span>个重点部位（一个占50%）<span class="bulecolor">三级</span>   添加<span class="bulecolor">1</span>个重点部位 其它:填写重点提示自动满分</td>
+                  </tr>
+                  <tr>
+                      <td>功能分区</td>
+                      <td class="bulecolor">10</td>
+                      <td>创建<span class="bulecolor">2</span>条并填写完整得满分</td>
+                  </tr>
+                  <tr>
+                      <td>实景图</td>
+                      <td class="bulecolor">10</td>
+                      <td>外观，保证有<span class="bulecolor">2</span>张照片（占<span class="bulecolor">30%</span>）; 室内，保证有<span class="bulecolor">2</span>张照片（占<span class="bulecolor">30%</span>）;安全出口，保证有<span class="bulecolor">2</span>张照片（占<span class="bulecolor">40%</span>）</td>
+                  </tr>
+                  <tr>
+                      <td>CAD上传</td>
+                      <td class="bulecolor">10</td>
+                      <td>上传<span class="bulecolor">2</span>个cad文件</td>
+                  </tr>
+                  <tr>
+                      <td>平面图</td>
+                      <td class="bulecolor">10</td>
+                      <td>总平面图<span class="bulecolor">1</span>张，建筑平面图<span class="bulecolor">1</span>张</td>
+                  </tr>
+              </table>
+          </div>
+      </div>
+    </div>
    <!-- 全屏  -->
    <button mat-button (click)="!isfullscreen?fullscreenToggle():closefullscreen()" class="fullscreen">
    <ng-container *ngIf="!isfullscreen; else elseTemplate">
--- a/src/app/tabbar/tabbar.component.scss
+++ b/src/app/tabbar/tabbar.component.scss
@ -165,6 +165,84 @@ mat-icon{
        
    }
 }
+
+
+//计分规则按钮
+.scoringRule{
+    user-select: none;
+    position: absolute;
+    left: 480px;
+    cursor: pointer;
+    .name{
+        background-color: #fff;
+        border-radius: 6px;
+        color: #2196F3;
+        display: inline-block;
+        width: 100px;
+        height:36px;
+        text-align: center;
+        line-height: 36px;
+        font-size: 14px;
+        margin: 0;
+        padding: 0;
+    }
+    .scoringRuleImg{
+        z-index: 999;
+        position: absolute;
+        left: 0;
+        top: 38px;
+        border: 1px solid #2196F3;
+        background-color: #fff;
+        .topbox{
+
+            position: relative;
+            background-color: #2196F3;
+            height: 40px;
+            line-height: 40px;
+            font-size: 16px;
+            .imgbox{
+                position: absolute;
+                right: 48px;
+                // top: 10px;
+            }
+            .close{
+                position: absolute;
+                right: 8px;
+                top: 10px;
+            }
+        }
+        .tablebox{
+            width: 610px;
+            color: #333333;
+            table{
+                display: block;
+                width: 100%;
+                font-size: 14px;
+                tr{ 
+                    display: block;
+                    width: 600px;
+                    td{
+                        white-space:normal;
+                        display: inline-block;
+                        width: 15%;
+                        text-align: center;
+                    }
+                    td:last-child{
+                        width: 70%;
+                        line-height: 28px;
+                    }
+                }
+                tr:nth-child(even){
+                    background: #f6faff; 
+                }
+            }
+            .bulecolor{
+                color: #2196f3;
+            }
+        }
+        
+    }
+}
 .uploadFile{
    height: 64px;
    line-height: 64px;
--- a/src/app/tabbar/tabbar.component.ts
+++ b/src/app/tabbar/tabbar.component.ts
@ -38,6 +38,7 @@ export class TabbarComponent implements OnInit {


    integrityData:any
+
    ngOnInit() {  
      this.routerEventsListener = this.router.events.pipe(
        filter(event => event instanceof NavigationEnd)
@ -56,6 +57,7 @@ export class TabbarComponent implements OnInit {
        let obj = JSON.parse(sessionStorage.getItem(this.route.snapshot.queryParams.id)) 
        this.grade = obj.zong
        this.integrityData = obj.details
+        
      }
    }

@ -69,7 +71,15 @@ export class TabbarComponent implements OnInit {
      style.width = (width/zong)*100 +'%';
      return style
    }
-
+    //计分规则
+        
+    scoringRuleImg:boolean = false
+    scoringRule(){
+      this.scoringRuleImg = !this.scoringRuleImg
+    }
+    closebtn(){
+      this.scoringRuleImg = false
+    }
    boxed(css){
      const Element = document.body;
      Element.style.width = '1200px'
--- a/src/assets/images/ruletopimg.png
+++ b/src/assets/images/ruletopimg.png