工作单位设置为必填

This commit is contained in:
mengxiaolong
2021-01-18 18:47:36 +08:00
parent 209e0b5f0f
commit b36ace934a
3 changed files with 165 additions and 4 deletions

View File

@@ -0,0 +1,159 @@
<template>
<div class="search_box" ref="search_box">
<van-field :label="label" required>
<template #input>
<input
style="width: 100%; border: none;"
type="text"
:placeholder="placeholder"
:value="searchContent"
@click="onInputFocus"
@blur="onInputBlur"
@input="onInput"
/>
<transition name="slide-in">
<div ref="picker" class="content_info" v-show="showCustomer">
<div class="border_item" v-for="(item, index) in computedCustomerList" :value="item.label" :key="index" @click="chooseCustomer(item)">
{{ item.label }}
</div>
<div class="border_item" v-show="computedCustomerList == 0">
无结果
</div>
</div>
</transition>
</template>
</van-field>
</div>
</template>
<script>
import { Field } from 'vant'
import { getTreasureMenus } from '@/api/ebiz/goodStart'
export default {
name: 'SearchField',
props: {
label: {
type: String,
default: '标题'
},
placeholder: {
type: String,
default: '请输入内容'
},
value: {
type: String
}
},
components: {
[Field.name]: Field
},
data() {
return {
showCustomer: false,
customerList: []
}
},
computed: {
computedCustomerList() {
let searchStr = this.value.trim()
return this.customerList.filter(item => {
return item.label.includes(searchStr)
})
},
searchContent() {
return this.value
}
},
async created() {
const param = { operateType: 'insure_company' }
const result = await getTreasureMenus(param)
if (result.result === '0') {
this.customerList = result.content
} else {
this.$toast(result.resultMessage)
}
},
methods: {
onInput(event) {
this.$emit('input', event.target.value)
},
onInputBlur() {
this.showCustomer = false
this.$emit('input', this.value)
},
onInputFocus() {
this.showCustomer = true
setTimeout(() => {
this.$refs.picker.scrollIntoView()
}, 300)
this.$nextTick(() => {
this.$refs.picker.scrollTo({
top: 0,
behavior: 'smooth'
})
})
},
chooseCustomer(item) {
this.$emit('input', item.label)
this.showCustomer = false
}
}
}
</script>
<style lang="scss" scoped>
.border_item {
box-sizing: content-box;
padding: 5px;
height: 20px;
line-height: 20px;
color: #666;
text-align: center;
font-size: 12px;
overflow: hidden;
}
.content_info::-webkit-scrollbar {
display: none;
}
.search_box {
position: relative;
}
.content_info {
position: absolute;
width: 100%;
background: white;
border-radius: 0 0 6px 6px;
top: 34px;
max-height: 150px;
overflow: scroll;
box-shadow: 0 1px 1px 1px #eee;
z-index: 10;
}
/deep/ .van-cell {
overflow: visible;
}
/deep/ .van-cell__value {
overflow: visible;
}
.slide-in-enter,
.slide-in-leave-to {
opacity: 0;
position: absolute;
top: 44px;
}
.slide-in-leave,
.slide-in-enter-to {
opacity: 1;
position: absolute;
top: 34px;
}
.slide-in-enter-active,
.slide-in-leave-active {
transition: all ease 0.3s;
}
</style>

View File

@@ -260,7 +260,7 @@
right-icon="arrow"
@click="toSelect('7')"
/> -->
<van-field
<!-- <van-field
v-if="specilFlag != '1'"
v-model="userInfo.workcompany"
label="工作单位"
@@ -280,7 +280,8 @@
placeholder="请选择"
v-validate="'required'"
@click="toSelect('9')"
/>
/> -->
<SearchField v-model="userInfo.workcompany" label="工作单位" placeholder="无工作单位,请输入无" v-validate="'required'" name="工作单位" />
<!-- <van-field
v-model="areaName"
readonly

View File

@@ -297,7 +297,7 @@
right-icon="arrow"
@click="toSelect('8')"
/> -->
<van-field
<!-- <van-field
v-model="userInfo.workcompany"
label="工作单位"
name="工作单位"
@@ -305,7 +305,8 @@
maxlength="50"
clearable
:readonly="isAppnt"
/>
/> -->
<SearchField v-model="userInfo.workcompany" label="工作单位" placeholder="无工作单位,请输入无" v-validate="'required'" name="工作单位" />
<!-- <van-field
v-model="areaName"
readonly