|
@@ -62,7 +62,7 @@
|
|
|
<picker style="flex:1" mode="selector" :range="institutionList" range-key="name" @change="onInstitutionChange">
|
|
<picker style="flex:1" mode="selector" :range="institutionList" range-key="name" @change="onInstitutionChange">
|
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.institution }">
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.institution }">
|
|
|
{{ formData.institution || '请选择机构' }}
|
|
{{ formData.institution || '请选择机构' }}
|
|
|
- <text class="arrow-right">></text>
|
|
|
|
|
|
|
+ <image class="w36 h36" src="@/static/image/icon_my_more.png" mode=""></image>
|
|
|
</view>
|
|
</view>
|
|
|
</picker>
|
|
</picker>
|
|
|
</view>
|
|
</view>
|
|
@@ -75,7 +75,7 @@
|
|
|
<picker style="flex:1" mode="selector" :range="departmentList" range-key="name" @change="onDepartmentChange">
|
|
<picker style="flex:1" mode="selector" :range="departmentList" range-key="name" @change="onDepartmentChange">
|
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.department }">
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.department }">
|
|
|
{{ formData.department || '请选择科室' }}
|
|
{{ formData.department || '请选择科室' }}
|
|
|
- <text class="arrow-right">></text>
|
|
|
|
|
|
|
+ <image class="w36 h36" src="@/static/image/icon_my_more.png" mode=""></image>
|
|
|
</view>
|
|
</view>
|
|
|
</picker>
|
|
</picker>
|
|
|
</view>
|
|
</view>
|
|
@@ -85,10 +85,10 @@
|
|
|
<text class="required">*</text>
|
|
<text class="required">*</text>
|
|
|
<text>职称</text>
|
|
<text>职称</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <picker mode="selector" :range="titleList" range-key="name" @change="onTitleChange">
|
|
|
|
|
|
|
+ <picker style="flex:1" mode="selector" :range="titleList" range-key="name" @change="onTitleChange">
|
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.title }">
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.title }">
|
|
|
{{ formData.title || '请选择职称' }}
|
|
{{ formData.title || '请选择职称' }}
|
|
|
- <text class="arrow-right">></text>
|
|
|
|
|
|
|
+ <image class="w36 h36" src="@/static/image/icon_my_more.png" mode=""></image>
|
|
|
</view>
|
|
</view>
|
|
|
</picker>
|
|
</picker>
|
|
|
</view>
|
|
</view>
|
|
@@ -99,27 +99,35 @@
|
|
|
<view class="section-header">
|
|
<view class="section-header">
|
|
|
<view class="section-indicator"></view>
|
|
<view class="section-indicator"></view>
|
|
|
<text class="section-title">身份证明</text>
|
|
<text class="section-title">身份证明</text>
|
|
|
|
|
+ <view class="section-subtitle">以下资质任意选填其中一个</view>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="section-subtitle">以下资质任意选填其中一个</view>
|
|
|
|
|
|
|
+
|
|
|
|
|
|
|
|
<!-- 医师职业证 -->
|
|
<!-- 医师职业证 -->
|
|
|
<view class="certificate-item">
|
|
<view class="certificate-item">
|
|
|
<view class="certificate-header">
|
|
<view class="certificate-header">
|
|
|
- <view class="certificate-title">医师职业证</view>
|
|
|
|
|
|
|
+ <view class="x-f">
|
|
|
|
|
+ <view class="certificate-title">医师职业证</view>
|
|
|
|
|
+ <view class="certificate-tip">-至少需上传编码页和执业点页</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
<view class="example-btn" @click="goToPracticeExample">
|
|
<view class="example-btn" @click="goToPracticeExample">
|
|
|
- <text class="example-icon">①</text>
|
|
|
|
|
|
|
+ <image class="w28 h28" src="@/static/image/icon_example.png" mode=""></image>
|
|
|
<text>示例</text>
|
|
<text>示例</text>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="certificate-tip">至少需上传编码页和执业点页</view>
|
|
|
|
|
|
|
+
|
|
|
<view class="upload-grid">
|
|
<view class="upload-grid">
|
|
|
<view class="upload-item" v-for="(image, index) in formData.practiceCertificate" :key="index">
|
|
<view class="upload-item" v-for="(image, index) in formData.practiceCertificate" :key="index">
|
|
|
<image class="uploaded-image" :src="image" mode="aspectFill" @click="previewImage(image, formData.practiceCertificate)"></image>
|
|
<image class="uploaded-image" :src="image" mode="aspectFill" @click="previewImage(image, formData.practiceCertificate)"></image>
|
|
|
<view class="delete-btn" @click="removePracticeImage(index)">×</view>
|
|
<view class="delete-btn" @click="removePracticeImage(index)">×</view>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="upload-item upload-placeholder" @click="choosePracticeImage" v-if="formData.practiceCertificate.length < 2">
|
|
<view class="upload-item upload-placeholder" @click="choosePracticeImage" v-if="formData.practiceCertificate.length < 2">
|
|
|
- <text class="camera-icon">📷</text>
|
|
|
|
|
- <text class="upload-text">点击上传</text>
|
|
|
|
|
|
|
+ <image class="bg" src="@/static/image/img_idcard_Front.png" mode=""></image>
|
|
|
|
|
+ <view class="img-btn">
|
|
|
|
|
+ <image class="w56 h56" src="@/static/image/icon_uplodeidcard.png" mode=""></image>
|
|
|
|
|
+ <text class="upload-text">点击上传</text>
|
|
|
|
|
+ </view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
@@ -129,7 +137,7 @@
|
|
|
<view class="certificate-header">
|
|
<view class="certificate-header">
|
|
|
<view class="certificate-title">医师职称证/工牌</view>
|
|
<view class="certificate-title">医师职称证/工牌</view>
|
|
|
<view class="example-btn" @click="goToTitleExample">
|
|
<view class="example-btn" @click="goToTitleExample">
|
|
|
- <text class="example-icon">①</text>
|
|
|
|
|
|
|
+ <image class="w28 h28" src="@/static/image/icon_example.png" mode=""></image>
|
|
|
<text>示例</text>
|
|
<text>示例</text>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
@@ -139,8 +147,12 @@
|
|
|
<view class="delete-btn" @click="removeTitleImage(index)">×</view>
|
|
<view class="delete-btn" @click="removeTitleImage(index)">×</view>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="upload-item upload-placeholder" @click="chooseTitleImage">
|
|
<view class="upload-item upload-placeholder" @click="chooseTitleImage">
|
|
|
- <text class="camera-icon">📷</text>
|
|
|
|
|
- <text class="upload-text">点击上传</text>
|
|
|
|
|
|
|
+ <image class="bg" src="@/static/image/img_idcard_Front.png" mode=""></image>
|
|
|
|
|
+ <view class="img-btn">
|
|
|
|
|
+ <image class="w56 h56" src="@/static/image/icon_uplodeidcard.png" mode=""></image>
|
|
|
|
|
+ <text class="upload-text">点击上传</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
@@ -158,10 +170,10 @@
|
|
|
<text class="required">*</text>
|
|
<text class="required">*</text>
|
|
|
<text>开户行</text>
|
|
<text>开户行</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <picker mode="selector" :range="bankList" range-key="name" @change="onBankChange">
|
|
|
|
|
|
|
+ <picker style="flex:1" mode="selector" :range="bankList" range-key="name" @change="onBankChange">
|
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.bank }">
|
|
<view class="form-input picker-input" :class="{ placeholder: !formData.bank }">
|
|
|
{{ formData.bank || '请选择开户行' }}
|
|
{{ formData.bank || '请选择开户行' }}
|
|
|
- <text class="arrow-right">></text>
|
|
|
|
|
|
|
+ <image class="w36 h36" src="@/static/image/icon_my_more.png" mode=""></image>
|
|
|
</view>
|
|
</view>
|
|
|
</picker>
|
|
</picker>
|
|
|
</view>
|
|
</view>
|
|
@@ -195,22 +207,23 @@
|
|
|
|
|
|
|
|
<!-- 底部操作栏 -->
|
|
<!-- 底部操作栏 -->
|
|
|
<view class="bottom-bar">
|
|
<view class="bottom-bar">
|
|
|
- <view class="agreement-checkbox">
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <view class="action-buttons">
|
|
|
|
|
+ <view class="btn btn-cancel" @click="handleCancel">暂不认证</view>
|
|
|
|
|
+ <view class="btn btn-submit" @click="handleSubmit">提交认证</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="agreement-checkbox x-c">
|
|
|
<checkbox-group @change="onAgreementChange">
|
|
<checkbox-group @change="onAgreementChange">
|
|
|
<label class="checkbox-label">
|
|
<label class="checkbox-label">
|
|
|
<checkbox value="agree" :checked="agreed" color="#388BFF" />
|
|
<checkbox value="agree" :checked="agreed" color="#388BFF" />
|
|
|
<text class="agreement-text">
|
|
<text class="agreement-text">
|
|
|
我已阅读并同意
|
|
我已阅读并同意
|
|
|
- <text class="link-text" @click.stop="goToUserAgreement">《用户协议》</text>、
|
|
|
|
|
|
|
+ <text class="link-text" @click.stop="goToUserAgreement">《用户协议》</text>
|
|
|
<text class="link-text" @click.stop="goToInformedConsent">《知情同意书》</text>
|
|
<text class="link-text" @click.stop="goToInformedConsent">《知情同意书》</text>
|
|
|
</text>
|
|
</text>
|
|
|
</label>
|
|
</label>
|
|
|
</checkbox-group>
|
|
</checkbox-group>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="action-buttons">
|
|
|
|
|
- <view class="btn btn-cancel" @click="handleCancel">暂不认证</view>
|
|
|
|
|
- <view class="btn btn-submit" @click="handleSubmit">提交认证</view>
|
|
|
|
|
- </view>
|
|
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</template>
|
|
</template>
|
|
@@ -550,7 +563,7 @@ export default {
|
|
|
.section-header {
|
|
.section-header {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
- margin-bottom: 24rpx;
|
|
|
|
|
|
|
+ margin-bottom: 32rpx;
|
|
|
|
|
|
|
|
.section-indicator {
|
|
.section-indicator {
|
|
|
width: 6rpx;
|
|
width: 6rpx;
|
|
@@ -570,7 +583,7 @@ export default {
|
|
|
.section-subtitle {
|
|
.section-subtitle {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
color: #999;
|
|
color: #999;
|
|
|
- margin-bottom: 24rpx;
|
|
|
|
|
|
|
+ //margin-bottom: 24rpx;
|
|
|
margin-left: 22rpx;
|
|
margin-left: 22rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -623,17 +636,19 @@ export default {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.certificate-item {
|
|
.certificate-item {
|
|
|
|
|
+ padding-bottom: 32rpx;
|
|
|
margin-bottom: 32rpx;
|
|
margin-bottom: 32rpx;
|
|
|
-
|
|
|
|
|
|
|
+ border-bottom: 2rpx solid #F5F5F5;
|
|
|
&:last-child {
|
|
&:last-child {
|
|
|
margin-bottom: 0;
|
|
margin-bottom: 0;
|
|
|
|
|
+ border-bottom: 0;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.certificate-header {
|
|
.certificate-header {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
- margin-bottom: 16rpx;
|
|
|
|
|
|
|
+ margin-bottom: 24rpx;
|
|
|
|
|
|
|
|
.certificate-title {
|
|
.certificate-title {
|
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
@@ -665,7 +680,7 @@ export default {
|
|
|
.certificate-tip {
|
|
.certificate-tip {
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
color: #999;
|
|
color: #999;
|
|
|
- margin-bottom: 16rpx;
|
|
|
|
|
|
|
+ // margin-bottom: 16rpx;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.upload-grid {
|
|
.upload-grid {
|
|
@@ -674,23 +689,29 @@ export default {
|
|
|
flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
.upload-item {
|
|
.upload-item {
|
|
|
- width: 200rpx;
|
|
|
|
|
- height: 200rpx;
|
|
|
|
|
|
|
+ width: 310rpx;
|
|
|
|
|
+ height: 176rpx;
|
|
|
border-radius: 8rpx;
|
|
border-radius: 8rpx;
|
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
position: relative;
|
|
|
-
|
|
|
|
|
.uploaded-image {
|
|
.uploaded-image {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+ .bg{
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+ }
|
|
|
.delete-btn {
|
|
.delete-btn {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- top: 8rpx;
|
|
|
|
|
- right: 8rpx;
|
|
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ right: 0;
|
|
|
width: 40rpx;
|
|
width: 40rpx;
|
|
|
height: 40rpx;
|
|
height: 40rpx;
|
|
|
|
|
+ line-height: 40rpx;
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
border-radius: 50%;
|
|
border-radius: 50%;
|
|
|
display: flex;
|
|
display: flex;
|
|
@@ -700,14 +721,20 @@ export default {
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- & .upload-placeholder {
|
|
|
|
|
|
|
+ &.upload-placeholder {
|
|
|
background: #f5f5f5;
|
|
background: #f5f5f5;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
|
- border: 2rpx dashed #ddd;
|
|
|
|
|
-
|
|
|
|
|
|
|
+ // border: 2rpx dashed #ddd;
|
|
|
|
|
+ .img-btn{
|
|
|
|
|
+ z-index: 1;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+ }
|
|
|
.camera-icon {
|
|
.camera-icon {
|
|
|
font-size: 60rpx;
|
|
font-size: 60rpx;
|
|
|
margin-bottom: 8rpx;
|
|
margin-bottom: 8rpx;
|
|
@@ -730,12 +757,12 @@ export default {
|
|
|
right: 0;
|
|
right: 0;
|
|
|
background: #fff;
|
|
background: #fff;
|
|
|
padding: 24rpx;
|
|
padding: 24rpx;
|
|
|
- border-top: 1rpx solid #f0f0f0;
|
|
|
|
|
|
|
+ // border-top: 1rpx solid #f0f0f0;
|
|
|
z-index: 100;
|
|
z-index: 100;
|
|
|
|
|
|
|
|
.agreement-checkbox {
|
|
.agreement-checkbox {
|
|
|
margin-bottom: 24rpx;
|
|
margin-bottom: 24rpx;
|
|
|
-
|
|
|
|
|
|
|
+ margin-top: 20rpx;
|
|
|
.checkbox-label {
|
|
.checkbox-label {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: flex-start;
|
|
align-items: flex-start;
|
|
@@ -766,7 +793,7 @@ export default {
|
|
|
border-radius: 8rpx;
|
|
border-radius: 8rpx;
|
|
|
font-size: 32rpx;
|
|
font-size: 32rpx;
|
|
|
font-weight: 500;
|
|
font-weight: 500;
|
|
|
-
|
|
|
|
|
|
|
+ border-radius: 200rpx 200rpx 200rpx 200rpx;
|
|
|
&.btn-cancel {
|
|
&.btn-cancel {
|
|
|
background: #fff;
|
|
background: #fff;
|
|
|
border: 2rpx solid #388BFF;
|
|
border: 2rpx solid #388BFF;
|