<div class="list-template">
  <div class="list-template__content">
    <div class="list-template__top" nz-row>
      <div nz-col nzXl='16' class="list-template__searchBox">
        <div class="list-template__searchItem">
          <span class="label">请领单号：</span>
          <input nz-input class="formItem" placeholder="请输入请领单号" [(ngModel)]="searchCriteria.packid" />
        </div>
        <div class="list-template__searchItem">
          <span class="label">发药科室：</span>
          <nz-select [nzDropdownMatchSelectWidth]="false" class="formItem" nzServerSearch nzShowSearch nzAllowClear
            nzPlaceHolder="请选择发药科室" [(ngModel)]="searchCriteria.launch" (nzOnSearch)="changeInp($event)"
            (nzOpenChange)="changeSearch($event)">
            <ng-container *ngFor="let data of deptList">
              <nz-option *ngIf="!isLoading" nzLabel="{{data.dept}}" nzValue="{{data.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>
          <nz-select [nzDropdownMatchSelectWidth]="false" class="formItem" nzServerSearch nzShowSearch nzAllowClear
            nzPlaceHolder="请选择申请科室" [(ngModel)]="searchCriteria.target" (nzOnSearch)="changeInp($event)"
            (nzOpenChange)="changeSearch($event)">
            <ng-container *ngFor="let data of deptList">
              <nz-option *ngIf="!isLoading" nzLabel="{{data.dept}}" nzValue="{{data.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>
          <nz-select
            [nzDropdownMatchSelectWidth]="false"
            class="formItem"
            nzServerSearch
            nzShowSearch
            nzAllowClear
            nzPlaceHolder="请选择状态"
            [(ngModel)]="searchCriteria.drugsState"
            (nzOpenChange)="changeSearch1($event)"
          >
            <ng-container *ngFor="let data of types">
              <nz-option
                *ngIf="!isLoading1"
                nzLabel="{{ data.name }}"
                nzValue="{{ data.id }}"
              ></nz-option>
            </ng-container>
            <nz-option *ngIf="isLoading1" 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>
				  <nz-select [nzDropdownMatchSelectWidth]="false" class="formItem" nzShowSearch nzAllowClear
				    nzPlaceHolder="请选择药品类型" [(ngModel)]="searchCriteria.drugsBagType">
				    <ng-container *ngFor="let data of drugsList">
				      <nz-option nzLabel="{{data.name}}" nzValue="{{data.id}}"></nz-option>
				    </ng-container>
				  </nz-select>
				</div>

				<div class="list-template__searchItem">
				  <span class="label">收取人：</span>
				  <nz-select [nzDropdownMatchSelectWidth]="false" class="formItem" nzServerSearch nzShowSearch nzAllowClear
				    nzPlaceHolder="请选择收取人" [(ngModel)]="searchCriteria.receiverName" (nzOnSearch)="changeUserInp($event)">
				    <ng-container *ngFor="let data of userSearch">
				      <nz-option *ngIf="!isLoading" nzLabel="{{data.name}}" nzValue="{{data.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 width-105">收取时间区间：</span>
				  <nz-range-picker nzShowTime [(ngModel)]="searchCriteria.dateRange" (nzOnCalendarChange)="onCalendarChangeDate($event)" (ngModelChange)="changeDate($event)"></nz-range-picker>
				</div>
      </div>
      <div nz-col nzXl="8" class="list-template__btns">
        <button nz-button class="btn default" (click)="addMoadl()" *ngIf="coopBtns.add">新增</button>
        <button nz-button class="btn default ml8" (click)='reset()'>重置</button>
        <button nz-button class="btn default ml8" (click)='getList(1)'>搜索</button>
				<button nz-button class="btn default ml8" (click)='autoCreate()'>自动生成</button>
			</div>
    </div>
    <div class="list-template__bottom">
      <nz-table class="list-template__nzTable" [nzData]="listOfData" nzSize="middle" [nzShowPagination]="false"
        [nzLoading]="loading1">
        <thead>
          <tr class="thead">
            <th nzWidth="5%">序号</th>
						<th nzWidth="6%">请领单号|药品类型</th>
						<th nzWidth="6%">药单类型</th>
            <th nzWidth="12%">发药科室|申请科室</th>
            <th nzWidth="10%">同步时间</th>
						<th nzWidth="12%">收取人|收取时间</th>
						<th nzWidth="12%">送达人|送达时间</th>
						<th nzWidth="8%">送达交接人</th>
            <th nzWidth="7%">状态</th>
            <th nzWidth="8%">工单号</th>
            <th nzWidth="14%">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of listOfData;let i = index">
            <td>{{i+(pageIndex-1) * pageSize + 1}}</td>
            <td>
							<div>{{data.packid}}</div>
							<div>{{data.drugsBagType && data.drugsBagType.name}}</div>
						</td>
            <td>{{ data.markType?.name }}</td>
            <td>
							<div>{{ data.launch?.dept}}</div>
							<div>{{ data.target?.dept }}</div>
						</td>
						<td>{{ data.creatTime }}</td>
            <td>
							<div>{{ data.deliveryUser?.name }}</div>
							<div>{{ data.packTime }}</div>
						</td>
						<td>
							<div>{{ data.sendUserDTO?.name }}</div>
							<div>{{ data.signtime }}</div>
						</td>
						<td>{{ data.sendHandoverUserDTO?.name }}</td>
						<td>{{ data.drugsState?.name }}</td>
            <td class="text-underline" (click)="detail($event, data)">{{ data.workOrderDTO?.gdcode }}</td>
            <td>
							<div class="coop">
							  <span (click)="showLogs(data)">查看日志</span>
							</div>
							<div class="coop" *ngIf="coopBtns.edit">
							  <span (click)="edit(data)">编辑</span>
							</div>
							<div class="coop" *ngIf="coopBtns.send && data.isCreatOder!='YES' && (data.drugsState.value == 1 || data.drugsState.value == 2 || data.drugsState.value == 4 || data.drugsState.value == 8)">
							  <span (click)="sendMsg(data)">消息发送</span>
							</div>
						</td>
          </tr>
        </tbody>
      </nz-table>
      <div class="list-template__pagination">
        <nz-pagination [(nzPageIndex)]="pageIndex" [(nzTotal)]="listLength" [(nzPageSize)]="pageSize"
          (nzPageIndexChange)="getList(0)" (nzPageSizeChange)="getList(0)">
        </nz-pagination>
      </div>
    </div>
  </div>
