<div class="todo_wrapper">
  <!-- <div Button (onClick)="showAlert()">customized buttons</div> -->
  <div class="top">
    <div class="head">
      <h3 (click)="goBack()">&lt;</h3>
      <h3>新建日程</h3>
      <div id="add_calendar_wrapper">
        <List className="calendar-list" style="backgroundColor: 'white'">
          <ListItem (onClick)="clickCalendar()">
            {{this.state.en ? '日历' : '日历'}}
          </ListItem>
        </List>
        <Calendar [(ngModel)]="this.state.date"
                  [visible]="this.state.show"
                  [getDateExtra]="this.state.getDateExtra"
                  [defaultDate]="this.state.now"
                  [pickTime]="this.state.pickTime"
                  [type]="this.state.type"
                  [rowSize]="this.state.rowSize"
                  [showShortcut]="this.state.showShortcut"
                  [infinite]="this.state.infinite"
                  [defaultValue]="this.state.defaultValue"
                  [onSelect]="this.state.onSelect"
                  (onCancel)="triggerCancel()"
                  (onConfirm)="triggerConfirm($event)"
        ></Calendar>
      </div>
    </div>
    <ul class="nav">
      <li *ngFor="let tabItem of tabList;index as i;"  [ngClass]="{'selected':tabItem.code === tabType}" (click)="selectTab(tabItem.code,tabItem.taskType)">
        <span> {{tabItem.name}} </span>
      </li>
    </ul>
  </div>
  <div class="task_content_wrapper">
    <div class="part_wrapper part1">
      <ul class="part1_list">
        <li *ngFor="let salesActivityItem of salesActivityList" [ngClass]="{'selected':mdDropOptionId==salesActivityItem.id}" (click)="selectTask(salesActivityItem.id);">
          {{salesActivityItem.dropOptionName}}
        </li>
      </ul>
      <div class="important_mark"> <span [ngClass]="{'circle':taskImportantTag==true}" (click)="taskImportantTag=!taskImportantTag"></span> <div>重要标签</div> </div>
    </div>
    <div class="part_wrapper part2">
      <div style="font-size: 18px;">选择任务需要的时间</div>
      <div class="timeContent">
        <div class="picker_list">
          <PickerView [data]="seasons" [cascade]="false" [(ngModel)]="taskTimeFrom" (ngModelChange)="onChange($event,1)"></PickerView>
        </div>
        <div style="color: #d9dadc;width: 10%;text-align: center;">到</div>
        <div class="picker_list">
          <PickerView [data]="seasons" [cascade]="false" [(ngModel)]="taskTimeEnd" (ngModelChange)="onChange($event,2)"></PickerView>
        </div>
      </div>
    </div>
    <div class="part_wrapper part3">
      <div style="margin-bottom: 10px;">任务长期固定在：</div>
      <ul class="part3_list">
        <li *ngFor="let longTermItem of longTermList" [ngClass]="{'selectedLongTerm':longTermItem.isLongTermTask == true}" (click)="longTermItem.isLongTermTask=!longTermItem.isLongTermTask">
          <span></span>
          <div>{{longTermItem.name}}</div>
        </li>
      </ul>
    </div>
    <div class="part_wrapper part4" style="margin-bottom: 60px;">
      <div style="font-size: 18px;margin-bottom: 10px;">添加备注</div>
      <textarea style="border:0;border-radius:5px;background:#f6f6f6;width: 355px;height: 100px;padding: 10px;resize: none;" [(ngModel)]="notice"></textarea>
    </div>
  </div>
  <div class="footer">添加任务</div>
</div>
<!-- <div class="link_totast_wrapper" *ngIf="linkToastFlag">
  <div class="link_mask"></div>
  <div class="link_totast_content_wrapper">
    <div class="link_content">
        <div class="close" (click)="linkToastFlag=false;">X</div>
        <div class="link_body">
          <div class="title">
            是否联系到{{totastTitle}}
          </div>
          <div class="sub_title"></div>
        </div>
        <div class="link_footer">
          <div style="border-right: 1px #d1d1d1 solid;" (click)="linkToastFlag=false;">否</div>
          <div style="color: #f8002e;" (click)="jumpToLink()">是</div>
        </div>
    </div>
  </div>
</div> -->
