accountCenter2.html 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068
  1. <!DOCTYPE html>
  2. <!--[if IE 8 ]><html class="ie" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"> <![endif]-->
  3. <!--[if (gte IE 9)|!(IE)]><!--><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US"><!--<![endif]-->
  4. <head>
  5. <!-- Basic Page Needs -->
  6. <meta charset="utf-8">
  7. <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
  8. <title>班尼戈-德国班尼戈阀门【官网】</title>
  9. <link rel="icon" href="./favicon.ico" type="image/x-icon">
  10. <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
  11. <!-- Mobile Specific Metas -->
  12. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  13. <!-- Theme Style -->
  14. <link rel="stylesheet" type="text/css" href="blog/style.css">
  15. <link href="css/bootstrap.min.css" rel="stylesheet">
  16. <link href="css/style.css" rel="stylesheet">
  17. <link href="css/bng.css" rel="stylesheet">
  18. <link href="css/swiper.min.css" rel="stylesheet">
  19. <link rel="stylesheet" href="css/cxcalendar.css">
  20. <!-- <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> -->
  21. <script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
  22. <script src="js/sha1.min.js"></script>
  23. </head>
  24. <style type="text/css">
  25. body{
  26. background:#F4F5F7 ;
  27. --active-color: #009966;
  28. }
  29. .flex{
  30. display: flex;
  31. align-items: center;
  32. gap: 10px;
  33. }
  34. .container{
  35. max-width: 1200px;
  36. margin: 0 auto;
  37. }
  38. .headInfo{
  39. display: flex;
  40. align-items: center;
  41. justify-content: space-between;
  42. padding: 20px 0;
  43. }
  44. .content{
  45. position: relative;
  46. padding: 10px 20px 0px 20px;
  47. margin-bottom: 20px;
  48. background: #fff;
  49. }
  50. .color-grey{
  51. color: #999999;
  52. font-size: 14px;
  53. }
  54. .color-active{
  55. color: #009966 !important;
  56. cursor: pointer;
  57. }
  58. .color-blue{
  59. color: #3685fc;
  60. }
  61. .tabs{
  62. padding: 0;
  63. position: relative;
  64. display: flex;
  65. --active-color: #009966;
  66. }
  67. .tabs::after{
  68. position: absolute;
  69. bottom: 1px;
  70. content: '';
  71. width: 100%;
  72. height: 1px;
  73. background: rgba(0, 0, 0, 0.15);
  74. z-index: 1;
  75. }
  76. .tabs p{
  77. position: relative;
  78. height: 38px;
  79. line-height: 35px;
  80. padding: 0 5px;
  81. cursor: pointer;
  82. z-index: 2;
  83. color: rgba(51, 51, 51, 1);
  84. }
  85. .tab_active{
  86. position: relative;
  87. font-weight: bold;
  88. }
  89. .tabs:nth-child(1) p{
  90. margin-right: 30px;
  91. }
  92. .tab_active::after{
  93. content: '';
  94. position: absolute;
  95. bottom: 0;
  96. left: 8px;
  97. height: 3px;
  98. width: 28px;
  99. background-color: var(--active-color);
  100. /* display: inline-block;
  101. border-bottom: 3px solid var(--active-color); */
  102. }
  103. .shadowCard{
  104. position: relative;
  105. padding: 20px;
  106. background: #FFFFFF;
  107. /* box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16); */
  108. border: 1px solid #eeeeee;
  109. border-radius: 5px 5px 5px 5px;
  110. display: flex;
  111. flex-direction: column;
  112. }
  113. .shadowCard-right-icon{
  114. position: absolute;
  115. right:10px;
  116. top:10px;
  117. /* width: 60px; */
  118. }
  119. .flex-end{
  120. display: flex;
  121. justify-content: space-between;
  122. align-items: center;
  123. }
  124. .flex-end p{
  125. line-height: 17px;
  126. }
  127. .dataContent{
  128. margin-top: 20px;
  129. }
  130. .dataContent h3,.dataContent small,.dataContent h4{
  131. margin: 17px 0;
  132. }
  133. .dataContent small{
  134. color: #999999;
  135. }
  136. .dropdown-btn{
  137. padding:5px 10px;
  138. border: 1px solid rgba(0,0,0,0.16);
  139. border-radius:4px 4px 4px 4px ;
  140. }
  141. .percent {
  142. position: relative;
  143. width: 150px;
  144. height: 150px;
  145. }
  146. .percent svg {
  147. width: 150px;
  148. height: 150px;
  149. }
  150. .percent svg circle {
  151. fill: none;
  152. stroke-width: 10;
  153. stroke: #1258e3;
  154. transform: translate(5px, 5px);
  155. /* 设置虚线长度 = 圆的周长(2*70*3.1415926) */
  156. stroke-dasharray: 440;
  157. /* 设置圆的空白间隙 */
  158. stroke-dashoffset: var(--dashoffset);
  159. }
  160. .percent svg circle:nth-child(1) {
  161. stroke-dashoffset: 0;
  162. stroke: #f3f3f3;
  163. }
  164. .percent svg circle:nth-child(2) {
  165. stroke-dashoffset: calc(440 - 440 * (0 / 100));
  166. stroke: #3685fc;
  167. }
  168. .percent .num {
  169. position: absolute;
  170. left: 0;
  171. top: 0;
  172. width: 100%;
  173. height: 100%;
  174. display: flex;
  175. justify-content: center;
  176. align-items: center;
  177. text-align: center;
  178. }
  179. #per {
  180. font-size: 20px;
  181. }
  182. .targetBox{
  183. padding:10px 15px;
  184. border: 1px solid rgba(0, 0, 0, 0.1);
  185. border-radius: 4px 4px 4px 4px;
  186. flex: 1;
  187. }
  188. .targetBox h3{
  189. margin: 10px 0;
  190. }
  191. .grid {
  192. display: grid;
  193. grid-template-columns: repeat(6, 1fr); /* 创建三列,每列等宽 */
  194. }
  195. .grid > div{
  196. margin: 10px 0;
  197. text-align: center;
  198. }
  199. .message{
  200. height: 400px;
  201. overflow-y: scroll;
  202. padding-bottom: 60px;
  203. }
  204. .messageBox{
  205. align-items: flex-start !important;
  206. padding: 10px;
  207. }
  208. .date{
  209. flex: 0 0 70px;
  210. width: 70px;
  211. color:rgba(54, 133, 252, 1);
  212. border-right: 1px solid rgba(0, 0, 0, 0.15);
  213. }
  214. .allMsg{
  215. position: absolute;
  216. width: 100%;
  217. bottom: 0;
  218. left:0;
  219. padding:15px 10px;
  220. box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
  221. text-align: center;
  222. background: #fff;
  223. }
  224. .sys_grid {
  225. display: grid;
  226. grid-template-columns: repeat(3, 1fr); /* 创建三列,每列等宽 */
  227. gap: 20px;
  228. padding: 20px;
  229. }
  230. .sys_grid > div{
  231. position: relative;
  232. }
  233. .sys_grid > div > img{
  234. width: 100%;
  235. }
  236. .system_name{
  237. position: absolute;
  238. top:0;
  239. left: 0;
  240. height: 100%;
  241. width:calc(100% - 40px);
  242. padding: 0 20px;
  243. display: flex;
  244. align-items: center;
  245. flex-wrap: wrap;
  246. color: #fff;
  247. }
  248. .system_name h4{
  249. margin-bottom: 10px;
  250. }
  251. .system_name a{
  252. display: block;
  253. color: #fff;
  254. }
  255. .accountsRece{
  256. padding: 10px;
  257. border-radius: 4px 4px 4px 4px;
  258. border: 1px solid rgba(0,0,0,0.15);
  259. margin: 12px 0;
  260. }
  261. .accountsRece h5{
  262. font-weight: bold;
  263. }
  264. .accountsRece p{
  265. margin-top: 5px;
  266. font-size: 12px;
  267. color: rgba(102, 102, 102, 1);
  268. }
  269. .borard{
  270. border: none;
  271. }
  272. .borard h5{
  273. font-weight: bold;
  274. font-size: 16px;
  275. color: #3685fc;
  276. }
  277. .flex-start{
  278. display: flex;
  279. align-items: flex-start;
  280. }
  281. .flex-start label,.flex-start p{
  282. line-height: 30px;
  283. }
  284. .flex-start label{
  285. margin: 0 5px 0 0;
  286. }
  287. .orderMsgBox{
  288. border-bottom: 1px solid rgba(238, 238, 238, 1);
  289. margin: 15px 0;
  290. }
  291. .mobile{
  292. display: none;
  293. }
  294. .showBanner{
  295. display: none;
  296. }
  297. .mobileIcon{
  298. display: none;
  299. }
  300. .border-left{
  301. border-left:4px solid var(--active-color);
  302. text-indent: 10px;
  303. }
  304. .form-control[readonly]{
  305. background-color: #fff;
  306. box-shadow: none;
  307. width: 100px;
  308. border-bottom: 1px solid #f1f2f3;
  309. margin-bottom: 0;
  310. border-radius: 0;
  311. }
  312. .cxcalendar_hd {
  313. height: 50px !important;
  314. }
  315. .cxcalendar_hd select{
  316. box-shadow: none;
  317. width: auto;
  318. }
  319. .flex-wrap-5{
  320. display: flex;
  321. align-items: center;
  322. flex-wrap:wrap;
  323. height: 100%;
  324. padding:0 0 0 20px;
  325. }
  326. .pd-14{
  327. padding: 14px;
  328. }
  329. .flex-wrap-5 > div{
  330. /* text-align: center; */
  331. /* margin-bottom: 15px; */
  332. flex: 1 0 50%;
  333. }
  334. .flex-wrap-5 > div >span{
  335. display: block;
  336. /* margin-bottom: 10px; */
  337. font-size: 20px;
  338. font-weight: bold;
  339. color: #3685FC;
  340. }
  341. .flex-wrap-5 > div >p{
  342. font-size: 12px;
  343. }
  344. .height-239{
  345. height: 177px;
  346. }
  347. .downBtn{
  348. display: block;
  349. border-radius: 4px;
  350. background-color: #003399;
  351. color: #fff;
  352. text-align: center;
  353. /* width: 54px; */
  354. line-height: 25px;
  355. padding: 0px 5px;
  356. }
  357. .reservation-ul-li{
  358. padding: 24px 20px;
  359. margin: 10px 0;
  360. border:1px solid rgba(0, 0, 0, 0.15);
  361. border-radius: 2px;
  362. }
  363. .label-success{
  364. background-color: rgba(7, 155, 106,0.15);
  365. color: rgba(7, 155, 106,1);
  366. margin-right:10px ;
  367. padding: 5px;
  368. }
  369. .reservation-ul-li-address{
  370. height: 24px;
  371. font-weight: bold;
  372. font-size: 18px;
  373. color: #333333;
  374. line-height: 24px;
  375. text-align: left;
  376. font-style: normal;
  377. }
  378. .reservation-ul-li p {
  379. margin: 10px 0;
  380. }
  381. .li-label{
  382. font-size: 12px;
  383. color: #666666;
  384. line-height: 0;
  385. text-align: left;
  386. font-style: normal;
  387. text-transform: none;
  388. font-weight: 400;
  389. }
  390. .li-credateTime{
  391. height: 22px;
  392. font-weight: 400;
  393. font-size: 16px;
  394. color: #333333;
  395. text-align: left;
  396. font-style: normal;
  397. text-transform: none;
  398. }
  399. .steps {
  400. display: flex;
  401. justify-content: space-between;
  402. width:90%;
  403. padding: 0;
  404. margin: 20px auto 30px;
  405. list-style: none;
  406. counter-reset: order; /* 定义css 计时器 */
  407. --normal-color: #BFBFBF;
  408. --active-color: #009966;
  409. }
  410. .stepsRefuse{
  411. display: flex;
  412. justify-content: space-between;
  413. padding: 0;
  414. margin: 20px 10px;
  415. list-style: none;
  416. counter-reset: order; /* 定义css 计时器 */
  417. --normal-color: #BFBFBF;
  418. --active-color: #F78B2F;
  419. }
  420. .steps li{
  421. position: relative;
  422. counter-increment: order; /* 选择器增量 */
  423. color: var(--active-color); /* 定义变量,默认都是高亮颜色 */
  424. }
  425. .steps li span{
  426. position: absolute;
  427. top:20px;
  428. width: 90px;
  429. left: -45px;
  430. font-size: 14px;
  431. text-align: center;
  432. }
  433. .steps li::before {
  434. content: '';
  435. display: inline-block;
  436. width: 8px;
  437. height: 8px;
  438. text-align: center;
  439. border-radius: 50%;
  440. background: var(--active-color) !important;
  441. border: 1px solid; /* 这里故意不设置颜色,将来使用继承的颜色 */
  442. flex-shrink: 0; /* 行内伪元素,实现计数器 */
  443. }
  444. /* 步骤项引导线 */
  445. .steps li {
  446. flex: auto; /* 弹性宽度(根据内容调整) */
  447. display: flex;
  448. align-items: center;
  449. }
  450. .steps li:not(:last-child)::after {
  451. content: '';
  452. flex: 1;
  453. margin: 0 4px;
  454. border-bottom: 1px solid;
  455. opacity: 1;
  456. }
  457. .steps li:last-child {
  458. flex: none; /* 最后一项,没必要等分宽度 */
  459. }
  460. .steps .active::before {
  461. /* 设计激活时数字样式 */
  462. color: #ffffff;
  463. background: var(--active-color) !important;
  464. border-color: var(--active-color);
  465. }
  466. .steps .active::after,
  467. .steps .active ~ li,
  468. .steps .active ~ li::before {
  469. /* 后面的线和step设置成黑色 */
  470. background: #fff !important;
  471. color: var(--normal-color);
  472. }
  473. .flex-between{
  474. display: flex;
  475. align-items: center;
  476. justify-content: space-between;
  477. }
  478. .detailBtn{
  479. /* width: 80px; */
  480. height: 24px;
  481. line-height: 24px;
  482. background: #003399;
  483. border-radius: 5px 5px 5px 5px;
  484. border: 1px solid #003399;
  485. color: #fff;
  486. text-align: center;
  487. padding: 0 5px;
  488. }
  489. .detailBtnMobile {
  490. display: none;
  491. }
  492. .reservation-ul-li-textbold{
  493. font-weight: bold;
  494. font-size: 18px;
  495. color: #333333;
  496. text-align: left;
  497. font-style: normal;
  498. margin-top: 10px;
  499. }
  500. @media (max-width:640px) {
  501. .web{
  502. display: none;
  503. }
  504. .mobile{
  505. display: block;
  506. }
  507. .shadowCard{
  508. margin-bottom: 20px;
  509. }
  510. .sx-flex{
  511. display: flex;
  512. justify-content: center;
  513. flex-wrap: wrap !important;
  514. }
  515. .grid{
  516. grid-template-columns: repeat(3, 1fr);
  517. }
  518. .sys_grid{
  519. grid-template-columns: repeat(2, 1fr);
  520. }
  521. .system_name{
  522. width: 100%;
  523. padding: 10px;
  524. }
  525. .system_name h4{
  526. margin-bottom: 5px;
  527. font-size: 14px;
  528. }
  529. .headInfo{
  530. padding: 10px;
  531. background: #fff;
  532. margin: 15px 0;
  533. }
  534. .headInfo h4{
  535. line-height: 30px;
  536. }
  537. .mobilenoflex{
  538. flex: 0 0 70px;
  539. flex-wrap: wrap;
  540. gap:0;
  541. justify-content: center;
  542. color: #fff;
  543. }
  544. .mobileIcon{
  545. display: flex;
  546. align-items: center;
  547. justify-content: center;
  548. height: 25px;
  549. width: 25px;
  550. margin-bottom: 5px;
  551. border-radius: 100%;
  552. background-color: var(--active-color);
  553. }
  554. .mobileIcon svg{
  555. fill: #fff !important;
  556. }
  557. .webicon{
  558. display: none;
  559. }
  560. .tab_active::after{
  561. content: '';
  562. bottom: 0;
  563. left: 18px;
  564. }
  565. .dataContent h3, .dataContent small, .dataContent h4{
  566. margin: 8px 0;
  567. }
  568. .mbline{
  569. padding: 10px 0 0 0;
  570. /* border-bottom: 1px solid #EEEEEE; */
  571. }
  572. .detailBtn{
  573. display: none;
  574. }
  575. .detailBtnMobile {
  576. display: block;
  577. width: 100%;
  578. height: 45px;
  579. line-height: 45px;
  580. margin-top: 50px;
  581. }
  582. .li-span{
  583. display: block !important;
  584. font-size: 16px;
  585. }
  586. .reservation-ul-li p{
  587. margin: 8px 0 0 0;
  588. }
  589. .steps{
  590. margin:10px auto 50px auto;
  591. width: 80%;
  592. }
  593. .steps li span{
  594. font-size: 10px;
  595. }
  596. .reservation-ul-li{
  597. padding: 10px;
  598. }
  599. .form-control[readonly]{
  600. border-bottom: none;
  601. }
  602. }
  603. @media (min-width:2560px) {
  604. .showBanner{
  605. display: block !important;
  606. }
  607. }
  608. </style>
  609. <body>
  610. <div id="app">
  611. <div class="menuBg">
  612. <div class="menuBtn">
  613. <div class="mBtnLine">
  614. <span></span>
  615. <span></span>
  616. <span></span>
  617. </div>
  618. <img src="assets/logo@2x_col.jpg" style="width: 30px;">
  619. </div>
  620. <ul class="mOnLine list-unstyled text-center hidden-xs hidden-sm">
  621. <li class="onLineWx loginInBtn">
  622. <div class="mOnLineIco"><a id="usercenter" href="./login.html"><i class="fa fa-user"></i></a></div>
  623. <div class="mOnLineCon">
  624. <a class="lang-item" id="navlodin" href="./login.html" translate>登陆账号</a>
  625. <a class="lang-item" id="navlodinuser" href="./accountCenter.html" translate>个人中心</a>
  626. <a class="lang-item" id="navlodinloginout" onclick="tool.loginOut()" translate>登出账号</a>
  627. </div>
  628. </li>
  629. <li class="onLineWx">
  630. <div class="mOnLineIco"><i class="fa fa-weixin"></i></div>
  631. <div class="mOnLineCon">
  632. <img src="assets/qrcode.png" class="img-responsive">
  633. <img src="assets/qrcodeLY.png" class="img-responsive">
  634. </div>
  635. </li>
  636. <li class="onLineWx" >
  637. <div class="mOnLineLang">
  638. <small style="font-size: 0;"><svg style="width: 12px;height: 12px;" t="1727425180240" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1933" width="200" height="200"><path d="M233.92 230.25l61.76 61.76A255.872 255.872 0 0 0 170.667 512c0 139.2 111.125 252.459 249.493 255.915l6.507 0.085h96.469L457.6 702.464l60.33-60.33 25.366 25.365-0.064 0.085 166.741 166.72c-31.893 11.157-65.92 17.707-101.333 18.837l-0.192 0.171-0.17-0.15-5.462 0.129-5.483 0.042H426.667c-188.523 0-341.334-152.81-341.334-341.333 0-116.992 58.88-220.245 148.587-281.75z m363.413-59.583c188.523 0 341.334 152.81 341.334 341.333 0 116.992-58.88 220.245-148.587 281.75l-61.76-61.76A255.872 255.872 0 0 0 853.333 512c0-141.376-114.624-256-256-256h-96.469l65.515 65.515-60.331 60.33-118.016-118.037 0.064-0.043-74.07-74.069a340.288 340.288 0 0 1 101.334-18.837l0.15-0.192 0.213 0.17 5.44-0.128 5.504-0.042h170.666z" p-id="1934" fill="#ffffff"></path></svg></small>&nbsp;<small id="lang"></small>
  639. </div>
  640. <div class="mOnLineCon" style="background-color: #fff;bottom:10px;">
  641. <p class="lang-item" id="zh"><small onclick="tool.changeLang('ZH')">简体中文</small></p>
  642. <p class="lang-item" id="en"><small onclick="tool.changeLang('en')">English</small></p>
  643. </div>
  644. </li>
  645. </ul>
  646. </div>
  647. <div class="navBg">
  648. <div class="navTop">
  649. <div class="logo">
  650. <div style="display: flex; align-items: center;">
  651. <a href="index.html"><img style="max-height: 40px;" src="assets/logo-1@2x.png" class="img-responsive"></a>
  652. <div class="mobileLanglist">
  653. <a class="mobileLang" onclick="tool.changeLang('ZH')">中</a>
  654. <a class="mobileLang" onclick="tool.changeLang('en')">EN</a>
  655. <a id="mobileNavLogin" class="mobileNavLogin" onclick="tool.linkOf('./login.html')">登陆</a>
  656. </div>
  657. </div>
  658. </div>
  659. <div class="navClose"><span></span><span></span></div>
  660. <div class="clear"></div>
  661. </div>
  662. <div class="navBot">
  663. <ul class="navList list-unstyled">
  664. <li>
  665. <a class="menu">
  666. <span class="navCn" onclick="tool.linkOf('./index.html')" translate>首页</span>
  667. <div class="child-menu">
  668. <p onclick="tool.linkOf('./index.html#page1')" translate>公司介绍</p>
  669. <p onclick="tool.linkOf('./index.html#page3')" translate>品牌介绍</p>
  670. <p onclick="tool.linkOf('./index.html#page4')" translate>服务支持</p>
  671. <p onclick="tool.linkOf('./index.html#page5')" translate>工程案例</p>
  672. <p onclick="tool.linkOf('./index.html#page6')" translate>新闻资讯</p>
  673. <p onclick="tool.linkOf('./index.html#page6')" translate>联系我们</p>
  674. </div>
  675. </a>
  676. </li>
  677. <li>
  678. <a class="menu">
  679. <span class="navCn" @click="linkOf('./projectsDemo.html')" translate>工程案例</span>
  680. <div class="child-menu" id="projectsDemo"></div>
  681. </a>
  682. </li>
  683. <li>
  684. <a class="menu">
  685. <span class="navCn" onclick="tool.linkOf('./Servicesupport.html')" translate>服务支持</span>
  686. <div class="child-menu">
  687. <p onclick="tool.linkOf('./Servicesupport.html')" translate>服务查询</p>
  688. <p onclick="tool.linkOf('./productList.html')" translate>产品名录</p>
  689. </div>
  690. </a>
  691. </li>
  692. <!-- <li>
  693. <a class="menu">
  694. <span class="navCn">关于我们</span>
  695. <div class="child-menu">
  696. <p>公司介绍</p>
  697. <p>品牌介绍</p>
  698. <p>联系我们</p>
  699. <p>加入班尼戈</p>
  700. </div>
  701. </a>
  702. </li> -->
  703. <li>
  704. <a class="menu">
  705. <span class="navCn" @click="linkOf('./Bnews.html')" translate>新闻资讯</span>
  706. <div class="child-menu" id="navnews"></div>
  707. </a>
  708. </li>
  709. <li>
  710. <a class="menu">
  711. <span class="navCn" id="mobileWorkStation" onclick="tool.linkOf('./accountCenter.html')" translate>个人中心</span>
  712. <div class="child-menu">
  713. <!-- <p>最新消息</p>
  714. <p>我的账户</p> -->
  715. <p id="workStation" onclick="tool.linkOf('./accountCenter.html')" translate>工作台</p>
  716. </div>
  717. </a>
  718. </li>
  719. <li class="menu-info-container" style="color: #fff;">
  720. <div class="menu-info">
  721. <div>
  722. <img style="height: 30px;" src="assets/logo-1@2x.png" class="img-responsive">
  723. </div>
  724. <p translate>浙江班尼戈流体控制有限公司</p>
  725. <p class="menu-info-p" translate><i class="fa fa-map-marker"></i>&nbsp;&nbsp;浙江省海盐县西塘桥经济开发区棕榈路555号</p>
  726. <p class="menu-info-p" style="margin-top:30px ;" translate>海盐工厂</p>
  727. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;+86 0573 89053730</p>
  728. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;13656628223</p>
  729. <p class="menu-info-p" style="margin-top:30px ;" translate>液冷系统</p>
  730. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;+86 19057508160</p>
  731. <p style="margin-top: 20px;font-size: 1.875rem;" translate>班尼戈,来自欧洲,扎根中国</p>
  732. <div style="margin-top: 20px;">
  733. <p class="flex-index"><small style="cursor: pointer;" onclick="tool.linkOf('https://conexbanninger.com/','_blank')">全球&emsp;班尼戈</small>
  734. &emsp;<svg style="width: 30px;height: 16px;" t="1727329763942" class="icon" viewBox="0 0 1543 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2647" width="200" height="200"><path d="M77.150685 659.287671H1472.876712v294.575343H77.150685V659.287671z" fill="#FCD839" p-id="2648"></path><path d="M77.150685 364.712329H1472.876712v294.575342H77.150685V364.712329z" fill="#DC3A3A" p-id="2649"></path><path d="M77.150685 70.136986H1472.876712v294.575343H77.150685V70.136986z" fill="#221714" p-id="2650"></path></svg>
  735. </p>
  736. <p class="flex-index" style="margin-top: 15px;" onclick="tool.linkOf('./index.html')"><small>中国&emsp;班尼戈</small>
  737. &emsp;<svg style="width: 30px;height: 15px;" t="1727330282351" class="icon" viewBox="0 0 1501 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6537" width="200" height="200"><path d="M0.205 1003.52h1500.023V0.683H0.205z" fill="#DE2910" p-id="6538"></path><path d="M516.3 413.286l-2.184 33.724 31.403 12.425-32.768 8.465-2.185 33.723-18.022-28.672-32.905 8.397 21.573-25.941-18.023-28.672 31.54 12.493 21.572-25.942z m80.897-103.15l10.24 32.153h33.928l-27.306 19.934 10.24 32.154-27.307-20.07-27.307 19.933 10.513-32.085-27.306-19.798h33.86l10.445-32.222z m34.543-137.08l-15.292 30.174 23.893 23.893-33.382-5.325-15.497 30.174-5.188-33.587-33.45-5.188 30.242-15.36-5.257-33.383 23.757 23.894 30.174-15.292zM516.437 63.693l-2.048 33.655 31.403 12.493-32.836 8.465-2.185 33.656-18.09-28.672-32.7 8.465 21.572-25.942-18.022-28.672 31.402 12.493 21.504-25.941z m-267.605 51.063l31.676 97.622h102.81l-83.081 60.28 31.676 97.825-83.15-60.348-83.08 60.348 31.676-97.826-83.08-60.348h102.809l31.676-97.621z" fill="#FFDE00" p-id="6539"></path></svg>
  738. </p>
  739. </div>
  740. </div>
  741. </li>
  742. </ul>
  743. </div>
  744. </div>
  745. <div class="animsition">
  746. <div class="site-wrapper">
  747. <section class="banner-section showBanner">
  748. <div class="section-bg" style="background: url('blog/img/parallax.jpg') no-repeat;background-size: cover;"></div>
  749. <div class="container">
  750. <div class="row">
  751. <div class="page-banner-content col">
  752. <h1 class="text-white">个人中心</h1>
  753. <span>USER CENTER</span>
  754. <!-- breadctumb -->
  755. <ul class="page-breadcrumb">
  756. <li onclick="tool.goback()"><a href="#" translate>返回</a></li>
  757. </ul>
  758. </div>
  759. </div>
  760. </div>
  761. </section>
  762. <div class="container">
  763. <div class="headInfo">
  764. <div>
  765. <h4 translate>亲爱的{{pageData.name}}</h4>
  766. <p class="color-grey" translate>{{pageData.date}}</p>
  767. </div>
  768. <div class="flex mobilenoflex">
  769. <div class="mobileIcon">
  770. <svg style="height: 10px;width: 10px;" t="1728885470552" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2151" width="200" height="200"><path d="M108.454128 579.832752l142.078224 127.9984a63.9992 63.9992 0 0 0 106.238672-48.639392v-255.9968a63.9992 63.9992 0 0 0-106.238672-47.359408l-142.078224 127.9984a62.719216 62.719216 0 0 0 0 95.9988z" p-id="2152"></path><path d="M356.771024 468.474144h191.9976a63.9992 63.9992 0 0 1 63.9992 63.9992 63.9992 63.9992 0 0 1-63.9992 63.9992h-191.9976v-127.9984zM937.88376 127.9984h-447.9944a63.9992 63.9992 0 0 1-63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992-63.9992h383.9952a63.9992 63.9992 0 0 1 63.9992 63.9992V127.9984zM872.604576 1023.9872h-383.9952a63.9992 63.9992 0 0 1-63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992-63.9992h449.274384v63.9992a63.9992 63.9992 0 0 1-65.279184 63.9992z" p-id="2153"></path><path d="M809.88536 1023.9872V63.9992a63.9992 63.9992 0 0 1 63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992 63.9992v895.9888a63.9992 63.9992 0 0 1-63.9992 63.9992h-63.9992z" p-id="2154"></path></svg>
  771. </div>
  772. <svg class="webicon" style="height: 10px;width: 10px;" t="1727589960931" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2225" id="mx_n_1727589960932" width="200" height="200"><path d="M108.454128 579.832752l142.078224 127.9984a63.9992 63.9992 0 0 0 106.238672-48.639392v-255.9968a63.9992 63.9992 0 0 0-106.238672-47.359408l-142.078224 127.9984a62.719216 62.719216 0 0 0 0 95.9988z" p-id="2226" fill="#009966"></path><path d="M356.771024 468.474144h191.9976a63.9992 63.9992 0 0 1 63.9992 63.9992 63.9992 63.9992 0 0 1-63.9992 63.9992h-191.9976v-127.9984zM937.88376 127.9984h-447.9944a63.9992 63.9992 0 0 1-63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992-63.9992h383.9952a63.9992 63.9992 0 0 1 63.9992 63.9992V127.9984zM872.604576 1023.9872h-383.9952a63.9992 63.9992 0 0 1-63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992-63.9992h449.274384v63.9992a63.9992 63.9992 0 0 1-65.279184 63.9992z" p-id="2227" fill="#009966"></path><path d="M809.88536 1023.9872V63.9992a63.9992 63.9992 0 0 1 63.9992-63.9992 63.9992 63.9992 0 0 1 63.9992 63.9992v895.9888a63.9992 63.9992 0 0 1-63.9992 63.9992h-63.9992z" p-id="2228" fill="#009966"></path></svg>
  773. <a class="color-active" onclick="tool.loginOut()" translate>账号登出</a>
  774. </div>
  775. </div>
  776. <div class="content">
  777. <div class="tabs">
  778. <p class="tab_active" translate>我的账户</p>
  779. </div>
  780. <div style="padding: 20px 0;">
  781. <div class="row">
  782. <div class="col-md-4">
  783. <div class="shadowCard height-239">
  784. <div class="flex-end">
  785. <h4 class="border-left" style="font-size: 14px;" translate><small translate>现金</small></h4>
  786. </div>
  787. <div class="dataContent">
  788. <div class="mbline">
  789. <h3 class="color-active"><b><span class="color-active" style="font-size: 20px;">¥</span> {{pageData.accountBalance.balance || 0}}</b></h3>
  790. </div>
  791. <div class="mbline">
  792. <p><span translate>预计提成</span> : {{pageData.accountBalance.creditquota || 0}}</p>
  793. </div>
  794. </div>
  795. <img class="shadowCard-right-icon" src="./images/1.png" alt="">
  796. </div>
  797. </div>
  798. <div class="col-md-4">
  799. <div class="shadowCard height-239">
  800. <div class="flex-end">
  801. <h4 class="border-left" style="font-size: 14px;" translate><small translate>逾期总应收</small></h4>
  802. </div>
  803. <div class="dataContent">
  804. <div class="mbline">
  805. <h3 class="color-active"><b><span class="color-active" style="font-size: 20px;">¥</span> {{pageData.sumallaoverduemount || 0}}</b></h3>
  806. </div>
  807. <img class="shadowCard-right-icon" src="./images/1.png" alt="">
  808. </div>
  809. </div>
  810. </div>
  811. <div class="col-md-4">
  812. <div>
  813. <div class="flex-end">
  814. <div class="dropdown">
  815. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  816. <span translate>{{translate(param.content.isAll == 1?'全部':'本年')}}</span>
  817. <span class="caret"></span>
  818. </a>
  819. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  820. <li @click="getData3(param.content.isAll = 1)"><a href="#" translate>全部</a></li>
  821. <li @click="getData3(param.content.isAll = 0)"><a href="#" translate>本年</a></li>
  822. </ul>
  823. </div>
  824. <input class="form-control" id="begdate" type="text" data-end-date="3030" @change="dateChange('#begdate','data3')" placeholder="开始日期" readonly>
  825. <p translate>至</p>
  826. <input class="form-control" id="enddate" type="text" data-end-date="3030" @change="dateChange('#enddate','data3')" placeholder="结束日期" readonly>
  827. </div>
  828. <div class="shadowCard pd-14" style="margin-top: 10px;">
  829. <div class="flex-wrap-5">
  830. <div>
  831. <span>{{pageData.data3.allAmount}}</span>
  832. <p translate>订单金额</p>
  833. </div>
  834. <div><span>{{pageData.data3.cashbillAmount}}</span><p translate>订单回款金额</p></div>
  835. <div><span>{{pageData.data3.allunAmount}}</span><p translate>订单未出货金额</p></div>
  836. <div><span>{{pageData.data3.alluninvoicamount}}</span><p translate>已出货未开票金额</p></div>
  837. </div>
  838. </div>
  839. </div>
  840. </div>
  841. </div>
  842. </div>
  843. </div>
  844. <div class="row">
  845. <div class="col-md-8">
  846. <div class="content" style="padding-bottom: 10px;">
  847. <div class="tabs">
  848. <p @click="pageData.tab1 = 'xs'" :class="pageData.tab1 == 'xs'?'tab_active':''" translate>发票查询</p>
  849. <p @click="pageData.tab1 = 'yy'" :class="pageData.tab1 == 'yy'?'tab_active':''" translate>服务单查询</p>
  850. </div>
  851. <div v-show="pageData.tab1 == 'xs'">
  852. <div class="flex" style="justify-content: space-between;margin-top: 10px;">
  853. <p><span translate>总计</span>:{{pageData.invoiceTotal}}</p>
  854. <div class="flex">
  855. <input class="form-control" id="begdate1" type="text" data-end-date="3030" @change="dateChange('#begdate1','invoice')" placeholder="开始日期" readonly>
  856. <p translate>至</p>
  857. <input class="form-control" id="enddate1" type="text" data-end-date="3030" @change="dateChange('#enddate1','invoice')" placeholder="结束日期" readonly>
  858. </div>
  859. </div>
  860. <div class="shadowCard" style="margin: 10px 0;padding:15px 0;" v-for="item in pageData.invoiceData">
  861. <div class="col-md-12" >
  862. <h5 style="margin-bottom: 10px;">{{item.enterprisename}}</h5>
  863. </div>
  864. <div>
  865. <div class="col-md-6"><small style="color:#666">开票时间</small>&nbsp;{{item.createdate}}</div>
  866. <div class="col-md-6"><small style="color:#666">开票金额</small>&nbsp;{{item.sumtaxincludedamount}}</div>
  867. </div>
  868. <a class="shadowCard-right-icon downBtn" :href="item.pdfurl" translate>下载</a>
  869. </div>
  870. </div>
  871. <div v-show="pageData.tab1 == 'yy'">
  872. <div class="reservation-ul">
  873. <div class="flex" style="justify-content: space-between;margin-top: 10px;">
  874. <p><span translate>总计</span>:{{pageData.sevlistTotal}}</p>
  875. <div class="flex">
  876. <input class="form-control" id="begdate2" type="text" data-end-date="3030" @change="dateChange('#begdate2','sevlist')" placeholder="开始日期" readonly>
  877. <p translate>至</p>
  878. <input class="form-control" id="enddate2" type="text" data-end-date="3030" @change="dateChange('#enddate2','sevlist')" placeholder="结束日期" readonly>
  879. </div>
  880. </div>
  881. <div class="reservation-ul-li" class="reservation-ul-li" v-for="item in pageData.sevlist" :key="item.sa_serviceorderid">
  882. <div class="flex-between">
  883. <div>
  884. <span class="label label-success">{{item.servicetype}}</span>
  885. <span class="label label-success">{{item.class1}}</span>
  886. <span class="label label-success">{{item.class2}}</span>
  887. </div>
  888. <a class="detailBtn" :href="'./ServiceOfficialApplyDetail.html?id=' + item.sa_serviceorderid" translate>查看详情</a>
  889. </div>
  890. <div>
  891. <p class="reservation-ul-li-textbold">
  892. <i class="fa fa-map-marker"></i>&nbsp;{{`${item.province}${item.city}${item.county}`}}
  893. </p>
  894. <div class="row">
  895. <div class="col-xs-12">
  896. <p><label class="li-label" for="" translate>提交日期</label>&nbsp;<span class="li-span">{{item.submitdate}}</span></p>
  897. </div>
  898. <div class="col-sm-12">
  899. <p><label class="li-label" for="" translate>问题描述</label>&nbsp;<span class="li-span">{{item.reason}}</span></p>
  900. </div>
  901. </div>
  902. <ol v-if="item.status !== '已拒绝'" class="steps">
  903. <li :class="item.status == '新建'?'active':''"><span translate>
  904. 新建<p v-if="item.status == '新建'" class="color-grey"></p>
  905. </span></li>
  906. <li :class="item.status == '待指派'?'active':''"><span translate>待指派<p v-if="item.status == '待指派'" class="color-grey"></p></span></li>
  907. <li :class="item.status == '待确认'?'active':''"><span translate>待确认<p v-if="item.status == '待确认'" class="color-grey"></p></span></li>
  908. <li :class="item.status == '进行中'?'active':''"><span translate>进行中<p v-if="item.status == '进行中'" class="color-grey"></p></span></li>
  909. <li :class="item.status == '已完成'?'active':''"><span translate>已完成<p v-if="item.status == '已完成'" class="color-grey"></p></span></li>
  910. </ol>
  911. <ol v-else class="stepsRefuse steps">
  912. <li><span>待确认</span></li>
  913. <li class="active"><span>已拒绝</span></li>
  914. </ol>
  915. <a class="detailBtn detailBtnMobile" :href="'./ServiceOfficialApplyDetail.html?id=' + item.sa_serviceorderid" translate>查看详情</a>
  916. </div>
  917. </div>
  918. <div class="allMsg">
  919. <a href="#" @click="linkOfIframe({name:'serveBill',system:'sale'})" translate>查看全部服务单</a>
  920. </div>
  921. </div>
  922. </div>
  923. </div>
  924. </div>
  925. <div class="col-md-4">
  926. <div class="content">
  927. <div class="tabs">
  928. <p @click="pageData.tab2 = 'msg'" :class="pageData.tab2 == 'msg' ? 'tab_active':''"><span translate>系统消息</p>
  929. <p @click ="pageData.tab2 = 'bill'" :class="pageData.tab2 == 'bill' ? 'tab_active':''" ><span translate>单据动态</p>
  930. </div>
  931. <div v-if="pageData.tab2 == 'msg'" class="message">
  932. <div class="flex messageBox" v-for="msg in pageData.message" :key="msg.messageid">
  933. <div class="date">
  934. <h4><b>{{msg.createdate.split('-')[2].split(' ')[0]}}</b></h4>
  935. <small>{{msg.createdate.split('-')[0]}}-{{msg.createdate.split('-')[1]}}</small>
  936. </div>
  937. <div>
  938. <h5>{{msg.title}}</h5>
  939. <small>{{msg.message}}</small>
  940. </div>
  941. </div>
  942. </div>
  943. <div v-else>
  944. <div class="message">
  945. <div class="orderMsgBox" v-for="msg in pageData.orderMsg" :key="msg.index">
  946. <div class="flex-start">
  947. <label class="color-blue" for="">订单</label>
  948. <p>{{msg.sonum}}</p>
  949. <p class="mytag">{{msg.type}}</p>
  950. </div>
  951. <div class="flex-start">
  952. <label class="color-blue" for="">客户</label>
  953. <p>{{msg.enterprisename}}</p>
  954. </div>
  955. <div class="flex-start">
  956. <label class="color-blue" for="">项目</label>
  957. <p>{{msg.projectname}}</p>
  958. </div>
  959. <div class="flex-start">
  960. <label class="color-active" for="">{{msg.action}}</label>
  961. <p>{{msg.remarks}}<br><small class="color-grey">{{msg.actiondate}}</small></p>
  962. </div>
  963. </div>
  964. </div>
  965. </div>
  966. <div class="allMsg">
  967. <!-- <a href="" translate>{{translate(pageData.tab2 == 'msg'?'查看全部消息':'查看全部订单')}}</a> -->
  968. <a v-show="pageData.tab2 == 'msg'" href="#" @click="linkOfIframe({name:'message',system:'sale'})" translate>查看全部消息</a>
  969. <a v-show="pageData.tab2 == 'bill'" href="#" @click="linkOfIframe({name:'ordersaler',system:'sale'})" translate>查看全部订单</a>
  970. </div>
  971. </div>
  972. </div>
  973. </div>
  974. </div>
  975. </div>
  976. </div>
  977. </div>
  978. <!-- <div class="footer">
  979. <p>©2024 浙江班尼戈流体控制有限公司 版权所有 浙ICP备17049334号-1 技术支持:嘉兴市云链信息技术有限公司</p><p><a href="https://www.beian.gov.cn/portal/registerSystemInfo?recordcode=33042402000625"><img src="./assets/2661734398653_.pic.jpg" width="15" alt="" style="margin: 2px 5px 0 0;"><small>浙公网安备33042402000625号</small></a></p>
  980. </div> -->
  981. <!-- Javascript -->
  982. <script src="blog/js/jquery.min.js"></script>
  983. <script src="blog/js/bootstrap.min.js"></script>
  984. <script src="blog/js/bootstrap-select.min.js"></script>
  985. <script src="blog/js/animsition.js"></script>
  986. <script src="blog/js/jquery.appear.min.js"></script>
  987. <script src="blog/js/countto.js"></script>
  988. <script src="blog/js/slick.min.js"></script>
  989. <script src="blog/js/jquery.stickit.min.js"></script>
  990. <script src="blog/js/jquery.parallax-1.1.3.js"></script>
  991. <script src="blog/js/owl.carousel.min.js"></script>
  992. <script src="blog/js/masonry.pkgd.min.js"></script>
  993. <script src="blog/js/magnific.popup.min.js"></script>
  994. <script src="blog/js/wow.min.js"></script>
  995. <script src="blog/js/main.js"></script>
  996. <script src="js/swiper.min.js"></script>
  997. <script src="js/swiper.animate1.0.2.min.js"></script>
  998. <script src="js/jquery.fullPage.js"></script>
  999. <script src="js/public.js"></script>
  1000. <script src="vue/axios.min.js"></script>
  1001. <script src="vue/api.js"></script>
  1002. <script src="vue/vue.global.js"></script>
  1003. <script src="vue/formTool.js"></script>
  1004. <script src="questJs/accountCenter2.js"></script>
  1005. <script src="js/cxcalendar.js"></script>
  1006. <script>
  1007. tool.modulesClick('个人中心')
  1008. </script>
  1009. <script>
  1010. cxCalendar.attach(document.getElementById('begdate'));
  1011. cxCalendar.attach(document.getElementById('enddate'));
  1012. cxCalendar.attach(document.getElementById('begdate1'));
  1013. cxCalendar.attach(document.getElementById('enddate1'));
  1014. cxCalendar.attach(document.getElementById('begdate2'));
  1015. cxCalendar.attach(document.getElementById('enddate2'));
  1016. if (window.innerWidth < 768) {
  1017. }
  1018. </script>
  1019. </body>
  1020. </html>