From 30cd93dee851f94291c178e7c1282db679e5aff9 Mon Sep 17 00:00:00 2001
From: Bohung <bohung@rulingcom.com>
Date: Fri, 18 Mar 2022 11:49:11 +0800
Subject: [PATCH] Fix known bug. Add order fields feature.

---
 app/controllers/admin/asks_controller.rb      |   8 +
 app/controllers/asks_controller.rb            | 141 ++++++++-----
 app/models/ask_category_setting.rb            |   2 +-
 app/models/ask_setting.rb                     |  63 +++++-
 app/views/admin/asks/_ask_setting.html.erb    |  18 +-
 .../admin/asks/category_setting.html.erb      |   2 +-
 app/views/admin/asks/order_fields.html.erb    | 196 ++++++++++++++++++
 app/views/admin/asks/setting.html.erb         |   4 +-
 app/views/asks/index.html.erb                 | 156 +-------------
 ask.gemspec                                   |  23 +-
 config/locales/en.yml                         |   5 +
 config/locales/zh_tw.yml                      |   5 +
 config/routes.rb                              |   2 +
 lib/ask/engine.rb                             |   5 +
 14 files changed, 396 insertions(+), 234 deletions(-)
 create mode 100644 app/views/admin/asks/order_fields.html.erb

diff --git a/app/controllers/admin/asks_controller.rb b/app/controllers/admin/asks_controller.rb
index 662181a..cfc79dd 100644
--- a/app/controllers/admin/asks_controller.rb
+++ b/app/controllers/admin/asks_controller.rb
@@ -141,6 +141,7 @@ class Admin::AsksController < OrbitAdminController
 
   end
   def get_category_setting_field
+    @default_ask_setting = AskSetting.first
     ask_setting = AskCategorySetting.find(params['id'])
     render partial: 'category_setting_field',locals: {ask_setting: ask_setting} 
   end
@@ -384,6 +385,13 @@ class Admin::AsksController < OrbitAdminController
   def set_askquestion
     @ask_question = AskQuestion.find(params[:id])
   end
+  def order_fields
+    @disp_fields_infos = AskSetting.get_disp_fields_infos
+  end
+  def update_order_fields
+    AskSetting.update_all(:sort_number=>params[:sort_number])
+    render :json => {:success=>true}
+  end
   private
     def ask_setting_params(ask_setting,collection_name)
       param = params.require(collection_name).permit!
diff --git a/app/controllers/asks_controller.rb b/app/controllers/asks_controller.rb
index f9502a5..18b38da 100644
--- a/app/controllers/asks_controller.rb
+++ b/app/controllers/asks_controller.rb
@@ -37,11 +37,6 @@ class AsksController < ActionController::Base
       {
         'fields' => defalt_fields,
         'extras'=>{
-                    'token_tag' => token_tag,
-                    'form_url' => "/#{I18n.locale.to_s}/asks",
-                    'submit_tag' => submit_tag(t('submit'), :class=> 'btn btn-primary', :id => 'button-mail'),
-                    'close_tag' => button_tag(t('cancel'), type: 'reset', :class=> 'btn'),
-                    'referer_url' => referer_url,
                     'switch_form' => switch_form
                   }
       }
@@ -254,54 +249,82 @@ class AsksController < ActionController::Base
     params.require(:ask_question).permit!
   end
   private
-    def cal_form_from_setting(ask_setting,categories,show_categories=false)
+    def cal_form_from_setting(ask_setting,categories,show_categories=false,filter_fields=nil)
+      disp_fields_infos = AskSetting.get_disp_fields_infos
+      if filter_fields
+        disp_fields_infos = disp_fields_infos.select{|field, info| filter_fields.include?(field)}
+      end
       tmp = 'mongoid.attributes.ask_question'
       defalt_fields = [{'style_html'=>'','label'=>ask_label(t('title'),'true'),'content'=>text_field_tag('ask_question[title]',nil,placeholder: t('title'),required: true)}]
