Merge remote-tracking branch 'origin/master'

zhoushihao

2024-07-29 ac71274114b9d41f5f29b9c125199031737a8528

 UI-Project/src/views/GlassStorage/MaterialRackManagement.vue

@@ -1,38 +1,31 @@
<template>

  <div  class="app-container">

    <el-card style="flex: 1; margin-left: 10px; " :loading="loading">

  <div  class="app-container" style="height: 600px;">

    <!-- <el-card style="flex: 1; margin-left: 10px; " :loading="loading"> -->

      <div slot="header" class="clearfix" style="display: flex; align-items: center;">



<!-- 左侧按钮组 -->

<div >

  <el-button type="success" size="mini"  @click="storage()">原片仓储详情</el-button>

  <el-button type="success" size="mini" style="margin-left: 10px;" @click="storage()">原片仓储详情</el-button>

  <el-button type="success" size="mini" @click="handleInbound()">入库</el-button>

  <el-button type="success" size="mini" >吊装位入库</el-button>

 
</div>



<!-- 右侧选择框 -->

<el-form-item style="margin-top: 15px; width: 150px;">

<el-form-item style="margin-top: 15px; width: 150px;margin-left: 10px;">

  <el-select v-model="formData2.dzw" placeholder="请选择吊装位">

    <el-option label="吊装位1" value="吊装位1"></el-option>

    <el-option label="吊装位2" value="吊装位2"></el-option>

    <!-- 根据实际情况添加更多选项 -->

  </el-select>

</el-form-item>



</div>

<el-dialog v-model="Hidden" top="10vh" width="80%"  >

      <el-table

        :data="tableData" v-model="dialogVisible3"

       
        style="width: 98%; height: 200px"

        @selection-change="handleSelectionChange"

        :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"

        ref="table"

       
        empty-text="No Data"

      >

       
        <el-table-column prop="location" label="库位号"></el-table-column>

        <el-table-column prop="type" label="类型"></el-table-column>

        <el-table-column prop="length" label="长度(mm)"></el-table-column>

@@ -41,7 +34,6 @@
        <el-table-column prop="quantity" label="数量"></el-table-column>

        <el-table-column prop="entry_time" label="入库时间"></el-table-column>

        <el-table-column prop="batchnumber" label="批次号"></el-table-column>

       
        <el-table-column

  align="center"

  label="料架状态"

@@ -54,7 +46,6 @@
        </el-tag>

      </template>

</el-table-column>



        <!-- 操作列 -->

        <el-table-column label="操作" width="250">

          <template #default="{ row }">

@@ -64,8 +55,6 @@
            <!-- <el-button type="success" size="mini" @click="addglass()">添加原片</el-button> -->

          </template>

        </el-table-column>



        
      </el-table>

      <el-pagination

        v-if="totalItems > 0"

@@ -75,25 +64,20 @@
        :page-size="pageSize"

        @current-change="handleCurrentChange"

      ></el-pagination>



      
  </el-dialog>





  <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;" v-loading="loading">

      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;">

  <el-table

    :data="tasktableData"

    style="width: 98%; height: 150px"

    height="240"

    @selection-change="handleSelectionChange"

    :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"

    ref="table"

    empty-text="No Data"

  >





  <template #header>

        <div style="display: flex; align-items: center;">

          <span style="font-size: 16px; font-weight: bold; margin-right: 20px;">任务列表</span>

        
        </div>

      </template>

    <el-table-column prop="Glassid" label="Glassid"></el-table-column>

@@ -101,7 +85,6 @@
    <el-table-column prop="glassThickness" label="玻璃厚度"></el-table-column>

    <el-table-column prop="glassFilm" label="玻璃膜系"></el-table-column>

    <el-table-column prop="creationTime" label="创建时间"></el-table-column>



    <el-table-column

      align="center"

      label="任务状态"

@@ -114,7 +97,6 @@
        </el-tag>

      </template>

    </el-table-column>



    <!-- 操作列 -->

    <el-table-column label="操作" width="350">

      <template #default="{ row }">

@@ -124,21 +106,14 @@
      </template>

    </el-table-column>

  </el-table>

  </div>

    </el-card>









   
    <!-- </el-card> -->

    <div class="img-ypcc" >





      <div class="img-car1" :style="'z-index:999;left:397px;top:205px;position:absolute;'">

      <div v-show="cellshow1" style="margin-top:10px;width:200px;height:5px;background-color:#409EFF;"></div>

    </div>

   
    </div>

   
    <!-- 入库对话框 -->

    <el-dialog

      title="入库"

