30 lines
3.6 KiB
Vue
30 lines
3.6 KiB
Vue
<script setup lang="ts">
|
||
import '@/styles/adminDensity.css'
|
||
import { computed } from 'vue'
|
||
import type { PlatformProcurement, ProcurementFile } from '../procurementTypes'
|
||
import type { ChargeDraft } from '../procurementFinanceForm'
|
||
import { money } from '../procurementPresentation'
|
||
const props = defineProps<{ detail: PlatformProcurement; files: ProcurementFile[] }>()
|
||
const form = defineModel<ChargeDraft>({ required: true })
|
||
const existing = computed(() => props.detail.fees.filter(row => row.active && row.purpose === form.value.purpose && (row.purpose !== 'OTHER' || row.feeItemCode === form.value.code)))
|
||
const selected = computed(() => existing.value.find(row => row.id === form.value.feeId))
|
||
function determine() { form.value.amount = form.value.determination === 'POSITIVE' ? '' : form.value.determination ? '0.00' : '' }
|
||
</script>
|
||
<template>
|
||
<div class="admin-density charge-fields">
|
||
<template v-if="form.mode === 'EXISTING'"><el-form-item label="引用已核定版本" required><el-select v-model="form.feeId" placeholder="选择本单该用途的有效费用"><el-option v-for="row in existing" :key="row.id" :value="row.id" :label="`${row.feeNo} · ${money(row.originalAmount, row.originalCurrency)}`" /></el-select></el-form-item><dl v-if="selected" class="density-fields"><div><dt>原费用版本</dt><dd>{{ selected.feeVersion }}</dd></div><div><dt>原业务日期</dt><dd>{{ selected.businessDate }}</dd></div></dl><p>本次仅核对并引用原费用，不重复扣款。金额更正请使用财务调整。</p></template>
|
||
<el-alert v-else-if="detail.operations.some(row => row.action === 'CONFIRM_CHARGES')" title="本项缺少有效版本，请先由财务完成替代核定。" type="warning" :closable="false" />
|
||
<template v-else>
|
||
<div class="charge-grid"><el-form-item label="核定结果" required><el-select v-model="form.determination" placeholder="明确正额、零元或不适用" @change="determine"><el-option value="POSITIVE" label="确认正额" /><el-option value="ZERO" label="确认零元" /><el-option value="NOT_APPLICABLE" label="不适用" /></el-select></el-form-item><el-form-item label="原币金额" required><el-input v-model="form.amount" :readonly="form.determination === 'ZERO' || form.determination === 'NOT_APPLICABLE'" placeholder="填写实际金额，最多两位小数" /></el-form-item><el-form-item label="币种" required><el-select v-model="form.currency"><el-option value="CNY" label="人民币 CNY" /><el-option value="USD" label="美元 USD" /></el-select></el-form-item><el-form-item label="业务日期" required><el-date-picker v-model="form.businessDate" type="date" value-format="YYYY-MM-DD" /></el-form-item></div>
|
||
<el-form-item label="本项费用凭证" :required="form.determination === 'POSITIVE'"><el-select v-model="form.voucherFileId" clearable placeholder="选择已上传的本单费用凭证"><el-option v-for="file in files.filter(row => row.category === 'VOUCHER')" :key="file.fileId" :value="file.fileId" :label="file.fileName" /></el-select></el-form-item>
|
||
<el-form-item label="本项核定说明" required><el-input v-model="form.reason" maxlength="500" placeholder="说明计费依据；零元或不适用也需说明" /></el-form-item>
|
||
</template>
|
||
</div>
|
||
</template>
|
||
<style scoped>
|
||
.charge-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--admin-space-3); }
|
||
:deep(.el-select), :deep(.el-date-editor) { width: 100%; }
|
||
.charge-fields p { color: var(--cc-muted); font-size: var(--admin-font-caption); }
|
||
@media (max-width: 760px) { .charge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
|
||
</style>
|