猫妈狗爸伴宠师小程序前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

148 lines
5.6 KiB

  1. <template>
  2. <!-- <view>打卡</view> -->
  3. <view class="box box-size">
  4. <view class="top box-size" :style="{borderRadius:'16rpx'}">
  5. <view class="form-title">
  6. 个人准备
  7. </view>
  8. <view class="mt32 ml10">
  9. <span :style="{fontSize:'30rpx',fontWeight:'400'}">手套照片</span>
  10. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(至少1张)</span>
  11. </view>
  12. <view class="level">
  13. <view class="mt20 ml10">
  14. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  15. </image>
  16. </view>
  17. </view>
  18. <view class="mt32 ml10">
  19. <span :style="{fontSize:'30rpx',fontWeight:'400'}">鞋套照片</span>
  20. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(至少1张)</span>
  21. </view>
  22. <view class="level">
  23. <view class="mt20 ml10">
  24. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  25. </image>
  26. </view>
  27. </view>
  28. </view>
  29. <view class="top mt24 box-size" :style="{borderRadius:'16rpx'}">
  30. <view class="form-title">
  31. 宠物状态记录
  32. </view>
  33. <view class="mt32 ml10">
  34. <span :style="{fontSize:'30rpx',fontWeight:'400'}">小汪照片</span>
  35. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(至少2张)</span>
  36. </view>
  37. <view class="level">
  38. <view class="mt20 ml10 mr20">
  39. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  40. </image>
  41. </view>
  42. </view>
  43. <view class="mt32 ml10">
  44. <span :style="{fontSize:'30rpx',fontWeight:'400'}">Billion照片</span>
  45. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(至少2张)</span>
  46. </view>
  47. <view class="level">
  48. <view class="mt20 ml10 mr20">
  49. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  50. </image>
  51. </view>
  52. </view>
  53. </view>
  54. <view class="top mt24 box-size" :style="{borderRadius:'16rpx'}">
  55. <view class="form-title">
  56. 基础服务记录
  57. </view>
  58. <view class="mt32 ml10" :style="{fontSize:'30rpx',fontWeight:'400'}">粮碗前后对比 </view>
  59. <view class="level">
  60. <view class="mt20 ml10">
  61. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  62. </image>
  63. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  64. </view>
  65. <view class="mt20 ml10 ml28">
  66. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  67. </image>
  68. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  69. </view>
  70. </view>
  71. <view class="mt32 ml10" :style="{fontSize:'30rpx',fontWeight:'400'}">水碗前后对比 </view>
  72. <view class="level">
  73. <view class="mt20 ml10">
  74. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  75. </image>
  76. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  77. </view>
  78. <view class="mt20 ml10 ml28">
  79. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  80. </image>
  81. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  82. </view>
  83. </view>
  84. <view class="mt32 ml10" :style="{fontSize:'30rpx',fontWeight:'400'}">猫砂盆尿垫前后对比 </view>
  85. <view class="level">
  86. <view class="mt20 ml10">
  87. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  88. </image>
  89. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  90. </view>
  91. <view class="mt20 ml10 ml28">
  92. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  93. </image>
  94. <view class="jus-center level" :style="{color:'#999999',fontSize:'22rpx',width:'131rpx'}"></view>
  95. </view>
  96. </view>
  97. </view>
  98. <view class="top mt24 box-size" :style="{borderRadius:'16rpx'}">
  99. <view class="form-title">
  100. 定制服务记录
  101. </view>
  102. <view class="mt32 ml10">
  103. <span :style="{fontSize:'30rpx',fontWeight:'400'}">遛狗</span>
  104. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(2-3)</span>
  105. </view>
  106. <view class="level">
  107. <view class="mt20 ml10 mr20">
  108. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  109. </image>
  110. </view>
  111. </view>
  112. <view class="mt32 ml10">
  113. <span :style="{fontSize:'30rpx',fontWeight:'400'}">陪玩</span>
  114. <span :style="{fontSize:'22rpx',color:'#C7C7C7'}">(2-3)</span>
  115. </view>
  116. <view class="level">
  117. <view class="mt20 ml10 mr20">
  118. <image src="/static/images/ydd/add_photo.png" mode="" :style="{width:'131rpx',height:'131rpx'}">
  119. </image>
  120. </view>
  121. </view>
  122. </view>
  123. <view class="top mt24 box-size" :style="{borderRadius:'16rpx'}">
  124. <view class="form-title">
  125. 其他补充信息(非必填)
  126. </view>
  127. <view class="mt32 ml10" :style="{color:'#999999',fontSize:'30rpx'}">
  128. 可记录一下今日趣事宠物状况提醒事项等
  129. </view>
  130. <view class="mt24">
  131. <textarea name="" id="" cols="30" rows="10" placeholder="请输入内容"
  132. :style="{color:'#999999',fontSize:'30rpx',backgroundColor:'#F5F5F5',borderRadius:'16rpx',width:'681rpx',height:'180rpx'}"
  133. class="pd20 box-size"></textarea>
  134. </view>
  135. </view>
  136. <view class="buttom mt60 box-size">
  137. <view class="buttom-item level size-30" :style="{borderRadius:'41rpx',color:'#fff'}">
  138. 确定提交
  139. </view>
  140. </view>
  141. </view>
  142. </template>
  143. <script>
  144. </script>
  145. <style scoped lang="scss">
  146. @import"index.scss"
  147. </style>