@@ -174,14 +149,11 @@
          <el-input v-model.number="formData.quantity" placeholder="请输入数量"></el-input>

        </el-form-item>

      </el-form>



      <div slot="footer" class="dialog-footer">

        <el-button @click="dialogVisible = false">取 消</el-button>

        <el-button type="primary" @click="handleConfirmInbound">确 定</el-button>

      </div>

    </el-dialog>





    <el-dialog title="添加原片"  v-model="dialogVisible3" width="50%">

    <el-form :model="formData3" ref="form" label-width="80px">

      <el-form-item label="颜色膜系">

@@ -197,30 +169,24 @@
          </el-dropdown-menu>

        </el-dropdown>

      </el-form-item>



      <el-form-item label="长度">

        <el-input v-model="formData.width" required style="width: 250px; font-size: 20px" @focus="clearInput('wid')"></el-input>

      </el-form-item>



      <el-form-item label="高度">

        <el-input v-model="formData.height" required style="width: 250px; font-size: 20px" @focus="clearInput('heig')"></el-input>

      </el-form-item>



      <el-form-item label="厚度">

        <el-input v-model="formData.thickness" required style="width: 250px; font-size: 20px" @focus="clearInput('thinkness')"></el-input>

      </el-form-item>



      <el-form-item label="数量">

        <el-input-number v-model="formData.quantity" required :min="0" :max="9000" style="width: 250px; font-size: 20px" @focus="clearInput('num')"></el-input-number>

      </el-form-item>

    </el-form>



    <span slot="footer" class="dialog-footer">

      <el-button @click="dialogVisible3 = false">关闭</el-button>

      <el-button type="primary" @click="submitForm">提交</el-button>

    </span>

  </el-dialog>



  <el-dialog title="编辑" v-model="editdialogVisible" width="30%" @close="edithandleDialogClose">

      <el-form :model="editForm" ref="editFormRef" label-width="80px">

        <el-form-item label="数量">

@@ -239,44 +205,27 @@
          <el-input v-model="editForm.thickness"></el-input>

        </el-form-item>

      </el-form>



      <div  class="dialog-footer">

        <el-button @click="editdialogVisible = false">取消</el-button>

        <el-button type="primary" @click="editsaveEdit">保存</el-button>

      </div>

    </el-dialog>





  </div>

</template>



   




<script setup>

import { ref, onMounted, onBeforeUnmount } from 'vue'; // 导入 Vue 3 的模块

import * as echarts from 'echarts';

import { ElMessage, ElMessageBox } from 'element-plus'

