Skip to content

C
car-database-web
Commit c952e0aa authored by jiaxu.yan's avatar jiaxu.yan
Browse files
Options

feat: 连选功能

parent 991445cd
Hide whitespace changes
Inline Side-by-side
Showing with 214 additions and 12 deletions
src/components/CheckCoiumns/checkInput.vue
View file @ c952e0aa
......@@ -4,7 +4,12 @@
<el-checkbox
:disabled="status"
:model="i.check"
@change="input"
@change="
e => {
checkOne(i, e)
input()
}
"
label=""
>
</el-checkbox>
......@@ -34,12 +39,15 @@ export default {
type: String,
default: ''
},
merge: {
type: Boolean,
default: false
},
status: {
type: Boolean,
default: false
},
defaultValue: {
default: ''
}
},
......@@ -67,13 +75,44 @@ export default {
mounted() {
if (this.defaultValue) {
this.model = this.defaultValue
this.$emit('changeVal', { name: this.prop, val: this.model})
this.$emit('changeVal', { name: this.prop, val: this.model })
this.$emit('makeRecord', { name: this.prop, record: this.result })
} else {
this.reset()
}
},
methods: {
mergeSource({ name, flag }) {
if (this.status) {
return
}
let old = this.model.value || []
this.model.list.map(i => {
if (name) {
if (Array.isArray(old) && flag.includes(String(i.id))) {
i.check = true
old.push(i.id)
}
} else {
if (flag.includes(String(i.id))) {
i.check = false
old = this.removeItem(old, i.id) || []
}
}
})
console.log(this.model.list)
this.model.value = old
},
checkOne(i, e) {
if (this.merge) {
this.$emit('mergeVal', {
name: e,
flag: i.flag ? i.flag.split(',') : []
})
}
},
input(val) {
let arr = []
this.mdoel.list.map(i => {
......@@ -89,9 +128,11 @@ export default {
this.items.options.map(i => {
this.model.list.push({
value: '',
id: i.id,
check: false,
useCaseNo: i.useCaseNo,
key: i.value
key: i.value,
flag: i.flag
})
})
}
......
src/components/CheckCoiumns/checkInputUpload.vue
View file @ c952e0aa
......@@ -5,7 +5,12 @@
<el-checkbox
:disabled="status"
v-model="model.list[k].check"
@change="input"
@change="
e => {
checkOne(i, e)
input()
}
"
label=""
>
</el-checkbox>
......@@ -62,6 +67,10 @@ export default {
type: String,
default: ''
},
merge: {
type: Boolean,
default: false
},
status: {
type: Boolean,
default: false
......@@ -109,6 +118,37 @@ export default {
}
},
methods: {
mergeSource({ name, flag }) {
if (this.status) {
return
}
let old = this.model.value || []
this.model.list.map(i => {
if (name) {
if (Array.isArray(old) && flag.includes(String(i.id))) {
i.check = true
old.push(i.id)
}
} else {
if (flag.includes(String(i.id))) {
i.check = false
old = this.removeItem(old, i.id) || []
}
}
})
console.log(this.model.list)
this.model.value = old
},
checkOne(i, e) {
if (this.merge) {
this.$emit('mergeVal', {
name: e,
flag: i.flag ? i.flag.split(',') : []
})
}
},
input(val) {
let arr = []
this.model.list.map(i => {
......@@ -126,7 +166,9 @@ export default {
value: '',
check: false,
useCaseNo: i.useCaseNo,
key: i.value
key: i.value,
id: i.id,
flag: i.flag
})
})
},
......
src/components/CheckCoiumns/checkbox.vue
View file @ c952e0aa
<template>
<el-checkbox-group v-model="value" :disabled="status" @change="input">
<el-checkbox v-for="(i, k) in items.options" :label="i.id" :key="k">
<el-checkbox
v-for="(i, k) in items.options"
:label="i.id"
@change="
e => {
checkOne(i, e)
}
"
:key="k"
>
{{ i.object }}
</el-checkbox>
</el-checkbox-group>
......@@ -23,6 +32,10 @@ export default {
defaultValue: {
default: ''
},
merge: {
type: Boolean,
default: false
},
result: {
default: ''
}
......@@ -40,26 +53,62 @@ export default {
this.value = []
this.$emit('changeVal', { name: this.prop, val: [] })
this.$emit('makeRecord', { name: this.prop, record: [] })
}
},
mounted() {
if (this.defaultValue) {
this.value = this.defaultValue
this.$emit('changeVal', { name: this.prop, val: this.result})
this.$emit('changeVal', { name: this.prop, val: this.result })
this.$emit('makeRecord', { name: this.prop, record: this.result })
} else {
this.reset()
}
},
methods: {
mergeSource({ name, flag }) {
if (this.status) {
return
}
let old = this.value || []
this.items.options.map(i => {
if (name) {
if (Array.isArray(old) && flag.includes(String(i.id))) {
old.push(i.id)
}
} else {
if (flag.includes(String(i.id))) {
old = this.removeItem(old, i.id) || []
}
}
})
this.value = old
},
removeItem(array, item) {
const index = array.indexOf(item)
if (index !== -1) {
array.splice(index, 1)
}
},
checkOne(i, e) {
if (this.merge) {
this.$emit('mergeVal', {
name: e,
flag: i.flag ? i.flag.split(',') : []
})
}
},
input(val) {
let arr = []
let datas = []
this.items.options.map(i => {
if (this.value.includes(i.id)) {
arr.push(i.useCaseNo)
}
})
this.$emit('changeVal', { name: this.prop, val: arr.join(',') })
this.$emit('makeRecord', { name: this.prop, record: this.value })
},
......
src/components/CheckCoiumns/checkboxUpload.vue
View file @ c952e0aa
<template>
<div class="checkbox-upload">
<el-checkbox-group :disabled="status" v-model="model.value" @change="input">
<el-checkbox v-for="(i, k) in items.options" :label="i.id" :key="k">
<el-checkbox
v-for="(i, k) in items.options"
:label="i.id"
@change="
e => {
checkOne(i, e)
}
"
:key="k"
>
{{ i.object }}
</el-checkbox>
</el-checkbox-group>
......@@ -42,6 +51,10 @@ export default {
type: String,
default: ''
},
merge: {
type: Boolean,
default: false
},
status: {
type: Boolean,
default: false
......@@ -84,6 +97,40 @@ export default {
}
},
methods: {
mergeSource({ name, flag }) {
if (this.status) {
return
}
let old = this.model.value || []
this.items.options.map(i => {
if (name) {
if (Array.isArray(old) && flag.includes(String(i.id))) {
old.push(i.id)
}
} else {
if (flag.includes(String(i.id))) {
old = this.removeItem(old, i.id) || []
}
}
})
this.model.value = old
},
removeItem(array, item) {
const index = array.indexOf(item)
if (index !== -1) {
array.splice(index, 1)
}
},
checkOne(i, e) {
if (this.merge) {
this.$emit('mergeVal', {
name: e,
flag: i.flag ? i.flag.split(',') : []
})
}
},
input() {
let arr = []
this.items.options.map(i => {
......
src/components/checkBuilder.vue
View file @ c952e0aa
<template>
<el-form ref="queryForm" :model="form" class="formClass">
<div class="btn-group">
<el-radio-group v-model="merge">
<el-radio-button :label="true">强关联选择对象 </el-radio-button>
<el-radio-button :label="false">自主选择对象</el-radio-button>
</el-radio-group>
</div>
<el-row :gutter="30">
<el-col v-for="(item, index) in schemas" :key="index" :span="12">
<div class="check-card">
......@@ -34,10 +40,13 @@
:is="item.type"
:status="item.status"
:prop="item.key"
:mergeSource="mergeSource"
:items="item.componentProps"
:defaultValue="item.record ? item.record.defaultValue : ''"
:result="item.result"
:merge="merge"
@changeVal="changeVal"
@mergeVal="mergeVal"
@makeRecord="makeRecord"
ref="formItem"
></component>
......@@ -66,7 +75,10 @@ export default {
data() {
return {
form: {},
record: []
record: [],
merge: true,
mergeArr: [],
mergeSource: []
}
},
computed: {
......@@ -112,6 +124,13 @@ export default {
this.$refs.queryForm.clearValidate(name)
})
},
mergeVal(e) {
this.$refs.formItem.map(i => {
if (typeof i.mergeSource == 'function') {
i.mergeSource(e)
}
})
},
makeRecord(data) {
const { name, record } = data
if (!this.record[name]) {
......@@ -124,7 +143,6 @@ export default {
this.$nextTick(() => {
this.$refs.queryForm.clearValidate(name)
})
},
checkItem(prop, value, cb) {
if (!prop.status) {
......@@ -207,4 +225,9 @@ export default {
margin-bottom: 0;
}
}
.btn-group {
margin-bottom: 20px;
display: flex;
justify-content: flex-end;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment