รายงาน PDF¶

With Studio, you can edit existing PDF reports (e.g., invoices, quotations, etc.) or create new ones.

เค้าโครงเริ่มต้น¶

The default layout of reports is managed outside Studio. Go to Settings, then, in the Companies section, click Configure Document Layout. Layout settings are company-specific but apply to all reports.

Tip

You can see how the different settings affect the report layout in the report preview on the right, or download a sample invoice PDF by clicking Download PDF Preview.

ใช้การตั้งค่าต่อไปนี้:

Layout: Four layouts are available:

Font: Seven fonts are available: Lato, Roboto, Open Sans, Montserrat, Oswald, Raleway, and Tajawal (which supports Arabic and Latin scripts). Go to the Google Fonts website to preview them.

โลโก้บริษัท: คลิกปุ่ม:guilabel:แก้ไข`เพื่ออัปโหลดหรือเปลี่ยนโลโก้ การดำเนินการนี้จะเพิ่มโลโก้ลงในระเบียนของบริษัทในโมเดล *บริษัท* ซึ่งคุณสามารถเข้าถึงได้โดยไปที่:menuselection:`การตั้งค่า`จากนั้นคลิก:guilabel:`อัปเดตข้อมูล`ในส่วน:guilabel:`บริษัท

สี: เปลี่ยนสีหลักและสีรองที่ใช้ในการจัดโครงสร้างรายงาน สีเริ่มต้นถูกสร้างขึ้นโดยอัตโนมัติตามสีของโลโก้

Layout background: The following backgrounds are available:
- Blank: nothing is displayed.
- Geometric: an image featuring geometric shapes is displayed in the background.
- Custom: upload a custom background image.

Company tagline: This is displayed in the header of external reports. You can add multiple lines of text.

Company details: These are displayed in the header of external reports. You can add multiple lines of text.

Paper format: to define the default paper size of reports. You can select A4 (21 cm x 29.7 cm), US Letter (21.59 cm x 27.54 cm), or QR codes page. This can also be defined for individual reports in the Paper format field in Studio.

สร้างรายงาน PDF ใหม่¶

To create a new report for a model, access the model, click the Toggle Studio button, then click Reports. Click New and, in the popup window that opens, select the type of report. This is solely used to determine what is displayed in the header and footer:

ภายนอก:
- The header displays the company's logo, tagline, and details.
- The footer displays the values set in the Footer field and the page number.
Internal: The header displays the user's current date and time, Company Name, and page number. There is no footer.
ว่างเปล่า: ไม่มีทั้งส่วนหัวและส่วนท้าย คลิกที่มุมซ้ายบนของหน้าเพื่อแก้ไขรายงาน

เมื่อคุณสร้างรายงานแล้ว คุณสามารถเริ่ม:ref:แก้ไขได้ <studio/pdf-reports/edit>

แก้ไขรายงาน PDF¶

To access the reports available for a model, access the model (e.g., sales orders), click the Toggle Studio button, then click Reports. Select an existing report to open it or create a new one.

Tip

หรือคุณสามารถเปิดสตูดิโอ คลิก:guilabel:รายงาน และค้นหารายงานหรือโมเดลที่ต้องการ

Important

It is strongly recommended to duplicate the standard report and perform changes in the duplicated version. To duplicate a report, hover the mouse pointer on the top right corner of the report, click the vertical ellipsis icon (⋮), and then select Duplicate.

ตัวเลือก¶

Once you've selected or created a report, you can use the options in the left part of the screen to:

