index.vue 13 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012
  1. <template>
  2. <uni-shadow-root class="vant-icon-index"><view :class="'custom-class '+(classPrefix)+' '+(isImageName ? 'van-icon--image' : classPrefix + '-' + name)" :style="(color ? 'color: ' + color + ';' : '')+(size ? 'font-size: ' + sizeWithUnit + ';' : '')+(customStyle)" @click="onClick">
  3. <van-info v-if="info !== null || dot" :dot="dot" :info="info" custom-class="van-icon__info"></van-info>
  4. <image v-if="isImageName" :src="name" mode="aspectFit" class="van-icon__image"></image>
  5. </view></uni-shadow-root>
  6. </template>
  7. <script>
  8. import VanInfo from '../info/index.vue'
  9. global['__wxVueOptions'] = {components:{'van-info': VanInfo}}
  10. global['__wxRoute'] = 'vant/icon/index'
  11. import { VantComponent } from '../common/component';
  12. import { addUnit } from '../common/utils';
  13. VantComponent({
  14. props: {
  15. dot: Boolean,
  16. info: null,
  17. size: {
  18. type: null,
  19. observer: 'setSizeWithUnit'
  20. },
  21. color: String,
  22. customStyle: String,
  23. classPrefix: {
  24. type: String,
  25. value: 'van-icon'
  26. },
  27. name: {
  28. type: String,
  29. observer(val) {
  30. this.setData({
  31. isImageName: val.indexOf('/') !== -1
  32. });
  33. }
  34. }
  35. },
  36. data: {
  37. sizeWithUnit: null,
  38. },
  39. methods: {
  40. onClick() {
  41. this.$emit('click');
  42. },
  43. setSizeWithUnit(size) {
  44. this.setData({
  45. sizeWithUnit: addUnit(size)
  46. });
  47. }
  48. }
  49. });
  50. export default global['__wxComponents']['vant/icon/index']
  51. </script>
  52. <style platform="mp-weixin">
  53. @import '../common/index.css';
  54. @font-face {
  55. font-weight: 400;
  56. font-family: vant-icon;
  57. font-style: normal;
  58. font-display: auto;
  59. src: url(https://img.yzcdn.cn/vant/vant-icon-0bc654.woff2) format("woff2"), url(https://img.yzcdn.cn/vant/vant-icon-0bc654.woff) format("woff"), url(https://img.yzcdn.cn/vant/vant-icon-0bc654.ttf) format("truetype")
  60. }
  61. .van-icon {
  62. position: relative;
  63. font: normal normal normal 14px/1 vant-icon;
  64. font-size: inherit;
  65. text-rendering: auto;
  66. -webkit-font-smoothing: antialiased
  67. }
  68. .van-icon,
  69. .van-icon:before {
  70. display: inline-block
  71. }
  72. .van-icon-add-o:before {
  73. content: "\F000"
  74. }
  75. .van-icon-add-square:before {
  76. content: "\F001"
  77. }
  78. .van-icon-add:before {
  79. content: "\F002"
  80. }
  81. .van-icon-after-sale:before {
  82. content: "\F003"
  83. }
  84. .van-icon-aim:before {
  85. content: "\F004"
  86. }
  87. .van-icon-alipay:before {
  88. content: "\F005"
  89. }
  90. .van-icon-apps-o:before {
  91. content: "\F006"
  92. }
  93. .van-icon-arrow-down:before {
  94. content: "\F007"
  95. }
  96. .van-icon-arrow-left:before {
  97. content: "\F008"
  98. }
  99. .van-icon-arrow-up:before {
  100. content: "\F009"
  101. }
  102. .van-icon-arrow:before {
  103. content: "\F00A"
  104. }
  105. .van-icon-ascending:before {
  106. content: "\F00B"
  107. }
  108. .van-icon-audio:before {
  109. content: "\F00C"
  110. }
  111. .van-icon-award-o:before {
  112. content: "\F00D"
  113. }
  114. .van-icon-award:before {
  115. content: "\F00E"
  116. }
  117. .van-icon-bag-o:before {
  118. content: "\F00F"
  119. }
  120. .van-icon-bag:before {
  121. content: "\F010"
  122. }
  123. .van-icon-balance-list-o:before {
  124. content: "\F011"
  125. }
  126. .van-icon-balance-list:before {
  127. content: "\F012"
  128. }
  129. .van-icon-balance-o:before {
  130. content: "\F013"
  131. }
  132. .van-icon-balance-pay:before {
  133. content: "\F014"
  134. }
  135. .van-icon-bar-chart-o:before {
  136. content: "\F015"
  137. }
  138. .van-icon-bars:before {
  139. content: "\F016"
  140. }
  141. .van-icon-bell:before {
  142. content: "\F017"
  143. }
  144. .van-icon-bill-o:before {
  145. content: "\F018"
  146. }
  147. .van-icon-bill:before {
  148. content: "\F019"
  149. }
  150. .van-icon-birthday-cake-o:before {
  151. content: "\F01A"
  152. }
  153. .van-icon-bookmark-o:before {
  154. content: "\F01B"
  155. }
  156. .van-icon-bookmark:before {
  157. content: "\F01C"
  158. }
  159. .van-icon-browsing-history-o:before {
  160. content: "\F01D"
  161. }
  162. .van-icon-browsing-history:before {
  163. content: "\F01E"
  164. }
  165. .van-icon-brush-o:before {
  166. content: "\F01F"
  167. }
  168. .van-icon-bulb-o:before {
  169. content: "\F020"
  170. }
  171. .van-icon-bullhorn-o:before {
  172. content: "\F021"
  173. }
  174. .van-icon-calender-o:before {
  175. content: "\F022"
  176. }
  177. .van-icon-card:before {
  178. content: "\F023"
  179. }
  180. .van-icon-cart-circle-o:before {
  181. content: "\F024"
  182. }
  183. .van-icon-cart-circle:before {
  184. content: "\F025"
  185. }
  186. .van-icon-cart-o:before {
  187. content: "\F026"
  188. }
  189. .van-icon-cart:before {
  190. content: "\F027"
  191. }
  192. .van-icon-cash-back-record:before {
  193. content: "\F028"
  194. }
  195. .van-icon-cash-on-deliver:before {
  196. content: "\F029"
  197. }
  198. .van-icon-cashier-o:before {
  199. content: "\F02A"
  200. }
  201. .van-icon-certificate:before {
  202. content: "\F02B"
  203. }
  204. .van-icon-chart-trending-o:before {
  205. content: "\F02C"
  206. }
  207. .van-icon-chat-o:before {
  208. content: "\F02D"
  209. }
  210. .van-icon-chat:before {
  211. content: "\F02E"
  212. }
  213. .van-icon-checked:before {
  214. content: "\F02F"
  215. }
  216. .van-icon-circle:before {
  217. content: "\F030"
  218. }
  219. .van-icon-clear:before {
  220. content: "\F031"
  221. }
  222. .van-icon-clock-o:before {
  223. content: "\F032"
  224. }
  225. .van-icon-clock:before {
  226. content: "\F033"
  227. }
  228. .van-icon-close:before {
  229. content: "\F034"
  230. }
  231. .van-icon-closed-eye:before {
  232. content: "\F035"
  233. }
  234. .van-icon-cluster-o:before {
  235. content: "\F036"
  236. }
  237. .van-icon-cluster:before {
  238. content: "\F037"
  239. }
  240. .van-icon-column:before {
  241. content: "\F038"
  242. }
  243. .van-icon-comment-circle-o:before {
  244. content: "\F039"
  245. }
  246. .van-icon-comment-circle:before {
  247. content: "\F03A"
  248. }
  249. .van-icon-comment-o:before {
  250. content: "\F03B"
  251. }
  252. .van-icon-comment:before {
  253. content: "\F03C"
  254. }
  255. .van-icon-completed:before {
  256. content: "\F03D"
  257. }
  258. .van-icon-contact:before {
  259. content: "\F03E"
  260. }
  261. .van-icon-coupon-o:before {
  262. content: "\F03F"
  263. }
  264. .van-icon-coupon:before {
  265. content: "\F040"
  266. }
  267. .van-icon-credit-pay:before {
  268. content: "\F041"
  269. }
  270. .van-icon-cross:before {
  271. content: "\F042"
  272. }
  273. .van-icon-debit-pay:before {
  274. content: "\F043"
  275. }
  276. .van-icon-delete:before {
  277. content: "\F044"
  278. }
  279. .van-icon-descending:before {
  280. content: "\F045"
  281. }
  282. .van-icon-description:before {
  283. content: "\F046"
  284. }
  285. .van-icon-desktop-o:before {
  286. content: "\F047"
  287. }
  288. .van-icon-diamond-o:before {
  289. content: "\F048"
  290. }
  291. .van-icon-diamond:before {
  292. content: "\F049"
  293. }
  294. .van-icon-discount:before {
  295. content: "\F04A"
  296. }
  297. .van-icon-down:before {
  298. content: "\F04B"
  299. }
  300. .van-icon-ecard-pay:before {
  301. content: "\F04C"
  302. }
  303. .van-icon-edit:before {
  304. content: "\F04D"
  305. }
  306. .van-icon-ellipsis:before {
  307. content: "\F04E"
  308. }
  309. .van-icon-empty:before {
  310. content: "\F04F"
  311. }
  312. .van-icon-envelop-o:before {
  313. content: "\F050"
  314. }
  315. .van-icon-exchange:before {
  316. content: "\F051"
  317. }
  318. .van-icon-expand-o:before {
  319. content: "\F052"
  320. }
  321. .van-icon-expand:before {
  322. content: "\F053"
  323. }
  324. .van-icon-eye-o:before {
  325. content: "\F054"
  326. }
  327. .van-icon-eye:before {
  328. content: "\F055"
  329. }
  330. .van-icon-fail:before {
  331. content: "\F056"
  332. }
  333. .van-icon-failure:before {
  334. content: "\F057"
  335. }
  336. .van-icon-filter-o:before {
  337. content: "\F058"
  338. }
  339. .van-icon-fire-o:before {
  340. content: "\F059"
  341. }
  342. .van-icon-fire:before {
  343. content: "\F05A"
  344. }
  345. .van-icon-flag-o:before {
  346. content: "\F05B"
  347. }
  348. .van-icon-flower-o:before {
  349. content: "\F05C"
  350. }
  351. .van-icon-free-postage:before {
  352. content: "\F05D"
  353. }
  354. .van-icon-friends-o:before {
  355. content: "\F05E"
  356. }
  357. .van-icon-friends:before {
  358. content: "\F05F"
  359. }
  360. .van-icon-gem-o:before {
  361. content: "\F060"
  362. }
  363. .van-icon-gem:before {
  364. content: "\F061"
  365. }
  366. .van-icon-gift-card-o:before {
  367. content: "\F062"
  368. }
  369. .van-icon-gift-card:before {
  370. content: "\F063"
  371. }
  372. .van-icon-gift-o:before {
  373. content: "\F064"
  374. }
  375. .van-icon-gift:before {
  376. content: "\F065"
  377. }
  378. .van-icon-gold-coin-o:before {
  379. content: "\F066"
  380. }
  381. .van-icon-gold-coin:before {
  382. content: "\F067"
  383. }
  384. .van-icon-good-job-o:before {
  385. content: "\F068"
  386. }
  387. .van-icon-good-job:before {
  388. content: "\F069"
  389. }
  390. .van-icon-goods-collect-o:before {
  391. content: "\F06A"
  392. }
  393. .van-icon-goods-collect:before {
  394. content: "\F06B"
  395. }
  396. .van-icon-graphic:before {
  397. content: "\F06C"
  398. }
  399. .van-icon-home-o:before {
  400. content: "\F06D"
  401. }
  402. .van-icon-hot-o:before {
  403. content: "\F06E"
  404. }
  405. .van-icon-hot-sale-o:before {
  406. content: "\F06F"
  407. }
  408. .van-icon-hot-sale:before {
  409. content: "\F070"
  410. }
  411. .van-icon-hot:before {
  412. content: "\F071"
  413. }
  414. .van-icon-hotel-o:before {
  415. content: "\F072"
  416. }
  417. .van-icon-idcard:before {
  418. content: "\F073"
  419. }
  420. .van-icon-info-o:before {
  421. content: "\F074"
  422. }
  423. .van-icon-info:before {
  424. content: "\F075"
  425. }
  426. .van-icon-invition:before {
  427. content: "\F076"
  428. }
  429. .van-icon-label-o:before {
  430. content: "\F077"
  431. }
  432. .van-icon-label:before {
  433. content: "\F078"
  434. }
  435. .van-icon-like-o:before {
  436. content: "\F079"
  437. }
  438. .van-icon-like:before {
  439. content: "\F07A"
  440. }
  441. .van-icon-live:before {
  442. content: "\F07B"
  443. }
  444. .van-icon-location-o:before {
  445. content: "\F07C"
  446. }
  447. .van-icon-location:before {
  448. content: "\F07D"
  449. }
  450. .van-icon-lock:before {
  451. content: "\F07E"
  452. }
  453. .van-icon-logistics:before {
  454. content: "\F07F"
  455. }
  456. .van-icon-manager-o:before {
  457. content: "\F080"
  458. }
  459. .van-icon-manager:before {
  460. content: "\F081"
  461. }
  462. .van-icon-map-marked:before {
  463. content: "\F082"
  464. }
  465. .van-icon-medel-o:before {
  466. content: "\F083"
  467. }
  468. .van-icon-medel:before {
  469. content: "\F084"
  470. }
  471. .van-icon-more-o:before {
  472. content: "\F085"
  473. }
  474. .van-icon-more:before {
  475. content: "\F086"
  476. }
  477. .van-icon-music-o:before {
  478. content: "\F087"
  479. }
  480. .van-icon-music:before {
  481. content: "\F088"
  482. }
  483. .van-icon-new-arrival-o:before {
  484. content: "\F089"
  485. }
  486. .van-icon-new-arrival:before {
  487. content: "\F08A"
  488. }
  489. .van-icon-new-o:before {
  490. content: "\F08B"
  491. }
  492. .van-icon-new:before {
  493. content: "\F08C"
  494. }
  495. .van-icon-newspaper-o:before {
  496. content: "\F08D"
  497. }
  498. .van-icon-notes-o:before {
  499. content: "\F08E"
  500. }
  501. .van-icon-orders-o:before {
  502. content: "\F08F"
  503. }
  504. .van-icon-other-pay:before {
  505. content: "\F090"
  506. }
  507. .van-icon-paid:before {
  508. content: "\F091"
  509. }
  510. .van-icon-passed:before {
  511. content: "\F092"
  512. }
  513. .van-icon-pause-circle-o:before {
  514. content: "\F093"
  515. }
  516. .van-icon-pause-circle:before {
  517. content: "\F094"
  518. }
  519. .van-icon-pause:before {
  520. content: "\F095"
  521. }
  522. .van-icon-peer-pay:before {
  523. content: "\F096"
  524. }
  525. .van-icon-pending-payment:before {
  526. content: "\F097"
  527. }
  528. .van-icon-phone-circle-o:before {
  529. content: "\F098"
  530. }
  531. .van-icon-phone-circle:before {
  532. content: "\F099"
  533. }
  534. .van-icon-phone-o:before {
  535. content: "\F09A"
  536. }
  537. .van-icon-phone:before {
  538. content: "\F09B"
  539. }
  540. .van-icon-photo-o:before {
  541. content: "\F09C"
  542. }
  543. .van-icon-photo:before {
  544. content: "\F09D"
  545. }
  546. .van-icon-photograph:before {
  547. content: "\F09E"
  548. }
  549. .van-icon-play-circle-o:before {
  550. content: "\F09F"
  551. }
  552. .van-icon-play-circle:before {
  553. content: "\F0A0"
  554. }
  555. .van-icon-play:before {
  556. content: "\F0A1"
  557. }
  558. .van-icon-plus:before {
  559. content: "\F0A2"
  560. }
  561. .van-icon-point-gift-o:before {
  562. content: "\F0A3"
  563. }
  564. .van-icon-point-gift:before {
  565. content: "\F0A4"
  566. }
  567. .van-icon-points:before {
  568. content: "\F0A5"
  569. }
  570. .van-icon-printer:before {
  571. content: "\F0A6"
  572. }
  573. .van-icon-qr-invalid:before {
  574. content: "\F0A7"
  575. }
  576. .van-icon-qr:before {
  577. content: "\F0A8"
  578. }
  579. .van-icon-question-o:before {
  580. content: "\F0A9"
  581. }
  582. .van-icon-question:before {
  583. content: "\F0AA"
  584. }
  585. .van-icon-records:before {
  586. content: "\F0AB"
  587. }
  588. .van-icon-refund-o:before {
  589. content: "\F0AC"
  590. }
  591. .van-icon-replay:before {
  592. content: "\F0AD"
  593. }
  594. .van-icon-scan:before {
  595. content: "\F0AE"
  596. }
  597. .van-icon-search:before {
  598. content: "\F0AF"
  599. }
  600. .van-icon-send-gift-o:before {
  601. content: "\F0B0"
  602. }
  603. .van-icon-send-gift:before {
  604. content: "\F0B1"
  605. }
  606. .van-icon-service-o:before {
  607. content: "\F0B2"
  608. }
  609. .van-icon-service:before {
  610. content: "\F0B3"
  611. }
  612. .van-icon-setting-o:before {
  613. content: "\F0B4"
  614. }
  615. .van-icon-setting:before {
  616. content: "\F0B5"
  617. }
  618. .van-icon-share:before {
  619. content: "\F0B6"
  620. }
  621. .van-icon-shop-collect-o:before {
  622. content: "\F0B7"
  623. }
  624. .van-icon-shop-collect:before {
  625. content: "\F0B8"
  626. }
  627. .van-icon-shop-o:before {
  628. content: "\F0B9"
  629. }
  630. .van-icon-shop:before {
  631. content: "\F0BA"
  632. }
  633. .van-icon-shopping-cart-o:before {
  634. content: "\F0BB"
  635. }
  636. .van-icon-shopping-cart:before {
  637. content: "\F0BC"
  638. }
  639. .van-icon-shrink:before {
  640. content: "\F0BD"
  641. }
  642. .van-icon-sign:before {
  643. content: "\F0BE"
  644. }
  645. .van-icon-smile-comment-o:before {
  646. content: "\F0BF"
  647. }
  648. .van-icon-smile-comment:before {
  649. content: "\F0C0"
  650. }
  651. .van-icon-smile-o:before {
  652. content: "\F0C1"
  653. }
  654. .van-icon-smile:before {
  655. content: "\F0C2"
  656. }
  657. .van-icon-star-o:before {
  658. content: "\F0C3"
  659. }
  660. .van-icon-star:before {
  661. content: "\F0C4"
  662. }
  663. .van-icon-stop-circle-o:before {
  664. content: "\F0C5"
  665. }
  666. .van-icon-stop-circle:before {
  667. content: "\F0C6"
  668. }
  669. .van-icon-stop:before {
  670. content: "\F0C7"
  671. }
  672. .van-icon-success:before {
  673. content: "\F0C8"
  674. }
  675. .van-icon-thumb-circle-o:before {
  676. content: "\F0C9"
  677. }
  678. .van-icon-thumb-circle:before {
  679. content: "\F0CA"
  680. }
  681. .van-icon-todo-list-o:before {
  682. content: "\F0CB"
  683. }
  684. .van-icon-todo-list:before {
  685. content: "\F0CC"
  686. }
  687. .van-icon-tosend:before {
  688. content: "\F0CD"
  689. }
  690. .van-icon-tv-o:before {
  691. content: "\F0CE"
  692. }
  693. .van-icon-umbrella-circle:before {
  694. content: "\F0CF"
  695. }
  696. .van-icon-underway-o:before {
  697. content: "\F0D0"
  698. }
  699. .van-icon-underway:before {
  700. content: "\F0D1"
  701. }
  702. .van-icon-upgrade:before {
  703. content: "\F0D2"
  704. }
  705. .van-icon-user-circle-o:before {
  706. content: "\F0D3"
  707. }
  708. .van-icon-user-o:before {
  709. content: "\F0D4"
  710. }
  711. .van-icon-video-o:before {
  712. content: "\F0D5"
  713. }
  714. .van-icon-video:before {
  715. content: "\F0D6"
  716. }
  717. .van-icon-vip-card-o:before {
  718. content: "\F0D7"
  719. }
  720. .van-icon-vip-card:before {
  721. content: "\F0D8"
  722. }
  723. .van-icon-volume-o:before {
  724. content: "\F0D9"
  725. }
  726. .van-icon-volume:before {
  727. content: "\F0DA"
  728. }
  729. .van-icon-wap-home-o:before {
  730. content: "\F0DB"
  731. }
  732. .van-icon-wap-home:before {
  733. content: "\F0DC"
  734. }
  735. .van-icon-wap-nav:before {
  736. content: "\F0DD"
  737. }
  738. .van-icon-warn-o:before {
  739. content: "\F0DE"
  740. }
  741. .van-icon-warning-o:before {
  742. content: "\F0DF"
  743. }
  744. .van-icon-warning:before {
  745. content: "\F0E0"
  746. }
  747. .van-icon-weapp-nav:before {
  748. content: "\F0E1"
  749. }
  750. .van-icon-wechat:before {
  751. content: "\F0E2"
  752. }
  753. .van-icon-youzan-shield:before {
  754. content: "\F0E3"
  755. }
  756. .vant-icon-index {
  757. display: -webkit-inline-flex;
  758. display: inline-flex;
  759. -webkit-align-items: center;
  760. align-items: center;
  761. -webkit-justify-content: center;
  762. justify-content: center
  763. }
  764. .van-icon--image {
  765. width: 1em;
  766. height: 1em
  767. }
  768. .van-icon__image {
  769. width: 100%;
  770. height: 100%
  771. }
  772. .van-icon__info {
  773. z-index: 1
  774. }
  775. </style>