提交修改自建站

src/app/admin/index/test/test.component.html

@@ -0,0 +1,30 @@
+<!--<section>-->
+<!--    大家好!我是:{{currentUser}}-->
+<!--</section>-->
+<!--<section *ngFor="let msg of messages">-->
+<!--    <section>{{msg}}</section>-->
+<!--</section>-->
+<!--<section>-->
+<!--    当前登录用户:{{users}}-->
+<!--</section>-->
+<!--<section>-->
+<!--    <label>-->
+<!--        <select name="type" [(ngModel)]="type">-->
+<!--            <option value="all">发送给所有人</option>-->
+<!--            <option value="single">发送给个人</option>-->
+<!--        </select>-->
+<!--    </label>-->
+<!--</section>-->
+<!--<section>-->
+<!--    <label *ngIf="type === 'single'">-->
+<!--        <select name="user" [(ngModel)]="sendToUser">-->
+<!--            <option *ngFor="let person of users" [value]="person">{{person}}</option>-->
+<!--        </select>-->
+<!--    </label>-->
+<!--</section>-->
+<!--<p *ngIf="error">{{error | json}}</p>-->
+<!--<p *ngIf="completed">completed!</p>-->
+<!--<label>-->
+<!--    <input type="text" [(ngModel)]="message">-->
+<!--</label>-->
+<!--<button (click)="send()">发送</button>-->

src/app/admin/index/test/test.component.ts

@@ -0,0 +1,71 @@
+import { Component, OnInit } from '@angular/core';
+import {ActivatedRoute} from '_@angular_router@9.0.7@@angular/router';
+import {Params} from '@angular/router';
+import {WebsocketService} from '../../../services/websocket.service';
+
+export enum SEND_TYPE {
+    ALL = 'all',
+    SINGLE = 'single'
+}
+@Component({
+  selector: 'app-test',
+  templateUrl: './test.component.html',
+  styleUrls: ['./test.component.scss']
+})
+export class TestComponent implements OnInit {
+
+    messages = [];                      // 消息列表
+    message;                            // 发送的消息内容
+    error: any;                         // 异常信息
+    completed = false;                  // 发送完成
+    type = SEND_TYPE.ALL;               // 默认类型发送给所有人
+    users = [];                         // 登陆的用户
+    sendToUser;                         // 需要发送消息的用户
+    currentUser;                        // 当前用户
+
+    constructor(
+        private webSocketService: WebsocketService,
+        private activatedRoute: ActivatedRoute
+    ) {
+
+        this.activatedRoute.queryParams.subscribe(queryParams => {
+            console.log(queryParams.id);
+            this.currentUser = queryParams.id;
+        });
+    }
+
+    ngOnInit(): void {
+        console.log(this.currentUser);
+        // 连接websocket
+        // this.webSocketService.connect(`ws://139.159.177.244:9302/brest/WebSocket/` + this.currentUser);
+        // 接收消息
+        this.webSocketService.messageSubject.subscribe(
+            data => {
+                // 如果是用户登陆,则添加到登陆列表中
+                if (data.users) {
+                    this.users = data.users;
+                } else {
+                    // 否则添加到消息列表
+                    this.messages.push(data.msg);
+                }
+            },
+            err => this.error = err,
+            () => this.completed = true
+        );
+    }
+
+    // send() {
+    //     // 创建消息对象
+    //     const msg = {
+    //         msg: this.message,                                                    // 消息内容
+    //         type: this.type === SEND_TYPE.ALL ? SEND_TYPE.ALL : SEND_TYPE.SINGLE, // 类型
+    //         to: this.type === SEND_TYPE.SINGLE ? this.sendToUser : undefined            // 要发送的对象
+    //     };
+    //     // 发送
+    //     this.webSocketService.sendMessage(JSON.stringify(msg));
+    //     // 发送完成,情况message内容
+    //     this.message = '';
+    // }
+
+
+}

src/app/admin/merchant-store/oli-gun/oli-gun.component.html

@@ -0,0 +1 @@
+<p>oli-gun works!</p>

src/app/admin/merchant-store/oli-gun/oli-gun.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OliGunComponent } from './oli-gun.component';
+
+describe('OliGunComponent', () => {
+  let component: OliGunComponent;
+  let fixture: ComponentFixture<OliGunComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ OliGunComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OliGunComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin/merchant-store/oli-gun/oli-gun.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-oli-gun',
+  templateUrl: './oli-gun.component.html',
+  styleUrls: ['./oli-gun.component.scss']
+})
+export class OliGunComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/admin/merchant-store/oli/oli.component.html

