Merge remote-tracking branch 'origin/master'

zhoushihao

2024-05-21 b644727afb18a3035c91443cd381494e5ed60121

 UI-Project/src/views/StockBasicData/Select.vue

@@ -1,486 +1,49 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {useRouter} from "vue-router"
const router = useRouter()

import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
const dialogFormVisible = ref(false)
const dialogFormVisiblea = ref(false)
const box = ref(true)
const boxa = ref(false)
const boxb = ref(false)
// const tableData = [
//   {
//     id: '1',
//     long: '1005',
//     wide: '183.6',
//     thick: '1991',
//     type: '5',
//     typea: '1',
//   },
//   {
//     id: '2',
//     long: '105',
//     wide: '183',
//     thick: '191',
//     typea: '1',
//     type: '5'
//   },
//   {
//     id: '2',
//     long: '105',
//     wide: '183',
//     thick: '191',
//     typea: '1',
//     type: '5'
//   },
// ]
const tableData = ref([
{
    id: '2',
    ida: '2',
    long: '105',
    wide: '183',
    thick: '191',
    typea: '1',
    typeb: '1',
    typec: '1',
    type: '5'
  },
  {
    id: '12',
    ida: '12',
    long: '1105',
    wide: '1183',
    thick: '1911',
    typea: '11',
    typeb: '11',
    typec: '11',
    type: '15'
  },
])
// 新增一行
const addTableData = ()=>{
  const newRow = {
    id: null,
    id: null,
    long: null,
    wide: null,
    thick: null,
    typea: null,
    type: null,
    typeb: null,
    typec: null,
  }
  tableData.value.push(newRow)
}
// 删除
const deleteTableData = (row) =>{
  const index = tableData.value.indexOf(row);
  if (index !== -1) {
    tableData.value.splice(index, 1);
  }
}
const tableDataa = [
  {
    ida: '3',
    longa: '1005',
    widea: '183.6',
    thicka: '1991',
  },
  {
    ida: '4',
    longa: '105',
    widea: '183',
    thicka: '191',
  }
]
const open = () => {
  ElMessageBox.confirm(
    '是否删除该条信息?',
    '提示',
    {
      confirmButtonText: '是',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      ElMessage({
        type: 'success',
        message: '删除成功！',
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '删除失败',
      })
    })
}
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' :{
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/returns/createReturns', query: { ReturnID: 'TH24010101' }})
      break
    }
    case 'delete':{
      alert('我接收到子组件传送的删除信息')
      break
    }
  }
import {ArrowLeftBold, ArrowRight, Search} from "@element-plus/icons-vue"
import {useRouter} from "vue-router";
let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}

const selectedRows = ref([]);
const handleSelectionChange = (selection) => {
  selectedRows.value = selection;
};
const showMessage = () => {
  if (selectedRows.value.length === 0) {
    ElMessage('请至少选择一个选项')
  } else{
    ElMessage({
    message: '出片成功！',
    type: 'success',
  })

  }
};
const pick = () => {
  if (selectedRows.value.length === 0) {
    ElMessage('请至少选择一个选项')
  } else{
    ElMessage({
    message: '破损成功！',
    type: 'success',
  })

  }
};
const gridOptions = reactive({
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮
  id: 'OrderList',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true },//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
    remote: true
  },
  customConfig: {
    storage: true
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  },
  data:  [
    {
      'id': '1',
      'long': '5',
      'wide': '1005',
      'thick': '183.6',
    }
  ],
})
</script>

<template>
  <div>
     <el-button style="margin-top: 5px;margin-left: 5px;"   id="searchButton" type="primary" @click="showMessage">出片</el-button>
    <el-button style="margin-top: 5px"  id="searchButton" type="primary" @click="pick">破损</el-button>
    <!-- <el-button style="margin-top: 5px"  id="searchButton" type="primary" @click="dialogFormVisible = true">添加</el-button> -->
    <el-button style="margin-top: 5px"  id="searchButton" type="primary"  @click="addTableData" >添加</el-button>
    <el-button style="margin-top: 5px"  id="searchButton" @click="boxb = true;box = false" >合并</el-button>
    <el-button style="margin-top: 5px"  id="searchButton" @click="box = true;boxb = false" >单片</el-button>
  <!-- <div id="main-div"> -->

    <div v-if="box">
    <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">
      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 450px;">
        <el-table height="100%" ref="table" 
        @selection-change="handleSelectionChange"
        :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
    <el-table-column type="selection" width="55"  />
    <el-table-column prop="id" align="center" label="栅格号" min-width="80" >
      <template #default="scope">
        <el-input v-model="scope.row.id" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="ida" align="center" label="id" min-width="80">
            <template #default="scope">
        <el-input v-model="scope.row.ida" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="long" align="center" label="长" min-width="100" >
            <template #default="scope">
        <el-input v-model="scope.row.long" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="wide" align="center" label="宽" min-width="100">
            <template #default="scope">
        <el-input v-model="scope.row.wide" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="type" align="center" label="厚度" min-width="100">
            <template #default="scope">
        <el-input v-model="scope.row.type" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typea" align="center" label="膜系" min-width="100" >
            <template #default="scope">
        <el-input v-model="scope.row.typea" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typeb" align="center" label="出片顺序" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.typeb" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typec" align="center" label="流程卡号" min-width="150">
            <template #default="scope">
        <el-input v-model="scope.row.typec" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="thick" align="center" label="其他" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.thick" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column fixed="right" label="操作" align="center" width="200">
            <template #default="scope">
              <el-button size="mini" type="text" plain  @click="dialogFormVisiblea = true">详情</el-button>
        <el-button @click="deleteTableData(scope.row)" link icon="Delete" type="primary">删除</el-button>
            </template>
        </el-table-column>
  </el-table>
