g7hoo/mt-yd-ui
1
0
Fork 0
forked from mt-fe-group/mt-yd-ui
Code Issues Pull Requests Releases Wiki Activity

update 改版完成

Browse Source
This commit is contained in:
g7hoo 2022-08-09 16:24:18 +08:00
parent 669c8f90c6
commit 5d8f537d05
1 changed files with 52 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
src/components/base-dialog/addOrUpdate/index.vue
View File

@ -6,14 +6,14 @@
<el-col v-for="c in COLUMN_PER_ROW" :key="`${n}+'col'+${c}`" :span="24 / COLUMN_PER_ROW"> <el-col v-for="c in COLUMN_PER_ROW" :key="`${n}+'col'+${c}`" :span="24 / COLUMN_PER_ROW">
<el-form-item <el-form-item
v-if="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]" v-if="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]"
:prop="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name || configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]" :prop="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name"
:key="`${n}-col-${c}-item`" :key="`${n}-col-${c}-item`"
:label="getLabel(n, c)" :label="getLabel(n, c)"
> >
<!-- 暂时先不实现部分输入方式 --> <!-- 暂时先不实现部分输入方式 -->
<el-input <el-input
v-if="getType(n, c) === 'input'" v-if="getType(n, c) === 'input'"
:placeholder="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].placeholder || ''" :placeholder="configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].placeholder || '...'"
v-model="dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]" v-model="dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]"
/> />
<el-radio v-if="getType(n, c) === 'radio'"></el-radio> <el-radio v-if="getType(n, c) === 'radio'"></el-radio>
@ -127,68 +127,64 @@ export default {
// 本组件只实现了'一行两列'的表单布局 // 本组件只实现了'一行两列'的表单布局
return Math.ceil(this.configs.fields.length / COLUMN_PER_ROW) return Math.ceil(this.configs.fields.length / COLUMN_PER_ROW)
} }
// computedModel: {
// get(n, c) {
// return this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name
// ? dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)].name]
// : dataForm[configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]]
// },
// set() {}
// }
}, },
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
/** 转换 configs.fields 的结构，把纯字符串转为对象 */
this.configs.fields = this.configs.fields.map(item => {
if (typeof item === 'string') {
return { name: item }
}
return item
})
/** 动态设置dataForm字段 */ /** 动态设置dataForm字段 */
this.configs.fields.forEach(item => { this.configs.fields.forEach(item => {
if (typeof item === 'string') { this.$set(this.dataForm, [item.name], '')
this.$set(this.dataForm, [item], '') if (item.api) {
} else if (typeof item === 'object') { /** 自动请求并填充 */
this.$set(this.dataForm, [item.name], '') this.$http({
if (item.api) { url: this.$http.adornUrl(item.api),
/** 自动请求并填充 */ methods: 'get'
this.$http({ }).then(({ data: res }) => {
url: this.$http.adornUrl(item.api), if (data & (data.code === 0)) {
methods: 'get' this.dataFrom[item.name] = res.data // <=== 此处需要对接口
}).then(({ data: res }) => { }
if (data & (data.code === 0)) { })
this.dataFrom[item.name] = res.data // <=== 此处需要对接口 } // end if (item.api)
}
})
} // end if (item.api)
if (item.required) { if (item.required) {
const requiredRule = { const requiredRule = {
required: true, required: true,
message: '请输入必填项', message: '请输入必填项',
trigger: 'change' trigger: 'change'
}
/** 检查是否已经存在该字段的规则 */
const exists = this.dataFormRules[item.name] || null
/** 设置验证规则 */
if (exists) {
const unset = true
for (const rule of exists) {
if (rule.required) unset = false
} }
/** 检查是否已经存在该字段的规则 */ if (unset) {
const exists = this.dataFormRules[item.name] || null exists.push(requiredRule)
/** 设置验证规则 */
if (exists) {
const unset = true
for (const rule of exists) {
if (rule.required) unset = false
}
if (unset) {
exists.push(requiredRule)
}
} else {
/** 不存在已有规则 */
this.$set(this.dataFormRules, [item.name], [requiredRule])
} }
} // end if (item.required) } else {
/** 不存在已有规则 */
this.$set(this.dataFormRules, [item.name], [requiredRule])
}
} // end if (item.required)
if (item.rules) { if (item.rules) {
const exists = this.dataFormRules[item.name] || null const exists = this.dataFormRules[item.name] || null
if (exists) { if (exists) {
// 浅拷贝过去 // 浅拷贝过去
exists.push(...item.rules) exists.push(...item.rules)
} else { } else {
this.$set(this.dataFormRules, [item.name], [...item.rules]) this.$set(this.dataFormRules, [item.name], [...item.rules])
} }
} // end if (item.rules) } // end if (item.rules)
}
}) })
/** 检查是否需要额外的组件 */ /** 检查是否需要额外的组件 */
@ -225,7 +221,7 @@ export default {
const opt = this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)] const opt = this.configs.fields[(n - 1) * COLUMN_PER_ROW + (c - 1)]
if (opt) { if (opt) {
// if opt is valid // if opt is valid
return typeof opt === 'string' ? this.defaultNames[opt] : opt.label ? opt.label : this.defaultNames[opt.name] return opt.label ? opt.label : this.defaultNames[opt.name]
} }
}, },
getType(n, c) { getType(n, c) {