diff --git a/templates/repo/cloudbrain/benchmark/index.tmpl b/templates/repo/cloudbrain/benchmark/index.tmpl
index 69a8167ef..9133bc2a5 100755
--- a/templates/repo/cloudbrain/benchmark/index.tmpl
+++ b/templates/repo/cloudbrain/benchmark/index.tmpl
@@ -114,7 +114,7 @@
                                 </div>
                                 <!-- 任务状态 -->
                                 <div class="two wide column text center padding0"  style="width: 10.5% !important;">
-                                    <span class="job-status" id="{{.Cloudbrain.ID}}" data-repopath="{{$.RepoRelPath}}{{if eq .ComputeResource "CPU/GPU"}}/cloudbrain{{else}}/modelarts/notebook{{end}}" data-jobid="{{.Cloudbrain.ID}}" data-version="{{.VersionName}}">
+                                    <span class="job-status" id="{{.Cloudbrain.ID}}" data-repopath="{{$.RepoRelPath}}{{if or (eq .JobType "MODELSAFETY") (eq .ComputeResource "CPU/GPU")}}/cloudbrain{{else}}/modelarts/notebook{{end}}" data-jobid="{{.Cloudbrain.ID}}" data-version="{{.VersionName}}">
                                             <span><i id="{{.Cloudbrain.ID}}-icon" style="vertical-align: middle;" class="{{.Status}}"></i><span  id="{{.Cloudbrain.ID}}-text" style="margin-left: 0.4em;font-size: 12px;">{{.Status}}</span></span>
                                     </span>
                                 </div>
diff --git a/templates/repo/modelsafety/indicators_descr.tmpl b/templates/repo/modelsafety/indicators_descr.tmpl
index 3b6f7ff48..ac9b934a8 100644
--- a/templates/repo/modelsafety/indicators_descr.tmpl
+++ b/templates/repo/modelsafety/indicators_descr.tmpl
@@ -11,35 +11,35 @@
           <tbody>
               <tr>
                   <td data-label="指标">ACC</td>
-                  <td data-label="说明">Accuracy，精确度，计算模型预测准确率，该指标越高，说明评测结果越好。</td>
+                  <td data-label="说明" indicator="ACC">Accuracy：精确度，计算模型预测准确率，该指标越高，说明评测结果越好。</td>
               </tr>
               <tr>
                   <td data-label="指标">CAV</td>
-                  <td data-label="说明">Classification Accuracy Variance，用于评估深度学习模型性能的最重要指标为准确性。该指标值越高，说明评测结果越好。</td>
+                  <td data-label="说明" indicator="CAV">Classification Accuracy Variance：用于评估深度学习模型性能的最重要指标为准确性。该指标值越高，说明评测结果越好。</td>
               </tr>
               <tr>
                   <td data-label="指标">ASS</td>
-                  <td data-label="说明">Average Structural Similarity，所有攻击成功对抗样本与其原始样本间的平均相似性。该指标越大，说明评测结果越好。</td>
+                  <td data-label="说明" indicator="ASS">Average Structural Similarity：所有攻击成功对抗样本与其原始样本间的平均相似性。该指标越大，说明评测结果越好。</td>
               </tr>
               <tr>
                   <td data-label="指标">ALDp</td>
-                  <td data-label="说明">Average LpDistortion，为所有攻击成功的对抗样本的平均归一化Lp失真度，ALDp值越小，对抗样本的不可感知性越强。</td>
+                  <td data-label="说明" indicator="ALDp">Average LpDistortion：为所有攻击成功的对抗样本的平均归一化Lp失真度，ALDp值越小，对抗样本的不可感知性越强。</td>
               </tr>
               <tr>
                   <td data-label="指标">ACAC</td>
