资源需求（标准物质相关）模块调整；新增统一附件组件并接入供应商管理与客户满意度；客户满意度表单改客户卡片下拉并关联已完成委托单；预览、图表、导航栏等组件调整

吴羡

9 小时以前 b4c2cbc7825fe4732fb6333447fdada9567bcb97

 src/views/CNAS/resourceDemand/standardMaterialAccept/component/AddRecord.vue

@@ -1,107 +1,190 @@
<template>
  <el-dialog v-model="dialogVisible" title="标准物质验收记录" width="72%" v-loading="loading">
    <el-form :model="acceptance" ref="acceptance" label-width="140px" size="small">
      <el-col :span="12">
        <el-form-item label="厂家代表" prop="producer">
          <el-input v-model="acceptance.producer"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="相关附件" prop="file">
          <div class="table-between">
            <el-input v-model="acceptance.file" style="width: 80%;" disabled></el-input>
            <el-upload
              ref="upload"
              style="float: right;"
              :headers="uploadHeader"
              :action="action"
              :show-file-list="false"
              :on-success="onSuccess"
    <el-form ref="form" :model="form" :rules="rules" label-width="140px" size="small">
      <div class="section-title">标准物质信息</div>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="标准物质名称" prop="substance.name">
            <el-input v-model="form.substance.name" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="规格型号" prop="substance.model">
            <el-input v-model="form.substance.model" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="生产厂家" prop="substance.factoryManufacturer">
            <el-input v-model="form.substance.factoryManufacturer" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="供应商" prop="substance.supplier">
            <el-select v-model="form.substance.supplier" clearable filterable placeholder="请选择" style="width: 100%" @change="onSupplierChange">
              <el-option v-for="item in supplierOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="出厂编号" prop="substance.factoryNum">
            <el-input v-model="form.substance.factoryNum" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="管理编号" prop="substance.manageNum">
            <el-input v-model="form.substance.manageNum" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="不确定度" prop="substance.uncertainty">
            <el-input v-model="form.substance.uncertainty" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="数量" prop="substance.quantity">
            <el-input v-model="form.substance.quantity" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="单位" prop="substance.unit">
            <el-input v-model="form.substance.unit" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="购置日期" prop="substance.acquisitionDate">
            <el-date-picker
              v-model="form.substance.acquisitionDate"
              clearable
              type="datetime"
              format="YYYY-MM-DD HH:mm:ss"
              value-format="YYYY-MM-DD HH:mm:ss"
              placeholder="选择日期"
              style="width: 100%">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="有效期" prop="substance.effectiveDate">
            <el-date-picker
              v-model="form.substance.effectiveDate"
              clearable
              type="datetime"
              format="YYYY-MM-DD HH:mm:ss"
              value-format="YYYY-MM-DD HH:mm:ss"
              placeholder="选择日期"
              style="width: 100%">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="档案编号" prop="substance.fileNum">
            <el-input v-model="form.substance.fileNum" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="存放位置" prop="substance.position">
            <el-input v-model="form.substance.position" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="备注" prop="substance.remark">
            <el-input v-model="form.substance.remark" clearable></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <div class="section-title">验收信息</div>
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="到货日期" prop="acceptance.arriveDate">
            <el-date-picker
              v-model="form.acceptance.arriveDate"
              type="date"
              placeholder="选择日期"
              style="width: 100%"
              value-format="YYYY-MM-DD"
            >
              <el-button type="primary">
                附件上传
              </el-button>
            </el-upload>
          </div>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="接收人" prop="recipient">
          <el-input v-model="acceptance.recipient"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="接受签字" prop="signature">
          <el-input v-model="acceptance.signature"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="验收情况" prop="situation">
          <el-input v-model="acceptance.situation"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="安装调试情况" prop="installation">
          <el-input v-model="acceptance.installation"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="清单" prop="substanceId"
                      :rule="[{ required: true, message: '请选择清单', trigger: 'change' }]">
          <el-select v-model="acceptance.substanceId" placeholder="请选择" style="width: 100%">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="到货日期" prop="arriveDate">
          <el-date-picker
            v-model="acceptance.arriveDate"
            align="right"
            type="date"
            placeholder="选择日期"
            style="width: 100%"
            value-format="YYYY-MM-DD"
          >
          </el-date-picker>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="维修单位" prop="maintenanceUnit">
          <el-input v-model="acceptance.maintenanceUnit"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="备件确认">
          <el-button type="primary" style="float: right;" @click="addSpareTable">增加行</el-button>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <lims-table :tableData="list" :column="spareColumns" height="300">
          <template #name="{ row, index }">
            <el-input v-if="row.isEdit" size="small" v-model="row.name"></el-input>
            <span v-else>{{ row.name }}</span>
          </template>
          <template #number="{ row, index }">
            <el-input v-if="row.isEdit" size="small" v-model="row.number"></el-input>
            <span v-else>{{ row.number }}</span>
          </template>
          <template #action="{ row, index }">
            <div v-if="row.isEdit">
              <el-button link type="primary" @click="save(index)">保存</el-button>
              <el-button link type="primary">取消</el-button>
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="厂家代表" prop="acceptance.producer">
            <el-input v-model="form.acceptance.producer"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="接收人" prop="acceptance.recipient">
            <el-input v-model="form.acceptance.recipient"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="接受签字" prop="acceptance.signature">
            <el-input v-model="form.acceptance.signature"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="验收情况" prop="acceptance.situation">
            <el-input v-model="form.acceptance.situation"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="安装调试情况" prop="acceptance.installation">
            <el-input v-model="form.acceptance.installation"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="维修单位" prop="acceptance.maintenanceUnit">
            <el-input v-model="form.acceptance.maintenanceUnit"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="相关附件" prop="acceptance.file">
            <div class="table-between">
              <el-input v-model="form.acceptance.file" style="width: 80%;" disabled></el-input>
              <el-upload
                ref="upload"
                style="float: right;"
                :headers="uploadHeader"
                :action="action"
                :show-file-list="false"
                :on-success="onSuccess"
              >
                <el-button type="primary">
                  附件上传
                </el-button>
              </el-upload>
            </div>
            <div v-else>
              <el-button link type="primary" @click="edit(index)">修改</el-button>
            </div>
          </template>
        </lims-table>
      </el-col>
          </el-form-item>
        </el-col>
      </el-row>

      <div class="section-title">备件确认</div>
      <el-row :gutter="20">
        <el-col :span="24" class="spare-toolbar">
          <el-button type="primary" size="small" @click="addSpareTable">增加行</el-button>
        </el-col>
        <el-col :span="24">
          <lims-table :tableData="list" :column="spareColumns" height="300">
            <template #name="{ row, index }">
              <el-input v-if="row.isEdit" size="small" v-model="row.name"></el-input>
              <span v-else>{{ row.name }}</span>
            </template>
            <template #number="{ row, index }">
              <el-input v-if="row.isEdit" size="small" v-model="row.number"></el-input>
              <span v-else>{{ row.number }}</span>
            </template>
            <template #action="{ row, index }">
              <div v-if="row.isEdit">
                <el-button link type="primary" @click="save(index)">保存</el-button>
                <el-button link type="primary">取消</el-button>
              </div>
              <div v-else>
                <el-button link type="primary" @click="edit(index)">修改</el-button>
              </div>
            </template>
          </lims-table>
        </el-col>
      </el-row>
    </el-form>
    <template #footer><span  class="dialog-footer">
      <el-button @click="closeDialog">取 消</el-button>