@@ -0,0 +1,149 @@
+<!-- start 面包屑 -->
+<app-breadcrumb></app-breadcrumb>
+<!-- end 面包屑 -->
+
+<!--条件搜索-->
+<div class="inner-content">
+    <span>共计 {{total}} 条数据</span>
+    <div class="operating-button">
+        <button nz-button nzType="primary" class="right-btn" (click)="isVisible = true">编辑</button>
+    </div>
+
+    <nz-table
+            class="table"
+            #ajaxTable
+            nzShowSizeChanger
+            [nzFrontPagination]="false"
+            [nzData]="requestData"
+            [nzLoading]="loading"
+            [nzTotal]="total"
+            [(nzPageIndex)]="pageNum"
+            [(nzPageSize)]="pageSize"
+            [nzScroll]="{ x: '1200px' }"
+            (nzPageIndexChange)="getRequest(false , {})"
+            (nzPageSizeChange)="getRequest(false , {})">
+        <thead nzSingleSort>
+        <tr>
+            <th nzWidth="50px">编号</th>
+            <th nzWidth="80px">油品类型</th>
+            <th nzWidth="80px">油品</th>
+            <th nzWidth="80px">国标价</th>
+            <th nzWidth="100px">油站价</th>
+            <th nzWidth="100px">优惠价</th>
+            <th nzWidth="100px">优惠幅度</th>
+            <th nzWidth="160px" nzRight="0px">操作</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr *ngFor="let data of ajaxTable.data; let i = index">
+            <td>{{i + 1}}</td>
+            <td>{{data.oilTypeName}}</td>
+            <td>{{data.oilNoName}}</td>
+            <td>{{data.priceOfficial == null ? '暂无' : '¥' + data.priceOfficial}}</td>
+            <td>{{data.priceGun == null ? '暂无' : '¥' + data.priceGun}}</td>
+            <td>{{data.priceVip == null ? '暂无' : '¥' + data.priceVip}}</td>
+            <td>{{data.preferentialMargin == null ? '暂无' : '¥' + data.preferentialMargin}}</td>
+            <td nzRight="0px" class="table-td-operation">
+                <a (click)="getGunNoListByOilPrice(data.id)">查看油枪</a>
+                <nz-divider nzType="vertical"></nz-divider>
+                <a (click)="getGasOilPrice(data.id)">配置油枪</a>
+                <nz-divider nzType="vertical"></nz-divider>
+                <a (click)="getDelete(data.oilNo)">删除</a>
+            </td>
+        </tbody>
+    </nz-table>
+</div>
+
+<nz-modal [(nzVisible)]="isVisible" nzTitle="编辑油品" (nzOnCancel)="isVisible = false" (nzOnOk)="editGasOilPrice()"
+          nzWidth="700px">
+    <div nz-row>
+        <div nz-col nzSpan="18">
+            <nz-form-item>
+                <nz-form-label [nzSpan]="6">油品</nz-form-label>
+                <nz-form-control [nzSpan]="16">
+                    <nz-select [(ngModel)]="oilNo" nzAllowClear (ngModelChange)="getOilPriceDetail($event)"
+                               nzPlaceHolder="请选择油品">
+                        <nz-option *ngFor="let item  of gasOilType" [nzValue]="item.codeValue"
+                                   nzLabel="{{item.codeName}}"></nz-option>
+                    </nz-select>
+                </nz-form-control>
+            </nz-form-item>
+        </div>
+    </div>
+    <form nz-form [formGroup]="validateForm" class="login-form">
+        <div nz-row>
+            <div nz-col nzSpan="18">
+                <nz-form-item>
+                    <nz-form-label [nzSpan]="6">油枪价</nz-form-label>
+                    <nz-form-control [nzSpan]="16">
+                        <input nz-input formControlName="priceGun" placeholder="请输入油枪价..."/>
+                    </nz-form-control>
+                </nz-form-item>
+            </div>
+            <div nz-col nzSpan="18">
+                <nz-form-item>
+                    <nz-form-label [nzSpan]="6">优惠幅度</nz-form-label>
+                    <nz-form-control [nzSpan]="16">
+                        <nz-input-number
+                                style="width: 300px"
+                                formControlName="preferentialMargin"
+                                [nzMin]="0"
+                                [nzMax]="100"
+                                [nzPrecision]="2"
+                                nzPrecisionMode="cut"
+                                nzPlaceHolder="请输入优惠幅度!"
+                                [nzFormatter]="formatterPercent"
+                                [nzParser]="parserPercent"
+                        ></nz-input-number>
+                    </nz-form-control>
+                </nz-form-item>
+            </div>
+        </div>
+    </form>
+
+</nz-modal>
+
+<nz-modal [(nzVisible)]="oilGunVisible" nzTitle="油枪列表" (nzOnCancel)="oilGunVisible = false" nzWidth="900px" (nzOnOk)="oilGunVisible= false">
+    <nz-table #errorStudentTable [nzData]="oilGunList">
+        <thead>
+        <tr>
+            <th nzWidth="80px">序号</th>
+            <th nzWidth="150px">油枪号</th>
+            <th nzWidth="150px">油号类型</th>
+            <th nzWidth="150px">油号</th>
+            <th nzWidth="80px">操作</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr *ngFor="let data of errorStudentTable.data;let i = index">
+            <td>{{ i + 1}}</td>
+            <td>{{data.gunNo}}</td>
+            <td>{{data.oilTypeName}}</td>
+            <td>{{data.oilNo}}</td>
+            <td>
+                <a (click)="delGunNo(data.id)">删除</a>
+            </td>
+        </tr>
+        </tbody>
+    </nz-table>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="oilVisible" nzTitle="配置油枪" (nzOnCancel)="oilVisible = false"  (nzOnOk)="addGasOilPrice()">
+    <div nz-row>
+        <div nz-col nzSpan="18">
+            <nz-form-item>
+                <nz-form-label [nzSpan]="6">油枪号</nz-form-label>
+                <nz-form-control [nzSpan]="16">
+                    <nz-input-number
+                            style="width: 300px"
+                            [(ngModel)]="gunNo"
+                            [nzMin]="1"
+                            [nzMax]="10000"
+                            nzPlaceHolder="请输入油枪号!"
+                    ></nz-input-number>
+                </nz-form-control>
+            </nz-form-item>
+        </div>
+    </div>
+</nz-modal>
+

