-Go服务器开发

看起来你在尝试编写一个 Vue.js 组件，可能是与贷款信息相关的表单。代码中存在一些语法和逻辑错误。以下是我对你提供的代码进行了修改和补充，使其更完整且符合 Vue.js 的规范：

<template>
  <div class="loanInfo" :style="isCustomerNotFound && productRows.length > 0 ? { height: '100px' } : {}">
    <a-row v-if="isCustomerNotFound" v-for="(item, index) in productRows" :key="index">
      <a-col :span="12" v-if="isCustomerNotFound">
        <a-form-item label="产品名称" style="width: 101%">
          <a-input v-model:value="item.productName" />
        </a-form-item>
      </a-col>
      <a-col :span="12" v-if="isCustomerNotFound">
        <a-form-item label="借据号" style="width: 102%; margin-left: -5px">
          <a-input v-model:value="item.loanInfoCode" />
        </a-form-item>
      </a-col>
    </a-row>
    <span
      v-if="productRows.length > 0 && isCustomerNotFound"
      class="jiahao"
      @click="addProductRow"
    >
      +
    </span>
  </div>

  <a-row v-if="!isCustomerNotFound">
    <a-col :span="12" v-if="isCustomerAssociated">
      <a-form-item label="产品名称" style="width: 250%; margin-left: -130px">
        <a-select
          v-model:value="formModal.productName"
          mode='multiple'
          placeholder="请选择产品名称"
          :options='productOptions'
          :disabled='isEditing'
        />
      </a-form-item>
    </a-col>
  </a-row>

</template>

<script setup>
import { ref } from 'vue';
import { message } from 'ant-design-vue'; // 假设使用 Ant Design Vue

const isCustomerNotFound = ref(true); // 示例状态
const isCustomerAssociated = ref(false); // 示例状态
const productRows = ref([{ productName: '', loanInfoCode: '' }]); // 初始一行数据
const formModal = ref({
  productName: [],
  loanInfoCode: []
});

// 添加新的空行
const addProductRow = () => {
  productRows.value.push({ productName: '', loanInfoCode: '' });
};

// 新增客户信息的函数
const addCustomer = (values) => {
  console.log(productRows.value);
  
  const selectedData = formModal.value.productName.map((productName) => {
    const loanCodes = formModal.value.loanInfoCode.filter((loanCode) =>
      workOrderLoans.value.some(
        (loan) => loan.productName === productName && loan.loanInfoCode === loanCode
      )
    );
    
    return {
      productName,
      loanInfoCode: loanCodes,
    };
  });

  const workOrderLoansTosend = [...selectedData, ...productRows.value];
  
  const params = {
    workOrderType: formModal.value.workOrderType,
    callType: formModal.value.callType,
    complainType: formModal.value.complainType,
    ident: formModal.value.ident,
    customerName: formModal.value.customerName,
    phoneNumber: formModal.value.phoneNumber,
    workOrderLoans: workOrderLoansTosend,
    customerProblem: formModal.value.customerProblem,
    customerAppeal: formModal.value.customerAppeal,
  };

  console.log(params, productRows);

  // 假设有一个 addWorkOrder 函数来处理添加工作订单请求
  addWorkOrder(params).then((response) => {
    if (response.success) {
      message.success(response.message);
    } else {
      message.error(response.message);
    }
  });
};
</script>

<style scoped>
.jiahao {
   cursor:pointer;
}
</style>