小程序完善

components/VNavigationBar.vue

@@ -17,10 +17,13 @@
 			<view class="navigationBarTitle" :style="{ color: titleColor }">
 				{{ title }}
 			</view>
+			<view v-if="showClear" @click="clearNoReadFun" class="navigationBarIcon" :style="{ color: titleColor }">
+        <image src="@/static/images/clear.jpg" mode="" class="clear-icon"></image>
+			</view>
 		</template>
 		<view class="navigationBarBackExtra">
 			<slot name="extra">
-				</slot?>
+				</slot>
 		</view>
 	</view>
 </template>
@@ -45,6 +48,10 @@
 			leftTitle: {
 				type: Boolean,
 				default: false
+			},
+			showClear: {
+				type: Boolean,
+				default: false
 			}
 		},
 		mounted() {
@@ -77,7 +84,10 @@
 		methods: {
 			back() {
 				uni.navigateBack()
-			}
+			},
+      clearNoReadFun(){
+			  this.$emit('clearNoRead')
+      }
 		}
 	}
 </script>
@@ -108,5 +118,13 @@
 			font-size: 36rpx;
 			font-weight: bold;
 		}
+		.navigationBarIcon {
+      display: flex;
+		}
+    .clear-icon{
+      width: 40rpx;
+      height: 40rpx;
+      border-radius: 50%;
+    }
 	}
-</style>
+</style>

pages-home/home/content.vue

@@ -11,7 +11,7 @@
     <div class="body">
       <rich-text style="width: 100%" :nodes="richTextHtml | formatRichText" />
     </div>
-    <view class="fixed-button" @click="toActivity">参与<br/>活动</view>
+    <view v-if="toUrl" class="fixed-button" @click="toActivity">参与<br/>活动</view>
   </view>
 </template>
 
@@ -33,7 +33,8 @@ export default {
   },
   data() {
     return {
-      richTextHtml: ''
+      richTextHtml: '',
+      toUrl:null,
     };
   },
   onLoad(data) {
@@ -49,10 +50,9 @@ export default {
         })
         const data = res.data
         this.richTextHtml = data.content
-        // this.richTextHtml = data.content.replace(/(<img[^>]+src=")([^":]*?)(")/g, (match, p1, p2, p3) => {
+        if(data.toUrl){
-        //   return `${p1}${config.baseImageUrl}/${p2}${p3}`;
+          this.toUrl = data.toUrl
-        // });
+        }
-        // this.richTextHtml = `data:text/html;charset=utf-8,${encodeURIComponent(this.richTextHtml)}`
       }catch {}
     },
     toActivity(){

pages-home/home/home.vue

@@ -23,7 +23,7 @@
 					<text class="menu-title">{{menu.title}}</text>
 				</view>
 			</view>
-			<view class="info">
+			<view class="info" v-if="infoList.length>0" @click="gotoNotice">
 				<image class="info-icon" src="@/static/icons/homeInfo.png" mode="aspectFit"></image>
 				<view class="infoList">
 					<view v-for="(item, index) in infoList" :key="item.id" class="infoItem">
@@ -78,11 +78,11 @@
 						icon: require('@/static/icons/homeMenuIcon/menu2.png'),
 						path: '/pages/myCar/myCar'
 					},
-					{
+					// {
-						title: '活动礼包',
+					// 	title: '活动礼包',
-						icon: require('@/static/icons/homeMenuIcon/menu3.png'),
+					// 	icon: require('@/static/icons/homeMenuIcon/menu3.png'),
-						path: '/pages-home/home/active'
+					// 	path: '/pages-home/home/active'
-					},
+					// },
 					{
 						title: '操作指南',
 						icon: require('@/static/icons/homeMenuIcon/menu4.png'),
@@ -98,28 +98,6 @@
 						title: '车辆机件“焕新上岗”，武汉公交修旧创效出实招'
 					},
 				],
-				// shopList: [{
-				// 		id: 1,
-				// 		title: '顺捷汽车维修搭电救援补胎中心',
-				// 		address: '济南市历下区福瑞达历下护理院东南门旁',
-				// 		distance: '1.9km',
-				// 		image: ''
-				// 	},
-				// 	{
-				// 		id: 2,
-				// 		title: '顺捷汽车维修搭电救援补胎中心',
-				// 		address: '济南市历下区福瑞达历下护理院东南门旁',
-				// 		distance: '1.9km',
-				// 		image: ''
-				// 	},
-				// 	{
-				// 		id: 3,
-				// 		title: '顺捷汽车维修搭电救援补胎中心',
-				// 		address: '济南市历下区福瑞达历下护理院东南门旁',
-				// 		distance: '1.9km',
-				// 		image: ''
-				// 	},
-				// ]
 				shopList: [],
 				bannerList: [],
 				richTextHtml: null