Change the Report name. The new name is applied everywhere (in Studio, under the Print button, and in the PDF file name).
Modify the Paper format. If no value is selected, the format defined in the default layout is used.
Show in print menu: to add the report in the Print menu available from the record.
โหลดซ้ำจากไฟล์แนบ: เพื่อบันทึกรายงานเป็นไฟล์แนบในระเบียนครั้งแรกที่สร้าง และโหลดเวอร์ชันต้นฉบับของรายงานในครั้งถัดไป ซึ่งกฎหมายกำหนดให้ต้องทำสำหรับใบแจ้งหนี้และส่วนใหญ่ใช้ในกรณีนี้
จำกัดการมองเห็นให้กับกลุ่ม: เพื่อจำกัดความพร้อมใช้งานของรายงาน PDF ให้กับ:doc:`กลุ่มผู้ใช้ <../general/users/access_rights>`เฉพาะ
แก้ไขซอร์ส: เพื่อแก้ไขรายงานโดยตรงใน:ref:ไฟล์ XML <studio/pdf-reports/XML-editing>
รีเซ็ตรายงาน: เพื่อยกเลิกการเปลี่ยนแปลงทั้งหมดที่ทำกับรายงานและรีเซ็ตกลับเป็นเวอร์ชันมาตรฐาน
แสดงตัวอย่างก่อนพิมพ์: เพื่อสร้างและดาวน์โหลดตัวอย่างรายงาน

ตัวแก้ไขรายงาน¶

The report editor allows you to modify the formatting and contents of the report.

Tip

You can Undo or Redo changes using the related buttons or the shortcuts CTRL Z and CTRL Y.
การเปลี่ยนแปลงจะถูกบันทึกโดยอัตโนมัติเมื่อคุณออกจากรายงานหรือบันทึกด้วยตนเองโดยใช้ปุ่ม:guilabel:บันทึก
คุณสามารถรีเซ็ตรายงานกลับเป็นเวอร์ชันมาตรฐานได้โดยคลิกปุ่ม:guilabel:`รีเซ็ตรายงาน`ในส่วนซ้ายของหน้าจอ

Important

การแก้ไขส่วนหัวและส่วนท้ายของรายงานจะส่งผลต่อรายงานมาตรฐานและรายงานที่กำหนดเองทั้งหมด

บลอกแบบมีเงื่อนไข¶

สี่เหลี่ยมเส้นประจะแสดงถึง**บลอกแบบมีเงื่อนไข** (คำสั่ง if/else) ใช้เพื่อแสดง/ซ่อนเนื้อหาตามเงื่อนไขเฉพาะ คลิกที่บลอกเพื่อดูเงื่อนไข

เลือกค่าเพื่อแสดงตัวอย่างผลลัพธ์ที่สอดคล้องกันและแก้ไขหากจำเป็น

Note

Conditions can only be edited in XML.

เนื้อหาอื่นๆ¶

มีข้อความเนื้อหาในรายงานสองประเภท:

Static text, i.e., the text that's not highlighted in blue, which can be modified directly in the editor.
Dynamic text, i.e., the text that's highlighted in blue, which is replaced by field values when the report is generated, e.g., the SO number or the quotation date.

You can add content (e.g., fields, lists, tables, images, banners, etc.) to the report using commands. Type / to open the powerbox, then type the command's name or select it from the list.

หากต้องการเพิ่มข้อความคงที่ลงในรายงาน ให้พิมพ์ข้อความในตำแหน่งที่ต้องการ

สำหรับการเปลี่ยนแปลงขั้นสูงเพิ่มเติม คุณสามารถ:ref:แก้ไขรายงานใน XML โดยตรง <studio/pdf-reports/XML-editing>

เพิ่มฟิลด์¶

To add a field, type / and select the Field command. In the list that opens, select or search for the field; click the right arrow next to the field name to access the list of related fields if needed. Then, specify the default value and press Enter.

Add a data table¶

Data tables are used to display relational fields. To add a data table, type /, select the Dynamic Table command, and select the relation to be displayed in the table.

Note

Only relations of type one2many or many2many can be displayed as data tables.

Once the table has been added, you can add columns using the table tools. Position the cursor on top of the column, then click the purple rectangle and select an option.

You can then insert the field of your choice in the columns. The dialog box that opens shows the source object for the field (e.g., the Tag model) and the list of available fields.

List of available fields for the Tag model.

