|
|
@@ -9,7 +9,7 @@
|
|
|
:style="getTermStyle(t, tIdx)"
|
|
|
>
|
|
|
<span class="term-name">{{ t.displayName }}</span>
|
|
|
- <span class="term-date">01-05</span>
|
|
|
+ <!-- <span class="term-date">01-05</span> -->
|
|
|
</div>
|
|
|
<div v-for="(p, idx) in phenologyList" :key="`phenology-${uniqueTimestamp}-${idx}`" class="phenology-bar">
|
|
|
<div
|
|
|
@@ -31,7 +31,6 @@
|
|
|
class="arrange-card"
|
|
|
:class="[
|
|
|
getArrangeStatusClass(fw),
|
|
|
- { 'first-card': aIdx === 0 && rIdx !== 0 },
|
|
|
{ 'last-card': aIdx === r.farmWorkArrangeList.length - 1 && rIdx !== r.farmWorkArrangeList.length - 1 },
|
|
|
// 右侧农事卡片跟随物候期颜色:未来节气对应的农事卡片置灰
|
|
|
{ 'future-card': !shouldShowBlue(p) }
|
|
|
@@ -40,8 +39,11 @@
|
|
|
>
|
|
|
<div class="card-content">
|
|
|
<div class="card-left">
|
|
|
- <div class="left-date">{{ formatDate(fw.createTime) }}</div>
|
|
|
- <span>张扬 上传了作物照片</span>
|
|
|
+ <div class="left-info">
|
|
|
+ <div class="left-date">{{ formatDate(fw.createTime) }}</div>
|
|
|
+ <span class="text">上传者:无人机</span>
|
|
|
+ </div>
|
|
|
+ <div class="title-text">{{ fw.title }}</div>
|
|
|
</div>
|
|
|
<div class="card-right">
|
|
|
<img src="@/assets/img/home/farm.png" alt="">
|
|
|
@@ -377,10 +379,9 @@ const handleSeasonClick = (seasonValue) => {
|
|
|
|
|
|
// 农事状态样式映射(0:取消关注,1:关注,2:托管农事,)
|
|
|
const getArrangeStatusClass = (fw) => {
|
|
|
- const t = fw?.isFollow;
|
|
|
- // const warningStatus = shouldShowIncompleteStatus(fw.farmWorkId);
|
|
|
- if (t == 0) return "normal-style";
|
|
|
- // if (warningStatus) return "status-warning";
|
|
|
+ const t = fw?.sourceType;
|
|
|
+ if (t == 7) return "status-complete";
|
|
|
+ if (t == 8) return "status-warning";
|
|
|
// if (t >= 0 && t <= 4) return "status-normal";
|
|
|
// if (t === 5) return "status-complete";
|
|
|
return "status-normal";
|
|
|
@@ -754,7 +755,7 @@ watch(
|
|
|
}
|
|
|
.timeline-middle-line {
|
|
|
position: absolute;
|
|
|
- left: 15px; /* 位于节气文字列中间(列宽约30px) */
|
|
|
+ left: 13px; /* 位于节气文字列中间(列宽约30px) */
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
width: 2px;
|
|
|
@@ -848,11 +849,9 @@ watch(
|
|
|
position: relative;
|
|
|
padding: 8px 15px 8px 10px;
|
|
|
writing-mode: horizontal-tb;
|
|
|
- &.first-card{
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
+ margin-bottom: 10px;
|
|
|
&.last-card{
|
|
|
- margin-bottom: 10px;
|
|
|
+ // margin-bottom: 0;
|
|
|
}
|
|
|
.card-content {
|
|
|
color: #242424;
|
|
|
@@ -861,15 +860,24 @@ watch(
|
|
|
align-items: center;
|
|
|
font-size: 14px;
|
|
|
.card-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 8px;
|
|
|
- .left-date{
|
|
|
- color: #fff;
|
|
|
- background: #2199f8;
|
|
|
- padding: 1px 5px;
|
|
|
- border-radius: 2px;
|
|
|
- font-size: 12px;
|
|
|
+ .left-info{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 5px;
|
|
|
+ .left-date{
|
|
|
+ color: #fff;
|
|
|
+ background: #2199f8;
|
|
|
+ padding: 1px 5px;
|
|
|
+ border-radius: 2px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ .text{
|
|
|
+ font-size: 12px;
|
|
|
+ color: rgba(33, 153, 248, 0.5);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .title-text{
|
|
|
+ margin-top: 2px;
|
|
|
}
|
|
|
}
|
|
|
.card-right {
|
|
|
@@ -917,15 +925,35 @@ watch(
|
|
|
color: #808080;
|
|
|
}
|
|
|
.arrange-card.status-warning {
|
|
|
- border-color: #ff953d;
|
|
|
+ border-color: #F67D7D;
|
|
|
+ .card-left{
|
|
|
+ .left-date{
|
|
|
+ background: #F67D7D;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .card-right{
|
|
|
+ .num{
|
|
|
+ background: #F67D7D;
|
|
|
+ }
|
|
|
+ }
|
|
|
&::before {
|
|
|
- border-right-color: #ff953d;
|
|
|
+ border-right-color: #F67D7D;
|
|
|
}
|
|
|
}
|
|
|
.arrange-card.status-complete {
|
|
|
- border-color: #1ca900;
|
|
|
+ border-color: #52C03C;
|
|
|
+ .card-left{
|
|
|
+ .left-date{
|
|
|
+ background: #52C03C;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .card-right{
|
|
|
+ .num{
|
|
|
+ background: #52C03C;
|
|
|
+ }
|
|
|
+ }
|
|
|
&::before {
|
|
|
- border-right-color: #1ca900;
|
|
|
+ border-right-color: #52C03C;
|
|
|
}
|
|
|
}
|
|
|
.arrange-card.status-normal {
|
|
|
@@ -939,8 +967,7 @@ watch(
|
|
|
border-color: #E4E4E4;
|
|
|
.card-left{
|
|
|
.left-date{
|
|
|
- background: #E4E4E4;
|
|
|
- color: #fff;
|
|
|
+ background: #E4E4E4 !important;
|
|
|
}
|
|
|
}
|
|
|
&::before {
|
|
|
@@ -967,19 +994,12 @@ watch(
|
|
|
.term-name {
|
|
|
display: inline-block;
|
|
|
width: 100%;
|
|
|
- min-height: 35px;
|
|
|
- line-height: 30px;
|
|
|
+ min-height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
background: #fff;
|
|
|
font-size: 12px;
|
|
|
- word-break: break-all;
|
|
|
- writing-mode: vertical-rl;
|
|
|
- text-orientation: upright;
|
|
|
- text-align: center;
|
|
|
}
|
|
|
.term-date {
|
|
|
- // position: absolute;
|
|
|
- bottom: 0;
|
|
|
- left: 0;
|
|
|
font-size: 12px;
|
|
|
color: #242424;
|
|
|
}
|