@@ -128,8 +106,29 @@
 		onShow() {
 			this.getCompanyPage()
 			this.getBannerList()
+      this.getNoticeList()
 		},
 		methods: {
+      /**
+       * 查通知公告
+       */
+      async getNoticeList(){
+        const res = await request({
+          url: "/app-api/base/notice/pageList",
+          method: "get",
+          params: {
+            pageNo:1,
+            pageSize:2,
+            type:1,
+            parentServer: "weixiu",
+            server: "wx"
+          },
+          tenantIdFlag:false
+        })
+        if(res.code==200){
+          this.infoList = res.data.records
+        }
+      },
 			swiperChangeFun(e) {
 				console.log('e', e)
 				this.bannerIndex = e.detail.current
@@ -149,6 +148,14 @@
 					item.url = config.baseImageUrl + item.url
 				})
 			},
+      /**
+       * 跳转通知公告列表页
+       */
+      gotoNotice(){
+        uni.navigateTo({
+          url: '/pages-shop/notice/notice'
+        })
+      },
 			gotoShopDetail(row) {
         setJSONData("shopInfo",row)
 				// 直接把那一行的数据转发过去

pages-order/orderDetail/orderDetail.vue

@@ -83,11 +83,11 @@
               <view style="display: flex;align-items: center">
                 <view class="infoItem" style="flex: 1">
                   <text class="label">联系方式</text>
-                  <text class="value">{{ ticketInfo.userMobile }}</text>
+                  <text class="value">{{ ticketInfo.userMobile || "" }}</text>
                 </view>
                 <view class="infoItem" style="flex: 1">
                   <text class="label">生日</text>
-                  <text class="value">{{ ticketInfo.birthday }}</text>
+                  <text class="value">{{ ticketInfo.birthday || "" }}</text>
                 </view>
               </view>
             </template>
@@ -109,14 +109,14 @@
               <view v-for="item in ticketInfo.projects" :key="item.id" class="projEditItem">
                 <view class="projEditLine1">
                   <text>{{ item.itemName }}</text>
-                  <text  class="projAmount">￥{{ item.itemMoney }}</text>
+                  <text  class="projAmount" v-if="item.itemMoney">￥{{ item.itemMoney }}</text>
                 </view>
                 <view class="projBaseInfo" >
-                  <view>售价：{{ item.itemPrice }}</view>
+                  <view>售价：{{ item.itemPrice || "" }}</view>
-                  <view>数量：{{ item.itemCount }}</view>
+                  <view>数量：{{ item.itemCount || ""  }}</view>
-                  <view>单位：{{ item.itemUnit}}</view>
+<!--                  <view>单位：{{ getItemUnit(item.itemUnit) || "" }}</view>-->
-                  <view>折扣：{{ item.itemDiscount }}</view>
+                  <view>折扣：{{ item.itemDiscount || ""  }}</view>
-                  <view>金额：{{ item.itemMoney }}</view>
+                  <view>金额：{{ item.itemMoney || ""  }}</view>
                 </view>
                 <view class="projEditFoot">
                   <view class="block1">
@@ -124,7 +124,7 @@
                       <view class="editPeople">
                         <view class="editForm">
                           <text class="label">销售人员</text>
-                          <text >{{item.saleName}}
+                          <text >{{item.saleName || ""}}
                           </text>
                         </view>
                       </view>
@@ -136,7 +136,7 @@
                       <view class="editPeople">
                         <view class="editForm">
                           <text class="label">施工人员</text>
-                          <text >{{ item.repairNames }}</text>
+                          <text >{{ item.repairNames || "" }}</text>
                         </view>
                       </view>
                     </template>
@@ -146,7 +146,7 @@
             </template>
           </view>
         </view>
-        <view v-if="ticketInfo.wares && ticketInfo.wares.length > 0" class="card cardInfo projCard">
+        <view v-if="ticketInfo.partShow=='1' && ticketInfo.wares && ticketInfo.wares.length > 0" class="card cardInfo projCard">
           <view class="projTitle">维修配件 </view>
           <view class="projList">
             <template>
@@ -154,14 +154,14 @@
 
                 <view class="projEditLine1">
                   <text>{{ item.itemName }}</text>
-                  <text class="projAmount">￥{{ item.itemMoney }}</text>
+                  <text class="projAmount" v-if="item.itemMoney">￥{{ item.itemMoney }}</text>
                 </view>
                 <view class="projBaseInfo">
-                  <view>售价：{{ item.itemPrice }}</view>
+                  <view>售价：{{ item.itemPrice || ""   }}</view>
-                  <view>数量：{{ item.itemCount }}</view>
+                  <view>数量：{{ item.itemCount || ""   }}</view>
-                  <view>单位：{{ item.itemUnit}}</view>
+                  <view>单位：{{ getItemUnit(item.itemUnit) || ""  }}</view>
-                  <view>折扣：{{ item.itemDiscount }}</view>
+                  <view>折扣：{{ item.itemDiscount || ""   }}</view>
-                  <view>金额：{{ item.itemMoney }}</view>
+                  <view>金额：{{ item.itemMoney || ""   }}</view>
                 </view>
               </view>
             </template>
@@ -186,8 +186,8 @@
                       {{ item.remark }}
                     </view>
                     <view class="projImg">
-                      <image v-for="(img, imgIndex) in item.itemList" :key="imgIndex" :src="imgUrlPrex + img.image"
+                        <image v-for="(img, imgIndex) in item.itemList"  :key="imgIndex" @click="prviewImage(item.itemList,imgIndex)"  :src="imgUrlPrex + img.image"
-                             class="projImgItem"></image>
+                               class="projImgItem"></image>
                     </view>
                   </template>
                 </view>
@@ -221,7 +221,7 @@
 		data() {
 			return {
         ticketsId: null,
-        ticketInfo:{},
+        ticketInfo:null,
         carInfo: {},
         userInfo: {},
         imgUrlPrex:config.baseImageUrl,
@@ -234,6 +234,19 @@
       this.getTicketsInfo()
     },
 		methods: {
+      /**
+       * 预览图片
+       */
+      prviewImage(imgList, index) {
+        let urls = []
+        imgList.forEach(i => {
+          urls.push(this.imgUrlPrex+i.image)
+        })
+        uni.previewImage({
+          urls: urls,
+          current: index
+        });
+      },
 			gotoEvaluate() {
 				uni.navigateTo({
 					url: '/pages-order/orderDetail/evaluate'
@@ -250,6 +263,10 @@
             item.typeStr = "未知数据"
           }
           item.createTime = formatTimestamp(item.createTime)
+          let canReadImg =item.itemList.filter((img)=>{
+            return img.isOpen=='1'
+          })
+          item.itemList = canReadImg
         })
         this.ticketInfo = resultObj
       },
@@ -307,7 +324,40 @@
         })
       }
 		},