Note

The default row automatically iterates over the field's content, generating a row on the report for each field value (e.g., one row per tag). You can add static content rows above or below the generated rows using the table tools.
You can also add data tables by modifying the report's XML.

การจัดรูปแบบ¶

To format text in the report, select it, then format it using the options in the Text editor.

การแก้ไข XML ของรายงาน¶

Warning

การแก้ไข XML โดยตรงอาจทำให้เกิดปัญหาในรายงานระหว่าง การอัปเกรด หากเกิดเหตุการณ์นี้ เพียงคัดลอกการเปลี่ยนแปลงของคุณจากฐานข้อมูลเดิมไปยังฐานข้อมูลที่อัปเกรดแล้ว

เพื่อแก้ไข XML ของรายงาน ให้คลิก Edit sources ในบานหน้าต่างด้านซ้าย

ตัวอย่าง¶

Modify a non-compliant table

Sometimes, tables are not properly recognized as such due to complex structures. In those cases, you can still modify them manually in the report XML. For example, with a sales order, you can find the following structure in the XML (simplified for documentation purposes):

<!-- table root element -->
<table>
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>Name</th>
            <th>Price</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="record.some_relation_ids" t-as="line">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="line.name"/>
            <td t-out="line.price"/>
        </tr>
    </tbody>
</table>

หากต้องการปรับเปลี่ยนตาราง คุณต้องแน่ใจว่าแต่ละแถวมีจำนวนเซลล์ข้อมูลเท่ากัน ตัวอย่างเช่น ในกรณีข้างต้น คุณต้องเพิ่มเซลล์ในส่วนหัว (เช่น ชื่อคอลัมน์) และอีกเซลล์หนึ่งในส่วนเนื้อหาที่มีเนื้อหาฟิลด์ (โดยปกติแล้วจะใช้ไดเรกทิฟ t-out หรือ t-field)

<table> <!-- table root element -->
    <thead> <!-- thead = table header, the row with column titles -->
        <tr> <!-- table row element -->
            <th>Name</th> <!-- table header element -->
            <th>Price</th>
            <th>Category</th>
        </tr>
    </thead>
    <tbody>  <!-- table body, the main content -->
        <tr t-foreach="record.some_relation_ids" t-as="line">  <!-- we create a row for each subrecord with t-foreach -->
            <td t-out="line.name"/>  <!-- for each line, we output the name and price as table cells -->
            <td t-out="line.price"/>
            <td t-out="line.category_id.display_name"/>
        </tr>
    </tbody>
</table>

Note

Cells can span multiple rows or columns. For more information, go to the Mozilla Developer Network website.

For example, you can modify the Quotation/Order report to add a column to display the product category in the main table:

<table class="table table-sm o_main_table table-borderless mt-4">
    <!-- In case we want to repeat the header, remove "display: table-row-group" -->
    <thead style="display: table-row-group">
        <tr>
            <th name="th_description" class="text-start">Description</th>
            <th>Product Category</th>
            <th name="th_quantity" class="text-end">Quantity</th>
            <th name="th_priceunit" class="text-end">Unit Price</th>
[...]
            <tr t-att-class="'bg-200 fw-bold o_line_section' if line.display_type == 'line_section' else 'fst-italic o_line_note' if line.display_type == 'line_note' else ''">
                <t t-if="not line.display_type">
                    <td name="td_name"><span t-field="line.name">Bacon Burger</span></td>
                    <td t-out="line.product_id.categ_id.display_name"/>
                    <td name="td_quantity" class="text-end">
                        <span t-field="line.product_uom_qty">3</span>
                        <span t-field="line.product_uom">units</span>
                        <span t-if="line.product_packaging_id">

Add a data table

To add a table in XML, you need to know the names of the fields and objects you wish to access and display. As an example, let's add a table that details the tags on a sales order:

<!-- table root element -->
<table class="table">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>

Note

When adding tables manually, style them using Bootstrap classes, like the table class included in the example above.

