Minor restyle of order credit memo list ui

Sylius · Mar 11, 2020 · 9eff4e3 · 9eff4e3
1 parent d05447c
commit 9eff4e3
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 33 deletions.
diff --git a/README.md b/README.md
@@ -18,21 +18,21 @@
 
 ## Business value
 
-In contrast to basic Refund functionality delivered by core Sylius bundles, Refund Plugin offers much wider range of 
+In contrast to basic Refund functionality delivered by core Sylius bundles, Refund Plugin offers much wider range of
 possibilities and business scenarios.
 
 Once an Order is paid, an Administrator is able to access Refunds section of a given Order and perform a Refund
 of chosen items or shipments. What's more, if a more detailed scenario occurs, an Administrator is able to refund an item
 partially.
 
-From Administrator's point of view, every Refund request results in creating two entities: 
+From Administrator's point of view, every Refund request results in creating two entities:
 * Credit Memo - a document representing a list of refunded items (downloadable and sent to Customer via .pdf file)
 * Refund Payment - entity representing payment in favour of the Customer
 
 ## Pre - requirements
 
 In order to be able to generate PDF files of refunds, [wkhtmltopdf](https://wkhtmltopdf.org/) must be installed.
-It is used by `KnpSnappyBundle` and can be configured according to [their docummentation](https://github.com/KnpLabs/KnpSnappyBundle#configuration). 
+It is used by `KnpSnappyBundle` and can be configured according to [their docummentation](https://github.com/KnpLabs/KnpSnappyBundle#configuration).
 
 ## Installation
 
@@ -41,7 +41,7 @@ It is used by `KnpSnappyBundle` and can be configured according to [their documm
     ```bash
     composer require sylius/refund-plugin
     ```
-    
+
     > Remember to allow community recipes with `composer config extra.symfony.allow-contrib true` or during plugin installation process
 
 2. Copy plugin migrations to your migrations directory (e.g. `src/Migrations`) and apply them to your database:
@@ -108,12 +108,12 @@ as shown below:
                 <parameter>stripe</parameter>
             </parameter>
         </parameters>
-   ``` 
+   ```
 
 Online refund logic should be implemented if you need it.
 As the first try for the possible customization, you can check out `Sylius\RefundPlugin\Event\UnitsRefunded` event.
- 
+
 ## Security issues
 
-If you think that you have found a security issue, please do not use the issue tracker and do not post it publicly. 
+If you think that you have found a security issue, please do not use the issue tracker and do not post it publicly.
 Instead, all security issues must be sent to `[email protected]`.
diff --git a/src/Resources/views/Download/creditMemo.html.twig b/src/Resources/views/Download/creditMemo.html.twig
@@ -1,7 +1,7 @@
 {% set to = creditMemo.to %}
 {% set from = creditMemo.from %}
 
-<html lang="en">
+<html lang="{{ creditMemo.localeCode }}">
 <head>
     <meta charset="utf-8">
     <style>
@@ -31,7 +31,6 @@
                         <td colspan="2" class="title">
                             <img src="https://demo.sylius.com/assets/shop/img/logo.png" style="width:300px;">
                         </td>
-
                         <td>
                             {{ 'sylius_refund.ui.issued_at'|trans }}: {{ creditMemo.issuedAt|date('Y-m-d H:i:s') }}<br>
                         </td>

diff --git a/src/Resources/views/Order/Admin/CreditMemo/_header.html.twig b/src/Resources/views/Order/Admin/CreditMemo/_header.html.twig
@@ -7,9 +7,12 @@
                 <div class="item">
                     {{ 'sylius_refund.ui.issued_for_order'|trans }}: #{{ credit_memo.order.number }}
                 </div>
+                <div class="item">
+                    {{ 'sylius_refund.ui.issued_at'|trans }}: {{ credit_memo.issuedAt|date('d-m-Y') }}
+                </div>
                 <div class="item">
                     {{ 'sylius_refund.ui.issued_from'|trans }}
-                    <span class="ui large empty horizontal circular label" style="background-color: {{ credit_memo.channel.color }}"></span> <strong id="credit-memo-channel-name">{{ credit_memo.channel.name }}</strong>
+                    {% include '@SyliusAdmin/Common/_channel.html.twig' with {'channel': credit_memo.channel} %}
                 </div>
             </div>
         </div>

diff --git a/src/Resources/views/Order/Admin/CreditMemo/details.html.twig b/src/Resources/views/Order/Admin/CreditMemo/details.html.twig
@@ -1,7 +1,5 @@
 {% extends '@SyliusAdmin/layout.html.twig' %}
 
-{% import '@SyliusAdmin/Common/Macro/money.html.twig' as money %}
-
 {% import '@SyliusUi/Macro/buttons.html.twig' as buttons %}
 
 {% block title %}{{ 'sylius_refund.ui.credit_memo'|trans ~ ' ' ~ credit_memo.number }} {{ parent() }}{% endblock %}
@@ -18,7 +16,7 @@
                 'sylius_refund.ui.download',
                 null,
                 'download',
-                'purple'
+                'blue'
             ) }}
         </div>
     </div>

diff --git a/src/Resources/views/Order/Admin/CreditMemo/list.html.twig b/src/Resources/views/Order/Admin/CreditMemo/list.html.twig
@@ -1,5 +1,5 @@
-{% import "@SyliusAdmin/Common/Macro/money.html.twig" as money %}
-{% import "@SyliusUi/Macro/buttons.html.twig" as buttons %}
+{% import '@SyliusAdmin/Common/Macro/money.html.twig' as money %}
+{% import '@SyliusUi/Macro/buttons.html.twig' as buttons %}
 
 {% if credit_memos|length > 0 %}
 <div class="ui segment" id="credit-memos">
@@ -18,24 +18,25 @@
         {% for credit_memo in credit_memos %}
             <tr>
                 <td>{{ credit_memo.number }}</td>
-                <td><span class="ui large empty horizontal circular label" style="background-color: {{ credit_memo.channel.color }}"></span>{{ credit_memo.channel.name }}</td>
+                <td>{% include '@SyliusAdmin/Common/_channel.html.twig' with {'channel': credit_memo.channel} %}</td>
                 <td>{{ money.format(credit_memo.total, credit_memo.currencyCode) }}</td>
                 <td>{{ credit_memo.issuedAt|date('d-m-Y') }}</td>
                 <td>
-                    {{ buttons.default(
-                        path('sylius_refund_credit_memo_details', {'orderNumber': credit_memo.order.number, 'id': credit_memo.id}),
-                        'sylius.ui.show',
-                        null,
-                        'eye',
-                        'green'
-                    ) }}
-                    {{ buttons.default(
-                        path('sylius_refund_admin_credit_memo_download', {'id': credit_memo.id}),
-                        'sylius_refund.ui.download',
-                        null,
-                        'download',
-                        'purple'
-                    ) }}
+                    <div class="ui buttons">
+                        {{ buttons.default(
+                            path('sylius_refund_credit_memo_details', {'orderNumber': credit_memo.order.number, 'id': credit_memo.id}),
+                            'sylius.ui.details',
+                            null,
+                            'eye'
+                        ) }}
+                        {{ buttons.default(
+                            path('sylius_refund_admin_credit_memo_download', {'id': credit_memo.id}),
+                            'sylius_refund.ui.download',
+                            null,
+                            'download',
+                            'blue'
+                        ) }}
+                    </div>
                 </td>
             </tr>
         {% endfor %}

diff --git a/src/Resources/views/Order/Shop/_creditMemos.html.twig b/src/Resources/views/Order/Shop/_creditMemos.html.twig
@@ -1,4 +1,4 @@
-{% import "@SyliusAdmin/Common/Macro/money.html.twig" as money %}
+{% import '@SyliusAdmin/Common/Macro/money.html.twig' as money %}
 {% import '@SyliusUi/Macro/buttons.html.twig' as buttons %}
 
 {% if credit_memos|length > 0 %}

diff --git a/src/Resources/views/_header.html.twig b/src/Resources/views/_header.html.twig
@@ -22,7 +22,7 @@
                         </div>
                         <div class="item">
                             {{ 'sylius.ui.purchased_from'|trans }}
-                            <span class="ui large empty horizontal circular label" style="background-color: {{ order.channel.color }}"></span> <strong>{{ order.channel }}</strong>
+                            {% include '@SyliusAdmin/Common/_channel.html.twig' with {'channel': order.channel} %}
                         </div>
                     </div>
                 </div>

diff --git a/tests/Behat/Page/Admin/CreditMemoDetailsPage.php b/tests/Behat/Page/Admin/CreditMemoDetailsPage.php
@@ -96,7 +96,9 @@ public function getNumber(): string
 
     public function getChannelName(): string
     {
-        return $this->getDocument()->find('css', '#credit-memo-channel-name')->getText();
+        $items = $this->getDocument()->findAll('css', '.channel > .channel__item');
+
+        return $items[1]->getText();
     }
 
     public function getTotal(): string