Merge pull request '4363-refactor(item_waste): refactor table and add totals in table_head' (#1053) from 4363-item_waste_refactor into dev
gitea/salix/pipeline/head This commit is unstable Details

Reviewed-on: #1053
Reviewed-by: Joan Sanchez <joan@verdnatura.es>
This commit is contained in:
Joan Sanchez 2022-09-16 07:10:48 +00:00
commit f9f09440ec
4 changed files with 71 additions and 52 deletions

View File

@ -35,6 +35,19 @@ module.exports = Self => {
) sub
ORDER BY percentage DESC`, [date, date], myOptions);
const wastesTotal = await Self.rawSql(`
SELECT *, 100 * dwindle / total AS percentage
FROM (
SELECT buyer,
sum(ws.saleTotal) AS total,
sum(ws.saleWaste) AS dwindle
FROM bs.waste ws
WHERE year = YEAR(TIMESTAMPADD(WEEK,-1, ?))
AND week = WEEK(TIMESTAMPADD(WEEK,-1, ?), 1)
GROUP BY buyer
) sub
ORDER BY percentage DESC`, [date, date], myOptions);
const details = [];
for (let waste of wastes) {
@ -55,6 +68,14 @@ module.exports = Self => {
buyerDetail.lines.push(waste);
}
for (let waste of details) {
let buyerTotal = wastesTotal.find(totals => {
return waste.buyer == totals.buyer;
});
Object.assign(waste, buyerTotal);
}
return details;
};
};

View File

@ -12,6 +12,7 @@ describe('Item getWasteByWorker()', () => {
const anyResult = result[Math.floor(Math.random() * Math.floor(length))];
expect(anyResult.buyer).toMatch(/(CharlesXavier|HankPym|DavidCharlesHaller)/);
expect(anyResult.total).toBeGreaterThanOrEqual(1000);
expect(anyResult.lines.length).toBeGreaterThanOrEqual(3);
await tx.rollback();

View File

@ -4,39 +4,46 @@
data="details">
</vn-crud-model>
<vn-data-viewer model="model">
<section ng-repeat="detail in details" class="vn-pa-md">
<vn-horizontal class="header">
<h5><span translate>{{detail.buyer}}</span></h5>
<vn-none>
<vn-icon
<vn-card>
<vn-table>
<vn-thead>
<vn-tr class="header">
<vn-th class="waste-family">Buyer</vn-th>
<vn-th class="waste-family">Family</vn-th>
<vn-th number>Percentage</vn-th>
<vn-th number>Dwindle</vn-th>
<vn-th number>Total</vn-th>
<vn-th shrink></vn-th>
</vn-tr>
</vn-thead>
<vn-tbody ng-repeat="detail in details" class="vn-mb-md">
<vn-tr class="header">
<vn-td>{{::detail.buyer}}</vn-td>
<vn-td>{{::detail.family}}</vn-td>
<vn-td number>{{::(detail.percentage / 100) | percentage: 2}}</vn-td>
<vn-td number>{{::detail.dwindle | currency: 'EUR'}}</vn-td>
<vn-td number>{{::detail.total | currency: 'EUR'}}</vn-td>
<vn-td shrink>
<vn-icon-button
ng-class="{'hidden': !$ctrl.wasteConfig[detail.buyer].hidden}"
class="arrow pointer"
icon="keyboard_arrow_up"
vn-tooltip="Minimize/Maximize"
ng-click="$ctrl.toggleHidePanel(detail)">
</vn-icon>
</vn-none>
</vn-horizontal>
<vn-card ng-class="{'hidden': !$ctrl.wasteConfig[detail.buyer].hidden}">
<vn-table>
<vn-thead>
<vn-tr>
<vn-th class="waste-family">Family</vn-th>
<vn-th number>Percentage</vn-th>
<vn-th number>Dwindle</vn-th>
<vn-th number>Total</vn-th>
</vn-icon-button>
</vn-td>
</vn-tr>
</vn-thead>
<vn-tbody>
<a ng-repeat="waste in detail.lines" class="clickable vn-tr"
ui-sref="item.waste.detail({buyer: waste.buyer, family: waste.family})">
<vn-td class="waste-family">{{::waste.family}}</vn-td>
<vn-tr ng-repeat="waste in detail.lines" class="clickable vn-tr"
ui-sref="item.waste.detail({buyer: waste.buyer, family: waste.family})"
ng-class="{'hidden': !$ctrl.wasteConfig[detail.buyer].hidden}">
<vn-td></vn-td>
<vn-td>{{::waste.family}}</vn-td>
<vn-td number>{{::(waste.percentage / 100) | percentage: 2}}</vn-td>
<vn-td number>{{::waste.dwindle | currency: 'EUR'}}</vn-td>
<vn-td number>{{::waste.total | currency: 'EUR'}}</vn-td>
<vn-td shrink></vn-td>
</vn-tr>
</vn-tbody>
</vn-table>
</vn-card>
</section>
</vn-data-viewer>

View File

@ -5,20 +5,9 @@ vn-item-waste-index,
vn-item-waste-detail {
.header {
padding: 12px 0 5px 0;
color: gray;
background-color: $color-bg;
font-size: 1.2rem;
border-bottom: $border;
margin-bottom: 10px;
& > vn-none > vn-icon {
@extend %clickable-light;
color: $color-button;
font-size: 1.4rem;
}
vn-none > .arrow {
transition: transform 200ms;
}
}
vn-table vn-th.waste-family,
@ -26,11 +15,12 @@ vn-item-waste-detail {
max-width: 64px;
width: 64px
}
.hidden {
display: none;
}
.header > vn-none > .arrow.hidden {
.arrow.hidden {
display: block;
transform: rotate(180deg);
}