From 7f19feff3a29e2c10ee40b1129485c3e2ec2ead6 Mon Sep 17 00:00:00 2001
From: daitingting <daitingting@xirangit.com>
Date: Wed, 23 Nov 2022 01:43:12 +0000
Subject: [PATCH]  * Finish task #77137.

---
 module/custom/css/mode.css       |  3 +-
 module/custom/js/mode.js         | 15 ++---
 module/custom/view/mode.html.php | 98 ++++++++++++++++----------------
 module/upgrade/css/to18guide.css |  2 +-
 4 files changed, 55 insertions(+), 63 deletions(-)

diff --git a/module/custom/css/mode.css b/module/custom/css/mode.css
index 73f2d0f279..bf17268b27 100644
--- a/module/custom/css/mode.css
+++ b/module/custom/css/mode.css
@@ -1,5 +1,6 @@
-.pd-l-20{padding-left: 20px!important;}
+.pd-l-20 {padding-left: 20px!important;}
 #selectProgramModal .modal-dialog {width: 550px}
 #selectProgramModal .modal-header {border-bottom: 0px}
 #selectProgramModal .modal-header h4.modal-title{font-weight: 700}
 #selectProgramModal .modal-footer {border-top: 0px; text-align: center}
+.btn-wide {padding: 6px 85px;}
diff --git a/module/custom/js/mode.js b/module/custom/js/mode.js
index d62ef0bf1b..d2b43de9d4 100644
--- a/module/custom/js/mode.js
+++ b/module/custom/js/mode.js
@@ -2,17 +2,10 @@ $(function()
 {
     $('#modeTab').addClass('btn-active-text');
 
-    $('[name=mode]').change(function()
+    $('#useLight, #useALM').click(function()
     {
-        $('#submit').prop('disabled', 'disabled');
-        if(mode != $(this).val()) $('#submit').prop('disabled', '');
-        $('#program').closest('tr').toggle(mode == 'ALM' && $(this).val() == 'light');
-    });
-
-    $(document).on('click', '#submit', function()
-    {
-        var selectedMode = $('[name=mode]:checked').val();
-        if(mode == selectedMode) return false;
+        var selectedMode = $(this).data('mode');
+        $('#mode').val(selectedMode);
 
         if(selectedMode == 'light' && hasProgram)
         {
@@ -27,7 +20,7 @@ $(function()
         }
 
         return false;
-    });
+    })
 
     $(document).on('click', '.btn-save', function()
     {
diff --git a/module/custom/view/mode.html.php b/module/custom/view/mode.html.php
index deffeb57ef..693574ab8b 100644
--- a/module/custom/view/mode.html.php
+++ b/module/custom/view/mode.html.php
@@ -19,57 +19,55 @@
     <div class='main-header'>
       <h2><?php echo $lang->custom->modeManagement;?></h2>
     </div>
-    <table class='table table-form w-700px'>
-      <tr>
-        <td colspan='2'><?php echo sprintf($lang->custom->currentModeTips, $lang->custom->modeList[$mode], $lang->custom->modeList[$mode == 'light' ? 'ALM' : 'light']);?> </td>
-      </tr>
-      <tr>
-        <td>
-          <label class='radio-inline'><input type='radio' name='mode' value='light' <?php echo $mode == 'light'? "checked='checked'" : '';?> id="modelight"><strong><?php echo $lang->custom->modeList['light'];?></strong></label>
-          <p class='with-padding pd-l-20 text-muted'><?php echo $lang->custom->modeIntroductionList['light'];?></p>
-        </td>
-        <td>
-          <label class='radio-inline'><input type='radio' name='mode' value='ALM' <?php echo $mode == 'ALM'? "checked='checked'" : '';?> id="modeALM"><strong><?php echo $lang->custom->modeList['ALM'];?></strong></label>
-          <p class='with-padding pd-l-20 text-muted'><?php echo $lang->custom->modeIntroductionList['ALM'];?></p>
-        </td>
-      </tr>
-      <tr>
-        <td colspan='2'>
-          <table class='table table-bordered'>
-            <thead>
-              <tr>
-                <th><?php echo $this->lang->custom->mode;?></th>
-                <th class="text-center"><?php echo $lang->custom->modeList['light'];?></th>
-                <th class="text-center"><?php echo $lang->custom->modeList['ALM'];?></th>
-              </tr>
-            </thead>
-            <tbody>
-              <?php foreach($disabledFeatures as $feature):?>
-              <?php if(is_array($feature) && empty($disabledScrumFeatures)) continue;?>
-              <tr class='text-center'>
-                <td class='text-left'><?php echo (is_array($feature) && !empty($disabledScrumFeatures)) ? sprintf($this->lang->custom->scrum->common, implode($lang->comma, $disabledScrumFeatures)) : $this->lang->custom->features[$feature];?></td>
-                <td><i class='icon text-red icon-close'></i></td>
-                <td><i class='icon text-success icon-check'></i></td>
-              </tr>
-              <?php endforeach;?>
+    <div class='main-table'>
+      <p class='strong'><?php echo sprintf($lang->custom->currentModeTips, $lang->custom->modeList[$mode], $lang->custom->modeList[$mode == 'light' ? 'ALM' : 'light']);?> </p>
+      <table class='table table-bordered'>
+        <thead>
+          <tr>
+            <th><?php echo $this->lang->custom->mode;?></th>
+            <th class='text-center'><?php echo $lang->custom->modeList['light'];?></th>
+            <th class='text-center'><?php echo $lang->custom->modeList['ALM'];?></th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td><?php echo $lang->custom->usage;?></td>
+            <td class='text-center'><?php echo $lang->custom->modeIntroductionList['light'];?></td>
+            <td class='text-center'><?php echo $lang->custom->modeIntroductionList['ALM'];?></td>
+          </tr>
+          <?php foreach($disabledFeatures as $feature):?>
+          <?php if(is_array($feature) && empty($disabledScrumFeatures)) continue;?>
+          <tr class='text-center'>
+            <td class='text-left'><?php echo (is_array($feature) && !empty($disabledScrumFeatures)) ? sprintf($this->lang->custom->scrum->common, implode($lang->comma, $disabledScrumFeatures)) : $this->lang->custom->features[$feature];?></td>
+            <td><i class='icon text-red icon-close'></i></td>
+            <td><i class='icon text-success icon-check'></i></td>
+          </tr>
+          <?php endforeach;?>
 
-              <?php foreach($config->custom->allFeatures as $feature):?>
-              <?php if(in_array($feature, $disabledFeatures)) continue;?>
-              <?php if($feature == 'scrumDetail' && empty($enabledScrumFeatures)) continue;?>
-              <tr class='text-center'>
-                <td class='text-left'><?php echo ($feature == 'scrumDetail' && !empty($enabledScrumFeatures)) ? sprintf($this->lang->custom->scrum->common, implode($lang->comma, $enabledScrumFeatures)) : $this->lang->custom->features[$feature];?></td>
-                <td><i class='icon text-success icon-check'></i></td>
-                <td><i class='icon text-success icon-check'></i></td>
-              </tr>
-              <?php endforeach;?>
-            </tbody>
-          </table>
-        </td>
-      </tr>
-      <tr>
-        <td colspan='2'><?php echo html::submitButton($lang->custom->switch, 'disabled');?></td>
-      </tr>
-    </table>
+          <?php foreach($config->custom->allFeatures as $feature):?>
+          <?php if(in_array($feature, $disabledFeatures)) continue;?>
+          <?php if($feature == 'scrumDetail' && empty($enabledScrumFeatures)) continue;?>
+          <tr class='text-center'>
+            <td class='text-left'><?php echo ($feature == 'scrumDetail' && !empty($enabledScrumFeatures)) ? sprintf($this->lang->custom->scrum->common, implode($lang->comma, $enabledScrumFeatures)) : $this->lang->custom->features[$feature];?></td>
+            <td><i class='icon text-success icon-check'></i></td>
+            <td><i class='icon text-success icon-check'></i></td>
+          </tr>
+          <?php endforeach;?>
+          <tr class='text-center'>
+            <td class='text-left strong'><?php echo $this->lang->custom->selectUsage;?></td>
+            <td>
+              <?php $primaryClass = $mode == 'light' ? 'disabled' : 'btn-primary';?>
+              <?php echo html::commonButton($lang->custom->useLight, "id='useLight' data-mode='light'", "btn btn-wide $primaryClass");?>
+            </td>
+            <td>
+              <?php $primaryClass = $mode == 'ALM' ? 'disabled' : 'btn-primary';?>
+              <?php echo html::commonButton($lang->custom->useALM, "id='useALM' data-mode='ALM'", "btn btn-wide $primaryClass");?>
+              <?php echo html::hidden('mode', $mode);?>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
 
     <div class='modal fade' id='selectProgramModal'>
       <div class='modal-dialog'>
diff --git a/module/upgrade/css/to18guide.css b/module/upgrade/css/to18guide.css
index b8c8444fb3..58be2531bd 100644
--- a/module/upgrade/css/to18guide.css
+++ b/module/upgrade/css/to18guide.css
@@ -9,7 +9,7 @@
 #mainContent tr th {background-color: rgb(241, 241, 241);}
 #mainContent tr td {background-color: rgb(255, 255, 255); border-bottom: 1px solid rgb(238, 238, 238); border-right: 1px solid rgb(238, 238, 238);}
 
-#useLight, #useALM {border: #93969b 1px solid; padding: 6px 85px;}
+.btn-wide {padding: 6px 85px;}
 
 #mainContent .datatable {cursor: default;}
 .container {padding-top: 20px;}