accountCenter.html 43 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986
  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. <!-- <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> -->
  20. <script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
  21. <script src="js/sha1.min.js"></script>
  22. </head>
  23. <style type="text/css">
  24. body{
  25. background:#F4F5F7 ;
  26. }
  27. .flex{
  28. display: flex;
  29. align-items: center;
  30. gap: 10px;
  31. }
  32. .container{
  33. max-width: 1200px;
  34. margin: 0 auto;
  35. }
  36. .headInfo{
  37. display: flex;
  38. align-items: center;
  39. justify-content: space-between;
  40. padding: 20px 0;
  41. }
  42. .content{
  43. position: relative;
  44. padding: 10px 20px 0px 20px;
  45. margin-bottom: 20px;
  46. background: #fff;
  47. }
  48. .color-grey{
  49. color: #999999;
  50. font-size: 14px;
  51. }
  52. .color-active{
  53. color: #009966 !important;
  54. cursor: pointer;
  55. }
  56. .color-blue{
  57. color: #3685fc;
  58. }
  59. .tabs{
  60. padding: 0;
  61. position: relative;
  62. display: flex;
  63. --active-color: #009966;
  64. }
  65. .tabs::after{
  66. position: absolute;
  67. bottom: 1px;
  68. content: '';
  69. width: 100%;
  70. height: 1px;
  71. background: rgba(0, 0, 0, 0.15);
  72. z-index: 1;
  73. }
  74. .tabs p{
  75. position: relative;
  76. height: 38px;
  77. line-height: 35px;
  78. padding: 0 5px;
  79. cursor: pointer;
  80. z-index: 2;
  81. color: rgba(51, 51, 51, 1);
  82. }
  83. .tab_active{
  84. position: relative;
  85. font-weight: bold;
  86. }
  87. .tabs:nth-child(1) p{
  88. margin-right: 30px;
  89. }
  90. .tab_active::after{
  91. content: '';
  92. position: absolute;
  93. bottom: 0;
  94. left: 8px;
  95. height: 3px;
  96. width: 28px;
  97. background-color: var(--active-color);
  98. /* display: inline-block;
  99. border-bottom: 3px solid var(--active-color); */
  100. }
  101. .shadowCard{
  102. padding: 20px;
  103. background: #FFFFFF;
  104. box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
  105. border-radius: 5px 5px 5px 5px;
  106. }
  107. .flex-end{
  108. display: flex;
  109. justify-content: space-between;
  110. align-items: flex-end;
  111. }
  112. .flex-end p{
  113. line-height: 17px;
  114. flex:1 0 auto;
  115. text-align: right;
  116. }
  117. .flex-end > a{
  118. flex:1 0 auto;
  119. text-align: right;
  120. }
  121. .dataContent{
  122. margin-top: 20px;
  123. }
  124. .dataContent h3,.dataContent small,.dataContent h4{
  125. margin: 17px 0;
  126. }
  127. .dataContent small{
  128. color: #999999;
  129. }
  130. .dropdown-btn{
  131. padding:5px 10px;
  132. border: 1px solid rgba(0,0,0,0.16);
  133. border-radius:4px 4px 4px 4px ;
  134. }
  135. .percent {
  136. position: relative;
  137. width: 150px;
  138. height: 150px;
  139. }
  140. .percent svg {
  141. width: 150px;
  142. height: 150px;
  143. }
  144. .percent svg circle {
  145. fill: none;
  146. stroke-width: 10;
  147. stroke: #1258e3;
  148. transform: translate(5px, 5px);
  149. /* 设置虚线长度 = 圆的周长(2*70*3.1415926) */
  150. stroke-dasharray: 440;
  151. /* 设置圆的空白间隙 */
  152. stroke-dashoffset: var(--dashoffset);
  153. }
  154. .percent svg circle:nth-child(1) {
  155. stroke-dashoffset: 0;
  156. stroke: #f3f3f3;
  157. }
  158. .percent svg circle:nth-child(2) {
  159. stroke: #3685fc;
  160. }
  161. .percent .num {
  162. position: absolute;
  163. left: 0;
  164. top: 0;
  165. width: 100%;
  166. height: 100%;
  167. display: flex;
  168. justify-content: center;
  169. align-items: center;
  170. text-align: center;
  171. }
  172. #per {
  173. font-size: 20px;
  174. }
  175. .targetBox{
  176. padding:10px 15px;
  177. border: 1px solid rgba(0, 0, 0, 0.1);
  178. border-radius: 4px 4px 4px 4px;
  179. flex: 1;
  180. }
  181. .targetBox h3{
  182. margin: 10px 0;
  183. }
  184. .grid {
  185. display: grid;
  186. grid-template-columns: repeat(6, 1fr); /* 创建三列,每列等宽 */
  187. gap:20px;
  188. padding: 20px 0;
  189. /* min-height: 400px; */
  190. }
  191. .grid > div{
  192. margin: 10px 0;
  193. text-align: center;
  194. }
  195. .grid > div{margin: 0 auto;}
  196. .message{
  197. height: 400px;
  198. overflow-y: scroll;
  199. padding-bottom: 60px;
  200. }
  201. .messageBox{
  202. align-items: flex-start !important;
  203. padding: 10px;
  204. }
  205. .date{
  206. flex: 0 0 70px;
  207. width: 70px;
  208. color:rgba(54, 133, 252, 1);
  209. border-right: 1px solid rgba(0, 0, 0, 0.15);
  210. }
  211. .allMsg{
  212. position: absolute;
  213. width: 100%;
  214. bottom: 0;
  215. left:0;
  216. padding:15px 10px;
  217. box-shadow: 0px 3px 6px 1px rgba(0,0,0,0.16);
  218. text-align: center;
  219. background: #fff;
  220. }
  221. .sys_grid {
  222. display: grid;
  223. grid-template-columns: repeat(3, 1fr); /* 创建三列,每列等宽 */
  224. gap: 10px;
  225. padding: 10px 0;
  226. }
  227. .sys_grid > div{
  228. position: relative;
  229. }
  230. .sys_grid > div > img{
  231. width: 100%;
  232. }
  233. .system_name{
  234. position: absolute;
  235. top:0;
  236. left: 0;
  237. height: 100%;
  238. width:calc(100% - 40px);
  239. padding: 0 20px;
  240. display: flex;
  241. align-items: center;
  242. flex-wrap: wrap;
  243. color: #fff;
  244. }
  245. .system_name h4{
  246. margin-bottom: 10px;
  247. }
  248. .system_name a{
  249. display: block;
  250. color: #fff;
  251. }
  252. .accountsRece{
  253. padding: 10px;
  254. border-radius: 4px 4px 4px 4px;
  255. border: 1px solid rgba(0,0,0,0.15);
  256. margin: 12px 0;
  257. }
  258. .accountsRece h5{
  259. font-weight: bold;
  260. }
  261. .accountsRece p{
  262. margin-top: 5px;
  263. font-size: 12px;
  264. color: rgba(102, 102, 102, 1);
  265. }
  266. .borard{
  267. border: none;
  268. }
  269. .borard h5{
  270. font-weight: bold;
  271. font-size: 16px;
  272. color: #3685fc;
  273. }
  274. .flex-start{
  275. display: flex;
  276. align-items: flex-start;
  277. }
  278. .flex-start label,.flex-start p{
  279. line-height: 30px;
  280. }
  281. .flex-start label{
  282. margin: 0 5px 0 0;
  283. }
  284. .orderMsgBox{
  285. border-bottom: 1px solid rgba(238, 238, 238, 1);
  286. margin: 15px 0;
  287. }
  288. .mobile{
  289. display: none;
  290. }
  291. .showBanner{
  292. display: none;
  293. }
  294. .mobileIcon{
  295. display: none;
  296. }
  297. /* .empty{
  298. height: 200px;
  299. } */
  300. .moblie{
  301. display: none;
  302. }
  303. .linkitem{
  304. border: 2px solid #fff;
  305. transition: .2s linear;
  306. padding: 5px;
  307. }
  308. .linkitem:hover{
  309. cursor: pointer;
  310. border: 2px solid #3685fc60;
  311. border-radius: 5px;
  312. }
  313. .linkitem-act{
  314. border: 2px solid #3685fc60;
  315. border-radius: 5px;
  316. }
  317. @media (max-width:640px) {
  318. .web{
  319. display: none;
  320. }
  321. .mobile{
  322. display: block;
  323. }
  324. .shadowCard{
  325. margin-bottom: 20px;
  326. }
  327. .sx-flex{
  328. display: flex;
  329. justify-content: center;
  330. flex-wrap: wrap !important;
  331. }
  332. .grid{
  333. grid-template-columns: repeat(4, 1fr);
  334. gap:10px 10%;
  335. min-height: auto;
  336. }
  337. .sys_grid{
  338. grid-template-columns: repeat(2, 1fr);
  339. }
  340. .system_name{
  341. width: 100%;
  342. padding: 10px;
  343. }
  344. .system_name h4{
  345. margin-bottom: 10px;
  346. font-size: 20px;
  347. }
  348. .headInfo{
  349. padding: 10px;
  350. background: #fff;
  351. margin: 15px 0;
  352. }
  353. .headInfo h4{
  354. line-height: 30px;
  355. }
  356. .mobilenoflex{
  357. flex: 0 0 70px;
  358. flex-wrap: wrap;
  359. gap:0;
  360. justify-content: center;
  361. color: #fff;
  362. }
  363. .mobileIcon{
  364. display: flex;
  365. align-items: center;
  366. justify-content: center;
  367. height: 25px;
  368. width: 25px;
  369. margin-bottom: 5px;
  370. border-radius: 100%;
  371. background-color: #009966;
  372. }
  373. .mobileIcon svg{
  374. fill: #fff !important;
  375. }
  376. .webicon{
  377. display: none;
  378. }
  379. .tab_active::after{
  380. content: '';
  381. bottom: 0;
  382. left: 18px;
  383. }
  384. .dataContent h3, .dataContent small, .dataContent h4{
  385. margin: 8px 0;
  386. }
  387. .mbline{
  388. padding: 10px 0 0 0;
  389. border-bottom: 1px solid #EEEEEE;
  390. }
  391. }
  392. @media (min-width:2560px) {
  393. .showBanner{
  394. display: block !important;
  395. }
  396. }
  397. </style>
  398. <body>
  399. <div id="app">
  400. <div class="menuBg">
  401. <div class="menuBtn">
  402. <div class="mBtnLine">
  403. <span></span>
  404. <span></span>
  405. <span></span>
  406. </div>
  407. <img src="assets/logo@2x_col.jpg" style="width: 30px;">
  408. </div>
  409. <ul class="mOnLine list-unstyled text-center hidden-xs hidden-sm">
  410. <li class="onLineWx loginInBtn">
  411. <div class="mOnLineIco"><a id="usercenter" href="./login.html"><i class="fa fa-user"></i></a></div>
  412. <div class="mOnLineCon">
  413. <a class="lang-item" id="navlodin" href="./login.html" translate>登陆账号</a>
  414. <a class="lang-item" id="navlodinuser" href="./accountCenter.html" translate>个人中心</a>
  415. <a class="lang-item" id="navlodinloginout" onclick="tool.loginOut()" translate>登出账号</a>
  416. </div>
  417. </li>
  418. <li class="onLineWx">
  419. <div class="mOnLineIco"><i class="fa fa-weixin"></i></div>
  420. <div class="mOnLineCon">
  421. <img src="assets/qrcode.png" class="img-responsive">
  422. <img src="assets/qrcodeLY.png" class="img-responsive">
  423. </div>
  424. </li>
  425. <li class="onLineWx" >
  426. <div class="mOnLineLang">
  427. <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>
  428. </div>
  429. <div class="mOnLineCon" style="background-color: #fff;bottom:10px;">
  430. <p class="lang-item" id="zh"><small onclick="tool.changeLang('ZH')">简体中文</small></p>
  431. <p class="lang-item" id="en"><small onclick="tool.changeLang('en')">English</small></p>
  432. </div>
  433. </li>
  434. </ul>
  435. </div>
  436. <div class="navBg">
  437. <div class="navTop">
  438. <div class="logo">
  439. <div style="display: flex; align-items: center;">
  440. <a href="index.html"><img style="max-height: 40px;" src="assets/logo-1@2x.png" class="img-responsive"></a>
  441. <div class="mobileLanglist">
  442. <a class="mobileLang" onclick="tool.changeLang('ZH')">中</a>
  443. <a class="mobileLang" onclick="tool.changeLang('en')">EN</a>
  444. <a id="mobileNavLogin" class="mobileNavLogin" onclick="tool.linkOf('./login.html')">登陆</a>
  445. </div>
  446. </div>
  447. </div>
  448. <div class="navClose"><span></span><span></span></div>
  449. <div class="clear"></div>
  450. </div>
  451. <div class="navBot">
  452. <ul class="navList list-unstyled">
  453. <li>
  454. <a class="menu">
  455. <span class="navCn" onclick="tool.linkOf('./index.html')" translate>首页</span>
  456. <div class="child-menu">
  457. <p onclick="tool.linkOf('./index.html#page1')" translate>公司介绍</p>
  458. <p onclick="tool.linkOf('./index.html#page3')" translate>品牌介绍</p>
  459. <p onclick="tool.linkOf('./index.html#page4')" translate>服务支持</p>
  460. <p onclick="tool.linkOf('./index.html#page5')" translate>工程案例</p>
  461. <p onclick="tool.linkOf('./index.html#page6')" translate>新闻资讯</p>
  462. <p onclick="tool.linkOf('./index.html#page6')" translate>联系我们</p>
  463. </div>
  464. </a>
  465. </li>
  466. <li>
  467. <a class="menu">
  468. <span class="navCn" @click="linkOf('./projectsDemo.html')" translate>工程案例</span>
  469. <div class="child-menu" id="projectsDemo"></div>
  470. </a>
  471. </li>
  472. <li>
  473. <a class="menu">
  474. <span class="navCn" onclick="tool.linkOf('./Servicesupport.html')" translate>服务支持</span>
  475. <div class="child-menu">
  476. <p onclick="tool.linkOf('./Servicesupport.html')" translate>服务查询</p>
  477. <p onclick="tool.linkOf('./productList.html')" translate>产品名录</p>
  478. </div>
  479. </a>
  480. </li>
  481. <!-- <li>
  482. <a class="menu">
  483. <span class="navCn">关于我们</span>
  484. <div class="child-menu">
  485. <p>公司介绍</p>
  486. <p>品牌介绍</p>
  487. <p>联系我们</p>
  488. <p>加入班尼戈</p>
  489. </div>
  490. </a>
  491. </li> -->
  492. <li>
  493. <a class="menu">
  494. <span class="navCn" onclick="tool.linkOf('./Bnews.html')" translate>新闻资讯</span>
  495. <div class="child-menu" id="navnews"></div>
  496. </a>
  497. </li>
  498. <li>
  499. <a class="menu">
  500. <span class="navCn" id="mobileWorkStation" onclick="tool.linkOf('./accountCenter.html')" translate>个人中心</span>
  501. <div class="child-menu">
  502. <!-- <p>最新消息</p>
  503. <p>我的账户</p> -->
  504. <p id="workStation" onclick="tool.linkOf('./accountCenter.html')" translate>工作台</p>
  505. </div>
  506. </a>
  507. </li>
  508. <li class="menu-info-container" style="color: #fff;">
  509. <div class="menu-info">
  510. <div>
  511. <img style="height: 30px;" src="assets/logo-1@2x.png" class="img-responsive">
  512. </div>
  513. <p translate>浙江班尼戈流体控制有限公司</p>
  514. <p class="menu-info-p" translate><i class="fa fa-map-marker"></i>&nbsp;&nbsp;浙江省海盐县西塘桥经济开发区棕榈路555号</p>
  515. <p class="menu-info-p" style="margin-top:30px ;" translate>海盐工厂</p>
  516. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;+86 0573 89053730</p>
  517. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;+86 0573 89053726</p>
  518. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;13656628223</p>
  519. <p class="menu-info-p" style="margin-top:30px ;" translate>液冷系统</p>
  520. <p class="menu-info-p"><i class="fa fa-phone"></i>&nbsp;&nbsp;+86 19057508160</p>
  521. <p style="margin-top: 20px;font-size: 1.875rem;" translate>班尼戈,来自欧洲,扎根中国</p>
  522. <div style="margin-top: 20px;">
  523. <p class="flex-index"><small style="cursor: pointer;" onclick="tool.linkOf('https://conexbanninger.com/','_blank')">全球&emsp;班尼戈</small>
  524. &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>
  525. </p>
  526. <p class="flex-index" style="margin-top: 15px;" onclick="tool.linkOf('./index.html')"><small>中国&emsp;班尼戈</small>
  527. &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>
  528. </p>
  529. </div>
  530. </div>
  531. </li>
  532. </ul>
  533. </div>
  534. </div>
  535. <div class="animsition">
  536. <div class="site-wrapper">
  537. <section class="banner-section showBanner">
  538. <div class="section-bg" style="background: url('blog/img/parallax.jpg') no-repeat;background-size: cover;"></div>
  539. <div class="container">
  540. <div class="row">
  541. <div class="page-banner-content col">
  542. <h1 class="text-white">个人中心</h1>
  543. <span>USER CENTER</span>
  544. <!-- breadctumb -->
  545. <ul class="page-breadcrumb">
  546. <li onclick="tool.goback()"><a href="#" translate>返回</a></li>
  547. </ul>
  548. </div>
  549. </div>
  550. </div>
  551. </section>
  552. <div class="container">
  553. <div class="headInfo">
  554. <div>
  555. <h4 translate>亲爱的{{pageData.name}}</h4>
  556. <p class="color-grey" translate>{{pageData.date}}</p>
  557. </div>
  558. <div class="flex mobilenoflex">
  559. <div class="mobileIcon">
  560. <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>
  561. </div>
  562. <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>
  563. <a class="color-active" onclick="tool.loginOut()" translate>账号登出</a>
  564. </div>
  565. </div>
  566. <div class="content">
  567. <div class="tabs">
  568. <p @click="pageData.tab1 = 'xs'" :class="pageData.tab1 == 'xs'?'tab_active':''" translate>销售数据</p>
  569. <p @click="pageData.tab1 = 'yy'" :class="pageData.tab1 == 'yy'?'tab_active':''" translate>应用数据</p>
  570. </div>
  571. <div style="padding: 20px 0;">
  572. <div v-show="pageData.tab1 == 'xs'" class="row">
  573. <div class="col-md-4">
  574. <div class="shadowCard">
  575. <div class="flex-end">
  576. <h4 translate>业务员账户</h4>
  577. <p class="color-grey"><a @click="linkOfIframe({name:'myaccountclass',system:'sale'})" href="#" translate>金额明细</a> ></p>
  578. </div>
  579. <div class="dataContent">
  580. <div class="mbline">
  581. <small translate>{{pageData.accountBalance.hraccountname || '无账户'}}</small>
  582. <h3 class="color-active"><b>{{pageData.accountBalance.balance || 0}}</b></h3>
  583. </div>
  584. <div class="mbline">
  585. <small translate>预计提成</small>
  586. <h4><b>{{pageData.accountBalance.expectedReward || 0}}</b></h4>
  587. </div>
  588. </div>
  589. </div>
  590. </div>
  591. <div class="col-md-8">
  592. <div class="shadowCard">
  593. <div class="flex-end web">
  594. <div class="flex">
  595. <h4 translate>业绩与目标</h4>
  596. <div class="dropdown">
  597. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" >
  598. <span translate>{{translate(pageData.datatype[param.content.datatype])}}</span>
  599. <span class="caret"></span>
  600. </a>
  601. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  602. <li @click="getSaleAndTarget(param.content.datatype = 1)"><a href="#" translate>订单</a></li>
  603. <li @click="getSaleAndTarget(param.content.datatype = 2)"><a href="#" translate>出货</a></li>
  604. <li @click="getSaleAndTarget(param.content.datatype = 3)"><a href="#" translate>开票</a></li>
  605. <li @click="getSaleAndTarget(param.content.datatype = 4)"><a href="#" translate>回款</a></li>
  606. </ul>
  607. </div>
  608. <div class="dropdown">
  609. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  610. <span translate>{{translate(param.content.dateType)}}</span>
  611. <span class="caret"></span>
  612. </a>
  613. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  614. <li @click="getSaleAndTarget(param.content.dateType = '去年')"><a href="#" translate>去年</a></li>
  615. <li @click="getSaleAndTarget(param.content.dateType = '本年')"><a href="#" translate>本年</a></li>
  616. <li @click="getSaleAndTarget(param.content.dateType = '本季')"><a href="#" translate>本季</a></li>
  617. <li @click="getSaleAndTarget(param.content.dateType = '本月')"><a href="#" translate>本月</a></li>
  618. </ul>
  619. </div>
  620. </div>
  621. <a href="#" @click="linkOfIframe({name:'smPersonalTarget',system:'CRM'})"><span translate>查看详情</span> ></a>
  622. </div>
  623. <div class="mobile">
  624. <div class="flex-end" style="margin-bottom: 20px;">
  625. <h4 translate>业绩与目标</h4>
  626. <a href="#" @click="linkOfIframe({name:'smPersonalTarget',system:'CRM'})"><span translate>查看详情</span> ></a>
  627. </div>
  628. <div class="flex">
  629. <div class="dropdown">
  630. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  631. <span translate>{{pageData.datatype[param.content.datatype]}}</span>
  632. <span class="caret"></span>
  633. </a>
  634. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  635. <li @click="getSaleAndTarget(param.content.datatype = 1)"><a href="#" translate>订单</a></li>
  636. <li @click="getSaleAndTarget(param.content.datatype = 2)"><a href="#" translate>出货</a></li>
  637. <li @click="getSaleAndTarget(param.content.datatype = 3)"><a href="#" translate>开票</a></li>
  638. <li @click="getSaleAndTarget(param.content.datatype = 4)"><a href="#" translate>回款</a></li>
  639. </ul>
  640. </div>
  641. <div class="dropdown">
  642. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  643. <span translate>{{param.content.dateType}}</span>
  644. <span class="caret"></span>
  645. </a>
  646. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  647. <li @click="getSaleAndTarget(param.content.dateType = '去年')"><a href="#" translate>去年</a></li>
  648. <li @click="getSaleAndTarget(param.content.dateType = '本年')"><a href="#" translate>本年</a></li>
  649. <li @click="getSaleAndTarget(param.content.dateType = '本季')"><a href="#" translate>本季</a></li>
  650. <li @click="getSaleAndTarget(param.content.dateType = '本月')"><a href="#" translate>本月</a></li>
  651. </ul>
  652. </div>
  653. </div>
  654. </div>
  655. <div class="flex sx-flex" style="margin: 24px 0 0 0; gap: 30px;">
  656. <div class="percent">
  657. <svg>
  658. <circle cx="70" cy="70" r="70" />
  659. <circle id="circle" cx="70" cy="70" r="70" />
  660. </svg>
  661. <div class="num">
  662. <h2>
  663. <span id="per">
  664. <small translate>目标达成率</small><br><span style="color: #3685fc;">{{pageData.saleAndTarget.wcamount}}%</span></span>
  665. </h2>
  666. </div>
  667. </div>
  668. <div class="targetBox">
  669. <p translate>实际金额</p>
  670. <h3><b>{{pageData.saleAndTarget.amount}}</b>&nbsp;<small translate>万</small></h3>
  671. <div class="flex" style="gap:20px">
  672. <p style="flex: 1;">
  673. <small translate>年同比</small><br>
  674. {{(pageData.saleAndTarget.tbxsje * 100).toFixed(2)}}% <i v-if="pageData.saleAndTarget.tbxsje < 0" style="color:red;margin-top: -5px;" class="fa fa-sort-desc"></i> <i v-else class="fa fa-sort-up color-active"></i>
  675. </p>
  676. <p style="flex: 1;">
  677. <small translate>年环比</small><br>
  678. {{(pageData.saleAndTarget.hbxsje * 100).toFixed(2)}}% <i v-if="pageData.saleAndTarget.hbxsje < 0" style="color:red;margin-top: -5px" class="fa fa-sort-desc"></i> <i v-else class="fa fa-sort-up color-active"></i>
  679. </p>
  680. </div>
  681. </div>
  682. <div class="targetBox">
  683. <p translate>目标金额</p>
  684. <h3><b>{{pageData.saleAndTarget.target_l}}</b>&nbsp;<small translate>万</small></h3>
  685. <div class="flex" style="gap:20px">
  686. <p style="flex: 1;">
  687. <small translate>目标达成率</small> <br>
  688. {{pageData.saleAndTarget.wcamount}}%
  689. </p>
  690. <p style="flex: 1;">
  691. <small translate>实际与目标差额</small><br>
  692. {{pageData.saleAndTarget.unamount}}万
  693. </p>
  694. </div>
  695. </div>
  696. </div>
  697. </div>
  698. </div>
  699. </div>
  700. <div v-show="pageData.tab1 == 'yy'" class="row">
  701. <div class="col-md-4">
  702. <div class="shadowCard">
  703. <div class="flex-end">
  704. <h4 translate>应收账款</h4>
  705. <p class="color-grey"><a href="#" @click="linkOfIframe({name:'accountsReceivable',system:'sale'})" translate>金额明细</a>></p>
  706. </div>
  707. <div class="row">
  708. <div class="col-md-6" :class="pageData.viewportWidth < 375 ? 'col-xs-12':'col-xs-6'">
  709. <div class="accountsRece">
  710. <h5 translate>{{pageData.accountsReceivable.sumallaoverduemount || 0}}</h5>
  711. <p translate>总应收 (元)</p>
  712. </div>
  713. </div>
  714. <div class="col-md-6" :class="pageData.viewportWidth < 375 ? 'col-xs-12':'col-xs-6'">
  715. <div class="accountsRece">
  716. <h5>{{pageData.accountsReceivable.sumonemonthamount || 0}}</h5>
  717. <p translate>逾期1月以内 (元)</p>
  718. </div>
  719. </div>
  720. <div class="col-md-6" :class="pageData.viewportWidth < 375 ? 'col-xs-12':'col-xs-6'">
  721. <div class="accountsRece">
  722. <h5>{{pageData.accountsReceivable.sumthreemonthamount || 0}}</h5>
  723. <p translate>逾期1-3月 (元)</p>
  724. </div>
  725. </div>
  726. <div class="col-md-6" :class="pageData.viewportWidth < 375 ? 'col-xs-12':'col-xs-6'">
  727. <div class="accountsRece">
  728. <h5>{{pageData.accountsReceivable.upthreemonthamount || 0}}</h5>
  729. <p translate>逾期3月以上 (元)</p>
  730. </div>
  731. </div>
  732. </div>
  733. </div>
  734. </div>
  735. <div class="col-md-8">
  736. <div class="shadowCard">
  737. <div class="flex-end">
  738. <div class="flex">
  739. <h4 translate>作业看板</h4>
  740. <div class="dropdown web">
  741. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  742. <span translate>{{translate(pageData.kbOptions[pageData.kbtype])}}</span>
  743. <span class="caret"></span>
  744. </a>
  745. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  746. <li @click="pageData.kbtype = 'bz'"><a href="#" translate>本周</a></li>
  747. <li @click="pageData.kbtype = 'by'"><a href="#" translate>本月</a></li>
  748. <li @click="pageData.kbtype = 'bn'"><a href="#" translate>本年</a></li>
  749. </ul>
  750. </div>
  751. </div>
  752. <a href="#" @click="linkOfIframe({name:'dataanalysis',system:'crm'})"><span translate>查看详情</span> ></a>
  753. </div>
  754. <!-- wdataanalysis -->
  755. <div class="dropdown moblie" style="margin-top: 10px;">
  756. <a class="dropdown-toggle dropdown-btn" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
  757. <span translate>{{translate(pageData.kbOptions[pageData.kbtype])}}</span>
  758. <span class="caret"></span>
  759. </a>
  760. <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
  761. <li @click="pageData.kbtype = 'bz'"><a href="#" translate>本周</a></li>
  762. <li @click="pageData.kbtype = 'by'"><a href="#" translate>本月</a></li>
  763. <li @click="pageData.kbtype = 'bn'"><a href="#" translate>本年</a></li>
  764. </ul>
  765. </div>
  766. <div class="row">
  767. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  768. <div class="accountsRece borard">
  769. <h5>{{pageData.workeBoard[`${pageData.kbtype}xsxz`]}}</h5>
  770. <p translate>新增线索数</p>
  771. </div>
  772. </div>
  773. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  774. <div class="accountsRece borard">
  775. <h5>{{pageData.workeBoard[`${pageData.kbtype}xmxz`]}}</h5>
  776. <p translate>新增项目数</p>
  777. </div>
  778. </div>
  779. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  780. <div class="accountsRece borard">
  781. <h5>{{pageData.workeBoard[`${pageData.kbtype}khxz`]}}</h5>
  782. <p translate>新增客户数</p>
  783. </div>
  784. </div>
  785. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  786. <div class="accountsRece borard">
  787. <h5>{{pageData.workeBoard[`${pageData.kbtype}xsgj`]}}</h5>
  788. <p translate>线索跟进次数</p>
  789. </div>
  790. </div>
  791. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  792. <div class="accountsRece borard">
  793. <h5>{{pageData.workeBoard[`${pageData.kbtype}xmgj`]}}</h5>
  794. <p translate>项目跟进次数</p>
  795. </div>
  796. </div>
  797. <div class="col-md-4" :class="pageData.viewportWidth < 375 ? 'col-xs-6':'col-xs-4'">
  798. <div class="accountsRece borard">
  799. <h5>{{pageData.workeBoard[`${pageData.kbtype}khgj`]}}</h5>
  800. <p translate>客户跟进次数</p>
  801. </div>
  802. </div>
  803. </div>
  804. </div>
  805. </div>
  806. </div>
  807. </div>
  808. </div>
  809. <div class="row">
  810. <div class="col-md-8">
  811. <div class="content">
  812. <div class="tabs">
  813. <p class="tab_active" translate><span>快捷</span>应用</p>
  814. </div>
  815. <div v-show="pageData.apps.length > 0" class="grid">
  816. <div class="linkitem" v-for="app in pageData.apps" :key="app.appid" @click="linkOfIframe(app)">
  817. <div v-if="app.cover" style="height: 50px;width: 50px;margin: 0 auto;">
  818. <img style="width: 100%;" :src="app.cover" alt="">
  819. </div>
  820. <div v-else style="height: 50px;width: 50px;margin: 0 auto;background-color: #F4F5F7;"></div>
  821. <p style="font-size: 12px;margin-top: 9px;text-align: center;" translate>{{app.meta.title}}</p>
  822. </div>
  823. </div>
  824. <div v-show="pageData.apps.length == 0" class="empty" translate>暂无应用</div>
  825. </div>
  826. <!-- <div class="content">
  827. <div class="tabs">
  828. <p class="tab_active" translate><span>相关</span>系统</p>
  829. </div>
  830. <div class="sys_grid ">
  831. <div>
  832. <img src="./images/yxgl.svg" alt="">
  833. <div class="system_name">
  834. <div>
  835. <h4 translate>营销管理平台</h4>
  836. <a href="" translate>进入系统</a>
  837. </div>
  838. </div>
  839. </div>
  840. <div>
  841. <img src="./images/BPM.svg" alt="">
  842. <div class="system_name">
  843. <div>
  844. <h4 translate>BPM系统</h4>
  845. <a href="" translate>进入系统</a>
  846. </div>
  847. </div>
  848. </div>
  849. <div>
  850. <img src="./images/yhl.svg" alt="">
  851. <div class="system_name">
  852. <div>
  853. <h4 translate>汇联易</h4>
  854. <a href="" translate>进入系统</a>
  855. </div>
  856. </div>
  857. </div>
  858. </div>
  859. </div> -->
  860. </div>
  861. <div class="col-md-4">
  862. <div class="content">
  863. <div class="tabs">
  864. <p @click="pageData.tab2 = 'msg'" :class="pageData.tab2 == 'msg' ? 'tab_active':''"><span translate>系统消息</p>
  865. <p @click ="pageData.tab2 = 'bill'" :class="pageData.tab2 == 'bill' ? 'tab_active':''" ><span translate>单据动态</p>
  866. </div>
  867. <div v-if="pageData.tab2 == 'msg'" class="message">
  868. <div class="flex messageBox" v-for="msg in pageData.message" :key="msg.messageid">
  869. <div class="date">
  870. <h4><b>{{msg.createdate.split('-')[2].split(' ')[0]}}</b></h4>
  871. <small>{{msg.createdate.split('-')[0]}}-{{msg.createdate.split('-')[1]}}</small>
  872. </div>
  873. <div>
  874. <h5>{{msg.title}}</h5>
  875. <small>{{msg.message}}</small>
  876. </div>
  877. </div>
  878. </div>
  879. <div v-else>
  880. <div class="message">
  881. <div class="orderMsgBox" v-for="msg in pageData.orderMsg" :key="msg.index">
  882. <div class="flex-start">
  883. <label class="color-blue" for="">订单</label>
  884. <p>{{msg.sonum}}</p>
  885. <p class="mytag">{{msg.type}}</p>
  886. </div>
  887. <div class="flex-start">
  888. <label class="color-blue" for="">客户</label>
  889. <p>{{msg.enterprisename}}</p>
  890. </div>
  891. <div class="flex-start">
  892. <label class="color-blue" for="">项目</label>
  893. <p>{{msg.projectname}}</p>
  894. </div>
  895. <div class="flex-start">
  896. <label class="color-active" for="">{{msg.action}}</label>
  897. <p>{{msg.remarks}}<br><small class="color-grey">{{msg.actiondate}}</small></p>
  898. </div>
  899. </div>
  900. </div>
  901. </div>
  902. <div class="allMsg">
  903. <a v-show="pageData.tab2 == 'msg'" href="#" @click="linkOfIframe({name:'message',system:'sale'})" translate>查看全部消息</a>
  904. <a v-show="pageData.tab2 == 'bill'" href="#" @click="linkOfIframe({name:'ordersaler',system:'sale'})" translate>查看全部订单</a>
  905. </div>
  906. </div>
  907. </div>
  908. </div>
  909. </div>
  910. </div>
  911. </div>
  912. </div>
  913. <!-- <div class="footer">
  914. <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>
  915. </div> -->
  916. <!-- Javascript -->
  917. <script src="blog/js/jquery.min.js"></script>
  918. <script src="blog/js/bootstrap.min.js"></script>
  919. <script src="blog/js/bootstrap-select.min.js"></script>
  920. <script src="blog/js/animsition.js"></script>
  921. <script src="blog/js/jquery.appear.min.js"></script>
  922. <script src="blog/js/countto.js"></script>
  923. <script src="blog/js/slick.min.js"></script>
  924. <script src="blog/js/jquery.stickit.min.js"></script>
  925. <script src="blog/js/jquery.parallax-1.1.3.js"></script>
  926. <script src="blog/js/owl.carousel.min.js"></script>
  927. <script src="blog/js/masonry.pkgd.min.js"></script>
  928. <script src="blog/js/magnific.popup.min.js"></script>
  929. <script src="blog/js/wow.min.js"></script>
  930. <script src="blog/js/main.js"></script>
  931. <script src="js/swiper.min.js"></script>
  932. <script src="js/swiper.animate1.0.2.min.js"></script>
  933. <script src="js/jquery.fullPage.js"></script>
  934. <script src="js/public.js"></script>
  935. <script src="vue/axios.min.js"></script>
  936. <script src="vue/api.js"></script>
  937. <script src="vue/vue.global.js"></script>
  938. <script src="vue/formTool.js"></script>
  939. <script src="questJs/accountCenter.js"></script>
  940. <script>
  941. tool.modulesClick('个人中心')
  942. </script>
  943. <script>
  944. document.addEventListener('WeixinOpenTagsError', function (e) {
  945. console.error(e.detail.errMsg); // 无法使用开放标签的错误原因,需回退兼容。仅无法使用开放标签,JS-SDK其他功能不受影响
  946. });
  947. var btn = document.getElementById('launch-btn');
  948. btn.addEventListener('launch', function (e) {
  949. console.log('success');
  950. });
  951. btn.addEventListener('error', function (e) {
  952. console.log('fail', e.detail);
  953. });
  954. </script>
  955. </body>
  956. </html>