客户加上key跟secret字段

src/views/tariffManagement/customer/index.vue

@@ -5,12 +5,11 @@
     <div class="search-section">
       <a-form :model="searchForm" layout="inline">
         <a-form-item field="customerName" :label="$t('customer.customerName')">
-          <a-input v-model="searchForm.customerName" :placeholder="$t('customer.enterCustomerName')"
-                   allow-clear/>
+          <a-input v-model="searchForm.customerName" :placeholder="$t('customer.enterCustomerName')" allow-clear />
         </a-form-item>
         <a-form-item field="operatorType" :label="$t('customer.operatorType')">
-          <a-select v-model="searchForm.operatorType" :placeholder="$t('customer.selectOperatorType')"
-                    allow-clear style="width: 160px">
+          <a-select v-model="searchForm.operatorType" :placeholder="$t('customer.selectOperatorType')" allow-clear
+            style="width: 160px">
             <a-option v-for="op in operatorTypeOptions" :key="op.value" :value="op.value">
               {{ $t(`customer.operatorTypes.${op.value}`) }}
             </a-option>
@@ -35,28 +34,28 @@
 
     <!-- 数据表格 -->
     <a-table row-key="id" :columns="columns" :data="tableData" :pagination="pagination" :scroll="{ x: 'auto' }"
-    :row-selection="{ type: 'checkbox', showCheckedAll: true }" @page-change="onPageChange">
+      :row-selection="{ type: 'checkbox', showCheckedAll: true }" @page-change="onPageChange">
       <template #state="{ record }">
         <a-tag :color="getStatusColor(record.state)">
           {{ $t(`customer.status.${getStatusText(record.state)}`) }}
         </a-tag>
       </template>
       <template #user_type="{ record }">
-        {{$t(`customer.${getUserType(record.user_type)}`)}}
+        {{ $t(`customer.${getUserType(record.user_type)}`) }}
       </template>
       <template #operation="{ record }">
         <a-space>
-<!--          <a-button type="text" size="small" @click="handleRecharge(record)">{{-->
-<!--              $t('customer.recharge')-->
-<!--            }}-->
-<!--          </a-button>-->
-<!--          <a-button type="text" size="small" @click="handlePackageManagement(record)">{{-->
-<!--              $t('customer.packageManagement')-->
-<!--            }}-->
-<!--          </a-button>-->
+          <!--          <a-button type="text" size="small" @click="handleRecharge(record)">{{-->
+          <!--              $t('customer.recharge')-->
+          <!--            }}-->
+          <!--          </a-button>-->
+          <!--          <a-button type="text" size="small" @click="handlePackageManagement(record)">{{-->
+          <!--              $t('customer.packageManagement')-->
+          <!--            }}-->
+          <!--          </a-button>-->
           <a-button type="text" size="small" @click="handleEdit(record)">{{
-              $t('global.common.edit')
-            }}
+            $t('global.common.edit')
+          }}
           </a-button>
         </a-space>
       </template>
@@ -64,35 +63,37 @@
 
     <!-- 新客户表单对话框 -->
     <new-customer-form v-model:visible="newCustomerFormVisible" :editMode="editMode" :editData="editData"
-                       :loading="loading" @submit="handleNewCustomerSubmit"/>
+      :loading="loading" @submit="handleNewCustomerSubmit" />
   </div>
 </template>
 
 <script setup>
-import {ref, reactive, computed, onMounted} from 'vue';
-import {Message} from '@arco-design/web-vue';
-import {useI18n} from 'vue-i18n';
+import { ref, reactive, computed, onMounted } from 'vue';
+import { Message } from '@arco-design/web-vue';
+import { useI18n } from 'vue-i18n';
 import NewCustomerForm from './NewCustomerForm.vue';
-import {getMessUserList, deleteMessUser} from '@/api/customer.js';
+import { getMessUserList, deleteMessUser } from '@/api/customer.js';
 
