newssq.vue 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <template>
  2. <view class="car">
  3. <view class="cartop">
  4. <view class="tabtop flexc">
  5. <view class="tabt" :class="tabval==ite.dictValue?'act':''" v-for="(ite,idx) in tablist" :key="idx" @click="getTabFn(ite.dictValue)">{{ite.dictLabel}}</view>
  6. </view>
  7. <view class="numbox" @click="getHdFn">
  8. 未读互动<text>{{hdcount}}</text>
  9. </view>
  10. </view>
  11. <!-- 列表 -->
  12. <view class="carlists">
  13. <car-list :datainfo="list" :wzlxList="wzlxList" :wtdt="wtdt" type='newssq' @getDetail="getDetail" @getDelFn="getDelFn" @getPut="getPut"></car-list>
  14. </view>
  15. <block v-if="checkPermi(['wuYe:news:add'])">
  16. <view style="height: 88rpx;"></view>
  17. <view class="rfbtn" @click="getAddFn" >发布</view>
  18. </block>
  19. <loading></loading>
  20. </view>
  21. </template>
  22. <script>
  23. import config from '@/config'
  24. const baseUrl = config.baseUrl
  25. import carList from "@/manage/components/car/list.vue"
  26. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  27. import {getDictionaryFn} from "@/api/system/user.js"
  28. import {newsList,newsDel,getCommentInteractionCount} from "@/api/work/manage.js"
  29. export default{
  30. components:{carList},
  31. data(){
  32. return{
  33. cxrq:"",
  34. text:'',
  35. list:[],
  36. pageSize: 10,
  37. pageNum: 1,
  38. reachflag: true,
  39. wtdt:'',
  40. tabval:'',
  41. tablist:[],
  42. wzlxList:[],
  43. hdcount:0,
  44. baseUrl:config.baseUrl
  45. }
  46. },
  47. onUnload() {
  48. uni.$off('newsList')
  49. },
  50. onLoad: function() {
  51. uni.$on('newsList',(res)=>{
  52. this.getrefreshData()
  53. })
  54. this.init()
  55. this.getCommentInteractionCount()
  56. },
  57. // 上拉触底加载更多触发事件
  58. onReachBottom() {
  59. if (this.reachflag) {
  60. this.pageNum++
  61. this.getDataFn()
  62. }
  63. },
  64. methods:{
  65. checkPermi, checkRole,
  66. getCommentInteractionCount(){
  67. var params={}
  68. getCommentInteractionCount(params).then(res=>{
  69. if(res.code==200){
  70. this.hdcount=res.data
  71. }
  72. })
  73. },
  74. init(){
  75. // 社区资讯类型
  76. getDictionaryFn('community_typ').then(res=>{
  77. if(res.code==200){
  78. if(res.data){
  79. this.tabval=res.data[0].dictValue;
  80. this.wzlxList = res.data.map(v => {
  81. return {
  82. dictLabel: v.dictLabel,
  83. dictValue: v.dictValue
  84. }
  85. })
  86. // var newArr=JSON.parse(JSON.stringify(this.tablist))
  87. // this.tablist=this.wzlxList.concat(newArr)
  88. // 判断有没有新增的权限
  89. if(checkPermi(['wuYe:news:add'])){
  90. var newArr=[{dictLabel:"已停用",dictValue:'yty'}];
  91. this.tablist=this.wzlxList.concat(newArr)
  92. }else{
  93. this.tablist=JSON.parse(JSON.stringify(this.wzlxList))
  94. }
  95. this.getDataFn()
  96. }
  97. }
  98. })
  99. },
  100. getAddFn(){
  101. this.$tab.navigateTo("/manage/pages/community/newsaddsq?tabval="+this.tabval)
  102. },
  103. getHdFn(){
  104. this.$tab.navigateTo("/mine/pages/news/index");
  105. this.hdcount=0;
  106. },
  107. getPut(id){
  108. if(checkPermi((['wuYe:news:edit']))){
  109. this.$tab.navigateTo("/manage/pages/community/newsaddsq?id="+id)
  110. }else{
  111. this.$tab.navigateTo("/manage/pages/community/newssqdetail?id="+id)
  112. }
  113. },
  114. getDetail(id){
  115. this.$tab.navigateTo("/manage/pages/community/newssqdetail?id="+id)
  116. },
  117. getrefreshData(){
  118. this.pageNum=1;
  119. this.list=[];
  120. this.reachflag=true;
  121. this.getDataFn()
  122. },
  123. getTabFn(val){
  124. this.tabval=val;
  125. this.getrefreshData()
  126. },
  127. bindDateChangea(e){
  128. var val=e.detail.value;
  129. this.cxrq=val;
  130. },
  131. getDelFn(data){
  132. var that=this;
  133. newsDel(data).then(res=>{
  134. if(res.code==200){
  135. this.$toast("删除成功");
  136. setTimeout(function(){
  137. that.getrefreshData()
  138. },1500)
  139. }
  140. })
  141. },
  142. formatRichText(html) {
  143. let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
  144. match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '').replace(/style=""/gi, '');
  145. // match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
  146. // match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
  147. return match;
  148. });
  149. newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
  150. match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, 'max-width:100%;');
  151. return match;
  152. });
  153. newContent = newContent.replace(/<br[^>]*\/>/gi, '');
  154. newContent = newContent.replace(/\<img src="/gi,
  155. '<img style="max-width:100%;height:auto;display:block;margin:10rpx auto;" src="' +this.baseUrl);
  156. return newContent;
  157. },
  158. getDataFn(){
  159. var params={
  160. pageSize:this.pageSize,
  161. pageNum: this.pageNum,
  162. }
  163. if(this.tabval=='yty'){
  164. params.status='1'
  165. }else{
  166. params.communityType=this.tabval;
  167. params.status='0'
  168. }
  169. newsList(params).then(res=>{
  170. if(res.code==200){
  171. if (res.rows.length < this.pageSize) {
  172. this.reachflag = false
  173. this.wtdt = '到底了~';
  174. } else {
  175. var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1)
  176. if (num < res.total) {
  177. this.reachflag = true
  178. this.wtdt = ''
  179. } else {
  180. this.reachflag = false
  181. this.wtdt = '到底了~';
  182. }
  183. }
  184. var newArr=JSON.parse(JSON.stringify(res.rows))
  185. newArr.forEach(ite=>{
  186. if(ite.communityContent){
  187. ite.communityContent=this.formatRichText(ite.communityContent)
  188. }
  189. ite.right=0;
  190. })
  191. if (this.pageNum == 1) {
  192. this.list = newArr;
  193. } else {
  194. this.list = this.list.concat(newArr)
  195. }
  196. }else{
  197. this.$toast(res.msg)
  198. }
  199. })
  200. },
  201. }
  202. }
  203. </script>
  204. <style>
  205. page{background: #F3F3F0;}
  206. </style>
  207. <style lang="scss" scoped>
  208. .car{padding: 148rpx 0 100rpx;}
  209. .cartop{position: fixed;left: 0;right: 0;top: 0;background-color: #ffffff;z-index: 2;
  210. .tabtop{padding:28rpx 200rpx 40rpx 0;position: relative;overflow: auto;
  211. .tabt{font-weight: 500;font-size: 32rpx;color: #666666;position: relative;line-height: 56rpx;flex: 0 0 auto;text-align: center;margin: 0 10rpx;padding: 0 20rpx;
  212. &.act{font-weight: bold;font-size: 32rpx;color: #272727;
  213. &::after{content: '';width: 40rpx;height: 10rpx;background: #0156FE;border-radius: 6rpx;position: absolute;left: 50%;margin-left: -20rpx;bottom: -10rpx;}
  214. }
  215. }
  216. }
  217. .numbox{width: 188rpx;height: 58rpx;background-color: #E6E6E6;border-radius: 29rpx 0 0 29rpx;font-weight: 500;font-size: 26rpx;color: #0156FE;display: flex;align-items: center;justify-content: center;position: absolute;right: 0;top: 28rpx;
  218. text{height: 20rpx;min-width: 20rpx;padding: 0 8rpx;box-sizing: border-box;line-height: 20rpx;margin-left: 10rpx;font-weight: bold;
  219. font-size:16rpx;color: #FCF9F1;background: #D32C26;border-radius: 5px;}
  220. }
  221. }
  222. .carlists{padding: 0 18rpx;}
  223. </style>