Explorar el Código

css(work): 当字体大小大于20时宫格一行只显示3个

wangpx hace 1 año
padre
commit
1b4bd94007
Se han modificado 1 ficheros con 12 adiciones y 8 borrados
  1. 12 8
      pages/work/index.vue

+ 12 - 8
pages/work/index.vue

@@ -5,7 +5,7 @@
 		<view v-if="processList.fList.length != 0">
 			<uni-section :title="processList.ftypeList[0].typeName" titleFontSize="1.3rem" type="line"></uni-section>
 			<view class="grid-body">
-				<uni-grid :column="4" :showBorder="false" @change="changeProcessGrid">
+				<uni-grid :column="uni_grid_column" :showBorder="false" @change="changeProcessGrid">
 					<uni-grid-item v-for="(item, index) in processList.fList" :index="index" :key="index">
 						<view class="grid-item-box">
 							<text class="ygoa-icon"
@@ -18,7 +18,7 @@
 		</view>
 		<uni-section title="考勤管理" titleFontSize="1.3rem" type="line"></uni-section>
 		<view class="grid-body">
-			<uni-grid :column="4" :showBorder="false" @change="changeAttendanceGrid">
+			<uni-grid :column="uni_grid_column" :showBorder="false" @change="changeAttendanceGrid">
 				<uni-grid-item :index="1">
 					<view class="grid-item-box">
 						<text class="ygoa-icon icon-checkIn"></text>
@@ -35,7 +35,7 @@
 		</view>
 		<uni-section title="日报周报" titleFontSize="1.3rem" type="line"></uni-section>
 		<view class="grid-body">
-			<uni-grid :column="4" :showBorder="false" @change="changeDiaryGrid">
+			<uni-grid :column="uni_grid_column" :showBorder="false" @change="changeDiaryGrid">
 				<uni-grid-item :index="1">
 					<view class="grid-item-box">
 						<text class="ygoa-icon icon-diary"></text>
@@ -53,7 +53,7 @@
 
 		<uni-section title="系统工具" titleFontSize="1.3rem" type="line"></uni-section>
 		<view class="grid-body">
-			<uni-grid :column="4" :showBorder="false" @change="changeToolsGrid">
+			<uni-grid :column="uni_grid_column" :showBorder="false" @change="changeToolsGrid">
 				<uni-grid-item :index="1">
 					<view class="grid-item-box">
 						<text class="ygoa-icon icon-calculator"></text>
@@ -91,11 +91,15 @@ import { clearCache } from '@/utils/ygoa.js'
 import { onShow } from '@dcloudio/uni-app'
 const userStore = useUserStore()
 
+let sysFontSize = 0
+const uni_grid_column = ref(4)
+
 onMounted(() => {
+	sysFontSize = uni.getAppBaseInfo().fontSizeSetting
+	if (sysFontSize > 20) uni_grid_column.value = 3
 	initProcessList()
 })
 
-
 onShow(()=>{
 		uni.$emit('showTabBarBadge')
 })
@@ -181,7 +185,7 @@ function openCalculatorPopup() { // 打开计算器弹出层
 // @import "@/static/font/ygoa/iconfont.css";
 
 .ygoa-icon {
-	font-size: calc(80rpx + .5*(1rem - 16px));
+	font-size: calc(80rpx + 1.5*(1rem - 16px));
 }
 
 /* #ifndef APP-NVUE */
@@ -195,7 +199,7 @@ page {
 }
 
 view {
-	font-size: calc(14px + .5*(1rem - 16px));
+	font-size: calc(14px + 1.5*(1rem - 16px));
 	line-height: inherit;
 }
 
@@ -203,7 +207,7 @@ view {
 
 .text {
 	text-align: center;
-	font-size: calc(26rpx + .5* (1rem - 16px));// 16px
+	font-size: calc(26rpx + 1.5*(1rem - 16px));
 	margin-top: 10rpx;
 }
 .work-container {