-      if show_categories || ask_setting.default_setting['ask_category_id']
-        if categories.count > 1
-          defalt_fields = defalt_fields + [{'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("ask_category_id"),'true'),'content'=>select_tag('ask_question[category_id]', options_for_select(categories.collect{|t| [ t.title, t.id ]}))}]
+      tmp_type = (ask_setting.class == AskSetting) ? 0 : 1
+      tmp_ask_cat_id = (tmp_type == 1) ? ask_setting.id.to_s : ""
+      disp_fields_infos.each do |field, info|
+        if field.include?("default@")
+          if tmp_type == 0
+            k = field[8..-1]
+            v = ask_setting.custom_fields[k]
+            if v
+              defalt_fields << {'label'=>ask_label(v['field'][I18n.locale],v['required']),'content'=>show_on_front(k,v)}
+            end
+          end
+        elsif field.include?("custom@") && tmp_ask_cat_id != ""
+          if tmp_type == 1 && field.include?(tmp_ask_cat_id)
+            k = field[8+tmp_ask_cat_id.length..-1]
+            v = ask_setting.custom_fields[k]
+            if v
+              defalt_fields << {'label'=>ask_label(v['field'][I18n.locale],v['required']),'content'=>show_on_front(k,v)}
+            end
+          end
         else
-          defalt_fields = defalt_fields + [{'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("ask_category_id"),'true'),'content'=>"<span>#{(categories[0].title rescue '')}</span>"+hidden_field_tag('ask_question[category_id]', (categories[0].id.to_s rescue ''))}]
+          if field == 'ask_category_id'
+            if show_categories || ask_setting.default_setting[field]
+              if categories.count > 1
+                defalt_fields = defalt_fields + [{'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("ask_category_id"),'true'),'content'=>select_tag('ask_question[category_id]', options_for_select(categories.collect{|t| [ t.title, t.id ]}))}]
+              else
+                defalt_fields = defalt_fields + [{'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("ask_category_id"),'true'),'content'=>"<span>#{(categories[0].title rescue '')}</span>"+hidden_field_tag('ask_question[category_id]', (categories[0].id.to_s rescue ''))}]
+              end
+            else
+              defalt_fields = defalt_fields + [{'style_html'=>'display: none;','label'=>'','content'=>hidden_field_tag('ask_question[category_id]', (categories[0].id.to_s rescue ''))}]
+            end
+          else
+            if ask_setting.default_setting[field] || field == "usage_rule"
+              required = ['phone','appointment'].exclude?(field) ? 'true' : 'false'
+              f1 = {'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("#{field}"),required)}
+              field_name = "ask_question[#{field}]"
+              case field
+              when 'name'
+                f1['content'] = text_field_tag(field_name,nil,data: {"fv-validation" => "required;", "fv-messages" => "必填欄位;"},required: true,placeholder:@default_ask_setting.field_name("#{field}"))
+              when 'sex'
+                f1['content'] = "<label class=\"radio-inline\">
+                  #{radio_button_tag(field_name,'male')}#{I18n.t('users.male')}
+                </label>
+                <label class=\"radio-inline\">
+                  #{radio_button_tag(field_name,'female')}#{I18n.t('users.female')}
+                </label>"
+              when 'mail'
+                f1['content'] = text_field_tag(field_name,nil,data: {"fv-validation" => "required;check_email;", "fv-messages" => "必填欄位;Email不正確;"},required: true,placeholder:@default_ask_setting.field_name("#{field}"))
+              when 'phone'
+                f1['content'] = text_field_tag(field_name,nil,placeholder:@default_ask_setting.field_name("#{field}"))
+              when 'appointment'
+                f1['content'] = "<div class=\"default_picker\">#{text_field_tag(field_name,nil,placeholder:@default_ask_setting.field_name("#{field}"))}</div>"
+              when 'recaptcha'
+                f1['content'] = "{{gotcha_error}}{{gotcha}}"
+              when 'usage_rule'
+                next if ask_setting.usage_rule.blank?
+                f1['content'] = ask_setting.usage_rule
+              when 'agree_show'
+                f1['content'] = check_box_tag('ask_question[agree_show]')
+              when 'agree_usage'
+                f1['content'] = check_box_tag('ask_question[agree_usage]')
+              end
+              defalt_fields << f1
+            end
+          end
         end
-      else
-        defalt_fields = defalt_fields + [{'style_html'=>'display: none;','label'=>'','content'=>hidden_field_tag('ask_question[category_id]', (categories[0].id.to_s rescue ''))}]
-      end
-      defalt_fields = defalt_fields + ['name','sex','mail','phone','appointment'].select{|v| ask_setting.default_setting[v]}.collect do |field|
-        required = ['phone','appointment'].exclude?(field) ? 'true' : 'false'
-        f1 = {'style_html'=>'','label'=>ask_label(@default_ask_setting.field_name("#{field}"),required)}
-        field_name = "ask_question[#{field}]"
-        case field
-        when 'name'
-          f1['content'] = text_field_tag(field_name,nil,data: {"fv-validation" => "required;", "fv-messages" => "必填欄位;"},required: true,placeholder:@default_ask_setting.field_name("#{field}"))
-        when 'sex'
-          f1['content'] = "<label class=\"radio-inline\">
-            #{radio_button_tag(field_name,'male')}#{I18n.t('users.male')}
-          </label>
-          <label class=\"radio-inline\">
-            #{radio_button_tag(field_name,'female')}#{I18n.t('users.female')}
-          </label>"
-        when 'mail'
-          f1['content'] = text_field_tag(field_name,nil,data: {"fv-validation" => "required;check_email;", "fv-messages" => "必填欄位;Email不正確;"},required: true,placeholder:@default_ask_setting.field_name("#{field}"))
-        when 'phone'
-          f1['content'] = text_field_tag(field_name,nil,placeholder:@default_ask_setting.field_name("#{field}"))
-        when 'appointment'
-          f1['content'] = "<div class=\"default_picker\">#{text_field_tag(field_name,nil,placeholder:@default_ask_setting.field_name("#{field}"))}</div>"
-        end
-        f1
-      end
-      defalt_fields = defalt_fields + ask_setting.custom_fields.collect{|k,v| {'label'=>ask_label(v['field'][I18n.locale],v['required']),'content'=>show_on_front(k,v)}}
-      if !ask_setting.usage_rule.blank?
-        defalt_fields << {'style_html'=>'','label'=>ask_label(t("ask.usage_rule")),'content'=>ask_setting.usage_rule}
-      end
-      if ask_setting.default_setting['agree_usage']
-        defalt_fields << {'style_html'=>'','label'=>ask_label(t("#{tmp}.agree_usage")),'content'=>check_box_tag('ask_question[agree_usage]')}
-      end
-      if ask_setting.default_setting['agree_show']
-        defalt_fields << {'style_html'=>'','label'=>ask_label(t("#{tmp}.agree_show")),'content'=>check_box_tag('ask_question[agree_show]')}
       end
       defalt_fields
     end
-    def cal_html(fields,token_tag,form_id,referer_url)
+    def cal_html(fields,token_tag,form_id,referer_url,is_hidden=true)
       form_url = "/#{I18n.locale.to_s}/asks"
       submit_tag = submit_tag(t('submit'), :class=> 'btn btn-primary', :id => 'button-mail')
       close_tag = button_tag(t('cancel'), type: 'reset', :class=> 'btn')
@@ -316,7 +339,7 @@ class AsksController < ActionController::Base
             </div>
           </div>"
       end.join
-      "<form id=\"#{form_id}\" action=\"#{form_url}\" enctype=\"multipart/form-data\" method=\"post\" class=\"form-horizontal\" accept-charset=\"UTF-8\"  style=\"display: none;\">
+      "<form id=\"#{form_id}\" action=\"#{form_url}\" enctype=\"multipart/form-data\" method=\"post\" class=\"form-horizontal\" accept-charset=\"UTF-8\"  style=\"#{is_hidden ? 'display: none;' : ''}\">
         #{token_tag}
         <div data-level=\"0\" data-list=\"fields\">
           #{tmp}
@@ -368,17 +391,21 @@ class AsksController < ActionController::Base
     end
     def cal_switch_form(ask_settings,categories,token_tag,referer_url)
       switch_form = ''
-      if ask_settings.count > 1
-        switch_form = script_text + ask_settings.collect do |ask_setting|
-          fields = cal_form_from_setting(ask_setting,categories,true)
-          if ask_setting.class == AskSetting
-            form_id = 'ask-default-form'
-          else
-            form_id = ask_setting.category_id
-          end
-          cal_html(fields,token_tag,form_id,referer_url)
-        end.join
+      default_idx = 0
+      if categories.count != 0
+        default_idx = ask_settings[1..-1].map{|a| a.category_id.to_s}.index(categories[0].id.to_s)
+        default_idx = default_idx.nil? ? 0 : default_idx + 1
       end
+      switch_form = script_text + ask_settings.collect.with_index do |ask_setting,i|
+        fields = cal_form_from_setting(ask_setting,categories,true)
+        is_hidden = (i != default_idx)
+        if ask_setting.class == AskSetting
+          form_id = 'ask-default-form'
+        else
+          form_id = ask_setting.category_id
+        end
+        cal_html(fields,token_tag,form_id,referer_url,is_hidden)
+      end.join
       switch_form
     end
 end
\ No newline at end of file
diff --git a/app/models/ask_category_setting.rb b/app/models/ask_category_setting.rb
index efb2d38..d29e7d8 100644
--- a/app/models/ask_category_setting.rb
+++ b/app/models/ask_category_setting.rb
@@ -33,7 +33,7 @@ class AskCategorySetting
   def field_name_translations(k)
     I18n.available_locales.map{|v| [v.to_s,self.field_name(k,v.to_s)]}.to_h
   end
-
+  field :sort_number, type: Hash, default: {}
   field :default_setting, type: Hash,default: {ask_category_id: true,name: true,sex: false,mail: true,phone: false,appointment: false,recaptcha: false,agree_show: true,agree_usage: false}
   field :default_setting_field_name, type: Hash,default: {}
 
diff --git a/app/models/ask_setting.rb b/app/models/ask_setting.rb
index 3565268..8c7617c 100644
--- a/app/models/ask_setting.rb
+++ b/app/models/ask_setting.rb
@@ -1,6 +1,7 @@
 class AskSetting
   include Mongoid::Document
   include Mongoid::Timestamps
+  All_default_fields = ['ask_category_id','name','sex','mail','phone','appointment','recaptcha','usage_rule','agree_show','agree_usage']
   after_initialize do
     if !self.new_record?
       if self.default_setting.class != Hash && self.default_setting.class != BSON::Document
@@ -22,21 +23,73 @@ class AskSetting
     tmp = super
     tmp.select{|k,v| v['delete'] != true}
   end
-  def field_name(k,locale=I18n.locale.to_s)
-    (self.default_setting_field_name[k]&&self.default_setting_field_name[k][locale]) ? self.default_setting_field_name[k][locale] : self.default_field_name(k,locale)
+  def field_name(k,locale=I18n.locale.to_s,use_checkbox_trans=false)
+    tmp = self.default_setting_field_name[k]
+    (tmp&&tmp[locale]) ? tmp[locale] : self.default_field_name(k,locale)
   end
 
-  def default_field_name(k,locale=I18n.locale.to_s)
-    I18n.with_locale(locale){(['agree_show','agree_usage'].include?(k.to_s) ? I18n.t("ask.#{k}_checkbox") : I18n.t("mongoid.attributes.ask_question.#{k}"))}
+  def default_field_name(k,locale=I18n.locale.to_s,use_checkbox_trans=false)
+    I18n.with_locale(locale){ (use_checkbox_trans && ['agree_show','agree_usage'].include?(k.to_s)) ? I18n.t("ask.#{k}_checkbox") : I18n.t("mongoid.attributes.ask_question.#{k}")}
   end
 
   def field_name_translations(k)
     I18n.available_locales.map{|v| [v.to_s,self.field_name(k,v.to_s)]}.to_h
   end
-
+  field :sort_number, type: Hash, default: {}
   field :default_setting, type: Hash,default: {ask_category_id: true,name: true,sex: false,mail: true,phone: false,appointment: false,recaptcha: false,agree_show: true,agree_usage: false}
   field :default_setting_field_name, type: Hash,default: {}
 
   field :custom_fields, type: Hash,default: {}
   field :usage_rule
+
+  def self.get_disp_fields_infos
+    ask_setting = self.first
+    ask_setting = self.create() if ask_setting.nil?
+    disp_fields = self::All_default_fields
+    disp_fields_infos = {}
+    locale = I18n.locale.to_s
+    disp_fields[0...-4].each do |f|
+      disp_fields_infos[f] = {"trans"=>ask_setting.field_name(f,locale),"sort_number"=>ask_setting.sort_number[f]}
+    end
+    tmp_locales = I18n.available_locales.map{|l| l.to_s}
+    tmp_locales = [locale] + (tmp_locales - [locale])
+    ask_setting.custom_fields.each do |k,v|
+      trans = v["field"]
+      tmp_locales.each do |l|
+        trans = trans[l] if trans[l].present?
+      end
+      next if trans.class != String
+      tmp_k = "default@#{k}"
+      disp_fields_infos[tmp_k] = {"trans"=>trans,"sort_number"=>ask_setting.sort_number[tmp_k]}
+    end
+    AskCategorySetting.all.each do |c|
+      cat = Category.find(c.category_id)
+      c.custom_fields.each do |k,v|
+        trans = v["field"]
+        tmp_locales.each do |l|
+          trans = trans[l] if trans[l].present?
+        end
+        next if trans.class != String
+        tmp_k = "custom@#{c.id}@#{k}"
+        cat_title = cat.title rescue ""
+        disp_fields_infos[tmp_k] = {"trans"=>"#{cat_title}-#{trans}","sort_number"=>ask_setting.sort_number[tmp_k]}
+      end
+    end
+    disp_fields[-4..-1].each do |f|
+      disp_fields_infos[f] = {"trans"=>ask_setting.field_name(f,locale),"sort_number"=>ask_setting.sort_number[f]}
+    end
+    max_sort_number = disp_fields_infos.values.map{|h| h["sort_number"].to_i}.max
+    if max_sort_number
+      max_sort_number = max_sort_number + 1
+      disp_fields_infos.each do |k,h|
+        if h["sort_number"].blank?
+          h["sort_number"] = max_sort_number
+        else
+          h["sort_number"] = h["sort_number"].to_i
+        end
+      end
+      disp_fields_infos = disp_fields_infos.sort_by {|_key, value| value["sort_number"]}
+    end
+    disp_fields_infos
+  end
 end
diff --git a/app/views/admin/asks/_ask_setting.html.erb b/app/views/admin/asks/_ask_setting.html.erb
index 6bf13b5..237c7e3 100644
--- a/app/views/admin/asks/_ask_setting.html.erb
+++ b/app/views/admin/asks/_ask_setting.html.erb
@@ -1,5 +1,5 @@
 <style type="text/css">
-  thead td {
+  thead th {
     text-align: center;
     color: blueviolet;
   }
@@ -37,6 +37,9 @@
   input[type=text] {
     height: 30px;
   }
+  .small_sort_number{
+    width: 4em;
+  }
 </style>
 <script type="text/javascript">
   <%
@@ -98,24 +101,25 @@
   <table>
     <thead>
       <tr>
-        <td>
+        <th>
           <%= t('ask.field') %>
-        </td>
-        <td>
+        </th>
+        <th>
           <%= t('ask.whether_open') %>
-        </td>
+        </th>
         <% if form_type=='ask_setting' %>
-        <td>
+        <th>
           <%= t('ask.field_name') %>
         </td>
         <% end %>
       </tr>
     </thead>
     <tbody>
+      <% locale = I18n.locale.to_s %>
       <% ask_setting.default_setting.each do |k,v| %>
         <tr>
           <td>
-            <%= tmp = (form_type=='ask_setting' ? ask_setting.default_field_name(k) : @default_ask_setting.field_name(k)) %>
+            <%= tmp = (form_type=='ask_setting' ? ask_setting.default_field_name(k,locale, true) : @default_ask_setting.field_name(k,locale, true)) %>
           </td>
           <td>
             <%= select_tag "#{get_input_name}[default_setting][#{k}]",options_for_select([[t('yes'),'true'],[t('no'),false]],v)  %>
diff --git a/app/views/admin/asks/category_setting.html.erb b/app/views/admin/asks/category_setting.html.erb
index cbf88ba..5367217 100644
--- a/app/views/admin/asks/category_setting.html.erb
+++ b/app/views/admin/asks/category_setting.html.erb
@@ -91,7 +91,7 @@
         success: function(data){
           var add_field_html = "<%= custom_field_block(-1).inspect %>"
           add_field_html = add_field_html.replace(/-1/g,data['key'])
-          $('.add_field').before($('<div/>').html(add_field_html).text().slice(1,-2))
+          $(ele).parents('.add_field').before($('<div/>').html(add_field_html).text().slice(1,-2))
           $('.add_new_options').sortable({'handle':'.icons-list-2'})
         }
       })
diff --git a/app/views/admin/asks/order_fields.html.erb b/app/views/admin/asks/order_fields.html.erb
new file mode 100644
index 0000000..52664a4
--- /dev/null
+++ b/app/views/admin/asks/order_fields.html.erb
@@ -0,0 +1,196 @@
+<style>
+	.icons-list-2 {
+    cursor: all-scroll;
+  }
+  .position-text-div {
+    cursor: text;
+    margin: -8px;
+    padding: 8px;
+	}
+	.position-text-div:hover {
+    background: aqua;
+	}
+</style>
+<div class="order-edit-notification"><%= t("ask.please_save") %></div>
+<table width="100%" id="ask_fields_order_table" class="table table-striped" class="ask_fields_table">
+	<thead>
+		<tr>
+			<th></th>
+			<th><%= t("ask.sort_number") %></th>
+			<th><%= t("ask.field") %></th>
+	</thead>
+	<tbody>
+		<% @disp_fields_infos.each_with_index do |(k, info),i| %>
+			<tr data-index="<%=i%>">
+				<td><span class="brand"><i class="icons-list-2"></i></span></td>
+				<td class="position-text">
+					<div class="position-text-div" data-value="<%= (i + 1).to_s %>"><%= (i + 1).to_s  %></div>
+				</td>
+				<td>
+					<div class="field-text-id" data-field-id="<%= k %>"><%= info["trans"] %></div>
+				</td>
+			</tr>
+		<% end %>
+	</tbody>
+</table>
+<div class="bottomnav clearfix" style="left: 81px;">
+    <div class="action pull-right">
+    <a class="btn btn-info disabled" id="save-order-button" href="#"><%= t("ask.save_order") %></a>
+    </div>
+    <div class="pagination pagination-centered"></div>
+  </div>
+<script type="text/javascript">
+
+	var makeEditable = function(){
+		var input_box = $("<input type='text'/>"),
+			el = $(this);
+		input_box.addClass("editable-input");
+		input_box.val(el.data("value"));
+		input_box.attr("data-old-id",el.data("value"));
+		input_box.on("blur",function(){
+			putBackdiv($(this));
+		});
+		input_box.on("keypress",function(e){
+			if(e.keyCode == 13 || e.keyCode == 27){
+				putBackdiv($(this),e.keyCode);
+			}
+		})
+		el.parent().html(input_box);
+		input_box.focus();
+	}
+
+	var putBackdiv = function(el,keyCode){
+			current_value = parseInt((el.val() == "" ? el.data("old-id") : el.val())),
+			old_value = parseInt(el.data("old-id"));
+			if(isNaN(current_value) || keyCode == 27){
+				current_value = old_value;
+			}
+		if(old_value != current_value){
+			var new_index_value = (current_value > old_value ? current_value + 1 : current_value - 1),
+				div = $("<div class='position-text-div' data-value='" + current_value + "'>" + new_index_value + "</div>");
+			div.on("click",makeEditable);
+			el.parent().html(div);
+			$("#save-order-button").removeClass("disabled");
+			$(".order-edit-notification").slideDown();
+			sortTable(el.data("old-id"),current_value);
+		}else{
+			var div = $("<div class='position-text-div' data-value='" + current_value + "'>" + current_value + "</div>");
+			div.on("click",makeEditable);
+			el.parent().html(div);
+		}
+	}
+
+	var sortTable = function(changed_index,changed_to){
+		var table_element = document.getElementById("ask_fields_order_table"),
+			data = [],
+			allRows = table_element.rows;
+		for(i = 1; i < allRows.length; i++){
+			var thisRow = allRows[i],
+				text = thisRow.cells[1].textContent.trim(),
+				hash = {};
+			hash.index = parseInt(text);
+			text = thisRow.cells[2].innerHTML.trim();
+			if(text != "&nbsp;"){
+				hash.field_name = text;
+			}
+			data.push(hash);
+		}
+		data = data.sort(function(a,b){return a.index - b.index});
+		renderSortedTable(data,table_element);
+	}
+
+	var renderSortedTable = function(data,table_element){
+		var allRows = table_element.rows;
+		for(i = 0;i < data.length; i++){
+			var thisRow = allRows[i + 1],
+				current_value = i + 1;
+			thisRow.cells[1].innerHTML = "<div class='position-text-div' data-value='" + current_value + "'>" + current_value + "</div>";
+			thisRow.cells[2].innerHTML = data[i].field_name;
+		}
+		$("#ask_fields_order_table div.position-text-div").on("click",makeEditable);
+	}
+
+	$("#save-order-button").on("click",function(){
+		var el = $(this);
+		if(!el.hasClass("disabled")){
+			var sort_number = {};
+			$("#ask_fields_order_table .field-text-id").each(function(i, v){
+				sort_number[$(v).data("field-id")] = i + 1;
+			})
+			$.ajax({
+				url : "/admin/asks/update_order_fields",
+				data : {"sort_number" : sort_number},
+				dataType : "json",
+				type  : "post"
+			}).done(function(){
+				el.addClass("disabled");
+				$(".order-edit-notification").slideUp();
+			})
+		}
+	})
+
+	$("#ask_fields_order_table div.position-text-div").on("click",makeEditable);
+
+</script>
+<script>
+	var th_width = {};
+	$(document).ready(function(){
+		$( ".table tbody" ).each(function(i,tbody){
+			var table = $(tbody).parents("table").eq(0);
+			table.data("index",i);
+			th_width[i] = [];
+			table.find("thead th").each(function(j,th){
+				th_width[i].push($(th).outerWidth(true));
+			})
+		})
+		$( ".table tbody" ).sortable({
+	    revert: true,
+	    axis: "y",
+	    handle: ".brand",
+	    start: function(event, ui){
+	    	var item = ui.item;
+	      var target = $(event.target);
+	      var index = target.parents(".table").eq(0).data("index");
+	      item.css("width",target.width());
+	      item.find("td").each(function(i,td){
+	      	$(td).width(th_width[index][i]);
+	      })
+	    },
+	    stop: function(event, ui) {
+	    	var item = ui.item;
+	    	item.css("width","");
+	    	item.find("td").css("width","");
+	    },
+	    update: function(event, ui) {
+	    	var item = ui.item;
+	      var org_index = item.data("index");
+	      console.log(org_index);
+	      var new_index = item.index();
+	      var indices = [org_index,new_index].sort();
+	      var table = item.parents(".table").eq(0);
+	      table.find("tbody tr").each(function(i,tr){
+	      	if(i >= indices[0] &&  i <= indices[1]){
+	      		var position_text_div = $(tr).find(".position-text-div");
+	      		position_text_div.text(i+1).data("value",i+1);
+	      		$(tr).data("index",i);
+	      	}
+	      	if(i > indices[1]){
+	      		return;
+	      	}
+	      })
+	      $("#save-order-button").removeClass("disabled");
+	      $(".order-edit-notification").slideDown();
+	    }
+	  });
+	})
+  $(window).resize(function(){
+  	th_width = {};
+		$( ".table tbody" ).each(function(i,tbody){
+			var table = $(tbody).parents("table").eq(0);
+			th_width[i] = [];
+			table.find("thead th").each(function(j,th){
+				th_width[i].push($(th).outerWidth(true));
+			})
+		})
+  })
+</script>
\ No newline at end of file
diff --git a/app/views/admin/asks/setting.html.erb b/app/views/admin/asks/setting.html.erb
index 1650f6a..1521831 100644
--- a/app/views/admin/asks/setting.html.erb
+++ b/app/views/admin/asks/setting.html.erb
@@ -2,7 +2,7 @@
   set_input_name('ask_setting[custom_fields]')
 %>
 <script>
-  function add_new_field(){
+  function add_new_field(ele){
     $.ajax({
       url : "<%= get_new_setting_index_admin_asks_path %>",
       dataType : "json",
@@ -13,7 +13,7 @@
       success: function(data){
         var add_field_html = "<%= custom_field_block(-1).inspect %>"
         add_field_html = add_field_html.replace(/-1/g,data['key'])
-        $('.add_field').before($('<div/>').html(add_field_html).text().slice(1,-2))
+        $(ele).parents('.add_field').before($('<div/>').html(add_field_html).text().slice(1,-2))
         $('.add_new_options').sortable({'handle':'.icons-list-2'})
       }
     })
diff --git a/app/views/asks/index.html.erb b/app/views/asks/index.html.erb
index 0e924b9..a8cf6ab 100644
--- a/app/views/asks/index.html.erb
+++ b/app/views/asks/index.html.erb
@@ -99,157 +99,11 @@
 <%= javascript_include_tag 'validator' %>
 <link href="/assets/ask/ask.css" media="screen" rel="stylesheet">
 <div id="new-ask-question" class="ask-question">
-	<%= form_for @ask_question, url: asks_path, html: {class: 'form-horizontal',multipart: true} do |f| %>
-    <div class="control-group">
-      <%= f.label nil,t('title'), class: 'control-label required' %>
-      <div class="controls">
-        <%= f.text_field :title,placeholder: t('title'),required: true %>
-      </div>
-    </div>
-    <!-- Category -->
-    <% if ask_setting.default_setting['ask_category_id'] %>
-      <div class="control-group">
-        <%= f.label :ask_category_id, @default_ask_setting.field_name("ask_category_id"), class: 'control-label required' %>
-        <div class="controls">
-          <% if @categories.count > 1 %>
-            <%= f.select :category_id, @categories.collect{|t| [ t.title, t.id ]} %>
-          <% else %>
-            <span>
-              <%= @categories[0].title rescue '' %>
-            </span>
-            <%= f.hidden_field :category_id, :value => (@categories[0].id.to_s rescue nil) %>
-          <% end %>
-        </div>
-      </div>
-    <% elsif @categories.count == 1 %>
-      <%= f.hidden_field :category_id, :value => (@categories[0].id.to_s rescue nil) %>
-    <% end %>
-    <!-- 姓名 -->
-    <% if ask_setting.default_setting['name'] %>
-      <div class="control-group">
-        <%= f.label :name, @default_ask_setting.field_name("name"), class: 'control-label required' %>
-        <div class="controls">
-          <%= f.text_field :name, data: {"fv-validation" => "required;", "fv-messages" => "必填欄位;"}  %>
-        </div>
-      </div>
-    <% end %>
-    <!-- 性別 -->
-    <% if ask_setting.default_setting['sex'] %>
-      <div class="control-group">
-        <%= f.label :sex,@default_ask_setting.field_name("sex"), class: 'control-label required' %>
-        <div class="controls">
-          <label class="radio-inline">
-            <%= f.radio_button :sex, "male" %><%= t('users.male')%>
-          </label>
-          <label class="radio-inline">
-            <%= f.radio_button :sex, "female" %><%= t('users.female')%>
-          </label>
-        </div>
-      </div>
-    <% end %>
-    <!-- 身分 -->
-    <!-- <div class="control-group">
-      <%# f.label :identity, class: 'control-label required' %>
-      <div class="controls">
-      <%# select_tag "ask_question[identity]", options_for_select(@tags.collect{|t| [ t.name, t.id ]}) if !@tags.nil? %>
-      </div>
-    </div> -->
-    <!-- Email -->
-    <div class="control-group">
-      <%= f.label :mail,@default_ask_setting.field_name("mail"), class: 'control-label required' %>
-      <div class="controls">
-        <%= f.text_field :mail, data: {"fv-validation" => "required;check_email;", "fv-messages" => "必填欄位;Email不正確;"}  %>
-      </div>
-    </div>
-    <!-- 聯絡電話 -->
-    <% if ask_setting.default_setting['phone'] %>
-      <div class="control-group">
-        <%= f.label :phone,@default_ask_setting.field_name("phone"), class: 'control-label' %>
-        <div class="controls">
-          <%= f.text_field :phone %>
-        </div>
-      </div>
-    <% end %>
-    <!-- 預約日期 -->
-    <% if ask_setting.default_setting['appointment'] %>
-      <div class="control-group">
-        <%= f.label :appointment,@default_ask_setting.field_name("appointment"), class: 'control-label' %>
-        <div class="controls">
-          <%= f.datetime_picker :appointment %>
-        </div>
-      </div>
-    <% end %>
-    <!-- 傳真 -->
-    <!-- <div class="control-group">
-      <%# f.label :fax, class: 'control-label' %>
-      <div class="controls">
-        <%# f.text_field :fax %>
-      </div>
-    </div> -->
-    <!-- 主旨 -->
-    <!-- <div class="control-group">
-      <%# f.label :title, class: 'control-label required' %>
-      <div class="controls">
-        <%# f.text_field :title, data: {"fv-validation" => "required;", "fv-messages" => "必填欄位;"}  %>
-      </div>
-    </div> -->
-    <!-- 內容 -->
-    <!-- <div class="control-group">
-      <%# f.label :content, class: 'control-label required' %>
-      <div class="controls">
-        <%# f.text_area :content, rows: 8, class: 'input-xlarge'  %>
-      </div>
-    </div> -->
-    <!-- 驗證碼 -->
-    <%= ask_setting.custom_fields.collect do |k,v| 
-          required_pattern = v['required']=='true' ? '*' : ''
-          "<div class=\"control-group\">
-              <label class=\"control-label\">#{required_pattern}#{v['field'][I18n.locale]}</label>
-              <div class=\"controls\">
-                #{show_on_front(k,v)}
-              </div>
-            </div>"
-        end.join.html_safe %>
-    <% if ask_setting.default_setting['recaptcha'] %>
-      <div class="control-group">
-         <%= f.label :recaptcha,@default_ask_setting.field_name("recaptcha"), class: 'control-label' %>
-        <div class="controls">
-          <%= gotcha_error %>
-          <%= gotcha %>
-        </div>
-      </div>
-    <% end %>
-    <% if !ask_setting.usage_rule.blank? %>
-      <div class="control-group">
-         <%= label_tag :usage_rule,t('ask.usage_rule'), class: 'control-label' %>
-        <div class="controls">
-          <%= ask_setting.usage_rule.html_safe %>
-        </div>
-      </div>
-    <% end %>
-    <% if ask_setting.default_setting['agree_usage'] %>
-      <div class="control-group">
-         <%= f.label :agree_usage,@default_ask_setting.field_name("agree_usage"), class: 'control-label' %>
-        <div class="controls">
-          <%= f.check_box :agree_usage %>
-        </div>
-      </div>
-    <% end %>
-    <% if ask_setting.default_setting['agree_show'] %>
-      <div class="control-group">
-         <%= f.label :agree_show,@default_ask_setting.field_name("agree_show"), class: 'control-label' %>
-        <div class="controls">
-          <%= f.check_box :agree_show %>
-        </div>
-      </div>
-    <% end %>
-    <div class="form-actions">
-    	<input type="hidden" name="referer_url" value="<%= request.fullpath %>">
-      <%= f.submit t('submit'), class: 'btn btn-primary', :id => 'button-mail' %>
-      <%= f.button t('cancel'), type: 'reset', class: 'btn' %>
-    </div>
-  <% end %>
-  <%= @switch_form.html_safe %>
+  <% 
+    tmp_gotcha_error = gotcha_error
+    tmp_gotcha = gotcha
+  %>
+  <%= @switch_form.gsub("{{gotcha_error}}",tmp_gotcha_error).gsub("{{gotcha}}",tmp_gotcha).html_safe %>
 </div>
 
 <script type='text/javascript'>
diff --git a/ask.gemspec b/ask.gemspec
index dfef73c..826e229 100644
--- a/ask.gemspec
+++ b/ask.gemspec
@@ -2,16 +2,19 @@ $:.push File.expand_path("../lib", __FILE__)
 
 # Maintain your gem's version:
 require "ask/version"
-app_path = File.expand_path(__dir__)
-template_path = ENV['PWD'] + '/app/templates'
-all_template = Dir.glob(template_path+'/*/')
-puts 'copying ask module'
-all_template.each do |folder|
-    if folder.split('/')[-1] != 'mobile'
-        begin 
-            system ('cp -r '+ app_path + '/modules/ ' + folder)
-        rescue 
-            puts 'error copy'
+bundle_update_flag = ARGV[0]=='update' || ARGV[0]=='install'
+if bundle_update_flag
+    app_path = File.expand_path(__dir__)
+    template_path = ENV['PWD'] + '/app/templates'
+    all_template = Dir.glob(template_path+'/*/')
+    puts 'copying ask module'
+    all_template.each do |folder|
+        if folder.split('/')[-1] != 'mobile'
+            begin 
+                system ('cp -r '+ app_path + '/modules/ ' + folder)
+            rescue 
+                puts 'error copy'
+            end
         end
     end
 end
diff --git a/config/locales/en.yml b/config/locales/en.yml
index b7bf648..151c354 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2,6 +2,10 @@ en:
   situation: Situation
   sex: Sex
   ask:
+    please_save: Please click "Save Order" button when you done.
+    save_order: Save Order
+    order_fields: Order Fields
+    sort_number: Sort Number(ascending)
     field_name: Field Name
     more_title: See more ask history
     save_name: Save FileName
@@ -77,6 +81,7 @@ en:
   mongoid:
     attributes:
       ask_question:
+        usage_rule: Usage rule
         agree_usage: Agree related usage rule
         ask_category_id: Ask Category
         recaptcha: Recaptcha
diff --git a/config/locales/zh_tw.yml b/config/locales/zh_tw.yml
index 2fb2a5d..aab12fc 100644
--- a/config/locales/zh_tw.yml
+++ b/config/locales/zh_tw.yml
@@ -6,6 +6,10 @@ zh_tw:
     errors:
       verification_failed: 驗證碼錯誤
   ask:
+    please_save: 調整完後, 請點選"儲存順序"
+    save_order: 儲存順序
+    order_fields: 排序欄位
+    sort_number: 排序數(升序)
     field_show_name: 欄位名稱
     more_title: 查看更多發問紀錄
     save_name: 檔案儲存名稱
@@ -87,6 +91,7 @@ zh_tw:
   mongoid:
     attributes:
       ask_question:
+        usage_rule: 使用規範
         agree_usage: 同意相關使用規範
         ask_category_id: 諮詢類別
         recaptcha: 驗證碼
diff --git a/config/routes.rb b/config/routes.rb
index 7e226a3..80a3864 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -22,6 +22,8 @@ Rails.application.routes.draw do
 					post 'get_new_setting_index'
 					post 'get_new_category_setting_index'
 					post 'export', to: 'asks#do_export'
+					get 'order_fields'
+					post 'update_order_fields'
 				end
 			end
 			resources :ask_acknowledgements
diff --git a/lib/ask/engine.rb b/lib/ask/engine.rb
index d5cfcb3..9ba5505 100644
--- a/lib/ask/engine.rb
+++ b/lib/ask/engine.rb
@@ -105,6 +105,11 @@ module Ask
                                 :priority=>6,
                                 :active_for_action=>{'admin/asks'=>'exports'},
                                 :available_for => 'managers'
+          context_link 'ask.order_fields',
+                                :link_path=>"order_fields_admin_asks_path" ,
+                                :priority=>7,
+                                :active_for_action=>{'admin/asks'=>'order_fields'},
+                                :available_for => 'managers'
           context_link 'ask.setting',
                                 :link_path=>"setting_admin_asks_path" ,
                                 :priority=>7,