-                  <td data-label="说明">Average Confidence of Adversarial Class(ACAC）这个数值越高，攻击算法的攻击能力越强。</td>
+                  <td data-label="说明" indicator="ACAC">Average Confidence of Adversarial Class(ACAC)：这个数值越高，攻击算法的攻击能力越强。</td>
               </tr>
               <tr>
                   <td data-label="指标">ACTC</td>
-                  <td data-label="说明">Average Confidence of True Class(ACTC) 这个数值越低，攻击算法的攻击能力越强。</td>
+                  <td data-label="说明" indicator="ACTC">Average Confidence of True Class(ACTC)：这个数值越低，攻击算法的攻击能力越强。</td>
               </tr>
               <tr>
                   <td data-label="指标">PSD</td>
-                  <td data-label="说明">Perturbation Sensitivity Distance，用于评测人类对扰动的感知能力。该指标值越大，说明评测结果越差。</td>
+                  <td data-label="说明" indicator="PSD">Perturbation Sensitivity Distance：用于评测人类对扰动的感知能力。该指标值越大，说明评测结果越差。</td>
               </tr>
               <tr>
                   <td data-label="指标">CACC</td>
-                  <td data-label="说明">Clean ACC该值计算的是原始未被攻击的样本，使用模型和groundtruth相比较的模型的本身的一个。</td>
+                  <td data-label="说明" indicator="CACC">Clean ACC：该值计算的是原始未被攻击的样本，使用模型和groundtruth相比较的模型的本身的一个。</td>
               </tr>
           </tbody>
       </table>
diff --git a/templates/repo/modelsafety/show.tmpl b/templates/repo/modelsafety/show.tmpl
index 50661c387..46fe2e225 100644
--- a/templates/repo/modelsafety/show.tmpl
+++ b/templates/repo/modelsafety/show.tmpl
@@ -499,53 +499,60 @@
                              </div>
                       </div>                         
                     </div>
-                    <div class="ui tab" data-tab="third0">
-                      <div class="__res_container">
-                        <div class="__res_title">
-                          <div class="__res_title_icon"></div>
-                          <div class="__res_title_txt">
-                            <div class="__res_title_txt1">ACC-fgsm_cifar10_1000</div>
-                            <div class="__res_title_txt2">Accuracy: 精确度，计算模型预测精准率，该指标越高，说明评测结果越好。</div>
-                          </div>                          
-                        <div>
-                        <div class="__res_table_container">
-                          <table>
-                            <tr>
-                              <th>ACC</th>
-                              <th>params1</th>
-                              <th>params2</th>
-                              <th>params3</th>
-                              <th>params4</th>
-                              <th>params5</th>
-                              <th>params6</th>
-                              <th>params7</th>
-                            </tr>
-                            <tr>
-                              <td>非定向</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                            </tr>
-                            <tr>
-                              <td>定向</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                              <td>100</td>
-                            </tr>
-                          </table>
-                        </div>
-                        <div class="__res_chart_container">
-
-                        </div>
+                    <div class="ui tab" data-tab="third0">                      
+                      <style>
+                        .__res_item {
+                          margin-bottom: 20px;
+                        }
+                        .__res_title {
+                          height: 50px;
+                          display: flex;
+                          align-items: center;
+                          margin-bottom: 10px;
+                        }
+                        .__res_title_icon {
+                          height: 48px;
+                          width: 48px;
+                          background-color: rgb(105, 192, 255);
+                          margin-right: 8px;
+                        }
+                        .__res_title_txt {                      
+                          font-family: SourceHanSansSC;
+                          font-size: 14px;
+                          font-style: normal;
+                          line-height: 20px;
+                          text-decoration: none;
+                        }
+                        .__res_title_txt1 {
+                          font-weight: 700;
+                          color: rgb(3, 102, 214);
+                        }
+                        .__res_title_txt2 {                        
+                          font-weight: 300;
+                          color: rgba(136,136,136,1);
+                        }
+                        .__res_table_container {
+                          overflow-x: auto;
+                        }
+                        .__res_table_container table {
+                          border-bottom-left-radius: 0 !important;
+                          border-bottom-right-radius: 0 !important;
+                        }
+                        .__res_table_container th, .__res_table_container td {
+                          text-align: center !important;
+                        }
+                        .__res_chart_container {
+                          height:280px;
+                          border: 1px solid rgba(34,36,38,.1);
+                          margin-top: -1px;
+                          border-bottom-left-radius: .28571429rem;
+                          border-bottom-right-radius: .28571429rem;
+                        }
+                      </style>
+                      <div style="display:none;">
+                        {{template "repo/modelsafety/indicators_descr".}}
                       </div>
+                      <div class="__res_container"></div>
                     </div>
                 </div>
             </div>
@@ -593,41 +600,7 @@
 })();
 </script>
 <script>
