src/components/chartBox.vue

@@ -79,7 +79,7 @@ const handleShrink = () =>{
     width: 100%;
     height: calc(100% - 44px);
     overflow: auto;
-    padding: 4px 8px;
+    padding: 4px 0;
     box-sizing: border-box;
     .arrow{
         position: absolute;

src/views/home/components/adoptList.vue

@@ -72,11 +72,11 @@
                         <div class="center-item p-t-2 age-line" v-show="!isManySetting && !item.settingPrice">
                             <div class="age-wrap">
                                 <div class="has-age">
-                                    <div class="age">树龄：<span class="unit">5年</span></div>
+                                    <div class="age">栽种时间：<span class="unit">{{ item.time }}</span></div>
                                 </div>
                                 <div class="sort-line"></div>
                             </div>
-                            单价：<span class="unit">{{item.status === 0 ? "--" : item.price||12}}元/斤</span>
+                            树龄：<span class="unit"><span class="unit">{{item.age||12}}年</span></span>
                         </div>
                         <div class="center-item p-t-2 has-input" v-show="(isManySetting && settingType === 'price') || item.settingPrice">
                             <span class="edit-label">单价：</span>
@@ -84,16 +84,26 @@
                             <span class="unit">元/斤</span>
                         </div>
                         <div class="center-item" v-show="isManySetting && settingType !== 'age'">树龄：<span class="unit">{{item.age||5}}年</span></div>
-                        <div class="center-item" v-show="!item.settingPrice && !isManySetting && ROLE == 1">总认养斤数：<span class="unit">{{item.total||212}}斤</span></div>
-                        <div class="center-item" v-show="(isManySetting && settingType !== 'total' && ROLE == 1)">总认养斤数：<span class="unit">{{item.total||212}}斤</span></div>
+                        <div class="center-item" v-show="(isManySetting && settingType !== 'total')">栽种时间：<span class="unit">{{item.time}}</span></div>
                         
                         <div class="center-item p-t-2 has-input" v-show="(isManySetting && settingType === 'total') || item.settingPrice">
-                            <span class="edit-label">总认养斤数：</span>
-                            <el-input-number @change="settingSinglePrice" class="number-input" :controls="false" v-model="item.total" :min="0" />
-                            <span class="unit">斤</span>
+                            <span class="edit-label">栽种时间：</span>
+                            <!-- <el-input-number @change="settingSinglePrice" class="number-input" :controls="false" v-model="item.total" :min="0" /> -->
+                            <el-date-picker
+                                v-model="item.time"
+                                type="date"
+                                format="YYYY.MM.DD"
+                                style="width: 140px"
+                                value-format="YYYY.MM.DD"
+                                placeholder="栽种时间"
+                            />
                         </div>
 
-                        <div class="center-item p-t-2 progress-wrap" v-show="item.status === 1">
+                        <div class="center-item p-t-2 user-wrap" v-show="item.status === 0 && !isManySetting && !item.settingPrice">
+                            <img src="@/assets/images/foster-home/user.png" alt="">
+                            选择守护人
+                        </div>
+                        <div class="center-item p-t-2 progress-wrap" v-show="item.status === 1 && !isManySetting && !item.settingPrice">
                             守护人：
                             <span class="unit">
                                 <div class="user-item">
@@ -193,9 +203,9 @@ onMounted(() => {});
 const unifyPrice = ref(null);
 const isManySetting = ref(false);
 const settingTypeOptions = [
-    {name: "单价", value: "price"},
     {name: "树龄", value: "age"},
-    {name: "认养斤数", value: "total"},
+    {name: "品种", value: "price"},
+    {name: "栽种时间", value: "total"},
 ]
 const settingType = ref("price")
 function manySetPrice() {
@@ -229,6 +239,7 @@ function settingSinglePrice() {
 .adopt-list {
     height: 100%;
     overflow: auto;
+    // padding: 0 10px;
     &.has-btn {
         height: calc(100% - 60px);
     }
@@ -243,6 +254,8 @@ function settingSinglePrice() {
     .select-wrap {
         display: flex;
         align-items: center;
+        padding: 0 10px;
+        box-sizing: border-box;
         // ::v-deep {
         //     .el-select__wrapper {
         //         background: rgba(255, 212, 137, 0.06);
@@ -270,7 +283,7 @@ function settingSinglePrice() {
     .list-wrap {
         padding: 12px 0;
         .list-item {
-            background: rgba(255, 255, 255, 0.08);
+            background: rgba(120, 120, 120, 0.05);
             padding: 8px 10px;
             border-radius: 5px;
             .list-info {
@@ -280,17 +293,13 @@ function settingSinglePrice() {
             }
             .edit-one {
                 margin-top: 12px;
-                border-top: 1px solid #444444;
+                border-top: 1px solid rgba(0, 0, 0, 0.2);
                 &.btn-group {
                     padding: 12px 0;
                     .btn {
                         flex: 1;
                         text-align: center;
                         padding: 5px;
-                        &.cancel-btn {
-                            border-color: #363636;
-                            color: #FFFFFF;
-                        }
                     }
                 }
             }
@@ -346,6 +355,10 @@ function settingSinglePrice() {
                     font-size: 12px;
                     padding-top: 2px;
                 }
+
+                .user-wrap {
+                    color: #F0AC37;
+                }
                 
                 .progress-wrap {
                     display: flex;
@@ -427,8 +440,8 @@ function settingSinglePrice() {
         ::v-deep {
             &.el-input-number {
                 width: 80px;
-                background: rgba(255, 212, 137, 0.08);
-                border: 1px solid #ffd489;
+                background: rgba(33, 153, 248, 0.08);
+                border: 1px solid #2199F8;
                 border-radius: 5px;
             }
             .el-input__wrapper {
@@ -439,7 +452,7 @@ function settingSinglePrice() {
                 padding: 0 8px;
             }
             .el-input__inner {
-                color: #ffd489;
+                color: #2199F8;
             }
         }
     }
@@ -451,13 +464,13 @@ function settingSinglePrice() {
         bottom: 64px;
         left: 50%;
         transform: translateX(-50%);
-        color: #000000;
+        color: #FFFFFF;
         border-radius: 20px;
         font-size: 14px;
         padding: 7px 10px;
         cursor: pointer;
         border: 1px solid #fff;
-        background: linear-gradient(180deg, #ffd887, #ed9e1e);
+        background: linear-gradient(180deg, #84C9FF, #2199F8);
         width: 194px;
         box-sizing: border-box;
         text-align: center;
@@ -472,7 +485,6 @@ function settingSinglePrice() {
         display: flex;
         align-items: center;
         justify-content: end;
-        background: #232323;
         width: 100%;
         padding: 10px 12px;
         box-sizing: border-box;
@@ -482,14 +494,15 @@ function settingSinglePrice() {
             padding: 12px 36px;
             font-size: 14px;
             border-radius: 4px;
-            border: 1px solid #ffd489;
+            border: 1px solid #2199F8;
+            color: #2199F8;
         }
         .cancel-btn {
-            color: #ffd489;
+            color: #2199F8;
         }
         .edit-btn {
-            background: #ffd489;
-            color: #000000;
+            background: #2199F8;
+            color: #FFFFFF;
         }
         .btn + .btn {
             margin-left: 12px;