class样式改为style样式,避免个别手机样式混乱

This commit is contained in:
zhangsir
2024-07-09 17:48:05 +08:00
parent c5e974e8aa
commit 1fb8e93169

View File

@@ -23,7 +23,7 @@
</view> </view>
<view class="table"> <view class="table">
<view class="table-container"> <view class="table-container">
<table> <table style="width: 100%;border-collapse: collapse;border: 2rpx solid #F0F6FC;">
<thead> <thead>
<tr style="background: #F0F6FC;display: flex;align-items: center;"> <tr style="background: #F0F6FC;display: flex;align-items: center;">
<th style="display: block;text-align: center;" class="first" align="center"> <th style="display: block;text-align: center;" class="first" align="center">
@@ -44,13 +44,25 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr style="display: flex;align-items: center;" v-for="item,index in preparedData" :key="index"> <tr style="display: flex;align-items: center;border: 1rpx solid #F0F6FC;" v-for="item,index in preparedData" :key="index">
<td style="display: block;text-align: center;" class="first" align="center"> <td style="display: block;text-align: center;" class="first" align="center">
<view class="text" style="width: 212rpx;border-collapse: collapse;"> <view class="text" style="width: 212rpx;border-collapse: collapse;">
{{ item.isOtherPosition == 1 ? item.positionName + '(' + item.organizationName + ')' : item.positionName }} {{ item.isOtherPosition == 1 ? item.positionName + '(' + item.organizationName + ')' : item.positionName }}
</view> </view>
</td> </td>
<td :style="{width: 158 * t.number + 'rpx'}" class="item" align="center" v-for="t,i in item.bandCodes"> <td style="width: 156rpx;
min-height: 120rpx;
text-align: center;
border: 2rpx solid #F0F6FC;
border-bottom: none;
background-color: #ffffff;
color: #333333;
font-weight: 400;
font-size: 28rpx;
border-collapse: collapse;
display: flex;
justify-content: center;
align-items: center;" :style="{width: 158 * t.number + 'rpx'}" class="item" align="center" v-for="t,i in item.bandCodes">
<image <image
v-if="(t && t.isMajorPosition) " v-if="(t && t.isMajorPosition) "
src="@/static/images/learnpath/thispath.png" src="@/static/images/learnpath/thispath.png"
@@ -238,11 +250,11 @@
/* width: 100%; */ /* width: 100%; */
overflow-x: auto; overflow-x: auto;
} }
table { /* table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
border: 2rpx solid #F0F6FC; border: 2rpx solid #F0F6FC;
} } */
/* th { /* th {
padding: 12px 20px; padding: 12px 20px;
@@ -250,7 +262,7 @@
border: 2rpx solid #F0F6FC; border: 2rpx solid #F0F6FC;
background: #F0F6FC; background: #F0F6FC;
} */ } */
/* td{ /* td{
padding: 12px 16px; padding: 12px 16px;
text-align: center; text-align: center;
border: 2rpx solid #F0F6FC; border: 2rpx solid #F0F6FC;
@@ -259,20 +271,19 @@
font-size: 28rpx; font-size: 28rpx;
} */ } */
th { /* th {
font-weight: bold; font-weight: bold;
color: #387DF7; color: #387DF7;
} } */
.first{ /* .first{
display: block; display: block;
text-align: center; text-align: center;
.text{ .text{
width: 212rpx; width: 212rpx;
border-collapse: collapse; border-collapse: collapse;
} }
} } */
.item1{ /* .item1{
/* padding: 12px 20px; */
width: 156rpx; width: 156rpx;
min-height: 100rpx; min-height: 100rpx;
text-align: center; text-align: center;
@@ -285,8 +296,8 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} } */
.item{ /* .item{
width: 156rpx; width: 156rpx;
min-height: 120rpx; min-height: 120rpx;
text-align: center; text-align: center;
@@ -300,20 +311,20 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} } */
tbody tr:nth-child(odd) { /* tbody tr:nth-child(odd) {
background-color: #ffffff; background-color: #ffffff;
} } */
tbody tr:hover { /* tbody tr:hover {
background-color: rgba(0, 0, 0, .05); background-color: rgba(0, 0, 0, .05);
} } */
image { /* image {
width: 40rpx; width: 40rpx;
height: 36rpx; height: 36rpx;
vertical-align: middle; vertical-align: middle;
} } */
} }
.headers{ .headers{