-    $(document).ready(function () {
-      $('.ui.accordion').accordion({ selector: { trigger: '.icon' } });
-      $('.pointing.secondary.menu .item').tab({
-        onVisible: function(tabPath) {
-          console.log(tabPath);
-        },
-      });      
-    });
-
-    let userName
-    let repoPath
-    let jobName
-    $(document).ready(function () {
-        let url = window.location.href;
-        let urlArr = url.split('/')
-        userName = urlArr.slice(-5)[0]
-        repoPath = urlArr.slice(-4)[0]
-        jobName = urlArr.slice(-1)[0]
-    })
-
-    function loadLog(version_name) {
-      console.log('loadLog');
-        document.getElementById("mask").style.display = "block"
-        $.get(`/api/v1/repos/${userName}/${repoPath}/cloudbrain/${jobName}/log?version_name=${version_name}&lines=50&order=asc`, (data) => {
-            $('input[name=end_line]').val(data.EndLine)
-            $('input[name=start_line]').val(data.StartLine)
-            $(`#log_file${version_name}`).text(data.Content)
-            document.getElementById("mask").style.display = "none"
-        }).fail(function (err) {
-            console.log(err);
-            document.getElementById("mask").style.display = "none"
-        });
-    }    
-</script>
-<script>
+  // 配置信息页签
   ;(function() {
     function paddingZeros(str, len) {
       str = str.toString();
@@ -662,4 +635,231 @@
       },
     });
   })();
