hurui
/
high-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'order' of http://139.159.177.244:3000/yuanye/high-web into order

Browse Source 
* 'order' of http://139.159.177.244:3000/yuanye/high-web:
  提交代码

# Conflicts:
#	src/app/admin/order-manage/order-manage.module.ts
pull/1/head
袁野 2 years ago
parent c4b5689d65
commit 7821421839
6 changed files with 876 additions and 0 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 272
      src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.html
  2. 3
      src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.scss
  3. 163
      src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.ts
  4. 272
      src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.html
  5. 3
      src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.scss
  6. 163
      src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.ts

272
src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.html
Unescape View File

@ -0,0 +1,272 @@
<!-- start 面包屑 -->
<app-breadcrumb></app-breadcrumb>
<!-- end 面包屑 -->
<nz-spin [nzSpinning]="loadingObject.status" [nzTip]="loadingObject.title">
<!-- start 搜索条件 -->
<div [@openClose]="isCollapse ? 'open' : 'closed'">
<div class="inner-content">
<form nz-form [formGroup]="searchForm" (ngSubmit)="getRequest(true , searchForm.value)">
<div nz-row>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">交易单号</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="orderNo" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">客户电话</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="memPhone" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">交易状态</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select formControlName="orderStatus" nzAllowClear>
<nz-option *ngFor="let item of orderStatusArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
</div>
<div nz-row *ngIf="isCollapse">
<div nz-col nzSpan="8" *ngIf="roleType == 0 || roleType == 1">
<nz-form-item>
<nz-form-label [nzSpan]="8">分公司</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select nzShowSearch formControlName="companyId" nzAllowClear>
<nz-option *ngFor="let item of companyArray" nzValue="{{item['id']}}" nzLabel="{{item['name']}}"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付方式</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select nzAllowClear formControlName="payType">
<nz-option nzValue="1" nzLabel="支付宝"></nz-option>
<nz-option nzValue="2" nzLabel="微信"></nz-option>
<nz-option nzValue="3" nzLabel="积分抵扣"></nz-option>
<nz-option nzValue="4" nzLabel="汇联通工会卡"></nz-option>
<nz-option nzValue="5" nzLabel="银联"></nz-option>
<nz-option nzValue="6" nzLabel="银联分期"></nz-option>
<nz-option nzValue="7" nzLabel="嗨森逛油卡"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付卡号</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="memCardNo" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="payTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">创建时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="createTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">退款时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="refundTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
</div>
<div nz-row>
<div nz-col nzSpan="24" class="search-button">
<button nz-button nzType="primary"><i nz-icon nzType="search" nzTheme="outline"></i>搜索</button>
<button nz-button nzType="default" (click)="searchForm.reset();"><i nz-icon nzType="reload" nzTheme="outline"></i>重置</button>
<a class="collapse" (click)="isCollapse = !isCollapse;">{{!isCollapse ? '更多条件' : '隐藏条件'}}<i nz-icon [nzType]="!isCollapse ? 'down' : 'up'"></i></a>
</div>
</div>
</form>
</div>
</div>
<!-- end 搜索条件 -->
<!--列表数据-->
<div class="inner-content">
<span>共计 {{total?total:0}} 条数据</span>
<div class="operating-button">
<button nz-button nzType="primary" class="right-btn" (click)="excelOrder(searchForm.value)" ><i nz-icon nzType="export" nzTheme="outline"></i>导出Excel</button>
</div>
<!--数组表格 -->
<nz-table #basicTable
nzShowPagination
nzShowSizeChanger
nzBordered
[nzData]="requestData"
[nzTotal]="total"
[nzLoading]="loading"
[nzFrontPagination]="false"
[(nzPageIndex)]="pageNum"
[(nzPageSize)]="pageSize"
(nzPageIndexChange)="getRequest(false , searchForm.value)"
(nzPageSizeChange)="getRequest(false , searchForm.value)"
[nzPageSizeOptions]="[10,20,50,100]"
[nzScroll]="{ x: '1200px'}">
<thead>
<tr>
<th nzWidth="200px">交易单号</th>
<th nzWidth="130px">客户电话</th>
<th nzWidth="200px">订单名称</th>
<th nzWidth="100px">订单金额</th>
<th nzWidth="100px">支付金额</th>
<th nzWidth="100px">支付方式</th>
<th nzWidth="140px">支付卡号</th>
<th nzWidth="100px">订单状态</th>
<th nzWidth="180px">创建时间</th>
<th nzWidth="110px" nzRight="0px">操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data;let i = index">
<td>{{data.orderNo}}</td>
<td>{{data.memPhone}}</td>
<td>{{data.title}}</td>
<td>￥{{data.totalPrice}}</td>
<td>￥{{data.payPrice}}</td>
<td>{{data.orderStatus == 1 || data.orderStatus == 5 ? '未支付' : data.payType | orderPayType}}</td>
<td>{{data.memCardNo}}</td>
<td>{{data.orderStatus | orderStatus}}</td>
<td>{{data.createTime | date : 'yyyy-MM-dd HH:mm:ss'}}</td>
<td nzRight="0px" class="table-td-operation">
<a nz-dropdown [nzDropdownMenu]="menu"> 操作列表 <i nz-icon nzType="down"></i> </a>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu nzSelectable>
<li nz-menu-item (click)="showOrderDetail(data.orderNo)"><a>详情</a></li>
</ul>
</nz-dropdown-menu>
</td>
</tr>
</tbody>
</nz-table>
</div>
</nz-spin>
<nz-modal [(nzVisible)]="orderDetailModal" nzTitle="交易详情" (nzOnCancel)="orderDetailModal = false" [nzFooter]="null"
nzWidth="1000px" [nzBodyStyle]=" { padding: '20px 20px 30px 20px'}">
<nz-spin [nzSpinning]="orderDetailModalLoading">
<nz-tabset [nzType]="'card'">
<nz-tab nzTitle="订单信息">
<nz-descriptions nzBordered [nzColumn]="2" [nzSize]="'middle'">
<nz-descriptions-item nzTitle="交易订单号">{{orderDetailObject.tradeOrder.orderNo}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="第三方交易号">{{orderDetailObject.tradeOrder.paySerialNo!=null?orderDetailObject.tradeOrder.paySerialNo:'无'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="客户手机号">{{orderDetailObject.tradeOrder.memPhone}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="交易状态">{{orderDetailObject.tradeOrder.orderStatus | orderStatus}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="支付方式">{{orderDetailObject.tradeOrder.payType | orderPayType}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="支付卡号" *ngIf="orderDetailObject.tradeOrder.payType == 4 || orderDetailObject.tradeOrder.payType == 7">
{{orderDetailObject.tradeOrder.memCardNo}}
</nz-descriptions-item>
<nz-descriptions-item nzTitle="优惠券">{{orderDetailObject.tradeOrder.memDiscountName?orderDetailObject.tradeOrder.memDiscountName:'无'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="返利">{{orderDetailObject.tradeOrder.whetherRebate?'是':'否'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="备注">{{orderDetailObject.tradeOrder.remarks}}</nz-descriptions-item>
</nz-descriptions>
</nz-tab>
<nz-tab nzTitle="支付信息">
<nz-descriptions nzBordered [nzColumn]="3" [nzSize]="'middle'">
<nz-descriptions-item nzTitle="交易总额" >{{orderDetailObject.tradeOrder.totalPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="总优惠" >{{orderDetailObject.tradeOrder.totalDeductionPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="产品优惠金额" >{{orderDetailObject.tradeOrder.deductionProductPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="优惠券优惠" >{{orderDetailObject.tradeOrder.deductionCouponPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="应付金额" >{{orderDetailObject.tradeOrder.payablePrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="积分抵扣" >{{orderDetailObject.tradeOrder.payGold / 100}} 元 </nz-descriptions-item>
<nz-descriptions-item nzTitle="实付金额" >
{{orderDetailObject.tradeOrder.payRealPrice!=null?orderDetailObject.tradeOrder.payRealPrice+' 元':'未支付'}}
</nz-descriptions-item>
</nz-descriptions>
</nz-tab>
<nz-tab nzTitle="订单时间">
<nz-card>
<nz-timeline>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.createTime != null">
<p>创建时间：{{orderDetailObject.tradeOrder.createTime | date : 'yyyy-MM-dd HH:mm:ss'}}</p>
<p>备注：{{orderDetailObject.tradeOrder.remarks?orderDetailObject.tradeOrder.remarks:'无'}}</p>
</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.cancelTime != null">
<p>取消时间：{{orderDetailObject.tradeOrder.cancelTime | date : 'yyyy-MM-dd HH:mm:ss'}}</p>
<p>备注：{{orderDetailObject.tradeOrder.cancelRemarks?orderDetailObject.tradeOrder.cancelRemarks:'无'}}</p>
</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.payTime != null">支付时间：{{orderDetailObject.tradeOrder.payTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.finishTime != null">完成时间：{{orderDetailObject.tradeOrder.finishTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.refundTime != null">退款时间：{{orderDetailObject.tradeOrder.refundTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
</nz-timeline>
</nz-card>
</nz-tab>
<nz-tab nzTitle="产品信息">
<nz-table nzBordered #childOrder [nzData]="orderDetailObject.tradeOrder.highChildOrderList" [nzHideOnSinglePage]="true">
<thead>
<tr>
<th nzWidth="80px">产品类型</th>
<th nzWidth="150px">门店</th>
<th nzWidth="100px">产品图片</th>
<th nzWidth="150px">产品名称</th>
<th nzWidth="20px">数量</th>
<th nzWidth="20px">单价</th>
<th nzWidth="20px">总价</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of childOrder.data">
<td>{{ data.goodsType | orderChildGoodsType}}</td>
<td>{{ data.storeName}}</td>
<td><img src="{{data.goodsImg}}" alt=""></td>
<td>
{{ data.goodsName }}
<nz-tag *ngIf="data.giveawayType == 1" [nzColor]="'magenta'">赠品</nz-tag>
</td>
<td>{{ data.saleCount }}</td>
<td>{{ data.goodsActualPrice }} 元</td>
<td>{{ data.totalActualPrice }} 元</td>
</tr>
</tbody>
</nz-table>
</nz-tab>
</nz-tabset>
</nz-spin>
</nz-modal>

3
src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.scss
Unescape View File

@ -0,0 +1,3 @@
img {
width: 60px;
}

163
src/app/admin/order-manage/member-charge-order/member-charge-order-list/member-charge-order-list.component.ts
Unescape View File

@ -0,0 +1,163 @@
import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormGroup} from '@angular/forms';
import {ADMIN_INFO_OBJECT} from '../../../../services/local-storage.namespace';
import {LocalStorageService} from '../../../../services/local-storage.service';
import {CompanyService} from '../../../../services/company.service';
import {CommonsService} from '../../../../services/commons.service';
import {animate, state, style, transition, trigger} from '@angular/animations';
import {NzMessageService} from 'ng-zorro-antd';
import {OrderThirdPartyService} from '../../../../services/order/order-third-party.service';
import {environment} from "../../../../../environments/environment";
@Component({
selector: 'app-member-charge-order-list',
animations: [
trigger('openClose', [
state('open', style({
height: '260px',
opacity: 1,
backgroundColor: 'white'
})),
state('closed', style({
opacity: 1,
backgroundColor: 'white'
})),
transition('open => closed', [
animate('0.3s')
]),
transition('closed => open', [
animate('0.3s')
]),
]),
],
templateUrl: './member-charge-order-list.component.html',
styleUrls: ['./member-charge-order-list.component.scss']
})
export class MemberChargeOrderListComponent implements OnInit {
// 搜索框
searchForm: FormGroup;
// 搜索框折叠
isCollapse = false;
// 订单状态数据
orderStatusArray = [];
// 公司数据
companyArray = [];
// 角色类型
roleType: number;
// 列表相关参数
// 总条数
total: number;
// 页码
pageNum = 1;
// 条码
pageSize = 10;
// 列表数据
requestData = [];
// 列表加载
loading = true;
// 订单详情相关参数
// 详情模态框
orderDetailModal = false;
// 详情模态框数据等待
orderDetailModalLoading = false;
// 订单详情数据
orderDetailObject: any = {
tradeOrder: {},
};
// 数据加载中参数
loadingObject = {
title: '加载中...',
status: false,
};
// 请求地址参数
FILE_URL = environment.imageUrl;
constructor(
private form: FormBuilder,
private store: LocalStorageService,
private message: NzMessageService,
private thirdPartyOrder: OrderThirdPartyService,
private companyService: CompanyService,
private commonsService: CommonsService,
) { }
ngOnInit(): void {
// 搜索表单初始化
this.searchForm = this.form.group({
orderNo: [null],
memPhone: [null],
payTimeArray: [null],
orderStatus: [null],
createTimeArray: [null],
refundTimeArray: [null],
companyId: [null],
payType: [null],
memCardNo: [null],
productType: [3],
});
// 角色类型初始化
this.roleType = Number(this.store.get(ADMIN_INFO_OBJECT)['secRole'].roleType);
// 查询公司列表
if (this.roleType === 0 || this.roleType === 1) {
this.companyService.selectCompanyList({ pageNum: 1, pageSize: 999 }, data => {
this.companyArray = data['return_data']['list'];
});
}
// 查询订单状态数据
this.commonsService.getDictionary('ORDER_OIL_STATUS', data => {
this.orderStatusArray = data['return_data'];
});
this.getRequest(true, this.searchForm.value);
}
// 查询列表
public getRequest(reset: boolean = false, whereObject: object) {
this.loading = true;
if (reset) {
this.pageNum = 1;
}
whereObject['pageNum'] = this.pageNum;
whereObject['pageSize'] = this.pageSize;
this.thirdPartyOrder.getOrderList(whereObject, data => {
this.loading = false;
if (data['return_code'] === '000000') {
console.log(data);
this.requestData = data['return_data'].list;
this.total = data['return_data'].total;
} else {
this.message.error(data['return_msg']);
}
});
}
// 展示订单详情
public showOrderDetail(orderNo: string) {
this.orderDetailModal = true;
this.orderDetailModalLoading = true;
this.thirdPartyOrder.getOrderDetail(orderNo, data => {
if (data['return_code'] === '000000') {
this.orderDetailObject = data['return_data'];
} else {
this.message.error(data['return_msg']);
}
this.orderDetailModalLoading = false;
});
}
// 导出数据
public excelOrder(whereObject) {
this.loadingObject.status = true;
this.loadingObject.title = '数据导出中...';
this.thirdPartyOrder.exportThirdPartyOrderList(whereObject, data => {
if (data['return_code'] === '000000') {
window.location.href = this.FILE_URL + 'temporary/' + data['return_data'];
} else {
this.message.error(data['return_msg']);
}
this.loadingObject.status = false;
});
}
}

272
src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.html
Unescape View File

@ -0,0 +1,272 @@
<!-- start 面包屑 -->
<app-breadcrumb></app-breadcrumb>
<!-- end 面包屑 -->
<nz-spin [nzSpinning]="loadingObject.status" [nzTip]="loadingObject.title">
<!-- start 搜索条件 -->
<div [@openClose]="isCollapse ? 'open' : 'closed'">
<div class="inner-content">
<form nz-form [formGroup]="searchForm" (ngSubmit)="getRequest(true , searchForm.value)">
<div nz-row>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">交易单号</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="orderNo" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">客户电话</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="memPhone" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">交易状态</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select formControlName="orderStatus" nzAllowClear>
<nz-option *ngFor="let item of orderStatusArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
</div>
<div nz-row *ngIf="isCollapse">
<div nz-col nzSpan="8" *ngIf="roleType == 0 || roleType == 1">
<nz-form-item>
<nz-form-label [nzSpan]="8">分公司</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select nzShowSearch formControlName="companyId" nzAllowClear>
<nz-option *ngFor="let item of companyArray" nzValue="{{item['id']}}" nzLabel="{{item['name']}}"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付方式</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-select nzAllowClear formControlName="payType">
<nz-option nzValue="1" nzLabel="支付宝"></nz-option>
<nz-option nzValue="2" nzLabel="微信"></nz-option>
<nz-option nzValue="3" nzLabel="积分抵扣"></nz-option>
<nz-option nzValue="4" nzLabel="汇联通工会卡"></nz-option>
<nz-option nzValue="5" nzLabel="银联"></nz-option>
<nz-option nzValue="6" nzLabel="银联分期"></nz-option>
<nz-option nzValue="7" nzLabel="嗨森逛油卡"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付卡号</nz-form-label>
<nz-form-control [nzSpan]="14">
<input nz-input formControlName="memCardNo" />
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">支付时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="payTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">创建时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="createTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col nzSpan="8">
<nz-form-item>
<nz-form-label [nzSpan]="8">退款时间</nz-form-label>
<nz-form-control [nzSpan]="14">
<nz-range-picker
[nzShowTime]="{ nzHideDisabledOptions: true }"
formControlName="refundTimeArray"
nzFormat="yyyy-MM-dd HH:mm:ss"
></nz-range-picker>
</nz-form-control>
</nz-form-item>
</div>
</div>
<div nz-row>
<div nz-col nzSpan="24" class="search-button">
<button nz-button nzType="primary"><i nz-icon nzType="search" nzTheme="outline"></i>搜索</button>
<button nz-button nzType="default" (click)="searchForm.reset();"><i nz-icon nzType="reload" nzTheme="outline"></i>重置</button>
<a class="collapse" (click)="isCollapse = !isCollapse;">{{!isCollapse ? '更多条件' : '隐藏条件'}}<i nz-icon [nzType]="!isCollapse ? 'down' : 'up'"></i></a>
</div>
</div>
</form>
</div>
</div>
<!-- end 搜索条件 -->
<!--列表数据-->
<div class="inner-content">
<span>共计 {{total?total:0}} 条数据</span>
<div class="operating-button">
<button nz-button nzType="primary" class="right-btn" (click)="excelOrder(searchForm.value)" ><i nz-icon nzType="export" nzTheme="outline"></i>导出Excel</button>
</div>
<!--数组表格 -->
<nz-table #basicTable
nzShowPagination
nzShowSizeChanger
nzBordered
[nzData]="requestData"
[nzTotal]="total"
[nzLoading]="loading"
[nzFrontPagination]="false"
[(nzPageIndex)]="pageNum"
[(nzPageSize)]="pageSize"
(nzPageIndexChange)="getRequest(false , searchForm.value)"
(nzPageSizeChange)="getRequest(false , searchForm.value)"
[nzPageSizeOptions]="[10,20,50,100]"
[nzScroll]="{ x: '1200px'}">
<thead>
<tr>
<th nzWidth="200px">交易单号</th>
<th nzWidth="130px">客户电话</th>
<th nzWidth="200px">订单名称</th>
<th nzWidth="100px">订单金额</th>
<th nzWidth="100px">支付金额</th>
<th nzWidth="100px">支付方式</th>
<th nzWidth="140px">支付卡号</th>
<th nzWidth="100px">订单状态</th>
<th nzWidth="180px">创建时间</th>
<th nzWidth="110px" nzRight="0px">操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data;let i = index">
<td>{{data.orderNo}}</td>
<td>{{data.memPhone}}</td>
<td>{{data.title}}</td>
<td>￥{{data.totalPrice}}</td>
<td>￥{{data.payPrice}}</td>
<td>{{data.orderStatus == 1 || data.orderStatus == 5 ? '未支付' : data.payType | orderPayType}}</td>
<td>{{data.memCardNo}}</td>
<td>{{data.orderStatus | orderStatus}}</td>
<td>{{data.createTime | date : 'yyyy-MM-dd HH:mm:ss'}}</td>
<td nzRight="0px" class="table-td-operation">
<a nz-dropdown [nzDropdownMenu]="menu"> 操作列表 <i nz-icon nzType="down"></i> </a>
<nz-dropdown-menu #menu="nzDropdownMenu">
<ul nz-menu nzSelectable>
<li nz-menu-item (click)="showOrderDetail(data.orderNo)"><a>详情</a></li>
</ul>
</nz-dropdown-menu>
</td>
</tr>
</tbody>
</nz-table>
</div>
</nz-spin>
<nz-modal [(nzVisible)]="orderDetailModal" nzTitle="交易详情" (nzOnCancel)="orderDetailModal = false" [nzFooter]="null"
nzWidth="1000px" [nzBodyStyle]=" { padding: '20px 20px 30px 20px'}">
<nz-spin [nzSpinning]="orderDetailModalLoading">
<nz-tabset [nzType]="'card'">
<nz-tab nzTitle="订单信息">
<nz-descriptions nzBordered [nzColumn]="2" [nzSize]="'middle'">
<nz-descriptions-item nzTitle="交易订单号">{{orderDetailObject.tradeOrder.orderNo}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="第三方交易号">{{orderDetailObject.tradeOrder.paySerialNo!=null?orderDetailObject.tradeOrder.paySerialNo:'无'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="客户手机号">{{orderDetailObject.tradeOrder.memPhone}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="交易状态">{{orderDetailObject.tradeOrder.orderStatus | orderStatus}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="支付方式">{{orderDetailObject.tradeOrder.payType | orderPayType}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="支付卡号" *ngIf="orderDetailObject.tradeOrder.payType == 4 || orderDetailObject.tradeOrder.payType == 7">
{{orderDetailObject.tradeOrder.memCardNo}}
</nz-descriptions-item>
<nz-descriptions-item nzTitle="优惠券">{{orderDetailObject.tradeOrder.memDiscountName?orderDetailObject.tradeOrder.memDiscountName:'无'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="返利">{{orderDetailObject.tradeOrder.whetherRebate?'是':'否'}}</nz-descriptions-item>
<nz-descriptions-item nzTitle="备注">{{orderDetailObject.tradeOrder.remarks}}</nz-descriptions-item>
</nz-descriptions>
</nz-tab>
<nz-tab nzTitle="支付信息">
<nz-descriptions nzBordered [nzColumn]="3" [nzSize]="'middle'">
<nz-descriptions-item nzTitle="交易总额" >{{orderDetailObject.tradeOrder.totalPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="总优惠" >{{orderDetailObject.tradeOrder.totalDeductionPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="产品优惠金额" >{{orderDetailObject.tradeOrder.deductionProductPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="优惠券优惠" >{{orderDetailObject.tradeOrder.deductionCouponPrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="应付金额" >{{orderDetailObject.tradeOrder.payablePrice}} 元</nz-descriptions-item>
<nz-descriptions-item nzTitle="积分抵扣" >{{orderDetailObject.tradeOrder.payGold / 100}} 元 </nz-descriptions-item>
<nz-descriptions-item nzTitle="实付金额" >
{{orderDetailObject.tradeOrder.payRealPrice!=null?orderDetailObject.tradeOrder.payRealPrice+' 元':'未支付'}}
</nz-descriptions-item>
</nz-descriptions>
</nz-tab>
<nz-tab nzTitle="订单时间">
<nz-card>
<nz-timeline>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.createTime != null">
<p>创建时间：{{orderDetailObject.tradeOrder.createTime | date : 'yyyy-MM-dd HH:mm:ss'}}</p>
<p>备注：{{orderDetailObject.tradeOrder.remarks?orderDetailObject.tradeOrder.remarks:'无'}}</p>
</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.cancelTime != null">
<p>取消时间：{{orderDetailObject.tradeOrder.cancelTime | date : 'yyyy-MM-dd HH:mm:ss'}}</p>
<p>备注：{{orderDetailObject.tradeOrder.cancelRemarks?orderDetailObject.tradeOrder.cancelRemarks:'无'}}</p>
</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.payTime != null">支付时间：{{orderDetailObject.tradeOrder.payTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.finishTime != null">完成时间：{{orderDetailObject.tradeOrder.finishTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
<nz-timeline-item *ngIf="orderDetailObject.tradeOrder.refundTime != null">退款时间：{{orderDetailObject.tradeOrder.refundTime | date : 'yyyy-MM-dd HH:mm:ss'}}</nz-timeline-item>
</nz-timeline>
</nz-card>
</nz-tab>
<nz-tab nzTitle="产品信息">
<nz-table nzBordered #childOrder [nzData]="orderDetailObject.tradeOrder.highChildOrderList" [nzHideOnSinglePage]="true">
<thead>
<tr>
<th nzWidth="80px">产品类型</th>
<th nzWidth="150px">门店</th>
<th nzWidth="100px">产品图片</th>
<th nzWidth="150px">产品名称</th>
<th nzWidth="20px">数量</th>
<th nzWidth="20px">单价</th>
<th nzWidth="20px">总价</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of childOrder.data">
<td>{{ data.goodsType | orderChildGoodsType}}</td>
<td>{{ data.storeName}}</td>
<td><img src="{{data.goodsImg}}" alt=""></td>
<td>
{{ data.goodsName }}
<nz-tag *ngIf="data.giveawayType == 1" [nzColor]="'magenta'">赠品</nz-tag>
</td>
<td>{{ data.saleCount }}</td>
<td>{{ data.goodsActualPrice }} 元</td>
<td>{{ data.totalActualPrice }} 元</td>
</tr>
</tbody>
</nz-table>
</nz-tab>
</nz-tabset>
</nz-spin>
</nz-modal>

3
src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.scss
Unescape View File

@ -0,0 +1,3 @@
img {
width: 60px;
}

163
src/app/admin/order-manage/starbucks-order/starbucks-order-list/starbucks-order-list.component.ts
Unescape View File

@ -0,0 +1,163 @@
import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormGroup} from '@angular/forms';
import {ADMIN_INFO_OBJECT} from '../../../../services/local-storage.namespace';
import {LocalStorageService} from '../../../../services/local-storage.service';
import {CompanyService} from '../../../../services/company.service';
import {CommonsService} from '../../../../services/commons.service';
import {animate, state, style, transition, trigger} from '@angular/animations';
import {NzMessageService} from 'ng-zorro-antd';
import {OrderThirdPartyService} from '../../../../services/order/order-third-party.service';
import {environment} from "../../../../../environments/environment";
@Component({
selector: 'app-starbucks-order-list',
animations: [
trigger('openClose', [
state('open', style({
height: '260px',
opacity: 1,
backgroundColor: 'white'
})),
state('closed', style({
opacity: 1,
backgroundColor: 'white'
})),
transition('open => closed', [
animate('0.3s')
]),
transition('closed => open', [
animate('0.3s')
]),
]),
],
templateUrl: './starbucks-order-list.component.html',
styleUrls: ['./starbucks-order-list.component.scss']
})
export class StarbucksOrderListComponent implements OnInit {
// 搜索框
searchForm: FormGroup;
// 搜索框折叠
isCollapse = false;
// 订单状态数据
orderStatusArray = [];
// 公司数据
companyArray = [];
// 角色类型
roleType: number;
// 列表相关参数
// 总条数
total: number;
// 页码
pageNum = 1;
// 条码
pageSize = 10;
// 列表数据
requestData = [];
// 列表加载
loading = true;
// 订单详情相关参数
// 详情模态框
orderDetailModal = false;
// 详情模态框数据等待
orderDetailModalLoading = false;
// 订单详情数据
orderDetailObject: any = {
tradeOrder: {},
};
// 数据加载中参数
loadingObject = {
title: '加载中...',
status: false,
};
// 请求地址参数
FILE_URL = environment.imageUrl;
constructor(
private form: FormBuilder,
private store: LocalStorageService,
private message: NzMessageService,
private thirdPartyOrder: OrderThirdPartyService,
private companyService: CompanyService,
private commonsService: CommonsService,
) { }
ngOnInit(): void {
// 搜索表单初始化
this.searchForm = this.form.group({
orderNo: [null],
memPhone: [null],
payTimeArray: [null],
orderStatus: [null],
createTimeArray: [null],
refundTimeArray: [null],
companyId: [null],
payType: [null],
memCardNo: [null],
productType: [1],
});
// 角色类型初始化
this.roleType = Number(this.store.get(ADMIN_INFO_OBJECT)['secRole'].roleType);
// 查询公司列表
if (this.roleType === 0 || this.roleType === 1) {
this.companyService.selectCompanyList({ pageNum: 1, pageSize: 999 }, data => {
this.companyArray = data['return_data']['list'];
});
}
// 查询订单状态数据
this.commonsService.getDictionary('ORDER_OIL_STATUS', data => {
this.orderStatusArray = data['return_data'];
});
this.getRequest(true, this.searchForm.value);
}
// 查询列表
public getRequest(reset: boolean = false, whereObject: object) {
this.loading = true;
if (reset) {
this.pageNum = 1;
}
whereObject['pageNum'] = this.pageNum;
whereObject['pageSize'] = this.pageSize;
this.thirdPartyOrder.getOrderList(whereObject, data => {
this.loading = false;
if (data['return_code'] === '000000') {
console.log(data);
this.requestData = data['return_data'].list;
this.total = data['return_data'].total;
} else {
this.message.error(data['return_msg']);
}
});
}
// 展示订单详情
public showOrderDetail(orderNo: string) {
this.orderDetailModal = true;
this.orderDetailModalLoading = true;
this.thirdPartyOrder.getOrderDetail(orderNo, data => {
if (data['return_code'] === '000000') {
this.orderDetailObject = data['return_data'];
} else {
this.message.error(data['return_msg']);
}
this.orderDetailModalLoading = false;
});
}
// 导出数据
public excelOrder(whereObject) {
this.loadingObject.status = true;
this.loadingObject.title = '数据导出中...';
this.thirdPartyOrder.exportThirdPartyOrderList(whereObject, data => {
if (data['return_code'] === '000000') {
window.location.href = this.FILE_URL + 'temporary/' + data['return_data'];
} else {
this.message.error(data['return_msg']);
}
this.loadingObject.status = false;
});
}
}
Write Preview
Loading…
Cancel
Save