公司7004 1.标书台账页面开发与联调 2.客户管理添加客户类型字段

gaoluyang

4 天以前 f4a4737d69746268f3648effcf66e1c1c83e64e1

 src/views/basicData/customerFile/index.vue

@@ -92,25 +92,6 @@
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30" v-for="(contact, index) in formYYs.contactList" :key="index">
          <el-col :span="12">
            <el-form-item label="联系人：" prop="contactPerson">
              <el-input v-model="contact.contactPerson" placeholder="请输入" clearable  />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话：" prop="contactPhone">
              <div style="display: flex; align-items: center;width: 100%;">
                <el-input v-model="contact.contactPhone" placeholder="请输入" clearable />
                <el-button   @click="removeContact(index)" type="danger" circle style="margin-left: 5px;">
                  <el-icon><Close /></el-icon>
                </el-button>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-button @click="addNewContact" style="margin-bottom: 10px;">+ 新增联系人</el-button>

        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="银行基本户：" prop="basicBankAccount">
@@ -141,7 +122,38 @@
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户类型：" prop="customerType">
              <el-select
                v-model="form.customerType"
                placeholder="请选择"
                clearable
                style="width: 100%"
              >
                <el-option label="普通客户" :value="1" />
                <el-option label="中小客户" :value="2" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
            <el-row :gutter="30" v-for="(contact, index) in formYYs.contactList" :key="index">
               <el-col :span="12">
                  <el-form-item label="联系人：" prop="contactPerson">
                     <el-input v-model="contact.contactPerson" placeholder="请输入" clearable  />
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="联系电话：" prop="contactPhone">
                     <div style="display: flex; align-items: center;width: 100%;">
                        <el-input v-model="contact.contactPhone" placeholder="请输入" clearable />
                        <el-button   @click="removeContact(index)" type="danger" circle style="margin-left: 5px;">
                           <el-icon><Close /></el-icon>
                        </el-button>
                     </div>
                  </el-form-item>
               </el-col>
            </el-row>
            <el-button @click="addNewContact" style="margin-bottom: 10px;">+ 新增联系人</el-button>
        <el-row :gutter="30">
          <el-col :span="12">
            <el-form-item label="维护人：" prop="maintainer">
@@ -197,8 +209,11 @@
        :headers="upload.headers"
        :action="upload.url + '?updateSupport=' + upload.updateSupport"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :before-upload="upload.beforeUpload"
        :on-progress="upload.onProgress"
        :on-success="upload.onSuccess"
        :on-error="upload.onError"
        :on-change="upload.onChange"
        :auto-upload="false"
        drag
      >
@@ -207,13 +222,13 @@
        <template #tip>
          <div class="el-upload__tip text-center">
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link
              type="primary"
              :underline="false"
              style="font-size: 12px; vertical-align: baseline"
              @click="importTemplate"
              >下载模板</el-link
            >
<!--            <el-link-->
<!--              type="primary"-->
<!--              :underline="false"-->
<!--              style="font-size: 12px; vertical-align: baseline"-->
<!--              @click="importTemplate"-->
<!--              >下载模板</el-link-->
<!--            >-->
          </div>
        </template>
      </el-upload>
@@ -228,7 +243,7 @@
</template>

<script setup>
import { ref } from "vue";
import {onMounted, ref} from "vue";
import { Search } from "@element-plus/icons-vue";
import {
  addCustomer,
@@ -245,6 +260,22 @@
const userStore = useUserStore();

const tableColumn = ref([
   {
      label: "客户类型",
      prop: "customerType",
      width: 120,
      dataType: "tag",
      formatData: (value) => {
         if (String(value) === "1") return "普通客户";
         if (String(value) === "2") return "中小客户";
         return "";
      },
      formatType: (value) => {
         if (String(value) === "1") return "primary";
         if (String(value) === "2") return "success";
         return "info";
      },
   },
  {
    label: "客户名称",
    prop: "customerName",
@@ -340,6 +371,7 @@
  },
  form: {
    customerName: "",
    customerType: undefined,
    taxpayerIdentificationNumber: "",
    companyAddress: "",
    companyPhone: "",
@@ -353,6 +385,7 @@
  },
  rules: {
    customerName: [{ required: true, message: "请输入", trigger: "blur" }],
    customerType: [{ required: true, message: "请选择", trigger: "change" }],
    taxpayerIdentificationNumber: [
      { required: true, message: "请输入", trigger: "blur" },
    ],
@@ -380,6 +413,40 @@
  headers: { Authorization: "Bearer " + getToken() },
  // 上传的地址
  url: import.meta.env.VITE_APP_BASE_API + "/basic/customer/importData",
  // 文件上传前的回调
  beforeUpload: (file) => {
    console.log('文件即将上传', file);
    // 可以在此处做文件类型或大小校验
    const isValid = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || file.name.endsWith('.xlsx') || file.name.endsWith('.xls');
    if (!isValid) {
      proxy.$modal.msgError("只能上传 Excel 文件");
    }
    return isValid;
  },
  // 文件状态改变时的回调
  onChange: (file, fileList) => {
    console.log('文件状态改变', file, fileList);
  },
  // 文件上传成功时的回调
  onSuccess: (response, file, fileList) => {
    console.log('上传成功', response, file, fileList);
    if(response.code === 200){
      proxy.$modal.msgSuccess("文件上传成功");
    }else if(response.code === 500){
      proxy.$modal.msgError(response.msg);
    }else{
      proxy.$modal.msgWarning(response.msg);
    }
  },
  // 文件上传失败时的回调
  onError: (error, file, fileList) => {
    console.error('上传失败', error, file, fileList);
    proxy.$modal.msgError("文件上传失败");
  },
  // 文件上传进度回调
  onProgress: (event, file, fileList) => {
    console.log('上传中...', event.percent);
  }
});
const { searchForm, form, rules } = toRefs(data);
const addNewContact = () => {
@@ -482,6 +549,8 @@
};
// 提交修改
const submitEdit = () => {
   form.value.contactPerson = formYYs.value.contactList.map(item => item.contactPerson).join(",");
   form.value.contactPhone = formYYs.value.contactList.map(item => item.contactPhone).join(",");
  updateCustomer(form.value).then((res) => {
    proxy.$modal.msgSuccess("提交成功");
    closeDia();
@@ -552,7 +621,9 @@
  return `${year}-${month}-${day}`;
}

getList();
onMounted(() => {
   getList();
});
</script>

<style scoped lang="scss"></style>