Browse Source

fix:图标样式

maliang 1 day ago
parent
commit
b1061affd0
3 changed files with 68 additions and 67 deletions
  1. 68 67
      pages/inventory-task/detail.vue
  2. BIN
      static/image/bianji-icon.png
  3. BIN
      static/image/saixuan-icon.png

+ 68 - 67
pages/inventory-task/detail.vue

@@ -27,9 +27,7 @@
       </view>
       <view class="progress-box">
         <view class="progress-label-box">
-          <text class="progress-label">
-          盘点进度
-          </text>
+          <text class="progress-label"> 盘点进度 </text>
           <text class="progress-value"
             >{{ inventoryInfo.progress }}/{{ inventoryInfo.total }}</text
           >
@@ -50,7 +48,11 @@
       <view class="filter-wrap">
         <view class="filter-btn" @click="filterPopupVisible = true">
           <text>筛选</text>
-          <u-icon name="arrow-down" size="12" color="#666"></u-icon>
+          <image
+            src="@/static/image/saixuan-icon.png"
+            mode=""
+            class="icon"
+          ></image>
         </view>
       </view>
     </u-sticky>
@@ -62,7 +64,11 @@
           <view class="location-left">
             <text class="location-label">库位:</text>
             <text class="location-value">{{ item.location }}</text>
-            <u-icon name="arrow-right" size="14" color="#4080FF"></u-icon>
+            <image
+              src="@/static/image/bianji-icon.png"
+              mode=""
+              class="icon"
+            ></image>
           </view>
           <text class="category-text">{{ item.category }}</text>
         </view>
@@ -75,24 +81,24 @@
           ></image>
           <view class="goods-info">
             <text class="goods-name u-line-2">{{ item.name }}</text>
-            <view class="goods-spec half-w">
-              <text class="spec-label">规格:</text>
-              <text class="spec-value">{{ item.spec }}</text>
+            <view class="goods-field half-w">
+              <text class="field-label">规格:</text>
+              <text class="field-value">{{ item.spec }}</text>
             </view>
-            <view class="check-user half-w">
-              <text class="check-label">盘点人:</text>
-              <text class="check-value">{{ item.checkUser }}</text>
+            <view class="goods-field half-w">
+              <text class="field-label">盘点人:</text>
+              <text class="field-value">{{ item.checkUser }}</text>
             </view>
-            <view class="check-time">
-              <text class="time-label">盘点时间:</text>
-              <text class="time-value">{{ item.checkTime }}</text>
+            <view class="goods-field">
+              <text class="field-label">盘点时间:</text>
+              <text class="field-value">{{ item.checkTime }}</text>
             </view>
             <view class="stock-row">
-              <view class="stock-item half-w">
+              <view class="stock-item">
                 <text class="stock-label">系统库存</text>
                 <text class="stock-value">{{ item.systemStock }}瓶</text>
               </view>
-              <view class="stock-item half-w">
+              <view class="stock-item">
                 <text class="stock-label">已盘库存</text>
                 <text
                   class="stock-value"
@@ -107,8 +113,6 @@
           </view>
         </view>
 
-
-
         <view class="action-row">
           <u-button
             type="primary"
@@ -145,7 +149,15 @@
     />
     <actionNumPopup :show.sync="actionPop.showNumPop" />
     <categoryPopup :show.sync="actionPop.showCategoryPop" />
-		<error-pop v-model="actionPop.errorShow" isCenter cancelBtnText="取消" confirmBtnText="确定" @close="actionPop.errorShow = false" @confirm="confirm" :content="actionPop.errorText"></error-pop>
+    <error-pop
+      v-model="actionPop.errorShow"
+      isCenter
+      cancelBtnText="取消"
+      confirmBtnText="确定"
+      @close="actionPop.errorShow = false"
+      @confirm="confirm"
+      :content="actionPop.errorText"
+    ></error-pop>
   </view>
 </template>
 
@@ -153,13 +165,13 @@
 import InventoryFilterPopup from "./components/inventoryFilterPopup.vue";
 import actionNumPopup from "./components/actionNumPopup.vue";
 import categoryPopup from "./components/categoryPopup.vue";
