accountCenter copy.html 43 KB

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