Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <template>
- <div class="table_list__row__info row" :class="{ 'curosor-pointer': item.DETAIL_ID != null }">
- <div class="col-12 col-md-3 col hidden-sm-down">
- <div class="row">
- <div class="table-list__col col table-list__col--date" style="text-align: left; padding-left: 30px">
- <!--
- <p>
- <span>{{item.DATADOK_DATE.getDate() }}</span>
- <span>{{item.DATADOK_DATE.getMonth() | monthName }}</span>
- <small>{{item.DATADOK_DATE.getFullYear() }}</small>
- </p>
- -->
- <p><strong>{{item.DATVAL}}</strong></p>
- <p>{{item.DATDOK}}</p>
- <p ><small style="max-width: 65%; display: block;">{{item.FORMAT_TEXT}}</small></p>
- </div>
- <!--
- <div class="table-list__col col table-list__col--date table-list__col--date--fix">
- <p>
- <strong>{{item.DATAVAL_DATE.getDate()}}</strong>
- <strong>{{item.DATAVAL_DATE.getMonth() | monthName}}</strong>
- <small>{{item.DATAVAL_DATE.getFullYear()}}</small>
- </p>
- </div>
- -->
- </div>
- </div>
- <!--
- <div class="col col-md-2">
- <div class="row">
- /*
- <div class="table-list__col col table-list__col--date hidden-lg-down">
- <p>
- <span>{{item.DATADOK_DATE.getDate() }}</span>
- <span>{{item.DATADOK_DATE.getMonth() | monthName }}</span>
- <small>{{item.DATADOK_DATE.getFullYear() }}</small>
- </p>
- </div>
- */
- <div class="table-list__col col table-list__col--date table-list__col--date--fix">
- <p>
- <strong>{{item.DATAVAL_DATE.getDate()}}</strong>
- <strong>{{item.DATAVAL_DATE.getMonth() | monthName}}</strong>
- <small>{{item.DATAVAL_DATE.getFullYear()}}</small>
- </p>
- </div>
- </div>
- </div>
- -->
- <div class="col-12 col-md-5 col">
- <div class="table-list__col table-list__col--desc">
- <div>
- <p>
- <strong>{{item.DUGNAZ}}</strong>
- <small class="color-small">{{item.DUGIBN}}</small>
- <small class="color-small" v-if="item.MODEL1 && item.POZBR1">HR{{ item.MODEL1 || "" }} {{ item.POZBR1 || "" }}</small>
- <small class="color-small" v-else>---</small>
- <small>{{item.OPISNO}}</small>
- </p>
- <p v-if="item.POTIBN">
- <small>{{fromAccountLabel}} {{item.POTIBN}}</small>
- <!-- <small>{{item.FORMAT_TEXT }}</small> -->
- </p>
- </div>
- </div>
- </div>
- <div class="col-12 col-md-4 col col-md-down-no-rev">
- <div class="table-list__col table-list__col--value text-right" v-bind:class="{ 'table-list__col--cbox': hasCheckbox && !signPaymentOverview }">
- <p v-if="item.FORMAT != 465">{{item.POTRAZ}} {{item.AKRPOT }}</p>
- <p v-if="item.FORMAT == 465">{{item.DUGUJE }} {{item.AKRDUG }} <small>{{item.POTRAZ}} {{item.AKRPOT }}</small></p>
- <div class="ui-checkbox id-sign-now" v-if="hasCheckbox && isSelectedOnSignActive">
- <input type="checkbox" v-bind:disabled="itemDisabled || signStatus == true" v-bind:unchecked="item.checked || itemDisabled" v-model="item.checked" :key="item.DETAIL_ID">
- <span class="ui-checkbox__handle"></span>
- </div>
- <div class="table-list__col__icons" v-if="!signPaymentOverview">
- <div class="tooltip tooltip--inline-block">
- <span class="tooltip__content tooltip__content--pos-right">{{labels.lblTooltipSendEmail}}</span>
- <a href="#" v-if="orderStatus == 3" @click.prevent="sendEmail"><svg ><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-send-receipt"></use></svg></a>
- </div>
- <div class="tooltip tooltip--inline-block">
- <span class="tooltip__content tooltip__content--pos-right">{{labels.lblTooltipDownloadPDF}}</span>
- <a href="#" @click.prevent="downloadPdf"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-download-pdf"></use></svg></a>
- </div>
- <div class="tooltip tooltip--inline-block">
- <span class="tooltip__content tooltip__content--pos-right">{{labels.lblTooltipSepaDetails}}</span>
- <a href="#" v-if="item.PAIN_ID" @click.prevent="painLink"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-sepa"></use></svg></a>
- </div>
- </div>
- </div>
- </div>
- <div class="col-12 col adf" v-if="item.PORUKA != ''" data-bak-show="hasCheckbox || signPaymentOverview" style="padding-top: 14px">
- <div class="table-list__col table-list__col--additional" :class="{'table-list__col--nopad': signPaymentOverview == true }">
- <p>
- <svg>
- <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-info"></use>
- </svg>
- {{item.PORUKA}}
- <span v-if="signPaymentOverview" class="badge-txt badge-txt--success" v-bind:class="'badge-txt--status-' + item.STATUS">{{ item.STATUS_TEXT }}</span>
- </p>
- </div>
- </div>
- </div>
- </template>
- <script>
- import { shortMonths } from '../../helpers/months';
- import defFilters from '../../dashboard-app/mixins/table-list-info'
- import EventBus from '../event-bus';
- export default {
- mixins: [defFilters],
- props: [ 'item', 'labels', 'orderStatus', 'signStatus', 'signPaymentOverview', 'dozrad' ],
- created() {
- this.fromAccountLabel = window.global.lang == 'hr' ? 'S računa' : 'From Account';
- /*
- --- OLD Logic
- let r = (this.item.STATUS == 1 || this.itemDisabled) ? true : false;
- this.$set(this.item, 'checked', r);
- if( this.itemDisabled ) {
- this.$set(this.item, 'disabled', true);
- } else {
- this.$set(this.item, 'disabled', false);
- }
- */
- let item = this.item;
- if( this.dozrad != 1 ) {
- if( item.SUMAUT == 6 ) {
- this.$set(item, 'checked', false);
- this.$set(item, 'disabled', true);
- } else if( item.SUMAUT == 7 ) {
- this.$set(item, 'checked', false);
- this.$set(item, 'disabled', true);
- } else if( item.SUMAUT == 8 ) {
- this.$set(item, 'checked', false);
- this.$set(item, 'disabled', true);
- } else {
- this.$set(item, 'checked', false);
- this.$set(item, 'disabled', false);
- }
- } else {
- // no checkbox
- }
- },
- methods: {
- sendEmail() {
- this.$emit( 'sendEmail' );
- },
- downloadPdf() {
- EventBus.$emit( 'downloadPdf', this.item );
- },
- painLink() {
- let painIDSplit = this.item.PAIN_ID.split("#");
- //console.log( 'painID', painID[4] );
- let painID = painIDSplit[4];
- if( painID ) {
- EventBus.$emit('getDetailsSepa', { painID } );
- } else {
- alert('Cannot get details with current setup');
- }
- /*
- getPain001Details(string pain001Id)
- PaymentOrders.asmx
- Session["P01_ID"] = IDKontrole[4];
- string[] IDKontrole = eventTargetArgument.ToString().Split('#');
- else if (eventTarget == "PAIN_001")
- */
- // __doPostBack('PAIN_001', this.item.PAIN_ID)
- return;
- }
- },
- computed: {
- hasCheckbox() {
- return this.orderStatus == 0 && this.dozrad != 1
- },
- itemDisabled() {
- /*
- const STATUS = parseInt(this.item.STATUS);
- const SUMAUT = parseInt(this.item.SUMAUT);
- */
- return this.item.disabled;
- // return (STATUS + SUMAUT) > 0;
- },
- isSelectedOnSignActive() {
- if( this.signStatus ) {
- return this.item.checked == true && this.item.disabled == false;
- } else {
- return true;
- }
- }
- },
- filters: {
- monthName(month) {
- let monthName = shortMonths[month];
- let currentLang = window.global.lang;
- return monthName[currentLang];
- },
- descFormat(value) {
- let hasIndex = value.indexOf(",");
- if( hasIndex == -1 ) {
- return `<strong>${value}</strong>`;
- } else {
- let strongString = value.slice( 0, hasIndex );
- let spanString = value.slice( hasIndex + 1 );
- return `
- <strong>${strongString}</strong>
- <small>${spanString}</small>
- `;
- }
- }
- }
- }
- </script>
- <style scoped>
- .table-list__col--date p,
- .table-list__col--date p strong {
- font-size: 16px !important;
- color: #445C75;
- text-align: left;
- }
- .table-list__col--date p {
- margin-bottom: 2px;
- }
- .table-list__col--date p small {
- color: #94a8b6;
- line-height: 1.2;
- }
- .color-small {
- color: #445c75 !important;
- /*#94a8b6*/
- margin-bottom: 2px;
- }
- </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement