@dignite-ng/expand.cms 0.0.19 → 0.0.20

package/src/lib/components/admin/entries/create-or-edit-entries.component.ts

@@ -0,0 +1,287 @@
+import { ConfigStateService, LocalizationService } from '@abp/ng.core';
+import { ToasterService } from '@abp/ng.theme.shared';
+import { AfterContentInit, Component, Input, QueryList, ViewChild, ViewChildren, ViewContainerRef, inject } from '@angular/core';
+import { AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { EntryAdminService } from '../../../proxy/admin/entries';
+import { SectionAdminService } from '../../../proxy/admin/sections';
+import { Observable } from 'rxjs';
+import { DatePipe, Location } from '@angular/common';
+import { CmsApiService } from '../../../services';
+import { CreateDynamicComponentsService } from '@dignite-ng/expand.dynamic-form';
+
+@Component({
+  selector: 'cms-create-or-edit-entries',
+  templateUrl: './create-or-edit-entries.component.html',
+  styleUrls: ['./create-or-edit-entries.component.scss']
+})
+export class CreateOrEditEntriesComponent implements AfterContentInit {
+
+
+  constructor(
+    private toaster: ToasterService,
+    public _location: Location,
+    private configState: ConfigStateService,
+    private _SectionAdminService: SectionAdminService,
+    private _EntryAdminService: EntryAdminService,
+    private datePipe: DatePipe,
+    private _LocalizationService: LocalizationService,
+    private router: Router,
+    private _CmsApiService: CmsApiService,
+  ) { }
+
+
+  /**语言 */
+  cultureName: string = ''
+  /**条目id */
+  entryTypeId: string = ''
+
+  /**新建版本的版本id，同条目id */
+  RevisionEntryId: any = ''
+  /**选择的条目项 */
+  entryTypesItem: any = ''
+  /**版块id */
+  sectionId: string = ''
+  /**版块详情 */
+  SectionSelect: any = ''
+  /**语言列表 */
+  languagesList: any[] = []
+  /**条目类型列表-用于选择上级条目 */
+  entryTypesList: any[] = []
+  /**版本列表 */
+  AllVersionsList: any[] = []
+
+  /**是否是编辑 */
+  @Input() isEdit = false
+
+  /**来自父组件的传值 */
+  FromParentQueryParams: any = ''
+  @Input()
+  public set ParentQueryParams(v: any) {
+    if (v) {
+      this.FromParentQueryParams = v;
+    }
+  }
+
+  /**表单实体 */
+  _entity: FormGroup | undefined
+  @Input()
+  public set entity(v: any) {
+    if (v) {
+      this._entity = v;
+    }
+  }
+  /**指定id的条目信息 */
+  entrySelect: any = ''
+  @Input()
+  public set parentEntrySelect(v: any) {
+    if (v) {
+      let V_extraProperties = this._CmsApiService.deepClone(this.convertExtraProperties(v.extraProperties))
+      v.extraProperties = V_extraProperties
+      this.entrySelect = v;
+    }
+  }
+  /**将对象中的ExtraProperties赋值到extraProperties */
+  convertExtraProperties(obj) {
+    for (let key in obj) {
+      if (Array.isArray(obj[key])) {
+        obj[key].forEach(item => {
+          if (item.hasOwnProperty('ExtraProperties')) {
+            item['extraProperties'] = item['ExtraProperties'];
+          }
+        });
+      }
+    }
+    return obj;
+  }
+
+  /**别名表单实体 */
+  get sluginput() {
+    return this._entity.get('slug')
+  }
+  /**语言表单实体 */
+  get cultureinput() {
+    return this._entity.get('culture')
+  }
+  /**语言表单实体影子 */
+  get culture_shadowInput() {
+    return this._entity.get('culture_shadow')
+  }
+
+  /**extraProperties配置表单实体 */
+  get extraProperties() {
+    return this._entity.get('extraProperties') as FormGroup
+  }
+  async ngAfterContentInit(): Promise<void> {
+    //Called after ngOnInit when the component's or directive's content has been initialized.
+    //Add 'implements AfterContentInit' to the class.
+    let queryParams = this.FromParentQueryParams
+    if (this._entity && this.FromParentQueryParams) {
+      this._entity.setControl('slug', new FormControl('', {
+        validators: Validators.required,
+        asyncValidators: this.repetitionAsyncValidator(),
+        updateOn: 'blur'
+      }))
+      this._entity.setControl('culture_shadow', new FormControl('', {
+        validators: [Validators.required],
+        asyncValidators: this.cultureAsyncValidator_test(),
+      }))
+      this._entity.get('culture').disable();
+      if (queryParams.RevisionEntryId && this.entrySelect) {
+        this.RevisionEntryId = queryParams.RevisionEntryId
+        this.setEntryconfig(this.entrySelect);
+      } else {
+        this.setEntryconfig(queryParams);
+      }
+      if (this.sectionId) await this.getSectionSelect();
+      if (this.RevisionEntryId) await this.getAllVersionsList()
+
+    }
+
+
+  }
+
+  /**表单控件模板-动态表单配置组件 */
+  @ViewChildren('FormDynamicontrolRef', { read: ViewContainerRef }) FormDynamicontrolRef: QueryList<ViewContainerRef>;
+
+  // private _CreateDynamicComponentsService = inject(CreateDynamicComponentsService)
+
+
+
+
+  /**定义自定义异步验证 */
+  cultureAsyncValidator_test() {
+    return (ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> => {
+      return new Promise(resolve => {
+        let subculture = this._entity?.get('culture').value
+        if (subculture == this.entrySelect?.culture || this.SectionSelect.type !== 0) {
+          resolve(null);
+          return
+        }
+        this._EntryAdminService.cultureExistWithSingleSection({
+          culture: subculture,
+          sectionId: this.sectionId,
+          entryTypeId: this.entryTypeId
+        }).subscribe(res => {
+          if (res) {
+            resolve({ repetition: this._LocalizationService.instant(`Cms::EntriesAlreadyExistEntryType`, this.entryTypesItem.displayName, this.languagesList.find(el => el.cultureName == subculture).displayName) });
+          } else {
+            resolve(null);
+          }
+        })
+      });
+    };
+  }
+
+
+  /**  
+ * 设置条目详情  
+ * @param {object} source - 数据源对象  
+ */
+  setEntryconfig(source: any) {
+    this.entryTypeId = source.entryTypeId;
+    this.cultureName = source.culture || source.cultureName;
+    this.sectionId = source.sectionId;
+  }
+  time: number = 0
+
+  /**定义自定义异步验证 */
+  repetitionAsyncValidator() {
+    return (ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> => {
+      return new Promise(resolve => {
+        let subslug = this._entity?.get('slug').value
+        if (subslug == this.entrySelect?.slug) {
+          resolve(null);
+          return
+        }
+        this._EntryAdminService.slugExists({
+          culture: this.cultureName,
+          sectionId: this.sectionId,
+          slug: subslug
+        }).subscribe(res => {
+          if (res) {
+            resolve({ repetition: this._LocalizationService.instant(`Cms::EntrySlug{0}AlreadyExist`, ctrl.value) });
+          } else {
+            resolve(null);
+          }
+        })
+      });
+    };
+  }
+
+
+
+  /**获取版块详情 */
+  getSectionSelect() {
+    return new Promise((resolve, rejects) => {
+      this._SectionAdminService.get(this.sectionId).subscribe(async (res) => {
+        let languages = this.configState.getDeep('localization.languages')
+        this.languagesList = languages.filter(el => res?.site?.languages.some(elr => elr.cultureName == el.cultureName))
+        let entryTypesItem = res.entryTypes.find(el => el.id == this.entryTypeId)
+        this.SectionSelect = res
+        this.entryTypesItem = entryTypesItem
+        this.entryTypesList = res.entryTypes.filter(el => el.id == this.entryTypeId)
+        this._entity.patchValue({
+          ...this.entrySelect,
+          initialVersionId: this.entrySelect?.initialVersionId || this.RevisionEntryId || '',
+          culture: this.cultureName,
+          culture_shadow: this.cultureName,
+          entryTypeId: this.entryTypeId,
+          publishTime: this.datePipe.transform(new Date(), 'yyyy-MM-dd HH:mm:ss'),
+        })
+        resolve(true)
+      })
+    })
+  }
+
+  /**获取条目版本列表 */
+  getAllVersionsList() {
+    return new Promise((resolve, rejects) => {
+
+      this._EntryAdminService.getAllVersions(this.RevisionEntryId).subscribe(res => {
+        this.AllVersionsList = res.items
+        resolve(res)
+      })
+    })
+  }
+
+  /**标题转化别名 */
+  setTitleToSlugBlur(event) {
+    let val = event.target.value
+    let slug = this._entity.get('slug')
+    let pinyinstr = ''
+    if (slug.value) return
+    pinyinstr = this._CmsApiService.chineseToPinyin(val)
+    this._entity.patchValue({
+      slug: pinyinstr || val
+    })
+  }
+  /**使用Unicode编码范围判断是否是中文字符 */
+  isChinese(str) {
+    return /^[\u4e00-\u9fa5]+$/.test(str);
+  }
+
+  /**激活 */
+  ActivatedVersion(VersionId) {
+    this._EntryAdminService.activate(VersionId).subscribe((res) => {
+      this.AllVersionsList.forEach(el => {
+        el.isActivatedVersion = el.id === VersionId
+      })
+      return
+    })
+  }
+  /**编辑版本 */
+  toEditUrl(id) {
+    this.router.navigateByUrl('', { skipLocationChange: true }).then(() => {
+      this.router.navigate([`/cms/admin/entries/${id}/edit`]);
+    });
+  }
+  /**删除版本 */
+  delectVersion(vid) {
+    this._EntryAdminService.delete(vid).subscribe(res => {
+      this.toaster.success(this._LocalizationService.instant(`AbpUi::SuccessfullyDeleted`));
+      this.getAllVersionsList()
+    })
+  }
+
+}

package/src/lib/components/admin/entries/create-or-update-entry-input-base.ts

@@ -0,0 +1,36 @@
+import { FormGroup, Validators } from "@angular/forms";
+
+export class CreateOrUpdateEntryInputBase {
+    /**语言 */
+    culture: any = ['', [Validators.required]]
+    /**条目id */
+    entryTypeId: any = ['']
+    /**标题 */
+    title: any = ['', [Validators.required]]
+    /**别名 */
+    slug: any = ['', [Validators.required]]
+    /**是否是草稿 */
+    draft: any = ['', []]
+    /**发布时间 */
+    publishTime: any = ['', [Validators.required]]
+    /**上级目录 */
+    parentId:any=[null]
+    /**修订说明 */
+    versionNotes:any=[null]
+    /**版本 */
+    initialVersionId: any = [null]
+
+    extraProperties: FormGroup | undefined = new FormGroup({})
+
+    constructor(data?: CreateOrUpdateEntryInputBase) {
+        if (data) {
+            for (const key in data) {
+                if (data.hasOwnProperty(key)) {
+                    this[key] = data[key];
+                }
+            }
+        }
+
+    }
+}
+

package/src/lib/components/admin/entries/create.component.html

@@ -0,0 +1,13 @@
+<form class="row g-3 needs-validation" [formGroup]="newEntity" (ngSubmit)="save(draftType)">
+    <abp-page [title]="'Cms::New'| abpLocalization" [toolbar]="true">
+        <button type="submit" style="display: none;" #submitclick></button>
+        <ng-container *ngIf="entrySelect; else elseTemplate">
+            <cms-create-or-edit-entries [entity]="newEntity" [ParentQueryParams]="queryParams"
+                [parentEntrySelect]="entrySelect" ></cms-create-or-edit-entries>
+        </ng-container>
+        <ng-template #elseTemplate>
+            <cms-create-or-edit-entries [entity]="newEntity"
+                [ParentQueryParams]="queryParams" ></cms-create-or-edit-entries>
+        </ng-template>
+    </abp-page>
+</form>

package/src/lib/components/admin/entries/create.component.scss

@@ -0,0 +1,21 @@
+::ng-deep .create-or-edit-entry-page {
+    .dignite_page {
+        height: calc(100vh - 32px - 53px - 40px);
+        overflow: auto;
+        background: transparent;
+    }
+
+    .form-control,
+    .form-select {
+        padding: 0.475rem 1.25rem;
+    }
+    .cursor-move{
+        cursor: move;
+    }
+    .bordernNavs{
+        border: var(--bs-border-width) solid var(--lpx-border-color);
+        padding-left: inherit;
+        padding-right: inherit;
+    }
+}
+

package/src/lib/components/admin/entries/create.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CreateComponent } from './create.component';
+
+describe('CreateComponent', () => {
+  let component: CreateComponent;
+  let fixture: ComponentFixture<CreateComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [CreateComponent]
+    });
+    fixture = TestBed.createComponent(CreateComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/components/admin/entries/create.component.ts

@@ -0,0 +1,103 @@
+import { ToasterService } from '@abp/ng.theme.shared';
+import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core';
+import {  FormBuilder, FormGroup} from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import {  Location } from '@angular/common';
+import { CreateOrUpdateEntryInputBase } from './create-or-update-entry-input-base';
+import { LocalizationService } from '@abp/ng.core';
+import { EntryAdminService } from '../../../proxy/admin/entries';
+import { EXTENSIONS_IDENTIFIER } from '@abp/ng.theme.shared/extensions';
+import { ECmsComponent } from '../../../enums/ecms-component';
+import { CmsApiService } from '../../../services';
+import { UpdateListService } from '../../../services/update-list.service';
+
+
+
+@Component({
+  selector: 'cms-create',
+  templateUrl: './create.component.html',
+  styleUrls: ['./create.component.scss'],
+  providers: [
+    {
+      provide: EXTENSIONS_IDENTIFIER,
+      useValue: ECmsComponent.Entries_Create,
+    },
+  ]
+})
+export class CreateComponent implements OnInit {
+  constructor(
+    private toaster: ToasterService,
+    public _location: Location,
+    private route: ActivatedRoute,
+    private _EntryAdminService: EntryAdminService,
+    private _LocalizationService: LocalizationService,
+    private router: Router,
+  ) { }
+  private fb=inject(FormBuilder)
+  private _updateListService=inject(UpdateListService)
+
+  /**表单实体 */
+  newEntity: FormGroup | undefined
+
+  /**是否是草稿 */
+  draftType: boolean = false
+  /**页面传值用于传递到子组件 */
+  queryParams: any = ''
+
+  /**指定id的条目信息 */
+  entrySelect: any = ''
+
+  /**获取提交按钮替身，用于真实触发表单提交 */
+  @ViewChild('submitclick', { static: true }) submitclick: ElementRef;
+
+  async ngOnInit(): Promise<void> {
+    this.queryParams = this.route.snapshot.queryParams
+    this.newEntity = this.fb.group(new CreateOrUpdateEntryInputBase())
+    if(this.queryParams.RevisionEntryId)   await this.getEntrySelect();
+  }
+
+  /**获取条目信息 */
+  getEntrySelect() {
+    return new Promise((resolve, rejects) => {
+      this._EntryAdminService.get(this.queryParams.RevisionEntryId).subscribe(res => {
+        this.entrySelect = res
+        
+        resolve(res)
+      })
+    })
+  }
+
+
+
+  /**保存 */
+  save(draft) {
+    this.newEntity.patchValue({
+      draft: draft
+    })
+    let input = this.newEntity.value
+    input.publishTime = new Date(new Date(input.publishTime).getTime() + (8 * 60 * 60 * 1000)).toISOString()
+    input.culture=this.newEntity.get('culture').value
+    if (!this.newEntity.valid) return
+    this._EntryAdminService.create(input).subscribe(res => {
+      this.toaster.success(this._LocalizationService.instant(`CmsKit::SavedSuccessfully`));
+      this.router.navigateByUrl('', { skipLocationChange: true }).then(() => {
+        this.router.navigate([`/cms/admin/entries`]);
+        this._updateListService.updateList();
+      });
+    })
+  }
+
+  /**触发点击按钮替身 */
+  clickSubmit(type) {
+    this.draftType = type
+    this.submitclick.nativeElement.click()
+  }
+  /**返回上一页 */
+  backTo() {
+    this._location.back()
+  }
+
+
+
+
+}

package/src/lib/components/admin/entries/edit.component.html

@@ -0,0 +1,9 @@
+<form class="row g-3 needs-validation" [formGroup]="newEntity" (ngSubmit)="save(draftType)">
+    <abp-page [title]="'AbpUi::Edit'| abpLocalization" [toolbar]="true">
+        <button type="submit" style="display: none;" #submitclick></button>
+        <ng-container *ngIf="entrySelect">
+        <cms-create-or-edit-entries [entity]="newEntity" [ParentQueryParams]="queryParams" [parentEntrySelect]="entrySelect" [isEdit]="true"></cms-create-or-edit-entries>
+    </ng-container>
+    </abp-page>
+</form>
+

package/src/lib/components/admin/entries/edit.component.scss

@@ -0,0 +1,26 @@
+::ng-deep .edit-entry-page {
+    .dignite_page {
+        height: calc(100vh - 32px - 53px - 40px);
+        overflow: auto;
+        background: transparent;
+    }
+
+    .form-control,
+    .form-select {
+        padding: 0.475rem 1.25rem;
+    }
+    .cursor-move{
+        cursor: move;
+    }
+    .bordernNavs{
+        border: var(--bs-border-width) solid var(--lpx-border-color);
+        padding-left: inherit;
+        padding-right: inherit;
+    }
+    .flex-between{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+    }
+}
+

package/src/lib/components/admin/entries/edit.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { EditComponent } from './edit.component';
+
+describe('EditComponent', () => {
+  let component: EditComponent;
+  let fixture: ComponentFixture<EditComponent>;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      declarations: [EditComponent]
+    });
+    fixture = TestBed.createComponent(EditComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/components/admin/entries/edit.component.ts

@@ -0,0 +1,103 @@
+/* eslint-disable @angular-eslint/use-lifecycle-interface */
+import { ToasterService } from '@abp/ng.theme.shared';
+import { Component, ElementRef, OnInit, ViewChild, inject } from '@angular/core';
+import { FormBuilder, FormGroup  } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import {  Location } from '@angular/common';
+import { CreateOrUpdateEntryInputBase } from './create-or-update-entry-input-base';
+import {  LocalizationService } from '@abp/ng.core';
+import { EntryAdminService } from '../../../proxy/admin/entries';
+import { EXTENSIONS_IDENTIFIER } from '@abp/ng.theme.shared/extensions';
+import { ECmsComponent } from '../../../enums/ecms-component';
+import { CmsApiService } from '../../../services';
+import { UpdateListService } from '../../../services/update-list.service';
+
+@Component({
+  selector: 'cms-edit',
+  templateUrl: './edit.component.html',
+  styleUrls: ['./edit.component.scss'],
+  providers: [
+    {
+      provide: EXTENSIONS_IDENTIFIER,
+      useValue: ECmsComponent.Entries_Edit,
+    },
+  ]
+})
+export class EditComponent implements OnInit {
+
+  constructor(
+    private toaster: ToasterService,
+    public _location: Location,
+    private route: ActivatedRoute,
+    private _EntryAdminService: EntryAdminService,
+    private router: Router,
+    private _LocalizationService: LocalizationService,
+    private _CmsApiService: CmsApiService,
+  ) { }
+  private fb=inject(FormBuilder)
+  private _updateListService=inject(UpdateListService)
+  /**表单实体 */
+  newEntity: FormGroup | undefined
+
+  /**是否是草稿 */
+  draftType: boolean = false
+
+  /**页面传值用于传递到子组件 */
+  queryParams: any = '' || {}
+
+  /**指定id的条目信息 */
+  entrySelect: any = ''
+
+  /**获取提交按钮替身，用于真实触发表单提交 */
+  @ViewChild('submitclick', { static: true }) submitclick: ElementRef;
+
+  async ngOnInit() {
+    this.queryParams.RevisionEntryId = this.route.snapshot.params.entrieId
+    this.newEntity = this.fb.group(new CreateOrUpdateEntryInputBase())
+    await this.getEntrySelect()
+  }
+
+  /**获取条目信息 */
+  getEntrySelect() {
+    return new Promise((resolve, rejects) => {
+      this._EntryAdminService.get(this.queryParams.RevisionEntryId).subscribe(res => {
+        this.entrySelect = res
+        resolve(res)
+      })
+    })
+  }
+
+
+
+
+  /**保存 */
+  save(draft) {
+    
+    this.newEntity.patchValue({
+      draft: draft
+    })
+    let input = this.newEntity.value
+    input.publishTime = new Date(new Date(input.publishTime).getTime() + (8 * 60 * 60 * 1000)).toISOString()
+    input.culture=this.newEntity.get('culture').value
+    input.concurrencyStamp = this.entrySelect.concurrencyStamp
+    if (!this.newEntity.valid) return
+    this._EntryAdminService.update(this.entrySelect.id, input).subscribe(res => {
+      this.toaster.success(this._LocalizationService.instant(`CmsKit::SavedSuccessfully`));
+      this.router.navigateByUrl('', { skipLocationChange: true }).then(() => {
+        this.router.navigate([`/cms/admin/entries`]);
+        this._updateListService.updateList();
+      });
+    })
+  }
+
+  /**触发点击按钮替身 */
+  clickSubmit(type) {
+    this.draftType = type
+    this.submitclick.nativeElement.click()
+  }
+  /**返回上一页 */
+  backTo() {
+    this._location.back()
+  }
+
+}