Conditional blocks

หากคุณต้องการแสดง/ซ่อนเนื้อหาตามเงื่อนไขเฉพาะ คุณสามารถเพิ่มคำสั่งควบคุม if/else ใน XML รายงานด้วยตนเอง

ตัวอย่างเช่น หากคุณต้องการซ่อนตารางข้อมูลที่กำหนดเองหากไม่มีแท็ก คุณสามารถใช้แอตทริบิวต์ t-if เพื่อกำหนดเงื่อนไข ซึ่งจะถูกประเมินเป็น True หรือ False ตารางจะไม่แสดงหากไม่มีแท็กในใบเสนอราคา

<!-- table root element -->
<table class="table" t-if="len(doc.tag_ids) > 0">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>

หากคุณต้องการแสดงบล็อกอื่นในกรณีที่คำสั่ง t-if ถูกประเมินว่าเป็น 'False' คุณสามารถระบุได้โดยใช้คำสั่ง 't-else` บล็อก 't-else' ต้องอยู่หลังบล็อก 't-if' โดยตรงในโครงสร้างเอกสาร ไม่จำเป็นต้องระบุเงื่อนไขใดๆ ในแอตทริบิวต์ "t-else" เป็นตัวอย่าง เรามาแสดงข้อความสั้นๆ ที่อธิบายว่าไม่มีแท็กในใบเสนอราคา:

<!-- table root element -->
<table class="table" t-if="len(doc.tag_ids) > 0">
    <!-- thead = table header, the row with column titles -->
    <thead>
        <!-- table row element -->
        <tr>
            <!-- table header element -->
            <th>ID</th>
            <th>Name</th>
        </tr>
    </thead>
    <!-- table body, the main content -->
    <tbody>
        <!-- we create a row for each subrecord with t-foreach -->
        <tr t-foreach="doc.tag_ids" t-as="tag">
            <!-- for each line, we output the name and price as table cells -->
            <td t-out="tag.id"/>
            <td t-out="tag.name"/>
        </tr>
    </tbody>
</table>
<div class="text-muted" t-else="">No tag present on this document.</div>

โดยใช้สัญกรณ์ t-if/t-else ตัวแก้ไขรายงานจะรู้ว่าส่วนเหล่านี้แยกออกจากกันและควรแสดงเป็นบลอกเงื่อนไข:

คุณสามารถสลับเงื่อนไขโดยใช้เครื่องมือแก้ไขเพื่อดูตัวอย่างผลลัพธ์:

หากคุณต้องการมีตัวเลือกหลายรายการ คุณสามารถใช้คำสั่ง t-elif เพื่อเพิ่มเงื่อนไขระหว่างกลางได้ ตัวอย่างเช่น นี่คือวิธีที่หัวเรื่องของรายงานคำสั่งขายเปลี่ยนแปลงตามเงื่อนไขของเอกสารพื้นฐาน

<h2 class="mt-4">
    <span t-if="env.context.get('proforma', False) or is_pro_forma">Pro-Forma Invoice # </span>
    <span t-elif="doc.state in ['draft','sent']">Quotation # </span>
    <span t-else="">Order # </span>
    <span t-field="doc.name">SO0000</span>
</h2>

หัวเรื่อง Pro-Forma Invoice จะถูกใช้ขึ้นอยู่กับเงื่อนไขตามบริบท หากเงื่อนไขเหล่านี้ไม่เป็นไปตามและสถานะของเอกสารเป็น draft หรือ sent จะใช้ Quotation แทน หากไม่มีเงื่อนไขใดเป็นไปตาม หัวเรื่องของรายงานจะเป็น Order

Images

