胡锐 7 months ago
commit d05f9b1452
  1. 16
      src/app/pages/account/sys-account/sys-account.component.html
  2. 6
      src/app/pages/account/sys-role/sys-role.component.html
  3. 6
      src/app/pages/account/user/user.component.html
  4. 4
      src/app/pages/body/index/index.component.ts
  5. 4
      src/app/pages/goods/goods-brand/goods-brand.component.html
  6. 3
      src/app/pages/goods/goods-brand/goods-brand.component.ts
  7. 237
      src/app/pages/goods/goods-list/goods-list.component.html
  8. 12
      src/app/pages/goods/goods-list/goods-list.component.less
  9. 270
      src/app/pages/goods/goods-list/goods-list.component.ts
  10. 4
      src/app/pages/goods/goods-type/goods-type.component.html
  11. 2
      src/app/pages/goods/goods.routes.ts
  12. 14
      src/app/pages/merchant/mer-add/mer-add.component.html
  13. 22
      src/app/pages/merchant/mer-list/mer-list.component.html
  14. 2
      src/app/pages/system/menu/menu.component.html
  15. 24
      src/app/pipes/goods/goods-status.pipe.ts
  16. 13
      src/app/pipes/goods/goods-type.pipe.ts
  17. 34
      src/app/services/goods/goods.service.ts

@ -4,7 +4,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>用户名</nz-form-label> <nz-form-label>用户名</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="userName" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="userName" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -12,7 +12,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>登录账户</nz-form-label> <nz-form-label>登录账户</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="loginName" placeholder="请输入"/> <input nzSize="large" nz-input formControlName="loginName" placeholder="请输入"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -20,7 +20,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>联系方式</nz-form-label> <nz-form-label>联系方式</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="telephone" placeholder="请输入"/> <input nzSize="large" nz-input formControlName="telephone" placeholder="请输入"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -28,7 +28,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>账户状态</nz-form-label> <nz-form-label>账户状态</nz-form-label>
<nz-form-control> <nz-form-control>
<nz-select formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'"> <nz-select nzSize="large" formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'">
<nz-option *ngFor="let item of accountStatus" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option> <nz-option *ngFor="let item of accountStatus" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -100,28 +100,28 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>用户名</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>用户名</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="用户名填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="用户名填写有误!">
<input nz-input formControlName="userName"/> <input nzSize="large" nz-input formControlName="userName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!">
<input nz-input formControlName="loginName"/> <input nzSize="large" nz-input formControlName="loginName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24">联系方式</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24">联系方式</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="telephone"/> <input nzSize="large" nz-input formControlName="telephone"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!">
<nz-select nzShowSearch formControlName="roleId"> <nz-select nzSize="large" nzShowSearch formControlName="roleId">
<nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option> <nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>

@ -4,7 +4,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>角色名称</nz-form-label> <nz-form-label>角色名称</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="roleName" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="roleName" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -59,14 +59,14 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色名称</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色名称</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色名称填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色名称填写有误!">
<input nz-input formControlName="roleName"/> <input nzSize="large" nz-input formControlName="roleName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色描述</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色描述</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色描述填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色描述填写有误!">
<input nz-input formControlName="roleDesc"/> <input nzSize="large" nz-input formControlName="roleDesc"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>

@ -4,7 +4,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>用户名</nz-form-label> <nz-form-label>用户名</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="name" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="name" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -13,7 +13,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>手机号</nz-form-label> <nz-form-label>手机号</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="phone" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="phone" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -22,7 +22,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>状态</nz-form-label> <nz-form-label>状态</nz-form-label>
<nz-form-control> <nz-form-control>
<nz-select formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'"> <nz-select nzSize="large" formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'">
<nz-option *ngFor="let item of userStatusArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option> <nz-option *ngFor="let item of userStatusArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>