</div>

    </el-card>
    <div id="main-body">
      <router-view  />
  </div>
  <div v-if="boxb">
    <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">
      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 450px;">
        <el-table height="100%" ref="table" 
        @selection-change="handleSelectionChange"
        :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
    <el-table-column type="selection" width="55"  />
    <el-table-column prop="id" align="center" label="栅格" min-width="80">
      <template #default="scope">
        <el-input v-model="scope.row.id" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="ida" align="center" label="id" min-width="80">
            <template #default="scope">
        <el-input v-model="scope.row.ida" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="long" align="center" label="长" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.long" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="wide" align="center" label="宽" min-width="120">
            <template #default="scope">
        <el-input v-model="scope.row.wide" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="type" align="center" label="厚度" min-width="120">
            <template #default="scope">
        <el-input v-model="scope.row.type" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typea" align="center" label="膜系" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.typea" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typeb" align="center" label="出片顺序" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.typeb" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="typec" align="center" label="流程卡号" min-width="120">
            <template #default="scope">
        <el-input v-model="scope.row.typec" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column prop="thick" align="center" label="其他" min-width="120" >
            <template #default="scope">
        <el-input v-model="scope.row.thick" size="small"></el-input>
      </template>
      </el-table-column>
          <el-table-column fixed="right" label="操作" align="center" width="200">
            <template #default="scope">
              <el-button size="mini" type="text" plain  @click="dialogFormVisiblea = true">详情</el-button>
        <el-button @click="deleteTableData(scope.row)" link icon="Delete" type="primary">删除</el-button>
            </template>
        </el-table-column>
  </el-table>
      </div>
    </el-card>
  </div>
  </div>
  <el-dialog v-model="dialogFormVisible" top="21vh" width="40%" title="添加" >
    <div style="margin-left: -50px;margin-top: 10px;margin-bottom: 10px;">
            <el-form  size="mini" label-width="150px">
      <el-form >
        <el-row style="margin-top: -15px;margin-bottom: -2px;">
          <el-col :span="6">
              <div id="dt" style="font-size: 15px;">
        <div>
              <el-form-item label="栅格号：" :required="true" style="width: 14vw">
                <el-input  autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
          <el-col :span="9">
            <div id="dta" style="font-size: 15px;">
        <div>
              <el-form-item label="id：" :required="true" style="width: 14vw">
                <el-input autocomplete="off" />
              </el-form-item></div>
              </div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px;">
          <el-col :span="6">
              <div id="dt" style="font-size: 15px;">
        <div>
              <el-form-item label="长：" :required="true" style="width: 13.2vw;margin-left: 14px;">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
          <el-col :span="9">
            <div id="dta" style="font-size: 15px;">
        <div>
              <el-form-item label="宽：" :required="true" style="width: 14vw">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px;">
          <el-col :span="6">
              <div id="dt" style="font-size: 15px;">
        <div>
              <el-form-item label="厚度：" :required="true" style="width: 13.2vw;margin-left: 14px;">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
          <el-col :span="9">
            <div id="dta" style="font-size: 15px;">
        <div>
              <el-form-item label="膜系：" :required="true" style="width: 14vw">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px;">
          <el-col :span="6">
              <div id="dt" style="font-size: 15px;">
        <div>
              <el-form-item label="出片顺序：" :required="true" style="width: 13.2vw;margin-left: 14px;">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
          <el-col :span="9">
            <div id="dta" style="font-size: 15px;">
        <div>
              <el-form-item label="流程卡号" :required="true" style="width: 14vw">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px;">
          <el-col :span="6">
              <div id="dt" style="font-size: 15px;">
        <div>
              <el-form-item label="其他：" :required="true" style="width: 13.2vw;margin-left: 14px;">
                <el-input autocomplete="off" />
              </el-form-item></div></div>
          </el-col>
        </el-row>
        </el-form>
            </el-form>
          </div>
    <template #footer>
      <div id="dialog-footer">
        <el-button type="primary" @click="dialogFormVisible = false">
          确认
        </el-button>
        <el-button @click="dialogFormVisible = false">取消</el-button>
      </div>
    </template>
  </el-dialog>
    <el-dialog v-model="dialogFormVisiblea" top="21vh" width="40%" title="原片信息">
    <el-table height="100%" ref="table" :data="tableDataa" @row-click="handle">
      <el-table-column
        prop="long"
        align="center"
        label="长"
        min-width="120"
      />
      <el-table-column
        prop="wide"
        align="center"
        label="宽"
        min-width="120"
      />
      <el-table-column
        prop="thick"
        align="center"
        label="厚"
        min-width="120"
      />
      <el-table-column
        prop="station"
        align="center"
        label="工位"
        min-width="120"
      />
    </el-table>
    <div style="text-align: center; height: 22px; margin-top: 30px;">
        <el-button @click="dialogFormVisiblea = false">关闭</el-button>
      </div>
  </el-dialog>
  <!-- </div> -->
</template>

<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;
#main-div{
  width: 100%;
  height: 100%;
}
#message{
  text-align: center;
  align-items: center;
  color: black;
   width: 200px;
   height: 100px;
   background-color: #337ecc;
   margin-left: 28%;
#div-title{
  height: 2%;
  width: 100%;
}
#box{
  position: relative;

  #icon{
    position: absolute;
    bottom:10px;
    right: 19px;
#searchButton{
  margin-top: -5px;
  margin-left: 1rem;
  }
/* #searchButton1{
//margin-left: 10rem;
} */
/*main-body样式*/
#main-body{
  width: 100%;
  height: 95%;
  /* margin-top: 1%; */
}
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>