<template> <div> <Test /> <hr/> <el-button type="primary" icon="el-icon-search">搜索</el-button> <button @click="click">--[button]--</button> <el-button @click="click" size="mini">button1</el-button> <hi-table style="height:250px" emptyText="我是空数据!" :isBigData="isBigData" :isEdit="isEdit" hasSelection hasRowNumber :showSummary="true" :model="tableData" :columns="columns" :rules="rules" :tree-props="treeProps" :row-key="rowKey" :span-method="arraySpanMethod"></hi-table> <HiPagination :page-count="5" /> </div> </template> <script> import Test from "./test" // import biaodan from "/project/zhuomianduanyanshi/biaozhundanju/view/biaodan/dtv/1.0.0/desktop/biaodan.vue" // import BizEntity_jR02Xd from "/project/zhuomianduanyanshi/biaozhundanju/dataset/gongyingshang/bizstore/1.0.0/_extFile/desktop/BizEntity_jR02Xd.js" import { HiTable, HiPagination } from "hi-ui" // console.log(HiTable) export default { components: { Test, HiTable, HiPagination }, data() { return { isBigData: true, isEdit: true, num: 0, inputNumber: { precision: 2, format: "¥0.00", controlsPosition: "right", }, tableData: [], rules: { createTime: [{ required: true, message: "请选择日期", trigger: "blur", }, ], FMoney: [{ min: 1, trigger: "blur", }, ], FName: [{ required: true, message: "请输入活动名称", trigger: "blur", }, { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur", }, ], }, treeProps: { children: "children", hasChildren: "hasChildren" }, rowKey: "id", columns: [{ label: "自定义列", width: 100, slot: [{ element: "el-button", label: "调单", props: { size: "mini", round: true }, handles: { click: this.handleClick } }, { element: "el-tag", label: "默认标签", props: {}, handles: { click: this.handleClick } }, ], }, { name: "FName", label: "姓名1", element: "el-input", width: 100, formatFn: function(value) { return "格式化:" + (value || ""); }, required: true, }, { name: "createTime", label: "申请时间", element: "el-date-picker", required: true, width: 100, props: { type: "datetime", format: "yyyy-MM-dd HH:mm:ss", valueFormat: "yyyy-MM-dd", }, }, { label: "基本信息", align: "center", children: [{ name: "FAge", label: "年龄2", element: "hi-number", sortable: true, summary: "avg", formType: "dbInt", props: { step: 2, format: "0岁", }, }, { name: "FSex", label: "性别3", element: "el-select", props: { children: [{ element: "el-option", props: { label: "男", value: "0" }, }, { element: "el-option", props: { label: "女", value: "1" }, }, ], }, }, ], }, { name: "FMoney", label: "钱", element: "hi-number", formType: "dbDouble", props: { precision: 2, format: "¥0.00", "controls-position": "right", }, summary: "sum", }, { width: 200, name: "FBiaoXian", label: "表现", element: "el-rate", props: { showText: true, }, }, { width: 200, name: "FUse", label: "启用", element: "el-checkbox", props: {}, }, { width: 200, name: "FDept", label: "部门", element: "hi-data-select", props: { lookup: { storeCfg: { modelFile: "purchase/order/dataset/OrderEntity.xml", //数据集配置 部门 id: "dept", //主键 primary: ["id"], //操作权限 operations: [ "oinsert", "odelete", "oquery", "omodify", ], fields: { FID: { name: "FID", //字段ID label: "部门ID", //字段描述 dbtype: "dbInt", //数据类型 required: true, readonly: true, length: 50, rules: [], }, FNUMBER: { name: "FNUMBER", //字段ID label: "部门描述", //字段描述 dbtype: "dbText", //数据类型 }, FUSERID: { name: "FUSERID", //字段ID label: "部门名称", //字段描述 dbtype: "dbString", //数据类型 }, }, }, active: true, multiSelect: false, returnFields: { FDept: "FNUMBER", }, columns: [{ name: "FID", label: "FID", width: 200, }, { name: "FNUMBER", label: "编号", width: 400, }, { name: "FUSERID", label: "FUSERID", }, ], queryOption: { fields: [{ name: "FID", label: "FID", element: "el-input", }, { name: "FNUMBER", element: "el-input", label: "编号", }, { name: "FUSERID", element: "el-input", label: "FUSERID", value: "admin", }, ], }, }, }, }, ], } }, mounted() { // console.log('this.$dsContainer----: ' , this.$dsContainer); }, methods: { click() { alert(1) }, arraySpanMethod({ row, column, rowIndex, columnIndex }) { if (columnIndex === 3) { if (rowIndex % 2 === 0) { return { rowspan: 2, colspan: 1, }; } else { return { rowspan: 0, colspan: 0, }; } } }, } } </script> <style lang="scss"> html,body{ display: block; height: 100%; } button { background: #efefee; padding: 5px 10px; font-size: 12px; border: 1px #eee solid; border-radius: 5px; // transform: rotate(45deg); } </style>