Home Explore Help
Sign In
wfg
/
lottery
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: b26beb74a3
Branches Tags
lottery
/
lottery
/
userProfile.html

userProfile.html 33 KB
History Raw

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3. 

  4. <head>
    5. 

  5.   <meta charset="UTF-8">
    6. 

  6.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7. 

  7.   <meta name="viewport"
    8. 

  8.     content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover" />
    9. 

  9.   <title>微分机器人</title>
    10. 

  10.   <!--引入 element-ui 的样式，-->
    11. 

  11.   <link rel="stylesheet"
    12. 

  12.     href="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742018383195/element-ui.css">
    13. 

  13.   <link rel="stylesheet" href="css/page-return.css">
    14. 

  14.     <!-- 必须先引入vue，  后使用element-ui -->
    15. 

  15.   <script
    16. 

  16.     src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017957144/vue.js"></script>
    17. 

  17.   <!-- 引入element 的组件库-->
    18. 

  18.   <script
    19. 

  19.     src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017747738/element-ui.js"></script>
    20. 

  20.   <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    21. 

  21.   <script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
    22. 

  22.   <script src="js/page-return.js"></script>
    23. 

  23.   <script src="js/vconsole.min.js"></script>
    24. 

  24.   <script>
    25. 

  25. 		  var vConsole = new window.VConsole();
    26. 

  26. 		</script>
    27. 

  27. </head>
    28. 

  28. <style>
    29. 

  29.   body {
    30. 

  30.     margin: 0;
    31. 

  31.     padding: 0;
    32. 

  32.   }
    33. 

  33. 

  34.   .box {
    35. 

  35.     width: 100vw;
    36. 

  36.     height: auto;
    37. 

  37.     box-sizing: border-box;
    38. 

  38.     background: #FAFAFA;
    39. 

  39.   }
    40. 

  40. 

  41.   .page6 {
    42. 

  42.     width: 100vw;
    43. 

  43.     box-sizing: border-box;
    44. 

  44.     padding-bottom: 39px;
    45. 

  45.   }
    46. 

  46.   .tab_list {
    47. 

  47.     width: 100%;
    48. 

  48.     height: 48px;
    49. 

  49.     background: #FFFFFF;
    50. 

  50.   }
    51. 

  51.   .client_detail {
    52. 

  52.     width: 100vw;
    53. 

  53.     min-height: 100vh;
    54. 

  54.     padding: 10px 10px 12px;
    55. 

  55.     box-sizing: border-box;
    56. 

  56.   }
    57. 

  57.   .client_msg {
    58. 

  58.     width: 100%;
    59. 

  59.     background: #FFFFFF;
    60. 

  60.     border-radius: 10px;
    61. 

  61.     padding: 15px 15px 20px;
    62. 

  62.     box-sizing: border-box;
    63. 

  63.     margin-bottom: 10px;
    64. 

  64.   }
    65. 

  65.   .client_wx {
    66. 

  66.     display: flex;
    67. 

  67.     align-items: center;
    68. 

  68.     margin-bottom: 15px;
    69. 

  69.   }
    70. 

  70.   .client_wx img {
    71. 

  71.     width: 64px;
    72. 

  72.     height: 64px;
    73. 

  73.     border-radius: 8px;
    74. 

  74.     margin-right: 12px;
    75. 

  75.   }
    76. 

  76.   .wx_msg {
    77. 

  77.     display: flex;
    78. 

  78.     flex-direction: column;
    79. 

  79.     font-weight: 500;
    80. 

  80.     font-size: 16px;
    81. 

  81.     color: #222222;
    82. 

  82.   }
    83. 

  83.   .wx_tag {
    84. 

  84.     color: #05D167;
    85. 

  85.     padding-left: 10px;
    86. 

  86.   }
    87. 

  87.   .add_time {
    88. 

  88.     font-weight: 400;
    89. 

  89.     font-size: 14px;
    90. 

  90.     color: #CCCCCC;
    91. 

  91.     padding-top: 10px;
    92. 

  92.   }
    93. 

  93.   .msg_title {
    94. 

  94.     font-weight: 400;
    95. 

  95.     font-size: 14px;
    96. 

  96.     color: #222222;
    97. 

  97.     line-height: 20px;
    98. 

  98.     position: relative;
    99. 

  99.     display: flex;
    100. 

  100.     align-items: center;
    101. 

  101.     padding-left: 5px;
    102. 

  102.     margin-bottom: 15px;
    103. 

  103.     &::before {
    104. 

  104.         content: '';
    105. 

  105.         position: absolute;
    106. 

  106.         width: 3px;
    107. 

  107.         height: 12px;
    108. 

  108.         left: 0;
    109. 

  109.         background: #1677FF;
    110. 

  110.         border-radius: 2px;
    111. 

  111.     }
    112. 

  112.   }
    113. 

  113.   .msg_title_line {
    114. 

  114.     padding-top: 15px;
    115. 

  115.     border-top: 1px dashed #E5E8ED;
    116. 

  116.   }
    117. 

  117.   .basic_msg {
    118. 

  118.     display: flex;
    119. 

  119.     flex-wrap: wrap;
    120. 

  120.   }
    121. 

  121.   .basic_msg_item {
    122. 

  122.     font-weight: 400;
    123. 

  123.     font-size: 14px;
    124. 

  124.     color: #222222;
    125. 

  125.     line-height: 20px;
    126. 

  126.     margin-bottom: 15px;
    127. 

  127.     display: flex;
    128. 

  128.     align-items: flex-start;
    129. 

  129.     justify-content: flex-start;
    130. 

  130.     word-break: break-all;
    131. 

  131.   }
    132. 

  132.   .basic_msg_item img {
    133. 

  133.     width: 16px;
    134. 

  134.     height: 16px;
    135. 

  135.     margin-left: 4px;
    136. 

  136.     margin-top: 2px;
    137. 

  137.   }
    138. 

  138.   .basic_msg_data {
    139. 

  139.     color: #999999;
    140. 

  140.     padding-right: 5px;
    141. 

  141.     flex-shrink: 0;
    142. 

  142.   }
    143. 

  143.   .three_tab_list {
    144. 

  144.     width: 100%;
    145. 

  145.     height: 58px;
    146. 

  146.     background: #FFFFFF;
    147. 

  147.   }
    148. 

  148.   .three_tab {
    149. 

  149.     width: 100%;
    150. 

  150.     background: #FFFFFF;
    151. 

  151.     border-radius: 10px;
    152. 

  152.     padding: 0 10px 10px;
    153. 

  153.     box-sizing: border-box;
    154. 

  154.   }
    155. 

  155.   .data_box {
    156. 

  156.     width: 100%;
    157. 

  157.     padding: 15px;
    158. 

  158.     background: #F7F9FC;
    159. 

  159.     border-radius: 5px;
    160. 

  160.     margin-bottom: 20px;
    161. 

  161.     box-sizing: border-box;
    162. 

  162.   }
    163. 

  163.   .belong_item {
    164. 

  164.     display: flex;
    165. 

  165.     align-items: center;
    166. 

  166.     margin-bottom: 15px;
    167. 

  167.     font-weight: 400;
    168. 

  168.     font-size: 14px;
    169. 

  169.     color: #222222;
    170. 

  170.   }
    171. 

  171.   .belong_item:last-child {
    172. 

  172.     margin-bottom: 0; 
    173. 

  173.   }
    174. 

  174.   .belong_title {
    175. 

  175.     color: #999999;
    176. 

  176.     margin-right: 5px;
    177. 

  177.     flex-shrink: 0;
    178. 

  178.   }
    179. 

  179.   .client_followUp {
    180. 

  180.     width: 100vw;
    181. 

  181.     height: calc(100vh - 48px - 39px);
    182. 

  182.     padding: 20px 10px 60px;
    183. 

  183.     box-sizing: border-box;
    184. 

  184.     overflow-y: auto;
    185. 

  185.   }
    186. 

  186.   .stage {
    187. 

  187.     width: 100%;
    188. 

  188.     background: #F5F7FA;
    189. 

  189.     border-radius: 5px;
    190. 

  190.     padding: 15px;
    191. 

  191.     display: flex;
    192. 

  192.     align-items: center;
    193. 

  193.     font-weight: 400;
    194. 

  194.     font-size: 16px;
    195. 

  195.     color: #222222;
    196. 

  196.     box-sizing: border-box;
    197. 

  197.     margin-bottom: 20px;
    198. 

  198.   }
    199. 

  199.   .stage img {
    200. 

  200.     width: 24px;
    201. 

  201.     height: 24px;
    202. 

  202.     margin-right: 5px; 
    203. 

  203.   }
    204. 

  204.   .stage_data {
    205. 

  205.     font-weight: 500;
    206. 

  206.     font-size: 16px;
    207. 

  207.     color: #1677FF;
    208. 

  208.   }
    209. 

  209.   .followup_list {
    210. 

  210.     width: 100%;
    211. 

  211.     padding: 15px 10px;
    212. 

  212.     background: #FFFFFF;
    213. 

  213.     border-radius: 10px;
    214. 

  214.     box-sizing: border-box;
    215. 

  215.   }
    216. 

  216.   .follow_time {
    217. 

  217.     display: flex;
    218. 

  218.     align-items: center;
    219. 

  219.     font-weight: 400;
    220. 

  220.     font-size: 14px;
    221. 

  221.     color: #222222;
    222. 

  222.     margin-bottom: 15px;
    223. 

  223.   }
    224. 

  224.   .time_dot {
    225. 

  225.     background: #E6F0FF;
    226. 

  226.     padding: 3px;
    227. 

  227.     border-radius: 50%;
    228. 

  228.     margin-right: 10px;
    229. 

  229.     box-sizing: border-box;
    230. 

  230.   }
    231. 

  231.   .dot {
    232. 

  232.     width: 6px;
    233. 

  233.     height: 6px;
    234. 

  234.     background: #1677FF;
    235. 

  235.     border-radius: 50%;
    236. 

  236.   }
    237. 

  237.   .follow_item {
    238. 

  238.     margin-left: 22px;
    239. 

  239.     padding-right: 10px;
    240. 

  240.     padding-left: 14px;
    241. 

  241.     padding-bottom: 6px;
    242. 

  242.   }
    243. 

  243.   .follow_padding {
    244. 

  244.     padding-top: 15px; 
    245. 

  245.     padding-bottom: 4px;
    246. 

  246.     background: #F7F9FC;
    247. 

  247.     border-radius: 5px;
    248. 

  248.   }
    249. 

  249.   .follow_item_time {
    250. 

  250.     font-weight: 500;
    251. 

  251.     font-size: 14px;
    252. 

  252.     color: #222222;
    253. 

  253.     display: flex;
    254. 

  254.     align-items: center;
    255. 

  255.     margin-bottom: 3px;
    256. 

  256.   }
    257. 

  257.   .item_time {
    258. 

  258.     font-weight: 400;
    259. 

  259.     font-size: 12px;
    260. 

  260.     color: #999999;
    261. 

  261.     padding-right: 10px;
    262. 

  262.   }
    263. 

  263.   .item_box {
    264. 

  264.     display: flex;
    265. 

  265.     align-items: flex-end;
    266. 

  266.   }
    267. 

  267.   .follow_item_line {
    268. 

  268.     display: flex;
    269. 

  269.     flex-direction: column;
    270. 

  270.     align-items: center;
    271. 

  271.     padding-left: 13px;
    272. 

  272.     padding-right: 21px;
    273. 

  273.   }
    274. 

  274.   .line_dot {
    275. 

  275.     width: 6px;
    276. 

  276.     height: 6px;
    277. 

  277.     background: #1677FF;
    278. 

  278.     border-radius: 50%;
    279. 

  279.     margin-bottom: 5px;
    280. 

  280.   }
    281. 

  281.   .line {
    282. 

  282.       width: 1px;
    283. 

  283.       height: 66px;
    284. 

  284.       border-left: 1px dashed #1677FF;
    285. 

  285.     }
    286. 

  286.   .item_content {
    287. 

  287.     background: #FFFFFF;
    288. 

  288.     border-radius: 5px;
    289. 

  289.     padding: 10px;
    290. 

  290.     font-weight: 400;
    291. 

  291.     font-size: 12px;
    292. 

  292.     color: #222222;
    293. 

  293.     width: 100%;
    294. 

  294.     height: 100%;
    295. 

  295.   }
    296. 

  296.   .item_tip {
    297. 

  297.     font-weight: 400;
    298. 

  298.     font-size: 12px;
    299. 

  299.     color: #999999;
    300. 

  300.     margin-top: 6px;
    301. 

  301.   }
    302. 

  302.   .item_p {
    303. 

  303.     color: #1677FF; 
    304. 

  304.   }
    305. 

  305.   .tag_list {
    306. 

  306.     display: flex;
    307. 

  307.     flex-wrap: wrap;
    308. 

  308.   }
    309. 

  309.   .tag_item {
    310. 

  310.     font-weight: 400;
    311. 

  311.     font-size: 12px;
    312. 

  312.     color: #1677FF;
    313. 

  313.     padding: 6px 10px;
    314. 

  314.     border-radius: 5px;
    315. 

  315.     border: 1px solid #1677FF;
    316. 

  316.     margin-right: 10px;
    317. 

  317.     margin-bottom: 15px;
    318. 

  318.   }
    319. 

  319.   .tag_item:last-child {
    320. 

  320.     margin-right: 0; 
    321. 

  321.   }
    322. 

  322.   .read_content {
    323. 

  323.     display: flex;
    324. 

  324.   }
    325. 

  325.   .read_box {
    326. 

  326.     width: 100%;
    327. 

  327.     padding: 15px 15px 10px;
    328. 

  328.     font-weight: 400;
    329. 

  329.     font-size: 14px;
    330. 

  330.     color: #222222;
    331. 

  331.     background: #F7F9FC;
    332. 

  332.     border-radius: 5px;
    333. 

  333.   }
    334. 

  334.   .read_title {
    335. 

  335.     padding-bottom: 10px;
    336. 

  336.   }
    337. 

  337.   .read_num {
    338. 

  338.     font-weight: bold;
    339. 

  339.     font-size: 20px;
    340. 

  340.     color: #222222;
    341. 

  341.     line-height: 29px;
    342. 

  342.   }
    343. 

  343.   
    344. 

  344.   .foot_btn {
    345. 

  345.     position: fixed;
    346. 

  346.     bottom: 49px;
    347. 

  347.     padding: 0 35px;
    348. 

  348.     width: 100%;
    349. 

  349.     box-sizing: border-box;
    350. 

  350.   }
    351. 

  351. 

  352.   .signUp_btn {
    353. 

  353.     height: 50px;
    354. 

  354.     width: 100%;
    355. 

  355.     background: #1677FF;
    356. 

  356.     border-radius: 10px;
    357. 

  357.     font-weight: bold;
    358. 

  358.     font-size: 14px;
    359. 

  359.     color: #FFFFFF;
    360. 

  360.     text-align: center;
    361. 

  361.   }
    362. 

  362.   .el-dialog {
    363. 

  363. 		width: 335px;
    364. 

  364. 		border-radius: 20px;
    365. 

  365. 	}
    366. 

  366. 

  367. 	.el-dialog__header {
    368. 

  368. 		text-align: center;
    369. 

  369. 	}
    370. 

  370. 

  371. 	.el-dialog__title {
    372. 

  372. 		font-weight: 500;
    373. 

  373. 		font-size: 16px;
    374. 

  374. 		color: #222222;
    375. 

  375. 	}
    376. 

  376. 

  377. 	.el-dialog__body {
    378. 

  378. 		height: 260px;
    379. 

  379. 		overflow-y: auto;
    380. 

  380. 	}
    381. 

  381. 	.prize_form .el-form-item {
    382. 

  382. 		padding: 0;
    383. 

  383. 	}
    384. 

  384. 

  385. 	.prize_form .el-form-item__label {
    386. 

  386. 		line-height: 20px;
    387. 

  387. 	}
    388. 

  388. 

  389. 	.prize_form .el-input {
    390. 

  390. 		width: 295px;
    391. 

  391. 	}
    392. 

  392. 

  393. 	.prize_form .el-input__inner {
    394. 

  394. 		text-align: left;
    395. 

  395. 	}
    396. 

  396. 

  397. 	.prize_form .el-textarea.is-active .el-textarea__inner,
    398. 

  398. 	.prize_form .el-textarea__inner:focus {
    399. 

  399. 		border: 1px solid #1677FF;
    400. 

  400. 	}
    401. 

  401. 

  402. 	.el-radio__input.is-checked .el-radio__inner {
    403. 

  403. 		border-color: #1677FF;
    404. 

  404. 		background: #1677FF;
    405. 

  405. 	}
    406. 

  406. 

  407. 	.el-radio__input.is-checked+.el-radio__label {
    408. 

  408. 		color: #1677FF;
    409. 

  409. 	}
    410. 

  410.   .el-radio {
    411. 

  411.     margin-top: 10px;
    412. 

  412.   }
    413. 

  413. 	.el-select .el-input.is-focus .el-input__inner {
    414. 

  414. 		border-color: #1677FF;
    415. 

  415. 	}
    416. 

  416. 

  417. 	.dialog-footer {
    418. 

  418. 		text-align: center;
    419. 

  419. 	}
    420. 

  420. 

  421. 	.dialog-footer button {
    422. 

  422. 		width: 100%;
    423. 

  423. 		height: 46px;
    424. 

  424. 		background: #1677FF;
    425. 

  425. 		border-radius: 20px;
    426. 

  426. 		font-weight: 500;
    427. 

  427. 		font-size: 16px;
    428. 

  428. 		color: #FFFFFF;
    429. 

  429. 		border: none;
    430. 

  430. 	}
    431. 

  431. </style>
    432. 

  432. 

  433. <body>
    434. 

  434.   <div id="box" class="box">
    435. 

  435.     <div class="page6">
    436. 

  436.       <el-tabs class="tab_list" v-model="activeName" stretch @tab-click="handleClick">
    437. 

  437.         <el-tab-pane label="客户画像" name="first"></el-tab-pane>
    438. 

  438.         <el-tab-pane label="客户跟进" name="second"></el-tab-pane>
    439. 

  439.       </el-tabs>
    440. 

  440.       <div class="client_detail" v-if="activeName ==='first'">
    441. 

  441.         <div class="client_msg">
    442. 

  442.           <div class="client_wx">
    443. 

  443.             <img :src="clientData.avatar" />
    444. 

  444.             <div class="wx_msg">
    445. 

  445.               <div>{{clientData.name}}<span class="wx_tag">@微信</span></div>
    446. 

  446.               <div class="add_time">添加时间：{{timeFormat(clientData.addTime, 'yyyy-MM-dd hh:mm:ss')}}</div>
    447. 

  447.             </div>
    448. 

  448.           </div>
    449. 

  449.           <div class="msg_title msg_title_line">基本信息</div>
    450. 

  450.           <div class="basic_msg" style="width: 100%;">
    451. 

  451.             <div class="basic_msg_item" style="width: 50%;">
    452. 

  452.               <span class="basic_msg_data">姓名：</span>
    453. 

  453.               <span>{{clientData.realName}}</span>
    454. 

  454.             </div>
    455. 

  455.             <div class="basic_msg_item" style="width: 50%;">
    456. 

  456.               <span class="basic_msg_data">手机：</span>
    457. 

  457.               <span>{{clientData.phone}}</span>
    458. 

  458.               <img src="./img/edit.png" alt="" @click="handleEdit('手机', clientData.phone, 'phone')">
    459. 

  459.             </div>
    460. 

  460.             <div class="basic_msg_item" style="width: 50%;">
    461. 

  461.               <span class="basic_msg_data">省市：</span>
    462. 

  462.               <span>{{clientData.province}}-{{clientData.city}}</span>
    463. 

  463.             </div>
    464. 

  464.             <div class="basic_msg_item" style="width: 50%;">
    465. 

  465.               <span class="basic_msg_data">意向车型：</span>
    466. 

  466.               <span>{{clientData.intenModel}}</span>
    467. 

  467.             </div>
    468. 

  468.             <div class="basic_msg_item" style="width: 50%;">
    469. 

  469.               <span class="basic_msg_data">已购车型：</span>
    470. 

  470.               <span>{{clientData.buyModel}}</span>
    471. 

  471.             </div>
    472. 

  472.             <div class="basic_msg_item" style="width: 50%;">
    473. 

  473.               <span class="basic_msg_data">vin码：</span>
    474. 

  474.               <span>{{clientData.vin}}</span>
    475. 

  475.               <img src="./img/edit.png" alt="" @click="handleEditOther('vin')">
    476. 

  476.             </div>
    477. 

  477.             <div class="basic_msg_item" style="width: 50%;" v-for="(item, index) in clientData.cols">
    478. 

  478.               <span class="basic_msg_data">{{item.name}}：</span>
    479. 

  479.               <span v-if="item.value">{{item.value[0]}}</span>
    480. 

  480.               <img src="./img/edit.png" alt="" @click="handleEditOther('cols')">
    481. 

  481.             </div>
    482. 

  482.           </div>
    483. 

  483.           <!-- <div class="msg_title msg_title_line">服务信息</div>
    484. 

  484.           <div class="basic_msg">
    485. 

  485.             <div class="basic_msg_item">
    486. 

  486.               <span class="basic_msg_data">上次到店时间：</span>
    487. 

  487.               <span>2024/03/10 12:30:53</span>
    488. 

  488.             </div>
    489. 

  489.             <div class="basic_msg_item">
    490. 

  490.               <span class="basic_msg_data">到店业务类型：</span>
    491. 

  491.               <span>维修</span>
    492. 

  492.             </div>
    493. 

  493.             <div class="basic_msg_item">
    494. 

  494.               <span class="basic_msg_data">备注：</span>
    495. 

  495.               <span>水电费收到水电费收到水电费收到水电费收到水电费收到</span>
    496. 

  496.             </div>
    497. 

  497.           </div> -->
    498. 

  498.         </div>
    499. 

  499.         <div class="three_tab">
    500. 

  500.           <el-tabs class="three_tab_list" v-model="itemActiveName" stretch @tab-click="handleDetailTab">
    501. 

  501.             <el-tab-pane label="画像" name="first"></el-tab-pane>
    502. 

  502.             <el-tab-pane label="记录" name="second"></el-tab-pane>
    503. 

  503.             <!-- <el-tab-pane label="车辆" name="third"></el-tab-pane> -->
    504. 

  504.           </el-tabs>
    505. 

  505.           <div v-if="itemActiveName === 'first'">
    506. 

  506.             <div class="data_box">
    507. 

  507.               <div class="belong_item">
    508. 

  508.                 <div class="belong_title">所属成员：</div>
    509. 

  509.                 <template v-if="clientData.memberList">
    510. 

  510.                   <div v-if="clientData.memberList.length > 1">
    511. 

  511.                     {{ clientData.memberList[0] }}等<span style="color: #1677FF;">{{ clientData.memberList.length }}</span>人
    512. 

  512.                   </div>
    513. 

  513.                   <div v-else-if="clientData.memberList.length === 1">
    514. 

  514.                     {{ clientData.memberList[0] }}
    515. 

  515.                   </div>
    516. 

  516.                 </template>
    517. 

  517.               </div>
    518. 

  518.               <div class="belong_item">
    519. 

  519.                 <div class="belong_title">所在群聊：</div>
    520. 

  520.                 <template v-if="clientData.groupChatList">
    521. 

  521.                   <div v-if="clientData.groupChatList.length > 1">
    522. 

  522.                     「{{ clientData.groupChatList[0] }}」等<span style="color: #1677FF;">{{ clientData.groupChatList.length }}</span>个群聊
    523. 

  523.                   </div>
    524. 

  524.                   <div v-else-if="clientData.groupChatList.length === 1">
    525. 

  525.                     「{{ clientData.groupChatList[0] }}」
    526. 

  526.                   </div>
    527. 

  527.                 </template>
    528. 

  528.               </div>
    529. 

  529.             </div>
    530. 

  530.             <div class="msg_title">客户阶段</div>
    531. 

  531.             <div class="data_box">
    532. 

  532.               <div class="belong_item">
    533. 

  533.                 <div class="belong_title">当前阶段：</div>
    534. 

  534.                 <div style="color: #1677FF;" v-if="clientData.stepList && clientData.stepList.length">
    535. 

  535.                   <span v-for="(item, i) in clientData.stepList" :key="i">「{{ item }}」</span>
    536. 

  536.                 </div>
    537. 

  537.               </div>
    538. 

  538.             </div>
    539. 

  539.             <div class="msg_title">客户标签</div>
    540. 

  540.             <div class="data_box" style="padding-bottom: 0;">
    541. 

  541.               <div class="tag_list">
    542. 

  542.                 <span class="tag_item" v-for="(item, i) in clientData.tagList" :key="i">{{ item }}</span>
    543. 

  543.               </div>
    544. 

  544.             </div>
    545. 

  545.           </div>
    546. 

  546.           <div v-if="itemActiveName === 'second'">
    547. 

  547.             <!-- <div class="read_content">
    548. 

  548.               <div class="read_box" style="margin-right: 10px;">
    549. 

  549.                 <div class="read_title">阅读次数</div>
    550. 

  550.                 <div><span class="read_num">7282</span> 次</div>
    551. 

  551.               </div>
    552. 

  552.               <div class="read_box">
    553. 

  553.                 <div class="read_title">平均阅读时长</div>
    554. 

  554.                 <div><span class="read_num">7282</span> min</div>
    555. 

  555.               </div>
    556. 

  556.             </div> -->
    557. 

  557.             <div class="followup_list" v-for="(item, key) in recordList" :key="key">
    558. 

  558.               <div class="follow_time">
    559. 

  559.                 <div class="time_dot">
    560. 

  560.                   <div class="dot"></div>
    561. 

  561.                 </div>
    562. 

  562.                 <span>{{key}}</span>
    563. 

  563.               </div>
    564. 

  564.               <div class="follow_padding">
    565. 

  565.                 <div class="follow_item" v-for="(dt, dtIndex) in item" :key="dtIndex">
    566. 

  566.                   <div class="follow_item_time">
    567. 

  567.                     <span class="item_time">{{timeFormat(dt.createdTime, 'hh:mm')}}</span>
    568. 

  568.                     <!-- <span v-if="dt.type === 1">阅读日志</span>
    569. 

  569.                     <span v-else-if="dt.type === 2">行为日志</span>
    570. 

  570.                     <span v-else-if="dt.type === 3">修改日志</span> -->
    571. 

  571.                   </div>
    572. 

  572.                   <div class="item_box">
    573. 

  573.                     <div class="follow_item_line">
    574. 

  574.                       <div class="line_dot"></div>
    575. 

  575.                       <div class="line"></div>
    576. 

  576.                     </div>
    577. 

  577.                     <div class="item_content">
    578. 

  578.                       <div>{{dt.title}}</div>
    579. 

  579.                       <div class="item_tip">{{dt.content}}</div>
    580. 

  580.                       <div class="item_tip" v-if="dt.type === 1">持续时间：<span class="item_p">{{dt.duration}}</span>秒</div>
    581. 

  581.                     </div>
    582. 

  582.                   </div>
    583. 

  583.                 </div>
    584. 

  584.               </div>
    585. 

  585.             </div>
    586. 

  586.           </div>
    587. 

  587.         </div>
    588. 

  588.       </div>
    589. 

  589.       <div class="client_followUp" v-if="activeName === 'second'">
    590. 

  590.         <div class="stage">
    591. 

  591.           <img src="./img/stage.png" />
    592. 

  592.           <div>当前阶段：<span class="stage_data" v-for="(item, key) in stepData" :key="key">「{{item}}」</span></div>
    593. 

  593.         </div>
    594. 

  594.         <div class="followup_list" v-for="(item, key) in stepFollowList" :key="key">
    595. 

  595.           <div class="follow_time">
    596. 

  596.             <div class="time_dot">
    597. 

  597.               <div class="dot"></div>
    598. 

  598.             </div>
    599. 

  599.             <span>{{item.date}}</span>
    600. 

  600.           </div>
    601. 

  601.           <div class="follow_padding">
    602. 

  602.             <div class="follow_item" v-for="(c, cIndex) in item.content" :key="cIndex">
    603. 

  603.               <div class="follow_item_time">
    604. 

  604.                 <span class="item_time">{{timeFormat(c.updatedTime, 'hh:mm')}}</span>跟进方式：
    605. 

  605.                 <span v-if="c.followType === 0">电话联系</span>
    606. 

  606.                 <span v-else-if="c.followType === 1">面聊</span>
    607. 

  607.                 <span v-else-if="c.followType === 2">微信联系</span>
    608. 

  608.                 <span v-else-if="c.followType === 3">线上会议</span>
    609. 

  609.                 <span v-else-if="c.followType === 4">其他</span>
    610. 

  610.               </div>
    611. 

  611.               <div class="item_box">
    612. 

  612.                 <div class="follow_item_line">
    613. 

  613.                   <div class="line_dot"></div>
    614. 

  614.                   <div class="line"></div>
    615. 

  615.                 </div>
    616. 

  616.                 <div class="item_content">
    617. 

  617.                   <div>{{c.remark}}</div>
    618. 

  618.                   <div class="item_tip">跟进成员：由<span class="item_p">「{{c.memberName}}」</span>跟进</div>
    619. 

  619.                 </div>
    620. 

  620.               </div>
    621. 

  621.             </div>
    622. 

  622.           </div>
    623. 

  623.         </div>
    624. 

  624.         <div class="foot_btn">
    625. 

  625.           <el-button class="signUp_btn" :loading="loading" @click="toSignUp">去跟进</el-button>
    626. 

  626.         </div>
    627. 

  627.       </div>
    628. 

  628.     </div>
    629. 

  629.     <!-- 底部返回栏 -->
    630. 

  630.     <page-return></page-return>
    631. 

  631.     <el-dialog title="添加客户跟进" :visible.sync="showDialog">
    632. 

  632.       <el-form :model="form" class="prize_form">
    633. 

  633.         <el-form-item label="跟进方式：" required>
    634. 

  634.           <el-radio-group v-model="form.followType">
    635. 

  635.             <el-radio :label="0">电话联系</el-radio>
    636. 

  636.             <el-radio :label="1">面聊</el-radio>
    637. 

  637.             <el-radio :label="2">微信联系</el-radio>
    638. 

  638.             <el-radio :label="3">线上会议</el-radio>
    639. 

  639.             <el-radio :label="4">其他跟进</el-radio>
    640. 

  640.           </el-radio-group>
    641. 

  641.         </el-form-item>
    642. 

  642.         <el-form-item label="跟进内容：" required>
    643. 

  643.           <el-input v-model="form.remark" type="textarea" autosize></el-input>
    644. 

  644.         </el-form-item>
    645. 

  645.       </el-form>
    646. 

  646.       <div slot="footer" class="dialog-footer">
    647. 

  647.         <el-button type="primary" @click="handleSave">确定</el-button>
    648. 

  648.       </div>
    649. 

  649.     </el-dialog>
    650. 

  650.     <el-dialog title="编辑信息" :visible.sync="showEditDialog">
    651. 

  651.       <el-form class="prize_form"  @submit.native.prevent>
    652. 

  652.         <el-form-item :label="item.name" required v-for="(item, index) in editFormList" :key="index">
    653. 

  653.           <el-input v-model="item.value[0]"></el-input>
    654. 

  654.         </el-form-item>
    655. 

  655.       </el-form>
    656. 

  656.       <div slot="footer" class="dialog-footer">
    657. 

  657.         <el-button type="primary" @click="handleEditSave">确定</el-button>
    658. 

  658.       </div>
    659. 

  659.     </el-dialog>
    660. 

  660.   </div>
    661. 

  661. </body>
    662. 

  662. <script>
    663. 

  663.   new Vue({
    664. 

  664.     el: '#box',
    665. 

  665.     data() {
    666. 

  666.       return {
    667. 

  667.         httpUrl: '',
    668. 

  668.         bId: null,
    669. 

  669.         env: '',
    670. 

  670.         memberId: null,
    671. 

  671.         externalUserId: null,
    672. 

  672.         activeName: 'first',
    673. 

  673.         itemActiveName: 'first',
    674. 

  674.         clientData: {},
    675. 

  675.         recordList: {},
    676. 

  676.         stepData: [], // 阶段
    677. 

  677.         stepFollowList: [], // 跟进数据
    678. 

  678.         showDialog: false,
    679. 

  679.         form: {
    680. 

  680.           followType: 0,
    681. 

  681.           remark: '' 
    682. 

  682.         },
    683. 

  683.         loading: false,
    684. 

  684.         showEditDialog: false,
    685. 

  685.         editFormList: [],
    686. 

  686.         editType: '',
    687. 

  687.       }
    688. 

  688.     },
    689. 

  689.     created() {
    690. 

  690.       this.bId = this.getQueryParam('bId')
    691. 

  691.       this.env = this.getQueryParam('env')
    692. 

  692.       if (!this.env || this.env === 'prod') {
    693. 

  693.         this.httpUrl = 'https://wlapi.wefanbot.com'
    694. 

  694.       } else {
    695. 

  695.         this.httpUrl = 'http://test.wefanbot.com:18993'
    696. 

  696.       }
    697. 

  697.       if (this.getQueryParam('memberId')) {
    698. 

  698.         // 已授权
    699. 

  699.         this.memberId = this.getQueryParam('memberId')
    700. 

  700.         if (this.getQueryParam('externalUserId')) {
    701. 

  701.           this.externalUserId = this.getQueryParam('externalUserId')
    702. 

  702.           this.getClientExt()
    703. 

  703.         } else {
    704. 

  704.           this.getQyWxSign()
    705. 

  705.         }
    706. 

  706.       } else {
    707. 

  707.         // 授权
    708. 

  708.         this.getAuth()
    709. 

  709.       }
    710. 

  710.       // this.memberId = "woU17nDAAAnoSca19vZVKiNEKdc9tyYQ"
    711. 

  711.       // this.externalUserId = "wmU17nDAAAqZkemA_hZuM5JIIYoA_GIA"
    712. 

  712.       // this.getClientExt()
    713. 

  713.     },
    714. 

  714.     methods: {
    715. 

  715.       getAuth() {
    716. 

  716.         fetch(this.httpUrl + `/p/insuite/p/getRedirectUri?env=${this.env}&bId=${this.bId}`)
    717. 

  717.           .then(res => {
    718. 

  718.             return res.json()
    719. 

  719.           }).then(result => {
    720. 

  720.             let { data, code, msg } = result
    721. 

  721.             if (code === 1) {
    722. 

  722.               window.location.replace(data)
    723. 

  723.             } else {
    724. 

  724.               this.$message({
    725. 

  725.                 message: msg,
    726. 

  726.                 type: 'warning'
    727. 

  727.               })
    728. 

  728.             }
    729. 

  729.           })
    730. 

  730.       },
    731. 

  731.       getQyWxSign() {
    732. 

  732.         fetch(this.httpUrl + '/scrm/v1/wxcp-corp/p/getAgentConfig', {
    733. 

  733.           method: 'post',
    734. 

  734.           body: JSON.stringify({
    735. 

  735.             bid: this.bId,
    736. 

  736.             url: window.location.href,
    737. 

  737.           }),
    738. 

  738.           headers: {
    739. 

  739.             'Content-Type': 'application/json'
    740. 

  740.           }
    741. 

  741.         }).then(res => {
    742. 

  742.           return res.json()
    743. 

  743.         }).then(result => {
    744. 

  744.           let { data, code, msg } = result
    745. 

  745.           if (code === 1) {
    746. 

  746.             let that = this
    747. 

  747.             wx.agentConfig({
    748. 

  748.               corpid: data.corpid,
    749. 

  749.               agentid: data.agentId,
    750. 

  750.               timestamp: data.timestamp, // 必填，生成签名的时间戳
    751. 

  751.               nonceStr: data.nonceStr, // 必填，生成签名的随机串
    752. 

  752.               signature: data.agentSignature, // 必填，签名，见附录1
    753. 

  753.               jsApiList: ['getCurExternalContact'], // 必填，需要使用的JS接口列表
    754. 

  754.               success: function (res) {
    755. 

  755.                 // 回调
    756. 

  756.                 // 此处直接在注入回调中调用了获取当前外部联系人userId的接口，注意此接口是从聊天框的工具栏进入才能获取
    757. 

  757.                 wx.invoke('getCurExternalContact', {
    758. 

  758.                 }, function (res) {
    759. 

  759.                   if (res.err_msg == "getCurExternalContact:ok") {
    760. 

  760.                     console.log('invoke成功:', res.userId);
    761. 

  761.                     that.externalUserId = res.userId
    762. 

  762.                     that.getClientExt()
    763. 

  763.                   } else {
    764. 

  764.                     //错误处理
    765. 

  765.                     console.log('invoke失败:', res)
    766. 

  766.                   }
    767. 

  767.                 });
    768. 

  768. 

  769.               },
    770. 

  770.               fail: function (res) {
    771. 

  771.                 if (res.errMsg.indexOf('function not exist') > -1) {
    772. 

  772.                   alert('版本过低请升级');
    773. 

  773.                 }
    774. 

  774.               },
    775. 

  775.               complete: function (res) {
    776. 

  776.                 // 回调
    777. 

  777.                 console.log('complete1', res);
    778. 

  778.               }
    779. 

  779.             });
    780. 

  780. 

  781.           } else {
    782. 

  782.             this.$message({
    783. 

  783.               message: msg,
    784. 

  784.               type: 'warning'
    785. 

  785.             })
    786. 

  786.           }
    787. 

  787.         })
    788. 

  788.       },
    789. 

  789.       handleClick(tab) {
    790. 

  790.         this.activeName = tab.name
    791. 

  791.         if (tab.name ==='first') {
    792. 

  792.           this.getClientExt() 
    793. 

  793.         } else if (tab.name === 'second' && this.externalUserId) {
    794. 

  794.           this.getClientFollow()
    795. 

  795.         }
    796. 

  796.       },
    797. 

  797.       getClientFollow() {
    798. 

  798.         // 获取阶段
    799. 

  799.         this.getStep()
    800. 

  800.         // 获取阶段跟进数据
    801. 

  801.         this.getStepFollow()
    802. 

  802.       },
    803. 

  803.       // 获取客户画像
    804. 

  804.       getClientExt() {
    805. 

  805.         fetch(this.httpUrl + `/scrm/v1/wxcp-client-pro/p/clientExt?bId=${this.bId}&externalUserId=${this.externalUserId}&memberId=${this.memberId}`)
    806. 

  806.           .then(res => {
    807. 

  807.             return res.json()
    808. 

  808.           }).then(result => {
    809. 

  809.             let { data, code, msg } = result
    810. 

  810.             if (code === 1) {
    811. 

  811.               this.clientData = data
    812. 

  812.               if (this.clientData.cols && this.clientData.cols.length) {
    813. 

  813.                 this.clientData.cols.forEach(item => {
    814. 

  814.                   if (!item.value) {
    815. 

  815.                     item.value = []
    816. 

  816.                   }
    817. 

  817.                 })
    818. 

  818.               }
    819. 

  819.             } else {
    820. 

  820.               this.$message({
    821. 

  821.                 message: msg,
    822. 

  822.                 type: 'warning'
    823. 

  823.               })
    824. 

  824.             }
    825. 

  825.           })
    826. 

  826.       },
    827. 

  827.       handleDetailTab(tab) {
    828. 

  828.         this.itemActiveName = tab.name
    829. 

  829.         if (tab.name === 'second') {
    830. 

  830.           this.getClientLog()
    831. 

  831.         }
    832. 

  832.       },
    833. 

  833.       // 客户画像-记录
    834. 

  834.       getClientLog() {
    835. 

  835.         fetch(this.httpUrl + '/scrm/v1/wxcp-client-pro/p/clientLog', {
    836. 

  836.           method: 'post',
    837. 

  837.           body: JSON.stringify({
    838. 

  838.             bid: this.bId,
    839. 

  839.             externalUserId: this.externalUserId,
    840. 

  840.             memberId: this.memberId,
    841. 

  841.             page: 1,
    842. 

  842.             pageCount: 1000,
    843. 

  843.           }),
    844. 

  844.           headers: {
    845. 

  845.             'Content-Type': 'application/json'
    846. 

  846.           }
    847. 

  847.         }).then(res => {
    848. 

  848.           return res.json()
    849. 

  849.         }).then(result => {
    850. 

  850.           let { data, code, msg } = result
    851. 

  851.           if (code === 1) {
    852. 

  852.             this.recordList = data
    853. 

  853.           } else {
    854. 

  854.             this.$message({
    855. 

  855.               message: msg,
    856. 

  856.               type: 'warning'
    857. 

  857.             })
    858. 

  858.           }
    859. 

  859.         })
    860. 

  860.       },
    861. 

  861.       // 获取阶段
    862. 

  862.       getStep() {
    863. 

  863.         fetch(this.httpUrl + `/scrm/v1/wxcp-client-pro/p/clientStepList?bId=${this.bId}&externalUserId=${this.externalUserId}`)
    864. 

  864.           .then(res => {
    865. 

  865.             return res.json()
    866. 

  866.           }).then(result => {
    867. 

  867.             let { data, code, msg } = result
    868. 

  868.             if (code === 1) {
    869. 

  869.               this.stepData = data
    870. 

  870.             } else {
    871. 

  871.               this.$message({
    872. 

  872.                 message: msg,
    873. 

  873.                 type: 'warning'
    874. 

  874.               })
    875. 

  875.             }
    876. 

  876.           })
    877. 

  877.       },
    878. 

  878.       // 获取阶段跟进数据
    879. 

  879.       getStepFollow() {
    880. 

  880.         fetch(this.httpUrl + '/scrm/v1/wxcp-client-pro/p/clientFollow', {
    881. 

  881.           method: 'post',
    882. 

  882.           body: JSON.stringify({
    883. 

  883.             bid: this.bId,
    884. 

  884.             externalUserId: this.externalUserId,
    885. 

  885.             memberId: this.memberId,
    886. 

  886.             page: 1,
    887. 

  887.             pageCount: 1000,
    888. 

  888.           }),
    889. 

  889.           headers: {
    890. 

  890.             'Content-Type': 'application/json'
    891. 

  891.           }
    892. 

  892.         }).then(res => {
    893. 

  893.           return res.json()
    894. 

  894.         }).then(result => {
    895. 

  895.           let { data, code, msg } = result
    896. 

  896.           if (code === 1) {
    897. 

  897.             let arr = this.groupDataByDate(data.records)
    898. 

  898.             this.stepFollowList = arr.reverse()
    899. 

  899.           } else {
    900. 

  900.             this.$message({
    901. 

  901.               message: msg,
    902. 

  902.               type: 'warning'
    903. 

  903.             })
    904. 

  904.           }
    905. 

  905.         })
    906. 

  906.       },
    907. 

  907.       // 按日期分组数据
    908. 

  908.       groupDataByDate(data) {
    909. 

  909.         const grouped = {}
    910. 

  910.         // 按日期分组
    911. 

  911.         data.forEach(item => {
    912. 

  912.           const dateStr = item.updatedTime.slice(0, 10); // 提取年月日
    913. 

  913.           if (!grouped[dateStr]) {
    914. 

  914.             grouped[dateStr] = []
    915. 

  915.           }
    916. 

  916.           grouped[dateStr].push(item)
    917. 

  917.         })
    918. 

  918.         // 转换为指定格式并排序
    919. 

  919.         return Object.keys(grouped)
    920. 

  920.           .sort() // 按日期升序排列
    921. 

  921.           .map(date => ({
    922. 

  922.             date,
    923. 

  923.             content: grouped[date]
    924. 

  924.           }))
    925. 

  925.       },
    926. 

  926.       toSignUp() {
    927. 

  927.         this.showDialog = true
    928. 

  928.         this.form = {
    929. 

  929.           followType: 0,
    930. 

  930.           remark: ''
    931. 

  931.         }
    932. 

  932.       },
    933. 

  933.       // 添加客户跟进
    934. 

  934.       handleSave() {
    935. 

  935.         fetch(this.httpUrl + '/scrm/v1/wxcp-client-pro/p/addFollow', {
    936. 

  936.           method: 'post',
    937. 

  937.           body: JSON.stringify({
    938. 

  938.             bid: this.bId,
    939. 

  939.             externalUserId: this.externalUserId,
    940. 

  940.             memberId: this.memberId,
    941. 

  941.             followType: this.form.followType,
    942. 

  942.             remark: this.form.remark,
    943. 

  943.           }),
    944. 

  944.           headers: {
    945. 

  945.             'Content-Type': 'application/json'
    946. 

  946.           }
    947. 

  947.         }).then(res => {
    948. 

  948.           return res.json()
    949. 

  949.         }).then(result => {
    950. 

  950.           let { data, code, msg } = result
    951. 

  951.           if (code === 1) {
    952. 

  952.             this.showDialog = false
    953. 

  953.             this.getClientFollow()
    954. 

  954.             this.$message({
    955. 

  955.               message: '添加成功',
    956. 

  956.               type: 'success' 
    957. 

  957.             })
    958. 

  958.           } else {
    959. 

  959.             this.$message({
    960. 

  960.               message: msg,
    961. 

  961.               type: 'warning'
    962. 

  962.             })
    963. 

  963.           }
    964. 

  964.         })
    965. 

  965.       },
    966. 

  966.       // 编辑手机号
    967. 

  967.       handleEdit(title, value, type) {
    968. 

  968.         this.editFormList = [{
    969. 

  969.           name: title,
    970. 

  970.           type: 0,
    971. 

  971.           value: [value]
    972. 

  972.         }]
    973. 

  973.         this.editType = type
    974. 

  974.         this.showEditDialog = true 
    975. 

  975.       },
    976. 

  976.       // 编辑其他字段
    977. 

  977.       handleEditOther(type) {
    978. 

  978.         if (type === 'vin') {
    979. 

  979.           this.editFormList = [{
    980. 

  980.             name: 'vin码',
    981. 

  981.             type: 0,
    982. 

  982.             value: [this.clientData.vin]
    983. 

  983.           }]
    984. 

  984.         } else if (type === 'cols') {
    985. 

  985.           this.editFormList = this.clientData.cols
    986. 

  986.         }
    987. 

  987.         this.editType = 'other'
    988. 

  988.         this.showEditDialog = true
    989. 

  989.       },
    990. 

  990.       handleEditSave() {
    991. 

  991.         if (this.editType === 'phone') {
    992. 

  992.           this.editPhone()
    993. 

  993.         } else if (this.editType === 'other') {
    994. 

  994.           this.editOthers()
    995. 

  995.         }
    996. 

  996.       },
    997. 

  997.       // 修改手机号
    998. 

  998.       editPhone() {
    999. 

  999.         fetch(this.httpUrl + `/scrm/v1/wxcp-client-pro/p/updatePhone?bId=${this.bId}&externalUserId=${this.externalUserId}&memberId=${this.memberId}&phone=${this.editFormList[0].value[0]}`)
    1000. 

  1000.           .then(res => {
    1001. 

  1001.             return res.json()
    1002. 

  1002.           }).then(result => {
    1003. 

  1003.             let { data, code, msg } = result
    1004. 

  1004.             if (code === 1) {
    1005. 

  1005.               this.showEditDialog = false
    1006. 

  1006.               this.getClientExt()
    1007. 

  1007.               this.$message({
    1008. 

  1008.                 message: '编辑成功',
    1009. 

  1009.                 type: 'success'
    1010. 

  1010.               })
    1011. 

  1011.             } else {
    1012. 

  1012.               this.$message({
    1013. 

  1013.                 message: msg,
    1014. 

  1014.                 type: 'warning'
    1015. 

  1015.               })
    1016. 

  1016.             }
    1017. 

  1017.           })
    1018. 

  1018.       },
    1019. 

  1019.       // 编辑其他字段
    1020. 

  1020.       editOthers() {
    1021. 

  1021.         fetch(this.httpUrl + '/scrm/v1/wxcp-client-pro/p/updateExt', {
    1022. 

  1022.           method: 'post',
    1023. 

  1023.           body: JSON.stringify({
    1024. 

  1024.             bid: this.bId,
    1025. 

  1025.             externalUserId: this.externalUserId,
    1026. 

  1026.             memberId: this.memberId,
    1027. 

  1027.             cols: this.clientData.cols,
    1028. 

  1028.             vin: this.editFormList[0].value[0],
    1029. 

  1029.           }),
    1030. 

  1030.           headers: {
    1031. 

  1031.             'Content-Type': 'application/json'
    1032. 

  1032.           }
    1033. 

  1033.         }).then(res => {
    1034. 

  1034.           return res.json()
    1035. 

  1035.         }).then(result => {
    1036. 

  1036.           let { data, code, msg } = result
    1037. 

  1037.           if (code === 1) {
    1038. 

  1038.             this.showEditDialog = false
    1039. 

  1039.             this.getClientExt()
    1040. 

  1040.             this.$message({
    1041. 

  1041.               message: '添加成功',
    1042. 

  1042.               type: 'success'
    1043. 

  1043.             })
    1044. 

  1044.           } else {
    1045. 

  1045.             this.$message({
    1046. 

  1046.               message: msg,
    1047. 

  1047.               type: 'warning'
    1048. 

  1048.             })
    1049. 

  1049.           }
    1050. 

  1050.         })
    1051. 

  1051.       },
    1052. 

  1052.       // 截取url中的数据
    1053. 

  1053.       getQueryParam(paramName) {
    1054. 

  1054.         // 获取当前URL的查询字符串部分  
    1055. 

  1055.         const queryString = window.location.search;
    1056. 

  1056.         // 创建一个URLSearchParams对象  
    1057. 

  1057.         const urlParams = new URLSearchParams(queryString);
    1058. 

  1058.         // 返回指定参数的值，如果不存在则返回null  
    1059. 

  1059.         return urlParams.get(paramName);
    1060. 

  1060.       },
    1061. 

  1061.       timeFormat(time, format = 'yyyy-MM-dd hh:mm:ss') {
    1062. 

  1062.         if (time === undefined || time === '' || time === null) {
    1063. 

  1063.           return '/';
    1064. 

  1064.         }
    1065. 

  1065. 

  1066.         const date = new Date(time);
    1067. 

  1067.         const o = {
    1068. 

  1068.           'M+': date.getMonth() + 1, // 月份
    1069. 

  1069.           'd+': date.getDate(),      // 日
    1070. 

  1070.           'h+': date.getHours(),     // 小时
    1071. 

  1071.           'm+': date.getMinutes(),   // 分钟
    1072. 

  1072.           's+': date.getSeconds(),   // 秒
    1073. 

  1073.           'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
    1074. 

  1074.           'S': date.getMilliseconds() // 毫秒
    1075. 

  1075.         };
    1076. 

  1076. 

  1077.         // 处理年份
    1078. 

  1078.         if (/(y+)/.test(format)) {
    1079. 

  1079.           format = format.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
    1080. 

  1080.         }
    1081. 

  1081. 

  1082.         // 处理日期和时间部分
    1083. 

  1083.         for (let k in o) {
    1084. 

  1084.           if (new RegExp('(' + k + ')').test(format)) {
    1085. 

  1085.             let value = o[k];
    1086. 

  1086.             let padding = RegExp.$1.length === 1 ? '' : '00'; // 根据格式字符串中的长度决定是否补零
    1087. 

  1087.             format = format.replace(RegExp.$1, ('' + value).padStart(padding.length + value.toString().length - value.toString().length, '0'));
    1088. 

  1088.           }
    1089. 

  1089.         }
    1090. 

  1090. 

  1091.         // 如果格式只包含时间部分，移除日期部分可能的占位符
    1092. 

  1092.         if (!/(M+|d+)/.test(format)) {
    1093. 

  1093.           // 移除任何可能存在的日期占位符（如：'yyyy-MM-dd '）
    1094. 

  1094.           format = format.replace(/(\s*-\s*){2}/g, ''); // 移除两个'-'之间的任何内容
    1095. 

  1095.           format = format.replace(/^\s*yyyy-\s*/, ''); // 移除开头的'yyyy-'
    1096. 

  1096.         }
    1097. 

  1097. 

  1098.         // 如果格式只包含日期部分，移除时间部分可能的占位符
    1099. 

  1099.         if (!/(h+|m+|s+)/.test(format)) {
    1100. 

  1100.           // 移除任何可能存在的时间占位符（如：' hh:mm:ss'）
    1101. 

  1101.           format = format.replace(/(\s*:\s*){2}/g, ''); // 移除两个':'之间的任何内容
    1102. 

  1102.           format = format.replace(/\s*hh:\s*$/, ''); // 移除结尾的' hh:'
    1103. 

  1103.         }
    1104. 

  1104. 

  1105.         return format;
    1106. 

  1106.       }
    1107. 

  1107.     }
    1108. 

  1108.   })   
    1109. 

  1109. </script>
    1110. 

  1110. 

  1111. </html>
    1112.