72 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			72 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
<!--
 | 
						|
 * @Author: zhp
 | 
						|
 * @Date: 2024-05-07 10:25:10
 | 
						|
 * @LastEditTime: 2024-05-17 10:34:51
 | 
						|
 * @LastEditors: zhp
 | 
						|
 * @Description:
 | 
						|
-->
 | 
						|
 | 
						|
<template>
 | 
						|
  <div class="stock-monitor">
 | 
						|
    <MonitorItem :cities="['成都', '邯郸', '株洲', '瑞昌', '佳木斯']" :stockDOData="stockDOData" />
 | 
						|
    <MonitorItem :cities="['凯盛光伏', '蚌埠兴科']" :stockDOData="stockDOData" />
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
import MonitorItemVue from "./sub/monitor/MonitorItem.vue";
 | 
						|
 | 
						|
export default {
 | 
						|
  name: "StockMonitor",
 | 
						|
  components: { MonitorItem: MonitorItemVue },
 | 
						|
  props: {
 | 
						|
    stockDOData: {
 | 
						|
      type: Array,
 | 
						|
      default: [],
 | 
						|
    },
 | 
						|
  },
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      // dhgList: [
 | 
						|
      //   { name: "总库存", value: 1000 },
 | 
						|
      //   { name: "已用库存", value: 500 },
 | 
						|
      //   { name: "剩余库存", value: 500 },
 | 
						|
      // ],
 | 
						|
      // otherList: [
 | 
						|
      //   { name: "分类1", value: 1000 },
 | 
						|
      //   { name: "分类2", value: 1000 },
 | 
						|
      //   { name: "分类3", value: 1000 },
 | 
						|
      //   { name: "分类4", value: 1000 },
 | 
						|
      // ],
 | 
						|
    };
 | 
						|
  },
 | 
						|
  computed: {
 | 
						|
    dhgList() {
 | 
						|
      console.log(this.stockDOData);
 | 
						|
      // console.log()
 | 
						|
    }
 | 
						|
  },
 | 
						|
  methods: {},
 | 
						|
};
 | 
						|
</script>
 | 
						|
 | 
						|
<style scoped lang="scss">
 | 
						|
.stock-monitor {
 | 
						|
  flex: 1;
 | 
						|
  display: flex;
 | 
						|
  gap: 5px;
 | 
						|
  position: relative;
 | 
						|
 | 
						|
  &:after {
 | 
						|
    content: "";
 | 
						|
    position: absolute;
 | 
						|
    left: 50%;
 | 
						|
    top: 0;
 | 
						|
    width: 3px;
 | 
						|
    height: 100%;
 | 
						|
    transform: translateX(-50%);
 | 
						|
    background: linear-gradient(to bottom, transparent, #00f2ff, transparent);
 | 
						|
  }
 | 
						|
}
 | 
						|
</style>
 |