0

这链接到我之前的问题,该问题是关于使用 css 设置表格的样式。我现在没有添加并意识到这是一个错误,当将页面呈现为 html 时,使用了一些 jquery。

wicked_pdf / wkhtml - 支持使用 tr.odd 和 tr.even 更改背景颜色的 css 表

用于此的 jquery 如下:

$(document).ready(function(){
  $('tbody tr:even').addClass('stripe');
  $('tbody tr').hover(function(){
    $(this).addClass('stripeHover');
  }, function(){
    $(this).removeClass('stripeHover');
  });
});

我假设当我们渲染一个 PDF 文件时,悬停是多余的,所以这可以简化为:

$(document).ready(function(){
  $('tbody tr:even').addClass('stripe');
});

这是我正在使用的 wicked_pdf_helper.rb 文件。使用资产管道,我不确定我是要在公共场合还是在 app/assets/javascripts 中创建我的文件。根据我有限的理解并在这里回答我的问题+审查对 gem 的更改,Rails 2 -> 3 -> 3.1 -> 3.2 的更改似乎都影响了这一点。

这是我使用的最新帮助文件文件:

module WickedPdfHelper
  def wicked_pdf_stylesheet_link_tag(*sources)
    css_dir = Rails.root.join('public','stylesheets')
    sources.collect { |source|
      "<style type='text/css'>#{File.read(css_dir.join(source+'.css'))}</style>"
}.join("\n").html_safe
  end

  def pdf_image_tag(img, options={})
    image_tag "file:///#{Rails.root.join('public', 'images', img)}", options
  end

  def wicked_pdf_javascript_src_tag(jsfile, options={})
    #javascript_src_tag "file:///#{Rails.root.join('public','javascripts',jsfile)}", options
  end

  def wicked_pdf_javascript_include_tag(*sources)
    sources.collect{ |source| wicked_pdf_javascript_src_tag(source, {}) }.join("\n").html_safe
  end

  module Assets
    def wicked_pdf_stylesheet_link_tag(*sources)
      sources.collect { |source|
        "<style type='text/css'>#{read_asset(source+".css")}</style>"
  }.join("\n").html_safe
    end

    def wicked_pdf_image_tag(img, options={})
      image_tag "file://#{asset_pathname(img).to_s}", options
    end

    def wicked_pdf_javascript_src_tag(jsfile, options={})
      javascript_include_tag "file://#{asset_pathname(jsfile).to_s}", options
    end

    def wicked_pdf_javascript_include_tag(*sources)
      sources.collect { |source|
        "<script type='text/javascript'>#{read_asset(source+".js")}</script>"
  }.join("\n").html_safe
    end

    private

    def asset_pathname(source)
      if Rails.configuration.assets.compile == false
        File.join(Rails.public_path, asset_path(source))
      else
        Rails.application.assets.find_asset(source).pathname
      end
    end

    def read_asset(source)
      if Rails.configuration.assets.compile == false
        IO.read(asset_pathname(source))
      else
        Rails.application.assets.find_asset(source).to_s
      end
    end
  end
end

该文件的先前版本是:

module WickedPdfHelper
  def wicked_pdf_stylesheet_link_tag(*sources)
    options = sources.extract_options!
    if request.try(:format).to_s == 'application/pdf'
      #css_dir = Rails.root.join('public','stylesheets')
      css_dir = Rails.root.join('app','assets', 'stylesheets')
      refer_only = options.delete(:refer_only)
      sources.collect { |source|
        source.sub!(/\.css$/o,'')
        if refer_only
          stylesheet_link_tag "file://#{Rails.root.join('public','stylesheets',source+'.css')}", options
        else
          "<style type='text/css'>#{File.read(css_dir.join(source+'.css'))}</style>"
        end
      }.join("\n").html_safe
    else
      sources.collect { |source|
        stylesheet_link_tag(source, options)
      }.join("\n").html_safe
    end
  end

  # def wicked_pdf_stylesheet_link_tag(*sources)
  #   sources.collect { |source|
  #     "<style type='text/css'>#{Rails.application.assets.find_asset("#{source}.css")}</style>"
  #   }.join("\n").gsub(/url\(['"](.+)['"]\)(.+)/,%[url("#{wicked_pdf_image_location("\\1")}")\\2]).html_safe
  # end

  def pdf_image_tag(img, options={})
    if request.try(:format).to_s == 'application/pdf'
      image_tag "file://#{Rails.root.join('app', 'assets', 'images', img)}", options rescue nil
    else
      image_tag img.to_s, options rescue nil
    end
  end

  def wicked_pdf_javascript_src_tag(jsfile, options={})
    if request.try(:format).to_s == 'application/pdf'
      jsfile.sub!(/\.js$/o,'')
      javascript_src_tag "file://#{Rails.root.join('public','javascripts',jsfile + '.js')}", options
    else
      javascript_src_tag jsfile, options
    end
  end

  def wicked_pdf_javascript_include_tag(*sources)
    options = sources.extract_options!
    sources.collect{ |source| wicked_pdf_javascript_src_tag(source, options) }.join("\n").html_safe
  end
