Skip to content

杨炀 / ztx_wx_gzt

Go to a project
Toggle navigation
Toggle navigation pinning
49d94eb2 by 张猛
Options

个人中心

1 parent 59468e57
Inline Side-by-side
Showing 2 changed files with 1737 additions and 1628 deletions
personal/addVip_per.vue
1 <template> 1 <template>
2 <view> 2 <view>
3 <uni-segmented-control class="whitebg" :current="current" :values="items" @clickItem="onClickItem" 3 <uni-segmented-control :current="current" :values="items" activeColor="#C40F18" class="whitebg"
4 styleType="text" activeColor="#C40F18"></uni-segmented-control> 4 styleType="text" @clickItem="onClickItem"></uni-segmented-control>
5 <view class="hasfixedbottom"> 5 <view class="hasfixedbottom">
6 <view> 6 <view>
7 <uni-forms ref="baseForm" :border="true" :modelValue="baseFormData" label-width="80"> 7 <uni-forms ref="baseForm" :border="true" :modelValue="baseFormData" label-width="80">
8 <view class="nolineform"> 8 <view class="nolineform">
9 <uni-forms-item label="姓名" required name="name" v-show="current === 0"> 9 <uni-forms-item v-show="current === 0" label="姓名" name="name" required>
10 <uni-easyinput :styles="inputstyle" :clearable='false' :placeholderStyle="placeholderStyle" 10 <uni-easyinput v-model="baseFormData.name" :clearable='false' :placeholderStyle="placeholderStyle"
11 v-model="baseFormData.name" placeholder="请输入姓名" /> 11 :styles="inputstyle" placeholder="请输入姓名"/>
12 </uni-forms-item> 12 </uni-forms-item>
13 <uni-forms-item label="证件类型" required name="idcType"> 13 <uni-forms-item label="证件类型" name="idcType" required>
14 <uni-data-select v-model="baseFormData.idcType" style="width: 360rpx;" 14 <uni-data-select v-model="baseFormData.idcType" :clear="false"
15 @change="changeIdcType" :clear="false" :disabled="current === 0" 15 :disabled="current === 0" :localdata="idcTypeList" style="width: 360rpx;"
16 :localdata="idcTypeList"></uni-data-select> 16 @change="changeIdcType"></uni-data-select>
17 </uni-forms-item> 17 </uni-forms-item>
18 <uni-forms-item label="证件照" required v-show="current === 1"> 18 <uni-forms-item v-show="current === 1" label="证件照" required>
19 <view class="upCard"> 19 <view class="upCard">
20 <uni-file-picker v-model="cardObj" @delete="delimgFont" return-type="object" limit="1" 20 <uni-file-picker v-model="cardObj" :image-styles="imageStylesZJ" limit="1" return-type="object"
21 @select="upIdCardImgFront" :image-styles="imageStylesZJ"> 21 @delete="delimgFont" @select="upIdCardImgFront">
22 <image v-if="!baseFormData.card" class="sfz" 22 <image v-if="!baseFormData.card" :src="config.baseUrl_api+'/fs/static/login/sfz.png'"
23 :src="config.baseUrl_api+'/fs/static/login/sfz.png'"> 23 class="sfz">
24 </image> 24 </image>
25 </uni-file-picker> 25 </uni-file-picker>
26 </view> 26 </view>
27 </uni-forms-item> 27 </uni-forms-item>
28 <uni-forms-item label="姓名" required name="name" v-show="current === 1"> 28 <uni-forms-item v-show="current === 1" label="姓名" name="name" required>
29 <text v-if="disabledName">{{baseFormData.name}}</text> 29 <text v-if="disabledName">{{ baseFormData.name }}</text>
30 <uni-easyinput :styles="inputstyle" :clearable='false' :placeholderStyle="placeholderStyle" 30 <uni-easyinput v-else v-model="baseFormData.name" :clearable='false'
31 v-model="baseFormData.name" v-else placeholder="请输入姓名" /> 31 :placeholderStyle="placeholderStyle" :styles="inputstyle" placeholder="请输入姓名"/>
32 </uni-forms-item> 32 </uni-forms-item>
33 <uni-forms-item label="证件号码" required name="idcCode" v-show="current === 0"> 33 <uni-forms-item v-show="current === 0" label="证件号码" name="idcCode" required>
34 <uni-easyinput :styles="inputstyle" :clearable='false' :placeholderStyle="placeholderStyle" 34 <uni-easyinput v-model="baseFormData.idcCode" :clearable='false' :placeholderStyle="placeholderStyle"
35 v-model="baseFormData.idcCode" @blur="giveBirthDay" placeholder="请输入证件号码" /> 35 :styles="inputstyle" placeholder="请输入证件号码" @blur="giveBirthDay"/>
36 </uni-forms-item> 36 </uni-forms-item>
37 <uni-forms-item label="证件号码" required name="idcCode" v-show="current === 1"> 37 <uni-forms-item v-show="current === 1" label="证件号码" name="idcCode" required>
38 <text>{{baseFormData.idcCode}}</text> 38 <text>{{ baseFormData.idcCode }}</text>
39 </uni-forms-item> 39 </uni-forms-item>
40 <uni-forms-item label="性别" required name="sex"> 40 <uni-forms-item label="性别" name="sex" required>
41 <text v-if="baseFormData.sex=='0'">男</text> 41 <text v-if="baseFormData.sex=='0'">男</text>
42 <text v-else-if="baseFormData.sex=='1'">女</text> 42 <text v-else-if="baseFormData.sex=='1'">女</text>
43 <!-- <uni-data-checkbox v-model="baseFormData.sex" @change="changeSex" :localdata="sexs" /> --> 43 <!-- <uni-data-checkbox v-model="baseFormData.sex" @change="changeSex" :localdata="sexs" /> -->
44 </uni-forms-item> 44 </uni-forms-item>
45 <uni-forms-item label="出生日期" required name="birth"> 45 <uni-forms-item label="出生日期" name="birth" required>
46 {{baseFormData.birth?.slice(0,10)}} 46 {{ baseFormData.birth?.slice(0, 10) }}
47 <!-- <uni-datetime-picker type="date" placeholder="YYYY-MM-DD" :border='false' 47 <!-- <uni-datetime-picker type="date" placeholder="YYYY-MM-DD" :border='false'
48 :clear-icon="false" v-model="baseFormData.birth" /> --> 48 :clear-icon="false" v-model="baseFormData.birth" /> -->
49 </uni-forms-item> 49 </uni-forms-item>
50 <uni-forms-item label="联系方式" name="phone"> 50 <uni-forms-item label="联系方式" name="phone">
51 <uni-easyinput :styles="inputstyle" :placeholderStyle="placeholderStyle" 51 <uni-easyinput v-model="baseFormData.phone" :placeholderStyle="placeholderStyle"
52 v-model="baseFormData.phone" placeholder="请输入联系方式" /> 52 :styles="inputstyle" placeholder="请输入联系方式"/>
53 </uni-forms-item> 53 </uni-forms-item>
54 <uni-forms-item label="会员编号" name="perCode" v-if="baseFormData.perCode"> 54 <uni-forms-item v-if="baseFormData.perCode" label="会员编号" name="perCode">
55 <uni-easyinput :styles="inputstyle" :placeholderStyle="placeholderStyle" 55 <uni-easyinput v-model="baseFormData.perCode" :placeholderStyle="placeholderStyle"
56 v-model="baseFormData.perCode" placeholder="请输入会员编号" /> 56 :styles="inputstyle" placeholder="请输入会员编号"/>
57 </uni-forms-item> 57 </uni-forms-item>
58 <uni-forms-item label="会员有效期" name="validityDate" v-if="baseFormData.validityDate"> 58 <uni-forms-item v-if="baseFormData.validityDate" label="会员有效期" name="validityDate">
59 <uni-easyinput :styles="inputstyle" :placeholderStyle="placeholderStyle" 59 <uni-easyinput v-model="baseFormData.validityDate" :placeholderStyle="placeholderStyle"
60 v-model="baseFormData.validityDate" placeholder="请输入会员有效期" /> 60 :styles="inputstyle" placeholder="请输入会员有效期"/>
61 </uni-forms-item> 61 </uni-forms-item>
62 62
63 63
64 <!-- <uni-forms-item label="所在地区"> 64 <!-- <uni-forms-item label="所在地区">
65 <uni-data-picker class="fixUniFormItemStyle" v-model="baseFormData.cityId" 65 <uni-data-picker class="fixUniFormItemStyle" v-model="baseFormData.cityId"
66 :localdata="regionsList" popup-title="请选择所在地区"></uni-data-picker> 66 :localdata="regionsList" popup-title="请选择所在地区"></uni-data-picker>
67 </uni-forms-item> 67 </uni-forms-item>
68 <uni-forms-item label="详细地址"><uni-easyinput :styles="inputstyle" 68 <uni-forms-item label="详细地址"><uni-easyinput :styles="inputstyle"
69 :placeholderStyle="placeholderStyle" v-model="baseFormData.address" 69 :placeholderStyle="placeholderStyle" v-model="baseFormData.address"
70 placeholder="请输入详细地址" /></uni-forms-item> 70 placeholder="请输入详细地址" /></uni-forms-item>
71 71
72 <uni-forms-item label="头像" required> 72 <uni-forms-item label="头像" required>
73 <uni-file-picker v-model="photoArr" @delete="delPhoto" return-type="object" limit="1" 73 <uni-file-picker v-model="photoArr" @delete="delPhoto" return-type="object" limit="1"
74 @select="upPhoto" :del-ico="false" :image-styles="imageStylesTx"></uni-file-picker> 74 @select="upPhoto" :del-ico="false" :image-styles="imageStylesTx"></uni-file-picker>
75 <image mode="aspectFill" v-if="baseFormData.photo2" style="height:200rpx;width:200rpx;" :src="config.baseUrl_api + baseFormData.photo2"/> 75 <image mode="aspectFill" v-if="baseFormData.photo2" style="height:200rpx;width:200rpx;" :src="config.baseUrl_api + baseFormData.photo2"/>
76 </uni-forms-item> --> 76 </uni-forms-item> -->
77 </view> 77 </view>
78 </uni-forms> 78 </uni-forms>
79 </view> 79 </view>
80 </view> 80 </view>
81 <view class="fixed-agreeline"> 81 <view class="fixed-agreeline">
82 <view class="agreeline"> 82 <view class="agreeline">
83 <image @click="changeAgree(agree)" v-if="agree" 83 <image v-if="agree" :src="config.baseUrl_api+'/fs/static/login/xz_dwn@2x.png'"
84 :src="config.baseUrl_api+'/fs/static/login/xz_dwn@2x.png'"></image> 84 @click="changeAgree(agree)"></image>
85 <image @click="changeAgree(agree)" v-else :src="config.baseUrl_api+'/fs/static/login/xz@2x.png'"> 85 <image v-else :src="config.baseUrl_api+'/fs/static/login/xz@2x.png'" @click="changeAgree(agree)">
86 </image> 86 </image>
87 <view>我已阅读<text @click="openpopup">《入会须知》</text></view> 87 <view>我已阅读
88 </view> 88 <text @click="openpopup">《入会须知》</text>
89 </view> 89 </view>
90 <view class="fixedBottom"><button class="btn-red" @click="goSubmit">确 定</button></view> 90 </view>
91 91 </view>
92 <!-- 会员须知 --> 92 <view class="fixedBottom">
93 <uni-popup ref="popup" type="bottom" background-color="#fff" animation :disable-scroll="true" 93 <button class="btn-red" @click="goSubmit">确 定</button>
94 :mask-click="false"> 94 </view>
95 <view class="tt">入会须知</view> 95
96 <view class="popBody"> 96 <!-- 会员须知 -->
97 _{{baseFormData.name}}_欢迎您申请成为中国跆拳道协会（以下简称中国跆协）会员，请确保本次申请是经过您本人或监护人授权同意后的自愿行为，请您务必仔细阅读本入会须知。 97 <uni-popup ref="popup" :disable-scroll="true" :mask-click="false" animation background-color="#fff"
98 <br /> 98 type="bottom">
99 一、中国跆协会员分为个人会员和单位会员。 99 <view class="tt">入会须知</view>
100 <br /> 100 <view class="popBody">
101 二、成为本协会会员条件：遵守中国跆协章程和协会各项规章制度及相关决议，按期交纳会费，积极支持和参与中国跆拳道事业发展的社会各届人士或地方跆拳道协会、俱乐部、培训机构等，均可自愿申请成为中国跆协会员。<br /> 101 _{{ baseFormData.name }}_欢迎您申请成为中国跆拳道协会（以下简称中国跆协）会员，请确保本次申请是经过您本人或监护人授权同意后的自愿行为，请您务必仔细阅读本入会须知。
102 三、个人会员为在中国工作和生活的跆拳道爱好者，16 周岁以下应有监护人协助申请，会员须为中国公民。<br /> 102 <br/>
103 四、会员入会需向所在区域内中国跆协单位会员提出入会申请，并按程序报中国跆协批准，按规定交纳会费。<br /> 103 一、中国跆协会员分为个人会员和单位会员。
104 五、会员享有《中国跆拳道协会会员管理办法》规定的会员权利。 104 <br/>
105 <br /> 105 二、成为本协会会员条件：遵守中国跆协章程和协会各项规章制度及相关决议，按期交纳会费，积极支持和参与中国跆拳道事业发展的社会各届人士或地方跆拳道协会、俱乐部、培训机构等，均可自愿申请成为中国跆协会员。<br/>
106 六、会员应履行《中国跆拳道协会会员管理办法》规定的会员义务。 106 三、个人会员为在中国工作和生活的跆拳道爱好者，16 周岁以下应有监护人协助申请，会员须为中国公民。<br/>
107 <br /> 107 四、会员入会需向所在区域内中国跆协单位会员提出入会申请，并按程序报中国跆协批准，按规定交纳会费。<br/>
108 七、凡中国跆协会员，须按照《中国跆拳道协会会员会费标准（2021 版）》按时交纳年度会费。<br /> 108 五、会员享有《中国跆拳道协会会员管理办法》规定的会员权利。
109 八、会员行为违反《中国跆拳道协会会员管理办法》中规定的，按照相关处罚规定进行处理。<br /> 109 <br/>
110 九、其它会员相关内容请查看《中国跆拳道协会章程》《中国跆拳道协会会员管理办法》。<br /> 110 六、会员应履行《中国跆拳道协会会员管理办法》规定的会员义务。
111 111 <br/>
112 <button @click="closepopup" class="btn-red">我已阅读</button> 112 七、凡中国跆协会员，须按照《中国跆拳道协会会员会费标准（2021 版）》按时交纳年度会费。<br/>
113 </view> 113 八、会员行为违反《中国跆拳道协会会员管理办法》中规定的，按照相关处罚规定进行处理。<br/>
114 </uni-popup> 114 九、其它会员相关内容请查看《中国跆拳道协会章程》《中国跆拳道协会会员管理办法》。<br/>
115 115
116 <uni-popup ref="infoConfirm" type="center" :disable-scroll="true" :mask-click="false"> 116 <button class="btn-red" @click="closepopup">我已阅读</button>
117 <view class="tt">确认信息</view> 117 </view>
118 <view class="popBody"> 118 </uni-popup>
119 <view> 119
120 120 <uni-popup ref="infoConfirm" :disable-scroll="true" :mask-click="false" type="center">
121 </view> 121 <view class="tt">确认信息</view>
122 122 <view class="popBody">
123 <button @click="closepopup" class="btn-red">已确认</button> 123 <view>
124 </view> 124
125 </uni-popup> 125 </view>
126 126
127 </view> 127 <button class="btn-red" @click="closepopup">已确认</button>
128 </view>
129 </uni-popup>
130
131 </view>
128 </template> 132 </template>
129 133
130 <script setup> 134 <script setup>
131 import { 135 import {
132 onMounted, 136 onMounted,
133 ref 137 ref
134 } from 'vue' 138 } from 'vue'
135 import * as api from '@/common/api.js' 139 import * as api from '@/common/api.js'
136 import { 140 import {
137 onLoad 141 onLoad
138 } from '@dcloudio/uni-app' 142 } from '@dcloudio/uni-app'
139 import config from '@/config.js' 143 import config from '@/config.js'
140 import { 144 import {
141 wxLogin 145 wxLogin
142 } from '@/common/login.js'; 146 } from '@/common/login.js';
143 import * as aes2 from '@/common/utils.js' 147 import * as aes2 from '@/common/utils.js'
144 148
145 const current = ref(0) 149 const current = ref(0)
146 const popup = ref(null) 150 const popup = ref(null)
147 const infoConfirm = ref(null) 151 const infoConfirm = ref(null)
148 const agree = ref(false) 152 const agree = ref(false)
149 const perId = ref() 153 const perId = ref()
150 const photoArr = ref({}) 154 const photoArr = ref({})
151 const regionsList = ref([]) 155 const regionsList = ref([])
152 const cardObj = ref({}) 156 const cardObj = ref({})
153 const disabledName = ref(true) 157 const disabledName = ref(true)
154 const baseFormData = ref({ 158 const baseFormData = ref({
155 photo: '', 159 photo: '',
156 sex: '', 160 sex: '',
157 idcType: '0', 161 idcType: '0',
158 perType: '1', // （1：个人会员；2：教练；3：考官；4：裁判；5：临时会员；） 162 perType: '1', // （1：个人会员；2：教练；3：考官；4：裁判；5：临时会员；）
159 perCode:'', 163 perCode: '',
160 validityDate:'', 164 validityDate: '',
161 // multiDeptFlag: 1, 165 // multiDeptFlag: 1,
162 // isBlack: '1' 166 // isBlack: '1'
163 }) 167 })
164 const items = ref(['身份证添加', '证件照录入']) 168 const items = ref(['身份证添加', '证件照录入'])
165 const idcTypeList = ref([{ 169 const idcTypeList = ref([{
166 value: '0', 170 value: '0',
167 text: "身份证" 171 text: "身份证"
168 }, 172 },
169 { 173 {
170 value: '1', 174 value: '1',
171 text: "来往大陆(内地)通行证" 175 text: "来往大陆(内地)通行证"
172 }, 176 },
173 // { 177 // {
174 // value: '3', 178 // value: '3',
175 // text: "护照" 179 // text: "护照"
176 // }, 180 // },
177 { 181 {
178 value: '4', 182 value: '4',
179 text: '户口本' 183 text: '户口本'
180 }, 184 },
181 { 185 {
182 value: '5', 186 value: '5',
183 text: '香港身份证' 187 text: '香港身份证'
184 } 188 }
185 ]) 189 ])
186 const sexs = ref([{ 190 const sexs = ref([{
187 text: '女', 191 text: '女',
188 value: '1' 192 value: '1'
189 }, { 193 }, {
190 text: '男', 194 text: '男',
191 value: '0' 195 value: '0'
192 }]) 196 }])
193 const placeholderStyle = ref('text-align: right;font-size:30rpx') 197 const placeholderStyle = ref('text-align: right;font-size:30rpx')
194 const inputstyle = ref({ 198 const inputstyle = ref({
195 borderColor: '#fff', 199 borderColor: '#fff',
196 fontSize: '30rpx' 200 fontSize: '30rpx'
197 }) 201 })
198 const imageStylesTx = ref({ 202 const imageStylesTx = ref({
199 width: '210rpx', 203 width: '210rpx',
200 height: '280rpx', 204 height: '280rpx',
201 background: { 205 background: {
202 color: '#F4F6FA' 206 color: '#F4F6FA'
203 }, 207 },
204 border: { 208 border: {
205 radius: '2px' 209 radius: '2px'
206 } 210 }
207 }); 211 });
208 212
209 const imageStylesZJ = ref({ 213 const imageStylesZJ = ref({
210 width: '500rpx', 214 width: '500rpx',
211 height: '316rpx' 215 height: '316rpx'
212 }); 216 });
213 217
214 onLoad(async (option) => { 218 onLoad(async (option) => {
215 if (option.tab == '1') { 219 if (option.name && option.idcCode) {
216 current.value = 1 220 baseFormData.value.name = option.name
217 baseFormData.value.sourceFlag = 1 221 baseFormData.value.idcCode = option.idcCode
218 baseFormData.value.idcType = option.idcType || 0 222 giveBirthDay()
219 if (baseFormData.value.idcType == '3') { 223 }
220 disabledName.value = false 224
221 } else { 225 if (option.tab == '1') {
222 disabledName.value = true 226 current.value = 1
223 } 227 baseFormData.value.sourceFlag = 1
224 } 228 baseFormData.value.idcType = option.idcType || 0
225 // 如果传入了 perId，预填会员信息 229
226 if (option.perId) { 230 if (baseFormData.value.idcType == '3') {
227 perId.value = option.perId 231 disabledName.value = false
228 await fetchMemberInfo(option.perId) 232 } else {
229 } 233 disabledName.value = true
230 }) 234 }
231 235 }
232 onMounted(() => { 236 // 如果传入了 perId，预填会员信息
233 let openId = uni.getStorageSync('openId') 237 if (option.perId) {
234 if (!openId) { 238 perId.value = option.perId
235 wxLogin() 239 await fetchMemberInfo(option.perId)
236 } 240 }
237 }) 241 })
238 242
239 function getRegionsList() { 243 onMounted(() => {
240 api.regionsList().then(res => { 244 let openId = uni.getStorageSync('openId')
241 regionsList.value = res.data 245 if (!openId) {
242 }) 246 wxLogin()
243 } 247 }
244 248 })
245 // 根据 perId 获取会员信息预填表单 249
246 async function fetchMemberInfo(id) { 250 function getRegionsList() {
247 if (!id) return 251 api.regionsList().then(res => {
248 uni.showLoading({ title: '加载中...' }) 252 regionsList.value = res.data
249 try { 253 })
250 const res = await api.getInfo(id) 254 }
251 const data = res.data || {} 255
252 baseFormData.value.name = data.name || '' 256 // 根据 perId 获取会员信息预填表单
253 baseFormData.value.idcCode = data.idcCode || '' 257 async function fetchMemberInfo(id) {
254 baseFormData.value.idcType = data.idcType || '0' 258 if (!id) return
255 baseFormData.value.sex = data.sex || '' 259 uni.showLoading({title: '加载中...'})
256 baseFormData.value.birth = data.birth || '' 260 try {
257 baseFormData.value.phone = data.phone || '' 261 const res = await api.getInfo(id)
258 baseFormData.value.perCode = data.perCode || '' 262 const data = res.data || {}
259 baseFormData.value.validityDate = data.validityDate ? data.validityDate.slice(0, 10) : '' 263 baseFormData.value.name = data.name || ''
260 // 照片处理 264 baseFormData.value.idcCode = data.idcCode || ''
261 if (data.photo2) { 265 baseFormData.value.idcType = data.idcType || '0'
262 const photoUrl = data.photo2.indexOf('http') === -1 ? config.baseUrl_api + data.photo2 : data.photo2 266 baseFormData.value.sex = data.sex || ''
263 photoArr.value = { 267 baseFormData.value.birth = data.birth || ''
264 url: photoUrl, 268 baseFormData.value.phone = data.phone || ''
265 name: '头像', 269 baseFormData.value.perCode = data.perCode || ''
266 extname: 'jpg' 270 baseFormData.value.validityDate = data.validityDate ? data.validityDate.slice(0, 10) : ''
267 } 271 // 照片处理
268 baseFormData.value.photo = data.photo 272 if (data.photo2) {
269 baseFormData.value.photo2 = data.photo2 273 const photoUrl = data.photo2.indexOf('http') === -1 ? config.baseUrl_api + data.photo2 : data.photo2
270 } 274 photoArr.value = {
271 disabledName.value = true 275 url: photoUrl,
272 } catch (e) { 276 name: '头像',
273 console.error('获取会员信息失败', e) 277 extname: 'jpg'
274 } finally { 278 }
275 uni.hideLoading() 279 baseFormData.value.photo = data.photo
276 } 280 baseFormData.value.photo2 = data.photo2
277 } 281 }
278 282 disabledName.value = true
279 function onClickItem(e) { 283 } catch (e) {
280 if (current.value != e.currentIndex) { 284 console.error('获取会员信息失败', e)
281 current.value = e.currentIndex 285 } finally {
282 } 286 uni.hideLoading()
283 cardObj.value = {} 287 }
284 photoArr.value = {} 288 }
285 if (current.value == 0) { 289
286 baseFormData.value = { 290 function onClickItem(e) {
287 photo: '', 291 if (current.value != e.currentIndex) {
288 idcType: '0', 292 current.value = e.currentIndex
289 perType: '1' 293 }
290 } 294 cardObj.value = {}
291 } else { 295 photoArr.value = {}
292 baseFormData.value = { 296 if (current.value == 0) {
293 photo: '', 297 baseFormData.value = {
294 idcType: '0', 298 photo: '',
295 perType: '1', 299 idcType: '0',
296 sourceFlag: 1 300 perType: '1'
297 } 301 }
298 } 302 } else {
299 } 303 baseFormData.value = {
300 304 photo: '',
301 305 idcType: '0',
302 function changeAgree(item) { 306 perType: '1',
303 agree.value = !item 307 sourceFlag: 1
304 } 308 }
305 309 }
306 //身份证识别 310 }
307 function upIdCardImgFront(e) { 311
308 let file = e.tempFiles[0] 312
309 if (!file) { 313 function changeAgree(item) {
310 return 314 agree.value = !item
311 } 315 }
312 uni.showLoading({ 316
313 title: '加载中' 317 //身份证识别
314 }); 318 function upIdCardImgFront(e) {
315 baseFormData.value.card = e.tempFiles; 319 let file = e.tempFiles[0]
316 320 if (!file) {
317 // console.log(e) 321 return
318 // const formData = new FormData() 322 }
319 // formData.append('pic', e.tempFiles[0].file) 323 uni.showLoading({
320 api.carUrl(e.tempFilePaths[0], baseFormData.value.idcType).then(res => { 324 title: '加载中'
321 uni.hideLoading() 325 });
322 326 baseFormData.value.card = e.tempFiles;
323 if (res.data) { 327
324 baseFormData.value.sex = res.data.sex 328 // console.log(e)
325 baseFormData.value.birth = res.data.birth 329 // const formData = new FormData()
326 baseFormData.value.idcCode = res.data.code 330 // formData.append('pic', e.tempFiles[0].file)
327 baseFormData.value.name = res.data.name 331 api.carUrl(e.tempFilePaths[0], baseFormData.value.idcType).then(res => {
328 baseFormData.value.uuid = res.data.uuid 332 uni.hideLoading()
329 baseFormData.value.perCode = res.data.perCode ||'' 333
330 baseFormData.value.validityDate = res.data.validityDate?.slice(0,10) //去掉时分秒 334 if (res.data) {
331 // baseFormData.value.cityId = res.data.cityId 335 baseFormData.value.sex = res.data.sex
332 // baseFormData.value.address = res.data.address 336 baseFormData.value.birth = res.data.birth
333 } else { 337 baseFormData.value.idcCode = res.data.code
334 uni.showToast({ 338 baseFormData.value.name = res.data.name
335 title: res.msg, 339 baseFormData.value.uuid = res.data.uuid
336 duration: 2000, 340 baseFormData.value.perCode = res.data.perCode || ''
337 icon: 'none' 341 baseFormData.value.validityDate = res.data.validityDate?.slice(0, 10) //去掉时分秒
338 }) 342 // baseFormData.value.cityId = res.data.cityId
339 } 343 // baseFormData.value.address = res.data.address
340 344 } else {
341 }) 345 uni.showToast({
342 } 346 title: res.msg,
343 347 duration: 2000,
344 function upPhoto(e) { 348 icon: 'none'
345 const tempFilePaths = e.tempFilePaths; 349 })
346 const imgUrl = tempFilePaths[0] 350 }
347 if (!imgUrl) { 351
348 return 352 })
349 } 353 }
350 wx.cropImage({ 354
351 src: imgUrl, 355 function upPhoto(e) {
352 cropScale: '4:5', 356 const tempFilePaths = e.tempFilePaths;
353 success: function(resp) { 357 const imgUrl = tempFilePaths[0]
354 uni.showLoading({ 358 if (!imgUrl) {
355 title: '加载中' 359 return
356 }); 360 }
357 api.uploadImgCorpPhoto(resp.tempFilePath).then(data => { 361 wx.cropImage({
358 console.log(data) 362 src: imgUrl,
359 baseFormData.value.photo = data.data.fang; 363 cropScale: '4:5',
360 baseFormData.value.photo2 = data.data.yuan; 364 success: function (resp) {
361 photoArr.value = { 365 uni.showLoading({
362 url: config.baseUrl_api + baseFormData.value.photo, 366 title: '加载中'
363 name: '头像', 367 });
364 extname: 'jpg' 368 api.uploadImgCorpPhoto(resp.tempFilePath).then(data => {
365 } 369 console.log(data)
366 }); 370 baseFormData.value.photo = data.data.fang;
367 }, 371 baseFormData.value.photo2 = data.data.yuan;
368 fail: function(err) { 372 photoArr.value = {
369 photoArr.value = {} 373 url: config.baseUrl_api + baseFormData.value.photo,
370 } 374 name: '头像',
371 }) 375 extname: 'jpg'
372 376 }
373 377 });
374 } 378 },
375 379 fail: function (err) {
376 380 photoArr.value = {}
377 function delimgFont(n) { 381 }
378 photoArr.value = {} 382 })
379 cardObj.value = {} 383
380 baseFormData.value = { 384
381 photo: '', 385 }
382 idcType: baseFormData.value.idcType, 386
383 perType: '1', 387
384 sourceFlag: 1 388 function delimgFont(n) {
385 }; 389 photoArr.value = {}
386 } 390 cardObj.value = {}
387 391 baseFormData.value = {
388 392 photo: '',
389 function delPhoto(n) { 393 idcType: baseFormData.value.idcType,
390 photoArr.value = {}; 394 perType: '1',
391 baseFormData.value.photo = ''; 395 sourceFlag: 1
392 baseFormData.value.photo2 = ''; 396 };
393 } 397 }
394 398
395 399
396 function getExtractInfo(obj) { 400 function delPhoto(n) {
397 photoArr.value = {} 401 photoArr.value = {};
398 // baseFormData.value = { 402 baseFormData.value.photo = '';
399 // photo: '', 403 baseFormData.value.photo2 = '';
400 // idcType: baseFormData.value.idcType, 404 }
401 // idcCode: baseFormData.value.idcCode, 405
402 // perType: '1' 406
403 // }; 407 function getExtractInfo(obj) {
404 uni.showLoading({ 408 photoArr.value = {}
405 title: '加载中' 409 // baseFormData.value = {
406 }) 410 // photo: '',
407 api.extractInfoFromChinaIdCard(obj).then(res => { 411 // idcType: baseFormData.value.idcType,
408 if (res.data.perCode) { 412 // idcCode: baseFormData.value.idcCode,
409 // if(baseFormData.value.idcType != 3){ 413 // perType: '1'
410 disabledName.value = true 414 // };
411 // } 415 uni.showLoading({
412 perId.value = res.data.perId 416 title: '加载中'
413 baseFormData.value.sex = res.data.sex 417 })
414 baseFormData.value.birth = res.data.birth 418 api.extractInfoFromChinaIdCard(obj).then(res => {
415 baseFormData.value.name = res.data.name 419 if (res.data.perCode) {
416 baseFormData.value.phone = res.data.phone 420 // if(baseFormData.value.idcType != 3){
417 baseFormData.value.perCode = res.data.perCode ||'' 421 disabledName.value = true
418 baseFormData.value.validityDate = res.data.validityDate?.slice(0,10) //去掉时分秒 422 // }
419 // baseFormData.value.cityId = res.data.cityId 423 perId.value = res.data.perId
420 // baseFormData.value.address = res.data.address 424 baseFormData.value.sex = res.data.sex
421 if (res.data.photo) { 425 baseFormData.value.birth = res.data.birth
422 console.log(res.data.photo) 426 baseFormData.value.name = res.data.name
423 if (res.data.photo.indexOf('http') == -1) { 427 baseFormData.value.phone = res.data.phone
424 baseFormData.value.photo = res.data.photo 428 baseFormData.value.perCode = res.data.perCode || ''
425 let obj = { 429 baseFormData.value.validityDate = res.data.validityDate?.slice(0, 10) //去掉时分秒
426 url: config.baseUrl_api + res.data.photo, 430 // baseFormData.value.cityId = res.data.cityId
427 name: '头像', 431 // baseFormData.value.address = res.data.address
428 extname: 'jpg' 432 if (res.data.photo) {
429 } 433 console.log(res.data.photo)
430 photoArr.value = obj 434 if (res.data.photo.indexOf('http') == -1) {
431 } else { 435 baseFormData.value.photo = res.data.photo
432 baseFormData.value.photo = res.data.photo 436 let obj = {
433 let obj = { 437 url: config.baseUrl_api + res.data.photo,
434 url: res.data.photo, 438 name: '头像',
435 name: '头像', 439 extname: 'jpg'
436 extname: 'jpg' 440 }
437 } 441 photoArr.value = obj
438 photoArr.value = obj 442 } else {
439 } 443 baseFormData.value.photo = res.data.photo
440 444 let obj = {
441 } 445 url: res.data.photo,
442 // baseFormData.value.name = res.data.name 446 name: '头像',
443 baseFormData.value.perId = res.data.perId 447 extname: 'jpg'
444 console.log(res.data.photo, baseFormData.value.photo) 448 }
445 uni.hideLoading() 449 photoArr.value = obj
446 } else { 450 }
447 uni.hideLoading() 451
448 // 新会员 452 }
449 if (res.data.sex) { 453 // baseFormData.value.name = res.data.name
450 baseFormData.value.sex = res.data.sex 454 baseFormData.value.perId = res.data.perId
451 baseFormData.value.birth = res.data.birth 455 console.log(res.data.photo, baseFormData.value.photo)
452 } 456 uni.hideLoading()
453 if (baseFormData.value.idcType != 3 && current.value == 1) { 457 } else {
454 disabledName.value = true 458 uni.hideLoading()
455 } else { 459 // 新会员
456 disabledName.value = false 460 if (res.data.sex) {
457 } 461 baseFormData.value.sex = res.data.sex
458 return 462 baseFormData.value.birth = res.data.birth
459 } 463 }
460 }) 464 if (baseFormData.value.idcType != 3 && current.value == 1) {
461 } 465 disabledName.value = true
462 466 } else {
463 467 disabledName.value = false
464 function giveBirthDay() { 468 }
465 if (!baseFormData.value.idcCode) { 469 return
466 return 470 }
467 } 471 })
468 472 }
469 // 判断身份证正确性/赋值生日 473
470 if (baseFormData.value.idcType == 0) { 474
471 if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(baseFormData.value.idcCode))) { 475 function giveBirthDay() {
472 uni.showToast({ 476 if (!baseFormData.value.idcCode) {
473 title: '请输入正确的身份证号码', 477 return
474 duration: 2000, 478 }
475 icon: 'none' 479
476 }) 480 // 判断身份证正确性/赋值生日
477 } else { 481 if (baseFormData.value.idcType == 0) {
478 getExtractInfo({ 482 if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(baseFormData.value.idcCode))) {
479 idcCode: baseFormData.value.idcCode, 483 uni.showToast({
480 idcType: baseFormData.value.idcType, 484 title: '请输入正确的身份证号码',
481 perType: baseFormData.value.perType || 1 485 duration: 2000,
482 }) 486 icon: 'none'
483 } 487 })
484 } 488 } else {
485 // if (baseFormData.value.idcType == 1 || baseFormData.value.idcType == 3) { 489 getExtractInfo({
486 // //转换为大写并判断位数12 490 idcCode: baseFormData.value.idcCode,
487 // baseFormData.value.idcCode = baseFormData.value.idcCode.toUpperCase() 491 idcType: baseFormData.value.idcType,
488 // // var regex = /^[a-zA-Z]/ 492 perType: baseFormData.value.perType || 1
489 // if (baseFormData.value.idcCode.length > 12) { 493 })
490 // uni.showToast({ 494 }
491 // icon: 'none', 495 }
492 // title: '请输入正确的证件号', 496 // if (baseFormData.value.idcType == 1 || baseFormData.value.idcType == 3) {
493 // duration: 2000 497 // //转换为大写并判断位数12
494 // }) 498 // baseFormData.value.idcCode = baseFormData.value.idcCode.toUpperCase()
495 // return 499 // // var regex = /^[a-zA-Z]/
496 // } 500 // if (baseFormData.value.idcCode.length > 12) {
497 // } 501 // uni.showToast({
498 } 502 // icon: 'none',
499 503 // title: '请输入正确的证件号',
500 504 // duration: 2000
501 function openpopup() { 505 // })
502 popup.value.open() 506 // return
503 } 507 // }
504 508 // }
505 509 }
506 function closepopup() { 510
507 agree.value = true 511
508 popup.value.close() 512 function openpopup() {
509 } 513 popup.value.open()
510 514 }
511 515
512 function changeIdcType(e) { 516
513 // 切换证件照类型把当前页面数据清空 517 function closepopup() {
514 cardObj.value = {} 518 agree.value = true
515 photoArr.value = {} 519 popup.value.close()
516 baseFormData.value = { 520 }
517 photo: '', 521
518 idcType: e, 522
519 perType: '1', 523 function changeIdcType(e) {
520 sourceFlag: 1 524 // 切换证件照类型把当前页面数据清空
521 } 525 cardObj.value = {}
522 } 526 photoArr.value = {}
523 527 baseFormData.value = {
524 528 photo: '',
525 function goSubmit() { 529 idcType: e,
526 530 perType: '1',
527 if (!agree.value) { 531 sourceFlag: 1
528 uni.showToast({ 532 }
529 icon: 'none', 533 }
530 title: '请阅知入会须知', 534
531 duration: 2000 535
532 }); 536 function goSubmit() {
533 return 537
534 } 538 if (!agree.value) {
535 // 验证必填项 539 uni.showToast({
536 if (!baseFormData.value.name) { 540 icon: 'none',
537 uni.showToast({ 541 title: '请阅知入会须知',
538 title: `请输入姓名`, 542 duration: 2000
539 icon: 'none' 543 });
540 }) 544 return
541 return 545 }
542 } 546 // 验证必填项
543 if (!baseFormData.value.idcCode) { 547 if (!baseFormData.value.name) {
544 uni.showToast({ 548 uni.showToast({
545 title: `请输入证件号码`, 549 title: `请输入姓名`,
546 icon: 'none' 550 icon: 'none'
547 }) 551 })
548 return 552 return
549 } 553 }
550 554 if (!baseFormData.value.idcCode) {
551 if (baseFormData.value.phone) { 555 uni.showToast({
552 const phoneReg = /^1[3-9]\d{9}$/ 556 title: `请输入证件号码`,
553 if (!phoneReg.test(baseFormData.value.phone)) { 557 icon: 'none'
554 uni.showToast({ 558 })
555 title: '请输入正确的联系方式', 559 return
556 icon: 'none' 560 }
557 }) 561
558 return 562 if (baseFormData.value.phone) {
559 } 563 const phoneReg = /^1[3-9]\d{9}$/
560 } 564 if (!phoneReg.test(baseFormData.value.phone)) {
561 565 uni.showToast({
562 // if (baseFormData.value.photo == '' || baseFormData.value.photo == undefined || !baseFormData.value.photo) { 566 title: '请输入正确的联系方式',
563 // uni.showToast({ 567 icon: 'none'
564 // title: `请上传头像`, 568 })
565 // icon: 'none' 569 return
566 // }) 570 }
567 // return 571 }
568 // } 572
569 573 // if (baseFormData.value.photo == '' || baseFormData.value.photo == undefined || !baseFormData.value.photo) {
570 //信息确认弹出 574 // uni.showToast({
571 uni.showModal({ 575 // title: `请上传头像`,
572 content: '请确认信息正确', 576 // icon: 'none'
573 success: function(res) { 577 // })
574 if (res.confirm) { 578 // return
575 if (baseFormData.value.idcType == '4') { 579 // }
576 baseFormData.value.idcType = '0' 580
577 } 581 //信息确认弹出
578 delete baseFormData.value.card 582 uni.showModal({
579 583 content: '请确认信息正确',
580 const time = new Date().valueOf() + '' 584 success: function (res) {
581 baseFormData.value.t = time + Math.floor(Math.random() * 10) 585 if (res.confirm) {
582 baseFormData.value.signT = aes2.AESEncrypt(baseFormData.value.idcType + time) 586 if (baseFormData.value.idcType == '4') {
583 const baseFormDataJson = encodeURIComponent(JSON.stringify(baseFormData.value)) 587 baseFormData.value.idcType = '0'
584 uni.navigateTo({ 588 }
585 url: `/personal/goPay_per?baseFormData=${baseFormDataJson}` 589 delete baseFormData.value.card
586 }) 590
587 591 const time = new Date().valueOf() + ''
588 // uni.showModal({ 592 baseFormData.value.t = time + Math.floor(Math.random() * 10)
589 // content: '保存成功', 593 baseFormData.value.signT = aes2.AESEncrypt(baseFormData.value.idcType + time)
590 // title: '提示', 594 const baseFormDataJson = encodeURIComponent(JSON.stringify(baseFormData.value))
591 // confirmText:'去支付', 595 uni.navigateTo({
592 // cancelColor:'个人中心', 596 url: `/personal/goPay_per?baseFormData=${baseFormDataJson}`
593 // success: function(res) { 597 })
594 598
595 // }, 599 // uni.showModal({
596 // fail:function(){ 600 // content: '保存成功',
597 // uni.reLaunch({ 601 // title: '提示',
598 // url:`/personal/home` 602 // confirmText:'去支付',
599 // }) 603 // cancelColor:'个人中心',
600 // } 604 // success: function(res) {
601 // }) 605
602 // api.addPersonToMyDept(baseFormData.value).then(Response => { 606 // },
603 // if (Response.data == 0) { 607 // fail:function(){
604 // let msg = '该成员，实名认证未通过，注册失败！' 608 // uni.reLaunch({
605 // uni.showModal({ 609 // url:`/personal/home`
606 // content: msg, 610 // })
607 // title: '提示', 611 // }
608 // success: function() {} 612 // })
609 // }) 613 // api.addPersonToMyDept(baseFormData.value).then(Response => {
610 // return 614 // if (Response.data == 0) {
611 // } 615 // let msg = '该成员，实名认证未通过，注册失败！'
612 // if (Response.data * 1 < 0) { 616 // uni.showModal({
613 // // 会员调入弹出 617 // content: msg,
614 // uni.showModal({ 618 // title: '提示',
615 // content: '该会员已存在其他道馆，如需添加，请发起会员调动', 619 // success: function() {}
616 // title: '提示', 620 // })
617 // success: function() {} 621 // return
618 // }) 622 // }
619 // return 623 // if (Response.data * 1 < 0) {
620 // } 624 // // 会员调入弹出
621 // // let msg = '保存成功' 625 // uni.showModal({
622 626 // content: '该会员已存在其他道馆，如需添加，请发起会员调动',
623 627 // title: '提示',
624 // }) 628 // success: function() {}
625 } 629 // })
626 } 630 // return
627 }); 631 // }
628 } 632 // // let msg = '保存成功'
629 633
630 function getUserInfo() { 634
631 api.getInfo(perId.value).then(res => { 635 // })
632 baseFormData.value = res.data 636 }
633 if (baseFormData.areaAssName) baseFormData.ancestorNameList = baseFormData.value.ancestorNameList.join( 637 }
634 ',').replaceAll(',', '/') 638 });
635 }) 639 }
636 } 640
641 function getUserInfo() {
642 api.getInfo(perId.value).then(res => {
643 baseFormData.value = res.data
644 if (baseFormData.areaAssName) baseFormData.ancestorNameList = baseFormData.value.ancestorNameList.join(
645 ',').replaceAll(',', '/')
646 })
647 }
637 </script> 648 </script>
638 649
639 <style lang="scss"> 650 <style lang="scss">
640 /* 字段名左对齐 */ 651 /* 字段名左对齐 */
641 .uni-forms-item .uni-forms-item__label { 652 .uni-forms-item .uni-forms-item__label {
642 text-align: left !important; 653 text-align: left !important;
643 justify-content: flex-start !important; 654 justify-content: flex-start !important;
644 padding-left: 0 !important; 655 padding-left: 0 !important;
645 width: auto !important; 656 width: auto !important;
646 } 657 }
647 658
648 /* 内容右对齐 */ 659 /* 内容右对齐 */
649 .uni-forms-item .uni-forms-item__content { 660 .uni-forms-item .uni-forms-item__content {
650 display: flex !important; 661 display: flex !important;
651 align-items: center !important; 662 align-items: center !important;
652 justify-content: flex-end !important; 663 justify-content: flex-end !important;
653 text-align: right !important; 664 text-align: right !important;
654 flex-wrap: nowrap !important; 665 flex-wrap: nowrap !important;
655 } 666 }
656 667
657 /* 输入框内容右对齐 */ 668 /* 输入框内容右对齐 */
658 .uni-forms-item .uni-easyinput .uni-easyinput__content-input, 669 .uni-forms-item .uni-easyinput .uni-easyinput__content-input,
659 .uni-forms-item .uni-easyinput input, 670 .uni-forms-item .uni-easyinput input,
660 .uni-forms-item input, 671 .uni-forms-item input,
661 .uni-forms-item .uni-data-select .uni-select__input-box, 672 .uni-forms-item .uni-data-select .uni-select__input-box,
662 .uni-forms-item .uni-data-picker .uni-data-picker__input-box { 673 .uni-forms-item .uni-data-picker .uni-data-picker__input-box {
663 text-align: right !important; 674 text-align: right !important;
664 } 675 }
665 676
666 /* 文本内容右对齐 */ 677 /* 文本内容右对齐 */
667 .uni-forms-item .uni-forms-item__content text, 678 .uni-forms-item .uni-forms-item__content text,
668 .uni-forms-item .uni-forms-item__content>text { 679 .uni-forms-item .uni-forms-item__content > text {
669 display: inline-block !important; 680 display: inline-block !important;
670 white-space: nowrap !important; 681 white-space: nowrap !important;
671 } 682 }
672 </style> 683 </style>
673 684
674 <style lang="scss" scoped> 685 <style lang="scss" scoped>
675 :deep(.uni-popup__mask) {
676 overflow: hidden !important;
677 position: fixed !important;
678 top: 0;
679 left: 0;
680 right: 0;
681 bottom: 0;
682 }
683
684 :deep(.uni-popup) {
685 overflow: hidden !important;
686 }
687
688 :deep(.segmented-control) {
689 height: 100rpx;
690 }
691
692 :deep(.segmented-control__text) {
693 line-height: 2;
694 font-size: 30rpx;
695 }
696
697 .tt {
698 text-align: center;
699 font-size: 30rpx;
700 padding: 40rpx 0 0;
701 }
702
703 .popBody {
704 font-size: 28rpx;
705 line-height: 1.5;
706 height: 70vh;
707 overflow-y: auto;
708 font-family: 华文仿宋;
709 height: 80vh;
710 overflow: auto;
711 padding: 30rpx;
712
713 .btn-red {
714 margin: 50rpx 0 30rpx;
715 }
716 }
717
718 .hasfixedbottom {
719 padding-bottom: 200rpx;
720 }
721
722 .fixed-agreeline {
723 position: fixed;
724 bottom: 150rpx;
725 left: 0;
726 right: 0;
727 z-index: 1;
728 }
729
730 .agreeline {
731 padding: 20rpx 40rpx;
732 box-sizing: border-box;
733 display: flex;
734 font-size: 30rpx;
735
736 text {
737 color: #014A9F;
738 }
739
740 image {
741 width: 40rpx;
742 height: 40rpx;
743 margin-right: 20rpx;
744 }
745 }
746
747 .upCard {
748 position: relative;
749 width: 500rpx;
750 height: 316rpx;
751
752 .uni-file-picker {
753 position: absolute;
754 z-index: 1;
755 }
756
757 .sfz {
758 width: 476rpx;
759 position: absolute;
760 top: 0;
761 left: 0;
762 height: 293rpx;
763 }
764 }
765
766 .op0 {
767 opacity: 0;
768 }
769
770
771 :deep(.item-text-overflow) {
772 text-align: left;
773 }
774
775 :deep(.fixUniFormItemStyle .uni-data-picker__input-box) {
776 justify-content: flex-start !important;
777 text-align: left !important;
778 }
779
780 /* 让地区选择器的文本左对齐 */
781 :deep(.fixUniFormItemStyle .uni-data-picker__text) {
782 text-align: left !important;
783 }
784 </style>
...\ No newline at end of file ...\ No newline at end of file
686 :deep(.uni-popup__mask) {
687 overflow: hidden !important;
688 position: fixed !important;
689 top: 0;
690 left: 0;
691 right: 0;
692 bottom: 0;
693 }
694
695 :deep(.uni-popup) {
696 overflow: hidden !important;
697 }
698
699 :deep(.segmented-control) {
700 height: 100rpx;
701 }
702
703 :deep(.segmented-control__text) {
704 line-height: 2;
705 font-size: 30rpx;
706 }
707
708 .tt {
709 text-align: center;
710 font-size: 30rpx;
711 padding: 40rpx 0 0;
712 }
713
714 .popBody {
715 font-size: 28rpx;
716 line-height: 1.5;
717 height: 70vh;
718 overflow-y: auto;
719 font-family: 华文仿宋;
720 height: 80vh;
721 overflow: auto;
722 padding: 30rpx;
723
724 .btn-red {
725 margin: 50rpx 0 30rpx;
726 }
727 }
728
729 .hasfixedbottom {
730 padding-bottom: 200rpx;
731 }
732
733 .fixed-agreeline {
734 position: fixed;
735 bottom: 150rpx;
736 left: 0;
737 right: 0;
738 z-index: 1;
739 }
740
741 .agreeline {
742 padding: 20rpx 40rpx;
743 box-sizing: border-box;
744 display: flex;
745 font-size: 30rpx;
746
747 text {
748 color: #014A9F;
749 }
750
751 image {
752 width: 40rpx;
753 height: 40rpx;
754 margin-right: 20rpx;
755 }
756 }
757
758 .upCard {
759 position: relative;
760 width: 500rpx;
761 height: 316rpx;
762
763 .uni-file-picker {
764 position: absolute;
765 z-index: 1;
766 }
767
768 .sfz {
769 width: 476rpx;
770 position: absolute;
771 top: 0;
772 left: 0;
773 height: 293rpx;
774 }
775 }
776
777 .op0 {
778 opacity: 0;
779 }
780
781
782 :deep(.item-text-overflow) {
783 text-align: left;
784 }
785
786 :deep(.fixUniFormItemStyle .uni-data-picker__input-box) {
787 justify-content: flex-start !important;
788 text-align: left !important;
789 }
790
791 /* 让地区选择器的文本左对齐 */
792 :deep(.fixUniFormItemStyle .uni-data-picker__text) {
793 text-align: left !important;
794 }
795 </style>
......
personal/home.vue
1 <template> 1 <template>
2 <view class="page-container"> 2 <view class="page-container">
3 <!-- 会员卡区域 --> 3 <!-- 会员卡区域 -->
4 <view class="member-card"> 4 <view class="member-card">
5 <image class="card-bg" :src="config.baseUrl_api + '/fs/static/user_01@2x.png'" mode="aspectFill"> 5 <image :src="config.baseUrl_api + '/fs/static/user_01@2x.png'" class="card-bg" mode="aspectFill">
6 </image> 6 </image>
7 7
8 <!-- 绑定/解绑学员 --> 8
9 <view class="bind-student" @click="handleBindAction"> 9 <!-- &lt;!&ndash; 绑定/解绑学员 &ndash;&gt;-->
10 <text>{{ isBound ? '切换学员' : '绑定学员' }}</text> 10 <!-- <view class="bind-student" @click="handleBindAction">-->
11 <image :src="config.baseUrl_api + '/fs/static/bd@2x.png'" class="bind-icon" mode="aspectFit"></image> 11 <!-- <text>{{ isBound ? '切换学员' : '绑定学员' }}</text>-->
12 </view> 12 <!-- <image :src="config.baseUrl_api + '/fs/static/bd@2x.png'" class="bind-icon" mode="aspectFit"></image>-->
13 13 <!-- </view>-->
14 <!-- 用户信息 --> 14
15 <view class="user-section"> 15 <!-- 用户信息 -->
16 <view class="user-top"> 16 <view class="user-section">
17 <view class="avatar-wrap" @click="showLogoutConfirm"> 17 <view class="member-title">
18 <!-- <image class="avatar" v-if="perInfo.photo" :src="config.baseUrl_api + perInfo.photo" 18 <view class="member-id">{{ userInfo?.userName }}</view>
19 mode="aspectFill"> 19 <view class="bind-student" @click="handleBindAction">
20 </image> --> 20 <text>{{ isBound ? '切换学员' : '绑定学员' }}</text>
21 <image class="avatar" :src="config.baseUrl_api + '/fs/static/tx@2x.png'" 21 <image :src="config.baseUrl_api + '/fs/static/bd@2x.png'" class="bind-icon" mode="aspectFit"></image>
22 mode="aspectFill"> 22 </view>
23 </image> 23 </view>
24 </view> 24
25 <view class="member-id">{{ userInfo?.userName }}</view> 25 <view class="user-top">
26 </view> 26 <view class="avatar-wrap" @click="showLogoutConfirm">
27 <view class="user-bottom"> 27 <!-- <image class="avatar" v-if="perInfo.photo" :src="config.baseUrl_api + perInfo.photo"
28 <view class="user-name">{{ perInfo?.perName }}</view> 28 mode="aspectFill">
29 <view class="card-info"> 29 </image> -->
30 <view class="info-row">会员卡号：{{ perInfo?.perCode }}</view> 30 <image :src="config.baseUrl_api + '/fs/static/tx@2x.png'" class="avatar"
31 <view class="info-row">会员有效期：{{ perInfo?.perValidDate }}</view> 31 mode="aspectFill">
32 </view> 32 </image>
33 </view> 33 </view>
34 </view> 34 <!-- <view class="member-id">{{ userInfo?.userName }}</view>-->
35 35 <view class="user-name">{{ perInfo?.perName }}</view>
36 <!-- 已过期印章 --> 36 </view>
37 <image v-if="perInfo?.perValidDateFlag == 0" class="expired-stamp" 37
38 :src="config.baseUrl_api + '/fs/static/end@2x.png'" mode="aspectFit"> 38 <view class="user-bottom">
39 </image> 39 <!-- <view class="user-name">{{ perInfo?.perName }}</view>-->
40 40 <view class="card-info">
41 <!-- 卡片右下角按钮 --> 41 <view class="info-row">
42 <view class="card-btns"> 42 <text>会员卡号</text>
43 <view class="card-btn" @click="goToPay"> 43 <text>{{ perInfo?.perCode }}</text>
44 <text>缴费</text> 44 </view>
45 </view> 45 <view class="info-row">
46 <view class="card-btn" @click="downCert"> 46 <text>会员有效期</text>
47 <text>电子会员证</text> 47 <text>{{ perInfo?.perValidDate }}</text>
48 </view> 48 </view>
49 </view> 49 </view>
50 </view> 50 </view>
51 51 </view>
52 <!-- 功能按钮卡片 --> 52
53 <view class="func-card"> 53 <!-- 已过期印章 -->
54 <view class="func-list"> 54 <image v-if="perInfo?.perValidDateFlag == 0" :src="config.baseUrl_api + '/fs/static/end@2x.png'"
55 <view class="func-item" @click="goToAuth"> 55 class="expired-stamp" mode="aspectFit">
56 <view class="func-icon"> 56 </image>
57 <image :src="config.baseUrl_api + '/fs/static/btn01@2x.png'"></image> 57
58 <!-- <uni-icons type="contact" size="40" color="#1E88E5"></uni-icons> --> 58 <!-- 卡片右下角按钮 -->
59 </view> 59 <view class="card-btns">
60 <text class="func-text">人员信息</text> 60 <view class="card-btn" @click="goToPay">
61 </view> 61 <text>认证缴费</text>
62 <view class="func-item" @click="goToScore"> 62 </view>
63 <view class="func-icon"> 63 <view class="card-btn" @click="downCert">
64 <image :src="config.baseUrl_api + '/fs/static/btn02@2x.png'"></image> 64 <text>电子会员证</text>
65 <!-- <uni-icons type="person" size="40" color="#1E88E5"></uni-icons> --> 65 </view>
66 </view> 66 </view>
67 <text class="func-text">个人会员</text> 67 </view>
68 </view> 68
69 <view class="func-item" @click="goToRecord(0)"> 69 <!-- 功能按钮卡片 -->
70 <view class="func-icon"> 70 <view class="func-card">
71 <image :src="config.baseUrl_api + '/fs/static/btn03@2x.png'"></image> 71 <view class="func-list">
72 <!-- <uni-icons type="list" size="40" color="#1E88E5"></uni-icons> --> 72 <view class="func-item" @click="goToAuth">
73 </view> 73 <view class="func-icon">
74 <text class="func-text">级位记录</text> 74 <image :src="config.baseUrl_api + '/fs/static/btn01@2x.png'"></image>
75 </view> 75 <!-- <uni-icons type="contact" size="40" color="#1E88E5"></uni-icons> -->
76 </view> 76 </view>
77 </view> 77 <text class="func-text">人员信息</text>
78 78 </view>
79 <!-- 查询功能区域 --> 79 <view class="func-item" @click="goToScore">
80 <view class="query-section"> 80 <view class="func-icon">
81 <view class="query-item" @click="goToOrder"> 81 <image :src="config.baseUrl_api + '/fs/static/btn02@2x.png'"></image>
82 <view class="query-item-left"> 82 <!-- <uni-icons type="person" size="40" color="#1E88E5"></uni-icons> -->
83 <image :src="config.baseUrl_api + '/fs/static/user_icon01@2x.png'" class="query-item-icon"></image> 83 </view>
84 <text class="query-item-text">我的订单</text> 84 <text class="func-text">个人会员</text>
85 </view> 85 </view>
86 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 86 <view class="func-item" @click="goToRecord(0)">
87 </view> 87 <view class="func-icon">
88 <!-- <view class="query-item" @click="goToWebView(1)"> 88 <image :src="config.baseUrl_api + '/fs/static/btn03@2x.png'"></image>
89 <view class="query-item-left"> 89 <!-- <uni-icons type="list" size="40" color="#1E88E5"></uni-icons> -->
90 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 90 </view>
91 <text class="query-item-text">单位会员查询</text> 91 <text class="func-text">级位记录</text>
92 </view> 92 </view>
93 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 93 </view>
94 </view> 94 </view>
95 <view class="query-item" @click="goToWebView(2)"> 95
96 <view class="query-item-left"> 96 <!-- 查询功能区域 -->
97 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 97 <view class="query-section">
98 <text class="query-item-text">个人会员查询</text> 98 <view class="query-item" @click="goToOrder">
99 </view> 99 <view class="query-item-left">
100 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 100 <image :src="config.baseUrl_api + '/fs/static/user_icon01@2x.png'" class="query-item-icon"></image>
101 </view> 101 <text class="query-item-text">我的订单</text>
102 <view class="query-item" @click="goToWebView(3)"> 102 </view>
103 <view class="query-item-left"> 103 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
104 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image> 104 </view>
105 <text class="query-item-text">旧版级位证书查询</text> 105 <!-- <view class="query-item" @click="goToWebView(1)">
106 </view> 106 <view class="query-item-left">
107 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 107 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
108 </view> --> 108 <text class="query-item-text">单位会员查询</text>
109 <!-- <view class="query-item" @click="goToWebView(4)"> 109 </view>
110 <view class="query-item-left"> 110 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
111 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image> 111 </view>
112 <text class="query-item-text">新版级位证书查询</text> 112 <view class="query-item" @click="goToWebView(2)">
113 </view> 113 <view class="query-item-left">
114 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 114 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
115 </view> --> 115 <text class="query-item-text">个人会员查询</text>
116 <!-- <view class="query-item" @click="goToWebView(5)"> 116 </view>
117 <view class="query-item-left"> 117 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
118 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image> 118 </view>
119 <text class="query-item-text">级位记录查询</text> 119 <view class="query-item" @click="goToWebView(3)">
120 </view> 120 <view class="query-item-left">
121 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 121 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image>
122 </view> --> 122 <text class="query-item-text">旧版级位证书查询</text>
123 <!-- <view class="query-item" @click="goToWebView(6)"> 123 </view>
124 <view class="query-item-left"> 124 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
125 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image> 125 </view> -->
126 <text class="query-item-text">国际段位证书查询</text> 126 <!-- <view class="query-item" @click="goToWebView(4)">
127 </view> 127 <view class="query-item-left">
128 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 128 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image>
129 </view> --> 129 <text class="query-item-text">新版级位证书查询</text>
130 <view class="query-item" @click="goToRecord(1)"> 130 </view>
131 <view class="query-item-left"> 131 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
132 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image> 132 </view> -->
133 <text class="query-item-text">我的段位</text> 133 <!-- <view class="query-item" @click="goToWebView(5)">
134 </view> 134 <view class="query-item-left">
135 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 135 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image>
136 </view> 136 <text class="query-item-text">级位记录查询</text>
137 <view class="query-item" @click="goToWebView(8)"> 137 </view>
138 <view class="query-item-left"> 138 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
139 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 139 </view> -->
140 <text class="query-item-text">级位考官</text> 140 <!-- <view class="query-item" @click="goToWebView(6)">
141 </view> 141 <view class="query-item-left">
142 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 142 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image>
143 </view> 143 <text class="query-item-text">国际段位证书查询</text>
144 <view class="query-item" @click="goToWebView(9)"> 144 </view>
145 <view class="query-item-left"> 145 <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
146 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 146 </view> -->
147 <text class="query-item-text">段位考官</text> 147 <view class="query-item" @click="goToRecord(1)">
148 </view> 148 <view class="query-item-left">
149 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 149 <image :src="config.baseUrl_api + '/fs/static/user_icon02@2x.png'" class="query-item-icon"></image>
150 </view> 150 <text class="query-item-text">我的段位</text>
151 <view class="query-item" @click="goToWebView(10)"> 151 </view>
152 <view class="query-item-left"> 152 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
153 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 153 </view>
154 <text class="query-item-text">大众教练员</text> 154 <view class="query-item" @click="goToWebView(8)">
155 </view> 155 <view class="query-item-left">
156 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 156 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
157 </view> 157 <text class="query-item-text">级位考官</text>
158 <view class="query-item" @click="goToWebView(11)"> 158 </view>
159 <view class="query-item-left"> 159 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
160 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 160 </view>
161 <text class="query-item-text">大众裁判员</text> 161 <view class="query-item" @click="goToWebView(9)">
162 </view> 162 <view class="query-item-left">
163 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 163 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
164 </view> 164 <text class="query-item-text">段位考官</text>
165 <view class="query-item" @click="goToWebView(12)"> 165 </view>
166 <view class="query-item-left"> 166 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
167 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image> 167 </view>
168 <text class="query-item-text">培训讲师</text> 168 <view class="query-item" @click="goToWebView(10)">
169 </view> 169 <view class="query-item-left">
170 <uni-icons type="arrowright" size="20" color="#999"></uni-icons> 170 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
171 </view> 171 <text class="query-item-text">大众教练员</text>
172 </view> 172 </view>
173 173 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
174 <!-- 绑定学员弹框 --> 174 </view>
175 <uni-popup ref="bindPopup" type="center" :mask-click="false"> 175 <view class="query-item" @click="goToWebView(11)">
176 <view class="bind-popup"> 176 <view class="query-item-left">
177 <view class="popup-title">绑定学员</view> 177 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
178 <view class="popup-content"> 178 <text class="query-item-text">大众裁判员</text>
179 <view class="form-item"> 179 </view>
180 <view class="form-label">姓名</view> 180 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
181 <view class="form-input"> 181 </view>
182 <input v-model="bindForm.name" placeholder="请输入姓名" placeholder-class="placeholder-class" /> 182 <view class="query-item" @click="goToWebView(12)">
183 </view> 183 <view class="query-item-left">
184 </view> 184 <image :src="config.baseUrl_api + '/fs/static/user_icon03@2x.png'" class="query-item-icon"></image>
185 <view class="form-item"> 185 <text class="query-item-text">培训讲师</text>
186 <view class="form-label">证件号</view> 186 </view>
187 <view class="form-input"> 187 <uni-icons color="#999" size="20" type="arrowright"></uni-icons>
188 <input v-model="bindForm.idcCode" placeholder="请输入证件号" 188 </view>
189 placeholder-class="placeholder-class" /> 189 </view>
190 </view> 190
191 </view> 191 <!-- 退出-->
192 </view> 192 <view class="logOut">
193 <view class="popup-btns"> 193 <view class="logOutBtn" @click="showLogoutConfirm">退出登录</view>
194 <view class="popup-btn cancel" @click="closeBindPopup">取消</view> 194 </view>
195 <view class="popup-btn confirm" @click="confirmBind">确定</view> 195
196 </view> 196 <!-- 绑定学员弹框 -->
197 </view> 197 <uni-popup ref="bindPopup" :mask-click="false" type="center">
198 </uni-popup> 198 <view class="bind-popup">
199 199 <view class="popup-title">绑定学员</view>
200 <!-- 退出登录确认框 --> 200 <view class="popup-content">
201 <view v-if="showConfirm" class="confirm-mask" @click.stop="cancelLogout"> 201 <view class="form-item">
202 <view class="confirm-box" @click.stop> 202 <view class="form-label">姓名</view>
203 <view class="confirm-content"> 203 <view class="form-input">
204 <view class="confirm-title">退出登录</view> 204 <input v-model="bindForm.name" placeholder="请输入姓名" placeholder-class="placeholder-class"/>
205 <view class="confirm-text">确定要退出登录吗？</view> 205 </view>
206 </view> 206 </view>
207 <view class="confirm-buttons"> 207 <view class="form-item">
208 <view class="confirm-btn cancel" @click="cancelLogout">取消</view> 208 <view class="form-label">证件号</view>
209 <view class="confirm-btn confirm" @click="confirmLogout">确定</view> 209 <view class="form-input">
210 </view> 210 <input v-model="bindForm.idcCode" placeholder="请输入证件号"
211 </view> 211 placeholder-class="placeholder-class"/>
212 </view> 212 </view>
213 </view> 213 </view>
214 </view>
215 <view class="popup-btns">
216 <view class="popup-btn cancel" @click="closeBindPopup">取消</view>
217 <view class="popup-btn confirm" @click="confirmBind">确定</view>
218 </view>
219 </view>
220 </uni-popup>
221
222 <!-- 退出登录确认框 -->
223 <view v-if="showConfirm" class="confirm-mask" @click.stop="cancelLogout">
224 <view class="confirm-box" @click.stop>
225 <view class="confirm-content">
226 <view class="confirm-title">退出登录</view>
227 <view class="confirm-text">确定要退出登录吗？</view>
228 </view>
229 <view class="confirm-buttons">
230 <view class="confirm-btn cancel" @click="cancelLogout">取消</view>
231 <view class="confirm-btn confirm" @click="confirmLogout">确定</view>
232 </view>
233 </view>
234 </view>
235 </view>
214 </template> 236 </template>
215 237
216 <script setup> 238 <script setup>
217 import { 239 import {
218 computed, 240 computed,
219 onMounted, 241 onMounted,
220 ref, 242 ref,
221 watch, 243 watch,
222 nextTick 244 nextTick
223 } from "vue"; 245 } from "vue";
224 import config from "/config.js"; 246 import config from "/config.js";
225 import { 247 import {
226 wxLogin, 248 wxLogin,
227 logout, 249 logout,
228 getWebInfo 250 getWebInfo
229 } from '@/common/login.js'; 251 } from '@/common/login.js';
230 import { 252 import {useUserStore} from "@/store/modules/user.js";
231 useUserStore 253 import to from 'await-to-js'
232 } from "../store/modules/user"; 254 import {
233 import to from 'await-to-js' 255 bindUser,
234 import { 256 unbindUser,
235 bindUser, 257 downStuCertSingle
236 unbindUser, 258 } from '@/common/api.js'
237 downStuCertSingle 259
238 } from '@/common/api.js' 260 const userStore = useUserStore()
239 261 const userInfo = computed(() => userStore.user ?? {})
240 const userStore = useUserStore() 262 const perInfo = computed(() => userStore.perInfo ?? {})
241 const userInfo = computed(() => userStore.user) 263 console.log(222, userInfo.value)
242 const perInfo = computed(() => userStore.perInfo) 264 console.log(333, perInfo.value)
243 console.log(222,userInfo.value) 265
244 console.log(333,perInfo.value) 266 // 是否已绑定学员（根据会员卡号判断）
245 267 const isBound = computed(() => {
246 // 是否已绑定学员（根据会员卡号判断） 268 const perCode = perInfo.value?.perCode
247 const isBound = computed(() => { 269 return perCode !== undefined && perCode !== null && perCode !== ''
248 const perCode = perInfo.value?.perCode 270 })
249 return perCode !== undefined && perCode !== null && perCode !== '' 271
250 }) 272 const bindPopup = ref(null)
251
252 const bindPopup = ref(null)
253 const bindForm = ref({ 273 const bindForm = ref({
254 name: '', 274 name: '',
255 idcCode: '' 275 idcCode: ''
256 }) 276 })
257 const showConfirm = ref(false) 277 const showConfirm = ref(false)
258 278
259 onMounted(() => { 279 onMounted(() => {
260 let webUserName = uni.getStorageSync('webUserName') 280 let webUserName = uni.getStorageSync('webUserName')
261 if (!webUserName) { 281 if (!webUserName) {
262 wxLogin().then(getWebInfo) 282 wxLogin().then(getWebInfo)
263 } 283 }
264 }) 284 })
265 285
266 // 标记是否已经弹出过绑定框（避免重复弹出） 286 // 标记是否已经弹出过绑定框（避免重复弹出）
267 let hasOpenedBindPopup = false 287 let hasOpenedBindPopup = false
268 288
269 watch(() => perInfo.value, (newVal, oldVal) => { 289 watch(() => perInfo.value, (newVal, oldVal) => {
270 console.log(444, newVal?.perCode) 290 console.log(444, newVal?.perCode)
271 291
272 // 只有当 perInfo 数据存在且 perCode 为空时才弹出 292 // 只有当 perInfo 数据存在且 perCode 为空时才弹出
273 if (newVal && !newVal.perCode && !hasOpenedBindPopup) { 293 if (newVal && !newVal.perCode && !hasOpenedBindPopup) {
274 hasOpenedBindPopup = true 294 hasOpenedBindPopup = true
275 nextTick(() => { 295 nextTick(() => {
276 openBindPopup() 296 openBindPopup()
277 }) 297 })
278 } 298 }
279 }, { 299 }, {
280 immediate: true 300 immediate: true
281 }) 301 })
282 302
283 // 打开绑定弹框 303 // 打开绑定弹框
284 const openBindPopup = () => { 304 const openBindPopup = () => {
285 if (bindPopup.value) { 305 if (bindPopup.value) {
286 bindForm.value = { 306 bindForm.value = {
287 name: '', 307 name: '',
288 idcCode: '' 308 idcCode: ''
289 } 309 }
290 bindPopup.value.open() 310 bindPopup.value.open()
291 } else { 311 } else {
292 nextTick(() => { 312 nextTick(() => {
293 openBindPopup() 313 openBindPopup()
294 }) 314 })
295 } 315 }
296 } 316 }
297 317
298 // 关闭绑定弹框 318 // 关闭绑定弹框
299 const closeBindPopup = () => { 319 const closeBindPopup = () => {
300 bindPopup.value?.close() 320 bindPopup.value?.close()
301 } 321 }
302 322
303 // 处理绑定/切换操作 323 // 处理绑定/切换操作
304 const handleBindAction = async () => { 324 const handleBindAction = async () => {
305 if (isBound.value) { 325 // if (isBound.value) {
306 // 已绑定，先解绑再打开绑定弹框 326 // // 已绑定，先解绑再打开绑定弹框
307 uni.showLoading({ 327 // uni.showLoading({
308 title: '解绑中...', 328 // title: '解绑中...',
309 mask: true 329 // mask: true
310 }) 330 // })
311 const [err] = await to(unbindUser()) 331 // const [err] = await to(unbindUser())
312 uni.hideLoading() 332 // uni.hideLoading()
313 if (err) return 333 // if (err) return
314 getWebInfo() 334 // getWebInfo()
315 openBindPopup() 335 // openBindPopup()
316 } else { 336 // } else {
317 // 未绑定，打开绑定弹框 337 // // 未绑定，打开绑定弹框
318 openBindPopup() 338 // openBindPopup()
319 } 339 // }
320 } 340 openBindPopup()
321 341 }
322 // 确认绑定 342
323 const confirmBind = async () => { 343 // 确认绑定
324 if (!bindForm.value.name) { 344 const confirmBind = async () => {
325 uni.showToast({ 345 if (!bindForm.value.name) {
326 title: '请输入姓名', 346 uni.showToast({
327 icon: 'none' 347 title: '请输入姓名',
328 }) 348 icon: 'none'
329 return 349 })
330 } 350 return
331 if (!bindForm.value.idcCode) { 351 }
332 uni.showToast({ 352 if (!bindForm.value.idcCode) {
333 title: '请输入证件号', 353 uni.showToast({
334 icon: 'none' 354 title: '请输入证件号',
335 }) 355 icon: 'none'
336 return 356 })
337 } 357 return
338 358 }
339 uni.showLoading({ 359
340 title: '绑定中...', 360 if (isBound.value) {
341 mask: true 361 // 已绑定，先解绑再打开绑定弹框
342 }) 362 uni.showLoading({
343 363 title: '解绑中...',
344 const [err, res] = await to(bindUser({ 364 mask: true
345 name: bindForm.value.name, 365 })
346 idcCode: bindForm.value.idcCode 366 const [err] = await to(unbindUser())
347 })) 367 uni.hideLoading()
348 uni.hideLoading() 368 if (err) return
349 369 await getWebInfo()
350 if (err) { 370 }
351 uni.showToast({ 371
352 title: err?.data?.msg || err?.message || '绑定失败，请稍后重试', 372 uni.showLoading({
353 icon: 'none', 373 title: '绑定中...',
354 duration: 3000 374 mask: true
355 }) 375 })
356 return 376
357 }else{ 377 const [err, res] = await to(bindUser({
358 uni.showToast({ 378 name: bindForm.value.name,
359 title: '绑定成功', 379 idcCode: bindForm.value.idcCode
360 icon: 'success' 380 }))
361 }) 381 uni.hideLoading()
362 closeBindPopup() 382
363 getWebInfo() 383 if (err) {
364 } 384 console.log(err)
365 385 // uni.showToast({
366 // uni.showToast({ 386 // title: err?.data?.msg || err?.message || '绑定失败，请稍后重试',
367 // title: '绑定成功', 387 // icon: 'none',
368 // icon: 'success' 388 // duration: 3000
369 // }) 389 // })
370 390 // return
371 } 391 handelGo()
372 392 closeBindPopup()
373 // 返回上一页 393 } else {
374 const goBack = () => { 394 uni.showToast({
375 uni.navigateBack() 395 title: '绑定成功',
376 } 396 icon: 'success'
377 397 })
378 const goToAuth = () => { 398 closeBindPopup()
379 if (!isBound.value) { 399 await getWebInfo()
380 uni.showToast({ title: '请先绑定学员', icon: 'none' }) 400 }
381 return 401
382 } 402 // uni.showToast({
383 uni.navigateTo({ 403 // title: '绑定成功',
384 url: '/personal/personInfo' 404 // icon: 'success'
385 }); 405 // })
386 }; 406
387 407 }
388 const goToScore = () => { 408
389 if (!isBound.value) { 409 const handelGo = () => {
390 uni.showToast({ title: '请先绑定学员', icon: 'none' }) 410 uni.showModal({
391 return 411 title: "提示",
392 } 412 content: "当前账号非中国跆拳道协会有效会员。请先完成认证缴费，即可正常登录使用。",
393 uni.navigateTo({ 413 success: function (res) {
394 url: '/personal/memberInfo' 414 if (res.confirm) {
395 }); 415 // closeBindPopup()
396 }; 416 uni.navigateTo({
397 417 url: `/personal/addVip_per?name=${bindForm.value.name}&idcCode=${bindForm.value.idcCode}`
398 const goToWebView = (type) => { 418 });
399 // const url = "https://member.taekwondo.org.cn/#/authAccurate?type=" + type 419 } else if (res.cancel) {
400 const url = "https://tk001.wxjylt.com/pc.html#/authAccurate?type=" + type 420 // closeBindPopup()
401 uni.navigateTo({ 421 }
402 url: "/pages/webview/webview?url=" + encodeURIComponent(url) 422
403 }); 423 },
404 }; 424
425 })
426 }
427
428 // 返回上一页
429 const goBack = () => {
430 uni.navigateBack()
431 }
432
433 const goToAuth = () => {
434 if (!isBound.value) {
435 uni.showToast({title: '请先绑定学员', icon: 'none'})
436 return
437 }
438 uni.navigateTo({
439 url: '/personal/personInfo'
440 });
441 };
442
443 const goToScore = () => {
444 if (!isBound.value) {
445 uni.showToast({title: '请先绑定学员', icon: 'none'})
446 return
447 }
448 uni.navigateTo({
449 url: '/personal/memberInfo'
450 });
451 };
452
453 const goToWebView = (type) => {
454 // const url = "https://member.taekwondo.org.cn/#/authAccurate?type=" + type
455 const url = "https://tk001.wxjylt.com/pc.html#/authAccurate?type=" + type
456 uni.navigateTo({
457 url: "/pages/webview/webview?url=" + encodeURIComponent(url)
458 });
459 };
405 460
406 // 导航到级位记录 461 // 导航到级位记录
407 const goToRecord = (type) => { 462 const goToRecord = (type) => {
408 if (!isBound.value) { 463 if (!isBound.value) {
409 uni.showToast({ title: '请先绑定学员', icon: 'none' }) 464 uni.showToast({title: '请先绑定学员', icon: 'none'})
410 return 465 return
411 } 466 }
412 uni.navigateTo({ 467 uni.navigateTo({
413 url: '/personal/levelRecord?type=' + type 468 url: '/personal/levelRecord?type=' + type
414 }); 469 });
415 }; 470 };
416 471
417 // 导航到我的订单 472 // 导航到我的订单
418 const goToOrder = () => { 473 const goToOrder = () => {
419 if (!isBound.value) { 474 if (!isBound.value) {
420 uni.showToast({ title: '请先绑定学员', icon: 'none' }) 475 uni.showToast({title: '请先绑定学员', icon: 'none'})
421 return 476 return
422 } 477 }
423 uni.navigateTo({ 478 uni.navigateTo({
424 url: '/personal/order' 479 url: '/personal/order'
425 }); 480 });
426 }; 481 };
427 482
428 // 导航到缴费 483 // 导航到缴费
429 const goToPay = () => { 484 const goToPay = () => {
430 const perId = userInfo.value?.perId 485 const perId = userInfo.value.perId ?? ''
431 uni.navigateTo({ 486 uni.navigateTo({
432 url: `/personal/addVip_per?perId=${perId}` 487 url: `/personal/addVip_per?perId=${perId}`
433 }); 488 });
434 }; 489 };
435 490
436 // 下载电子会员证 491 // 下载电子会员证
437 const downCert = async () => { 492 const downCert = async () => {
438 if (!isBound.value) { 493 if (!isBound.value) {
439 uni.showToast({ title: '请先绑定学员', icon: 'none' }) 494 uni.showToast({title: '请先绑定学员', icon: 'none'})
440 return 495 return
441 } 496 }
442 const perId = userInfo.value?.perId 497 const perId = userInfo.value?.perId
443 if (!perId) return 498 if (!perId) return
444 499
445 uni.showLoading({ title: '加载中...', mask: true }) 500 uni.showLoading({title: '加载中...', mask: true})
446 const [err, res] = await to(downStuCertSingle(perId)) 501 const [err, res] = await to(downStuCertSingle(perId))
447 uni.hideLoading() 502 uni.hideLoading()
448 503
449 if (err) { 504 if (err) {
450 uni.showToast({ title: err?.data?.msg || '获取会员证失败', icon: 'none' }) 505 uni.showToast({title: err?.data?.msg || '获取会员证失败', icon: 'none'})
451 return 506 return
452 } 507 }
453 const pdfUrl = res?.data 508 const pdfUrl = res?.data
454 if (pdfUrl) { 509 if (pdfUrl) {
455 uni.navigateTo({ 510 uni.navigateTo({
456 url: `/personal/certPreview?url=${encodeURIComponent(pdfUrl)}` 511 url: `/personal/certPreview?url=${encodeURIComponent(pdfUrl)}`
457 }) 512 })
458 } 513 }
459 }; 514 };
460 515
461 516
462 517 // 显示退出登录确认框
463 // 显示退出登录确认框 518 const showLogoutConfirm = () => {
464 const showLogoutConfirm = () => { 519 showConfirm.value = true;
465 showConfirm.value = true; 520 };
466 }; 521
467 522 // 取消退出登录
468 // 取消退出登录 523 const cancelLogout = () => {
469 const cancelLogout = () => { 524 showConfirm.value = false;
470 showConfirm.value = false; 525 };
471 }; 526
472 527 // 确认退出登录
473 // 确认退出登录 528 const confirmLogout = () => {
474 const confirmLogout = () => { 529 // 调用退出登录接口
475 // 调用退出登录接口 530 logout().then(() => {
476 logout().then(() => { 531 // 跳转到登录页
477 // 跳转到登录页 532 uni.reLaunch({
478 uni.reLaunch({ 533 url: '/login/login'
479 url: '/login/login' 534 })
480 }) 535 });
481 }); 536 };
482 };
483 </script> 537 </script>
484 538
485 <style lang="scss" scoped> 539 <style lang="scss" scoped>
486 .page-container {
487 min-height: 100vh;
488 background: #f5f5f5;
489 }
490
491 /* 导航栏 */
492 .nav-bar {
493 display: flex;
494 align-items: center;
495 justify-content: space-between;
496 height: 88rpx;
497 background: #ffffff;
498 padding: 0 30rpx;
499 box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
500 position: sticky;
501 top: 0;
502 z-index: 100;
503 }
504
505 .nav-left {
506 width: 44rpx;
507 height: 44rpx;
508 display: flex;
509 align-items: center;
510 justify-content: center;
511 }
512
513 .nav-title {
514 font-size: 32rpx;
515 font-weight: 500;
516 color: #333;
517 }
518
519 .nav-right {
520 width: 44rpx;
521 }
522
523 /* 会员卡 */
524 .member-card {
525 position: relative;
526 height: 450rpx;
527 border-radius: 0;
528 overflow: hidden;
529 }
530
531 .card-bg {
532 position: absolute;
533 top: 0;
534 left: 0;
535 width: 100%;
536 height: 100%;
537 z-index: 0;
538 }
539
540 .bind-student {
541 position: absolute;
542 top: 30rpx;
543 right: 30rpx;
544 display: flex;
545 align-items: center;
546 gap: 8rpx;
547 z-index: 10;
548 padding: 10rpx 16rpx;
549 // background: rgba(255, 255, 255, 0.5);
550 border-radius: 30rpx;
551 }
552
553 .bind-student text {
554 font-size: 26rpx;
555 color: #5c4b37;
556 }
557
558 .bind-icon {
559 width: 45rpx;
560 height: 45rpx;
561 }
562
563 .user-section {
564 position: relative;
565 z-index: 1;
566 padding: 50rpx 30rpx 0;
567 }
568
569 .user-top {
570 display: flex;
571 align-items: center;
572 gap: 20rpx;
573 margin-bottom: 20rpx;
574 }
575
576 .avatar-wrap {
577 flex-shrink: 0;
578 }
579
580 .avatar {
581 width: 110rpx;
582 height: 110rpx;
583 border-radius: 50%;
584 border: 3rpx solid rgba(255, 255, 255, 0.6);
585 }
586
587 .member-id {
588 font-size: 26rpx;
589 color: #503000;
590 }
591
592 .user-bottom {
593 padding-left: 0;
594 }
595
596 .user-name {
597 font-size: 44rpx;
598 font-weight: bold;
599 color: #5c4b37;
600 margin-bottom: 16rpx;
601 }
602
603 .card-info {
604 display: flex;
605 flex-direction: column;
606 gap: 10rpx;
607 }
608
609 .info-row {
610 font-size: 28rpx;
611 color: #503000;
612 }
613
614 /* 已过期印章 */
615 .expired-stamp {
616 position: absolute;
617 right: 30rpx;
618 bottom: 150rpx;
619 width: 150rpx;
620 height: 150rpx;
621 z-index: 1;
622 }
623
624 /* 卡片右下角按钮 */
625 .card-btns {
626 position: absolute;
627 right: 30rpx;
628 bottom: 80rpx;
629 z-index: 10;
630 display: flex;
631 gap: 16rpx;
632 }
633
634 .card-btn {
635 background: rgba(255, 255, 255, 0.9);
636 border-radius: 30rpx;
637 padding: 0rpx 20rpx;
638 padding-bottom: 5rpx;
639 }
640
641 .card-btn text {
642 height: 24rpx;
643 line-height: 24rpx;
644 font-size: 24rpx;
645 color: #C40F18;
646 }
647
648 /* 功能按钮卡片 */
649 .func-card {
650 margin: -70rpx 30rpx 30rpx;
651 background: #ffffff;
652 border-radius: 20rpx;
653 padding: 36rpx 0;
654 box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
655 position: relative;
656 z-index: 2;
657 }
658
659 .func-list {
660 display: flex;
661 justify-content: space-around;
662 padding: 0 20rpx;
663 }
664
665 .func-item {
666 display: flex;
667 flex-direction: column;
668 align-items: center;
669 gap: 12rpx;
670 }
671
672 .func-icon {
673 width: 72rpx;
674 height: 72rpx;
675 display: flex;
676 align-items: center;
677 justify-content: center;
678 // background: #f0f7ff;
679 // border-radius: 16rpx;
680 image{
681 width: 72rpx;
682 height: 72rpx;
683 }
684 }
685
686 .func-text {
687 font-size: 24rpx;
688 color: #333;
689 }
690
691 /* 查询功能区域 */
692 .query-section {
693 margin: 0 30rpx;
694 background: #ffffff;
695 border-radius: 20rpx;
696 box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
697 overflow: hidden;
698 }
699
700 .query-item {
701 display: flex;
702 align-items: center;
703 justify-content: space-between;
704 padding: 32rpx 30rpx;
705 border-bottom: 1rpx solid #f5f5f5;
706 }
707
708 .query-item:last-child {
709 border-bottom: none;
710 }
711
712 .query-item-left {
713 display: flex;
714 align-items: center;
715 gap: 16rpx;
716 }
717
718 .query-item-icon {
719 width: 44rpx;
720 height: 48rpx;
721 }
722
723 .query-item-text {
724 font-size: 28rpx;
725 color: #333;
726 }
727
728 /* 绑定学员弹框 */
729 .bind-popup {
730 width: 600rpx;
731 background: #ffffff;
732 border-radius: 24rpx;
733 overflow: hidden;
734 }
735
736 .popup-title {
737 font-size: 32rpx;
738 font-weight: 500;
739 color: #333;
740 text-align: center;
741 padding: 40rpx 30rpx 20rpx;
742 }
743
744 .popup-content {
745 padding: 20rpx 30rpx 40rpx;
746 }
747
748 .form-item {
749 display: flex;
750 align-items: center;
751 margin-bottom: 24rpx;
752 }
753
754 .form-item:last-child {
755 margin-bottom: 0;
756 }
757
758 .form-label {
759 width: 120rpx;
760 font-size: 28rpx;
761 color: #333;
762 flex-shrink: 0;
763 }
764
765 .form-input {
766 flex: 1;
767 background: #f5f5f5;
768 border-radius: 12rpx;
769 padding: 20rpx 24rpx;
770 }
771
772 .form-input input {
773 font-size: 28rpx;
774 color: #333;
775 width: 100%;
776 }
777
778 .placeholder-class {
779 color: #999;
780 }
781
782 .popup-btns {
783 display: flex;
784 border-top: 1rpx solid #eee;
785 }
786
787 .popup-btn {
788 flex: 1;
789 height: 100rpx;
790 line-height: 100rpx;
791 text-align: center;
792 font-size: 30rpx;
793 }
794
795 .popup-btn.cancel {
796 color: #666;
797 border-right: 1rpx solid #eee;
798 }
799
800 .popup-btn.confirm {
801 color: #C40F18;
802 font-weight: 500;
803 }
804
805 /* 退出登录确认框 */
806 .confirm-mask {
807 position: fixed;
808 top: 0;
809 left: 0;
810 right: 0;
811 bottom: 0;
812 background: rgba(0, 0, 0, 0.5);
813 display: flex;
814 align-items: center;
815 justify-content: center;
816 z-index: 1000;
817 }
818
819 .confirm-box {
820 width: 600rpx;
821 background: #ffffff;
822 border-radius: 20rpx;
823 overflow: hidden;
824 }
825
826 .confirm-content {
827 padding: 40rpx;
828 text-align: center;
829 }
830
831 .confirm-title {
832 font-size: 32rpx;
833 font-weight: 500;
834 color: #333;
835 margin-bottom: 20rpx;
836 }
837
838 .confirm-text {
839 font-size: 28rpx;
840 color: #666;
841 margin-top: 30rpx;
842 color: #C40F18;
843 }
844
845 .confirm-buttons {
846 display: flex;
847 border-top: 1rpx solid #eee;
848 }
849
850 .confirm-btn {
851 flex: 1;
852 height: 100rpx;
853 line-height: 100rpx;
854 text-align: center;
855 font-size: 30rpx;
856 }
857
858 .confirm-btn.cancel {
859 color: #666;
860 border-right: 1rpx solid #eee;
861 }
862
863 .confirm-btn.confirm {
864 color: #C40F18;
865 font-weight: 500;
866 }
867 </style>
...\ No newline at end of file ...\ No newline at end of file
540 .page-container {
541 min-height: 100vh;
542 background: #f5f5f5;
543 }
544
545 /* 导航栏 */
546 .nav-bar {
547 display: flex;
548 align-items: center;
549 justify-content: space-between;
550 height: 88rpx;
551 background: #ffffff;
552 padding: 0 30rpx;
553 box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
554 position: sticky;
555 top: 0;
556 z-index: 100;
557 }
558
559 .nav-left {
560 width: 44rpx;
561 height: 44rpx;
562 display: flex;
563 align-items: center;
564 justify-content: center;
565 }
566
567 .nav-title {
568 font-size: 32rpx;
569 font-weight: 500;
570 color: #333;
571 }
572
573 .nav-right {
574 width: 44rpx;
575 }
576
577 /* 会员卡 */
578 .member-card {
579 position: relative;
580 height: 450rpx;
581 border-radius: 0;
582 overflow: hidden;
583 }
584
585 .member-title {
586 width: 100%;
587 display: flex;
588 justify-content: space-between;
589 align-items: center;
590 border-bottom: 1px solid #eff2f8;
591 padding-bottom: 20rpx;
592 margin-bottom: 20rpx;
593
594 .member-id {
595 font-size: 30rpx;
596
597 }
598 }
599
600 .card-bg {
601 position: absolute;
602 top: 0;
603 left: 0;
604 width: 100%;
605 height: 100%;
606 z-index: 0;
607 }
608
609 .bind-student {
610 //position: absolute;
611 //top: 30rpx;
612 //right: 30rpx;
613 display: flex;
614 align-items: center;
615 //gap: 8rpx;
616 z-index: 10;
617 padding: 5rpx 16rpx;
618 border-radius: 30rpx;
619 //border: 1px solid #fff;
620 background: #dbbf79;
621 }
622
623 .bind-student text {
624 font-size: 26rpx;
625 color: #5c4b37;
626 }
627
628 .bind-icon {
629 width: 45rpx;
630 height: 45rpx;
631 }
632
633 .user-section {
634 position: relative;
635 z-index: 1;
636 padding: 30rpx 30rpx 0;
637 }
638
639 .user-top {
640 display: flex;
641 align-items: center;
642 gap: 20rpx;
643 margin-bottom: 10rpx;
644 }
645
646 .avatar-wrap {
647 flex-shrink: 0;
648 }
649
650 .avatar {
651 width: 110rpx;
652 height: 110rpx;
653 border-radius: 50%;
654 border: 3rpx solid rgba(255, 255, 255, 0.6);
655 }
656
657 .member-id {
658 font-size: 26rpx;
659 color: #503000;
660 }
661
662 .user-bottom {
663 //padding-left: 0;
664 padding: 0 30rpx;
665 }
666
667 .user-name {
668 font-size: 50rpx;
669 font-weight: bold;
670 color: #5c4b37;
671 margin-bottom: 16rpx;
672 margin-left: 16rpx;
673 }
674
675 .card-info {
676 display: flex;
677 flex-direction: column;
678 gap: 10rpx;
679 }
680
681 .info-row {
682 font-size: 30rpx;
683 color: #503000;
684 display: flex;
685 justify-content: space-between;
686 }
687
688 /* 已过期印章 */
689 .expired-stamp {
690 position: absolute;
691 right: 30rpx;
692 bottom: 150rpx;
693 width: 150rpx;
694 height: 150rpx;
695 z-index: 1;
696 }
697
698 /* 卡片右下角按钮 */
699 .card-btns {
700 position: absolute;
701 left: 50rpx;
702 bottom: 37rpx;
703 z-index: 10;
704 display: flex;
705 gap: 16rpx;
706 }
707
708 .card-btn {
709 background: rgba(255, 255, 255, 0.9);
710 border-radius: 30rpx;
711 padding: 0 30rpx 5rpx 30rpx;
712 border: 1px solid #e0c36c;
713 }
714
715 .card-btn text {
716 height: 24rpx;
717 line-height: 24rpx;
718 font-size: 24rpx;
719 color: #c7990f;
720 }
721
722 /* 功能按钮卡片 */
723 .func-card {
724 margin: -23rpx 30rpx 30rpx;
725 background: #ffffff;
726 border-radius: 20rpx;
727 padding: 36rpx 0;
728 box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
729 position: relative;
730 z-index: 2;
731 }
732
733 .func-list {
734 display: flex;
735 justify-content: space-around;
736 padding: 0 20rpx;
737 }
738
739 .func-item {
740 display: flex;
741 flex-direction: column;
742 align-items: center;
743 gap: 12rpx;
744 }
745
746 .func-icon {
747 width: 72rpx;
748 height: 72rpx;
749 display: flex;
750 align-items: center;
751 justify-content: center;
752 // background: #f0f7ff;
753 // border-radius: 16rpx;
754 image {
755 width: 72rpx;
756 height: 72rpx;
757 }
758 }
759
760 .func-text {
761 font-size: 24rpx;
762 color: #333;
763 }
764
765 /* 查询功能区域 */
766 .query-section {
767 margin: 0 30rpx;
768 background: #ffffff;
769 border-radius: 20rpx;
770 box-shadow: 0 2rpx 16rpx rgba(0, 0, 0, 0.06);
771 overflow: hidden;
772 }
773
774 .query-item {
775 display: flex;
776 align-items: center;
777 justify-content: space-between;
778 padding: 32rpx 30rpx;
779 border-bottom: 1rpx solid #f5f5f5;
780 }
781
782 .query-item:last-child {
783 border-bottom: none;
784 }
785
786 .query-item-left {
787 display: flex;
788 align-items: center;
789 gap: 16rpx;
790 }
791
792 .query-item-icon {
793 width: 44rpx;
794 height: 48rpx;
795 }
796
797 .query-item-text {
798 font-size: 28rpx;
799 color: #333;
800 }
801
802 /* 绑定学员弹框 */
803 .bind-popup {
804 width: 600rpx;
805 background: #ffffff;
806 border-radius: 24rpx;
807 overflow: hidden;
808 }
809
810 .popup-title {
811 font-size: 32rpx;
812 font-weight: 500;
813 color: #333;
814 text-align: center;
815 padding: 40rpx 30rpx 20rpx;
816 }
817
818 .popup-content {
819 padding: 20rpx 30rpx 40rpx;
820 }
821
822 .form-item {
823 display: flex;
824 align-items: center;
825 margin-bottom: 24rpx;
826 }
827
828 .form-item:last-child {
829 margin-bottom: 0;
830 }
831
832 .form-label {
833 width: 120rpx;
834 font-size: 28rpx;
835 color: #333;
836 flex-shrink: 0;
837 }
838
839 .form-input {
840 flex: 1;
841 background: #f5f5f5;
842 border-radius: 12rpx;
843 padding: 20rpx 24rpx;
844 }
845
846 .form-input input {
847 font-size: 28rpx;
848 color: #333;
849 width: 100%;
850 }
851
852 .placeholder-class {
853 color: #999;
854 }
855
856 .popup-btns {
857 display: flex;
858 border-top: 1rpx solid #eee;
859 }
860
861 .popup-btn {
862 flex: 1;
863 height: 100rpx;
864 line-height: 100rpx;
865 text-align: center;
866 font-size: 30rpx;
867 }
868
869 .popup-btn.cancel {
870 color: #666;
871 border-right: 1rpx solid #eee;
872 }
873
874 .popup-btn.confirm {
875 color: #C40F18;
876 font-weight: 500;
877 }
878
879 /* 退出登录确认框 */
880 .confirm-mask {
881 position: fixed;
882 top: 0;
883 left: 0;
884 right: 0;
885 bottom: 0;
886 background: rgba(0, 0, 0, 0.5);
887 display: flex;
888 align-items: center;
889 justify-content: center;
890 z-index: 1000;
891 }
892
893 .confirm-box {
894 width: 600rpx;
895 background: #ffffff;
896 border-radius: 20rpx;
897 overflow: hidden;
898 }
899
900 .confirm-content {
901 padding: 40rpx;
902 text-align: center;
903 }
904
905 .confirm-title {
906 font-size: 32rpx;
907 font-weight: 500;
908 color: #333;
909 margin-bottom: 20rpx;
910 }
911
912 .confirm-text {
913 font-size: 28rpx;
914 color: #666;
915 margin-top: 30rpx;
916 color: #C40F18;
917 color: #dbbb69;
918
919 }
920
921 .confirm-buttons {
922 display: flex;
923 border-top: 1rpx solid #eee;
924 }
925
926 .confirm-btn {
927 flex: 1;
928 height: 100rpx;
929 line-height: 100rpx;
930 text-align: center;
931 font-size: 30rpx;
932 }
933
934 .confirm-btn.cancel {
935 color: #666;
936 border-right: 1rpx solid #eee;
937 }
938
939 .confirm-btn.confirm {
940 color: #C40F18;
941 font-weight: 500;
942 color: #dbbb69;
943 }
944
945 .logOut {
946 display: flex;
947 justify-content: center;
948 margin-top: 16px;
949 padding-bottom: 20rpx;
950
951 .logOutBtn {
952 background-image: linear-gradient(135deg, #dbbb69 10%, #f0deb0 100%);;
953 backdrop-filter: blur(4px);
954 width: 80%;
955 border: 1px solid #dadada;
956 padding: 20rpx 50rpx;
957 border-radius: 50rpx;
958 font-weight: 600;
959 font-size: 30rpx;
960 color: #fff;
961 text-align: center;
962 cursor: pointer;
963 }
964 }
965 </style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!