-const {t} = useI18n();
+const { t } = useI18n();
 
 const loading = ref(false);
 
 const columns = computed(() => [
-  {title: t('customer.id'), dataIndex: 'id',ellipsis:true},
+  { title: t('customer.id'), dataIndex: 'id', align: 'center', ellipsis: true },
   // {title: t('customer.customerCode'), dataIndex: 'customerCode'},
-  {title: t('customer.customerName'), dataIndex: 'name',ellipsis:true},
-  {title: t('customer.userAdmin'), dataIndex: 'username'},
+  { title: t('customer.customerName'), dataIndex: 'name', align: 'center', ellipsis: true },
+  { title: t('customer.userAdmin'), dataIndex: 'username', align: 'center' },
   // {title: t('customer.accountBalance'), dataIndex: 'accountBalance'},
   // {title: t('customer.paymentMethodName'), dataIndex: 'paymentMethod'},
-  {title: t('customer.customerStatus'), slotName: 'state',ellipsis:true},
+  { title: t('customer.customerStatus'), slotName: 'state', align: 'center', ellipsis: true },
+  { title: 'app_key  ', dataIndex: 'appKey', align: 'center', ellipsis: true },
+  { title: 'app_secret', dataIndex: 'appSecret', align: 'center', ellipsis: true },
   // {title: t('customer.validPeriod'), dataIndex: 'validPeriod'},
   // {title: t('customer.activeCards'), dataIndex: 'activeCards'},
-  {title: t('customer.userTypeName'), dataIndex: 'userType',ellipsis:true},
-  {title: t('customer.startTime'), dataIndex: 'createdAt',ellipsis:true},
-  {title: t('customer.updateTime'), dataIndex: 'updatedAt',ellipsis:true},
-  {title: t('global.common.operations'), slotName: 'operation', ellipsis:true},
+  { title: t('customer.userTypeName'), align: 'center', dataIndex: 'userType', ellipsis: true },
+  { title: t('customer.startTime'), dataIndex: 'createdAt', align: 'center', ellipsis: true },
+  { title: t('customer.updateTime'), dataIndex: 'updatedAt', align: 'center', ellipsis: true },
+  { title: t('global.common.operations'), slotName: 'operation', align: 'center', ellipsis: true },
 ]);
 
 onMounted(() => {
@@ -115,7 +116,7 @@ const fetchCustomerList = async () => {
       operatorType: searchForm.operatorType,
     });
     if (response.code === 200 && response.data) {
-      tableData.value = response.data.records.map(res=>({...res,userType:res.userType==1?'平台':'客户'}))
+      tableData.value = response.data.records.map(res => ({ ...res, userType: res.userType == 1 ? '平台' : '客户' }))
       pagination.total = response.data.total;
       pagination.current = response.data.current;
       pagination.pageSize = response.data.size;
@@ -143,8 +144,8 @@ const searchForm = reactive({
 });
 
 const operatorTypeOptions = [
-  {value: 'domestic', label: t('customer.operatorTypes.domestic')},
-  {value: 'international', label: t('customer.operatorTypes.international')},
+  { value: 'domestic', label: t('customer.operatorTypes.domestic') },
+  { value: 'international', label: t('customer.operatorTypes.international') },
 ];
 
 const showNewCustomerForm = () => {
@@ -156,7 +157,7 @@ const showNewCustomerForm = () => {
 const handleEdit = async (record) => {
   try {
     loading.value = true;
-    const response = await deleteMessUser({id: record.id});
+    const response = await deleteMessUser({ id: record.id });
     if (response.code === 200) {
       // 处理返回的数据，确保数据结构匹配表单
       editMode.value = true;
@@ -217,8 +218,8 @@ const getStatusColor = (state) => {
 
 const getUserType = (state) => {
   const stateType = {
-    '1':'platform',
-    '2':'client'
+    '1': 'platform',
+    '2': 'client'
   }
   return stateType[state] || 'undefined';
 }