ressList_body.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. <!DOCTYPE html>
  2. <html class="">
  3. <!--STATUS OK-->
  4. <head>
  5. <meta name="referrer" content="always" />
  6. <meta charset='utf-8' />
  7. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  8. <meta http-equiv="x-dns-prefetch-control" content="on">
  9. <meta name="description" content="">
  10. <meta name="format-detection" content="telephone=no" />
  11. <link rel="stylesheet" type="text/css" href="css/vant-ui.css" />
  12. <link rel="stylesheet" type="text/css" href="css/iconfont.css">
  13. <link rel="stylesheet" type="text/css" href="css/main.css" />
  14. <script src="js/vue.js"></script>
  15. <script src="js/vant-ui.js"></script>
  16. <script src="js/main.js"></script>
  17. <title></title>
  18. </head>
  19. <style>
  20. .ress-body {
  21. display: flex;
  22. justify-content: center;
  23. }
  24. .ress-card {
  25. width: 7rem;
  26. background: rgba(255, 255, 255, 1);
  27. box-shadow: 0px 14px 8px 2px rgba(73, 87, 238, 0.08);
  28. opacity: 0.95;
  29. border-radius: .2rem;
  30. display: flex;
  31. flex-direction: row;
  32. justify-content: space-between;
  33. align-items: center;
  34. color: #0096DF;
  35. }
  36. .ress-info {
  37. display: flex;
  38. flex-direction: column;
  39. padding: .2rem 0 .2rem .2rem;
  40. }
  41. .ress-info-top {
  42. display: flex;
  43. align-items: center;
  44. }
  45. .ress-info-name {
  46. font-size: .4rem;
  47. width: 1.2rem;
  48. }
  49. .ress-info-tel {
  50. font-size: .3rem;
  51. padding-top: .1rem
  52. }
  53. .ress-adress {
  54. font-size: .3rem;
  55. width: 5rem;
  56. }
  57. .ress-edit {
  58. font-size: .3rem;
  59. padding: .1rem .4rem;
  60. border-left: 1px solid rgba(0, 147, 220, 1);
  61. }
  62. </style>
  63. <style scoped>
  64. .login {
  65. padding-top: .3rem !important
  66. }
  67. </style>
  68. <body>
  69. <div id="app">
  70. <div class="login">
  71. <div class="ress-body">
  72. <div class="ress-card">
  73. <div class="ress-info">
  74. <div class="ress-info-top">
  75. <div class="ress-info-name">
  76. 张三
  77. </div>
  78. <div class="ress-info-tel">
  79. 13434136446
  80. </div>
  81. </div>
  82. <div class="ress-adress">
  83. 山东省 青岛市 市北区 某某路街道 某某小区几号楼几单元
  84. </div>
  85. </div>
  86. <div class="ress-edit" v-on:click="openWin('addressList')">
  87. 编辑
  88. </div>
  89. </div>
  90. </div>
  91. </div>
  92. </div>
  93. </body>
  94. <script type="text/javascript" src="../script/api.js"></script>
  95. <script type="text/javascript" src="../script/httpRequest.js"></script>
  96. <script type="text/javascript" src="../script/vue_plugins.js"></script>
  97. <script>
  98. new Vue({
  99. el: '#app',
  100. data: {
  101. current: 1,
  102. size: 10
  103. },
  104. mounted: function() {
  105. this.userId = $api.getStorage('loginid');
  106. this.getAddlist();
  107. },
  108. methods: {
  109. openWin: function(src) {
  110. this.goWin(src, src + '_win.html', '');
  111. },
  112. getAddlist: function() {
  113. var _this = this,
  114. data = {
  115. userLonginId: this.userId,
  116. current: current,
  117. size: size
  118. }
  119. this.$post("getAddress", data, function(ret) {
  120. if (ret.code == 0) {
  121. }
  122. });
  123. },
  124. },
  125. })
  126. </script>
  127. </html>