UNPKG

@form-create/iview

Version:

iview动态表单|form-create is a form generation component that can generate dynamic rendering, data collection, verification and submission functions through JSON. Supports 3 UI frameworks, and supports the generation of any Vue components. Built-in 20 kinds o

1,599 lines (1,542 loc) 184 kB
/*! * @form-create/iview v2.5.25 * (c) 2018-2022 xaboy * Github https://github.com/xaboy/form-create * Released under the MIT License. */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) : typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) : (global = global || self, factory(global.formCreate = {}, global.Vue)); }(this, (function (exports, Vue) { 'use strict'; Vue = Vue && Object.prototype.hasOwnProperty.call(Vue, 'default') ? Vue['default'] : Vue; function _extends() { return _extends = Object.assign || function (a) { for (var b, c = 1; c < arguments.length; c++) { for (var d in b = arguments[c], b) { Object.prototype.hasOwnProperty.call(b, d) && (a[d] = b[d]); } } return a; }, _extends.apply(this, arguments); } var normalMerge = ["attrs", "props", "domProps"], toArrayMerge = ["class", "style", "directives"], functionalMerge = ["on", "nativeOn"], mergeJsxProps = function mergeJsxProps(a) { return a.reduce(function (c, a) { for (var b in a) { if (!c[b]) c[b] = a[b];else if (-1 !== normalMerge.indexOf(b)) c[b] = _extends({}, c[b], a[b]);else if (-1 !== toArrayMerge.indexOf(b)) { var d = c[b] instanceof Array ? c[b] : [c[b]], e = a[b] instanceof Array ? a[b] : [a[b]]; c[b] = d.concat(e); } else if (-1 !== functionalMerge.indexOf(b)) { for (var f in a[b]) { if (c[b][f]) { var g = c[b][f] instanceof Array ? c[b][f] : [c[b][f]], h = a[b][f] instanceof Array ? a[b][f] : [a[b][f]]; c[b][f] = g.concat(h); } else c[b][f] = a[b][f]; } } else if ("hook" == b) for (var i in a[b]) { c[b][i] = c[b][i] ? mergeFn(c[b][i], a[b][i]) : a[b][i]; } else c[b] = a[b]; } return c; }, {}); }, mergeFn = function mergeFn(a, b) { return function () { a && a.apply(this, arguments), b && b.apply(this, arguments); }; }; var helper = mergeJsxProps; function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function (obj) { return typeof obj; }; } else { _typeof = function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } function _objectSpread2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); } function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); } function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } function getSlot(slots, exclude) { return Object.keys(slots).reduce(function (lst, name) { if (!exclude || exclude.indexOf(name) === -1) { lst.push(slots[name]); } return lst; }, []); } var NAME = 'fcCheckbox'; var Checkbox = { name: NAME, props: { formCreateInject: { type: Object, required: true }, value: { type: Array, "default": function _default() { return []; } } }, watch: { 'formCreateInject.options': { handler: function handler() { this.update(); }, deep: true }, value: function value() { this.update(); } }, data: function data() { return { trueValue: [] }; }, methods: { options: function options() { var opt = this.formCreateInject.options; return Array.isArray(opt) ? opt : []; }, onInput: function onInput(n) { this.$emit('input', this.options().filter(function (opt) { return n.indexOf(opt.label) !== -1; }).map(function (opt) { return opt.value; }).filter(function (v) { return v !== undefined; })); }, update: function update() { var _this = this; this.trueValue = this.value ? this.options().filter(function (opt) { return _this.value.indexOf(opt.value) !== -1; }).map(function (option) { return option.label; }) : []; } }, created: function created() { this.update(); }, render: function render() { var h = arguments[0]; return h("CheckboxGroup", helper([{}, this.formCreateInject.prop, {}, { "props": { value: this.trueValue } }, { "on": { "input": this.onInput } }]), [this.options().map(function (opt, index) { var props = _objectSpread2({}, opt); delete props.value; return h("Checkbox", helper([{}, { "props": props }, { "key": '' + index + '-' + opt.value }])); }), getSlot(this.$slots)]); } }; function toArray(value) { return Array.isArray(value) ? value : [null, undefined, ''].indexOf(value) > -1 ? [] : [value]; } function styleInject(css, ref) { if (ref === void 0) ref = {}; var insertAt = ref.insertAt; if (!css || typeof document === 'undefined') { return; } var head = document.head || document.getElementsByTagName('head')[0]; var style = document.createElement('style'); style.type = 'text/css'; if (insertAt === 'top') { if (head.firstChild) { head.insertBefore(style, head.firstChild); } else { head.appendChild(style); } } else { head.appendChild(style); } if (style.styleSheet) { style.styleSheet.cssText = css; } else { style.appendChild(document.createTextNode(css)); } } var css_248z = "._fc-frame .fc-upload-btn {\n border: 1px dashed #c0ccda;\n cursor: pointer;\n}\n\n._fc-frame .fc-upload-cover {\n opacity: 0;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n background: rgba(0, 0, 0, .6);\n transition: opacity .3s;\n}\n\n._fc-frame .fc-upload-cover i {\n color: #fff;\n font-size: 20px;\n cursor: pointer;\n margin: 0 2px;\n}\n\n._fc-frame .fc-files:hover .fc-upload-cover {\n opacity: 1;\n}\n\n._fc-frame .ivu-upload-list {\n margin-top: 0;\n}\n\n._fc-frame .fc-files img {\n width: 100%;\n height: 100%;\n display: inline-block;\n vertical-align: top;\n}\n\n._fc-frame .fc-upload-btn, ._fc-frame .fc-files {\n display: inline-block;\n width: 58px;\n height: 58px;\n text-align: center;\n line-height: 58px;\n border: 1px solid #c0ccda;\n border-radius: 4px;\n overflow: hidden;\n background: #fff;\n position: relative;\n box-shadow: 2px 2px 5px rgba(0, 0, 0, .1);\n margin-right: 4px;\n box-sizing: border-box;\n}\n"; styleInject(css_248z); var NAME$1 = 'fcFrame'; function createFrame(config) { return { name: NAME$1, props: { formCreateInject: { type: Object, required: true }, type: { type: String, "default": 'input' }, field: String, helper: { type: Boolean, "default": true }, disabled: { type: Boolean, "default": false }, src: { type: String, required: true }, icon: { type: String, "default": config.fileUpIcon }, width: { type: [Number, String], "default": 500 }, height: { type: String, "default": '370px' }, maxLength: { type: Number, "default": 0 }, okBtnText: { type: String, "default": '确定' }, closeBtnText: { type: String, "default": '关闭' }, modalTitle: String, handleIcon: { type: [String, Boolean], "default": undefined }, title: String, allowRemove: { type: Boolean, "default": true }, onOpen: { type: Function, "default": function _default() {} }, onOk: { type: Function, "default": function _default() {} }, onCancel: { type: Function, "default": function _default() {} }, onLoad: { type: Function, "default": function _default() {} }, onBeforeRemove: { type: Function, "default": function _default() {} }, onRemove: { type: Function, "default": function _default() {} }, onHandle: { type: Function, "default": function _default(src) { this.previewImage = this.getSrc(src); this.previewVisible = true; } }, modal: { type: Object, "default": function _default() { return {}; } }, srcKey: { type: [String, Number] }, value: [Array, String, Number, Object], previewMask: undefined, footer: { type: Boolean, "default": true }, reload: { type: Boolean, "default": true }, closeBtn: { type: Boolean, "default": true }, okBtn: { type: Boolean, "default": true } }, data: function data() { return { fileList: toArray(this.value), previewVisible: false, frameVisible: false, previewImage: '' }; }, watch: { value: function value(n) { this.fileList = toArray(n); }, fileList: function fileList(n) { var val = this.maxLength === 1 ? n[0] || '' : n; this.$emit('input', val); this.$emit('change', val); }, src: function src(n) { this.modalVm && (this.modalVm.src = n); } }, methods: { key: function key(unique) { return unique; }, closeModel: function closeModel(close) { this.$emit(close ? '$close' : '$ok'); if (this.reload) { this.$off('$ok'); this.$off('$close'); } this.frameVisible = false; }, showModel: function showModel() { if (this.disabled || false === this.onOpen()) return; this.frameVisible = true; }, makeInput: function makeInput() { var _this = this; var h = this.$createElement; var props = { type: 'text', value: this.fileList.map(function (v) { return _this.getSrc(v); }).toString(), icon: this.icon, readonly: true, clearable: false }; return h("Input", helper([{}, { "props": props }, {}, { "on": { 'on-click': function onClick() { return _this.showModel(); } } }, { "key": this.key('input') }])); }, makeGroup: function makeGroup(children) { var h = this.$createElement; if (!this.maxLength || this.fileList.length < this.maxLength) children.push(this.makeBtn()); return h("div", { "key": this.key('group') }, _toConsumableArray(children)); }, makeItem: function makeItem(index, children) { var h = this.$createElement; return h("div", { "class": 'fc-files', "key": this.key('file' + index) }, _toConsumableArray(children)); }, valid: function valid(f) { var field = this.formCreateInject.field || this.field; if (field && f !== field) throw new Error('[frame]无效的字段值'); }, makeIcons: function makeIcons(val, index) { var h = this.$createElement; if (this.handleIcon !== false || this.allowRemove === true) { var icons = []; if (this.type !== 'file' && this.handleIcon !== false || this.type === 'file' && this.handleIcon) icons.push(this.makeHandleIcon(val, index)); if (this.allowRemove) icons.push(this.makeRemoveIcon(val, index)); return h("div", { "class": 'fc-upload-cover', "key": this.key('uc') }, [icons]); } }, makeHandleIcon: function makeHandleIcon(val, index) { var _this2 = this; var h = this.$createElement; return h("icon", helper([{}, { "props": { type: this.handleIcon === true || this.handleIcon === undefined ? 'ios-eye-outline' : this.handleIcon } }, { "on": { "click": function click() { return _this2.handleClick(val); } }, "key": this.key('hi' + index) }])); }, makeRemoveIcon: function makeRemoveIcon(val, index) { var _this3 = this; var h = this.$createElement; return h("icon", helper([{}, { "props": { type: 'ios-trash-outline' } }, { "on": { "click": function click() { return _this3.handleRemove(val); } }, "key": this.key('ri' + index) }])); }, makeFiles: function makeFiles() { var _this4 = this; var h = this.$createElement; return this.makeGroup(this.fileList.map(function (src, index) { return _this4.makeItem(index, [h("icon", helper([{}, { "props": { type: config.fileIcon, size: 40 } }, { "on": { "click": function click() { return _this4.handleClick(src); } } }])), _this4.makeIcons(src, index)]); })); }, makeImages: function makeImages() { var _this5 = this; var h = this.$createElement; return this.makeGroup(this.fileList.map(function (src, index) { return _this5.makeItem(index, [h("img", { "attrs": { "src": _this5.getSrc(src) } }), _this5.makeIcons(src, index)]); })); }, makeBtn: function makeBtn() { var _this6 = this; var h = this.$createElement; return h("div", { "class": 'fc-upload-btn', "on": { "click": function click() { return _this6.showModel(); } }, "key": this.key('btn') }, [h("icon", helper([{}, { "props": { type: this.icon, size: 20 } }]))]); }, handleClick: function handleClick(src) { return this.onHandle(src); }, handleRemove: function handleRemove(src) { if (this.disabled) return; if (false !== this.onBeforeRemove(src)) { this.fileList.splice(this.fileList.indexOf(src), 1); this.onRemove(src); } }, getSrc: function getSrc(src) { return !this.srcKey ? src : src[this.srcKey]; }, frameLoad: function frameLoad(iframe) { var _this7 = this; this.onLoad(iframe); try { if (this.helper === true) { iframe['form_create_helper'] = { api: this.formCreateInject.api, close: function close(field) { _this7.valid(field); _this7.closeModel(); }, set: function set(field, value) { _this7.valid(field); if (!_this7.disabled) _this7.$emit('input', value); }, get: function get(field) { _this7.valid(field); return _this7.value; }, onOk: function onOk(fn) { return _this7.$on('$ok', fn); }, onClose: function onClose(fn) { return _this7.$on('$close', fn); } }; } } catch (e) { console.log(e); } }, makeFooter: function makeFooter() { var _this8 = this; var h = this.$createElement; var _this$$props = this.$props, okBtnText = _this$$props.okBtnText, closeBtnText = _this$$props.closeBtnText, closeBtn = _this$$props.closeBtn, okBtn = _this$$props.okBtn, footer = _this$$props.footer; var node = []; if (!footer) return node; if (closeBtn) node.push(h("Button", { "on": { "click": function click() { return _this8.onCancel() !== false && _this8.closeModel(true); } } }, [closeBtnText])); if (okBtn) node.push(h("Button", { "attrs": { "type": "primary" }, "on": { "click": function click() { return _this8.onOk() !== false && _this8.closeModel(); } } }, [okBtnText])); return node; } }, render: function render() { var _this9 = this; var h = arguments[0]; var type = this.type; var node; if (type === 'input') node = this.makeInput();else if (type === 'image') node = this.makeImages();else node = this.makeFiles(); var _this$$props2 = this.$props, width = _this$$props2.width, height = _this$$props2.height, src = _this$$props2.src, title = _this$$props2.title, modalTitle = _this$$props2.modalTitle; this.$nextTick(function () { if (_this9.$refs.frame) { _this9.frameLoad(_this9.$refs.frame.contentWindow || {}); } }); return h("div", { "class": "_fc-frame" }, [node, h("Modal", helper([{}, { "props": { mask: this.previewMask, title: modalTitle, footerHide: true } }, { "model": { value: _this9.previewVisible, callback: function callback($$v) { _this9.previewVisible = $$v; } } }]), [h("img", { "style": "width: 100%", "attrs": { "src": this.previewImage } })]), h("Modal", helper([{}, { "props": _objectSpread2({ width: width, title: title }, this.modal) }, { "on": { "on-cancel": function onCancel() { return _this9.closeModel(true); } }, "model": { value: _this9.frameVisible, callback: function callback($$v) { _this9.frameVisible = $$v; } } }]), [this.frameVisible || !this.reload ? h("iframe", { "ref": "frame", "attrs": { "src": src, "frameBorder": "0" }, "style": { 'height': height, 'border': '0 none', 'width': '100%' } }) : null, h("div", { "slot": "footer" }, [this.makeFooter()])])]); }, mounted: function mounted() { this.$on('fc.closeModal', this.closeModal); } }; } var frame = createFrame({ fileIcon: 'md-document', fileUpIcon: 'ios-folder-open' }); frame.v2 = createFrame({ fileIcon: 'document-text', fileUpIcon: 'folder' }); var NAME$2 = 'fcRadio'; var Radio = { name: NAME$2, props: { formCreateInject: { type: Object, required: true }, value: {} }, watch: { 'formCreateInject.options': { handler: function handler() { this.update(); }, deep: true }, value: function value() { this.update(); } }, data: function data() { return { trueValue: [] }; }, methods: { options: function options() { var opt = this.formCreateInject.options; return Array.isArray(opt) ? opt : []; }, onInput: function onInput(n) { this.$emit('input', this.options().filter(function (opt) { return opt.label === n; }).reduce(function (initial, opt) { return opt.value; }, '')); }, update: function update() { var _this = this; this.trueValue = this.options().filter(function (opt) { return opt.value === _this.value; }).reduce(function (initial, opt) { return opt.label; }, ''); } }, created: function created() { this.update(); }, render: function render() { var h = arguments[0]; return h("RadioGroup", helper([{}, this.formCreateInject.prop, {}, { "props": { value: this.trueValue } }, { "on": { "input": this.onInput } }]), [this.options().map(function (opt, index) { var props = _objectSpread2({}, opt); delete props.value; return h("Radio", helper([{}, { "props": props }, { "key": '' + index + '-' + opt.value }])); }), getSlot(this.$slots)]); } }; var is = { type: function type(arg, _type) { return Object.prototype.toString.call(arg) === '[object ' + _type + ']'; }, Undef: function Undef(v) { return v === undefined || v === null; }, Element: function Element(arg) { return _typeof(arg) === 'object' && arg !== null && arg.nodeType === 1 && !is.Object(arg); }, trueArray: function trueArray(data) { return Array.isArray(data) && data.length > 0; }, Function: function Function(v) { var type = this.getType(v); return type === 'Function' || type === 'AsyncFunction'; }, getType: function getType(v) { var str = Object.prototype.toString.call(v); return /^\[object (.*)\]$/.exec(str)[1]; }, empty: function empty(value) { if (value === undefined || value === null) { return true; } if (Array.isArray(value) && Array.isArray(value) && !value.length) { return true; } return typeof value === 'string' && !value; } }; ['Date', 'Object', 'String', 'Boolean', 'Array', 'Number'].forEach(function (t) { is[t] = function (arg) { return is.type(arg, t); }; }); function hasProperty(rule, k) { return {}.hasOwnProperty.call(rule, k); } var NAME$3 = 'fcSelect'; var Select = { name: NAME$3, functional: true, props: { formCreateInject: { type: Object, required: true } }, render: function render(h, ctx) { var options = ctx.props.formCreateInject.options; return h("Select", helper([{}, ctx.data]), [(Array.isArray(options) ? options : []).map(function (props, index) { var slot = props.slot; return h("Option", helper([{}, { "props": props }, { "key": '' + index + '-' + props.value }]), [slot ? h("template", { "slot": props.slotName || 'default' }, [is.Function(slot) ? props.slot(h) : slot]) : null]); }), ctx.children]); } }; var NAME$4 = 'fcTree'; var Tree = { name: NAME$4, props: { formCreateInject: { type: Object, required: true }, type: { type: String, "default": 'checked' }, value: { type: [Array, String, Number], "default": function _default() { return []; } } }, data: function data() { return { treeData: [] }; }, watch: { value: function value(n) { this.setStatus(n); } }, created: function created() { this.setStatus(this.value); }, methods: { setStatus: function setStatus(value) { var n = toArray(value); var data = this.formCreateInject.prop.props.data; this.type === 'selected' ? this.checked(data, n, 'selected') : this.checked(data, n, 'checked'); this.$forceUpdate(); }, checked: function checked(_data, value, type) { var _this = this; _data.forEach(function (node) { _this.$set(node, type, value.indexOf(node.id) !== -1); if (node.children !== undefined && Array.isArray(node.children)) _this.checked(node.children, value, type); }); }, onInput: function onInput(list) { this.$emit('input', list.map(function (node) { return node.id; })); } }, render: function render() { var h = arguments[0]; var on = {}; if (this.type === 'selected') { on['on-select-change'] = this.onInput; } else { on['on-check-change'] = this.onInput; } return h("Tree", helper([{}, this.formCreateInject.prop, { "ref": "tree" }, { "on": on }]), [getSlot(this.$slots)]); } }; var css_248z$1 = "._fc-upload .fc-upload-btn {\n border: 1px dashed #c0ccda;\n cursor: pointer;\n}\n\n._fc-upload .fc-upload-cover {\n opacity: 0;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n background: rgba(0, 0, 0, .6);\n transition: opacity .3s;\n}\n\n._fc-upload .fc-upload-cover i {\n color: #fff;\n font-size: 20px;\n cursor: pointer;\n margin: 0 2px;\n}\n\n._fc-upload .fc-files:hover .fc-upload-cover {\n opacity: 1;\n}\n\n._fc-upload .ivu-upload-list {\n margin-top: 0;\n}\n\n._fc-upload .fc-files img {\n width: 100%;\n height: 100%;\n display: inline-block;\n vertical-align: top;\n}\n\n._fc-upload .fc-upload-btn, ._fc-upload .fc-files {\n display: inline-block;\n width: 58px;\n height: 58px;\n text-align: center;\n line-height: 58px;\n border: 1px solid #c0ccda;\n border-radius: 4px;\n overflow: hidden;\n background: #fff;\n position: relative;\n box-shadow: 2px 2px 5px rgba(0, 0, 0, .1);\n margin-right: 4px;\n box-sizing: border-box;\n}\n"; styleInject(css_248z$1); function parseFile(file) { return { url: file, name: getFileName(file) }; } function getFileName(file) { return ('' + file).split('/').pop(); } var NAME$5 = 'fcUpload'; function createUpload(config) { return { name: NAME$5, props: { formCreateInject: { type: Object, required: true }, onHandle: { type: Function, "default": function _default(file) { this.previewImage = file.url; this.previewVisible = true; } }, uploadType: { type: String, "default": 'file' }, maxLength: { type: Number, "default": 0 }, allowRemove: { type: Boolean, "default": true }, modalTitle: String, handleIcon: { type: [String, Boolean], "default": function _default() { return undefined; } }, value: [Array, String] }, data: function data() { return { uploadList: [], previewVisible: false, previewImage: '', cacheFiles: [] }; }, created: function created() { if (this.formCreateInject.prop.props.showUploadList === undefined) this.formCreateInject.prop.props.showUploadList = false; this.formCreateInject.prop.props.defaultFileList = toArray(this.value).map(parseFile); }, watch: { value: function value(n) { if (this.$refs.upload.fileList.every(function (file) { return !file.status || file.status === 'finished'; })) { this.$refs.upload.fileList = toArray(n).map(parseFile); this.uploadList = this.$refs.upload.fileList; } }, maxLength: function maxLength(n, o) { if (o === 1 || n === 1) this.update(); } }, methods: { key: function key(unique) { return unique; }, isDisabled: function isDisabled() { return this.formCreateInject.prop.props.disabled === true; }, onRemove: function onRemove(file) { if (this.isDisabled()) return; this.$refs.upload.handleRemove(file); }, handleClick: function handleClick(file) { this.onHandle(file); }, makeItem: function makeItem(file, index) { var h = this.$createElement; return this.uploadType === 'image' ? h("img", { "attrs": { "src": file.url }, "key": this.key('img' + index) }) : h("icon", helper([{}, { "props": { type: config.fileIcon, size: 40 } }, { "key": this.key('i' + index) }])); }, makeRemoveIcon: function makeRemoveIcon(file, index) { var _this = this; var h = this.$createElement; return h("icon", { "attrs": { "type": 'ios-trash-outline' }, "on": { "click": function click() { return _this.onRemove(file); } }, "key": this.key('ri' + index) }); }, makeHandleIcon: function makeHandleIcon(file, index) { var _this2 = this; var h = this.$createElement; return h("icon", { "attrs": { "type": this.handleIcon === true || this.handleIcon === undefined ? 'ios-eye-outline' : this.handleIcon }, "on": { "click": function click() { return _this2.handleClick(file); } }, "key": this.key('hi' + index) }); }, makeProgress: function makeProgress(file, index) { var h = this.$createElement; return h("Progress", helper([{}, { "props": { percent: file.percentage, hideInfo: true } }, { "style": "width:90%", "key": this.key('pg' + index) }])); }, makeIcons: function makeIcons(file, index) { var h = this.$createElement; var icons = []; if (this.allowRemove || this.handleIcon !== false) { if (this.uploadType !== 'file' && this.handleIcon !== false || this.uploadType === 'file' && this.handleIcon) icons.push(this.makeHandleIcon(file, index)); if (this.allowRemove) icons.push(this.makeRemoveIcon(file, index)); return h("div", { "class": "fc-upload-cover" }, [icons]); } }, makeFiles: function makeFiles() { var _this3 = this; var h = this.$createElement; return this.uploadList.map(function (file, index) { return _this3.$scopedSlots.fileList ? _this3.$scopedSlots.fileList({ file: file, index: index, vm: _this3 }) : h("div", { "key": _this3.key(index), "class": "fc-files" }, [file.showProgress ? _this3.makeProgress(file, index) : [_this3.makeItem(file, index), _this3.makeIcons(file, index)]]); }); }, makeUpload: function makeUpload() { var h = this.$createElement; var isShow = !this.maxLength || this.maxLength > this.uploadList.length; return h("Upload", helper([{}, this.formCreateInject.prop, { "ref": "upload", "style": { display: 'inline-block' }, "key": this.key('upload') }]), [isShow ? h("template", { "slot": "default" }, [this.$slots["default"] || h("div", { "class": "fc-upload-btn" }, [h("icon", helper([{}, { "props": { type: this.uploadType === 'file' ? 'ios-cloud-upload-outline' : config.imgUpIcon, size: 20 } }]))])]) : null, getSlot(this.$slots, ['default'])]); }, update: function update() { var files = this.$refs.upload.fileList.map(function (file) { return file.url; }).filter(function (url) { return url !== undefined; }); if (this.cacheFiles.length !== files.length) { this.cacheFiles = _toConsumableArray(files); this.$emit('input', this.maxLength === 1 ? files[0] || '' : files); } }, handleCancel: function handleCancel() { this.previewVisible = false; } }, render: function render() { var _this4 = this; var h = arguments[0]; if (this.$refs.upload) { if (this.formCreateInject.prop.props.showUploadList === undefined) this.formCreateInject.prop.props.showUploadList = this.$refs.upload.showUploadList; this.formCreateInject.prop.props.defaultFileList = this.$refs.upload.defaultFileList; } return h("div", { "class": "_fc-upload" }, [[this.formCreateInject.prop.props.showUploadList ? [] : this.makeFiles(), this.makeUpload()], h("Modal", helper([{}, { "props": { title: this.modalTitle, footerHide: true } }, { "model": { value: _this4.previewVisible, callback: function callback($$v) { _this4.previewVisible = $$v; } } }]), [h("img", { "attrs": { "alt": "example", "src": this.previewImage }, "style": "width: 100%" })])]); }, mounted: function mounted() { var _this5 = this; this.uploadList = this.$refs.upload.fileList; this.$watch(function () { return _this5.$refs.upload.fileList; }, function () { _this5.update(); }, { deep: true }); } }; } var upload = createUpload({ fileIcon: 'md-document', imgUpIcon: 'md-images' }); upload.v2 = createUpload({ fileIcon: 'document-text', imgUpIcon: 'image' }); function $set(target, field, value) { Vue.set(target, field, value); } function $del(target, field) { Vue["delete"](target, field); } function deepExtend(origin) { var target = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var mode = arguments.length > 2 ? arguments[2] : undefined; var isArr = false; for (var key in target) { if (Object.prototype.hasOwnProperty.call(target, key)) { var clone = target[key]; if ((isArr = Array.isArray(clone)) || is.Object(clone)) { var nst = origin[key] === undefined; if (isArr) { isArr = false; nst && $set(origin, key, []); } else if (clone._clone && mode !== undefined) { if (mode) { clone = clone.getRule(); nst && $set(origin, key, {}); } else { $set(origin, key, clone._clone()); continue; } } else { nst && $set(origin, key, {}); } origin[key] = deepExtend(origin[key], clone, mode); } else { $set(origin, key, clone); if (!is.Undef(clone)) { if (!is.Undef(clone.__json)) { origin[key].__json = clone.__json; } if (!is.Undef(clone.__origin)) { origin[key].__origin = clone.__origin; } } } } } return mode !== undefined && Array.isArray(origin) ? origin.filter(function (v) { return !v || !v.__ctrl; }) : origin; } function deepCopy(value) { return deepExtend({}, { value: value }).value; } var _extends$1 = Object.assign || function (a) { for (var b, c = 1; c < arguments.length; c++) { for (var d in b = arguments[c], b) { Object.prototype.hasOwnProperty.call(b, d) && $set(a, d, b[d]); } } return a; }; function extend() { return _extends$1.apply(this, arguments); } var NAME$6 = 'fcGroup'; function createGroup(config) { return { name: NAME$6, props: { field: String, rule: [Array, Object], rules: Array, expand: Number, options: Object, formCreateInject: { type: Object, required: true }, button: { type: Boolean, "default": true }, max: { type: Number, "default": 0 }, min: { type: Number, "default": 0 }, value: { type: Array, "default": function _default() { return []; } }, defaultValue: Object, disabled: { type: Boolean, "default": false }, syncDisabled: { type: Boolean, "default": true }, fontSize: { type: Number, "default": 28 }, onBeforeRemove: { type: Function, "default": function _default() {} }, onBeforeAdd: { type: Function, "default": function _default() {} } }, data: function data() { return { len: 0, cacheRule: {}, cacheValue: {}, type: undefined }; }, computed: { formRule: function formRule() { if (this.rules) { return this.rules; } if (this.rule) { return Array.isArray(this.rule) ? this.rule : [this.rule]; } return []; } }, watch: { formRule: { handler: function handler(n, o) { var _this = this; Object.keys(this.cacheRule).forEach(function (v) { var item = _this.cacheRule[v]; if (item.$f) { var val = item.$f.formData(); if (n === o) { item.$f.deferSyncValue(function () { deepExtend(item.rule, n); item.$f.setValue(val); }, true); } else { var _val = item.$f.formData(); item.$f.once('reloading', function () { item.$f.setValue(_val); }); item.rule = deepCopy(n); } } }); }, deep: true }, disabled: function disabled(n) { if (this.syncDisabled) { var lst = this.cacheRule; Object.keys(lst).forEach(function (k) { lst[k].$f.disabled(n); }); } }, expand: function expand(n) { var d = n - this.value.length; if (d > 0) { this.expandRule(d); } }, value: function value(n) { var _this2 = this; n = n || []; var keys = Object.keys(this.cacheRule), total = keys.length, len = total - n.length; if (len < 0) { for (var i = len; i < 0; i++) { this.addRule(n.length + i); } for (var _i = 0; _i < total; _i++) { this.setValue(keys[_i], n[_i]); } } else { if (len > 0) { for (var _i2 = 0; _i2 < len; _i2++) { this.removeRule(keys[total - _i2 - 1]); } } n.forEach(function (val, i) { _this2.setValue(keys[i], n[i]); }); } } }, methods: { _value: function _value(v) { return v && hasProperty(v, this.field) ? v[this.field] : v; }, cache: function cache(k, val) { this.cacheValue[k] = JSON.stringify(val); }, input: function input(value) { this.$emit('input', value); this.$emit('change', value); }, formData: function formData(key, _formData) { var _this3 = this; var cacheRule = this.cacheRule; var keys = Object.keys(cacheRule); if (keys.filter(function (k) { return cacheRule[k].$f; }).length !== keys.length) { return; } var value = keys.map(function (k) { var data = key === k ? _formData : _objectSpread2({}, _this3.cacheRule[k].$f.form); var value = _this3.field ? data[_this3.field] || null : data; _this3.cache(k, value); return value; }); this.input(value); }, setValue: function setValue(key, value) { var field = this.field, $f = this.cacheRule[key].$f; if (field) { value = _defineProperty({}, field, this._value(value)); } if (this.cacheValue[key] === JSON.stringify(field ? value[field] : value)) { return; } this.cache(key, value); $f.coverValue(value || {}); }, addRule: function addRule(i, emit) { var _this4 = this; var rule = this.formCreateInject.form.copyRules(this.formRule); var options = this.options ? _objectSpread2({}, this.options) : { submitBtn: false, resetBtn: false }; if (this.defaultValue) { if (!options.formData) options.formData = {}; var defVal = deepCopy(this.defaultValue); extend(options.formData, this.field ? _defineProperty({}, this.field, defVal) : defVal); } this.$set(this.cacheRule, ++this.len, { rule: rule, options: options }); if (emit) { this.$nextTick(function () { return _this4.$emit('add', rule, Object.keys(_this4.cacheRule).length - 1); }); } }, add$f: function add$f(i, key, $f) { var _this5 = this; this.cacheRule[key].$f = $f; this.formData(key, $f.formData()); this.$nextTick(function () { if (_this5.syncDisabled) { $f.disabled(_this5.disabled); } _this5.$emit('itemMounted', $f, Object.keys(_this5.cacheRule).indexOf(key)); }); }, removeRule: function removeRule(key, emit) { var _this6 = this; var index = Object.keys(this.cacheRule).indexOf(key); this.$delete(this.cacheRule, key); this.$delete(this.cacheValue, key); if (emit) { this.$nextTick(function () { return _this6.$emit('remove', index); }); } }, add: function add(i) { if (this.disabled || false === this.onBeforeAdd(this.value)) { return; } this.addRule(i, true); }, del: function del(index, key) { if (this.disabled || false === this.onBeforeRemove(this.value, index)) { return; } this.removeRule(key, true); this.value.splice(index, 1); this.input(this.value); }, addIcon: function addIcon(key) { var h = this.$createElement; return h("Icon", { "key": "a".concat(key), "attrs": { "type": config.addIcon }, "style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer;color:#000'), "on": { "click": this.add } }); }, delIcon: function delIcon(index, key) { var _this7 = this; var h = this.$createElement; return h("Icon", { "key": "d".concat(key), "attrs": { "type": config.removeIcon }, "style": "font-size:".concat(this.fontSize, "px;cursor:").concat(this.disabled ? 'not-allowed;color:#c9cdd4' : 'pointer', ";"), "on": { "click": function click() { return _this7.del(index, key); } }