@@ -114,9 +197,45 @@
import limsTable from "@/components/Table/lims-table.vue";
import {
  addAcceptance, getAcceptanceDetails,
  getStandardSubstanceAll,
  updateAcceptance
} from "@/api/cnas/resourceDemand/standardMaterialAccept/standardMaterialAccept";
import { selectQualifiedSupplierManagementPage } from "@/api/cnas/externalService/supplierManage/supplierManage";

function defaultSubstance() {
  return {
    id: undefined,
    name: undefined,
    model: undefined,
    factoryManufacturer: undefined,
    supplier: undefined,
    factoryNum: undefined,
    manageNum: undefined,
    uncertainty: undefined,
    quantity: undefined,
    unit: undefined,
    acquisitionDate: undefined,
    effectiveDate: undefined,
    fileNum: undefined,
    position: undefined,
    remark: undefined,
  }
}

function defaultAcceptance() {
  return {
    id: undefined,
    producer: undefined, // 厂家代表
    file: undefined,   // 相关附件
    recipient: undefined,   // 接收人
    signature: undefined,   // 接受签字
    situation: undefined,   // 验收情况
    installation: undefined,    // 安装调试情况
    substanceId: undefined, // 清单
    arriveDate: undefined,   // 到货日期
    maintenanceUnit: undefined,   // 维修单位
  }
}

