二维码配置改为科室地点

src/app/views/qrcode-configuration/qrcode-configuration.component.html

@@ -2,9 +2,27 @@
   <div class="list-template__content">
     <div class="list-template__top" nz-row>
       <div nz-col nzXl='18' class="list-template__searchBox">
+        <div class="list-template__searchItem">
+          <span class="label">关联科室</span>：
+          <nz-select class="formItem" (nzOnSearch)="changeInp($event)" (nzOpenChange)="openOtherTasktype($event)"
+            [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch nzAllowClear nzPlaceHolder="请选择关联科室"
+            [(ngModel)]="searchDto.deptId">
+            <ng-container *ngFor="let option of deptList">
+              <nz-option *ngIf="!isLoading" [nzLabel]="option.dept" [nzValue]="option.id"></nz-option>
+            </ng-container>
+            <nz-option *ngIf="isLoading" nzDisabled nzCustomContent>
+              <i nz-icon nzType="loading" class="loading-icon"></i> 搜索中...
+            </nz-option>
+          </nz-select>
+        </div>
+        <div class="list-template__searchItem">
+          <span class="label">地点名称：</span>
+          <input nz-input class="formItem" [(ngModel)]="searchDto.name" placeholder="请输入地点名称" nzSize="default" />
+        </div>
       </div>
       <div nz-col nzXl='6' class="list-template__btns">
         <button nz-button class="btn default" (click)='search()'>搜索</button>
+        <button class="btn default ml8" (click)='reset()'>重置</button>
         <button nz-button *ngIf="coopBtns.add" class="btn ml8 default" (click)="showModal()">新增</button>
       </div>
     </div>
@@ -13,17 +31,21 @@
         [nzLoading]="loading1">
         <thead>
           <tr class="thead">
-            <th nzWidth="10%">映射名称</th>
-            <th nzWidth="10%">关联科室</th>
-            <th nzWidth="5%">二维码CODE</th>
-            <th nzWidth="20%">操作</th>
+            <th nzWidth="5%">序号</th>
+            <th nzWidth="19%">地点名称</th>
+            <th nzWidth="19%">关联科室</th>
+            <th nzWidth="19%">地点编码</th>
+            <th nzWidth="19%">地点电话</th>
+            <th nzWidth="19%">操作</th>
           </tr>
         </thead>
         <tbody>
           <tr *ngFor="let data of listOfData;let index=index;">
-            <td>{{ data.name || '' }}</td>
-            <td>{{ data.deptDTO ? data.deptDTO.dept : '' }}</td>
-            <td>{{ data.code || '' }}</td>
+            <td>{{index+(pageIndex-1) * pageSize + 1}}</td>
+            <td>{{ data.name }}</td>
+            <td>{{ data.deptDTO?.dept }}</td>
+            <td>{{ data.placeCode}}</td>
+            <td>{{ data.phones}}</td>
             <td>
               <div class="coop">
                 <span *ngIf="coopBtns.edit" (click)="edit(data)">编辑</span>
@@ -49,10 +71,10 @@
     <overlay-scrollbars #osComponentRef1 class="content">
       <form nz-form [formGroup]="validateForm" class="addForm" (ngSubmit)="submitForm()">
         <nz-form-item>
-          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name">映射名称</nz-form-label>
-          <nz-form-control nzErrorTip="请填写映射名称!">
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="name">地点名称</nz-form-label>
+          <nz-form-control nzErrorTip="请填写地点名称!">
             <nz-input-group>
-              <input type="text" nz-input formControlName="name" placeholder="请填写映射名称" />
+              <input type="text" nz-input formControlName="name" placeholder="请填写地点名称" />
             </nz-input-group>
           </nz-form-control>
         </nz-form-item>
@@ -70,6 +92,32 @@
             </nz-select>
           </nz-form-control>
         </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="placeCode">地点编码</nz-form-label>
+          <nz-form-control nzErrorTip="请填写地点编码!">
+            <nz-input-group>
+              <input type="text" nz-input formControlName="placeCode" placeholder="请填写地点编码" />
+            </nz-input-group>
+          </nz-form-control>
+        </nz-form-item>
+        <nz-form-item>
+          <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="phones">地点电话</nz-form-label>
+          <nz-form-control nzErrorTip="请填写地点电话!">
+            <nz-input-group>
+              <input (ngModelChange)="deptsPhoneChange()" nz-input formControlName="phones" placeholder="请填写地点电话" />
+            </nz-input-group>
+          </nz-form-control>
+        </nz-form-item>
+        <nz-input-group *ngFor="let phone of deptPhones;let index = index" class="dynamic">
+          <input nz-input [ngModel]="phone.phone" [ngModelOptions]="{standalone: true}" placeholder="请填写科室电话"
+            (ngModelChange)="deptsPhoneChange($event,phone)" />
+          <i nz-icon nzType="minus-circle-o" (click)="removeDeptPhone(index, $event)"></i>
+        </nz-input-group>
+        <button nz-button nzType="dashed" [disabled]="isAddDeptsPhone" class="add-button"
+          (click)="addDeptPhone($event)">
+          <i nz-icon nzType="plus"></i>
+          添加科室号码
+        </button>
       </form>
     </overlay-scrollbars>
     <div class="display_flex justify-content_flex-center">

src/app/views/qrcode-configuration/qrcode-configuration.component.less

@@ -1,4 +1,22 @@
 @import "../../../../src/theme.less";
+:host{
+  .add-button {
+    margin: 0 auto 16px !important;
+  }
+  .dynamic {
+    margin-bottom: 16px;
+    display: flex;
+    align-items: center;
+    input {
+      width: 90%;
+    }
+    i {
+      margin-left: 8px;
+      cursor: pointer;
+      font-size: 18px;
+    }
+  }
+}
 .save {
   position: fixed;
   left: 0;

src/app/views/qrcode-configuration/qrcode-configuration.component.ts

@@ -61,11 +61,47 @@ export class QRCodeConfigurationComponent implements OnInit {
     this.getList(true);
   }
 
+  // 新添加地点号码
+  deptPhones: any = []; //新添加的地点电话列表
+  deptsPhoneId = 1; //地点电话自增id
+  isAddDeptsPhone = true; //添加新的地点电话是否禁用
+  addDeptPhone(e: MouseEvent) {
+    e.preventDefault();
+    this.deptPhones.push({ id: ++this.deptsPhoneId, phone: "" });
+    this.deptsPhoneChange();
+  }
+  // 删除新添加地点号码
+  removeDeptPhone(index: number, e: MouseEvent) {
+    e.preventDefault();
+    this.deptPhones.splice(index, 1);
+    this.deptsPhoneChange();
+  }
+  //监听科室电话输入事件
+  deptsPhoneChange(e?, phone?) {
+    if (e !== undefined && phone !== undefined) {
+      phone.phone = e;
+    }
+    // -------------判断添加按钮是否禁用 start
+    this.isAddDeptsPhone = !this.validateForm.value.phones;
+    if (!this.isAddDeptsPhone) {
+      //如果没禁用
+      this.isAddDeptsPhone = this.deptPhones.some((item) => item.phone === "");
+    }
+    // -------------判断添加按钮是否禁用 end
+  }
+
   // 搜索
   search() {
     this.getList(true);
   }
+  // 重置
+  reset() {
+    this.searchDto = {};
+    this.getList(true);
+  }
   // 表格数据
+  alldepart1: any = []; //所有所属科室(搜索)
+  searchDto:any =  {};
   loading1 = false;
   getList(isResetPageIndex = false) {
     isResetPageIndex && (this.pageIndex = 1);
@@ -73,6 +109,7 @@ export class QRCodeConfigurationComponent implements OnInit {
       pageIndex: this.pageIndex,
       pageSize: this.pageSize,
       hosId: this.hosId,
+      searchDto: this.searchDto,
     };
     this.loading1 = true;
     this.qrCodeConfigurationService
@@ -85,7 +122,7 @@ export class QRCodeConfigurationComponent implements OnInit {
       });
   }
 
-  // 获取任务类型列表-其他临床服务
+  // 获取科室列表
   getOtherTasktype(keywords = '') {
     let hosId = this.tool.getCurrentHospital().id;
     this.isLoading = true;
@@ -103,6 +140,8 @@ export class QRCodeConfigurationComponent implements OnInit {
     this.add = true;
     this.modal = true;
     this.initForm();
+    this.isAddDeptsPhone = true;
+    this.deptPhones = [];
   }
   hideModal() {
     this.modal = false;
@@ -117,6 +156,8 @@ export class QRCodeConfigurationComponent implements OnInit {
     this.validateForm = this.fb.group({
       name: ['', [Validators.required]],
       deptId: [null, [Validators.required]],
+      placeCode: ['', [Validators.required]],
+      phones: [null],
     });
   }
   // 表单提交
@@ -127,11 +168,14 @@ export class QRCodeConfigurationComponent implements OnInit {
     }
     if (this.validateForm.invalid) return;
     this.btnLoading = true;
+    let deptsPhone = this.deptPhones.map((item) => item.phone).join();
     if(this.add){
       this.qrCodeConfigurationService
       .add({
         name: this.validateForm.value.name,
         deptId: this.validateForm.value.deptId,
+        placeCode: this.validateForm.value.placeCode,
+        phones: deptsPhone ? this.validateForm.value.phones + "," + deptsPhone : this.validateForm.value.phones,
         hosId: this.hosId,
       })
       .subscribe((data) => {
@@ -149,6 +193,8 @@ export class QRCodeConfigurationComponent implements OnInit {
       .update({
         name: this.validateForm.value.name,
         deptId: this.validateForm.value.deptId,
+        placeCode: this.validateForm.value.placeCode,
+        phones: deptsPhone ? this.validateForm.value.phones + "," + deptsPhone : this.validateForm.value.phones,
         coopData: this.coopData,
       })
       .subscribe((data) => {
@@ -168,8 +214,27 @@ export class QRCodeConfigurationComponent implements OnInit {
   maskFlag: any = false;
   coopData = {};
   edit(data) {
+    this.isAddDeptsPhone = false;
+    this.deptPhones = [];
+    let phones = data.phones ? data.phones.split(",") : [];
+    if (phones.length === 0) {
+      this.validateForm.controls.phones.setValue("");
+      this.deptPhones = [];
+    } else if (phones.length === 1) {
+      this.validateForm.controls.phones.setValue(phones[0]);
+      this.deptPhones = [];
+    } else {
+      this.validateForm.controls.phones.setValue(phones[0]);
+      this.deptPhones = phones.slice(1).map((item) => {
+        return {
+          id: ++this.deptsPhoneId,
+          phone: item,
+        };
+      });
+    }
     this.validateForm.controls.name.setValue(data.name);
     this.validateForm.controls.deptId.setValue(data.deptId);
+    this.validateForm.controls.placeCode.setValue(data.placeCode);
     this.modal = true;
     this.add = false;
     this.coopId = data.id;

src/app/views/qrcode-configuration/qrcode-configuration.service.ts

@@ -11,12 +11,13 @@ export class QRCodeConfigurationService {
   ) { }
 
   // 列表-查
-  query({pageIndex, pageSize, hosId}) {
+  query({pageIndex, pageSize, searchDto, hosId}) {
     let data = {
       idx: pageIndex - 1,
       sum: pageSize,
       qrCode: {
         hosId,
+        ...searchDto,
       },
     };
     return this.mainService.getFetchDataList("simple/data", "qrCode", data);
@@ -28,10 +29,12 @@ export class QRCodeConfigurationService {
   }
 
   // 列表-增
-  add({name, deptId, hosId}) {
+  add({name, deptId, placeCode, phones, hosId}) {
     let data = {
       name,
       deptId,
+      placeCode,
+      phones,
       hosId,
     };
 
@@ -39,10 +42,12 @@ export class QRCodeConfigurationService {
   }
 
   // 列表-改
-  update({name, deptId, coopData}) {
+  update({name, deptId, placeCode, phones, coopData}) {
     let data = {
       name,
       deptId,
+      placeCode,
+      phones,
     };
     data = {...coopData, ...data};
     return this.mainService.simplePost("addData", "qrCode", data);