index.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. <template>
  2. <view class="container">
  3. <!-- 动画 -->
  4. <uni-transition ref="ani" class="dhbox" custom-class="transition" :mode-class="modeClass" :show="dhshow" :styles="styles">
  5. <img src="https://fuyu.scapp.cn/static/wxa/dh.jpg" class="dhimg">
  6. </uni-transition>
  7. <view v-show="!dhshow">
  8. <view class="page-section page-section-spacing swiper">
  9. <swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">
  10. <swiper-item v-for="(item, index) in bannerList" :key="index">
  11. <image style="width: 100%; height: 100%;" :src="item"></image>
  12. </swiper-item>
  13. </swiper>
  14. </view>
  15. <uni-notice-bar moreColor="#000" scrollable show-get-more show-icon :text="notice" more-text="更多>>" @getmore="getMore" />
  16. <!-- 党建 -->
  17. <uni-section titleFontSize="16px" class="mb-10 sectionBox" title="党建引领" type="line">
  18. <view class="card" v-for="(item, index) in construct" :key="index" :border="false" @click="illnessBtn(item)">
  19. <image style="width: 50%; height: 55px; margin: 0 auto; display: block;" :src="item.url"></image>
  20. <text class="title">{{ item.title }}</text>
  21. </view>
  22. </uni-section>
  23. <!-- 治理 -->
  24. <uni-section titleFontSize="16px" class="mb-10 sectionBox" title="精细治理" type="line">
  25. <view class="card" v-for="(item, index) in govern" :key="index" :border="false" @click="illnessBtn(item)">
  26. <image style="width: 50%; height: 55px; margin: 0 auto; display: block;" :src="item.url"></image>
  27. <text class="title">{{ item.title }}</text>
  28. </view>
  29. </uni-section>
  30. <!-- 疫情 -->
  31. <uni-section titleFontSize="16px" class="mb-10 sectionBox" title="疫情防控" type="line">
  32. <view class="card" v-for="(item, index) in list" :key="index" :border="false" @click="illnessBtn(item)">
  33. <image style="width: 50%; height: 55px; margin: 0 auto; display: block;" :src="item.url"></image>
  34. <text class="title">{{ item.title }}</text>
  35. </view>
  36. </uni-section>
  37. </view>
  38. </view>
  39. </template>
  40. <script>
  41. import request from '../../api/system.js';
  42. import requestLogin from '../../api/login.js';
  43. const appid = uni.getAccountInfoSync().miniProgram.appId;
  44. export default {
  45. data() {
  46. return {
  47. styles: {
  48. width: '100vw',
  49. height: '100vh',
  50. },
  51. modeClass: ['fade', 'zoom-in'],
  52. dhshow: true,
  53. list: [],
  54. policyList: [],
  55. notice: '通知公告',
  56. autoplay: true,
  57. interval: 3000,
  58. duration: 500,
  59. indicatorDots: false,
  60. bannerList: [],
  61. govern: [],
  62. construct: []
  63. }
  64. },
  65. async mounted() {
  66. wx.hideTabBar();
  67. setTimeout(() => {
  68. this.dhshow = !this.dhshow;
  69. wx.showTabBar();
  70. }, 3000)
  71. const config = await requestLogin.getJson();
  72. const { list, bannerList, governList, construct } = config.data;
  73. this.list = list;
  74. this.bannerList = bannerList;
  75. this.govern = governList;
  76. this.construct = construct;
  77. const _this = this;
  78. wx.login({
  79. success: async ({ code }) => {
  80. const res = await requestLogin.login({ code, appId: appid });
  81. if (res && res.code == 200) {
  82. uni.setStorageSync('token', res.data.token);
  83. uni.setStorageSync('userinfo', res.data.user);
  84. uni.setStorageSync('role', res.data.role);
  85. const notice = await request.getSystemNoticeNew();
  86. _this.notice = notice.data?.noticeTitle;
  87. }
  88. }
  89. })
  90. },
  91. methods: {
  92. morBtn() {
  93. uni.switchTab({ url: '/pages/policy/index' });
  94. },
  95. illnessBtn(e) {
  96. const role = uni.getStorageSync('role');
  97. console.log(role, 'role')
  98. if (e.isUser && role && role == 'guest') {
  99. uni.navigateTo({
  100. url: `/pages/register/index?path=${e.path}`
  101. })
  102. return;
  103. }
  104. if (!e.path) {
  105. uni.showToast({
  106. title: '敬请期待',
  107. icon: 'error',
  108. duration: 2000,
  109. });
  110. return;
  111. }
  112. uni.navigateTo({ url: e.path });
  113. },
  114. policyBtn(e) {
  115. uni.navigateTo({ url: e.path });
  116. },
  117. // 查看更多
  118. getMore() {
  119. uni.navigateTo({ url: `/pages/notice/index` });
  120. }
  121. },
  122. onShow:function(){
  123. uni.removeStorageSync('policyItem')
  124. }
  125. }
  126. </script>
  127. <style>
  128. .container {
  129. background: #fff;
  130. }
  131. .swiper {
  132. height: 45vw;
  133. overflow: hidden;
  134. }
  135. .uni-section-content {
  136. display: flex;
  137. flex-wrap: wrap;
  138. }
  139. .card {
  140. margin: 10px;
  141. width: 29%;
  142. margin-right: 1%;
  143. }
  144. .card2 {
  145. width: 29%;
  146. margin-right: 1%;
  147. }
  148. .cover {
  149. display: block;
  150. width: 40px;
  151. height: 40px;
  152. margin: 5px auto;
  153. }
  154. .sectionBox {
  155. margin-bottom: 10px;
  156. display: block;
  157. }
  158. .sectionBox .uni-section-content {
  159. display: flex;
  160. }
  161. .uni-section__content-title {
  162. font-weight: 600;
  163. }
  164. .uni-card {
  165. padding: 0 !important;
  166. margin: 0 !important;
  167. }
  168. .uni-card__content {
  169. /* padding: 0 !important; */
  170. }
  171. h2 {
  172. font-weight: 700;
  173. width: 100%;
  174. text-align: center;
  175. font-size: 16px;
  176. }
  177. .title {
  178. display: block;
  179. margin: 0 auto;
  180. width: 100%;
  181. text-align: center;
  182. font-size: 14px;
  183. }
  184. .cardText {
  185. display: block;
  186. width: 100%;
  187. text-align: center;
  188. font-size: 12px;
  189. margin-bottom: 5px;
  190. color: #999;
  191. }
  192. .dhbox {
  193. position: fixed;
  194. z-index: 999;
  195. width: 100vw;
  196. height: 100vh;
  197. }
  198. .dhimg {
  199. width: 100%;
  200. height: 100%;
  201. display: block;
  202. }
  203. </style>