hanzhengzheng/screenFront
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

展会大屏 计划产量修改

Browse Source
This commit is contained in:
hzz 2023-09-15 11:27:46 +08:00
parent bf97d9fdd3
commit 7a86de7551
1 changed files with 78 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
src/views/MicroExhibition/table.vue
View File

@ -15,38 +15,56 @@
</div>
</div>
<div class="table-container">
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
'text-align': 'center',
'font-size': '20px',
'background': '#162556 !important',
'color': '#ffffff',
'border': 'none !important'
}">
<el-table-column prop="order" label="序号" width="80" align="center"></el-table-column>
<el-table-column align="center" prop="name" label="设备名称"></el-table-column>
<el-table-column prop="label" label="设备编号" align="center"></el-table-column>
<el-table-column prop="planProduction" label="计划任务" align="center">
<template #default="{ row }">
<div class="centered-input">
<el-input v-model="row.planProduction" placeholder="请输入" clearable />
</div>
</template>
</el-table-column>
</el-table>
</div>
<div>
<el-button @click="saveData" type="success" style="background-color: #00B38B;">保存</el-button>
<div class="item" v-for="(val, key) in objList">
<h3>{{ key }}</h3>
<el-table :data="val" style="width: 100%" :header-cell-style="{
'text-align': 'center',
'font-size': '20px',
'background': '#162556 !important',
'color': '#ffffff',
'border': 'none !important'
}">
<el-table-column prop="order" label="序号" width="80" align="center"></el-table-column>
<el-table-column align="center" prop="name" label="设备名称"></el-table-column>
<el-table-column prop="label" label="设备编号" align="center"></el-table-column>
<el-table-column prop="planProduction" label="计划任务" align="center">
<template #default="{ row }">
<div class="centered-input">
<el-input v-model="row.planProduction" placeholder="请输入" clearable />
</div>
</template>
</el-table-column>
</el-table>
</div>
<div class="item">
<el-button @click="saveData" size="large" type="success" style="background-color: #00B38B;">保存</el-button>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import header2 from '@/components/headerBox/header2.vue'
import { ref, onMounted } from 'vue';
import { ElTable, ElTableColumn, ElInput, ElButton, ElMessage,ElMessageBox } from 'element-plus';
import { ref, reactive, onMounted } from 'vue';
import { ElTable, ElTableColumn, ElInput, ElButton, ElMessage, ElMessageBox } from 'element-plus';
import { getPlanProduction, insertPlanProduction } from '@/http/cisma';
const tableData = ref([]);
let obj = {
caijian: ['1190269', '1050910'],
tuoxie: ['116023#'],
fengzhong: ['RP2011001#', '1021629', '10102109', '10102154', 'RP2011157'],
banfang: ['10410207', '104019420', '10404393', '1131514', '104019428'],
zuoyi: ['1171902', '10201557', '1171701', '1170304']
}
let objList = reactive({
'裁剪设备': [],
'一次性拖鞋生产线': [],
'缝中设备': [],
'板房设备': [],
'座椅面套生产线': []
})
onMounted(() => {
// 获取数据
fetchPlanProduction();
@ -58,6 +76,19 @@ async function fetchPlanProduction(): Promise<any> {
if (res.code === 200) {
// console.log(res);
tableData.value = res.data
res.data.forEach((item) => {
if (obj.caijian.includes(item.label)) {
objList.裁剪设备.push(item)
} else if (obj.tuoxie.includes(item.label)) {
objList.一次性拖鞋生产线.push(item)
} else if (obj.fengzhong.includes(item.label)) {
objList.缝中设备.push(item)
} else if (obj.banfang.includes(item.label)) {
objList.板房设备.push(item)
} else if (obj.zuoyi.includes(item.label)) {
objList.座椅面套生产线.push(item)
}
})
}
} catch (error) {
console.error('Failed to fetch plan production:', error);
@ -95,12 +126,20 @@ async function saveData() {
</script>
<style scoped>
h3 {
font-size: 24px;
margin-top: 10px;
margin-bottom: 10px;
text-align: left;
}
.container {
height: 1080px;
width: 1920px;
color: #FFFFFF;
background-color: #0E0E0E;
position: relative;
overflow: auto;
overflow-y: scroll;
/* text-align: center; */
}
@ -125,14 +164,23 @@ async function saveData() {
}
.table-container {
width: 70%;
margin-left: 15%;
margin-top: 20px;
width: 95%;
padding: 20px;
box-sizing: border-box;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.el-button {
margin-left: 65%;
margin-top: 10px;
.item {
width: 48%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
</style>