import { Component, Injector, computed } from "@angular/core";
import { FormBuilder, FormControl } from "@angular/forms";

import { RoutedEditComponent } from "@shared";
import {
  xCnameCxByIdQuery,
  xCnameCxByIdQueryVariables,
  xCnameCxByIdGql,
  CreatexCnameCxsGql,
  EditxCnameCxsGql,
  xCnameCx,
  xCnameCxDetailFragment,
} from "@shared/graphql/.generated/type";
import { RouteParamsMappings } from "@shared";

type EntityEditablePart = Pick<xCnameCxDetailFragment, "name">;

export type xCnameCxEditPageParams = {
  id: string;
};
@Component({
  selector: "app-xdnamedx-edit",
  templateUrl: "./edit.page.html",
  styles: [],
})
export class xCnameCxEditPage extends RoutedEditComponent<xCnameCxEditPageParams, xCnameCxDetailFragment, EntityEditablePart> {
  override routeParamsMappings: RouteParamsMappings<xCnameCxEditPageParams> = {
    id: { position: "queryParams", default: null },
  }
  id = computed(() => this.params$().id);
  override async onRouted(params: xCnameCxEditPageParams) {
    const id = params.id;
    this.mode = id ? "edit" : "create";
    let fb: FormBuilder = new FormBuilder();

    let formConfig: ValueOrTypedAbstractControl<EntityEditablePart>;
    if (id) {
      let res = await this.apollo
        .query<xCnameCxByIdQuery, xCnameCxByIdQueryVariables>({
          query: xCnameCxByIdGql,
          variables: {
            id: id,
          },
        })
        .toPromise();
      let entity = res.data.xcnamecxById;
      this.entity = entity;
      formConfig = { name: new FormControl(entity.name) };
    } else {
      formConfig = { name: new FormControl("") };
    }
    let entityForm = fb.build(formConfig);
    this.entityForm = entityForm;
    this.originalValue = entityForm.value;

  }

  constructor(injector: Injector) {
    super(injector);
  }

  async submit(): Promise<void> {
    if (this.mode === "create") {
      await this.apollo
        .mutate({
          mutation: CreatexCnameCxsGql,
          variables: {
            input: {
              name: this.entityForm.value.name,
            },
          },
        })
        .toPromise();
      this.msgSrv.success("添加成功");
      await this.back(true);
    } else {
      if (this.mode === "edit") {
        await this.apollo
          .mutate({
            mutation: EditxCnameCxsGql,
            variables: {
              id: this.id(),
              input: {
                name: this.entityForm.value.name,
              },
            },
          })
          .toPromise();
        this.msgSrv.success("修改成功");
        await this.back(true);
      }
    }
  }
}