mt-ui-components-vue3
Version:
玛果添实UI组件库(Vue3)
847 lines (846 loc) • 38 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _vue = require("vue");
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _table = _interopRequireWildcard(require("ant-design-vue/lib/table"));
var _components = require("../components");
var _Boolean = _interopRequireDefault(require("../Select/Boolean.js"));
var _components2 = require("./components");
var _sortablejs = _interopRequireDefault(require("sortablejs"));
var _core = require("@vueuse/core");
var _lodashEs = require("lodash");
var _util = require("./util");
var _index2 = require("./index");
require("../Search/typing");
require("../ProTable/src/proTableTypes");
var _useConfigInject2 = _interopRequireDefault(require("ant-design-vue/es/config-provider/hooks/useConfigInject"));
var _index3 = _interopRequireDefault(require("./style/index.style"));
var _classNames2 = _interopRequireDefault(require("ant-design-vue/es/_util/classNames"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var dataTableProps = function dataTableProps() {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _table.tableProps)()), {}, {
serial: Boolean,
children: Boolean,
controlSource: Array,
draggable: {
type: Boolean,
default: true
},
extra: Object,
height: {
type: Number,
default: 200
},
showSearch: {
type: Boolean,
default: true
},
showTool: {
type: [Boolean, Object],
default: true
},
searchKey: {
type: String,
default: 'name'
},
sortKey: {
type: String,
default: 'id'
},
searchProps: {
type: Object,
default: function _default() {
return {};
}
}
});
};
var DataTable = (0, _vue.defineComponent)({
name: 'DataTable',
slots: ['expand'],
props: dataTableProps(),
emits: ['change', 'update:dataSource', 'editStatus'],
setup: function setup(props, _ref) {
var emit = _ref.emit,
slots = _ref.slots,
expose = _ref.expose;
var draggableClassName = 'draggable-item';
var _getCurrentInstance = (0, _vue.getCurrentInstance)(),
proxy = _getCurrentInstance.proxy;
var selectedKey = (0, _vue.ref)(); // 选中标识
var editKey = (0, _vue.ref)(); // 编辑标识
var draggableRef = (0, _vue.ref)(null);
var formRef = (0, _vue.ref)();
var formRowValidate = (0, _vue.ref)(true); // 行校验，用于上下左右操作控制
var formErr = (0, _vue.ref)({});
var updateStatus = (0, _vue.ref)(new Set());
var countNumber = (0, _vue.ref)(0);
var maxLength = 30;
var editKeys = (0, _vue.ref)({});
var _fullRef = (0, _vue.ref)();
if (props.showTool) {
(0, _vue.provide)(_index2.FULL_CODE, _fullRef);
}
var _useFullscreen = (0, _core.useFullscreen)(_fullRef),
isFullscreen = _useFullscreen.isFullscreen,
enter = _useFullscreen.enter,
exit = _useFullscreen.exit,
toggle = _useFullscreen.toggle;
var formErrorCache = (0, _vue.ref)({});
var inputFocus = (0, _vue.ref)(false);
var showResult = (0, _vue.reactive)({
msg: 0,
visible: false
});
// 表单值
var formData = (0, _vue.reactive)({
table: [],
search: []
});
var virtualData = (0, _vue.computed)(function () {
var _formData$table, _formData$table$slice;
return ((_formData$table = formData.table) === null || _formData$table === void 0 ? void 0 : (_formData$table$slice = _formData$table.slice) === null || _formData$table$slice === void 0 ? void 0 : _formData$table$slice.call(_formData$table, 0, (countNumber.value + 1) * maxLength)) || [];
});
var sortTable = (0, _vue.ref)();
var showToolLeft = (0, _vue.computed)(function () {
return (0, _lodashEs.isBoolean)(props.showTool) ? props.showTool : props.showTool.left !== false;
});
(0, _util.useDirection)(function (code) {
if (selectedKey.value && formRowValidate.value && !inputFocus.value) {
var columnKeys = newColumns.value.map(function (item) {
return item.dataIndex;
}).filter(function (key) {
return key !== 'action';
});
var _maxLength = formData.table.length - 1;
var _selectedKey$value$sp = selectedKey.value.split('_'),
_selectedKey$value$sp2 = (0, _slicedToArray2.default)(_selectedKey$value$sp, 3),
id = _selectedKey$value$sp2[0],
index = _selectedKey$value$sp2[1],
dataIndex = _selectedKey$value$sp2[2];
var _dataIndex = columnKeys.findIndex(function (key) {
return key === dataIndex;
}) || 1;
var newDataIndex = _dataIndex;
var newIndex = Number(index);
switch (code) {
case 'left':
if (_dataIndex > 1) {
newDataIndex--;
}
break;
case 'right':
if (_dataIndex < columnKeys.length - 1) {
newDataIndex++;
}
break;
case 'down':
if (index < _maxLength) {
newIndex++;
}
break;
case 'up':
if (index > 0) {
newIndex--;
}
break;
}
selectedKey.value = "td_".concat(newIndex, "_").concat(columnKeys[newDataIndex]);
}
});
var sortTables = function sortTables(data) {
var sortKey = props.sortKey;
return data.sort(function (a, b) {
if (a[sortKey] > b[sortKey]) {
return 1;
} else if (a[sortKey] < b[sortKey]) {
return -1;
} else {
return 0;
}
});
};
var search = function search(e) {
var includeArr = [];
var filterArr = [];
selectedKey.value = '';
editKey.value = '';
if (e) {
formData.table.forEach(function (item) {
var _item$props$searchKey;
if ((_item$props$searchKey = item[props.searchKey]) !== null && _item$props$searchKey !== void 0 && _item$props$searchKey.includes(e)) {
includeArr.push(item);
} else {
filterArr.push(item);
}
});
formData.table = [].concat(includeArr, filterArr).map(function (item, index) {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
index: index + 1
});
});
showResult.msg = includeArr.length;
showResult.visible = true;
} else {
showResult.msg = 0;
showResult.visible = false;
formData.table = sortTables(formData.table);
}
};
var cleanEditStatus = function cleanEditStatus() {
editKeys.value = {};
updateStatus.value.clear();
};
var getData = function getData() {
var quit = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
return new Promise(function (resolve, reject) {
formRef.value.validate().then(function () {
var newData = (0, _util.cleanUUIDbyData)(formData.table);
formErr.value = {};
resolve(newData);
// 退出编辑模式
if (quit) {
editKey.value = '';
}
}).catch(function (err) {
reject(err);
});
});
};
var getList = function getList() {
return formData.table;
};
/**
* 单个选中
* @param key
*/
var rowClick = /*#__PURE__*/function () {
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(key) {
return _regenerator.default.wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
if (!(Object.keys(formErr.value).length && !formErr.value[key])) {
_context.next = 2;
break;
}
return _context.abrupt("return");
case 2:
if (key !== editKey.value) {
editKey.value = '';
}
selectedKey.value = key;
case 4:
case "end":
return _context.stop();
}
}, _callee);
}));
return function rowClick(_x) {
return _ref2.apply(this, arguments);
};
}();
/**
* 双击修改
* @param key
*/
var editClick = function editClick(key) {
if (Object.keys(formErr.value).length && !formErr.value[key]) return;
if (key === selectedKey.value) {
editKey.value = key;
editKeys.value[key] = true;
}
};
/**
* 初始化拖拽
*/
var sortTableHandle = function sortTableHandle() {
var _draggableRef$value;
if (sortTable.value) {
var _sortTable$value;
(_sortTable$value = sortTable.value) === null || _sortTable$value === void 0 ? void 0 : _sortTable$value.destroy();
}
var ele = (_draggableRef$value = draggableRef.value) === null || _draggableRef$value === void 0 ? void 0 : _draggableRef$value.querySelector('tbody');
if (!ele) return;
sortTable.value = new _sortablejs.default(ele, {
draggable: '.ant-table-row',
animation: 200,
ghostClass: 'draggable-ghost',
sort: true,
onEnd: function onEnd(_ref3) {
var _oldTarget$querySelec, _newTarget$querySelec;
var oldIndex = _ref3.oldIndex,
newIndex = _ref3.newIndex,
to = _ref3.to,
from = _ref3.from;
// 获取真正的index
var oldTarget = draggableRef.value.querySelector('.ant-table-tbody').querySelectorAll('.ant-table-row')[oldIndex - 1];
var newTarget = draggableRef.value.querySelector('.ant-table-tbody').querySelectorAll('.ant-table-row')[newIndex - 1];
var oldTargetPositions = (0, _util.getElData)((_oldTarget$querySelec = oldTarget.querySelectorAll('.j-row-click')) === null || _oldTarget$querySelec === void 0 ? void 0 : _oldTarget$querySelec[1]);
var newTargetPositions = (0, _util.getElData)((_newTarget$querySelec = newTarget.querySelectorAll('.j-row-click')) === null || _newTarget$querySelec === void 0 ? void 0 : _newTarget$querySelec[1]);
var _oldIndex = oldTargetPositions[1];
var _newIndex = newTargetPositions[1];
var curr = formData.table.splice(_oldIndex - 1, 1)[0];
formData.table.splice(_newIndex - 1, 0, curr);
var _sort = [_oldIndex, _newIndex].sort(function (a, b) {
return a - b;
}),
_sort2 = (0, _slicedToArray2.default)(_sort, 2),
min = _sort2[0],
max = _sort2[1];
for (var i = min; i <= max; i++) {
formData.table[i - 1].index = i;
}
// 判断当前拖拽中是否有选中
if (selectedKey.value) {
var _selectedKey$value$sp3 = selectedKey.value.split('_'),
_selectedKey$value$sp4 = (0, _slicedToArray2.default)(_selectedKey$value$sp3, 3),
td = _selectedKey$value$sp4[0],
index = _selectedKey$value$sp4[1],
dataIndex = _selectedKey$value$sp4[2];
if (index >= min && index <= max) {
// 是否在拖拽范围内
var numIndex = Number(index);
var _index = _newIndex;
if (numIndex < _oldIndex) {
_index = numIndex + 1;
} else if (numIndex > _oldIndex) {
_index = numIndex - 1;
}
selectedKey.value = [td, _index, dataIndex].join('_');
if (editKey.value) {
editKey.value = [td, _index, dataIndex].join('_');
}
}
}
}
});
return sortTable;
};
/**
* 对比数据是否修改
* @param record
* @param index
* @param dataIndex
* @param type
*/
var controlData = function controlData(record, index, dataIndex, type) {
var _props$dataSource$ind;
var item = props.columns.find(function (a) {
return a.dataIndex === dataIndex;
});
var key = "td_".concat(index, "_").concat(dataIndex);
if (item !== null && item !== void 0 && item.control) {
var _isControl = item.control(record, props.dataSource[index]);
if (_isControl) {
updateStatus.value.add(key);
} else {
updateStatus.value.delete(key);
}
return _isControl;
}
if (!type || !record) {
return false;
}
var oldData = (_props$dataSource$ind = props.dataSource[index]) === null || _props$dataSource$ind === void 0 ? void 0 : _props$dataSource$ind[dataIndex];
var isControl = oldData ? JSON.stringify(oldData) !== JSON.stringify(record[dataIndex]) : true;
if (isControl) {
updateStatus.value.add(key);
} else {
updateStatus.value.delete(key);
}
// 该数据是否支持编辑
return isControl;
};
// 重组columns
var newColumns = (0, _vue.computed)(function () {
var hasSerial = 'serial' in props && props.serial !== false;
var serialItem = {
dataIndex: 'index',
title: '序号',
width: 60
};
var propsColumns = (0, _lodashEs.cloneDeep)(props.columns);
var _columns = propsColumns.map(function (item) {
var _item$form;
if ((_item$form = item.form) !== null && _item$form !== void 0 && _item$form.rules) {
var index = item.form.rules.findIndex(function (item) {
return item.callback && (0, _lodashEs.isFunction)(item.callback);
});
if (index >= 0) {
var callback = item.form.rules[index].callback;
item.form.rules[index] = {
validator: function validator(rule, value) {
return callback(rule, value, formData.table);
}
};
}
}
item.customCell = function (record, rowIndex, column) {
return {
onClick: function onClick(e) {
e.stopPropagation();
rowClick(!['index', 'action'].includes(column.dataIndex) ? "td_".concat(rowIndex, "_").concat(column.dataIndex) : '');
},
onDblclick: function onDblclick(e) {
e.stopPropagation();
var isEdit = item.doubleClick ? item.doubleClick(record, rowIndex, column.dataIndex) : true;
if (isEdit) {
editClick(column.type ? "td_".concat(rowIndex, "_").concat(column.dataIndex) : '');
}
}
};
};
return (0, _objectSpread2.default)({}, item);
});
return hasSerial ? [serialItem].concat((0, _toConsumableArray2.default)(_columns)) : _columns;
});
var addEditor = function addEditor(index, dataIndex) {
var key = "td_".concat(index, "_").concat(dataIndex);
editKeys.value[key] = true;
};
var addEditorAll = function addEditorAll(index) {
var _iterator = (0, _createForOfIteratorHelper2.default)(props.columns),
_step;
try {
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var item = _step.value;
addEditor(index, item.dataIndex);
}
} catch (err) {
_iterator.e(err);
} finally {
_iterator.f();
}
};
var addItem = /*#__PURE__*/function () {
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(_data, index) {
var vail, data, editIndex;
return _regenerator.default.wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
if (!_data) {
_context2.next = 9;
break;
}
_context2.next = 3;
return getData();
case 3:
vail = _context2.sent;
data = (0, _toConsumableArray2.default)(formData.table);
editIndex = index + 1;
if (index !== undefined) {
data.splice(index + 1, 0, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, _data), {}, {
_sortIndex: index + 1,
_uuid: (0, _util.getUUID)()
}));
} else {
data.push((0, _objectSpread2.default)((0, _objectSpread2.default)({}, _data), {}, {
_sortIndex: index,
_uuid: (0, _util.getUUID)()
}));
editIndex = data.length - 1;
}
formData.table = data;
//新增项进入编辑模式
newColumns.value.forEach(function (item, _index) {
var _key = "td_".concat(editIndex, "_").concat(item.dataIndex);
editKeys.value[_key] = true;
if (_index === 0) {
editKey.value = _key;
}
});
case 9:
return _context2.abrupt("return", (0, _util.cleanUUIDbyData)(formData.table));
case 10:
case "end":
return _context2.stop();
}
}, _callee2);
}));
return function addItem(_x2, _x3) {
return _ref4.apply(this, arguments);
};
}();
var removeEditKeysByIndex = function removeEditKeysByIndex(editIndex) {
newColumns.value.forEach(function (item, _index) {
var _key = "td_".concat(editIndex, "_").concat(item.dataIndex);
delete editKeys.value[_key];
delete formErr.value[_key];
});
};
var removeItem = function removeItem(index) {
if (index >= 0) {
var data = (0, _toConsumableArray2.default)(formData.table);
data.splice(index, 1);
formData.table = data;
removeEditKeysByIndex(index);
updateStatus.value.add('delete_' + index);
}
return (0, _util.cleanUUIDbyData)(formData.table);
};
var initItems = function initItems() {
var _formRef$value;
formData.table = sortTables((0, _util.setUUIDbyDataSource)(props.dataSource));
(_formRef$value = formRef.value) === null || _formRef$value === void 0 ? void 0 : _formRef$value.clearValidate();
countNumber.value = 0;
return (0, _util.cleanUUIDbyData)(formData.table);
};
var stringify = function stringify(data) {
return data ? JSON.stringify(data) : '';
};
var firstValidate = (0, _lodashEs.debounce)(function () {
var key = Object.keys(formErrorCache.value)[0];
if (key) {
var errorNode = draggableRef.value.querySelector(".".concat(key));
var bodyNode = draggableRef.value.querySelector(".ant-table-body");
if (errorNode) {
var index = Number(key.split('_')[1]);
bodyNode.scrollTop = errorNode.getBoundingClientRect().height * index;
}
var errorMsg = formErrorCache.value[key].errorMsg;
formErr.value[key] = errorMsg;
if (!editKey.value) {
editKey.value = key;
} else {
// 处于编辑模式，并且编辑项在校验错误项中
editKey.value = formErrorCache.value[editKey.value] ? editKey.value : key;
}
updateStatus.value.add(editKey.value);
}
formErrorCache.value = {};
}, 10);
var handlePlacement = function handlePlacement(index, placement) {
if (placement) {
return index > 1 ? 'top' + placement : 'bottom' + placement;
}
return index > 1 ? 'top' : 'bottom';
};
var validate = function validate(name, status, errorMsg) {
var key = "td_".concat(name[1], "_").concat(name[2]);
if (!status) {
formErrorCache.value[key] = {
errorMsg: errorMsg[0],
status: status
};
} else {
delete formErr.value[key];
}
firstValidate();
};
(0, _vue.onMounted)(function () {
(0, _vue.nextTick)(function () {
var bodyNode = draggableRef.value.querySelector('.ant-table-body');
bodyNode.style.minHeight = '200px';
(0, _core.useInfiniteScroll)(draggableRef.value.querySelector('.ant-table-body'), function () {
// 滑动到底部
if (countNumber.value * maxLength <= formData.table.length && formData.table[(countNumber.value + 1) * maxLength + 1]) {
// 有多余数据时，进行添加
countNumber.value++;
}
}, {
distance: 10
});
});
});
(0, _vue.watch)(function () {
return JSON.stringify(props.dataSource);
}, function () {
formData.table = (0, _util.setUUIDbyDataSource)(props.dataSource);
}, {
immediate: true
});
(0, _vue.watch)(function () {
return formData.table;
}, function () {
// updateRevoke(formData.table);
var data = (0, _util.cleanUUIDbyData)(formData.table);
emit('change', data);
emit('update:dataSource', data);
}, {
deep: true
});
(0, _vue.watch)(function () {
return JSON.stringify((0, _toConsumableArray2.default)(updateStatus.value.values()));
}, function () {
emit('editStatus', !!(0, _toConsumableArray2.default)(updateStatus.value.values()).length);
});
(0, _vue.watch)(function () {
return isFullscreen.value;
}, function () {
if (!isFullscreen.value) {
proxy.$forceUpdate();
}
});
expose({
getData: getData,
getList: getList,
addItem: addItem,
removeItem: removeItem,
initItems: initItems,
addEditor: addEditor,
addEditorAll: addEditorAll,
cleanEditStatus: cleanEditStatus,
fullRef: function fullRef() {
return _fullRef.value;
}
});
var _useConfigInject = (0, _useConfigInject2.default)('data-table', props),
prefixCls = _useConfigInject.prefixCls;
var _useStyle = (0, _index3.default)(prefixCls),
_useStyle2 = (0, _slicedToArray2.default)(_useStyle, 2),
wrapSSR = _useStyle2[0],
hashId = _useStyle2[1];
var prefixClsValue = prefixCls.value;
var rootCls = (0, _classNames2.default)(prefixClsValue, (0, _defineProperty2.default)({}, hashId.value, true));
return function () {
return wrapSSR((0, _vue.createVNode)("div", {
"ref": _fullRef,
"class": "".concat(rootCls, " ").concat(isFullscreen ? 'j-data-table-fullscreen' : '')
}, [props.showTool !== false && (0, _vue.createVNode)("div", {
"class": "j-data-table-tool"
}, [showToolLeft && (0, _vue.createVNode)("div", {
"class": "j-data-table-tool-left"
}, [props.showSearch && (0, _vue.createVNode)("div", {
"class": "j-data-table-search"
}, [(0, _vue.createVNode)(_components.InputSearch, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props.searchProps), {}, {
"allow-clear": true,
"style": "width: 220px",
"onSearch": search
}), null)]), (0, _vue.createVNode)("div", {
"class": "j-data-table-full"
}, [(0, _vue.createVNode)(_components.AIcon, {
"type": isFullscreen ? 'FullscreenExitOutlined' : 'FullscreenOutlined',
"onClick": toggle
}, null)]), showResult.visible && (0, _vue.createVNode)("div", {
"class": "j-data-table-search-result"
}, [(0, _vue.createTextVNode)("\u5DF2\u67E5\u8BE2\u5230"), (0, _vue.createVNode)("span", null, [showResult.msg]), (0, _vue.createTextVNode)(" \u6761\u76F8\u5173\u6570\u636E")])]), (0, _vue.createVNode)("div", {
"class": "j-data-table-expand"
}, [slots.expand && slots.expand()])]), (0, _vue.createVNode)("div", {
"class": "j-data-table-body"
}, [(0, _vue.createVNode)(_components.Form, {
"ref": formRef,
"layout": "horizontal",
"model": formData,
"scroll-to-first-error": true,
"onValidate": validate
}, {
default: function _default() {
return [(0, _vue.createVNode)("div", {
"ref": draggableRef,
"class": "draggable-body"
}, [(0, _vue.createVNode)(_table.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
"columns": newColumns.value,
"pagination": false,
"data-source": virtualData.value,
"row-key": props.rowKey || '_uuid',
"scroll": props.height ? {
y: !isFullscreen.value ? props.height < 200 ? 200 : props.height : "calc(100vh - 160px)"
} : undefined
}), {
headerCell: function headerCell(dt) {
var _column$form;
var column = dt.column,
title = dt.title;
return (0, _vue.createVNode)("span", {
"class": "\n j-data-table-header\n ".concat((_column$form = column.form) !== null && _column$form !== void 0 && _column$form.required ? 'required' : '', "\n ")
}, [slots.headerCell ? slots.headerCell({
column: column
}) : column.title]);
},
bodyCell: function bodyCell(dt) {
var _column$form2, _column$form3, _column$form4, _column$form5, _column$form6;
var column = dt.column,
record = dt.record,
index = dt.index;
// 判断是否已修改
var isEditDiv = (editKeys["td_".concat(index, "_").concat(column.dataIndex)] || column.control) && controlData(record, record._sortIndex, column.dataIndex, column.type) ? (0, _vue.createVNode)("div", {
"class": "j-row-update"
}, null) : '';
var columnTypeElement = function columnTypeElement(columnType) {
var _newColumns$value$fin, _column$components, _column$components2;
var el = (0, _vue.createVNode)(_vue.Fragment, null, null);
switch (columnType) {
case "text":
el = (0, _vue.createVNode)(_components.Input, {
"value": formData.table[index][column.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][column.dataIndex] = $event;
},
"placeholder": "\u8BF7\u8F93\u5165".concat(column.title),
"style": "width: 100%",
"onFocus": function onFocus() {
return inputFocus.value = true;
},
"onBlur": function onBlur() {
return inputFocus.value = false;
}
}, null);
break;
case 'number':
el = (0, _vue.createVNode)(_components.InputNumber, {
"value": formData.table[index][column.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][column.dataIndex] = $event;
},
"style": "width: 100%",
"placeholder": "\u8BF7\u8F93\u5165".concat(column.title),
"onFocus": function onFocus() {
return inputFocus.value = true;
},
"onBlur": function onBlur() {
return inputFocus.value = false;
}
}, null);
break;
case 'TypeSelect':
el = (0, _vue.createVNode)(_components2.DataTableTypeSelect, {
"value": formData.table[index][(_newColumns$value$fin = newColumns.value.find(function (item) {
return item.type === 'TypeSelect';
})) === null || _newColumns$value$fin === void 0 ? void 0 : _newColumns$value$fin.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][(_newColumns$value$fin = newColumns.value.find(function (item) {
return item.type === 'TypeSelect';
})) === null || _newColumns$value$fin === void 0 ? void 0 : _newColumns$value$fin.dataIndex] = $event;
},
"placeholder": "\u8BF7\u9009\u62E9".concat(column.title)
}, null);
break;
case 'select':
el = (0, _vue.createVNode)(_components.Select, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (_column$components = column.components) === null || _column$components === void 0 ? void 0 : _column$components.props), {}, {
"value": formData.table[index][column.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][column.dataIndex] = $event;
},
"style": "width: 100%",
"options": column.options,
"placeholder": "\u8BF7\u9009\u62E9".concat(column.title)
}), null);
break;
case 'booleanSelect':
el = (0, _vue.createVNode)(_Boolean.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (_column$components2 = column.components) === null || _column$components2 === void 0 ? void 0 : _column$components2.props), {}, {
"value": formData.table[index][column.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][column.dataIndex] = $event;
},
"style": "width: 100%",
"placeholder": "\u8BF7\u9009\u62E9".concat(column.title)
}), null);
break;
case 'components':
el = column.components.name ? (0, _vue.createVNode)((0, _vue.resolveComponent)("component"), (0, _objectSpread2.default)((0, _objectSpread2.default)({}, column.components.props), {}, {
"is": column.components.name,
"value": formData.table[index],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index] = $event;
},
"columns": newColumns.value,
"extra": props.extra,
"record": record,
"onFocus": function onFocus() {
return inputFocus.value = true;
},
"onBlur": function onBlur() {
return inputFocus.value = false;
}
}), null) : (0, _vue.createVNode)(_vue.Fragment, null, null);
break;
}
};
var noIndexColumn = (0, _vue.createVNode)("div", {
"class": [draggableClassName, column.dataIndex !== 'action' ? 'j-row-click' : '', editKey.value === "td_".concat(index, "_").concat(column.dataIndex) && column.type ? 'j-data-table--edit' : ''],
"data-index": column.type ? index : undefined,
"data-name": column.dataIndex
}, [!((_column$form2 = column.form) !== null && _column$form2 !== void 0 && _column$form2.isVerify) && !editKeys.value["td_".concat(index, "_").concat(column.dataIndex)] ? slots[column.dataIndex] ? slots[column.dataIndex]({
data: {
record: record,
index: index
}
}) : (0, _vue.createVNode)(_components.Ellipsis, null, {
default: function _default() {
return [record[column.dataIndex]];
}
}) : !column.type && column.form ? (0, _vue.createVNode)(_components.FormItem, {
"name": ['table', index].concat(((_column$form3 = column.form) === null || _column$form3 === void 0 ? void 0 : _column$form3.name) || column.dataIndex),
"rules": (_column$form4 = column.form) === null || _column$form4 === void 0 ? void 0 : _column$form4.rules,
"validate-first": true
}, {
default: function _default() {
return [slots[column.dataIndex] ? slots[column.dataIndex]({
data: {
record: record,
index: index
}
}) : ''];
}
}) : (0, _vue.createVNode)(_components.FormItem, {
"name": ['table', index].concat(((_column$form5 = column.form) === null || _column$form5 === void 0 ? void 0 : _column$form5.name) || column.dataIndex),
"rules": (_column$form6 = column.form) === null || _column$form6 === void 0 ? void 0 : _column$form6.rules,
"validate-first": true
}, {
default: function _default() {
return [editKey.value !== "td_".concat(index, "_").concat(column.dataIndex) ? slots[column.dataIndex] ? slots[column.dataIndex]({
data: {
record: record,
index: index
}
}) : (0, _vue.createVNode)(_components.Ellipsis, null, {
default: function _default() {
return [record[column.dataIndex]];
}
}) : column.type === 'text' ? (0, _vue.createVNode)(_components.Input, {
"value": formData.table[index][column.dataIndex],
"onUpdate:value": function onUpdateValue($event) {
return formData.table[index][column.dataIndex] = $event;
},
"placeholder": "\u8BF7\u8F93\u5165".concat(column.title),
"style": "width: 100%",
"onFocus": function onFocus() {
return inputFocus.value = true;
},
"onBlur": function onBlur() {
return inputFocus.value = false;
}
}, null) : columnTypeElement(column.type)];
}
})]);
return (0, _vue.createVNode)("div", null, [isEditDiv, (0, _vue.createVNode)(_components2.FormError, {
"id": "td_".concat(index, "_").concat(column.dataIndex),
"index": index,
"visible": !!formErr["td_".concat(index, "_").concat(column.dataIndex)],
"content": formErr["td_".concat(index, "_").concat(column.dataIndex)],
"is-edit": formErr["td_".concat(index, "_").concat(column.dataIndex)],
"selected": selectedKey.value === "td_".concat(index, "_").concat(column.dataIndex),
"name": column.type ? column.dataIndex : undefined,
"get-popup-container": function getPopupContainer(e) {
return e.parentNode;
},
"placement": handlePlacement(index, column.placement)
}, null), column.dataIndex === 'index' ? (0, _vue.createVNode)("div", {
"class": draggableClassName
}, [index + 1]) : noIndexColumn]);
},
emptyText: function emptyText() {
return (0, _vue.createVNode)("div", {
"class": "j-data-table-empty"
}, [(0, _vue.createVNode)(_components.Empty, null, null)]);
}
})])];
}
})])]));
};
}
});
var _default2 = DataTable;
exports.default = _default2;