-
+    //翻译配件单位
+    getItemUnit(unitCode){
+		  if(unitCode){
+        let dictArray = getStorageWithExpiry("repair_unit");
+        if(null==dictArray || undefined==dictArray){
+          request({
+            url: '/app-api/system/dict-data/type',
+            method: 'get',
+            tenantIdFlag:false,
+            params:{type:"repair_unit"}
+          }).then((res) => {
+            console.log(res)
+            if (res.code == 200) {
+              setStorageWithExpiry("repair_unit",res.data,3600)
+              let dictObj = dictArray.find(dict => dict.value == unitCode)
+              console.log(dictObj, "dictObj")
+              if (dictObj) {
+                return dictObj.label
+              } else {
+                return  "未知数据"
+              }
+            }
+          })
+        }else{
+          let dictObj = dictArray.find(dict => dict.value == unitCode)
+          console.log(dictObj, "dictObj")
+          if (dictObj) {
+            return dictObj.label
+          } else {
+            return  "未知数据"
+          }
+        }
+      }
+    }
 	}
 </script>
 

pages-order/orderList/orderList.vue

@@ -18,8 +18,8 @@
               <view class="orderNo">
                 订单编号：{{ item.orderNo }}
               </view>
-              <text class="orderStatus" :class="['status_' + item.status]">
+              <text class="orderStatus" :class="['status_'+item.orderStatus]">
-                {{ getStatus(item.orderStatus) }}
+                {{ getStatus(item.orderStatus,item.mainStatus,item.payType) }}
               </text>
             </view>
             <view class="orderInfo">
@@ -30,16 +30,16 @@
               <image class="orderInfoIcon" src="@/static/icons/Frame27.png" mode="aspectFit"></image>
               <text class="orderInfoText">{{ item.tenantName || "蓝安-中鑫之宝" }}</text>
             </view>
