mzdaIndex.htm 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>mzdagl</title>
  6. <style>
  7. p{
  8. font-size: 0.24rem;
  9. }
  10. #modal-1 p{
  11. color: #fff;
  12. font-size: 0.3rem;
  13. margin-left: 0.1rem;
  14. }
  15. ul.mui-table-view{
  16. color: #4e7891;
  17. background: #D7DFEA;
  18. }
  19. .mui-table-view-cell{
  20. padding: 0.1rem 8px 0;
  21. }
  22. .suosou{
  23. padding: 0.12rem 0.9rem;
  24. justify-content: center !important;
  25. background: #bbcde1 !important;
  26. border-bottom: none;
  27. }
  28. .suosou input{
  29. background: #fff !important;
  30. }
  31. input[type=search]{
  32. text-align: inherit;
  33. text-indent: 0.5rem;
  34. }
  35. .glyphicon-align-left{
  36. left: 0.3rem;
  37. color: #fff;
  38. position: absolute;
  39. font-size: 0.4rem;
  40. top: 0.2rem;
  41. }
  42. .btn-group.open .dropdown-toggle{
  43. box-shadow: inset 0 3px 5px transparent !important;
  44. }
  45. .rowBox{
  46. position: relative;
  47. border-radius: 0.1rem;
  48. padding-top: 0.05rem;
  49. }
  50. .row + .row{
  51. padding: 0.05rem 0 0.1rem 0;
  52. }
  53. .row div.col-xs-2.col-sm-2.col-md-2{
  54. display: flex;
  55. color: #fff;
  56. width: 25%;
  57. }
  58. .row div.col-xs-2.col-sm-2.col-md-2:first-child{
  59. width: 22%;
  60. padding: 0 0 0 0.22rem;
  61. }
  62. .row div.col-xs-2.col-sm-2.col-md-2 + .col-xs-2.col-sm-2.col-md-2{
  63. width: 25%;
  64. padding: 0 0.1rem;
  65. }
  66. .mui-table-view-cell:last-child{
  67. padding-bottom: 0.1rem;
  68. }
  69. .row div.col-xs-2.col-sm-2.col-md-2 span{
  70. background: #D7DFEA;
  71. padding: 0.05rem 0.1rem;
  72. border-radius: 4px
  73. }
  74. .jrBtn{
  75. z-index: 1;
  76. position: absolute;
  77. top: 50%;
  78. right: 0;
  79. transform: translate(-50% , -50%);
  80. -webkit-transform: translate(-50% , -50%);
  81. -o-transform: translate(-50% , -50%);
  82. -moz-transform: translate(-50% , -50%);
  83. width: 0.5rem;height: 0.5rem;
  84. background: #bbcde1 url(views/haifmv/img/more.png);background-size: 560%;background-repeat: no-repeat;background-position-x: -1.28rem;background-position-y: -0.98rem;border-radius: 100%;
  85. }
  86. .mui-table-view-cell {
  87. border-radius: 0 0;
  88. }
  89. .mui-table-view-cell.mui-active {
  90. background: #D7DFEA;
  91. }
  92. #modal-1 .swiper-slide li:nth-child(odd){
  93. background: #CFDDE8;
  94. }
  95. #modal-1 .swiper-slide li:nth-child(even){
  96. background: #B9CEDF;
  97. }
  98. #modal-1 .titlesb li span.xzdqzt{
  99. background: url(views/haifmv/img/sjrl/xz/zt.png);
  100. background-size: 600%;
  101. background-position-x: -1.15rem;
  102. background-position-y: -1.36rem;
  103. }
  104. #modal-1 .titlesb li span.xzslh{
  105. background: url(views/haifmv/img/sjrl/xz/sl.png);
  106. background-size: 450%;
  107. background-position-x: -4.3rem;
  108. background-position-y: -3.54rem;
  109. }
  110. #modal-1 .titlesb .mui-icon-checkmarkempty {
  111. font-size: 1rem;
  112. }
  113. </style>
  114. <script type="text/javascript" src="views/haifmv/sjrl/da/mzda/mzdaIndex.js"></script>
  115. </head>
  116. <body>
  117. <input type="hidden" value="mzwd" id="ct" />
  118. <input type="hidden" value="$!ztsl" id="ztsl" />
  119. <input type="hidden" value="$!maxPages" id="maxPages" />
  120. <input type="hidden" value="$!page" id="page" />
  121. <div id="wrap">
  122. <header>
  123. <span class="glyphicon glyphicon-chevron-left" aria-hidden="true" onclick="backUrl();"></span>
  124. <p>母猪档案</p>
  125. <span class="glyphicon glyphicon-plus" aria-hidden="true" onclick="addMzda();"></span>
  126. </header>
  127. <div class="suosou">
  128. <div class="change" style="left: 0.2rem;"><i class="icon iconfont">&#xe654;</i></div>
  129. <div class="sskuang">
  130. <input type="search" id="dweb" value="$!dweb" placeholder="请输入耳牌号" onkeyup="this.value=value.replace(/[^\w]/g,'')"/>
  131. <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
  132. </div>
  133. <div class="btn-group" style="background: transparent; position: absolute;right: 1.1rem;top: 0.18rem;">
  134. <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="width: 100%;background: #F4F4F9;color: #4d778f;padding: 0.05rem 0.1rem;border-radius: 50%;margin-top: 0;font-size: 0.25rem;">
  135. <span class="glyphicon glyphicon-menu-down"></span>
  136. </button>
  137. </div>
  138. <div class="change changeBg2" style="right: 0.2rem;transform: rotateY(180deg);"><i class="icon iconfont">&#xe654;</i></div>
  139. </div>
  140. <div class="middle">
  141. <section class="mzdaIscroll">
  142. <div>
  143. <ul class="mui-table-view">
  144. #foreach($obj in $!mzdaList)
  145. <li class="mui-table-view-cell xqck" data-sl="$!obj.sl" data-dqzt="$!obj.dqzt" data-for="$!obj.id" data-dweb = "$!obj.dweb">
  146. <div class="rowBox container-fluid">
  147. <div class="row">
  148. <div class="col-xs-12 col-sm-12 col-md-12 discenter"><p>$!obj.eph</p></div>
  149. </div>
  150. <div class="row">
  151. <div class="col-xs-2 col-sm-2 col-md-2 discenter"><span>$!obj.pzStr</span></div>
  152. <div class="col-xs-2 col-sm-2 col-md-2 discenter"><span>$!obj.dqztStr</span></div>
  153. </div>
  154. <span class="jrBtn"></span>
  155. </div>
  156. </li>
  157. #end
  158. </ul>
  159. <div id="pullUp" class="">
  160. <div class="pullUpLabel">上拉加载更多</div>
  161. </div>
  162. </div>
  163. </section>
  164. </div>
  165. <!--当前状态弹出框-->
  166. <div class="md-modal md-effect-1" id="modal-1" style="z-index: 1220;">
  167. <div class="md-content">
  168. <ul class="title align-itemscenter titlesb">
  169. <li class="align-itemscenter tabText1">
  170. <span class="xzdqzt"></span>
  171. <p>当前状态</p>
  172. </li>
  173. <li class="align-itemscenter tabText2" style="display: none;">
  174. <span class="xzslh"></span>
  175. <p>舍栏</p>
  176. </li>
  177. <li class="align-itemscenter">
  178. <span class="mui-icon mui-icon-checkmarkempty"></span>
  179. </li>
  180. </ul>
  181. <div class="swiper-container" style="border-radius: 0 0 0.25rem 0.25rem;">
  182. <div class="swiper-wrapper">
  183. <div class="swiper-slide">
  184. <ul class="mui-table-view">
  185. #set($count = 0)
  186. #foreach($!obj in $!dqztList)
  187. #if($count % 2 == 0)
  188. <li class="mui-table-view-cell discenter">
  189. #end
  190. <div class="col-xs-6 col-sm-6 col-md-6 discenter">
  191. <div class="mui-input-row mui-checkbox mui-left">
  192. <label class="jd">$!obj.dmmc</label>
  193. <input name="dqztCheck" id="$!obj.dmid" data-for="$!obj.dmid" value="$!obj.dmid" type="checkbox">
  194. </div>
  195. </div>
  196. #if($count % 2 == 1)
  197. </li>
  198. #end
  199. #set($count = $count + 1)
  200. #end
  201. </ul>
  202. </div>
  203. <div class="swiper-slide">
  204. <ul class="mui-table-view">
  205. #set($count = 0)
  206. #foreach($!obj in $!slList)
  207. #if($count % 2 == 0)
  208. <li class="mui-table-view-cell discenter">
  209. #end
  210. <div class="col-xs-6 col-sm-6 col-md-6 discenter">
  211. <div class="mui-input-row mui-checkbox mui-left">
  212. <label class="jd">$!obj.dmmc</label>
  213. <input name="slCheck" id="$!obj.dmid" data-for="$!obj.dmid" value="$!obj.dmid" type="checkbox">
  214. </div>
  215. </div>
  216. #if($count % 2 == 1)
  217. </li>
  218. #end
  219. #set($count = $count + 1)
  220. #end
  221. </ul>
  222. </div>
  223. </div>
  224. <div class="swiper-button-prev"></div>
  225. <div class="swiper-button-next"></div>
  226. <div class="swiper-scrollbar"></div>
  227. </div>
  228. </div>
  229. </div>
  230. </div>
  231. </body>
  232. </html>