141 lines
4.3 KiB
Vue
141 lines
4.3 KiB
Vue
<template>
|
||
<uni-popup ref="popup" type="center" :mask-click="false">
|
||
<view class="bg-white rounded overflow-hidden" style="width: 690rpx;">
|
||
<view class="flex items-center justify-between px-15 py-12 border-b">
|
||
<view class="text-lg font-semibold text-dark">通过档案手机号验证</view>
|
||
<uni-icons type="closeempty" :size="24" color="#999" @click="close"></uni-icons>
|
||
</view>
|
||
<view class="px-15 pt-15 text-base text-dark">
|
||
您在"{{ corpName }}"医客通平台已存在档案，请选择档案绑定。
|
||
</view>
|
||
<scroll-view scroll-y="true" class="popup-content-scroll">
|
||
<view class="px-15 py-12">
|
||
<view v-for="customer in list" :key="customer._id" class="flex items-center p-10 mb-10 rounded-sm bg-gray"
|
||
@click="id = customer._id">
|
||
<view class="flex-grow w-0 mr-5 text-base leading-normal text-dark">
|
||
<view class="flex items-center">
|
||
<view class="flex-shrink-0 min-w-60">姓名：</view>
|
||
<view>{{ customer.maskName }}</view>
|
||
</view>
|
||
<!-- <view class="flex items-center">
|
||
<view class="flex-shrink-0 min-w-60">性别：</view>
|
||
<view>{{ customer.sex || '--' }}</view>
|
||
</view> -->
|
||
<view class="flex items-center">
|
||
<view class="flex-shrink-0 min-w-60">手机号：</view>
|
||
<view>{{ customer.mobile }}</view>
|
||
</view>
|
||
</view>
|
||
<image class="check-icon" :src="`/static/form/${id === customer._id ? 'checked' : 'uncheck'}.svg`"></image>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
<view class="footer-buttons">
|
||
<button-footer hideden-shadow confirmText="确定" :showCancel="false" @confirm="confirm()" />
|
||
</view>
|
||
<view class="flex justify-end px-15 pb-10">
|
||
<view class="mr-5 text-base text-dark">以上档案都不对，可以：</view>
|
||
<view class="px-10 text-base leading-normal text-primary border-auto rounded-sm" @click="close()">新增档案</view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
<verify-name-popup :visible="showVerifyPopup" :customer="customer" @close="onVerifyClose"
|
||
@confirm="onVerifyConfirm" />
|
||
<verify-popup :visible="showIdNoPopup" :customer="customer" @close="showIdNoPopup = false" @confirm="onVerifyConfirm" />
|
||
</template>
|
||
|
||
<script setup>
|
||
import { computed, ref, watch } from 'vue';
|
||
import { toast } from '@/utils/widget';
|
||
|
||
import ButtonFooter from '@/components/button-footer.vue';
|
||
import VerifyNamePopup from './verify-name-popup.vue';
|
||
import verifyPopup from './verify-popup.vue';
|
||
|
||
const emits = defineEmits(['close', 'confirm'])
|
||
const props = defineProps({
|
||
corpName: {
|
||
type: String,
|
||
default: ''
|
||
},
|
||
customers: {
|
||
type: Array,
|
||
default: () => []
|
||
},
|
||
enableHis: {
|
||
type: Boolean,
|
||
default: false
|
||
},
|
||
visible: {
|
||
type: Boolean,
|
||
default: false
|
||
}
|
||
})
|
||
const popup = ref()
|
||
const id = ref('')
|
||
const showVerifyPopup = ref(false)
|
||
const showIdNoPopup = ref(false)
|
||
const list = computed(() => props.customers.map(i => {
|
||
const name = typeof i.name === 'string' ? i.name.trim() : '';
|
||
const maskName = name.length > 1 ? name.slice(0, 1) + '*'.repeat(name.length - 1) : '*';
|
||
return {
|
||
...i,
|
||
maskName
|
||
}
|
||
}))
|
||
|
||
const customer = computed(() => {
|
||
const selected = list.value.find(i => i._id === id.value && i.idNo)
|
||
return selected ? selected : {}
|
||
})
|
||
|
||
function close() {
|
||
emits('close')
|
||
}
|
||
|
||
function confirm() {
|
||
const selected = props.customers.find(i => i._id === id.value && id.value);
|
||
if (!selected) {
|
||
return toast('请选择档案')
|
||
}
|
||
if (props.enableHis && selected.idNo && selected.isConnectHis) {
|
||
showIdNoPopup.value = true
|
||
} else {
|
||
showVerifyPopup.value = true
|
||
}
|
||
}
|
||
|
||
function onVerifyClose() {
|
||
showVerifyPopup.value = false
|
||
}
|
||
|
||
function onVerifyConfirm() {
|
||
emits('confirm', id.value)
|
||
}
|
||
|
||
watch(() => props.visible, n => {
|
||
if (n) {
|
||
popup.value && popup.value.open();
|
||
if (props.customers && props.customers.length === 1 && props.customers[0] && props.customers[0]._id) {
|
||
id.value = props.customers[0]._id
|
||
}
|
||
} else {
|
||
popup.value && popup.value.close()
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.min-w-60 {
|
||
min-width: 120rpx;
|
||
}
|
||
|
||
.check-icon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
}
|
||
|
||
.popup-content-scroll {
|
||
max-height: 50vh;
|
||
}
|
||
</style> |