@ -21,6 +21,7 @@ import {NzMessageService} from "ng-zorro-antd/message";
import {dictionaryData} from "../../../data/common/dictionary.namespace"; import {dictionaryData} from "../../../data/common/dictionary.namespace";
import {CommonService} from "../../../services/common/common.service"; import {CommonService} from "../../../services/common/common.service";
import {LoginService} from "../../../services/login/login.service"; import {LoginService} from "../../../services/login/login.service";
import {NzConfigService} from "ng-zorro-antd/core/config";
@Component({ @Component({
selector: 'app-index', selector: 'app-index',
@ -70,10 +71,13 @@ export class IndexComponent {
constructor( constructor(
private commonService: CommonService, private commonService: CommonService,
private storage: BrowserStorageService, private storage: BrowserStorageService,
private nzConfigService: NzConfigService,
private message: NzMessageService, private message: NzMessageService,
private router: Router, // 路由 private router: Router, // 路由
private login: LoginService private login: LoginService
) { ) {
this.nzConfigService.set('button', { nzSize: 'large' })
this.nzConfigService.set('treeSelect', { nzSize: 'large' })
// 缓存数据字典 // 缓存数据字典
this.commonService.queryDictionary('','',(data: any) => { this.commonService.queryDictionary('','',(data: any) => {
for (let item of data['return_data']) { for (let item of data['return_data']) {

@ -4,7 +4,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>品牌名称</nz-form-label> <nz-form-label>品牌名称</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="title" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="title" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -60,7 +60,7 @@
<nz-form-item > <nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>标题</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>标题</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入标题!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入标题!">
<input nz-input formControlName="title" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="title" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>

@ -100,6 +100,8 @@ export class GoodsBrandComponent {
// 编辑弹出框 // 编辑弹出框
isVisibleEdit = false; isVisibleEdit = false;
protected readonly fallbackImg = fallbackImg;
constructor(private fb: NonNullableFormBuilder, constructor(private fb: NonNullableFormBuilder,
private msg: NzMessageService, private msg: NzMessageService,
private commonService: CommonService, private commonService: CommonService,
@ -199,5 +201,4 @@ export class GoodsBrandComponent {
}); });
} }
protected readonly fallbackImg = fallbackImg;
} }

@ -0,0 +1,237 @@
<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 nzSize="large" nz-input formControlName="title" 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-tree-select
nzPlaceHolder="请选择"
formControlName="goodsType"
[nzNodes]="nodes"
nzShowSearch
></nz-tree-select>
</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 nzSize="large" nzShowSearch nzAllowClear nzPlaceHolder="请选择" formControlName="goodsBrand">
<nz-option *ngFor="let item of nodesBrand" nzLabel="{{item['title']}}" nzValue="{{item['id']}}"></nz-option>
</nz-select>
</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 nzSize="large" nzShowSearch nzAllowClear nzPlaceHolder="请选择" formControlName="type">
<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 [nzSpan]="6">
<nz-form-item>
<nz-form-label>商品状态</nz-form-label>
<nz-form-control>
<nz-select nzSize="large" 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-select>
</nz-form-control>
</nz-form-item>
</div>
<div nz-col [nzSpan]="6" class="search-area">
<button nz-button [nzType]="'primary'" (click)="getRequest(true)">查询</button>
<button nz-button (click)="searchForm.reset()">重置</button>
<button nz-button [nzType]="'primary'" (click)="showEdit()">创建</button>
</div>
</div>
</form>
<nz-table #basicTable
[nzBordered]="true"
[nzFrontPagination]="false"
[nzShowQuickJumper]="true"
[nzShowTotal]="totalTemplate"
[(nzPageIndex)]="tablePageNum"
(nzPageIndexChange)="getRequest(false)"
[nzTotal]="tableData.total"
[nzData]="tableData.list" >
<thead>
<tr>
<th nzWidth="80px">商品名称</th>
<th nzWidth="100px">商品图片</th>
<th nzWidth="100px">商品类型</th>
<th nzWidth="100px">商品分类</th>
<th nzWidth="100px">商品品牌</th>
<th nzWidth="50px">创建时间</th>
<th nzWidth="50px">更新时间</th>
<th nzWidth="50px">状态</th>
<th nzWidth="70px">操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of basicTable.data">
<td>{{data.title}}</td>
<td>
<img nz-image width="60px" height="60px" nzSrc="{{imageUrl + data.listImg }}" [nzFallback]="fallbackImg" alt="" />
</td>
<td>{{data.type == 1 ? '实物商品' : '虚拟商品'}}</td>
<td>{{data.goodsTypeName}}</td>
<td>{{data.goodsBrandName}}</td>
<td>{{ data.createTime | date: 'yyyy-MM-dd HH:mm'}}</td>
<td>{{ data.updateTime | date: 'yyyy-MM-dd HH:mm'}}</td>
<td>{{data.status | goodsStatus}}</td>
<td>
<a (click)="showEdit(data)">修改</a>
<nz-divider nzType="vertical"></nz-divider>
<a nz-popconfirm nzPopconfirmTitle="是否确认删除?" (nzOnConfirm)="delete(data.id)">删除</a>
</td>
</tr>
</tbody>
<ng-template #totalTemplate let-total>总计 {{ total }} 条</ng-template>
<!--添加弹出框-->
<nz-modal [(nzVisible)]="isVisibleEdit" [nzMaskClosable] = false nzTitle="编辑类目" (nzOnCancel)="isVisibleEdit = false" (nzOnOk)="handleEdit()">
<ng-container *nzModalContent>
<form nz-form [formGroup]="editForm">
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>标题</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入标题!">
<input nzSize="large" nz-input formControlName="title" placeholder="请输入" />
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" >商品分类</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-tree-select
nzPlaceHolder="请选择"
formControlName="goodsType"
[nzNodes]="nodes"
nzShowSearch
></nz-tree-select>
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商品类型</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-select nzSize="large" nzShowSearch nzAllowClear nzPlaceHolder="请选择" formControlName="type">
<nz-option nzLabel="实物商品" nzValue="1"></nz-option>
<nz-option nzLabel="虚拟商品商品" nzValue="2"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商品品牌</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-select nzSize="large" nzShowSearch nzAllowClear nzPlaceHolder="请选择" formControlName="goodsBrand">
<nz-option *ngFor="let item of nodesBrand" nzLabel="{{item['title']}}" nzValue="{{item['id']}}"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>列表图片</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-upload
nzAction="{{baseUrl}}fileUpload/fileUpload"
nzListType="picture-card"
[(nzFileList)]="listImg"
[nzShowButton]="listImg.length < 1"
[nzPreview]="handlePreview"
nzAccept="image/*"
>
<div>
<span nz-icon nzType="plus"></span>
<div style="margin-top: 8px">上传图片</div>
</div>
</nz-upload>
<nz-modal
[nzVisible]="previewVisible"
[nzContent]="modalContent"
[nzFooter]="null"
(nzOnCancel)="previewVisible = false"
>
<ng-template #modalContent>
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" alt=""/>
</ng-template>
</nz-modal>
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>轮播图片</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-upload
nzAction="{{baseUrl}}fileUpload/fileUpload"
nzListType="picture-card"
[(nzFileList)]="bannerImg"
[nzShowButton]="bannerImg.length < 1"
[nzPreview]="handlePreview"
nzAccept="image/*"
>
<div>
<span nz-icon nzType="plus"></span>
<div style="margin-top: 8px">上传图片</div>
</div>
</nz-upload>
<nz-modal
[nzVisible]="previewVisible"
[nzContent]="modalContent"
[nzFooter]="null"
(nzOnCancel)="previewVisible = false"
>
<ng-template #modalContent>
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" alt=""/>
</ng-template>
</nz-modal>
</nz-form-control>
</nz-form-item>
<nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>详情图片</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24">
<nz-upload
nzAction="{{baseUrl}}fileUpload/fileUpload"
nzListType="picture-card"
[(nzFileList)]="detailImg"
[nzShowButton]="detailImg.length < 1"
[nzPreview]="handlePreview"
nzAccept="image/*"
>
<div>
<span nz-icon nzType="plus"></span>
<div style="margin-top: 8px">上传图片</div>
</div>
</nz-upload>
<nz-modal
[nzVisible]="previewVisible"
[nzContent]="modalContent"
[nzFooter]="null"
(nzOnCancel)="previewVisible = false"
>
<ng-template #modalContent>
<img [src]="previewImage" [ngStyle]="{ width: '100%' }" alt=""/>
</ng-template>
</nz-modal>
</nz-form-control>
</nz-form-item>
</form>
</ng-container>
</nz-modal>

@ -0,0 +1,12 @@
[nz-form-label] {
overflow: visible;
}
button {
margin-left: 8px;
}
.submit-btn {
width: 150px;
}
.search-area {
margin-top: 30px;
}

@ -0,0 +1,270 @@
import { Component } from '@angular/core';
import {DatePipe, NgForOf, NgIf, NgStyle} from "@angular/common";
import {NzButtonComponent} from "ng-zorro-antd/button";
import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
import {NzInputDirective} from "ng-zorro-antd/input";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {FormGroup, FormsModule, NonNullableFormBuilder, ReactiveFormsModule, Validators} from "@angular/forms";
import {NzUploadComponent, NzUploadFile} from "ng-zorro-antd/upload";
import {environment} from "../../../../environments/environment";
import {NzMessageService} from "ng-zorro-antd/message";
import {CommonService} from "../../../services/common/common.service";
import {GoodsService} from "../../../services/goods/goods.service";
import { fallbackImg } from '../../../data/goods/goods.namespace';
import {GoodsTypeData} from "../../../model/goods.interface";
import {NzDividerComponent} from "ng-zorro-antd/divider";
import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzImageDirective, NzImageModule} from "ng-zorro-antd/image";
import {NzModalModule} from "ng-zorro-antd/modal";
import {NzPopconfirmDirective} from "ng-zorro-antd/popconfirm";
import {
NzTableComponent, NzTableModule,
NzTdAddOnComponent,
} from "ng-zorro-antd/table";
import {NzTreeSelectComponent} from "ng-zorro-antd/tree-select";
import {DictionaryPipe} from "../../../pipes/common/dictionary.pipe";
import {GoodsStatusPipe} from "../../../pipes/goods/goods-status.pipe";
import {NzConfigService} from "ng-zorro-antd/core/config";
const getBase64 = (file: File): Promise<string | ArrayBuffer | null> =>
new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
@Component({
selector: 'app-goods-list',
standalone: true,
imports: [
FormsModule,
NzButtonComponent,
NzColDirective,
NzFormControlComponent,
NzFormDirective,
NzFormItemComponent,
NzFormLabelComponent,
NzInputDirective,
NzRowDirective,
ReactiveFormsModule,
NgForOf,
NzOptionComponent,
NzSelectComponent,
NzModalModule,
NgIf,
NzUploadComponent,
NzIconDirective,
NzImageModule,
NgStyle,
NzTableComponent,
NzTdAddOnComponent,
NzTableModule,
DictionaryPipe,
DatePipe,
NzImageDirective,
NzTreeSelectComponent,
NzDividerComponent,
NzPopconfirmDirective,
GoodsStatusPipe
],
templateUrl: './goods-list.component.html',
styleUrl: './goods-list.component.less'
})
export class GoodsListComponent {
// 表单页数
tablePageNum = 1;
// 表单数据
tableData: any = {
total: 0,
loading: false,
list: [],
};
// 搜索表单
searchForm: FormGroup;
// 图片
listImg: NzUploadFile[] = []
bannerImg: NzUploadFile[] = []
detailImg: NzUploadFile[] = []
baseUrl = environment.baseUrl;
imageUrl = environment.imageUrl;
// 展示图片
previewImage: string | undefined = '';
// 上传是否展示
previewVisible = false;
// 编辑产品类型表单
editForm: FormGroup;
// 编辑弹出框
isVisibleEdit = false;
// 商品类型数据
nodes = [];
nodesBrand = [];
protected readonly fallbackImg = fallbackImg;
constructor(private fb: NonNullableFormBuilder,
private msg: NzMessageService,
private commonService: CommonService,
private goodsService: GoodsService) {
// 初始化搜索框
this.searchForm = this.fb.group({
title: [''],
goodsType: [''],
goodsBrand: [''],
type: [''],
status: [''],
});
// 初始化
this.editForm = this.fb.group({
title: ['' , [Validators.required]],
goodsType: ['' , [Validators.required]],
type: ['' , [Validators.required]],
goodsBrand: ['' , [Validators.required]],
id: [null],
goodsLabel: [''],
goodsExplain: [''],
});
this.getRequest();
this.getGoodsTypeNode();
this.getGoodsBrandNode();
}
// 查询列表
public getRequest(reset: boolean = false) {
this.tableData.loading = true;
if (reset) {
this.tablePageNum = 1;
}
this.searchForm.value.pageNum = this.tablePageNum;
this.searchForm.value.pageSize = 10;
this.searchForm.value.time = new Date().getTime();
this.goodsService.getListGoods(this.searchForm.value , (data: any) => {
if (data['return_code'] == '000000') {
this.tableData = data['return_data'];
} else {
this.msg.error(data['return_msg']);
}
this.tableData.loading = false;
});
}
// 唤醒编辑表单
showEdit(item?: any) {
if (item != null) {
item.businessType = String(item.businessType);
this.editForm.patchValue(item);
if (!this.commonService.whetherStringIsNull(item.listImg)) {
this.listImg = this.commonService.stitchImg(item.listImg);
}
if (!this.commonService.whetherStringIsNull(item.bannerImg)) {
this.bannerImg = this.commonService.stitchImg(item.bannerImg);
}
if (!this.commonService.whetherStringIsNull(item.detailImg)) {
this.detailImg = this.commonService.stitchImg(item.detailImg);
}
}
this.isVisibleEdit = true;
}
// 编辑表单提交
handleEdit(): void {
if (this.editForm.valid) {
if (this.listImg.length !== 0) {
this.editForm.value.listImg = this.commonService.imgList(this.listImg);
} else {
this.msg.error("请上传列表图片")
}
if (this.bannerImg.length !== 0) {
this.editForm.value.bannerImg = this.commonService.imgList(this.bannerImg);
} else {
this.msg.error("请上传轮播图片")
}
if (this.detailImg.length !== 0) {
this.editForm.value.detailImg = this.commonService.imgList(this.detailImg);
} else {
this.msg.error("请上传详情图片")
}
this.goodsService.editGoodsMsg(this.editForm.value , (data: any) => {
if (data['return_code'] === '000000') {
this.msg.success("成功!");
this.isVisibleEdit = false;
this.getRequest();
} else {
this.msg.error(data['return_msg']);
}
});
} else {
Object.values(this.editForm.controls).forEach(control => {
if (control.invalid) {
control.markAsDirty();
control.updateValueAndValidity({ onlySelf: true });
}
});
}
}
// 上传操作
handlePreview = async (file: NzUploadFile): Promise<void> => {
if (!file.url && !file['preview']) {
file['preview'] = await getBase64(file.originFileObj!);
}
this.previewImage = file.url || file['preview'];
this.previewVisible = true;
};
// 删除
delete(id: number): void {
this.goodsService.deleteBran(id , (data: any) => {
if (data['return_code'] === '000000') {
this.msg.success("成功!");
this.getRequest();
} else {
this.msg.error(data['return_msg']);
}
});
}
// 获取商品分类
getGoodsTypeNode() {
this.goodsService.getList({time: new Date().getTime()}, (data: any) => {
if (data['return_code'] === '000000') {
this.getNode(data['return_data']);
}
});
}
// 配置数据
getNode(array: any): any {
array.forEach((item: any) => {
if (item.children) {
this.getNode(item.children);
}else {
item["isLeaf"] = true;
}
item["key"] = item.id;
});
this.nodes = array;
}
// 获取商品品牌
getGoodsBrandNode() {
this.goodsService.getListBrandAll( (data: any) => {
if (data['return_code'] == '000000') {
this.nodesBrand = data['return_data'];
}
});
}
}

@ -55,13 +55,13 @@
<nz-form-item > <nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>标题</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>标题</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入标题!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入标题!">
<input nz-input formControlName="title" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="title" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item > <nz-form-item >
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>业务类型</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>业务类型</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请选择业务类型!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请选择业务类型!">
<nz-select nzShowSearch nzAllowClear formControlName="businessType" nzPlaceHolder="请选择"> <nz-select nzSize="large" nzShowSearch nzAllowClear formControlName="businessType" nzPlaceHolder="请选择">
<nz-option *ngFor="let item of goodsTypeArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option> <nz-option *ngFor="let item of goodsTypeArray" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>

@ -1,10 +1,12 @@
import { Routes } from '@angular/router'; import { Routes } from '@angular/router';
import {GoodsTypeComponent} from "./goods-type/goods-type.component"; import {GoodsTypeComponent} from "./goods-type/goods-type.component";
import {GoodsBrandComponent} from "./goods-brand/goods-brand.component"; import {GoodsBrandComponent} from "./goods-brand/goods-brand.component";
import {GoodsListComponent} from "./goods-list/goods-list.component";
export const GOODS_ROUTES: Routes = [ export const GOODS_ROUTES: Routes = [
{ path: 'goods_type', component: GoodsTypeComponent}, { path: 'goods_type', component: GoodsTypeComponent},
{ path: 'goods_brand', component: GoodsBrandComponent}, { path: 'goods_brand', component: GoodsBrandComponent},
{ path: 'goods-list', component: GoodsListComponent},
]; ];

@ -24,14 +24,14 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!">
<input nz-input formControlName="loginName"/> <input nzSize="large" nz-input formControlName="loginName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!">
<nz-select nzShowSearch formControlName="roleId"> <nz-select nzSize="large" nzShowSearch formControlName="roleId">
<nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option> <nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -40,35 +40,35 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户名称</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户名称</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="merName"/> <input nz-input nzSize="large" formControlName="merName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户地址</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户地址</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="address"/> <input nzSize="large" nz-input formControlName="address"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>负责人</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>负责人</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="directorName"/> <input nzSize="large" nz-input formControlName="directorName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>联系电话</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>联系电话</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="directorTel"/> <input nzSize="large" nz-input formControlName="directorTel"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24">客服电话</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24">客服电话</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="customerServiceTel"/> <input nzSize="large" nz-input formControlName="customerServiceTel"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>

@ -4,7 +4,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>商户号</nz-form-label> <nz-form-label>商户号</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="merNo" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="merNo" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -12,7 +12,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>商户名称</nz-form-label> <nz-form-label>商户名称</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="merName" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="merName" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -20,7 +20,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>创建人</nz-form-label> <nz-form-label>创建人</nz-form-label>
<nz-form-control> <nz-form-control>
<input nz-input formControlName="opUserName" placeholder="请输入" /> <input nzSize="large" nz-input formControlName="opUserName" placeholder="请输入" />
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
</div> </div>
@ -28,7 +28,7 @@
<nz-form-item> <nz-form-item>
<nz-form-label>商户状态</nz-form-label> <nz-form-label>商户状态</nz-form-label>
<nz-form-control> <nz-form-control>
<nz-select formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'"> <nz-select nzSize="large" formControlName="status" nzAllowClear [nzPlaceHolder]="'请选择'">
<nz-option *ngFor="let item of merStatus" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option> <nz-option *ngFor="let item of merStatus" nzValue="{{item.codeValue}}" nzLabel="{{item.codeName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -139,14 +139,14 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>登录账户</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="登录账户填写有误!">
<input nz-input formControlName="loginName"/> <input nzSize="large" nz-input formControlName="loginName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>角色权限</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!"> <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="角色权限选择有误!">
<nz-select nzShowSearch formControlName="roleId"> <nz-select nzSize="large" nzShowSearch formControlName="roleId">
<nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option> <nz-option *ngFor="let item of roleData" nzValue="{{item.id}}" nzLabel="{{item.roleName}}"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
@ -155,35 +155,35 @@
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户名称</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>商户名称</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="merName"/> <input nzSize="large" nz-input formControlName="merName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>负责人</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>负责人</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="directorName"/> <input nzSize="large" nz-input formControlName="directorName"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>联系电话</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>联系电话</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="directorTel"/> <input nzSize="large" nz-input formControlName="directorTel"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24">商户地址</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24">商户地址</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="address"/> <input nzSize="large" nz-input formControlName="address"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24">客服电话</nz-form-label> <nz-form-label [nzSm]="6" [nzXs]="24">客服电话</nz-form-label>
<nz-form-control [nzSm]="14" [nzXs]="24"> <nz-form-control [nzSm]="14" [nzXs]="24">
<input nz-input formControlName="customerServiceTel"/> <input nzSize="large" nz-input formControlName="customerServiceTel"/>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>

@ -18,7 +18,7 @@
<nz-card nzTitle="菜单详情" [nzExtra]="extraTemplate" [nzBodyStyle]="{ padding: '0px'}"> <nz-card nzTitle="菜单详情" [nzExtra]="extraTemplate" [nzBodyStyle]="{ padding: '0px'}">
<nz-descriptions nzBordered <nz-descriptions nzBordered
nzLayout="vertical" nzLayout="vertical"
[nzSize]="'small'" [nzSize]="'middle'"
[nzColumn]="{ xxl: 2, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }" [nzColumn]="{ xxl: 2, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }"
> >
<nz-descriptions-item nzTitle="父级菜单">{{menuDetail?.parentMenu?menuDetail.parentMenu.menuName:'无'}}</nz-descriptions-item> <nz-descriptions-item nzTitle="父级菜单">{{menuDetail?.parentMenu?menuDetail.parentMenu.menuName:'无'}}</nz-descriptions-item>

@ -0,0 +1,24 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'goodsStatus',
standalone: true
})
export class GoodsStatusPipe implements PipeTransform {
transform(value: number): any {
switch (value) {
case 1:
return '上线中';
case 2:
return '编辑中';
case 3:
return '审核中';
default:
return '未知状态'
}
}
}

@ -1,13 +0,0 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'goodsType',
standalone: true
})
export class GoodsTypePipe implements PipeTransform {
transform(value: unknown, ...args: unknown[]): unknown {
return null;
}
}

@ -45,7 +45,7 @@ export class GoodsService {
} }
/** /**
* *
* @param params * @param params
* @param callBack * @param callBack
*/ */
@ -56,7 +56,7 @@ export class GoodsService {
} }
/** /**
* *
* @param params * @param params
* @param callBack * @param callBack
*/ */
@ -66,8 +66,14 @@ export class GoodsService {
}); });
} }
public getListBrandAll(callBack:any) {
this.http.get(environment.baseUrl + 'goodsBrand/getListBrandAll').subscribe(data => {
callBack(data);
});
}
/** /**
* *
* @param id * @param id
* @param callBack * @param callBack
*/ */
@ -77,4 +83,26 @@ export class GoodsService {
}); });
} }
/**
*
* @param params
* @param callBack
*/
public getListGoods(params: object, callBack:any) {
this.http.get(environment.baseUrl + 'goods/getListGoods?' + ObjectData.objectByString(params)).subscribe(data => {
callBack(data);
});
}
/**
*
* @param params
* @param callBack
*/
public editGoodsMsg(params: object, callBack:any) {
this.http.post(environment.baseUrl + 'goods/editGoodsMsg', params).subscribe(data => {
callBack(data);
});
}
} }

Loading…
Cancel
Save