-            <view class="line2">
+            <view class="line2" >
-              <view>
+              <view v-if="item.payMoney">
                 共计
                 <text class="orderAmountUnit">￥</text>
                 <text class="orderAmount">{{ item.payMoney }}</text>
               </view>
-              <text>{{ formatTimestamp(item.createTime) }}</text>
+              <text >{{ formatTimestamp(item.createTime) }}</text>
             </view>
             <view class="line3">
-             <view v-if="item.orderStatus == '0'" @click="goPay(item)" class="showOrder">支付</view>
+             <view v-if="item.orderStatus == '0' && item.payType == '01'" @click="goPay(item)" class="showOrder">支付</view>
               <view v-if="item.goodsType == '2'" @click="gotoDetail(item)" class="showOrder">查看订单</view>
               <view @click="gotoEvaluate(item)" class="evaluate" v-if="item.orderStatus === '1' && !item.commentDesc">评价订单</view>
             </view>
@@ -71,6 +71,7 @@ import request from '../../utils/request';
 import VNavigationBar from '@/components/VNavigationBar.vue'
 import tabBarVue from '@/components/tabBar/tabBar.vue'
 import drawQrcode from 'weapp-qrcode';
+import {getToken,getUserInfo} from '@/utils/auth'
 
 export default {
   components: {
@@ -82,18 +83,23 @@ export default {
       payShow: false,
       activeKey: 0,
       imageUrl: '',
-      tabList: [{
+      tabList: [
-        id: 0,
+        {
-        title: '全部订单'
+          id: 0,
-      },
+          title: '维修中'
+        },
         {
           id: 1,
-          title: '维修中'
+          title: '待支付'
         },
         {
           id: 2,
           title: '待评价'
         },
+        {
+          id: 3,
+          title: '全部订单'
+        },
       ],
       orderList: [],
       pageNo: 1,
@@ -105,8 +111,14 @@ export default {
     }
   },
   onLoad() {
-    this.orderList = []
+    if(!getToken()){
-    this.getList()
+      uni.reLaunch({
+        url: '/pages/login/login'
+      })
+    }else {
+      this.orderList = []
+      this.getList()
+    }
   },
   methods: {
     formatTimestamp(timestamp) {
@@ -153,12 +165,16 @@ export default {
       }
       switch (this.activeKey) {
         case 0:
+          //维修中
+          data.selectType = "working"
           break;
         case 1:
-          data.status = "06"
+          //待支付
+          data.selectType = "waitingPay"
           break;
         case 2:
-          data.status = '00'
+          //待评价
+          data.selectType = 'waitingComment'
           break
         default:
           break
@@ -193,15 +209,45 @@ export default {
       this.total = 0
       this.getList()
     },
-    getStatus(status) {
+    /**
-      switch (status) {
+     * 获取工单的状态
-        case '0':
+     * @param orderStatus 订单是否支付  0未支付  1已支付
-          return '待支付'
+     * @param mainStatus 工单主状态
-        case '1':
+     * @param payType 支付方式
-          return '已支付'
+     * @returns {string}
-        default:
+     */
-          break;
+    getStatus(orderStatus,mainStatus,payType) {
+      let str = "";
+      if("0"==orderStatus){
+        //未支付的情况下，返回工单的状态
+        if("04"==mainStatus){
+          //待派工
+          str = "待派工"
+        }else if("05"==mainStatus){
+          //维修中
+          str = "维修中"
+        }else if("01"==mainStatus){
+          //待结算
+          if(!payType){
+            str = "待结算"
+          }else{
+            str = "待支付"
+          }
+        }else if("06"==mainStatus){
+          //挂单/记账
+          str = "挂单/记账"
+        }else if("02"==mainStatus){
+          //已结账
+          str = "已结账"
+        }else if("03"==mainStatus){
+          //已作废
+          str = "已作废"
+        }
+      }else{
+        //已支付
+        str = "已支付"
       }
+      return str;
     },
     async goPay(data) {
       let that = this
@@ -256,10 +302,6 @@ export default {
         uni.navigateTo({
           url: '/pages-order/orderDetail/orderDetail?ticketsId=' + row.goodsId
         })
-      }else {
-        uni.navigateTo({
-          url: '/pages-order/orderDetail/orderDetail'
-        })
       }
     },
     gotoEvaluate(row) {

pages-shop/notice/notice.vue

@@ -0,0 +1,195 @@
+<template>
+  <view class="container">
+    <VNavigationBar background-color="#fff" title-color="#333" title="通知公告"></VNavigationBar>
+    <view class="body">
+      <view class="messageList">
+        <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" bindscrolltolower="onReachBottom"
+                     refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
+          <view v-for="(item, index) in messageList" :key="index" class="messageItem" @click="readNotice(item)">
+            <image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image>
+            <view class="messageContent">
+              <view class="messageTitle" >{{item.title}}</view>
+<!--              <view class="messageContent_content">{{item.templateContent}}</view>-->
+              <view class="messageContent_content" style="text-align: right">{{formatTime(item.createTime)}}</view>
+            </view>
+          </view>
+          <view style="text-align: center" v-if="messageList.length==0">
+            <image class="" src="@/static/images/nothing.png"></image>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+	import VNavigationBar from '@/components/VNavigationBar.vue'
+  import request from "@/utils/request";
+  import {formatTimestamp} from "@/utils/utils";
+  import {setJSONData} from "@/utils/auth";
+
+	export default {
+		components: {
+			VNavigationBar,
+		},
+		data() {
+			return {
+        type:"center",
+				messageList: [],
+        pageNo: 1,
+        pageSize: 15,
+        total: 0,
+        //下来刷新状态
+        isTriggered:false,
+			};
+		},
+    onLoad(){
+
+    },
+    onShow(){
+      this.getList()
+    },
+    methods:{
+		  /**
+       * 看通知公告详情
+       */
+      readNotice(item){
+        setJSONData("notice",item)
+        uni.navigateTo({
+          url: "/pages-shop/notice/noticeContent",
+        })
+      },
+      formatTime(value){
+        return formatTimestamp(value)
+      },
+      /**
+       * 上滑加载数据
+       */
+      onReachBottom() {
+        //判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
+        if (this.pageNo * this.pageSize >= this.total) {
+          uni.$u.toast('没有更多数据了')
+          return
+        }
+        //页码+1,调用获取数据的方法获取第二页数据
+        this.pageNo++
+        //此处调用自己获取数据列表的方法
+        this.getList()
+      },
+      /**
+       * 下拉刷新数据
+       */
+      onRefresherrefresh(){
+        this.isTriggered = true
+        this.pageNo = 1
+        this.total = 0
+        this.messageList = []
+        this.getList()
+      },
+      /**
+       * 分页查询
+       */
+      async getList(){
+        await request({
+          url: "/app-api/base/notice/pageList",
+          method: "GET",
+          params:{
+            pageNo:this.pageNo,
+            pageSize:this.pageSize,
+            type:1,
+            parentServer: "weixiu",
+            server: "wx"
+          },
+          tenantIdFlag:false
+        }).then((res) => {
+          //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
+          if (this.pageNo != 1) {
+            this.messageList = this.messageList.concat(res.data.records)
+          } else {
+            this.messageList = res.data.records
+          }
+          //将获取的总条数赋值
+          this.total = res.data.total
+          this.isTriggered = false
+        })
+      },
+    }
+	}
+</script>
+
+<style lang="less" scoped>
+.container {
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	.body {
+		flex: 1;
+		height: calc(100vh - env(safe-area-inset-top));
+		overflow: auto;
+	}
+	.messageList {
+		padding: 0 32rpx;
+    height: 100%;
+	}
+	.messageItem {
+		padding: 30rpx 0;
+		display: flex;
+		align-items: center;
+		column-gap: 20rpx;
+		border-bottom: 1rpx solid #EEEEEE;
+
+		.messageIcon {
+			width: 80rpx;
+			height: 80rpx;
+		}
+
+		.messageContent {
+			flex: 1;
+			width: 0;
+		}
+		.messageTitle {
+      font-weight: bold;
+			font-size: 32rpx;
+			color: #333333;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+		}
+		.messageContent_content {
+			font-weight: 500;
+			font-size: 28rpx;
+			color: #858BA0;
+
+			overflow: hidden;
+			white-space: nowrap;
+			text-overflow: ellipsis;
+		}
+  }
+  .popup-content {
+    padding: 15px;
+    height: auto;
+    margin: auto;
+    width: 80%;
+    background-color: #fff;
+  }
+  .popup-content-text {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .text {
+    color: #333;
+  }
+
+  .popup-info {
+    margin-top: 30rpx;
+    color: #fff;
+    background-color: #f2f6fc;
+  }
+
+  .info-text {
+    color: #909399;
+  }
+}
+</style>

pages-shop/notice/noticeContent.vue

@@ -0,0 +1,85 @@
+
+
+<template>
+  <view class="container">
+<!--    <web-view :src="richTextHtml"></web-view>-->
+    <VNavigationBar titleColor="rgba(0,0,0,0.9)" backgroundColor="#fff" title="通知公告详情"></VNavigationBar>
+    <div class="body">
+      <rich-text style="width: 100%" :nodes="richTextHtml | formatRichText" />
+    </div>
+  </view>
+</template>
+
+<script>
+import request from "../../utils/request";
+import config from '@/config'
+import parser from 'rich-text-parser'
+import VNavigationBar from "../../components/VNavigationBar.vue";
+import {getJSONData} from "@/utils/auth";
+
+export default {
+  name: "content",
+  components: {VNavigationBar},
+  filters: {
+    formatRichText(html) { // 控制小程序中图片大小
+      // console.log(html)
+      const nodes = parser.getRichTextJson(html)
+      return nodes.children
+    }
+  },
+  data() {
+    return {
+      richTextHtml: '',
+      toUrl:null,
+    };
+  },
+  onLoad(data) {
+    let notice = getJSONData("notice")
+    this.richTextHtml = notice.content
+  },
+  methods:{
+  }
+}
+</script>
+
+<style scoped lang="scss">
+img{
+  width: 100%;
+  height: auto;
+}
+.container {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  .body{
+    padding: 15rpx;
+    flex: 1;
+    height: 0;
+    overflow: auto;
+  }
+}
+.fixed-button {
+  position: fixed;
+  bottom: 3rem; /* 距离底部的距离 */
+  right: 2rem; /* 距离右边的距离 */
+  z-index: 1000; /* 确保按钮在其他元素之上 */
+  width: 80px; /* 按钮直径 */
+  height: 80px; /* 按钮直径 */
+  background-color: #f00; /* 按钮背景颜色 */
+  color: #fff; /* 文字颜色 */
+  border-radius: 50%; /* 圆形 */
+  display: flex; /* 使用弹性盒子布局 */
+  justify-content: center; /* 水平居中文本 */
+  align-items: center; /* 垂直居中文本 */
+  font-size: 18px; /* 字体大小 */
+  text-align: center; /* 文字水平居中 */
+  line-height: normal; /* 使用默认行高 */
+  font-family: 'Arial', sans-serif; /* 选择字体 */
+}
+
+/* 为了确保文本垂直居中并且分行 */
+.fixed-button br {
+  content: '';
+  display: block;
+}
+</style>

pages.json

@@ -145,6 +145,18 @@
 					"style": {
 						"navigationBarTitleText": ""
 					}
+				},
+				{
+					"path": "notice/notice",
+					"style": {
+						"navigationBarTitleText": ""
+					}
+				},
+				{
+					"path": "notice/noticeContent",
+					"style": {
+						"navigationBarTitleText": ""
+					}
 				}
 			]
 		},

pages/my/message.vue

@@ -1,15 +1,16 @@
 <template>
   <view class="container">
-    <VNavigationBar background-color="#fff" title-color="#333" title="消息中心"></VNavigationBar>
+    <VNavigationBar background-color="#fff" title-color="#333" title="消息中心" :showClear="showClear" @clearNoRead="clearNoReadFun"></VNavigationBar>
     <view class="body">
       <view class="messageList">
         <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" bindscrolltolower="onReachBottom"
                      refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
-          <view v-for="(item, index) in messageList" :key="index" class="messageItem">
+          <view v-for="(item, index) in messageList" :key="index" class="messageItem" @click="readNotice(item)">
             <image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image>
             <view class="messageContent">
-              <view class="messageTitle">系统通知</view>
+              <view :class="{'messageTitle':item.readStatus,'noReadTitle':!item.readStatus}" >系统通知</view>
-              <view class="messageContent_content">节日快乐！在这美好的时刻，送上我最真挚的祝福：愿你的每一天都充满阳光和欢笑，每一步都走向成功和辉煌。</view>
+              <view class="messageContent_content">{{item.templateContent}}</view>
+              <view class="messageContent_content" style="text-align: right">{{formatTime(item.createTime)}}</view>
             </view>
           </view>
           <view style="text-align: center" v-if="messageList.length==0">
@@ -18,11 +19,21 @@
         </scroll-view>
       </view>
     </view>
+    <!-- 普通弹窗 -->
+    <uni-popup ref="popup" background-color="#fff" >
+      <view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
+        <text class="text popup-content-text">{{ nowReadItem.templateContent }}</text>
+        <button class="button popup-info" @click="dialogToggle"><text
+            class="button-text info-text">知道了</text></button>
+      </view>
+    </uni-popup>
   </view>
 </template>
 
 <script>
 	import VNavigationBar from '@/components/VNavigationBar.vue'
+  import request from "@/utils/request";
+  import {formatTimestamp} from "@/utils/utils";
 
 	export default {
 		components: {
@@ -30,68 +41,123 @@
 		},
 		data() {
 			return {
-				messageList: [{}, {}],
+        type:"center",
+				messageList: [],
         pageNo: 1,
-        pageSize: 10,
+        pageSize: 15,
         total: 0,
         //下来刷新状态
         isTriggered:false,
+        //是否显示一键清空
+        showClear:true,
+        nowReadItem:{},
 			};
 		},
     onLoad(){
+
+    },
+    onShow(){
       this.getList()
     },
-    /**
+    methods:{
-     * 上滑加载数据
+		  /**
-     */
+       * 点击阅读消息
-    onReachBottom() {
+       */
-      //判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
+      async readNotice(item) {
-      if (this.pageNo * this.pageSize >= this.total) {
+        this.nowReadItem = item
-        uni.$u.toast('没有更多数据了')
+        // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
-        return
+        this.$refs.popup.open(this.type)
-      }
+        //直接请求后台已读
-      //页码+1,调用获取数据的方法获取第二页数据
+        await request({
-      this.pageNo++
+          url: "/app-api/system/notify-message/update-read",
-      //此处调用自己获取数据列表的方法
+          method: "PUT",
-      this.getList()
+          params:{ids:this.nowReadItem.id},
-    },
+          tenantIdFlag:false
-    /**
+        }).then((res) => {
-     * 下拉刷新数据
+          if(res.code==200){
-     */
+            this.onRefresherrefresh()
-    onRefresherrefresh(){
+          }
-      this.isTriggered = true
+        })
-      this.pageNo = 1
+      },
-      this.total = 0
+      /**
-      this.messageList = []
+       * 消息设置为已读
-      this.getList()
+       */
-    },
+      dialogToggle(){
-    /**
+        this.$refs.popup.close()
-     * 分页查询
+      },
-     */
+		  /**
-    async getList(){
+       * 一键清空未读消息
-      // await request({
+       */
-      //   url: "/app-api/base/notice/pageList",
+      async clearNoReadFun(){
-      //   method: "GET",
+        console.log("清空了")
-      //   params:{
+        await request({
-      //     pageNo:this.pageNo,
+          url: "/app-api/system/notify-message/update-all-read",
-      //     pageSize:this.pageSize,
+          method: "PUT",
-      //     type:3,
+          tenantIdFlag:false
-      //     parentServer:"weixiu",
+        }).then((res) => {
-      //     server:"wx"
+          if(res.code==200){
-      //   },
+            uni.showToast({
-      //   tenantIdFlag:false
+              title: '操作成功',
-      // }).then((res) => {
+              icon: 'none'
-      //   //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
+            })
-      //   if (this.pageNo != 1) {
+            setTimeout(()=>{
-      //     this.messageList = this.messageList.concat(res.data.records)
+              this.onRefresherrefresh()
-      //   } else {
+            },500)
-      //     this.messageList = res.data.records
+          }
-      //   }
+        })
-      //   //将获取的总条数赋值
+      },
-      //   this.total = res.data.total
+      formatTime(value){
-      //   this.isTriggered = false
+        return formatTimestamp(value)
-      // })
+      },
-    },
+      /**
+       * 上滑加载数据
+       */
+      onReachBottom() {
+        //判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
+        if (this.pageNo * this.pageSize >= this.total) {
+          uni.$u.toast('没有更多数据了')
+          return
+        }
+        //页码+1,调用获取数据的方法获取第二页数据
+        this.pageNo++
+        //此处调用自己获取数据列表的方法
+        this.getList()
+      },
+      /**
+       * 下拉刷新数据
+       */
+      onRefresherrefresh(){
+        this.isTriggered = true
+        this.pageNo = 1
+        this.total = 0
+        this.messageList = []
+        this.getList()
+      },
+      /**
+       * 分页查询
+       */
+      async getList(){
+        await request({
+          url: "/app-api/system/notify-message/my-page",
+          method: "GET",
+          params:{
+            pageNo:this.pageNo,
+            pageSize:this.pageSize
+          },
+          tenantIdFlag:false
+        }).then((res) => {
+          //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
+          if (this.pageNo != 1) {
+            this.messageList = this.messageList.concat(res.data.list)
+          } else {
+            this.messageList = res.data.list
+          }
+          //将获取的总条数赋值
+          this.total = res.data.total
+          this.isTriggered = false
+        })
+      },
+    }
 	}
 </script>
 
@@ -102,11 +168,12 @@
 	flex-direction: column;
 	.body {
 		flex: 1;
-		height: 0;
+		height: calc(100vh - env(safe-area-inset-top));
 		overflow: auto;
 	}
 	.messageList {
 		padding: 0 32rpx;
+    height: 100%;
 	}
 	.messageItem {
 		padding: 30rpx 0;
@@ -119,13 +186,25 @@
 			width: 80rpx;
 			height: 80rpx;
 		}
+    .noReadTitle {
+      font-weight: bold;
+      font-size: 32rpx;
+      color: #333333;
+    }
+    .noReadTitle:after{
+      content: "*";
+      color: red;
+      display: block; /* 或者其他的块级显示类型，比如 inline-block, table 等 */
+      position: absolute; /* 或者 absolute 或者 fixed，取决于你的布局需求 */
+      z-index: 1; /* 确保它在元素的上方 */
+      right: 0;
+    }
 
 		.messageContent {
 			flex: 1;
 			width: 0;
 		}
 		.messageTitle {
-			font-weight: bold;
 			font-size: 32rpx;
 			color: #333333;
 		}
@@ -138,6 +217,32 @@
 			white-space: nowrap;
 			text-overflow: ellipsis;
 		}
-	}
+  }
+  .popup-content {
+    padding: 15px;
+    height: auto;
+    margin: auto;
+    width: 80%;
+    background-color: #fff;
+  }
+  .popup-content-text {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .text {
+    color: #333;
+  }
+
+  .popup-info {
+    margin-top: 30rpx;
+    color: #fff;
+    background-color: #f2f6fc;
+  }
+
+  .info-text {
+    color: #909399;
+  }
 }
 </style>

pages/my/my.vue

@@ -43,9 +43,6 @@
 				<view @click="goToPage(item.path)" v-for="(item, index) in menuCard1" :key="item.title" class="menu-item">
 					<image class="menu-item-icon" :src="item.icon" mode="aspectFit"></image>
 					<text class="menu-item-title">{{ item.title }}</text>
-					<text class="messageNum" v-if="item.title === '消息中心'">
-						{{ '12' }}
-					</text>
 					<image class="menu-item-more" src="../../static/icons/homeInfoMore.png" mode="widthFix"></image>
 				</view>
 			</view>
@@ -54,6 +51,9 @@
 				<view @click="goToPage(item.path)" v-for="(item, index) in menuCard2" :key="item.title" class="menu-item">
 					<image class="menu-item-icon" :src="item.icon" mode="aspectFit"></image>
 					<text class="menu-item-title">{{ item.title }}</text>
+          <text class="messageNum" v-if="item.title == '消息中心' && noReadNum>0">
+            {{ noReadNum }}
+          </text>
 					<image class="menu-item-more" src="../../static/icons/homeInfoMore.png" mode="widthFix"></image>
 				</view>
 			</view>
@@ -82,6 +82,8 @@
 			  console.log("已登录")
         //直接取缓存中的用户信息
         this.customInfo = JSON.parse(getUserInfo())
+        //查未读消息数量
+        this.getNoReadNum()
       }
 		},
 		data() {
@@ -96,9 +98,10 @@
 				],
 				menuCard2: [
 					{ title: '消息中心', icon: require('@/static/icons/my-menu-icon2.png'), path: '/pages/my/message' },
-					{ title: '客服中心', icon: require('@/static/icons/my-menu-icon4.png') },
+					// { title: '客服中心', icon: require('@/static/icons/my-menu-icon4.png') },
 					{ title: '操作指南', icon: require('@/static/icons/my-menu-icon5.png'), path: "/pages/guideList/guideList" },
-				]
+				],
+        noReadNum:0
 			}
 		},
 		methods: {
@@ -112,6 +115,17 @@
 					url: '/pages/my/myEquity'
 				})
 			},
+      async getNoReadNum(){
+        await request({
+          url: "/app-api/system/notify-message/get-unread-count",
+          method: "GET",
+          tenantIdFlag:false
+        }).then((res) => {
+          if(res.code==200){
+            this.noReadNum = res.data
+          }
+        })
+      }
 		}
 	}
 </script>