index.vue 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. <template>
  2. <view class="content" style="position: relative;">
  3. <view>
  4. <image src="/static/icon/backgroundimg.png" mode="" class="header"></image>
  5. </view>
  6. <view class="justify-content">
  7. <view class="align-items" style="position: absolute; top: 90rpx; left: 140rpx; font-size: 20pt;">
  8. 施工管理平台
  9. </view>
  10. <view class="align-items" style="position: absolute; top: 200rpx; left: 300rpx; font-size: 10pt;">
  11. 姓名:{{name}} !欢迎你登录本应用
  12. </view>
  13. <!-- <view class="align-items" style="position: absolute; top: 90rpx; left: 0;" @click="gotopage('/pages/noLogin/typeList')">
  14. <back></back>
  15. </view> -->
  16. </view>
  17. <view style="margin: 0 30rpx;">
  18. <swiper class="swiper" @change="change" autoplay="true" interval="3000">
  19. <swiper-item v-for="(item,index) in lunbo" :key="index">
  20. <view>
  21. <image :src="item.picUrl" mode=""></image>
  22. </view>
  23. </swiper-item>
  24. </swiper>
  25. </view>
  26. <!-- <view class="distance justify-content">
  27. <view class="square" @click="gotopage('/pages/cityConstrution/cityConstrution')">
  28. <image src="/static/icon/city.png" mode="" class="icon"></image>
  29. <view class="font-thirty-six">
  30. 阀管施工
  31. </view>
  32. </view>
  33. <view class="square" @click="history()">
  34. <image src="/static/icon/construction.png" mode="" class="icon"></image>
  35. <view class="font-thirty-six">
  36. 历史施工
  37. </view>
  38. </view>
  39. <view class="square" @click="gotopage('/pages/service/service')">
  40. <image src="/static/icon/service.png" mode="" class="icon"></image>
  41. <view class="font-thirty-six">
  42. 服务说明
  43. </view>
  44. </view>
  45. <view class="square" @click="gotopage('/pages/aboutme/aboutme')">
  46. <image src="/static/icon/construction.png" mode="" class="icon"></image>
  47. <view class="font-thirty-six">
  48. 关于我们
  49. </view>
  50. </view>
  51. </view>
  52. <view class="justify-content" style="margin: 50rpx 30rpx 0;"> -->
  53. <view>
  54. <view class="justify-content" >
  55. <view class="font-forty-eight text" >
  56. 公告内容
  57. </view>
  58. <view class="font-thirty-six darkgray" @click="more()" >
  59. 更多<u-icon name="arrow-right" ></u-icon>
  60. </view>
  61. </view>
  62. <view v-for="(item,index) in list" style="margin: 30rpx 0;">
  63. <u-parse class="title" :html="item.text"></u-parse>
  64. </view>
  65. <view class="notice" :key="index">
  66. <view class="row-item" style="margin: 30rpx 0;">
  67. <rich-text :nodes="oneManage.title"></rich-text>
  68. <rich-text :nodes="oneManage.time"></rich-text>
  69. <view class="font-forty">
  70. <u-parse :html="oneManage.text"></u-parse>
  71. </view>
  72. </view>
  73. </view>
  74. <!-- </view> -->
  75. </view>
  76. </view>
  77. </template>
  78. <script>
  79. import service from '@/api/index.js'
  80. export default {
  81. data() {
  82. return {
  83. list:[],
  84. oneManage:{},
  85. name:'',
  86. lunbo:[]
  87. }
  88. },
  89. onLoad() {
  90. uni.showTabBar();
  91. //this.getLunBo();
  92. this.getUserName();
  93. },
  94. onShow() {
  95. this.getOne();
  96. this.getnotice()
  97. uni.showTabBar();
  98. },
  99. methods: {
  100. getUserName(){
  101. service.getUserName().then(res=>{
  102. this.name = res.name;
  103. this.power = res.power;
  104. })
  105. },
  106. change(e) {
  107. this.current = e.detail.current;
  108. },
  109. gotopage(url){
  110. uni.navigateTo({
  111. url
  112. })
  113. },
  114. getLunBo(){
  115. service.getLunBo().then(res=>{
  116. this.lunbo = res;
  117. })
  118. },
  119. getOne()
  120. {
  121. service.getOne().then(res=>{
  122. this.oneManage= res
  123. })
  124. },
  125. getnotice(){
  126. service.getNoticeList().then(res=>{
  127. let list =[]
  128. list=res
  129. let i=res.length-1
  130. if(res.length!=0)
  131. {
  132. this.list.push(list[i])
  133. }else{
  134. this.list=res
  135. }
  136. })
  137. },
  138. more(){
  139. console.log(11111)
  140. uni.navigateTo({
  141. url:'/pages/notice/noticeList'
  142. })
  143. },
  144. history(){
  145. uni.switchTab({
  146. url:'/pages/historyConstruction/historyConstruction'
  147. })
  148. }
  149. }
  150. }
  151. </script>
  152. <style lang="scss" scoped>
  153. .header {
  154. width: 100%;
  155. height: 300rpx;
  156. }
  157. .row-item{
  158. overflow: hidden;
  159. -webkit-line-clamp: 2;
  160. text-overflow: ellipsis;
  161. display: -webkit-box;
  162. -webkit-box-orient: vertical;
  163. }
  164. .title{
  165. overflow: hidden;
  166. text-overflow: ellipsis;
  167. width: 100%;
  168. /*将对象作为弹性伸缩盒子模型显示*/
  169. display: -webkit-box;
  170. /*限制文本行数*/
  171. -webkit-line-clamp: 2;
  172. /*子元素的排列方式*/
  173. -webkit-box-orient: vertical;
  174. /*将对象作为弹性伸缩盒子模型显示*/
  175. }
  176. .swiper {
  177. position: absolute;
  178. top: 200rpx;
  179. width: 690rpx;
  180. height: 280rpx;
  181. margin: 0 30rpx;
  182. }
  183. .distance{
  184. margin: 250rpx 30rpx 0;
  185. .square{
  186. margin: 15rpx;
  187. text-align: center;
  188. .icon{
  189. width: 100rpx;
  190. height: 100rpx;
  191. }
  192. }
  193. }
  194. .notice{
  195. margin: 20rpx;
  196. padding: 20rpx;
  197. background: #FFFFFF;
  198. box-shadow: 0rpx 8rpx 17rpx 0rpx rgba(0, 0, 0, 0.04);
  199. border-radius: 10rpx;
  200. }
  201. .text{
  202. border-left: 15rpx solid #3857F3;
  203. padding-left: 20rpx;
  204. }
  205. </style>