更新履约评价

src/views/finance/purchasingrequisition/accept/AcceptBatchForm.vue

@@ -0,0 +1,199 @@
+<template>
+  <el-form ref="formRef" :model="form" :rules="rules" label-width="160px" class="accept-batch-form">
+    <el-row :gutter="24">
+      <el-col :span="12">
+        <el-form-item label="验收方式" prop="acceptType">
+          <el-radio-group v-model="form.acceptType" :disabled="readonly">
+            <el-radio label="1">填写履约验收评价表</el-radio>
+            <el-radio label="2" :disabled="!canFill">上传履约验收评价表</el-radio>
+          </el-radio-group>
+          <div v-if="!canFill" class="el-form-item__tip">金额≥30万，仅支持上传模版</div>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="验收日期" prop="acceptDate">
+          <el-date-picker
+            v-model="form.acceptDate"
+            type="date"
+            placeholder="请选择"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            style="width: 100%"
+            :disabled="readonly"
+          />
+        </el-form-item>
+      </el-col>
+
+      <!-- 填报方式：验收内容表格 -->
+      <template v-if="form.acceptType === '1' && canFill">
+        <el-col :span="24">
+          <el-form-item label="验收内容" prop="acceptContents">
+            <el-table :data="form.acceptContents" border size="small" max-height="260"  class="accept-content-table">
+              <el-table-column prop="itemName" label="验收项" >
+                <template #default="{ row }">
+                  {{row.itemName}}
+                  <el-input
+                      v-if="row.type === 'input'"
+                      v-model="row.remark"
+                      placeholder="请输入"
+                      size="small"
+                      :disabled="readonly"
+                  />
+
+                </template>
+              </el-table-column>
+              <el-table-column prop="isQualified" label="合格/不合格" width="140" align="center">
+                <template #default="{ row }">
+                  <el-radio-group v-model="row.isQualified" size="small" :disabled="readonly">
+                    <el-radio label="1">合格</el-radio>
+                    <el-radio label="0">不合格</el-radio>
+                  </el-radio-group>
+                </template>
+              </el-table-column>
+
+            </el-table>
+          </el-form-item>
+        </el-col>
+      </template>
+
+      <!-- 上传方式 -->
+      <template v-if="form.acceptType === '2'">
+        <el-col :span="24">
+          <el-form-item label="履约验收模版" prop="templateFileIds">
+            <UploadFile
+              v-model="templateFileIdsStr"
+              :limit="1"
+              :data="{ purchaseId: purchaseId || '', fileType: '110' }"
+              upload-file-url="/purchase/purchasingfiles/upload"
+              :disabled="readonly"
+            />
+          </el-form-item>
+        </el-col>
+      </template>
+
+      <!-- 验收小组 -->
+      <el-col :span="24">
+        <el-form-item label="验收小组" prop="acceptTeam">
+          <div class="team-list">
+            <div v-for="(m, idx) in form.acceptTeam" :key="idx" class="team-row">
+              <el-input v-model="m.name" placeholder="姓名" size="small" style="width:120px" :disabled="readonly" />
+              <el-input v-model="m.deptName" placeholder="部门" size="small" style="width:160px" :disabled="readonly" />
+              <el-button v-if="!readonly && form.acceptTeam.length > 3" type="danger" link size="small" @click="removeTeam(idx)">删除</el-button>
+            </div>
+            <el-button v-if="!readonly" type="primary" link size="small" @click="addTeam">+ 增加成员</el-button>
+          </div>
+          <div class="el-form-item__tip">至少3人，且为单数</div>
+        </el-form-item>
+      </el-col>
+
+      <el-col :span="24">
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" :rows="2" placeholder="请输入" :disabled="readonly" />
+        </el-form-item>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, computed, watch } from 'vue'
+import type { FormInstance, FormRules } from 'element-plus'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue: Record<string, any>
+    canFill: boolean
+    readonly?: boolean
+    purchaseId?: string
+    acceptanceItems?: any[]
+  }>(),
+  { readonly: false, canFill: true, purchaseId: '' }
+)
+
+const emit = defineEmits(['update:modelValue'])
+
+const formRef = ref<FormInstance>()
+const templateFileIdsStr = ref('')
+
+const form = reactive({
+  acceptType: '1',
+  acceptDate: '',
+  acceptContents: [] as any[],
+  acceptTeam: [
+    { name: '', deptCode: '', deptName: '' },
+    { name: '', deptCode: '', deptName: '' },
+    { name: '', deptCode: '', deptName: '' },
+  ] as any[],
+  templateFileIds: [] as string[],
+  remark: '',
+  ...props.modelValue,
+})
+
+watch(() => props.modelValue, (val) => Object.assign(form, val || {}), { deep: true })
+watch(form, () => emit('update:modelValue', { ...form }), { deep: true })
+
+watch(() => props.acceptanceItems, (items) => {
+  if (items?.length && form.acceptContents.length === 0) {
+    form.acceptContents = items.map((it: any) => ({
+      configId: it.id,
+      itemName: it.itemName,
+      type: it.type,
+      isQualified: '1',
+      remark: '',
+    }))
+  }
+}, { immediate: true })
+
+watch(templateFileIdsStr, (s) => {
+  const arr = s ? s.split(',').map((x: string) => x.trim()).filter(Boolean) : []
+  if (JSON.stringify(form.templateFileIds) !== JSON.stringify(arr)) {
+    form.templateFileIds = arr
+  }
+})
+
+watch(() => form.templateFileIds, (arr) => {
+  if (Array.isArray(arr) && arr.length) templateFileIdsStr.value = arr.join(',')
+}, { immediate: true, deep: true })
+
+const addTeam = () => {
+  form.acceptTeam.push({ name: '', deptCode: '', deptName: '' })
+}
+
+const removeTeam = (idx: number) => {
+  form.acceptTeam.splice(idx, 1)
+}
+
+const rules: FormRules = {
+  acceptType: [{ required: true, message: '请选择验收方式', trigger: 'change' }],
+  acceptDate: [{ required: true, message: '请选择验收日期', trigger: 'change' }],
+}
+
+const validate = () => formRef.value?.validate()
+
+defineExpose({ validate, form })
+</script>
+
+<style scoped>
+.accept-batch-form :deep(.el-form-item) {
+  margin-bottom: 24px;
+}
+.accept-content-table :deep(.el-table__body td) {
+  padding: 10px 0;
+  width: 200px;
+}
+.team-list {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+.team-row {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+.el-form-item__tip {
+  font-size: 12px;
+  color: #909399;
+  margin-top: 6px;
+}
+</style>