日历中进入今日查核页面样式问题修改

pages/calendar/calendar.vue

@@ -93,19 +93,19 @@ export default {
       this.isInitWs = websocket.ws ? false : true;
       this.init(this.isInitWs);
     }, 3 * 60 * 1000);
-	this.messStatus();
+    this.messStatus();
   },
   beforeDestroy() {
     // 关闭ws连接
     websocket.close();
     clearInterval(this.refTimer);
   },
-  watch:{
-	  "$route":{
-		  handler(route){
-			  this.messStatus();
-		  }
-	  }
+  watch: {
+    $route: {
+      handler(route) {
+        this.messStatus();
+      },
+    },
   },
   methods: {
     getCanList() {
@@ -182,33 +182,35 @@ export default {
         });
       }
     },
-	messStatus(){
-		let num = 1;
-		let timer = setInterval(()=>{
-		  this.$store.dispatch({
-			  type: "calendar/commActions",
-			  payload: {
-				key: "messagesList",
-				data: {
-				  pageNum: num,
-				  pageSize: 100,
-				},
-			  },
-			}).then((res)=>{
-				if(res && res.list.length == 0){
-					clearInterval(timer)
-				}else if(res && res.list.length != 0){
-					res.list.map((item)=>{
-						if(!item.readStatus){
-							this.messageType = true;
-							return;
-						}
-					})
-				}
-			})
-		  num++;
-		},100)
-	}
+    messStatus() {
+      let num = 1;
+      let timer = setInterval(() => {
+        this.$store
+          .dispatch({
+            type: "calendar/commActions",
+            payload: {
+              key: "messagesList",
+              data: {
+                pageNum: num,
+                pageSize: 100,
+              },
+            },
+          })
+          .then((res) => {
+            if (res && res.list.length == 0) {
+              clearInterval(timer);
+            } else if (res && res.list.length != 0) {
+              res.list.map((item) => {
+                if (!item.readStatus) {
+                  this.messageType = true;
+                  return;
+                }
+              });
+            }
+          });
+        num++;
+      }, 100);
+    },
   },
 };
 </script>
