@kre-form/ant
Version:
1,175 lines • 179 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, Input, Output, EventEmitter, ChangeDetectorRef, } from "@angular/core";
import { FormGroup } from "@angular/forms";
import { clone, KreFormCommonService, KreFormBuilder, } from "@kre-form/core";
import { NzModalService } from "ng-zorro-antd/modal";
import { NzMessageService } from "ng-zorro-antd/message";
import * as _ from "lodash";
import { KreFormAntService } from "../../tools/service";
import { KreDialogService } from "../../service/dialog.service";
import { DataService } from "../../service/data.service";
import { KreAntCommonService } from "../../tools/commonService";
import { KreTransferService } from "../../tools/transferService";
import { KreDesginToFormService } from "../../tools/tableFieldService";
import { KreFormDSField } from "../field/index.component";
import { KreFormDSFieldLabel } from "../field-label/index.component";
import { KreFormDesignTable } from "../table/table.component";
import { KreFormDesignTables } from "../tables/table.component";
/**
* @record
*/
export function IFormJSON() { }
if (false) {
/** @type {?} */
IFormJSON.prototype.code;
/** @type {?} */
IFormJSON.prototype.name;
/** @type {?} */
IFormJSON.prototype.type;
/** @type {?} */
IFormJSON.prototype.column;
/** @type {?} */
IFormJSON.prototype.row;
/** @type {?} */
IFormJSON.prototype.fields;
}
export class KreFormDesignDetailX {
/**
* @param {?} cd
* @param {?} message
* @param {?} modalService
* @param {?} kreFormAntService
* @param {?} kreDialogService
* @param {?} dataService
* @param {?} kreAntCommonService
* @param {?} kreTransferService
* @param {?} kreDesginToFormService
* @param {?} kreFormCommonService
* @param {?} formBuilder
*/
constructor(cd, message, modalService, kreFormAntService, kreDialogService, dataService, kreAntCommonService, kreTransferService, kreDesginToFormService, kreFormCommonService, formBuilder) {
this.cd = cd;
this.message = message;
this.modalService = modalService;
this.kreFormAntService = kreFormAntService;
this.kreDialogService = kreDialogService;
this.dataService = dataService;
this.kreAntCommonService = kreAntCommonService;
this.kreTransferService = kreTransferService;
this.kreDesginToFormService = kreDesginToFormService;
this.kreFormCommonService = kreFormCommonService;
this.formBuilder = formBuilder;
this.showForm = true;
this.formCode = "";
this.layout = true;
this.api = {
tables: { url: "assets/mockData/business.json" },
form: { url: "assets/mockData/formInfo.json" },
};
this.showAnchorList = true;
/*
表字段集合
*/
this._business_tables = {
primary: {},
child: { single: [], multiple: [] },
};
this._langConfig = [];
// _lang: string = "zh-cn";
// @Input()
// set lang(value: any) {
// this._lang = value;
// }
// get lang() {
// return this._lang;
// }
this._triggerJson = {};
this._calculateRuleJson = {};
this._options = [];
/*
表设置
*/
this._business_form = {
code: "",
name: "",
type: "",
column: "",
row: "",
fields: [],
};
this.isSaveButton = false;
this.saveEvent = new EventEmitter();
this.cancelEvent = new EventEmitter();
this.previewEvent = new EventEmitter();
this.actionEvent = new EventEmitter();
this.pageStatus = 1;
this.form_model = {};
this.form_group = new FormGroup({});
this.form_fields = [];
this.kreFormInfo = {};
this.layout_column = "layout-column-3";
this.layout_row = "layout-row-1";
this.table_Data = [];
this.anchorList = [];
this.anchorDevList = {};
this.key = "";
this.AddReferProcessDisabled = false;
}
/**
* @param {?} value
* @return {?}
*/
set business_tables(value) {
this._business_tables = value;
}
/**
* @return {?}
*/
get business_tables() {
return this._business_tables;
}
/**
* @param {?} value
* @return {?}
*/
set langConfig(value) {
this._langConfig = value;
}
/**
* @return {?}
*/
get langConfig() {
return this._langConfig;
}
/**
* @param {?} value
* @return {?}
*/
set triggerJson(value) {
this._triggerJson = value;
}
/**
* @return {?}
*/
get triggerJson() {
return this._triggerJson;
}
/**
* @param {?} value
* @return {?}
*/
set calculateRuleJson(value) {
this._calculateRuleJson = value;
}
/**
* @return {?}
*/
get calculateRuleJson() {
return this._calculateRuleJson;
}
/**
* @param {?} value
* @return {?}
*/
set options(value) {
this._options = value;
}
/**
* @return {?}
*/
get options() {
return this._options;
}
/**
* @param {?} value
* @return {?}
*/
set business_form(value) {
if (value != undefined && value != null) {
this._business_form = value;
this.initFormInfo(this._business_form);
this.cd.detectChanges();
}
}
/**
* @return {?}
*/
get business_form() {
return this._business_form;
}
/**
* @return {?}
*/
ngOnInit() {
this.kreFormAntService.btnEvent.subscribe((/**
* @param {?} res
* @return {?}
*/
(res) => {
if (res["type"] == "delete" ||
res["type"] == "up" ||
res["type"] == "down") {
/** @type {?} */
let cloneField = _.cloneDeep(res["field"]);
/** @type {?} */
let checkedList = this.kreTransferService.getGroupCheckFields(cloneField);
if (checkedList == null || checkedList.length == 0) {
this.message.warning("您当前没有选中任何项!");
return;
}
}
switch (res["type"]) {
case "delete":
this.modalService.confirm({
nzTitle: "提示",
nzContent: `您确定要删除选中项？<br/><span class="delete_tips" >提示：如果该字段是内置字段，则删除无效。</br>   如果该字段关联了触发事件，则删除无效。</span>`,
nzOnOk: (/**
* @return {?}
*/
() => {
this.groupBtnDeleteFields(res["field"]);
}),
});
break;
case "up":
case "down":
this.groupBtnMoveUpOrDown(res["field"], res["type"]);
break;
case "item":
this.groupBtnTableFields(res["field"]);
break;
case "remark":
case "line":
this.groupBtnAddLineRemark(res["field"], res["type"]);
break;
case "edit":
this.editFormFieldConfig(res["field"]);
break;
default:
break;
}
}));
this.kreFormAntService.fieldEvent.subscribe((/**
* @param {?} res
* @return {?}
*/
(res) => {
/** @type {?} */
let sign = res["sign"];
if (sign == "edit") {
this.editFormFieldConfig(res["field"]);
}
else if (sign == "delete") {
this.modalService.confirm({
nzTitle: "提示",
nzContent: `您确定要删除该项？<br/><span class="delete_tips" >提示：如果该字段是内置字段，则删除无效。</br>   如果该字段关联了触发事件，则删除无效。</span>`,
nzOnOk: (/**
* @return {?}
*/
() => {
this.deleteFormFieldConfig(res["field"]);
}),
});
}
}));
this.initAnchorList();
this.AddReferProcessDisabled = this.business_form.fields.some((/**
* @param {?} el
* @return {?}
*/
(el) => el.key === "comprehensive$df_comprehensiveapply$associationprocess"));
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.business_tables) {
this.initTableFieldStatus();
}
}
/**
* @return {?}
*/
ngOnDestroy() { }
/*按钮区域---begin*/
/**
* @return {?}
*/
btnSave() { }
/**
* @return {?}
*/
btnCancel() { }
/**
* @return {?}
*/
btnPreview() { }
/**
* @return {?}
*/
btnDelete() {
/** @type {?} */
let checkedList = this.getCheckFields();
if (checkedList == null || checkedList.length == 0) {
this.message.warning("您当前没有选中任何项!");
return;
}
/** @type {?} */
let isRelativeEvent = false;
if (!!this.triggerJson && !_.isEmpty(this.triggerJson)) {
Object.keys(this.triggerJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
if ((/** @type {?} */ (((/** @type {?} */ (checkedList))))).some((/**
* @param {?} el
* @return {?}
*/
(el) => el.field.key === key))) {
isRelativeEvent = true;
}
}));
Object.keys(this.triggerJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
(/** @type {?} */ (((/** @type {?} */ (this.triggerJson[key]))))).forEach((/**
* @param {?} ele
* @return {?}
*/
(ele) => {
if ((/** @type {?} */ (((/** @type {?} */ (checkedList))))).some((/**
* @param {?} el
* @return {?}
*/
(el) => el.field.key === ele.fieldKey))) {
isRelativeEvent = true;
}
}));
}));
}
if (!!this.calculateRuleJson && !_.isEmpty(this.calculateRuleJson)) {
// isRelativeEvent = (Object.keys(this.calculateRuleJson) as any).includes(
// field.key
// );
Object.keys(this.calculateRuleJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
if ((/** @type {?} */ (((/** @type {?} */ (checkedList))))).some((/**
* @param {?} el
* @return {?}
*/
(el) => el.field.key === key))) {
isRelativeEvent = true;
}
}));
Object.keys(this.calculateRuleJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
if (!!this.calculateRuleJson[key] &&
!!this.calculateRuleJson[key]["calculateValue"]) {
if ((/** @type {?} */ (((/** @type {?} */ (checkedList))))).some((/**
* @param {?} el
* @return {?}
*/
(el) => ((/** @type {?} */ (this.calculateRuleJson[key]["calculateValue"]))).includes(el.field.key)))) {
isRelativeEvent = true;
}
}
}));
}
if (isRelativeEvent) {
this.message.warning("当前字段关联了触发事件，不允许删除!");
return;
}
this.modalService.confirm({
nzTitle: "提示",
nzContent: `您确定要删除选中项？<br/><span class="delete_tips" >提示：如果该字段是内置字段，则删除无效。</br>   如果该字段关联了触发事件，则删除无效。</span>`,
nzOnOk: (/**
* @return {?}
*/
() => {
checkedList.forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
this.business_form.fields.forEach((/**
* @param {?} field
* @param {?} index
* @param {?} object
* @return {?}
*/
(field, index, object) => {
if (field.key === item.field.key &&
_.get(field, "templateOptions.isButintin") != true) {
object.splice(index, 1);
}
}));
}));
this.initTableFieldStatus();
this.initFormFieldPropertyAction();
this.AddReferProcessDisabled = this.business_form.fields.some((/**
* @param {?} el
* @return {?}
*/
(el) => el.key === "comprehensive$df_comprehensiveapply$associationprocess"));
}),
});
}
/**
* @return {?}
*/
btnMoveUp() {
/** @type {?} */
let checkedList = this.getCheckFields();
console.log(checkedList);
if (checkedList == null || checkedList.length == 0) {
this.message.warning("您当前没有选中任何项!");
return;
}
// if (
// !_.isEmpty(checkedList) &&
// checkedList.some(
// (el: any) =>
// !!el.field.editProperty &&
// el.field.editProperty.canMove !== undefined &&
// el.field.editProperty.canMove === false
// )
// ) {
// this.message.warning("您当前选中项包含不能移动项!");
// return;
// }
checkedList.forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
if (item.index > 0) {
// this.business_form.fields.splice(item.index, 1);
// this.business_form.fields.splice(item.index - 1, 0, item.field);
/** @type {?} */
let i = 1;
for (let index = item.index - 1; index > 0; index--) {
/** @type {?} */
const field = this.business_form.fields[index - 1];
if (!!field.editProperty &&
field.editProperty.canMove !== undefined &&
field.editProperty.canMove === false) {
i++;
}
else {
break;
}
}
this.move(this.business_form.fields, item.index, item.index - i);
}
}));
this.initFormFieldPropertyAction();
}
/**
* @param {?} arr
* @param {?} index
* @param {?} tindex
* @return {?}
*/
move(arr, index, tindex) {
//如果当前元素在拖动目标位置的下方，先将当前元素从数组拿出，数组长度-1，我们直接给数组拖动目标位置的地方新增一个和当前元素值一样的元素，
//我们再把数组之前的那个拖动的元素删除掉，所以要len+1
if (index > tindex) {
arr.splice(tindex, 0, arr[index]);
arr.splice(index + 1, 1);
}
else {
//如果当前元素在拖动目标位置的上方，先将当前元素从数组拿出，数组长度-1，我们直接给数组拖动目标位置+1的地方新增一个和当前元素值一样的元素，
//这时，数组len不变，我们再把数组之前的那个拖动的元素删除掉，下标还是index
arr.splice(tindex + 1, 0, arr[index]);
arr.splice(index, 1);
}
}
/**
* @return {?}
*/
btnMoveDown() {
/** @type {?} */
let checkedList = this.getCheckFields();
console.log(checkedList);
if (checkedList == null || checkedList.length == 0) {
this.message.warning("您当前没有选中任何项!");
return;
}
// if (
// !_.isEmpty(checkedList) &&
// checkedList.some(
// (el: any) =>
// !!el.field.editProperty &&
// el.field.editProperty.canMove !== undefined &&
// el.field.editProperty.canMove === false
// )
// ) {
// this.message.warning("您当前选中项包含不能移动项!");
// return;
// }
checkedList.reverse().forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
if (item.index < this.business_form.fields.length - 1) {
/** @type {?} */
let i = 1;
for (let index = item.index; index < this.business_form.fields.length - 1; index++) {
/** @type {?} */
const field = this.business_form.fields[index + 1];
if (!!field.editProperty &&
field.editProperty.canMove !== undefined &&
field.editProperty.canMove === false) {
i++;
}
else {
break;
}
}
if (i > 1) {
i--;
}
// this.business_form.fields.splice(item.index, 1);
// this.business_form.fields.splice(item.index + 1, 0, item.field);
this.move(this.business_form.fields, item.index, item.index + i);
}
}));
this.initFormFieldPropertyAction();
}
/**
* @return {?}
*/
btnAddFields() {
this.selectTableFields();
}
/**
* @return {?}
*/
btnAddRemark() {
this.kreTransferService.transferLabelToForm(this.business_form.fields, this.getCheckFields());
this.resetFormBuild();
this.initFormFieldPropertyAction();
this.initAnchorList();
}
/**
* @return {?}
*/
btnAddLine() {
this.kreTransferService.transferLineToForm(this.business_form.fields, this.getCheckFields());
this.resetFormBuild();
this.initFormFieldPropertyAction();
}
/**
* @return {?}
*/
btnAddAnchor() {
this.kreTransferService.transferAnchorToForm(this.business_form.fields, this.getCheckFields());
this.resetFormBuild();
this.initFormFieldPropertyAction();
}
/**
* @return {?}
*/
btnAddReferProcess() {
if (
// this.business_form.fields.some(
// (el) =>
// el.key === "comprehensive$df_comprehensiveapply$associationprocess"
// )
this.AddReferProcessDisabled) {
// this.message.warning("一个流程最多只能有一个关联流程组件!");
return;
}
// console.log(1);
this.kreTransferService.transferReferProcessToForm(this.business_form.fields, this.getCheckFields());
this.resetFormBuild();
this.initFormFieldPropertyAction();
this.AddReferProcessDisabled = true;
}
/**
* @return {?}
*/
btnAddGroup() {
/** @type {?} */
let tablecode = this.getTableMultipleCode();
if (tablecode == null || tablecode == "") {
this.message.warning("暂无可用的多记录区域可以添加");
return;
}
if (this.business_tables &&
this.business_tables.child &&
this.business_tables.child.multiple &&
this.business_tables.child.multiple.length > 0) {
if (this.business_tables.child.multiple.some((/**
* @param {?} item
* @return {?}
*/
(item) => {
return item.tableQuote !== true;
}))) {
this.kreDialogService.CreateModelDialog({
nzTitle: "选择列表",
size: "large",
nzContent: KreFormDesignTables,
}, { businessTable: this.business_tables, tableType: "single" }, (/**
* @param {?} instance
* @param {?} modal
* @return {?}
*/
(instance, modal) => {
modal.destroy();
if (instance.radioValue &&
instance.radioValue !== null &&
instance.radioValue !== "") {
this.kreTransferService.transferGroupToForm(this.business_form.fields, this.getCheckFields(), instance.radioValue, this.business_tables);
}
this.initTableFieldStatus();
this.initFormFieldPropertyAction();
}));
}
}
}
/**
* @param {?} type
* @return {?}
*/
btnColumn(type) {
this.kreFormInfo.column = `layout-column-${type}`;
this.layout_column = this.kreFormInfo.column;
this.business_form.column = this.kreFormInfo.column;
this.initFormFieldPropertyAction();
}
/**
* @param {?} type
* @return {?}
*/
btnRow(type) {
this.kreFormInfo.row = `layout-row-${type}`;
this.layout_row = this.kreFormInfo.row;
this.business_form.row = this.kreFormInfo.row;
this.initFormFieldPropertyAction();
}
/**
* @return {?}
*/
getCheckFields() {
/** @type {?} */
let checkedField = [];
this.business_form.fields.forEach((/**
* @param {?} item
* @param {?} index
* @return {?}
*/
(item, index) => {
if (item.checked) {
checkedField.push({ index: index, field: item });
}
}));
return checkedField;
}
/*按钮区域---end*/
/**
* @param {?} groupField
* @param {?} type
* @return {?}
*/
groupBtnMoveUpOrDown(groupField, type) {
if (!_.get(groupField, "fieldArray.fieldGroup") ||
_.get(groupField, "fieldArray.fieldGroup").length < 1) {
groupField.fieldArray = {
fieldGroup: [],
};
}
/** @type {?} */
let res = this.kreTransferService.groupFieldMoveUpOrDown(this.business_form.fields, groupField, type);
if (res != null) {
this.business_form.fields = res;
if (groupField.key !== null && groupField.key !== undefined) {
this.form_model[groupField.key] = [{}];
}
this.initFormFieldPropertyAction();
}
}
/**
* @param {?} groupField
* @param {?} type
* @return {?}
*/
groupBtnAddLineRemark(groupField, type) {
if (!_.get(groupField, "fieldArray.fieldGroup") ||
_.get(groupField, "fieldArray.fieldGroup").length < 1) {
groupField.fieldArray = {
fieldGroup: [],
};
}
/** @type {?} */
let res = null;
if (type === "line") {
res = this.kreTransferService.groupTransferLineToForm(this.business_form.fields, groupField);
}
else if (type === "remark") {
res = this.kreTransferService.groupTransferRemarkToForm(this.business_form.fields, groupField);
}
if (res != null) {
this.business_form.fields = res;
if (groupField.key !== null && groupField.key !== undefined) {
this.form_model[groupField.key] = [{}];
}
this.initFormFieldPropertyAction();
}
}
/**
* @param {?} groupField
* @return {?}
*/
groupBtnTableFields(groupField) {
console.log(groupField);
this.kreDialogService.CreateModelDialog({
nzTitle: "选择列表",
size: "large",
nzContent: KreFormDesignTable,
}, {
businessTable: this.business_tables,
tableType: "multiple",
fieldConfig: groupField,
}, (/**
* @param {?} instance
* @param {?} modal
* @return {?}
*/
(instance, modal) => {
modal.destroy();
/** @type {?} */
let res = this.kreTransferService.groupTransferSelectFieldToForm(this.business_form.fields, groupField, _.cloneDeep(this.kreTransferService.getGroupCheckFields(groupField)), this.business_tables, instance.mapOfCheckedId);
if (res != null) {
this.business_form.fields = res;
if (groupField.key !== null && groupField.key !== undefined) {
this.form_model[groupField.key] = [{}];
}
}
this.formBuilder.buildForm(this.form_group, this.business_form.fields, this.form_model, {});
this.initTableFieldStatus();
this.initFormFieldPropertyAction();
}));
}
/**
* @param {?} groupField
* @return {?}
*/
groupBtnDeleteFields(groupField) {
if (!_.get(groupField, "fieldArray.fieldGroup") ||
_.get(groupField, "fieldArray.fieldGroup").length < 1) {
return;
}
/** @type {?} */
let res = this.kreTransferService.groupTransferDeleteForm(this.business_form.fields, groupField);
if (res != null) {
this.business_form.fields = res;
if (groupField.key !== null && groupField.key !== undefined) {
this.form_model[groupField.key] = [{}];
}
}
this.initTableFieldStatus();
this.initFormFieldPropertyAction();
this.initAnchorList();
}
/**
* @return {?}
*/
initTablesInfo() {
this.business_tables;
this.dataService
.getBusinessTables(this.api.tables.url, { formcode: this.formCode })
.subscribe((/**
* @param {?} res
* @return {?}
*/
(res) => {
if (res != null) {
this.business_tables = res;
}
}));
}
/**
* @param {?} res
* @return {?}
*/
initFormInfo(res) {
if (res == undefined || res == null) {
return;
}
this.kreFormInfo = {
code: res.code,
name: res.name,
type: res.type,
fields: res.fields,
};
if (this.kreFormInfo.fields !== null &&
this.kreFormInfo.fields !== undefined) {
this.kreFormCommonService.initFormFieldModel(this.kreFormInfo.fields, this.form_model);
// this.business_form.fields = this.kreFormInfo.fields;
}
if (res.column != undefined && res.column != null && res.column != "") {
this.kreFormInfo.column = res.column;
}
else {
this.kreFormInfo.column = "layout-column-3";
}
if (res.row != undefined && res.row != null && res.row != "") {
this.kreFormInfo.row = res.row;
}
else {
this.kreFormInfo.row = "layout-row-1";
}
if (this.kreFormInfo.column != undefined &&
this.kreFormInfo.column != null &&
this.kreFormInfo.row != undefined &&
this.kreFormInfo.row != null) {
this.layout_column = this.kreFormInfo.column;
this.layout_row = this.kreFormInfo.row;
this.kreDesginToFormService.initFormFieldByTables(this.business_tables, this.business_form.fields);
this.initTableFieldStatus();
}
}
/**
* @return {?}
*/
initTableFieldStatus() {
this.kreDesginToFormService.initTableStatus(this.business_tables, this.business_form.fields);
this.initTablesData();
}
/**
* @return {?}
*/
initTablesData() {
this.table_Data = [];
/** @type {?} */
let business = clone(this.business_tables);
/** @type {?} */
let tables = [];
if (!business)
return;
if (business.primary && business.primary != null) {
tables = [
{
tableType: "primary",
tableLabel: "主表",
tableCode: business.primary["tableCode"],
tableName: business.primary["tableName"],
tableFields: business.primary["tableFields"],
},
];
}
if (business.child &&
business.child != null &&
business.child.single &&
business.child.single != null &&
business.child.single.length > 0) {
if (Array.isArray(business.child.single)) {
business.child.single.forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
tables.push({
tableType: "single",
tableLabel: "单记录子表",
tableCode: item["tableCode"],
tableName: item["tableName"],
tableFields: item["tableFields"],
});
}));
}
}
if (business.child &&
business.child != null &&
business.child.multiple &&
business.child.multiple != null &&
business.child.multiple.length > 0) {
if (Array.isArray(business.child.multiple)) {
business.child.multiple.forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
tables.push({
tableType: "multiple",
tableLabel: "多记录子表",
tableCode: item["tableCode"],
tableName: item["tableName"],
tableFields: item["tableFields"],
});
}));
}
}
this.table_Data = tables;
}
//表单选择
/**
* @return {?}
*/
selectTableFields() {
this.kreDialogService.CreateModelDialog({
nzTitle: "选择列表",
size: "large",
nzContent: KreFormDesignTable,
}, { businessTable: this.business_tables, tableType: "single" }, (/**
* @param {?} instance
* @param {?} modal
* @return {?}
*/
(instance, modal) => {
modal.destroy();
this.kreTransferService.transferSelectFieldToForm(this.business_form.fields, this.getCheckFields(), this.business_tables, instance.mapOfCheckedId);
this.initTableFieldStatus();
this.formBuilder.buildForm(this.form_group, this.business_form.fields, this.form_model, {});
this.initFormFieldPropertyAction();
}));
}
/**
* @return {?}
*/
getTableMultipleCode() {
/** @type {?} */
let resTableCode = "";
if (this.business_tables &&
this.business_tables.child &&
this.business_tables.child.multiple &&
this.business_tables.child.multiple.length > 0) {
this.business_tables.child.multiple.forEach((/**
* @param {?} item
* @return {?}
*/
(item) => {
if (item.tableQuote !== true && resTableCode == "") {
resTableCode = item.tableCode;
}
}));
}
return resTableCode;
}
//修改Field
/**
* @param {?} field
* @return {?}
*/
editFormFieldConfig(field) {
/** @type {?} */
let content;
/** @type {?} */
let title = "";
if (field.type === "html") {
title = "编辑片段文本描述";
content = KreFormDSFieldLabel;
}
else if (field.type === "repeat") {
title = "编辑多记录区";
content = KreFormDSField;
}
else if (field.type === "tabular") {
title = "编辑加班区域";
content = KreFormDSField;
}
else if (field.type === "htmlcontent") {
title = "编辑文本";
content = KreFormDSField;
}
else {
title = "编辑字段 - " + _.get(field, "templateOptions.label");
content = KreFormDSField;
}
this.kreDialogService.CreateModelDialogField({
nzTitle: title,
size: "large",
nzContent: content,
}, {
langConfig: this.langConfig,
field: clone(field),
modalType: "default",
options: this.options,
}, (/**
* @param {?} type
* @param {?} instance
* @param {?} modal
* @return {?}
*/
(type, instance, modal) => {
if (instance.checkSave()) {
/** @type {?} */
let result = this.kreTransferService.editFormFieldInfo(this.business_form.fields, instance.formField);
if (result != null) {
this.business_form.fields = result.formFileds;
if (result.groupKey != null && result.groupKey != "") {
this.form_model[result.groupKey] = [{}];
}
}
this.initFormFieldPropertyAction();
if (field.type === "htmlcontent") {
this.initAnchorList();
}
modal.destroy();
}
}));
}
//删除Field
/**
* @param {?} field
* @return {?}
*/
deleteFormFieldConfig(field) {
/** @type {?} */
let isRelativeEvent = false;
if (!!this.triggerJson && !_.isEmpty(this.triggerJson)) {
// isRelativeEvent = (Object.keys(this.triggerJson) as any).includes(
// field.key
// );
Object.keys(this.triggerJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
if (key === field.key && this.triggerJson[key].length > 0) {
isRelativeEvent = true;
}
(/** @type {?} */ (((/** @type {?} */ (this.triggerJson[key]))))).forEach((/**
* @param {?} el
* @return {?}
*/
(el) => {
if (el.fieldKey === field.key) {
isRelativeEvent = true;
}
}));
}));
}
if (!!this.calculateRuleJson && !_.isEmpty(this.calculateRuleJson)) {
isRelativeEvent = ((/** @type {?} */ (Object.keys(this.calculateRuleJson)))).includes(field.key);
Object.keys(this.calculateRuleJson).forEach((/**
* @param {?} key
* @return {?}
*/
(key) => {
if (!!this.calculateRuleJson[key] &&
!!this.calculateRuleJson[key]["calculateValue"] &&
((/** @type {?} */ (this.calculateRuleJson[key]["calculateValue"]))).includes(field.key)) {
isRelativeEvent = true;
}
}));
}
if (isRelativeEvent) {
this.message.warning("当前字段关联了触发事件，不允许删除!");
return;
}
/** @type {?} */
let result = this.kreTransferService.deleteFormFieldInfo(this.business_form.fields, field);
if (result != null) {
this.business_form.fields = result.formFileds;
if (result.groupKey != null && result.groupKey != "") {
this.form_model[result.groupKey] = [{}];
}
this.initTableFieldStatus();
this.initFormFieldPropertyAction();
}
this.initAnchorList();
}
/**
* @return {?}
*/
resetFormBuild() {
this.formBuilder.buildForm(this.form_group, this.business_form.fields, this.form_model, {});
}
/**
* @return {?}
*/
initFormFieldPropertyAction() {
/** @type {?} */
let newFormInfo = _.cloneDeep(this.business_form);
this.kreFormCommonService.initFormFieldProperty(newFormInfo.fields);
this.actionEvent.emit({
newFormInfo,
triggerJson: this.triggerJson,
calculateRuleJson: this.calculateRuleJson,
});
}
/**
* @param {?} e
* @return {?}
*/
modelChange(e) { }
/**
* @return {?}
*/
initAnchorList() {
this.anchorList = [];
this.key = "";
this.business_form.fields.forEach((/**
* @param {?} el
* @return {?}
*/
(el) => {
if (el.type === "htmlcontent" && (/** @type {?} */ ((/** @type {?} */ (el)).templateOptions)).isNav) {
this.anchorList.push(el);
}
}));
this.anchorDevList = {};
setTimeout((/**
* @return {?}
*/
() => {
if (this.anchorList.length > 0) {
this.anchorList.forEach((/**
* @param {?} el
* @param {?} index
* @return {?}
*/
(el, index) => {
if (!(/** @type {?} */ ((/** @type {?} */ (el)).templateOptions)).description) {
(/** @type {?} */ ((/** @type {?} */ (el)).templateOptions)).description = `默认导航${index + 1}`;
}
(/** @type {?} */ ((/** @type {?} */ (document)).getElementById("conter"))).scrollTop = 0;
this.anchorDevList[el.key] = ((/** @type {?} */ ((/** @type {?} */ ((/** @type {?} */ (document)).getElementById(el.key))).getBoundingClientRect())))["y"];
}));
}
}), 100);
}
/**
* @param {?} str
* @return {?}
*/
at(str) {
if (!!this.key && str === this.key) {
return;
}
this.key = str;
/** @type {?} */
const anchorDevList = _.cloneDeep(this.anchorDevList);
(/** @type {?} */ ((/** @type {?} */ (document)).getElementById("conter"))).scrollTop =
anchorDevList[this.key] - 197;
}
}
KreFormDesignDetailX.decorators = [
{ type: Component, args: [{
selector: "kreform-designx",
template: "<div class=\"design\">\n <div class=\"layout\">\n <ng-container *ngIf=\"layout == true\">\n <div class=\"layout-column\">\n <div class=\"title\">\u9009\u62E9\u5E03\u5C40\u6837\u5F0F</div>\n <ul>\n <li (click)=\"btnColumn(3)\">\n <div [class]=\"layout_column === 'layout-column-3' ? 'select' : ''\">\n <i class=\"icon-threeL\"> </i>\n </div>\n <span>\u4E09\u5217</span>\n </li>\n <li (click)=\"btnColumn(2)\">\n <div [class]=\"layout_column === 'layout-column-2' ? 'select' : ''\">\n <i class=\"icon-towL\"></i>\n </div>\n <span>\u4E24\u5217</span>\n </li>\n <li (click)=\"btnColumn(1)\">\n <div [class]=\"layout_column === 'layout-column-1' ? 'select' : ''\">\n <i class=\"icon-oneL\"></i>\n </div>\n <span>\u4E00\u5217</span>\n </li>\n </ul>\n </div>\n\n <div class=\"layout-row\">\n <div class=\"title\">\u9009\u62E9\u8868\u5355\u6837\u5F0F</div>\n <ul>\n <li (click)=\"btnRow(1)\">\n <div [class]=\"layout_row === 'layout-row-1' ? 'select' : ''\"></div>\n <span>\u6C34\u5E73</span>\n </li>\n <li (click)=\"btnRow(2)\">\n <div [class]=\"layout_row === 'layout-row-2' ? 'select' : ''\"></div>\n <span>\u5782\u76F4</span>\n </li>\n </ul>\n </div>\n\n <div class=\"layout-el\">\n <div class=\"title\">\u8868\u5355\u7F16\u8F91</div>\n <ul>\n <li (click)=\"btnAddFields()\">\n <i class=\"icon-TianJiaZiDuan\"></i>\u6DFB\u52A0\u5B57\u6BB5\n </li>\n <li (click)=\"btnAddRemark()\">\n <i class=\"icon-other-WenBen\"></i>\u6DFB\u52A0\u6587\u672C\n </li>\n <li (click)=\"btnAddLine()\">\n <i class=\"icon-FenGeXian\"></i>\u6DFB\u52A0\u5206\u5272\u7EBF\n </li>\n <!-- <li (click)=\"btnAddAnchor()\">\n <i class=\"icon-DuoJiLuQu\"></i>\u6DFB\u52A0\u5BFC\u822A\n </li> -->\n <li (click)=\"btnAddGroup()\">\n <i class=\"icon-DuoJiLuQu\"></i>\u6DFB\u52A0\u591A\u8BB0\u5F55\u533A\n </li>\n <li\n (click)=\"btnAddReferProcess()\"\n [class.AddReferProcessDisabled]=\"AddReferProcessDisabled\"\n >\n <i class=\"icon-DuoJiLuQu\"></i>\u6DFB\u52A0\u5173\u8054\u6D41\u7A0B\n </li>\n </ul>\n </div>\n </ng-container>\n <ng-content select=\"[name=design-layout]\"></ng-content>\n </div>\n\n <div class=\"layout anchor\" *ngIf=\"showAnchorList && anchorList.length > 0\">\n <div class=\"anchorList-box\">\n <li\n class=\"anchorList\"\n *ngFor=\"let item of anchorList\"\n [class.anchorList-active]=\"key === item.key\"\n (click)=\"at(item.key)\"\n >\n {{ item?.templateOptions?.description }}\n </li>\n </div>\n </div>\n\n <div class=\"panel\" *ngIf=\"showForm == true; else emptyContent\">\n <div class=\"krebutton\">\n <ng-content select=\"[name=other-button]\"></ng-content>\n <div>\n <button\n nz-button\n nzType=\"primary\"\n nzSize=\"small\"\n nzGhost\n (click)=\"btnDelete()\"\n >\n <i class=\"icon-N_delete2\"></i>\u5220\u9664\n </button>\n <button\n nz-button\n nzType=\"primary\"\n nzSize=\"small\"\n nzGhost\n (click)=\"btnMoveUp()\"\n >\n <i class=\"icon-ShangYi\"></i>\u4E0A\u79FB\n </button>\n <button\n nz-button\n nzType=\"primary\"\n nzSize=\"small\"\n nzGhost\n (click)=\"btnMoveDown()\"\n >\n <i class=\"icon-XiaYi\"></i>\u4E0B\u79FB\n </button>\n </div>\n </div>\n <div\n class=\"kreform-box scrollbar\"\n id=\"conter\"\n [class.has-anchorList]=\"anchorList.length > 0\"\n >\n <div class=\"kreform scrollbar\">\n <form\n [formGroup]=\"form_group\"\n [class]=\"kreFormInfo?.column + ' ' + kreFormInfo?.row\"\n nz-form\n >\n <kreform\n id=\"kreformkreform\"\n [fields]=\"business_form.fields\"\n [status]=\"1\"\n [form]=\"form_group\"\n [model]=\"form_model\"\n (modelChange)=\"modelChange($event)\"\n >\n </kreform>\n </form>\n </div>\n </div>\n </div>\n <ng-template #emptyContent>\n <div class=\"panel\">\n <ng-content select=\"[name=other-button]\"></ng-content>\n <ng-content select=\"[name=empty]\"></ng-content>\n </div>\n </ng-template>\n</div>\n",
providers: [
DataService,
KreAntCommonService,
KreTransferService,
KreDialogService,
KreFormAntService,
],
styles: [":host ::ng-deep{width:100%;display:flex;height:100%;background-color:#f3f3f3}:host ::ng-deep .ant-input[disabled]{color:rgba(0,0,0,.25);background-color:#f3f3f3;cursor:not-allowed;opacity:1;border:0}:host ::ng-deep .design{display:flex;flex:1}:host ::ng-deep .design .layout{float:left;width:240px;background-color:#fff;padding:15px 0 0 20px;margin-right:20px}:host ::ng-deep .design .layout .title{font-size:14px;color:#9b9b9b;margin-bottom:10px}:host ::ng-deep .design .layout ul{list-style:none;margin:0;padding:0}:host ::ng-deep .design .layout ul li{margin:0;padding:0;cursor:pointer}:host ::ng-deep .design .layout-column ul{display:inline-block;width:100%}:host ::ng-deep .design .layout-column ul li{float:left;text-align:center}:host ::ng-deep .design .layout-column ul li div{width:56px;height:56px;line-height:63px;border-radius:4px;background-color:#ececec;margin-bottom:5px}:host ::ng-deep .design .layout-column ul li div i{color:#bfbfbf;font-size:24px}:host ::ng-deep .design .layout-column ul li div span{width:100%;display:inline-block;color:#323232}:host ::ng-deep .design .layout-column ul li:nth-child(1),:host ::ng-deep .design .layout-column ul li:nth-child(2){margin:0 15px 0 0}:host ::ng-deep .design .layout-row ul{display:inline-block;width:100%}:host ::ng-deep .design .layout-row ul li{float:left;text-align:center}:host ::ng-deep .design .layout-row ul li div{width:90px;height:32px;line-height:32px;border-radius:4px;background-color:#ececec;margin-bottom:5px;cursor:pointer}:host ::ng-deep .design .layout-row ul li div i{color:#bfbfbf;font-size:24px}:host ::ng-deep .design .layout-row ul li div span{width:100%;display:inline-block;color:#323232}:host ::ng-deep .design .layout-row ul li:nth-child(1){margin:0 15px 0 0}:host ::ng-deep .design .layout-el li{width:200px;height:33px;line-height:33px;border-radius:4px;border:1px solid #dcdce0;background-color:#fff;margin:0 0 10px!important;font-size:13px;color:#323232}:host ::ng-deep .design .layout-el li i{margin:0 8px;font-size:14px;color:#bfbfbf}:host ::ng-deep .design .layout-el li:hover{background-color:#71a9ff;cursor:pointer;color:#fff}:host ::ng-deep .design .layout-el li:hover i{color:#fff}:host ::ng-deep .design .layout-el .AddReferProcessDisabled{cursor:not-allowed!important;background-color:#ececec}:host ::ng-deep .design .layout-el .AddReferProcessDisabled:hover{background-color:#ececec;color:#323232}:host ::ng-deep .design .layout-el .AddReferProcessDisabled:hover i{color:#bfbfbf}:host ::ng-deep .design .anchor{width:150px}:host ::ng-deep .design .panel{flex:1;float:left;margin:0;padding:0;display:flex;flex-direction:column;border-radius:4px;border:1px solid #dcdce0;background-color:#fff}:host ::ng-deep .design .panel .krebutton{padding:10px;width:100%;text-align:right;border-bottom:1px solid #d9d9d9;font-size:13px;display:flex}:host ::ng-deep .design .panel .krebutton button{margin:0 6px 0 0;font-size:12px}:host ::ng-deep .design .panel .krebutton button i{margin:0 5px 0 0;font-size:14px}:host ::ng-deep .design .panel .krebutton div{flex:1;float:left}:host ::ng-deep .design .panel .krebutton div:nth-child(1){text-align:left}:host ::ng-deep .design .panel .krebutton div:nth-child(2){text-align:right}:host ::ng-deep .design .panel .kreform-box{overflow-y:auto;height:calc(100vh - 200px)}:host ::ng-deep .design .panel .kreform{width:100%;display:inline-block;margin:0;padding:20px}:host ::ng-deep .design .panel .kreform krefield-checkbox,:host ::ng-deep .design .panel .kreform krefield-datetime,:host ::ng-deep .design .panel .kreform krefield-html,:host ::ng-deep .design .panel .kreform krefield-image,:host ::ng-deep .design .panel .kreform krefield-line,:host ::ng-deep .design .panel .kreform krefield-lookup,:host ::ng-deep .design .panel .kreform krefield-number,:host ::ng-deep .design .panel .kreform krefield-password,:host ::ng-deep .design .panel .kreform krefield-radio,:host ::ng-deep .design .panel .kreform krefield-select,:host ::ng-deep .design .panel .kreform krefield-text,:host ::ng-deep .design .panel .kreform krefield-textarea,:host ::ng-deep .design .panel .kreform krefield-texti18n,:host ::ng-deep .design .panel .kreform krefield-upload,:host ::ng-deep .design .panel .kreform krefield-wrapper,:host ::ng-deep .design .panel .kreform kreform-overTime,:host ::ng-deep .design .panel .kreform kreform-repeat{display:flex;width:100%}:host ::ng-deep .design .panel .kreform krefield-checkbox .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-datetime .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-html .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-image .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-line .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-lookup .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-number .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-password .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-radio .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-select .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-text .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-textarea .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-texti18n .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-upload .fieldOperational,:host ::ng-deep .design .panel .kreform krefield-wrapper .fieldOperational,:host ::ng-deep .design .panel .kreform kreform-overTime .fieldOperational,:host ::ng-deep .design .panel .kreform kreform-repeat .fieldOperational{display:flex;width:560px;margin:0 0 10px}:host ::ng-deep .design .panel .kreform krefield-checkbox .fieldOperational .fieldcheckbox,:host ::ng-deep .design .panel .kreform krefield-datetime .fieldOperational .fieldcheckbox,:host ::ng-deep .design .panel .kreform krefield-html .fieldOperational .fieldcheckbox,:host ::ng-deep .design .panel .kreform krefield-image .fieldOperational .fieldcheckbox,:host ::ng-deep .design .panel .kreform krefield-line .fieldOperational .fieldcheckbox,:host ::ng-deep .design .panel .kreform krefield-lookup .fieldOperational .f