用 jQuery EasyUI 打造輕量級 CMS (五)

這幾天趕進度所以沒空詳細紀錄修改過程. 昨晚將主題布景選擇功能搞定, 使用者隨時可選擇主題, 除了修改網頁本身連結的 css 設定檔路徑外, 同時也會以 Ajax 方式更新 sys_user 資料表中的 theme 欄位值, 這樣下一次登入時就會套用最近一次選擇的主題.

首先從資料庫取得使用者布景 :

//擷取系統設定布景
$RS=search("sys_settings");
if (is_array($RS)) {$sys_theme=$RS[0]["sys_theme"];}
else {$sys_theme="default";}
//擷取使用者布景
$RS=search("sys_users","account",$_SESSION["user_account"]);
if (is_array($RS)) {$user_theme=$RS[0]["theme"];}
else {$user_theme=$sys_theme;}

原先在 main.php 中的 header 中的主題布景是固定預設的 default :

  <link id="theme" rel="stylesheet" type="text/css" href="jquery/themes/default/easyui.css">

現在改成由 PHP 控制 :

  <link id="theme" rel="stylesheet" type="text/css" href="jquery/themes/<?php echo $user_theme ?>/easyui.css">

這裡 id 是用來給 jQuery 存取修改 href 屬性用的, 而右上角用來選主題的拉霸是用 Combobox 做的 :

            <select id="theme_sel" name="theme" class="easyui-combobox" style="width:120px;height:18px" panelHeight="320">
              <option value="default">主題布景</option>
<?php
$SQL="SELECT * FROM `sys_themes`";
$RS=run_sql($SQL);
if (is_array($RS)) {
  for ($i=0; $i<count($RS); $i++) {
    $theme=$RS[$i]["theme"];
?>
              <option value="<?php echo $theme ?>"<?php if ($theme==$user_theme) {echo " selected";}?>><?php echo $theme ?></option>
<?php
    }
  }
?>
            </select>

這裡 combobox 的 id 是用來以 jQuery 存取拉霸的, 而 name 用來將被選的主題傳給後端程式更新資料庫. 當然這 select 必須包在 form 元素中才能被傳送出去. 拉霸的事件處理程式如下 :

    $(document).ready(function(){
      $("#theme_sel").combobox({
        onSelect:function(rec){
          var css="jquery/themes/" + rec.value + "/easyui.css";
          $("#theme").attr("href", css);
          $.get("sys.php?op=change_theme",{theme:rec.value});
          }
        });
      });

當選擇主題時, combobox 會觸發 onSelect 事件, 並傳回 rec 物件, 選擇值放在 rec.value 中, 可利用 jQuery 的 attr 方法據此修改網頁的 link 元素所連結的主題布景 css 檔之位置, 然後用 ajax 的 get 方法更新後端資料庫中 sys_users 資料表裡使用者的布景設定 :

  case "change_theme" : {
       $theme=$_REQUEST["theme"];
       $SQL="UPDATE sys_users SET theme='".$theme."' WHERE account='".
            $_SESSION["user_account"]."'";
       $result=run_sql($SQL);
       break;
       }  

在後端的 sys.php 裡以 $_REQUEST["op"] 擷取操作碼, 再用 switch case 選擇執行區段.

除此之外的架構變動就是將 login.php, logout.php, 以及 change_theme.php 全整合於 sys.php 中, 用 op 參數決定要執行哪一種功能. 這樣能避免程式凌亂, 我打算架站系統本身的功能像留言, 新聞等都放在 sys.php 好了.

另外考量應用子系統是否該用獨立資料庫問題, 結論是要, 這樣才不會有各子系統資料表混在一起難以管理的問題, 一個系統就一個資料庫, 所以將 dbsettings.php 改名為 sysdb.php, 以後工作日誌子系統的資料庫設定檔就用 jlogdb.php ....