UNPKG

fastlion-amis

Version:

一种MIS页面生成工具

568 lines 57.9 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var tslib_1 = require("tslib"); var react_1 = tslib_1.__importDefault(require("react")); var antd_1 = require("antd"); var icons_1 = require("@ant-design/icons"); var components_1 = require("../../../../../components"); var Button_1 = tslib_1.__importDefault(require("../../../../../components/Button")); var icons_2 = require("../../../../../components/icons"); var types_1 = require("../../types"); var print_1 = require("../../../../../utils/print"); var moment_1 = tslib_1.__importDefault(require("moment")); var utils_1 = require("./utils"); var util_1 = require("../../../../../utils/print/util"); var amis_formula_1 = require("amis-formula"); var TableSetting_1 = tslib_1.__importDefault(require("./TableSetting")); var Option = antd_1.Select.Option; var DetailPrint = /** @class */ (function (_super) { tslib_1.__extends(DetailPrint, _super); function DetailPrint(props) { var _this = this; var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q; _this = _super.call(this, props) || this; _this.formName = props.name; var setting = (_a = localStorage.getItem('SF_PrintSetting')) !== null && _a !== void 0 ? _a : '{}'; var settingObj = JSON.parse(setting); _this.flowPrint = props.actionType === 'flow-print' || ((_b = props.printInfo) === null || _b === void 0 ? void 0 : _b.printFlow) === true; _this.batchPrint = props.actionType === 'batch-print'; _this.state = { previewLoading: false, saveLoading: false, showEmpty: true, isDynamicTitle: false, isDynamicSubTitle: false, dynamicTitle: '', dynamicSubTilteList: [], // printer: (_c = settingObj.printer) !== null && _c !== void 0 ? _c : props.printers[0], page: (_d = settingObj.page) !== null && _d !== void 0 ? _d : 'A4', width: (_e = settingObj.width) !== null && _e !== void 0 ? _e : 210, height: (_f = settingObj.height) !== null && _f !== void 0 ? _f : 297, top: (_g = settingObj.top) !== null && _g !== void 0 ? _g : 10, bottom: (_h = settingObj.bottom) !== null && _h !== void 0 ? _h : 10, left: (_j = settingObj.left) !== null && _j !== void 0 ? _j : 10, right: (_k = settingObj.right) !== null && _k !== void 0 ? _k : 10, duplex: 0, direction: (_l = settingObj.direction) !== null && _l !== void 0 ? _l : 'vertical', numberOfPage: 1, copies: (_m = settingObj.copies) !== null && _m !== void 0 ? _m : 1, // showTitle: true, title: (_p = (_o = props.printInfo) === null || _o === void 0 ? void 0 : _o.title) !== null && _p !== void 0 ? _p : ((_q = props.dialogTitle) !== null && _q !== void 0 ? _q : ''), titleFontSize: 16, titleFontFamily: '宋体', showDynamicSubTitles: false, dynamicSubTiltes: [], subTitleFontSize: 12, subTitleFontFamily: '宋体', headerTitle: '', headerFontSize: 12, headerFontFontFamily: '宋体', titleAllPrint: true, subTitleAllPrint: true, showHeader: true, showFooter: true, footerFontSize: 13, footerFontFamily: '宋体', showHeaderLine: true, showFooterLine: true, showDate: true, showPageNum: true, showPrinter: true, showLogo: true, showBarCode: false, showQRCode: false, numberBreak: true, rowPadding: 0, colPadding: 0, borderWidth: 2, lineWidth: 1, contentFontSize: 12, contentFontFamily: '宋体', labelWidthPercent: 30, // detailTableValues: [] }; return _this; } DetailPrint.prototype.componentDidMount = function () { this.handleGetSetting(); }; DetailPrint.prototype.componentWillUnmount = function () { var settingValues = { printer: this.state.printer, page: this.state.page, width: this.state.width, height: this.state.height, top: this.state.top, bottom: this.state.bottom, left: this.state.left, right: this.state.right, duplex: this.state.duplex, direction: this.state.direction, numberOfPage: this.state.numberOfPage, copies: this.state.copies, }; localStorage.setItem('SF_PrintSetting', JSON.stringify(settingValues)); }; DetailPrint.prototype.handleGetSetting = function () { var _a, _b; return tslib_1.__awaiter(this, void 0, void 0, function () { var schema, formData, _c, printSchema, printData, tableValues, payload, data, isDynamicTitle_1, isDynamicSubTitle_1; var _this = this; return tslib_1.__generator(this, function (_d) { switch (_d.label) { case 0: if (!this.batchPrint) return [3 /*break*/, 2]; return [4 /*yield*/, Promise.all([this.getBatchPrintSchema(), this.getBatchPrintData()])]; case 1: _c = _d.sent(), printSchema = _c[0], printData = _c[1]; schema = printSchema; formData = printData[0]; return [3 /*break*/, 3]; case 2: schema = this.props.$schema; formData = this.props.data; if (schema.initApi) { delete schema.initApi; } _d.label = 3; case 3: return [4 /*yield*/, (0, utils_1.getDetailTableValues)(schema, formData, this.props.env.fetcher)]; case 4: tableValues = _d.sent(); return [4 /*yield*/, this.props.env.fetcher("/api/v1/".concat(this.flowPrint ? 'flow' : 'form', "/print/").concat(this.formName, "/select"))]; case 5: payload = _d.sent(); data = payload.data; if (payload.ok && data != null) { this.reportTitleSql = data.reportTitleSql; this.reportSubTitleSql = data.reportSubTitleSql; isDynamicTitle_1 = (_a = data.isDynamicTitle) !== null && _a !== void 0 ? _a : false; isDynamicSubTitle_1 = (_b = data.isDynamicSubTitle) !== null && _b !== void 0 ? _b : false; this.setState(function (pre) { var _a, _b, _c, _d, _e, _f; var defaultValues = data.detailTableValues; var detailTableValue = tableValues; if (data.isGlobalSetting) { detailTableValue = tableValues.map(function (values) { var _a, _b; return (tslib_1.__assign(tslib_1.__assign({}, values), { fontSize: (_a = data.fieldTableFontSize) !== null && _a !== void 0 ? _a : values.fontSize, fontFamily: (_b = data.fieldTableFamily) !== null && _b !== void 0 ? _b : values.fontFamily })); }); } else if (Array.isArray(defaultValues)) { detailTableValue = tableValues.map(function (values) { var target = defaultValues.find(function (item) { return item.name == values.name; }); if (target) { return tslib_1.__assign(tslib_1.__assign({}, target), { columns: values.columns.map(function (column) { var temp = target.columns.find(function (item) { return item.name == column.name; }); return temp ? tslib_1.__assign(tslib_1.__assign({}, column), { printType: temp.printType }) : column; }) }); } return values; }); } return (tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, pre), data), { title: isDynamicTitle_1 ? (_a = data.reportTitle) !== null && _a !== void 0 ? _a : pre.title : (_b = data.title) !== null && _b !== void 0 ? _b : pre.title, dynamicTitle: isDynamicTitle_1 ? data.reportTitle : data.title, dynamicSubTilteList: isDynamicSubTitle_1 ? (_c = data.reportSubTitle) !== null && _c !== void 0 ? _c : [] : [], showDynamicSubTitles: (_d = data.showDynamicSubTitles) !== null && _d !== void 0 ? _d : pre.showDynamicSubTitles, dynamicSubTiltes: (_f = (_e = data.reportSubTitle) === null || _e === void 0 ? void 0 : _e.filter(function (val, index) { var _a; return (_a = data.dynamicSubTiltes) === null || _a === void 0 ? void 0 : _a.includes(index); })) !== null && _f !== void 0 ? _f : pre.dynamicSubTiltes, detailTableValues: detailTableValue })); }, function () { _this.handleDetailPrint(true); }); } else { this.setState({ detailTableValues: tableValues }, function () { _this.handleDetailPrint(true); }); } return [2 /*return*/]; } }); }); }; DetailPrint.prototype.handleSaveSetting = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var api, _a, showHeader, showHeaderLine, showFooter, showFooterLine, headerTitle, titleAllPrint, subTitleAllPrint, lineWidth, borderWidth, rowPadding, colPadding, dynamicSubTilteList, showTitle, title, showDynamicSubTitles, dynamicSubTiltes, subTitle, showDate, showPageNum, showPrinter, showLogo, detailTableValues, showBarCode, showQRCode, numberBreak, labelWidthPercent, contentFontSize, contentFontFamily, titleFontSize, titleFontFamily, subTitleFontSize, subTitleFontFamily, headerFontSize, headerFontFontFamily, footerFontSize, footerFontFamily, titleIndex, settingValues, payload; var _this = this; return tslib_1.__generator(this, function (_b) { switch (_b.label) { case 0: api = { method: 'post', url: "/api/v1/".concat(this.flowPrint ? 'flow' : 'form', "/print/").concat(this.formName, "/modify") }; _a = this.state, showHeader = _a.showHeader, showHeaderLine = _a.showHeaderLine, showFooter = _a.showFooter, showFooterLine = _a.showFooterLine, headerTitle = _a.headerTitle, titleAllPrint = _a.titleAllPrint, subTitleAllPrint = _a.subTitleAllPrint, lineWidth = _a.lineWidth, borderWidth = _a.borderWidth, rowPadding = _a.rowPadding, colPadding = _a.colPadding, dynamicSubTilteList = _a.dynamicSubTilteList, showTitle = _a.showTitle, title = _a.title, showDynamicSubTitles = _a.showDynamicSubTitles, dynamicSubTiltes = _a.dynamicSubTiltes, subTitle = _a.subTitle, showDate = _a.showDate, showPageNum = _a.showPageNum, showPrinter = _a.showPrinter, showLogo = _a.showLogo, detailTableValues = _a.detailTableValues, showBarCode = _a.showBarCode, showQRCode = _a.showQRCode, numberBreak = _a.numberBreak, labelWidthPercent = _a.labelWidthPercent, contentFontSize = _a.contentFontSize, contentFontFamily = _a.contentFontFamily, titleFontSize = _a.titleFontSize, titleFontFamily = _a.titleFontFamily, subTitleFontSize = _a.subTitleFontSize, subTitleFontFamily = _a.subTitleFontFamily, headerFontSize = _a.headerFontSize, headerFontFontFamily = _a.headerFontFontFamily, footerFontSize = _a.footerFontSize, footerFontFamily = _a.footerFontFamily; titleIndex = dynamicSubTiltes.map(function (val) { return dynamicSubTilteList.findIndex(function (title) { return val == title; }); }); settingValues = { showHeader: showHeader, showHeaderLine: showHeaderLine, showFooter: showFooter, showFooterLine: showFooterLine, headerTitle: headerTitle, titleAllPrint: titleAllPrint, subTitleAllPrint: subTitleAllPrint, lineWidth: lineWidth, borderWidth: borderWidth, rowPadding: rowPadding, colPadding: colPadding, contentFontSize: contentFontSize, contentFontFamily: contentFontFamily, labelWidthPercent: labelWidthPercent, titleFontSize: titleFontSize, titleFontFamily: titleFontFamily, subTitleFontSize: subTitleFontSize, subTitleFontFamily: subTitleFontFamily, headerFontSize: headerFontSize, headerFontFontFamily: headerFontFontFamily, footerFontSize: footerFontSize, footerFontFamily: footerFontFamily, showTitle: showTitle, title: title, showDynamicSubTitles: showDynamicSubTitles, dynamicSubTiltes: titleIndex, subTitle: subTitle, showDate: showDate, showPageNum: showPageNum, showPrinter: showPrinter, showLogo: showLogo, showQRCode: showQRCode, showBarCode: showBarCode, numberBreak: numberBreak, detailTableValues: detailTableValues, reportTitleSql: this.reportTitleSql, reportSubTitleSql: this.reportSubTitleSql }; this.setState({ saveLoading: true }); return [4 /*yield*/, this.props.env.fetcher(api, settingValues).finally(function () { _this.setState({ saveLoading: false }); })]; case 1: payload = _b.sent(); if (payload.ok) { antd_1.message.success(payload.msg); } return [2 /*return*/]; } }); }); }; DetailPrint.prototype.handleDeleteSetting = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var api, payload; return tslib_1.__generator(this, function (_a) { switch (_a.label) { case 0: api = { method: 'delete', url: "/api/v1/".concat(this.flowPrint ? 'flow' : 'form', "/print/").concat(this.formName, "/delete") }; return [4 /*yield*/, this.props.env.fetcher(api)]; case 1: payload = _a.sent(); if (payload.ok) { antd_1.message.success(payload.msg); } return [2 /*return*/]; } }); }); }; DetailPrint.prototype.savePrintInfo = function () { var _a = this.props, fetcher = _a.env.fetcher, data = _a.data, ctx = _a.ctx, callbackApi = _a.callbackApi; if (!callbackApi) return; var PRINT_TIME = (0, moment_1.default)(new Date()).format('YYYY-MM-DD HH:mm:ss'); var postData = this.batchPrint ? { ids: ctx.ids, PRINT_TIME: PRINT_TIME } : tslib_1.__assign(tslib_1.__assign({}, data), { PRINT_TIME: PRINT_TIME }); fetcher(callbackApi, postData); }; DetailPrint.prototype.getBatchPrintSchema = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var _a, env, schemaApi, ctx, payload, data; return tslib_1.__generator(this, function (_b) { switch (_b.label) { case 0: _a = this.props, env = _a.env, schemaApi = _a.schemaApi, ctx = _a.ctx; if (this.cacheSchema) return [2 /*return*/, this.cacheSchema]; return [4 /*yield*/, env.fetcher(schemaApi, ctx)]; case 1: payload = _b.sent(); if (payload.ok && payload.data) { data = payload.data; if (data.name) { this.formName = data.name; } if (data.initApi) { delete data.initApi; } this.cacheSchema = data; return [2 /*return*/, data]; } else { antd_1.message.error(payload.msg); } return [2 /*return*/, null]; } }); }); }; DetailPrint.prototype.getBatchPrintData = function () { return tslib_1.__awaiter(this, void 0, void 0, function () { var _a, env, dataApi, ctx, payload; return tslib_1.__generator(this, function (_b) { switch (_b.label) { case 0: _a = this.props, env = _a.env, dataApi = _a.dataApi, ctx = _a.ctx; if (this.cacheData) return [2 /*return*/, this.cacheData]; return [4 /*yield*/, env.fetcher(dataApi, ctx)]; case 1: payload = _b.sent(); if (payload.ok && Array.isArray(payload.data)) { this.cacheData = payload.data; return [2 /*return*/, payload.data]; } return [2 /*return*/, []]; } }); }); }; DetailPrint.prototype.getPrintFormSchema = function (schema, data, fetcher) { var _a; return tslib_1.__awaiter(this, void 0, void 0, function () { var result, _b; return tslib_1.__generator(this, function (_c) { switch (_c.label) { case 0: if (!((_a = this.cacheFormSchema) !== null && _a !== void 0)) return [3 /*break*/, 1]; _b = _a; return [3 /*break*/, 3]; case 1: return [4 /*yield*/, (0, utils_1.buildPrintFormSchema)(schema, data, fetcher)]; case 2: _b = _c.sent(); _c.label = 3; case 3: result = _b; this.cacheFormSchema = result; return [2 /*return*/, result]; } }); }); }; DetailPrint.prototype.setPrintFormSchemaData = function (schemas, data) { return schemas.map(function (schema) { if (schema.type === 'property') { var items = (0, utils_1.buildPropertyUI)(schema, data); return { type: 'property', body: items, column: schema.column, data: data, label: schema.title }; } else { return { type: 'table', name: schema.name, label: schema.aliasTitle, body: { columns: schema.columns.filter(function (column) { return column.name !== 'operation'; }), data: schema.data } }; } }); }; DetailPrint.prototype.handleDetailPrint = function (preview) { var _a, _b, _c, _d, _e, _f; return tslib_1.__awaiter(this, void 0, void 0, function () { var _g, codeField, env, $schema, formData, printInfo, codeLabel, userName, _h, schema, datas, formSchema_1, chunkData, template, options, formSchema, formSchemaWithData, flowSchema, printContent, template; var _this = this; return tslib_1.__generator(this, function (_j) { switch (_j.label) { case 0: _g = this.props, codeField = _g.codeField, env = _g.env, $schema = _g.$schema, formData = _g.data, printInfo = _g.printInfo; codeLabel = (_b = (_a = (0, utils_1.findLabel)(codeField, this.props.body)) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : ''; userName = (_d = JSON.parse((_c = sessionStorage.getItem('userInfo')) !== null && _c !== void 0 ? _c : '{}').user_name) !== null && _d !== void 0 ? _d : ''; this.setState({ previewLoading: true, showEmpty: false }); if (!this.batchPrint) return [3 /*break*/, 3]; return [4 /*yield*/, Promise.all([this.getBatchPrintSchema(), this.getBatchPrintData()])]; case 1: _h = _j.sent(), schema = _h[0], datas = _h[1]; return [4 /*yield*/, this.getPrintFormSchema(schema, datas[0], env.fetcher)]; case 2: formSchema_1 = _j.sent(); chunkData = (0, utils_1.chunkArray)(datas.slice(0, preview ? 10 : undefined), this.state.numberOfPage); template = chunkData.map(function (datas) { return datas.map(function (data, index) { var _a; var options = tslib_1.__assign(tslib_1.__assign({}, _this.state), { title: (0, amis_formula_1.tokenize)(_this.state.title, data), dynamicSubTiltes: (_this.state.isDynamicSubTitle ? _this.state.dynamicSubTiltes : [(_a = _this.state.subTitle) !== null && _a !== void 0 ? _a : '']).map(function (item) { return (0, amis_formula_1.tokenize)(item, data); }) }); var formSchemaWithData = _this.setPrintFormSchemaData(formSchema_1, data); var printContent = { userName: userName, codeLabel: codeLabel, codeValue: data[codeField], htmlContent: (0, utils_1.createHtml)({ form: formSchemaWithData }, _this.state), }; return (0, util_1.buildDetailTemplate)(_this.state, options, printContent, index, _this.state.numberOfPage, true); }); }); (0, print_1.detailPrint)(preview, this.state, template, function () { if (!preview) { antd_1.message.success('打印任务发送成功'); _this.savePrintInfo(); } _this.setState({ previewLoading: false }); }); return [3 /*break*/, 5]; case 3: options = tslib_1.__assign(tslib_1.__assign({}, this.state), { title: (0, amis_formula_1.tokenize)(this.state.title, formData), dynamicSubTiltes: (this.state.isDynamicSubTitle ? this.state.dynamicSubTiltes : [(_e = this.state.subTitle) !== null && _e !== void 0 ? _e : '']).map(function (item) { return (0, amis_formula_1.tokenize)(item, formData); }) }); return [4 /*yield*/, this.getPrintFormSchema($schema, formData, env.fetcher)]; case 4: formSchema = _j.sent(); formSchemaWithData = this.setPrintFormSchemaData(formSchema, formData); flowSchema = (0, utils_1.buildPrintFlowSchema)(printInfo); printContent = { userName: userName, codeLabel: codeLabel, codeValue: formData === null || formData === void 0 ? void 0 : formData[codeField], subTitle: printInfo === null || printInfo === void 0 ? void 0 : printInfo.subTitle, extraTitle: (_f = printInfo === null || printInfo === void 0 ? void 0 : printInfo.extraTitle) !== null && _f !== void 0 ? _f : '', htmlContent: (0, utils_1.createHtml)({ form: formSchemaWithData, flow: flowSchema }, this.state), }; template = (0, util_1.buildDetailTemplate)(this.state, options, printContent, 0, 1, false); (0, print_1.detailPrint)(preview, this.state, [[template]], function () { if (!preview) { antd_1.message.success('打印任务发送成功'); _this.savePrintInfo(); } _this.setState({ previewLoading: false }); }); _j.label = 5; case 5: return [2 /*return*/]; } }); }); }; DetailPrint.prototype.render = function () { var _this = this; var _a = this.props, env = _a.env, cx = _a.classnames, __ = _a.translate, popupContainer = _a.popupContainer, printers = _a.printers, onHide = _a.onHide, superRole = _a.superRole; var _b = this.state, previewLoading = _b.previewLoading, showEmpty = _b.showEmpty, dynamicTitle = _b.dynamicTitle, isDynamicTitle = _b.isDynamicTitle, isDynamicSubTitle = _b.isDynamicSubTitle, dynamicSubTilteList = _b.dynamicSubTilteList, detailTableValues = _b.detailTableValues; return (react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement("div", { className: cx('Modal-header') }, react_1.default.createElement("div", { className: cx('Modal-title') }, '详情打印', react_1.default.createElement("a", { "data-tooltip": __('Dialog.close'), onClick: function (e) { return onHide(e); }, className: cx('Modal-close') }, react_1.default.createElement(icons_2.CloseIcon, null)))), react_1.default.createElement("div", { className: cx('Modal-body') }, react_1.default.createElement("div", { className: 'print-form-container' }, react_1.default.createElement("div", { className: 'preview-container' }, react_1.default.createElement(components_1.Spinner, { size: "md", overlay: true, show: previewLoading }), showEmpty && react_1.default.createElement(antd_1.Empty, { description: '\u6682\u65E0\u9884\u89C8\u6548\u679C', className: 'preview-empty' }), react_1.default.createElement("iframe", { id: 'detail-preview', width: '100%', height: '100%' })), react_1.default.createElement(antd_1.Tabs, { tabBarStyle: { marginBottom: 8, paddingLeft: 24, paddingRight: 24 }, style: { width: 350 } }, react_1.default.createElement(antd_1.Tabs.TabPane, { key: 1, tab: '\u8BBE\u7F6E' }, react_1.default.createElement("div", { className: "print-setting" }, react_1.default.createElement("div", { className: "print-setting-label" }, "\u6253\u5370\u8BBE\u5907"), react_1.default.createElement("div", { className: "print-setting-content" }, react_1.default.createElement(antd_1.Row, { gutter: 10 }, react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('CRUD.printer') }, react_1.default.createElement(antd_1.Select, { style: { width: 170 }, getPopupContainer: popupContainer, dropdownClassName: 'label-print-selector', value: this.state.printer, onChange: function (value) { return _this.setState({ printer: value }); } }, printers.map(function (item) { return react_1.default.createElement(Option, { key: item, value: item }, item); })))), react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('CRUD.pageSize') }, react_1.default.createElement(antd_1.Select, { getPopupContainer: popupContainer, dropdownClassName: 'label-print-selector', value: this.state.page, onChange: function (value) { return _this.setState({ page: value, width: types_1.sizeOptions[value][0], height: types_1.sizeOptions[value][1] }); } }, types_1.pageOptions.map(function (item) { return react_1.default.createElement(Option, { key: item.value, value: item.value }, item.label); }))))), react_1.default.createElement(antd_1.Row, { gutter: 10 }, react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('width') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 170 }, min: 0, max: 1000, value: this.state.width, onChange: function (value) { return value != null && _this.setState({ width: value }); } }))), react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('height') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 170 }, min: 0, max: 1000, value: this.state.height, onChange: function (value) { return value != null && _this.setState({ height: value }); } }))))), react_1.default.createElement("div", { className: "print-setting-label" }, "\u7EB8\u5F20\u8BBE\u7F6E(\u5355\u4F4D\uFF1Amm)"), react_1.default.createElement("div", { className: "print-setting-content" }, react_1.default.createElement(antd_1.Row, { gutter: 10 }, react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('up') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 120 }, min: 0, max: 100, value: this.state.top, onChange: function (value) { return value != null && _this.setState({ top: value }); } }))), react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('below') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 120 }, min: 0, max: 100, value: this.state.bottom, onChange: function (value) { return value != null && _this.setState({ bottom: value }); } })))), react_1.default.createElement(antd_1.Row, { gutter: 10 }, react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('left') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 120 }, min: 0, max: 100, value: this.state.left, onChange: function (value) { return value != null && _this.setState({ left: value }); } }))), react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('right') }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 120 }, min: 0, max: 100, value: this.state.right, onChange: function (value) { return value != null && _this.setState({ right: value }); } })))), react_1.default.createElement(antd_1.Row, null, react_1.default.createElement(antd_1.Col, { span: 24 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: '\u53CC\u9762' }, react_1.default.createElement(antd_1.Select, { style: { width: 160 }, value: this.state.duplex, options: types_1.duplexPrintOptions, onChange: function (value) { return _this.setState({ duplex: value }); } })))), react_1.default.createElement(antd_1.Row, null, react_1.default.createElement(antd_1.Col, { span: 24 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: __('direction') }, react_1.default.createElement(antd_1.Radio.Group, { value: this.state.direction, onChange: function (value) { return _this.setState({ direction: value.target.value }); } }, react_1.default.createElement(antd_1.Radio, { value: 'vertical' }, __('vertical')), react_1.default.createElement(antd_1.Radio, { value: 'horizontal' }, __('horizontal')))))), this.batchPrint && (react_1.default.createElement(antd_1.Row, null, react_1.default.createElement(antd_1.Col, { span: 24 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: '每张个数' }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 130 }, min: 1, max: 5, value: this.state.numberOfPage, onChange: function (value) { return value != null && _this.setState({ numberOfPage: value }); } }))))), react_1.default.createElement(antd_1.Row, null, react_1.default.createElement(antd_1.Col, { span: 24 }, react_1.default.createElement(antd_1.Form.Item, { colon: false, label: '打印份数' }, react_1.default.createElement(antd_1.InputNumber, { style: { width: 130 }, min: 1, max: 10, value: this.state.copies, onChange: function (value) { return value != null && _this.setState({ copies: value }); } }))))))), react_1.default.createElement(antd_1.Tabs.TabPane, { key: 2, tab: '\u9009\u9879' }, react_1.default.createElement("div", { className: "print-setting" }, react_1.default.createElement("div", { className: "print-setting-label" }, "\u5185\u5BB9\u8BBE\u7F6E"), react_1.default.createElement("div", { className: "print-setting-content" }, react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showTitle, onChange: function (e) { return _this.setState({ showTitle: e.target.checked }); } }, "\u6807\u9898")), react_1.default.createElement(antd_1.Col, { span: 16 }, isDynamicTitle ? react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: '100%' }, getPopupContainer: popupContainer, dropdownClassName: 'label-print-selector', placeholder: __('Select.placeholder'), value: this.state.title, options: [{ label: dynamicTitle, value: dynamicTitle }] }) : react_1.default.createElement(antd_1.Input, { disabled: !superRole, value: this.state.title, onChange: function (e) { return _this.setState({ title: e.target.value }); }, maxLength: 50, placeholder: __('CRUD.fillIn') })), react_1.default.createElement(antd_1.Col, { span: 2 }, react_1.default.createElement(antd_1.Popover, { trigger: 'click', placement: 'bottom', getPopupContainer: env.getModalContainer, showArrow: false, content: react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } }, react_1.default.createElement("span", null, "\u5B57\u4F53"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.titleFontFamily, options: types_1.fontFamilyOptions, onChange: function (val) { return _this.setState({ titleFontFamily: val }); } }), react_1.default.createElement("span", { style: { marginTop: 4 } }, "\u5B57\u53F7"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.titleFontSize, options: types_1.fontSizeOptions, onChange: function (val) { return _this.setState({ titleFontSize: val }); } })) }, react_1.default.createElement(icons_1.FontColorsOutlined, { style: { fontSize: 20, paddingLeft: 8, paddingTop: 3, color: '#00000065' } })))), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showDynamicSubTitles, onChange: function (e) { return _this.setState({ showDynamicSubTitles: e.target.checked }); } }, "\u5B50\u6807\u9898")), react_1.default.createElement(antd_1.Col, { span: 16 }, isDynamicSubTitle ? react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: '100%' }, getPopupContainer: popupContainer, dropdownClassName: 'label-print-selector', showArrow: true, mode: "multiple", placeholder: __('Select.placeholder'), maxTagCount: 'responsive', value: this.state.dynamicSubTiltes, onChange: function (value) { if (value.length <= 3) { _this.setState({ dynamicSubTiltes: value }); } else { env.notify('error', '最多选择3项'); } } }, dynamicSubTilteList.map(function (item, index) { return react_1.default.createElement(Option, { key: index, value: item }, item); })) : react_1.default.createElement(antd_1.Input, { disabled: !superRole, value: this.state.subTitle, onChange: function (e) { return _this.setState({ subTitle: e.target.value }); }, maxLength: 50, placeholder: __('CRUD.fillIn') })), react_1.default.createElement(antd_1.Col, { span: 2 }, react_1.default.createElement(antd_1.Popover, { trigger: 'click', placement: 'bottom', getPopupContainer: env.getModalContainer, showArrow: false, content: react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } }, react_1.default.createElement("span", null, "\u5B57\u4F53"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.subTitleFontFamily, options: types_1.fontFamilyOptions, onChange: function (val) { return _this.setState({ subTitleFontFamily: val }); } }), react_1.default.createElement("span", { style: { marginTop: 4 } }, "\u5B57\u53F7"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.subTitleFontSize, options: types_1.fontSizeOptions, onChange: function (val) { return _this.setState({ subTitleFontSize: val }); } })) }, react_1.default.createElement(icons_1.FontColorsOutlined, { style: { fontSize: 20, paddingLeft: 8, paddingTop: 3, color: '#00000065' } })))), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.titleAllPrint, onChange: function (e) { return _this.setState({ titleAllPrint: e.target.checked }); } }, "\u6807\u9898\u6BCF\u9875\u6253\u5370")), react_1.default.createElement(antd_1.Col, { span: 12 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.subTitleAllPrint, onChange: function (e) { return _this.setState({ subTitleAllPrint: e.target.checked }); } }, "\u5B50\u6807\u9898\u6BCF\u9875\u6253\u5370"))), react_1.default.createElement(antd_1.Divider, null), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showHeader, onChange: function (e) { return _this.setState({ showHeader: e.target.checked }); } }, "\u9875\u7709")), react_1.default.createElement(antd_1.Col, { span: 16 }, react_1.default.createElement(antd_1.Input, { disabled: !superRole, value: this.state.headerTitle, onChange: function (e) { return _this.setState({ headerTitle: e.target.value }); }, maxLength: 50, placeholder: __('CRUD.fillIn') })), react_1.default.createElement(antd_1.Col, { span: 2 }, react_1.default.createElement(antd_1.Popover, { trigger: 'click', placement: 'bottom', getPopupContainer: env.getModalContainer, showArrow: false, content: react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } }, react_1.default.createElement("span", null, "\u5B57\u4F53"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.headerFontFontFamily, options: types_1.fontFamilyOptions, onChange: function (val) { return _this.setState({ headerFontFontFamily: val }); } }), react_1.default.createElement("span", { style: { marginTop: 4 } }, "\u5B57\u53F7"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.headerFontSize, options: types_1.fontSizeOptions, onChange: function (val) { return _this.setState({ headerFontSize: val }); } })) }, react_1.default.createElement(icons_1.FontColorsOutlined, { style: { fontSize: 20, paddingLeft: 8, paddingTop: 3, color: '#00000065' } })))), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }), react_1.default.createElement(antd_1.Col, { span: 8 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showHeaderLine, onChange: function (e) { return _this.setState({ showHeaderLine: e.target.checked }); } }, "\u9875\u7709\u6A2A\u7EBF")), react_1.default.createElement(antd_1.Col, { span: 8 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showLogo, onChange: function (e) { return _this.setState({ showLogo: e.target.checked }); } }, "\u516C\u53F8Logo"))), react_1.default.createElement(antd_1.Divider, null), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showFooter, onChange: function (e) { return _this.setState({ showFooter: e.target.checked }); } }, "\u9875\u811A")), react_1.default.createElement(antd_1.Col, { span: 8 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showPrinter, onChange: function (e) { return _this.setState({ showPrinter: e.target.checked }); } }, "\u6253\u5370\u8005")), react_1.default.createElement(antd_1.Col, { span: 8 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showPageNum, onChange: function (e) { return _this.setState({ showPageNum: e.target.checked }); } }, "\u9875\u7801")), react_1.default.createElement(antd_1.Col, { span: 2 }, react_1.default.createElement(antd_1.Popover, { trigger: 'click', placement: 'bottom', getPopupContainer: env.getModalContainer, showArrow: false, content: react_1.default.createElement("div", { style: { display: 'flex', flexDirection: 'column' } }, react_1.default.createElement("span", null, "\u5B57\u4F53"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.footerFontFamily, options: types_1.fontFamilyOptions, onChange: function (val) { return _this.setState({ footerFontFamily: val }); } }), react_1.default.createElement("span", { style: { marginTop: 4 } }, "\u5B57\u53F7"), react_1.default.createElement(antd_1.Select, { disabled: !superRole, style: { width: 100 }, value: this.state.footerFontSize, options: types_1.fontSizeOptions, onChange: function (val) { return _this.setState({ footerFontSize: val }); } })) }, react_1.default.createElement(icons_1.FontColorsOutlined, { style: { fontSize: 20, paddingLeft: 8, paddingTop: 3, color: '#00000065' } })))), react_1.default.createElement(antd_1.Row, { align: "middle" }, react_1.default.createElement(antd_1.Col, { span: 6 }), react_1.default.createElement(antd_1.Col, { span: 8 }, react_1.default.createElement(antd_1.Checkbox, { disabled: !superRole, checked: this.state.showDate, onChange: function (e) { return _this.setState({ showDate: