vue2-components
Version:
vue2 components package
1,153 lines (1,124 loc) • 82.1 kB
JavaScript
var MyComponent = (function (exports, vue) {
'use strict';
var defaultProps = {
rowKey: String | void 0,
localStorageKey: String,
columns: {
type: Array,
"default": function _default() {
return [];
}
},
queryPermissionFn: {
type: Function,
"default": null
},
queryTableDataFn: {
type: Function,
"default": null
},
exportTableFn: {
type: Function,
"default": function _default() {}
},
openTabFn: {
type: Function,
"default": function _default() {}
},
summeryFn: {
type: Function,
"default": null
},
columnsSettable: {
type: Boolean,
"default": true
},
pagination: {
type: Object,
"default": function _default() {
return {
total: 0,
pageSize: 10,
current: 1,
showTotal: function showTotal(total) {
return "\u5171" + total + "\u6761";
},
showQuickJumper: true,
showSizeChanger: true,
pageSizeOptions: ["10", "20", "30", "50"]
};
}
}
};
function _typeof(obj) {
"@babel/helpers - typeof";
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
}, _typeof(obj);
}
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
Object.defineProperty(Constructor, "prototype", {
writable: false
});
return Constructor;
}
var LocalStorage = /*#__PURE__*/function () {
function LocalStorage(key) {
_classCallCheck(this, LocalStorage);
this.key = key;
if (!window || !window.localStorage) {
console.error("window.localStorage\u4E0D\u5B58\u5728");
}
}
_createClass(LocalStorage, [{
key: "setValue",
value: function setValue(value) {
if (_typeof(value) === "object") {
window.localStorage.setItem(this.key, JSON.stringify(value));
} else {
window.localStorage.setItem(this.key, value);
}
}
}, {
key: "getValue",
value: function getValue() {
return window.localStorage.getItem(this.key);
}
}, {
key: "clearValue",
value: function clearValue() {
window.localStorage.removeItem(this.key);
}
}]);
return LocalStorage;
}();
var isEmpty = function isEmpty(v) {
return v === "" || v === void 0 || v === null;
};
function debounce(delay, fn) {
var movement = null;
return function () {
var args = arguments;
clearTimeout(movement);
movement = setTimeout(function () {
fn.apply(this, args);
}, delay);
};
}
function transformArrToMap(arr, key) {
return arr.reduce(function (res, data) {
if (key) {
res[data[key]] = true;
} else {
res[data] = true;
}
return res;
}, {});
}
function isFunction(target) {
return Object.prototype.toString.call(target) === "[object Function]";
}
function isPromise(obj) {
return !!obj && (_typeof(obj) === "object" || typeof obj === "function") && typeof obj.then === "function";
}
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var script = {
components: {},
props: {
propList: Array,
localStorageKey: String
},
data() {
return {
visible: false,
keyWord: "",
filtering: false,
filterList: [],
valueMap: {},
valueMapJSONStringfy: "",
validColumnsConfig: [],
validColumnsGroup: [],
groupValueData: {},
localStorageHandler: null
};
},
computed: {
columnMap() {
let count = 0;
return this.validColumnsGroup.reduce((map, { groupKey, list }) => {
list && list.forEach((col) => {
map[col.dataIndex] = __spreadProps(__spreadValues({}, col), {
index: col.index || count++,
groupKey,
disabled: col.disabled || !!col.fixed
});
});
return map;
}, {});
},
columnsTypeValuesMap() {
return this.validColumnsGroup.reduce((map, { groupKey, list }) => {
let fullValues = [];
let requiredValues = [];
list.forEach(({ dataIndex, disabled }) => {
fullValues.push(dataIndex);
if (disabled) {
requiredValues.push(dataIndex);
}
});
map[groupKey] = {
fullValues,
requiredValues
};
return map;
}, {});
},
defaultTab() {
return this.validColumnsGroup[0] && this.validColumnsGroup[0].groupKey;
},
checkedColumns() {
return Object.values(this.groupValueData).reduce((res, { checkedKeys }) => {
res = res.concat(checkedKeys.map((key) => this.columnMap[key]));
return res;
}, []);
},
checkedPropMap() {
return this.checkedColumns.reduce((res, item) => {
res[item.dataIndex] = true;
return res;
}, {});
},
noOpProps() {
return this.propList.filter((item) => item.noOp);
}
},
watch: {
visible(val) {
},
propList: {
immediate: true,
handler(list) {
this.initColumnsGroup(list);
}
}
},
mounted() {
this.debounceFn = debounce(500, this.handleColumnsSearch);
this.useLocalStorage();
},
methods: {
initColumnsGroup(list) {
let map = {};
let count = 0;
list.forEach((item) => {
const { key: groupKey, name: groupName } = item.group;
if (!map[groupKey]) {
count++;
map[groupKey] = {
groupKey,
groupName,
list: [],
index: count
};
}
!item.noOp && map[groupKey].list.push(item);
});
this.validColumnsGroup = Object.values(map).sort((pre, cur) => pre.index - cur.index);
this.initGroupChecked();
},
useLocalStorage() {
if (this.localStorageHandler)
return;
this.localStorageHandler = new LocalStorage(this.localStorageKey);
},
initGroupChecked() {
this.useLocalStorage();
let localStorageCheckedKeys = [];
try {
localStorageCheckedKeys = JSON.parse(this.localStorageHandler.getValue());
if (!Array.isArray(localStorageCheckedKeys)) {
throw "local storage\u6240\u5B58\u6570\u636E\u6709\u8BEF\uFF0C\u73B0\u4F7F\u7528\u9ED8\u8BA4\u6570\u636E";
}
} catch (error) {
console.error(error || "\u8BFB\u53D6local storage\u6570\u636E\u5931\u8D25\uFF0C\u73B0\u4F7F\u7528\u9ED8\u8BA4\u6570\u636E");
}
let localStorageCheckedMap = localStorageCheckedKeys.length > 0 ? transformArrToMap(localStorageCheckedKeys) : null;
this.groupValueData = this.validColumnsGroup.reduce((map, { groupKey, list }) => {
let checkedKeys = list.filter((item) => {
let { dataIndex, disabled, isDefault } = item;
if (disabled)
return true;
if (localStorageCheckedMap) {
return !!localStorageCheckedMap[dataIndex];
}
return isDefault;
}).map(({ dataIndex }) => dataIndex);
let checkedAll = checkedKeys.length === list.length;
map[groupKey] = {
indeterminate: !checkedAll && checkedKeys.length > 0,
checkedAll,
checkedKeys
};
return map;
}, {});
this.emitChange();
},
handleApply() {
this.emitChange((keys) => {
if (!this.localStorageKey) {
console.error("\u672A\u4F20\u5165localStorageKey\uFF0C\u65E0\u6CD5\u5B9E\u73B0\u81EA\u5B9A\u4E49\u5217\u4FDD\u5B58\uFF0C\u8BF7\u68C0\u67E5");
return;
}
this.localStorageHandler.setValue(keys);
this.visible = false;
this.keyWord = "";
});
},
close() {
this.visible = false;
this.keyWord = "";
this.recoverySelect();
},
onSearch() {
this.filtering = true;
this.debounceFn();
},
handleSearchItemChecked(e, { groupKey, dataIndex }) {
let checked = e.target.checked;
if (checked) {
this.groupValueData[groupKey].checkedKeys.push(dataIndex);
} else {
this.groupValueData[groupKey].checkedKeys = this.groupValueData[groupKey].checkedKeys.filter((key) => key !== dataIndex);
}
const checkedCount = this.groupValueData[groupKey].checkedKeys.length;
this.groupValueData[groupKey].checkedAll = checkedCount === this.columnsTypeValuesMap[groupKey].fullValues.length;
this.groupValueData[groupKey].indeterminate = !this.groupValueData[groupKey].checkedAll && checkedCount > 0;
},
handleColumnsSearch() {
this.filterList = Object.values(this.columnMap).filter(({ title, disabled }) => {
return title.includes(this.keyWord) && !disabled;
});
console.log(223, this.filterList);
this.filtering = false;
},
recoverySelect() {
this.initGroupChecked();
},
onSelectAllChange(e, groupKey) {
let checked = e.target.checked;
this.groupValueData[groupKey].checkedAll = checked;
if (checked) {
this.groupValueData[groupKey].checkedKeys = this.columnsTypeValuesMap[groupKey].fullValues;
this.groupValueData[groupKey].indeterminate = false;
} else {
this.groupValueData[groupKey].checkedKeys = this.columnsTypeValuesMap[groupKey].requiredValues;
this.groupValueData[groupKey].indeterminate = this.groupValueData[groupKey].checkedKeys.length > 0;
}
this.updateChecked();
},
deleteSelectColunm(key, groupKey) {
let selectColumnKeys = this.groupValueData[groupKey].checkedKeys.filter((k) => k !== key);
this.groupValueData[groupKey].checkedKeys = selectColumnKeys;
this.groupValueData[groupKey].checkedAll = false;
this.groupValueData[groupKey].indeterminate = selectColumnKeys.length > 0;
this.updateChecked();
},
updateChecked(updateType) {
},
updateCheckedKey(groupKey, keys) {
let checkedCount = keys.length;
const checkedAll = checkedCount === this.columnsTypeValuesMap[groupKey].fullValues.length;
this.groupValueData[groupKey].checkedAll = checkedAll;
this.groupValueData[groupKey].indeterminate = !checkedAll && checkedCount > 0;
this.groupValueData[groupKey].checkedKeys = keys;
},
getCheckedKeys(checkedItems) {
return checkedItems.map(({ dataIndex }) => dataIndex);
},
emitChange(callback) {
const colList = this.formatColOrder();
this.$emit("changeCoumns", colList);
callback && callback(this.getCheckedKeys(this.checkedColumns));
},
formatColOrder() {
const { leftProps, rightProps } = (this.noOpProps || []).reduce((res, item) => {
if (item.position === "right") {
res.rightProps.push(item);
} else {
res.leftProps.push(item);
}
return res;
}, {
leftProps: [],
rightProps: []
});
const { fixedLeftProps, fixedRightProps, others } = this.checkedColumns.reduce((res, item) => {
if (item.fixed) {
if (item.fixed === "right") {
res.fixedRightProps.push(item);
} else {
res.fixedLeftProps.push(item);
}
} else {
res.others.push(item);
}
return res;
}, {
fixedLeftProps: [],
fixedRightProps: [],
others: []
});
return [
...fixedLeftProps,
...leftProps,
...others,
...rightProps,
...fixedRightProps
];
}
}
};
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let hook;
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
// inject component styles
if (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier);
}
};
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook;
}
else if (style) {
hook = shadowMode
? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
}
: function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
}
else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}
const isOldIE = typeof navigator !== 'undefined' &&
/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
function createInjector(context) {
return (id, style) => addStyle(id, style);
}
let HEAD;
const styles = {};
function addStyle(id, css) {
const group = isOldIE ? css.media || 'default' : id;
const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
if (!style.ids.has(id)) {
style.ids.add(id);
let code = css.source;
if (css.map) {
// https://developer.chrome.com/devtools/docs/javascript-debugging
// this makes source maps inside style tags work properly in Chrome
code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
// http://stackoverflow.com/a/26603875
code +=
'\n/*# sourceMappingURL=data:application/json;base64,' +
btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
' */';
}
if (!style.element) {
style.element = document.createElement('style');
style.element.type = 'text/css';
if (css.media)
style.element.setAttribute('media', css.media);
if (HEAD === undefined) {
HEAD = document.head || document.getElementsByTagName('head')[0];
}
HEAD.appendChild(style.element);
}
if ('styleSheet' in style.element) {
style.styles.push(code);
style.element.styleSheet.cssText = style.styles
.filter(Boolean)
.join('\n');
}
else {
const index = style.ids.size - 1;
const textNode = document.createTextNode(code);
const nodes = style.element.childNodes;
if (nodes[index])
style.element.removeChild(nodes[index]);
if (nodes.length)
style.element.insertBefore(textNode, nodes[index]);
else
style.element.appendChild(textNode);
}
}
}
/* script */
const __vue_script__ = script;
/* template */
var __vue_render__ = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c(
"div",
[
_c(
"span",
{
on: {
click: function ($event) {
_vm.visible = true;
},
},
},
[
_vm._t("default", function () {
return [_c("a-button", [_vm._v("自定义列")])]
}),
],
2
),
_vm._v(" "),
_c(
"a-modal",
{
attrs: {
visible: _vm.visible,
title: "自定义列",
width: "1000px",
maskClosable: false,
},
on: { cancel: _vm.close },
},
[
_c(
"div",
{ staticClass: "search-panel" },
[
_c("a-input-search", {
staticStyle: { width: "260px" },
attrs: { allowClear: "", placeholder: "搜索列名" },
on: { change: _vm.onSearch },
model: {
value: _vm.keyWord,
callback: function ($$v) {
_vm.keyWord = $$v;
},
expression: "keyWord",
},
}),
],
1
),
_vm._v(" "),
_c(
"div",
{ staticClass: "custom-report-columns columns-action-panel" },
[
_c(
"div",
{ staticClass: "left-contents" },
[
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.keyWord,
expression: "keyWord",
},
],
},
[
_c(
"a-row",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.filterList.length > 0,
expression: "filterList.length > 0",
},
],
},
_vm._l(_vm.filterList, function (ref) {
var title = ref.title;
var dataIndex = ref.dataIndex;
var groupKey = ref.groupKey;
var disabled = ref.disabled;
return _c(
"a-col",
{
key: dataIndex,
staticClass: "col-item",
attrs: { span: 12 },
},
[
_c(
"a-checkbox",
{
attrs: {
value: dataIndex,
checked: _vm.checkedPropMap[dataIndex],
disabled: disabled,
},
on: {
change: function (e) {
return _vm.handleSearchItemChecked(e, {
dataIndex: dataIndex,
groupKey: groupKey,
})
},
},
},
[
_vm._v(
"\r\n " +
_vm._s(title) +
"\r\n "
),
]
),
],
1
)
}),
1
),
_vm._v(" "),
_c(
"p",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.filterList.length < 1,
expression: "filterList.length < 1",
},
],
staticClass: "empty-list",
},
[
_vm._v(
_vm._s(
_vm.filtering ? "数据匹配中..." : "未匹配到数据"
)
),
]
),
],
1
),
_vm._v(" "),
_c(
"a-tabs",
{
directives: [
{
name: "show",
rawName: "v-show",
value: !_vm.keyWord,
expression: "!keyWord",
},
],
attrs: {
"default-active-key": _vm.defaultTab,
size: "small",
tabBarStyle: { padding: 0 },
},
},
_vm._l(_vm.validColumnsGroup, function (ref) {
var groupKey = ref.groupKey;
var groupName = ref.groupName;
var list = ref.list;
return _c(
"a-tabPane",
{ key: groupKey, attrs: { tab: groupName } },
[
_vm.groupValueData[groupKey]
? _c(
"div",
{ staticClass: "checkbox-list-wrapper" },
[
list && list.length > 0
? _c(
"a-row",
[
_c(
"a-col",
{
staticClass: "col-item",
attrs: { span: 24 },
},
[
_c(
"a-checkbox",
{
attrs: {
indeterminate:
_vm.groupValueData[
groupKey
].indeterminate,
checked:
_vm.groupValueData[
groupKey
].checkedAll,
},
on: {
change: function (e) {
return _vm.onSelectAllChange(
e,
groupKey
)
},
},
},
[
_vm._v(
"\r\n 全部\r\n "
),
]
),
],
1
),
],
1
)
: _c(
"a-row",
{ staticClass: "empty-txt" },
[_vm._v("暂无可选指标")]
),
_vm._v(" "),
_c(
"a-checkbox-group",
{
on: {
change: function (v) {
return _vm.updateCheckedKey(
groupKey,
v
)
},
},
model: {
value:
_vm.groupValueData[groupKey]
.checkedKeys,
callback: function ($$v) {
_vm.$set(
_vm.groupValueData[groupKey],
"checkedKeys",
$$v
);
},
expression:
"groupValueData[groupKey].checkedKeys",
},
},
[
_c(
"a-row",
_vm._l(list, function (item) {
return _c(
"a-col",
{
key: item.dataIndex,
staticClass: "col-item",
attrs: { span: 12 },
},
[
_c(
"a-checkbox",
{
attrs: {
value: item.dataIndex,
disabled: item.disabled,
},
},
[
_c(
"span",
{
staticClass:
"ellipsis-label",
attrs: {
title: item.title,
},
},
[_vm._v(_vm._s(item.title))]
),
]
),
],
1
)
}),
1
),
],
1
),
],
1
)
: _vm._e(),
]
)
}),
1
),
],
1
),
_vm._v(" "),
_c("div", { staticClass: "right-contents" }, [
_c("div", { staticClass: "header-row" }, [
_c("div", { staticClass: "label-text" }, [
_vm._v(
"已选指标(" + _vm._s(_vm.checkedColumns.length) + ")"
),
]),
_vm._v(" "),
_c(
"div",
{
staticClass: "label-text active",
on: { click: _vm.recoverySelect },
},
[_vm._v("恢复初始")]
),
]),
_vm._v(" "),
_c(
"div",
{ staticClass: "inner-row" },
_vm._l(_vm.checkedColumns, function (ref) {
var dataIndex = ref.dataIndex;
var title = ref.title;
var disabled = ref.disabled;
var groupKey = ref.groupKey;
return _c(
"div",
{ key: dataIndex, staticClass: "select-column-info" },
[
_c(
"div",
{
staticClass: "title-text",
attrs: { title: title },
},
[_vm._v(_vm._s(title))]
),
_vm._v(" "),
_c(
"a-button",
{
directives: [
{
name: "show",
rawName: "v-show",
value: !disabled,
expression: "!disabled",
},
],
staticClass: "c-delete-btn",
attrs: { type: "link" },
on: {
click: function ($event) {
return _vm.deleteSelectColunm(
dataIndex,
groupKey
)
},
},
},
[_c("span", { staticClass: "delete-icon" })]
),
],
1
)
}),
0
),
]),
]
),
_vm._v(" "),
_c(
"template",
{ slot: "footer" },
[
_c("a-button", { key: "back", on: { click: _vm.close } }, [
_vm._v("取消"),
]),
_vm._v(" "),
_c(
"a-button",
{
key: "submit",
attrs: { type: "primary" },
on: { click: _vm.handleApply },
},
[_vm._v("应用")]
),
],
1
),
],
2
),
],
1
)
};
var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */
const __vue_inject_styles__ = function (inject) {
if (!inject) return
inject("data-v-ba82a822_0", { source: ".search-panel[data-v-ba82a822] {\n padding-bottom: 8px;\n}\n.columns-action-panel[data-v-ba82a822] {\n display: flex;\n color: rgba(0, 0, 0, 0.65);\n}\n.left-contents[data-v-ba82a822] {\n width: 75%;\n padding: 4px 16px 0px;\n border: 1px solid #D9D9D9;\n border-radius: 2px;\n flex: 1;\n}\n.left-contents .col-item[data-v-ba82a822] {\n line-height: 30px;\n height: 30px;\n vertical-align: middle;\n}\n.checkbox-list-wrapper[data-v-ba82a822] {\n overflow-y: auto;\n height: 300px;\n}\n.checkbox-list-wrapper .ant-checkbox-group[data-v-ba82a822] {\n width: 100%;\n}\n.right-contents[data-v-ba82a822] {\n width: 25%;\n padding: 4px 16px 0px;\n margin-left: 10px;\n border: 1px solid #D9D9D9;\n}\n.right-contents .header-row[data-v-ba82a822] {\n display: flex;\n justify-content: space-between;\n line-height: 37px;\n font-size: 14px;\n font-weight: 400;\n border-bottom: 1px solid #D9D9D9;\n}\n.right-contents .header-row .label-text.active[data-v-ba82a822] {\n cursor: pointer;\n color: #00A64D;\n}\n.right-contents .inner-row[data-v-ba82a822] {\n overflow-y: auto;\n height: 300px;\n}\n.right-contents .inner-row .select-column-info[data-v-ba82a822] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n line-height: 32px;\n height: 32px;\n font-size: 12px;\n padding: 0px 5px;\n}\n.right-contents .inner-row .select-column-info[data-v-ba82a822]:hover {\n background-color: #FAFAFA;\n}\n.right-contents .inner-row .select-column-info .title-text[data-v-ba82a822] {\n font-weight: 400;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.empty-list[data-v-ba82a822] {\n padding: 20px;\n text-align: center;\n color: rgba(0, 0, 0, 0.45);\n}\n", map: {"version":3,"sources":["columns_setter_modal.vue"],"names":[],"mappings":"AAAA;EACE,mBAAmB;AACrB;AACA;EACE,aAAa;EACb,0BAA0B;AAC5B;AACA;EACE,UAAU;EACV,qBAAqB;EACrB,yBAAyB;EACzB,kBAAkB;EAClB,OAAO;AACT;AACA;EACE,iBAAiB;EACjB,YAAY;EACZ,sBAAsB;AACxB;AACA;EACE,gBAAgB;EAChB,aAAa;AACf;AACA;EACE,WAAW;AACb;AACA;EACE,UAAU;EACV,qBAAqB;EACrB,iBAAiB;EACjB,yBAAyB;AAC3B;AACA;EACE,aAAa;EACb,8BAA8B;EAC9B,iBAAiB;EACjB,eAAe;EACf,gBAAgB;EAChB,gCAAgC;AAClC;AACA;EACE,eAAe;EACf,cAAc;AAChB;AACA;EACE,gBAAgB;EAChB,aAAa;AACf;AACA;EACE,aAAa;EACb,8BAA8B;EAC9B,mBAAmB;EACnB,iBAAiB;EACjB,YAAY;EACZ,eAAe;EACf,gBAAgB;AAClB;AACA;EACE,yBAAyB;AAC3B;AACA;EACE,gBAAgB;EAChB,mBAAmB;EACnB,uBAAuB;EACvB,gBAAgB;AAClB;AACA;EACE,aAAa;EACb,kBAAkB;EAClB,0BAA0B;AAC5B","file":"columns_setter_modal.vue","sourcesContent":[".search-panel {\n padding-bottom: 8px;\n}\n.columns-action-panel {\n display: flex;\n color: rgba(0, 0, 0, 0.65);\n}\n.left-contents {\n width: 75%;\n padding: 4px 16px 0px;\n border: 1px solid #D9D9D9;\n border-radius: 2px;\n flex: 1;\n}\n.left-contents .col-item {\n line-height: 30px;\n height: 30px;\n vertical-align: middle;\n}\n.checkbox-list-wrapper {\n overflow-y: auto;\n height: 300px;\n}\n.checkbox-list-wrapper .ant-checkbox-group {\n width: 100%;\n}\n.right-contents {\n width: 25%;\n padding: 4px 16px 0px;\n margin-left: 10px;\n border: 1px solid #D9D9D9;\n}\n.right-contents .header-row {\n display: flex;\n justify-content: space-between;\n line-height: 37px;\n font-size: 14px;\n font-weight: 400;\n border-bottom: 1px solid #D9D9D9;\n}\n.right-contents .header-row .label-text.active {\n cursor: pointer;\n color: #00A64D;\n}\n.right-contents .inner-row {\n overflow-y: auto;\n height: 300px;\n}\n.right-contents .inner-row .select-column-info {\n display: flex;\n justify-content: space-between;\n align-items: center;\n line-height: 32px;\n height: 32px;\n font-size: 12px;\n padding: 0px 5px;\n}\n.right-contents .inner-row .select-column-info:hover {\n background-color: #FAFAFA;\n}\n.right-contents .inner-row .select-column-info .title-text {\n font-weight: 400;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.empty-list {\n padding: 20px;\n text-align: center;\n color: rgba(0, 0, 0, 0.45);\n}\n"]}, media: undefined })
,inject("data-v-ba82a822_1", { source: ".custom-report-columns ::-webkit-scrollbar-track-piece {\n background-color: transparent;\n}\n.custom-report-columns ::-webkit-scrollbar {\n width: 9px;\n height: 9px;\n}\n.custom-report-columns ::-webkit-scrollbar-thumb {\n background-color: #DDDDDD;\n border-radius: 4px;\n background-clip: padding-box;\n min-width: 28px;\n}\n.custom-report-columns ::-webkit-scrollbar-thumb:hover {\n background-color: #ccc;\n}\n.custom-report-columns .ant-tabs .ant-tabs-small-bar .ant-tabs-tab {\n padding: 8px 0;\n}\n.custom-report-columns .c-delete-btn {\n padding-right: 0;\n}\n.custom-report-columns .c-delete-btn:hover .delete-icon {\n background-image: url(../assets/delete-icon-active.png);\n}\n.custom-report-columns .delete-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n background-image: url(../assets/delete-icon.png);\n background-size: 100% 100%;\n cursor: pointer;\n transform: translateY(10%);\n}\n.custom-report-columns .empty-txt {\n padding-top: 20px;\n text-align: center;\n color: rgba(0, 0, 0, 0.45);\n}\n.custom-report-columns .ant-checkbox-wrapper {\n overflow: hidden;\n width: 100%;\n}\n.custom-report-columns .ant-checkbox + span {\n width: 90%;\n overflow: hidden;\n display: inline-block;\n vertical-align: middle;\n position: relative;\n top: -0.09em;\n}\n.custom-report-columns .ellipsis-label {\n width: 100%;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n display: block;\n}\n", map: {"version":3,"sources":["columns_setter_modal.vue"],"names":[],"mappings":"AAAA;EACE,6BAA6B;AAC/B;AACA;EACE,UAAU;EACV,WAAW;AACb;AACA;EACE,yBAAyB;EACzB,kBAAkB;EAClB,4BAA4B;EAC5B,eAAe;AACjB;AACA;EACE,sBAAsB;AACxB;AACA;EACE,cAAc;AAChB;AACA;EACE,gBAAgB;AAClB;AACA;EACE,uDAAuD;AACzD;AACA;EACE,qBAAqB;EACrB,WAAW;EACX,YAAY;EACZ,gDAAgD;EAChD,0BAA0B;EAC1B,eAAe;EACf,0BAA0B;AAC5B;AACA;EACE,iBAAiB;EACjB,kBAAkB;EAClB,0BAA0B;AAC5B;AACA;EACE,gBAAgB;EAChB,WAAW;AACb;AACA;EACE,UAAU;EACV,gBAAgB;EAChB,qBAAqB;EACrB,sBAAsB;EACtB,kBAAkB;EAClB,YAAY;AACd;AACA;EACE,WAAW;EACX,mBAAmB;EACnB,uBAAuB;EACvB,gBAAgB;EAChB,cAAc;AAChB","file":"columns_setter_modal.vue","sourcesContent":[".custom-report-columns ::-webkit-scrollbar-track-piece {\n background-color: transparent;\n}\n.custom-report-columns ::-webkit-scrollbar {\n width: 9px;\n height: 9px;\n}\n.custom-report-columns ::-webkit-scrollbar-thumb {\n background-color: #DDDDDD;\n border-radius: 4px;\n background-clip: padding-box;\n min-width: 28px;\n}\n.custom-report-columns ::-webkit-scrollbar-thumb:hover {\n background-color: #ccc;\n}\n.custom-report-columns .ant-tabs .ant-tabs-small-bar .ant-tabs-tab {\n padding: 8px 0;\n}\n.custom-report-columns .c-delete-btn {\n padding-right: 0;\n}\n.custom-report-columns .c-delete-btn:hover .delete-icon {\n background-image: url(../assets/delete-icon-active.png);\n}\n.custom-report-columns .delete-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n background-image: url(../assets/delete-icon.png);\n background-size: 100% 100%;\n cursor: pointer;\n transform: translateY(10%);\n}\n.custom-report-columns .empty-txt {\n padding-top: 20px;\n text-align: center;\n color: rgba(0, 0, 0, 0.45);\n}\n.custom-report-columns .ant-checkbox-wrapper {\n overflow: hidden;\n width: 100%;\n}\n.custom-report-columns .ant-checkbox + span {\n width: 90%;\n overflow: hidden;\n display: inline-block;\n vertical-align: middle;\n position: relative;\n top: -0.09em;\n}\n.custom-report-columns .ellipsis-label {\n width: 100%;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n display: block;\n}\n"]}, media: undefined });
};
/* scoped */
const __vue_scope_id__ = "data-v-ba82a822";
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = false;
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__ = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
false,
createInjector,
undefined,
undefined
);
// Copy from vite/src/client/vueJsxCompat.ts
const slice = Array.prototype.slice;
function vueJsxCompat(tag, props = null, children = null) {
if (arguments.length > 3 || vue.isVNode(children)) {
children = slice.call(arguments, 2);
}
return vue.createVNode(tag, props, children);
}
var __defProp$1 = Object.defineProperty;
var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues$1 = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp$1.call(b, prop))
__defNormalProp$1(a, prop, b[prop]);
if (__getOwnPropSymbols$1)
for (var prop of __getOwnPropSymbols$1(b)) {
if (__propIsEnum$1.call(b, prop))
__defNormalProp$1(a, prop, b[prop]);
}
return a;
};
var script$1 = {
props: {
maxFields: {
type: Number,
default: 3
},
fields: {
type: Array,
default: () => []
}
},
data() {
return {
searchForm: this.$form.createForm(this, { name: "searchForm", onValuesChange: (props, values) => this.handleShowCheck(values) }),
loading: false,
openText: "\u5C55\u5F00",
closeText: "\u6536\u8D77",
isCollpase: true,
searchFieldShowMap: {}
};
},
computed: {
baseFieldsNumber() {
return this.maxFields - 1;
},
baseFields() {
return this.fields.slice(0, this.baseFieldsNumber);
},
transitionFields() {
return this.fields.slice(this.baseFieldsNumber);
},
needTransition() {
return this.transitionFields.length > 0;
}
},
watch: {
fields: {
immediate: true,
handler(value) {
(!value || value.length > 0) && this.initConfigData(value);
}
}
},
methods: {
initConfigData(data) {
const { searchFieldShowMap, initialValues } = data.reduce((res, item) => {
const { valueEnum, initialValue, dataIndex, checkShowFn } = item;
if (Array.isArray(valueEnum)) {
item.valueEnum = new Map([...valueEnum]);
}
if (!isEmpty(initialValue)) {
res.initialValues[dataIndex] = initialValue;
}
res.searchFieldShowMap[dataIndex] = {
show: false,
handle: checkShowFn || (() => true)
};
return res;
}, {
searchFieldShowMap: {},
initialValues: {}
});
this.searchFieldShowMap = searchFieldShowMap;
this.handleShowCheck(initialValues);
this.$nextTick(() => {
this.emitQuery();
});
},
handleShowCheck(values) {
values = __spreadValues$1(__spreadValues$1({}, this.searchForm.getFieldsValue()), values);
Object.entries(this.searchFieldShowMap).forEach(([key, { handle }]) => {
this.searchFieldShowMap[key].show = handle(values);
});
},
renderField({ dataIndex: key, dataType, valueEnum, allowClear, valueFormat, disabledDate, initialValue, filterOption, mode, maxTagCount, showArrow }) {
const showSearch = isFunction(filterOption);
if (valueEnum) {
return /* @__PURE__ */ vueJsxCompat("a-select", {
"v-decorator": [[key], { initialValue }],
placeholder: "\u8BF7\u9009\u62E9",
"show-search": showSearch,
filterOption,
allowClear: true,
mode,
maxTagCount,
showArrow: true
}, [...valueEnum].map(([value, label]) => /* @__PURE__ */ vueJsxCompat("a-select-option", {
key: value,
value
}, label)));
} else if (dataType === "date") {
return /* @__PURE__ */ vueJsxCompat("a-date-picker", {
"v-decorator": [[key], { initialValue }],
valueFormat: valueFormat || "YYYY-MM-DD",
allowClear,
disabledDate,
style: "display: block"
});
} else if (dataType === "dateRange") {
return /* @__PURE__ */ vueJsxCompat("a-range-picker", {
"v-decorator": [[key], { initialValue }],
valueFormat: valueFormat || "YYYY-MM-DD",
allowClear,
disabledDate,
style: "display: block"