@@ -250,17 +252,20 @@ export default {
     font-size: 20rpx;
     color: #666e80;
     line-height: 55rpx;
+    border-bottom: 1.25rpx solid #f5f6fa;
   }
   .calendarCon {
-    margin-right: 1.25rpx;
-    margin-top: 1.25rpx;
+    // margin-right: 1.25rpx;
+    // margin-top: 1.25rpx;
     height: 168.75rpx;
     background-color: #fff;
     float: left;
-    width: 14.1%;
+    width: 14.2857%;
     text-align: center;
     font-size: 35rpx;
     color: #292c33;
+    border-right: 1.25rpx solid #f5f6fa;
+    border-bottom: 1.25rpx solid #f5f6fa;
     .date {
       margin: 16.25rpx auto 6.25rpx;
       height: 52.5rpx;

pages/todayCheck/todayCheck.vue

@@ -1,191 +1,222 @@
 <template>
-	<view class="todayCheckPage">
-		<view class="content" v-for="item in list">
-			<view class="contTitle">
-				<text class="contTitleLeft">{{item.situationName}}</text>
-				<text class="contTitleRight">{{item.checkPlan}}</text>
-			</view>
-			<view class="contCon">
-				<view v-for="items in item.planDepListReps" class="conEveryCon" @click="goToPonitDetails(items)">
-					<view class="title">
-						<view class="name">{{items.deptName}}</view>	
-						<view class="buMen">
-							<image src="../../static/icon-map-dis.png" mode="" class="img"></image>
-							<view class="keshi">{{items.deptClassName}}</view>
-						</view>
-					</view>
-					<view class="status" >
-						<image :src="items.completeDes == '完成'?'../../static/top-img.png':items.completeDes == '查核中'?'../../static/hight-bg.png':'../../static/disabled-bg.png'" mode="" class="bgImg"></image>
-						<text class="statusType">{{items.completeDes}}</text>
-					</view>
-					<view class="points">{{items.decs}}</view>
-					<view class="pointsGK">要点概括：{{items.checkPointNames}}</view>
-					<view>
-						<view class="checkName">{{items.empName}}</view>
-						<view class="checkTime">{{items.startDate}}~{{items.endDate}}</view>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="todayCheckPage">
+    <view class="content" v-for="item in list">
+      <view class="contTitle">
+        <text class="contTitleLeft">{{ item.situationName }}</text>
+        <text class="contTitleRight">{{ item.checkPlan }}</text>
+      </view>
+      <view class="contCon">
+        <view
+          v-for="items in item.planDepListReps"
+          class="conEveryCon"
+          @click="goToPonitDetails(items)"
+        >
+          <view class="title">
+            <view class="name">{{ items.deptName }}</view>
+            <view class="buMen">
+              <image
+                src="../../static/icon-map-dis.png"
+                mode=""
+                class="img"
+              ></image>
+              <view class="keshi">{{ items.deptClassName }}</view>
+            </view>
+          </view>
+          <view class="status">
+            <image
+              :src="
+                items.completeDes == '已完成'
+                  ? '../../static/top-img.png'
+                  : items.completeDes == '查核中'
+                  ? '../../static/hight-bg.png'
+                  : '../../static/disabled-bg.png'
+              "
+              mode=""
+              class="bgImg"
+            ></image>
+            <text class="statusType">{{ items.completeDes }}</text>
+          </view>
+          <view class="points">{{ items.decs }}</view>
+          <view class="pointsGK">要点概括：{{ items.checkPointNames }}</view>
+          <view>
+            <view class="checkName">{{ items.empName }}</view>
+            <view class="checkTime"
+              >{{ items.startDate }}~{{ items.endDate }}</view
+            >
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-		  return {
-			  list:[],
-			  date:'',
-		  }
-		},
-		mounted() {
-			this.getList();
-			
-		},
-		methods:{
-			getList(){
-				this.$store.dispatch({
-					type: "todayCheck/commActions",
-					payload: {
-					  key: "specificCheckTaskList",
-					  data: {
-					    specificDate:this.date
-					  },
-					},
-				}).then((res)=>{
-					if(res){
-						this.list =res;
-					}
-				})
-			},
-			goToPonitDetails(data){
-				// console.log(data)
-				// uni.navigateTo({
-				//   url: `/pages/messages/messages?id=${data.checkId}`,
-				// });
-			}
-		},
-		onLoad({ date }){
-		  this.date = date;
-		},
-	}
+export default {
+  data() {
+    return {
+      list: [],
+      date: "",
+    };
+  },
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.$store
+        .dispatch({
+          type: "todayCheck/commActions",
+          payload: {
+            key: "specificCheckTaskList",
+            data: {
+              specificDate: this.date,
+            },
+          },
+        })
+        .then((res) => {
+          if (res) {
+            this.list = res;
+          }
+        });
+    },
+    goToPonitDetails(data) {
+      // console.log(data)
+      // uni.navigateTo({
+      //   url: `/pages/messages/messages?id=${data.checkId}`,
+      // });
+    },
+  },
+  onLoad({ date }) {
+    this.date = date;
+  },
+};
 </script>
 
 <style lang="less">
