import { AfterViewInit, ChangeDetectorRef, Component, OnChanges, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { SFAutoCompleteWidgetSchema, SFComponent, SFRadioWidgetSchema, SFSchema, SFSchemaEnumType, SFSelectWidgetSchema, SFTextareaWidgetSchema, SFUISchema } from '@delon/form';
import { _HttpClient } from '@delon/theme';
import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';
import { map } from 'rxjs/operators';
import { AmapPoiPickerComponent } from 'src/app/shared/components/amap';
import { ChannelSalesService } from '../../services/channel-sales.service';

@Component({
  selector: 'app-parter-channel-sales-edit',
  templateUrl: './edit.component.html'
})
export class ParterChannelSalesEditComponent implements OnInit {
  @ViewChild('sf', { static: false }) sf!: SFComponent;
  schema!: SFSchema;
  ui!: SFUISchema;
  i: any;
  type: any;

  constructor(
    public http: _HttpClient,
    private cdr: ChangeDetectorRef,
    private route: ActivatedRoute,
    private modalService: NzModalService,
    public service: ChannelSalesService,
    private modalRef: NzModalRef
  ) {}

  ngOnInit(): void {
    this.initSF();
  }
  initSF() {
    this.schema = {
      properties: {
        id: {
          type: 'string',
          title: '',
          ui: { hidden: true }
        },
        name: {
          title: '渠道销售姓名',
          type: 'string',
          maxLength: 12,
          ui: {
            placeholder:'请输入'
          } 
        },
        phoneNumber: {
          title: '手机号',
          type: 'string',
          maxLength: 11,
          ui: {
            placeholder:'请输入'
          } 
        },
        employeeVO: {
          title: '关联OA员工',
          type: 'string',
          ui: {
            widget: 'autocomplete',
            placeholder:'请选择',
            asyncData: () => this.service.request(this.service.$api_fuzzyQuery).pipe(
              map((res: any) => {
                console.log('111',res)
                return [];
              })
            )
          } as SFAutoCompleteWidgetSchema,
        },
        isAuthorization: {
          type: 'string',
          title: '授权登录运营后台',
          enum: [
            { label: '否', value: '0' },
            { label: '是', value: '1' }
          ],
          ui: {
            widget: 'radio',
          } as SFRadioWidgetSchema,
          default: '0',
        },
        roleIds: {
          title: '角色',
          type: 'string',
          ui: {
            widget: 'select',
            placeholder: '授权角色',
            mode: 'multiple',
            maxMultipleCount: 5,
            asyncData: () => {
              return this.service.request(this.service.$api_getAppRoleList).pipe(
                map((res: any) => {
                  return res
                    .filter((role: any) => role.roleCode !== 'Administrator')
                    .map((item: any) => {
                      return { label: item.roleName, value: item.id };
                    });
                })
              );
            },
            visibleIf: { isAuthorization: (value: string) => value === '1' }
          },
        },
        remark: {
          type: 'string',
          title: '备注',
          maxLength: 50,
          ui: {
            widget: 'textarea',
            autosize: { minRows: 3, maxRows: 6 },
            placeholder:'请输入50字符'
          } as SFTextareaWidgetSchema,
        },
      },
      required: ['name', 'phoneNumber', 'employeeVO', 'roleIds', 'remark']
    };
    this.ui = {
      '*': {
        spanLabelFixed: 150,
        grid: { span: 24 }
      },
      $isAuthorization:{  grid: { span: 12 }},
      $roleIds:{ spanLabelFixed: 10, grid: { span: 12 }},
      

    };
  }

  close() {
    this.modalRef.destroy();
  }
  save() {
    this.sf.validator({ emitError: true });
    if(!this.sf.valid) return;
    this.service.request(this.service.$api_save, { ...this.sf.value }).subscribe(res => {
      if (res) {
        this.modalRef.destroy(true);
      } else {
        this.service.msgSrv.error(res.msg);
      }
    });
  }
}