hujun
e5406c23a6
修复匹配详情中“用户自填未经核验”等来源说明，清理未参与项的橙色注意提示，修正贷款统计口径文案；补充公积金完整可选路径提取逻辑，确保明确无额外时长要求的公积金分支可正确识别并通过。
45 lines
3.2 KiB
Plaintext
45 lines
3.2 KiB
Plaintext
<template>
|
|
<view class="province-row" @click="open"><text class="province-label">所在省份</text><text :class="isSelected ? 'province-value' : 'province-value province-placeholder'">{{ isSelected ? modelValue : '请选择省份' }}</text><AppIcon name="chevron-right" :size="28" /></view>
|
|
<view v-if="opened" class="province-mask" @click="cancel">
|
|
<view class="province-sheet" @click.stop="noop">
|
|
<view class="province-toolbar"><text class="province-title">选择所在省份</text><text class="province-cancel" @click="cancel">取消</text></view>
|
|
<scroll-view scroll-y class="province-list" :scroll-top="selectedTop">
|
|
<view v-for="item in provinceOptions" :key="item.code" :id="'province-' + item.code" :class="item.name == modelValue ? 'province-option province-active' : 'province-option'" @click="choose(item.name)"><text class="province-option-name">{{ item.name }}</text><text v-if="item.name == modelValue" class="province-check">✓</text></view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script setup lang="uts">
|
|
import AppIcon from '@/components/AppIcon.uvue'
|
|
import { provinceOptions, provinceCodeForName } from '@/services/cities.uts'
|
|
const props = defineProps({ modelValue: { type: String, default: '' } })
|
|
const emit = defineEmits(['update:modelValue'])
|
|
const opened = ref(false)
|
|
const selectedTop = ref(0)
|
|
const isSelected = computed((): boolean => provinceCodeForName(props.modelValue) != null)
|
|
const noop = () => {}
|
|
const open = () => {
|
|
uni.hideKeyboard(); selectedTop.value = 0; opened.value = true
|
|
const index = provinceOptions.findIndex((item): boolean => item.name == props.modelValue)
|
|
nextTick(() => { selectedTop.value = Math.max(0, index - 2) * 94 * uni.getWindowInfo().windowWidth / 750 })
|
|
}
|
|
const cancel = () => { opened.value = false }
|
|
const choose = (name: string) => { emit('update:modelValue', name); opened.value = false }
|
|
</script>
|
|
<style>
|
|
.province-row { min-height: 106rpx; flex-direction: row; align-items: center; border-bottom: 1rpx solid #edf1f6; }
|
|
.province-label { font-size: 28rpx; color: #29374e; margin-right: 16rpx; flex-shrink: 0; }
|
|
.province-value { flex: 1; min-width: 0; margin-right: 12rpx; text-align: right; color: #22324a; font-size: 27rpx; line-height: 38rpx; }
|
|
.province-placeholder { color: #8995a7; }
|
|
.province-mask { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; background-color: rgba(20, 32, 52, 0.4); justify-content: flex-end; }
|
|
.province-sheet { background-color: #ffffff; border-top-left-radius: 24rpx; border-top-right-radius: 24rpx; padding-bottom: 48rpx; }
|
|
.province-toolbar { height: 112rpx; flex-direction: row; align-items: center; justify-content: space-between; padding-left: 32rpx; padding-right: 32rpx; }
|
|
.province-title { font-size: 30rpx; color: #22324a; font-weight: 600; }
|
|
.province-cancel { font-size: 28rpx; color: #6e7e95; padding: 16rpx; }
|
|
.province-list { height: 650rpx; }
|
|
.province-option { height: 94rpx; padding-left: 40rpx; padding-right: 40rpx; flex-direction: row; align-items: center; justify-content: space-between; }
|
|
.province-option-name { color: #22324a; font-size: 28rpx; }
|
|
.province-active { background-color: #eef4ff; }
|
|
.province-check { color: #2468ec; font-size: 30rpx; }
|
|
</style>
|