Compare commits
No commits in common. "b54298fe09d1827c6b374b77a6231ad533508078" and "86d3f63178e5d5b32daa336f174665649d751404" have entirely different histories.
b54298fe09
...
86d3f63178
@ -2,82 +2,6 @@
|
|||||||
|
|
||||||
> 通过传入合理的配置项来使用 addOrUpdate Dialog
|
> 通过传入合理的配置项来使用 addOrUpdate Dialog
|
||||||
|
|
||||||
## 用途
|
|
||||||
|
|
||||||
通过给对话框传递配置项,并自动根据这些配置项来初始化对话框的功能
|
|
||||||
|
|
||||||
## props
|
|
||||||
|
|
||||||
- configs 对象
|
|
||||||
|
|
||||||
```
|
|
||||||
<my-dialog :configs="SomeConfigs" ... />
|
|
||||||
|
|
||||||
|
|
||||||
type Operation = {
|
|
||||||
name: 'add' | 'edit' | 'detail' | 'delete' | ...,
|
|
||||||
url: string, /** 该操作需要的接口地址,如删除接口 */
|
|
||||||
showAlways: boolean,
|
|
||||||
showOnEdit: boolean,
|
|
||||||
permission: string,
|
|
||||||
}
|
|
||||||
|
|
||||||
type SubTableConfig = {
|
|
||||||
[_:string]: any,
|
|
||||||
title: string, /** 表格的名称 */
|
|
||||||
url: string, /** 涉及的接口 */
|
|
||||||
tableConfigs: {
|
|
||||||
[_:string]: any,
|
|
||||||
type?: 'index' | ...,
|
|
||||||
prop: string,
|
|
||||||
name: string,
|
|
||||||
rules?: any[],
|
|
||||||
fixed?: string,
|
|
||||||
width?: string,
|
|
||||||
subcomponent: VueComponent,
|
|
||||||
options: any[],
|
|
||||||
formField: boolean, /** 是否在新增编辑子表单里出现该字段 */
|
|
||||||
}[], /** 表格prop配置数组,参考 components/base-table 组件和 element-ui 文档 */
|
|
||||||
}
|
|
||||||
|
|
||||||
type ExtraComponent = {
|
|
||||||
name: string,
|
|
||||||
label: string,
|
|
||||||
hasModel: boolean, /** 是否需要为该组件设置 v-model */
|
|
||||||
component: VueComponent, /** 动态加载的 vue 组件 */
|
|
||||||
props: {
|
|
||||||
[_:string]: string | object
|
|
||||||
extraParams?: { /** 上传组件使用 */
|
|
||||||
typeCode: string
|
|
||||||
}
|
|
||||||
}[]
|
|
||||||
}
|
|
||||||
|
|
||||||
type Field = {
|
|
||||||
[_:string]: string | boolean | object | object[],
|
|
||||||
name: string,
|
|
||||||
type?: 'input' | 'select' | ...,
|
|
||||||
options?: any[], /** 设置 type 为 select 时的选项数据 */
|
|
||||||
label?: string, /** 没有时会用 name 替代 */
|
|
||||||
placeholder?: string, /** 没有时会生成默认占位符 */
|
|
||||||
api?: string, /** 如果有该字段,就自动从api地址获取数据并填充到对应的输入框里,一般为 getCode 的接口 */
|
|
||||||
relatedField?: string, /** 关联字段,当设置此字段时,意味着需要在对话框组件上监听 select-change 事件,并当该字段数据被改变时刷新 relatedField 的列表,一般是像选择产线时更新工段列表这样的场景使用 */,
|
|
||||||
required?: boolean, /** 验证规则的简写,只需要限制必填项时,不需要其他验证规则时使用 */
|
|
||||||
rules?: object[], /** 规则设置参考 element-ui 的表单验证配置 */
|
|
||||||
}
|
|
||||||
|
|
||||||
type Configs = {
|
|
||||||
type: 'dialog',
|
|
||||||
infoUrl: string, /** 编辑时获取信息的接口地址 */
|
|
||||||
fields: Field[],
|
|
||||||
extraComponents?: ExtraComponent[],
|
|
||||||
subtable?: SubTableConfig[],
|
|
||||||
operations?: Operation[]
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
## 示例
|
## 示例
|
||||||
|
|
||||||
```js
|
```js
|
||||||
@ -155,7 +79,7 @@ const addOrUpdateConfigs = {
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
## 配置项解释
|
## 配置项
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
|
|
||||||
@ -212,7 +136,6 @@ const addOrUpdateConfigs = {
|
|||||||
含义:有些对话框里需要额外的表格来展示更深层次的数据,如“产品属性”
|
含义:有些对话框里需要额外的表格来展示更深层次的数据,如“产品属性”
|
||||||
类型:object
|
类型:object
|
||||||
选项:
|
选项:
|
||||||
|
|
||||||
- title, 内嵌表格的标题
|
- title, 内嵌表格的标题
|
||||||
- url, 内嵌表格的数据地址
|
- url, 内嵌表格的数据地址
|
||||||
- tableConfigs,内嵌表格的配置选项
|
- tableConfigs,内嵌表格的配置选项
|
||||||
@ -231,14 +154,13 @@ const addOrUpdateConfigs = {
|
|||||||
- 值:`edit` | `delete` | `detail`,需要其他可自行添加(修改 base-table 组件)
|
- 值:`edit` | `delete` | `detail`,需要其他可自行添加(修改 base-table 组件)
|
||||||
|
|
||||||
### extraComponents
|
### extraComponents
|
||||||
|
|
||||||
含义: 需要在对话框里使用的自定义组件列表
|
含义: 需要在对话框里使用的自定义组件列表
|
||||||
类型: Array<object>
|
类型: Array<object>
|
||||||
对象选项:
|
对象选项:
|
||||||
|
- name: 该组件对应的 dataForm 字段(需要参照后端文档来指定)
|
||||||
- name: 该组件对应的 dataForm 字段(需要参照后端文档来指定)
|
- hasModel: boolean, 上传组件一般设置为 false,设置是否和 dataForm 关联
|
||||||
- hasModel: boolean, 上传组件一般设置为 false,设置是否和 dataForm 关联
|
- label
|
||||||
- label
|
- fieldType: 设置该组件的数据将以什么数据类型形式来保存
|
||||||
- fieldType: 设置该组件的数据将以什么数据类型形式来保存
|
- component: 组件
|
||||||
- component: 组件
|
- props 传给组件的配置
|
||||||
- props 传给组件的配置
|
|
@ -101,7 +101,7 @@ const addOrUpdateConfigs = {
|
|||||||
required: true,
|
required: true,
|
||||||
type: 'select',
|
type: 'select',
|
||||||
options: [],
|
options: [],
|
||||||
relatedField: 'sectionId' // 关联下面的id,在更换lineId时,会清空相应的sectionId选择结果
|
relatedField: 'sectionId', // 关联下面的id,在更换lineId时,会清空相应的sectionId选择结果
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'sectionId',
|
name: 'sectionId',
|
||||||
@ -112,8 +112,7 @@ const addOrUpdateConfigs = {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'sort',
|
name: 'sort',
|
||||||
label: i18n.t('ws.sort'),
|
label: i18n.t('ws.sort')
|
||||||
rules: [{ type: 'number', message: i18n.t('hints.number'), transform: val => Number(val) }]
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'groupId',
|
name: 'groupId',
|
||||||
|
@ -70,7 +70,6 @@ import * as echarts from 'echarts'
|
|||||||
|
|
||||||
const tableConfigStatic = [
|
const tableConfigStatic = [
|
||||||
{ type: 'index', width: 100, name: i18n.t('index') },
|
{ type: 'index', width: 100, name: i18n.t('index') },
|
||||||
{ name: i18n.t('pl.title'), prop: 'lineName' },
|
|
||||||
{ name: i18n.t('inspect.inTotal'), prop: 'sumUp' },
|
{ name: i18n.t('inspect.inTotal'), prop: 'sumUp' },
|
||||||
{ name: i18n.t('inspect.outTotal'), prop: 'sumDown' },
|
{ name: i18n.t('inspect.outTotal'), prop: 'sumDown' },
|
||||||
{ name: i18n.t('inspect.checkTotal'), prop: 'sumCheck' },
|
{ name: i18n.t('inspect.checkTotal'), prop: 'sumCheck' },
|
||||||
|
Loading…
Reference in New Issue
Block a user