<template>
|
<el-dialog
|
title="销售合同列表"
|
v-model="visible"
|
width="800px"
|
append-to-body
|
destroy-on-close
|
@open="handleOpen"
|
>
|
<div v-loading="loading">
|
<el-table :data="tableData" border style="width: 100%">
|
<el-table-column type="index" label="序号" width="60" align="center" />
|
<el-table-column prop="salesContractNo" label="销售合同编号" align="center" show-overflow-tooltip />
|
<el-table-column prop="customerName" label="客户名称" align="center" show-overflow-tooltip />
|
</el-table>
|
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
v-model:page="queryParams.current"
|
v-model:limit="queryParams.size"
|
@pagination="getList"
|
/>
|
</div>
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="visible = false">关 闭</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup>
|
import { ref, watch, reactive } from 'vue'
|
import { ledgerListPage } from '@/api/salesManagement/salesLedger'
|
|
const props = defineProps({
|
modelValue: {
|
type: Boolean,
|
default: false
|
},
|
projectId: {
|
type: [Number, String],
|
default: null
|
}
|
})
|
|
const emit = defineEmits(['update:modelValue'])
|
|
const visible = ref(false)
|
const loading = ref(false)
|
const tableData = ref([])
|
const total = ref(0)
|
|
const queryParams = reactive({
|
current: 1,
|
size: 10,
|
projectId: undefined
|
})
|
|
watch(() => props.modelValue, (val) => {
|
visible.value = val
|
})
|
|
watch(visible, (val) => {
|
emit('update:modelValue', val)
|
})
|
|
function handleOpen() {
|
queryParams.current = 1
|
queryParams.projectId = props.projectId
|
getList()
|
}
|
|
function getList() {
|
if (!queryParams.projectId) {
|
tableData.value = []
|
total.value = 0
|
return
|
}
|
|
loading.value = true
|
ledgerListPage(queryParams).then(res => {
|
const records = res?.data?.records || res?.records || res?.rows || []
|
|
// 如果一条记录也没有且在第一页以后,可能需要重置分页
|
// 前端要求显示“销售合同编号”和“客户名称”,这些字段在 salesLedgerListPage 返回的数据中存在
|
tableData.value = records
|
total.value = res?.data?.total || res?.total || 0
|
}).catch(() => {
|
tableData.value = []
|
total.value = 0
|
}).finally(() => {
|
loading.value = false
|
})
|
}
|
</script>
|
|
<style scoped>
|
.dialog-footer {
|
text-align: right;
|
}
|
</style>
|