-	.todayCheckPage{
-		padding:0rpx 25rpx;
-		height: 100%;
-		width: 100%;
-		.content{
-			width: 100%;
-			.contTitle{
-				font-size: 22.5rpx;
-				color: #666F80;
-				height: 22.5rpx;
-				line-height: 22.5rpx;
-				margin: 25rpx 0rpx 15rpx;
-				.contTitleLeft{
-					display: inline-block;
-					width: 50%;
-					text-align: left;
-				}
-				.contTitleRight{
-					display: inline-block;
-					width: 50%;
-					text-align: right;
-				}
-			}
-			.contCon{
-				.conEveryCon{
-					margin-bottom: 25rpx;
-					padding:25rpx 25rpx 0rpx;
-					background-color: #fff;
-					height: 225rpx;
-					border-radius: 5rpx;
-					position: relative;
-					.title{
-						margin-bottom: 10rpx;
-						color: #292C33;
-						// vertical-align: top;
-						.name{
-							height: 35rpx;
-							display: inline-block;
-							font-size: 35rpx;
-							font-weight: 400;
-						}
-						.buMen{
-							margin-left: 20rpx;
-							display: inline-block;
-							// width: 117.5rpx;
-							height: 35rpx;
-							background-color: #EDF2FA;
-							border-radius: 17.5rpx;
-							line-height: 82.5rpx;
-							vertical-align: top;
-							.img{
-								vertical-align: top;
-								width: 35rpx;
-								height: 35rpx;
-							}
-							.keshi{
-								margin-left: 10rpx;
-								margin-right: 20rpx;
-								display: inline-block;
-								vertical-align: top;
-								font-size: 17.5rpx;
-								line-height: 35rpx;
-							}
-						}
-					}
-					.status{
-						width: 100rpx;
-						height: 35rpx;
-						position: absolute;
-						top: 0rpx;
-						right: 0rpx;
-						.bgImg{
-							width: 100rpx;
-							height: 35rpx;
-						}
-						.statusType{
-							position: absolute;
-							top:8.75rpx;
-							right:18.75rpx;
-							font-size: 17.5rpx;
-							line-height: 17.5rpx;
-							color: #fff;
-						}
-					}
-					.points{
-						font-size: 20rpx;
-						color: #292C33;
-						line-height: 50rpx;
-						font-weight: bold;
-					}
-					.pointsGK{
-						padding-bottom: 25rpx;
-						border-bottom: 0.62rpx solid #DADEE6;
-						font-size: 20rpx;
-						color: #666F80;
-					}
-					.checkName{
-						width: 50%;
-						display: inline-block;
-						color: #666E80;
-						text-align: left;
-						line-height: 57.5rpx;
-						font-size: 17.5rpx;
-					}
-					.checkTime{
-						width: 50%;
-						display: inline-block;
-						color: #666E80;
-						text-align: right;
-						line-height: 57.5rpx;
-						font-size: 17.5rpx;
-					}
-				}
-			}
-		}
-	}
+.todayCheckPage {
+  padding: 0rpx 25rpx;
+  height: 100%;
+  width: 100%;
+  .content {
+    width: 100%;
+    .contTitle {
+      font-size: 22.5rpx;
+      color: #666f80;
+      height: 22.5rpx;
+      line-height: 22.5rpx;
+      margin: 25rpx 0rpx 15rpx;
+      .contTitleLeft {
+        display: inline-block;
+        width: 60%;
+        text-align: left;
+      }
+      .contTitleRight {
+        display: inline-block;
+        width: 40%;
+        text-align: right;
+      }
+    }
+    .contCon {
+      .conEveryCon {
+        margin-bottom: 25rpx;
+        padding: 25rpx 25rpx 0rpx;
+        background-color: #fff;
+        height: 225rpx;
+        border-radius: 5rpx;
+        position: relative;
+        .title {
+          margin-bottom: 10rpx;
+          color: #292c33;
+          // vertical-align: top;
+          .name {
+            height: 35rpx;
+            display: inline-block;
+            font-size: 35rpx;
+            font-weight: 400;
+          }
+          .buMen {
+            margin-left: 20rpx;
+            display: inline-block;
+            // width: 117.5rpx;
+            height: 35rpx;
+            background-color: #edf2fa;
+            border-radius: 17.5rpx;
+            line-height: 82.5rpx;
+            vertical-align: top;
+            .img {
+              vertical-align: top;
+              width: 35rpx;
+              height: 35rpx;
+            }
+            .keshi {
+              margin-left: 10rpx;
+              margin-right: 20rpx;
+              display: inline-block;
+              vertical-align: top;
+              font-size: 17.5rpx;
+              line-height: 35rpx;
+            }
+          }
+        }
+        .status {
+          width: 100rpx;
+          height: 35rpx;
+          position: absolute;
+          top: 0rpx;
+          right: 0rpx;
+          .bgImg {
+            width: 100rpx;
+            height: 35rpx;
+          }
+          .statusType {
+            width: 100%;
+            position: absolute;
+            top: 8.75rpx;
+            right: 0rpx;
+            font-size: 17.5rpx;
+            line-height: 17.5rpx;
+            color: #fff;
+            text-align: center;
+          }
+        }
+        .points {
+          font-size: 20rpx;
+          color: #292c33;
+          line-height: 50rpx;
+          font-weight: bold;
+        }
+        .pointsGK {
+          padding-bottom: 25rpx;
+          border-bottom: 0.62rpx solid #dadee6;
+          font-size: 20rpx;
+          color: #666f80;
+        }
+        .checkName {
+          // padding-top: 20.62rpx;
+          // width: 22%;
+          display: inline-block;
+          color: #666e80;
+          text-align: left;
+          line-height: 17.5rpx;
+          font-size: 17.5rpx;
+          position: absolute;
+          left: 25rpx;
+          bottom: 21.25rpx;
+        }
+        .checkTime {
+          // padding-top: 20.62rpx;
+          // width: 78%;
+          display: inline-block;
+          color: #666e80;
+          text-align: right;
+          line-height: 17.5rpx;
+          font-size: 17.5rpx;
+          position: absolute;
+          right: 25rpx;
+          bottom: 21.25rpx;
+        }
+      }
+    }
+  }
+}
 </style>