lxm_front/vxe-table
1
0
Fork 0
mirror of https://gitee.com/xuliangzhan_admin/vxe-table.git synced 2026-01-21 05:27:57 +08:00
Code Issues Projects Releases Wiki Activity
Files
5f4fe76bc46c13d226ff406ebeea7ab31d08b4f4
vxe-table/docs/static/js/tree.18c131dc.js
xuliangzhan 5f4fe76bc4 update
2019-06-25 12:14:10 +08:00

1 line
20 KiB
JavaScript
Raw Blame History

(window["webpackJsonpVXETable"]=window["webpackJsonpVXETable"]||[]).push([["tree"],{"15b1":function(e,t,n){"use strict";n.r(t);var a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("p",[e._v("多选树表格")]),n("vxe-table",{attrs:{"tree-config":{key:"id",children:"children"},data:e.tableData},on:{"update:data":function(t){e.tableData=t},"select-change":e.selectChangeEvent}},[n("vxe-table-column",{attrs:{type:"selection",prop:"checked",width:"120","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"name",label:"Name"}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date"}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[0]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[1]))]),e._v("\n ")])],1)},l=[],o=(n("5df3"),n("1c4c"),n("ac6a"),n("1487")),r=n.n(o),c={data:function(){return{tableData:[],demoCodes:['\n <vxe-table\n :tree-config="{key: \'id\', children: \'children\'}"\n :data.sync="tableData"\n @select-change="selectChangeEvent">\n <vxe-table-column type="selection" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name"></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n },\n methods: {\n selectChangeEvent ({ selection }) {\n console.info(`勾选${selection.length}个树形节点`, selection)\n }\n }\n }\n "]}},created:function(){this.tableData=window.MOCK_TREE_DATA_LIST.slice(0)},mounted:function(){Array.from(this.$el.querySelectorAll("pre code")).forEach(function(e){r.a.highlightBlock(e)})},methods:{selectChangeEvent:function(e){var t=e.selection;console.info("勾选".concat(t.length,"个树形节点"),t)}}},i=c,s=n("2877"),d=Object(s["a"])(i,a,l,!1,null,null,null);t["default"]=d.exports},"165f":function(e,t,n){"use strict";n.r(t);var a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("p",[e._v("树表格，通过配置 "),n("table-api-link",{attrs:{prop:"tree-config"}}),e._v(" 和指定列 "),n("table-column-api-link",{attrs:{prop:"tree-node"}}),e._v(" 属性来开启树表格")],1),n("p",[e._v("还可以通过 "),n("table-api-link",{attrs:{prop:"trigger"}}),e._v(" 指定触发方式")],1),n("vxe-table",{attrs:{border:"",resizable:"","tree-config":{key:"id",children:"children"},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{prop:"name",label:"Name"}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date","tree-node":""}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[0]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[1]))]),e._v("\n ")]),n("p",[e._v("默认展开所有树节点，通过 "),n("table-api-link",{attrs:{prop:"expand-config"}}),e._v(" 参数设置默认展开树节点")],1),n("vxe-table",{attrs:{data:e.tableData,"tree-config":{key:"id",children:"children",expandAll:!0}},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{type:"index",width:"120",label:"序号","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"name",label:"Name"}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date"}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[2]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[3]))]),e._v("\n ")])],1)},l=[],o=(n("5df3"),n("1c4c"),n("ac6a"),n("1487")),r=n.n(o),c={data:function(){return{tableData:[],demoCodes:['\n <vxe-table\n border\n resizable\n :tree-config="{key: \'id\', children: \'children\'}"\n :data.sync="tableData">\n <vxe-table-column prop="name" label="Name"></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date" tree-node></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n ",'\n <vxe-table\n :data.sync="tableData"\n :tree-config="{key: \'id\', children: \'children\', expandAll: true}">\n <vxe-table-column type="index" width="120" label="序号" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name"></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n "]}},created:function(){this.tableData=window.MOCK_TREE_DATA_LIST.slice(0)},mounted:function(){Array.from(this.$el.querySelectorAll("pre code")).forEach(function(e){r.a.highlightBlock(e)})}},i=c,s=n("2877"),d=Object(s["a"])(i,a,l,!1,null,null,null);t["default"]=d.exports},"728f":function(e,t,n){"use strict";n.r(t);var a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("p",[e._v("可编辑树表格，还可以通过手动调用展开收起")]),n("vxe-toolbar",{scopedSlots:e._u([{key:"buttons",fn:function(){return[n("vxe-button",{on:{click:function(t){return e.$refs.xTree.toggleTreeExpansion(e.tableData[0],!0)}}},[e._v("切换第一个")]),n("vxe-button",{on:{click:function(t){return e.$refs.xTree.setTreeExpansion(e.tableData[2],!0)}}},[e._v("展开第三个")]),n("vxe-button",{on:{click:function(t){return e.$refs.xTree.setAllTreeExpansion(!0)}}},[e._v("展开所有")]),n("vxe-button",{on:{click:function(t){return e.$refs.xTree.clearTreeExpand()}}},[e._v("关闭所有")])]},proxy:!0}])}),n("vxe-table",{ref:"xTree",attrs:{"tree-config":{key:"id",children:"children"},"edit-config":{trigger:"click",mode:"row"},"select-config":{labelProp:"id"},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{type:"selection",label:"ID","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"name",label:"Name","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date","edit-render":{name:"input"}}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[0]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[1]))]),e._v("\n ")])],1)},l=[],o=(n("5df3"),n("1c4c"),n("ac6a"),n("1487")),r=n.n(o),c={data:function(){return{tableData:[],demoCodes:['\n <vxe-toolbar>\n <template v-slot:buttons>\n <vxe-button @click="$refs.xTree.toggleTreeExpansion(tableData[0], true)">切换第一个</vxe-button>\n <vxe-button @click="$refs.xTree.setTreeExpansion(tableData[2], true)">展开第三个</vxe-button>\n <vxe-button @click="$refs.xTree.setAllTreeExpansion(true)">展开所有</vxe-button>\n <vxe-button @click="$refs.xTree.clearTreeExpand()">关闭所有</vxe-button>\n </template>\n </vxe-toolbar>\n\n <vxe-table\n ref="xTree"\n :tree-config="{key: \'id\', children: \'children\'}"\n :edit-config="{trigger: \'click\', mode: \'row\'}"\n :select-config="{labelProp: \'id\'}"\n :data.sync="tableData">\n <vxe-table-column type="selection" label="ID" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="size" label="Size" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="type" label="Type" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="date" label="Date" :edit-render="{name: \'input\'}"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n "]}},created:function(){this.tableData=window.MOCK_TREE_DATA_LIST.slice(0)},mounted:function(){Array.from(this.$el.querySelectorAll("pre code")).forEach(function(e){r.a.highlightBlock(e)})}},i=c,s=n("2877"),d=Object(s["a"])(i,a,l,!1,null,null,null);t["default"]=d.exports},ce1c:function(e,t,n){"use strict";n.r(t);var a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("p",[e._v("使用 "),n("table-api-link",{attrs:{prop:"highlight-current-row"}}),e._v(" 方式")],1),n("vxe-table",{attrs:{"highlight-current-row":"","tree-config":{key:"id",children:"children"},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{prop:"name",label:"Name","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date"}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[0]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[1]))]),e._v("\n ")]),n("p",[e._v("使用 radio 方式")]),n("vxe-table",{attrs:{"tree-config":{key:"id",children:"children"},"radio-config":{labelProp:"name"},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{type:"radio",label:"Name","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date"}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[2]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[3]))]),e._v("\n ")]),n("p",[e._v("当然也可以两种方式同时使用")]),n("vxe-table",{attrs:{"highlight-current-row":"","tree-config":{key:"id",children:"children"},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{type:"radio",width:"120","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"name",label:"Name"}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size"}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type"}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date"}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[4]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[5]))]),e._v("\n ")])],1)},l=[],o=(n("5df3"),n("1c4c"),n("ac6a"),n("1487")),r=n.n(o),c={data:function(){return{tableData:[],demoCodes:['\n <vxe-table\n highlight-current-row\n :tree-config="{key: \'id\', children: \'children\'}"\n :data.sync="tableData">\n <vxe-table-column prop="name" label="Name" tree-node></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n ",'\n <vxe-table\n :tree-config="{key: \'id\', children: \'children\'}"\n :data.sync="tableData">\n <vxe-table-column type="radio" width="120" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name"></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n ",'\n <vxe-table\n highlight-current-row\n :tree-config="{key: \'id\', children: \'children\'}"\n :data.sync="tableData">\n <vxe-table-column type="radio" width="120" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name"></vxe-table-column>\n <vxe-table-column prop="size" label="Size"></vxe-table-column>\n <vxe-table-column prop="type" label="Type"></vxe-table-column>\n <vxe-table-column prop="date" label="Date"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n }\n }\n "]}},created:function(){this.tableData=window.MOCK_TREE_DATA_LIST.slice(0)},mounted:function(){Array.from(this.$el.querySelectorAll("pre code")).forEach(function(e){r.a.highlightBlock(e)})}},i=c,s=n("2877"),d=Object(s["a"])(i,a,l,!1,null,null,null);t["default"]=d.exports},d69a:function(e,t,n){"use strict";n.r(t);var a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("p",[e._v("增删改查、工具栏")]),n("p",{staticClass:"red"},[e._v("必须指定 "),n("table-api-link",{attrs:{prop:"row-key"}}),e._v(" 或者 ( "),n("table-api-link",{attrs:{prop:"select-config"}}),e._v("、"),n("table-api-link",{attrs:{prop:"tree-config"}}),e._v("、"),n("table-api-link",{attrs:{prop:"expand-config"}}),e._v("、"),n("table-api-link",{attrs:{prop:"edit-config"}}),e._v(" ) 中的 key 任意配置一个即可")],1),n("vxe-toolbar",{attrs:{data:e.tableData,setting:""},scopedSlots:e._u([{key:"buttons",fn:function(){return[n("vxe-button",{on:{click:e.insertEvent}},[e._v("新增")]),n("vxe-button",{on:{click:function(t){return e.$refs.xTree.removeSelecteds()}}},[e._v("移除选中")]),n("vxe-button",{on:{click:e.getInsertEvent}},[e._v("获取新增")]),n("vxe-button",{on:{click:e.getRemoveEvent}},[e._v("获取删除")]),n("vxe-button",{on:{click:e.getUpdateEvent}},[e._v("获取修改")])]},proxy:!0}])}),n("vxe-table",{ref:"xTree",attrs:{"tree-config":{key:"id",children:"children"},"edit-config":{trigger:"click",mode:"row",showStatus:!0},data:e.tableData},on:{"update:data":function(t){e.tableData=t}}},[n("vxe-table-column",{attrs:{type:"selection",width:"120","tree-node":""}}),n("vxe-table-column",{attrs:{prop:"name",label:"Name","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"size",label:"Size","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"type",label:"Type","edit-render":{name:"input"}}}),n("vxe-table-column",{attrs:{prop:"date",label:"Date","edit-render":{name:"input"}}})],1),n("p",{staticClass:"demo-code"},[e._v(e._s(e.$t("app.body.button.showCode")))]),n("pre",[e._v(" "),n("code",{staticClass:"xml"},[e._v(e._s(e.demoCodes[0]))]),e._v("\n "),n("code",{staticClass:"javascript"},[e._v(e._s(e.demoCodes[1]))]),e._v("\n ")])],1)},l=[],o=(n("5df3"),n("1c4c"),n("ac6a"),n("1487")),r=n.n(o),c=n("c695"),i=n.n(c),s={data:function(){return{tableData:[],demoCodes:['\n <vxe-toolbar :data="tableData" setting>\n <template v-slot:buttons>\n <vxe-button @click="insertEvent">新增</vxe-button>\n <vxe-button @click="$refs.xTree.removeSelecteds()">移除选中</vxe-button>\n <vxe-button @click="getInsertEvent">获取新增</vxe-button>\n <vxe-button @click="getRemoveEvent">获取删除</vxe-button>\n <vxe-button @click="getUpdateEvent">获取修改</vxe-button>\n </template>\n </vxe-toolbar>\n\n <vxe-table\n ref="xTree"\n :tree-config="{key: \'id\', children: \'children\'}"\n :edit-config="{trigger: \'click\', mode: \'row\', showStatus: true}"\n :data.sync="tableData">\n <vxe-table-column type="selection" width="120" tree-node></vxe-table-column>\n <vxe-table-column prop="name" label="Name" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="size" label="Size" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="type" label="Type" :edit-render="{name: \'input\'}"></vxe-table-column>\n <vxe-table-column prop="date" label="Date" :edit-render="{name: \'input\'}"></vxe-table-column>\n </vxe-table>\n ',"\n export default {\n data () {\n return {\n tableData: []\n }\n },\n created () {\n this.tableData = window.MOCK_TREE_DATA_LIST.slice(0)\n },\n methods: {\n insertEvent () {\n let record = {\n date: XEUtils.toDateString(new Date(), 'yyyy-MM-dd')\n }\n this.$refs.xTree.insert(record)\n .then(({ row }) => this.$refs.xTree.setActiveRow(row))\n },\n getInsertEvent () {\n let insertRecords = this.$refs.xTree.getInsertRecords()\n this.$XMsg.alert(insertRecords.length)\n },\n getRemoveEvent () {\n let removeRecords = this.$refs.xTree.getRemoveRecords()\n this.$XMsg.alert(removeRecords.length)\n },\n getUpdateEvent () {\n let updateRecords = this.$refs.xTree.getUpdateRecords()\n this.$XMsg.alert(updateRecords.length)\n }\n }\n }\n "]}},created:function(){this.tableData=window.MOCK_TREE_DATA_LIST.slice(0)},mounted:function(){Array.from(this.$el.querySelectorAll("pre code")).forEach(function(e){r.a.highlightBlock(e)})},methods:{insertEvent:function(){var e=this,t={date:i.a.toDateString(new Date,"yyyy-MM-dd")};this.$refs.xTree.insert(t).then(function(t){var n=t.row;return e.$refs.xTree.setActiveRow(n)})},getInsertEvent:function(){var e=this.$refs.xTree.getInsertRecords();this.$XMsg.alert(e.length)},getRemoveEvent:function(){var e=this.$refs.xTree.getRemoveRecords();this.$XMsg.alert(e.length)},getUpdateEvent:function(){var e=this.$refs.xTree.getUpdateRecords();this.$XMsg.alert(e.length)}}},d=s,b=n("2877"),p=Object(b["a"])(d,a,l,!1,null,null,null);t["default"]=p.exports}}]);
Reference in New Issue View Git Blame Copy Permalink