import {tableData} from '@/stores/tableData.js';







    const loading = ref(false);

   


    const Hidden = ref(false)





    const totalItems = ref(0);

    totalItems.value = 10;

    const pageSize = 10;

    let currentPage = ref(1);

    const handleCurrentChange = (val) => {



      currentPage.value = val;

      
    };



   const getTagType2 =(status) => {

      switch (status) {

        case 'completed':

@@ -291,20 +240,16 @@
          return '';

      }

    }



    const getTagType =(status) => {

      return status === 1 ? 'success' : 'danger';

      // 根据状态值决定标签类型，这里假设状态为1时为成功（绿色），否则为失败（红色）

    }



    const toggleStatus = (row) => {

      // 切换料架状态的逻辑

      row.shelf_status = 1 - row.shelf_status; // Toggle between 0 and 1

      // 此处可以添加保存状态的逻辑，比如调用 API 更新数据

    };



   const tasktableData=ref([



    {

          Glassid: 'G001',

          taskDescription: '从吊装位【99】到仓位【56】',

@@ -322,7 +267,6 @@
          creationTime: '2024-06-19 11:00:00'

        }

        ]);



    const dialogVisible = ref(false);

    const formData = ref({

      shelf: '',

@@ -332,13 +276,9 @@
      thickness: '',

      quantity: ''

    });



    const formData2 = ref({

      dzw: '',

     
    });



   
    const handleDelete = (row) => {

  // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认

  ElMessageBox.confirm('确定要执行删除操作吗？', '确认删除', {

@@ -353,8 +293,6 @@
    console.log('取消删除操作');

  });

};



    
    const handleCheckout = (row) => {

  // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认

  ElMessageBox.confirm('确定要执行出库操作吗？', '确认出库', {

@@ -369,19 +307,14 @@
    console.log('取消出库操作');

  });

};





    const handleInbound = () => {

      // 打开入库对话框

      dialogVisible.value = true;

    };



    const storage = () => {

      // 打开入库对话框

      Hidden.value = true;

    };

    


    const handleCloseDialog = () => {

      // 关闭对话框时重置表单数据

      formData.value = {

@@ -394,18 +327,12 @@
      };

      dialogVisible.value = false;

    };



    const handleConfirmInbound = () => {

      // 处理确认入库逻辑，可以在这里提交表单或者执行其他操作

      console.log('Confirm Inbound:', formData.value);

      // 关闭对话框

      dialogVisible.value = false;

    };











    const dialogVisible3 = ref(false);

    const colors = ref([

      { '0_glass_id': 'Red' },

@@ -413,7 +340,6 @@
      { '0_glass_id': 'Blue' }

      // Add more colors as needed

    ]);



    const formData3 = ref({

      selectedColor: '',

      wid: '',

@@ -421,8 +347,6 @@
      thinkness: '',

      num: ''

    });





    const addglass = () => {

      // 打开入库对话框

      dialogVisible3.value = true;

@@ -430,20 +354,14 @@
    const handleCommand = (command) => {

      formData.value.selectedColor = command;

    };



    const clearInput = (field) => {

      formData.value[field] = '';

    };



    const submitForm = () => {

      console.log('提交数据:', formData.value);

      dialogVisible3.value = false;

      // Add your submit logic here

    };

    






    const editdialogVisible = ref(false);

    const editForm = ref({

      quantity: '',

@@ -454,7 +372,6 @@
    });

    const editFormRef = ref(null);

    let currentRow = ref(null);



    // 处理行点击事件

    const edithandleRowClick = (row) => {

      currentRow.value = row;

@@ -467,19 +384,15 @@
      editdialogVisible.value = true;

      console.log(editForm.value)

    };



    // 添加保存编辑内容

    const editsaveEdit = () => {

      if (!currentRow.value) return;



      // 更新当前行数据

      currentRow.value.quantity = parseInt(editForm.value.quantity);

      currentRow.value.batchnumber = editForm.value.batchnumber;



      // 关闭对话框

      editdialogVisible.value = false;

    };



    // 对话框关闭时重置编辑表单和当前行数据

    const edithandleDialogClose = () => {

      editForm.value.quantity = '';

@@ -487,18 +400,8 @@
      editForm.value.width = '';

      editForm.value.height = '';

      editForm.value.thickness = '';

  


      currentRow.value = null;

    };











    




    const handleRestart = (row) => {

  // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认

  ElMessageBox.confirm('确定要执行重新开始操作吗？', '确认重新开始', {

@@ -513,8 +416,6 @@
    console.log('取消重新开始操作');

  });

};





const handleDeletetask = (row) => {

  // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认

  ElMessageBox.confirm('确定要执行删除任务操作吗？', '确认删除任务', {

@@ -529,9 +430,6 @@
    console.log('取消删除任务操作');

  });

};







const handleComplete = (row) => {

  // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认

  ElMessageBox.confirm('确定要执行任务完成操作吗？', '确认任务完成', {

@@ -546,48 +444,16 @@
    console.log('取消任务完成操作');

  });

};















































    




</script>



<style scoped>





#dt { display:block; float:left;line-height: 20px;margin-left: 100px;}

#dta { display:block; float:left;line-height: 20px;margin-left: 80%;}

#dialog-footer{

  text-align: center;

  margin-top: -15px;

}







.img-ypcc{

  margin-left: 80px;

  margin-left: -40px;

  background-image:url('../../assets/ypcc.png');

  background-repeat: no-repeat;

    background-attachment: local;

@@ -597,9 +463,8 @@
    background-size: 1400px 600px;

    overflow: hidden;

    position:relative;

    margin-top:0px

    margin-top: -30px

}



.img-car1{

  background-image:url('../../assets/ypccche.png');

  position: absolute;

@@ -612,7 +477,6 @@
    overflow: hidden;

    position:relative

}



.custom-dialog {

  max-height: 90vh; /* 最大高度为视口高度的90% */

  overflow-y: auto; /* 对话框内部出现垂直滚动条 */