提交代码

src/app/pages/trade/order-refund/order-refund.component.html

@@ -0,0 +1,160 @@
+<form nz-form [formGroup]="searchForm" class="search_form" [nzLayout]="'vertical'">
+  <div nz-row [nzGutter]="24">
+    <div nz-col [nzSpan]="6">
+      <nz-form-item>
+        <nz-form-label>用户电话</nz-form-label>
+        <nz-form-control>
+          <input nz-input formControlName="userPhone" placeholder="请输入" />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="6">
+      <nz-form-item>
+        <nz-form-label>退款单号</nz-form-label>
+        <nz-form-control>
+          <input nz-input formControlName="refundOrderNo" placeholder="请输入" />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="6">
+      <nz-form-item>
+        <nz-form-label>交易单号</nz-form-label>
+        <nz-form-control>
+          <input nz-input formControlName="orderNo" placeholder="请输入" />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="6">
+      <nz-form-item>
+        <nz-form-label>商品单号</nz-form-label>
+        <nz-form-control>
+          <input nz-input formControlName="orderChildNo" placeholder="请输入" />
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="6">
+      <nz-form-item>
+        <nz-form-label>退款状态</nz-form-label>
+        <nz-form-control>
+          <nz-select formControlName="refundStatus" nzAllowClear [nzPlaceHolder]="'请选择'">
+            <nz-option *ngFor="let item of refundStatusArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
+          </nz-select>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="18">
+      <nz-form-item>
+        <nz-form-label>创建时间</nz-form-label>
+        <nz-form-control>
+          <nz-range-picker formControlName="createTimeArray" nzShowTime [nzFormat]="'yyyy/MM/dd HH:mm:ss'"></nz-range-picker>
+          <nz-radio-group nzButtonStyle="solid" formControlName="createTimeSelect" (ngModelChange)="createTimeInit()">
+            <label nz-radio-button *ngFor="let item of dateTypeSelect" nzValue="{{item.value}}">{{item.name}}</label>
+          </nz-radio-group>
+        </nz-form-control>
+      </nz-form-item>
+    </div>
+    <div nz-col [nzSpan]="24" class="search-area">
+      <button nz-button [nzType]="'primary'" (click)="searchFormSubmit()">查询</button>
+      <button nz-button (click)="searchFormReset()">重置</button>
+    </div>
+  </div>
+</form>
+
+<nz-table #basicTable
+          [nzScroll]="{ x: '1500px' }"
+          [nzBordered]="true"
+          [nzFrontPagination]="false"
+          [nzShowQuickJumper]="true"
+          [nzShowTotal]="totalTemplate"
+          [(nzPageIndex)]="tablePageNum"
+          (nzPageIndexChange)="queryData()"
+          [nzTotal]="tableData.total"
+          [nzData]="tableData.list" >
+  <thead>
+  <tr>
+    <th nzWidth="130px">用户电话</th>
+    <th nzWidth="160px">退款单号</th>
+    <th nzWidth="180px">交易单号</th>
+    <th nzWidth="130px">商品单号</th>
+    <th nzWidth="130px">支付渠道</th>
+    <th nzWidth="130px">支付方式</th>
+    <th nzWidth="130px">退款金额</th>
+    <th nzWidth="130px">退款积分</th>
+    <th nzWidth="180px">创建时间</th>
+    <th nzWidth="100px">状态</th>
+    <th nzWidth="120px" nzRight>操作</th>
+  </tr>
+  </thead>
+  <tbody>
+  <tr *ngFor="let data of basicTable.data;index as i">
+    <td>{{data.userPhone}}</td>
+    <td>{{data.refundOrderNo}}</td>
+    <td>{{data.orderNo}}</td>
+    <td>{{data.orderChildNo}}</td>
+    <td>{{data.refundPayChannel  | dictionary: 'ORDER_PAY_CHANNEL'}}</td>
+    <td>{{data.refundPayType | dictionary: 'ORDER_PAY_TYPE'}}</td>
+    <td>{{data.refundPrice}}</td>
+    <td>{{data.refundIntegral}}</td>
+    <td>{{data.createTime | date: 'yyyy-MM-dd HH:mm:ss'}}</td>
+    <td>{{data.refundStatus | dictionary: 'ORDER_REFUND_STATUS'}}</td>
+    <td nzRight>
+      <a (click)="showDetail(data.refundOrderNo)">详情</a>
+    <!--  <nz-divider nzType="vertical"></nz-divider>
+      <a nz-dropdown [nzDropdownMenu]="menu">
+        更多
+        <span nz-icon nzType="down"></span>
+      </a>
+      <nz-dropdown-menu #menu="nzDropdownMenu">
+        <ul nz-menu nzSelectable>
+          <li nz-menu-item *ngIf="data.status == 1" (click)="showAudit(data)">审核申请</li>
+        </ul>
+      </nz-dropdown-menu>-->
+    </td>
+  </tr>
+  </tbody>
+  <ng-template #totalTemplate let-total>总计 {{ total }} 条</ng-template>
+</nz-table>
+
+
+<nz-modal [(nzVisible)]="refundDetailVisible" nzWidth="1000px" nzTitle="退款详情" [nzFooter]="null" (nzOnCancel)="closeDetail()" [nzBodyStyle]="{ 'padding': '10px' }">
+  <ng-container *nzModalContent>
+    <nz-tabset nzType="card" nzSize="small">
+      <nz-tab nzTitle="退款详情">
+        <nz-descriptions nzBordered [nzColumn]="{ xxl: 2, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }">
+          <nz-descriptions-item nzTitle="用户电话">{{refundDetail.refund.userPhone}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款单号">{{refundDetail.refund.refundOrderNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="交易单号">{{refundDetail.refund.orderNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="商品单号">{{refundDetail.refund.orderChildNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="支付渠道">{{refundDetail.refund.refundPayChannel | dictionary: 'ORDER_PAY_CHANNEL'}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="支付类型">{{refundDetail.refund.reufndPayType  | dictionary: 'ORDER_PAY_TYPE'}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="渠道退款流水">{{refundDetail.refund.refundPayChannelOrderNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="客户退款流水">{{refundDetail.refund.refundSerialNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款金额">{{refundDetail.refund.refundPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款积分">{{refundDetail.refund.refundIntegral}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款备注" [nzSpan]="3">{{refundDetail.refund.refundRemark}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="创建时间">{{refundDetail.refund.createTime}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款时间">{{refundDetail.refund.finishTime}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款状态">{{refundDetail.refund.refundStatus | dictionary: 'ORDER_REFUND_STATUS'}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="退款失败原因" *ngIf="refundDetail.refund.refundFailReason != null" [nzSpan]="3">{{refundDetail.refund.refundFailReason}}</nz-descriptions-item>
+        </nz-descriptions>
+      </nz-tab>
+      <nz-tab nzTitle="商品订单">
+        <nz-descriptions nzBordered [nzColumn]="{ xxl: 2, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }">
+          <nz-descriptions-item nzTitle="交易单号">{{refundDetail.orderChild.orderNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="商品单号">{{refundDetail.orderChild.childOrderNo}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="产品类型">{{refundDetail.orderChild.productType | dictionary: 'ORDER_CHILD_PRODUCT_TYPE'}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="产品名称">{{refundDetail.orderChild.productName}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="产品规格">{{refundDetail.orderChild.productSpecName}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="购买数量">{{refundDetail.orderChild.productCount}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="商品总价">{{refundDetail.orderChild.productTotalPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="总优惠">{{refundDetail.orderChild.totalDeductionPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="优惠券优惠">{{refundDetail.orderChild.couponDiscountPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="积分抵扣">{{refundDetail.orderChild.integralDiscountPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="实付金额">{{refundDetail.orderChild.productActualPrice}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="状态">{{refundDetail.orderChild.status | dictionary: 'ORDER_CHILD_STATUS'}}</nz-descriptions-item>
+          <nz-descriptions-item nzTitle="下单时间">{{refundDetail.orderChild.createTime | date: 'yyyy-MM-dd HH:mm:ss'}}</nz-descriptions-item>
+        </nz-descriptions>
+      </nz-tab>
+    </nz-tabset>
+  </ng-container>
+</nz-modal>

src/app/pages/trade/order-refund/order-refund.component.less

@@ -0,0 +1,9 @@
+.search-area {
+  margin-bottom: 10px;
+}
+.search-area button {
+  margin-right: 8px;
+}
+.submit-btn {
+  width: 150px;
+}

src/app/pages/trade/order-refund/order-refund.component.ts

@@ -0,0 +1,213 @@
+import { Component } from '@angular/core';
+import {environment} from "../../../../environments/environment";
+import {FormGroup, FormsModule, NonNullableFormBuilder, ReactiveFormsModule, Validators} from "@angular/forms";
+import {DateSelectType, DateUtils} from "../../../utils/dateUtils.service";
+import {DictionaryPipe} from "../../../pipes/common/dictionary.pipe";
+import {NzMessageService} from "ng-zorro-antd/message";
+import {NzModalComponent, NzModalModule, NzModalService} from "ng-zorro-antd/modal";
+import {OrderRefundService} from "../../../services/trade/order-refund.service";
+import {DatePipe, NgForOf, NgIf, NgSwitch} from "@angular/common";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+import {
+  NzCellEllipsisDirective,
+  NzCellFixedDirective,
+  NzTableCellDirective,
+  NzTableComponent,
+  NzTbodyComponent, NzTheadComponent,
+  NzThMeasureDirective, NzTrDirective
+} from "ng-zorro-antd/table";
+import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
+import {NzDividerComponent} from "ng-zorro-antd/divider";
+import {NzDropDownADirective, NzDropDownDirective, NzDropdownMenuComponent} from "ng-zorro-antd/dropdown";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {NzMenuDirective, NzMenuItemComponent} from "ng-zorro-antd/menu";
+import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
+import {NzDatePickerComponent, NzDatePickerModule, NzRangePickerComponent} from "ng-zorro-antd/date-picker";
+import {NzRadioButtonDirective, NzRadioComponent, NzRadioGroupComponent} from "ng-zorro-antd/radio";
+import {NzTooltipDirective} from "ng-zorro-antd/tooltip";
+import {NzTreeComponent} from "ng-zorro-antd/tree";
+import {NzDescriptionsModule} from "ng-zorro-antd/descriptions";
+import {NzTabComponent, NzTabSetComponent, NzTabsModule} from "ng-zorro-antd/tabs";
+import {NzTimelineModule} from "ng-zorro-antd/timeline";
+import {NzImageDirective, NzImageModule} from "ng-zorro-antd/image";
+import {NzTypographyComponent} from "ng-zorro-antd/typography";
+
+@Component({
+  selector: 'app-order-refund',
+  standalone: true,
+  imports: [
+    DatePipe,
+    DictionaryPipe,
+    FormsModule,
+    NgForOf,
+    NgIf,
+    NzButtonComponent,
+    NzCellFixedDirective,
+    NzColDirective,
+    NzDividerComponent,
+    NzDropDownADirective,
+    NzDropDownDirective,
+    NzDropdownMenuComponent,
+    NzFlexDirective,
+    NzFormControlComponent,
+    NzFormDirective,
+    NzFormItemComponent,
+    NzFormLabelComponent,
+    NzIconDirective,
+    NzInputDirective,
+    NzMenuDirective,
+    NzMenuItemComponent,
+    NzModalComponent,
+    NzOptionComponent,
+    NzRowDirective,
+    NzSelectComponent,
+    NzTableCellDirective,
+    NzTableComponent,
+    NzTbodyComponent,
+    NzThMeasureDirective,
+    NzTheadComponent,
+    NzTrDirective,
+    ReactiveFormsModule,
+    NzModalModule,
+    NzRangePickerComponent,
+    NzDatePickerComponent,
+    NzDatePickerModule,
+    NzRadioButtonDirective,
+    NzRadioComponent,
+    NzRadioGroupComponent,
+    NgSwitch,
+    NzCellEllipsisDirective,
+    NzTooltipDirective,
+    NzTreeComponent,
+    NzDescriptionsModule,
+    NzTabSetComponent,
+    NzTabComponent,
+    NzTabsModule,
+    NzTimelineModule,
+    NzImageDirective,
+    NzImageModule,
+    NzTypographyComponent
+  ],
+  templateUrl: './order-refund.component.html',
+  styleUrl: './order-refund.component.less'
+})
+export class OrderRefundComponent {
+  imageUrl = environment.imageUrl;
+  // 表单页数
+  tablePageNum = 1;
+  // 表单数据
+  tableData: any = {
+    total: 0,
+    list: [],
+  };
+  // 搜索表单
+  searchForm: FormGroup;
+  // 时间类型选择
+  dateTypeSelect = DateSelectType;
+  // 退款状态
+  refundStatusArray = new DictionaryPipe().getDictionaryList('ORDER_REFUND_STATUS');
+  // 详情模态框
+  refundDetailVisible = false;
+  // 详情数据
+  refundDetail: any = {
+    refund: {},
+    orderChild: {},
+  };
+  constructor(private fb: NonNullableFormBuilder,
+              private orderRefundService : OrderRefundService,
+              private message: NzMessageService,
+              private modal: NzModalService) {
+    // 初始化搜索框
+    this.searchForm = this.fb.group({
+      userPhone: [''],
+      orderNo: [''],
+      orderChildNo: [''],
+      refundOrderNo: [''],
+      refundStatus: [''],
+      createTimeArray: [[]],
+      createTimeSelect: ['1'],
+      createTimeS: [''],
+      createTimeE: [''],
+    });
+    this.createTimeInit();
+    this.queryData();
+  }
+
+  /**
+   * 获取数据
+   */
+  queryData() {
+    if (this.searchForm.controls['createTimeArray'].value != null
+      && this.searchForm.controls['createTimeArray'].value.length > 0) {
+      this.searchForm.controls['createTimeS'].setValue(this.searchForm.controls['createTimeArray'].value[0]);
+      this.searchForm.controls['createTimeE'].setValue(this.searchForm.controls['createTimeArray'].value[1]);
+    } else {
+      this.searchForm.controls['createTimeS'].setValue(null);
+      this.searchForm.controls['createTimeE'].setValue(null);
+    }
+    this.searchForm.value.pageNum = this.tablePageNum;
+    this.searchForm.value.pageSize = 10;
+    this.searchForm.value.time = new Date().getTime();
+    this.orderRefundService.queryList(this.searchForm.value, (data: any) => {
+      if (data['return_code'] == '000000') {
+        this.tableData = data['return_data'];
+      }
+    });
+  }
+
+  /**
+   * 搜索表单提交
+   */
+  searchFormSubmit(): void {
+    this.tablePageNum = 1;
+    this.queryData();
+  }
+
+  /**
+   * 搜索表单重置
+   */
+  searchFormReset(): void {
+    this.searchForm.reset();
+  }
+
+  /**
+   * 创建时间初始化
+   */
+  createTimeInit() {
+    let createTimeSelect = this.searchForm.controls['createTimeSelect'].value;
+    if (createTimeSelect != null) {
+      let timeObj = DateUtils.getDate(new Date(), Number(createTimeSelect));
+      this.searchForm.controls['createTimeArray'].setValue([timeObj.timeS, timeObj.timeE]);
+    }
+  }
+
+  /**
+   * 展示详情
+   * @param applyNo
+   */
+  showDetail(refundOrderNo: string) {
+    const param = {
+      refundOrderNo: refundOrderNo
+    };
+    this.orderRefundService.queryRefund(param,(data: any) => {
+      if (data['return_code'] == '000000') {
+        this.refundDetail = data['return_data'];
+        this.refundDetailVisible = true;
+      } else {
+        this.message.error(data['return_msg']);
+      }
+    });
+  }
+
+  /**
+   * 关闭详情
+   */
+  closeDetail() {
+    this.refundDetail = {};
+    this.refundDetailVisible = false;
+  }
+
+}

src/app/pages/trade/trade.routes.ts

@@ -1,8 +1,10 @@
 import { Routes } from '@angular/router';
 import {CompOrderComponent} from "./comp-order/comp-order.component";
 import {OrderAfterSalesComponent} from "./order-after-sales/order-after-sales.component";
+import {OrderRefundComponent} from "./order-refund/order-refund.component";
 
 export const TRADE_ROUTES: Routes = [
   { path: 'comp-order', component: CompOrderComponent },
   { path: 'order-after-sales', component: OrderAfterSalesComponent },
+  { path: 'order-refund', component: OrderRefundComponent },
 ];

src/app/services/trade/order-refund.service.ts

@@ -0,0 +1,35 @@
+import { Injectable } from '@angular/core';
+import {HttpClient} from "@angular/common/http";
+import {environment} from "../../../environments/environment";
+import {ObjectData} from "../../utils/objectData.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class OrderRefundService {
+
+  constructor(private http: HttpClient) { }
+
+  /**
+   * 查询退款订单列表
+   * @param param
+   * @param callBack
+   */
+  public queryList(param: object, callBack:any) {
+    this.http.get(environment.orderUrl + 'refund/queryList?'+ObjectData.objectByString(param)).subscribe(data => {
+      callBack(data);
+    });
+  }
+
+  /**
+   * 查询退款订单
+   * @param param
+   * @param callBack
+   */
+  public queryRefund(param: object, callBack:any) {
+    this.http.get(environment.orderUrl + 'refund/queryRefund?'+ObjectData.objectByString(param)).subscribe(data => {
+      callBack(data);
+    });
+  }
+
+}

src/environments/environment.ts

@@ -4,12 +4,12 @@
 
 export const environment = {
   production: false,
-  // baseUrl: 'https://phgcs.dctpay.com/brest/', // 测试环境服务器地址(请求数据地址)
+  baseUrl: 'https://phgcs.dctpay.com/brest/', // 测试环境服务器地址(请求数据地址)
-  // orderUrl: 'https://phgcs.dctpay.com/order/', // 测试环境服务器地址(请求数据地址)
+  orderUrl: 'https://phgcs.dctpay.com/order/', // 测试环境服务器地址(请求数据地址)
   userUrl: 'https://phgcs.dctpay.com/user/', // 测试环境服务器地址(请求数据地址)
   // imageUrl: 'https://phgcs.dctpay.com/filesystem/',
-  baseUrl: 'http://localhost:9702/brest/', // 测试环境服务器地址(请求数据地址)
+  //baseUrl: 'http://localhost:9702/brest/', // 测试环境服务器地址(请求数据地址)
-  orderUrl: 'http://localhost:9703/order/', // 测试环境服务器地址(请求数据地址)
+  //orderUrl: 'http://localhost:9703/order/', // 测试环境服务器地址(请求数据地址)
   // userUrl: 'http://localhost:9704/user/', // 测试环境服务器地址(请求数据地址)
   imageUrl: 'https://phgcs.dctpay.com/filesystem/',