短信模板

src/app/routes/sys-setting/components/sms-template/sms-template.component.html

@@ -0,0 +1,31 @@
+<page-header-wrapper [title]="'短信模板'"></page-header-wrapper>
+
+<nz-card>
+    <div class="filter-wrap">
+        <button nz-button nzType="primary" (click)="open()"><i nz-icon nzType="plus" nzTheme="outline"></i>筛选</button>
+    </div>
+    <st #st [data]="this.service.$api_smsTemplate_page " [columns]="columns" [req]="{ process: beforeReq }"
+        [loading]="false" [page]="{}"></st>
+</nz-card>
+
+<nz-drawer [nzBodyStyle]="{ overflow: 'auto' }" [nzMaskClosable]="false" [nzWidth]="720" [nzVisible]="visible"
+    nzTitle="筛选" [nzFooter]="footerTpl" (nzOnClose)="close()">
+    <div *nzDrawerContent>
+        <sf #sf [schema]="searchSchema" [ui]="{ '*': { spanLabelFixed: 90,grid: { span: 24 } }}" [compact]="true"
+            [button]="'none'"></sf>
+    </div>
+
+    <ng-template #footerTpl>
+        <div style="float: right">
+            <button nz-button style="margin-right: 8px;" (click)="close()">取消</button>
+            <button nz-button nzType="primary" (click)="search()">确认</button>
+        </div>
+    </ng-template>
+</nz-drawer>
+
+<nz-modal [(nzVisible)]="isVisible" nzTitle="编辑" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
+    <ng-container *nzModalContent>
+        <sf #sfEdit [formData]="tempData" [schema]="editSchema" [ui]="{ '*': { spanLabelFixed: 90,grid: { span: 24 } }}" [compact]="true"
+            [button]="'none'"></sf>
+    </ng-container>
+</nz-modal>

src/app/routes/sys-setting/components/sms-template/sms-template.component.less

@@ -0,0 +1,6 @@
+:host::ng-deep {
+    .filter-wrap {
+        margin-bottom: 20px;
+        text-align: right;
+    }
+}

src/app/routes/sys-setting/components/sms-template/sms-template.component.ts

@@ -0,0 +1,144 @@
+
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { STComponent, STColumn, STChange, STRequestOptions } from '@delon/abc/st';
+import { SFComponent, SFSchema } from '@delon/form';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { SystemService } from '../../services/system.service';
+
+@Component({
+  selector: 'app-sms-template',
+  templateUrl: './sms-template.component.html',
+  styleUrls: ['./sms-template.component.less']
+})
+export class SmsTemplateComponent implements OnInit {
+  @ViewChild('st', { static: true })
+  st!: STComponent;
+  @ViewChild('sf', { static: false })
+  sf!: SFComponent;
+  @ViewChild('sfEdit', { static: false })
+  sfEdit!: SFComponent;
+  visible = false;
+  isVisible = false;
+  tempData = {};
+
+  searchSchema: SFSchema = {
+    properties: {
+      templateCode: {
+        type: 'string',
+        title: '模板编码',
+        ui: { placeholder: '请输入模板编码' }
+      },
+      templateContent: {
+        type: 'string',
+        title: '模板内容',
+        ui: { placeholder: '请输入模板内容' }
+      }
+    }
+  };
+
+  editSchema: SFSchema = {
+    properties: {
+      templateCode: {
+        type: 'string',
+        title: '模板编码',
+        ui: { placeholder: '请输入模板编码' }
+      },
+      templateContent: {
+        type: 'string',
+        title: '模板内容',
+        ui: { placeholder: '请输入模板内容' }
+      },
+      templateName: {
+        type: 'string',
+        title: '模板名称',
+        ui: { placeholder: '请输入模板名称' }
+      }
+    }
+  }
+
+  columns: STColumn[] = [
+    { title: '模板编码', className: 'text-center', index: 'templateCode' },
+    { title: '模板内容', className: 'text-center', index: 'templateContent' },
+    // {
+    //   title: '创建人', className: 'text-center', index: 'content',
+    // },
+    {
+      title: '更新时间',
+      index: 'modifyTime',
+      type: 'date',
+      className: 'text-center'
+    },
+    {
+      title: '操作',
+      buttons: [
+        {
+          text: '编辑',
+          click: i => this.edit(i),
+        }
+      ]
+    }
+  ];
+
+  constructor(public service: SystemService, private nzModalService: NzModalService, private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void { }
+
+  beforeReq = (requestOptions: STRequestOptions) => {
+    if (this.sf) {
+      Object.assign(requestOptions.body, { ...this.sf.value });
+    }
+    return requestOptions;
+  };
+
+  edit(item: any) {
+    // console.log(item);
+    this.tempData = item;
+    this.isVisible = true;
+  }
+
+  search() {
+    this.st.reload(1);
+    this.visible = false;
+  }
+
+  open(): void {
+    this.visible = true;
+  }
+
+  close(): void {
+    this.visible = false;
+  }
+
+  handleOk(): void {
+    const value = this.sfEdit.value;
+    const { id, templateCode, templateName, templateContent } = value
+    const params = {
+      id,
+      templateCode,
+      templateName,
+      templateContent
+    }
+
+    this.service.request(this.service.$api_smsTemplate_edit, params).subscribe(res => {
+      // console.log(res);
+      if (res) {
+        this.isVisible = false;
+        this.st.reload();
+      }
+    })
+
+  }
+
+  handleCancel(): void {
+    this.isVisible = false;
+  }
+
+  /**
+   * 重置表单
+   */
+  resetSF() {
+    this.sf.reset();
+  }
+}