-
-
-
\ No newline at end of file
diff --git a/public/static/plugs/lay-module/propertyInput/propertyInput.js b/public/static/plugs/lay-module/propertyInput/propertyInput.js
index 11398b7..279c8b2 100644
--- a/public/static/plugs/lay-module/propertyInput/propertyInput.js
+++ b/public/static/plugs/lay-module/propertyInput/propertyInput.js
@@ -37,6 +37,77 @@
options.value = $.trim(options.value);
+ // 处理field参数
+ // 如果是字符串，则转为json
+ if (typeof options.field === 'string') {
+ try {
+ options.field = JSON.parse(options.field);
+ } catch (e) {
+ try {
+ options.field = eval('(' + options.field + ')');
+ } catch (e) {
+ options.field = [];
+ }
+ }
+ }
+
+ // 如果没有定义，则初始化
+ if (!options.field) {
+ options.field = [
+ {
+ key: 'name',
+ title: '名称'
+ },
+ {
+ key: 'value',
+ title: '数据'
+ }
+ ];
+ } else {
+ // 如果是对象，则转成数组
+ if (typeof options.field === 'object' && !Array.isArray(options.field)) {
+ var field = [];
+ for (var key in options.field) {
+ field.push({
+ key: key,
+ title: options.field[key]
+ });
+ }
+ options.field = field;
+ } else if (!Array.isArray(options.field) || options.field.length < 1) {
+ // 如果field不符合规则，则初始化
+ options.field = [
+ {
+ key: 'name',
+ title: '名称'
+ },
+ {
+ key: 'value',
+ title: '数据'
+ }
+ ];
+ }
+ }
+
+ // 如果field没有key或title，则初始化
+ for (var i = 0; i < options.field.length; i++) {
+ if (!options.field[i].key) {
+ options.field[i].key = 'name';
+ }
+ if (!options.field[i].title) {
+ options.field[i].title = '名称';
+ }
+ }
+
+ // 处理value参数
+ // 如果是字符串，则转为json
+ if (typeof options.value === 'string') {
+ try {
+ options.value = JSON.parse(options.value);
+ } catch (e) {
+ options.value = [];
+ }
+ }
app = new Vue({
el: elem,
@@ -45,31 +116,16 @@
setting: options,
value: '',
listItem: [
- {
- name: '',
- value: ''
- }
+
],
- originalValue: ''
+ originalValue: '',
+ field: options.field
};
},
- watch: {
- listItem: {
- handler(newValue, oldValue) {
- // 在这里标记页面编辑状态
- this.value = JSON.stringify(newValue);
- },
- // 通过指定deep属性为true, watch会监听对象里面每一个值的变化
- deep: true
- }
- },
created() {
if (this.setting.value) {
- this.originalValue = this.setting.value;
- if (typeof this.setting.value === 'string') {
- this.setting.value = JSON.parse(this.setting.value);
- }
+ this.originalValue = $.extend(true, [], this.setting.value);
this.listItem = this.setting.value;
this.value = this.setting.value;
}
@@ -84,44 +140,25 @@
methods: {
onResetItem() {
- if (typeof this.originalValue === 'string') {
- this.listItem = JSON.parse(this.originalValue);
- } else {
- this.listItem = this.originalValue;
- }
+ this.listItem = $.extend(true, [], this.originalValue);
},
removeItem(item, index) {
- this.listTag.splice(index, 1);
+ this.listItem.splice(index, 1);
},
onAddItem() {
- this.listItem.push({
- name: '',
- value: ''
- });
- },
- onItemNameChange(item, index, event) {
- this.listItem[index].name = event.target.value;
- },
- onItemValueChange(item, index, event) {
- this.listItem[index].value = event.target.value;
- },
- onItemMoveUp(item, index) {
- var arr = this.listItem;
- if (index != 0) {
- arr[index] = arr.splice(index - 1, 1, arr[index])[0];
- } else {
- arr.push(arr.shift());
- }
- },
- onItemMoveDown(item, index) {
- var arr = this.listItem;
- if (index != arr.length - 1) {
- arr[index] = arr.splice(index + 1, 1, arr[index])[0];
- } else {
- arr.unshift(arr.splice(index, 1)[0]);
+ var emptyItem = {};
+
+ for (var i = 0; i < this.field.length; i++) {
+ emptyItem[this.field[i].key] = '';
}
+ this.listItem.push(emptyItem);
+ },
+ onItemChange(item, index, itemField, event) {
+ this.listItem[index][itemField.key] = event.target.value;
+
+ this.updateValue(this.listItem);
},
onItemDelete(item, index) {
if (this.listItem.length <= 1) {
@@ -135,6 +172,9 @@
this.listItem.splice(index, 1);
}
},
+ updateValue(newValue) {
+ this.value = JSON.stringify(newValue);
+ }
}
});
diff --git a/public/static/plugs/lay-module/propertyInput/propertyInput.scss b/public/static/plugs/lay-module/propertyInput/propertyInput.scss
index 0e8d6a7..1a97d9c 100644
--- a/public/static/plugs/lay-module/propertyInput/propertyInput.scss
+++ b/public/static/plugs/lay-module/propertyInput/propertyInput.scss
@@ -1,12 +1,11 @@
.property-input-container {
-
.input-item {
- display : flex;
- align-items : center;
- justify-content: flex-start;
-
.input-value {
min-width: 240px;
}
+
+ .input-option{
+ white-space: nowrap;
+ }
}
}
\ No newline at end of file