From 4dff7869e7373f96ca415f7e1d172dadc1ec32f3 Mon Sep 17 00:00:00 2001 From: wuyouming666 <2265557248@qq.com> Date: 星期五, 05 七月 2024 15:27:20 +0800 Subject: [PATCH] 原片仓储 下片测试 --- UI-Project/src/views/GlassStorage/MaterialRackManagement.vue | 134 ++++++++++++++++---------------------------- 1 files changed, 50 insertions(+), 84 deletions(-) diff --git a/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue b/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue index b36c181..b9aba12 100644 --- a/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue +++ b/UI-Project/src/views/GlassStorage/MaterialRackManagement.vue @@ -5,6 +5,7 @@ <!-- 宸︿晶鎸夐挳缁� --> <div > + <el-button type="success" size="mini" @click="storage()">鍘熺墖浠撳偍璇︽儏</el-button> <el-button type="success" size="mini" @click="handleInbound()">鍏ュ簱</el-button> <el-button type="success" size="mini" >鍚婅浣嶅叆搴�</el-button> @@ -20,9 +21,9 @@ </el-form-item> </div> - +<el-dialog v-model="Hidden" top="10vh" width="80%" > <el-table - :data="tableData" + :data="tableData" v-model="dialogVisible3" style="width: 98%; height: 200px" @selection-change="handleSelectionChange" @@ -64,6 +65,7 @@ </template> </el-table-column> </el-table> + <el-table :data="tasktableData" @@ -109,11 +111,21 @@ </template> </el-table-column> </el-table> - + </el-dialog> </el-card> - <div ref="chart" id="chart" style="width: 100%; height: 250px;"></div> - + <!-- <div ref="chart" id="chart" style="width: 100%; height: 250px;"></div> --> + + + + <div class="img-ypcc" > + + + <div class="img-car1" :style="'z-index:999;left:297px;top:158px;position:absolute;'"> + <div v-show="cellshow1" style="margin-top:10px;width:200px;height:5px;background-color:#409EFF;"></div> + </div> + + </div> <!-- 鍏ュ簱瀵硅瘽妗� --> <el-dialog @@ -214,7 +226,6 @@ </el-dialog> - <!-- <div ref="chart" id="chart" style="width: 100%; height: 400px;"></div> --> </div> </template> @@ -286,6 +297,8 @@ } // Add more data as needed ]); + + const Hidden = ref(false) const getTagType2 =(status) => { switch (status) { @@ -385,6 +398,12 @@ // 鎵撳紑鍏ュ簱瀵硅瘽妗� dialogVisible.value = true; }; + + const storage = () => { + // 鎵撳紑鍏ュ簱瀵硅瘽妗� + Hidden.value = true; + }; + const handleCloseDialog = () => { // 鍏抽棴瀵硅瘽妗嗘椂閲嶇疆琛ㄥ崟鏁版嵁 @@ -561,85 +580,8 @@ - let chartInstance = null; + -onMounted(() => { - // Initialize the chart - chartInstance = echarts.init(document.getElementById('chart')); - - // Simulated data for demonstration - const chartData = { - labels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'], - datasets: [ - { name: '浣跨敤鎯呭喌缁熻', data: [{ remaining: 4, total: 5 }, { remaining: 9, total: 10 }, { remaining: 0, total: 30 }, { remaining: 0, total: 10 },{ remaining: 4, total: 5 }] } - ] - }; - - const options = { - tooltip: { - trigger: 'axis', - axisPointer: { - type: 'shadow' - } - }, - legend: { - data: ['浣跨敤鎯呭喌缁熻'] - }, - xAxis: { - type: 'category', - data: chartData.labels - }, - yAxis: { - type: 'value' - }, - series: chartData.datasets.map(item => ({ - name: item.name, - type: 'bar', - stack: '鎬婚噺', - label: { - show: true, - position: 'inside', - formatter: '{c}%' - }, - data: item.data.map(dataItem => ({ - value: (dataItem.remaining / dataItem.total * 100).toFixed(2), // 璁$畻鍓╀綑閲忓崰姣旓紝淇濈暀涓や綅灏忔暟 - remaining: dataItem.remaining, - total: dataItem.total, - itemStyle: { - color: getColorByRemaining(dataItem.remaining, dataItem.total) - } - })) - })) - }; - - function getColorByRemaining(remaining, total) { - // 鏍规嵁鍓╀綑閲忎笌鎬婚噺鐨勬瘮渚嬶紝璁剧疆涓嶅悓鐨勯鑹查�昏緫 - const percentage = remaining / total; - if (percentage >= 0.8) { - return '#FF6666'; // Red - } else if (percentage >= 0.5) { - return '#FFCC66'; // Yellow - } else { - return '#66CC66'; // Green - } - } - - // Set options and render chart - if (chartInstance) { - chartInstance.setOption(options); - } -}); - -onBeforeUnmount(() => { - if (chartInstance) { - chartInstance.dispose(); - chartInstance = null; - } -}); - -const handleSelectionChange = (selection) => { - console.log('Selection changed:', selection); -}; </script> @@ -659,7 +601,31 @@ +.img-ypcc{ + margin-left: 80px; + background-image:url('../../assets/ypcc.png'); + background-repeat: no-repeat; + background-attachment: local; + min-height: 800px; + width: 1600px; + max-width: 100%; + background-size: 1400px 800px; + overflow: hidden; + position:relative +} +.img-car1{ + background-image:url('../../assets/ypccche.png'); + position: absolute; + background-repeat: no-repeat; + background-attachment: local; + min-height: 200px; + width: 200px; + max-width: 100%; + background-size: 200px 70px; + overflow: hidden; + position:relative +} .custom-dialog { max-height: 90vh; /* 鏈�澶ч珮搴︿负瑙嗗彛楂樺害鐨�90% */ -- Gitblit v1.8.0