| | |
| | | <scroll-view class="content"> |
| | | <view v-if="currentTab === 7" class="tab-content"> |
| | | <view class="content"> |
| | | <view class="top-right"> |
| | | <!--<view class="top-right"> |
| | | <button class="refresh-btn" @click="refresh">刷新</button> |
| | | </view> |
| | | </view>--> |
| | | <view> |
| | | <h4>一台机台只能选择一条工单(多选默认为最后一条)</h4> |
| | | </view> |
| | | <view class="section top-section"> |
| | | <!--显示当前机台--> |
| | | <view class="form-row"> |
| | | <view> |
| | | <input v-model="machineName" |
| | | disabled="true" |
| | | type="text" |
| | | class="machine-name-box" /> |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="form-row"> |
| | | <view> |
| | | <label style="float: left;font-family: fantasy;font-size: 33px;margin-top: 20px;">第一步选择工单:</label> |
| | | <view class="form-row align-row"> |
| | | <input v-model="machineName" |
| | | disabled="true" |
| | | type="text" |
| | | class="machine-name-box" /> |
| | | <view class="form-group"> |
| | | <label class="order-label">第一步选择工单:</label> |
| | | <button class="print-btn" @click="isShowTab">选择工单</button> |
| | | </view> |
| | | <view class="top-right"> |
| | | <button class="refresh-btn" @click="refresh">刷新</button> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | <view class="section card"> |
| | | <uni-table border stripe emptyText="暂无更多数据" @selection-change="selectionChange"> |
| | | <uni-tr> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 140px;">工序</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 180px;">工单号</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 220px;">产品编码</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 180px;">产品名称</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 180px;">规格</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">已生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">未生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">派工数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">工单数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">工单状态</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">报工人</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">选择</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">工序</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 200px;">工单号</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 150px;">产品编码</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 260px;">产品名称</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 200px;">规格</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 75px;">已生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 75px;">未生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 75px;">派工数量</uni-th> |
| | | <!--<uni-th align="center" class="th" style="color: #FFFFFF; width: 70px;">工单数量</uni-th>--> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 90px;">工单状态</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 90px;">报工人</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 90px;">选择</uni-th> |
| | | </uni-tr> |
| | | <uni-tr v-for="(item, index) in isShowTableData" :key="index"> |
| | | <uni-td align="center"> |
| | |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" /><!--派工数量--> |
| | | </uni-td> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" /><!--工单数量--> |
| | | </uni-td> |
| | | <!--<uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" />--><!--工单数量--> |
| | | <!--</uni-td>--> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa018" /><!--工单状态--> |
| | | </uni-td> |
| | |
| | | <uni-table ref="table" type="selection" border stripe emptyText="暂无更多数据" |
| | | class="large-selection-table" @selection-change="selectionChange"> |
| | | <uni-tr> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">工序</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">工单号</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 120px;">产品编码</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 170px;">工序</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 490px;">工单号</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 250px;">产品编码</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 260px;">产品名称</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 260px;">规格</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 80px;">已生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 80px;">未生产数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 80px;">派工数量</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 80px;">工单数量</uni-th> |
| | | <!--<uni-th align="center" class="th" style="color: #FFFFFF; width: 80px;">工单数量</uni-th>--> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">工单状态</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">报工人</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">选择</uni-th> |
| | | <!--<uni-th align="center" class="th" style="color: #FFFFFF; width: 100px;">选择</uni-th>--> |
| | | </uni-tr> |
| | | <uni-tr v-for="(item, index) in tableData" |
| | | :key="index" |
| | |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" /><!--派工数量--> |
| | | </uni-td> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" /><!--工单数量--> |
| | | </uni-td> |
| | | <!--<uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa008" />--><!--工单数量--> |
| | | <!--</uni-td>--> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.daa018" /><!--工单状态--> |
| | | </uni-td> |
| | |
| | | methods: { |
| | | onRowClick(index) { |
| | | this.selectedIndexs = [index]; // 单选 |
| | | // 手动触发 selectionChange 以同步复选框 |
| | | this.selectionChange({ detail: { index } }); |
| | | }, |
| | | checkForUpdate() { |
| | | this.$post({ |
| | |
| | | |
| | | :deep(.checkbox), |
| | | :deep(.checkbox__inner) { |
| | | padding: 10px !important; |
| | | width: 44px !important; |
| | | min-width: 44px !important; |
| | | box-sizing: border-box; |
| | | width: 60px !important; |
| | | height: 60px !important; |
| | | min-width: 60px !important; |
| | | min-height: 60px !important; |
| | | padding: 16px !important; |
| | | margin-right: 20px !important; |
| | | } |
| | | |
| | | .popup .large-selection-table { |
| | | width: 100% !important; |
| | | table-layout: auto !important; // 让表格自动分配宽度 |
| | | } |
| | | |
| | | .row-selected { |
| | |
| | | } |
| | | |
| | | /* 卡片样式 */ |
| | | .card { |
| | | background-color: #fff; |
| | | border-radius: 10px; |
| | | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); |
| | | padding: 16px; |
| | | position: relative; |
| | | margin-bottom: 25px |
| | | } |
| | | .card { |
| | | background-color: #fff; |
| | | border-radius: 10px; |
| | | box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); |
| | | padding: 0; // 去除多余内边距 |
| | | position: relative; |
| | | margin-bottom: 25px; |
| | | width: 100%; // 填满父容器 |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | /* //.content { |
| | | // flex: 1; |
| | | // padding: 1vh 1vw; // 保证整体有左右留白 |
| | | // background-color: white; |
| | | // font-size: 1.5vw; |
| | | //}*/ |
| | | |
| | | /* 卡片标题在左上角 */ |
| | | .card-header { |
| | |
| | | transition: background 0.2s; |
| | | } |
| | | |
| | | .th { |
| | | background-color: lightskyblue; |
| | | height: 6vh; |
| | | font-size: 2vw; |
| | | /* Increased font size for table headers */ |
| | | } |
| | | .th { |
| | | background-color: lightskyblue; |
| | | height: 6vh; |
| | | font-size: 2vw; |
| | | font-size: 2.6vw; /* 字体更大 */ |
| | | /* Increased font size for table headers */ |
| | | } |
| | | |
| | | .form-input { |
| | | font-size: 1.8vw; |
| | |
| | | } |
| | | |
| | | /* 底部保存和取消按钮 */ |
| | | .bottom-section { |
| | | display: flex; |
| | | justify-content: space-around; |
| | | margin-bottom: 2vh; |
| | | padding: 2vh 1vw; |
| | | } |
| | | .bottom-section { |
| | | display: flex; |
| | | justify-content: space-around; |
| | | margin-bottom: 2vh; |
| | | padding: 2vh 1vw; |
| | | margin-top: 160px; // 原来是40px,改成80px,按钮整体下移 |
| | | } |
| | | |
| | | .save-btn, |
| | | .cancel-btn { |
| | |
| | | padding: 2vh; |
| | | border: 1px solid #ccc; |
| | | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
| | | width: 90vw; |
| | | height: 85vh; /* 原70vh,调高 */ |
| | | width: 98vw; // 原来是 90vw,改成 98vw |
| | | height: 85vh; |
| | | font-size: 1.6vw; |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | .uni-td, .uni-th, td, th { |
| | | word-break: break-all; |
| | | white-space: normal; |
| | | /* 可选:设置最大宽度,防止撑破表格 */ |
| | | max-width: 180px; |
| | | overflow-wrap: break-word; |
| | | .uni-td, |
| | | td { |
| | | white-space: normal !important; // 允许自动换行 |
| | | word-break: break-all !important; // 单词/中文都能断行 |
| | | line-height: 1.4; // 行高适当,便于多行显示 |
| | | text-align: center; // 居中显示(如需左对齐可改为 left) |
| | | vertical-align: middle; // 垂直居中 |
| | | max-width: 180px; // 保持单元格最大宽度 |
| | | overflow-wrap: break-word; // 兼容性更好 |
| | | } |
| | | |
| | | // 放大弹窗内表格字体(表头和内容) |
| | |
| | | .popup .large-selection-table .uni-td, |
| | | .popup .large-selection-table input.form-input { |
| | | font-size: 2.2vw !important; // 可根据实际需求调整 |
| | | } |
| | | |
| | | .select-btn { |
| | | width: 180px; // 更宽 |
| | | height: 80px; // 更高 |
| | | font-size: 1.8vw; // 字体也略大 |
| | | border-radius: 10px; |
| | | background-color: #f5f5f5; |
| | | color: #007aff; |
| | | border: 2px solid #007aff; |
| | | margin: 0 auto; |
| | | display: block; |
| | | } |
| | | |
| | | .top-section { |
| | | position: relative; |
| | | display: flex; |
| | | flex-direction: column; |
| | | margin-bottom: 20px; |
| | | padding: 20px 10px; |
| | | } |
| | | |
| | | .form-row.align-row { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | position: relative; |
| | | width: 100%; |
| | | } |
| | | |
| | | .machine-name-box { |
| | | flex: 1 1 45%; |
| | | margin-right: 20px; |
| | | } |
| | | |
| | | .form-group { |
| | | display: flex; |
| | | align-items: center; |
| | | flex: 1 1 45%; |
| | | justify-content: flex-start; |
| | | } |
| | | |
| | | .order-label { |
| | | font-family: fantasy; |
| | | font-size: 33px; |
| | | margin-top: 20px; |
| | | margin-right: 10px; |
| | | float: none; |
| | | } |
| | | |
| | | .print-btn { |
| | | margin-top: 20px; |
| | | } |
| | | |
| | | .top-right { |
| | | position: absolute; |
| | | top: -30px; // 往上移 |
| | | right: 0; |
| | | z-index: 1000; |
| | | } |
| | | |
| | | /* 放大表头和表格内容字体 */ |
| | | .th, |
| | | .uni-th, |
| | | th { |
| | | font-size: 1.7vw !important; |
| | | font-weight: bold; |
| | | letter-spacing: 2px; |
| | | } |
| | | |
| | | /* 针对1280x800的平板使用媒体查询进行适配 */ |
| | |
| | | font-size: 20px; |
| | | } |
| | | } |
| | | |
| | | .select-btn { |
| | | width: 180px; // 更宽 |
| | | height: 80px; // 更高 |
| | | font-size: 1.8vw; // 字体也略大 |
| | | border-radius: 10px; |
| | | background-color: #f5f5f5; |
| | | color: #007aff; |
| | | border: 2px solid #007aff; |
| | | margin: 0 auto; |
| | | display: block; |
| | | } |
| | | |
| | | </style> |