<template><view class="full"><view class="sticky-box"><!-- 搜索 --><uni-search-bar class="unisearchbar" radius="5" placeholder="请输入搜索关键词" clearButton="auto" bgColor="#EEEEEE"cancelButton="none" @input="input" /><!-- 搜索 --><view class="doctor"><!-- 全部科室 --><view class="doctor_l"><view class="uni-list-cell-db"><picker @change="bindPickerChange" :value="form.id" :range-key="'name'" :range="deptLists"><text v-if="form.id"class="uni-input">{{deptLists.find(item => item.id == form.id).name}}</text><text v-else style="color: #000;">全部科室</text><uni-icons type="bottom" size="15"></uni-icons></picker></view></view><!-- 全部职称 --><view class="doctor_r"><view class="uni-list-cell-db"><picker @change="bindPickerChangeone" :value="form.infoCode" :range-key="'infoName'":range="findByTypeCodeList"><text v-if="form.infoCode"class="uni-input">{{findByTypeCodeList.find(item => item.infoCode == form.infoCode).infoName}}</text><text v-else style="color: #000;">全部职称</text><uni-icons type="bottom" size="15"></uni-icons></picker></view></view></view></view><view><doctorList :doctorList="doctorList"></doctorList></view></view>
</template><script>import doctorList from '../../components/doctorList/index.vue'import {tranfrom} from '@/utils/util.js'import {selectUserList,selectDeptList} from '@/api/home'export default {components: {doctorList},data() {return {//选择切换form: {id: '',infoCode: ''},// 初始值datesize: {pageNum: 1,pageSize: 10,params: {userName: "",deptId: "",ysZc: ""}},deptLists: [],findByTypeCodeList: [],doctorList: [],};},watch: {// 全部职能'$store.state.findByTypeCode'(newVal, oldVal) {this.findByTypeCodeList = this.$store.state.findByTypeCode},// 全部科室'$store.state.selectDeptList'(newVal, oldVal) {this.deptLists = this.$store.state.selectDeptList}},created() {this.$store.commit('findByTypeCode')this.$store.commit('selectDeptList')this.fetchSwiperList(this.datesize)},onPullDownRefresh() {this.form.id = ""this.form.infoCode = ""this.datesize.pageSize = 10this.fetchSwiperList(this.datesize)},onReachBottom() {this.datesize.pageSize = this.datesize.pageSize + 5this.fetchSwiperList(this.datesize)},methods: {async fetchSwiperList(date) {await selectUserList(date).then(res => {res.data.rows.map(it => {it.ysZc = tranfrom(this.findByTypeCodeList,it.ysZc)})this.doctorList = res.data.rows})},input(res) {this.fetchSwiperList({"pageNum": 1,"pageSize": 9999,"params": {"userName": res,"deptId": "","ysZc": ""}})},// 选择全部科室bindPickerChange(e) {this.form.id = this.deptLists[e.detail.value].idthis.fetchSwiperList({"pageNum": 1,"pageSize": 9999,"params": {"userName": "","deptId": this.form.id,"ysZc": ""}})},// 选择全部职称bindPickerChangeone(e) {this.form.infoCode = this.findByTypeCodeList[e.detail.value].infoCodethis.fetchSwiperList({"pageNum": 1,"pageSize": 999,"params": {"userName": "","deptId": "","ysZc": this.form.infoCode}})},}}
</script><style lang="scss" scoped>.full {width: 750upx;margin: 0;padding: 0;}.sticky-box {/* #ifndef APP-PLUS-NVUE */// display: flex;position: -webkit-sticky;/* #endif */position: sticky;top: var(--window-top);z-index: 99;flex-direction: row;margin: 0px;// padding: 15px 0 15px 0;background-color: #F4F5F6;// border-bottom-style: solid;// border-bottom-color: #E2E2E2;}.unisearchbar {width: 100%;}.doctor {height: 100rpx;display: flex;justify-content: space-around;align-items: center;border-top: 1px solid #e1e1e1;border-bottom: 1px solid #e1e1e1;.doctor_l {width: 50%;height: 100rpx;line-height: 100rpx;text-align: center;border-right: 1px solid #e1e1e1;}.doctor_r {width: 50%;height: 100rpx;line-height: 100rpx;text-align: center;}}.textcenter {text-align: center;font-size: 18px;}
</style>