|
|
@@ -22,7 +22,7 @@
|
|
|
Search
|
|
|
</el-button>
|
|
|
</div>
|
|
|
- <div class="flex1"></div>
|
|
|
+ <div class="filter-flex-button"></div>
|
|
|
<div>
|
|
|
<el-select
|
|
|
v-model="filter.filter"
|
|
|
@@ -52,16 +52,19 @@
|
|
|
<el-table
|
|
|
v-loading="listLoading"
|
|
|
:data="tableList"
|
|
|
- fit
|
|
|
class="no-border"
|
|
|
style="width: 100%;min-height: 65vh;">
|
|
|
<el-table-column
|
|
|
- width="150"
|
|
|
+ min-width="100"
|
|
|
label="Transaction ID"
|
|
|
align="center"
|
|
|
class-name="fixed-width">
|
|
|
<template slot-scope="{row}">
|
|
|
- <router-link :to="'/station-activities/transactions/'+row.transactionPk" class="table-link">{{ row.transactionPk }}</router-link>
|
|
|
+ <div
|
|
|
+ class="link-type"
|
|
|
+ @click="viewTransiction(row)">
|
|
|
+ {{ row.transactionPk }}
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<!--el-table-column
|
|
|
@@ -74,7 +77,8 @@
|
|
|
</el-table-column-->
|
|
|
<el-table-column
|
|
|
label="Email"
|
|
|
- align="center">
|
|
|
+ align="center"
|
|
|
+ min-width="100">
|
|
|
<template slot-scope="{row}">
|
|
|
<span :title="row.email">{{ row.email }}</span>
|
|
|
</template>
|
|
|
@@ -88,7 +92,8 @@
|
|
|
</el-table-column-->
|
|
|
<el-table-column
|
|
|
label="User Type"
|
|
|
- align="center">
|
|
|
+ align="center"
|
|
|
+ min-width="120">
|
|
|
<template slot-scope="{row}">
|
|
|
<span :title="row.userType">{{ row.userType }}</span>
|
|
|
</template>
|
|
|
@@ -96,10 +101,11 @@
|
|
|
<el-table-column
|
|
|
label="Vehicle"
|
|
|
align="center"
|
|
|
- prop="vehicle">
|
|
|
- <template slot-scope="{row}" v-if="row.vehicle">
|
|
|
+ prop="vehicle"
|
|
|
+ min-width="120">
|
|
|
+ <template slot-scope="{row}" v-if="row.vehicles">
|
|
|
<span
|
|
|
- v-for="(item, idx) in row.vehicle.split(',')"
|
|
|
+ v-for="(item, idx) in row.vehicles"
|
|
|
:key="idx"
|
|
|
style="display: block;"
|
|
|
:title="item">
|
|
|
@@ -110,91 +116,96 @@
|
|
|
<el-table-column
|
|
|
label="Station ID"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <router-link
|
|
|
- :to="'/station-activities/transactions/'+row.transactionPk"
|
|
|
- class="table-link"
|
|
|
- :title="row.chargeBoxId">
|
|
|
- {{ row.chargeBoxId }}
|
|
|
- </router-link>
|
|
|
- </template>
|
|
|
+ min-width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <div
|
|
|
+ class="link-type"
|
|
|
+ @click="viewTransiction(row)"
|
|
|
+ :title="row.chargeBoxId">
|
|
|
+ {{ row.chargeBoxId }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- width="100"
|
|
|
+ min-width="90"
|
|
|
label="Connector"
|
|
|
- align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span>{{ row.connectorId }}</span>
|
|
|
- </template>
|
|
|
+ align="center">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{ row.connectorId }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Start Date/Time"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.startDateTime">{{ row.startDateTime }}</span>
|
|
|
- </template>
|
|
|
+ min-width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.startDateTime">{{ row.startDateTime }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="End Date/Time"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.endDateTime">{{ row.endDateTime }}</span>
|
|
|
- </template>
|
|
|
+ min-width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.endDateTime">{{ row.endDateTime }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Power (kWH)"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.power">{{ row.power }}</span>
|
|
|
- </template>
|
|
|
+ min-width="120">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.power">{{ row.power }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Rate"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.rate">{{ row.rate }}</span>
|
|
|
- </template>
|
|
|
+ min-width="130">
|
|
|
+ <template slot-scope="{row}" v-if="row.rate">
|
|
|
+ <span
|
|
|
+ v-for="(item, idx) in row.rate.split(';')"
|
|
|
+ :key="idx"
|
|
|
+ style="display: block;"
|
|
|
+ :title="item">
|
|
|
+ {{item}}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Duration"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.totalHour">{{ row.totalHour }}</span>
|
|
|
- </template>
|
|
|
+ min-width="100">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.totalHour">{{ row.totalHour }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Total Min"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.totalMin">{{ row.totalMin }}</span>
|
|
|
- </template>
|
|
|
+ min-width="100">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.totalMin">{{ row.totalMin }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Charges"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <span :title="row.charges">{{ row.charges }}</span>
|
|
|
- </template>
|
|
|
+ min-width="100">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span :title="row.charges">{{ row.charges }}</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="Invoice"
|
|
|
align="center"
|
|
|
- class-name="fixed-width">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <i
|
|
|
- class="download-invoice el-icon-download"
|
|
|
- title="Download"
|
|
|
- @click="downloadPdf(row.transactionPk)"></i>
|
|
|
- </template>
|
|
|
+ min-width="80">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <i
|
|
|
+ class="download-invoice el-icon-download"
|
|
|
+ title="Download"
|
|
|
+ @click="downloadPdf(row.transactionPk)"></i>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div class="right">
|
|
|
@@ -311,6 +322,11 @@ export default {
|
|
|
// IE10+下载
|
|
|
navigator.msSaveBlob(blob, fileName)
|
|
|
}
|
|
|
+ },
|
|
|
+ viewTransiction(row) {
|
|
|
+ this.$router.push({
|
|
|
+ path: "/station-activities/transactions/" + row.transactionPk
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -328,7 +344,7 @@ export default {
|
|
|
text-decoration: none;
|
|
|
}
|
|
|
.el-table >>> tr div {
|
|
|
- white-space: nowrap;
|
|
|
+ word-break: break-word;
|
|
|
}
|
|
|
.download-invoice {
|
|
|
color: #0000FF;
|