<!-- 添加设备弹窗 - 实验室待分配任务列表 --> <script lang="ts" setup name="CustomerList"> import { getCurrentInstance, ref } from 'vue' import type { Ref } from 'vue' import type { DateModelType } from 'element-plus' import { ElLoading, ElMessage, ElMessageBox } from 'element-plus' import DistributeDialog from '../../schedule/task/components/distributeDialog.vue' import RollbackDialog from './../components/rollbackDialog.vue' import type { ILabQuery, ITaskList, ITaskQuery } from '@/views/business/schedule/task/task-interface' import type { TableColumn } from '@/components/NormalTable/table_interface' import { printJSON } from '@/utils/printUtils' import { exportFile } from '@/utils/exportUtils' import { getDictByCode } from '@/api/system/dict' import { exportTaskList, getDeptMeasureList, getTaskList, myExecutiveDone } from '@/api/business/schedule/task' import type { dictType } from '@/global' import type { IMenu } from '@/components/buttonBox/buttonBox' const emits = defineEmits(['confirm']) // 右上角按钮 const active = ref('') // 选中的按钮 // 查询条件 const timeRange = ref<[DateModelType, DateModelType]>(['', '']) const listQuery: Ref<ILabQuery> = ref({ sampleNo: '', // 样品编号 sampleName: '', // 样品名称 orderNo: '', // 委托书编号 customerNo: '', // 委托方代码 customerName: '', // 委托方名称 isUrgent: '', // 是否加急 sampleBelong: '', // 样品属性 startTime: '', // 应检完时间-开始 endTime: '', // 应检完时间-结束 measureStatus: active.value, // 检测状态 offset: 1, limit: 5, }) // --------------获取所需字典值---------------- const sampleBelongList = ref<dictType[]>([]) // 样品属性列表 function getDict() { // 获取样品属性 getDictByCode('sampleBelong').then((response) => { sampleBelongList.value = response.data }) } getDict() // 表头 const columns = ref<TableColumn[]>([ { text: '样品编号', value: 'sampleNo', width: '160', align: 'center' }, { text: '样品名称', value: 'sampleName', align: 'center' }, { text: '型号', value: 'sampleModel', align: 'center' }, { text: '出厂编号', value: 'manufacturingNo', align: 'center' }, { text: '委托书编号', value: 'orderNo', align: 'center', width: '160' }, { text: '委托方代码', value: 'customerNo', align: 'center', width: '160' }, { text: '委托方名称', value: 'customerName', align: 'center' }, { text: '是否加急', value: 'isUrgentName', align: 'center', width: '55', styleFilter: (row: ITaskList) => { return row.isUrgentName == '是' ? 'color: red' : '' } }, { text: '应检完时间', value: 'requireOverTime', align: 'center', width: '180' }, { text: '样品属性', value: 'sampleBelongName', align: 'center', width: '100' }, { text: '当前检定环节', value: 'currentSegment', align: 'center' }, // { text: '证书出具', value: 'certificationState', align: 'center', filter: (row: ITaskList) => { return `${row.currentCertifications}/${row.requireCertifications}` } }, ]) // 表格数据 const list = ref<ITaskList[]>([]) // 总数 const total = ref(0) // 表格加载状态 const loadingTable = ref(false) // 选中的内容 const checkoutList = ref<string[]>([]) // 数据查询 function fetchData(isNowPage = false) { loadingTable.value = true if (!isNowPage) { // 是否显示当前页,否则跳转第一页 listQuery.value.offset = 1 } list.value = [] if (!listQuery.value.measureStatus) { listQuery.value.measureStatus = '2' // 待检测 } getDeptMeasureList(listQuery.value).then((res) => { list.value = res.data.rows.map((item: ITaskList) => { item.isUrgentName = item.isUrgent == 1 ? '是' : '否' return item }) total.value = res.data.total loadingTable.value = false }) } // 多选发生改变时 function handleSelectionChange(e: any) { checkoutList.value = e } // 点击搜索 const searchList = () => { fetchData(true) } // 点击重置 const clearList = () => { listQuery.value = { sampleNo: '', // 样品编号 sampleName: '', // 样品名称 orderNo: '', // 委托书编号 customerNo: '', // 委托方代码 customerName: '', // 委托方名称 isUrgent: '', // 是否加急 sampleBelong: '', // 样品属性 startTime: '', // 应检完时间-开始 endTime: '', // 应检完时间-结束 measureStatus: '2', // 检测状态 offset: 1, limit: 5, } timeRange.value = ['', ''] fetchData(true) } // 页数发生变化后的操作,可能是页码变化,可能是每页容量变化,此函数必写 const changePage = (val: { size?: number; page?: number }) => { if (val && val.size) { listQuery.value.limit = val.size } if (val && val.page) { listQuery.value.offset = val.page } fetchData(true) } // 时间变更 watch(timeRange, (val) => { if (val) { listQuery.value.startTime = `${val[0]}` listQuery.value.endTime = `${val[1]}` } else { listQuery.value.startTime = '' listQuery.value.endTime = '' } }) onMounted(async () => { listQuery.value.measureStatus = '2' fetchData(true) }) // 初始化 const dialogVisible = ref(false) const initDialog = () => { dialogVisible.value = true } // 点击确认 const confirm = () => { if (!checkoutList.value.length) { ElMessage.warning('请先选择设备') return } dialogVisible.value = false emits('confirm', checkoutList.value) // checkoutList.value = [] } defineExpose({ initDialog }) </script> <template> <el-dialog v-model="dialogVisible" title="添加设备" width="80%" append-to-body> <search-area :need-clear="true" @search="searchList" @clear="clearList" > <search-item> <el-input v-model.trim="listQuery.sampleNo" placeholder="样品编号" class="short-input" clearable /> </search-item> <search-item> <el-input v-model.trim="listQuery.sampleName" placeholder="样品名称" clearable class="short-input" /> </search-item> <search-item> <el-input v-model.trim="listQuery.orderNo" placeholder="委托书编号" clearable class="short-input" /> </search-item> <search-item> <el-input v-model.trim="listQuery.customerNo" placeholder="委托方代码" class="short-input" clearable /> </search-item> <search-item> <el-date-picker v-model="timeRange" type="datetimerange" range-separator="到" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="应检完开始时间" end-placeholder="应检完结束时间" /> </search-item> <search-item> <el-select v-model="listQuery.isUrgent" placeholder="是否加急" style="width: 120px;" clearable> <el-option label="是" value="1" /> <el-option label="否" value="0" /> </el-select> </search-item> <search-item> <el-select v-model="listQuery.sampleBelong" placeholder="样品属性" style="width: 120px;" clearable> <el-option v-for="item in sampleBelongList" :key="item.id" :label="item.name" :value="item.value" /> </el-select> </search-item> </search-area> <table-container> <normal-table :data="list" :total="total" :columns="columns" :query="listQuery" :list-loading="loadingTable" is-showmulti-select @change="changePage" @multi-select="handleSelectionChange" /> </table-container> <template #footer> <el-button @click="() => dialogVisible = false"> 取 消 </el-button> <el-button type="primary" @click="confirm"> 确 定 </el-button> </template> </el-dialog> </template> <style lang="scss" scoped> .short-input { width: 160px; } </style>