|
|
|
<!-- start 面包屑 -->
|
|
|
|
<nz-breadcrumb>
|
|
|
|
<nz-breadcrumb-item>
|
|
|
|
优惠包管理
|
|
|
|
</nz-breadcrumb-item>
|
|
|
|
<nz-breadcrumb-item>
|
|
|
|
编辑优惠券包
|
|
|
|
</nz-breadcrumb-item>
|
|
|
|
</nz-breadcrumb>
|
|
|
|
|
|
|
|
<div class="inner-content">
|
|
|
|
<div class="main">
|
|
|
|
<nz-steps [nzCurrent]="current">
|
|
|
|
<nz-step nzTitle="配置基本信息"></nz-step>
|
|
|
|
<nz-step nzTitle="配置优惠券"></nz-step>
|
|
|
|
</nz-steps>
|
|
|
|
<form style="margin-top: 30px;" *ngIf="current === 0" nz-form [formGroup]="validateForm">
|
|
|
|
<div nz-row>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>优惠券包标题</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8" nzErrorTip="请输入优惠券包标题">
|
|
|
|
<input nz-input type="text" formControlName="title" placeholder="请输入优惠券包标题标题" />
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" >使用归属</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8" nzErrorTip="请选择使用归属">
|
|
|
|
<nz-select formControlName="usingAttribution" nzAllowClear nzPlaceHolder="选择使用归属类型">
|
|
|
|
<nz-option *ngFor="let item of usingAttribution" [nzValue]="item.codeValue" nzLabel="{{item.codeName}}"></nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>优惠券包类型</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8" nzErrorTip="请选择优惠券包类型">
|
|
|
|
<nz-select nzShowSearch nzAllowClear formControlName="salesType" nzPlaceHolder="请选择优惠券包类型">
|
|
|
|
<nz-option nzLabel="售卖" [nzValue]="1"></nz-option>
|
|
|
|
<nz-option nzLabel="赠送" [nzValue]="2"></nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24" *ngIf="validateForm.value['salesType'] === 1">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>售卖价格</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8" nzErrorTip="请输入售卖价格">
|
|
|
|
<nz-input-group nzSuffix="RMB" nzPrefix="¥">
|
|
|
|
<input type="text" formControlName="price" placeholder="请输入售卖价格" nz-input />
|
|
|
|
</nz-input-group>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24" *ngIf="validateForm.value['salesType'] === 1">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>限购数量</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8" nzErrorTip="请输入限购数量">
|
|
|
|
<nz-input-number formControlName="purchaseNum" [nzMin]="1" [nzMax]="99" [nzStep]="1"></nz-input-number>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col class="gutter-row" [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>列表展示图</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8">
|
|
|
|
<nz-upload
|
|
|
|
nzAction="{{POST_URL}}/fileUpload/uploadfile"
|
|
|
|
nzListType="picture-card"
|
|
|
|
[(nzFileList)]="listImg"
|
|
|
|
[nzShowButton]="listImg.length < 1"
|
|
|
|
[nzPreview]="handlePreview"
|
|
|
|
>
|
|
|
|
<i nz-icon nzType="plus"></i>
|
|
|
|
<div class="ant-upload-text">上传图片</div>
|
|
|
|
</nz-upload>
|
|
|
|
<nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
|
|
|
|
<ng-template #modalContent>
|
|
|
|
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
|
|
|
|
</ng-template>
|
|
|
|
</nz-modal>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div nz-col [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>轮播展示图</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8">
|
|
|
|
<nz-upload
|
|
|
|
nzAction="{{POST_URL}}/fileUpload/uploadfile"
|
|
|
|
nzListType="picture-card"
|
|
|
|
[nzMultiple]="true"
|
|
|
|
[(nzFileList)]="bannerImg"
|
|
|
|
[nzShowButton]="bannerImg.length < 5"
|
|
|
|
[nzPreview]="handlePreview"
|
|
|
|
>
|
|
|
|
<i nz-icon nzType="plus"></i>
|
|
|
|
<div class="ant-upload-text">上传图片</div>
|
|
|
|
</nz-upload>
|
|
|
|
<nz-modal [nzVisible]="previewVisible" [nzContent]="modalContent" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
|
|
|
|
<ng-template #modalContent>
|
|
|
|
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
|
|
|
|
</ng-template>
|
|
|
|
</nz-modal>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
<div nz-col [nzSpan]="24">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="3" nzRequired>详情展示图</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="8">
|
|
|
|
<nz-upload
|
|
|
|
nzAction="{{POST_URL}}/fileUpload/uploadfile"
|
|
|
|
nzListType="picture-card"
|
|
|
|
[(nzFileList)]="detailsImg"
|
|
|
|
[nzMultiple]="true"
|
|
|
|
[nzShowButton]="detailsImg.length < 5"
|
|
|
|
[nzPreview]="handlePreview"
|
|
|
|
>
|
|
|
|
<i nz-icon nzType="plus"></i>
|
|
|
|
<div class="ant-upload-text">上传图片</div>
|
|
|
|
</nz-upload>
|
|
|
|
<nz-modal [nzVisible]="previewVisible" [nzContent]="modal" [nzFooter]="null" (nzOnCancel)="previewVisible = false">
|
|
|
|
<ng-template #modal>
|
|
|
|
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" />
|
|
|
|
</ng-template>
|
|
|
|
</nz-modal>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
|
|
|
|
<div style="margin-top: 60px;" *ngIf="current === 1">
|
|
|
|
<span>共计 {{11}} 条数据</span>
|
|
|
|
<div class="operating-button">
|
|
|
|
<button nz-button nzType="primary" class="right-btn" (click)="getAdd()" ><i nz-icon nzType="plus" nzTheme="outline"></i>添加</button>
|
|
|
|
</div>
|
|
|
|
<nz-table #basicTable [nzData]="listOfData">
|
|
|
|
<thead>
|
|
|
|
<tr>
|
|
|
|
<th>优惠券名称</th>
|
|
|
|
<th>数量</th>
|
|
|
|
<th>操作</th>
|
|
|
|
</tr>
|
|
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
<tr *ngFor="let data of basicTable.data">
|
|
|
|
<td>{{ data.discountName }}</td>
|
|
|
|
<td>{{ data.num }}</td>
|
|
|
|
<td>
|
|
|
|
<a (click)="deleteActivateAward(data.id)">删除</a>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</nz-table>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<div nz-row>
|
|
|
|
<div nz-col [nzSpan]="24" class="search-area">
|
|
|
|
<button nz-button [nzType]="'primary'" (click)="pre()">上一步</button>
|
|
|
|
<button nz-button [nzType]="'primary'" (click)="getNest()">{{current == 0 ? '下一步': '提交'}}</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<nz-modal [(nzVisible)]="isVisible" nzTitle="配置优惠券" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
|
|
|
|
<div class="title">基本信息</div>
|
|
|
|
<form nz-form [formGroup]="validateFormAward" class="login-form">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="6" nzRequired>优惠券范围</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="16" nzErrorTip="请选择优惠券范围">
|
|
|
|
<nz-select formControlName="usingScope" (ngModelChange)="getDiscountPackageByList($event)" nzAllowClear nzPlaceHolder="请选择优惠券使用范围">
|
|
|
|
<nz-option *ngFor="let item of usingScope" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="6" nzRequired>优惠券</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="16" nzErrorTip="请选择优惠券">
|
|
|
|
<nz-select formControlName="discountId" (ngModelChange)="getDiscountPackageByList($event)" nzAllowClear nzPlaceHolder="请选择优惠券">
|
|
|
|
<nz-option *ngFor="let item of discountList" nzValue="{{item.id}}" nzLabel="{{item.discountName}}"></nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label [nzSpan]="6" nzRequired>数量</nz-form-label>
|
|
|
|
<nz-form-control [nzSpan]="16" nzErrorTip="请输入数量">
|
|
|
|
<input nz-input type="number" formControlName="num" placeholder="请输入数量" />
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</form>
|
|
|
|
</nz-modal>
|