使用记录

src/api/channel/usageRecords.ts

@@ -0,0 +1,29 @@
+import { defHttp } from '/@/utils/http/axios';
+//渠道业务配置
+
+
+// 发放记录分页列表查询
+export function getUsageRecordList(params) {
+  return defHttp.get({
+    url: '/channel/usage/record/list',
+    params,
+  }
+  );
+}
+// 导出接口
+export function usageRecordExportXls() {
+  return defHttp.get({
+    url: '/channel/usage/record/exportXls',
+  }
+  );
+}
+
+// 查看凭证
+export function getUsageRecordVoucher(params) {
+  return defHttp.get({
+    url: '/channel/usage/record/get/voucher/' + params,
+  }, {
+    isTransformResponse: false,
+  },
+  );
+}

src/views/channel/usageRecords.vue

@@ -5,7 +5,12 @@
     <BasicTable @register="registerTable">
       <!-- 表格顶部左侧操作 -->
       <template #tableTitle>
-        <a-button preIcon="ant-design:plus-outlined" @click="exportDetails">导出</a-button>
+        <a-button preIcon="ant-design:plus-outlined" @click="onExportXls">导出</a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <span v-if="column.key === 'serviceCredential'" class="cursorstyle" @click="onGetVoucher(record)">
+          服务凭证
+        </span>
       </template>
       <!--操作栏-->
       <template #action="{ record }">
@@ -24,9 +29,11 @@ import { ActionItem, BasicColumn, BasicTable, TableAction } from '/@/components/
 import { useListPage } from '/@/hooks/system/useListPage';
 import { FormSchema } from '/@/components/Table';
 import { reactive, ref } from 'vue';
-import * as billingAPI from '/@/api/adManagement/billingModel';
+import * as usageRecordsAPI from '/@/api/channel/usageRecords';
 import { message, Modal } from 'ant-design-vue';
 import { useRouter, useRoute } from 'vue-router';
+import { createImgPreview } from '/@/components/Preview/index';
+
 //表单配置
 const router = useRouter();
 // 权益详情弹窗
@@ -35,74 +42,62 @@ const benefitDetailsShow = ref(false);
 const columns: BasicColumn[] = [
   {
     title: '订单号',
-    dataIndex: 'pricingName',
-    key: 'pricingName',
+    dataIndex: 'orderNo',
+    key: 'orderNo',
     width: 200,
   },
   {
     title: '发放渠道',
-    dataIndex: 'pricingCode',
-    key: 'pricingCode',
+    dataIndex: 'channelName',
+    key: 'channelName',
     ellipsis: true
 
   },
   {
     title: '权益名称',
-    dataIndex: 'pricingUnit',
-    key: 'pricingUnit',
+    dataIndex: 'rightsName',
+    key: 'rightsName',
     ellipsis: true,
-    customRender: ({ record }) => {
-      const pricingUnitMap = {
-        "1": "元/点击",
-        "2": "元/天",
-        "3": "元/笔销售",
-        "4": "元/千次曝光",
-      }
-      return pricingUnitMap[record.pricingUnit];
-    },
   },
   {
     title: '数量',
-    dataIndex: 'minPrice',
-    key: 'minPrice',
+    dataIndex: 'count',
+    key: 'count',
   },
   {
     title: '结算价',
-    dataIndex: 'status',
-    key: 'status',
-    customRender: ({ record }) => {
-      return record.status ? (record.status == '1' ? '启用' : '禁用') : '';
-    },
+    dataIndex: 'settlementPrice',
+    key: 'settlementPrice',
   },
   {
     title: '核销商户',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'merchantName',
+    key: 'merchantName',
   },
   {
     title: '订单状态',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'orderStatus',
+    key: 'orderStatus',
   },
   {
     title: '服务凭证',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'serviceCredential',
+    key: 'serviceCredential',
   },
   {
     title: '接收人保单号',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'policyNumber',
+    key: 'policyNumber',
   },
   {
     title: '客户',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'name',
+    key: 'name',
   },
   {
     title: '手机号',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'phone',
+    key: 'phone',
   },
   {
     title: '下单时间',
@@ -111,14 +106,14 @@ const columns: BasicColumn[] = [
   },
   {
     title: '完成时间',
-    dataIndex: 'createTime',
-    key: 'createTime',
+    dataIndex: 'completionTime',
+    key: 'completionTime',
   },
 ];
 const searchFormSchema: FormSchema[] = [
   {
     label: '订单号',
-    field: 'pricingName',
+    field: 'orderNo',
     component: 'Input',
     colProps: {
       span: 7,
@@ -182,7 +177,6 @@ const searchFormSchema: FormSchema[] = [
     },
     componentProps: {
       format: 'YYYY-MM-DD',
-      placeholder: ['开始日期', '结束日期']
     },
   },
   {
@@ -194,14 +188,13 @@ const searchFormSchema: FormSchema[] = [
     },
     componentProps: {
       format: 'YYYY-MM-DD',
-      placeholder: ['开始日期', '结束日期']
     },
   },
 ];
 /** useListPage 是整个框架的核心用于表格渲染，里边封装了很多公共方法；
  * 平台通过此封装，简化了代码，支持自定义扩展*/
 // 通过hook useListPage渲染表格（设置dataSource、columns、actionColumn等参数）
-const { tableContext } = useListPage({
+const { tableContext,onExportXls } = useListPage({
   designScope: 'basic-table-demo',
   tableProps: {
     title: '用户列表',
@@ -212,13 +205,18 @@ const { tableContext } = useListPage({
       schemas: searchFormSchema,
       showAdvancedButton: false,
     },
-    api: billingAPI.adPricingModelQueryPageList,
+    api: usageRecordsAPI.getUsageRecordList,
     size: 'small',
     actionColumn: {
       width: 200,
       fixed: 'right'
     },
   },
+  exportConfig: {
+    name: '使用记录导出',
+    url: '/channel/usage/record/exportXls',
+    method: 'get'
+  },
 });
 // BasicTable绑定注册
 const [registerTable, { getForm, reload }] = tableContext;
@@ -236,10 +234,13 @@ function getTableAction(record: ActionItem): ActionItem[] {
     },
   ];
 }
-// 导出明细
-const exportDetails = () => {
-  let formValues = getForm().getFieldsValue()
-  console.log(formValues)
+// 查看服务凭证
+const onGetVoucher = (record: ActionItem) => {
+  usageRecordsAPI.getUsageRecordVoucher(record.orderNo).then((res) => {
+    if (res.success) {
+      createImgPreview({ imageList: [res.result], defaultWidth: 700, rememberState: true,maskClosable: true });
+    }
+  })
 }
 // 明细详情
 const details = (record: ActionItem) => {
@@ -258,4 +259,9 @@ const details = (record: ActionItem) => {
 ::v-deep(.ant-col) {
   width: auto;
 }
+.cursorstyle {
+  font-size: 14px;
+  color: #018FFB;
+  cursor: pointer;
+}
 </style>