库位视图

liuying

2024-12-08 0e0ff265a99bae19dbf6194483704cfdb7223375

 LA24030_LuLiPackageLine_Web/src/views/main/ReportCenter/storageView/component/CountView.vue

@@ -1,45 +1,58 @@
<template>
   <div class="count">
      <div class="count_item" v-for="(item,index) in  countList" :key="index">
         <div class="square" :style="{background: setBgColor(item.type)}"></div>
         <span>{{item.title}}</span>
         <span class="count_num">{{item.count}}</span>
      <div class="count_item" v-for="(item, index) in countList" :key="index">
         <div class="square" :style="{ background: setBgColor(item.type) }"></div>
         <span>{{ item.title }}</span>
         <span class="count_num">{{ item.count }}</span>
      </div>
   </div>
</template>
<script lang="ts" setup>
import {  defineProps, computed } from 'vue'
import { defineProps, computed } from 'vue';
const props = defineProps({
   countData: {
      type: Array,
      required: true
   }
})
const countList: Record<any, any> = computed(() => props.countData)
//设置背景
      required: true,
   },
});
const countList: Record<any, any> = computed(() => props.countData);
const setBgColor = (type: number): string => {
   let color = ''
   switch (type) {
      case 0:
         color = '#A2A2A2';
         break;
      case 1:
         color = '#F18201';
         break;
      case 2:
         color = '#2BA6FF';
         break;
      case 3:
         color = '#FFFF00';
   let color = '';
   if (type) {
      switch (type) {
         case 1:
            color = '#2BA6FF'; //蓝色  在库
            break;

         break;
      case 4:
         color = '#FF0000';
         break;
         case 2:
            color = '#FF0000'; //红色  已冻结
            break;
         default:
            color = '#F6C285'; //橘色  正常
            break;

         // case 1:
         //    color = '#F18201'; //橘色  正常
         //    break;
         // case 2:
         //    color = '#2BA6FF'; //蓝色 封存
         //    break;
         // case 3:
         //    color = '#FFFF00'; //黄色 禁出
         //    break;

         // case 4:
         //    color = '#A2A2A2'; //灰色 禁入
         //    break;

         // case 5:
         //    color = '#FF0000'; //红色  锁定
         //    break;
      }
   }
   return color;
}

   return color;
};
</script>
<style lang="less" scoped>
.count {
@@ -70,4 +83,4 @@
      }
   }
}
</style>
</style>