| <template> | 
|   <div class="rk"> | 
|     <div class="rk_title"> | 
|       <div class="rk_title_x"></div> | 
|       <span>选择机台设备</span> | 
|     </div> | 
|     <div class="rk_list"> | 
|       <div class="rk_list_item" v-for="(item, index) in data" :key="index" @click="addIten(index)"> | 
|         <span>{{item.dmodel.code}} - {{item.dmodel.name}}</span> | 
|         <input type="checkbox" :checked="item.active" /> | 
|       </div> | 
|     </div> | 
|     <div class="rk_zw"></div> | 
|     <div class="rk_footer"> | 
|       <div class="rk_footer_submit" @click="jump">下一步</div> | 
|     </div> | 
|   </div> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
|     import { ref, onMounted } from 'vue' | 
|     import { useRouter } from "vue-router" | 
|     import { Toast } from 'vant' | 
|     import { getListByUser } from '@/apis/WorkOrderAPI' | 
|   | 
|     const router = useRouter() | 
|   | 
|     // 设备数据 | 
|     let data: any = ref([]) | 
|   | 
|     // 跳转页面 | 
|     const jump = () => { | 
|         let ids: any = [] | 
|         data.value.forEach((item: any) => { | 
|             if (item.active) { | 
|                 ids.push(item.dmodel.id) | 
|             } | 
|         }) | 
|         if (ids.length === 0) { | 
|             Toast({ message: '请先选择机台设备', duration: 2000 }) | 
|             return | 
|         } | 
|         // router.push({ name: 'warehousingTwo', query: { ids: ids.join(',') } }) | 
|         router.push({ name: 'newWipCompletion', query: { ids: ids.join(',') } }) | 
|     } | 
|   | 
|     // 点击设备 | 
|     const addIten = (i: number) => { | 
|         data.value[i].active = !data.value[i].active | 
|     } | 
|   | 
|     // 获取设备 | 
|     const getListByUsers = () => { | 
|         getListByUser() | 
|           .then((res: any) => { | 
|               if (res.code === 200 && res.data && res.data.length !== 0) { | 
|                   res.data.forEach((item: any) => { | 
|                       item.active = false | 
|                   }) | 
|                   data.value = res.data | 
|               } | 
|           }) | 
|     } | 
|   | 
|     onMounted(() => { | 
|         getListByUsers() | 
|     }) | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
| .rk { | 
|   width: 100%; | 
|   padding: 30px; | 
|   box-sizing: border-box; | 
|   height: 100%; | 
|   position: absolute; | 
|   background: #FFFFFF; | 
|   .rk_title { | 
|     display: flex; | 
|     align-items: center; | 
|     .rk_title_x { | 
|       width: 8px; | 
|       height: 30px; | 
|       background: #4275FC; | 
|       border-radius: 2px; | 
|       margin-right: 20px; | 
|     } | 
|     span { | 
|       font-size: 32px; | 
|       font-weight: 500; | 
|       color: #333333; | 
|     } | 
|   } | 
|   .rk_list { | 
|     margin-top: 30px; | 
|     .rk_list_item { | 
|       height: 98px; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: space-between; | 
|       border-bottom: 1px solid #E5E5E5; | 
|       span { | 
|         font-size: 30px; | 
|         font-weight: 400; | 
|         color: #222222; | 
|       } | 
|       input { | 
|         width: 30px; | 
|         height: 30px; | 
|       } | 
|     } | 
|     /*.van-cell-group {*/ | 
|     /*  margin: 0;*/ | 
|     /*}*/ | 
|     /*.van-cell {*/ | 
|     /*  padding: 13px 0;*/ | 
|     /*}*/ | 
|   } | 
|   .rk_zw { | 
|     height: 168px; | 
|   } | 
|   .rk_footer { | 
|     position: fixed; | 
|     bottom: 0; | 
|     width: 100%; | 
|     padding-bottom: 68px; | 
|     background: white; | 
|     .rk_footer_submit { | 
|       width: calc(100% - 60px); | 
|       height: 88px; | 
|       background: $nav-color; | 
|       box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); | 
|       border-radius: 8px; | 
|       font-size: 30px; | 
|       font-weight: 500; | 
|       color: #FFFFFF; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|     } | 
|   } | 
| } | 
| </style> |