源文件

jeepay-ui-agent/src/views/agent/AgentList.vue

@@ -0,0 +1,143 @@
+<template>
+  <page-header-wrapper>
+    <a-card class="table-card">
+      <JeepaySearchForm :searchFunc="searchFunc" :resetFunc="() => { searchData= {} }">
+        <jeepay-text-up v-model:value="searchData['agentNo']" :placeholder="'服务商号'" />
+        <jeepay-text-up v-model:value="searchData['agentName']" :placeholder="'服务商名称'" />
+        <jeepay-text-up v-model:value="searchData['loginUsername']" :placeholder="'服务商登录名'" />
+        <a-form-item label="" class="table-search-item">
+          <a-select v-model:value="searchData['state']" placeholder="服务商状态">
+            <a-select-option value="">
+              全部
+            </a-select-option>
+            <a-select-option value="0">
+              禁用
+            </a-select-option>
+            <a-select-option value="1">
+              启用
+            </a-select-option>
+          </a-select>
+        </a-form-item>
+      </JeepaySearchForm>
+
+      <!-- 列表渲染 -->
+      <JeepayTable
+        ref="infoTable"
+        :init-data="true"
+        :req-table-data-func="reqTableDataFunc"
+        :table-columns="tableColumns"
+        :search-data="searchData"
+        row-key="agentNo"
+        @btnLoadClose="btnLoading=false"
+      >
+        <template #topBtnSlot>
+          <a-button v-if="$access('ENT_AGENT_INFO_ADD')" type="primary" @click="addFunc">
+            <plus-outlined />新建
+          </a-button>
+        </template>
+
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'agentName'">
+            <a @click="detailFunc(record.agentNo)"><b>{{ record.agentName }}</b></a>
+          </template>
+
+          <template v-if="column.key === 'state'">
+            <a-badge
+              :status="record.state === 0?'error':record.state === 1?'processing':record.state === 2?'warning':record.state === 3?'error':'yellow'"
+              :text="record.state === 0?'禁用':record.state === 1?'启用':record.state === 2?'审核中':record.state === 3?'审核驳回':'未认证'"
+            />
+          </template>
+
+          <template v-if="column.key === 'operation'">
+            <!-- 操作列插槽 -->
+            <JeepayTableColumns>
+              <a-button v-if="$access('ENT_AGENT_INFO_EDIT')" type="link" @click="editFunc(record.agentNo)">修改</a-button>
+              <a-button v-if="$access('ENT_AGENT_INFO_VIEW')" type="link" @click="detailFunc(record.agentNo)">详情</a-button>
+              <a-button v-if="$access('ENT_AGENT_RATE_CONFIG')" type="link" @click="showFeeConfigList(record.agentNo)">费率配置</a-button>
+              <a-button v-if="$access('ENT_AGENT_INFO_DEL')" type="link" style="color: red" @click="delFunc(record.agentNo)">删除</a-button>
+            </JeepayTableColumns>
+          </template>
+        </template>
+      </JeepayTable>
+    </a-card>
+    <!-- 新增页面组件  -->
+    <InfoAddOrEdit ref="infoAddOrEdit" :callback-func="searchFunc" />
+    <!-- 详情页面组件  -->
+    <InfoDetail ref="infoDetail" :callback-func="searchFunc" />
+
+    <!-- 费率配置页面  -->
+
+    <JeepayPaymentConfigDrawer ref="JeepayPaymentConfigDrawerRef" configMode="agentSubagent" />
+<!--    <JeepayPayConfigDrawer ref="JeepayPaymentConfigDrawerRef" configMode="agentSubagent" />-->
+
+  </page-header-wrapper>
+</template>
+<script setup lang="ts">
+
+import { API_URL_AGENT_LIST, req, reqLoad } from '@/api/manage'
+import InfoAddOrEdit from './AddOrEdit.vue'
+import InfoDetail from './Detail.vue'
+import { ref, reactive, getCurrentInstance } from 'vue'
+import router from '@/router'
+const { $infoBox,$access } = getCurrentInstance()!.appContext.config.globalProperties
+
+const infoDetail = ref()
+const infoAddOrEdit = ref()
+const infoTable = ref()
+
+const JeepayPaymentConfigDrawerRef = ref()
+
+let tableColumns = reactive([
+  { key: 'agentName', title: '服务商名称', fixed: 'left',  },
+  { key: 'agentNo', title: '服务商号', dataIndex: 'agentNo' , },
+  { key: 'mchCount', title: '商户数量', dataIndex: 'mchCount',  },
+  { key: 'state', title: '状态',  },
+  { key: 'createdAt', dataIndex: 'createdAt', title: '创建日期', },
+  { key: 'operation', title: '操作',  fixed: 'right', align: 'center'}
+])
+
+      let btnLoading = ref(false)
+      let searchData = ref({})
+
+    // 请求table接口数据
+  function reqTableDataFunc(params: any) {
+      return req.list(API_URL_AGENT_LIST, params)
+    }
+  function searchFunc () { // 点击【查询】按钮点击事件
+      infoTable.value.refTable(true)
+    }
+  function tableExportFunc(){
+      alert('导出！')
+    }
+
+  function addFunc () { // 业务通用【新增】 函数
+      infoAddOrEdit.value.show()
+    }
+  function editFunc (recordId: any) { // 业务通用【修改】 函数
+      infoAddOrEdit.value.show(recordId)
+    }
+  function rateConfigFunc(recordId: any) {
+    alert('费率配置')
+  }
+  function detailFunc (recordId: any) { // 服务商详情页
+      infoDetail.value.show(recordId)
+    }
+
+  function codeManagementFunc (recordId: any) {
+    alert('码牌管理')
+  }
+    // 删除服务商
+  function delFunc (recordId: any) {
+    $infoBox.confirmDanger('确认删除？', '该操作将删除服务商下所有配置及用户信息', () => {
+        reqLoad.delById(API_URL_AGENT_LIST, recordId).then((res: any) => {
+            infoTable.value.refTable(true)
+            $infoBox.message.success('删除成功')
+          })
+    })
+  }
+
+  function showFeeConfigList (recordId) { // 费率配置
+    JeepayPaymentConfigDrawerRef.value.show(recordId)
+  }
+
+</script>