src/app/admin/merchant-store/oli/oli.component.ts

@@ -0,0 +1,213 @@
+import {Component, OnInit} from '@angular/core';
+import {FormBuilder, FormGroup, Validators} from '_@angular_forms@9.0.7@@angular/forms';
+import {environment} from '../../../../environments/environment';
+import {MerchantStoreService} from '../../../services/merchant-store.service';
+import {IconService} from '../../../services/icon.service';
+import {NzMessageService, NzModalService} from '_ng-zorro-antd@9.3.0@ng-zorro-antd';
+import {ActivatedRoute, Router} from '_@angular_router@9.0.7@@angular/router';
+import {CommonsService} from '../../../services/commons.service';
+import {ADMIN_INFO_OBJECT} from '../../../services/local-storage.namespace';
+import {LocalStorageService} from '../../../services/local-storage.service';
+
+@Component({
+    selector: 'app-oli',
+    templateUrl: './oli.component.html',
+    styleUrls: ['./oli.component.scss']
+})
+export class OliComponent implements OnInit {
+    validateForm!: FormGroup;
+    requestData = []; // 列表数据
+    total: number; // 页码
+    pageNum = 1; // 页码
+    pageSize = 10; // 条码
+    loading = true;
+    id = null;
+    name: string;
+    WEB_SERVE_URL = environment.baseUrl;
+    isVisible = false;
+    oilGunVisible = false;
+    oilVisible = false;
+    gasOilType = [];
+    oilGunList = [];
+    oilNo;
+    gunNo;
+    formatterPercent = (value: number) => `¥ ${value == null ? 0 : value}`;
+    parserPercent = (value: string) => value.replace('¥ ', '');
+
+    constructor(
+        private form: FormBuilder,
+        private merchantStore: MerchantStoreService,
+        private iconService: IconService,
+        private message: NzMessageService,
+        private store: LocalStorageService, // 数据请求
+        private router: Router,
+        private fb: FormBuilder,
+        private commonsService: CommonsService,
+        private modal: NzModalService,
+        private activatedRoute: ActivatedRoute,
+        private common: CommonsService
+    ) {
+    }
+
+    ngOnInit(): void {
+        this.init();
+        this.validateForm = this.fb.group({
+            storeId: [this.store.get(ADMIN_INFO_OBJECT)['merchantStore'].id, [Validators.required]],
+            priceGun: [null, [Validators.required]],
+            preferentialMargin: [0],
+
+        });
+    }
+
+    public init(): void {
+        this.commonsService.getDictionary('GAS_OIL_TYPE', data => {
+            this.gasOilType = data['return_data'];
+        });
+        this.getRequest(true, {});
+    }
+
+
+    // 查询列表
+    public getRequest(reset: boolean = false, whereObject: object) {
+
+        this.loading = false;
+        if (reset) {
+            this.pageNum = 1;
+        }
+        whereObject['storeId'] = this.store.get(ADMIN_INFO_OBJECT)['merchantStore'].id;
+        this.merchantStore.getOilPriceListByStore(whereObject, data => {
+            if (data['return_code'] === '000000') {
+                this.requestData = data['return_data'];
+                this.total = data['return_data'].length;
+            } else {
+                this.message.error(data['return_msg']);
+            }
+        });
+
+
+    }
+
+
+    // 是否删除油品
+    public getDelete(oilNo): void {
+        const message = '是否删除油品';
+        this.common.showConfirm(message, data => {
+            if (data) {
+                this.merchantStore.delOilPrice({
+                    storeId: this.store.get(ADMIN_INFO_OBJECT)['merchantStore'].id,
+                    oilNo: oilNo
+                }, dataReturn => {
+                    if (dataReturn['return_code'] === '000000') {
+                        this.message.success('操作成功');
+                        this.getRequest(false, {});
+                    } else {
+                        this.message.warning(dataReturn['return_msg']);
+                    }
+                });
+            }
+        });
+    }
+
+    // 编辑油品
+    public editGasOilPrice(): void {
+        if (this.oilNo == null) {
+            this.message.error('请选择油品！');
+            return;
+        }
+
+        // tslint:disable-next-line:forin
+        for (const i in this.validateForm.controls) {
+            this.validateForm.controls[i].markAsDirty();
+            this.validateForm.controls[i].updateValueAndValidity();
+            if (this.validateForm.controls[i].errors != null) {
+                this.message.error('必填项不能为空');
+                return;
+            }
+        }
+        if (this.validateForm.value.preferentialMargin == null) {
+            this.validateForm.value.preferentialMargin = 0;
+        }
+        this.validateForm.value.oilNo = this.oilNo;
+        this.merchantStore.editGasOilPrice(this.validateForm.value, data => {
+            if (data['return_code'] === '000000') {
+                this.isVisible = false;
+                this.getRequest(true, {});
+                this.message.success('编辑成功');
+            } else {
+                this.message.warning(data['return_msg']);
+            }
+        });
+    }
+
+    // 获取油站油品价格
+    public getOilPriceDetail(e): void {
+        const whereObject = {
+            storeId: this.store.get(ADMIN_INFO_OBJECT)['merchantStore'].id,
+            oilNo: e
+        };
+        this.merchantStore.getOilPriceDetail(whereObject, data => {
+            if (data['return_code'] === '000000') {
+                this.validateForm.patchValue(data['return_data']);
+            } else {
+                this.message.warning(data['return_msg']);
+            }
+
+        });
+    }
+
+    // 配置油品油枪
+    public getGunNoListByOilPrice(id): void {
+        this.id = id;
+        this.merchantStore.getGunNoListByOilPrice(id , data => {
+            if (data['return_code'] === '000000') {
+                this.oilGunList = data['return_data'];
+                this.oilGunVisible = true;
+            } else {
+                this.message.warning(data['return_msg']);
+            }
+        });
+    }
+
+    // 是否删除油枪列表
+    public delGunNo(id): void {
+        const message = '是否删除油枪';
+        this.common.showConfirm(message, data => {
+            if (data) {
+                this.merchantStore.delGunNo({
+                    gunNoId: id
+                }, dataReturn => {
+                    if (dataReturn['return_code'] === '000000') {
+                        this.message.success('操作成功');
+                        this.getGunNoListByOilPrice(this.id);
+                    } else {
+                        this.message.warning(dataReturn['return_msg']);
+                    }
+                });
+            }
+        });
+    }
+
+    // 配置油枪号
+    public addGasOilPrice(): void {
+        if (this.gunNo == null) {
+            this.message.error('请输入油枪号');
+            return;
+        }
+        this.merchantStore.addGasOilPrice({
+            oilPriceId: this.id,
+            gunNo: this.gunNo
+        } , data => {
+            if (data['return_code'] === '000000') {
+                this.message.success('操作成功');
+                this.oilVisible = false;
+            } else {
+                this.message.warning(data['return_msg']);
+            }
+        });
+    }
+
+    public getGasOilPrice(id): void {
+        this.id = id;
+        this.oilVisible = true;
+    }
+}

