index.vue 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. <template>
  2. <!-- 页面全局配置 -->
  3. <div class="pageconfig">
  4. <!--vuetop-->
  5. <van-tabs v-model="active" color="rgba(78, 135, 255, 1)" @change="getTabs">
  6. <van-tab title="全部" :name="`全部`"></van-tab>
  7. <van-tab title="待阅" :name="0"></van-tab>
  8. <van-tab title="已阅" :name="1"></van-tab>
  9. </van-tabs>
  10. <div class="morebox1 response">
  11. <van-list
  12. v-model="isUpLoading"
  13. :finished="upFinished"
  14. :immediate-check="false"
  15. :offset="10"
  16. finished-text="加载完成"
  17. @load="onLoadList"
  18. >
  19. <div
  20. class="morebox4 response"
  21. v-for="item in noticList"
  22. @click="toDetail(item.id)"
  23. >
  24. <div class="text5">
  25. {{ item.title }}
  26. </div>
  27. <div class="flex6 response flex justify-between">
  28. <div class="text7">
  29. 提交时间:{{ $common.transBaseDateTime(item.createTime) }}
  30. </div>
  31. <div class="text8" v-if="item.isRead == 1">已阅</div>
  32. <div class="text8" v-else style="color: rgba(226, 81, 0, 1)">
  33. 待阅
  34. </div>
  35. </div>
  36. </div>
  37. </van-list>
  38. </div>
  39. <!--vuebottom-->
  40. </div>
  41. </template>
  42. <script>
  43. import { listForApp } from '@/service/api_company.js'
  44. import { Toast } from 'vant'
  45. import { getInitialCode, getUserInfo, fetchUserAccessToken } from '@/common/js/api_lingxi'
  46. export default {
  47. data() {
  48. return {
  49. active: '',
  50. isUpLoading: false,
  51. isDownLoading: false,
  52. upFinished: false,
  53. noticList: [],
  54. search: {
  55. pageNum: 1,
  56. pageSize: '10',
  57. createdBy: 'smx_h5_userId'
  58. },
  59. appId: 'B1334087658781568',
  60. requestCode: '',
  61. userAccessToken: ''
  62. }
  63. },
  64. mounted() {
  65. // console.log('this.$route.params',this.$route.params,this.$route.params.openId)
  66. // this.search.createdBy=this.$route.params.openId
  67. // this.getList()
  68. this.getInitCode()
  69. },
  70. methods: {
  71. async getInitCode() {
  72. getInitialCode().then((res) => {
  73. // alert('getInitialCode==>' + JSON.stringify(res))
  74. this.initCode = res.data.initCode
  75. // alert('initCode==>' + this.initCode)
  76. this.handleAuthorization()
  77. })
  78. },
  79. handleAuthorization() {
  80. // // alert(this.initCode)
  81. const _this = this
  82. ls.ready(function() {
  83. ls.userAuth({
  84. appId: _this.appId // 从开放平台申请到的 appId
  85. }, function(res) {
  86. // alert('res:' + JSON.stringify(res))
  87. if (res.code === 200) {
  88. // // alert('requestCode:' + res.data.requestCode)
  89. const reqData = {
  90. requestCode: res.data.requestCode
  91. }
  92. fetchUserAccessToken(reqData).then(res => {
  93. // alert('获取用户访问令牌——:' + res)
  94. getUserInfo({ userAccessToken: res }).then((res) => {
  95. // alert('用户信息——:' + JSON.stringify(res))
  96. // alert('用户信息2——:' + res.openId)
  97. // eslint-disable-next-line standard/object-curly-even-spacing
  98. // _this.$router.push({ name: urlname, params: { openId: res.openId, realName: res.realName }})
  99. // Toast('登录成功')
  100. _this.search.createdBy = res.openId
  101. // 执行下一步
  102. _this.getList()
  103. }).catch(e => {
  104. Toast(e)
  105. })
  106. })
  107. } else if (res.code === 9005) {
  108. // 认证失败或登录失败
  109. // console.log('认证失败或登录失败')
  110. // alert('认证失败或登录失败')
  111. // 如果在此处调用ls.close()关闭页面,需要延迟0.5秒执行,否则ls.close()会无效。
  112. } else {
  113. // 其余情况
  114. // alert('userAuth error')
  115. // 如果在此处调用ls.close()关闭页面,需要延迟0.5秒执行,否则ls.close()会无效。
  116. }
  117. })
  118. })
  119. // 失败回调
  120. ls.error(function(res) {
  121. // 错误处理
  122. // alert('失败回调')
  123. })
  124. ls.config({
  125. debug: false, // 开发时建议把调试模式开启
  126. appId: this.appId, // 从开放平台申请到的 appId
  127. initCode: this.initCode // 从业务方自己后台请求到 initCode
  128. })
  129. },
  130. // ===上面是灵锡用的===========================================================================
  131. getTabs(e) {
  132. console.log(e)
  133. this.search.isRead = e == '全部' ? '' : e
  134. this.search.pageNum = 1
  135. this.isUpLoading = false
  136. this.isDownLoading = false
  137. this.upFinished = false
  138. this.noticList = []
  139. this.getList()
  140. },
  141. toDetail(id) {
  142. // alert('toDetail:' + id + '==>' + this.search.createdBy)
  143. // eslint-disable-next-line standard/object-curly-even-spacing
  144. this.$router.push({ name: 'citySafeNoticDetail', params: { openId: this.search.createdBy, id: id }})
  145. },
  146. async getList() {
  147. listForApp(this.search).then((res) => {
  148. if (res.data.rows.length) {
  149. if (this.noticList.length >= res.data.total) {
  150. this.upFinished = true
  151. } else {
  152. this.isDownLoading = false
  153. this.noticList.push(...res.data.rows)
  154. this.isUpLoading = false
  155. }
  156. } else {
  157. this.noticList = []
  158. this.isDownLoading = false
  159. this.isUpLoading = false
  160. this.upFinished = true
  161. }
  162. })
  163. },
  164. onLoadList() {
  165. this.search.pageNum++
  166. this.isDownLoading = false
  167. this.getList()
  168. }
  169. }
  170. }
  171. </script>
  172. <style lang="scss">
  173. .pageconfig {
  174. width: 100%;
  175. }
  176. /**pagedomcss**/
  177. .justify-end {
  178. justify-content: end;
  179. }
  180. .morebox1 {
  181. width: 100%;
  182. background-color: rgba(255, 255, 255, 1);
  183. margin-top: 24px;
  184. padding: 20px 0 20px 0;
  185. }
  186. .flex2 {
  187. width: 100%;
  188. align-items: flex-start;
  189. }
  190. .text3 {
  191. color: rgba(13, 47, 118, 1);
  192. padding-right: 40px;
  193. font-size: 36px;
  194. }
  195. .morebox4 {
  196. width: 100%;
  197. width: calc(100% - 64px);
  198. font-size: 34px;
  199. background-color: rgba(245, 247, 250, 1);
  200. margin: 24px 32px;
  201. padding: 24px;
  202. border-radius: 24px;
  203. box-sizing: border-box;
  204. }
  205. .text5 {
  206. color: rgba(51, 51, 51, 1);
  207. padding-bottom: 16px;
  208. border-bottom: 2px solid rgba(230, 230, 230, 1);
  209. }
  210. .flex6 {
  211. width: 100%;
  212. margin-top: 20px;
  213. align-items: center;
  214. justify-content: space-between;
  215. }
  216. .text7 {
  217. color: rgba(136, 136, 136, 1);
  218. }
  219. .text8 {
  220. color: rgba(45, 140, 240, 1);
  221. }
  222. </style>