end

模板(genie_help_base.pdf.erb)文件如下:

<!DOCTYPE html>
<html>
  <head>
    <title><%= full_title(yield(:title)) %></title>
    <%#= wicked_pdf_stylesheet_link_tag    "application", :refer_only => true %>
    <%#= wicked_pdf_stylesheet_link_tag "application", :refer_only => true %>
    <%= wicked_pdf_stylesheet_link_tag "static_pages/genie_v23_help" %>    
    <%= javascript_include_tag "application" %>
    <%= csrf_meta_tags %>
<!--     <%#= render 'layouts/shim' %>  -->   
  </head>
  <body>
    <div class="container">
      <%= yield %>
      <%= debug(params) if Rails.env.development? %>
    </div>
  </body>
</html>

html (genie_v23_help_base.html.erb) 的布局模板是:

<!DOCTYPE html>
<html>
  <head>
    <title><%= full_title(yield(:title)) %></title>
    <%= stylesheet_link_tag    "application", media: "all" %>
    <%= javascript_include_tag "application" %>
    <%= csrf_meta_tags %>
    <%= render 'layouts/shim' %>    
  </head>
  <body>
    <%= render 'layouts/header' %>
    <div class="container">
      <%= render 'static_pages/genie_v23_help/shared/help_header.html.erb' %>       
      <%= yield %>
      <%= render 'static_pages/genie_v23_help/shared/help_footer' %>
      <h4><strong>Did this show up in only the html on screen</strong></h4>
      <%= render 'layouts/footer' %>
      <%= debug(params) if Rails.env.development? %>
    </div>
  </body>
</html>

这是css文件

table {
  width: 90%;
  border: 1px solid #999999;
}

th, td {
  padding: 7px 10px 10px 10px;
}

th {
  border-bottom: 2px solid #111111;
  border-top: 1px solid #999999;
  font-size: 90%;
  letter-spacing: 0.1em;
  text-align: left;
  text-transform: uppercase;    
}

/*tr.even {
    background-color: #efefef;
}*/


.stripe { 
  background-color: #dddddd;
  /*color: #666666;*/
}

tr.stripeHover {
  background-color: #FFFACD;
}

tbody tr:hover {
    background-color: #FFFACD;
}

最后是我的控制器中的 show 方法,所有这些都是从以下位置调用的:

  def static_page
    respond_to do |format|
    format.html do
        render :template => show_page,
               :layout => 'genie_v23_help_base'
    end
    format.pdf do
        render :pdf => show_page,
               :layout => 'genie_v23_help_base.pdf.erb',
               :template => "#{show_page}.html.erb",
               :handlers => :erb,
               :disable_external_links => true,
               :disable_javascript => false,
               :show_as_html => params[:debug],
               :print_media_type => true
      end
    end
  end

所以我目前无法让 jquery 条带化功能工作。

我想让这个工作,如果成功,很可能会构建一个示例类型的应用程序放在 GitHub 上,因为似乎没有使用样式表和 jquery 的 Rails 3.2.3 的最新版本来证明这一点.

我是否需要在某处的文件中使用包含语句?如果是这样,“应用程序”在哪里?

随着助手的更新(tobiashm 18 天前,如果需要,使用预编译的资产)如何指定它是“常规”方法还是资产模块中的方法?如果我不注释以下内容,我会收到错误消息。

def wicked_pdf_javascript_src_tag(jsfile, options={})
  #javascript_src_tag "file:///#{Rails.root.join('public','javascripts',jsfile)}", options
end

将 javascript_src_tag 更改为 javascript_include_tag 以符合 Rails 3.2+

def wicked_pdf_javascript_src_tag(jsfile, options={})
  javascript_include_tag "file:///#{Rails.root.join('public','javascripts',jsfile)}", options
end

有没有人有一个托管的示例应用程序/应用程序来演示所有这些?

摘要 - 尝试使用 jquery 在 html 呈现的文件中设置类名以在 PDF 中获取 css 斑马条纹,因此可以应用 css 样式。

在此先感谢,马克

4

1 回答 1

0

您的 pdf 布局仅使用常规

<%= javascript_include_tag "application" %>

当你应该使用

<%= wicked_pdf_javascript_include_tag "application" %>
于 2012-06-18T16:00:27.440 回答