|
|
@@ -1,4 +1,4 @@
|
|
|
-define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'area','vue', 'ELEMENT', ], function ($, undefined, Backend, Table, Form, Area, Vue, ELEMENT, ) {
|
|
|
+define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'area', 'vue', 'ELEMENT',], function ($, undefined, Backend, Table, Form, Area, Vue, ELEMENT,) {
|
|
|
ELEMENT.install(Vue)
|
|
|
Vue.use(ELEMENT)
|
|
|
var Controller = {
|
|
|
@@ -28,45 +28,47 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'area','vue', 'ELEMEN
|
|
|
fixedRightNumber: 1,
|
|
|
columns: [
|
|
|
[
|
|
|
- {checkbox: true},
|
|
|
- {field: 'id', title: __('Id')},
|
|
|
- {field: 'products.zh_title', title: __('Type_id'), operate: false},
|
|
|
- {field: 'zh_name', title: __('Zh_name'), operate: false,
|
|
|
- formatter : function(value, row, index, field){
|
|
|
+ { checkbox: true },
|
|
|
+ { field: 'id', title: __('Id') },
|
|
|
+ { field: 'products.zh_title', title: __('Type_id'), operate: false },
|
|
|
+ {
|
|
|
+ field: 'zh_name', title: __('Zh_name'), operate: false,
|
|
|
+ formatter: function (value, row, index, field) {
|
|
|
return "<span style='display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;' title='" + row.zh_name + "'>" + value + "</span>";
|
|
|
},
|
|
|
- cellStyle : function(value, row, index, field){
|
|
|
+ cellStyle: function (value, row, index, field) {
|
|
|
return {
|
|
|
css: {
|
|
|
"white-space": "nowrap",
|
|
|
"text-overflow": "ellipsis",
|
|
|
"overflow": "hidden",
|
|
|
- "max-width":"200px"
|
|
|
+ "max-width": "200px"
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
},
|
|
|
- {field: 'en_name', title: __('En_name'), operate: false,
|
|
|
- formatter : function(value, row, index, field){
|
|
|
+ {
|
|
|
+ field: 'en_name', title: __('En_name'), operate: false,
|
|
|
+ formatter: function (value, row, index, field) {
|
|
|
return "<span style='display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;' title='" + row.en_name + "'>" + value + "</span>";
|
|
|
},
|
|
|
- cellStyle : function(value, row, index, field){
|
|
|
+ cellStyle: function (value, row, index, field) {
|
|
|
return {
|
|
|
css: {
|
|
|
"white-space": "nowrap",
|
|
|
"text-overflow": "ellipsis",
|
|
|
"overflow": "hidden",
|
|
|
- "max-width":"200px"
|
|
|
+ "max-width": "200px"
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
},
|
|
|
- {field: 'thum', title: __('Thum'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
|
|
|
- {field: 'weigh', title: __('Weigh'), operate: false},
|
|
|
- {field: 'status', title: __('Status'), searchList: {"1":__('上架'),"0":__('下架')}, formatter: Table.api.formatter.toggle},
|
|
|
- {field: 'create_time', title: __('Create_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
|
|
|
- {field: 'update_time', title: __('Update_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
|
|
|
- {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
|
|
|
+ { field: 'thum', title: __('Thum'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images },
|
|
|
+ { field: 'weigh', title: __('Weigh'), operate: false },
|
|
|
+ { field: 'status', title: __('Status'), searchList: { "1": __('上架'), "0": __('下架') }, formatter: Table.api.formatter.toggle },
|
|
|
+ { field: 'create_time', title: __('Create_time'), operate: 'RANGE', addclass: 'datetimerange', autocomplete: false, formatter: Table.api.formatter.datetime },
|
|
|
+ { field: 'update_time', title: __('Update_time'), operate: 'RANGE', addclass: 'datetimerange', autocomplete: false, formatter: Table.api.formatter.datetime },
|
|
|
+ { field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate }
|
|
|
]
|
|
|
]
|
|
|
});
|
|
|
@@ -75,8 +77,8 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'area','vue', 'ELEMEN
|
|
|
Table.api.bindevent(table);
|
|
|
// 修改添加窗口的大小
|
|
|
$(".btn-add").data("area", ["100%", "100%"]);
|
|
|
- table.on('post-body.bs.table',function () {
|
|
|
- $('.btn-editone').data("area",["100%","100%"]);
|
|
|
+ table.on('post-body.bs.table', function () {
|
|
|
+ $('.btn-editone').data("area", ["100%", "100%"]);
|
|
|
});
|
|
|
},
|
|
|
add: function () {
|
|
|
@@ -90,70 +92,83 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'area','vue', 'ELEMEN
|
|
|
Form.api.bindevent($("form[role=form]"));
|
|
|
Vue.component('treeselect', VueTreeselect.Treeselect)
|
|
|
let areaData = [];
|
|
|
- if((Config.areaData).length > 0) areaData = JSON.parse(Config.areaData);
|
|
|
+ if ((Config.areaData).length > 0) areaData = JSON.parse(Config.areaData);
|
|
|
+
|
|
|
+ let areas = markDisabled(area, areaData)
|
|
|
new Vue({
|
|
|
- el: '#app',
|
|
|
- data(){
|
|
|
- return {
|
|
|
- data: areaData,
|
|
|
- options: area,
|
|
|
- sortValueBy: "ORDER_SELECTED",
|
|
|
- selectedNodes: [],
|
|
|
- }
|
|
|
- },
|
|
|
- methods:{
|
|
|
- handleChange(selectedValues) {
|
|
|
- let ids= []
|
|
|
- let labels= []
|
|
|
- this.selectedNodes = this.data.map((item) => {
|
|
|
- let obj = this.getNode1(this.$refs.treeselect.getNode(item))
|
|
|
- ids.push(obj.result)
|
|
|
- labels.push(obj.labels)
|
|
|
- return { label: obj.labels,result: obj.result};
|
|
|
- });
|
|
|
- //console.log(JSON.stringify(ids),JSON.stringify(labels));
|
|
|
- $('#c-product_area').val(JSON.stringify(ids))
|
|
|
- $('#c-product_area_txt').val(JSON.stringify(labels))
|
|
|
-
|
|
|
- },
|
|
|
- getNode(e1) {
|
|
|
- let labels = [];
|
|
|
- // 递归获取 label
|
|
|
- function recurse(node) {
|
|
|
- if (node && node.label) {
|
|
|
- labels.push(node.label);
|
|
|
- if (node.parentNode) {
|
|
|
- recurse(node.parentNode); // 继续向上递归
|
|
|
- }
|
|
|
+ el: '#app',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ data: areaData,
|
|
|
+ options: areas,
|
|
|
+ sortValueBy: "ORDER_SELECTED",
|
|
|
+ selectedNodes: [],
|
|
|
}
|
|
|
- }
|
|
|
-
|
|
|
- recurse(e1);
|
|
|
- // console.log(labels.reverse().join("/"));
|
|
|
- // 返回拼接的 label 路径
|
|
|
- return labels.reverse().join("-");
|
|
|
},
|
|
|
-
|
|
|
- getNode1(e1) {
|
|
|
- let labels = [];
|
|
|
- let result = [];
|
|
|
- // 递归获取 label
|
|
|
- function recurse(node) {
|
|
|
- if (node && node.label) {
|
|
|
- labels.push(node.label);
|
|
|
- result.push(node.id);
|
|
|
- if (node.parentNode) {
|
|
|
- recurse(node.parentNode); // 继续向上递归
|
|
|
+ methods: {
|
|
|
+ handleChange(selectedValues) {
|
|
|
+ let ids = []
|
|
|
+ let labels = []
|
|
|
+ this.selectedNodes = this.data.map((item) => {
|
|
|
+ let obj = this.getNode1(this.$refs.treeselect.getNode(item))
|
|
|
+ ids.push(obj.result)
|
|
|
+ labels.push(obj.labels)
|
|
|
+ return { label: obj.labels, result: obj.result };
|
|
|
+ });
|
|
|
+ //console.log(JSON.stringify(ids),JSON.stringify(labels));
|
|
|
+ $('#c-product_area').val(JSON.stringify(ids))
|
|
|
+ $('#c-product_area_txt').val(JSON.stringify(labels))
|
|
|
+
|
|
|
+ },
|
|
|
+ getNode(e1) {
|
|
|
+ let labels = [];
|
|
|
+ // 递归获取 label
|
|
|
+ function recurse(node) {
|
|
|
+ if (node && node.label) {
|
|
|
+ labels.push(node.label);
|
|
|
+ if (node.parentNode) {
|
|
|
+ recurse(node.parentNode); // 继续向上递归
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- }
|
|
|
- recurse(e1);
|
|
|
- // 返回拼接的 label 路径
|
|
|
- return {labels:[labels.reverse().join("-")], result:result.reverse()};
|
|
|
- },
|
|
|
- }
|
|
|
+
|
|
|
+ recurse(e1);
|
|
|
+ // console.log(labels.reverse().join("/"));
|
|
|
+ // 返回拼接的 label 路径
|
|
|
+ return labels.reverse().join("-");
|
|
|
+ },
|
|
|
+
|
|
|
+ getNode1(e1) {
|
|
|
+ let labels = [];
|
|
|
+ let result = [];
|
|
|
+ // 递归获取 label
|
|
|
+ function recurse(node) {
|
|
|
+ if (node && node.label) {
|
|
|
+ labels.push(node.label);
|
|
|
+ result.push(node.id);
|
|
|
+ if (node.parentNode) {
|
|
|
+ recurse(node.parentNode); // 继续向上递归
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ recurse(e1);
|
|
|
+ // 返回拼接的 label 路径
|
|
|
+ return { labels: [labels.reverse().join("-")], result: result.reverse() };
|
|
|
+ },
|
|
|
+ }
|
|
|
})
|
|
|
-
|
|
|
+ //禁用已选择
|
|
|
+ function markDisabled(area, data) {
|
|
|
+ area.forEach((item) => {
|
|
|
+ if (data.includes(item.id)) {
|
|
|
+ item.isDisabled = true;
|
|
|
+ }
|
|
|
+ if (item.children && item.children.length > 0) {
|
|
|
+ markDisabled(item.children, data);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return area
|
|
|
+ }
|
|
|
},
|
|
|
}
|
|
|
};
|
afa