userinfo.vue 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325
  1. <template>
  2. <view class="mb-5">
  3. <view class="p-3" v-if="userData.id">
  4. <view class="d-flex">
  5. <view class="w-100 font-bold">
  6. <view class="centerY mb-3">
  7. <view class="bule_line" style="height: 26rpx;"></view>
  8. <text class="font-bold text-dark ml-2 fs-18 line-height1">基本信息</text>
  9. </view>
  10. <view class="centerY border-bottom mb-2 fs-14" style="color: #818181;">
  11. <view class="w-50 mb-2">
  12. <view class="mb-2">
  13. 姓名:{{userData.username||''}}
  14. </view>
  15. <view class="">
  16. 出生日期:{{userData.birthday||''}}
  17. </view>
  18. </view>
  19. <view class="w-50 mb-2">
  20. <view class="mb-2">
  21. 年龄:{{$mf.getIDCardInfo(userData.idCard).age||'0'}}
  22. </view>
  23. <view class="">
  24. 性别:{{userData.sex==1?'男':'女'}}
  25. </view>
  26. </view>
  27. </view>
  28. <view class="centerY mb-2 fs-14" style="color: #818181;">
  29. <view class="w-50 mb-2">
  30. <view class=" mb-2">
  31. 文化程度:{{userData.culture ||''}}
  32. </view>
  33. <view class="">
  34. 职业:{{userData.occupation||''}}
  35. </view>
  36. </view>
  37. <view class="w-50 mb-2">
  38. <view class="mb-2">
  39. 民族:{{userData.nation||''}}
  40. </view>
  41. <view class="">
  42. 婚姻状况:{{userData.marriage||'未婚'}}
  43. </view>
  44. </view>
  45. </view>
  46. </view>
  47. <view style="position: absolute;right: 20rpx;top: 20rpx;width: 100rpx;">
  48. <view class="picbox">
  49. <image v-if="userData.sex==1" src="@/static/img/defult/head1.png" mode="widthFix" class="picimg">
  50. </image>
  51. <image v-if="userData.sex==2" src="@/static/img/defult/head2.png" mode="widthFix" class="picimg">
  52. </image>
  53. </view>
  54. </view>
  55. </view>
  56. <view class="bg-white px-3 fs-14 font-bold" style="border-radius: 16rpx;color: #818181;">
  57. <view class="d-flex border-bottom py-2">
  58. <view class="centerY space-nowrap" style="align-items: flex-start;">
  59. <image src="@/static/img/userinfo/sb.png" mode="widthFix" style="width: 40rpx;"></image>
  60. <span class="ml-1"> 社保卡号:</span>
  61. </view>
  62. <view class="">
  63. {{userData.socialInsurance||''}}
  64. </view>
  65. </view>
  66. <view class="d-flex border-bottom py-2">
  67. <view class="centerY space-nowrap" style="align-items: flex-start;">
  68. <image src="@/static/img/userinfo/sfz.png" mode="widthFix" style="width: 40rpx;"></image>
  69. <span class="ml-1"> 身份证号:</span>
  70. </view>
  71. <view class="">{{userData.idCard||''}}
  72. </view>
  73. </view>
  74. <view class="d-flex border-bottom py-2">
  75. <view class="centerY space-nowrap" style="align-items: flex-start;">
  76. <image src="@/static/img/userinfo/dh.png" mode="widthFix" style="width: 40rpx;"></image>
  77. <span class="ml-1"> 手机号码:</span>
  78. </view>
  79. <view class="">
  80. {{userData.phone||''}}
  81. </view>
  82. </view>
  83. <view class="d-flex py-2">
  84. <view class="centerY space-nowrap" style="align-items: flex-start;">
  85. <image src="@/static/img/userinfo/jt.png" mode="widthFix" style="width: 40rpx;"></image>
  86. <span class="ml-1"> 家庭住址:</span>
  87. </view>
  88. <view class="">
  89. {{userData.city + userData.area + userData.town + userData.village +userData.addressDetail}}
  90. </view>
  91. </view>
  92. </view>
  93. <view class="d-flex mt-2 font-bold" style="color: #818181;">
  94. <view class="py-1 mt-1 fs-14 space-nowrap">
  95. 医保类型:
  96. </view>
  97. <view class="fs-10 w-100">
  98. <span class="mr-1 text-center py-1 mt-2 d-inline-block w-20"
  99. :style="{borderRadius:'50rpx',background:userData.medicalInsuranceType==item.value?'#1890FF':'#EBEBEB',color:userData.medicalInsuranceType==item.value?'#fff':'#A4A4A4'}"
  100. v-for="(item,index) in MEDICAL_INSURANCE_TYPE">
  101. {{item.label}}
  102. </span>
  103. </view>
  104. </view>
  105. <view class="d-flex mt-2 font-bold" style="color: #818181;">
  106. <view class="mt-1 py-1 fs-14 space-nowrap font-bold">
  107. 慢病类型:
  108. </view>
  109. <view class="fs-10 w-100">
  110. <span class="mr-1 text-center py-1 mt-2 d-inline-block w-20"
  111. :style="{borderRadius:'50rpx',background:userData.chronicDiseaseType==item.value?'#1890FF':'#EBEBEB',color:userData.chronicDiseaseType==item.value?'#fff':'#A4A4A4'}"
  112. v-for="(item,index) in CHRONIC_DISEASE_TYPE">
  113. {{item.label}}
  114. </span>
  115. </view>
  116. </view>
  117. <view class="centerY">
  118. <view class="d-flex mt-2 font-bold w-50" style="color: #818181;">
  119. <view class="mt-1 py-1 fs-14 space-nowrap font-bold">
  120. 糖尿病病龄:
  121. </view>
  122. <view class="fs-10">
  123. <span class="mr-1 text-center py-1 mt-2 d-inline-block px-3"
  124. :style="{borderRadius:'50rpx',background:'#1890FF',color:'#fff'}">
  125. {{userData.tnbIllTime
  126. ? (
  127. (new Date().getTime() - new Date(userData.tnbIllTime).getTime()) /
  128. 31536000000
  129. ).toFixed(0)
  130. : ''}}年
  131. </span>
  132. </view>
  133. </view>
  134. <view class="d-flex mt-2 font-bold w-50" style="color: #818181;" v-if="
  135. userData.chronicDiseaseType == 1 ||
  136. userData.chronicDiseaseType == 3
  137. ">
  138. <view class="mt-1 py-1 fs-14 space-nowrap font-bold">
  139. 高血压病龄:
  140. </view>
  141. <view class="fs-10">
  142. <span class="mr-1 text-center py-1 mt-2 d-inline-block px-3"
  143. :style="{borderRadius:'50rpx',background:'#1890FF',color:'#fff'}">
  144. {{userData.gxyIllTime
  145. ? (
  146. (new Date().getTime() - new Date(userData.gxyIllTime).getTime()) /
  147. 31536000000
  148. ).toFixed(0)
  149. : ''}}年
  150. </span>
  151. </view>
  152. </view>
  153. </view>
  154. <view class=" mt-3 bg-white p-3 fs-14 font-bold" style="border-radius: 16rpx;">
  155. <view class="centerY mb-2">
  156. <view class="bule_line" style="height: 26rpx;margin-top: -2rpx;"></view>
  157. <text class="font-bold text-dark ml-2 fs-16 line-height1">其他信息</text>
  158. </view>
  159. <view class=" border-bottom pt-2">
  160. <view class="w-50 d-inline-block mb-2">
  161. <view class="centerY">
  162. <view class="w-40">
  163. <view class="picbox">
  164. <image class="picimg" src="@/static/img/userinfo/jbs.png" mode=""></image>
  165. </view>
  166. </view>
  167. <view class="w-60 ml-1">
  168. <view class="fs-16">
  169. 疾病史
  170. </view>
  171. <view class="fs-12" style="color: #818181;"
  172. v-if="!userData.diseaseHistory?true:userData.diseaseHistory&&JSON.parse(userData.diseaseHistory).length==0">
  173. </view>
  174. <uni-tooltip :content="String(JSON.parse(userData.diseaseHistory))">
  175. <view class="text-view2 fs-12" style="color: #818181;">
  176. <span class=""
  177. v-for="(item,index) in JSON.parse(userData.diseaseHistory)">{{item}};</span>
  178. </view>
  179. </uni-tooltip>
  180. </view>
  181. </view>
  182. </view>
  183. <view class="w-50 d-inline-block mb-2">
  184. <view class="centerY">
  185. <view class="w-40">
  186. <view class="picbox">
  187. <image class="picimg" src="@/static/img/userinfo/jzs.png" mode=""></image>
  188. </view>
  189. </view>
  190. <view class="w-60 ml-1">
  191. <view class="fs-16">
  192. 家族史
  193. </view>
  194. <view class="fs-12" style="color: #818181;"
  195. v-if="!userData.familyHistory?true:userData.familyHistory&&JSON.parse(userData.familyHistory).length==0">
  196. </view>
  197. <uni-tooltip
  198. :content="String(userData.familyHistory&&JSON.parse(userData.familyHistory))">
  199. <view class="text-view2 fs-12" style="color: #818181;">
  200. <span class=""
  201. v-for="(item,index) in userData.familyHistory&&JSON.parse(userData.familyHistory)">{{item}};</span>
  202. </view>
  203. </uni-tooltip>
  204. </view>
  205. </view>
  206. </view>
  207. <view class="w-50 d-inline-block mb-2" v-if="userData.saltiness">
  208. <view class="centerY">
  209. <view class="w-40">
  210. <view class="picbox">
  211. <image class="picimg" src="@/static/img/userinfo/xd.png" mode=""></image>
  212. </view>
  213. </view>
  214. <view class="w-60 ml-1">
  215. <view class="fs-16">
  216. 咸淡情况
  217. </view>
  218. <view class="fs-12" style="color: #818181;" v-if="userData.saltiness">
  219. </view>
  220. <view class="fs-12" style="color: #818181;">
  221. {{userData.saltiness}}
  222. </view>
  223. </view>
  224. </view>
  225. </view>
  226. <view class="w-50 d-inline-block mb-2">
  227. <view class="centerY">
  228. <view class="w-40">
  229. <view class="picbox">
  230. <image class="picimg" src="@/static/img/userinfo/hb.png" mode=""></image>
  231. </view>
  232. </view>
  233. <view class="w-60 ml-1">
  234. <view class="fs-16">
  235. 合并症
  236. </view>
  237. <view class="fs-12" style="color: #818181;"
  238. v-if="!userData.andComplication?true:userData.andComplication&&JSON.parse(userData.andComplication).length==0">
  239. </view>
  240. <uni-tooltip :content="String(JSON.parse(userData.andComplication))">
  241. <view class=" text-view2 fs-12" style="color: #818181;">
  242. <span class=""
  243. v-for="(item,index) in JSON.parse(userData.andComplication)">{{item}};</span>
  244. </view>
  245. </uni-tooltip>
  246. </view>
  247. </view>
  248. </view>
  249. </view>
  250. <view class="mt-2">
  251. <view class="fs-14 font-bold text-dark">
  252. 并发症
  253. </view>
  254. <view class="fs-10 w-100">
  255. <span class="mr-1 text-center py-1 px-2 mt-2 d-inline-block"
  256. :style="{borderRadius:'50rpx',background:'#E8E8E8',color:'#868687',border:'1px solid #E8E8E8'}"
  257. v-for="(item,index) in JSON.parse(userData.complication)">
  258. {{item}}
  259. </span>
  260. </view>
  261. </view>
  262. </view>
  263. </view>
  264. </view>
  265. </template>
  266. <script>
  267. import {
  268. CULTURE,
  269. MEDICAL_INSURANCE_TYPE,
  270. CHRONIC_DISEASE_TYPE,
  271. DISEASE_HISTORY,
  272. } from '@/static/js/defult_value.js'
  273. export default {
  274. data() {
  275. return {
  276. MEDICAL_INSURANCE_TYPE,
  277. CHRONIC_DISEASE_TYPE,
  278. userData: {}
  279. };
  280. },
  281. onLoad() {
  282. this.getuserinfo()
  283. },
  284. onPullDownRefresh() {
  285. this.getuserinfo()
  286. },
  287. methods: {
  288. async getuserinfo() {
  289. uni.showLoading({
  290. title: '加载中'
  291. });
  292. let idCard = uni.getStorageSync('idCard')
  293. let {
  294. data,
  295. code
  296. } = await this.$api.getUserInfo({
  297. idCard
  298. })
  299. if (code == 0) {
  300. uni.setStorageSync('userData', data || {})
  301. this.userData = data || {}
  302. uni.hideLoading();
  303. uni.stopPullDownRefresh()
  304. } else {
  305. uni.hideLoading();
  306. }
  307. }
  308. }
  309. }
  310. </script>
  311. <style lang="scss">
  312. page {
  313. background: #F5F9FF;
  314. }
  315. </style>