Browse Source

样式修改

tanxue 22 giờ trước cách đây
mục cha
commit
b1bc2c78f4

+ 52 - 14
common/styles/global/pages.scss

@@ -605,10 +605,6 @@
 		.data-check-radio-group{height: 500rpx;border:1rpx solid #f5f5f5;}
 	}
 	
-	.jz-new-btn-box{
-		padding: 20rpx 24rpx 20rpx;background-color: #f4f6fa;box-sizing: border-box;
-		.phone-green-btn{font-size: 28rpx;}
-		}
 	.uni-list .jz-list-item-box:nth-child(2){padding-top: 20rpx;}
 	.jz-list-item-box{
 		background-color: #f4f6fa!important;
@@ -650,7 +646,7 @@
 
 /*** 家政页面筛选***/
 .jiazheng-search-box{
-	width: 100%;box-sizing: border-box;padding: 20rpx 20rpx;position: relative;
+	width: 100%;box-sizing: border-box;padding: 20rpx 20rpx;position: relative;background-color: #fff;
 	display: flex;justify-content: space-between;align-items: center;border-top: 1rpx solid #f4f6fa;
 	.jiazheng-search-right{display: flex;margin-left: auto;}
 	.select-item-box{
@@ -1195,11 +1191,7 @@
 	width: 100%;height: 100vh;background-color: #f4f6fa;
 	.uni-load-more{background-color: #f4f6fa;padding-bottom: 20rpx;}
 	.uni-list--border-top,.uni-list--border-bottom{display: none!important;}
-	.kh-new-btn-box{
-		padding: 20rpx 24rpx 20rpx;background-color: #f4f6fa;box-sizing: border-box;
-		.phone-green-btn{font-size: 28rpx;}
-	}
-	.kh-scroll-view{height: calc(100vh - 398rpx - var(--status-bar-height));}
+	.kh-scroll-view{height: calc(100vh - 398rpx - var(--status-bar-height));background-color: #f4f6fa!important;}
 	.uni-list--border-top{display: none!important;}
 	.ht-list-item-box{
 		width: 100%;background-color: #f4f6fa!important;
@@ -1248,10 +1240,6 @@
 /* 客户选择页 */
 .kehu-select-list{
 	width: 100%;height: 100vh;background-color: #f4f6fa;
-	.kh-new-btn-box{
-		padding: 20rpx 24rpx 20rpx;background-color: #f4f6fa;box-sizing: border-box;
-		.phone-green-btn{font-size: 28rpx;}
-	}
 	.kh-scroll-view{height: calc(100vh - 358rpx - var(--status-bar-height));background-color: #f4f6fa!important;}
 	.uni-list--border-top,.uni-list--border-bottom{display: none!important;}
 	.uni-load-more{background-color: #f4f6fa;padding-bottom: 20rpx;}
@@ -1312,6 +1300,56 @@
 	}
 }
 
+/* 三方合同列表页 */
+.admin-sfht-list{
+	width: 100%;height: 100vh;background-color: #f4f6fa;
+	.uni-load-more{background-color: #f4f6fa;padding-bottom: 20rpx;}
+	.uni-list--border-top,.uni-list--border-bottom{display: none!important;}
+	.sfht-scroll-view{height: calc(100vh - 398rpx - var(--status-bar-height));background-color: #f4f6fa!important;}
+	.uni-list--border-top{display: none!important;}
+	.sfht-list-item-box{
+		width: 100%;background-color: #f4f6fa!important;
+		.uni-list--border{display: none!important;}
+		.uni-list-item__container{padding: 0 24rpx 20rpx;flex-direction: column;}
+	}
+	
+	.card-head-row{
+		display: flex;flex-direction: row;justify-content: flex-end;position: relative;
+		.ht-head-btn{font-size: 24rpx;width: 120rpx;padding: 0 10rpx;flex-shrink: 0;
+		line-height: 50rpx;margin: 0;}
+		.ht-head-btn + .ht-head-btn{margin-left: 16rpx;}
+		.del-btn-box{
+			width: 80rpx;height: 80rpx;position: absolute;left: -24rpx;top: -16rpx;
+			display: flex;align-items: center;justify-content: center;
+			.del-btn{width: 40rpx;height: 40rpx;display: inline-block;vertical-align: middle;margin-left: 24rpx;
+			@include ezy-no-repeat-cover;background-image: url("@/static/images/common/clear-bz-icon.svg");}
+		}
+	}
+	.sfht-card-box{
+			background-color:#e5f8f4;display: flex;flex-direction: column;
+			box-sizing: border-box;padding: 24rpx;border-radius: 16rpx;border: 1rpx solid #f0f1f5;
+		.card-body-row{
+			display: flex;flex-direction: column;justify-content: space-evenly;border: 1rpx solid #f0f1f5;
+			background-color: #fdfdfd;border-radius: 16rpx;margin-top: 24rpx;padding: 12rpx 0;
+			.body-row{display: flex;justify-content: space-between;align-items: center;padding: 12rpx 24rpx;box-sizing: border-box;}
+			.title-text{display: flex;align-items: center;}
+			.value-text{color: #666;}
+			.user-icon,.tel-icon,.idcard-icon,.date-icon,.htzt-icon{
+				width: 36rpx;height: 36rpx;@include ezy-no-repeat-cover();margin-right: 20rpx;}
+			.user-icon{background-image: url("@/static/images/common/user-green-icon.png");}
+			.tel-icon{background-image: url("@/static/images/common/tel-green-icon.png");}
+			.idcard-icon{background-image: url("@/static/images/common/zymc-icon.png");}
+			.date-icon{background-image: url("@/static/images/common/date-icon.png");}
+			.htzt-icon{background-image: url("@/static/images/common/htzt-icon.png");}
+			.status-0 { color: #ffa726; }//待签字
+			.status-1 { color: #26c6da; } //待审核
+			.status-2 { color: #666; } //生效
+			.status-3 { color: #f56c6c; } //失效
+		}
+		.card-body-row +.card-body-row{margin-top: 16rpx;}
+	}
+}
+
 /* 三方合同新增*/
 .sfht-info-page{
 	height: 100vh;background-color: #f8f9fd;display: flex;flex-direction: column;

+ 32 - 30
pages/admin/Hetong/sanfangHetong.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="admin-jiazheng-list">
+	<view class="admin-sfht-list">
 		<view class="phone-navBar-box">
 			<view @click="goUpPage" class="nav-bar-icon"></view>
 			<text class="nav-bar-title">三方合同</text>
@@ -12,7 +12,7 @@
 			</view>
 		</view>
 
-		<view class="jz-new-btn-box">
+		<view class="list-new-btn-box">
 			<button type="default" class="phone-green-btn" @click="handleAdd">新增合同</button>
 		</view>
 
@@ -36,41 +36,43 @@
 		<view>
 			<scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="data.loading"
 				:refresher-threshold="50" @scrolltolower="onScrolltolower" refresher-background="transparent"
-				@refresherrefresh="onRefresh" class="jz-scroll-view">
-				<uni-list class="admin-list-box">
-					<uni-list-item v-for="item in data.list" class="jz-list-item-box">
+				@refresherrefresh="onRefresh">
+				<uni-list class="sfht-scroll-view">
+					<uni-list-item v-for="item in data.list" class="sfht-list-item-box">
 						<template v-slot:body>
-              <view  @click="handleEditor(item)">
-                <view class="head-top">
-                  <button type="default" @click.stop="handlePreview(item)">预览</button>
-                  <button type="default">推送</button>
-                  <button type="default" @click="handleDelete(item)">删除</button>
+              <view class="sfht-card-box" >
+                <view class="card-head-row" >
+                  <view @click="handleDelete(item)" class="del-btn-box"><icon class="del-btn"></icon></view>
+                  <button type="default" class="phone-green-btn ht-head-btn">推送</button>
+                  <button type="default" class="phone-green-btn ht-head-btn" @click.stop="handlePreview(item)">预览</button>
+				  <button type="default" class="phone-white-btn ht-head-btn"
+				  	@click.stop="handleEditor(item)">编辑</button>
                 </view>
-                <view>
-                  <view>
-                    <view>家政人员名称</view>
-                    <view>{{item.realName}}</view>
+                <view class="card-body-row">
+                  <view class="body-row">
+                    <view class="title-text"><icon class="user-icon"></icon>家政人员名称</view>
+                    <view class="value-text">{{item.realName}}</view>
                   </view>
-                  <view>
-                    <view>客户名称</view>
-                    <view>{{item.khName}}</view>
+                  <view class="body-row">
+                    <view class="title-text"><icon class="idcard-icon"></icon>客户名称</view>
+                    <view class="value-text">{{item.khName}}</view>
                   </view>
                 </view>
-                <view>
-                  <view>
-                    <view>合同开始时间</view>
-                    <view>{{item.startDate}}</view>
+                <view class="card-body-row">
+                  <view class="body-row">
+                    <view class="title-text"><icon class="date-icon"></icon>合同开始时间</view>
+                    <view class="value-text">{{item.startDate}}</view>
                   </view>
-                  <view>
-                    <view>合同结束时间</view>
-                    <view>{{item.endDate}}</view>
+                  <view class="body-row">
+                    <view class="title-text"><icon class="date-icon"></icon>合同结束时间</view>
+                    <view class="value-text">{{item.endDate}}</view>
                   </view>
-                  <view>
-                    <view>合同状态</view>
-                    <view v-if="item.status== 0">待签字</view>
-                    <view v-if="item.status== 1">待审核</view>
-                    <view v-if="item.status== 2">有效</view>
-                    <view v-if="item.status== 3">失效</view>
+                  <view class="body-row">
+                    <view class="title-text"><icon class="htzt-icon"></icon>合同状态</view>
+                    <view class="status-0" v-if="item.status== 0">待签字</view>
+                    <view class="status-1" v-if="item.status== 1">待审核</view>
+                    <view class="status-2" v-if="item.status== 2">有效</view>
+                    <view class="status-3" v-if="item.status== 3">失效</view>
                   </view>
                 </view>
               </view>

+ 2 - 2
pages/admin/kehu/kehuList.vue

@@ -22,8 +22,8 @@
 		</view>
 		<scroll-view scroll-y="true" refresher-enabled="true" :refresher-triggered="data.loading"
 			:refresher-threshold="50" @scrolltolower="onScrolltolower" refresher-background="transparent"
-			@refresherrefresh="onRefresh" class="kh-scroll-view">
-			<uni-list class="admin-list-box">
+			@refresherrefresh="onRefresh">
+			<uni-list class="kh-scroll-view">
 		
 				<uni-list-item v-for="item in data.list" class="ht-list-item-box">
 					<template v-slot:body>