การทำงานกับรูปภาพในรายงานอาจเป็นเรื่องท้าทาย เนื่องจากการควบคุมขนาดและลักษณะการทำงานของรูปภาพอย่างแม่นยำนั้นไม่ชัดเจนเสมอไป คุณสามารถแทรกฟิลด์รูปภาพโดยใช้ตัวแก้ไขรายงาน (โดยใช้คำสั่ง /Field) แต่การแทรกฟิลด์เหล่านี้ลงใน XML โดยใช้คำสั่ง t-field และแอตทริบิวต์ t-options ที่มาพร้อมกันนั้นจะช่วยให้ควบคุมขนาดและตำแหน่งได้ดีขึ้น

ตัวอย่างเช่น โค้ดต่อไปนี้จะแสดงฟิลด์ image_128 ของสินค้าของรายการเป็นรูปภาพกว้าง 64px (โดยมีความสูงอัตโนมัติตามอัตราส่วนภาพ)

<span t-field="line.product_id.image_128" t-options-widget="image" t-options-width="64px"/>

ตัวเลือกต่อไปนี้พร้อมใช้งานสำหรับวิดเจ็ตรูปภาพ:

width: ความกว้างของรูปภาพ โดยปกติเป็นพิกเซลหรือหน่วยความยาว CSS (เช่น rem) (เว้นว่างไว้สำหรับความกว้างอัตโนมัติ)
height: ความสูงของรูปภาพ โดยปกติเป็นพิกเซลหรือหน่วยความยาว CSS (เช่น rem) (เว้นว่างไว้สำหรับความสูงอัตโนมัติ)
class: คลาส CSS ที่ใช้กับแท็ก img สามารถใช้ Bootstrap classes ได้
alt: ข้อความทางเลือกของรูปภาพ
style: แอตทริบิวต์สไตล์ ช่วยให้คุณสามารถแทนที่สไตล์ได้อย่างอิสระมากกว่าการใช้ Bootstrap classes

แอตทริบิวต์เหล่านี้ต้องมีสตริง คือข้อความที่อยู่ในเครื่องหมายคำพูดภายในเครื่องหมายคำพูด เช่น t-options-width="'64px'" (หรือทางเลือกอื่น นิพจน์ Python ที่ถูกต้อง)

Note

วิดเจ็ตรูปภาพไม่สามารถใช้กับแท็ก img ได้ ให้ตั้งค่าคำสั่ง t-field บนโหนด span (สำหรับเนื้อหาแบบอินไลน์) หรือ div (สำหรับเนื้อหาแบบบลอก) แทน

ตัวอย่างเช่น ให้เพิ่มคอลัมน์พร้อมรูปภาพสินค้าในตารางใบเสนอราคา:

<table class="table table-sm o_main_table table-borderless mt-4">
    <thead style="display: table-row-group">
        <tr>
            <th>Image</th>
            <th name="th_description" class="text-start">Description</th>
            <th>Product Category</th>
            <th name="th_quantity" class="text-end">Quantity</th>
            <th name="th_priceunit" class="text-end">Unit Price</th>
[...]
        <t t-foreach="lines_to_report" t-as="line">
            <t t-set="current_subtotal" t-value="current_subtotal + line.price_subtotal"/>
            <tr t-att-class="'bg-200 fw-bold o_line_section' if line.display_type == 'line_section' else 'fst-italic o_line_note' if line.display_type == 'line_note' else ''">
                <t t-if="not line.display_type">
                   <td>
                       <span t-field="line.product_template_id.image_128"
                             t-options-widget="'image'"
                             t-options-width="'64px'"
                             t-options-class="'rounded-3 shadow img-thumbnail'"
                           />
                   </td>
                    <td name="td_name"><span t-field="line.name">Bacon Burger</span></td>
                    <td t-out="line.product_id.categ_id.display_name"/>

แอตทริบิวต์ t-options-width จำกัดความกว้างของรูปภาพเป็น 64 พิกเซล และคลาส Bootstrap ที่ใช้ใน t-options-class จะสร้างเส้นขอบแบบภาพขนาดย่อพร้อมมุมมนและเงา

เพิ่มคอลัมน์พร้อมรูปภาพสินค้าในตารางใบเสนอราคา

แก้ไขบน GitHub