-import errorPop from '@/components/error-pop/error-pop.vue'
+import errorPop from "@/components/error-pop/error-pop.vue";
 export default {
   components: {
     InventoryFilterPopup,
     actionNumPopup,
     errorPop,
-    categoryPopup
+    categoryPopup,
   },
   data() {
     return {
@@ -207,15 +219,15 @@ export default {
         category: "",
         location: "",
       },
-      actionPop:{
+      actionPop: {
         // 盘点数量弹框状态
         showNumPop: false,
         // 警告提示弹框状态
         errorShow: false,
-        errorText: '是否提交盘点?',
+        errorText: "是否提交盘点?",
         // 修改库位弹框状态
-        showCategoryPop: false
-      }
+        showCategoryPop: false,
+      },
     };
   },
   computed: {
@@ -318,10 +330,6 @@ export default {
   min-height: 100vh;
   background-color: #f0f6fb;
   padding-bottom: 40rpx;
-  
-  .half-w {
-    width: 50%;
-  }
 
   .nav-right {
     padding: 0 24rpx;
@@ -329,13 +337,12 @@ export default {
 
   .info-card {
     background-color: #fff;
-    border-radius: 16rpx;
-    padding: 32rpx;
+    padding: 16rpx 32rpx;
 
     .info-item {
       display: flex;
       font-size: 28rpx;
-      margin-bottom: 24rpx;
+      margin-bottom: 10rpx;
 
       .info-label {
         color: #666;
@@ -348,12 +355,11 @@ export default {
     }
 
     .progress-box {
-
-      .progress-label-box{
+      .progress-label-box {
         display: flex;
         justify-content: space-between;
       }
-      
+
       .progress-label {
         font-size: 28rpx;
         color: #666;
@@ -382,32 +388,34 @@ export default {
     .filter-btn {
       display: flex;
       align-items: center;
-      padding: 12rpx 24rpx;
       border-radius: 8rpx;
       font-size: 24rpx;
-      color: #666;
+      color: #333333;
 
-      .u-icon {
+      .icon {
         margin-left: 8rpx;
+        width: 32rpx;
+        height: 32rpx;
       }
     }
   }
 
   .goods-list {
-    padding: 0 24rpx;
+    width: 710rpx;
+    margin: 0 20rpx;
+    border-radius: 16rpx;
 
     .goods-item {
       background-color: #fff;
-      border-radius: 16rpx;
-      margin-bottom: 24rpx;
       overflow: hidden;
+      border-bottom: 1px solid #f5f6f7;
 
       .location-row {
         display: flex;
-        justify-content: space-between;
         align-items: center;
         padding: 24rpx 32rpx;
-        border-bottom: 1rpx solid #f5f6f7;
+        border-bottom: 1px solid #f5f6f7;
+        gap: 40rpx;
 
         .location-left {
           display: flex;
@@ -423,6 +431,11 @@ export default {
             color: #4080ff;
             margin: 0 8rpx;
           }
+
+          .icon {
+            width: 32rpx;
+            height: 32rpx;
+          }
         }
 
         .category-text {
@@ -437,6 +450,7 @@ export default {
 
         .goods-image {
           width: 160rpx;
+          flex-basis: 160rpx;
           height: 160rpx;
           border-radius: 8rpx;
           background-color: #f5f6f7;
@@ -448,6 +462,10 @@ export default {
           flex: 1;
           margin-left: 24rpx;
 
+          .half-w {
+            width: 50%;
+          }
+
           .goods-name {
             font-size: 28rpx;
             line-height: 1.4;
@@ -455,32 +473,16 @@ export default {
             margin-bottom: 16rpx;
           }
 
-          .goods-spec {
+          .goods-field {
             font-size: 24rpx;
             color: #666;
             margin-bottom: 16rpx;
 
-            .spec-label {
+            .field-label {
               color: #999;
             }
 
-            .spec-value {
-              color: #666;
-            }
-          }
-
-          .check-user,
-          .check-time {
-            font-size: 24rpx;
-            margin-bottom: 16rpx;
-
-            .check-label,
-            .time-label {
-              color: #999;
-            }
-
-            .check-value,
-            .time-value {
+            .field-value {
               color: #666;
             }
           }
@@ -488,12 +490,11 @@ export default {
       }
 
       .stock-row {
-        display: flex;
-        padding: 24rpx;
-        
-        gap: 48rpx;
+        display: grid;
+        grid-template-columns: 50% 50%;
         width: 100%;
-        background-color: #F6F8FA;
+        padding: 24rpx;
+        background-color: #f6f8fa;
         border-radius: 8rpx;
 
         .stock-item {

BIN
static/image/bianji-icon.png


BIN
static/image/saixuan-icon.png