133 lines
3.6 KiB
Vue
133 lines
3.6 KiB
Vue
|
||
|
||
<template>
|
||
<n-card>
|
||
<n-card style="margin: 12px 0px">
|
||
<n-grid :cols="2" style="margin: 10px">
|
||
<n-gi>
|
||
<span class="pgClass">物料名称：</span>
|
||
<span>{{props.baseInfo.materialName}}</span>
|
||
</n-gi>
|
||
<n-gi>
|
||
<span class="pgClass">物料编号：</span>
|
||
<span>{{props.baseInfo.materialCode}}</span>
|
||
</n-gi>
|
||
</n-grid>
|
||
<n-grid :cols="2" style="margin: 10px">
|
||
<n-gi>
|
||
<span class="pgClass">工序名称：</span>
|
||
<span>{{props.baseInfo.processName}}</span>
|
||
</n-gi>
|
||
<n-gi>
|
||
<span class="pgClass">派工编号：</span>
|
||
<span>{{props.baseInfo.assingCode}}</span>
|
||
</n-gi>
|
||
</n-grid>
|
||
</n-card>
|
||
<n-data-table
|
||
:columns="reportRecordsColums"
|
||
size="small"
|
||
:data="submitLogList"
|
||
remote
|
||
:scroll-x="600"
|
||
/>
|
||
|
||
<div class="pagination-container" style="display: flex; justify-content: flex-end; margin-top: 12px">
|
||
<n-pagination
|
||
v-model:page="pagination.page"
|
||
v-model:page-size="pagination.pageSize"
|
||
:item-count="pagination.itemCount"
|
||
:page-sizes="[2,10, 20, 50, 100]"
|
||
show-size-picker
|
||
show-quick-jumper
|
||
@update:page="handlePageChange"
|
||
@update:page-size="handlePageSizeChange"
|
||
>
|
||
<template #prefix>
|
||
共 {{ pagination.itemCount }} 条
|
||
</template>
|
||
</n-pagination>
|
||
</div>
|
||
</n-card>
|
||
</template>
|
||
<script setup lang="ts">
|
||
import { NCard, NDataTable, NGi,NTag, NGrid,DataTableColumns} from "naive-ui";
|
||
import {onMounted, ref, h, reactive} from "vue";
|
||
import { dictDataApi } from '@/api/org'
|
||
import { SubmitLog,submitLogApi} from '@/api/submitLog'
|
||
|
||
const props =defineProps(
|
||
{
|
||
assingId:Number,
|
||
baseInfo:Object
|
||
}
|
||
)
|
||
|
||
//汇报状态字典
|
||
const submitStatusOptions = ref<{ label: string; value: any ;class:any}[]>([])
|
||
|
||
|
||
const pagination = reactive({
|
||
page: 1,
|
||
pageSize: 10,
|
||
itemCount: 0
|
||
})
|
||
|
||
//汇报信息表格
|
||
const reportRecordsColums:DataTableColumns<SubmitLog> = [
|
||
|
||
{ title: '汇报数量', key: 'quantity',align: 'center'},
|
||
{ title: '合格数量', key: 'qualifiedQty',align: 'center'},
|
||
{ title: '报废数量', key: 'scrapQty',align: 'center'},
|
||
{ title: '汇报人', key: 'userName',align: 'center' },
|
||
{ title: '状态', key: 'submitStatus',align: 'center',
|
||
render: (row) => {
|
||
const val = row.submitStatus
|
||
const opt = submitStatusOptions.value.find(o => o.value === val || String(o.value) === String(val))
|
||
if (!opt) return val ?? '-'
|
||
|
||
return h(NTag, { type: opt.class, size: 'small' }, { default: () => opt.label })
|
||
}
|
||
},
|
||
{ title: '汇报时间', key: 'createTime',align: 'center' },
|
||
]
|
||
|
||
// 加载字典选项
|
||
async function loadDictOptions() {
|
||
try {
|
||
const data = await dictDataApi.listByType('submit_status')
|
||
submitStatusOptions.value = data.map(d => ({ label: d.dictLabel, value: (Number(d.dictValue) || d.dictValue),class:d.listClass }))
|
||
}catch {}
|
||
}
|
||
|
||
//加载汇报信息
|
||
const submitLogList = ref<SubmitLog[]>([])
|
||
async function load() {
|
||
const res = await submitLogApi.loadSumbitLog({
|
||
assingId:props.assingId,
|
||
page: pagination.page,
|
||
pageSize: pagination.pageSize
|
||
})
|
||
submitLogList.value = res.list
|
||
pagination.itemCount = res.total
|
||
}
|
||
|
||
function handlePageChange(page: number) {
|
||
pagination.page = page
|
||
load()
|
||
}
|
||
|
||
function handlePageSizeChange(pageSize: number) {
|
||
pagination.pageSize = pageSize
|
||
pagination.page = 1
|
||
load()
|
||
}
|
||
|
||
onMounted(()=>{
|
||
loadDictOptions()
|
||
load()
|
||
})
|
||
</script>
|
||
<style scoped>
|
||
|
||
</style> |