2024-05-16

king

2024-05-16 b69b5f6329ca5f87932436b7a6c1ddfc3377e10f

 src/menu/components/card/balcony/options.jsx

@@ -1,195 +1,257 @@
import React from 'react'
import MenuUtils from '@/utils/utils-custom.js'

/**
 * @description Wrap表单配置信息
 */
export const balconyWrapForm = [
  {
    type: 'text',
    field: 'name',
    label: '组件名称',
    initval: '',
    tooltip: '用于组件间的区分。',
    required: true
  },
  {
    type: 'number',
    field: 'width',
    label: '宽度',
    initval: '',
    tooltip: '栅格布局，每行等分为24列。',
    min: 1,
    max: 24,
    precision: 0,
    required: true
  },
  {
    type: 'radio',
    field: 'datatype',
    label: '数据来源',
    initval: '',
    tooltip: '选择静态值，无需配置数据源。',
    required: false,
    options: [
      {value: 'dynamic', label: '动态'},
      {value: 'static', label: '静态'},
    ]
  },
  {
    type: 'radio',
    field: 'linkType',
    label: '受控类型',
    initval: 'static',
    tooltip: '组件与其他组件之间的控制类型，独立表示与其他没有关联。',
    required: false,
    options: [
      {value: 'static', label: '独立'},
      {value: 'sync', label: '同步'},
      {value: 'sup', label: '上级'},
    ],
    controlFields: [
      {field: 'supModule', values: ['sup']},
      {field: 'supControl', values: ['sup']},
      {field: 'syncModule', values: ['sync']},
      {field: 'checkAll', values: ['sync']},
    ]
  },
  {
    type: 'cascader',
    field: 'supModule',
    label: '上级组件',
    initval: '',
    required: true,
    options: []
  },
  {
    type: 'radio',
    field: 'supControl',
    label: '显示控制',
    tooltip: '当前组件在主表选中行时显示，还是始终显示。',
    initval: 'show',
    required: false,
    options: [
      {value: 'hidden', label: '选行'},
      {value: 'show', label: '始终'},
    ]
  },
  {
    type: 'cascader',
    field: 'syncModule',
    label: '同步组件',
    initval: '',
    required: true,
    options: []
  },
  {
    type: 'radio',
    field: 'checkAll',
    label: '全选',
    initval: 'hidden',
    tooltip: '当同步组件可多选时，设置全选有效。',
    required: false,
    options: [
      {value: 'hidden', label: '隐藏'},
      {value: 'show', label: '显示'},
    ]
  },
  {
    type: 'radio',
    field: 'position',
    label: '位置',
    initval: 'relative',
    tooltip: '使用固定定位时，请在测试环境中查看定位效果。',
    required: false,
    options: [
      {value: 'relative', label: '相对定位'},
      {value: 'fixed', label: '固定定位'},
    ],
    controlFields: [
      {field: 'quick', values: ['fixed']},
      {field: 'top', values: ['fixed']},
      {field: 'right', values: ['fixed']},
      {field: 'bottom', values: ['fixed']},
      {field: 'left', values: ['fixed']},
      {field: 'realwidth', values: ['fixed']},
      {field: 'transform', values: ['fixed']},
    ]
  },
  {
    type: 'select',
    field: 'quick',
    label: '快捷选择',
    initval: '',
    required: false,
    subFields: ['top', 'left', 'right', 'bottom', 'transform'],
    options: [
      {value: 'top', label: '上', top: '0px', left: '0px', right: '0px', bottom: '', transform: ''},
      {value: 'top-left', label: '左上', top: '0px', left: '0px', right: '', bottom: '', transform: ''},
      {value: 'top-right', label: '右上', top: '0px', left: '', right: '0px', bottom: '', transform: ''},
      {value: 'left-middle', label: '左中', top: '50%', left: '0px', right: '', bottom: '', transform: 'translateY(-50%)'},
      {value: 'right-middle', label: '右中', top: '50%', left: '', right: '0px', bottom: '', transform: 'translateY(-50%)'},
      {value: 'bottom-left', label: '左下', top: '', left: '0px', right: '', bottom: '0px', transform: ''},
      {value: 'bottom-right', label: '右下', top: '', left: '', right: '0px', bottom: '0px', transform: ''},
      {value: 'bottom', label: '下', top: '', left: '0px', right: '0px', bottom: '0px', transform: ''},
      {value: 'middle', label: '中间', top: '50%', left: '50%', right: '', bottom: '', transform: 'translate(-50%, -50%)'}
    ]
  },
  {
    type: 'styleInput',
    field: 'top',
    label: '距上',
    initval: '',
    required: false
  },
  {
    type: 'styleInput',
    field: 'right',
    label: '距右',
    initval: '',
    required: false
  },
  {
    type: 'styleInput',
    field: 'bottom',
    label: '距下',
    initval: '',
    required: false
  },
  {
    type: 'styleInput',
    field: 'left',
    label: '距左',
    initval: '',
    required: false
  },
  {
    type: 'styleInput',
    field: 'realwidth',
    label: '实际宽度',
    initval: '',
    required: false
  },
  {
    type: 'select',
    field: 'transform',
    label: '变换',
    initval: '',
    required: false,
    options: [
      {value: 'translateY(-50%)', label: '上移50%'},
      {value: 'translateY(50%)', label: '下移50%'},
      {value: 'translateX(-50%)', label: '左移50%'},
      {value: 'translateX(50%)', label: '右移50%'},
      {value: 'translate(-50%, -50%)', label: '左上移50%'},
      {value: 'translate(-50%, 50%)', label: '左下移50%'},
      {value: 'translate(50%, -50%)', label: '右上移50%'},
      {value: 'translate(50%, 50%)', label: '右下移50%'},
    ]
  },
  {
    type: 'multiselect',
    field: 'blacklist',
    label: '黑名单',
    initval: '',
    required: false,
    options: []
  },
]
export default function (wrap, buttons, columns) {
  let menu = window.GLOB.customMenu
  let isprint = sessionStorage.getItem('MenuType') === 'billPrint'
  let ispop = sessionStorage.getItem('editMenuType') === 'popview'

  let modules = MenuUtils.getLinkModules(menu.components) || []
  let supmodules = MenuUtils.getSupModules(menu.components, '', menu.interfaces)
  let roleList = sessionStorage.getItem('sysRoles')
  let appType = sessionStorage.getItem('appType')

  let interfaces = []
  if (menu.interfaces) {
    menu.interfaces.forEach(item => {
      if (item.status === 'true') {
        interfaces.push({
          value: item.uuid,
          label: item.name
        })
      }
    })
  }

  if (roleList) {
    try {
      roleList = JSON.parse(roleList)
    } catch (e) {
      roleList = []
    }
  } else {
    roleList = []
  }

  const balconyWrapForm = [
    {
      type: 'text',
      field: 'name',
      label: '组件名称',
      initval: wrap.name || '',
      tooltip: '用于组件间的区分。',
      required: true
    },
    {
      type: 'number',
      field: 'width',
      label: '宽度',
      initval: wrap.width || 24,
      tooltip: '栅格布局，每行等分为24列。',
      min: 1,
      max: 24,
      precision: 0,
      required: true
    },
    {
      type: 'radio',
      field: 'datatype',
      label: '数据来源',
      initval: wrap.datatype || 'static',
      tooltip: '选择静态值，无需配置数据源。',
      required: false,
      options: [
        {value: 'dynamic', label: '动态'},
        {value: 'static', label: '静态'},
        {value: 'public', label: '公共数据源'},
      ],
      controlFields: [
        {field: 'empty', values: ['dynamic']},
        {field: 'publicId', values: ['public']},
        {field: 'bgField', values: ['dynamic', 'public']},
      ]
    },
    {
      type: 'select',
      field: 'publicId',
      label: '数据源',
      initval: wrap.publicId || '',
      required: true,
      options: interfaces,
      reset_source: true,
      callback: (map, record) => {
        if (!record.publicId) return

        let interfaces = window.GLOB.customMenu.interfaces || []

        let d = interfaces.filter(m => m.uuid === record.publicId && m.status === 'true')[0]

        if (!d || !d.columns) return

        let columns = JSON.parse(JSON.stringify(d.columns))

        let _bgField = map.get('bgField')

        if (_bgField && !_bgField.forbid) {
          _bgField.options = columns
          _bgField.oriOptions = columns
          map.set('bgField', _bgField)
        }
      }
    },
    {
      type: 'radio',
      field: 'linkType',
      label: '受控类型',
      initval: wrap.linkType || 'static',
      tooltip: <div>
        <div>组件与其他组件之间的控制类型: </div>
        <div>1、独立表示与其他组件没有关联。</div>
        <div>2、同步类型中公式、按钮以及全选元素比较特殊，操作数据为其同步组件的数据。</div>
        <div>3、上级类型需添加当前组件的上级组件，并可设置当前组件为始终显示，还是只有在上级组件选行后才显示。</div>
      </div>,
      toolWidth: 400,
      required: false,
      options: [
        {value: 'static', label: '独立'},
        {value: 'sync', label: '同步'},
        {value: 'sup', label: '上级'},
      ],
      controlFields: [
        {field: 'supModule', values: ['sup']},
        {field: 'supControl', values: ['sup']},
        {field: 'syncModule', values: ['sync']},
        {field: 'checkAll', values: ['sync']},
      ],
      forbid: isprint
    },
    {
      type: 'cascader',
      field: 'supModule',
      label: '上级组件',
      initval: wrap.supModule || [],
      // tooltip: '当上级组件不存在或没有权限时，当前组件不显示。',
      required: true,
      options: supmodules,
      forbid: isprint
    },
    {
      type: 'radio',
      field: 'supControl',
      label: '显示控制',
      initval: wrap.supControl || 'show',
      tooltip: '当前组件在主表选中行时显示，还是始终显示。',
      required: false,
      options: [
        {value: 'hidden', label: '选行'},
        {value: 'show', label: '始终'},
      ],
      forbid: isprint
    },
    {
      type: 'cascader',
      field: 'syncModule',
      label: '同步组件',
      initval: wrap.syncModule || '',
      tooltip: '当同步组件不存在或没有权限时，当前组件不显示。',
      required: true,
      options: modules,
      forbid: isprint
    },
    {
      type: 'radio',
      field: 'checkAll',
      label: '全选',
      initval: wrap.checkAll || 'hidden',
      tooltip: '当同步组件可多选时，设置全选有效。',
      required: false,
      options: [
        {value: 'hidden', label: '隐藏'},
        {value: 'show', label: '显示'},
      ],
      forbid: isprint
    },
    {
      type: 'radio',
      field: 'empty',
      label: '空值隐藏',
      initval: wrap.empty || 'show',
      tooltip: '当查询数据为空时，隐藏该组件。',
      required: false,
      skip: true,
      options: [
        {value: 'show', label: '否'},
        {value: 'hidden', label: '是'},
      ],
    },
    {
      type: 'select',
      field: 'bgField',
      label: '背景图',
      initval: wrap.bgField || '',
      tooltip: '动态背景，背景图片由字段值控制。请注意调整背景样式。',
      required: false,
      options: columns
    },
    {
      type: 'radio',
      field: 'printType',
      label: '组件类型',
      initval: wrap.printType || 'content',
      tooltip: '选择类型为《页眉/页脚》时，打印的每页里都会带有该组件。注：页眉页脚中文本元素将替换 @pageIndex@（页码）、@total@（总数）、@date@（当前日期）、@datetime@（当前时间），使用分页参数时注意打印模板的页面布局使用分页。',
      required: false,
      options: [
        {value: 'content', label: '浮动卡'},
        {value: 'headerOrfooter', label: '页眉/页脚'},
      ],
      forbid: !isprint
    },
    {
      type: 'radio',
      field: 'permission',
      label: '权限验证',
      initval: wrap.permission || (!appType ? 'true' : 'false'),
      required: false,
      options: [
        {value: 'true', label: !appType ? '继承菜单' : '启用'},
        {value: 'false', label: '禁用'},
      ],
      forbid: ispop || isprint
    },
    {
      type: 'radio',
      field: 'cacheLocal',
      label: '本地缓存',
      initval: wrap.cacheLocal || 'true',
      required: false,
      options: [
        {value: 'true', label: '继承菜单'},
        {value: 'false', label: '禁用'},
      ],
      forbid: ispop || isprint
    },
    {
      type: 'select',
      field: 'linkbtn',
      label: '关联按钮',
      initval: wrap.linkbtn || '',
      required: false,
      options: buttons,
      forbid: isprint
    },
    {
      type: 'multiselect',
      field: 'blacklist',
      label: '黑名单',
      initval: wrap.blacklist || [],
      required: false,
      options: roleList,
      forbid: !!appType || isprint
    },
  ]

  return balconyWrapForm
}