index.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <script>
  2. export default {
  3. name: 'MenuItem',
  4. functional: true,
  5. props: {
  6. auth: {
  7. type: Object,
  8. require: true,
  9. default: () => { }
  10. },
  11. row: {
  12. type: Object,
  13. default: () => { }
  14. }
  15. },
  16. render (h, context) {
  17. const { auth, row } = context.props
  18. const vnodes = []
  19. if (auth && Object.keys(auth).length) {
  20. //获取按钮配置项
  21. const { servicetype, pagename, pageicon } = auth
  22. //根据服务类型显示按钮类型 1=查询 2=新增 3=编辑 4=删除
  23. const type = servicetype != '4' ? 'primary' : 'danger'
  24. //根据服务类型显示按钮类型设置按钮方法 1=查询 2=新增 3=编辑 4=删除 ...其他
  25. let func = null
  26. if (servicetype == 1) {
  27. func = () => context.parent.handleQuery()
  28. } else if (servicetype == 2) {
  29. func = () => context.parent.handleAdd()
  30. } else if (servicetype == 3) {
  31. func = (row) => context.parent.handleEdit(row)
  32. } else if (servicetype == 4) {
  33. func = (row) => context.parent.handleRemove(row)
  34. } else if (servicetype == 5) {
  35. func = (row, auth) => context.parent.handleOther(row, auth)
  36. }
  37. //根据显示方式显示按钮类型 1=名称 2=图标 3=名称+图标
  38. const isDisplay = auth.isdisplay
  39. let button = null
  40. if(eval(isDisplay)){
  41. if (pageicon) {
  42. button = <el-button size="small" icon={pageicon} onClick={() => func(row, auth)} type={type}></el-button>
  43. } else {
  44. button = <el-button size="small" onClick={() => func(row, auth)} type={type}>{pagename}</el-button>
  45. }
  46. vnodes.push(button)
  47. }
  48. } else {
  49. vnodes.push(<span></span>)
  50. }
  51. return vnodes
  52. }
  53. }
  54. </script>
  55. <style scoped>
  56. .sub-el-icon {
  57. color: currentColor;
  58. width: 1em;
  59. height: 1em;
  60. }
  61. </style>