src/app/admin/order/oil-station-order/oil-station-order.component.html

@@ -0,0 +1,141 @@
+<!-- start 面包屑 -->
+<app-breadcrumb></app-breadcrumb>
+<!-- end 面包屑 -->
+
+<!--条件搜索-->
+<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]="6">订单号</nz-form-label>
+                    <nz-form-control [nzSpan]="16">
+                        <input nz-input formControlName="orderNo"/>
+                    </nz-form-control>
+                </nz-form-item>
+            </div>
+            <div nz-col nzSpan="8">
+                <nz-form-item>
+                    <nz-form-label [nzSpan]="6">状态</nz-form-label>
+                    <nz-form-control [nzSpan]="16">
+                        <nz-select nzShowSearch nzAllowClear nzPlaceHolder="请选择订单状态" formControlName="status">
+                            <nz-option nzLabel="待支付" nzValue="1"></nz-option>
+                            <nz-option nzLabel="已支付" nzValue="2"></nz-option>
+                            <nz-option nzLabel="已完成" nzValue="3"></nz-option>
+                            <nz-option nzLabel="已退款" nzValue="4"></nz-option>
+                            <nz-option nzLabel="已取消" nzValue="5"></nz-option>
+                            <nz-option nzLabel="退款中" nzValue="6"></nz-option>
+                        </nz-select>
+                    </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)="resetForm()"><i nz-icon nzType="reload"
+                                                                            nzTheme="outline"></i>重置
+                </button>
+            </div>
+        </div>
+    </form>
+</div>
+
+
+<div class="inner-content">
+    <span>共计 {{total}} 条数据</span>
+    <nz-table
+            class="table"
+            #ajaxTable
+            nzShowSizeChanger
+            [nzFrontPagination]="false"
+            [nzData]="requestData"
+            [nzLoading]="loading"
+            [nzTotal]="total"
+            [(nzPageIndex)]="pageNum"
+            [(nzPageSize)]="pageSize"
+            [nzScroll]="{ x: '1200px' }"
+            (nzPageIndexChange)="getRequest(false , searchForm.value)"
+            (nzPageSizeChange)="getRequest(false , searchForm.value)">
+        <thead nzSingleSort>
+        <tr>
+            <th nzWidth="50px">编号</th>
+            <th nzWidth="180px">订单号</th>
+            <th nzWidth="180px">油站名称</th>
+            <th nzWidth="180px">油站地址</th>
+            <th nzWidth="80px">类型</th>
+            <th nzWidth="180px">油号</th>
+            <th nzWidth="180px">油枪号</th>
+            <th nzWidth="180px">油枪价</th>
+            <th nzWidth="180px">优惠价</th>
+            <th nzWidth="120px">加油升数</th>
+            <th nzWidth="120px">创建时间</th>
+            <th nzRight nzWidth="90px">加油金额</th>
+            <th nzRight nzWidth="90px">支付金额</th>
+            <th nzRight nzWidth="90px">优惠金额</th>
+            <th nzRight nzWidth="90px">状态</th>
+            <th nzWidth="120px" nzRight>操作</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr *ngFor="let data of ajaxTable.data; let i = index">
+            <td>{{i + 1}}</td>
+            <td>{{data.orderNo}}</td>
+            <td>{{data.gasName}}</td>
+            <td>{{data.gasAddress}}</td>
+            <td>{{data.gasOilType == 1 ? '汽油': '柴油'}}</td>
+            <td>{{data.gasOilNo}}</td>
+            <td>{{data.gasGunNo}}</td>
+            <td>{{data.gasPriceGun}}</td>
+            <td>{{data.gasPricePreferences}}</td>
+            <td>{{data.gasOilLiters}}</td>
+            <td>{{data.createTime | date: 'yyyy-MM-dd HH:mm:ss'}}</td>
+            <td nzRight>{{data.totalPrice}}</td>
+            <td nzRight>{{data.payRealPrice}}</td>
+            <td nzRight>{{data.deductionPrice}}</td>
+            <td nzRight>{{data.status | orderCouponStatus}}</td>
+            <td nzRight class="table-td-operation">
+                <a (click)="getDetail(data.orderNo)">详情</a>
+                <nz-divider *ngIf="data.status == 2 || data.status == 3 "  nzType="vertical" ></nz-divider>
+                <a *ngIf="data.status == 2 || data.status == 3 " (click)="showModal(data.orderId)">退款</a>
+            </td>
+        </tbody>
+    </nz-table>
+</div>
+
+
+<nz-modal [(nzVisible)]="isVisible" nzTitle="退款理由" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
+    <nz-form-item>
+        <nz-form-label nzRequired>退款理由</nz-form-label>
+        <nz-form-control>
+            <textarea [(ngModel)]="refundContent" nz-input rows="2" placeholder="请输入退款理由"></textarea>
+        </nz-form-control>
+    </nz-form-item>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isVisibleDetail" nzTitle="订单详情" nzWidth="900"   (nzOnCancel)="isVisibleDetail= false" (nzOnOk)="isVisibleDetail= false">
+    <nz-descriptions  nzBordered [nzColumn]="{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }">
+        <nz-descriptions-item nzTitle="油站名称">{{data['gasName']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="油站地址">{{data['gasAddress']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="订单号">{{data['orderNo']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="类型">{{data['gasOilType'] == 1 ? '汽油': '柴油'}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="油号">{{data['gasOilNo']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="油枪号">{{data['gasGunNo']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="油枪价">{{data['gasPriceGun']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="优惠价">{{data['gasPricePreferences']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="加油升数">{{data['gasOilLiters']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="加油金额">{{data['totalPrice']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="支付金额">{{data['payRealPrice']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="优惠金额">{{data['deductionPrice']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="加油折扣">{{data['gasDiscount']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="加油补贴">{{data['gasOilSubsidy']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="每升优惠">{{data['gasLitersPreferences']}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="生成时间">{{data['createTime'] | date: 'yyyy-MM-dd HH:mm:ss'}}</nz-descriptions-item>
+        <nz-descriptions-item nzTitle="状态">{{data['status'] | rechargeStatus}}</nz-descriptions-item>
+        <nz-descriptions-item *ngIf="data['status'] == 4" nzTitle="退款金额">{{data['refundPrice']}}</nz-descriptions-item>
+        <nz-descriptions-item *ngIf="data['status'] == 4" nzTitle="退款时间">{{data['refundTime'] | date: 'yyyy-MM-dd HH:mm:ss'}}</nz-descriptions-item>
+        <nz-descriptions-item *ngIf="data['status'] == 4" nzTitle="退款原因">{{data['refundContent']}}</nz-descriptions-item>
+    </nz-descriptions>
+
+</nz-modal>

src/app/admin/order/oil-station-order/oil-station-order.component.ts

@@ -0,0 +1,140 @@
+import { Component, OnInit } from '@angular/core';
+import {environment} from '../../../../environments/environment';
+import {FormBuilder, FormGroup} from '_@angular_forms@9.0.7@@angular/forms';
+import {OrderService} from '../../../services/order.service';
+import {IconService} from '../../../services/icon.service';
+import {NzMessageService} from '_ng-zorro-antd@9.3.0@ng-zorro-antd';
+import {Router} from '_@angular_router@9.0.7@@angular/router';
+import {CompanyService} from '../../../services/company.service';
+import {MerchantService} from '../../../services/merchant.service';
+import {LocalStorageService} from '../../../services/local-storage.service';
+import {CommonsService} from '../../../services/commons.service';
+import {WebsocketService} from '../../../services/websocket.service';
+
+@Component({
+  selector: 'app-oil-station-order',
+  templateUrl: './oil-station-order.component.html',
+  styleUrls: ['./oil-station-order.component.scss']
+})
+export class OilStationOrderComponent implements OnInit {
+
+    WEB_SERVE_URL = environment.baseUrl;
+    FILE_URL = environment.imageUrl;
+    searchForm: FormGroup; // 搜索框
+    requestData = []; // 列表数据
+    companyData = []; // 列表数据
+    merchantData = []; // 列表数据
+    data = {}; // 列表数据
+    total: number; // 页码
+    pageNum = 1; // 页码
+    pageSize = 10; // 条码
+    loading = true;
+    id: number; // 订单ID
+    isVisible = false;
+    isVisibleDetail = false;
+    refundContent: string;
+    roleType: number;
+    constructor(
+        private form: FormBuilder,
+        private order: OrderService,
+        private webSocketService: WebsocketService,
+        private iconService: IconService,
+        private message: NzMessageService,
+        private router: Router,
+        private company: CompanyService,
+        private merchant: MerchantService,
+        private store: LocalStorageService, // 数据请求
+        private common: CommonsService
+    ) {
+    }
+
+    ngOnInit(): void {
+        this.init();
+        // 接收消息
+        this.webSocketService.messageSubject.subscribe(
+            data => {
+                console.log(data);
+                this.getRequest(true, this.searchForm.value);
+            },
+            err => console.log(err)
+        );
+    }
+
+    public init(): void {
+        this.searchForm = this.form.group({
+            orderNo: [null],
+            status: [null],
+        });
+        this.getRequest(true, this.searchForm.value);
+    }
+
+    // 查询列表
+    public getRequest(reset: boolean = false, whereObject: object) {
+
+        if (whereObject['payTime'] != null && whereObject['payTime'].length !== 0) {
+            whereObject['payTimeS'] = whereObject['payTime'][0].getTime();
+            whereObject['payTimeE'] = whereObject['payTime'][1].getTime();
+        }
+
+
+        this.loading = false;
+        if (reset) {
+            this.pageNum = 1;
+        }
+        whereObject['pageNum'] = this.pageNum;
+        whereObject['pageSize'] = this.pageSize;
+        this.order.getGasOrderListByOil(whereObject, data => {
+            if (data['return_code'] === '000000') {
+                this.requestData = data['return_data'].list;
+                this.total = data['return_data'].total;
+            } else {
+                this.message.error(data['return_msg']);
+            }
+        });
+    }
+
+    // 重置
+    public resetForm(): void {
+        this.searchForm.reset();
+    }
+
+    showModal(id): void {
+        this.id = id;
+        this.isVisible = true;
+    }
+
+    handleOk(): void {
+        this.common.showConfirm('确认订单是否退款', item => {
+            if (item) {
+                const params = {
+                    orderId: this.id ,
+                    refundContent: this.refundContent
+                };
+                this.order.refuelingOrderRefund(params, data => {
+                    if (data['return_code'] === '000000') {
+                        this.getRequest(true, this.searchForm.value);
+                        this.isVisible = false;
+                        this.message.success('退款成功');
+                    } else {
+                        this.message.error(data['return_msg']);
+                    }
+                });
+            }
+        });
+    }
+
+    handleCancel(): void {
+        this.isVisible = false;
+    }
+
+    getDetail(orderNo: string): void {
+        this.order.getGasOrderDetail(orderNo , data => {
+            if (data['return_code'] === '000000') {
+                this.isVisibleDetail = true;
+                this.data = data['return_data'];
+            } else {
+                this.message.error(data['return_msg']);
+            }
+        });
+    }
+}

src/app/pipes/store/oil-type.pipe.ts

@@ -0,0 +1,18 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'oilType'
+})
+export class OilTypePipe implements PipeTransform {
+
+    transform(value: number): string {
+        switch (value) {
+            case 1:
+                return '汽油';
+            case 2:
+                return '柴油';
+            case 3:
+                return '天然气';
+        }
+    }
+}

src/app/services/websocket.service.ts

@@ -0,0 +1,239 @@
+import {Component, Injectable} from '@angular/core';
+import {interval, Subject} from 'rxjs';
+import {NzNotificationService} from 'ng-zorro-antd';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class WebsocketService {
+
+    messageSubject;                                 // subject对象,用于发送事件
+    private url;                                    // 默认请求的url
+    private webSocket: WebSocket;                   // websocket对象
+    connectSuccess = false;                         // websocket 连接成功
+    period = 60 * 1000 * 10;                        // 10分钟检查一次
+    serverTimeoutSubscription = null;               // 定时检测连接对象
+    reconnectFlag = false;                          // 重连
+    reconnectPeriod = 5 * 1000;                     // 重连失败,则5秒钟重连一次
+    reconnectSubscription = null;                   // 重连订阅对象
+    runTimeSubscription;                            // 记录运行连接subscription
+    runTimePeriod = 60 * 10000;                     // 记录运行连接时间
+
+    constructor(private notification: NzNotificationService) {
+        this.messageSubject = new Subject();
+        console.log('开始心跳检测');
+        // 进入程序就进行心跳检测,避免出现开始就连接中断,后续不重连
+        this.heartCheckStart();
+        this.calcRunTime();
+    }
+
+    /**
+     * 发送消息
+     * @author Sum1Dream
+     * @date 2019/1/22
+     * @param message 发送消息
+     */
+    sendMessage(message) {
+        this.webSocket.send(message);
+    }
+
+    /**
+     * 创建新连接
+     * @author Sum1Dream
+     * @date 2019/1/22
+     * @param url 要连接的url
+     */
+    connect(url) {
+        if (!!url) {
+            this.url = url;
+        }
+        // 创建websocket对象
+        this.createWebSocket();
+    }
+
+    /**
+     * 创建连接
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    createWebSocket() {
+        // 如果没有建立过连接，才建立连接并且添加时间监听
+        this.webSocket = new WebSocket(this.url);
+        // 建立连接成功
+        this.webSocket.onopen = (e) => this.onOpen(e);
+        // 接收到消息
+        this.webSocket.onmessage = (e) => this.onMessage(e);
+        // 连接关闭
+        this.webSocket.onclose = (e) => this.onClose(e);
+        // 异常
+        this.webSocket.onerror = (e) => this.onError(e);
+    }
+
+    /**
+     * 连接打开
+     * @author Sum1Dream
+     * @date 2019/1/22
+     * @param e 打开事件
+     */
+    onOpen(e) {
+        console.log('websocket 已连接');
+        // 设置连接成功
+        this.connectSuccess = true;
+        // 如果是重连中
+        if (this.reconnectFlag) {
+            // 1.停止重连
+            this.stopReconnect();
+            // 2.重新开启心跳
+            this.heartCheckStart();
+            // 3.重新开始计算运行时间
+            this.calcRunTime();
+        }
+    }
+
+    /**
+     * 接受到消息
+     * @author Sum1Dream
+     * @date 2019/1/22
+     * @param event 接受消息事件
+     */
+    onMessage(event) {
+        const data = JSON.parse(event.data);
+        // 将接受到的消息发布出去
+        // console.log('接收到消息时间', new Date().getTime());
+        this.notification.success(
+            data['order']['gasName'] + '加油订单',
+            '<p>订单号：' + data['order']['orderNo'] + '</p>' +
+            '<p>加油金额：' + data['order']['totalPrice'] + '</p>' +
+            '<p>油号：' + data['order']['gasOilNo'] + '</p>' +
+            '<p>油枪号：' + data['order']['gasGunNo'] + '</p>'
+        );
+        const audio = new Audio();
+        audio.src = data['voice'];
+        audio.load();
+        audio.play().then(r => console.log(r));
+        this.messageSubject.next(true);
+    }
+
+    /**
+     * 连接关闭
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    private onClose(e) {
+        console.log('连接关闭', e);
+        this.connectSuccess = false;
+        this.webSocket.close();
+        // 关闭时开始重连
+        this.reconnect();
+        this.stopRunTime();
+        // throw new Error('webSocket connection closed:)');
+    }
+
+    /**
+     * 连接异常
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    private onError(e) {
+        // 出现异常时一定会进onClose,所以只在onClose做一次重连动作
+        console.log('连接异常', e);
+        this.connectSuccess = false;
+        // throw new Error('webSocket connection error:)');
+    }
+
+    /**
+     * 开始重新连接
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    reconnect() {
+        // 如果已重连,则直接return,避免重复连接
+        if (this.connectSuccess) {
+            this.stopReconnect();
+            console.log('已经连接成功,停止重连');
+            return;
+        }
+        // 如果正在连接中,则直接return,避免产生多个轮训事件
+        if (this.reconnectFlag) {
+            console.log('正在重连,直接返回');
+            return;
+        }
+        // 开始重连
+        this.reconnectFlag = true;
+        // 如果没能成功连接,则定时重连
+        this.reconnectSubscription = interval(this.reconnectPeriod).subscribe(async (val) => {
+            console.log(`重连:${val}次`);
+            const url = this.url;
+            // 重新连接
+            this.connect(url);
+        });
+    }
+
+    /**
+     * 停止重连
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    stopReconnect() {
+        // 连接标识置为false
+        this.reconnectFlag = false;
+        // 取消订阅
+        if (typeof this.reconnectSubscription !== 'undefined' && this.reconnectSubscription != null) {
+            this.reconnectSubscription.unsubscribe();
+        }
+    }
+
+    /**
+     * 开始心跳检测
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    heartCheckStart() {
+        this.serverTimeoutSubscription = interval(this.period).subscribe((val) => {
+            // 保持连接状态,重置下
+            if (this.webSocket != null && this.webSocket.readyState === 1) {
+                console.log(val, '连接状态，发送消息保持连接');
+            } else {
+                // 停止心跳
+                this.heartCheckStop();
+                // 开始重连
+                this.reconnect();
+                console.log('连接已断开,重新连接');
+            }
+        });
+    }
+
+    /**
+     * 停止心跳检测
+     * @author Sum1Dream
+     * @date 2019/1/22
+     */
+    heartCheckStop() {
+        // 取消订阅停止心跳
+        if (typeof this.serverTimeoutSubscription !== 'undefined' && this.serverTimeoutSubscription != null) {
+            this.serverTimeoutSubscription.unsubscribe();
+        }
+    }
+
+    /**
+     * 开始计算运行时间
+     * @author Sum1Dream
+     * @date 2019/1/25
+     */
+    calcRunTime() {
+        this.runTimeSubscription = interval(this.runTimePeriod).subscribe(period => {
+            console.log('运行时间', `${period}分钟`);
+        });
+    }
+
+    /**
+     * 停止计算运行时间
+     * @author Sum1Dream
+     * @date 2019/1/25
+     */
+    stopRunTime() {
+        if (typeof this.runTimeSubscription !== 'undefined' && this.runTimeSubscription !== null) {
+            this.runTimeSubscription.unsubscribe();
+        }
+    }
+}