export default {
  components: {
    limsTable,
@@ -126,19 +245,23 @@
      dialogVisible: false,
      loading: false,
      submitLoading: false,
      acceptance: {
        id: undefined,
        producer: undefined, // 厂家代表
        file: undefined,   // 相关附件
        recipient: undefined,   // 接收人
        signature: undefined,   // 接受签字
        situation: undefined,   // 验收情况
        installation: undefined,    // 安装调试情况
        substanceId: undefined, // 清单
        arriveDate: undefined,   // 到货日期
        maintenanceUnit: undefined,   // 维修单位
        list: [],
      form: {
        substance: defaultSubstance(),
        acceptance: defaultAcceptance(),
      },
      rules: {
        'substance.name': [{required: true, message: '请填写标准物质名称', trigger: 'blur'}],
        'substance.model': [{required: true, message: '请填写规格型号', trigger: 'blur'}],
        'substance.factoryNum': [{required: true, message: '请填写出厂编号', trigger: 'blur'}],
        'substance.manageNum': [{required: true, message: '请填写管理编号', trigger: 'blur'}],
        'substance.uncertainty': [{required: true, message: '请填写不确定度', trigger: 'blur'}],
        'substance.quantity': [{required: true, message: '请填写数量', trigger: 'blur'}],
        'substance.acquisitionDate': [{required: true, message: '请选择购置日期', trigger: 'change'}],
        'substance.effectiveDate': [{required: true, message: '请选择有效期', trigger: 'change'}],
        'substance.fileNum': [{required: true, message: '请填写档案编号', trigger: 'blur'}],
        'substance.position': [{required: true, message: '请填写存放位置', trigger: 'blur'}],
      },
      supplierOptions: [],
      list: [],
      spareColumns: [
        {
@@ -161,46 +284,52 @@
          width: 150
        }
      ],
      options: []
    }
  },
  mounted() {
    this.getStand()
  },
  methods: {
    openDialog(id) {
      if(id) {
      this.loadSuppliers()
      if (id) {
        this.getDetail(id)
      } else {
        this.clearForm()
      }
      this.dialogVisible = true
    },
    loadSuppliers() {
      selectQualifiedSupplierManagementPage({ current: 1, size: 999 }).then(res => {
        if (res.code === 200) {
          this.supplierOptions = (res.data.records || []).map(item => ({
            label: item.supplierName,
            value: item.supplierName
          }))
        }
      })
    },
    onSupplierChange(val) {
      this.form.acceptance.producer = val || ''
    },
    getDetail(id) {
      this.loading = true
      getAcceptanceDetails({id: id}).then(res => {
        this.acceptance = res.data.acceptance
        this.list = res.data.list
      getAcceptanceDetails({ id: id }).then(res => {
        this.form.acceptance = res.data.acceptance || defaultAcceptance()
        this.form.substance = res.data.substance || defaultSubstance()
        this.list = res.data.list || []
        this.loading = false
      }).catch(err => {
        this.loading = false
      })
    },
    getStand() {
      getStandardSubstanceAll().then(res => {
        this.options = res.data
      })
    },
    addSpareTable() {
      this.list.push({
        acceptanceId: this.acceptance.id,
        acceptanceId: this.form.acceptance.id,
        name: '',
        number: '',
        isEdit: true
      })
    },
    onSuccess(response) {
      this.acceptance.file = response.data
      this.form.acceptance.file = response.data
    },
    save(index) {
      this.list[index]['isEdit'] = false
@@ -209,39 +338,41 @@
      this.list[index]['isEdit'] = true
    },
    clearForm() {
      this.form.substance = defaultSubstance()
      this.form.acceptance = defaultAcceptance()
      this.list = []
      this.resetForm('acceptance')
      this.$nextTick(() => {
        if (this.$refs.form) {
          this.$refs.form.clearValidate()
        }
      })
    },
    closeDialog() {
      this.clearForm()
      this.resetForm('acceptance')
      this.dialogVisible = false
    },
    submit() {
      if (!this.acceptance.substanceId) {
        this.$message.warning('请选择清单')
        return
      }
      this.acceptance.list = this.HaveJson(this.list)
      this.submitLoading = true
      if(this.acceptance.id) {
        updateAcceptance({acceptance: this.acceptance, list: this.list}).then(res => {
          this.$message.success('编辑成功')
      this.$refs.form.validate((valid) => {
        if (!valid) {
          return false
        }
        const isEdit = !!this.form.acceptance.id
        this.submitLoading = true
        const payload = {
          acceptance: this.form.acceptance,
          substance: this.form.substance,
          list: this.HaveJson(this.list)
        }
        const request = isEdit ? updateAcceptance : addAcceptance
        request(payload).then(res => {
          this.submitLoading = false
          this.$message.success(isEdit ? '编辑成功' : '新增成功')
          this.closeDialog()
          this.$emit('submit')
        }).catch((e) => {
          this.submitLoading = false
        })
      } else {
        addAcceptance({acceptance: this.acceptance, list: this.list}).then(res => {
          this.$message.success('新增成功')
          this.closeDialog()
          this.$emit('submit')
        }).catch((e) => {
          this.submitLoading = false
        })
      }
      })
    },
  },
  computed: {
@@ -258,4 +389,34 @@
  height: 580px;
  overflow-y: auto;
}

.section-title {
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--lims-text);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--lims-divider);
  margin: 8px 0 16px;
}

.section-title:not(:first-child) {
  margin-top: 24px;
}

.section-title::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 14px;
  border-radius: 2px;
  background: var(--el-color-primary);
  margin-right: 8px;
}

.spare-toolbar {
  text-align: right;
  margin-bottom: 8px;
}
</style>