update
Dieser Commit ist enthalten in:
Ursprung
0733660c2f
Commit
2557026002
@ -1,11 +1,48 @@
|
||||
<template>
|
||||
<el-dialog :title="isDetail ? title.detail : !dataForm.id ? title.add : title.edit" :visible.sync="visible" @close="handleClose">
|
||||
<el-form>
|
||||
<el-form :model="dataForm" :rules="dataFormRules">
|
||||
<!-- 如果需要更精细一点的布局，可以根据配置项实现地再复杂一点，但此处暂时全部采用一行两列布局 -->
|
||||
<el-row v-for="n in rows" :key="n" :gutter="20">
|
||||
<el-col v-for="c in COLUMN_PER_ROW" :key="`${n}+'col'+${c}`" :span="24 / COLUMN_PER_ROW">
|
||||
<!-- <el-form-item
|
||||
v-for="field in configs.fields"
|
||||
:key="field.name || field"
|
||||
:prop="field.name || field"
|
||||
:label="field.label || field.name | nameFilter || field | nameFilter"
|
||||
> -->
|
||||
<!-- <el-form-item
|
||||
:prop="
|
||||
typeof configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)] === 'string'
|
||||
? configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]
|
||||
: configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].type
|
||||
"
|
||||
:key="`${n}-col-${c}-item`"
|
||||
:label="
|
||||
`
|
||||
${configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].label ||
|
||||
(configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name && defaultNames[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]) ||
|
||||
defaultNames[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]]}
|
||||
`
|
||||
"
|
||||
> -->
|
||||
<el-form-item :prop="`${n}-test-${c}`" :key="`${n}-col-${c}-item`" :label="'f'">
|
||||
{{ n - c - JSON.stringify(configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]) }}
|
||||
<!-- 暂时先不实现部分输入方式 -->
|
||||
<!-- <el-input></el-input>
|
||||
<el-radio></el-radio>
|
||||
<el-checkbox></el-checkbox>
|
||||
<el-select></el-select>
|
||||
<el-switch></el-switch>
|
||||
<el-cascader></el-cascader>
|
||||
<el-time-select></el-time-select>
|
||||
<el-date-picker></el-date-picker> -->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<!-- extra components , like Markdown or RichEdit -->
|
||||
<template v-if="extraComponents.length > 0">
|
||||
<el-form-item v-for="ec in extraComponents" :key="ec.name" :label="ec.label">
|
||||
<template v-if="configs.extraComponents && configs.extraComponents.length > 0">
|
||||
<el-form-item v-for="ec in configs.extraComponents" :key="ec.name" :label="ec.label">
|
||||
<component :is="ec.component" v-model="dataForm[ec.name]"></component>
|
||||
</el-form-item>
|
||||
</template>
|
||||
@ -61,8 +98,24 @@ export default {
|
||||
default: () => ({}) // 此处省去类型检查，使用者自行注意就好
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
nameFilter: function(name) {
|
||||
if (!name) return null
|
||||
// for i18n
|
||||
const defaultNames = {
|
||||
name: '名称',
|
||||
code: '编码',
|
||||
remark: '备注',
|
||||
specifications: '规格'
|
||||
// add more...
|
||||
}
|
||||
|
||||
return defaultNames[name]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
COLUMN_PER_ROW,
|
||||
title,
|
||||
btnName,
|
||||
btnType,
|
||||
@ -71,8 +124,15 @@ export default {
|
||||
isDetail: false,
|
||||
// cached: false // 不采用缓存比较的方案了，采用 updated 方案： 如果更新了dataForm就在 confirm 时 emit(refreshDataList)
|
||||
isUpdated: false,
|
||||
dataForm: null,
|
||||
dataFormRules: {}
|
||||
dataForm: {},
|
||||
dataFormRules: {},
|
||||
defaultNames: {
|
||||
name: '名称',
|
||||
code: '编码',
|
||||
remark: '备注',
|
||||
specifications: '规格'
|
||||
// add more...
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -88,9 +148,9 @@ export default {
|
||||
if (typeof item === 'string') {
|
||||
this.$set(this.dataForm, [item], '')
|
||||
} else if (typeof item === 'object') {
|
||||
this.$set(this.dataForm, [item.name], '')
|
||||
if (item.api) {
|
||||
/** 自动请求并填充 */
|
||||
this.$set(this.dataForm, [item.name], '')
|
||||
this.$http({
|
||||
url: this.$http.adornUrl(item.api),
|
||||
methods: 'get'
|
||||
@ -137,9 +197,13 @@ export default {
|
||||
})
|
||||
|
||||
/** 检查是否需要额外的组件 */
|
||||
this.configs.extraComponents.forEach(item => {
|
||||
this.$set(this.dataForm, [item.name], '')
|
||||
})
|
||||
this.configs.extraComponents &&
|
||||
this.configs.extraComponents.forEach(item => {
|
||||
this.$set(this.dataForm, [item.name], '')
|
||||
})
|
||||
|
||||
/** 单独设置 id */
|
||||
this.$set(this.dataForm, 'id', null)
|
||||
|
||||
// TODO：delete next lines
|
||||
console.log('dataform: ', this.dataForm)
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getDataList()">查询</el-button>
|
||||
<el-button @click="test()">测试</el-button>
|
||||
<el-button v-if="$hasPermission('monitoring:product:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -52,6 +53,8 @@
|
||||
></el-pagination>
|
||||
<!-- 弹窗, 新增 / 修改 -->
|
||||
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
|
||||
|
||||
<base-dialog v-if="showbasedialog" ref="basedialog" :configs="addOrUpdateConfigs"></base-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -60,7 +63,7 @@ import AddOrUpdate from './product-add-or-update'
|
||||
import BaseTable from '@/components/base-table'
|
||||
import TableOperateComponent from '@/components/base-table/components/operationComponent'
|
||||
import TableTextComponent from '@/components/base-table/components/detailComponent'
|
||||
|
||||
import BaseDialog from '@/components/base-dialog/addOrUpdate'
|
||||
const tableConfigs = [
|
||||
{ type: 'index', name: '序号' },
|
||||
{ prop: 'updateTime', name: '添加时间' },
|
||||
@ -135,10 +138,10 @@ const addOrUpdateConfigs = {
|
||||
}
|
||||
],
|
||||
operations: [
|
||||
{ name: 'reset', url: true },
|
||||
{ name: 'save', url: 'api/product/add' },
|
||||
{ name: 'update', url: 'api/product/update' },
|
||||
{ name: 'reset', url: true }
|
||||
],
|
||||
{ name: 'update', url: 'api/product/update' }
|
||||
]
|
||||
// extraComponents: [
|
||||
// {
|
||||
// name: 'CompName',
|
||||
@ -162,17 +165,27 @@ export default {
|
||||
totalPage: 0,
|
||||
dataListLoading: false,
|
||||
dataListSelections: [],
|
||||
addOrUpdateVisible: false
|
||||
addOrUpdateVisible: false,
|
||||
addOrUpdateConfigs,
|
||||
showbasedialog: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
AddOrUpdate,
|
||||
BaseTable
|
||||
BaseTable,
|
||||
BaseDialog
|
||||
},
|
||||
activated() {
|
||||
this.getDataList()
|
||||
},
|
||||
methods: {
|
||||
//
|
||||
test() {
|
||||
this.showbasedialog = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.basedialog.init()
|
||||
})
|
||||
},
|
||||
// 获取数据列表
|
||||
getDataList() {
|
||||
this.dataListLoading = true
|
||||
|
||||
Laden…
In neuem Issue referenzieren
Einen Benutzer sperren