</div>
<!-- 清空药品模态框 -->
<app-dialog-delete [delModal]="delModal" (hideDelModalEvent)="hideDelModal()" [btnLoading]="btnLoading"
(confirmDelEvent)="confirmDel()" [content]="tipsMsg1"></app-dialog-delete>
<!-- 操作成功/失败提示框 -->
<app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow"
  [info]="promptInfo">
</app-prompt-modal>
<!-- 药包流程信息查看 -->
<app-log-prompt-modal
  *ngIf="logPromptModalShow"
  [show]="logPromptModalShow"
  [drugsBagId]="drugsBagId"
  (closeModelHs)="closeModelLog($event)"
></app-log-prompt-modal>

<!-- 新增/编辑模态框 -->
<div class="save add display_flex align-items_center justify-content_flex-center" *ngIf="modal">
  <div class="modalBody">
    <div class="title">{{add?"新增":"编辑"}}<i class="icon_transport transport-guanbi" (click)="hideModal()"></i>
    </div>
    <div class="content">
      <form nz-form [formGroup]="validateForm" class="addForm" (ngSubmit)="submitForm()">
        <nz-form-item>
          <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="packid">请领单号</nz-form-label>
          <nz-form-control nzErrorTip="请选择请领单号!">
            <nz-input-group>
        			<input nz-input class="formItem" formControlName="packid" placeholder="请输入请领单号" nzSize="default" />
            </nz-input-group>
          </nz-form-control>
        </nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="batchNo">批次号</nz-form-label>
				  <nz-form-control nzErrorTip="请选择批次号!">
				    <nz-input-group>
							<input nz-input class="formItem" formControlName="batchNo" placeholder="请输入批次号" nzSize="default" />
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="launch">发药科室</nz-form-label>
				  <nz-form-control nzErrorTip="请选择发药科室!">
				    <nz-input-group>
							<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
							  (nzOnSearch)="changeDept($event,1)" nzAllowClear nzPlaceHolder="请选择发药科室" formControlName="launch">
								<ng-container *ngFor="let option of deptList1">
								  <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>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="target">申请科室</nz-form-label>
				  <nz-form-control nzErrorTip="请选择申请科室!">
				    <nz-input-group>
							<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
							  (nzOnSearch)="changeDept($event,2)" nzAllowClear nzPlaceHolder="请选择申请科室" formControlName="target">
								<ng-container *ngFor="let option of deptList2">
								  <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>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="8" [nzXs]="24" nzRequired nzFor="creatTime">同步时间</nz-form-label>
				  <nz-form-control nzErrorTip="请选择同步时间!">
				    <nz-input-group>
				      <nz-date-picker
								nzShowTime
								nzFormat="yyyy-MM-dd HH:mm:ss"
								nzPlaceHolder="请选择同步时间"
								formControlName="creatTime"
								(ngModelChange)="onStartChange($event)"
							></nz-date-picker>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="drugsState">药品状态</nz-form-label>
				  <nz-form-control nzErrorTip="请选择药品状态!">
				    <nz-input-group>
							<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear nzPlaceHolder="请选择药品状态" formControlName="drugsState">
							  <ng-container *ngFor="let option of types">
							    <nz-option [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
							  </ng-container>
							</nz-select>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

				<nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="drugsBagType">药品类型</nz-form-label>
				  <nz-form-control nzErrorTip="请选择药品类型!">
				    <nz-input-group>
							<nz-select class="formItem" [nzDisabled]="!add" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear nzPlaceHolder="请选择药品类型" formControlName="drugsBagType">
							  <ng-container *ngFor="let option of drugsList">
							    <nz-option [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
							  </ng-container>
							</nz-select>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>

        <nz-form-item>
				  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="markType">药单类型</nz-form-label>
				  <nz-form-control nzErrorTip="请选择药单类型!">
				    <nz-input-group>
							<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear nzPlaceHolder="请选择药单类型" formControlName="markType">
							  <ng-container *ngFor="let option of markTypeList">
							    <nz-option [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
							  </ng-container>
							</nz-select>
				    </nz-input-group>
				  </nz-form-control>
				</nz-form-item>
      </form>
    </div>
    <div class="display_flex justify-content_flex-center">
      <button nzType="primary" nz-button (click)="submitForm()" [nzLoading]="btnLoading">确认</button>
      <button class="btn cancel" nz-button nzType="default" (click)="hideModal()">取消</button>
    </div>
  </div>
</div>

<!-- 发送消息 -->
<app-dialog-delete [delModal]="sendModal" (hideDelModalEvent)="hideSendModal()" [btnLoading]="btnLoading"
  (confirmDelEvent)="confirmSend()" (cancelDelEvent)="cancelSend()" content="您确认发送消息吗？消息发送会进入建单通道" confirmTxt="是" cancelTxt="否">
</app-dialog-delete>

<!-- 查看详情 -->
<router-outlet></router-outlet>

<!-- 自动生成模态框 -->
<div class="save add display_flex align-items_center justify-content_flex-center" *ngIf="autoCreateModal">
  <div class="modalBody">
    <div class="title">自动生成<i class="icon_transport transport-guanbi" (click)="hideAutoModal()"></i>
    </div>
    <div class="content">
      <form nz-form [formGroup]="validateAutoForm" class="addForm" (ngSubmit)="submitAutoForm()">
					<nz-form-item>
						<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="launch">发药科室</nz-form-label>
						<nz-form-control nzErrorTip="请选择发药科室!">
							<nz-input-group>
								<nz-select [nzDisabled]="view" class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
									(nzOnSearch)="changeInp($event)" (nzOpenChange)="changeSearch($event)" nzAllowClear nzPlaceHolder="请选择发药科室" formControlName="launch">
									<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>
							</nz-input-group>
						</nz-form-control>
					</nz-form-item>

					<nz-form-item>
					  <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="drugsBagType">药品类型</nz-form-label>
					  <nz-form-control nzErrorTip="请选择药品类型!">
					    <nz-input-group>
								<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear nzPlaceHolder="请选择药品类型" formControlName="drugsBagType">
								  <ng-container *ngFor="let option of drugsList">
								    <nz-option [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
								  </ng-container>
								</nz-select>
					    </nz-input-group>
					  </nz-form-control>
					</nz-form-item>

          <nz-form-item>
					  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="markType">药单类型</nz-form-label>
					  <nz-form-control nzErrorTip="请选择药单类型!">
					    <nz-input-group>
								<nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear nzPlaceHolder="请选择药单类型" formControlName="markType">
								  <ng-container *ngFor="let option of markTypeList">
								    <nz-option [nzLabel]="option.name" [nzValue]="option.id"></nz-option>
								  </ng-container>
								</nz-select>
					    </nz-input-group>
					  </nz-form-control>
					</nz-form-item>

					<nz-form-item>
						<nz-form-label [nzSm]="6" [nzXs]="24" nzFor="target">申请科室</nz-form-label>
						<nz-form-control nzErrorTip="请选择申请科室!">
							<nz-input-group>
								<nz-select [nzDisabled]="view" class="formItem" [nzDropdownMatchSelectWidth]="false" nzServerSearch nzShowSearch
									(nzOnSearch)="changeInp($event)" (nzOpenChange)="changeSearch($event)" nzAllowClear nzPlaceHolder="请选择申请科室" formControlName="target">
									<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>
							</nz-input-group>
						</nz-form-control>
					</nz-form-item>

					<nz-form-item>
					  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="amount">生成数量</nz-form-label>
					  <nz-form-control nzErrorTip="请选择生成数量!">
					    <nz-input-group>
								<nz-input-number formControlName="amount" (ngModelChange)="numChange($event)" [nzMin]="1" [nzMax]="50" [nzStep]="1"></nz-input-number>
							</nz-input-group>
					  </nz-form-control>
					</nz-form-item>

					<nz-form-item>
					  <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="sendMsg">是否自动发消息</nz-form-label>
					  <nz-form-control nzErrorTip="请选择是否自动发消息!">
					    <nz-input-group>
								<nz-radio-group [nzDisabled]="view" formControlName="sendMsg">
									<label nz-radio nzValue="1">是</label>
									<label nz-radio nzValue="0">否</label>
								</nz-radio-group>
					    </nz-input-group>
					  </nz-form-control>
					</nz-form-item>
      </form>
    </div>
    <div class="display_flex justify-content_flex-center">
      <button nzType="primary" nz-button (click)="submitAutoForm()" [nzLoading]="btnLoading">生成药品</button>
      <button class="btn cancel" nz-button nzType="default" (click)="hideAutoModal()">取消</button>
    </div>
  </div>
</div>
