| | |
| | | * @param {*} card |
| | | * @param {*} type |
| | | */ |
| | | export function getCardCellForm (card, type, subtype, cardCell) { |
| | | export function getCardCellForm (card, type, subtype, cardCell, anchors) { |
| | | let _options = [ |
| | | { value: 'text', text: '文本'}, |
| | | { value: 'number', text: '数值'}, |
| | |
| | | { value: 'barcode', text: '条形码'}, |
| | | { value: 'qrcode', text: '二维码'}, |
| | | { value: 'currentDate', text: '当前时间'}, |
| | | { value: 'formula', text: '公式'}, |
| | | ] |
| | | |
| | | if (type === 'table' || (type === 'card' && subtype === 'datacard')) { |
| | | _options.push({value: 'sequence', text: '序号'}) |
| | | } |
| | | |
| | | let appMenus = [] |
| | | const isApp = sessionStorage.getItem('appType') === 'pc' |
| | | |
| | |
| | | if (appMenus) { |
| | | try { |
| | | appMenus = JSON.parse(appMenus) |
| | | appMenus = appMenus.map(item => ({value: item.MenuID, text: item.MenuName})) |
| | | } catch { |
| | | } catch (e) { |
| | | appMenus = [] |
| | | } |
| | | } else { |
| | |
| | | } |
| | | } |
| | | |
| | | let dataTypes = [ |
| | | { value: 'dynamic', text: '动态' }, |
| | | { value: 'static', text: '静态' } |
| | | ] |
| | | let tooltip = '' |
| | | if (cardCell.$cardType === 'extendCard') { |
| | | card.datatype = 'static' |
| | | dataTypes = [ |
| | | { value: 'static', text: '静态' } |
| | | ] |
| | | tooltip = '在扩展卡片中,动态数据显示值为获取到的第一行数据。' |
| | | } |
| | | |
| | | let forms = [ |
| | |
| | | options: _options |
| | | }, |
| | | { |
| | | type: 'select', |
| | | type: 'icon', |
| | | key: 'icon', |
| | | label: '图标', |
| | | initVal: card.icon, |
| | | required: true, |
| | | options: [ |
| | | { value: 'question-circle', text: 'question-circle'}, |
| | | { value: 'alert', text: 'alert'}, |
| | | { value: 'cloud', text: 'cloud'}, |
| | | { value: 'eye', text: 'eye'}, |
| | | { value: 'eye-invisible', text: 'eye-invisible'}, |
| | | { value: 'android', text: 'android'}, |
| | | { value: 'apple', text: 'apple'}, |
| | | { value: 'windows', text: 'windows'}, |
| | | { value: 'ie', text: 'ie'}, |
| | | { value: 'chrome', text: 'chrome'}, |
| | | { value: 'github', text: 'github'}, |
| | | { value: 'aliwangwang', text: 'aliwangwang'}, |
| | | { value: 'dingding', text: 'dingding'}, |
| | | { value: 'wechat', text: 'wechat'}, |
| | | { value: 'alipay', text: 'alipay'}, |
| | | { value: 'weibo-square', text: 'weibo-square'}, |
| | | { value: 'weibo-circle', text: 'weibo-circle'}, |
| | | { value: 'taobao-circle', text: 'taobao-circle'}, |
| | | { value: 'weibo', text: 'weibo'}, |
| | | { value: 'twitter', text: 'twitter'}, |
| | | { value: 'youtube', text: 'youtube'}, |
| | | { value: 'alipay-circle', text: 'alipay-circle'}, |
| | | { value: 'taobao', text: 'taobao'}, |
| | | { value: 'skype', text: 'skype'}, |
| | | { value: 'qq', text: 'qq'}, |
| | | { value: 'gitlab', text: 'gitlab'}, |
| | | { value: 'zhihu', text: 'zhihu'}, |
| | | { value: 'slack', text: 'slack'}, |
| | | { value: 'sketch', text: 'sketch'}, |
| | | { value: 'yahoo', text: 'yahoo'}, |
| | | { value: 'reddit', text: 'reddit'}, |
| | | { value: 'dribbble', text: 'dribbble'}, |
| | | ] |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'datatype', |
| | | label: '数据类型', |
| | | initVal: card.datatype || 'static', |
| | | tooltip, |
| | | required: true, |
| | | options: dataTypes |
| | | options: [ |
| | | { value: 'dynamic', text: '动态' }, |
| | | { value: 'static', text: '静态' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'select', |
| | |
| | | min: 0, |
| | | label: '内容', |
| | | initVal: card.value || '', |
| | | tooltip: '文本类型,会替换内容中的@username@、@fullName@、@login_city@。', |
| | | tooltip: '文本类型,会替换内容中的@username@、@fullName@、@mk_city@、@appname@、@bid@。', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'file', |
| | | key: 'url', |
| | | label: '图片/文件', |
| | | tooltip: '使用静态图片时,@icon@代表头像。', |
| | | initVal: card.url || '', |
| | | maxfile: 1, |
| | | required: true |
| | |
| | | ] |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'startTime', |
| | | precision: 0, |
| | | label: '开始时间', |
| | | initVal: card.startTime || 0, |
| | | tooltip: '视频开始播放的时间,用于调整视频初始化展示的界面。', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'posterType', |
| | | label: '预览图', |
| | | initVal: card.posterType || '', |
| | | required: false, |
| | | options: [ |
| | | { value: '', text: '无' }, |
| | | { value: 'dynamic', text: '动态' }, |
| | | { value: 'static', text: '静态' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'file', |
| | | key: 'posterUrl', |
| | | label: '预览地址', |
| | | initVal: card.posterUrl || '', |
| | | maxfile: 1, |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'posterField', |
| | | label: '预览地址', |
| | | initVal: card.posterField || '', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'decimal', |
| | | min: 0, |
| | | max: 18, |
| | | decimal: 0, |
| | | label: '小数位', |
| | | initVal: card.decimal === undefined ? '' : card.decimal, |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'format', |
| | | label: '格式化', |
| | |
| | | { value: '', text: '无' }, |
| | | { value: 'percent', text: '百分数' }, |
| | | { value: 'thdSeparator', text: '千分位' }, |
| | | { value: 'YYYY-MM-DD', text: 'YYYY-MM-DD' } |
| | | { value: 'abs', text: '绝对值' }, |
| | | { value: 'encryption', text: '加密'}, |
| | | { value: 'YYYY-MM-DD', text: 'YYYY-MM-DD' }, |
| | | { value: 'YYYY-MM-DD HH:mm', text: 'YYYY-MM-DD HH:mm' }, |
| | | { value: 'YYYY-MM-DD HH:mm:ss', text: 'YYYY-MM-DD HH:mm:ss' }, |
| | | { value: 'MM月DD日', text: 'MM月DD日' }, |
| | | { value: 'YYYY年MM月DD日', text: 'YYYY年MM月DD日' }, |
| | | { value: 'HH:mm', text: '时分(例:16:57)' }, |
| | | { value: 'ahh:mm', text: '自定义1(例:上午10:57)' }, |
| | | { value: 'MM月DD日 ahh:mm', text: '自定义2(例:12月17日 上午10:57)' }, |
| | | { value: 'calendar1', text: '自定义3(例:今天 上午10:57)' }, |
| | | { value: 'calendar2', text: '自定义4(例:刚刚、昨天、5天前)' }, |
| | | ] |
| | | }, |
| | | { |
| | |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'showType', |
| | | label: '展现形式', |
| | | initVal: card.showType || 'line', |
| | | required: false, |
| | | options: [ |
| | | { value: 'line', text: '进度条' }, |
| | | { value: 'circle', text: '进度圈' }, |
| | | { value: 'dashboard', text: '仪表盘' }, |
| | | ] |
| | | }, |
| | | { |
| | | type: 'color', |
| | | key: 'color', |
| | | label: '颜色', |
| | | initVal: card.color || 'rgba(0, 0, 0, 0.85)', |
| | | tooltip: '进度条完成区域、分割线或二维码的颜色。', |
| | | initVal: card.color || '#1890ff', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'color', |
| | | key: 'trailColor', |
| | | label: '未完成颜色', |
| | | initVal: card.trailColor || '#f5f5f5', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'showInfo', |
| | | label: '进度值', |
| | | initVal: card.showInfo || 'false', |
| | | required: false, |
| | | options: [ |
| | | { value: 'true', text: '显示' }, |
| | | { value: 'false', text: '隐藏' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'color', |
| | | key: 'infoColor', |
| | | label: '进度值颜色', |
| | | initVal: card.infoColor || 'rgba(0, 0, 0, 0.65)', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'strokeLinecap', |
| | | label: '线型', |
| | | initVal: card.strokeLinecap || 'round', |
| | | required: false, |
| | | options: [ |
| | | { value: 'round', text: '圆角' }, |
| | | { value: 'square', text: '直角' }, |
| | | ] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'textAlign', |
| | | label: '对齐方式', |
| | | initVal: card.textAlign || 'left', |
| | | required: false, |
| | | options: [ |
| | | { value: 'left', text: '左' }, |
| | | { value: 'center', text: '中' }, |
| | | { value: 'right', text: '右' }, |
| | | ] |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'strokeWidth', |
| | | min: 1, |
| | | max: 200, |
| | | precision: 0, |
| | | label: '线条宽度', |
| | | initVal: card.strokeWidth || 8, |
| | | required: true, |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'outlineWidth', |
| | | min: 10, |
| | | max: 2000, |
| | | precision: 0, |
| | | label: '外形宽度', |
| | | initVal: card.outlineWidth || '', |
| | | tooltip: '外形宽度为空时,宽度为元素的宽度。注:超出时按元素宽度计算。', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'number', |
| | |
| | | min: 1, |
| | | max: 10, |
| | | label: '高度(行)', |
| | | initVal: card.height, |
| | | tooltip: '内容显示行数,值为空时高度自适应,注:自适应高度仅在设置卡片高度后有效。', |
| | | initVal: card.height !== undefined ? card.height : 1, |
| | | tooltip: '内容显示行数,值为空时高度自适应。', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'bgImage', |
| | | label: '动态背景', |
| | | initVal: card.bgImage || '', |
| | | tooltip: '绑定数据源字段,可根据返回值改变背景图。', |
| | | required: false, |
| | | allowClear: true, |
| | | options: [] |
| | | }, |
| | | { |
| | | type: 'cascader', |
| | | key: 'anchors', |
| | | label: '跳转锚点', |
| | | initVal: card.anchors || [], |
| | | tooltip: sessionStorage.getItem('appType') === 'mob' ? '注:小程序中无效' : '', |
| | | required: false, |
| | | options: anchors |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'barHeight', |
| | | min: 5, |
| | | max: 50, |
| | | max: 500, |
| | | label: '高度', |
| | | initVal: card.barHeight || 25, |
| | | required: true, |
| | |
| | | type: 'number', |
| | | key: 'qrWidth', |
| | | min: 5, |
| | | max: 500, |
| | | label: '宽度', |
| | | max: 1000, |
| | | label: '二维码尺寸', |
| | | initVal: card.qrWidth || 50, |
| | | required: true, |
| | | }, |
| | |
| | | min: 0, |
| | | max: 50, |
| | | label: '线宽', |
| | | initVal: card.borderWidth || 1, |
| | | initVal: card.borderWidth === undefined ? 1 : card.borderWidth, |
| | | tooltip: '线宽为0时,为方便在开发时选中默认高度为10px,请注意调整内外边距。', |
| | | required: true |
| | | }, |
| | | { |
| | |
| | | ] |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'maxWidth', |
| | | min: 10, |
| | | max: 2000, |
| | | label: '最大宽度', |
| | | initVal: card.maxWidth || '', |
| | | tooltip: '图片宽度的最大值。', |
| | | help: '注:此值存在时,左右外边距为0居中显示。', |
| | | required: false, |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'aspectRatio', |
| | | label: '长宽比', |
| | |
| | | initVal: card.link || '', |
| | | tooltip: '动态地址为绑定字段值。', |
| | | required: false, |
| | | forbid: isApp, |
| | | options: [ |
| | | { value: '', text: '无' }, |
| | | { value: 'dynamic', text: '动态' }, |
| | |
| | | ] |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'link', |
| | | label: '链接', |
| | | initVal: card.link || '', |
| | | type: 'radio', |
| | | key: 'linkType', |
| | | label: '链接类型', |
| | | initVal: card.linkType || 'other', |
| | | required: false, |
| | | forbid: !isApp, |
| | | options: [ |
| | | { value: '', text: '无' }, |
| | | { value: 'page', text: '菜单' }, |
| | | { value: 'linkpage', text: '关联菜单' }, |
| | | { value: 'custom', text: '链接' } |
| | | { value: 'tel', text: '电话' }, |
| | | { value: 'email', text: '邮箱' }, |
| | | { value: 'other', text: '其他' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'scale', |
| | | label: '图片放大', |
| | | initVal: card.scale || 'false', |
| | | required: false, |
| | | options: [ |
| | | { value: 'false', text: '不可以' }, |
| | | { value: 'true', text: '可以' } |
| | | ] |
| | | }, |
| | | { |
| | |
| | | forbid: !isApp, |
| | | options: appMenus |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'open', |
| | | label: '打开方式', |
| | | initVal: card.open || 'blank', |
| | | required: false, |
| | | forbid: !isApp, |
| | | options: [ |
| | | { value: 'blank', text: '新页面' }, |
| | | { value: 'self', text: '当前页面' } |
| | | ] |
| | | }, |
| | | // { |
| | | // type: 'radio', |
| | | // key: 'open', |
| | | // label: '打开方式', |
| | | // initVal: card.open || 'blank', |
| | | // required: false, |
| | | // forbid: !isApp, |
| | | // options: [ |
| | | // { value: 'blank', text: '新页面' }, |
| | | // { value: 'self', text: '当前页面' } |
| | | // ] |
| | | // }, |
| | | { |
| | | type: 'select', |
| | | key: 'copyMenuId', |
| | | label: '复制菜单', |
| | | initVal: card.copyMenuId || '', |
| | | required: false, |
| | | forbid: !isApp, |
| | | options: appMenus |
| | | key: 'linkurl', |
| | | label: '链接地址', |
| | | initVal: card.linkurl || '', |
| | | required: true, |
| | | options: [] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | |
| | | }] |
| | | }, |
| | | { |
| | | type: 'select', |
| | | key: 'linkurl', |
| | | label: '链接地址', |
| | | initVal: card.linkurl || '', |
| | | required: true, |
| | | options: [] |
| | | type: 'radio', |
| | | key: 'eval', |
| | | label: '解析', |
| | | initVal: card.eval || 'true', |
| | | tooltip: '当公式内容涉及计算时请选择“是”,当公式内容为字段拼接时请选择“否”。', |
| | | required: false, |
| | | options: [{ |
| | | value: 'true', |
| | | text: Formdict['model.true'] |
| | | }, { |
| | | value: 'false', |
| | | text: Formdict['model.false'] |
| | | }] |
| | | }, |
| | | { |
| | | type: 'textarea', |
| | | key: 'formula', |
| | | label: '公式', |
| | | initVal: card.formula || '', |
| | | tooltip: '执行时会使用查询到的数据替换相应的字段,展示获得的结果,在不使用解析时换行符或空格会替换为页面元素。可使用JS的一些语法,如:三元表达式 @field1@ > @field2@ ? 0 : 1;Math对象,取绝对值 Math.abs(@field@)、四舍五入 Math.round(@field@)等', |
| | | placeholder: '例如:@price@ * @number@', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'noValue', |
| | | label: '空值', |
| | | initVal: card.noValue || 'show', |
| | | tooltip: '当元素内容为空时,是否显示当前元素。', |
| | | required: false, |
| | | options: [ |
| | | { value: 'show', text: '显示' }, |
| | | { value: 'hide', text: '隐藏' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'fixStyle', |
| | | label: '前后缀', |
| | | initVal: card.fixStyle || '', |
| | | tooltip: '前缀与后缀,使用与内容统一的样式还是独立样式。', |
| | | required: false, |
| | | options: [ |
| | | { value: '', text: '统一样式' }, |
| | | { value: 'alone', text: '独立样式' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'radio', |
| | | key: 'copyable', |
| | | label: '可复制', |
| | | initVal: card.copyable || 'false', |
| | | tooltip: '元素是否可复制,复制内容不包括前缀与后缀。', |
| | | required: false, |
| | | options: [ |
| | | { value: 'true', text: '是' }, |
| | | { value: 'false', text: '否' } |
| | | ] |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'fixSize', |
| | | min: 10, |
| | | max: 300, |
| | | label: '字体大小', |
| | | initVal: card.fixSize || 14, |
| | | tooltip: '前缀、后缀的字体大小。', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'color', |
| | | key: 'fixColor', |
| | | label: '字体颜色', |
| | | initVal: card.fixColor || 'rgba(0, 0, 0, 0.65)', |
| | | tooltip: '前缀、后缀的字体颜色。', |
| | | required: true |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'fixLeft', |
| | | min: 0, |
| | | max: 1000, |
| | | label: '左边距', |
| | | initVal: card.fixLeft || 0, |
| | | tooltip: '前缀、后缀的左边距。', |
| | | required: false |
| | | }, |
| | | { |
| | | type: 'number', |
| | | key: 'fixRight', |
| | | min: 0, |
| | | max: 1000, |
| | | label: '右边距', |
| | | initVal: card.fixRight || 0, |
| | | tooltip: '前缀、后缀的右边距。', |
| | | required: false |
| | | }, |
| | | ] |
| | | |