cms-chenhj-ui 2.0.15 → 2.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cms-chenhj-ui.common.js +268 -281
- package/cms-chenhj-ui.common.js.map +1 -1
- package/cms-chenhj-ui.css +1 -1
- package/cms-chenhj-ui.umd.js +268 -281
- package/cms-chenhj-ui.umd.js.map +1 -1
- package/cms-chenhj-ui.umd.min.js +2 -2
- package/cms-chenhj-ui.umd.min.js.map +1 -1
- package/package.json +1 -1
package/cms-chenhj-ui.common.js
CHANGED
|
@@ -9559,8 +9559,8 @@ var map = {
|
|
|
9559
9559
|
"./cms-column-card/index": 5340,
|
|
9560
9560
|
"./cms-column-card/index.js": 5340,
|
|
9561
9561
|
"./cms-column/": 3923,
|
|
9562
|
-
"./cms-column/View":
|
|
9563
|
-
"./cms-column/View.vue":
|
|
9562
|
+
"./cms-column/View": 2802,
|
|
9563
|
+
"./cms-column/View.vue": 2802,
|
|
9564
9564
|
"./cms-column/index": 3923,
|
|
9565
9565
|
"./cms-column/index.js": 3923,
|
|
9566
9566
|
"./cms-description": 1921,
|
|
@@ -25019,6 +25019,270 @@ var POLYFILL = isForced.POLYFILL = 'P';
|
|
|
25019
25019
|
module.exports = isForced;
|
|
25020
25020
|
|
|
25021
25021
|
|
|
25022
|
+
/***/ }),
|
|
25023
|
+
|
|
25024
|
+
/***/ 2802:
|
|
25025
|
+
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
25026
|
+
|
|
25027
|
+
"use strict";
|
|
25028
|
+
// ESM COMPAT FLAG
|
|
25029
|
+
__webpack_require__.r(__webpack_exports__);
|
|
25030
|
+
|
|
25031
|
+
// EXPORTS
|
|
25032
|
+
__webpack_require__.d(__webpack_exports__, {
|
|
25033
|
+
"default": function() { return /* binding */ View; }
|
|
25034
|
+
});
|
|
25035
|
+
|
|
25036
|
+
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-41.use!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=template&id=f2ba72e8&scoped=true
|
|
25037
|
+
var render = function render() {
|
|
25038
|
+
var _vm = this,
|
|
25039
|
+
_c = _vm._self._c;
|
|
25040
|
+
return _c('BaseComp', _vm._b({
|
|
25041
|
+
attrs: {
|
|
25042
|
+
"data": _vm.data,
|
|
25043
|
+
"nowCompId": _vm.nowCompId,
|
|
25044
|
+
"isOpcacity": _vm.isOpcacity,
|
|
25045
|
+
"isMask": false,
|
|
25046
|
+
"lang": _vm.lang
|
|
25047
|
+
},
|
|
25048
|
+
on: {
|
|
25049
|
+
"getConfigData": _vm.getConfigData
|
|
25050
|
+
},
|
|
25051
|
+
scopedSlots: _vm._u([{
|
|
25052
|
+
key: "default",
|
|
25053
|
+
fn: function (slotProps) {
|
|
25054
|
+
return [_c('section', {
|
|
25055
|
+
class: (_vm.configData.widthType === 'full' ? 'width-full' : 'cmhk-home_main', {
|
|
25056
|
+
hoverBorderClass: _vm.isConfigPage
|
|
25057
|
+
}),
|
|
25058
|
+
style: _vm.containerStyle
|
|
25059
|
+
}, [_c('div', {
|
|
25060
|
+
staticClass: "column-setting",
|
|
25061
|
+
class: [`layout-${_vm.configData.layoutType || 'default'}`, `${slotProps.isMobile && _vm.configData.mobileLayout === 'vertical' ? 'mobile-vertical' : 'mobile-horizontal'}`],
|
|
25062
|
+
style: _vm.columnStyle
|
|
25063
|
+
}, _vm._l(_vm.data.childList, function (item, index) {
|
|
25064
|
+
return _c('cms-column-card', _vm._b({
|
|
25065
|
+
key: item.componentId,
|
|
25066
|
+
class: _vm.getColumnItemClass(index),
|
|
25067
|
+
style: _vm.getColumnItemStyle(index),
|
|
25068
|
+
attrs: {
|
|
25069
|
+
"data": item,
|
|
25070
|
+
"nowCompId": _vm.nowCompId,
|
|
25071
|
+
"isOpcacity": _vm.isOpcacity,
|
|
25072
|
+
"isMask": false,
|
|
25073
|
+
"lang": _vm.lang,
|
|
25074
|
+
"isMobile": slotProps.isMobile,
|
|
25075
|
+
"mobileLayout": _vm.configData.mobileLayout
|
|
25076
|
+
}
|
|
25077
|
+
}, 'cms-column-card', _vm.$attrs, false));
|
|
25078
|
+
}), 1)])];
|
|
25079
|
+
}
|
|
25080
|
+
}])
|
|
25081
|
+
}, 'BaseComp', _vm.$attrs, false));
|
|
25082
|
+
};
|
|
25083
|
+
var staticRenderFns = [];
|
|
25084
|
+
|
|
25085
|
+
// EXTERNAL MODULE: ./package/baseComp.vue + 5 modules
|
|
25086
|
+
var baseComp = __webpack_require__(5298);
|
|
25087
|
+
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-41.use!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=script&lang=js
|
|
25088
|
+
|
|
25089
|
+
/* harmony default export */ var Viewvue_type_script_lang_js = ({
|
|
25090
|
+
name: "cms-column",
|
|
25091
|
+
components: {
|
|
25092
|
+
BaseComp: baseComp["default"]
|
|
25093
|
+
},
|
|
25094
|
+
props: {
|
|
25095
|
+
data: {
|
|
25096
|
+
type: Object,
|
|
25097
|
+
default: () => {
|
|
25098
|
+
return {};
|
|
25099
|
+
}
|
|
25100
|
+
},
|
|
25101
|
+
nowCompId: {
|
|
25102
|
+
type: [String, Number],
|
|
25103
|
+
default: ""
|
|
25104
|
+
},
|
|
25105
|
+
isOpcacity: {
|
|
25106
|
+
type: Boolean,
|
|
25107
|
+
default: true
|
|
25108
|
+
},
|
|
25109
|
+
lang: {
|
|
25110
|
+
type: String,
|
|
25111
|
+
default: "zh-HK"
|
|
25112
|
+
}
|
|
25113
|
+
},
|
|
25114
|
+
data() {
|
|
25115
|
+
return {
|
|
25116
|
+
configData: {},
|
|
25117
|
+
messFold: true,
|
|
25118
|
+
// 默认配置数据
|
|
25119
|
+
defaultConfig: {
|
|
25120
|
+
layoutType: "100",
|
|
25121
|
+
heightType: "auto",
|
|
25122
|
+
widthType: "auto",
|
|
25123
|
+
mobileLayout: "vertical",
|
|
25124
|
+
fixedHeight: 300,
|
|
25125
|
+
borderWidth: 0,
|
|
25126
|
+
borderStyle: "solid",
|
|
25127
|
+
borderColor: "",
|
|
25128
|
+
backgroundColor: "#FFF",
|
|
25129
|
+
backgroundImage: "",
|
|
25130
|
+
boxShadow: "",
|
|
25131
|
+
borderRadius: 0,
|
|
25132
|
+
columnGap: 0,
|
|
25133
|
+
rowGap: 0,
|
|
25134
|
+
title: "",
|
|
25135
|
+
description: "",
|
|
25136
|
+
input1: "",
|
|
25137
|
+
showTitle: true,
|
|
25138
|
+
showDescription: true,
|
|
25139
|
+
animationDuration: 300,
|
|
25140
|
+
responsiveBreakpoint: 768
|
|
25141
|
+
}
|
|
25142
|
+
};
|
|
25143
|
+
},
|
|
25144
|
+
mounted() {},
|
|
25145
|
+
watch: {
|
|
25146
|
+
configData: {
|
|
25147
|
+
handler() {
|
|
25148
|
+
this.updateStyles();
|
|
25149
|
+
},
|
|
25150
|
+
immediate: true,
|
|
25151
|
+
deep: true
|
|
25152
|
+
}
|
|
25153
|
+
},
|
|
25154
|
+
computed: {
|
|
25155
|
+
isConfigPage() {
|
|
25156
|
+
return this.$EventBus && this.isOpcacity;
|
|
25157
|
+
},
|
|
25158
|
+
// 容器样式
|
|
25159
|
+
containerStyle() {
|
|
25160
|
+
return {
|
|
25161
|
+
backgroundColor: this.configData.backgroundColor || this.defaultConfig.backgroundColor,
|
|
25162
|
+
backgroundImage: this.configData.backgroundImage ? `url(${this.configData.backgroundImage})` : "",
|
|
25163
|
+
backgroundSize: "cover",
|
|
25164
|
+
backgroundRepeat: "no-repeat",
|
|
25165
|
+
backgroundPosition: "center center",
|
|
25166
|
+
boxShadow: this.configData.boxShadow || this.defaultConfig.boxShadow,
|
|
25167
|
+
borderRadius: `${this.configData.borderRadius || this.defaultConfig.borderRadius}px`,
|
|
25168
|
+
minHeight: this.configData.heightType === "fixed" ? `${this.configData.fixedHeight}px` : "auto"
|
|
25169
|
+
};
|
|
25170
|
+
},
|
|
25171
|
+
// 分栏容器样式
|
|
25172
|
+
columnStyle() {
|
|
25173
|
+
// const gap = this.configData.rowGap || this.defaultConfig.rowGap;
|
|
25174
|
+
return {
|
|
25175
|
+
// gap: `${gap}px`,
|
|
25176
|
+
border: this.configData.borderWidth ? `${this.configData.borderWidth}px ${this.configData.borderStyle} ${this.configData.borderColor}` : "none"
|
|
25177
|
+
};
|
|
25178
|
+
}
|
|
25179
|
+
},
|
|
25180
|
+
methods: {
|
|
25181
|
+
// 获取配置数据
|
|
25182
|
+
getConfigData(configData) {
|
|
25183
|
+
this.configData = configData;
|
|
25184
|
+
this.updateStyles();
|
|
25185
|
+
},
|
|
25186
|
+
// 更新样式
|
|
25187
|
+
updateStyles() {
|
|
25188
|
+
this.$nextTick(() => {
|
|
25189
|
+
// 触发样式更新
|
|
25190
|
+
this.$forceUpdate();
|
|
25191
|
+
});
|
|
25192
|
+
},
|
|
25193
|
+
// 获取分栏项的类名
|
|
25194
|
+
getColumnItemClass(index) {
|
|
25195
|
+
const layoutType = this.configData.layoutType || this.defaultConfig.layoutType;
|
|
25196
|
+
return ["column-item", `column-item-${index}`, `layout-${layoutType}`, {
|
|
25197
|
+
"min-h": this.$EventBus && this.isOpcacity,
|
|
25198
|
+
"first-item": index === 0,
|
|
25199
|
+
"last-item": index === this.data.childList.length - 1
|
|
25200
|
+
}];
|
|
25201
|
+
},
|
|
25202
|
+
// 获取分栏项的样式
|
|
25203
|
+
getColumnItemStyle(index) {
|
|
25204
|
+
const layoutType = this.configData.layoutType || this.defaultConfig.layoutType;
|
|
25205
|
+
const gap = this.configData.rowGap || this.defaultConfig.rowGap;
|
|
25206
|
+
let flexBasis = "100%";
|
|
25207
|
+
let marginRight = "0";
|
|
25208
|
+
|
|
25209
|
+
// 根据布局类型设置宽度
|
|
25210
|
+
switch (layoutType) {
|
|
25211
|
+
case "50-50":
|
|
25212
|
+
flexBasis = `calc(50% - ${gap / 2}px)`;
|
|
25213
|
+
marginRight = index % 2 === 0 ? `${gap}px` : "0";
|
|
25214
|
+
break;
|
|
25215
|
+
case "33-66":
|
|
25216
|
+
flexBasis = index === 0 ? `calc(33.33% - ${gap / 2}px)` : `calc(66.67% - ${gap / 2}px)`;
|
|
25217
|
+
marginRight = index === 0 ? `${gap}px` : "0";
|
|
25218
|
+
break;
|
|
25219
|
+
case "66-33":
|
|
25220
|
+
flexBasis = index === 0 ? `calc(66.67% - ${gap / 2}px)` : `calc(33.33% - ${gap / 2}px)`;
|
|
25221
|
+
marginRight = index === 0 ? `${gap}px` : "0";
|
|
25222
|
+
break;
|
|
25223
|
+
case "33-33-33":
|
|
25224
|
+
flexBasis = `calc(33.33% - ${gap * 2 / 3}px)`;
|
|
25225
|
+
marginRight = index < 2 ? `${gap}px` : "0";
|
|
25226
|
+
break;
|
|
25227
|
+
case "25-50-25":
|
|
25228
|
+
if (index === 0 || index === 2) {
|
|
25229
|
+
flexBasis = `calc(25% - ${gap * 2 / 3}px)`;
|
|
25230
|
+
} else {
|
|
25231
|
+
flexBasis = `calc(50% - ${gap * 2 / 3}px)`;
|
|
25232
|
+
}
|
|
25233
|
+
marginRight = index < 2 ? `${gap}px` : "0";
|
|
25234
|
+
break;
|
|
25235
|
+
default:
|
|
25236
|
+
flexBasis = "100%";
|
|
25237
|
+
}
|
|
25238
|
+
return {
|
|
25239
|
+
flexBasis,
|
|
25240
|
+
marginRight,
|
|
25241
|
+
marginBottom: `${this.configData.columnGap || this.defaultConfig.columnGap}px`
|
|
25242
|
+
};
|
|
25243
|
+
},
|
|
25244
|
+
// 折叠/展开文本
|
|
25245
|
+
foldMessText() {
|
|
25246
|
+
this.messFold = !this.messFold;
|
|
25247
|
+
},
|
|
25248
|
+
// 处理跳转链接
|
|
25249
|
+
decodeJumpUrl(url) {
|
|
25250
|
+
if (!url) return;
|
|
25251
|
+
top.location.href = url;
|
|
25252
|
+
}
|
|
25253
|
+
}
|
|
25254
|
+
});
|
|
25255
|
+
;// ./package/cms-column/View.vue?vue&type=script&lang=js
|
|
25256
|
+
/* harmony default export */ var cms_column_Viewvue_type_script_lang_js = (Viewvue_type_script_lang_js);
|
|
25257
|
+
;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-42.use[0]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=style&index=0&id=f2ba72e8&prod&lang=scss&scoped=true
|
|
25258
|
+
// extracted by mini-css-extract-plugin
|
|
25259
|
+
|
|
25260
|
+
;// ./package/cms-column/View.vue?vue&type=style&index=0&id=f2ba72e8&prod&lang=scss&scoped=true
|
|
25261
|
+
|
|
25262
|
+
// EXTERNAL MODULE: ./node_modules/@vue/vue-loader-v15/lib/runtime/componentNormalizer.js
|
|
25263
|
+
var componentNormalizer = __webpack_require__(1656);
|
|
25264
|
+
;// ./package/cms-column/View.vue
|
|
25265
|
+
|
|
25266
|
+
|
|
25267
|
+
|
|
25268
|
+
;
|
|
25269
|
+
|
|
25270
|
+
|
|
25271
|
+
/* normalize component */
|
|
25272
|
+
|
|
25273
|
+
var component = (0,componentNormalizer/* default */.A)(
|
|
25274
|
+
cms_column_Viewvue_type_script_lang_js,
|
|
25275
|
+
render,
|
|
25276
|
+
staticRenderFns,
|
|
25277
|
+
false,
|
|
25278
|
+
null,
|
|
25279
|
+
"f2ba72e8",
|
|
25280
|
+
null
|
|
25281
|
+
|
|
25282
|
+
)
|
|
25283
|
+
|
|
25284
|
+
/* harmony default export */ var View = (component.exports);
|
|
25285
|
+
|
|
25022
25286
|
/***/ }),
|
|
25023
25287
|
|
|
25024
25288
|
/***/ 2806:
|
|
@@ -26314,7 +26578,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
26314
26578
|
__webpack_require__.r(__webpack_exports__);
|
|
26315
26579
|
/* harmony import */ var _baseConfig__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(649);
|
|
26316
26580
|
|
|
26317
|
-
const View = () => Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__,
|
|
26581
|
+
const View = () => Promise.resolve(/* import() */).then(__webpack_require__.bind(__webpack_require__, 2802));
|
|
26318
26582
|
const langData = {
|
|
26319
26583
|
// 布局配置
|
|
26320
26584
|
layoutType: "100",
|
|
@@ -38040,7 +38304,7 @@ var map = {
|
|
|
38040
38304
|
"./cms-button/View.vue": 2404,
|
|
38041
38305
|
"./cms-cells/View.vue": 5700,
|
|
38042
38306
|
"./cms-column-card/View.vue": 2328,
|
|
38043
|
-
"./cms-column/View.vue":
|
|
38307
|
+
"./cms-column/View.vue": 2802,
|
|
38044
38308
|
"./cms-description/View.vue": 3203,
|
|
38045
38309
|
"./cms-dynamic-comp/View.vue": 1705,
|
|
38046
38310
|
"./cms-iconFour/View.vue": 8235,
|
|
@@ -48780,283 +49044,6 @@ module.exports = function (it) {
|
|
|
48780
49044
|
};
|
|
48781
49045
|
|
|
48782
49046
|
|
|
48783
|
-
/***/ }),
|
|
48784
|
-
|
|
48785
|
-
/***/ 7108:
|
|
48786
|
-
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
|
48787
|
-
|
|
48788
|
-
"use strict";
|
|
48789
|
-
// ESM COMPAT FLAG
|
|
48790
|
-
__webpack_require__.r(__webpack_exports__);
|
|
48791
|
-
|
|
48792
|
-
// EXPORTS
|
|
48793
|
-
__webpack_require__.d(__webpack_exports__, {
|
|
48794
|
-
"default": function() { return /* binding */ View; }
|
|
48795
|
-
});
|
|
48796
|
-
|
|
48797
|
-
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-41.use!./node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[4]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=template&id=cd35c518&scoped=true
|
|
48798
|
-
var render = function render() {
|
|
48799
|
-
var _vm = this,
|
|
48800
|
-
_c = _vm._self._c;
|
|
48801
|
-
return _c('BaseComp', _vm._b({
|
|
48802
|
-
attrs: {
|
|
48803
|
-
"data": _vm.data,
|
|
48804
|
-
"nowCompId": _vm.nowCompId,
|
|
48805
|
-
"isOpcacity": _vm.isOpcacity,
|
|
48806
|
-
"isMask": false,
|
|
48807
|
-
"lang": _vm.lang
|
|
48808
|
-
},
|
|
48809
|
-
on: {
|
|
48810
|
-
"getConfigData": _vm.getConfigData
|
|
48811
|
-
},
|
|
48812
|
-
scopedSlots: _vm._u([{
|
|
48813
|
-
key: "default",
|
|
48814
|
-
fn: function (slotProps) {
|
|
48815
|
-
return [_c('section', {
|
|
48816
|
-
class: (_vm.configData.widthType === 'full' ? 'width-full' : 'cmhk-home_main', {
|
|
48817
|
-
hoverBorderClass: _vm.isConfigPage
|
|
48818
|
-
}),
|
|
48819
|
-
style: _vm.containerStyle
|
|
48820
|
-
}, [_c('div', {
|
|
48821
|
-
staticClass: "column-setting",
|
|
48822
|
-
class: [`layout-${_vm.configData.layoutType || 'default'}`, `${slotProps.isMobile && _vm.configData.mobileLayout === 'vertical' ? 'mobile-vertical' : 'mobile-horizontal'}`],
|
|
48823
|
-
style: _vm.columnStyle
|
|
48824
|
-
}, _vm._l(_vm.data.childList, function (item, index) {
|
|
48825
|
-
return _c('cms-column-card', _vm._b({
|
|
48826
|
-
key: item.componentId,
|
|
48827
|
-
class: _vm.getColumnItemClass(index),
|
|
48828
|
-
style: _vm.getColumnItemStyle(index),
|
|
48829
|
-
attrs: {
|
|
48830
|
-
"data": item,
|
|
48831
|
-
"nowCompId": _vm.nowCompId,
|
|
48832
|
-
"isOpcacity": _vm.isOpcacity,
|
|
48833
|
-
"isMask": false,
|
|
48834
|
-
"lang": _vm.lang,
|
|
48835
|
-
"isMobile": slotProps.isMobile,
|
|
48836
|
-
"mobileLayout": _vm.configData.mobileLayout
|
|
48837
|
-
}
|
|
48838
|
-
}, 'cms-column-card', _vm.$attrs, false));
|
|
48839
|
-
}), 1)])];
|
|
48840
|
-
}
|
|
48841
|
-
}])
|
|
48842
|
-
}, 'BaseComp', _vm.$attrs, false));
|
|
48843
|
-
};
|
|
48844
|
-
var staticRenderFns = [];
|
|
48845
|
-
|
|
48846
|
-
// EXTERNAL MODULE: ./package/baseComp.vue + 5 modules
|
|
48847
|
-
var baseComp = __webpack_require__(5298);
|
|
48848
|
-
;// ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/babel-loader/lib/index.js??clonedRuleSet-41.use!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=script&lang=js
|
|
48849
|
-
|
|
48850
|
-
/* harmony default export */ var Viewvue_type_script_lang_js = ({
|
|
48851
|
-
name: "cms-column",
|
|
48852
|
-
components: {
|
|
48853
|
-
BaseComp: baseComp["default"]
|
|
48854
|
-
},
|
|
48855
|
-
props: {
|
|
48856
|
-
data: {
|
|
48857
|
-
type: Object,
|
|
48858
|
-
default: () => {
|
|
48859
|
-
return {};
|
|
48860
|
-
}
|
|
48861
|
-
},
|
|
48862
|
-
nowCompId: {
|
|
48863
|
-
type: [String, Number],
|
|
48864
|
-
default: ""
|
|
48865
|
-
},
|
|
48866
|
-
isOpcacity: {
|
|
48867
|
-
type: Boolean,
|
|
48868
|
-
default: true
|
|
48869
|
-
},
|
|
48870
|
-
lang: {
|
|
48871
|
-
type: String,
|
|
48872
|
-
default: "zh-HK"
|
|
48873
|
-
}
|
|
48874
|
-
},
|
|
48875
|
-
data() {
|
|
48876
|
-
return {
|
|
48877
|
-
configData: {},
|
|
48878
|
-
messFold: true,
|
|
48879
|
-
// 默认配置数据
|
|
48880
|
-
defaultConfig: {
|
|
48881
|
-
layoutType: "100",
|
|
48882
|
-
heightType: "auto",
|
|
48883
|
-
widthType: "auto",
|
|
48884
|
-
mobileLayout: "vertical",
|
|
48885
|
-
fixedHeight: 300,
|
|
48886
|
-
borderWidth: 0,
|
|
48887
|
-
borderStyle: "solid",
|
|
48888
|
-
borderColor: "",
|
|
48889
|
-
backgroundColor: "#FFF",
|
|
48890
|
-
backgroundImage: "",
|
|
48891
|
-
boxShadow: "",
|
|
48892
|
-
borderRadius: 0,
|
|
48893
|
-
columnGap: 0,
|
|
48894
|
-
rowGap: 0,
|
|
48895
|
-
title: "",
|
|
48896
|
-
description: "",
|
|
48897
|
-
input1: "",
|
|
48898
|
-
showTitle: true,
|
|
48899
|
-
showDescription: true,
|
|
48900
|
-
animationDuration: 300,
|
|
48901
|
-
responsiveBreakpoint: 768
|
|
48902
|
-
}
|
|
48903
|
-
};
|
|
48904
|
-
},
|
|
48905
|
-
mounted() {
|
|
48906
|
-
this.initConfigData();
|
|
48907
|
-
// 添加窗口大小变化监听
|
|
48908
|
-
},
|
|
48909
|
-
watch: {
|
|
48910
|
-
configData: {
|
|
48911
|
-
handler() {
|
|
48912
|
-
this.updateStyles();
|
|
48913
|
-
},
|
|
48914
|
-
deep: true
|
|
48915
|
-
}
|
|
48916
|
-
},
|
|
48917
|
-
computed: {
|
|
48918
|
-
isConfigPage() {
|
|
48919
|
-
return this.$EventBus && this.isOpcacity;
|
|
48920
|
-
},
|
|
48921
|
-
// 容器样式
|
|
48922
|
-
containerStyle() {
|
|
48923
|
-
return {
|
|
48924
|
-
backgroundColor: this.configData.backgroundColor || this.defaultConfig.backgroundColor,
|
|
48925
|
-
backgroundImage: this.configData.backgroundImage ? `url(${this.configData.backgroundImage})` : "",
|
|
48926
|
-
backgroundSize: "cover",
|
|
48927
|
-
backgroundRepeat: "no-repeat",
|
|
48928
|
-
backgroundPosition: "center center",
|
|
48929
|
-
boxShadow: this.configData.boxShadow || this.defaultConfig.boxShadow,
|
|
48930
|
-
borderRadius: `${this.configData.borderRadius || this.defaultConfig.borderRadius}px`,
|
|
48931
|
-
minHeight: this.configData.heightType === "fixed" ? `${this.configData.fixedHeight}px` : "auto"
|
|
48932
|
-
};
|
|
48933
|
-
},
|
|
48934
|
-
// 分栏容器样式
|
|
48935
|
-
columnStyle() {
|
|
48936
|
-
// const gap = this.configData.rowGap || this.defaultConfig.rowGap;
|
|
48937
|
-
return {
|
|
48938
|
-
// gap: `${gap}px`,
|
|
48939
|
-
border: this.configData.borderWidth ? `${this.configData.borderWidth}px ${this.configData.borderStyle} ${this.configData.borderColor}` : "none"
|
|
48940
|
-
};
|
|
48941
|
-
}
|
|
48942
|
-
},
|
|
48943
|
-
methods: {
|
|
48944
|
-
// 初始化配置数据
|
|
48945
|
-
initConfigData() {
|
|
48946
|
-
// 合并默认配置和传入配置
|
|
48947
|
-
this.configData = {
|
|
48948
|
-
...this.defaultConfig,
|
|
48949
|
-
...this.configData
|
|
48950
|
-
};
|
|
48951
|
-
},
|
|
48952
|
-
// 获取配置数据
|
|
48953
|
-
getConfigData(configData) {
|
|
48954
|
-
this.configData = {
|
|
48955
|
-
...this.defaultConfig,
|
|
48956
|
-
...configData
|
|
48957
|
-
};
|
|
48958
|
-
this.updateStyles();
|
|
48959
|
-
},
|
|
48960
|
-
// 更新样式
|
|
48961
|
-
updateStyles() {
|
|
48962
|
-
this.$nextTick(() => {
|
|
48963
|
-
// 触发样式更新
|
|
48964
|
-
this.$forceUpdate();
|
|
48965
|
-
});
|
|
48966
|
-
},
|
|
48967
|
-
// 获取分栏项的类名
|
|
48968
|
-
getColumnItemClass(index) {
|
|
48969
|
-
const layoutType = this.configData.layoutType || this.defaultConfig.layoutType;
|
|
48970
|
-
return ["column-item", `column-item-${index}`, `layout-${layoutType}`, {
|
|
48971
|
-
"min-h": this.$EventBus && this.isOpcacity,
|
|
48972
|
-
"first-item": index === 0,
|
|
48973
|
-
"last-item": index === this.data.childList.length - 1
|
|
48974
|
-
}];
|
|
48975
|
-
},
|
|
48976
|
-
// 获取分栏项的样式
|
|
48977
|
-
getColumnItemStyle(index) {
|
|
48978
|
-
const layoutType = this.configData.layoutType || this.defaultConfig.layoutType;
|
|
48979
|
-
const gap = this.configData.rowGap || this.defaultConfig.rowGap;
|
|
48980
|
-
let flexBasis = "100%";
|
|
48981
|
-
let marginRight = "0";
|
|
48982
|
-
|
|
48983
|
-
// 根据布局类型设置宽度
|
|
48984
|
-
switch (layoutType) {
|
|
48985
|
-
case "50-50":
|
|
48986
|
-
flexBasis = `calc(50% - ${gap / 2}px)`;
|
|
48987
|
-
marginRight = index % 2 === 0 ? `${gap}px` : "0";
|
|
48988
|
-
break;
|
|
48989
|
-
case "33-66":
|
|
48990
|
-
flexBasis = index === 0 ? `calc(33.33% - ${gap / 2}px)` : `calc(66.67% - ${gap / 2}px)`;
|
|
48991
|
-
marginRight = index === 0 ? `${gap}px` : "0";
|
|
48992
|
-
break;
|
|
48993
|
-
case "66-33":
|
|
48994
|
-
flexBasis = index === 0 ? `calc(66.67% - ${gap / 2}px)` : `calc(33.33% - ${gap / 2}px)`;
|
|
48995
|
-
marginRight = index === 0 ? `${gap}px` : "0";
|
|
48996
|
-
break;
|
|
48997
|
-
case "33-33-33":
|
|
48998
|
-
flexBasis = `calc(33.33% - ${gap * 2 / 3}px)`;
|
|
48999
|
-
marginRight = index < 2 ? `${gap}px` : "0";
|
|
49000
|
-
break;
|
|
49001
|
-
case "25-50-25":
|
|
49002
|
-
if (index === 0 || index === 2) {
|
|
49003
|
-
flexBasis = `calc(25% - ${gap * 2 / 3}px)`;
|
|
49004
|
-
} else {
|
|
49005
|
-
flexBasis = `calc(50% - ${gap * 2 / 3}px)`;
|
|
49006
|
-
}
|
|
49007
|
-
marginRight = index < 2 ? `${gap}px` : "0";
|
|
49008
|
-
break;
|
|
49009
|
-
default:
|
|
49010
|
-
flexBasis = "100%";
|
|
49011
|
-
}
|
|
49012
|
-
return {
|
|
49013
|
-
flexBasis,
|
|
49014
|
-
marginRight,
|
|
49015
|
-
marginBottom: `${this.configData.columnGap || this.defaultConfig.columnGap}px`
|
|
49016
|
-
};
|
|
49017
|
-
},
|
|
49018
|
-
// 折叠/展开文本
|
|
49019
|
-
foldMessText() {
|
|
49020
|
-
this.messFold = !this.messFold;
|
|
49021
|
-
},
|
|
49022
|
-
// 处理跳转链接
|
|
49023
|
-
decodeJumpUrl(url) {
|
|
49024
|
-
if (!url) return;
|
|
49025
|
-
top.location.href = url;
|
|
49026
|
-
}
|
|
49027
|
-
}
|
|
49028
|
-
});
|
|
49029
|
-
;// ./package/cms-column/View.vue?vue&type=script&lang=js
|
|
49030
|
-
/* harmony default export */ var cms_column_Viewvue_type_script_lang_js = (Viewvue_type_script_lang_js);
|
|
49031
|
-
;// ./node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-22.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-42.use[0]!./node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./package/cms-column/View.vue?vue&type=style&index=0&id=cd35c518&prod&lang=scss&scoped=true
|
|
49032
|
-
// extracted by mini-css-extract-plugin
|
|
49033
|
-
|
|
49034
|
-
;// ./package/cms-column/View.vue?vue&type=style&index=0&id=cd35c518&prod&lang=scss&scoped=true
|
|
49035
|
-
|
|
49036
|
-
// EXTERNAL MODULE: ./node_modules/@vue/vue-loader-v15/lib/runtime/componentNormalizer.js
|
|
49037
|
-
var componentNormalizer = __webpack_require__(1656);
|
|
49038
|
-
;// ./package/cms-column/View.vue
|
|
49039
|
-
|
|
49040
|
-
|
|
49041
|
-
|
|
49042
|
-
;
|
|
49043
|
-
|
|
49044
|
-
|
|
49045
|
-
/* normalize component */
|
|
49046
|
-
|
|
49047
|
-
var component = (0,componentNormalizer/* default */.A)(
|
|
49048
|
-
cms_column_Viewvue_type_script_lang_js,
|
|
49049
|
-
render,
|
|
49050
|
-
staticRenderFns,
|
|
49051
|
-
false,
|
|
49052
|
-
null,
|
|
49053
|
-
"cd35c518",
|
|
49054
|
-
null
|
|
49055
|
-
|
|
49056
|
-
)
|
|
49057
|
-
|
|
49058
|
-
/* harmony default export */ var View = (component.exports);
|
|
49059
|
-
|
|
49060
49047
|
/***/ }),
|
|
49061
49048
|
|
|
49062
49049
|
/***/ 7197:
|