+
+  // 评测结果页签
+  ;(function() {
+    function initTable(tableEl, data) {
+      tableEl.empty();
+      tableEl.append(`
+        <table class="ui celled table">
+          <thead>
+            <tr class="tr-head"><th style="width:100px;">${data.indicator}</th></tr>
+          </thead>
+          <tbody>
+            <tr class="tr-untargetted"><td>非定向</td></tr>
+            <tr class="tr-targetted"><td>定向</td></tr>
+          </tbody>
+        </table>`);
+      var trHead = tableEl.find('tr.tr-head');
+      var trUntargetted = tableEl.find('tr.tr-untargetted');
+      var trTargetted = tableEl.find('tr.tr-targetted');
+      for (var i = 0, iLen = data.params.length; i < iLen; i++) {
+        var params = data.params;
+        var untargetted = data.untargetted;
+        var targetted = data.targetted;
+        trHead.append(`<th>param(${params[i]})</th>`);
+        trUntargetted.append(`<td>${untargetted[i]}</td>`);
+        trTargetted.append(`<td>${targetted[i]}</td>`);
+      }
+    }
+
+    function initChart(chartEl, data) {
+      var chartHandle = chartEl.data('chart');
+      chartHandle && chartHandle.dispose();
+      chartHandle && window.removeEventListener('resize', chartHandle.resize);
+      chartHandle = echarts.init(chartEl[0]);
+      chartEl.data('chart', chartHandle);
+      var option = {
+        tooltip: {
+          trigger: 'axis'
+        },
+        color: ['rgb(80, 135, 236)', 'rgb(104, 187, 196)'],
+        legend: {
+          data: ['非定向', '定向'],
+          top: '15',
+        },
+        grid: {
+          top: '50',
+          left: '20',
+          right: '20',
+          bottom: '20',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',        
+          data: data.params.map(function(item){ return `param(${item})`}),
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            name: '非定向',
+            type: 'line',
+            stack: 'Total',
+            data: data.untargetted || [],
+          },
+          {
+            name: '定向',
+            type: 'line',
+            stack: 'Total',
+            data: data.targetted || [],
+          }
+        ]
+      };
+      chartHandle.setOption(option);
+      window.addEventListener('resize', chartHandle.resize);
+    }
+
+    function initResItems(list) {
+      var resContainer = $('.__res_container');
+      resContainer.empty();
+      for (var i = 0, iLen = list.length; i < iLen; i++) {
+        var item = list[i], indicator = item.indicator;
+        var descr = $(`[indicator="${indicator}"]`).text();
+        var resItemContainer = $(`<div class="__res_item">
+          <div class="__res_title">
+            <div class="__res_title_icon"></div>
+            <div class="__res_title_txt">
+              <div class="__res_title_txt1">${indicator}-${item.name}</div>
+              <div class="__res_title_txt2">${descr}</div>
+            </div>
+          </div>
+          <div class="__res_table_container"></div>
+          <div class="__res_chart_container"></div>
+        </div>`);
+        resContainer.append(resItemContainer);
+        initTable(resItemContainer.find('.__res_table_container'), item);
+        initChart(resItemContainer.find('.__res_chart_container'), item);
+      }
+    };
+
+    function initData() {
+      var data = {
+        "eType": "static",
+        "name": "fgsm_cifar10_1000",
+        "params": [
+          [
+            "0.1"
+          ],
+          [
+            "0.15"
+          ],
+          [
+            "0.2"
+          ],
+          [
+            "0.25"
+          ],
+          [
+            "0.3"
+          ],
+          [
+            "0.35"
+          ],
+          [
+            "0.4"
+          ]
+        ],
+        "untargetted": {
+          "ACC": [
+            0.169,
+            0.128,
+            0.122,
+            0.115,
+            0.113,
+            0.104,
+            0.1
+          ],
+          "ASS": [
+            0.6525109174194562,
+            0.5128998893711293,
+            0.4012456987633366,
+            0.31603768362214135,
+            0.2522637372349447,
+            0.20173695879100786,
+            0.15927145111766017
+          ]
+        },
+        "targetted": {
+          "ACC": {
+            "targets": [
+              0.127,
+              0.129,
+              0.125,
+              0.131,
+              0.127,
+              0.125,
+              0.115
+            ]
+          },
+          "ASS": {
+            "targets": [
+              0.6529545699941741,
+              0.5101767310061309,
+              0.3905316332202089,
+              0.30660659401929724,
+              0.24579538237865656,
+              0.19831695120705345,
+              0.15426212417026997
+            ]
+          }
+        }
+      };     
+      var name = data.name;
+      var params = data.params;
+      var indicators = Object.keys(data.targetted);
+      var list = [];
+      for (var i = 0, iLen = indicators.length; i < iLen; i++) {
+        var indicator = indicators[i];
+        var obj = {
+          name: name,
+          params: params.flat(),
+          indicator: indicator,
+          targetted: data.targetted[indicator]['targets'],
+          untargetted: data.untargetted[indicator],
+        };
+        list.push(obj);
+      }
+      initResItems(list);
+    }
+
+    $('.pointing.secondary.menu .item').tab({
+        onVisible: function(tabPath) {
+          if (tabPath === 'third0') {
+            initData();
+          }
+        },
+      });
+  })();
+</script>
+<script>
+    $(document).ready(function () {
+      $('.ui.accordion').accordion({ selector: { trigger: '.icon' } });          
+    });
+
+    let userName
+    let repoPath
+    let jobName
+    $(document).ready(function () {
+        let url = window.location.href;
+        let urlArr = url.split('/')
+        userName = urlArr.slice(-5)[0]
+        repoPath = urlArr.slice(-4)[0]
+        jobName = urlArr.slice(-1)[0]
+    })
+
+    function loadLog(version_name) {
+      console.log('loadLog');
+        document.getElementById("mask").style.display = "block"
+        $.get(`/api/v1/repos/${userName}/${repoPath}/cloudbrain/${jobName}/log?version_name=${version_name}&lines=50&order=asc`, (data) => {
+            $('input[name=end_line]').val(data.EndLine)
+            $('input[name=start_line]').val(data.StartLine)
+            $(`#log_file${version_name}`).text(data.Content)
+            document.getElementById("mask").style.display = "none"
+        }).fail(function (err) {
+            console.log(err);
+            document.getElementById("mask").style.display = "none"
+        });
+    }    
 </script>
\ No newline at end of file
diff --git a/web_src/js/index.js b/web_src/js/index.js
index b796d020a..9a1f04296 100755
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -65,6 +65,7 @@ const { AppSubUrl, StaticUrlPrefix, csrf } = window.config;
 Object.defineProperty(Vue.prototype, "$echarts", {
   value: echarts,
 });
+window.echarts = echarts;
 
 function htmlEncode(text) {
   return jQuery("<div />").text(text).html();