#13114 #13089 enhance csms

Strides-Admin/src/styles/index.scss

@@ -365,4 +365,11 @@ input:-webkit-autofill:hover,
 input:-webkit-autofill:focus, 
 input:-webkit-autofill:active  {
   -webkit-box-shadow: 0 0 0 68px white inset;
+}
+
+.el-table thead {
+  color: #000;
+  th {
+    background-color: rgba($--color-primary, 0.2);
+  }
 }

Strides-Admin/src/views/financial/TopUp.vue

@@ -53,9 +53,14 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="Top Up Type"
+        label="Platform"
         align="center"
         prop="paymentPlatform"/>
+        <el-table-column
+          label="Pay Type"
+          align="center"
+          prop="payType"
+          width="85px"/>
       <el-table-column
         label="Amount"
         align="center"
@@ -71,7 +76,22 @@
       <el-table-column
         label="Payment Reference"
         align="center"
-        prop="paymentReference"/>
+        prop="paymentReference"
+        width="150px">
+        <template v-slot="{ row }">
+          <div @dblclick="copyReference(row.paymentReference)">
+            <el-input
+              type="textarea"
+              readonly
+              v-model="row.paymentReference"
+              class="payment-reference"
+              :title="row.paymentReference"/>
+          </div>
+        </template>
+        <template slot="header">
+          <div title="Double click to copy">Payment Reference</div>
+        </template>
+      </el-table-column>
       <el-table-column
         label="Update Time"
         align="center"
@@ -93,6 +113,7 @@ import site from '@/http/api/site'
 import ocpp from '@/http/api/ocpp'
 import financial from '@/http/api/financial'
 import Pagination from '@/components/Pagination'
+import handleClipboard from '@/utils/clipboard'
 export default {
   data() {
     return {
@@ -161,11 +182,19 @@ export default {
           type: 'error'
         })
       })
+    },
+    copyReference(data) {
+      handleClipboard(data)
     }
   }
 }
 </script>
 
 <style>
-  
+  .payment-reference {
+    width: 100%;
+  }
+  .payment-reference .el-textarea__inner {
+    border: none;
+  }
 </style>